/*  couleur lien : 0f9ed3 - couleur titre : 5e377b - orange f8b71e */

:focus { -moz-outline-style: none; }

body {/*background:#f8b71e;*/ background:#EEE;text-align:center; margin:0; padding:0; overflow-x:hidden; font-size:14px; font-family: 'Pontano Sans', sans-serif; /* OU 'Ruluko', sans-serif; OU 'Source Sans Pro', sans-serif;*/ }

H1, H2, H3, H4, H5, H6, H7, ul, li, form { font-family:'Raleway', sans-serif; font-weight:normal; margin:0; padding:0; }
H1 a, H2 a, H3 a, H4 a, H5 a, H6 a, H7 a, a p { color:#0f9ed3; text-decoration:none; }

H2 { color:#5e377b; text-align:left; margin-left:0.8em; }

a,a:visited {color:#0f9ed3; text-decoration: none;}
a:focus,a:hover,a:active { color:#5e377b; text-decoration: underline;}
a img { border:0; }
img:hover { /*box-shadow: 0 0 85px rgba(0, 0, 0, 0.8) inset;*/ }

.titre-gros { font-size:2em; display: table; text-align:center; white-space: nowrap; color:#5e377b; margin-bottom:0.5em; }
.titre-gros:after, .titre-gros:before { content: ''; display: table-cell; width: 50%; background: -webkit-linear-gradient(transparent 50%, currentColor 50%, currentColor calc(50% + 1px), transparent calc(50% + 1px));
  background: linear-gradient(transparent 50%, currentColor 50%, currentColor calc(50% + 1px), transparent calc(50% + 1px)); background-clip: padding; }
.titre-gros:after { border-left:0.5em solid #FFF; }
.titre-gros:before { border-right:0.5em solid #FFF; }
.titre-tres-long { width:75%; margin-left:auto; margin-right:auto ;white-space:normal; display:block; }

.titre-moyen { font-size:1.5em; color:#5e377b; font-weight:300; margin:0 0 0.7em 0; }
H2.titre-moyen { text-align:center!important; }
.titre-petit { font-size:1.2em; }
.titre-minus { font-size:1em; }
.titre-extra-minus { font-size:1em; text-align:center; background:#EEE; padding:0.5em; }

p { margin:1em; text-align:justify; font-size:1.2em; color:#333; }
p A {border-bottom:1px dotted #0f9ed3;}
.introduction { text-align:left; font-size:1.2em; color:#666; margin:1.5em; } 
.texte-petit { font-size:1em; }
.texte-moyen { font-size:1.1em; }
.exergue { font-size:0.8em; color:#666; }
.italic { font-style:italic; }
SPAN.reponse {color: #EE5A00; display: block; text-align: left; border: 0; margin: 0.3em 0 0 2em; }
SPAN.reponse::before { content: ">>"; padding-right:0.3em; }

.copyright { width:85%; text-align:left; font-size:0.8em; color:#888; margin:0 0 1.5em 0; }
.copyright a { color:#888; text-decoration:none; border-bottom: 1px dotted #888; }
.copyright.droite { text-align:right; }

.color-violet { color:#5e377b; }
.color-bleu { color:#0f9ed3; }
.color-jaune { color:#f8b71e; }
.color-orange { color:#ff6600; }
.color-blanc { color:#fff; }

.bck-gris-leger { background:#eee!important; }
.bck-gris { background:#ebebeb!important; }
.bck-gris-fort { background:#DDD!important; }
.bck-blanc { background:#fff!important; }
.bck-violet { background:#5e377b!important; }
.bck-bleu { background:#0f9ed3!important; }
.bck-jaune { background:#f8b71e!important; }

.bord-bt-blanc { border-bottom:1px solid #fff; padding:0 0 0.7em 0; margin:0.7em 0 0.7em 0; }
.bord-bt-violet { border-bottom:1px solid #5e377b; padding:0 0 0.7em 0; margin:0.7em 0 0.7em 0; }
.bord-bt-bleu { border-bottom:1px solid #0f9ed3; padding:0 0 0.7em 0; margin:0.7em 0 0.7em 0; }
.bord-bt-jaune { border-bottom:1px solid #f8b71e; padding:0 0 0.7em 0; margin:0.7em 0 0.7em 0; }
.bord-bt-gris { border-bottom:1px solid #CCC; padding:0 0 0.7em 0; margin:0.7em 0 0.7em 0; }

.w-100 { width:100%; }
.w-50 { width:50%; }
.w-33 { width:33%; }
.w-25 { width:25%; }
.w-17 { width:17.5%; }
.w-10 { width:10%; }
.pull-center { text-align:center; margin:0 auto!important; }
.pull-right { float:right!important; }
.pull-left { float:left!important; }
.dispBlock { display:block!important; }
.m1em { margin:0 1em 1em 1em; }

.txt-al-left { text-align:left!important; }
.txt-al-right { text-align:right!important; }
.txt-al-center { text-align:center!important; }

.btn { border-radius:0.35em; font-size:1em; padding:0.71em; box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.2) inset; }
.btn-gris { background:#ebebeb; }
.btn-blanc { background:#FFF; }
.btn-bleu { background:#0f9ed3; color:#FFF!important; }
.btn-violet { background:#5e377b; color:#FFF!important; }
.btn-jaune { background:#f8b71e; color:#FFF!important; }
.btn-border-bleu { border:1px solid #0f9ed3; }
.btn-border-jaune { border:1px solid #f8b71e; }
.btn-grand { font-size:1.3em; }
.btn-homme { width:24px; height:30px; background:url(img/homme_femme.png) 0 0 no-repeat; margin:-0.5em 0.5em 0 0; }
.btn-femme { width:28px; height:30px; background:url(img/homme_femme.png) -25px 0 no-repeat; margin:-0.5em 0.5em 0 0; }

.fw-700 { font-weight:700!important; }
.fw-400 { font-weight:400!important; }

.full-link { display:block!important; } 
.full-link-bord { border-bottom:1px solid #dcdcdc; padding:0 0 0.65em 0; } 

.liste { width:100%; list-style-type:none; text-align:left; overflow:hidden; }
.liste li { display:table; vertical-align:middle; position:relative; padding:0.55em; }
.dictionnaire li { padding-left:0.12em; padding-right:0.12em; }
.liste li a { display:table-cell; vertical-align:middle; }
.liste .vignette { display:block; margin-bottom:0.71em!important; border-bottom:2px solid #f8b71e; }
.liste .clearfix:before { margin-top:0.5em; }
.liste .clearfix:after { margin-bottom:0.5em; }
.liste .clearfix-small:before { margin-top:0; }
.liste .clearfix-small:after { margin-bottom:0; }
.liste li .genericon-help { float:left; display:block; margin:0 0.2em 0 0; }
.liste-recherche { font-size:0.9em; }
.liste-recherche a { font-size:1.2em; margin-bottom:0.5em; }

UL.ingr {list-style-type: disc; text-align:left; width:100%; margin-left:1.2em; }
UL.prepa {list-style-type: decimal;  text-align:left; width:100%; margin-left:1.2em;}
UL.ingr li, UL.prepa li { vertical-align:middle; position:relative; padding:0.55em; }

.box-shadow--2dp { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .10), 0 3px 1px -2px rgba(0, 0, 0, .1), 0 1px 0.35em 0 rgba(0, 0, 0, .10); }
.img-shadow { padding:5px; margin:0 0 1em 0; -webkit-box-shadow: 0px 5px 5px 0px #BBBBBB; box-shadow: 0px 5px 5px 0px #BBBBBB; background:#FFF; }

.polaroid { background:#fff none repeat scroll 0 0; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3); display: inline-block; margin: 5px; }
.polaroid img { margin: 10px 10px 0;}
.polaroid .figcaption { margin:0.5em 0 0.5em 0; text-align: center; display:block; font-size:1.25em; padding:0 0.4em 0 0.4em; }

.icon-halo_gris { background-image: url(img/sprite_ttcompris.png); background-position: 0px -60px; width: 289px; height: 30px; display:block;  }
.icon-logo_ttcompris { width:18em; transition:width .2s; margin: 0 auto; display:block; }
.icon-logo_ttcompris span { width:100%; padding-bottom:25%; display:block; background-image: url(img/logo_ttcompris.svg); background-size: contain; background-repeat:no-repeat; transition:width .2s; }
.icon-fleche { width: 0.45em; height: 0.45em; border-radius: 100%; background:#f8b71e; color:#FFF; font-size:2.2em; font-weight:700; line-height:0.25em; }

.alert { border:1px solid transparent; border-radius:0.2em; margin-bottom:1em; padding:0.5em; }
.alert-succes { background-color: #dff0d8; border-color: #d6e9c6; color:#3c763d; }
.alert-warning { background-color: #fcf8e3; border-color: #faebcc; color:#8a6d3b; }
.alert-danger { background-color:#f2dede; border-color:#ebccd1; color:#a94442; }
.alert-dark { background-color:#333; border-color:#000; color:#0f9ed3; font-size:1.2em; }
.alert SPAN.score { font-size: 1.5em; display:block; font-weight:bold;}
.alert SPAN.bravo, .alert SPAN.erreur { font-size:1.3em; }


/*---------------------------*/

.container { width:100%; margin:0 auto; }
.row-magazines { background:#FFF; margin-bottom:0!important; padding:1.2em 0 0 0; }

/*header*/
.header { height:5.7em; background:#FFF; margin:0 0 1.70em 0; /* overflow: hidden;*/ padding:1.10em 0 3em 0; position:relative; transition:height .2s;}
.header ul li { display:inline; }
#decalFixedHeader { height:10em; }
.header .btn-open-nav-mobile { width:1.5em; height:1.5em; padding:0.4em; display:none; background:#0f9ed3; position:absolute; right:0.6em; border-radius:0.3em; z-index:999; cursor:pointer; color:#FFF; }
.header form { width:100%; }
.header input[type="text"] { width:85%; float:left; color:#666; }
.header button { background: #f8b71e none repeat scroll 0 0; border: 0 none; border-radius: 3px; color: #fff; display: block; font-size:1.8em; font-weight:700; margin:0 0 0 -1em; padding:0.07em 0.14em; float:left; }

.slogan { font-size:1em; float:right; clear:right; display:block; margin-top:0.5em; text-align:right; }

.nav-bar { width:100%; position:absolute; bottom:0; transition-duration:0.1s; }
.nav-bar ul { /*width:100%;*/ display:table; /*table-layout:fixed;*/ list-style-type:none; text-align:center; margin:0 auto; }
.nav-bar ul li { /*display:table-cell;*/ float:left; padding:0 1em 0 1em; font-size:1.25em; position:relative; }
.nav-bar ul li:after { width:1em; height: 1em; content:''; border-bottom:1px solid #f8b71e; position:absolute; top:-2px; right:0; z-index:2; /* Safari */ -webkit-transform: rotate(-55deg); /* Firefox */-moz-transform: rotate(-55deg); /* IE */ -ms-transform: rotate(-55deg); /* Opera */ -o-transform: rotate(-55deg); }
.nav-bar ul li:last-child:after { display:none; }
.nav-bar ul li a { padding:0 0 0.28em 0; transition-duration:0.1s; display:block; border-bottom:2px solid #FFF; }
.nav-bar ul li a:hover { border-color:#f8b71e; border-width:0 0 4px 0; padding:0 0 0.5em 0; text-decoration:none; }

.fete { float:left; font-size:0.9em; color:#666; }
.nav-secondaire { height:40px; position:relative; margin:0; font-size:0.7em; color:#666; }
.nav-secondaire a { color:#666; font-size:1.1em; }
.nav-secondaire li { margin-right:0.5em; }
.nav-secondaire .icon-halo_gris { position:absolute; left:0; bottom:0; }

.header-smaller { width:100%; height:3em; position:fixed; z-index:999; padding-top:0.5em; }
.header-smaller .icon-logo_ttcompris { width:13em; }
.header-smaller .slogan { display:none; }
.header-smaller .nav-bar ul li { font-size:1em; }

@media only screen and (max-width:900px) {
	.titre-gros { white-space: normal; }
	.titre-gros:after, .titre-gros:before { width:30%; }
	
 .nav-bar { z-index:998; top:3.5em; background:#FFF; opacity: 0; visibility: hidden;	transition: all .2s ease; }
 
 .nav-bar-open { opacity:1; visibility:visible; }	
			
 .nav-bar ul { background:#FFF; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .10), 0 3px 1px -2px rgba(0, 0, 0, .1), 0 1px 0.35em 0 rgba(0, 0, 0, .10); border-top:2px solid #0f9ed3; }
    .nav-bar ul li { width:50%; float:left; display:block; margin-top:0.75em; margin-bottom:0.75em; }
 .nav-bar ul li:nth-child(even):after { display:none; }
 .header .btn-open-nav-mobile, .header .removeNavMobile { display:block; }
	.header input[type="text"] { width:75%; }
}

/*HP*/
.panel, .col-center { padding:1em 0 1em 0; margin-bottom:1.2em; border-radius:0.35em; background:#FFF; overflow:hidden; }
.panel .panel-liens { font-size:1.25em; }
.panel .titre-moyen { margin-top:0; text-align:center; }
.panel .titre-moyen.bord-bt-jaune { margin-bottom:0; }
.panel .titre-small { margin:1.2em 0 0 0; }
.panel-h-fixe { /*height:22em;*/ padding-bottom:0; }

.carousel { width:100%; overflow:hidden; position:relative; }
.carousel > ul, .carousel > ul > li { margin: 0; padding: 0; }
.carousel > ul > li { list-style: none; display: block; float: left; position: relative; line-height: 0;}
.carousel > ul > li:not(:first-child) { display:none; }
.carousel img { width: 100%;}

.carousel-w95 { margin:0 0 15px 0; } 
.carousel-w95 img { width:95%; }

.carousel p, .carousel > ul > li > ul { line-height: 1.5em; }

.carousel p img { width: auto;}

.carousel .carousel-caption { width:100%; background: rgba(7,152,206,0.8); /*#0798ce*/ text-align:center; position: absolute; bottom:0; padding:1em 0 1em 0; line-height:1.2em; display:block; font-size:1.25em; }
.carousel-w95 .carousel-caption { width:95%; height:2em; margin:0 auto; /*left:50%; transform:translateX(-50%);*/ position:relative; border-bottom:3px solid #f8b71e;  }

.carousel-control {
  width:0.3em;
  height:0.6em;
  position: absolute;
  top:50%;
  transform:translateY(-50%);
  cursor: pointer;
  font-size:4.5em;
  color: #fff;
		background:#f8b71e;
  /*text-shadow: 0 0 1px black;*/
  text-align: center;
  line-height: 0.4em;
  /*opacity: 0.5;
  font-family: "Lato", "Helvetica Neue", "Helvetica", "Arial", sans-serif;*/
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition-duration: 1s;
  -moz-transition-duration: 1s;
  -o-transition-duration: 1s;
  -ms-transition-duration: 1s;
  transition-duration: 1s;
  z-index:5;
		box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .10), 0 3px 1px -2px rgba(0, 0, 0, .1), 0 1px 0.35em 0 rgba(0, 0, 0, .10);
}
.solo { width:70%; margin-left:auto; margin-right:auto; }
.solo .carousel-control, .solo .carousel-indicators { display:none; }

.carousel-control:hover { opacity: 1;}
.carousel-control.left { left:0; border-radius:0 0.12em 0.12em 0; }
.carousel-control.right { right:0; border-radius:0.12em 0 0 0.12em; }
.carousel-indicators { width:100%; position:absolute; bottom:5.5em; /*left:50%; transform:translateX(-50%);*/ z-index:900; /*background:#ebebeb; opacity:0.7;*/}
.carousel-indicators div {
  /*float: left;*/
		width: 0.85em;
  height: 0.85em;
  background:#FFF;
  background:#FFF;
  /*opacity: 0.4;*/
  border-radius: 100%;
  margin-left:0.5em;
  cursor:pointer;
		display:inline-block;
		box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .10), 0 3px 1px -2px rgba(0, 0, 0, .1), 0 1px 0.35em 0 rgba(0, 0, 0, .10);
}
.carousel-indicators div:hover { opacity: 1; -webkit-transition-duration: 1s; -moz-transition-duration: 1s; -o-transition-duration: 1s; -ms-transition-duration: 1s; transition-duration: 1s; }
.carousel-indicators div.active { background:#f8b71e; }

.ariane, .partage { background: #fafafa none repeat scroll 0 0; border: 1px solid #ddd; border-radius: 3px; display:block; margin:1em 0; padding:0.5em; }
.ariane::after { clear: both;content: "";  display: table;}
.ariane li { float: left;  list-style:outside none none; padding-right: 0.5em; font-size:0.8em; color:#666; }
.ariane li:not(:last-child)::after { color:#ccc; content: ">>"; }
.ariane li a { margin-right:0.5em; }

.partage span, .partage a { vertical-align:middle; }
.partage a { margin:0 0 0 0.3em; }

.pagination { text-align:center; margin:1.4em; }
.pagination ul { border-radius:3px; box-shadow:0 1px 2px rgba(0, 0, 0, 0.05); display:inline-block; margin:1em 0; padding: 0; }
.pagination ul li { background:#fff none repeat scroll 0 0; display: inline; font-size:1em; list-style: outside none none; margin: 0; padding:0.7em 0; text-align:center;}
.pagination ul li a, .pagination ul li.disabled, .pagination ul li.active { font-size:1em!important; -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; background-color: #fff; border-color: #dddddd; border-image: none; border-style: solid; border-width: 1px 1px 1px 0; float: left; line-height:1em; padding:0.3em 0.8em; text-decoration: none; }
.pagination ul li a:hover { background-color:#fafafa; }
.pagination ul li.disabled { background:#e5e5e5 none repeat scroll 0 0; color:#888;}
.pagination ul li.active { background: #0f9ed3 none repeat scroll 0 0; color:#fff;}
.pagination ul li:first-child a, .pagination ul li.disabled:first-child, .pagination ul li.active:first-child { border-left: 1px solid #dddddd; border-radius: 3px 0 0 3px;}
.pagination ul li:last-child a, .pagination ul li.disabled:last-child, .pagination ul li.active:last-child { border-radius: 0 3px 3px 0; }

.tabs { border-bottom: 1px solid #dddddd; display: none; font-size:1em; margin:0.7em 0 0; padding: 0;}
.tabs::after { clear: both; content: ""; display: table;}
.tabs li {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #ffffff none repeat scroll 0 0;
    border-color: #dddddd #dddddd -moz-use-text-color;
    border-image: none;
    border-radius: 4px 4px 0 0;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    cursor: pointer;
    float: left;
    list-style: outside none none;
    margin-left: 1px;
    padding: 3px 10px;
}
.tabs li:hover { margin-top:-2px; padding: 4px 10px; background:#0f9ed3; color:#FFF; }
.tabs li.active { background:#0f9ed3 none repeat scroll 0 0;margin-top: -4px;padding: 5px 10px; position: relative;}
.tabs li a { color:#0f9ed3; text-decoration: none; font-weight:700; }
.tabs li a:hover { color:#fff; }
.tabs li.active a { color:#fff; }
.tabs-content { border-bottom: 1px solid #dddddd; margin-bottom: 15px; padding: 10px 0; width: 100%; }
.tabs-content div { margin-bottom:2em; }
.tabs-content .btn { margin:0.5em 0.5em 0 0; }
.tabs-content .titre-extra-minus { color:#5e377b; font-weight:700; }


/*grid*/
div, li { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }

.clearfix:before, .row:before, .clearfix:after, .row:after, .clearfix-small:before, .clearfix-small:after { content: " "; display: table; }
.clearfix:after, .clearfix-small:after, .row:after { clear: both; /*margin-top:1.42em;*/ }
.clearfix:before { margin-top:1.5em; }
.clearfix:after { margin-bottom:1.5em; }
.clearfix-small:before { margin-top:1em; }
.clearfix-small:after { margin-bottom:1em; }
.clearfix, .clearfix-small, .row { /* pour IE 6/7*/ *zoom: 1; }
.row { /*margin-bottom:1.5em;*/ }

.col-s-1, .col-m-1, .col-l-1, .col-s-2, .col-m-2, .col-l-2, .col-s-3, .col-m-3, .col-l-3, .col-s-4, .col-m-4, .col-l-4, .col-s-5, .col-m-5, .col-l-5, .col-s-6, .col-m-6, .col-l-6, .col-s-7, .col-m-7, .col-l-7, .col-s-8, .col-m-8, .col-l-8, .col-s-9, .col-m-9, .col-l-9, .col-s-10, .col-m-10, .col-l-10, .col-s-11, .col-m-11, .col-l-11, .col-s-12, .col-m-12, .col-l-12, .col-l-75, .col-l-25 {
  float: left; position: relative; min-height: 1px; padding: 0 0.71em; /*margin-bottom:1.42em;*/ }

.m-show { display:none; }

.l-show { display: none; }

.col-s-push-0 { left: 0%;}
.col-s-pull-0 { left: 0%;}
.col-s-offset-0 { margin-left: 0%;}
.col-s-1 { width: 8.33333%;}
.col-s-push-1 { left: 8.33333%;}
.col-s-pull-1 { left: -8.33333%;}
.col-s-offset-1 { margin-left: 8.33333%;}
.col-s-2 { width: 16.66667%;}
.col-s-push-2 { left: 16.66667%;}
.col-s-pull-2 { left: -16.66667%;}
.col-s-offset-2 { margin-left: 16.66667%;}
.col-s-3 { width: 25%;}
.col-s-push-3 { left: 25%;}
.col-s-pull-3 { left: -25%;}
.col-s-offset-3 { margin-left: 25%;}
.col-s-4 { width: 33.33333%;}
.col-s-push-4 { left: 33.33333%;}
.col-s-pull-4 { left: -33.33333%;}
.col-s-offset-4 { margin-left: 33.33333%;}
.col-s-5 {width: 41.66667%;}
.col-s-push-5 { left: 41.66667%;}
.col-s-pull-5 { left: -41.66667%;}
.col-s-offset-5 { margin-left: 41.66667%;}
.col-s-6 { width: 50%;}
.col-s-push-6 { left: 50%;}
.col-s-pull-6 { left: -50%;}
.col-s-offset-6 { margin-left: 50%;}
.col-s-7 { width: 58.33333%;}
.col-s-push-7 { left: 58.33333%;}
.col-s-pull-7 { left: -58.33333%;}
.col-s-offset-7 { margin-left: 58.33333%;}
.col-s-8 { width: 66.66667%;}
.col-s-push-8 { left: 66.66667%;}
.col-s-pull-8 { left: -66.66667%;}
.col-s-offset-8 { margin-left: 66.66667%;}
.col-s-9 { width: 75%;}
.col-s-push-9 { left: 75%;}
.col-s-pull-9 { left: -75%;}
.col-s-offset-9 { margin-left: 75%;}
.col-s-10 {width: 83.33333%;}
.col-s-push-10 { left: 83.33333%;}
.col-s-pull-10 { left: -83.33333%;}
.col-s-offset-10 { margin-left: 83.33333%;}
.col-s-11 { width: 91.66667%;}
.col-s-push-11 {left: 91.66667%;}
.col-s-pull-11 { left: -91.66667%;}
.col-s-offset-11 { margin-left: 91.66667%;}
.col-s-12 { width: 100%;}
.col-s-push-12 { left: 100%;}
.col-s-pull-12 { left: -100%;}
.col-s-offset-12 { margin-left: 100%;}

.col-s-center { margin:0 auto; float:none; }

/*responsive*/

/*medium screen*/
@media only screen and (min-width: 640px) {
  .col-m-push-0 {
    left: 0%;
  }

  .col-m-pull-0 {
    left: 0%;
  }

  .col-m-offset-0 {
    margin-left: 0%;
  }

  .col-m-1 {
    width: 8.33333%;
  }

  .col-m-push-1 {
    left: 8.33333%;
  }

  .col-m-pull-1 {
    left: -8.33333%;
  }

  .col-m-offset-1 {
    margin-left: 8.33333%;
  }

  .col-m-2 {
    width: 16.66667%;
  }

  .col-m-push-2 {
    left: 16.66667%;
  }

  .col-m-pull-2 {
    left: -16.66667%;
  }

  .col-m-offset-2 {
    margin-left: 16.66667%;
  }

  .col-m-3 {
    width: 25%;
  }

  .col-m-push-3 {
    left: 25%;
  }

  .col-m-pull-3 {
    left: -25%;
  }

  .col-m-offset-3 {
    margin-left: 25%;
  }

  .col-m-4 {
    width: 33.33333%;
  }

  .col-m-push-4 {
    left: 33.33333%;
  }

  .col-m-pull-4 {
    left: -33.33333%;
  }

  .col-m-offset-4 {
    margin-left: 33.33333%;
  }

  .col-m-5 {
    width: 41.66667%;
  }

  .col-m-push-5 {
    left: 41.66667%;
  }

  .col-m-pull-5 {
    left: -41.66667%;
  }

  .col-m-offset-5 {
    margin-left: 41.66667%;
  }

  .col-m-6 {
    width: 50%;
  }

  .col-m-push-6 {
    left: 50%;
  }

  .col-m-pull-6 {
    left: -50%;
  }

  .col-m-offset-6 {
    margin-left: 50%;
  }

  .col-m-7 {
    width: 58.33333%;
  }

  .col-m-push-7 {
    left: 58.33333%;
  }

  .col-m-pull-7 {
    left: -58.33333%;
  }

  .col-m-offset-7 {
    margin-left: 58.33333%;
  }

  .col-m-8 {
    width: 66.66667%;
  }

  .col-m-push-8 {
    left: 66.66667%;
  }

  .col-m-pull-8 {
    left: -66.66667%;
  }

  .col-m-offset-8 {
    margin-left: 66.66667%;
  }

  .col-m-9 {
    width: 75%;
  }

  .col-m-push-9 {
    left: 75%;
  }

  .col-m-pull-9 {
    left: -75%;
  }

  .col-m-offset-9 {
    margin-left: 75%;
  }

  .col-m-10 {
    width: 83.33333%;
  }

  .col-m-push-10 {
    left: 83.33333%;
  }

  .col-m-pull-10 {
    left: -83.33333%;
  }

  .col-m-offset-10 {
    margin-left: 83.33333%;
  }

  .col-m-11 {
    width: 91.66667%;
  }

  .col-m-push-11 {
    left: 91.66667%;
  }

  .col-m-pull-11 {
    left: -91.66667%;
  }

  .col-m-offset-11 {
    margin-left: 91.66667%;
  }

  .col-m-12 {
    width: 100%;
  }

  .col-m-push-12 {
    left: 100%;
  }

  .col-m-pull-12 {
    left: -100%;
  }

  .col-m-offset-12 {
    margin-left: 100%;
  }

  .col-m-center {
    margin: 0 auto;
    float: none;
  }

  .m-hide {
    display: none;
  }

  .m-show {
    display: block;
  }

  .s-show {
    display: none;
  }
  
  
}


/*large screen*/
@media only screen and (min-width: 1024px) {
  .col-l-push-0 {
    left: 0%;
  }

  .col-l-pull-0 {
    left: 0%;
  }

  .col-l-offset-0 {
    margin-left: 0%;
  }

  .col-l-1 {
    width: 8.33333%;
  }

  .col-l-push-1 {
    left: 8.33333%;
  }

  .col-l-pull-1 {
    left: -8.33333%;
  }

  .col-l-offset-1 {
    margin-left: 8.33333%;
  }

  .col-l-2 {
    width: 16.66667%;
  }

  .col-l-push-2 {
    left: 16.66667%;
  }

  .col-l-pull-2 {
    left: -16.66667%;
  }

  .col-l-offset-2 {
    margin-left: 16.66667%;
  }

  .col-l-3 {
    width: 25%;
  }
		
		
  .col-l-push-3 {
    left: 25%;
  }

  .col-l-pull-3 {
    left: -25%;
  }

  .col-l-offset-3 {
    margin-left: 25%;
  }

  .col-l-4 {
    width: 33.33333%;
  }
		

  .col-l-push-4 {
    left: 33.33333%;
  }

  .col-l-pull-4 {
    left: -33.33333%;
  }

  .col-l-offset-4 {
    margin-left: 33.33333%;
  }

  .col-l-5 {
    width: 41.66667%;
  }

  .col-l-push-5 {
    left: 41.66667%;
  }

  .col-l-pull-5 {
    left: -41.66667%;
  }

  .col-l-offset-5 {
    margin-left: 41.66667%;
  }

  .col-l-6 {
    width: 50%;
  }

  .col-l-push-6 {
    left: 50%;
  }

  .col-l-pull-6 {
    left: -50%;
  }

  .col-l-offset-6 {
    margin-left: 50%;
  }

  .col-l-7 {
    width: 58.33333%;
  }

  .col-l-push-7 {
    left: 58.33333%;
  }

  .col-l-pull-7 {
    left: -58.33333%;
  }

  .col-l-offset-7 {
    margin-left: 58.33333%;
  }

  .col-l-8 {
    width: 66.66667%;
  }
	
  .col-l-push-8 {
    left: 66.66667%;
  }

  .col-l-pull-8 {
    left: -66.66667%;
  }

  .col-l-offset-8 {
    margin-left: 66.66667%;
  }

  .col-l-9 {
    width: 75%;
  }

  .col-l-push-9 {
    left: 75%;
  }

  .col-l-pull-9 {
    left: -75%;
  }

  .col-l-offset-9 {
    margin-left: 75%;
  }

  .col-l-10 {
    width: 83.33333%;
  }

  .col-l-push-10 {
    left: 83.33333%;
  }

  .col-l-pull-10 {
    left: -83.33333%;
  }

  .col-l-offset-10 {
    margin-left: 83.33333%;
  }

  .col-l-11 {
    width: 91.66667%;
  }

  .col-l-push-11 {
    left: 91.66667%;
  }

  .col-l-pull-11 {
    left: -91.66667%;
  }

  .col-l-offset-11 {
    margin-left: 91.66667%;
  }

  .col-l-12 {
    width: 100%;
  }

  .col-l-push-12 {
    left: 100%;
  }

  .col-l-pull-12 {
    left: -100%;
  }

  .col-l-offset-12 {
    margin-left: 100%;
  }

  .col-l-center {
    margin: 0 auto;
    float: none;
  }

  .l-hide {
    display: none;
  }

  .l-show {
    display: block;
  }

  .m-show {
    display: none;
  }
		
			/*rajout classes pr structure desktop*/
			.col-l-75 { width: 73%; }
			.col-l-25 { width: 27%; }	
		
}

/*very large screen*/
@media only screen and (min-width: 1179px) {
.container { width:1200px; }
}

/* formulaires */
form { display: block; margin:0; text-align:left; }
form table { background:#fff; }
fieldset { border:0; position:relative; }
fieldset div { margin-bottom:1em; }
fieldset label { width:100%; color:#FFF; text-align:center; border:1px solid #0f9ed3; color:#0f9ed3; padding:1.2em 0; border-radius:3px; }
fieldset label:hover { background:#5e377b; color:#FFF; border:1px solid #5e377b; }
fieldset input { visibility:hidden; position:absolute; left:0; top:0; }
form .row { margin-bottom:1em; }
form .active { background:#5e377b; color:#FFF; border:1px solid #5e377b; }

.form-traducteur { width:319px; height:493px; position:relative; }
.icon-smartphone { width:319px; height:493px; display:block; position:absolute; background:url(img/smartphone.png) no-repeat 0 0;  }
.form-traducteur textarea { width:269px; height:373px; left:25px; top:56px; position:absolute; z-index:2; background:none; color:#0f9ed3; }
.form-traducteur input { left:110px; bottom:10px; position:absolute; z-index:2; }


input[type="text"],
input[type="email"],
input[type="password"],
textarea,
.select,
select[multiple="multiple"],
input[type="file"] {
  border: 1px solid #CCC;
  border-radius: 3px;
  display: inline;
  padding:0.5em;
  width: auto;
  box-sizing: border-box;
  vertical-align: baseline;
  margin: 0 0 0.71em 0;
  background: #FFF;
  font-family: "Lato", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
		width:70%;
		color:#555;
}
input[type="submit"] { display:block; border:0; padding:0.5em; background:#0f9ed3; border-radius:3px; color:#FFF; font-size:1.4em; margin:0 auto; }
input:hover[type="submit"] { background:#f8b71e;  }
input:focus { border-color:#0f9ed3; }

textarea { resize: vertical; }
textarea { width:80%; height:10%; }
select[multiple="multiple"] {
  display: inline;
  min-width: 100px;
}
.select {
  display: inline-block;
  cursor: pointer;
  padding: 5px;
}
.select:before {
  border-bottom: 3px solid transparent;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 3px solid #999999;
  content: "";
  display: block;
  float: right;
  margin: 0.71em 0 0 0.71em;
}
.input-large {
  padding: 9px!important;
  font-size: 21px;
}
.form-vertical input[type="text"],
.form-vertical input[type="email"],
.form-vertical input[type="password"],
.form-vertical textarea,
.form-vertical .select,
.form-vertical select[multiple="multiple"],
.form-vertical input[type="file"],
.form-vertical input[type="submit"],
.form-vertical label {
  width: 80%;
  display: block;
}
.form-vertical fieldset label { color:#222; text-align:right; border:inherit; color:inherit; padding:inherit; border-radius:none; text-align:left; }
.form-vertical fieldset input { visibility:inherit; position:relative; }
.form-vertical fieldset label:hover { background:none; color:inherit; border:inherit; }

input,
label {
  color: #222222;
  display: inline-block;
  vertical-align: baseline;
}
input:not(:last-child) {
  margin: 0 0.35em 0.35em 0;
}
input[type="checkbox"],
input[type="radio"] {
  margin: 0!important;
}
input[type="checkbox"]:not(:first-child),
input[type="radio"]:not(:first-child) {
  margin-left: 0.35em;
}
input[disabled="disabled"] {
  background: #efefef;
}
label {
  cursor: pointer;
  margin: 0 0.35em 0 0!important;
  display: inline-block;
}
.input-check {
  display: inline-block;
}
.input-check label {
  cursor: pointer;
  text-align: left;
  margin: 0;
  display: inline;
}
.form-vertical input.codebox {width: 125px; height: 40px;  font-size: 18px; color: #333; font-weight: bold; padding: 3px; text-align: center; text-transform:uppercase;}
.form-vertical SPAN { color:#FF0000; margin:5px;}

/*pub*/
.leaderboard, .sky, .rect300 { margin-bottom:1.2em; }
.pubmobile {display:none;}
.reco {margin: 20px 0 0 0;}
.reco .TF_1.ob-strip-layout .ob-widget-header { font-family:'Raleway', sans-serif; font-size:1.5em; color:#5e377b; font-weight:300; margin:0 0 0.7em 0; } /* titre */
.reco .TF_1.ob-widget .ob-rec-image-container img.ob-rec-image {width:90%;} /* image */
.reco .TF_1.ob-strip-layout .ob-rec-text {color: #0f9ed3; font-weight:normal;} /* lien */

/* pub sur mobile */
@media (max-width: 480px) 
{ 
.leaderboard, .sky, .rect300 { display:none; }
.pubmobile {display:block; margin-bottom:1.2em;}
}

/*footer*/
.footer { background:#666/*0f9ed3*/; margin:0; padding:1.42em 0 1.42em 0; color:#EEE; line-height:2em; position:relative; }
.footer a { color:#EEE; }
.footer .tamponPalmeris { width: 110px; height: 94px; background:url("img/tampon_palmeris.png") no-repeat scroll 0 0; display: block; position: absolute; right: 0; top:-30px; right:5px; z-index: 202; }

/* BANDEAU COOKIE CNIL */
.cookieCNIL { background:#CCC; padding:0.5em; }
.cookieCNIL .content_cookieCNIL { overflow:hidden; text-align:left; margin:0 auto; color:#555; line-height:18px; font-size:1em; font-family: 'Pontano Sans', sans-serif; }
.cookieCNIL .content_cookieCNIL .icoContexte { width:44px; height:40px; display:inline-block; background:url(http://www.lettres-utiles.com/images/spritePNG.png) no-repeat -86px -293px; }
.cookieCNIL .content_cookieCNIL A { margin:0 0 0 1em; text-decoration:underline; color:#333; }