/* ************ FONTS ************ */
@font-face {
  font-family: 'Cabin';
  font-style: normal;
  font-weight: 700;
  src: local('Cabin Bold'), local('Cabin-Bold'), url('../font/cabinBold.woff') format('woff');
}
@font-face {
  font-family: 'Cabin';
  font-style: normal;
  font-weight: 400;
  src: local('Cabin Regular'), local('Cabin-Regular'), url('../font/cabinRegular.woff') format('woff');
}
@font-face {
  font-family: 'Cabin';
  font-style: italic;
  font-weight: 400;
  src: local('Cabin Italic'), local('Cabin-Italic'), url('../font/cabinItalic.woff') format('woff');
}

/********** A GARDER EN L'ETAT ************/
*{margin:0; padding:0;}
table{border-spacing:0;}
ul,ol {margin-bottom:10px;}
li{margin-left: 25px;}
a img{border:0}
html {font-size: 100%;}
.clear{clear:both;}
.centre{text-align:center;}
.img_gauche {float:left; display:inline; margin:0 5px 5px 0;}
.img_droite {float:right; display:inline; margin:0 0 5px 5px;}
.ui-helper-hidden-accessible {top:0; /*Bug datepicker en pied de page*/}
section,nav,article,aside,hgroup,header,footer{display:block;}

@media (max-width: 640px) {
 /* passer tous les éléments de largeur fixe en largeur automatique */
 body, element1, element2 {
   width: auto;
   margin: 0;
   padding: 0;
 }

 /* fixer une largeur maximale  de 100 % aux éléments potentiellement problématiques */
 img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
   max-width: 100%;
 }
/* conserver le ratio des images et empêcher les débordements de boîtes dûs aux border ou padding */
 img {
   height: auto; width: auto;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 /* gestion des mots longs */
 textarea, table, td, th, code, pre, samp {
   word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; /* césure propre */
   -moz-hyphens: auto;
   hyphens: auto;
 }
 code, pre, samp {
   white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
 }

 /* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */
 element1, element2 {
   float: none;
   width: auto;
 }

 /* masquer les éléments superflus */
 .hide_mobile {
   display: none !important;
 }

}

/*********** A PERSONNALISER **************/
body {font: normal 1em 'Cabin'; color:#010005;}
#body{background:#f1f1f1;}
table{font-size:0.75em;}
a{color: #f10000; text-decoration:none;}
a:hover {text-decoration:underline;}

body#bodyuploadfichier {background-color:transparent}
body#bodyuploadfichier li {padding:0px;background:none; height:20px}
body#bodyuploadfichier a{text-decoration:none}
body#bodyuploadfichier a.fichier{margin:1px ; font:bold 12px arial; color:#000; text-decoration:none;display:inline-block; float:left; width:150px; overflow:hidden}
body#bodyuploadfichier a.fichier:hover{margin:0px; border:1px solid #fff}
body#bodyuploadfichier a.supprimer {background:url('/bop2/images/icone/supprimer.png') 0 0 no-repeat; color:transparent;width:20px; overflow:hidden; display:inline-block }
body#bodyuploadfichier #uploadFichier {list-style-type: none;}
body#bodyuploadfichier #uploadFichier li {margin:5px; padding:5px;  box-shadow:0px 0px 5px #fff; white-space:nowrap;width:90%;cursor:move;height:35px}
body#bodyuploadfichier #uploadFichier li  img {vertical-align:middle;}
body#bodyuploadfichier #uploadFichier li  a.supprimer {background:url('/bop2/images/icone/supprimer.png') 0 9px no-repeat; color:transparent;width:16px;height:32px; overflow:hidden; display:inline-block;float:right}

h1{font-size:1em; margin-bottom:5px;}
h2{font: bold 0.875em 'Cabin'; margin-bottom:5px;}
h3{font: bold 0.750em 'Cabin';}
p {font-size:0.750em;}
strong{font-weight: bold;}
em{font-style: italic;}

.color{color:#be0000;}
.bold {font-weight:bold;}
.hr{font-size:1px; height:10px; border-bottom:1px solid #f10000; margin:0 0 10px;}
.asterisque{font-style:italic; font-size:9px;}

/*Megaselect*/
.MegaSelectInfobulle  {float:left; position:relative;display:inline;z-index:100}
.MegaSelectInfobulle .zoneAffichable {position:absolute; top:25px; display:none; box-shadow: 1px 1px 5px #555; border:1px solid #fff; padding:5px;  }
.MegaSelectInfobulle ul { list-style-type:none; margin-left:0px;}
.MegaSelectInfobulle li { margin-left:0px;border-bottom:1px dotted #808080}
.MegaSelectInfobulle li.selected {color:#fff; background-color:#808080}
.MegaSelectInfobulle .surligne {color:#000; background-color:#ffff00}

/* Formulaires */
.bouton{
  display:block; color:#fff; background-color:#f10000;
  font:bold 11px 'Cabin'; line-height:20px; width:160px; height:20px; border-width:0;  
  text-align:center; cursor:pointer;
}

input{margin-bottom:0px !important; margin-bottom:-2px !important!; margin-bottom:-2px;}
input, select, textarea{font:1em Cabin; color:#000; border:0; background:#fff;}
input[type="checkbox"], input[type="radio"]{border-width: 0;}
label {font:0.875em 'Cabin';}

.row{clear:both; margin-bottom:5px; width:98%; background:#fff; padding:3px;}
.row label{float: left; line-height:22px; margin-right: 5px; width: 35%; text-align: right;}
.row input,
.row select  {width:62%; height:22px; border-left:1px solid #8c8c8d;}

.row_chk{padding:0; clear:both; margin-bottom:5px;}
.row_chk input{border:0}
.row_chk label{float:none; display:inline; margin:0; padding:0; cursor:pointer;}

.row_are{clear:both; margin-bottom:5px;}
.row_are label{display:block;}
.row_are textarea{width:300px;}

.row_rad {clear:both; margin-bottom:5px;}
.row_rad .label{float:left; width:145px; text-align:right;}
.row_rad .rad {margin-left:150px; margin-bottom:1px;}
.row_rad .rad input{vertical-align:middle; border:0}
.row_rad .rad label{float:none; display:inline; margin:0; padding:0; cursor:pointer;}

.row_bt {clear:both; margin-bottom:5px; text-align:center;}
.row_bt input{ font:0.875em Cabin; color:#fff; text-align:center; padding:0 8px; height:26px; border:0;
background: #fe0000; /* Old browsers */
background: -moz-linear-gradient(top,  #fe0000 0%, #9c0000 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fe0000), color-stop(100%,#9c0000)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #fe0000 0%,#9c0000 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #fe0000 0%,#9c0000 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #fe0000 0%,#9c0000 100%); /* IE10+ */
background: linear-gradient(to bottom,  #fe0000 0%,#9c0000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe0000', endColorstr='#9c0000',GradientType=0 ); /* IE6-9 */
}
.row_captcha input{margin-left:150px;}

.errors li{color:#ff0000}



/**********************************************/
/******************  CONTENEURS  **************/
/**********************************************/
#conteneur {width:100%;}
#header {width:100%; text-align:center; margin-bottom:15px; height:38px; overflow:hidden; position:relative;
background: #ffffff; /* Old browsers */
}
#header #logo {width:153px; height:38px; display:inline-block;}
#header #logo img{width:153px; height:25px; display:block;margin-top:6px;}

#content {border-bottom:1px solid #2c2c2c; padding-bottom:31px;}

#retour {width:55px; padding-right:5px; position:absolute; top:5px; left:5px; color:#fff; font:0.75em Cabin; line-height:30px; text-align:right; background:url(../images/mobile/btBack.png) 0 0 no-repeat;}

#deconnexion {position:fixed; bottom:0; width:100%; display:block; border-top:1px solid #838383; background:#494949; text-align:center; font-size:1.125em; line-height:30px; color:#fff;}

/******************************************/
/******************  CONNEXION  **************/
/******************************************/
.boiteConnexion {width:98%; margin:0 auto;}
#connexion {border-bottom:1px solid #e7e7e7; padding-bottom:20px;}
#mdpOublie {border-top:1px solid #f9f9f9; padding-top:20px;}


/******************************************/
/**************  HOMEPAGE  ****************/
/******************************************/