/* GLOBAL PAGE */
html {max-width:100%;margin:0px;padding:0px;}
body{padding:0px;max-width:100%;margin:0px auto 0px auto;background: #37220f;}
img{width:auto;border:0px;}
fieldset {border:0px;}
@font-face {font-family: "Comic Sans MS";
  src: url("../font/comic/7cc6719bd5f0310be3150ba33418e72e.eot"); /* IE9*/
  src: url("../font/comic/7cc6719bd5f0310be3150ba33418e72e.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  /* url("../font/7cc6719bd5f0310be3150ba33418e72e.woff2") format("woff2"),  chrome、firefox */
  /* url("../font/comic/7cc6719bd5f0310be3150ba33418e72e.woff") format("woff"), /* chrome、firefox */
  url("../font/comic/7cc6719bd5f0310be3150ba33418e72e.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../font/comic/7cc6719bd5f0310be3150ba33418e72e.svg#Comic Sans MS") format("svg"); /* iOS 4.1- */
}


div { font-family:Comic Sans MS, sans-serif; }
h1 {text-align:left;font-size: 24px;margin:0px auto;padding:5px 5px;color:#d4a440;text-shadow: 1px 1px 1px rgba(0,0,0, 0.5);font-family:Comic Sans MS, sans-serif;}
h2 {text-align:left;font-size: 18px;margin:0px;letter-spacing: 1.2px;line-height:1.4;color:#d4a440;text-shadow: 1px 1px 1px rgba(0,0,0, 0.3);font-family:Comic Sans MS, sans-serif;}
h3 {font-size: 14px;margin:0px;letter-spacing: 1.2px;text-shadow: 1px 1px 1px rgba(0,0,0, 0.4);line-height:1.4;color:#d4a440;padding-left:12px;}
p{font-size: 14px;line-height:1.8;padding:10px 20px 5px 20px;margin:0px;font-family:Comic Sans MS, sans-serif;}

@media (max-width: 520px) {
	h1 {margin:5px auto 5px auto;}
	p{padding:10px 5px 5px 15px;}
}

li span {font-family:Comic Sans MS, sans-serif;}
a{text-decoration:none;color:#d4a440;}

/* CSS HEADER NAV HAUT */
.boxNavDesk{display:block;position:relative;text-align:right;}
.boxNavMobil{display:none;}
.boxFB{display:block;position:absolute;right:20px;top:10px;}
.boxInstagram{display:block;position:absolute;right:80px;top:10px;}
.boxFbI{display:inline-block;position:relative;}
.boxPictoFbI{height:30px;margin:0px 10px;}
@media (max-width: 770px) {
	.boxNav{display:block;position:relative;top:0;right:0;}
}
@media (max-width: 460px) {
		.boxFB{display:block;position:absolute;right:5px;top:2px;}
		.boxFB img{width:30px;}
		.boxInstagram{display:block;position:absolute;right:60px;top:2px;}
		.boxInstagram img{width:30px;}
}
.boxTrait{display:inline-block;width:120px;height:2px;background:#d4a440;text-align:center;}
.boxHeader{height:70px;}
@media (max-width: 540px) {
	.boxNavDesk{display:none;}
	.boxNavMobil{display:block;position:relative;}
	.boxHeader{height:auto;}
	
}
/* CSS MENU */
#cssmenuMobil {display:none;}
#cssmenu {display:inline-block;position:relative;line-height: 15px;text-align: left;min-height:45px;margin:10px 160px 0px 0px;}
#cssmenu > ul {width: auto;list-style-type: none;padding: 0;margin: 0;z-index: 600;min-height:45px;}
#cssmenu > ul li {display: inline-block;margin:0px;padding:0px;zoom: 1;z-index: 600;border:0px;margin-left:-5px;}

#cssmenu > ul li a {display: block;color:#d4a440;padding:14px 22px 14px 22px;font-size:24px;text-decoration: none;text-shadow: black 0.1em 0.1em 0.2em;}
#cssmenu > ul li a.active,
#cssmenu > ul li a:hover {color: #fff8e7;text-shadow: black 0.1em 0.1em 0.2em;}
@media (max-width: 600px) {
	#cssmenu {display:none;}
	#cssmenuMobil {display:block;position:relative;}
	#cssmenuMobil > ul {width: 100%;list-style-type: none;padding: 0;margin: 0;z-index: 600;}
	#cssmenuMobil > ul li {display: inline-block;margin:0px;padding:0px;zoom: 1;z-index: 600;border:0px;}
	#cssmenuMobil > ul li a {padding:8px 18px 14px 18px;font-size:24px;text-decoration: none;text-shadow: black 0.1em 0.1em 0.2em;}
	#cssmenuMobil > ul li a.active,
	#cssmenuMobil > ul li a:hover {color: #fff8e7;text-shadow: black 0.1em 0.1em 0.2em;}
}
/* Make sure they show even if hidden in mobile view by JS */
@media (min-width: 601px) {
  #cssmenu > ul > li.collapsed {
    display: inline-block !important;
    *display: inline;
    zoom: 1;
  }
  #cssmenu > ul ul li.collapsed {
    display: block !important;
  }
}
.fdBox {box-shadow:1px 1px 2px 0 rgba(0,0,0,.5);}
.borderTexte {text-shadow: 1px 2px 3px rgba(0,0,0, 0.5);}

.color_or{color:#bea67c;}
/* CSS global */
.boxPrincipal{display:block;position:relative;background:#FFF !important; margin:0px auto;}
.btCenter {position:relative;text-align:center;margin:2px auto;}
.boxAdresse{display:block;position:relative;text-align:center;padding:10px 20px;color:#d4a440;}

.boxTitre{display:block;width:auto;text-align:left;vertical-align:top;font-size:32px;color:#d4a440;text-transform: uppercase;padding:5px 15px;}
/* RESERVER */
.boxReserver{text-align:center;margin:10px auto;}



/* FACEBOOK PARTAGE */
.boxFBShare {display: inline-block;position: relative;/*padding: 0.8rem 1rem;padding-left:2.2rem;*/
		padding: 0.8rem 1rem 0.8rem 2.2rem;
		background-color: #fffafa;text-decoration: none;font-size:14px;color: #200507;}
.boxFBShare > .fbIcon {display: block;position: absolute;height:1.2rem;width:1.2rem;bottom: 0.9rem;left: 0.5rem;
		background-image: url(../img/fb_24.png);background-size: 1.2rem 1.2rem;background-repeat: no-repeat;
		    -webkit-transition: background-image 0.5s ease-in-out;transition: background-image 0.5s ease-in-out;}
.boxFBShare:hover > .fbIcon {background-image: url(../img/fb_24_on2.png);}

/* FOOTER 2017 */
footer {position:relative;bottom:15px;width:100%;max-width:980px;margin:0px auto 0px auto;font-family:Arial, Geneva, sans-serif;font-size:12px;}
.boxFooter {display:block;position:relative;width:90%;text-align:center;padding:5px;margin:0px auto;font-size:12px;letter-spacing: 1.2px;color:#7c7f86;}
.boxFooterAbs {display:block;position:absolute;bottom:20px;left:18%;text-align:center;padding:5px;margin:0px auto;font-size:12px;letter-spacing: 1.2px;color:#7c7f86;}
.footerCopy {display: inline-block;position:relative;float:left;font-size:10px;letter-spacing:1px;}
.footerArtek {display: inline-block;position:relative;float:right;}
.footerArtek a{font-family:Arial, Geneva, sans-serif;font-size:12px;color:#7c7f86;text-decoration:none;}
.footerMention {display: inline-block;position:relative;margin:0px 10px 0px 0px;}
.footerMention a{font-family:Arial, Geneva, sans-serif;font-size:12px;color:#7c7f86;text-decoration:none;letter-spacing: 1.2px;}
@media (max-width: 670px) {
	footer {position:relative;bottom:15px;}
	.footerCopy {display:block;float:none;text-align:center;height:30px;}
	.footerArtek {display:block;padding:5px 10px 5px 10px;float:none;text-align:center;margin:5px auto 5px auto;height:28px;}
	.footerMention {display:block;float:none;text-align:center;margin:5px 0px 0px 0px;}
	.boxFooterAbs {display:block;position:relative;left:0;}
}
/* CSS CONTACT 2019 */
.boxTableContact{display:table;content:"";width:100%;clear:both;margin-top:40px;height:100%;}
.boxP50{display:inline-block;position:relative;margin:0px auto;width:50%;vertical-align:top;}
.boxContact{display:block;position:relative;margin:0px auto;max-width:650px;}
.boxSaiseAdresse{display:block;position:relative;vertical-align:top;width:320px;}
.adrInputTxt{width:300px;height:30px;}
.adrInputMess {width:300px;height: 12em;padding: 2px;} 
.MargContact1{margin-left:160px;}
.adrLabel {display:inline-block;width:5px;padding:0px;text-align:center;margin:0px;}
.boxPlan {display:block;position:relative;width:95%;height:440px;margin:2px auto 0px auto;box-shadow:1px 1px 2px 0 rgba(0,0,0,.5);}
.margt20 {margin-top:20px;}
label {vertical-align:top;font-size:12px;color:#00253d;padding: 1px; }

.boxNewsLetter{display:block;position:relative;margin:10px auto;padding:1px 7px;}

.ContactMailok {font-size:18px;color:#3bca1b;font-weight: bold;text-transform:uppercase;text-align:center;margin:20px auto;}
.ContactTitre{line-height: 30px;}

@media (max-width: 767px) 
{
	.boxContact{padding:10px;}
	.boxP50{display:block;width:100%;}
	.MargContact1{margin-left:100px;}
}
		
@media (max-width: 567px) {
	.boxContact{display:block;padding:8px;margin:10px auto 10px auto;text-align:left;}
	.AdrMobil{display:block;}
	.adrInputMess {height: 8em;padding:1px 5px;}
	.margT20 {margin-top:10px;}
	.MargContact1{margin:0px auto;}
}
/* checkbox */
.boxCheck {display: block;position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 14px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.boxCheck input {position: absolute;opacity: 0;cursor: pointer;}
.checkmark {position: absolute;top: 0;left: 0;height: 25px;width: 25px;background-color: #eee;}
.boxCheck:hover input ~ .checkmark {background-color: #ccc;}
.boxCheck input:checked ~ .checkmark {background-color: black;}
.checkmark:after {content: "";position: absolute;display: none;}
.boxCheck input:checked ~ .checkmark:after {display: block;}
.boxCheck .checkmark:after {left: 9px;top: 5px;width: 5px;height: 10px;border: solid white;border-width: 0 3px 3px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}
/* AVIS */
		.boxAvisTemoin{padding:5px 15px 5px 20px;vertical-align:top;}
		.boxAvisMoyen{display:inline-block;position:relative;line-height:1.6;font-weight:700;vertical-align:top;padding:0px 15px 0px 20px;}
		.boxAvisPrenom{display:inline-block;position:relative;line-height:1.6;font-size:1.2rem;font-weight:700;vertical-align:top;padding:0px 7px 0px 2px;color:#d4a440;}
		.boxAvisMoyenStar{display:inline-block;position:relative;}
		.boxAvisComment{padding:5px 0px 0px 10px;line-height:1.6;color:#fde9d9;}
		.boxAvisDate{padding:8px 0px 0px 15px;font-size:12px;}
		
/* EFFET TEXTE SUR PHOTO */
#mainwrapper {height: auto;text-align: center;}
#mainwrapper .box {display:inline-block;cursor: pointer;width:440px;height:294px;float: left;margin: 0px;position: relative;overflow: hidden;border-radius:10px;}
.box img{width:440px;}

@media (min-width: 767px) {

	#mainwrapper .box img {position: absolute;left: 0;
		-webkit-transition: all 300ms ease-out;
		-moz-transition: all 300ms ease-out;
		-o-transition: all 300ms ease-out;
		-ms-transition: all 300ms ease-out;
		transition: all 300ms ease-out;
	}
	#mainwrapper .box .caption {background-color: rgba(0,0,0,0.8);position: absolute;color: #fff;z-index: 100;
		-webkit-transition: all 300ms ease-out;
		-moz-transition: all 300ms ease-out;
		-o-transition: all 300ms ease-out;
		-ms-transition: all 300ms ease-out;
		transition: all 300ms ease-out;
		left: 0;
	}
	
/* effet 3 Fade in et scale*/
	#mainwrapper .box .fade-caption, #mainwrapper .box .scale-caption {opacity: 0;width: 440px;height: 294px;text-align: left;padding: 10px;}
	#mainwrapper .box:hover .fade-caption {opacity: 1;}

/* Caption 4: Slide **/
	#mainwrapper .box .slide-caption {width: 440px;height: 294px;text-align: left;padding: 10px;left: 440px;}
 /*Caption Behavior 4: Slide it to the left */
	#mainwrapper .box:hover .slide-caption {background-color: rgba(0,0,0,1) !important;
		-moz-transform: translateX(-100%);
		-o-transform: translateX(-100%);
		-webkit-transform: translateX(-100%);
		opacity: 1;
		transform: translateX(-100%);
	}

}
@media (max-width: 767px) {

	#mainwrapper .box {display:block;position:relative;cursor: pointer;width:auto;height:auto;float: none;margin:5px auto 2px auto;overflow: hidden;border-radius:10px;}
	/*.box img{width:auto;}*/
}
/* BOUTON INPUT */
.form-control:-moz-placeholder {color: #999999;}
.form-control::-moz-placeholder {color: #999999;}
.form-control:-ms-input-placeholder {color: #999999;}
.form-control::-webkit-input-placeholder {color: #999999;}

.form-control {
  height: 34px;
  padding: 6px 6px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555555;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
          transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.form-control2 {
  padding: 6px 6px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555555;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
          transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

/* BOUTON ENVOYER VERT MESSAGE */
.btn-primary.active,
.btn-warning.active,
.btn-danger.active,
.btn-success.active,
.btn-info.active,
.btn-inverse.active {
  color: rgba(255, 255, 255, 0.75);
}
.btn {display: inline-block;padding: 4px 12px;margin-bottom: 0;font-size: 14px;line-height: 20px;color: #333333;text-align: center;text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;cursor: pointer;background-color: #f5f5f5;
  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  border: 1px solid #cccccc;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.btn:hover,
.btn:focus,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {color: #333333;background-color: #e6e6e6;}

.btn:active,
.btn.active {background-color: #cccccc \9;}

.btn:hover,
.btn:focus {color: #333333;text-decoration: none;background-position: 0 -15px;
  -webkit-transition: background-position 0.1s linear;
     -moz-transition: background-position 0.1s linear;
       -o-transition: background-position 0.1s linear;
          transition: background-position 0.1s linear;
}

.btn:focus {outline: thin dotted #333;outline: 5px auto -webkit-focus-ring-color;outline-offset: -2px;}

.btn.active,
.btn:active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}


.btn-success {color: #ffffff;text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);background-color: #5bb75b;
  background-image: -moz-linear-gradient(top, #62c462, #51a351);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#51a351));
  background-image: -webkit-linear-gradient(top, #62c462, #51a351);
  background-image: -o-linear-gradient(top, #62c462, #51a351);
  background-image: linear-gradient(to bottom, #62c462, #51a351);
  background-repeat: repeat-x;
  border-color: #51a351 #51a351 #387038;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.btn-success.disabled,
.btn-success[disabled] {color: #ffffff; background-color: #51a351;}

.btn-success:active,
.btn-success.active {background-color: #408140 \9;}

.btnBlack {padding: 6px 14px;
  color: #ffffff;font-size:18px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #1e1b1b;
  background-image: -moz-linear-gradient(top, #2e2c2c, #282828);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2e2c2c), to(#282828));
  background-image: -webkit-linear-gradient(top, #2e2c2c, #282828);
  background-image: -o-linear-gradient(top, #2e2c2c, #282828);
  background-image: linear-gradient(to bottom, #2e2c2c, #282828);
  background-repeat: repeat-x;
  border-color: #2e2c2c #2e2c2c #262b26;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btnBlack:hover,
.btnBlack:focus,
.btnBlack:active,
.btnBlack.active,
.btnBlack.disabled,
.btnBlack[disabled] {
  color: #f58221;
  background-color: #1e1b1b;
}

.btnBlack:active,
.btnBlack.active {
  background-color: #343030 \9;
}

.btnOrange {line-height:24px;padding: 6px 14px;
  color: #ffffff;font-size:24px;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #f58221;
  background-image: -moz-linear-gradient(top, #f58221, #f57407);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f58221), to(#f57407));
  background-image: -webkit-linear-gradient(top, #f58221, #f57407);
  background-image: -o-linear-gradient(top, #f58221, #f57407);
  background-image: linear-gradient(to bottom, #f58221, #f57407);
  background-repeat: repeat-x;
  border-color: #f58221 #f58221 #f57407;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btnOrange:hover,
.btnOrange:focus,
.btnOrange:active,
.btnOrange.active,
.btnOrange.disabled,
.btnOrange[disabled] {
  color: #ce4b39;
  background-color: #f58221;
}

.btnOrange:active,
.btnOrange.active {
  background-color: #343030 \9;
}
@media (max-width: 770px) {
	boddy {width:auto;padding:0px;min-width:0;}
	img,
    table,
    td,
    blockquote,
    code,
    pre,
    textarea,
    input,
    iframe,
    object,
    embed,
    video {max-width: 100%;}
    
    /* conserver le ratio des images */
    img { height: auto;}
    
    /* gestion des mots longs */
    textarea,
    table,
    td,
    th,
    code,
    pre,
    samp {
        -webkit-hyphens: auto; /* césure propre */
        -moz-hyphens: auto;
        hyphens: auto;
        word-wrap: break-word; /* passage à la ligne forcé */
    }
	code,
    pre,
    samp {
        white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
    }
}