@media only screen and (max-width: 1300px) {
.home .ligne3 .flickity-prev-next-button.previous { left: -25px!important }
.home .ligne3 .flickity-prev-next-button.next { right: -25px!important }
.home .ligne6 .flickity-prev-next-button.previous { left: -25px!important }
.home .ligne6 .flickity-prev-next-button.next { right: -25px!important }
}

@media only screen and (max-width: 1240px) {
header { height: 80px }
header .logo { height: 44px; margin: 18px 0 0 30px }
header nav a { font-size: 16px; padding: 0 10px; line-height: 80px }
.menu { top: 80px; left: 70px }
.main { margin: 80px 0 0 70px }
.main .center { padding: 40px 40px }
}

@media only screen and (max-width: 1024px) {
.mobile { display: block }
.search,
.main .right,
.tools,
.main .left .encart,
.main .left .services,
.main .left .vousetes .titre,
.menu { display: none !important }
.nocol { width: 100% !important }
header { height: 60px; box-shadow: none; left: 0 }
header .logo,
.headernuit .logo { height: 34px; margin: 13px 0 0 15px }
header nav { display: none }
.headernuit { height: 60px }
.navmobile { float: right; padding-right: 10px }
.navmobile a { display: inline-block; height: 40px; width: 40px; line-height: 40px; text-align: center; margin: 10px 0 0 0; font-size: 20px; color: #004156; font-family: 'fontello' }
.acces { position: fixed; top: 60px; right: 0; left: 0; height: 44px; background-color: #000000; z-index: 9; font-size: 0 }
.acces a { display: inline-block; height: 44px; position: relative; color: #FFF; font-size: 13px; text-align: center; width: 33.33333%; text-transform: uppercase; overflow: hidden }
.acces a span { position: absolute; top: 50%; transform: translateY(-50%); line-height: 15px; width: 100%; left: 0 }
.acces a:first-child { background-color: #00a2b3 }
.acces a:nth-child(2) { background-color: #93c01f }
.acces a:nth-child(3) { background-color: #004156 }
#search { padding: 30px; width: 100%; top: 60px; left: -100%; margin-left: -70px; z-index: 10 }
#search .titre { font-size: 20px; padding-bottom: 20px }
#search .form input { width: 100%; margin-right: 0; height: 38px; padding: 0 10px; font-size: 16px; font-weight: bold; margin-bottom: 10px }
#search .form a { float: left; width: 100%; height: 38px; line-height: 38px; font-size: 15px }
#search .tags a { height: 38px; line-height: 38px; font-size: 15px; padding: 0 15px }
.menumobile { display: none; position: fixed; top: 60px; left: 0; right: 0; background-color: #003d50; z-index: 10; font-weight: bold }
.menumobile a { display: block; color: #FFF; font-size: 16px; padding: 10px; border-bottom: 1px solid #FFF }
.menumobile .back { font-size: 14px; font-weight: normal }
.menumobile .back span { font-family: 'fontello'; margin-right: 5px }
.main { margin: 104px 0 0 0; width: 100% }
.main .center { padding: 30px; width: 100% }
.home { max-width: 100% }
.main .left { height: auto !important; min-height: auto !important; position: fixed; top: 104px; z-index: 9; padding: 0; width: 100%; display: none }
.main .left .vousetes { margin-bottom: 0; padding: 30px }
.main .left .vousetes .liste label { font-size: 16px }
.main .left .vousetes .liste select { height: 38px }
.main .left .vousetes .valider a { padding: 8px 10px }
footer { margin-left: 0 }
.home .ligne1 { padding: 40px 25px }
.home .ligne1 .droite { display: none }
.home .ligne1 .gauche { width: 100%; margin-right: 0 }
.home .ligne1 h2 { font-size: 30px; line-height: 30px; margin-top: 35px }
.home .ligne1 .icone { height: 30px; margin-top: 35px }
.home .ligne1 .voir { height: 30px; line-height: 26px; padding: 0 10px; top: -10px; font-size: 15px; }
.home .ligne1 .gauche ul .titre a { font-size: 22px; }
.home .ligne1 .gauche ul .intro a { font-size: 16px; line-height: 24px; margin-bottom: 20px }
.home .ligne2 { padding: 40px 25px 20px 25px }
.home .ligne2 .icone { height: 30px }
.home .ligne2 h2 { font-size: 30px; line-height: 30px }
.home .ligne3 { padding: 30px 30px }
.home .ligne3 .carousel-cell { width: 100% !important; height: 370px !important; margin-right: 75px !important; }
.home .ligne3 .flickity-prev-next-button.previous { left: -25px!important }
.home .ligne3 .flickity-prev-next-button.next { right: -25px!important }
.home .ligne3 .carousel-cell .date span:first-child strong { font-size: 22px }
.home .ligne4 { padding: 80px 25px }
.home .ligne4 .icone { height: 30px; }
.home .ligne4 h2 { font-size: 30px; line-height: 30px; width: 80%; margin-bottom: 20px }
.home .ligne4 .video { }
.home .ligne4 .video .img { padding-top: 55%; width: 100%; margin-right: 0px }
.home .ligne4 .video .desc { width: calc(100%); padding-right: 0px }
.home .ligne4 .video .titre h3 { font-size: 20px; margin: 20px 0 20px 0 }
.home .ligne4 .video .description { font-size: 15px; line-height: 20px }
.home .ligne4 .voir { margin-top: 10px; }
.home .ligne5 { padding: 0 25px }
.home .ligne5 .couverture { width: 120px; left: 5px; top: 15% }
.home .ligne5 .mag { padding: 30px 0 30px 140px }
.home .ligne5 .mag h2 { font-size: 21px; line-height: 23px }
.home .ligne5 .mag .mois { font-size: 17px }
.home .ligne5 .mag h3 { font-size: 20px }
.home .ligne5 .mag a { font-size: 16px }
.home .ligne6 { padding: 70px 30px }
.home .ligne6 .icone { height: 30px }
.home .ligne6 h2 { width: 80%; font-size: 30px; line-height: 30px; margin: 0 0 30px 0 }
.home .ligne6 .carousel-cell { width: 100% !important; height: 300px !important; }
.home .ligne6 .carousel-cell h4 { font-size: 24px }
.home .ligne6 .flickity-prev-next-button.previous { left: -25px!important }
.home .ligne6 .flickity-prev-next-button.next { right: -25px!important }
.home .pocket .couverture { width: 100px; left: 15px !important; top: 25px }
.home .ligne7 { padding: 60px 25px }
.home .ligne7 .icone { height: 30px }
.home .ligne7 h2 { font-size: 30px; line-height: 30px }
.home .ligne7 .seino { width: 100% !important; height: 270px !important }
.home .ligne7 .seino div h4 { font-size: 20px; margin: 10px 0 0 0; color: #FFF }
.home .ligne7 .nosmart { display: none }
footer { width: 100%; margin-left: 0px; }
footer .gauche { padding: 20px; width: 100%; background-color: #cbd8dd; height: auto }
footer .gauche img { width: 80px; margin-right: 30px }
footer .gauche ul { width: calc(100% - 120px) }
footer .droite { padding: 20px; width: 100%; background-color: #cbd8dd; height: auto }
footer .droite a { color: #004156 }
.recherche h1 { font-size: 20px; margin-bottom: 10px }
.recherche h2 { font-size: 18px }
.recherche .res { margin-bottom: 40px }
.recherche .res td { padding: 10px 0 }
.recherche .res td a { font-size: 16px }
.recherche .res td .desc { font-size: 14px; line-height: 18px }
/* PAGE */
.main .page h1 { font-size: 20px }
.main .page .texte { line-height: 22px; font-size: 15px; }
.main .page .texte h2 { font-size: 20px; line-height: 22px; margin-top: 50px; }
.main .page .texte .googlemaps,
.main .page .texte .googlemaps .map { height: 500px !important }
.main .page .texte .googlemaps .cartosearch input,
.main .page .texte .googlemaps .cartosearch select,
.main .page .texte .googlemaps .cartosearch .rech { display: none !important }
.main .page .texte .googlemaps .cartosearch .pos { font-weight: bold; margin-left: 10px }
.main .page .texte .googlemaps .gomap div .btn { font-size: 13px !important }
.main .sommaire { position: static!important; width: 100%; padding: 0 30px; float: left; margin-bottom: 30px }
.main .sommaire ul { display: none }
.main .sommaire .lesaviezvous { width: 100% }
.main .page .texte .chap { width: 100%; margin-right: 0; margin-top: 30px }
.main .page .texte .chap .thumb { height: 120px }
.main .page .texte .chap h2 { line-height: 20px; font-size: 16px }
.main .page .texte .nomarge { margin-right: 0 !important }
.actualites { width: 100% !important }
.actualites .home .half { width: 100%; margin-right: 0; margin-bottom: 15px }
#actualites .featured .intro { padding-bottom: 0px }
#actualites .half .title { padding: 20px 0 0px 0px }
.diaporamas { width: 100% !important }
.diaporamas .home .half { width: 100%; margin-right: 0px; margin-bottom: 15px }
#diaporamas .featured .intro { padding-bottom: 0px }
#diaporamas .half .title { padding: 20px 0 0 0px }
.diaporamas .rub { font-size: 18px }
.elus .elu .img { width: 80%; }
.elus .elu .coord { line-height: 20px; font-size: 14px; overflow: hidden }
.randos { margin-bottom: 40px }
.randos .texte { margin-bottom: 40px }
.randos h2 { tfont-size: 20px }
.appelsaprojets { width: 100% !important }
/* MICROSITES */
.microsite .menui { display: block; position: absolute; top: 160px; border: 2px solid #000; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-left: 0; left: 0px; width: 40px; height: 40px; line-height: 36px; font-family: 'fontello'; font-size: 18px; text-align: center; background-color: #FFF; transition: left 0.6s cubic-bezier(.23, 1, .32, 1) }
.microsite .gauche { min-height: auto !important; padding: 20px; border-right: 1px solid #CCC; display: block; left: -100%; width: calc(100% - 40px); position: absolute; z-index: 9; background-color: #FFF; transition: left 0.6s cubic-bezier(.23, 1, .32, 1) }
.microsite .page h1 { padding-left: 20px }
.magazine .ligneart a div { padding: 20px }
.magazine .ligneart a div h2 { font-size: 20px; line-height: 24px }
.magazine .ligneart { height: 440px; margin-bottom: 10px }
.magazine .ligneart .art1 { top: 0; left: 0; height: calc(50% - 10px); width: 50% }
.magazine .ligneart .art2 { bottom: 0; left: 0; height: calc(50% - 10px); width: 50% }
.magazine .ligneart .art3 { top: 0; right: 0; height: 100%; width: calc(50% - 10px) }
.magazine .ligneart .art4 { top: 0; left: 0; width: 50%; height: 100% }
.magazine .ligneart .art5 { top: 0; right: 0; height: calc(50% - 10px); width: calc(50% - 10px) }
.magazine .ligneart .art6 { bottom: 0; right: 0; height: calc(50% - 10px); width: calc(50% - 10px) }
.magazine .ligneart .art3 div,
.magazine .ligneart .art4 div { padding: 20px }
.magazine .ligneart .art3 h2,
.magazine .ligneart .art4 h2 { font-size: 22px; line-height: 26px }
.magazine .ligneart a div { top: 0px; padding: 0 }
.magazine .ligneart a div .cat { display: none }
.magazine .ligneart a div h2 { margin: 0px 0 0 0; font-size: 14px; line-height: 20px }
.colonnemag { display: block !important; padding: 30px!important; position: static !important }
}