diff --git a/css/customizedcss.css b/css/customizedcss.css
new file mode 100644
index 0000000000000000000000000000000000000000..633422766327e5a6d5e15762d7df0c77055b2f38
--- /dev/null
+++ b/css/customizedcss.css
@@ -0,0 +1,182 @@
+*{
+  font-family: 'Ubuntu', sans-serif; !important
+  }
+body {
+  padding-bottom: 40px;
+   background-color:#D5D5D5;
+}
+.btn,input,span{
+  border-radius: 0px;
+}
+/*** CUSTOMIZE THE NAVBAR **/
+
+li{
+border-right: 1px solid #bbb;
+}
+ul{
+    position: fixed;
+    z-index: 999;
+    top: 0px;
+    width: 100%;
+}
+ul.nav {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+    background-color: #333;
+}
+
+ul.nav li {float: left;}
+
+ul.nav li a {
+    display: block;
+    color: white;
+    text-align: center;
+    padding: 14px 16px;
+    text-decoration: none;
+}
+
+ul.nav li a:hover:not(.active) {background-color: #111;}
+
+ul.nav li a.active {background-color: #4caba7;}
+
+ul.nav li.right {float: right;}
+
+@media screen and (max-width: 600px){
+    ul.nav li.right, 
+    ul.nav li {float: none;}
+}
+
+/* CUSTOMIZE THE CAROUSEL
+-------------------------------------------------- */
+
+.carousel {
+  margin-bottom: 10px;
+}
+
+.carousel-control {
+  top: 76%;
+}
+
+.carousel-caption {
+  z-index: 10;
+}
+
+.carousel .item {
+  height: 500px;
+  background-color:#bbb;
+  overflow:hidden;
+}
+.carousel img {
+  position: absolute;
+  top: 0;
+  left: 0;
+  min-width: 100%;
+  height: 500px;
+}
+.right.carousel-control, .left.carousel-control {
+    display: none;
+}
+#formConnexion{
+  position:absolute;
+  top:40%;
+}
+
+@media (max-width: 768px) {
+
+  .carousel-inner>.item>img, .carousel-inner>.item>a>img {
+  	max-width:inherit;
+  }
+
+  .carousel-caption p {
+    margin-bottom: 20px;
+    font-size: 21px;
+    line-height: 1.4;
+  }
+}
+
+
+/** THUMBNAIL **/
+
+.lead { padding: 40px 0; }
+
+.wrap{
+  word-wrap:break-word;
+}
+
+/* Modal customize */
+.modal-content{
+    -webkit-border-radius: 0px !important;
+    -moz-border-radius: 0px !important;
+    border-radius: 0px !important; 
+} 
+
+.modal {
+  text-align: center;
+}
+
+@media screen and (min-width: 768px) { 
+  .modal:before {
+    display: inline-block;
+    vertical-align: middle;
+    content: " ";
+    height: 100%;
+  }
+}
+.modal-backdrop {
+  background-color: transparent;
+}
+.modal-dialog {
+  display: inline-block;
+  text-align: left;
+  vertical-align: middle;
+}
+/** .con customize **/
+ .con{
+  width:80%;
+  color: #34404e;
+  position: relative;
+  top:-10px;
+  overflow: auto;
+  padding:20px;
+  background-color: #7accca;
+  margin-bottom: 10px;
+}
+.con:nth-of-type(odd) {
+    background:#4caba7 ;
+}
+
+
+.con h2{
+    font-size: 400%;
+}
+.con p{
+  margin-left:20%;
+  margin-right: 5%;
+  word-break: break-all;
+}
+.con table{
+  margin-bottom: 20px;
+}
+.con td{
+  word-break: break-all;
+}
+
+.like-container{
+  height: 30px;
+}
+
+/** Adding a theme film see:formTheme.php  **/
+.film{
+  width:100%;
+}
+.theme-form{
+  position: relative; 
+  top:60px;
+  width:70%;
+  background-color: #4caba7;
+}
+.theme-form small{
+  color:#e55f56 ;
+}