/*********************************************
 VARIABLES
*********************************************/
.zb_light {
	/* FORMS */
	--form_bg_color: #FFF;
	--form_bg_color_error: #FFF8F8;
	--form_border_color: #CCC;
	--form_border_color_focus: #999;
	/* BUTTONS */
	--btn_color: #555;
	--btn_color_hover: #000;
	--btn_bg_color: #f8f8f8;
	--btn_bg_color_hover: #f8f8f8;
	--btn_bg_gradient: linear-gradient(to bottom, #f8f8f8 0%, #eeeeee 100%);
	--btn_border_color: #CCC;
	/* POPUP */
	--popup_color: #333;
	--popup_bg_color: #FFF;
	/* BOXES */
	--box_bg_color: #FBFBFB;
	--box_border_color: #CCC;
	/* RESERVATION */
	--reservation_border_color: #CCC;
	--reservation_step_bg_color: rgba(242,242,242,.9);
	--reservation_selector_bg_color: #FBFBFB;
}
.zb_dark {
	/* FORMS */
	--form_bg_color: rgba(255,255,255,.2);
	--form_bg_color_error: rgba(255,128,128,.2);
	--form_border_color: #888;
	--form_border_color_focus: #FFF;
	/* BUTTONS */
	--btn_color: #FFF;
	--btn_color_hover: #FFF;
	--btn_bg_color: rgba(21,21,21,.2);
	--btn_bg_color_hover: rgba(255,255,255,.2);
	--btn_bg_gradient: rgba(21,21,21,.2);
	--btn_border_color: #888;
	/* POPUP */
	--popup_color: #FFF;
	--popup_bg_color: #222;
	/* BOXES */
	--box_bg_color: rgba(21,21,21,.4);
	--box_border_color: #888;
	/* RESERVATION */
	--reservation_border_color: #888;
	--reservation_step_bg_color: rgba(21,21,21,.9);
	--reservation_selector_bg_color: rgba(255,255,255,.2);
}

/*********************************************
 LIGHTBOX MODULE
*********************************************/
.lightbox { text-align:left }
.lightbox > div { margin:0; padding:0; }
.lightbox_container { background:url(/assets/img/lightbox/preloader.svg) no-repeat center center; display:block; padding-bottom:55%; width:100%; overflow:hidden; position:relative; box-sizing: border-box; }
.lightbox_container div { position:absolute; width:100%; height:100%; overflow:hidden; }
.lightbox_container div img { position:absolute; width:auto; height:auto; top:50%; left:50%; transform:translate(-50%, -50%); }

/*********************************************
 FORMS
*********************************************/
label { display:block; cursor:pointer; font-size: 14px; font-weight:700; padding:4px 2px; }
input[type="text"], input[type="email"], input[type="number"], input[type="password"], select, textarea { font:12px Tahoma, sans-serif; color:inherit; background-color: #888; background-color:var(--form_bg_color); border:1px solid var(--form_border_color); padding:15px 10px; width:100%; box-sizing:border-box; border-radius: 0; transition: all 0.3s ease-out; }
input[type="text"].small, input[type="email"].small, input[type="password"].small, select.small, textarea.small { padding:8px; }
input.error, textarea.error { border-color:#FF0000; background-color:var(--form_bg_color_error); }
input:focus, textarea:focus { border:1px solid var(--form_border_color_focus); }
select option { background-color:#FFF; color:#000; }
  
/*********************************************
 BUTTONS
*********************************************/
input[type="submit"], .button { font:bold 14px/22px Arial, sans-serif; width:100%; color:var(--btn_color); background: #888; background:var(--btn_bg_color); background:var(--btn_bg_gradient); border:1px solid var(--btn_border_color); text-align:center; padding:10px; display:inline-block; margin:0; outline:none; cursor:pointer; text-decoration:none; -webkit-appearance:none; border-radius:0; box-sizing:border-box; transition: all 0.3s ease-out; }
input[type="submit"]:hover, .button:hover { color:var(--btn_color_hover); background:var(--btn_bg_color_hover); opacity:0.85; }
input[type="submit"]:active, .button:active { opacity:0.7; }
input[type="submit"][disabled], .button[disabled] { opacity:0.5; }
input[type="submit"].small, .button.small { padding:2px 10px; margin:4px 0; height:32px; line-height:26px; }
input[type="submit"].green, .button.green { color: #FFF !important; background: #75ae5c; border: 1px solid #3b6e22; background: linear-gradient(#75ae5c, #649552); }

/*********************************************
 INFOBOX
*********************************************/
.infobox { z-index:5000; border:2px solid; padding:20px; border-radius:5px; box-shadow:0 0 3px 0 rgba(0,0,0,0.25); font-size:16px; margin-bottom:15px; line-height:25px; position:fixed; top:50%; left:50%; transform: translate(-50%, -100%); }
.infobox::before { font-family:"FontAwesome"; font-weight:normal; font-style:normal; font-size:30px; display:inline-block; text-decoration:inherit; margin-right:15px; vertical-align:top; }
.infobox.success::before { content:'\f058'; color:#8fad3d; }
.infobox.warning::before { content:'\f071'; color:#e6a700; }
.infobox.error::before { content:'\f057'; color:#ad3f2e; }
.infobox.info::before { content:'\f05a'; color:#4381cc; }
.infobox.success { border-color:#8fad3d; color:#586c25; background-color:#eff4d4; }
.infobox.warning { border-color:#e6a700; color:#796101; background-color:#ffea97; }
.infobox.error { border-color:#ad3f2e; color:#923725; background-color:#efcec9; }
.infobox.info { border-color:#4381cc; color:#5d57b9; background-color:#c6d8f0; }

/*********************************************
 POPUP
*********************************************/
.popup_block { position:relative; color:var(--popup_color); background: #888; background:var(--popup_bg_color); padding:15px; width:auto; max-width:800px; margin:0 auto; }
.popup_block h1 { font-family:"Open Sans",sans-serif; font-size:2.4em; line-height:1.6em; font-weight:normal; margin:0.5em 0; color:inherit; }
.popup_block h2 { font-family:"Open Sans",sans-serif; font-size:1.8em; line-height:1.6em; font-weight:normal; margin:0.5em 0; color:inherit; }
.popup_block h3 { font-family:"Open Sans",sans-serif; font-size:1.4em; line-height:1.6em; font-weight:normal; margin:0.5em 0; color:inherit; }
.popup_block p { line-height:1.8em; color:inherit; margin:0.5em 0; }
.popup_block li { line-height:1.8em; color:inherit; }
.popup_block a { color: inherit; }

/*********************************************
 BOXES
*********************************************/
.box { border: 1px solid var(--box_border_color); margin-bottom: 10px; background-color: #888; background-color: var(--box_bg_color); }
.box h1 { margin: 0; padding: 5px 10px; }
.box h2 { margin: 0; padding: 5px 10px; }
.box h3 { margin: 0; padding: 5px 10px; }
.box p { line-height: 1.4em; }
.box > div { border-top: 1px solid var(--box_border_color); padding: 10px; }

/*********************************************
 COMMERCE MODULE
*********************************************/
.form_produit label { padding:0; }
.form_produit label [type=checkbox] { display:none; }
.form_produit label [type=checkbox] + span { background-color: var(--form_bg_color); border:1px solid var(--form_border_color); display:block; width:100%; padding:7px; text-align:center; box-sizing:border-box; }
.form_produit label [type=checkbox]:checked + span { background-color: #79A867; color:#FFF; }
.commerce_nav .product-gallery a { display: block; width:100%; position: relative; overflow: hidden; padding-bottom: 60%; }
.commerce_nav .product-gallery a img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 105%; max-height: 105%; }
.commerce_nav .product-gallery a:not(:first-child) { display: none; }
.basket a.del_basket { font-size: 12px; transition: all 0.3s ease-out; }
.basket a.del_basket:hover { color: #C00!important; }
.basket h3 { position: relative; padding: 0px 40px 0px 0px; }
.basket h3 span { position: absolute; right: 0; top: 0; }
.basket p { position: relative; padding: 0px 40px 0px 0px; }
.basket p span { position: absolute; right: 0; top: 0; }
.basket .cgv_btn { display:inline; font-size: 13px; color: #999; font-style: italic; font-weight:normal; }
.basket .cgv_btn a { color: #999; }
@media only screen and (min-width: 768px) {
	.form_infos_user .grid-50:nth-child(odd){ padding-left: 5px!important; }
}

/*********************************************
 RESERVATION MODULE
*********************************************/
.reservation_bloc { position:relative; min-height:500px; margin:1.2em 0;}
.reservation_bloc .step_reservation { position:absolute; z-index:2; top:50%; left:50%; transform:translate(-50%, -51%); background-color: #888; background-color:var(--reservation_step_bg_color); padding:20px; border:1px solid var(--reservation_border_color); box-sizing:border-box; }
.reservation_bloc a.reservation_selector { display:inline-block; padding:8px; margin:5px 0px; background-color:var(--reservation_selector_bg_color); text-decoration:none; width:100%; border:1px solid var(--reservation_border_color); box-sizing:border-box; }
.reservation_bloc a.reservation_selector.selected { background-color:#D35746; color:#FFF; }
.reservation_bloc a.reservation_selector:hover { background-color:#D35746; color:#FFF; }
.reservation_bloc a.prevStep { font-size:12px; text-decoration:none; color:#999; }
.reservation_bloc .step_reservation:not(:first-child) { display:none;}
@media only screen and (max-width: 1024px) {
	.reservation_bloc { min-height:auto;}
	.reservation_bloc img { display:none;}
	.reservation_bloc .step_reservation { position:relative; top:auto; left:auto; transform:none; }
}

/*********************************************
 ANIMATIONS
*********************************************/
.delay250 { animation-delay:250ms; -webkit-animation-delay:250ms; }
.delay500 { animation-delay:500ms; -webkit-animation-delay:500ms; }
.delay750 { animation-delay:750ms; -webkit-animation-delay:750ms; }
.delay1000 { animation-delay:1000ms; -webkit-animation-delay:1000ms; }
.delay1250 { animation-delay:1250ms; -webkit-animation-delay:1250ms; }
.delay1500 { animation-delay:1500ms; -webkit-animation-delay:1500ms; }
.delay1750 { animation-delay:1750ms; -webkit-animation-delay:1750ms; }
.delay2000 { animation-delay:2000ms; -webkit-animation-delay:2000ms; }
.delay3000 { animation-delay:3000ms; -webkit-animation-delay:3000ms; }
.delay4000 { animation-delay:4000ms; -webkit-animation-delay:4000ms; }
.delay5000 { animation-delay:5000ms; -webkit-animation-delay:5000ms; }

/*********************************************
 CLASSES
*********************************************/
.float_left { float:left }
.float_right { float:right }
.clear { clear:both }
.hidden { display:none }
.transparent { opacity:0 }
.inline { display:inline-block }
/* ALIGNEMENTS */
.align_left { text-align:left }
.align_right { text-align:right }
.align_center { text-align:center }
.align_justify { text-align:justify }
.align_bottom { vertical-align:bottom }
.align_middle { vertical-align:middle }
.align_sub { vertical-align:sub }
/* SPACES */
.p0 { padding:0px!important }
.p7 { padding:7px }
.p10 { padding:10px }
.p15 { padding:15px }
.p20 { padding:20px }
.m0 { margin:0px!important }
.mt15 { margin-top:15px }
.ml5 { margin-left:5px }
.ml10 { margin-left:10px }
.ml20 { margin-left:20px }
.mr5 { margin-right:5px }
.mr10 { margin-right:10px }
.mb5 { margin-bottom:5px }
.mb10 { margin-bottom:10px }
.mb15 { margin-bottom:15px }
/* COLORS */
.green { color:#090!important }
.red { color:#F00!important }
.grey { color:#999!important }
.light_grey { color:#BBB!important }
/* OTHERS */
.animate { transition:all 0.3s ease-out; }
.box_shadow { box-shadow:0 0 10px 5px rgba(0,0,0,0.4); }
.noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.w1000 { box-sizing:border-box; width:1000px; max-width:100%; margin:0 auto; padding:0 10px; }
.w60 { width:60%; max-width:100%; margin: 0 auto; }
.centralize { position:absolute; z-index:3; width:100%; top:50%; transform:translateY(-50%); }
.videodetector {position:relative; padding-bottom:50%; padding-top:20px; height:0; overflow:hidden; }
.videodetector iframe, .videodetector object, .videodetector embed { position:absolute; top:0; left:0; width:100%; height:100%; } 
.sticky { position: -webkit-sticky; position: -moz-sticky; position: -o-sticky;  position: -ms-sticky; position: sticky; top: 100px; }
.note { font-size:.8; opacity:.8; font-style:italic; font-weight:normal; }