/**********************************
  structure globale du site
***********************************/

section.headerPage{
    height: 200px;
}
section.headerPage div.img{
    position: relative;
    border-radius: 16px;
    width: 100%;
}
section.headerPage div.img::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color01);
    opacity: .6;
}
/* section.headerPage img{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
} */
section.headerPage div.text{
    z-index: 5;
    color: var(--color00);
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
section.headerPage a{ 
    color: var(--color00);
}
section.headerPage a:hover{ 
    color: var(--color02);
}
section.headerPage h1{
    font-family: 'psb';
    font-size: 2.8rem;
    letter-spacing: -1px;
}
span.subTitle{
    font-family: 'pb';
    color: var(--color02);
    text-transform: uppercase;
    font-size: 18px;
    margin-bottom: 6px;
}

/* ------------
HEADER (EN-TETE)
--------------*/
header{
    padding: 16px 0;
    z-index: 9;
}
header .hdr-logo img{
    /* max-width: 190px; */
    max-width: 70px;
}
header.header nav {
    height: fit-content;
}
header.header nav ul.listMenu li{
    font-family: 'pm';
    position: relative;
}
header.header nav ul.listMenu li a::after{
    content: "";
    position: absolute;
    background-color: var(--color02);
    height: 3px;
    width: 0;
    left: 0;
    bottom: -6px;
    transition: all .3s;
}
header.header nav ul.listMenu li a:hover::after{
    width: 100%;
}
header.header nav ul.listMenu li.current-menu-item a::after{
    width: 100%;
}
header.header nav ul.listMenu li:not(:first-child) {
    margin: 0 0 0 30px;
}
header.header nav ul.listMenu li.mobilContact{
    display: none;
}
header nav ul li.current-menu-item a{
    color: var(--color02);
}
header div.blocBouton a.phone{
    padding: 8px;
    border: 2px solid var(--color04);
    background-image: linear-gradient(var(--color01) 50%, transparent 0);
    background-size: 100% 200%;
    background-position: 0 -100%;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 12px;
    transition: all .3s;
}
header div.blocBouton a.phone:hover{
    background-position: 0 0;
    border: 2px solid var(--color01);
}
header div.blocBouton a.phone:hover svg path{
    fill: var(--color00);
}
header div.blocBouton a.phone svg path{
    transition: all .3s;
}

/* ------------
HEADER SUB MENU (EN-TETE SOUS-MENU)
--------------*/
header nav ul li.menu-item-has-children div.subMenu{
    position: absolute;
    background-color: var(--color00);
    border: 3px solid var(--color01);
    opacity: 0;
    transform: scaleY(0);
    min-width: max-content;
    z-index: 9;
    transition: all .3s;
}
header nav ul li.menu-item-has-children:hover div.subMenu{
    opacity: 1;
    transform: scaleY(1);
}
    header nav ul li.menu-item-has-children div.subMenu ul{
        flex-direction: column;
    }
        header nav ul li.menu-item-has-children div.subMenu ul li{
            margin: 0px !important;
            color: var(--color01);
            transition: all .1s;
        }
        header nav ul li.menu-item-has-children div.subMenu ul li:hover{
            background-color: var(--color01);
        }
            header nav ul li.menu-item-has-children div.subMenu ul li a{
                display: block;
                width: 100%;
                height: 100%;
                padding: 10px 14px !important;
                background-color: inherit !important;
                color: var(--color01);
                font-size: 15px;
                transition: all .1s;
            }
            header nav ul li.menu-item-has-children div.subMenu ul li:hover a{
                color: var(--color00);
            }
            header nav ul li.menu-item-has-children div.subMenu ul li a::after{
                display: none;
            }

header nav ul li.menu-item-has-children:hover div.subMenu ul li.menu-item-has-children div.subMenu{
    left: 100%;
    top: 0;
    opacity: 0;
    transform: scaleY(0);
}
    header nav ul li.menu-item-has-children div.subMenu ul li.menu-item-has-children:hover div.subMenu{
        opacity: 1;
        transform: scaleY(1);
    }


/* ------------
FOOTER (PIED DE PAGE)
--------------*/
footer{
    position: relative;
    background-color: var(--color01);
    color: var(--color00);
}
footer img.footerElement{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
footer .footerBloc{
    padding: 70px 12px 50px 12px;
    border-bottom: 2px solid rgba(255, 255, 255, 0.15);
}
footer .footerLink {
    margin-bottom: 24px;
}
footer .blocFooterLink .footerLinkL a.subLinkFooter{
    margin-bottom: 12px;
    color: var(--color00);
    font-size: 15px;
    transition: all .3s;
}
footer .blocFooterLink .footerLinkL a.subLinkFooter:hover{
    color: var(--color02);
}
footer .footerTextBloc img.logo{
    margin-bottom: 24px;
    width: 25%;
}
footer .footerTextBloc p.footerText{
    margin: 0 0 24px 0;
    font-size: 15px;
}
div.socialLink svg path{
    fill: var(--color00);
    transition: all .3s;
}
a.socialWhite:hover svg path{
    fill: var(--color01);
}
a.socialWhite{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    background-color: var(--color01);
    border: 2px solid var(--color00);
    width: 44px;
    height: 44px;
    transition: all .3s !important;
}
a.socialWhite:hover{
    background-color: var(--color00);
    box-shadow: 0 0 15px -3px var(--color00);
}
footer .blocFooterLink .footerLink .footerLinkTitle {
    font-size: 1.15rem;
    font-family: 'pb', sans-serif;
    color: var(--color00);
}
footer .blocFooterLink .footerSocialLink{
    margin-top: 16px;
}
footer .contactInfo a{
    color: var(--color00) !important;
    font-size: 15px;
}
footer .blocMentionDuBas{
    padding: 24px 0;
}
    footer .blocMentionDuBas p{
        margin: 0;
        font-size: 15px;
    }
    footer .blocMentionDuBas p a:hover{
        color: var(--rose) !important;
    }



/* ------------
NAV MOBILE (MENU HAMBURGER)
--------------*/
header div.menu-mobil{
    display: none;
}

header .hamburger{
    position: relative;
    z-index: 9;
    border: 3px solid var(--color01);
    border-radius: 12px;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    display: flex
;
    flex-direction: column;
}
header .hamburger .line{
    width: 30px;
    height: 3px;
    background-color: var(--color01);
    display: block;
    margin: 3px auto;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border-radius: 10px;
}
header div.menu-mobil.open #hamburger-6{
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-transition-delay: 0.6s;
    -o-transition-delay: 0.6s;
    transition-delay: 0.6s;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    border: none;
  }
  
  header div.menu-mobil.open #hamburger-6 .line:nth-child(2){
    width: 0px;
  }
  
  header div.menu-mobil.open #hamburger-6 .line:nth-child(1),
  header div.menu-mobil.open #hamburger-6 .line:nth-child(3){
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
    background-color: var(--color02);
  }
  
  header div.menu-mobil.open #hamburger-6 .line:nth-child(1){
    -webkit-transform: translateY(9px);
    -ms-transform: translateY(9px);
    -o-transform: translateY(9px);
    transform: translateY(9px);
  }
  
  header div.menu-mobil.open #hamburger-6 .line:nth-child(3){
    -webkit-transform: translateY(-9px) rotate(90deg);
    -ms-transform: translateY(-9px) rotate(90deg);
    -o-transform: translateY(-9px) rotate(90deg);
    transform: translateY(-9px) rotate(90deg);
  }


header div.menu-mobil ul.list {
	background: var(--color00);
	position: absolute;
	width: 100%;
	height: 100vh;
	left: 0;
	top:0 ;
	transform: scaleY(0);
	transform-origin:center top;
	transition: all 0.4s ease;
	z-index: 5;
	padding: 0px;
	margin: 0px;
  }

	header div.menu-mobil ul.list ul{
		padding: 0px;
		top: 50%;
		position: relative;
		transform: translateY(-50%);
		align-items: center;
    	display: flex;
    	flex-direction: column;
	}

		header div.menu-mobil ul.list ul li{
			margin: 0 0 25px 0px !important;
		}

			header div.menu-mobil ul.list ul li a{
				font-family: "psb", sans-serif;
				color: var(--color01);
                font-size: 1.6rem;
			}
            header div.menu-mobil ul.list ul li.current-menu-item a{
                color: var(--color02);
			}

			header div.menu-mobil ul.list ul li a:hover{
				color: var(--color02);
			}

header div.menu-mobil.open ul {
	transform:scaleY(1);
}




/* ------------
RESPONSIVE
--------------*/
/*02 TABLETTE*/
@media screen and (max-width: 992px), screen and (max-device-width: 992px) {
    header nav#nav-main{
        display: none;
    }
    header div.menu-mobil {
        display: flex;
    }
    footer .footerTextBloc{
        margin-bottom: 30px;
    }
    footer .footerTextBloc a:nth-child(1), footer .footerTextBloc span{
        text-align: center;
    }
    footer .footerTextBloc img.logo{
        margin: 0 auto 16px auto;
        width: 65%;
    }
    footer .footerTextBloc p, footer .blocFooterLink{
        text-align: center;
    }
    footer .blocFooterLink .btnContact a{
        width: 75%;
        margin: 10px auto;
    }
    header div.blocBouton a.bouton1{
        display: none;
    }
    header div.blocBouton a.phone {
        margin-right: 25px;
    }
    header.header nav ul.listMenu li.mobilContact {
        display: flex;
    }
    header.header nav ul.listMenu li.mobilContact a{
        display: inline-block;
        padding: 10px 18px 10px 18px;
        color: #fff !important;
	    background-color: var(--color01);
	    border-radius: 12px;
	    transition: all 0.3s;
    }
    header nav ul li.menu-item-has-children div.subMenu {
        display: none;
    }
}

@media screen and (max-width: 767px), screen and (max-device-width: 767px) {
    footer .blocFooterLink:not(:last-child){
        margin-bottom: 30px;
    }
    footer .blocFooterLink .footerLink .footerLinkTitle {
        font-size: 1.4rem;
    }
    footer .blocFooterLink .footerLinkL a.subLinkFooter {
        font-size: 17px;
    }
}

@media screen and (max-width: 500px), screen and (max-device-width: 500px) {
    footer .blocFooterLink .btnContact a, footer .footerTextBloc img.logo{
        width: 100%;
    }
    footer .blocFooterLink .footerLink .footerLinkTitle {
        font-size: 1.5rem;
    }
    body{
        font-size: 1.15rem;
    }
    footer .blocMentionDuBas p {
        font-size: 15px;
    }
    footer .blocMentionDuBas .mentionLeg{
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}