@font-face {
    font-family: "Muli";
    src: url('Muli.ttf');
}
@font-face {
	font-family: "mona";
	src: url('Mona-Sans-Regular.ttf');
}

:root{
    --primary:#29c3be;
    --textColor:rgb(200,200,200);
}

body{
    font-family: Muli, "mona" ,-apple-system,Roboto, system-ui, Helvetica Neue, Helvetica, Roboto, Arial, sans-serif;
    height:100vh;
    margin:auto;
    text-align:center;
    background-size:cover;
	color:var(--textColor);
    
    background: #16222A;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to bottom, #0b1216, #16222A,rgb(18,28,41));  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to bottom, #0b1216,#0b1216); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background: linear-gradient(to right, white,#0b1216);
}

a{color:rgba(60,60,60,0.6);
    color: #448eef;
}
p{ font-size:14px;}
h1{ color:rgb(18,28,41)}
.titre2{ color:white}
.cont_imgBack{
    position: fixed;
    width:100%; z-index:99;
}
.cont_surBack{
    position: fixed;
    width:100%; height: 100vh;top:0px;
    z-index:999;
    background: rgba(200, 200, 200, 0.6);
    background-image: linear-gradient(to right, rgba(255,255,255,0), rgba(18,28,41,0.1),transparent);
    background-image: linear-gradient(to right,rgba(255,255,255,9), rgba(255,255,255,5), rgba(18,28,41,0.1),transparent);
}
.cont_surBack2{
    position: fixed;
    width:70%; height: 100vh;top:0px;right: 0px;
    z-index:999;
    background-image: linear-gradient(to left,rgba(255,255,255,9),rgba(18,28,41,0.1),  transparent,transparent);
}
.imgeBack{
    opacity:0.2; max-width:100%; height:100vh;max-height:100vh;overflow: hidden;
    padding: 0px;margin: 0px;
}
.cont_imgBack .imgeBack{
    width:100%;
}
.h_menu{

}
.h_menu li{
    display: inline-block;
    min-width:10%;
    padding: 12px 30px 12px 30px;
    text-align: center;
    background: white;
    border-radius: 100px;
    border-color: #999999;
    box-shadow: 0 2px 2px 0 rgb(153 153 153 / 14%), 0 3px 1px -2px rgb(153 153 153 / 20%), 0 1px 5px 0 rgb(153 153 153 / 12%);
   text-transform: uppercase;
}
.h_menu li i{
  margin-right:5px;
}
.liHover{
    cursor: pointer;
 }
  .hoverMenu{
     position:absolute;
     min-width:150px;
     top:40px;
     border-radius:5px;
     z-index:999999999;
     display:none;
     padding:24px;
     text-align: left;
     background:transparent;
  }  
  .hoverMenu li a{
     color:var(--header_primary_text);
  } 
 .liHover:hover .hoverMenu{
       display: block;
 }
 .liHover .hoverMenu li{ 
     margin-top: 0px; margin-bottom: 5px;
     padding-top:7px;
     padding-bottom: 7px;
     border-bottom: solid 1px rgb(245,245,245);
     display: block;
     font-size:13px;
     font-weight: 100;
 }
 .liHover .hoverMenu li a:hover{ 
    color:rgb(10,150,150);
 }


.titre1{ font-size:68px; line-height:19px;}
.titre3{ line-height:19px;}
.p_home{
    padding-bottom:18px;font-size:20px; line-height: 24px;
}

.cont_Btn_lien{
  display: block;
  padding: 0px;
}
.cont_Btn_lien li{
    display: inline-block; vertical-align: top;
    width:20%;max-width:20%; height: 120px; 
    margin-top: 20px;
    margin-left: 5px;margin-right: 5px;
    background-color: #00cc83; 
    border: 1px solid #00cc83;
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    padding: 20px 30px 15px 10px; /*top left bottom right*/
    border-radius: 3px;
    cursor: pointer;
    font-weight: 400;
    -webkit-transition-duration: 150ms;
    transition-duration: 150ms;
    -webkit-transition-property: color,background-color,border-color,box-shadow;
    transition-property: color,background-color,border-color,box-shadow;
    line-height: 26px;
}
.cont_Btn_lien li i{
    display: block; margin-bottom: 10px;
    font-size:48px;
}
.cont_Btn_lien li a{
    color:white;
}
.cont_Btn_lien li div{
    font-size:12px;
    line-height: 12px;
}
.btnLien{
      display: block;
      max-width: 60%;
      padding: 20px;
      background-color: #00cc83;
      margin-top: 10px;
}

.piedHome{
    position:fixed;
    width: 100%;
    bottom: 0px; left: 0px;
    z-index:99999999;
    background: darkslategray;
}
.piedHome .cont{
    width:60%; margin:auto;font-size:13px;font-weight:400;color:rgb(250,250,250);
    padding-bottom: 10px; padding-top: 5px;
    text-align: center;
}
.hommeFooter{
    position: fixed;
    width: 100%;
    z-index:99999999;
    bottom: 0px;
    text-align: center;
    color:white;
    padding-bottom:0px;
}
.hommeFooter img{
    height:25px; display: inline-block;
    vertical-align: middle;
}
@media screen and (min-width:769px)and (max-width:900px){
	
}


@media screen and (max-width:768px) {

    .imgeBack{ max-width:98%;}
    .cont_form {
        border:solid 0px rgb(245,245,245);
        margin-top:40px;
        width:90%;
        border-radius:15px;
        
        text-align:left;
    }
    .contenair{
        width:80%;margin:auto;
    }
    .logo{
        max-height:70px;
        max-width:60%
    } 
    .titre1{ font-size:48px; line-height:19px;}
    .p_home{
        padding-bottom:28px;font-size:16px;line-height: 18px;
        margin-bottom: 70px;
    }

    .contFond{width:80%;margin:auto; margin-top:70px;}
    .btnLien,.btnLien2{
       /* padding:10px 25px 10px 25px;*/
        width:50%;margin:auto;
      } 

      .footHomeForm{background: transparent;}
     .offMob{display: none;}

     .form .w60{
         width:70%;
     }
     .form .champ{
        background:rgba(225,225, 225,0.1);
        border:none;
        border-radius:5px;
        border-bottom: solid 1px rgba(230,230,230,0.6);
    }
    .champ i{
        font-size: 18px;
    }
    .piedHome{
      
        background:transparent;
    }
 }