diff --git a/usr/assets/css/cons-dir.css b/usr/assets/css/cons-dir.css
index 8232a95..fcd3079 100644
--- a/usr/assets/css/cons-dir.css
+++ b/usr/assets/css/cons-dir.css
@@ -1,19 +1,3 @@
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-    url('../img/background.jpg');
-  background-position: center 20%;
-}
-
-@media only screen and (min-width: 1921px) {
-  body {
-    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-      url('../img/background4K.jpg'),
-      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
-    background-position: center;
-    background-repeat: no-repeat;
-  }
-}
-
 .wrapper {
   z-index: 1;
   width: 60vw;
diff --git a/usr/assets/css/despre.css b/usr/assets/css/despre.css
index a2ef403..2e7e9a7 100644
--- a/usr/assets/css/despre.css
+++ b/usr/assets/css/despre.css
@@ -1,19 +1,3 @@
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-    url('../img/background.jpg');
-  background-position: center 20%;
-}
-
-@media only screen and (min-width: 1921px) {
-  body {
-    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-      url('../img/background4K.jpg'),
-      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
-    background-position: center;
-    background-repeat: no-repeat;
-  }
-}
-
 main {
   justify-content: space-between;
 }
diff --git a/usr/assets/css/front-page.css b/usr/assets/css/front-page.css
index c650add..9b3faac 100644
--- a/usr/assets/css/front-page.css
+++ b/usr/assets/css/front-page.css
@@ -1,19 +1,3 @@
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-    url('../img/background.jpg');
-  background-position: center 20%;
-}
-
-@media only screen and (min-width: 1921px) {
-  body {
-    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-      url('../img/background4K.jpg'),
-      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
-    background-position: center;
-    background-repeat: no-repeat;
-  }
-}
-
 main {
   flex-direction: column;
 }
diff --git a/usr/assets/css/index.css b/usr/assets/css/index.css
index 33d7c7e..8c9ec57 100644
--- a/usr/assets/css/index.css
+++ b/usr/assets/css/index.css
@@ -1,19 +1,3 @@
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-    url('../img/background.jpg');
-  background-position: center 20%;
-}
-
-@media only screen and (min-width: 1921px) {
-  body {
-    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-      url('../img/background4K.jpg'),
-      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
-    background-position: center;
-    background-repeat: no-repeat;
-  }
-}
-
 .textbox {
   width: 80vw;
 }
diff --git a/usr/assets/css/prez-pers.css b/usr/assets/css/prez-pers.css
index 0d61808..2d89ff6 100644
--- a/usr/assets/css/prez-pers.css
+++ b/usr/assets/css/prez-pers.css
@@ -1,19 +1,3 @@
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-    url('../img/background.jpg');
-  background-position: center 20%;
-}
-
-@media only screen and (min-width: 1921px) {
-  body {
-    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-      url('../img/background4K.jpg'),
-      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
-    background-position: center;
-    background-repeat: no-repeat;
-  }
-}
-
 main {
   justify-content: space-between;
 }
diff --git a/usr/assets/css/proiecte.css b/usr/assets/css/proiecte.css
new file mode 100644
index 0000000..8362b78
--- /dev/null
+++ b/usr/assets/css/proiecte.css
@@ -0,0 +1,110 @@
+.textbox {
+  width: 80vw;
+}
+
+.textbox>* {
+  width: 100% !important;
+}
+
+.hero-title {
+  text-align: center;
+}
+
+.proiecte-cell {
+  width: 100%;
+}
+
+.proiecte-cell.is-selected {
+  opacity: 1;
+}
+
+.proiecte-cell:not(.is-selected) {
+  opacity: 0;
+}
+
+.content-wrapper {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.content-wrapper>* {
+  flex-basis: 50%;
+}
+
+.proiecte-carousel .flickity-page-dots {
+  bottom: 0;
+}
+
+.proiecte-carousel .flickity-page-dots .dot {
+  background: var(--text-color);
+}
+
+.content-wrapper .img-content {
+  display: grid;
+  place-items: center;
+}
+
+.img-carousel {
+  width: 70%;
+}
+
+.img-carousel .flickity-prev-next-button {
+  width: 2rem;
+  height: 2rem;
+}
+
+.img-cell {
+  width: 100%;
+}
+
+.btn-primary {
+  margin: 30px 0;
+}
+
+@media only screen and (min-width: 2100px) {
+  .flickity-prev-next-button.next {
+    right: -60px;
+  }
+
+  .flickity-prev-next-button.previous {
+    left: -60px;
+  }
+
+  .btn-primary {
+    width: 250px;
+  }
+}
+
+@media only screen and (min-width: 3500px) {
+  .flickity-prev-next-button.next {
+    right: -80px;
+  }
+
+  .flickity-prev-next-button.previous {
+    left: -80px;
+  }
+
+  .btn-primary {
+    width: 300px;
+  }
+}
+
+@media only screen and (max-width: 950px) {
+  .content-wrapper {
+    flex-direction: column;
+  }
+
+  .img-content {
+    width: 100%;
+    margin-top: 30px;
+  }
+}
+
+@media only screen and (max-width: 730px) {
+  .textbox {
+    margin: 0;
+    flex-grow: 2;
+    justify-content: flex-start;
+  }
+}
\ No newline at end of file
diff --git a/usr/assets/css/statut.css b/usr/assets/css/statut.css
index f97a7ba..790bfb0 100644
--- a/usr/assets/css/statut.css
+++ b/usr/assets/css/statut.css
@@ -1,19 +1,3 @@
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-    url('../img/background.jpg');
-  background-position: center 20%;
-}
-
-@media only screen and (min-width: 1921px) {
-  body {
-    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-      url('../img/background4K.jpg'),
-      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
-    background-position: center;
-    background-repeat: no-repeat;
-  }
-}
-
 main {
   justify-content: space-between;
   overflow-x: hidden;
diff --git a/usr/assets/css/structura.css b/usr/assets/css/structura.css
index adb04b6..2897b18 100644
--- a/usr/assets/css/structura.css
+++ b/usr/assets/css/structura.css
@@ -1,19 +1,3 @@
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-    url('../img/background.jpg');
-  background-position: center 20%;
-}
-
-@media only screen and (min-width: 1921px) {
-  body {
-    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
-      url('../img/background4K.jpg'),
-      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
-    background-position: center;
-    background-repeat: no-repeat;
-  }
-}
-
 .wrapper {
   z-index: 1;
   width: 60vw;
diff --git a/usr/functions.php b/usr/functions.php
index 49281d1..06e0386 100644
--- a/usr/functions.php
+++ b/usr/functions.php
@@ -43,6 +43,9 @@ function usr_enqueue_style() {
     else if(is_page('statut')){
         wp_enqueue_style('statut', get_template_directory_uri() . '/assets/css/statut.css', array('purecss', 'main'));
     }
+    else if(is_page('proiecte')){
+        wp_enqueue_style('proiecte', get_template_directory_uri() . '/assets/css/proiecte.css', array('purecss', 'main', 'flickity'));
+    }
     else if(is_page_template('page-templates/prez-pers.php')){
         wp_enqueue_style('prez-pers', get_template_directory_uri() . '/assets/css/prez-pers.css', array('purecss', 'main', 'flickity'));
     }
diff --git a/usr/page-proiecte.php b/usr/page-proiecte.php
index c0b107e..a13f017 100644
--- a/usr/page-proiecte.php
+++ b/usr/page-proiecte.php
@@ -1,11 +1,79 @@
 <?php get_header() ?>
 
-<main>
+<main class="textbox">
     <h1 class="hero-title"><?php the_title(); ?></h1>
-    <p class="hero-text">
-      Projecte
-    </p>
 
-  </main>
+      <div class="proiecte-carousel carousel"
+          data-flickity='{
+            "imagesLoaded": true,
+            "pageDots": true,
+            "wrapAround": true,
+            "autoPlay": true,
+            "prevNextButtons": false
+          }'>
+        
+          <!-- <div class="carousel-cell">1</div> -->
+
+          <div class="proiecte-cell carousel-cell">
+            <div class="content-wrapper">
+              <div class="text-content">
+                <h2>Academia de Training USR</h2>
+                <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Illum quae culpa voluptatum, ipsum voluptate magnam! Ea illum quis voluptatum exercitationem autem doloribus omnis fugiat eaque quam dolore necessitatibus assumenda molestiae eum odio eligendi, rerum deleniti temporibus aut consequatur sed fuga. Fuga maiores at minima repudiandae eligendi sequi quia dolorum dignissimos.</p>
+              </div>
+
+              <div class="img-content">
+                <div class="img-carousel carousel" 
+                data-flickity='{
+                  "imagesLoaded": true,
+                  "wrapAround": true,
+                  "autoPlay": true,
+                  "pageDots": false,
+                  "draggable": false
+                }'>
+                  <img class="carousel-cell img-cell" src="https://picsum.photos/500/350?random=6" alt="Poza Test">
+                  <img class="carousel-cell img-cell" src="https://picsum.photos/500/350?random=7" alt="Poza Test">
+                  <img class="carousel-cell img-cell" src="https://picsum.photos/500/350?random=8" alt="Poza Test">
+                </div>
+              </div>
+            </div>
+
+            <button class="btn-primary"><a href="#">Vezi editiile trecute</a></button>
+          </div>
+
+          <div class="proiecte-cell carousel-cell">
+            <div class="content-wrapper">
+              <div class="text-content">
+                <h2>Alt Proiect USR</h2>
+                <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Illum quae culpa voluptatum, ipsum voluptate magnam! Ea illum quis voluptatum exercitationem autem doloribus omnis fugiat eaque quam dolore necessitatibus assumenda molestiae eum odio eligendi, rerum deleniti temporibus aut consequatur sed fuga. Fuga maiores at minima repudiandae eligendi sequi quia dolorum dignissimos.</p>
+              </div>
+
+              <div class="img-content">
+                <div class="img-carousel carousel" 
+                data-flickity='{
+                  "imagesLoaded": true,
+                  "wrapAround": true,
+                  "autoPlay": true,
+                  "pageDots": false,
+                  "draggable": false
+                }'>
+                  <img class="carousel-cell img-cell" src="https://picsum.photos/500/350?random=2" alt="Poza Test">
+                  <img class="carousel-cell img-cell" src="https://picsum.photos/500/350?random=3" alt="Poza Test">
+                  <img class="carousel-cell img-cell" src="https://picsum.photos/500/350?random=4" alt="Poza Test">
+                </div>
+              </div>
+            </div>
+
+            <button class="btn-primary"><a href="#">Vezi editiile trecute</a></button>
+          </div>
+
+      </div>
+
+      
+
+      
+</main>
+
+<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
+<script src="https://unpkg.com/flickity-fullscreen@1/fullscreen.js"></script>
 
 <?php get_footer() ?>
\ No newline at end of file
diff --git a/usr/style.css b/usr/style.css
index 00853be..1b64a42 100644
--- a/usr/style.css
+++ b/usr/style.css
@@ -52,6 +52,20 @@ body {
   display: flex;
   flex-direction: column;
   align-items: center;
+
+  background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
+    url('assets/img/background.jpg');
+  background-position: center 20%;
+}
+
+@media only screen and (min-width: 1921px) {
+  body {
+    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
+      url('assets/img/background4k.jpg'),
+      linear-gradient(0deg, rgba(11, 39, 75, 1) 0%, rgba(7, 58, 121, 1) 100%);
+    background-position: center;
+    background-repeat: no-repeat;
+  }
 }
 
 main {
@@ -70,6 +84,25 @@ main {
   }
 }
 
+.btn-primary {
+  background: var(--primary-color);
+  border: none;
+  border-radius: 15px;
+  height: 2.5rem;
+  line-height: 2.5rem;
+  width: 200px;
+  text-align: center;
+}
+
+.btn-primary a {
+  display: block;
+  width: 100%;
+  height: 100%;
+  text-decoration: none;
+  position: relative;
+  top: -2px;
+}
+
 /* FLICKITY RULES */
 .flickity-button-icon {
   fill: #333 !important;