@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: local('Lato Light'), local('Lato-Light'), url(../fonts/KT3KS9Aol4WfR6Vas8kNcg.woff) format('woff');
}

/* latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: local('Ubuntu Regular'), local('Ubuntu-Regular'), url(../fonts/4iCs6KVjbNBYlgoKfw72.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url(./fonts/pEobIV_lL25TKBpqVI_a2w.woff2) format('woff2');
}


body {
FONT-FAMILY: lato;
FONT-SIZE: 12px;
margin: 0px;
padding: 0px;
width:100%;
height:100%;
background-size: 100% auto;
background-color: #EEE!important;
}

html
{
height: 100%;
height:100%;
}

#spacer {
clear : both;
}	

.txtrougefonce {
COLOR: #990000;	
}	

.txtrouge {
COLOR: #FF0000;	
}

.txtnoir {
COLOR: #000000;	
}

.txtgris {
COLOR: #cccccc;	
}

.txtbleu {
COLOR: #2c739b;	
}

.txtgrisfonce {
COLOR: #999999;	
}

.txtvert {
COLOR: #009900;	
}

.txtorange {
COLOR: #ff6600;	
}

.stabilo {
background-color:#ffff66;
}

#divvidhg {
color: #FFF;
margin-top: 50px;
display:block;
}

#baseline {
text-align:center;
font-size:25px;
font-family: 'Oswald';
}

#divalert {
color:#59bfec;
font-size:13px;
font-family:arial;
margin-top: 5px;
}

.videocontainer{
width: 100%;
height: 0;
padding-bottom: 46%;
overflow: hidden;
position: relative;
}
.videocontainer iframe, .videocontainer embed, .videocontainer object{
width: 100%!important;
height: 100%!important;
position: absolute;
top: 0; left: 0;
}

#infoprod {
color: #000;
background-color: #FFF;
margin-top: 30px;
padding:20px;
box-shadow: 0 1px 4px rgba(0,0,0,.3);
}

#btnpay {
background-color:orange;
color:black;
font-size:18px;
font-weight:bold;
display:inline-block;
margin-bottom:40px;
}

#ha {
font-family: Arial, Helvetica, sans-serif;
margin-top:20px;
margin-bottom:20px;
border: 2px dashed red;
padding:10px;
font-weight: normal;
font-size: 13px;
background-color: #ffffe6;
text-align: justify;
}


#accroche {
font-size:45px;
}

#footer{
height: auto;
width: 100%;
margin: 300px 0 0 0;	
text-align: center;
padding:25px;
color: #CCC;
font-size: 10px;
bottom:0;
background-color: #222;
}





@media only screen and (max-width:768px) {
#divvidhg {
margin-top: 20px;
}
#baseline {
font-size:16px;
}
#accroche {
font-size:35px;
}
#offre {
font-size:16px;
}
#footer{
margin-top:45%;
}
}