#myHeader{

  height: 104px;background-color:rgba(0,0,0,0.0);width: 100%;position: fixed;margin-top: -20px;
}

#logo{

  position: relative;top: 20px;z-index: 1000
}

#app_lucky_number{

  position: relative;left: 95px;font-size: 30px 
}

#imagelogo{

 width: 234px;height: 37px;position: relative;top: 5px; 
}


#titlelogo{

  position: relative; font-size: 15px; color: #3679D4;bottom: 4px;width: 234px

}
#ul{
position: relative;top: 10px;right: 210px
}

#titre1{
 font-size: 19px;font-family: Poppins;color: #3679D4;text-decoration:underline;    font-weight: bold; 
}

#divtitre{
  background-color: white;border-radius: 5px;position: relative;right: 50px;width: 370px;height: 38px;box-shadow: 0px 1px 6px 2px #ccc;bottom: 3px
}

#titre11
{
  font-size: 19px;font-family: Poppins;color: #3679D4;text-decoration:underline;font-weight: bold;position: relative;right: 19px;top: 3px;
}

.logout{
  background-color: #00a7c2;border-radius: 8px;font-weight: bold;
}

.usernamelink{
  font-size: 19px;font-family: Poppins;color: #3679D4;font-weight: bold;
}

#spanusername{
  display: none;
}

#gp{
  font-size: 19px;font-family: Poppins;color: #3679D4;font-weight: bold;
}

#Capa_2{
  width:25px ;height:25px;position: relative;right: 5px;fill: #03989E;
}

#nomheader{
  font-size: 14px;white-space: nowrap;position: relative;bottom: 2px;
}

#showlist{
  width: 25px;height: 25px;position: relative;bottom: 3px
}

.showlist{
position: relative
}

.listmenu{
  font-family: poppins;font-size: 13px;color: black;white-space: nowrap;
}

.cta{
  display: none;
}
#btnlogout{
 display: none;
}
#titre3{

}
#cnx{
  color: white;border-radius: 5px;border: none;background-color: #00a7c2;width: 110px;height: 30px;
}

#pathcnx{
  color: white;
}

#Capa_1{
  width:16px ;height:16px;position: relative;right: 5px;fill: white
}

.conn{
  position: relative;right: 7px;font-weight: bold;font-size: 14px;font-family: Poppins
}
#inline-block{
  position: relative; top: 3px;
}

#myModal{
  background: rgb(6 6 6 / 0%) !important;
}

.modal-dialog{
position: relative;top: 70px
}

#modal-content{
  width: 80%;margin: auto;border-top: 5px solid #2f89fc;
}
#modalheader{
  height: 50px;
}
#titremodal{
  bottom: 5px;font-family: Poppins;
}

#changerpass{
font-family: poppins;font-size: 14px
}

#changerpassconfirme{
  font-family: poppins;font-size: 14px
}

.primarybtn{
  font-family: poppins;font-size: 14px;border-radius: 5px
}

.fotmodal{
  height: 50px
}

#mb5{
  margin-bottom: 1rem!important;
}

@media(max-width: 1000px) and (min-width: 320px){


          ul.liste {
             background-color: white;
      list-style: none;
      padding: 0;
      box-shadow: 0 0 3px rgb(0 0 0 /30%);
      border-radius: 7px;
      position: absolute;
      top: 100%;
      left: calc(50% - 51px);
      transform: translateX(-82%);
      transition: all .5s ease-in-out;
      }

      ul.liste::before {
            position: absolute;
    content: "";
    border-width: 7px;
    border-style: solid;
    border-color: transparent transparent white transparent;
    bottom: 99%;
    right: 5px;
      }

    ul.liste.show {
      visibility: visible;
      opacity: 1;
    }

    ul.liste.hide {
      visibility: hidden;
      opacity: 0;
    }

    ul.liste li a {
        color: black;
        padding: 5px 17px;
        transition: all .5s ease-in-out;
        width: 100%;
    }

    ul.liste li a:hover {
      background-color: #00a7c2;
      right: 20px;
    }

        #showlist{
        bottom: 36px !important;
       right: 70px !important;
       float: right !important;
      }
         #nomheader{
          top: 0px !important;
        }

          #voirp{

       top: -43px !important ;
       right: -34px !important; 
    }

         #divtitre{
          margin-bottom: 10px;
          box-shadow: none !important;
        }

        #btnlogout{
          position: relative;
      bottom: 50px;
      right: 7px;
    }

       #gp{
  font-size: 16px !important;
  }
     #svg1{
    left: 15px !important;
    top: 10px !important;
  }

      #svg2{
      left:  -11px !important;
    top: 17px !important;
  }
    #svg3{
    left: -3px !important;
    top: 15px !important;
  }

  #ul{
    right: 0 !important;
  }


 #titre1{
  font-size: 15px !important;
  
 }
  #titre11{
  margin-left: 50px !important;
  
 }

 #hum{
    
    color: #03989E !important;

  }

        #imagelogo{
             width: 200px !important;
             height: 28px !important;
        }
        #titlelogo{
          width: 219px !important;
          font-size: 13px !important;
        }

        
       #titre2{
        left: 0 !important;
       }

       #cnx{
        position: relative;
      
       }
        #Capa_1{
        right: 42px !important;
        bottom: 10px !important;
       }

       .conn{
        bottom: 36px;
        right: 0 !important;
       }
         .site-mobile-menu{
        height: 374px !important;
       }

   
       }
        @media(max-width: 1548px) and (min-width: 1400px){

         #titlelogo{
          width: 300px !important
         } 

        }

            @media(max-width: 350px) and (min-width: 320px){

         #logo{
        right: 26px !important ; 
       }

        }