@media only screen and (min-width:600px){
	.menu_burger{
		display: none;
	}
}





.aHumburger:hover{
	text-decoration: none;
  color:white;
}
    
@media only screen and (max-width:768px){

  #menuToggle .header-menu h1{
    font-size: 15px;
    color: white;
  }
  
  #menuToggle .logoImage .title{
    color: #fff;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: 900;
  }
  
  #menuToggle .header-menu .title span{
    color: #4CCEE8 !important;
  }

  .menuChevron.rotate{
    transform: rotate(-270deg);
    transition: transform .4s;
  }
	
	.menu_burger{
    position: fixed;
    display: block;
    height: 60px;
    top: 0;
    z-index: 100;
    width: 100%;
    background-color: var(--violet);
  }

  #span{
    height: 64px;
  }

  .navHumburger .logoImage {
    top: 0;
    left: 50vw;
    transform: translate(-50%);
    z-index: 150;
    height: 70px;
  }

  #imgSociety{
    right: 10px;
    top: 9px;
    width: 42px;
    height: auto;
  }

  .menu_burger .navHumburger{
    height: 60px;
  }
	
  .title_Burger{
    margin:0;
    text-align: center;
    font-family: lato;
    font-weight: bold;
    padding-top:15px;
    color:white;
    font-size: 3.8vh;
  }
	
	.paddingP{
		padding-top:20px;
	}
	
    
  .aHumburger, .containerSkills p
  {
    text-decoration: none;
    color: white;
    text-transform: uppercase;

  }

  .aHumburger:hover
  {
    font-weight: bold;
    text-decoration: none;
  }

  #menu a p{
    color: white;
    text-decoration: none;
  }

  #menuToggle
  {
    display: block;
    position: relative;
    z-index: 51;
    padding-left:13px;
    height: 70px;
    -webkit-user-select: none;
    user-select: none;
    z-index: 150;
  }

  #menuToggle .imgSociety{
    top: 0;
    right: 13px;
    height: 60px;
    z-index: 150;
  }

  #menuToggle #input
  {
    display: block;
    width: 100%;
    height: 56px;
    position: absolute;
    top: -7px;
    left: -5px;

    cursor: pointer;

    opacity: 0; 
    z-index: 25;  


  }

  #menuToggle input[type="checkbox"]{
    -webkit-touch-callout: none;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
  }

  #menuToggle span{
    color: var(--white);
  }

  
  #menuToggle span.cross
  {
    display: block;
    width: 33px;
    height: 4px;
    position: relative;

    border-radius: 3px;
    background: var(--white);
    z-index: 10;

    transform-origin: 0px 0px;

    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                opacity 0.55s ease;
    position: relative;
    z-index: 20;
    margin-top: 4px;
  }

  #menuToggle span:first-child
  {
    transform-origin: 0% 0%;
  }

  #menuToggle span:nth-last-child(2)
  {
    transform-origin: 0% 100%;
  }

  
  #menuToggle input:checked ~ #span #spanOne
  {
    opacity: 1;
    transform: rotate(45deg) translate(1px, -1px);
    background: white;
  }

  
  #menuToggle input:checked ~ #span .boldMenu
  {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
  }

  #menuToggle input:checked ~ #span #spanTwo
  {
    transform: rotate(-45deg) translate(0, -3px);
    background: var(--white);
  }

  #menuToggle .boldMenu{
      font-size: 10px;
      margin: 3px 3px 0px;
  }

  #menu
  {
    position: absolute;
    width: 100%;    
    padding-top: 60px;
    height: 100vh;

    background-image: url(../_img/montre_menu_resp.jpg);
    background-position: 50%;
    list-style-type: none;
    -webkit-font-smoothing: antialiased;

    transform-origin: 0% 0%;
    transform: translate( -100%, 0 );

    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    top: 0;
    left: 0;
    overflow-y: auto;
    background: rgba(15, 27, 56,1);
  }

  #menu .menu_overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 101vh;
    background: rgba(17,17,17,0.85);
  }

  #menu div{
    position: relative;
    z-index: 10;
  }

  #menuToggle input:checked ~ ul
  {
    transform: none;
    width: 100vw;
  }

  #menuToggle #menu .spacer img{
    width: 30px;
    height: auto;
    margin: 0 20px;
  }

  #menuToggle #menu #li .first{
      margin-top: 15px;
  }

  #menuToggle #menu #li  *{
    color: var(--white);
    font-weight: bold;
    font-size: 23px;
    line-height: 35px;
  }

  #menuToggle #menu #li .second a{
    margin-left: 20px;
    font-size: 20px;
  }

  #menuToggle #menu #li div img{
    width: 25px;
    height: auto;
    margin-top: 13px;
    transition: transform .4s;
  }

  #menuToggle #menu #li div img.rotate{
    transform: rotate(-270deg);
  }

}