/*
Theme Name: CLB
Author: Sept24
Text Domain: clb
Make CSS edit in /css/main.css
*/

.faq-filter { float:left; width:100%; margin:0; padding:30px 0; background-color:#FDB924; }
.faq-filter .container { width:100%; margin:0 auto; text-align:center; }
.faq-filter .container ul { list-style:none!important; margin:0; padding:0; display:inline-block; }
.faq-filter .container ul li { position:relative; margin:0 12px; padding:8px 18px; display:inline; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:0.9em; color:#FFF; font-weight:700; text-transform:uppercase; cursor:pointer; }
.faq-filter .container ul li.current { color:#3D3D3D; background-color:#FAC758; }
.faq-filter .container ul li:before { position:absolute; top:0; right:-13px; width:2px; height:35px; margin:0; padding:0; background-color:#F9D076; content:" "; }
.faq-filter .container ul li:last-child:before { display:none; }

.page-template-template-faq .faq-questions, .page-template-template-faq .black-zone, .page-template-template-faq footer { float:left; width:100%; }

.page-template-template-faq .page-header { padding:40px 0 160px 0; text-align:center; }
.page-template-template-faq .page-header h1 { width:100%; margin:14px 0 40px 0; font-size:3.4em!important; }
.page-template-template-faq .page-header p { width:60%; margin:0 20%; }

.faq-questions { margin:60px 0; }
.faq-questions .container { width:1715px; margin:0 auto; }
.faq-questions .container .bloc-question { position:relative; width:50%; margin:0; padding:0 0 80px 0; display:inline; min-height: 280px; }
.faq-questions .container .bloc-question .question { width:70%; margin:0; padding:30px; background-color:#F2F2F2; }
.faq-questions .container .bloc-question .question p { font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:1.4em; line-height:35px; }
.faq-questions .container .bloc-question .question span { float:right; margin:20px 0 0 0; padding:5px 15px; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:0.8em; color:#020306; text-transform:uppercase; border:1px solid #020306; text-decoration:none; cursor:pointer; font-size: .888em;
font-weight: 400;
line-height: 1;
display: inline-block;
padding: .8em 1.2em;
text-decoration: none;
text-transform: uppercase;
border-radius: 0;}
.faq-questions .container .bloc-question .details { position:relative; width:calc(30% - 30px); margin:0 0 0 30px; padding:0; }
.faq-questions .container .bloc-question .details p { float:right; width:calc(100% - 70px); margin:50px 70px 0 0; padding:0; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:0.9em; text-align:right; }
.faq-questions .container .bloc-question .details img { position:absolute; top:30px; width:80px; height:80px; margin:0; padding:0; }

.faq-questions .container .bloc-question.bloc-question-gauche { float:left; width:calc(50% - 2px); border-right:2px solid #F2F2F2; }
.faq-questions .container .bloc-question.bloc-question-gauche .question { float:left; }
.faq-questions .container .bloc-question.bloc-question-gauche .details { float:right; }
.faq-questions .container .bloc-question.bloc-question-gauche .details img { right:-40px;  }

.faq-questions .container .bloc-question.bloc-question-droite { float:right; }
.faq-questions .container .bloc-question-2 { margin-top:130px; }
.faq-questions .container .bloc-question.bloc-question-droite .question { float:right; }
.faq-questions .container .bloc-question.bloc-question-droite .details { float:left; margin:0 30px 0 0; }
.faq-questions .container .bloc-question.bloc-question-droite .details img { left:-44px; }
.faq-questions .container .bloc-question.bloc-question-droite .details p { float:left; margin:50px 0 0 70px; text-align:left; }

.page-template-template-faq .wpcf7-response-output { display:none; }

.faq-modal { position:fixed; top:0; left:0; width:100%; height:100%; margin:0; padding:0; background:rgba(242, 242, 242, 0.92); z-index:9999; display:none; }
.faq-modal .container { position:fixed; left:calc(50% - 400px); width:800px; height:100%; margin:0; padding:40px 30px; background:#FFF; text-align:center; overflow:auto; }
.faq-modal .container img { float:left; width:110px; height:110px; margin:0 calc(50% - 55px); }
.faq-modal .container h2 { float:left; width:100%; margin:25px 0 6px 0; padding:0; font-size:1.4em; text-align:left; color:#444; line-height:26px; }
.faq-modal .container .name { float:left; width:100%; margin:0; padding:0; font-size:0.8em; text-align:left; color:#AAA; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
.faq-modal .container .answers { float:left; width:100%; margin:30px 0; padding:0; }
.faq-modal .container .answers img { float:left; width:248px; height:auto; margin:0 20px 0 0; padding:0; border:1px solid #F2F2F2; border-radius:6px; -webkit-border-radius:6px; }
.faq-modal .container .answers .answer { float:left; width:calc(100% - 270px); margin:0; padding:0; font-size:1.1em; text-align:left; font-weight:400; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; line-height:26px; }
.faq-modal .container span { float:left; width:130px; margin:0 calc(50% - 65px); padding:6px 0; font-size:0.85em; color:#FFF; background-color:#FDB924; font-weight:600; cursor:pointer; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; }

.page-template-template-faq .black-zone { float:left; width:100%; background:#000; }
.page-template-template-faq .black-zone h2 { float:left; width:700px; font-size:3em; margin:0; padding:28px 0; color:#FFF; }
.page-template-template-faq .black-zone form { float:right; width:calc(100% - 700px); }


.page-template-template-faq .black-zone form input[type=text], .page-template-template-faq .black-zone form input[type=email] { float:left; width:calc(100% - 30px); margin:0 10px; padding:8px 5px; background:#000; border:0; border-bottom:1px solid #FFF; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:0.85em; color:#FFF; font-weight:300; }


.page-template-template-faq .black-zone form input[type=text]:hover, .page-template-template-faq .black-zone form input[type=text]:focus, .page-template-template-faq .black-zone form input[type=email]:hover,  .page-template-template-faq .black-zone form input[type=email]:focus { color:#FDB924; border-color:#FDB924; }


.page-template-template-faq .black-zone form .half-size { width:calc(50% - 30px)!important; margin:0 10px 8px 10px!important; }


.page-template-template-faq .black-zone form .third-size { width:calc(33% - 30px)!important; margin:0 10px 8px 10px!important; }



.page-template-template-faq .black-zone form .question { margin-bottom:0!important; width:calc(100% - 180px)!important; }
.page-template-template-faq .black-zone form input[type=submit] { float:right; width:110px; margin:0 10px 0 0; padding:7px 12px; background:#FDB924; border:0; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:0.75em; color:#FFF; font-weight:400; text-transform:uppercase; }
.page-template-template-faq .black-zone form .autorisation { float:left; width:100%; margin:6px 0 0 0; padding:0; }
.page-template-template-faq .black-zone .wpcf7-list-item-label { float:right; width:calc(100% - 35px)!important; font-size:0.7em; }
.page-template-template-faq .black-zone .wpcf7-list-item.first.last { float:left; width:100%; margin:17px 0 10px 0; }
.page-template-template-faq .black-zone form input[type=checkbox] { float:left; margin:0 7px 0 10px; }
.page-template-template-faq .wpcf7-response-output { float:left; width:100%; margin:0 10px 0 10px; padding:0; border:0; }
.page-template-template-faq .wpcf7-form-control-wrap { position:relative; }
.page-template-template-faq .wpcf7-form-control-wrap .wpcf7-not-valid-tip { display:none; }
.page-template-template-faq .black-zone .ajax-loader { display:none; }
.page-template-template-faq .black-zone .wpcf7-validation-errors { font-size:0.9em; }

.black-zone{
    position: relative;
    z-index: 1005;
}

@media (min-width:1180px) and (max-width:1715px) {
	.faq-questions .container { width:calc(100% - 40px); margin:0 20px; }
	.faq-modal .container { top:0!important; left:0!important; width:800px; margin:0 calc(50% - 400px)!important; }
	.faq-modal .container img { float:left; width:110px; height:110px; margin:0 calc(50% - 55px); }
	.faq-modal .container span { margin-bottom:40px; }
	.page-template-template-faq .black-zone .wpcf7-list-item-label { float:left; width:calc(100% - 35px); }
	.page-template-template-faq .black-zone input[type=checkbox] { float:left; margin-top:3px; }
}

@media (min-width:840px) and (max-width:1280px) {
	.page-template-template-faq .black-zone h2 { float:left!important; width:100%!important; font-size:1.8em!important; margin-top:0!important; text-align:center;}
	.page-template-template-faq .black-zone form { float:left!important; width:100%!important; }

	.faq-modal .container { top:0!important; left:0!important; width:calc(100% - 30px); margin:0 15px!important; }
	.faq-modal .container img { float:left; width:110px; height:110px; margin:0 calc(50% - 55px); }
	.faq-modal .container span { margin-bottom:40px; }

	.faq-questions .container { width:calc(100% - 40px)!important; margin:0 20px!important; }
	.faq-questions .container .bloc-question-2 { margin-top:0; }
	.faq-questions .container { width:100%; margin:0 auto; }
	.faq-questions .container .bloc-question { float:left!important; width:100%!important; border-right:0!important; }
	.faq-questions .container .bloc-question .question { float:right!important; }
	.faq-questions .container .bloc-question.bloc-question-gauche .details { float:left!important; }
	.faq-questions .container .bloc-question .details { margin:0 30px 0 0!important; }
	.faq-questions .container .bloc-question .details img { position:initial!important; top:0!important; left:0!important; float:left!important; margin:30px 0 0 0!important; }
	.faq-questions .container .bloc-question .details p { float:left!important; width:auto!important; margin:50px 0 0 10px!important; text-align:left!important; }
		.page-template-template-faq .black-zone .wpcf7-list-item-label { float:right; width:calc(100% - 35px); }
	.page-template-template-faq .black-zone input[type=checkbox] { float:left; margin-top:3px; }
}

@media (max-width:840px) {
	.faq-modal .container .answers { float:left; width:100%; margin:30px 0; padding:0; }
	.faq-modal .container .answers img { float:left; width:100%; height:auto; margin:0 20px 0 0; padding:0; border:1px solid #F2F2F2; }
	.faq-modal .container .answers .answer { float:left; width:100%; margin:0; padding:0; font-size:1.1em; text-align:left; font-weight:400; font-family:'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; line-height:26px; }

	.page-template-template-faq .black-zone h2 { float:left!important; width:100%!important; font-size:1.8em!important; margin-top:0!important; text-align:center;}
	.page-template-template-faq .black-zone form { float:left!important; width:100%!important; }

	.page-template-template-faq .page-header { padding:40px 0 80px 0; text-align:center; }
	.page-template-template-faq .page-header h1 { font-size:2.4em!important; }
	.page-template-template-faq .page-header p { width:90%; margin:0 5%; }

	.faq-modal .container { top:0!important; left:0!important; width:calc(100% - 30px); margin:0 15px!important; }
	.faq-modal .container img { float:left; width:110px; height:110px; margin:0 calc(50% - 55px); }
	.faq-modal .container span { margin-bottom:40px; }


	.faq-filter .container { width:100%; margin:0; padding:0 20px; text-align:center; }
	.faq-filter .container ul li { float:left!important; width:100%!important; margin:0 0 10px 0!important; padding:8px 0!important; display:inline!important; text-align:center!important; }
	.faq-filter .container ul li:before { display:none!important; }

	.faq-questions .container { width:calc(100% - 40px)!important; margin:0 20px!important; }
	.faq-questions .container .bloc-question-2 { margin-top:0; }
	.faq-questions .container { width:100%; margin:0 auto; }
	.faq-questions .container .bloc-question { float:right!important; width:100%!important; border-right:0!important; }
	.faq-questions .container .bloc-question .question { float:left!important; width:100%!important; }
	.faq-questions .container .bloc-question.bloc-question-gauche .details { float:left!important; }
	.faq-questions .container .bloc-question .details { float:left!important; width:100%!important; margin:0!important; }
	.faq-questions .container .bloc-question .details img { position:initial!important; top:0!important; left:0!important; float:left!important; margin:15px 0 0 0!important; }
	.faq-questions .container .bloc-question .details p { float:left!important; width:auto!important; margin:35px 0 0 10px!important; text-align:left!important; }
		.page-template-template-faq .black-zone .wpcf7-list-item-label { float:right; width:calc(100% - 35px); }
	.page-template-template-faq .black-zone input[type=checkbox] { float:left; margin-top:3px; }
}

@media (max-width:550px) {
	.page-template-template-faq .page-header img { width:calc(100% - 40px); margin:0 20px; }
	.page-template-template-faq .black-zone .wpcf7-list-item-label { float:right; width:calc(100% - 35px); }
	.page-template-template-faq .black-zone input[type=checkbox] { float:left; margin-top:3px; }
  .page-template-template-faq .black-zone form .third-size { width:calc(100% - 30px)!important; }
}

span.wpcf7-list-item { display:block !important; }
.recette-details-ipa .nomListe{margin-left: -21px;font-size: 1.2em;font-weight: 400;line-height: 1.1;padding-top:20px;padding-bottom: 10px; display:block;}
.recette-details-ipa .nomListePrep{font-size: 1.2em;font-weight: 400;line-height: 1.1;padding-top:20px;padding-bottom: 10px; display:block;}
