/*Theme Name: EMPRtheme
Description: Theme enfant pour le site EMPR
Author: NGcrea
Template: generic
*/

@import url("../generic/style.css");


/*color*/
.blanc, .blanc strong, .has-blanc-color {color: #ffffff !important }
.noir, .noir strong, .has-noir-color {color: #000000 !important }
.rouge, .rouge strong, .has-rouge-color {color: #cc0000 !important}
.rougefonce, .rougefonce strong, .has-rougefonce-color {color: #660000 !important}
.grisfonce, .grisfonce strong, .has-grisfonce-color {color: #3333333 !important}
.grisclair, .grisclair strong, .has-grisclair-color {color: #e5e5e5 !important}
.has-blanc-background-color {background-color: #ffffff !important }
.has-noir-background-color {background-color: #000000 !important }
.has-rouge-background-color {background-color: #cc0000 !important }
.has-rougefonce-background-color {background-color: #660000 !important }
.has-grisfonce-background-color {background-color: #333333 !important }
.has-grisclair-background-color {background-color: #e5e5e5 !important}


body {font-family: 'Poppins', sans-serif !important;  font-weight: 300  ;  text-align: left ; font-size: 14px !important  ; line-height: 28px !important ; color: #000000 ; margin: 0  ; padding: 0 ; word-wrap: normal ; word-break: normal !important ;  background-attachment: fixed; background: #ffffff }
.pagesite {overflow: hidden}

#header, #container, #footer {    padding: 0% !important;}

header {padding: 0 !important}
.container {position: relative; z-index: 1; }
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {  padding-right: 0px;    padding-left: 0px;    margin-right: auto;    margin-left: auto;}
strong, b {font-weight: 700 ; }
p {margin: 0 0 20px 0 !important;}
ul li, ul {list-style-type: none !important;   }
ul  {margin: 0 0 0 0 !important; text-indent: 0px; }
.wp-block-image {    margin-bottom: 0;}
a img {    opacity: 1 !important }
.aligncenter {margin: 0px auto;    }
.centrevertical {align-items: center !important; display: flex}
hr {margin: 0px 0 !important; width: 100%; position: relative; max-width: 100%;  display: block;}
hr.trait { height: 0; 	padding: 0;	border: 0;    }
hr.trait:after {	content: ""; border-bottom-width: 1px; border-bottom-style:  dashed; display: block; width: 100%; height: 1px; position: relative;    }
hr.has-rouge-color:after {border-bottom-color: #cc0000}
hr.has-blanc-color:after {border-bottom-color: #ffffff}

a{text-decoration: none; color: inherit;}
p a{color: inherit !important;}
a:hover{text-decoration: none; color: inherit}
p a:hover, li a:hover{text-decoration: underline; color: inherit}
.row, [class*="col"] {margin: 0 ; padding: 0 }
* { transition: all 0.3s ease; }

/*hack li*/
.entry-content ul, .widget-container ul, .comment-body ul, .entry-content ol, .widget-container ol, .comment-body ol, ul li, ul  {
    font-family: inherit !important;  font-weight: 400  ;    }
.entry-content ul {margin: -20px 0 20px 0 !important}
.entry-content li { margin: 0px 0;}
.entry-content li { margin-bottom: auto !important; line-height: 32px !important ;}

.entry-content ul li::before, .widget-container ul li::before, .comment-body ul li::before {    content: "\f105";    font-family: "Font Awesome 5 Free";    color: #cc0000;   display: inline-block; font-weight: 900; position: relative; margin-right: 5px !important; margin-left: 0px; }

.noborder {padding: 0 !important; border: 0 !important}
.invisible {display: none}
.cap {text-transform: uppercase}
.right {text-align: right}
.left {text-align: left }
.center {text-align: center}
/*titres*/
h1, h2, h3, h4, h5, h6 {padding: 0 !important ; margin: 0 !important; display: block; }
h1, h2 {font-size: 36px; line-height: 48px; color: #cc0000; font-weight: 900}
h1.titre_page {text-align:center; font-size: 64px; line-height: 72px;  text-transform: uppercase; padding: 20px 0 !important  }
h2 {padding-bottom: 5px !important; border-bottom: 1px dashed #cc0000; margin-bottom: 30px !important; }
h3 { font-size: 18px; line-height: 28px; font-weight: 900 }
h4 {font-size: 18px; line-height: 28px; font-weight: 700}




/*bouton*/
.wp-block-button__link, .formulaire input[type="submit"], .formulaire button, .formulaire .button {font-family: inherit; font-weight: 700; color: #ffffff; padding: 10px 20px 10px 20px !important; box-shadow: 0px 0px 0px 0px #ffffff; border-radius: 50px; font-size: 16px; text-align: center; min-width: 250px; text-transform: uppercase   }

.wp-block-button__link:hover {background: #660000 !important; color: #ffffff !important}


/* header */
.headerempr {position: relative; box-shadow: 0px 20px 0px 0px #333333; width: 100%; }
.headerempr:before {content: ""; position: absolute; z-index: 2; width: 100%; height: 200px; left: 0; top: 0; background-image: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);}
.headerpage {height: 600px; position: relative;  width: 100%;  background-size: cover; background-position: center center; background-repeat: no-repeat;   }
.slider_hp {max-width: 100%; overflow: hidden}
.slider_hp .flex-control-paging {display: none}
.slider_hp .metaslider .flexslider {margin: 0 0 0px }
.accroche {position: absolute; z-index: 3; bottom: 0px; width: 100%;  }
.accroche .container, .zone_intro .container {background: rgba(255,255,255,0.85); padding: 40px ; }
.accroche .container {border-top-left-radius: 50px; box-shadow: 0px 20px 0px 0px #cc0000 ; position: relative; z-index: 999999 }

.logo {max-width: 270px; height: auto; position: absolute; z-index: 4; left: 100px; top: 35px; background-image: linear-gradient(to bottom, #FFFFFF 0%, #DDDDDD 100%); display: block; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.35); }
.logo img {width: 100%; height: auto; display: block}

/*nav*/
.navempr {position: absolute; top: 50px; left: 0px; z-index: 3; background-image: linear-gradient(to bottom, rgba(255,0,0,0.85) 0%, rgba(102,0,0,0.85) 100%); width: 100% !important; text-align: right;  padding-right: 50px }
.navempr:after {content: ""; width: 322px; height: 330px; background: url(images/arrondisousnav.png) ; display: block; position: absolute; left: 0px; opacity: 1}
.navempr #menu {float: none; margin-top: 0; display: inline-block}
.navempr #menu div:first-of-type {    float: none;}
.navempr #menu a { font-size: 18px; text-transform: uppercase;   text-align: center; line-height: 40px;    padding: 20px 40px 20px 40px;    margin-right: 0px; box-shadow:inset 0px 0px 0px #ffffff;  }
.navempr #menu a:hover{ color: #cc0000 ; box-shadow:inset 0px -100px 0px  #ffffff;  }
.navempr #menu li.current_page_item a { color: #ffffff ; box-shadow:inset 0px -100px 0px  #660000;  }
.navempr #menu li::before {  content: "|"; color: #ffffff;  font-size: 18px;    }
.navempr #menu li:first-child::before {  display: none    }

#mysticky-nav.wrapfixed .myfixed  {background-image: linear-gradient(to bottom, rgba(255,0,0,0.85) 0%, rgba(102,0,0,0.85) 100%);}
#mysticky-nav.wrapfixed .myfixed:after  {display: none}


/*hp et contenu*/
.zone_intro {background: url(images/backgnd_trame_hp.jpg) center center no-repeat ; background-size: cover; padding-bottom: 80px; }
.zone_intro .container  {border-bottom-right-radius: 50px; padding-top: 60px; padding-bottom: 30px}


.hp_galerie, .contenu {padding-right: 100px; padding-left: 100px; background-image: linear-gradient(to bottom, #FFFFFF 0%, #E5E5E5 100%); padding-bottom: 50px;  }
.hp_galerie {box-shadow: 0px -20px 0px 0px #cc0000; }
.contenu {  padding-top: 60px; padding-bottom: 0px;}
.contenu .has-grisfonce-background-color {box-shadow: 100px 0 0px 0px #333333, -100px 0 0px 0px #333333; }

.hp_galerie .container {padding-top:  50px;  box-shadow: 0px -20px 0px 0px #666666; }

.gal .filtr-container a .img-responsive {   min-height: 250px ; max-height: 250px;  object-fit: cover ;    object-position: center center ; width: 100%; border-radius: 50px }
.hp_galerie .gal .filtr-container a .img-responsive {   min-height: 350px ; max-height: 350px; }
.hp_galerie .gal .filtr-container a:nth-child(2n+1) .img-responsive {   border-radius: 50px 0 50px 0;}
.hp_galerie .gal .filtr-container a:nth-child(2n+0) .img-responsive {   border-radius: 0 50px 0 50px;}
.gal .filtr-container .img-responsive {   padding: 10px}
ul.simplefilter li::before {content: ""; display: none !important}
ul.simplefilter li {color: #cc0000 !important; background: #e5e5e5 !important}
ul.simplefilter li:hover, ul.simplefilter li.active {color: #ffffff !important}
#all-simplefilter li  {border-radius: 7px 0 0 7px !important}
.portfolio-wraper ul.simplefilter li:last-child {border-radius:  0 7px 7px 0}
.portfolio-wraper .col-lg-12 {margin-bottom: 30px}
h4.modal-title {display: none}

.page-id-36 .portfolio-wraper {overflow: hidden; position: relative}
.page-id-36 .portfolio-wraper:before {content: ""; width: 2000px; height: 2000px; position: absolute; z-index: 999; left: 0; right: 0; background: rgba(0,0,0,0)}


.hp_confiance {padding-bottom: 45px; box-shadow: 0px -20px 0px 0px #cc0000; overflow: hidden}
.hp_confiance .container {padding-top:  50px;  box-shadow: 0px -20px 0px 0px #ffffff; }


/*contenu*/
.row .col-md-6:first-child {padding-right: 20px }
.row .col-md-6:last-child {padding-left: 20px}
.wp-block-media-text__content {padding: 0px 20px !important;}


/*formulaire*/
.formulaire label p {margin-bottom: 10px !important}
.nom_champs {display: block ; font-size: 14px; text-transform: uppercase; color:#cc0000 ;  padding-bottom: 0; font-weight: 700   }
.nom_champs i.fas {color:#660000 ; }
.formulaire input::placeholder, .formulaire textarea::placeholder {font-style: italic}
.wpcf7 .fullsize, .wpcf7 label {width: 100%;  }
.fullsize {background: #ffffff; border: 1px solid #999999; padding: 10px 10px; border-radius: 5px !important; margin-top: 5px !important; margin-bottom: 5px }
.formulaire input, .formulaire textarea {font-family: inherit !important; font-weight: 300  ;  text-align: left ; font-size: 14px !important  ; line-height: 22px !important ; color: inherit ;}
.formulaire textarea {height: 200px }
.formulaire input[type="submit"], .formulaire button, .formulaire .button  { background: #cc0000; margin-top: -10px; margin-bottom: 20px  }
.formulaire input:hover[type="submit"], .formulaire button:hover, .formulaire .button:hover  {background: #660000 !important ; color: #ffffff; opacity: 1  }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.sent .wpcf7-response-output { color: #cc0000 !important;  line-height: 22px !important;    border-color: rgba(0,0,0,0) !important; margin: 20px 0em 0em;padding: 0em 0em;} 
.wpcf7-not-valid-tip {color: #660000 !important}

.carte {display: flex; width: 100%; min-height: 400px}

/*footer*/
.foot_contenu {margin-top: -20px; margin-bottom: -20px; text-align: center; position: relative ; z-index: 999}
.foot_contenu .wp-block-group__inner-container {padding: 20px}
p.pfoot {margin: 0 0 0px 0 !important  }

/*mobilemenu*/
.mobmenul-container {  float: right ;    right: 10px;}
.mobmenu-left-panel .mobmenu-left-bt {   right: 5px;    top: 10px !important;    }
.mobmenu-left-panel .mob-cancel-button:hover, .mobmenul-container i:hover  {color: #660000 }
.mobmenu-content li a {background: #660000; border-bottom: 1px dashed #cc0000; font-weight: 700 !important; text-transform: uppercase !important; padding: 20px 20px;}
.mobmenul-container i {  text-shadow: 1px 1px 0px #c00, -1px -1px 0 #c00, -1px 1px 0px #c00, 1px -1px 0 #c00;}


@media screen and (max-width: 1280px) {
.slider_hp li.ms-image, .slider_hp li.flex-active-slide  {width: 130% !important; margin-right: -150% !important}
.headerpage {height: 500px;    }
h1, h2 {font-size: 30px; line-height: 40px; }
h1.titre_page {font-size: 54px; line-height: 62px;  padding: 15px 0 !important  }
.accroche .container, .zone_intro .container { padding: 30px ; }
.zone_intro .container  {padding-top: 50px; }
.navempr {padding-right: 25px }
.navempr #menu a { font-size: 16px;  padding: 20px 20px 20px 20px;     }
.navempr #menu li::before {  font-size: 16px;    }
.bx-viewport {height: 60px !important}
.limargin {width: 120px !important}	
.gal .filtr-container .img-responsive {   padding: 7px}
.hp_galerie .gal .filtr-container a .img-responsive {   min-height: 250px ; max-height: 250px; }
.gal .filtr-container a .img-responsive {   min-height: 180px ; max-height: 180px;  border-radius: 30px }
}

@media screen and (max-width: 960px) {
.headerpage {height: 400px;    }
h1.titre_page {font-size: 42px; line-height: 50px;  padding: 10px 0 !important  }
.logo {max-width: 200px; left: 50px;}
.hp_galerie, .contenu {padding-right: 50px; padding-left: 50px; }
.navempr #menu a { font-size: 16px;  padding: 10px 10px 10px 10px;     }
.navempr:after {width: 200px; height: 205px; background-size: cover }
h1{font-size: 24px; line-height: 32px; }
 .gal .filtr-container a .img-responsive {   border-radius: 25px;}
.hp_galerie .gal .filtr-container a:nth-child(2n+1) .img-responsive {   border-radius: 25px 0 25px 0;}
.hp_galerie .gal .filtr-container a:nth-child(2n+0) .img-responsive {   border-radius: 0 25px 0 25px;}
.gal .filtr-container .img-responsive {   padding: 5px}

h4 {font-size: 16px; line-height: 24px}
.contenu {  padding-top: 50px; }

}

@media screen and (max-width: 765px) {
.hp_galerie {padding-right: 30px; padding-left: 30px; padding-bottom: 30px;  }
.hp_galerie .container {padding-top:  30px;   }
h1{font-size: 18px; line-height: 28px; }
h2{font-size: 24px; line-height: 32px; }
h1.titre_page {font-size: 36px; line-height: 42px;   }
.accroche .container, .zone_intro .container { padding: 20px ; }
.zone_intro .container  {padding-top: 40px; }
.logo {top: 20px; left: 35px }
.navempr {top: 35px; padding: 10px }
.row .col-md-6:first-child {padding-right: 0px }
.row .col-md-6:last-child {padding-left: 0px}
.gal .filtr-container a .img-responsive {   min-height: 150px ; max-height: 150px;  border-radius: 15px }
.wp-block-media-text__content {padding: 30px 0px 0 0px !important;}

}

@media screen and (max-width: 560px) {
h1.titre_page {font-size: 24px; line-height: 32px;   }
.slider_hp li.ms-image, .slider_hp li.flex-active-slide  {width: 350% !important; margin-right: -550% !important}	
.zone_intro,.hp_galerie, .hp_confiance, .contenu {padding-left: 10px; padding-right: 10px}
.hp_galerie .gal .filtr-container a:nth-child(2n+1) .img-responsive, .hp_galerie .gal .filtr-container a:nth-child(2n+0) .img-responsive  {   border-radius: 15px 15px 15px 15px;}
.gal .filtr-container a .img-responsive {   min-height: 150px ; max-height: 150px;  border-radius: 15px }
.hp_galerie .gal .filtr-container a .img-responsive {   min-height: 150px ; max-height: 150px; }
.wp-block-button__link, .formulaire input[type="submit"], .formulaire button, .formulaire .button {font-size: 14px; }
	
}