@font-face { 	font-family: "rancho"; 	src: url('../img/Rancho-Regular.ttf'); }
@font-face { 	font-family: "multi"; 	src: url('../img/Sans-Bold.ttf'); }
@font-face { 	font-family: "bebas"; 	src: url('../img/BebasNeue-webfont.ttf'); }
html {
	margin:0;
	padding:0;
    overflow-y: scroll;
	height:100%;
}
body {
	height:100%;
    font-family: rancho, Verdana, Geneva, sans-serif;
    padding: 0; margin:0;
}
.modepa {
	font-family: bebas, Verdana, Geneva, sans-serif;
	font-size:1.5em;
	text-align:center;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:#fff;
	color:#767676;
	z-index:2000;
	}
.tmodepa {
	padding:5px;
	position:fixed;
	top:5%;
	width:100%;
}
.ce { text-align:center; }
a { text-decoration:none; outline:none; }
button { outline:none;}
.too {
margin:0;
padding:0px 0px 25px 0px;
width:100%;
border:0;
}
input, textarea, select {
	padding: 3px;
	border: 2px solid;
	border-radius: 3px;
	-moz-box-shadow:    inset 0 0 3px #888;
    -webkit-box-shadow: inset 0 0 3px #888;
    box-shadow:         inset 0 0 3px #888;
}
.aj {
	margin:0;
	padding:20px 0px;
	font-size:22px;
	text-align:center;
	width:100%;
	color:#002545;
	background-color:#f7f1e3;
	height:100%;
}
.panier { margin-left:9%; margin-right:9%; padding-top:25px; text-align:center;}
.commande { margin-left:9%; margin-right:9%; padding-top:10px; text-align:center;}
.panierc { margin: 0 auto; width:700px; text-align:center; border: 2px solid;}
.etape { border: 2px solid;}
.paniere { margin: 0 auto; width:700px; text-align:center;}
.contain {
	margin-left:9%; margin-right:9%; padding-top:25px;
}
.tabld { text-align: right;}
.tablg { text-align: left;}
.divcache {
	display:none;
}
.aff {
	padding:0px;
	margin:0px;
	border: 0px;
	overflow:hidden;
}
.maximg {
	max-width:660px;
	max-height:660px;
}
.pff {
	color:#002545;
	float:right;
	font-size:24px;
	text-align:center;
	width:250px;
	padding:0px 15px 12px 15px;
	background-color:#f7f1e3;
	overflow:hidden;
}
.pff2 {
	font-size:19px;
	background-color:#002545;
	padding:1px 5px 3px 5px;
	text-align:left;
	margin-bottom:3px;
	line-height:100%;
	color:#f7f1e3;
}
.pff3 {
	padding:15px 20px 15px 0px;
}
.pff5 {
	float:right;
	position:relative;
	right:10px;
	top:-2px;
}
.pff6 {
	font-size:20px;
	font-weight:100;
	padding:0px 0px 0px 10px;
	border:2px solid #002545;
	text-align:left;
	font-family: multi, Arial, Helvetica, sans-serif ;
}
.pff7 {
	float:right;
	position: relative;
	right:30px;
}
sup { vertical-align:20%; font-size:14px;}
.item { float: left; position: relative; line-height: 1em;}
.item:hover {
	background-image:url(../img/zoom.png);
	background-repeat:no-repeat;
	background-position:50% 50%;
}
.titr { margin-left:10%; margin-right:11%; height:75px; padding:25px 0px 0px 0px;}
.haut { width:100%;
}
.hautimg { -moz-box-shadow: 0px 0px 30px 10px #666;
-webkit-box-shadow: 0px 0px 30px 10px #666;
-o-box-shadow: 0px 0px 30px 10px #666;
box-shadow: 0px 0px 30px 10px #666;
 background-color:#666;
border-bottom-right-radius: 150px 30px;
-webkit-border-bottom-right-radius: 150px 30px;
-moz-border-radius-bottomright: 150px 30px;
border-bottom-left-radius: 150px 30px;
-webkit-border-bottom-left-radius: 150px 30px;
-moz-border-radius-bottomleft: 150px 30px;
}
.t { font-size:40px; font-weight:100; white-space:nowrap; line-height:90%;}
.st { font-size:20px; font-weight:100; white-space:nowrap;}
.st5 { font-size:22px; font-weight:100; white-space:nowrap;}
.t1 { font-size:60px; font-weight:100; white-space:nowrap;}
.st1 { font-size:30px; font-weight:100; white-space:nowrap;}
.st2 { font-size:18px; font-weight:100; white-space:nowrap;}
.st3 { font-size:18px; font-weight:100;}
.hh { font-size:26px; line-height:100%; white-space:nowrap; text-decoration:none; text-align:right; padding:5px 15px 5px 15px; border: 2px solid;}
.hhh { color:#002545; font-size:26px; line-height:100%; white-space:nowrap; text-decoration:none; text-align:right; padding:5px 15px 5px 15px; border: 2px solid;}
.hv { font-size:24px; line-height:100%; text-decoration:none; white-space:nowrap; padding:5px 15px 5px 15px; font-family: rancho, Verdana, Geneva, sans-serif;}
.hh:hover, .hhh:hover {	border: 2px dashed;}
.hv:hover {	border: 2px solid;}
.fixe {
	text-align:center;
	float:right;
	position: fixed;
	top:10px;
	right:15px;
z-index:2;
}
.fixmob {
	text-align:center;
	width:650px;
	background-color:#f7f1e3;
	font-size:1em;
	padding:5px;
	text-align: center;
	font-family: multi, Arial, Helvetica, sans-serif ;
	display:none;
}
.icons a {
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	-o-transition: all .3s;
	-moz-transition: all .3s;
	-webkit-transition: all .3s;
	-ms-transition: all .3s;
}

.icons a.cart { background: url(../img/cart.png) left top no-repeat; }
.icons a:hover { background-position: left -34px; }

.grid-sizer { width: 20%; }
.item { width: 20%; }

@media screen and (max-width: 1550px) {
  .grid-sizer { width: 25%; }
  .item { width: 25%; }
}

@media screen and (max-width: 1200px) {
  .grid-sizer { width: 33.33%; }
  .item { width: 33.33%; }
}
@media screen and (max-width: 1024px) {
  .grid-sizer { width: 33.33%; }
  .item { width: 33.33%; }
  .haut { display:none;}
  html { background: url(../img/pattern.png) no-repeat center fixed;}
}
@media screen and (max-width: 939px) {
  .grid-sizer { width: 33.33%; }
  .item { width: 33.33%; }
  .pff { display:none;}
  .fixmob { display: block;}
   .fixe { position: relative; float:inherit; top: -20px; right:0px; }
}
@media screen and (max-width: 660px) {
  .grid-sizer { width: 50%; }
  .item { width: 50%; }
  .hh2 { display:none; }
  .maximg { width:310px;}
  .fixmob { display: block; width:300px;}
  .contain { margin-left:10px; margin-right:0px; margin-bottom:10px; padding-top:25px;}
  .titr { margin-left:10px; margin-right:0px; height:75px;}
}

.image{
	border:0;
    width: 95%;
    margin-bottom: 5%;
	padding: 0;
    display: block;
}

.image:hover{
	opacity: 0.7;
	-webkit-transition: 0.4s ease-in-out;
    -moz-transition: 0.4s ease-in-out;
    transition: 0.4s ease-in-out;
	-webkit-transform: scale(1.04);
    -moz-transform: scale(1.04);
    -o-transform: scale(1.04);
    transform: scale(1.04);
}

.image:after {
    clear:both;
}
#load {
	float:left;
	position: fixed;
	top:0px;
	left:0px;
	z-index:12;
	width:100%;
	height:100%;
	background-color: rgba(0,0,0,0.90)
}
.loader {
	color:#f7f1e3;
	margin:auto;
	width:100%;
	height:100%;
	top:25%;
	text-align:center;
	position:fixed;
	vertical-align:50%;
}
.spinner {
  margin: 20px auto 0;
  margin-bottom:20px;
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #fff;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: bouncedelay 1.4s infinite ease-in-out;
  animation: bouncedelay 1.4s infinite ease-in-out;
  /* Prevent first frame from flickering when animation starts */
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0.0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes bouncedelay {
  0%, 80%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);	
  } 40% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}