* {margin: 0; padding: 0;}
html {height: 100%; font-size: 100%;}
body {width: 100%; height: 100%; font-family: 'Alegreya Sans', sans-serif; font-size: 18px; line-height: 26px; color: black; margin: 0; font-weight: 400; text-align: left; background: url(../images/bg.jpg) repeat;}
.clear {clear: both;}
img {max-width: 100%; height: auto; outline: 0;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline;}
blockquote, q {quotes: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse; border-spacing: 0;}
@media \0screen {img { width: auto }}


.content h1, .content h2, .content-sommaire h3 {color: #004a71; font-size: 20px; line-height: 28px;  font-weight: 700; text-transform: uppercase; text-align: left; margin: 0 0 15px 0;  padding-bottom: 5px; background: url(../images/title.png) repeat-x bottom center;}
.content h1, .content h2 {margin: 0 0 25px 0;}
.content h2.one-art {text-transform: none; text-align: left; margin: 0 0 15px 0;  padding-bottom: 0; background: none;}

h3.spip {color: #a50009; text-decoration: none; font-size: 20px; line-height: 28px;  font-weight: 700; text-align: left; margin: 0 0 15px 0;}
hr.spip {margin: 20px auto;}
p {font-size: 18px; line-height: 26px; color: black; text-align: justify; margin: 0 0 20px 0;}
a {outline: 0; color: #00547e; text-decoration: underline;}
ol, ul {list-style-position: inside; margin-bottom: 20px; font-size: 18px; line-height: 26px;}
ol.spip {list-style: decimal; list-style-position: inside; font-size: 18px; line-height: 26px;}
ol.spip li, ul.spip li {list-style-position: outside; margin-left: 15px; font-size: 18px; line-height: 26px;}
b, strong {}

.breadcrumbs {padding-bottom: 20px; color: gray; font-size: 14px;}
.breadcrumbs div {display: inline;}
.breadcrumbs div:before {content: "/"; margin: 0 5px;}
.breadcrumbs div:first-child:before {content: ""; margin: 0;}
.breadcrumbs a {text-decoration: none;}
.breadcrumbs a:hover {text-decoration: underline;}

.line-search-search {width: 100%; margin-bottom: 5px; float: left;}
.formulaire_recherche {width: 100%; margin-bottom: 5px; float: left;}
.formulaire_recherche input[type="text"] {width: 89%; float: left; margin: 0 1% 15px 0; font-size: 15px; color: black; padding: 0 10px; height: 26px; border: 1px solid silver; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.formulaire_recherche input[type="submit"] {width: 10%; float: left;  border: 0; background: #c20000; color: white; height: 26px; font-size: 15px; font-weight: bold; cursor: pointer;}
.formulaire_recherche input[type="submit"]:hover {background: black; color: white;}

/*
Light  font-weight: 300;
Regular  font-weight: 400;
Medium  font-weight: 500;
Bold   font-weight: 700;
Black  font-weight: 900;
 */
 
 
/* Tableaux */
.table-container {width: 100%; overflow-y: auto; _overflow: auto; margin: 0 0 20px 0;}
.table-container::-webkit-scrollbar {-webkit-appearance: none; width: 14px; height: 14px;}
.table-container::-webkit-scrollbar-thumb {border-radius: 8px; border: 3px solid #fff; background-color: rgba(0, 0, 0, .3);}
table.spip {max-width: 100%; width: 100%;  margin: 20px auto; border-collapse: collapse; border-spacing: 0;}
table.spip caption {caption-side: top; text-align: center; margin: 0 auto;}
table.spip tr.row_first {background: #e8e8e8; color: #004a71; font-size: 16px; font-weight: 700;}
table.spip tr.row_odd {background: white;}
table.spip tr.row_even {background: white;}
table.spip th, table.spip td {padding: 5px; vertical-align: top; border: 1px solid #cdcdcd; text-align: left; font-size: 16px; line-height: 22px;}
table.spip td {font-size: 16px; line-height: 22px;}

.video-wrap {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;}
.video-wrap iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/* Citations, code et poesie */
blockquote.spip {margin: 2em 0; padding-left: 1em; border-left: 0.30em solid;}
blockquote.spip_poesie {margin: 2em 0; padding-left: 1em; border-left: 1px solid;}
blockquote.spip_poesie div {text-indent: -3em; margin-left: 3em;}
.spip_code, .spip_cadre {color: #036;}
.spip_cadre {width: 99%; background-color: #F4F8F8; border: 1px inset; font-size:inherit;}
div.spip_code, .spip_cadre {margin-bottom: 1em;}
.spip_surligne {background: #FF6;}

/* Logos, documents et images */
img, .spip_logo {margin: 0; padding: 0; border: 0;}
.spip_documents {text-align: center; line-height: normal;}
.spip_documents p {margin: 0.10em; padding: 0;}
.spip_documents_center {display: block; clear: both; width: 100%; margin: 1em auto;}
.spip_documents_left {float: left; margin-right: 15px; margin-bottom: 5px;}
.spip_documents_right {float: right; margin-left: 15px; margin-bottom: 5px;}
.spip_doc_titre {margin-right: auto; margin-left: auto; font-weight: bold; font-size: 0.90em;}
.spip_doc_descriptif {clear: both; margin-right: auto; margin-left: auto; font-size: 0.90em;}

/* modeles par defaut */
.spip_modele {float: right; display: block; padding: 1em; border: 1px solid; width: 180px;}

/* Couleurs des liens de SPIP */
a.spip_mail {color: black;}
a.spip_mail:before {content: ""!important;}
a.spip_mail:hover {color: #bc0000;}
a.spip_out,a[rel=external] {color: #009;}
a.spip_url {color: #009; }
a.spip_glossaire {color: #060; }
a.spip_glossaire:hover {text-decoration: underline overline;}
a[hreflang]:after {content: "\0000a0(" attr(hreflang) ")";}

/* Google Maps*/
.map {margin: 0%; padding-bottom: 45%; overflow: hidden; position: relative; height: 0;}
.map iframe {left: 0; top: 0; height: 100%; width: 100%; position: absolute;}

.logo-article {float: left; margin-right: 20px;}

/*Gallery*/
.gallery {margin-top: 10px; text-align: center; width: 100%; float: left;}
.gallery .item-gal {width: 23%; height: 23%; margin: 0 1% 2% 1%;  float: left;  border: 1px solid silver; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.gallery .item-gal img {float: left;}

#menu.menu-default {position: absolute; right: 0; bottom: -7px;  z-index: 100; width: 100%;}
#menu.menu-fixed {position: fixed; top: 0; left: 0; width: 100%; z-index: 100; height: 40px; background: url(../images/meny-bg.jpg) repeat-x;  text-align: center;}

#toTop {right: 10px; bottom: 10px; width: auto; display: none; font-weight: 700; padding: 5px 15px 3px 15px; font-size: 18px; text-transform: uppercase; line-height: 30px; background: #459dfe; color: white; position: fixed; cursor: pointer; -webkit-transition: all 0.4s ease-in-out;  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  -ms-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out;}
#toTop:hover {background: #004a71; color: white;}

/* Footer  */
.wrapper {display: table; table-layout: fixed; width: 100%; height: 100%; margin: 0 auto;}
.header {position: relative; width: 1200px; max-width: 96%; height: 192px; border: 1px solid white; background: url(../images/top.jpg) no-repeat top center; margin: 20px auto 0 auto; -webkit-border-radius: 5px 5px 0 0; -khtml-border-radius: 5px 5px 0 0;  -o-border-radius: 5px 5px 0 0;  -ms-border-radius: 5px 5px 0 0;  -icab-border-radius: 5px 5px 0 0;  border-radius: 5px 5px 0 0;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);}
.header-logo {float: left; width: 20%; text-align: center; padding-top: 5px;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.header-slogan {float: left; width: 80%; padding-top: 38px;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.header-slogan h1, .header-slogan p.header-slogan-big {text-align: left; margin: 0; font-weight: 900; text-transform: uppercase; font-size: 44px; line-height: 40px; background: -webkit-linear-gradient(#fbf960, #ffffff);  -webkit-background-clip: text;  -webkit-text-fill-color: transparent; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: #535b0c;}
.header-slogan h2, .header-slogan p.header-slogan-small {text-align: left; margin: 0; font-weight: 900; font-size: 35px; line-height: 40px; background: -webkit-linear-gradient(#e1de23, #ffffff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #404700;}
.header-slogan h1 br, .header-slogan p.header-slogan-big br, .header-slogan h2 br, .header-slogan p.header-slogan-small br {display: none;}

.content {width: 1200px; max-width: 96%; position: relative; background: white; padding: 20px; margin: 0 auto; height: auto; min-height: -moz-calc(100% - 272px);  min-height: -webkit-calc(100% - 272px);  min-height: -o-calc(100% - 272px);  min-height: calc(100% - 272px); -webkit-border-radius: 0 0 5px 5px; -khtml-border-radius: 0 0 5px 5px;  -o-border-radius: 0 0 5px 5px;  -ms-border-radius: 0 0 5px 5px;  -icab-border-radius: 0 0 5px 5px;  border-radius: 0 0 5px 5px;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);}
.content-sommaire {padding: 20px 10px 10px 10px;}

.footer {width: 1200px; max-width: 96%; margin: 0 auto; padding: 20px 0 0 0; height: 60px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.footer-left {float: left; width: 84%; text-align: left;}
.footer-left a {color: #4a4a4a; font-size: 14px; text-decoration: underline; margin-right: 15px;}
.footer-left a:hover {color: black; text-decoration: none;}
.footer-right {float: left; width: 16%; text-align: right;}

/* Sommaire */
.sommaire-rubrique {width: 100%;}
.sommaire-rubrique>div {width: 23%; margin: 1%; float: left; text-align: center; position: relative; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.sommaire-rubrique>div img {-webkit-filter: saturate(200%); filter: saturate(200%); -webkit-transition: all 0.4s ease-in-out;  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  -ms-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out; }
.sommaire-rubrique>div img:hover {-webkit-filter: saturate(400%); filter: saturate(400%);}
.sommaire-rubrique>div a {color: #004a71; text-decoration: none; font-size: 16px; line-height: 18px;  font-weight: 700; text-transform: uppercase; -webkit-transition: all 0.4s ease-in-out;  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  -ms-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out; }
.sommaire-rubrique>div a:hover {color: #ab0008; text-decoration: none;}
.sommaire-rubrique>div span {position: absolute; width: 100%; left: 0; bottom: 17px;}

.sommaire-article {width: 100%; margin: 1% 0 2% 0; float: left;}
.sommaire-article-banner {width: 25%; float: left; margin: 0 3% 0 1%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.sommaire-article-banner img {width: 48%; float: left; margin: 1%;}
.sommaire-article-banner img.auc {width: 100%; float: left; margin: 1% 0;}
#SinoptikInformer {width: 100%!important; margin-top: 10px;}
.sommaire-article-col1 {width: 33.5%; float: left; margin: 0 1.5% 0 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.sommaire-article-col2 {width: 33.5%; float: left; margin: 0 1% 0 1.5%;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}

.sommaire-news {-webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 15px; -moz-column-gap: 15px; column-gap: 15px;}
.sommaire-news-one {margin: 10px 0; display: inline-block;}
.sommaire-news-one h4 {display: inline;}
.sommaire-news-one h4 a {color: #004a71; font-size: 18px; line-height: 26px; font-weight: 500; text-decoration: none;}
.sommaire-news-one h4 a:hover {color: #004a71; text-decoration: none;}
.sommaire-news-one p {margin: 0 0 5px 0; text-align: left; font-size: 16px; line-height: 22px;}

/* Article-list */
.left {width: 30%; float: left; margin: 0 2% 0 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.left-menu {margin-bottom: 20px;}
.left-menu a {width: 100%; height: 40px; color: white; font-size: 18px; line-height: 36px; font-weight: 700; text-decoration: none; background: url(../images/meny-bg2.jpg) repeat-x; cursor: pointer; display: block; margin-bottom: 2px; padding: 0 10px; border: 1px solid #00547e; text-shadow: 0.5px  0.5px  #004163, -0.5px 0.5px #004163, 0.5px -0.5px #004163, -0.5px -0.5px #004163, 0.5px  0.5px 5px #004163; -webkit-transition: all 0.4s ease-in-out;  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  -ms-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.left-menu a:hover {color: #fefdca; text-decoration: none;}
.left .banner {width: 49%; float: left;}
.left .banner:nth-child(2n) {margin-left: 2%;}
.right {width: 68%; float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
ul.article-list {margin-top: 10px; list-style-position: inside; }
ul.article-list li {margin-bottom: 15px; list-style-type: none;}
ul.article-list li span {color: black; display: inline-block; margin-right: 10px; font-size: 14px; font-weight: 700; min-width: 95px;}
ul.article-list li a {color: #004a71; font-size: 22px; line-height: 30px;  font-weight: 500; text-decoration: underline; display: table-cell;}
ul.article-list a:hover {color: #004a71; text-decoration: none;}

.article-list-news {margin-bottom: 20px; width: 100%; float: left;}
.article-list-news h3 a {color: #004a71; font-size: 22px; line-height: 30px; font-weight: 500; text-decoration: underline;}
.article-list-news h3 a:hover {color: #004a71; text-decoration: none;}
.article-list-news p {margin: 0 0 10px 0;}

/* CNAP */
.left-cnap {width: 18%; float: left; margin: 0 2% 0 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.left-cnap a {width: 100%; height: 40px; color: white; font-size: 18px; line-height: 36px; font-weight: 700; text-decoration: none; background: url(../images/meny-bg2.jpg) repeat-x; cursor: pointer; display: block; margin-bottom: 2px; padding: 0 10px; border: 1px solid #00547e; text-shadow: 0.5px  0.5px  #004163, -0.5px 0.5px #004163, 0.5px -0.5px #004163, -0.5px -0.5px #004163, 0.5px  0.5px 5px #004163; -webkit-transition: all 0.4s ease-in-out;  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  -ms-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out;  box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.left-cnap a:hover {color: #fefdca; text-decoration: none;}

.right-cnap {width: 80%; float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.right-cnap h2 {color: #004a71; font-size: 18px; line-height: 26px;  font-weight: 700; text-transform: none; text-align: left; margin: 0;  padding-bottom: 0; background: none;}
.cnap1 {width: 50%; float: left; padding-right: 15px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.cnap2 {width: 50%; float: left; padding-left: 15px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
.cnap3 {width: 100%; float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}

/* Error */
.error {width: 100%; text-align: center; padding: 50px 0;}
.error h1 {font-size: 24px; line-height: 32px;  text-transform: none; text-align: center; margin: 0 0 15px 0;  background: none;}
.error img {}
.error a {background: #83c754; color: white; font-weight: 700; text-decoration: none; padding: 7px 25px; -webkit-border-radius: 8px; -khtml-border-radius: 8px;  -o-border-radius: 8px;  -ms-border-radius: 8px;  -icab-border-radius: 8px;  border-radius: 8px; -webkit-transition: all 0.4s ease-in-out;  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  -ms-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out; }
.error a:hover {background: #74c0dc;}


 /*  Menu <  1024 */
@media only screen and (min-width: 100px) and (max-width: 1100px) {
html {height: 100%; font-size: 100%;}
ul.meny {margin: 0; width: 100%; text-align: right; padding: 0;}
ul.meny li {width: 100%; height: 40px; list-style: none; position: relative;}
ul.meny li a {text-decoration: none;}
ul.meny li a img {margin: 3px 10px 0 0;}
ul.meny li ul {display: none; position: absolute; top: 31px; right: 0; margin: 0; background: #005b87; text-align: right; width: auto; height: 90vw; overflow: scroll; padding: 10px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
ul.meny li ul li {margin: 0; padding: 0;}
ul.meny li ul li a {color: white; font-size: 16px; line-height: 22px; font-weight: 700; text-transform: uppercase; padding: 0; margin: 2px 0; text-decoration: none; display: inline-block; text-shadow: 0.5px  0.5px  #004163, -0.5px 0.5px #004163, 0.5px -0.5px #004163, -0.5px -0.5px #004163, 0.5px  0.5px 5px #004163; -webkit-transition: all 0.4s ease-in-out;  -moz-transition: all 0.4s ease-in-out;  -o-transition: all 0.4s ease-in-out;  -ms-transition: all 0.4s ease-in-out;  transition: all 0.4s ease-in-out; }
ul.meny li ul li a:hover {color: #fefdca; text-decoration: none;}
ul.meny li ul li a.on {color: #fefdca;}
ul.meny li ul li {height: auto; width: 100%;}
ul.meny li ul li ul {position: relative; top: 0; left: 0; padding: 0; border-top: 0; height: auto; overflow: hidden;}
ul.meny li ul li ul li {position: relative; margin: 0;  padding: 0; border-bottom: 0;}
ul.meny li ul li ul li a {position: relative; padding: 0; margin: 0; font-size: 14px; color: white; text-decoration: none; text-transform: none;}
ul.meny li ul li > ul li {}
.close {display: block; position: absolute!important; top: 10px; left: 10px; text-align: left; z-index: 100; width: 20px!important;}
#menu.menu-fixed ul.meny {margin: 6px 0 0 0;}
}

/*  Menu > 1024 */
@media only screen and (min-width: 1101px) and (max-width: 1000000px) {
html {height: 100%; font-size: 100%;}
ul.meny {width: 100%; text-align: right; height: auto; margin: 0; padding-right: 15px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
ul.meny li {display: inline-block; list-style: none; width: auto; height: auto;}
ul.meny li a img {display: none;}
ul.meny li ul {display: block; margin: 0;}
ul.meny li ul li {margin: 0; position: relative; padding: 0; }
ul.meny li ul li a {color: white; font-size: 17px; line-height: 24px; font-weight: 700; text-transform: uppercase; padding: 0 15px; text-decoration: none; display: inline-block; text-shadow: 0.5px  0.5px  #004163, -0.5px 0.5px #004163, 0.5px -0.5px #004163, -0.5px -0.5px #004163, 0.5px  0.5px 5px #004163;}
ul.meny li ul li a:hover {color: #fefdca; text-decoration: none;}
ul.meny li ul li a.on {color: #fefdca;}
ul.meny li ul li {height: 40px; width: auto; min-width: auto;}
ul.meny li ul {z-index: 100;}
ul.meny li ul li ul li {display: none;}
ul.meny li ul li:hover > ul li {display: inline-block; min-width: 300px;}
ul.meny li ul li ul {text-align: left; padding: 10px 0; position: absolute; top: 31px; left: 0; z-index: 100; background: #005b87;}
ul.meny li ul li ul li {margin: 0; padding: 0; width: 100%; background: none; border: 0; height: auto;}
ul.meny li ul li ul li:hover {width: 100%;}
ul.meny li ul li ul li a {font-size: 17px; text-transform: none; color: white; text-decoration: none; line-height: 30px; padding: 0; margin: 0 0 0 15px; height: auto; display: inline-block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
ul.meny li ul li ul li a:hover {text-decoration: none; color: #fefdca; width: 100%; text-decoration: underline; background: none;}
li.close {display: none!important;}
#menu.menu-fixed ul.meny {text-align: center; margin: 6px 0 0 0;}
}


/* 0 - 540 (320, 360, 414, 480, 533, 540) */
@media only screen and (min-width: 100px) and (max-width: 540px) {
html {height: 100%; font-size: 100%;}
p {text-align: left;}
.header-logo {display: none;}
.header-slogan {width: 100%; padding: 15px 10px 0 10px;}
.header-slogan h1, .header-slogan p.header-slogan-big {font-size: 30px; line-height: 34px;  background: none; -webkit-text-fill-color: #fdfcb3; -webkit-text-stroke-width: 1px;}
.header-slogan h2, .header-slogan p.header-slogan-small {font-size: 22px; line-height: 26px;  background: none; -webkit-text-fill-color: #fdfcb3;}
.header-slogan h1 br, .header-slogan p.header-slogan-big br, .header-slogan h2 br, .header-slogan p.header-slogan-small br {display: inline-block;}
.footer-left {width: 100%; text-align: center; margin-bottom: 10px;}
.footer-left a {margin: 0 7px;}
.footer-right {width: 100%; text-align: center;}
.sommaire-rubrique>div {width: 100%; max-width: 300px; margin: 2% auto; float: none;}
.sommaire-article-banner {width: 100%; margin: 0 0 20px 0;}
.sommaire-article-col1 {width: 100%; margin: 0 0 20px 0;}
.sommaire-article-col2 {width: 100%; margin: 0 0 20px 0;}
.content {padding: 15px;}
.gallery .item-gal {width: 48%; height: 48%;}
.left {display: none;}
.right {width: 100%;}
.sommaire-news {-webkit-column-count: 1; -moz-column-count: 1; column-count: 1;}
.left-cnap {width: 100%; margin: 0 0 20px 0;}
.left-cnap a {width: 47%; display: inline-block; margin: 0 2% 2px 0;}
.right-cnap {width: 100%;}
.cnap1 {width: 100%; padding-right: 0;}
.cnap2 {width: 100%; padding-left: 0;}
.cnap3 {width: 100%;}
.formulaire_recherche input[type="text"] {width: 76%;}
.formulaire_recherche input[type="submit"] {width: 23%;}
}

/* 480, 540 */
@media only screen and (min-width: 479px) and (max-width: 540px) {
html {height: 100%; font-size: 100%;}
.header-logo {width: 30%; display: inline-block; padding: 10px 15px 0 15px;}
.header-slogan {width: 70%; padding: 15px 10px 0 10px;}
}

/* 541 - 768 (568, 600, 640, 720, 768) */
@media only screen and (min-width: 541px) and (max-width: 768px) {
html {height: 100%; font-size: 100%;}
.header-logo {width: 30%; padding: 10px 15px 0 15px;}
.header-slogan {width: 70%; padding: 15px 10px 0 10px;}
.header-slogan h1, .header-slogan p.header-slogan-big {font-size: 30px; line-height: 34px;  background: none; -webkit-text-fill-color: #fdfcb3; -webkit-text-stroke-width: 1px;}
.header-slogan h2, .header-slogan p.header-slogan-small {font-size: 22px; line-height: 26px;  background: none; -webkit-text-fill-color: #fdfcb3;}
.header-slogan h1 br, .header-slogan p.header-slogan-big br, .header-slogan h2 br, .header-slogan p.header-slogan-small br {display: inline-block;}
.sommaire-rubrique>div {width: 48%;}
.sommaire-article-banner {width: 100%; margin: 0 0 20px 0;}
.sommaire-article-col1 {width: 100%; margin: 0 0 20px 0;}
.sommaire-article-col2 {width: 100%; margin: 0 0 20px 0;}
.gallery .item-gal {width: 31%; height: 31%;}
.left {display: none;}
.right {width: 100%;}
.left-cnap {width: 100%; margin: 0 0 20px 0;}
.left-cnap a {width: 47%; display: inline-block; margin: 0 2% 2px 0;}
.right-cnap {width: 100%;}
.formulaire_recherche input[type="text"] {width: 76%;}
.formulaire_recherche input[type="submit"] {width: 23%;}
}

/* 640 - 768 */
@media only screen and (min-width: 639px) and (max-width: 768px) {
html {height: 100%; font-size: 100%;}
.header-slogan {padding: 48px 10px 0 0;}
.header-slogan h2, .header-slogan p.header-slogan-small {font-size: 24px; line-height: 28px;  background: none; -webkit-text-fill-color: #fdfcb3;}
.header-slogan h1 br, .header-slogan p.header-slogan-big br, .header-slogan h2 br, .header-slogan p.header-slogan-small br {display: none;}
.left {width: 41%; display: block;}
.right {width: 57%;}
}

/* 769 - 960 (800, 960) */
@media only screen and (min-width: 769px) and (max-width: 960px) {
html {height: 100%; font-size: 100%;}
.header-logo {width: 23%; padding: 10px 15px 0 15px;}
.header-slogan {width: 77%; padding: 40px 10px 0 0;}
.header-slogan h1, .header-slogan p.header-slogan-big {font-size: 36px; line-height: 36px;}
.header-slogan h2, .header-slogan p.header-slogan-small {font-size: 29px; line-height: 35px;}
.sommaire-rubrique>div {width: 48%;}
.sommaire-article-banner {width: 48%; margin: 0 2% 2% 0;}
.sommaire-article-col1 {width: 48%; margin: 0 0 2% 2%;}
.sommaire-article-col2 {width: 100%; margin: 0;}
.gallery .item-gal {width: 23%; height: 23%;}
.left {width: 32%;}
.right {width: 66%;}
.left-cnap {width: 23%;}
.right-cnap {width: 75%;}
.formulaire_recherche input[type="text"] {width: 76%;}
.formulaire_recherche input[type="submit"] {width: 23%;}
}


/*  961 - 1199 (1024) */
@media only screen and (min-width: 961px) and (max-width: 1199px) {
html {height: 100%; font-size: 100%;}
.sommaire-rubrique>div {width: 24%; margin: 1% 0.5%;}
.sommaire-rubrique>div a {font-size: 15px; line-height: 17px;}
.left-cnap {width: 23%;}
.right-cnap {width: 75%;}
}

/* > 1200 (1920) */
@media only screen and (min-width: 1200px) and (max-width: 100000px) {
html {height: 100%; font-size: 100%;}
}