/* color scheme
marrron foncé		    = #2b2822
marrron moins foncé = #342f29
argent 	= #7A736B
or 		  = #7c6853
bordeau = #c3512f
*/

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
body{margin: 0}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display: block}
audio,canvas,progress,video{display: inline-block;vertical-align:baseline}
a { background-color: transparent}
a:active,a:hover{outline: 0}
abbr[title]{
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  -moz-text-decoration: underline dotted;
  text-decoration: underline dotted;
}
b,strong{font-weight: bold}
sub,sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup{top: 0.5em}
sub{bottom: 0.25em}
img{border:0; max-width: 100% }
figure{margin: 1em 40px}
hr{
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}
pre{overflow: auto}
code,kbd,pre,samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
button,input,optgroup,select,textarea{
  color: inherit;
  font: inherit;
  margin: 0;
}
button{overflow: visible}
button,select {text-transform: none}
button,html input[type="button"],input[type="reset"],input[type="submit"]{
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],html input[disabled]{cursor: default}
button::-moz-focus-inner,input::-moz-focus-inner {border: 0;padding: 0}
input{line-height: normal}
input[type="checkbox"],input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height: auto}
input[type="search"] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
legend {border:0;padding:0}
textarea{overflow:auto}
optgroup {font-weight:bold}
table {border-collapse:collapse;border-spacing: 0}
td,th{padding:0}


/* 
GRID
https://www.lab21.gr/blog/simple-responsive-grid-system-without-using-bootstrap 
*/

.block{
    display: block;
    padding: 25px 0;
}

.grid {
    width: 90%;
    max-width: 1140px;
    margin: 0 auto;
    overflow: hidden;
    padding-top: 30px;
    text-align: left;
}

.gutter{
    margin-left:20px;
    margin-right:20px;
}

.col-25{
    width: 25%;
    float: left;
}
.col-33{
    width: 33.3%;
    float: left;
}
.col-50{
    width: 50%;
    float: left;
}
.col-67{
    width: 66.6%;
    float: left;
}
.col-75{
    width: 75%;
    float: left;
}

.clear{
    clear: both;
    display: block;
    text-align: center;
}
.padleft-25{padding-left: 25px}
.padright-25{padding-right: 25px}

/* PERSO */

body { 
  background:#2b2822 url(../images/bg1.jpg) no-repeat bottom right; 
  color: #7c6853; 
  font-family: Arial, Helvetica, sans-serif; 
  font-size: 1em; 
  line-height: 1.35em;
  margin: 50px 0 300px 0;
}
a { 
  color: #963f2b;
  text-decoration: none;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
a:hover, a:active{color:#632719}
acronym{color:#ffffff;cursor:help}

blockquote{
  border-left: 8px solid #936900;
  font-style: italic;
  line-height: 2.2em;
  margin-left: 0;
  padding-left: 20px;
  text-align: justify;
}

h1, h2, h3, h4, h5, h6 { color:#7c6853; font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; font-weight: 400; padding: 0}

h1 {
  background: url(../images/logo-fromagerie-st-just.png) no-repeat top left;
  background-size: contain;
  color: #936900;
  display: block;
  font-size: 2.1em; 
  height: 200px;
  line-height: 1.2em;
  margin: 20px auto;
  text-indent: -10000px;
  width: 200px;
}

h2 {color:#936900; font-size: 1.65em; line-height:1.2em; margin:0.67em 0}
h3 {font-size:1.5em; line-height:1.2em; margin:0.5em 0}


footer{color:#ffffff; margin:25px 0; overflow:hidden}
footer .grid{ margin-bottom:0px}
footer .block{padding: 0}
footer .picto{max-width: 14px; margin-right: 6px; margin-bottom: -3px}
footer a{color: #c3512f}

.blanc{color: #ffffff}
.coin{float:left; height:102px; width:106px;}
.main{clear:both;margin:0 auto; overflow: hidden; width:80%}
.haut{background: url(../images/bgh.png) repeat-x bottom left; border-top:5px #ffffff solid; margin: 0px 106px;}
.bas{background: url(../images/bgb.png) repeat-x bottom left; border-bottom:5px #ffffff solid; margin:75px 106px 0 106px;}
.chg{background: url(../images/chg.png) no-repeat top left;}
.chd{background: url(../images/chd.png) no-repeat top left; float: right;}
.cbg{background: url(../images/cbg.png) no-repeat top left;}
.cbd{background: url(../images/cbd.png) no-repeat top left; float: right;}
.divider { margin: 0; max-width:530px }
.tourd{ background: url(../images/bgd.png) repeat-y top right; margin: -16px 0 0 0; padding: 0 50px; text-align: center;}
.tourg{ background: url(../images/bgg.png) repeat-y top left;}

.center, .text-center{text-align: center}
.copy{font-size: 12px; text-align: center}
.ipadonly{display: none}

.main .grid { background: #ffffff}

.pb0{padding-bottom:0}
.pt100{padding-top: 120px}
.pt50{padding-top: 60px}
.pt0{padding-top:0}
.pictoIn { margin:-8px 5px 0 5px; max-width:45px;}
.partners ul { list-style:none }
.partners ul li { padding: 5px 0}
.partners a {color: #333333}
.partners a:hover{color:#ac192c;}
.pictoIn:hover {opacity:0.7}
.quote{
  font-size: 4em;
  line-height:1px;
  margin: 10px 5px -5px 0;
  padding-bottom: -10px;
  vertical-align: text-bottom;
}

.google-maps {
    position: relative;
    padding-bottom: 30%; // This is the aspect ratio
    height: 0;
    margin: -10px 0 25px;
    overflow: hidden;
}
.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.rounded{border-radius: 50%}
.up{text-transform: uppercase}

.bouton {
  background: #4daf7c;
  border-radius:16px;
  color: #ffffff;
  display: inline-block;
  margin: 15px 0;
  padding: 10px 16px;
}
.bouton:hover { background: #c99435}

@media all and (max-width:1024px) {
  body{margin-top:25px}
  h1{height:100px; margin: 0 auto; width: 100px;}
  .ipadonly{display: block}
  .main{width: 95%}
  .vrap{white-space: pre-wrap}
  }

@media all and (max-width:863px) {
  .col-25, .col-50, .col-67, .col-33, .col-75{
        width: 100%;
        float: none;
      }
  footer .col-33{float: left; width: 50%}
  footer a { color:#ffffff;}
  .last{display: none;}
  h1{height:200px; width: 200px;}
}

@media all and (max-width:668px){
  .main{display: none; width: 100%}
  .main.tourg{background:none; display: block}
  .tourd{background: none; padding: 0}
  .grid{padding-top: 15px; width: 95%}
  .divider { max-width: 100%; }
  
}

@media all and (max-width:500px) {
  footer .col-33{
    float: none;
    padding-bottom: 30px;
    text-align: center;
    width: 100%;
    
    }
}