@charset "UTF-8";
/*@import url('https://fonts.googleapis.com/css2?family=Philosopher:300,400,700');*/
/*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300);*/
@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700');
/*
font-family: 'Philosopher', sans-serif;
font-family: 'Source Sans Pro', sans-serif;
font-family: 'Lato', sans-serif;
*/
/**************************
	DEBUG  background-color:aliceblue;
*************************	
*{outline:1px solid #fff!important;background-color:rgba(0,2,54,.1)!important}	
*/
/**************************
	CLASSES
**************************/
/*CSS MONICA Pour alignements*/
* {box-sizing: border-box}
[hidden] {display: none !important}
[disabled] {pointer-events:none; opacity: 0.3}
.horizontal-flex {display: flex; flex-direction: row; justify-content: space-between}
.horizontal-grid {display: grid; place-items: center;.}
.vertical {display: flex; flex-direction: column}
.center {justify-content: center; align-items: center}
.auto{margin:auto;}
.flex {flex: 1}
:root {
  --spacing-xs: 8px;
  --spacing: 24px;
  --spacing-s: 12px;
  --spacing-m: 36px;
}/*  fin css monica  */

:root {
  --couleur-fond: #f4f3ed;/* color:var(--couleur-fond); */
  --couleur-texte: #333333;
  --couleur-titre: #7A1214;
  --couleur-footer: #3A3A3A;/* footer*/
  --couleur-favorite: #232323;/* background:rgba(35,35,35,0.15) ;*/
  --main-size: 82.5em;
  --main-font-size: 1.000em;
  }
  
  main a:hover,main a:focus {text-decoration: none;} 
p{padding-bottom:10px;}
.large{font-size:1.4rem;}
em{font-size:0.9rem;}
.big{font-size:2.0rem;}
.bigger{font-size:2.2rem;}
.biggest{font-size:2.4rem;}
.small{font-size:1.6rem;}
.smaller{font-size:1.4rem;}
strong,.strong{font-weight:400;}
.link {color: #444444;transition: border 0.2s ease-in-out;border-bottom: 1px solid #444444;/*transparent*/}
.link:hover {border-bottom: 2px solid #333333;}
a[class~="lien_ext"]:after { content: url(../elements/external_brown.png);padding-left: 4px;width:50px;}/* ~ cible un attribut qui a une liste de valeurs séparées par un espace*/

a{color:#DEAF2D;}
a:hover, a:visited {color:#A68E6C;}

blockquote {font-style: italic;
  background: #;
  border-left: 10px solid #ccc;
  margin: 1.5rem 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote p { display: inline;}
  
.ombrage{-webkit-box-shadow: 5px -5px 3px -4px #000000; box-shadow: 5px -5px 3px -4px #000000;}
.bordure{border:1px solid #868695;border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;}
.bordure_left{border-left:1px solid #868695;border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;}
.no-border{border: 0px;}
.radius{border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px;}
b,strong{font-weight:700;}

/* elements flottants */
.fl {float: left;margin-right: auto;}
img.fl {margin-right: 1rem;}
.fr {float: right;margin-left: auto;}
img.fr {margin-left: 1rem;}
img.fl,img.fr {margin-bottom: 0.5rem;}

.portfolio,.portfolio_inverse {padding:5px;width:90%;margin:2rem auto 8rem auto;}
.portfolio p{padding-top:px;}
.portfolio img {float:left;margin:0 10px 5px 0;}
.portfolio_inverse p{text-align:right;padding:20px 0 30px 0;}
.portfolio_inverse img{float:right;padding:2px;margin:0 0 5px 10px;}
.portfolio-bord {margin:2rem auto 1rem auto;}
.portfolio-bord img{float:left;margin-right:30px;padding-right:20px;border-right:1px solid #D5D1B7;}
.clearfix::after,.line::after {content: "";display: table;clear: both;border-collapse: collapse;}

/*conteneur fluide*/
.flex-contain{display: flex; flex-flow: row wrap; justify-content: flex-start ;}/* 	flex-flow: row wrap;	raccourci pour flex-direction: row; et flex-wrap: wrap;	.	wrap = passage à la ligne	*/
.flex-contain> *{ padding:px;}
.flex-item {flex: 1 ;}/*flex 1 : tous les éléments se répartissent l'espace */

/*colonnes*/
.colonne_1{width:80%;padding:20px 30px 20px 20px;display:inline-block;}
.colonne_2{width:19%;display:inline-block;padding:20px 0;vertical-align:top;}

/*marges*/
.man, .ma0{ margin: 0; }  .pan, .pa0{ padding: 0; }  .mas{ margin: 1rem; }  .mam{ margin: 2rem; }  .mal{ margin: 3rem; }  .maxl{ margin: 4rem; }  .maxxl{ margin: 6rem; }
.pas{ padding: 1rem; }  .pam{ padding: 2rem; }  .pal{ padding: 3rem; }   .paxl{ padding: 6rem; } 

.mtn, .mt0{ margin-top: 0; }  .mts{ margin-top: 1rem; }  .mtm{ margin-top: 2rem; }  .mtl{ margin-top: 3rem; }   .mtxl{ margin-top: 4rem; }    .mtxxl{ margin-top: 6rem; } 
.mrn, .mr0{ margin-right: 0; }  .mrs { margin-right: 1rem; }  .mrm { margin-right: 2rem; }  .mrl { margin-right: 3rem; }  .mrxl { margin-right: 4rem; }  .mrxxl { margin-right: 6rem; }
.mbn, .mb0{ margin-bottom: 0; }  .mbs { margin-bottom: 1rem; }  .mbm{ margin-bottom: 2rem; }  .mbl { margin-bottom: 3rem; }  .mbxl { margin-bottom: 4rem; }  .mbxxl { margin-bottom: 6rem; }
.mln, .ml0{ margin-left: 0; }  .mls{ margin-left: 1rem; }  .mlm{ margin-left: 2rem; }  .mll{ margin-left: 3rem; }  .mlxl { margin-left: 4rem; }  .mlxxl { margin-left: 6rem; } 

.mauto { margin: auto; }  .mtauto { margin-top: auto; }  .mrauto { margin-right: auto; }  .mbauto { margin-bottom: auto; }  .mlauto { margin-left: auto; } 

.ptn, .pt0 { padding-top: 0; }  .pts { padding-top: 1rem; }  .ptm { padding-top: 2rem; }  .ptl { padding-top: 3rem; }  .ptxl { padding-top: 4rem; }  .ptxxl { padding-top: 6rem; }
.prn, .pr0 { padding-right: 0; }  .prs { padding-right: 1rem; }  .prm { padding-right: 2rem; }  .prl { padding-right: 3rem; }  .prxl { padding-right: 4rem; }  .prxxl { padding-right: 6rem; }
.pbn, .pb0 { padding-bottom: 0; }  .pbs { padding-bottom: 1rem; }  .pbm { padding-bottom: 2rem; }  .pbl { padding-bottom: 3rem; }  .pbxl { padding-bottom: 4rem; }  .pbxxl { padding-bottom: 6rem; }
.pln, .pl0 { padding-left: 0; }  .pls { padding-left: 1rem; }  .plm { padding-left: 2rem; }  .pll { padding-left: 3rem; }   .plxl { padding-left: 4rem; }    .plxxl { padding-left: 6rem; }

/*centrage alignement*/
.centrage {display: flex;justify-content: space-evenly;align-items: center;min-height: 10vh;  }
.inbl{vertical-align:top;display:-moz-inline-stack;/*pour firefox .1-2 */display:inline-block}
.txtcenter{text-align:center;}
.img{ display: block; width: 100%;}
.display{display: block;}
.txtcenter{text-align:center;}

/*conteneur responsive*/
.video{width:100%;margin:40px auto;margin-left:;
	-webkit-box-shadow:4px -3px 5px 0px rgba(50, 50, 50, 0.75);
	-moz-box-shadow:4px -3px 5px 0px rgba(50, 50, 50, 0.75);
	box-shadow:4px -3px 5px 0px rgba(50, 50, 50, 0.75);}
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

hr.style20 {width:60%;overflow: visible; /* For IE */padding: 0;border: none;border-top: medium double #f4f4f4;color: #eeeeee;text-align: center;margin:20px auto;}

.sticky {position: fixed;top: 0;width: 100%;}
.img_cachee{display:none;}

/*==============================
	STYLES GENERAUX
==============================*/
html {font-size: 62.5%;background: url(../img/ventoux-1920.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
background-color:#B18D5D;}

body{width:100%;max-width:1200px;height:auto;margin:0 auto 150px auto;font-family: 'Lato', sans-serif;font-size:1.8rem;font-weight:300;color:#f4f4f4; line-height: 1.5;}
main, footer{width:100%;background-color: rgba(7, 5, 6, 0.6);}

.h1-title, .h4-like, .h2-like, .h5-like	{font-family: 'Philosopher', arial, sans-serif;font-weight:300;text-align:center;}
.h1-title	{font-size:5.2rem;text-shadow:7px -3px 8px #030303;}
.h2-like	{font-size:3.2rem;margin:2rem auto;}
.h4-like	{font-size:2.4rem;}
.h5-like {font-size:2.2rem;text-align:left;}

.fb-page {margin: 20px auto}

/*=========== ACCUEIL =========*/
#navigation{height:37px;background-color: #80641b;width:100%}

/*========= RUBRIQUE ============*/
.image{max-width:250px; height:auto;}
.carte_visite{width:100%;min-height:155px;}/*9d9886*/
	
/*======== ARTISAN =============*/
#artisan{width:100%}
.texte_artisan{}
.h4-like {font-family: 'Philosopher', arial, sans-serif;}

/*========== CARTE =============*/
#carte_artisans {height:520px;width:100%;}
.gm-style-iw * {display: block;width: auto;}
.gm-style-iw h4, .gm-style-iw p {margin: 0;padding: 0;}
.gm-style-iw a {color: #E49203;}
.columns-2 {padding-left:20px;text-align: justify;columns: 2;column-gap:3rem;column-rule: 1px solid #c4c8cc;
    -moz-column-count: 2;
    -moz-column-gap:3rem;
    -moz-column-rule: 1px solid #c4c8cc;
    -webkit-column-count:2rem;
    -webkit-column-gap: 12px;
    -webkit-column-rule: 1px solid #c4c8cc;}

/*=======	PAGE CONTACT =======*/
fieldset{width:75%;min-height:120px;border:0px solid #E3E3E3;margin:5px ;padding:5px 0 20px 0;
	-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}	
legend{font-size:1.4em;margin-left:10%;text-align:center;padding:0 5px;color:#9d9886;}	
input,textarea{display:block;margin-bottom:10px;text-decoration: none;/*border:1px solid green;*/border-width: 1px;border-color:#868695;}
label {display:block;width:75%;padding-right:0px;line-height:1.4;/*border:1px solid red;*/}
input,textarea{background-color:#E7E4D5;outline:none;padding:0 10px;
	border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;}
input[type="text"],input[type="email"]{width:60%;height:28px;}
textarea{width:90%;}
input[type="text"]:hover,input[type="email"]:hover,textarea:hover{background-color:#ffffff;border-left:4px solid #80641B;}
textarea:focus,input[type="text"]:focus {background-color:#FFF;border-left:4px solid #80641B;}
.ccab {display: none}/*classe du champ caché anti-spam*/
.h-title{text-align:center;font-size:1.0em;width:100%;padding:10px 0;margin-top:100px;border-left:10px solid #18181A;border-right:10px solid #18181A;}
input[type=submit]{display:block;outline: none;cursor: pointer;text-align: center;margin:10px;padding: .4em 1.8em;width:180px;transition: width 1s;
	border-radius: 5px;box-shadow: 0 1px 2px rgba(0,0,0,.2);font-size: 1.2em;margin-top: 5px;color: #fef4e9;border: solid 1px #242415;			
	background: linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.15) 100%), radial-gradient(at top center, rgba(255,255,255,0.40) 0%, rgba(0,0,0,0.40) 120%) #989898; 
	background-blend-mode: multiply,multiply;}
input[type=submit]:hover{width:220px;color:#ffbf00;}

.label_captcha{width:80px;font-size:16px;margin:0 0 0 10px;}	
.invalide{background-color:#FAB9AD;color:red;}

.captcha{font-weight:bold;}
.remarque{display: none}/*classe du champ caché anti-spam*/

.erreur{color:#FF0000;font-size:18px;font-weight:400;padding:2px 5px;/*background-color: #FAB9AD;*/}
.erreur-bordure{caret-color: #FF0000;border: 1px solid red !important;border-left:5px solid red !important;}

.alert {padding:15px;margin:10px auto;width: 90%;border: 1px solid transparent;border-radius: 4px;text-align:center;font-size:22px;}
.alert_info {color: #1a3b9d;background-color: #d9edf7;border: 1px solid #6b87d9;}
.alert_warning {color: #9f0606;background-color: #fcf8e3;border: 1px solid #8a6d3b;}

/* =============================================
	CAROUSSEL Pour rajouter des photos, rajouter 5 secondes par photo supplémentaire à -webkit-animation:
 =============================================*/
#container{width:100%;max-width:1200px;height:auto;margin:auto;}	
.css-carousel {position: relative; padding-bottom:29% ; height: auto; overflow: hidden;margin:0px auto;}
@media only screen and (min-width: 1400px) {/*Styles au-dessus de 1400px */
	.css-carousel {padding-bottom: 25%;}
}
.css-carousel .css-img {
	max-width: 100%;
	position: absolute;
	left: 0;right: 0;opacity: 0;
	-webkit-animation: css-carousel-fade 30s linear infinite;
	-moz-animation: css-carousel-fade 30s linear infinite;
	-ms-animation: css-carousel-fade 30s linear infinite;
	animation: css-carousel-fade 30s linear infinite;
	}
.css-carousel .css-img:nth-child(2) {-webkit-animation-delay: 5s;-moz-animation-delay: 5s;-ms-animation-delay: 5s;animation-delay: 5s;}
.css-carousel .css-img:nth-child(3) {-webkit-animation-delay: 10s;-moz-animation-delay: 10s;-ms-animation-delay: 10s;animation-delay: 10s;}
.css-carousel .css-img:nth-child(4) {-webkit-animation-delay: 15s;-moz-animation-delay: 15s;-ms-animation-delay: 15s;animation-delay: 15s;}
.css-carousel .css-img:nth-child(5) {-webkit-animation-delay: 20s;-moz-animation-delay: 20s;-ms-animation-delay: 20s;animation-delay: 20s;}
.css-carousel .css-img:nth-child(6) {-webkit-animation-delay: 25s;-moz-animation-delay: 25s;-ms-animation-delay: 25s;animation-delay: 25s;}
/*.css-carousel .css-img:nth-child(7) {-webkit-animation-delay: 30s;-moz-animation-delay: 30s;-ms-animation-delay: 30s;animation-delay: 30s;}*/
/*.css-carousel .css-img:nth-child(8) {-webkit-animation-delay: 35s;-moz-animation-delay: 35s;-ms-animation-delay: 35s;animation-delay: 35s;}*/
/*.css-carousel .css-img:nth-child(9) {-webkit-animation-delay: 40s;-moz-animation-delay: 40s;-ms-animation-delay: 40s;animation-delay: 40s;}*/
@-webkit-keyframes css-carousel-fade{
	0%, 20%, 100% { opacity: 0; }
	5%, 15% { opacity: 1;}
}
@-moz-keyframes css-carousel-fade {
	0%, 20%, 100% { opacity: 0; }
	5%, 15% { opacity: 1;}
}
@-ms-keyframes css-carousel-fade {
	0%, 20%, 100% { opacity: 0; }
	5%, 15% { opacity: 1;}
}
@keyframes css-carousel-fade {
	0%, 20%, 100% { opacity: 0; }
	5%, 15% { opacity: 1;}
}

/* -------------------------------- 
MEDIA QUERIES
-------------------------------- */
@media only screen and (max-width : 1000px) {
	.stellarnav > ul > li > a { padding: 20px 23px; }
}
@media only screen and (max-width: 48em){/*768px*/
	/* All CSS will go here */
	/* Un message personnalisé 
	body:before {content:"Version mobile du site";display:block;text-align:center;font-style:italic;color:#fff;}*/
	html, body { overflow-x: hidden; }
	body{font-size:1.6rem;}
	main{padding:10px;}
	
	fieldset,textarea,input[type="text"],input[type="email"]{width:95%;}
	
	.css-carousel { padding-bottom: 28%;margin: 55px auto 0px auto;}
	
	.colonne_1,.colonne_2{display:block;width:100%;padding:10px;}
	.h1-title {display:block;font-size: 3.2rem;line-height:1;text-align:center;}
	.h2-like {display:block;font-size: 2.4rem;line-height:1;text-align:center;}
	.h4-like {display:block;font-size: 2.0rem;line-height:1;text-align:center;}
	.h5-like {font-size:2.0rem;border-top:1px solid #7b7b7b;padding-top:30px;}
	.big{font-size:1.8rem;}
	.menu-rubrique {border-bottom:1px solid #7b7b7b;padding-bottom:30px;}
	.menu-rubrique li{display:inline-block;padding:5px;}
	
	.columns-2 {text-align: justify;columns: 1;column-gap:3rem;column-rule: 1px solid #c4c8cc;
    -moz-column-count: 1;
    -moz-column-gap:3rem;
    -moz-column-rule: 1px solid #c4c8cc;
    -webkit-column-count:1;
    -webkit-column-gap: 12px;
    -webkit-column-rule: 1px solid #c4c8cc;}
	
	.portfolio,.portfolio-bord,.portfolio_inverse{width:100%;margin:2rem auto 2rem auto;border-right:0px solid #D5D1B7;}	
	.portfolio img,.portfolio-bord img,.portfolio_inverse img{float:none;margin:0 auto;display:block;padding-bottom:0px;text-align:left;}	
	.portfolio p,.portfolio-bord p,.portfolio_inverse p{padding-top:5px;}	
}