.commande-wrapper {
	width: 100%;
	font-family: 'Lato';
}

.clear {
	float: none;
	clear: both;
}

.label_form {
	display: block;
	font-size: 12px
}

.input_form {
	width: 100%;
	text-align: right
}

.form-simulation {
	text-align: center;
}

#send-simul {
	margin-bottom: 20px;
}

.btn-simulation {
	background: #dbdbdb;
	padding: 8px 15px;
	border: none;
	cursor: pointer;
}

.btn-simulation:hover {
	background: #bababa;
}

.btn-simulation-2 {
	background: #b1d675;
	padding: 15px 30px;
	border: none;
	cursor: pointer;
	text-transform: uppercase;
}

.btn-simulation-2:hover {
	background: #89ab53;
}

.form-simulation h3 {
	font-size: 18px;
	color: white;
}

.sep-simul {
	border: 3px solid #b1d675;
	width: 30%;
	margin: 0 auto;
	height: 3px;
	margin-top: 20px;
	margin-bottom: 20px;
}

.form-simulation h2 {
	font-size: 17px;
	color: white;
}

.form-simulation h2 .tarifs {
	font-weight: bold;
	font-size: 19px;
}

#resultat_simulation h2 {
	border: 3px solid white;
	padding: 15px 20px;
	margin-bottom: 20px;
	display: inline-block
}

.d-flex {
	display: flex;
}

.choix_interieur.flex-item {
	flex: 1 1 0;
}

.choix_exterieur.flex-item {
	flex: 1 1 0;
}

.titre_choix {
	text-align: center;
	font-weight: bold;
}

/**
* CHECKBOX
*/
.ck-button {
    margin:4px;
    background-color:#FFF;
    overflow:auto;
    width: 200px;
    display: inline-block;
}

.ck-button-img {
    margin:4px;
/*     background-color:#FFF; */
    overflow:auto;
    color: white;
    width: 250px;
    display: inline-block;
}

.ck-button-img input + div{
	border: 5px solid #fff;
	padding: 0 !important;
	height: 145px;
}

input[type=checkbox].input_error + div,
input[type=radio].input_error + div,
input[type=text].input_error {
	border: 1px solid red;
}

.ck-button-img:hover input + div{
	border: 5px solid #b1d675;
}
.ck-button:hover {
    background: #b1d675;
}

.ck-button label {
}

.ck-button label div, .ck-button-img label div {
    text-align:center;
    padding:10px 0px;
    display:block;
    width: 100%;
    cursor: pointer;
    color: #333;
}

.ck-button label input, .ck-button-img label input {
    position:absolute;
    top:-20px;
    display: none;
}

.ck-button-img input:checked + div {
	border: 5px solid #b1d675;
}

.ck-button input:checked + div {
    background-color:#b1d675;
}

.prevEtape {
		display: none;
	}

@media screen and (max-width: 640px) {
	.ck-button, .ck-button-img {
	    display: block !important;
    	width: 98% !important;
	}
	input[type=text] {
		width: 100% !important;
		margin-bottom: 5px !important;
	}
	
	.ck-button-img img{
		width: 100%;
	}
	
	.ck-button-img input + div {
		height: auto;
	}
	
}

form#form_envoi_devis{
	display: flex;
}


/* ==========================================================
 * Spinner
 * =========================================================*/
.spinner{
	width:100px;
	height:100px;
	margin:30px auto;
	position:relative;
	-webkit-animation: rotateit 1.3s linear infinite;
	-moz-animation: rotateit 1.3s linear infinite;
	animation: rotateit 1.3s linear infinite;
}
@-webkit-keyframes rotateit {
	from {
		-webkit-transform: rotate(360deg);
	}
	to {
		-webkit-transform: rotate(0deg);
	}
}
@-moz-keyframes rotateit {
	from {
		-moz-transform: rotate(360deg);
	}
	to {
		-moz-transform: rotate(0deg);
	}
}
@keyframes rotateit {
	from {
		transform: rotate(360deg);
	}
	to {
		transform: rotate(0deg);
	}
}
/*=======================================================
 * Circles
 *======================================================*/
.spinner.circles div{
	width: 15px;
	height: 15px;
	border-radius:50%;
	background: black;
	position: absolute;
	top: 35px;
	left: 45px;
}
.spinner.circles div:nth-child(1){
	-webkit-transform: rotate(0deg) translate(0, -35px) scale(1.4);
	-moz-transform: rotate(0deg) translate(0, -35px) scale(1.4);
	transform: rotate(0deg) translate(0, -35px) scale(1.4);
}
.spinner.circles div:nth-child(2){
	-webkit-transform: rotate(45deg) translate(0, -35px) scale(1.2);
	-moz-transform: rotate(45deg) translate(0, -35px) scale(1.2);
	transform: rotate(45deg) translate(0, -35px) scale(1.2);
	opacity:0.7;
}
.spinner.circles div:nth-child(3){
	-webkit-transform: rotate(90deg) translate(0, -35px) scale(1.1);
	-moz-transform: rotate(90deg) translate(0, -35px) scale(1.1);
	transform: rotate(90deg) translate(0, -35px) scale(1.1);
	opacity:0.6;
}
.spinner.circles div:nth-child(4){
	-webkit-transform: rotate(135deg) translate(0, -35px) scale(0.9);
	-moz-transform: rotate(135deg) translate(0, -35px) scale(0.9);
	transform: rotate(135deg) translate(0, -35px) scale(0.9);
	opacity:0.5;
}
.spinner.circles div:nth-child(5){
	-webkit-transform: rotate(180deg) translate(0, -35px) scale(0.7);
	-moz-transform: rotate(180deg) translate(0, -35px) scale(0.7);
	transform: rotate(180deg) translate(0, -35px) scale(0.7);
	opacity:0.4;
}
.spinner.circles div:nth-child(6){
	-webkit-transform: rotate(225deg) translate(0, -35px) scale(0.5);
	-moz-transform: rotate(225deg) translate(0, -35px) scale(0.5);
	transform: rotate(225deg) translate(0, -35px) scale(0.5);
	opacity:0.3;
}
.spinner.circles div:nth-child(7){
	-webkit-transform: rotate(270deg) translate(0, -35px) scale(0.3);
	-moz-transform: rotate(270deg) translate(0, -35px) scale(0.3);
	transform: rotate(270deg) translate(0, -35px) scale(0.3);
	opacity:0.2;
}
.spinner.circles div:nth-child(8){
	-webkit-transform: rotate(315deg) translate(0, -35px) scale(0.1);
	-moz-transform: rotate(315deg) translate(0, -35px) scale(0.1);
	transform: rotate(315deg) translate(0, -35px) scale(0.1);
	opacity:0.1;
}