/* reset */
body, p, ul, ol, form, input, button, select, h1, h2, h3, h4, h5, h6, dl, dt, dd, blockquote, address{margin:0;padding:0;}
h1, h2, h3, h4, h5, h6{font-size:14px;font-weight:400;}
ul, ol{list-style:none;}
img, abbr{border:0;}
img{-ms-interpolation-mode:bicubic;vertical-align:middle;}


/* global */
body, html{height:100%;}
body{color:#fff;}
body, input, select, textarea, button{font:16px/1.6 'Open Sans', Arial;}
input[type=text], input[type=number], textarea, select{width:100%;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;padding:15px;background-color:#f4f4f4;border:none;border-radius:2px;}
input[type=submit], button{border:none;cursor:pointer;-webkit-appearance:none;}
ul{-webkit-transform:translateZ(0);-webkit-perspective:1000;-webkit-backface-visibility:hidden;}
textarea{min-height:100px;}
p{margin-bottom:25px;}
p:last-child{margin-bottom:0 !important;}
a{text-decoration:underline;color:#fff;}
a:hover{text-decoration:none;}
b{font-weight: 600;}
strong{font-weight:600;}
img{vertical-align:middle;width:auto\9;height:auto;max-width:100%;-ms-interpolation-mode:bicubic;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
h3:first-child, h4:first-child, h5:first-child, h6:first-child{margin-top:0;}


/* section */
#page{display:table;width:100%;height:100%;background:url(../images/commande/chrismas-tree.jpg) center center no-repeat;background-size:cover;}
#page-inner{display:table-cell;vertical-align:middle;background-color:rgba(0, 0, 0, 0.6);}
#page-inner-inner{max-width:600px;padding:15px;margin:auto;}

#page-header{margin-bottom:60px;text-align:center;font-size: 36px;margin-top: 20px;}
#page-header a {text-decoration: none;font-weight: 600;font-size: 36px;}

#page-body{text-align:center;}
#page-message{position:fixed;top:0;right:0;left:0;padding:20px;background-color:rgba(144, 216, 5, 0.65);text-align:center;text-shadow:0 1px rgba(0, 0, 0, 0.25);letter-spacing:-0.5px;}
#page-message.is-warning{background-color:rgba(255, 0, 0, 0.65);}

.error-no-product {position: relative;display: block;font-size: 14px;margin: 0;margin-top: -25px;margin-bottom: -20px;background: #ff2626;width: 100%;padding: 10px 0;color: #FFF;top: 0;opacity: 0;transition: all 0.24s ease-in;text-align: center;}
.error-occured {position: relative;display: block;font-size: 14px;margin: 0;background: #ff2626;width: 100%;padding: 10px 0;color: #FFF;top: 0;transition: all 0.24s ease-in;text-align: center;}


#form-validation {padding: 0px;}

.link-close {position: absolute;top: 20px;right: 30px;opacity: 0.8;transition: all 0.25s ease-in-out;}
.link-close:hover {opacity: 1;}
.link-close .fa {font-size: 28px;}

.division {position: relative;width: 100%;height: 1px;background: #cdcdcd;margin: 10px 0;}
.recap	{margin-top: 20px;}
.container-confirmation .recap-text {margin-top: 20px;font-weight: 600;color: #a3a3a3;font-size: 14px;}
.recap p {font-size: 16px;}
.recap .division {width: 50%;}
.recap li {display: block;}

/* title */
.title-1{margin-bottom:5px;font-size:34px;font-weight:700;text-shadow:0 1px 1px #000;letter-spacing:-1px;line-height:1.25;}
.title-1-description{margin-bottom:30px;font-size:22px;font-weight:300;text-shadow:0 1px 1px #000;letter-spacing:-1px;opacity:0.8;line-height:1.4;}


.main-nav {width: 100%;background: #FFF; color: #444444;border-bottom:1px solid #cdcdcd;padding: 20px;font-size: 14px;text-align: center;box-sizing: border-box;}
.main-nav h3 {font-size: 18px;font-weight: 600;color:#99cc33;}
.main-nav p {color:#a3a3a3;font-weight: 600;margin-top: 5px;margin-bottom: 0;}
.main-nav p > b {color: #6b6b6b;}
.main-nav .main-nav-adresse {margin: 10px 0 20px 0;font-size: 13px;}
.main-nav .main-nav-adresse .fa {color: #99cc33;}

.section-choice {padding: 20px 30px;}
.section-choice h2 {font-size: 20px;color: #99cc33;margin-top: 20px;font-weight: 600;border-top:1px solid #cdcdcd;padding-top: 10px;}
.section-choice h2:first-of-type {margin-top: 0;border-top: none;padding-top: 0;}
.choice-description {font-size: 12px;color:#a3a3a3;margin-top: -4px;margin-bottom: 15px;max-width: 460px;}

table {width: 100%;}
table select {width: 60px;padding: 5px;}
td {text-align: left;font-size: 16px;}
tr > td:last-child {text-align: right;}

.section-choice-row {margin-bottom: 5px;}

strong {color: #99cc33;}

#vignette-livraison {position: absolute;right: 25px;top: 25px;border-radius: 100%;text-align: center;width: 100px;height: 100px;padding: 15px;display: table;background: #76b043;}
#vignette-livraison p {position: relative;vertical-align: middle;display: table-cell;padding-top: -10px;font-weight: bold;font-size: 14px;}

/* form */
#form-numeroyoungacl{}
#form-numeroyoungacl-item{margin-bottom:0;border-radius:3px;background-color:#fff;color:#000;text-align:left;}
#form-numeroyoungacl-submit{position:relative;float:right;margin:10px;overflow:auto;margin-left:-1px;background-color:#fed91e;border-radius:3px;}
#form-numeroyoungacl-submit input{width:175px;height:62px;background:transparent;font-weight:700;text-transform:uppercase;font-size:14px;}
#form-numeroyoungacl-field{display:block;overflow:hidden;}
#form-numeroyoungacl-field input{padding:0;background-color:transparent;height:82px;padding:0 20px;font-size:25px;font-weight:300;}
#form-numeroyoungacl label.error{display:inline-block;padding:4px 10px;background-color:rgba(255, 0, 0, 0.65);color:#fff;border-radius:0 0 3px 3px;box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.2);}

#form-validation{background-color:#fff;color:#000;text-align:left;}
#form-tree{background-color:#fff;color:#000;text-align:left;}
#form-validation-footer{padding:25px 0;background-color:rgba(153,204,51,0.2);border-top:1px solid rgba(153,204,51,0.4);margin-top:20px;text-align:center;border-radius:0 0 3px 3px;}
#form-validation label.error{display:inline-block;margin-top:5px;font-size:14px;color:#be0707;}

.container-confirmation {background-color:#fff;color:#000;text-align:left;padding: 20px;}

/* form */
.form-aside-item > label,.form-aside-item > input, .form-aside-item > select {margin-top: 15px;}
.form-aside-item > label:first-of-type,.form-aside-item > input:first-of-type,.form-aside-item > select:first-of-type {margin-top: 0;}
.form-aside-item:before, .form-aside-item:after{content:'';display:table;}
.form-aside-item:after{clear:both;}
.form-aside-item{padding:10px 25px 0 230px;margin-bottom:0;}
.form-aside-item:last-child{margin-bottom:0;border-bottom:0;}

.form-aside-item.border {border-bottom:1px solid #e8e8e8;padding-bottom: 30px;}

.form-aside-term{position:relative;float:left;padding-right:10px;margin-left:-205px;width:185px;color:#000;}
.form-aside-term.is-required:after{content:"*";position:absolute;right:0;top:0;color:#be0707;font-size:11px;}
.form-aside-caption{display:block;margin-top:3px;color:#999;font-size:14px;line-height:1.45;}
.form-aside-radio{display:block;padding-left:20px;margin-bottom:5px;}
.form-aside-radio > input{float:left;margin:3px 5px 0 -20px;}
.form-aside-checkbox{display:block;padding-left:20px;margin-bottom:5px;}
.form-aside-checkbox > input{float:left;margin:4px 5px 0 -20px;}
 

.container-confirmation p {font-size: 16px;}

.asterisque {color:#777; font-size: 9px; padding: 0 10px 10px;}

@media (max-width:860px){ 
	#vignette-livraison {transform: scale(0.75);}
}

@media (max-width:640px){
	.form-aside-item{padding:10px 5px 25px 10px}
	.form-aside-term{display:block;float:none;margin-left:0;margin-bottom:0px;width:auto;}
	.form-aside-term.is-required:before{left:-7px;}
	#form-validation label.error {left: 30px;margin: 0;margin-top: 0px;}

	input[type=text], select{height: 35px;}
	label{font-size: 14px;}

	.container-confirmation p {font-size: 13px;}
	.container-confirmation td {font-size: 12px;}
	.container-confirmation td strong {display:block;}
	.main-nav {padding: 15px !important;}
	.main-nav h3 {font-size: 16px}
	.main-nav p, .container-confirmation .recap-text  {font-size: 12px}
	.section-choice-row select {font-size: 11px;padding-left: 0px;width: 40px;}
	.section-choice-row td {font-size: 11px;vertical-align: initial;}

	#vignette-livraison {display: none;}
}


/* button */
.btn-default{padding:20px 50px;background-color:rgba(153,204,51,1);;border-radius:3px;box-shadow:inset 0 -3px rgba(0, 0, 0, 0.075);font-weight:700;text-transform:uppercase;font-size:14px;color: #FFF;}
.btn-back{display:inline-block;padding:10px 5px;margin-top:10px;font-size:15px;opacity:0.8;}