.full-mobile-menu
{
    height: 100%;
    position: fixed;
    width: 200vw;
    top: -150%;
    z-index: 990;
	-webkit-transition-property: top, bottom;
        -webkit-transition-duration: 0.9s;
        display: inherit;
		display: none;
		right: 0%;
		
}
	.navigation-mobile
    {
        height: 100vh;
        background-color: rgba(0,0,0,0.75);
        position: relative;
        width: 100vw;
        z-index: 990; 
        -webkit-transition-property: top, bottom;
        -webkit-transition-duration: 0.9s;
        display: table-cell;
		    vertical-align: top;
    }
	
	.navigation-mobile-main
    {
        height: 100vh;
        background-color: rgba(0,0,0,0.75);
        position: relative;
        width: 100vw;
        z-index: 990; 
        -webkit-transition-property: right, top, bottom;
        -webkit-transition-duration: 0.9s;
        display: table-cell;
		    vertical-align: top;
    }
	
	.navigation-mobile-main ul li a,
	.navigation-mobile-main ul li p
	{
		font-size: 3.5vw;
		color: white;
		font-family: "fff_tusjbold";
		width: 100%;
		margin: 0;
		padding: 0;
		padding-bottom: 4%;
		text-transform: uppercase; 
		letter-spacing: 4px;
	}
	
	.navigation-mobile-main.traiteur ul li .active{color: #CD0028;}
	.navigation-mobile-main.poissonnerie ul li .active{color: #CD0028;}
	.navigation-mobile-main.boucherie ul li .active{color: #CD0028;}
	
	/*
    
	*/

    

        .full-mobile-menu.open.main, 
        .full-mobile-menu.main 
		{
			    right: -100%;
				-webkit-transition-property: right, top, bottom;
				-webkit-transition-duration: 0.9s;
		}
		
		.full-mobile-menu.open
        {
            top: 0%;
			-webkit-transition-property: right, top, bottom;
			-webkit-transition-duration: 0.9s;
        }
		
		.navigation-mobile-main.open
        {
            top: -150%;
        }
	
	
	
	
	.navigation-mobile ul, 
	.navigation-mobile-main ul 
	{
		 padding-top: 150px;
	}
	
	.navigation-mobile ul li a,
	.navigation-mobile ul li p
	{
	font-size: 3.5vw;
		color: white;
		font-family: "fff_tusjbold";
		width: 100%;
		margin: 0;
		padding: 0;
		padding-bottom: 4%;
		text-transform: uppercase; 
		letter-spacing: 4px;
	}


    

        




.c-hamburger {
  display: block;
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 0;
  width: 45px;
  height: 65px;
  font-size: 0;
  text-indent: -9999px;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  border: none;
  cursor: pointer;
  transition: background 0.3s;
}

.c-hamburger:focus {
  outline: none;
}

.c-hamburger span {
display: block;
    position: absolute;
    top: 31px;
    left: 10px;
    right: 11px;
    height: 3px;
    background: white;
}

.c-hamburger span::before,
.c-hamburger span::after {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #fff;
  content: "";
}

.c-hamburger span::before {
  top: -9px;
}

.c-hamburger span::after {
  bottom: -9px;
}



.c-hamburger--htx span {
  transition: background 0s 0.3s;
}

.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
  transition-duration: 0.3s, 0.3s;
  transition-delay: 0.3s, 0s;
}

.c-hamburger--htx span::before {
  transition-property: top, transform;
}

.c-hamburger--htx span::after {
  transition-property: bottom, transform;
}

/* active state, i.e. menu open */
.c-hamburger--htx.is-active {
  background-color: #CD0028;
}

.c-hamburger--htx.is-active span {
  background: none;
}

.c-hamburger--htx.is-active span::before {
  top: 0;
  transform: rotate(45deg);
}

.c-hamburger--htx.is-active span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
  transition-delay: 0s, 0.3s;
}


.open-menu img{
width: 55%;
    text-align: center;
    margin: 0 auto;
    display: block;
    vertical-align: middle;
    top: 17px;
    left: 15px;
    position: absolute;
}

.open-menu{
    background-color: transparent;
	transition: background-color 0.9s ease;
    width: 65px;
    height: 65px;
    top: 0;
    margin-left: auto;
    margin-top: 0; 
	position: absolute;
	right:0;
	top:0;
}

.c-hamburger--htx.is-active,
.c-hamburger--htx {
  background-color: transparent;
  margin: 0 auto;
}

.open-menu.boucherie
{
	background-color: #CD0028; 
	transition: background-color 0.9s ease;
}
.c-hamburger--htx.boucherie.is-active,
.c-hamburger--htx.boucherie {
  background-color: transparent;
  
}

.open-menu.traiteur
{
  background-color: #CD0028;
  transition: background-color 0.9s ease;
}

.c-hamburger--htx.traiteur.is-active,
.c-hamburger--htx.traiteur {
  background-color: transparent;
  
}

.open-menu.poissonnerie
{
  background-color: #CD0028; 
  transition: background-color 0.9s ease;
}

.c-hamburger--htx.poissonnerie.is-active,
.c-hamburger--htx.poissonnerie {
  background-color: #transparent;
  
}

    .mobile-navigation
    {
        z-index: 999;
        display: none;
        position: fixed;
        background: black;
    }


    .mobile-navigation .logo-mobile
    {
        width: 22%;
		margin-left: auto;
		margin-right: auto;
		display: block;
		margin-top: 8px; 
    }

    .mobile-navigation .btn_open_menu
    {
            top: 27%;
            left: 5%;
            width: 3%;
            position: absolute;
    }
	
	.btn_open_menu.open{
		transform: rotate( -180deg );            
		transition: transform 900ms ease;
	}
    #icon-section
    {
        display: none;
    }

    @media screen and (max-width: 960px) 
    {
	.full-mobile-menu
	{
        display: inherit;
	}
	
        .mobile-navigation
        {
            display: inherit;
			width: 100%;
			    height: 65px;
				    z-index: 99999;
        }



        /*#icon-section
        {
                position: absolute;
			width: 21%;
			left: 40%;
			bottom: 30%;
			display: inherit;
        }*/

        #arrow-boucherie
        {
            display: none;
        }

        .navigation ul li #arrow-traiteur 
        {
            left: 33%;
            top: 80%;
            width: 7%;
        }

        .navigation ul li #arrow-poissonerie 
        {
            right: 33%;
            top: 80%;
            width: 7%;
            cursor: pointer;
        } 

        .navigation-mobile ul
{
    margin-top: 0%;
}


    }
	
	.btn_open_menu
	{
		display: none;
	}
	
.mobile-navigation .logo-mobile
{
	width: 15%;
	margin-left: auto;
	margin-right: auto;
	display: block;
	margin-top: 8px; 
}

@media only screen and (max-width: 768px) 
{
	.mobile-navigation .logo-mobile
	{
		width: 17%;
	}
	
	.btn_open_menu 
	{
		width: 4%;
	}
}

@media only screen and (max-width: 600px) 
{
	.mobile-navigation .logo-mobile
	{
		width: 21%;
	}
	
	.btn_open_menu 
	{
		width: 5%;
	}
}

@media only screen and (max-width: 414px) 
{
	.mobile-navigation .logo-mobile
	{
		width: 31%;
	}
}

@media only screen and (max-width: 375px) 
{
	.mobile-navigation .logo-mobile
	{
		width: 34%;
	}
	
	.btn_open_menu 
	{
		width: 9%;
	}
}

@media only screen and (max-width: 320px) 
{
	.mobile-navigation .logo-mobile
	{
		width: 40%;
	}
	
	.btn_open_menu 
	{
		width: 10%;
	}
}