/*
Theme Name: Site Emploi ST-E
Author: Anthony, Les Imageurs
Description: Template créé pour le site Pôle Promotion
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: emploi-ste

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/*####################
##### TYPORAPHIE ####
######################*/

a:visited {
	color: initial;
}

.center {
	text-align: center;
}

.wp-block-button.empty a.wp-block-button__link{display:block; font-size:0; width:48px; height:48px;}
.wp-block-button.empty a.wp-block-button__link:before{display:none;}

#to_top{position:fixed; bottom:30px; right:30px; color:var(--cl-red); font-size:250%; z-index:99;}
#to_top i{background-color:var(--cl-white); border:1px solid var(--cl-white); border-radius:50%;}
#to_top a{color:var(--cl-red);}
#to_top:hover a{color:var(--cl-white);}
#to_top:hover i{background-color:var(--cl-red); border:1px solid var(--cl-red);}
#to_top a:focus{color:var(--cl-white);}
#to_top a:focus i{background-color:var(--cl-red); outline:3px solid var(--cl-red); outline-offset:3px; border-color:transparent;}

.filtering img{display:inline-block; vertical-align:middle; width:24px; margin-right:5px;}

#loader{position:relative; padding:40px 0; text-align:center; color:var(--cl-gray-text);}
#loader span{position:relative; padding:0 30px; background-color:var(--cl-white);}
#loader img{display:inline-block; vertical-align:middle; width:24px; margin-right:5px;}
#loader:before{content:""; position:absolute; top:50%; left:0; height:1px; width:100%; background-color:var(--cl-gray-text); z-index:0;}

.width-60{width:60%;}

.wp-block-group.is-layout-flex{flex-wrap:wrap !important;}

footer{position:relative;}
footer > *{position:relative; z-index:1;}
footer .wp-block-group.is-layout-flex{gap:2em;}
footer:after{content:""; position:absolute; bottom:0; right:0; height:100%; background:url(images/deco_e_white.svg) scroll no-repeat right bottom / auto 60%; width:100%; z-index:0;}
footer .nav{font-size:80%;}
footer .nav a{text-decoration:none;}

footer a{text-decoration:none;}

.nlform-container{width:58%; margin-top:-150px;}
.nlform-title{position:relative; font-size:var(--size-h3); font-weight:400; padding-left:35px; line-height:1;}
.nlform-title:before{content:""; position:absolute; top:3px; left:0; height:24px; width:24px; background:url(images/enveloppe.svg) scroll no-repeat left top / contain;}
.mailpoet_form{width:100%; display:flex; flex-wrap:wrap; gap:1rem; padding:0 !important;}
.mailpoet_form > br, .mailpoet_form > p{display:none;}
.mailpoet_form .input-mail{border:1px solid var(--cl-gray-border); padding:5px 10px; border-radius:8px; flex:0 0 70%; margin:0 !important;}
.mailpoet_form .input-mail label{color:var(--cl-gray); background-color:var(--cl-light-gray); font-size:var(--size-small) !important; padding-inline:5px; margin:-20px 0 0; width:max-content;}
.mailpoet_form .input-mail input{border:none; outline:none; background-color:var(--cl-light-gray); padding:0;}
.mailpoet_form .nl-btn{position:relative; background-color:var(--cl-red); border-radius:8px; border:1px solid var(--cl-red);}
.mailpoet_form .nl-btn:before{content:""; position:absolute; top:50%; left:10px; translate:0 -50%; background:url(images/arrow_white.svg) scroll no-repeat center / contain; width:12px; height:6px}
.mailpoet_form .nl-btn:hover{background-color:var(--cl-white); color:var(--cl-red);}
body.pro .mailpoet_form .nl-btn:hover:before{background-image:url(images/arrow_green.svg)}
.mailpoet_submit{background-color:transparent; outline:none; color:var(--cl-white); font-weight:500; font-size:100%; padding:0 15px 0 30px !important; height:100%; width:100%; text-align:left;}
.mailpoet_form .nl-btn:hover .mailpoet_submit{color:var(--cl-red);}

.mailpoet_form .mailpoet_message{flex:0 0 100%;}

@media all and (max-width:991px){
	.nlform-container{width:90%;}
}

@media all and (max-width:600px){
	#to_top{bottom:10px; right:10px; font-size:200%;}

	.nlform-container{width:100%;}
	.mailpoet_form .input-mail{flex:100%;}

}