/*
Theme Name: Divi Community Child Theme
Description: Theme enfant de Divi par Divi Community
Author: Julien - WebMate
Author URI: https://www.divi-community.fr
Template: Divi
Version: 1.1
*/

/*
  ____ _____     _____      ____ ___  __  __ __  __ _   _ _   _ ___ _______   __
 |  _ \_ _\ \   / /_ _|    / ___/ _ \|  \/  |  \/  | | | | \ | |_ _|_   _\ \ / /
 | | | | | \ \ / / | |    | |  | | | | |\/| | |\/| | | | |  \| || |  | |  \ V /
 | |_| | |  \ V /  | |    | |__| |_| | |  | | |  | | |_| | |\  || |  | |   | |
 |____/___|  \_/  |___|    \____\___/|_|  |_|_|  |_|\___/|_| \_|___| |_|   |_|

*/


/* 
** CENTRER DU CONTENU VERTICALEMENT 
** Voir tuto : https://www.divi-community.fr/snippets-divi/centrer-du-contenu-verticalement
*/

.dc-centrer-verticalement {
	display: flex;
	flex-direction: column;
	justify-content: center;
  	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	 -moz-box-orient: vertical;
	 -moz-box-direction: normal;
	  -ms-flex-direction: column;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
}


/*
** INVERSER LE SENS DES COLONNES SUR MOBILE
** Voir tuto : https://www.divi-community.fr/snippets-divi/inverser-ordre-des-colonnes-sur-mobile
*/

@media only screen and (max-width : 980px) {
	.dc-inverser-colonnes--section .dc-inverser-colonnes--ligne {
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-webkit-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
}


/*
** MENU MOBILE : en pleine largeur et le hamburger devient une croix pour fermer
*/

.et_mobile_menu {
	margin-left: -30px;
	padding: 5%;
	width: calc( 100% + 60px);
}

.mobile_nav.opened .mobile_menu_bar:before {
	content: "\4d";
}


/* 
** AUGMENTER LA LARGEUR CHAMP RÉSULTAT CAPTCHA 
** Parfois, suivant la taille du texte, certains chiffres du résultat sont masqués
*/
.et_pb_contact_right p input {
	max-width: 50px;
}


/*
** METTRE EXPOSANTS ET INDICES À LA BONNE TAILLE
** Généralement, ils sont bien trop gros…
*/
sup, sub {
    font-size: 70%;
}

input[type=checkbox] {
  display: none;
  height: 0;
  width: 0;
}
input[type=checkbox] + .textlabel {
  position: relative;
}
input[type=checkbox] + .textlabel:before {
  font-family: FontAwesome;
  display: inline-block;
  content: "\f096";
  letter-spacing: 6px;
  font-size: 25px;
  position: absolute;
  left: 0;
  top: -12px;
  color: #393f4d;
}
input[type=checkbox] + .textlabel:after {
    content: "Non";
    display: inline;
}
input[type=checkbox]:checked + .textlabel:after {
    content: "Oui";
}

input[type=checkbox]:checked + .textlabel:before {
  content: "\f046";
  letter-spacing: 10px;
}
input[type=checkbox].toggle + .textlabel {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 20px;
  height: auto;
  color: #393f4d;
  display: block;
  padding-left: 50px;
}
input[type=checkbox].toggle + .textlabel:before {
  content: "\f204";
  font-size: 38px;
  top: 0px;
}
input[type=checkbox].toggle + .textlabel.text-lowercase {
  text-transform: lowercase;
  letter-spacing: 0px;
  font-size: 14px;
}
input[type=checkbox].toggle:checked + .textlabel:before {
  content: "\f205";
  letter-spacing: 10px;
  color: #ef9598;
}
@media (min-width: 768px) {
  input[type=checkbox].toggle {
    padding-left: 45px;
    font-size: 13px;
  }
  input[type=checkbox].toggle + .textlabel {
    padding-left: 55px;
  }
  input[type=checkbox].toggle + .textlabel:before {
    line-height: 1.5;
    top: -17px;
  }
  input[type=checkbox].toggle.recipe-filters + .textlabel {
    font-size: 18px;
  }
  input[type=checkbox].toggle.recipe-filters + .textlabel:before {
    font-size: 29px;
    line-height: 1.5;
    top: -9px;
  }
}


.checkbox-group {
  display: flex;
  flex-wrap: wrap;
  margin-left: auto;
  margin-right: auto;
  user-select: none;
}
.checkbox-group > * {
  margin: 0.5rem 0.5rem;
}

.checkbox-group-legend {
  font-size: 1.5rem;
  font-weight: 700;
  color: #9c9c9c;
  line-height: 1.125;
  margin-bottom: 1.25rem;
}

.checkbox-input {
  clip: rect(0 0 0 0);
  clip-path: inset(100%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.checkbox-input:checked + .checkbox-tile {
  border-color: #ef9598;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  color: #ef9598;
}
.checkbox-input:checked + .checkbox-tile:before {
  transform: scale(1);
  opacity: 1;
  background-color: #ef9598;
  border-color: #ef9598;
}
.checkbox-input:checked + .checkbox-tile .checkbox-icon, .checkbox-input:checked + .checkbox-tile .checkbox-label {
  color: #ef9598;
}
.checkbox-input:focus + .checkbox-tile {
  border-color: #ef9598;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1), 0 0 0 4px #b5c9fc;
}

.checkbox-input:checked + .checkbox-tile.checkbox-danger {
  border-color: #f4ad49;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  color: #f4ad49;
}
.checkbox-input:checked + .checkbox-tile.checkbox-danger:before {
  transform: scale(1);
  opacity: 1;
  background-color: #f4ad49;
  border-color: #f4ad49;
}
.checkbox-input:checked + .checkbox-tile.checkbox-danger .checkbox-icon, .checkbox-input:checked + .checkbox-tile.checkbox-danger .checkbox-label {
  color: #f4ad49;
}
.checkbox-input:focus + .checkbox-tile.checkbox-danger {
  border-color: #f4ad49;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1), 0 0 0 4px #b5c9fc;
}

.checkbox-input:focus + .checkbox-tile:before {
  transform: scale(1);
  opacity: 1;
}

.checkbox-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 14rem;
  min-height: 14rem;
  border-radius: 0.5rem;
  border: 2px solid #fae0d3;
  background-color: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  transition: 0.15s ease;
  cursor: pointer;
  position: relative;
}
.checkbox-tile.small {
  width: 6.8rem;
  min-height: 6.8rem;
}

.variation-radios.checkbox-group .checkbox-tile {
  width: 100%;
  min-height: 50px;
  text-align: left;
  align-items: flex-start;
  padding: 0 30px;
  box-shadow: none !important;
  border: 1px solid #ef9598;
}
.variation-radios.checkbox-group > * {
  display: block;
  flex: 1 1 100%;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 1200px){
    .variation-radios.checkbox-group > * { max-width: 75% }
}

.variation-radios.checkbox-group .checkbox-label {
    color: #393f4d;
}

.checkbox-tile:before {
  content: "";
  position: absolute;
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  border: 2px solid #fae0d3;
  background-color: #fff;
  border-radius: 50%;
  top: 0.25rem;
  left: 0.25rem;
  opacity: 0;
  transform: scale(0);
  transition: 0.25s ease;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='192' height='192' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'%3E%3C/rect%3E%3Cpolyline points='216 72.005 104 184 48 128.005' fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='32'%3E%3C/polyline%3E%3C/svg%3E");
  background-size: 12px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.variation-radios.checkbox-group .checkbox-tile:before {
    top: 0;
    bottom: 0;
    margin: auto 0;
    left: 1rem;
    opacity: 1;
    transform: scale(1);
    width: .75rem;
    height: .75rem;
    border: 1px solid #ef9598;
}

.checkbox-tile:hover {
  border-color: #ef9598;
}
.checkbox-tile.checkbox-danger:before {
  font: normal normal normal 14px/1 FontAwesome;
  content: "\f00d";
  background-image: none;
  line-height: 20px;
  text-indent: 6px;
  font-size: 11px;
  color: white;
  opacity: 0;
}
.checkbox-tile.checkbox-danger:hover {
  border-color: #f5ae4c;
}
.checkbox-tile:hover:before {
  transform: scale(1);
  opacity: 1;
}

.variation-radios.checkbox-group .checkbox-tile:hover {
    background-color: rgba(239,149,152,.1);
}
.variation-radios.checkbox-group .checkbox-tile:hover .checkbox-label {
    color: black;
}

.checkbox-icon {
  transition: 0.375s ease;
  color: #494949;
}
.checkbox-icon .img {
  width: 3rem;
  height: 3rem;
}

.checkbox-label {
  color: #707070;
  transition: 0.375s ease;
  text-align: center;
  padding: 0 15px;
}

label.radio-button {
  display: flex;
  cursor: pointer;
  font-weight: 500;
  position: relative;
  overflow: hidden;
  margin-bottom: 0.375em;
}
label.radio-button input {
  position: absolute;
  left: -9999px;
}
label.radio-button input:checked + span {
  background-color: #f7d5d6;
}
label.radio-button input:checked + span:before {
  background-color: #ef9598;
  color: white;
}
label.radio-button input:checked + span:after {
  opacity: 1;
}
label.radio-button span {
  display: flex;
  align-items: center;
  padding: 0.375em 60px 0.375em 0.375em;
  transition: 0.25s ease;
  color: #ef9598;
  font-size: 20px;
  background-color: rgba(239, 149, 152, 0.1);
  border: 1px solid #ef9598;
  position: relative;
  width: 100%;
}
label.radio-button span:hover {
  background-color: #f7d5d6;
}
label.radio-button span:before {
  display: flex;
  flex-shrink: 0;
  content: "";
  background-color: #fff;
  border: 1px solid #ef9598;
  width: 1.5em;
  height: 1.5em;
  margin-right: 0.375em;
  transition: 0.25s ease;
  line-height: 30px;
  text-indent: 8px;
}
label.radio-button span:after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f00c";
    color: #ef9598;
    position: absolute;
    opacity: 0;
    right: 15px;
    top: 0;
    bottom: 0;
    height: 15px;
    margin: auto 0;
}
.form-group label.radio-button:nth-of-type(1) span:before { content: "A"; }
.form-group label.radio-button:nth-of-type(2) span:before { content: "B"; }
.form-group label.radio-button:nth-of-type(3) span:before { content: "C"; }
.form-group label.radio-button:nth-of-type(4) span:before { content: "D"; }
.form-group label.radio-button:nth-of-type(5) span:before { content: "E"; }
.form-group label.radio-button:nth-of-type(6) span:before { content: "F"; }
.form-group label.radio-button:nth-of-type(7) span:before { content: "G"; }
.form-group label.radio-button:nth-of-type(8) span:before { content: "H"; }
.form-group label.radio-button:nth-of-type(9) span:before { content: "I"; text-indent: 13px; }
.form-group label.radio-button:nth-of-type(10) span:before { content: "J"; }
.form-group label.radio-button:nth-of-type(11) span:before { content: "K"; }
.form-group label.radio-button:nth-of-type(12) span:before { content: "L"; }