html,body{
  font-family: 'Montserrat', sans-serif;
}




#contentLeftNav {
    background: url("/assets/public/img/fond-menu.jpg") no-repeat center bottom #9f9e9e;
    background-size: contain;
    width: 300px;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
}

#logo-menu
{
  width: 100%;
  padding: 20px;
  margin-top: -100px;
}




#contentPage{
  width: calc(100% -300px);
  margin-left: 300px;
  min-height: 100vh;
  background: #fff;
  overflow: hidden;
}

#contentPageNonav{
  width: 100%
  min-height: 100vh;
  background: #fff;
  overflow: hidden;
}

.header-page{
  background: url("/assets/public/img/bg-header-02.jpg") repeat-y center bottom #9f9e9e;
  background-size: contain;
  width: 100%;
  min-height: 200px;
  padding: 20px;
  text-align: center;


}

.header-page h1{
  font-weight: 900;
  font-size: 3em;
  text-transform: uppercase;
}


.header-page h2{
  font-size: 1.8em;
}

.card-biere h4 a{
  font-size: 0.8em;
  font-weight: bold;
  color: rgb(33, 37, 41);
}



#logo-home
{
  width:400px;
  margin-top: 20px;
  margin-bottom: 50px;
}


#page01{
  min-height: 100vh;
  background: url("/assets/public/img/bg-home-02.jpg") no-repeat center top;
}

#page01 h1{
  display:block;
  font-size: 1.5em;
  font-weight: bold;
  text-transform: uppercase;
}


#page01 h2{
  font-size: 1.5em;
}


.bloc-age{
  background: rgba(255, 255, 255, 0.5);
  padding: 10px;
  margin: 30px auto;
  font-weight: 800;
}


#overlay-modal{
  background: rgba(0, 0, 0, 0.80);
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 10000;
  left: 0;
  top:0;
  display: none;
}


#overlay-modal.show{
  display: block;
}




.modal-full-screen
{
    position: fixed;
    z-index: 1000001;
    display: block;
    bottom: 0;
    left: 100%;
    max-width: 100%;
    min-height: 100%;
    height: 100%;
    background-color: #fff;
}


.show-modal {
  transform: translateX(-100%);
  transition:transform .2s linear;
}



.modal-container
{
  min-width: 100%;
  width: 100%;
  max-width: 100%;
  position: absolute;
  right: 0;
  top: 0;
  overflow-y: auto;
  display: flex;
}

.modal-contentBis
{
  position: relative;
  overflow-y: auto;
  height: 100vh;
  width: 100%;

}


.simmu-carton{

}

.simmu-carton h6{
  font-weight: bold;
  font-size: 1.2em;
}

.btlResteChoisir{

}

.btlResteChoisir span{
  margin: 5px auto;
  color: orange;
  background: rgba(0, 0, 0, 0.5);
  height: 60px;
  display: inline-block;
  font-weight: bold;
  width: 60px;
  line-height: 60px;
  font-size: 1.8em;
  border-radius: 100%;


}


.headerModalOrange{
background: #fe8c00;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #f83600, #fe8c00);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #f83600, #fe8c00); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
padding: 15px 20px;
color: #fff;
text-align: center;
display: block;
width: 100%;
}

.headerModalOrange h4{
font-weight: 900;
text-transform: uppercase;
margin: 0;
padding: 0;
}



.box-model-biere {
  border-bottom: 1px solid #666;
  padding-top: 15px;
}


.box-model-biere h5{
  font-weight: bold;
  text-transform: uppercase;
  font-size: 1.2em;
  margin-bottom: 0;
  padding-bottom: 0;
}

.degree{
  font-size: 0.8em;
  font-weight: bold;
  font-style: italic;
}


.verre-color {
  float: left;
  width: 35px;
  margin-top: 5px;
  margin-right: 10px;
}




.number-input input[type="number"] {
-webkit-appearance: textfield;
-moz-appearance: textfield;
appearance: textfield;
}

.number-input input[type=number]::-webkit-inner-spin-button,
.number-input input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
}

.number-input {
margin-bottom: 5px;
}

.number-input button {
-webkit-appearance: none;
background-color: transparent;
border: none;
align-items: center;
justify-content: center;
cursor: pointer;
margin: 0;
position: relative;
}

.number-input button:before,
.number-input button:after {
display: inline-block;
position: absolute;
content: '';
height: 2px;
transform: translate(-50%, -50%);
}

.number-input button.plus:after {
transform: translate(-50%, -50%) rotate(90deg);
}

.number-input input[type=number] {
text-align: center;
}

.number-input.number-input {
border: 1px solid #ced4da;
width: 10rem;
border-radius: .25rem;
}

.number-input.number-input button {
width: 2.6rem;
height: .7rem;
}

.number-input.number-input button.minus {
padding-left: 10px;
}

.number-input.number-input button:before,
.number-input.number-input button:after {
width: .7rem;
background-color: #495057;
}

.number-input.number-input input[type=number] {
max-width: 4rem;
padding: .5rem;
border: 1px solid #ced4da;
border-width: 0 1px;
font-size: 1rem;
height: 2rem;
color: #495057;
}

@media not all and (min-resolution:.001dpcm) {
@supports (-webkit-appearance: none) and (stroke-color:transparent) {

.number-input.def-number-input.safari_only button:before,
.number-input.def-number-input.safari_only button:after {
  margin-top: -.3rem;
}
}
}
.blue-border {
border-top: 2px solid #4285f4;
}
.shopping-cart .def-number-input.number-input {
border: none; }
.shopping-cart .def-number-input.number-input input[type=number] {
max-width: 2rem;
border: none; }
.shopping-cart .def-number-input.number-input input[type=number].black-text, .shopping-cart .def-number-input.number-input input.btn.btn-link[type=number], .shopping-cart .def-number-input.number-input input.md-toast-close-button[type=number]:hover,
.shopping-cart .def-number-input.number-input input.md-toast-close-button[type=number]:focus {
  color: #212529 !important; }
.shopping-cart .def-number-input.number-input button {
width: 1rem; }
.shopping-cart .def-number-input.number-input button:before, .shopping-cart .def-number-input.number-input button:after {
  width: .5rem; }
.shopping-cart .def-number-input.number-input button.minus:before, .shopping-cart .def-number-input.number-input button.minus:after {
  background-color: #9e9e9e; }
.shopping-cart .def-number-input.number-input button.plus:before, .shopping-cart .def-number-input.number-input button.plus:after {
  background-color: #4285f4; }
.shopping-cart .def-number-input.number-input.mt-n05 {
margin-top: -.33rem; }

.shopping-cart .back-link {
position: absolute;
bottom: 0; }






.blocModeleBiere{
  position: relative;
}


.blocModeleBiere h4{
  font-weight: 800;
  text-transform: uppercase;
  font-size: 2.5em;
  display: block;
  margin-right: -50px;
  z-index: 1;
  position: relative;
  padding: 12px 0 12px 0;
  text-align: left;
}

.blocModeleBiere h4:after{
  content: '';
  width: 150px;
  height: 100%;
  left: -100px;
  top: 0;
  position: absolute;
  border: solid 6px #000;
  z-index: -1;
}

.contenu{
  border-left: solid 1px rgb(79, 79, 79);
  padding: 20px 0 20px 10px;;
}

.type-biere{
  display: block;
  font-size: 1.2em;
  margin-bottom: 10px;
}

.degree2{
  display: block;
  font-size: 1em;
  margin-bottom: 10px;
}

.accroche{
  display: block;
  font-size: 1em;
  margin-bottom: 10px;
  font-weight:700;

}

.description{
  margin-bottom: 10px;
  font-size: 0.8em;

}

.ingredients{
  font-size: 0.8em;

}

.ingredients span{
  display: block;
  font-weight: 600;

}


.color-sf{
  text-color:#5bc2ef;
}

.color-pa{
  text-color:#ffed00;
}

.color-ip{
  text-color:#f7a600;
}

.color-ab{
  text-color:#bf8c54;
}

.color-sa{
  text-color:#a2c516;
}


.bg-sf{
  background:#5bc2ef;
}

.color-pa{
  background:#ffed00;
}

.color-ip{
  background:#f7a600;
}

.color-ab{
  background:#bf8c54;
}

.color-sa{
  background:#a2c516;
}


.blocModeleBiere h4.border-sf:after{
  border: solid 6px #5bc2ef;
}

.blocModeleBiere h4.border-pa:after{
  border:solid 6px #ffed00;
}

.blocModeleBiere h4.border-ip:after{
  border: solid 6px #f7a600;
}

.blocModeleBiere h4.border-ab:after{
  border: solid 6px #bf8c54;
}

.blocModeleBiere h4.border-sa:after{
  border: solid 6px #a2c516;
}



.marmotte-gradient{
  background: #fe8c00;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #f83600, #fe8c00);  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #f83600, #fe8c00); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.listDateRetrait{
  padding: 0;
  margin: 0;

}

.listDateRetrait li{
  display: inline-block;
  margin: 5px 0;
  font-size: 0.9em;
  font-weight: 700;
  background: rgba(0, 0, 0, 0.1);
  padding: 3px;
  cursor: pointer;
}

.listDateRetrait li.select{
  background: #97ff92;
}



.listDateRetrait li span.lieu, info-retrait .lieu{
  display: block;
  font-size: 0.9em;
  font-weight: normal;
}

.info-retrait{
  background: rgba(0, 0, 0, 0.1);
}




.img-panier{
  width: 150px;
}

.content-cgu{

}

.content-cgu h6{

}

.content-cgu h5{

}

.content-cgu p{

}


.contact-section .contact {
  background: #fe8c00;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #f83600, #fe8c00);  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #f83600, #fe8c00); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+,*/
  border-radius: 0 .25rem .25rem 0;
}

#footer{
  background: rgb(79, 79, 79);
  color:#fff;
  text-align: center;
  padding: 10px; 0;
}

.moderation{
  display: block;

}



.copyright{
  font-size: 0.8em;
  display: block;

}

.blocInfoRetraitPanier{
	background:rgba(0,0,0,0.1);
	margin: 20px auto;
	padding:10px 20px;
}

.blocInfoRetraitPanier h6{
	padding:0;
	font-size:1.5em;
	font-weight:800 !important;
}