/*---------------------------------------------------------------*\
  * * *

	Site Name: Occitanie Dépannage
	Description: Site sur mesure développé par AFA-Multimédia pour Occitanie Dépannage
	Version: 1.0.0
	Author: AFA-Multimedia SARL
	Author URI: https://www.afa-multimedia.com

	* * *
\*---------------------------------------------------------------*/


/*---------------------------------------------------------------*\
 *  FONTS
\*---------------------------------------------------------------*/
@font-face{
    font-family: 'Peace Sans';
    src: url('fonts/PeaceSans.eot');
    src: url('fonts/PeaceSans.eot?#iefix') format('embedded-opentype'),
         url('fonts/PeaceSans.woff2') format('woff2'),
         url('fonts/PeaceSans.woff') format('woff'),
         url('fonts/PeaceSans.ttf') format('truetype'),
         url('fonts/PeaceSans.svg#PeaceSans') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face{
    font-family: 'Gill Regular';
    src: url('fonts/GillSansMT.eot');
    src: url('fonts/GillSansMT.eot?#iefix') format('embedded-opentype'),
         url('fonts/GillSansMT.woff2') format('woff2'),
         url('fonts/GillSansMT.woff') format('woff'),
         url('fonts/GillSansMT.ttf') format('truetype'),
         url('fonts/GillSansMT.svg#GillSansMT') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face{
    font-family: 'Gill Bold';
    src: url('fonts/GillSansMT-Bold.eot');
    src: url('fonts/GillSansMT-Bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/GillSansMT-Bold.woff2') format('woff2'),
         url('fonts/GillSansMT-Bold.woff') format('woff'),
         url('fonts/GillSansMT-Bold.ttf') format('truetype'),
         url('fonts/GillSansMT-Bold.svg#GillSansMT-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face{
    font-family: 'OpenSans';
    src: url('fonts/OpenSans-Regular.eot');
    src: url('fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Regular.woff2') format('woff2'),
        url('fonts/OpenSans-Regular.woff') format('woff'),
        url('fonts/OpenSans-Regular.ttf') format('truetype'),
        url('fonts/OpenSans-Regular.svg#OpenSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face{
    font-family: 'OpenSans';
    src: url('fonts/OpenSans-Bold.eot');
    src: url('fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Bold.woff2') format('woff2'),
        url('fonts/OpenSans-Bold.woff') format('woff'),
        url('fonts/OpenSans-Bold.ttf') format('truetype'),
        url('fonts/OpenSans-Bold.svg#OpenSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face{
    font-family: 'Bebas';
    src: url('fonts/BebasNeue.eot');
    src: url('fonts/BebasNeue.eot?#iefix') format('embedded-opentype'),
        url('fonts/BebasNeue.woff2') format('woff2'),
        url('fonts/BebasNeue.woff') format('woff'),
        url('fonts/BebasNeue.ttf') format('truetype'),
        url('fonts/BebasNeue.svg#BebasNeue') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


/*---------------------------------------------------------------*\
 *  GENERAL
\*---------------------------------------------------------------*/
.container, .navbar_item{
    width: auto;
    margin: auto;
    max-width: 310px;
}

p, a, blockquote, h4, h5, h6{
    font-family: 'OpenSans';
    font-weight: normal;
}

h1, h2, h3{
    font-family: 'Bebas'
}

body{
    margin: 0;
    padding: 0;
}

.flex{
    display: flex;
}

li{
    list-style: none;
}

a{
   color: black;
}

.line_horiontal{
    width: 100%;
    height: 3px;
    background-color: #172e2a;
    margin-bottom: 3em;
}

#number_contact{
   display: none;
}

.no_active{ display: none; }

.padding_general{
   padding: 1em;
}
.service_accueil > .padding_general{
    padding: 5em 1em 1em;
}
.backtop{
   position: fixed;
   width: 60px;
   box-shadow: 0px 1px 2px rgba(0,0,0,0.7);
   bottom: 10px;
   right: -80px;
   cursor: pointer;
   transition: right 0.7s, bottom 0.3s;
}

.backtop:hover{
   bottom: 20px;
}

.check{
   font-size: 14px;
   font-family: "OpenSans";
}

.check_wrap{
   margin-bottom: 2em;
}

/*---------------------------------------------------------------*\
 *  HEADER
\*---------------------------------------------------------------*/
.desktop_contact, .navbar_nav{
    display: none;
}

.wrap_menu, .wrap_phone{
    width: 50%;
}

.mobile_contact{
    display: inline-block;
    float: right;
}    

.mobile_contact img{
    width: 55px;
    cursor: pointer;
    transition: all 0.2s;
}

.mobile_contact img:hover{
    transform: rotate(30deg);
}

.navbar_phone{
    padding: 0;
}

.navbar_nav{
    position: absolute;
    width: 100%;
    z-index: 100;
    background-color: #1B2B3A;
    top: -20px;
    box-shadow: 0px 12px 15px -7px rgba(0,0,0,0.57);
    padding: 8em 0 2em 0;
    left: 0;
}
.navbar_link{
    color: white;
    text-decoration: none;
    padding: 1em;
    font-size: 18px;
    display: block;
    text-transform: uppercase;   
}
.navbar_link_phone{
   padding: 0; 
}
#header .button:first-of-type{
    margin-right: 1em;
}

/* *** BURGER MENU *** */
.burger_menu{
    position: relative;
    top: 20px;
}
.burger_menu .bar{
    height: 6px;
    width: 50px;
    background: #1B2B3A;
    margin: 0.5em 0.5em 0.5em 0;
    border-radius: 2px;
}
.burger_menu_02{
    display: none;
    position: relative;
    top: 30px;
    height: 40px;
    z-index: 999999;
}
.burger_menu_02 .bar{
    height: 6px;
    width: 55px;
    background: #FFFFFF;
    border-radius: 2px;
}
.burger_menu_02 .bar_01{
    transform: rotate(45deg);
    position: absolute;
    top: 15px;
}
.burger_menu_02 .bar_02{
    transform: rotate(-45deg);
    position: relative;
    top: 15px;
}

/* *** NOUVEAU HEADER *** */
header{
    margin-top: 1.5em;
}
header > .menu_ordi{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6em;
}
header > .menu_ordi > div:not(:nth-child(2)){
	background-color: #1B2B3A;
	flex: 1;
    padding: 1em 0 1em 0;
    height: 110px;
    display: flex;
    align-items: center;
}
header > .menu_ordi > div:first-child{
    padding-right: 8em;
    justify-content: end;
}
header > .menu_ordi > div:last-child{
    padding-left: 8em;
    justify-content: start;
}
header > .menu_ordi > div > nav > ul{
    display: flex;
    align-items: center;
    gap: 2em;
    position: relative;
    margin: 0;
    padding: 0;
}
header > .menu_ordi > div:first-child > nav > ul{
    justify-content: end;
}
header > .menu_ordi > div > nav > ul > li > a{
    margin: 0;
    color: #FFFFFF;
    font-family: "Bebas";
    text-transform: uppercase;
    font-size: 1.8em;
    text-decoration: none;
}
header > .menu_ordi > div > nav > ul > li > a:after{
   content: '';
   display: block;
   margin: auto;
   height: 8px;
   width: 0px;
   background: transparent;
   transition: width 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
header > .menu_ordi > div > nav > ul > li > a:hover:after, header > div > div > nav > ul > li > .navbar_link_active:after{
   width: 100%;
   background: #FFFFFF;
}
header > .menu_ordi > div > nav > ul > .number_contact{
    cursor: pointer;
    transition: all .25s;
}
header > .menu_ordi > div > nav > ul > .number_contact:hover{
    transform: scale(1.1);
}
header > .menu_ordi > div > nav > ul > .active{
	position: absolute;
	top: 6px;
	left: -10px;
	background-color: #FFFFFF;
	font-family: "OpenSans";
	color: #1B2B3A;
	font-weight: bold;
	padding: 1em 2em;
	border-radius: 15px;
}
header > .menu_mobile{
    display: none;
}
header > .menu_mobile > div{
    padding: 0 2em;
}
header > .menu_mobile > div > .burger_menu{
	float: right;
	top: 10px;
	cursor: pointer;
}
header > .menu_mobile > div > .burger_menu.fermer > .bar_01{
	transform: translateY(6px) rotate(45deg);
}
header > .menu_mobile > div > .burger_menu.fermer > .bar_02{
	display: none;
}
header > .menu_mobile > div > .burger_menu.fermer > .bar_03{
	transform: translateY(-8px) rotate(-45deg);
}
header > .menu_mobile > img{
	display: block;
    margin: auto;
    width: 220px;
}
header > .menu_mobile > div > nav{
    display: none;
	position: absolute;
	width: calc(100% - 6em);
	left: 0;
	background-color: #1B2B3A;
	z-index: 1;
	box-shadow: 0 10px 20px rgba(0, 0, 0, .3);
	padding: 1.5em 0 0 6em;
}
header > .menu_mobile > div > nav > ul{
	margin: 0;
	padding: 0;
}
header > .menu_mobile > div > nav > ul > li > a{
	color: #FFFFFF;
	text-transform: uppercase;
	font-family: "Bebas";
	text-decoration: none;
	font-size: 2em;
	margin-bottom: .8em;
	display: block;
}
.titre_accueil{
	text-align: center;
}
.titre_accueil > p{
	color: #FF1C30;
	font-family: "Bebas";
	font-size: 4.5em;
	margin: .2em 0 0;
	line-height: 1;
}
.titre_accueil > h1{
	text-transform: uppercase;
	color: #FFFFFF;
	background-color: #1B2B3A;
	padding: .5em 1em;
	width: max-content;
	max-width: 100%;
	margin: 0 auto 2em;
	font-family: "Bebas";
	position: relative;
    font-size: 2.5em;
}
.titre_accueil > h1:after{
	content: "";
	position: absolute;
	height: 0;
	width: 0;
	right: 0;
	bottom: -30px;
	border-top: 30px solid #1B2B3A;
	border-right: 20px solid transparent;
}
.titre{
    margin: 2em 0 -8em;
}
.titre > h1{
	text-transform: uppercase;
	color: #FFFFFF;
	background-color: #1B2B3A;
	padding: .5em 1em;
	width: max-content;
	max-width: 100%;
	margin: 0 auto 2em;
	font-family: "Bebas";
	position: relative;
    font-size: 2.5em;
}
.titre > h1:after{
	content: "";
	position: absolute;
	height: 0;
	width: 0;
	right: 0;
	bottom: -30px;
	border-top: 30px solid #1B2B3A;
	border-right: 20px solid transparent;
}


/* ***** */
.info_name h2{
    font-family: "Gill Bold";
    text-transform: uppercase;
    color: white;
    font-size: 20px;
    margin-top: 5em;
    text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.7);
}

.info_name h1{
    text-transform: uppercase;
    color: white;
    margin-bottom: 2em;
    text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.7);
}

.info_name h1 span{
    display: block;
    font-size: 18px;
}

.button{
    display: inline-block;
    color: #FFFFFF;
    font-family: "Bebas";
    text-transform: uppercase;
    font-size: 1.4em;
    text-decoration: none;
    background: #FF1C30;
    padding: .5em 2em;
    border-radius: 50px;
    margin-bottom: 1.5em;
    transition: all 0.2s;
}

.wrap_contact .button{
	font-size: 1.4em;
}

.button:hover{
    background: #C61625;
}

.wrap_link{
    margin-bottom: 6em;
}
.desktop_contact p{
   margin: 0;
   cursor: pointer;
}

/*---------------------------------------------------------------*\
 *  FOOTER
\*---------------------------------------------------------------*/
#footer{
    margin-top: 4em;
}

.img_footer{
    height: 390px;
    width: 100%;
    background: url('img/oc-depannage-serrurier-plombier-carcassone-aude-footer.jpg');
    border-bottom: solid 10px #FF1C30;
}

.footer{
    background:#1B2B3A;
    color: white;
    padding: 3em 0;
}

.footer h4{
    font-family: "Bebas";
    text-transform: uppercase;
    font-size: 2em;
    margin: 0 0 .5em;
}

.footer p{
    margin: 0;
}

.footer_box{
    margin-bottom: 3em;
}

.footer_copyright{
    background-color: #000000;
    color: white;
    text-align: center;
    font-size: 14px;
    padding: 2em;
}

.footer_copyright p{
    margin: 0;
}

.footer_copyright a{
    color: white;
}

.footer_copyright a:hover{
    text-transform: none;
}

/*---------------------------------------------------------------*\
 *  HOME PAGE
\*---------------------------------------------------------------*/
body .wrap_services, body .wrap_zones{
    margin-top: -6em;
    background: white;
    border: 4px solid #1B2B3A;
    text-align: center;
}
.wrap_services .title_section, .wrap_zones .title_section{
    font-size: 2em;
    color: #1B2B3A;
    text-transform: uppercase;
    margin-bottom: 0px;
    text-align: left;
}

.wrap_services p{
    text-align: justify;
	font-size: 1em;
	margin: 12px 0;
	color: #333;
}

.wrap_services .panel_services_bis p{
    text-align: left;
	font-size: 1em;
	color:#fff;
}

.wrap_zones .box_text_home p{
	font-size: 1.08em;
	color: #484848;
}

.wrap_panel{
    margin-top: 2em;
    overflow: auto;
}
.panel_services{
    margin-bottom: 2em;
 }
.wrap_panel .panel_services_bis{
    background: #1B2B3A;
    color: white;
    padding: 2em 1em;
    height: 86%;
}

.wrap_panel .panel_services h4{
    font-size: 18px;
    font-family: "OpenSans";
    font-weight: bold;
    text-align: center;
}

.wrap_panel .panel_services img{
    display: block;
    margin: auto;
}

.wrap_contact{
    text-align: center;
    background: #1B2B3A;
    padding: 2em 0;
}

.wrap_contact h4{
    color: white;
    font-family: "OpenSans";
    font-weight: bold;
    width: 80%;
    margin: 0 auto 3em auto;
    font-size: 2em;
}

.zone_blue_before,
.zone_blue_after{
    background: #1B2B3A;
    height: 150px;
    width: 100%;
    position: relative;
    z-index: -10000
}

.zone_blue_before{
    margin-top: -70px;
}

.wrap_zones .box_text_home{
    text-align: justify;
}

.box_map_home img{
    width: 90%;
    margin: auto;
    max-width: 350px;
}

.box_map_home{
    margin-bottom: 3em;
}

.panel_cle{
    background: #eee;
    padding: 1em;
    margin-bottom: 2em;
    text-align: center;
}

.panel_cle img{
    width: 150px;
}

.panel_cle h4{
    font-size: 1.5em;
    color: #1B2B3A;
    text-transform: uppercase;
    font-weight: bold;
    margin: 1em 0 0;
}

.container  .panel_cle p{
    text-align: center;
    color: #1B2B3A;
    margin: 0;
}


.service_boutique .adresse {
    text-align: center;
    margin: 0;
}

.service_boutique img {
    width: 150px;
}

.service_boutique .wrap_info_zone {
    margin-bottom: 4em;
}

.service_boutique .wrap_info_zone iframe {
    height: 100%;
    min-height: 400px;
    width: 100%;
    margin: 0;
}
.service_boutique .box_map_home {
    margin-bottom: 0;
    width: 100%;
}

/*---------------------------------------------------------------*\
 *  PAGE SERVICE
\*---------------------------------------------------------------*/
.box_serrurerie h3{
   font-size: 2em;
   margin: 0 0 12px;
}

.box_serrurerie{
   margin-bottom: 4em;
   padding: 1em 0;
   border-bottom: 2px solid #B7B7B7;
}

body .no_border{
   border-bottom: 0px;
}

/*---------------------------------------------------------------*\
 *  CONTACT PAGE
\*---------------------------------------------------------------*/
.contact #footer{
   margin-top: 0px;
}

.contact .wrap_services{
   text-align: left;
}

.text_contact{
   color: #172e2a;
   font-size: 18px;
   margin-bottom: 4em;
   font-family: "OpenSans";
}

.box_contact{
   border-bottom: 3px solid #1B2B3A;
   margin-bottom: 3em;
   border-radius: 20px;
}

.box_contact label{
   font-family: "OpenSans";
   font-weight: bold;
   color: #1B2B3A;
   text-transform: uppercase;
   margin-left: 1em;
   margin-top: 1em;
   display: inline-block;
}

.box_contact input{
   width: 70%;
   padding: 0.7em;
   font-size: 18px;
   border: 0px;
   background: transparent;
}

.box_textarea textarea{
   width: 80%;
   display: block;
   margin-left: 2em;
   height: 200px;
   font-size: 21px;
   border: 0px;
}

.contact .button{
   border: 0px;
   cursor: pointer;
}

.contact .wrap_contact{
   color: white;
   padding-bottom:7em;
   padding-top: 1em;
}

.contact .wrap_contact p{
   font-family: "OpenSans";
   font-weight: bold;
   margin: 0px;
   font-size: 20px;
}

form .mail{
    padding: 1em;
    border: 2px solid #FF1C30;
    margin-bottom: 1em;
    color: #FF1C30;
    font-family: "OpenSans";
}

/* *** */
.mentions_legales .wrap_services{
   text-align: left;
}

.serrure #footer{
   margin-top: 0px;
}

.footer_box a{
   display: inline-block;
   color: white;
   text-decoration: none;
}
/*---------------------------------------------------------------*\
 *  MEDIA QUERIES
\*---------------------------------------------------------------*/
@media only screen and (min-width:500px){
   .container, .navbar_item{
      width: auto;
      margin: auto;
      max-width: 500px;
    }
}

@media only screen and (min-width:768px){
    .service_boutique .wrap_info_zone iframe {
        height: 100%;
        min-height: 0;
        margin: 0;
    }
    .service_boutique .box_map_home {
        margin-left: 2em;
        margin-bottom: 0;
        width: 60%;
    }




   .container, .navbar_item{
      max-width: 700px;
      width: auto;
   }
    
   .info_name h1{
      font-size: 40px;
   }
    
   .info_name h1 span{
      font-size: 25px;
   }
     
    .panel_services{
        width: 45%;
        float: left;
    }
    
   .panel_01, .panel_03{
      margin-right: 10%;
   }
    
   .wrap_info_zone{
      display: flex;
   }
    
   .box_map_home{
      width: 40%;
   }
    
   .box_text_home{
      width: 60%;
   }
    
   .footer .container{
      display: flex;
   }
    
   .coordonnees, .services_prestations{
      width: 30%;
   }
    
   .horaires{
      width: 40%;
   }
}
   

@media only screen and (min-width:992px){
  .container, .navbar_item{
      max-width: 980px;
      width: auto;
   }
    
   .wrap_panel{
      display: flex;
      align-items: stretch;
      margin-bottom: 2em;
   }
    
   .panel_01, .panel_03{
      margin-right: 0px;
   }
    
  .panel_services{
      width: 100%;
      float: none;
   }
    
   .panel_01{
      padding-right: 1em;
   }
    
   .panel_02{
      padding-right: 0.5em;
   }
    
   .panel_03{
      padding-left: 0.5em;
   }
    
   .panel_04{
      padding-left: 1em;
   }
    
   .wrap_link{
     margin-bottom: 10em;
   }
    
   .info_name h1 span{
      font-size: 30px;
   }
    
   .info_name h1{
      font-size: 45px;
   }
    
   .info_name h2{
      font-size: 25px;
   }
    
   .burger_menu{
      display: none;
   }
    
   .navbar_nav{
      display: block !important;
      position: relative;
      background: transparent;
      box-shadow: none;
      padding: 0px;
      top: 0px;
   }
    
   .burger_menu_02{
     display: none !important;
    }
    
   .navbar_nav .navbar_item{
      display: inline-block;
      max-width: none;
   }
   
   .navbar_nav .navbar_item:first-of-type .navbar_link{
       padding-left: 0px;
   }
   
   .navbar_nav .navbar_item .navbar_link{
      color: #e5e3b1;
   }
    
   .navbar_nav .navbar_item .navbar_link::after,
   .navbar_link_active::after{
      content: '';
      display: block;
      margin: auto;
      height: 8px;
      width: 0px;
      background: transparent;
      transition: width 0.2s ease-in-out, background-color 0.2s ease-in-out;
   }
    
   .navbar_nav .navbar_item .navbar_link:hover::after,
   .navbar_nav .navbar_item .navbar_link_active::after{
      width: 100%;
      background: #e5e3b1;
   }
    
   .desktop_contact{
      display: inline-block;
      float: right;
   }
    
   .mobile_contact{
     display: none;
   }
    
   .desktop_contact img{
     width: 55px;
     cursor: pointer;
     transition: all 0.2s;
  }
   
   .desktop_contact img:hover{
      transform: rotate(30deg);
   }
   
   .navbar_link_phone{
      position: relative;
      top: -20px;
      color: #e5e3b1;
      text-transform: uppercase;
   }
   
   .navbar_link_phone img{
      position: relative;
      top: 22px;
      margin-left: 0.5em;
   }
   
   #number_contact{
      float: right;
      position: relative;
      right: -180px;
      top: 4px;
      background: white;
      padding: 1em 3em;
      border-radius: 15px;
      background: #FF1C30;
      font-family: "Gill Bold";
   }
   
   #number_contact.active{ display: inline-block; }
   
    .box_serrurerie img{
        float: right;
        margin-left: 4em;
        width: 150px; 
    }
   
    .padding_general{
        padding: 2em;
    }
   .service_accueil > .padding_general {
        padding: 6em 2em 2em;
    }
   .box_serrurerie{
      border-bottom: 0px;
      border-left: 10px solid #FF1C30;
      border-radius: 10px;
      padding-left: 2em;
   }
   
   .box_serrurerie h3{
      text-align: left;
   }
   
   .box_contact{
      border: 3px solid #1B2B3A;
      border-radius: 30px;
   }
}

@media only screen and (min-width:1200px){
   .container, .navbar_item{
      max-width: 1150px;
      width: auto;
   }
    
   .info_name h2{
      font-size: 30px;
   }
    
   .info_name h1{
      font-size: 55px;
   }
   
    .padding_general{
        padding: 4em;
    }
    .service_accueil > .padding_general{
        padding: 8em 4em 4em;
    }
}


@media only screen and (min-width:1600px){
    .padding_general{
        padding: 4em 6em;
    }
    .service_accueil > .padding_general {
        padding: 8em 6em 4em;
    }
   .container, .navbar_item{
      max-width: 1300px;
      width: auto;
   }
}

@media screen and (max-width: 1350px) {
    header > .menu_ordi{
        gap: 4em;
    }
    header > .menu_ordi > div:first-child{
        padding-right: 4em;
    }
    header > .menu_ordi > div:last-child{
        padding-left: 4em;
    }
}
@media screen and (max-width: 1350px) {
    header > .menu_ordi{
        gap: 2em;
    }
    header > .menu_ordi > div:first-child{
        padding-right: 2em;
    }
    header > .menu_ordi > div:last-child{
        padding-left: 2em;
    }
    header > .menu_ordi > div > img{
        width: 250px;
    }
    .titre_accueil > p{
        font-size: 4em;
    }
    .titre_accueil > h1, .titre > h1{
        font-size: 2em;
    }
    .titre{
        margin: 2em 0 0;
    }
}
@media screen and (max-width: 992px) {
    .titre{
        margin: 2em 0 10em;
    }
    .wrap_contact h4{
        font-size: 1.5em;
        width: 90%;
    }
}
@media screen and (max-width: 920px) {
    .titre_accueil > img{
        width: 400px;
    }
    header > .menu_ordi{
        display: none;
    }
    header > .menu_mobile{
        display: block;
    }
    .titre_accueil > p{
        font-size: 3em;
    }
}
@media screen and (max-width: 600px){
    header > .menu_mobile > div > nav{
        padding-left: 2em;
        width: calc(100% - 2em);
    }
    .titre_accueil > img{
        width: 80%;
    }
    .titre_accueil > h1, .titre > h1{
        font-size: 1.8em;
        width: calc(95% - 2em);
    }
}
@media screen and (max-width: 600px){
    header > .menu_mobile > div{
        padding: 0 1em;
    }
}