/* basics resets */
*,
*:before,
*:after {
  box-sizing: border-box;
  margin:0; padding:0;
}
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}


h1 {font-size:36px; font-weight:400; margin:30px 0 50px 0; color:#0066FC;}
h2 {font-size:30px; font-weight:400; margin:5px 0 20px 0; color:#0E6E8A;}
h3 {font-size:20px; font-weight:600; margin:5px 0 20px 0; color:#0E6E8A;}

em, .texte-italic { font-style:italic; }

a.a-simple {text-decoration:none; }
a.btn { cursor:pointer; padding:6px 10px; background-color:#0E6E8A; color:#eee; border-radius:6px; text-decoration:none;  }
a.btn-orange { cursor:pointer; padding:6px 10px; background-color:#FE7E00; color:#eee; border-radius:6px; text-decoration:none;  }
a.btn-vert { cursor:pointer; padding:6px 10px; background-color:#99FF00; color:#333; border-radius:6px; text-decoration:none;  }
a.btn-sm { padding:2px 6px; font-size:14px; }
a.btn-lg { padding:10px 12px; font-size:18px;  }
.btn-bd {position:absolute; bottom:20px; right:20px; }
.btn-bg {position:absolute; bottom:20px; left:20px; }
.btn-hg {position:absolute; top:20px; left:20px; }
.btn-hd {position:absolute; top:20px; right:20px; }
a.btn-empty {background-color:transparent;opacity:.5}
a.btn-empty:hover {opacity:1;background-color:transparent;}
a.btn-info {background-color:#693;color:white;}
a.btn-info:hover {opacity:1;background-color:#7A4;}
a.btn-cancel { background-color:#A47; color:white; }
a.btn-cancel:hover { background-color:#936; }
a.btn-fixe { z-index:100; position:absolute; top:0; left:0; padding:6px; background-color:#369; color:white; text-decoration: none; border-radius:0 0 4px 4px; }
a.btn-outline {cursor:pointer; padding:6px 10px; border:1px solid #0E6E8A; color:#0E6E8A; border-radius:3px; text-decoration:none; }
a.btn-outline:hover {border:1px solid #000; color:#000; }
.btn-att1 {padding-left:44px!important; background:url('../../img/ico-att.png') no-repeat 4px center;}
.pointer {cursor:pointer;}

.texte-big { font-size:48px; font-weight:300; color:#47A; }
.texte-notsobig { font-size:32px; font-weight:300; color:#47A; }
.texte-medium { font-size:22px;   }
.texte-18 { font-size:18px;   }
.texte-20 { font-size:20px;   }
.texte-normal { font-size:14px;   }
.texte-small { font-size:12px; font-weight:300; }
.texte-center { text-align:center; }
.texte-fin {font-weight:300;}
.texte-gras, strong {font-weight:700;}
.texte-right { text-align:right; }
.texte-MAJ {text-transform:uppercase;}
.texte-condensed {font-family:'Roboto Condensed'}
.texte-light {color:#DDD;}
.texte-italic {font-style:italic;}

.texte-rouge {color:red;}
.texte-vert {color:green;}
.texte-vertgtv {color:#99FF00;}
.texte-white {color:white;}
.texte-black {color:black;}
.texte-bleu { color:#3B52D1; }

.padding-big-top {padding-top:30px!important;}

.flag-hg { position:absolute; top:0; left:0; }
.flag-hd {position:absolute; top:0; right:0%;}
.flag-bg { position:absolute; bottom: 0; left:0; }
.flag-bd {position:absolute; bottom: 0; right:0%;}

.p-2em {line-height:2em;}
.p-12em {line-height:1.2em;}
.p-14em {line-height:1.4em;}
.p-16em {line-height:1.6em;}
.p-18em {line-height:1.8em;}
.p-3em {line-height:3em;}
.p-4em {line-height:4em;}
.p-texte {padding:0 2%!important; line-height:1.4em;}
.p-marge {padding:0 15%!important;}
.p-important { margin: 20px 10px; padding:20px; border:1px solid #0E6E8A; background-color: #CADDE3; color:#0E6E8A; font-size:18px; text-align:center;}

img.img-full {width:100%;}
img.img-responsive {width:80%;}
img.img-half {width:50%;}
img.img-quarter {width:25%;}
img.img-inline {display:inline;}
img.img-rounded {border-radius:8px;}
img.img-circle { border-radius:50%;}
img.img-vignette-150 {width:150px;}

.wrapper { width:100%; margin:auto; }
  .mobile { display: block!important; }
  .desktop , .desktop-inline { display: none!important; }
  .mobile-inline { display: inline!important; }


/* grid */
.row { display: flex; flex-flow: row wrap;   }
.row:last-child { margin-bottom: 0; }

[class*="colonne-"] { padding: 0px; width: 100%; }
.col-pad { padding:10px; }
.col-relative {position:relative;}
.col-vert { align-items: center;}
.col-hori {justify-content: center;}
.col-flex { display:flex;}
.col-wrap {flex-wrap: wrap;}
.col-reverse {flex-direction:row-reverse; }
.col-zoom { transition:all .4s ease; }
.col-zoom:hover {transform: scale(1.1); background-color:#eee; z-index:100;}
.col-col1 {background-color:green;}
.col-col0 {background-color:orange;}
.col-mobile-footer {padding-bottom:80px;}
.col-footer {padding-bottom:80px;}
.col-column {flex-direction: column;}
.col-maxheight {height:100%;}
.col-lightgrey {background-color: #F5F5F5; }
.col-rounded {border-radius:8px;}
.col-center-content { display: flex; display: -ms-flexbox; flex-direction: column; justify-content: center; }
.col-marge-top { margin-top:20px!important; }
.col-marge-bottom {margin-bottom:20px!important;}
.col-padding-top { padding-top:20px!important; }
.col-padding-left { padding-left:20px!important; }
.col-padding-bottom {padding-bottom:20px!important;}
.col-ofhd {overflow:hidden;}
.col-border {border:1px solid #eee;}
.col-hover {background-color:#FAFAFA;}
.col-hover:hover {background-color:#F8F8FA;}
.col-vertgtvlight {background-color:#E1FBBA;}
.col-vertgtv {background-color:#99FF00;}
.col-orangegtv { background-color: #FE7E00; }
.col-jaunegtv { background-color: #FAFE7D; }
.col-white {background-color:white;}
.col-gris {background-color:#EEE;}

.h-250 {height:250px;}
.h-150 {height:150px;}

.col-absolute-800 { position:absolute; bottom:0; background-color:rgba(255,255,255,0.5); padding-bottom:80px;}

@media all and ( min-width: 500px ) {
  /* set col widths */
  .colonne-25 { width: 50%; }
  .colonne-12 { width: 25%; }
  .col-mobile-footer {padding-bottom:0px;}

}
@media all and ( min-width: 800px ) {
  /* set col widths */
  .colonne-100 { width: 100%; }
  .colonne-75 { width: 75%; }
  .colonne-66 { width: 66.6%; }
  .colonne-50 { width: 50%; }
  .colonne-34 { width: 33.4%; }
  .colonne-33 { width: 33.3%; }
  .colonne-25 { width: 25%; }
  .colonne-20 { width: 20%; }
  .colonne-12 { width: 12.5%; }
  .mobile-inline , .mobile { display: none!important; }
  .desktop { display: block!important; }
  .desktop-inline { display: inline!important; }
  .col-absolute-800 { position:relative; }
.p-texte {padding:0 15%!important; line-height:1.6em;}

}
