fix menu

user/themes/lecampus/scss/theme/_header.scss

@@ -19,66 +19,6 @@ header{
         margin: auto;
       }
     }
-    &.dropmenu{
-      a{
-        padding: 10px;
-      }
-      & > ul{
-        @include inlineflex();
-        flex-wrap: nowrap;
-        & > li{
-          text-align: center;
-          max-width: 241px;
-          &>a{
-            white-space: nowrap;
-            line-height: 6rem;
-            border-top: 1px solid $light-blue;
-            border-bottom: 3px solid $green;
-
-          }
-          padding: 0 20px;
-          & > ul{
-            display: none;
-            margin-top: -1.5rem;
-            li{
-              background-color: white;
-              text-align: center;
-              a{
-                display: block;
-                padding: 10px;
-                position: relative;
-                &:before{
-                  content: "";
-                  position: absolute;
-                  width: 100%;
-                  height: 3px;
-                  bottom: 0;
-                  left: 0;
-                  background-color: $green;
-                  visibility: hidden;
-                  -webkit-transform: scaleX(0);
-                  transform: scaleX(0);
-                  transition: all 0.3s ease-in-out 0s;
-                }
-              }
-            }
-
-          }
-          &:hover{
-            & > ul{
-              display: block;
-              li:hover{
-                a:hover:before {
-                  visibility: visible;
-                  -webkit-transform: scaleX(1);
-                  transform: scaleX(1);
-                }
-              }
-            }
-          }
-        }
-      }
-    }
     .reso{
       @include inlineflex;
       flex-wrap: nowrap;

user/themes/lecampus/scss/theme/_menu.scss

@@ -0,0 +1,71 @@
+header{
+  nav{
+    &.dropmenu{
+      a{
+        padding: 10px;
+      }
+      & > ul{
+        @include inlineflex();
+        width: 100%;
+        -webkit-box-pack: center;
+            -ms-flex-pack: center;
+                justify-content: center;
+        -webkit-box-align: center;
+            -ms-flex-align: center;
+                align-items: center;
+        & > li{
+          text-align: center;
+          position: relative;
+          margin: 0 20px;
+          &>a{
+            border-top: 1px solid $light-blue;
+            border-bottom: 3px solid $green;
+
+          }
+          & > ul{
+            display: none;
+            width: 100%;
+            position: absolute;
+            margin-top: 12px;
+            z-index: 0;
+            li{
+              background-color: white;
+              a{
+                display: block;
+                padding: 10px;
+                position: relative;
+                &:before{
+                  content: "";
+                  position: absolute;
+                  width: 100%;
+                  height: 3px;
+                  bottom: 0;
+                  left: 0;
+                  background-color: $green;
+                  visibility: hidden;
+                  -webkit-transform: scaleX(0);
+                          transform: scaleX(0);
+                  -webkit-transition: all 0.3s ease-in-out 0s;
+                  transition: all 0.3s ease-in-out 0s;
+                }
+              }
+            }
+
+          }
+          &:hover{
+            & > ul{
+              display: block;
+              li:hover{
+                a:hover:before {
+                  visibility: visible;
+                  -webkit-transform: scaleX(1);
+                          transform: scaleX(1);
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}

user/themes/lecampus/scss/theme/_mobile.scss

@@ -27,11 +27,19 @@
       width: auto!important;
       height: auto;
       &>ul{
-        flex-direction: column!important;
+        -webkit-box-orient: vertical!important;
+        -webkit-box-direction: normal!important;
+            -ms-flex-direction: column!important;
+                flex-direction: column!important;
+        -webkit-box-align: start;
+            -ms-flex-align: start;
+                align-items: flex-start;
         &>li{
           text-align: left;
+          padding: 0 20px;
           &>ul{
             margin: auto;
+            position: relative;
             &>li{
               text-align: left;
               margin-left: 10px;
@@ -248,9 +256,10 @@
 
   #item{
     .content{
-      // width: 80%!important;
+
       .icones{
-        flex-wrap: nowrap!important;
+        -ms-flex-wrap: nowrap!important;
+            flex-wrap: nowrap!important;
       }
     }
   }
@@ -260,6 +269,8 @@
     width: 300px!important;
     height: 110px!important;
     a{
+      display: -webkit-inline-box!important;
+      display: -ms-inline-flexbox!important;
       display: inline-flex!important;
     }
     p:nth-of-type(2){
@@ -285,230 +296,6 @@
 }
 
 @media screen and (max-width: 960px) {
-  // header nav{
-  //   position: relative;
-  //   width: 90%;
-  //   .dropmenu{
-  //     background: white;
-  //     display: none;
-  //     position: absolute;
-  //     left: -6%;
-  //     top: 100px;
-  //     width: auto!important;
-  //     height: auto;
-  //     &>ul{
-  //       flex-direction: column!important;
-  //       &>li{
-  //         text-align: left;
-  //         &>ul{
-  //           margin: auto;
-  //           &>li{
-  //             text-align: left;
-  //             margin-left: 10px;
-  //             a{
-  //               font-family: $Regular;
-  //             }
-  //           }
-  //         }
-  //         &> a{
-  //           border: none;
-  //           line-height: 2rem;
-  //         }
-  //       }
-  //     }
-  //     &.active{
-  //       display: block;
-  //
-  //     }
-  //   }
-  //   .logo{
-  //     margin: auto;
-  //   }
-  //   .navTrigger {
-  //     cursor: pointer;
-  //     width: 30px;
-  //     height: 25px;
-  //     margin: auto 0;
-  //     left: 0;
-  //     top: 0;
-  //     bottom: 0;
-  //   }
-  //   .navTrigger i {
-  //     background-color: $light-blue;
-  //     border-radius: 2px;
-  //     content: '';
-  //     display: block;
-  //     width: 100%;
-  //     height: 4px;
-  //   }
-  //   .navTrigger i:nth-child(1) {
-  //     -webkit-animation: outT 0.8s backwards;
-  //     animation: outT 0.8s backwards;
-  //     -webkit-animation-direction: reverse;
-  //     animation-direction: reverse;
-  //   }
-  //   .navTrigger i:nth-child(2) {
-  //     margin: 5px 0;
-  //     -webkit-animation: outM 0.8s backwards;
-  //     animation: outM 0.8s backwards;
-  //     -webkit-animation-direction: reverse;
-  //     animation-direction: reverse;
-  //   }
-  //   .navTrigger i:nth-child(3) {
-  //     -webkit-animation: outBtm 0.8s backwards;
-  //     animation: outBtm 0.8s backwards;
-  //     -webkit-animation-direction: reverse;
-  //     animation-direction: reverse;
-  //   }
-  //   .navTrigger.active i:nth-child(1) {
-  //     -webkit-animation: inT 0.8s forwards;
-  //     animation: inT 0.8s forwards;
-  //   }
-  //   .navTrigger.active i:nth-child(2) {
-  //     -webkit-animation: inM 0.8s forwards;
-  //     animation: inM 0.8s forwards;
-  //   }
-  //   .navTrigger.active i:nth-child(3) {
-  //     -webkit-animation: inBtm 0.8s forwards;
-  //     animation: inBtm 0.8s forwards;
-  //   }
-  //   @-webkit-keyframes inM {
-  //     50% {
-  //       -webkit-transform: rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: rotate(45deg);
-  //     }
-  //   }
-  //   @keyframes inM {
-  //     50% {
-  //       -webkit-transform: rotate(0deg);
-  //               transform: rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: rotate(45deg);
-  //               transform: rotate(45deg);
-  //     }
-  //   }
-  //   @-webkit-keyframes outM {
-  //     50% {
-  //       -webkit-transform: rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: rotate(45deg);
-  //     }
-  //   }
-  //   @keyframes outM {
-  //     50% {
-  //       -webkit-transform: rotate(0deg);
-  //               transform: rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: rotate(45deg);
-  //               transform: rotate(45deg);
-  //     }
-  //   }
-  //   @-webkit-keyframes inT {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(9px) rotate(135deg);
-  //     }
-  //   }
-  //   @keyframes inT {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //               transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(9px) rotate(0deg);
-  //               transform: translateY(9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(9px) rotate(135deg);
-  //               transform: translateY(9px) rotate(135deg);
-  //     }
-  //   }
-  //   @-webkit-keyframes outT {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(9px) rotate(135deg);
-  //     }
-  //   }
-  //   @keyframes outT {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //               transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(9px) rotate(0deg);
-  //               transform: translateY(9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(9px) rotate(135deg);
-  //               transform: translateY(9px) rotate(135deg);
-  //     }
-  //   }
-  //   @-webkit-keyframes inBtm {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(-9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(-9px) rotate(135deg);
-  //     }
-  //   }
-  //   @keyframes inBtm {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //               transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(-9px) rotate(0deg);
-  //               transform: translateY(-9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(-9px) rotate(135deg);
-  //               transform: translateY(-9px) rotate(135deg);
-  //     }
-  //   }
-  //   @-webkit-keyframes outBtm {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(-9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(-9px) rotate(135deg);
-  //     }
-  //   }
-  //   @keyframes outBtm {
-  //     0% {
-  //       -webkit-transform: translateY(0px) rotate(0deg);
-  //               transform: translateY(0px) rotate(0deg);
-  //     }
-  //     50% {
-  //       -webkit-transform: translateY(-9px) rotate(0deg);
-  //               transform: translateY(-9px) rotate(0deg);
-  //     }
-  //     100% {
-  //       -webkit-transform: translateY(-9px) rotate(135deg);
-  //               transform: translateY(-9px) rotate(135deg);
-  //     }
-  //   }
-  // }
   .gal{
     .title_gal{
       max-width: 80%!important;
@@ -572,11 +359,6 @@
       height: auto!important;
       min-height: 200px!important;
     }
-    .demander-votre-devis{
-      // -webkit-transform: translate(0, -50%)!important;
-      //         transform: translate(0, -50%)!important;
-
-    }
   }
 
   #devis.item .title, #devis.sublog .title{
@@ -599,8 +381,12 @@
       -webkit-transform: translateX(-50%);
               transform: translateX(-50%);
       .header-salles{
+        display: -webkit-inline-box;
+        display: -ms-inline-flexbox;
         display: inline-flex;
-        justify-content: space-between;
+        -webkit-box-pack: justify;
+            -ms-flex-pack: justify;
+                justify-content: space-between;
         img{
           display: block!important;
           margin: auto;
@@ -618,6 +404,8 @@
     width: 300px!important;
     height: 110px!important;
     a{
+      display: -webkit-inline-box!important;
+      display: -ms-inline-flexbox!important;
       display: inline-flex!important;
     }
     p:nth-of-type(2){
@@ -632,6 +420,8 @@
     width: 300px!important;
     height: 110px!important;
     a{
+      display: -webkit-inline-box!important;
+      display: -ms-inline-flexbox!important;
       display: inline-flex!important;
     }
     p:nth-of-type(2){
@@ -665,8 +455,6 @@
       content: '';
       background-image: url(/user/themes/lecampus/images/Trame-bleu2.svg);
       background-repeat: repeat;
-      // background-position: center;
-      // background-size: cover;
       position: absolute;
       top: 0;
       margin-left: -27vw;
@@ -789,7 +577,8 @@
       }
     }
     .demander-votre-devis{
-      transform: translate(0%,-120%)!important;
+      -webkit-transform: translate(0%,-120%)!important;
+              transform: translate(0%,-120%)!important;
     }
   }
   #newsletter{
@@ -798,7 +587,10 @@
       width: 280px!important;
       padding: 0!important;
       #mc_embed_signup_scroll{
-        flex-direction: column;
+        -webkit-box-orient: vertical;
+        -webkit-box-direction: normal;
+            -ms-flex-direction: column;
+                flex-direction: column;
         input{
           width: 280px!important;
         }
@@ -823,7 +615,10 @@
     }
   }
   #footer .block{
-    flex-direction: column;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
     p{
       margin-bottom: 10px;
       text-align: center;
@@ -875,11 +670,17 @@
     width: 100%!important;
   }
   .start:not(#form) .body-wrapper .event .card-content{
-    flex-direction: column;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
     .reso{
       width: 100%!important;
+      display: -webkit-box;
+      display: -ms-flexbox;
       display: flex;
-      justify-content: space-around;
+      -ms-flex-pack: distribute;
+          justify-content: space-around;
     }
     .txt{
       width: 100%!important;