/***********************************************************
************************************************************
**                                   _     _              ** 
**                                  (_)   | |             **
**           ___ _ __ ___  __ _  ___ _  __| |             **
**          / __| '__/ _ \/ _` |/ __| |/ _` |             **
**         | (__| | |  __/ (_| | (__| | (_| |             **
**          \___|_|  \___|\__,_|\___|_|\__,_|             **
**   __________________________________________________   **
**   Createur de site internet - © tous droits reserves   **
**                 www.creacid.com                        **
**                                                        **
************************************************************
************************************************************/
@font-face{
font-family: 'lato';
src: url('/__ovh/common/font/lato-light-webfont.eot');
src: url('/__ovh/common/font/lato-light-webfont.eot?#iefix') format('embedded-opentype'),
url('/__ovh/common/font/lato-light-webfont.woff') format('woff'),
url('/__ovh/common/font/lato-light-webfont.ttf') format('truetype'),
 url('/__ovh/common/font/lato-light-webfont.svg#latolight') format('svg');
font-weight: 200;
font-style: normal;
}
/* GENERAL */
body{margin:0;background:#f2f2f2;color:#5E5E5E}
article,aside,details,
figcaption,figure,footer,
header,hgroup,main,
nav,section,summary{display:block}
audio,canvas,img,video{vertical-align:middle}
img{border:0;-ms-interpolation-mode: bicubic}
textarea{resize:vertical}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
.img-responsive{display:block;max-width:100%!important;height:auto!important}

/* CORPS */
#maj-ie{margin:0.2em 0;background:#ccc;color:#000;padding:0.2em 0}
.wrapper{display:inline-block;width:80%;margin:0 10%}
/* contenu */
#head-container{width:100%;padding:3% 0 4%;position:relative;background:#00C6FF url(../img/bg_header.png) repeat-x}
#head-container img{width:20%}
#head-container #casque-img{position:absolute;max-width:12%;margin:0 32%}
#main-container{overflow:hidden;display:block;width:100%;margin:0 auto;padding:7% 0 2%}
#main-container #shadow{display:block;max-width:60%;margin:0 auto}
#main-container .box25{display:block;float:left;width:21%;margin:5% 2% 0;padding:0}
#main-container .box25 img{display:block;margin:0 auto}

/* creacid */
#creacid .wrapper{display:block;width:95%;margin:0 2.5%;padding:0}
#creacid{overflow:hidden;display:block;width:100%;padding:0.5% 0;height:auto;background:#000;border-top:5px solid #F1C633}
#creacid #copyright1{float:left;width:40%}
#creacid #copyright2{float:left;width:60%}
#creacid #copyright2 img{float:right;padding:0.5% 5% 0 0}
#creacid #copyright1 a{margin:0;padding-left:5%;color:#fff;font-size:.9em;font-weight:500;text-decoration:none;font-style:italic;letter-spacing:1px}

/* police */
html{font-size:1em;line-height:1.4}
html,body{font:16px/26px "lato", 'Arial'}
p{margin:1em 0;font-size:1.5em;text-align:center}
a{color:#F1C633;text-decoration:none;-webkit-transition:color 300ms, background-color 300ms;-moz-transition:color 300ms, background-color 300ms;-o-transition:color 300ms, background-color 300ms;transition:color 300ms, background-color 300ms}
a:active,a:hover,a:focus{outline:0;color:#000;text-decoration:none;outline: none}
h1{text-align:center}

@media only screen and (max-width: 768px){ 
#head-container img{width:40%}
#head-container #casque-img{position:absolute;max-width:15%;margin:0 32%}
#main-container .box25{display:block;float:left;width:46%;margin:5% 2% 0;padding:0}
#creacid #copyright1{display:none !important}
#creacid #copyright2{width:100%;margin:0 auto}
#creacid #copyright2 img{float:left;display:block;padding:0.5% 0;margin-left:43%} 
}
@media only screen and (max-width: 480px){
#head-container img{width:60%}
#head-container #casque-img{position:absolute;max-width:20%;margin:0 32%}
p{margin:1em 0;font-size:1.2em;text-align:center}
}  