/* CSS Document */
/* Elements de base */
html { width: 100%; height: 100%; }
body { margin: 0px; padding: 0px; font-family: 'PT Sans', sans-serif; font-weight: 400; font-size: 16px; line-height: normal; color: #4c4c4e; height: 100%; width: 100%; background: #fff; overflow-x: hidden; }
table { margin: 0px; padding: 0px; }
tr, thead, tbody { margin: 0px; padding: 0px; }
td { margin: 0px; padding: 0px; vertical-align: top; }
th { margin: 0px; padding: 0px; vertical-align: top; }
p { margin: 0px; padding: 0px; margin-bottom: 8px; height: auto; }
ul, ol { margin: 12px 0px; padding: 0; padding-left: 40px; }
li { margin-top: 0px; margin-bottom: 0px; list-style-image: url(/img/front/bull-li.png); line-height: 1.2em; }
img { border: none; vertical-align: top; }
input { vertical-align: middle; margin: 0px; border: 1px solid #888; padding: 4px 6px; font-size: 14px; line-height: normal; color: #000; font-family: Arial, sans-serif; outline-width: 0; }
input:focus, select:focus { outline: none; }
input[type=file] { border: none; }
input[type=checkbox] { margin-top: -2px; border: none; }
input[type=radio] { margin-top: -3px; border: none; }
input[type=submit] { background: #eee; padding: 3px 8px; border: 1px solid #888; color: #666; cursor: pointer; }
textarea { margin: 0px; border: 1px solid #888; padding: 4px 6px; font-size: 14px; color: #000; resize: none; font-family: Arial, sans-serif; outline-width: 0; }
select { margin: 0px; border: 1px solid #888; padding: 4px 6px; font-size: 14px; color: #000; font-family: Arial, sans-serif; outline-width: 0; }
select option { background: #fff !important; color: #4c4c4e !important; padding: 3px 5px; }
div { position: relative; }
hr { color: #999; background-color: #999; height: 1px; border: none; }
strong { font-weight: 600; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; text-rendering: geometricPrecision; }
* { box-sizing: border-box; }
/* Liens et classes associées */
a, a:link, a:visited { text-decoration: none; color: #4d1c5e; }
a:hover { text-decoration: none; }
a.actif { font-weight: bold; }
li a { text-decoration: none; color: #d97700; }
a.ficpdf { display: inline-block; background: url(/img/admin/pdf.png) no-repeat left center; padding-left: 24px; }
/* Titres */
h1 { position: relative; font-family: 'PT Sans', sans-serif; font-weight: 700; font-size: 24px; line-height: 32px; margin: 5px 0; padding: 0px; text-transform: uppercase; letter-spacing: 3px; }
h2 { position: relative; font-family: 'PT Sans', sans-serif; font-weight: 700; font-size: 26px; line-height: 32px; margin: 5px 0; padding: 0px; }
h3 { position: relative; font-family: 'PT Sans', sans-serif; font-weight: 700; font-size: 28px; line-height: 34px; margin: 5px 0; padding: 0px; text-transform: uppercase; letter-spacing: 5px; }
h3.stitre { font-size: 20px; line-height: 26px; letter-spacing: 3px; }
h4 { position: relative; font-family: 'PT Sans', sans-serif; text-transform: uppercase; letter-spacing: 5px; font-size: 20px; color: #777; margin: 0 0 8px 0; }
h5 { position: relative; font-family: 'PT Sans', sans-serif; text-transform: uppercase; font-size: 18px; margin: 0 0 8px 0; font-weight: 600; text-align: center; }
/* Classes de style */
.nodisp { display: none; }
.clear { display: block; clear: both; }
div.erreur { font-size: 13px; font-style: italic; color: #F00; background: url(/img/admin/erreur.png) no-repeat left; padding-left: 22px; font-weight: 500; }
.alerte { display: inline-block; font-size: 11px; font-style: normal; color: #ffae00; background: url(/img/admin/erreur.png) no-repeat left top; padding-left: 20px; font-weight: normal; }
.info { font-size: 11px; font-style: italic; background: url(/img/admin/information.png) no-repeat left; padding-left: 22px; font-weight: 500; color: #369; }
.gros { font-size: 18px; font-weight: bold; color: #000; margin-bottom: 8px; }
.petit { font-size: 11px; font-style: normal; }
.surligne { background: #FF0; color: #036; font-style: normal; font-weight: bold; }
.hr { border-top: 1px solid #777; height: 1px; font-size: 0px; }
.ombre { -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5); box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5); }
.tombre { text-shadow: 0px 0px 4px #000; -moz-text-shadow: 0px 0px 4px #000; -webkit-text-shadow: 0px 0px 4px #000; }
.outline { font-weight: bold; text-shadow: -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000; color: #fff; }
.espace { height: 5px; font-size: 0px; overflow: hidden; }
.icone { width: 16px; height: 16px; }
.contenu { left: 50%; width: 1280px; margin-left: -640px; } .contenu > .padding { padding: 0px; }
.cntcol { display: table; width: 100%; }
.cntcol > .col2 { display: table-cell; width: 50%; }
.cntcol > .col2 > .padding { padding: 0 12px; }
.cntcol > .col3 { display: table-cell; width: 33%; border-left: 1px solid #c7c7c7; } .cntcol > .col3:first-child { border-left: none; }
.cntcol > .col3 > .padding { padding: 0 12px; }
.inline { display: inline-block; }
.nbart { font-size: 9px; }
.fright { float: right; }
.aright { text-align: right; } .aleft { text-align: left; } .acenter { text-align: center; }
.disabled { color: #d7d7d7; }
.trait { display: inline-block; width: 380px; height: 6px; overflow: hidden; background-color: #666; margin: 24px 0; border-radius: 3px; }
.br { height: 0; overflow: hidden; }
.grand { font-size: 24px; }
.big { font-size: 32px; }
.vbig { font-size: 48px; }
.vvbig { font-size: 64px; font-weight: 700; vertical-align: top; }
.rond-coul { display: inline-block; width: 14px; height: 14px; border-radius: 50%; background-color: #4d1c5e; }
.marge-fmax { margin: 0 6px; }
.marge2-fmax { display: inline-block; margin: 8px 55px 0 38px; width: 4px; height: 46px; line-height: 64px; background: rgba(255,255,255,0.4); vertical-align: middle; }
.filet { height: 14px; font-size: 0; background: url(/img/front/filet-orange.png) no-repeat center; margin: 32px 0; }
.padb16 { padding-bottom: 16px; }
.qtecde { filter: grayscale(100%); }
.qtecde > div > * { vertical-align: middle; }
.moocboqte { text-align: right; width: 40px; }
/* Couleurs */
.blanc { color: #fff; }
.gris { color: #666; }
.grisc { color: #aaa !important; }
.grisc a { color: #aaa !important; border-color: #aaa !important; }
a .grisc { color: #aaa !important; border-color: #aaa !important; }
.bg-gris { background-color: #eee; color: #666; }
.adherents { color: #666; }
.css-bgc { padding: 12px 16px; margin: 12px 0; background-color: #999; color: #fff; }
.css-bgc a, .cnt-bgcoul a:link, .cnt-bgcoul a:visited { color: #fff; }
.cnt-bgris { background: #eee; padding: 24px 0; }
.pg-blanc { background: #fff; }
.pg-gris { background: #eee; }
.pg-orange { background: #f8d3b450; }
.pg-violet { background: #dec5e050; }
.txt-coul { color: #83b817; }
/* Effet d'affichage au scroll */
.affconten { perspective: 1200px; perspective-origin: center; }
.affscroll { -webkit-transform: rotateY(90deg); -ms-transform: rotateY(90deg); transform: rotateY(90deg); opacity: 0; transition: all 1s ease-in-out; }
.affscroll.affvisible { -webkit-transform: rotateY(0deg); -ms-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; }
/* Aperçus liens */
.apelnk { position: relative; display: table; width: 100%; max-width: 100%; background: #f7f7f7; padding: 12px 12px; margin: 12px 0; text-align: center;
box-sizing: border-box; transition: all .3s ease-in-out; }
a.apelnk { max-width: 900px; margin: 12px auto; }
.apelnk > img { max-width: 100%; max-height: 180px; }
.apelnk iframe { max-width: 100%; }
.apelnk > .imgurl { display: table-cell; width: 240px; height: 180px; background-position: center; background-size: cover; background-repeat: no-repeat; vertical-align: top; }
.apelnk > .txturl { display: table-cell; max-height: 160px; transition: all .3s ease-in-out; vertical-align: middle; text-align: left; padding: 0 12px 0 24px; }
.apelnk > .txturl.noimage { padding-left: 12px; }
.apelnk > .txturl > .titurl { display: block; font-family: 'Teko', sans-serif; font-weight: 300; font-size: 24px; line-height: 26px; color: #666; margin-bottom: 12px;
max-height: 52px; overflow: hidden; }
.apelnk > .txturl > .desurl { display: block; color: #999; font-size: 14px; line-height: 18px; max-height: 90px; overflow: hidden; }
.apelnk:hover { opacity: 0.7; text-decoration: none !important; }
.apelnk.nodesc { font-weight: 300; font-size: 24px; line-height: 26px; color: #666; height: auto; overflow: hidden; text-align: center; display: block; }
/* Menus */
#menmob { display: none; }
#menu { height: 80px; font-size: 16px; line-height: 28px; font-weight: 400; padding: 0; text-align: left; background: #333; box-shadow: 0 0 12px rgba(0,0,0,0.7); z-index: 19; }
#menu a { display: inline-block; position: relative; width: auto; color: #fff; text-decoration: none; font-size: 16px; font-weight: 400; transition: all 0.15s ease-in-out;
line-height: 48px; height: 48px; vertical-align: top; padding: 0px 24px; }
#menu a:hover { color: #f7941d; text-decoration: none; }
#menu a.actif { text-decoration: underline; font-weight: 400; }
#menu > .contenu > a:nth-of-type(n+3) { border-left: 1px solid #444; }
#menu > .contenu > a { margin-top: 16px; text-transform: uppercase; }
#menu > .contenu > a#menu_logo { width: auto; height: 80px; padding: 0; margin: 0; }
#menu > .contenu > a#menu_logo > img { height: 100%; width: auto; }
#menu #cart_cont { position: absolute; top: 8px; right: 10px; }
#menu #cart_cont a { font-size: 14px; line-height: 18px; height: auto; }
#menu #cart_cont a > img { height: 20px; margin: 0 8px 0 0; }
#menu #cart_cont a:nth-of-type(n+2) { border-left: 1px solid #444; }
#menu #rech_cont { position: absolute; top: 36px; right: 10px; }
#menu #rech_cont > form { display: inline-block; background: #e9e9e9; padding: 4px 8px; border-radius: 0 12px 0 12px; line-height: 24px; }
#menu #rech_cont > form > * { vertical-align: top; }
#menu #rech_cont > form > input[type="text"] { border: none; background: transparent; width: 260px; line-height: 16px; padding: 4px 6px; font-size: 13px; }
#menu #rech_cont > form > input[type="text"]::placeholder { color: #999; }
#menu #rech_cont > form > input[type="submit"] { border: none; background: transparent url(/img/front/picto-search.png) no-repeat center; width: 24px; height: 24px; transition: all .15s ease-in-out; }
#menu #rech_cont > form > input[type="submit"]:hover { transform: scale(1.2); }
/* Slideshow accueil */
#entete { position: relative; height: 480px; text-align: center; background: #666666; z-index: 1; box-shadow: 0 0 12px rgba(0,0,0,0.7); }
#slideShow { position: relative; height: 100%; width: auto; background: #f4f4f4; }
#slideShow > .contenu:first-child { height: 100%; }
#slideShow #cntSlide { position: relative; height: 100%; width: auto; overflow: hidden; }
#slideShow #cntSlide .slideElt { display: block; width: 100%; height: 100%; color: #555555; background: no-repeat center; background-size: cover; }
#slideShow #cntSlide .slideElt:hover { color: #235a81; }
#slideShow #cntSlide .slideElt > div.legende { position: absolute; max-width: 1000px; right: 50%; margin-right: -540px; bottom: 40px; color: #fff; font-size: 18px; line-height: 22px; font-weight: 400;
padding: 12px 16px; transition: all 0.8s ease-in-out; opacity: 0; -webkit-transform: translateX(1000px); -ms-transform: translateX(1000px); transform: translateX(1000px); background: rgba(146,63,153,0.8); }
#slideShow #cntSlide .slideElt > div.legende > .prix { display: none; font-weight: 700; text-align: right; border-top: 1px solid #753080; margin: 8px 0 0 0; padding: 2px 0 0 0; }
#slideShow #cntSlide .slideElt > div.legende.visible { opacity: 1; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); }
#slideShow #ctlSlide { position: absolute; bottom: 0px; height: 48px; left: 0px; right: 0px; z-index: 10; text-align: right; }
#slideShow #ctlSlide a { display: inline-block; text-align: center; height: 18px; width: 18px; background: #fff; color: #333; margin: 0 5px; border-radius: 50%; margin-top: 17px;
-webkit-transition: background-color .3s ease-in-out, color .3s ease-in-out; transition: background-color .3s ease-in-out, color .3s ease-in-out; border: 1px solid #333; }
#slideShow #ctlSlide a.actif, #slideShow #ctlSlide a:hover { background: #923f99; color: #fff; border-color: #502050; }
#slideShow #btn-sldpre { position: absolute; left: 0; top: 0; width: 140px; height: 100%; background: url(/img/front/slide-fleche-g.png) no-repeat right center;
opacity: 0.6; transition: all 0.3s ease-in-out; z-index: 11; }
#slideShow #btn-sldsui { position: absolute; right: 0; top: 0; width: 140px; height: 100%; background: url(/img/front/slide-fleche-d.png) no-repeat left center;
opacity: 0.6; transition: all 0.3s ease-in-out; z-index: 11; }
#slideShow #btn-sldpre:hover, #slideShow #btn-sldsui:hover { opacity: 1; }
/* Accueil client */
#acc-titre { margin: 48px 0; }
#acc-texte { background: #f4b683; margin: 48px 0; padding: 24px 0; }
#acc-texte h2 { margin: 0 0 12px 0; }
#acc-texte #acc-clien { text-align: center; }
#acc-texte #acc-clien > a { display: inline-block; background: #fff url(/img/front/picto-telecharger.png) no-repeat left 6px center; padding: 8px 16px 8px 42px; margin: 8px 0;
transition: all .3s ease-in-out; box-shadow: 0 0 1px rgba(0,0,0,0.1); color: #222; }
#acc-texte #acc-clien > a:hover { transform: translateY(-4px); box-shadow: 2px 2px 8px rgba(0,0,0,0.5); }
/* Catalogue articles */
#cnt-filart { background: #923f99 /* #f4b683 */; padding: 24px 0; text-align: center; }
#cnt-filart form { display: inline-block; font-size: 13px; color: #fff; vertical-align: top; }
#cnt-filart select { border: none; border-radius: 0 8px 0 8px; padding: 5px 24px 3px 6px; margin: 0 4px; color: #fff; width: 230px; vertical-align: top;
background-color: #ad6eb4; background-image: url("/img/front/bg-combo.png"); background-repeat: no-repeat; background-position: right 0px;
-webkit-appearance: none; -moz-appearance: none; appearance: none; }
#cnt-filart select::-ms-expand { display: none; }
#cnt-filart input[type="text"] { border: none; border-radius: 0 8px 0 8px; padding: 4px 8px; width: 230px; color: #fff; background-color: #ad6eb4; margin: 0 4px; vertical-align: top; }
#cnt-filart input[type="text"]::placeholder { color: #eee; }
#cnt-filart .sel-check { display: inline-block; color: #fff; background-color: #ad6eb4; margin: 0 4px; padding: 4px 16px; font-size: 14px; line-height: 18px; text-align: left;
border-radius: 0 8px 0 8px; vertical-align: top; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; user-select: none; }
#cnt-filart .sel-check > span { display: inline-block; margin: 0 0 0 4px; }
#cnt-articles { text-align: left; margin: 20px 0 20px 0; }
#cnt-articles .noresult { height: 480px; max-height: 80vh; margin: 48px 0 0 0; box-shadow: 0 0 1px rgba(0,0,0,0.2), 0 0 96px rgba(0,0,0,0.1) inset; }
#cnt-articles .noresult > div { position: absolute; left: 16px; right: 16px; top: 50%; transform: translateY(-50%); font-size: 48px; font-weight: 700; color: #ccc; }
#cnt-articles .minart { display: inline-block; width: 240px; margin: 8px 8px; vertical-align: top; box-shadow: 0 0 1px rgba(0,0,0,0.2); transition: all .3s ease-in-out; }
#cnt-articles .minart .cntimg { display: block; width: 100%; height: 240px; background-position: center; background-repeat: no-repeat; background-size: 100%;
transition: all .3s ease-in-out; box-shadow: 0 0 32px rgba(0,0,0,0.1) inset; }
#cnt-articles .minart .cnttxt { display: block; background: #eee; padding: 8px 12px; text-align: center; transition: all .3s ease-in-out; color: #333; height: 90px; border-top: 1px solid #ddd; }
#cnt-articles .minart .cnttxt > strong { font-weight: 700; display: block; font-size: 18px; line-height: 20px; height: 40px; margin: 0 0 8px 0; overflow: hidden; }
#cnt-articles .minart .cnttxt > .cntbas { display: block; position: relative; text-align: right; }
#cnt-articles .minart .cnttxt > .cntbas > .artprx { font-size: 20px; line-height: 20px; font-weight: 700; }
#cnt-articles .minart .cnttxt > .cntbas > .artprx.promo { }
#cnt-articles .minart .cnttxt > .cntbas > .artprx.promo > span { position: absolute; font-size: 9px; color: #e96f08; top: -9px; right: 11px; }
#cnt-articles .minart .cnttxt > .cntbas > .addpan { position: absolute; bottom: 4px; left: 0; background: url(/img/front/add-panier-mini-nb.png) no-repeat left center;
vertical-align: middle; padding-left: 18px; line-height: 15px; font-size: 12px; }
#cnt-articles .minart:hover { box-shadow: 2px 2px 8px rgba(0,0,0,0.5); transform: translateY(-4px); }
#cnt-articles .minart:hover .cnttxt { background: #923f99; color: #fff; border-color: #753080; }
#cnt-articles .minart:hover .cntimg { -webkit-filter: brightness(80%); filter: brightness(80%); box-shadow: 0 0 32px rgba(0,0,0,0.1) inset; }
.btn-allart { display: inline-block; font-size: 22px; line-height: 28px; letter-spacing: 3px; text-transform: uppercase; margin-top: 10px; transition: all 0.3s ease-in-out;
background: url("/img/front/picto-search.png") no-repeat left center; vertical-align: middle; padding-left: 36px; color: #aaa !important; font-weight: 700; }
.btn-allart:hover { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); }
/* Fiche article */
h3.titart { margin: 32px 0 24px 0; }
#cnt-article { padding: 0 0 0 330px; position: relative; min-height: 402px; }
#cnt-article .titrub { color: #6f6f6f; padding: 0 0 6px 0; margin: 0 0 6px 0; border-bottom: 1px dotted #999; font-size: 11px; font-style: italic; }
#cnt-article #cnt-imgart { position: absolute; left: 0; top: 0; width: 330px; vertical-align: top; }
#cnt-article #cnt-imgart > a { display: inline-block; height: 96px; width: 96px; margin: 6px 6px 0 0; vertical-align: top; transition: all .3s ease-in-out;
background-position: center; background-repeat: no-repeat; background-size: cover; box-shadow: 0 0 1px rgba(0,0,0,0.2); }
#cnt-article #cnt-imgart > a:first-child { height: 300px; width: 300px; margin-top: 0; }
#cnt-article #cnt-imgart > a:hover { box-shadow: 2px 2px 6px rgba(0,0,0,0.5); transform: translateY(-3px); }
#cnt-article #cnt-cdeart { display: block; color: #111; font-size: 15px; background-color: #f9921c33; padding: 12px 16px; margin-bottom: 20px; }
#cnt-article #cnt-cdeart .prxart { display: inline-block; text-align: center; font-size: 18px; line-height: 20px; }
#cnt-article #cnt-cdeart .prxart > span { display: block; font-size: 10px; line-height: 10px; }
#cnt-article #cnt-cdeart .prxart.promo > span { color: #e96f08; }
#cnt-article #cnt-cdeart .prxart.promo > div { display: inline-block; font-size: 12px; color: #f00; text-decoration: line-through; }
#cnt-article #cnt-cdeart .prxart.promo > div > strong { color: #111; }
#cnt-article #cnt-cdeart #cnt-qtecde { float: right; vertical-align: top; margin-top: 4px; }
#cnt-article #cnt-cdeart .qtecde { display: inline-block; margin: 0 10px 0 0; vertical-align: top; }
#cnt-article #cnt-cdeart #btn_addart { display: inline-block; padding: 4px 8px; border-radius: 3px; color: #fff; transition: all .3s ease-in-out;
background: #f9921c; background-image: linear-gradient(to top right, rgba(255,255,255,0) 30%, rgba(255,255,255,0.2) 60%); vertical-align: top; }
#cnt-article #cnt-cdeart #btn_addart > img { display: inline-block; height: 16px; width: 16px; margin-right: 4px; margin-top: 1px; }
#cnt-article #cnt-cdeart #btn_addart:hover { box-shadow: 2px 2px 6px rgba(0,0,0,0.5); transform: translateY(-3px); }
#cnt-article #cnt-desart { display: inline-block; width: 545px; padding: 12px 16px; margin: 0 20px 0 0; vertical-align: top; }
#cnt-article #cnt-desart.nodtec { display: block; width: auto; margin: 0; }
#cnt-article #cnt-tecart { display: inline-block; width: 380px; background: #eee; padding: 12px 16px; font-size: 13px; vertical-align: top; }
#cnt-article #cnt-tecart > em { display: inline-block; width: 120px; color: #6f6f6f; vertical-align: top; }
#cnt-article #cnt-tecart > span { display: inline-block; width: 220px; margin: 0 0 0 8px; vertical-align: top; }
#cnt-article #cnt-tecart > .tecpdf { display: inline-block; font-size: 18px; line-height: 24px; }
#cnt-article #cnt-tecart > .tecpdf > img { width: 28px; height: 28px; display: inline-block; margin: -2px 0 0 0; transition: transform .2s ease-in-out; }
#cnt-article #cnt-tecart > .tecpdf:hover { text-decoration: none; }
#cnt-article #cnt-tecart > .tecpdf:hover > img { transform: translateY(-3px) scale(1.2); }
#cnt-articles .minart.mini { width: 150px; margin: 5px 5px; }
#cnt-articles .minart.mini .cntimg { height: 150px; }
#cnt-articles .minart.mini .cnttxt { height: auto; }
#cnt-articles .minart.mini .cnttxt > strong { font-size: 14px; line-height: 16px; height: 32px; margin: 0; }
/* Dialogue ajouter au panier */
#divFadpan { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); }
#divAddpan { position: absolute; top: 50%; left: 50%; width: 600px; height: auto; padding: 8px; transform: translate(-50%, -50%);
background-color: #fee9d2; color: #111; box-shadow: 0 0 5px rgba(0,0,0,0.6); line-height: 1.1em; }
#divAddpan .nomart { font-size: 18px; text-transform: uppercase; font-weight: bold; text-shadow: 2px 2px 2px rgba(0,0,0,0.3); margin-bottom: 6px; }
#divAddpan #cntBtnpan { text-align: right; font-size: 13px; margin: 8px 0 0 0; }
#divAddpan #cntBtnpan > a { display: inline-block; width: 49%; text-align: center; padding: 6px 0; border-radius: 5px; text-transform: uppercase; transition: all .3s ease-in-out; }
#divAddpan #cntBtnpan > a:hover { box-shadow: 2px 2px 6px rgba(0,0,0,0.5); transform: translateY(-3px); }
#divAddpan #cntBtnpan > #btnValpan { background: #555; color: #fff; margin-right: 1%; }
#divAddpan #cntBtnpan > #btnFerpan { background: #f9921c; color: #fff; }
/* Validation panier */
#cnt-etapes { padding: 32px 0 0 0; text-align: center; }
.etapeLien { float: left; height: 0; font-size: 0; width: 32px; border-bottom: 2px solid #e96f08; margin-top: 13px; }
.etapeLien.inactive { border-bottom: 2px dotted #aaaaaa; }
.etapeCont { float: left; border: 1px solid #aaaaaa; color: #aaaaaa; text-transform: uppercase; font-size: 12px; line-height: 22px; vertical-align: middle;
width: 162px; text-align: left; }
.etapeCont.active { border: 1px solid #e96f08; color: #555; font-weight: bold; }
.etapeCont span { display: inline-block; vertical-align: top; }
.etapeCont .etapeNum { display: inline-block; width: 30px; text-align: center; font-size: 20px; font-weight: bold; color: #fff; background: #aaaaaa; margin-right: 12px;
vertical-align: top; line-height: 24px; height: 24px; }
.etapeCont > a { display: block; color: #aaaaaa; }
.etapeCont > a:hover { color: #AB5F41; background: #fff; } .etapeCont > a:hover .etapeNum { background: #AB5F41; }
.etapeCont.active > .etapeNum { background: #e96f08; }
/*
a.btnStyle { background-color: #e96f08; box-shadow: 0 17px rgba(0, 0, 0, 0.1) inset; color: #fff; display: inline-block; padding: 0 20px; font-size: 15px; font-weight: bold;
line-height: 33px; height: 33px; border-radius: 15px; cursor: pointer; text-align: center; text-shadow: 0 -1px rgba(0, 0, 0, 0.3); }
a.btnStyle:hover { box-shadow: 0 0 5px rgba(0, 0, 0, 0.6), 0 17px rgba(255, 255, 255, 0.1) inset; }
a.btnStyle > img { width: 48px; height: 48px; margin: -14px 0px 0 -8px; transition: all .2s ease-in-out; }
a.btnStyle:hover > img { transform: rotateZ(-8deg); }
*/
#cnt-valpan { text-align: right; margin: 24px 0 0 0; }
#cnt-valpan > a { display: inline-block; position: relative; padding: 3px 8px 5px 28px; border-radius: 3px; color: #fff; transition: all .3s ease-in-out;
background-color: #f9921c; background-image: linear-gradient(to top right, rgba(255,255,255,0) 30%, rgba(255,255,255,0.2) 60%); vertical-align: top;
font-size: 16px; line-height: 20px; font-weight: 700; box-shadow: 1px 1px 4px rgba(0,0,0,0.3); }
#cnt-valpan > a > img { position: absolute; height: 40px; width: 40px; left: -10px; top: -12px; transition: all .3s ease-in-out; }
#cnt-valpan > a:hover { box-shadow: 2px 2px 6px rgba(0,0,0,0.5); transform: translateY(-3px); }
#cnt-valpan > a:hover > img { transform: rotateZ(-8deg); }
#panierVide { padding: 40px 0 420px 0; text-align: center; color: #c7c7c7; font-size: 42px; font-weight: bold; text-transform: uppercase; border-radius: 8px;
background-image: url(/img/front/panier-vide.png); background-color: #fff; background-position: center center; background-repeat: no-repeat; box-shadow: 0 0 2px rgba(0,0,0,0.3); }
#panierListe { width: 100%; margin: 0; padding: 0; border: none; border-spacing: 0; border-collapse: separate; }
#panierListe th { padding: 6px; color: #fff; font-weight: bold; border: 1px solid #F88F37; border-left: none; font-size: 13px;
background-color: #f9921c; background-image: linear-gradient(to top right, rgba(255,255,255,0) 30%, rgba(255,255,255,0.2) 60%); }
#panierListe th:first-of-type { border-left: 1px solid #F88F37; }
#panierListe td { background: #fff; }
#panierListe .detart { height: 60px; padding: 4px; font-size: 11px; border: 1px solid #d7d7d7; border-top: none; }
#panierListe .detart > img { float: left; width: 60px; margin-right: 8px; }
#panierListe .detart > a { display: inline-block; margin-bottom: 3px; font-size: 15px; text-transform: uppercase; }
#panierListe .detart > a:hover { color: #486922; }
#panierListe .detart > .refart { margin-right: 12px; }
#panierListe .detart > .priart { }
#panierListe .qteart { width: 120px; padding: 0 10px; vertical-align: middle; text-align: center; line-height: 1.1em; border: 1px solid #d7d7d7; border-top: none; border-left: none; }
#panierListe .prxart { width: 126px; padding: 10px 8px; background: #f4f4f4; font: bold 20px/1 Tahoma,Geneva,sans-serif; color: #555555; text-align: right;
border: 1px solid #d7d7d7; border-top: none; border-left: none; }
#panierListe .prxart > a { background: url(/img/front/panier-suppr.png) no-repeat left 1px; color: #919191; font-size: 9px; line-height: 10px; font-weight: normal; padding-left: 15px; }
#panierListe .prxart > a:hover { text-decoration: underline; }
#panierListe .prxart.prxeur { padding: 20px 8px; }
#panierListe .panierTotcol { padding: 10px 32px; font-size: 13px; border: 1px solid #d7d7d7; border-top: none; }
#panierListe .panierTotcol.panierTottit { padding: 12px 28px; }
#panierListe .panierTottit { color: #919191; font-size: 16px; text-align: right; font-weight: bold; }
#panierListe #panierTotprx { color: #e96f08; }
/* Compte client */
.cntCoords { padding: 12px 16px; background: #fff; border-radius: 10px; border: 1px solid #d7d7d7; }
.cntCoords form { text-align: center; }
.cntCoords form > .inline { text-align: left; }
.cntCoords form > .inline > table { width: 600px; }
.cntCoords form table tr > td:first-child { width: 120px; }
.cntCoords form h3 { font-size: 20px; letter-spacing: 1px; color: #888; }
.cntCoords form input[type=text], .cntCoords form textarea { padding: 2px 6px; width: 100%; }
.rowliv { display: none; }
/* Récapitulatif commande + code remise */
#coordsRecap { float: right; width: 280px; font-size: 12px; }
#coordsRecap h3 { font-size: 18px; letter-spacing: 1px; color: #888; }
#panierRecap { float: left; width: 880px; margin: 0; padding: 0; border: none; border-spacing: 0; border-collapse: separate; }
#panierRecap th { padding: 6px; color: #fff; font-weight: bold; border-right: 1px solid #864; border-bottom: 1px solid #864;
background-color: #e96f08; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.26), rgba(0, 0, 0, 0));
box-shadow: 0 -3px 3px rgba(0, 0, 0, 0.11), 0 3px 3px rgba(255, 255, 255, 0.1) inset; }
#panierRecap td { background: #fff; }
#panierRecap .libart { padding: 10px; text-align: left; text-transform: uppercase; border: 1px solid #d7d7d7; border-top: none; }
#panierRecap .libart > em { color: #a7a7a7; text-transform: none; font-size: 11px; }
#panierRecap .qteart { width: 60px; padding: 10px; text-align: center; border-bottom: 1px solid #d7d7d7; }
#panierRecap .prxart { width: 126px; padding: 6px 8px 2px 8px; background: #f4f4f4; font: bold 20px/1 Tahoma,Geneva,sans-serif; color: #555555; text-align: right;
border: 1px solid #d7d7d7; border-top: none; }
#panierRecap .libtot { padding: 10px; text-align: right; font-weight: bold; text-transform: uppercase; border: 1px solid #d7d7d7; border-right: none; font-size: 14px; }
#panierRecap .libtot > em { color: #a7a7a7; font-weight: normal; text-transform: none; font-size: 11px; }
#panierRecap .prxtot { width: 126px; padding: 4px 8px; background: #f4f4f4; font: bold 20px/1 Tahoma,Geneva,sans-serif; color: #555555; text-align: right;
border: 1px solid #d7d7d7; }
#panierRecap .prxtot .rouge { color: #e96f08; }
/* Formulaires de connexion */
body.login, body.sndlog, body.razpwd { background: linear-gradient(to bottom right, #efefef, #bbb) fixed; }
#frmLogin { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 400px; text-align: center; background: #eee; max-width: 90vw;
box-shadow: 0 0 8px rgba(0,0,0,0.5); }
#frmLogin > #icocbqp { position: absolute; left: -14px; top: -14px; width: 64px; height: 64px; }
#frmLogin h4 { padding: 8px 16px 8px 56px; margin: 0; background: #923f99; color: #fff; font-size: 16px; letter-spacing: 2px; }
#frmLogin > .padding { padding: 12px 16px; text-align: left; }
#frmLogin > .padding > em { display: block; font-size: 13px; line-height: 16px; margin-bottom: 6px; }
#frmLogin input { width: 100%; background: #fff; border: none; font-size: 13px; }
#frmLogin input[type=checkbox] { width: auto; }
#frmLogin input#mdpass { width: 180px; }
#frmLogin .cntchk { display: inline-block; width: 140px; margin-left: 40px; }
#frmLogin #btn-valfrm { border: none; padding: 6px 16px; color: #fff; background: #f7941d; font-size: 18px; margin: 12px 0; transition: all .2s ease-in-out; }
#frmLogin #btn-valfrm:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(0,0,0,0.3); }
#frmLogin > .padding > a { display: block; text-align: center; font-size: 15px; }
/* Check et étiquette cliquable */
.cntchk { font-size: 14px; cursor: pointer; margin: 4px 0 0 0; line-height: 19px; }
.cntchk > input[type="checkbox"] { margin: 3px 4px 0 0; vertical-align: top; cursor: pointer; }
.cntchk > span { display: inline-block; width: calc(100% - 26px); }
/* Elements de la page */
#content { padding: 0 0 32px 0; height: auto; overflow: hidden; }
/* Page contact */
.traith { height: 2px; font-size: 0; background: #959595; margin: 16px 0 48px 0; }
#cnt-coords { width: 500px; float: left; margin: 32px 0 0 32px; }
#cnt-coords .lbl-coords { color: #999; margin-bottom: 6px; }
#cnt-coords strong { font-size: 20px; }
#cnt-coords a { display: inline-block; font-size: 20px; font-weight: 700; }
#cnt-contact { width: 600px; float: right; text-align: right; margin: 0 32px 0 0; }
#cnt-contact .cnt-contact { display: inline-block; width: 600px; height: 163px; padding: 31px 12px 31px 164px; background: #fff; margin: 0 0 16px 0; }
#gmap.contact, #gmap.contact > iframe { height: 300px; }
/* Espace client */
.enrcde { padding: 6px 8px; }
.enrcde > * { vertical-align: top; }
.enrcde.pair { background: #efefef; }
.enrcde > div.inline { vertical-align: top; line-height: 20px; }
.enrcde > div.inline:nth-of-type(1) { width: 70px; padding-top: 1px; }
.enrcde > div.inline:nth-of-type(2) { max-width: calc(100% - 220px); text-align: left; }
.enrcde > div.inline:nth-of-type(3) { width: 150px; text-align: right; float: right; margin-top: -3px; }
.enrlig { padding: 6px 8px; }
.enrlig > * { vertical-align: top; }
.enrlig.pair { background: #efefef; }
.enrlig > .inline { vertical-align: top; line-height: 20px; }
.enrlig > .inline:nth-of-type(1) { max-width: calc(100% - 120px); }
.enrlig > .inline:nth-of-type(2) { width: 150px; text-align: right; float: right; }
.enrlig > .inline:nth-of-type(2) > a { display: inline-block; padding-left: 20px; background: url(/img/front/loupe.png) no-repeat left center; }
#detcde { display: inline-block; width: 600px; }
.label { font-size: 13px; font-style: italic; margin: 6px 0 2px 0; }
/* Erreurs */
#bigErreur { color: #f7f7f7; font-size: 300px; font-weight: bold; text-align: center; text-shadow: 0px 0px 32px rgba(0,0,0,0.17); }
/* Fil d'ariane */
#bg-navig { padding: 8px 0; background: #f9921c33; }
#cntNavig { height: 16px; line-height: 16px; padding: 0 8px; vertical-align: top; overflow: hidden; white-space: nowrap; font-size: 12px; }
#cntNavig.nopadtop { padding: 8px; }
#cntNavig > a { display: inline-block; height: 16px; line-height: 16px; vertical-align: top; background: url(/img/front/nav-sep.png) no-repeat left center; padding: 0 10px 0 18px; color: #555555; }
#cntNavig > a:hover { color: #bbbbbb; }
#cntNavig > #navHome { display: inline-block; height: 16px; width: 20px; background: url(/img/front/nav-home.png) no-repeat left center; padding: 0 10px 0 0; border-left: none; }
#cntNavig > #navHome:hover { background: url(/img/front/nav-homeh.png) no-repeat left center; }
/* Pied de page */
#pied { background: #e96f08; color: #fff; padding: 30px 0px; font-size: 14px; text-align: center; }
#pied > .contenu > .padding { background: url(/img/front/logo-cbqplus-pied.png) no-repeat left center; background-size: 80px auto; padding: 0 0 0 100px;
height: 80px; line-height: 80px; display: inline-block; }
#pied > .contenu > .padding > * { vertical-align: middle; }
#pied a { color: #fff; margin-left: 16px; padding-left: 16px; border-left: 1px dotted #fff; transition: all 0.3s ease-in-out; }
#pied a:hover { color: #3f3f3f; }
#pied img { height: 50px; width: auto; margin: 16px 16px 0 16px; }
#btnHaut { position: fixed; bottom: 20px; right: 20px; border: none; pointer-events: none; opacity: 0; transition: all 0.3s ease-in-out; }
#btnHaut.visible { display: block; opacity: 1; pointer-events: all; }
#btnHaut img { height: 34px; width: 35px; }
/* =======================================================
Animations CSS3
======================================================= */
/* Animation slide */
.slideElt {
position: absolute; left: 0px; top: 0px; opacity: 0;
-o-transform: translateX(0px) translateY(0px) rotateY(0deg) rotateZ(0deg) scale(1); -o-transform-style: preserve-3d; /* -o-backface-visibility: hidden; */
-ms-transform: translateX(0px) translateY(0px) rotateY(0deg) rotateZ(0deg) scale(1); -ms-transform-style: preserve-3d; /* -ms-backface-visibility: hidden; */
-webkit-transform: translateX(0px) translateY(0px) rotateY(0deg) rotateZ(0deg) scale(1); -webkit-transform-style: preserve-3d; /* -webkit-backface-visibility: hidden; */
-moz-transform: translateX(0px) translateY(0px) rotateY(0deg) rotateZ(0deg) scale(1); -moz-transform-style: preserve-3d; /* -moz-backface-visibility: hidden; */
transform: translateX(0px) translateY(0px) rotateY(0deg) rotateZ(0deg) scale(1); transform-style: preserve-3d; /* backface-visibility: hidden; */
-o-transition: transform .8s ease-in-out, opacity .7s ease-in-out; -ms-transition: transform .8s ease-in-out, opacity .7s ease-in-out;
-moz-transition: transform .8s ease-in-out, opacity .7s ease-in-out; -webkit-transition: transform .8s ease-in-out, opacity .7s ease-in-out;
transition: transform .8s ease-in-out, opacity .7s ease-in-out;
}
.slideElt.inactive {
z-index: 2; opacity: 0;
/* -webkit-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
-moz-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
-o-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1); */
-o-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out; -moz-transition: all .1s ease-in-out;
-webkit-transition: all .1s ease-in-out; transition: all .1s ease-in-out;
}
.slideElt.desactive {
z-index: 2; opacity: 0;
/* -webkit-transform: translateX(-1000px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
-moz-transform: translateX(-1000px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
-o-transform: translateX(-1000px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
transform: translateX(-1000px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1); */
}
.slideElt.active {
z-index: 10; opacity: 1;
/* -webkit-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
-moz-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
-o-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1); */
}
.slideElt.fx1 { }
.slideElt.fx1.inactive { -ms-transform: translateX(-100%); -webkit-transform: translateX(-100%); transform: translateX(-100%); }
.slideElt.fx1.desactive { -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); }
.slideElt.fx1.active { -ms-transform: translateX(0px); -webkit-transform: translateX(0px); transform: translateX(0px); }
.slideElt.fx2 { }
.slideElt.fx2.inactive { -ms-transform: translateY(-600px); -webkit-transform: translateY(-600px); transform: translateY(-600px); }
.slideElt.fx2.desactive { -ms-transform: translateY(600px); -webkit-transform: translateY(600px); transform: translateY(600px); }
.slideElt.fx2.active { -ms-transform: translateY(0px); -webkit-transform: translateY(0px); transform: translateY(0px); }
.slideElt.fx3 { }
.slideElt.fx3.inactive { -ms-transform: scale(5); -webkit-transform: scale(5); transform: scale(5); }
.slideElt.fx3.desactive { -ms-transform: scale(0.2); -webkit-transform: scale(0.2); transform: scale(0.2); }
.slideElt.fx3.active { -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
.slideElt.fx4 { }
.slideElt.fx4.inactive { -ms-transform: rotateZ(90deg) scale(0.3); -webkit-transform: rotateZ(90deg) scale(0.3); transform: rotateZ(90deg) scale(0.3); }
.slideElt.fx4.desactive { -ms-transform: rotateZ(-90deg) scale(3); -webkit-transform: rotateZ(-90deg) scale(3); transform: rotateZ(-90deg) scale(3); }
.slideElt.fx4.active { -ms-transform: rotateZ(0deg) scale(1); -webkit-transform: rotateZ(0deg) scale(1); transform: rotateZ(0deg) scale(1); }
.slideElt.fx5 { }
.slideElt.fx5.inactive { -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
.slideElt.fx5.desactive { -ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); }
.slideElt.fx5.active { -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
/* =======================================================
Media queries
======================================================= */
#irmax { position: fixed; bottom: 0px; left: 0; padding: 4px 6px; background: #000; color: #fff; font-weight: 700; display: block; }
#ir1340 { position: fixed; bottom: 0px; left: 0; padding: 4px 6px; background: #000; color: #fff; font-weight: 700; display: none; }
#ir1120 { position: fixed; bottom: 0px; left: 0; padding: 4px 6px; background: #000; color: #fff; font-weight: 700; display: none; }
#ir900 { position: fixed; bottom: 0px; left: 0; padding: 4px 6px; background: #000; color: #fff; font-weight: 700; display: none; }
#ir600 { position: fixed; bottom: 0px; left: 0; padding: 4px 6px; background: #000; color: #fff; font-weight: 700; display: none; }
#ir400 { position: fixed; bottom: 0px; left: 0; padding: 4px 6px; background: #000; color: #fff; font-weight: 700; display: none; }
#ir320 { position: fixed; bottom: 0px; left: 0; padding: 4px 6px; background: #000; color: #fff; font-weight: 700; display: none; }
/* ------------------------------------------------ */
/* Format PC/tablettes < 1340px */
@media handheld, only screen and (max-width: 1340px), only screen and (max-device-width: 1340px) {
#irmax { display: none; }
#ir1340 { display: block; }
.contenu { width: 1080px; margin-left: -540px; }
#menu a { font-size: 20px; }
#slideShow #cntSlide .slideElt > div.legende1 { max-width: 800px; font-size: 22px; line-height: 28px; margin-right: 0; right: 140px; }
#slideShow #cntSlide .slideElt > div.legende2 { max-width: 800px; font-size: 22px; line-height: 28px; margin-right: 0; right: 110px; }
#cnt-articles .minart { width: 250px; }
#cnt-articles .minart .cntimg { height: 180px; }
.sep-actu { height: 296px; }
.cnt-paragr { padding: 20px 10px 20px 10px; font-size: 22px; }
.cnt-paragr .cnt-image { max-width: 320px; }
.actu-entete { padding: 28px 10px 28px 10px; }
#cnt-choix { display: flex; flex-wrap: wrap; }
#cnt-choix > * { flex: auto 1; margin: 4px !important; }
#gmap { height: 640px; }
#tmap { height: 640px; }
.adherent { font-size: 16px; }
_:-ms-fullscreen, :root .adherent { flex: 0 0 450px; } /* Hack IE 11- */
#cnt-resrec .resrec { font-size: 16px; }
#cnt-resrec .resrec .titre { font-size: 18px; }
_:-ms-fullscreen, :root #cnt-resrec .resrec { flex: 0 0 450px; } /* Hack IE 11- */
#cnt-coords { width: 480px; }
#cnt-contact { width: 500px; }
#cnt-contact .cnt-contact { display: block; width: auto; }
}
/* ------------------------------------------------ */
/* Format PC/tablettes < 1120px */
@media handheld, only screen and (max-width: 1120px), only screen and (max-device-width: 1120px) {
#ir1340 { display: none; }
#ir1120 { display: block; }
body { font-size: 15px; }
h1 { font-size: 22px; line-height: 30px; }
h2 { font-size: 24px; line-height: 30px; }
h3 { font-size: 22px; line-height: 38px; }
h4 { font-size: 18px; }
.contenu { width: auto; left: auto; margin-left: 0px; }
.contenu.infos { font-size: 17px; }
.contenu > .padding { padding: 0 16px; }
.grand { font-size: 20px; }
#menu a { font-size: 18px; line-height: 40px; }
#menu a > span { padding: 0px 16px; max-width: 200px; line-height: 20px; vertical-align: middle; }
#menu a#menu_logo { width: 140px; margin-left: -70px; margin-top: 4px; }
#menu a#menu_logo > img { width: 100%; height: auto; }
#menu #menu_gauche { margin-right: 60px; }
#menu #menu_droite { margin-left: 60px; }
#rech_cont > form > input[type="text"] { width: 240px; }
#slideShow #cntSlide .slideElt > div.legende1 { max-width: 640px; font-size: 20px; line-height: 26px; padding: 6px 12px; bottom: 90px; }
#slideShow #cntSlide .slideElt > div.legende2 { max-width: 640px; font-size: 20px; line-height: 26px; padding: 6px 12px; }
#slideShow #btn-sldpre { width: 100px; }
#slideShow #btn-sldsui { width: 100px; }
#cnt-articles .minart { width: calc(25% - 16px); }
#cnt-articles .minart .cnttxt { padding: 12px 16px; }
#cnt-articles .minart .cnttxt .masque { font-size: 14px; }
#cnt-articles .minart .cnttxt .cntbas { font-size: 12px; }
.btn-pactu { font-size: 18px; }
.sep-actu { height: 284px; }
#cnt-liens a { width: 300px; font-size: 18px; }
.cnt-paragr { font-size: 20px; }
.cnt-paragr .cnt-image { max-width: 280px; }
.adherent { font-size: 14px; padding: 16px; }
.adherent > span { margin-left: 16px; padding-left: 16px; }
.adherent > .plus { right: 16px; }
_:-ms-fullscreen, :root .adherent { flex: 0 0 44%; } /* Hack IE 11- */
.adh-infos { font-size: 13px; }
.adh-infos > span { display: block; }
.adh-infos > .espace { height: 0; margin: 6px 0; border-bottom: 1px dotted #aaa; }
#adh-contact > em { display: block; width: auto; }
.adh-partxt { font-size: 18px; }
#cnt-resrec .resrec { padding: 16px; font-size: 14px; }
#cnt-resrec .resrec .titre { font-size: 16px; }
#cnt-resrec .resrec .voir { right: 16px; }
_:-ms-fullscreen, :root #cnt-resrec .resrec { flex: 0 0 44%; } /* Hack IE 11- */
#cnt-coords { width: auto; float: none; margin: 0 0 32px 0; }
#cnt-contact { width: 480px; float: none; margin: 0 auto; }
#cnt-contact .cnt-contact .gch { padding: 0 0 10px 0; margin: 0 0 10px 0; }
#cnt-suivre #cnt-rsoc { width: 240px; font-size: 16px; }
#cnt-suivre #cnt-rsoc a { margin: 6px 6px; }
#cnt-suivre #cnt-rsoc a > img { width: 64px; height: 64px; }
}
/* ------------------------------------------------ */
/* Format < 900px */
@media handheld, only screen and (max-width: 900px), only screen and (max-device-width: 900px) {
#ir1120 { display: none; }
#ir900 { display: block; }
body { font-size: 16px; }
h1 { font-size: 20px; line-height: 26px; letter-spacing: 2px; }
h2 { font-size: 20px; line-height: 26px; }
h3 { font-size: 18px; line-height: 24px; letter-spacing: 5px; }
h4 { font-size: 16px; letter-spacing: 3px; }
.contenu.infos { font-size: 16px; }
#menu { display: none; }
#menmob { display: block; font-size: 16px; line-height: 22px; font-weight: 400; padding: 0; background: #333; box-shadow: 0 0 12px rgba(0,0,0,0.7); z-index: 19; }
#logo-menmob { position: absolute; top: 4px; height: 56px; left: 4px; width: auto; z-index: 9; }
#logo-menmob > img { height: 100%; width: auto; }
#btn-menmob { display: block; text-align: right; z-index: 20; }
#btn-menmob > img { filter: invert(100%); }
#cnt-menmob { text-align: center; background: #555; overflow: hidden; display: none; transition: all .3s ease-in-out; }
#cnt-menmob > a { display: block; padding: 6px 12px; font-size: 18px; color: #fff; transition: all .3s ease-in-out; }
#cnt-menmob > a:hover { color: #555; background: #fff; }
#cnt-menmob > a.actif { color: #fff; background: #55176d; }
#cnt-menmob > a > img { height: 22px; }
#cnt-menmob > form { position: relative; display: block; padding: 6px 12px; margin: 8px 8px 2px 8px; font-size: 18px; background-color: #e7e7e7; color: #666; }
#cnt-menmob > form > input[type="text"] { border: none; background: transparent; width: 100%; padding-right: 32px; }
#cnt-menmob > form > input[type="text"]::placeholder { color: #9b6bb7; }
#cnt-menmob > form > input[type="submit"] { border: none; background: transparent url(/img/front/search.png) no-repeat center; width: 24px; height: 24px; position: absolute; top: 8px; right: 10px; }
#entete { height: 180px; }
#entete h1 { margin-top: 78px; font-size: 20px; letter-spacing: 3px; }
#cnt-logo { display: none; height: 100px; }
#cnt-logo > img { width: 200px; }
#cnt-afaq > span { font-size: 14px; margin-left: -30px; }
#slideShow #btn-sldpre, #slideShow #btn-sldsui { background-position: 0 60px; }
#slideShow #cntSlide .slideElt > div.legende1 { max-width: 560px; right: 40px; bottom: 75px; font-size: 16px; }
#slideShow #cntSlide .slideElt > div.legende2 { max-width: 560px; right: 60px; bottom: 30px; font-size: 16px; }
.cntCoords form > .inline { max-width: 100%; }
.cntCoords form > .inline > table, .cntCoords form > .inline > table tbody { display: block; max-width: 100%; }
.cntCoords form table tr, .cntCoords form table td { font-size: 11px; display: block; max-width: 100%; }
.cntCoords form table tr > td:first-child { width: 100%; }
.cntCoords form table input, form table select { max-width: 100%; }
.cntCoords form table textarea { max-width: 100%; }
#cnt-liens a { width: 250px; margin: 16px 24px; }
#cnt-articles .minart { width: calc(50% - 16px); }
.sep-actu { display: none; }
#cnt-docpdf { padding: 12px 0; }
#cnt-docpdf .lnk-docpdf { width: 280px; }
#cnt-docpdf .lnk-docpdf .cnttit { font-size: 15px; }
.cnt-paragr { font-size: 18px; }
.cnt-paragr .cnt-image { max-width: 240px; }
.bg-album { padding: 0; }
.bg-album .cnt-album { width: 100%; }
.cnt-album.cnt-1img > div { background-size: cover; }
#gmap { height: 480px; }
#gmap.adhs { width: 100%; }
#tmap { display: none; }
.apelnk { display: block; }
.apelnk > .imgurl { display: block; width: auto; height: 180px; margin: 0 0 12px 0; }
.apelnk > .txturl { display: block; padding: 0; }
.tit-donnee { font-size: 16px; }
.adherent { padding: 12px; line-height: 20px; }
.adherent > strong { display: block; }
.adherent > span { display: block; margin: 0px; padding: 0px; border: none; }
.adherent > .plus { display: inline-block; float: none; margin: 12px 0 0 0; padding: 6px 16px; }
#adh-flex { flex-wrap: wrap; background: #f7f7f7; }
#adh-flex > div { width: 50% !important; max-width: 50% !important; }
.adh-partxt .tap-texte.img-droite .cnt-image { width: 240px; }
.adh-partxt .tap-texte.img-gauche .cnt-image { width: 240px; }
.adh-partxt { font-size: 16px; }
.adh-infos > span > a { max-width: 100%; }
#cnt-resrec .resrec { padding: 12px; line-height: 20px; }
#cnt-resrec .resrec .titre { font-size: 16px; }
#cnt-resrec .resrec .voir { margin: 12px 0 0 0; padding: 6px 16px; }
#frmEnquete .grpsai { display: block; width: auto; margin: 0; padding: 12px 16px 18px 16px; }
#frmEnquete .grpsai > input#ville { width: calc(100% - 130px); }
.cnt-contact .fct { font-size: 13px; }
#cnt-animateurs .cnt-contact { width: 176px; }
#cnt-animateurs .cnt-contact .photo { top: 16px; left: 18px; }
#cnt-coords a { font-size: 18px; }
#cnt-suivre { display: block; width: auto; }
#cnt-suivre #cnt-rsoc { display: block; width: auto; margin-bottom: 12px; }
#pied > .contenu > .padding { line-height: 40px; font-size: 13px; }
#pied a:last-of-type { padding: 0; margin: 0; border: none; display: block; line-height: 20px; }
}
/* ------------------------------------------------ */
/* Format mobiles < 660px */
@media handheld, only screen and (max-width: 660px), only screen and (max-device-width: 660px) {
#ir900 { display: none; }
#ir600 { display: block; }
body { font-size: 14px; }
h1 { font-size: 18px; line-height: 24px; letter-spacing: 1px; }
h2 { font-size: 18px; line-height: 24px; }
h3 { font-size: 16px; line-height: 22px; letter-spacing: 3px; }
h4 { font-size: 14px; letter-spacing: 2px; }
.contenu.infos { font-size: 15px; }
.cnt-navig .lnk-page { width: 24px; height: 24px; line-height: 24px; font-size: 12px; }
#entete h1 { font-size: 18px; line-height: 24px; letter-spacing: 1px; margin: 78px 10px 0 10px; }
#entete.slide { height: 320px; }
#entete.infos { height: 180px; }
#slideShow #cntSlide .slideElt > div.legende1 { max-width: 420px; right: 32px; font-size: 14px; line-height: 20px; }
#slideShow #cntSlide .slideElt > div.legende2 { max-width: 390px; right: 64px; font-size: 14px; line-height: 20px; }
#slideShow #btn-sldpre { width: 64px; background-size: contain !important; }
#slideShow #btn-sldsui { width: 64px; background-size: contain !important; }
#cnt-afaq > span:last-of-type { width: calc(100% - 168px); max-width: 280px; line-height: 20px; padding: 5px 0; text-align: left; margin-left: -20px; }
#cnt-articles .minart .cntimg { height: 120px; }
.btn-pactu { font-size: 16px; }
#cnt-docpdf .lnk-docpdf { width: calc(50% - 16px); }
#cnt-docpdf .lnk-docpdf .cnttit { font-size: 14px; }
#cnt-liens a { width: 38%; font-size: 16px; letter-spacing: 0px; }
#cnt-liens a > .img-lien { width: 140px; height: 140px; line-height: 140px; }
#cnt-liens a > .img-lien > img { width: 90px; }
.cnt-paragr { font-size: 16px; }
.cnt-paragr .cnt-image { max-width: 160px; }
.cnt-album { height: 270px; }
.actu-entete { display: block; }
.actu-entete .actu-image { display: block; width: auto; padding: 0; margin-bottom: 32px; }
.actu-entete .actu-resume { display: block; width: auto; }
.btn-actevt { font-size: 20px; line-height: 30px; letter-spacing: 1px; }
#cnt-choix a { display: block; padding: 0px; margin: 12px 0 0 0; border: none; }
#gmap { height: 400px; }
.adherent { font-size: 13px; line-height: 18px; padding: 16px 12px 32px 12px; }
.adh-image { max-width: 180px; }
_:-ms-fullscreen, :root .adherent { flex: 0 0 42%; } /* Hack IE 11- */
#adh-flex { display: block; }
#adh-infos, #adh-plateformes { border-left: none; }
#adh-flex > div { width: auto !important; max-width: none !important; }
#phoadh { float: none; width: 100%; margin: 12px 0; }
.adh-partxt .tap-titre { padding: 8px 12px 8px 40px; }
.adh-partxt .tap-titre .fleche { background-size: auto 16px; height: 24px; width: 24px; }
.adh-partxt .tap-titre h2 { line-height: 24px; font-size: 16px; }
.adh-partxt .tap-texte.img-droite .cnt-image { width: 200px; }
.adh-partxt .tap-texte.img-gauche .cnt-image { width: 200px; }
.adh-partxt { font-size: 15px; }
#gmap.wphoto { float: none; width: 100%; margin: 12px 0 !important; }
_:-ms-fullscreen, :root #cnt-resrec .resrec { flex: 0 0 42%; } /* Hack IE 11- */
#cnt-contact { width: auto; }
#cnt-coords a { font-size: 16px; }
#cnt-animateurs .cnt-contact .nom { font-size: 14px; }
#cntNavig { font-size: 11px; }
#pied { text-align: center; padding: 20px 16px; }
#pied a { display: block; margin: 6px 0 0 0; padding: 0px; border: none; }
#pied a:last-of-type { line-height: 14px; margin: 12px 0 0 0; }
#pied > .contenu > .padding { display: block; line-height: 20px; font-size: 12px; height: auto; }
}
/* ------------------------------------------------ */
/* Format mobiles < 480px */
@media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
#ir600 { display: none; }
#ir400 { display: block; }
body { font-size: 13px; }
img { max-width: 100%; }
ul, ol { padding-left: 20px; }
.contenu > .padding { padding: 0 6px; }
.marge2-fmax { display: block; margin: 18px 32px; width: auto; height: 2px; background: rgba(255,255,255,0.4); }
.cnt-navig .lnk-page { width: 20px; height: 20px; line-height: 20px; font-size: 11px; margin: 0 2px; }
.no480 { display: block; opacity: 0; height: 0; overflow: hidden; }
#cnt-menmob > a { font-size: 16px; }
#entete h1 { font-size: 16px; letter-spacing: 0px; }
#slideShow #cntSlide .slideElt > div.legende1 { max-width: none; left: 10px; right: 10px; padding: 6px 8px; font-size: 13px; line-height: 18px; bottom: 82px; }
#slideShow #cntSlide .slideElt > div.legende2 { max-width: none; left: 10px; right: 10px; padding: 6px 8px; font-size: 13px; line-height: 18px; }
#cnt-afaq > span:first-of-type { margin-left: -20px; }
#cnt-afaq > span:last-of-type { width: calc(100% - 150px); font-size: 13px; line-height: 14px; margin-left: -32px; max-width: 170px; }
#cnt-articles .minart .cnttxt { height: auto; max-height: 90px; }
#cnt-articles .minart { display: block; width: auto; }
#cnt-articles .minart .cntimg { height: 180px; }
.btn-pactu { margin: 6px 0; }
#cnt-docpdf .lnk-docpdf { display: block; width: auto; margin-bottom: 16px; }
#cnt-docpdf .lnk-docpdf .cnttit { height: auto; }
#cnt-liens a { width: auto; display: block; margin: 0 12px 48px 12px; }
#cnt-liens > .lignev:nth-of-type(2) { display: block; height: 0; }
.contenu.infos { font-size: 14px; }
.cnt-paragr { font-size: 14px; }
.cnt-paragr .cnt-image { max-width: 100px; }
.cnt-album { height: 220px; }
.cnt-album > .curimg { height: 300px; line-height: 300px; }
.cnt-album > .lstimg { height: 40px; }
.cnt-album > .lstimg > img { height: 32px !important; }
.cnt-album { padding: 6px 10px; }
.cnt-album > .lstimg { padding: 4px 10px; margin-left: -10px; }
#gmap { height: 300px; }
#lstadh { display: block; }
#adh-contact > em { display: block; width: auto; }
.adh-image { max-width: none; float: none; text-align: center; }
.adh-image img { max-height: 120px; }
.adh-partxt .tap-texte.img-gauche > div { display: block; width: auto; }
.adh-partxt .tap-texte.img-gauche .cnt-image { display: block; width: auto; padding-bottom: 20px; padding-right: 0; }
.adh-partxt .tap-texte.img-gauche .cnt-texte { display: block; }
.adh-partxt .tap-texte.img-droite > div { display: block; width: auto; }
.adh-partxt .tap-texte.img-droite .cnt-image { display: block; width: auto; padding-top: 20px; padding-left: 0; }
.adh-partxt .tap-texte.img-droite .cnt-texte { display: block; }
#cnt-resrec { display: block; }
.lnk-part .cnt-image { width: 80px; line-height: 80px; }
#frmEnquete .grpsai { padding: 12px 6px 18px 6px; }
#frmEnquete .grpsai > input#cpostal { width: 60px; }
#frmEnquete .grpsai > input#ville { width: calc(100% - 70px); }
#cnt-coords a { font-size: 14px; }
.cnt-contact .photo { width: 100%; left: 0; background-size: contain; }
#cnt-contact .cnt-contact { height: auto; padding: 172px 12px 12px 12px; }
#cnt-animateurs::before { content: "Animateurs territoriaux"; display: block; font-family: 'PT Sans', sans-serif; text-transform: uppercase; letter-spacing: 5px;
font-size: 16px; color: #777; font-weight: 700; padding: 0 0 6px 0; }
#cnt-animateurs { padding: 20px 0 0 0; margin: 36px 0 0 0; border-top: 1px dotted #999; }
#cnt-animateurs .cnt-contact { width: auto; display: block; margin: 16px 0; }
#cnt-animateurs .cnt-contact .photo { left: 0px; }
#cnt-animateurs .cnt-contact .nom { height: auto; }
#cntNavig { font-size: 10px; }
}
/* ------------------------------------------------ */
/* Format mobiles < 320px */
@media handheld, only screen and (max-width: 320px), only screen and (max-device-width: 320px) {
#ir400 { display: none; }
#ir320 { display: block; }
.cnt-paragr .cnt-image { max-width: 100%; float: none !important; margin: 0 0 20px 0 !important; text-align: center; }
}