/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 22 janv. 2016, 14:40:26
    Author     : vincent
*/

input, button, select, textarea {max-width:100%;}

@media screen and (max-width: 1340px) {
    .wrapper {width:1200px;}
    #lightSlider { height: 529px!important; }
    .slider {min-height:300px;}
    .slides .slide-content {width:44%; top:60px;}
    
    .section .a_section .section_icone {margin-left:20px; width:110px;}
    .section .a_section .section_content {max-width:760px;}
    .row {margin:0;}
    #footer .footer-temoignage {position:relative; overflow:hidden;}
    #page > .wrapper {background-size:100% auto;}
    #header .logo {margin-right:30px; margin-left:20px;}
}

@media screen and (max-width: 1220px) {
    .wrapper {width:1080px;}
    #lightSlider { height: auto!important; }
    #header .navigation,#header .logo {height:284px;}
    #header .logo  {max-width:350px; margin-right:15px; margin-left:0px;}
    #header .logo img {max-width:100%; height:auto;}
    .contenu_accueil {padding:20px 0px;}
    #footer .footer-bg, #footer {background-image:none; min-height:auto;}
    #footer .footer-temoignage {background-color:#1c599e; min-height: 460px;}
    .section .a_section .section_icone {margin-left:00px; width:90px;}
    .section .a_section .section_titre {padding-right:10px;}
    .section .a_section .section_content {max-width:700px; padding-left:10px;}
    .contenu_accueil .contenu br {display:none;}
    #header .logo a {position:relative; top:10px;}
}

@media screen and (max-width: 1100px) { 
    .wrapper {width:96%;}
    #header .logo {max-width:300px; margin-left:0px; margin-right: 20px;}
    #header .logo a {position:relative; top:25px;}
    #header .top-menu li > a {font-size:14px;}
    #header .main-menu .menu-1 li > a {font-size:13px;}
    #header .main-menu .menu-2 li > a {font-size:13px;}
    .slides .slide-content h2 {font-size:26px;}
    .slides .slide-content p {font-size:15px;}
    .section .a_section .section_content {max-width:650px;}
    .contenu_accueil .image-a-la-une {}
    .contenu_accueil .image-a-la-une img {max-width:100%; height:auto;}
    .contenu_accueil .contenu {font-size:16px;}
    .mc-main tr td {border:2px solid transparent!important;}
    .mc-main .mc-date {padding:10px!important;}
    .lSPager {bottom:25px;  width:44%;}
    .slides .slide-content {top:45px;}
}

@media screen and (max-width: 1024px) { 
    #header .logo {max-width:250px; margin-left:0px; margin-right: 10px;}
    #header .logo a {position:relative; top:45px;}
    #header .top-menu li > a {font-size:13px;}
    #header .main-menu .menu-1 li > a {font-size:13px; padding:1px 10px;}
    #header .main-menu .menu-2 li > a {font-size:13px; padding:1px 10px;}
    .slides .slide-content h2 {font-size:24px;}
    .slides .slide-content p {font-size:14px;}
    .slides .slide-content img {max-width:85%; height:auto;}
    .section .a_section .section_icone {width:80px;}
    .section .a_section .section_icone img {max-width:100%; height:auto;}
    .section .a_section .section_titre {font-size:14px;}
    .section .a_section .section_content {max-width:610px;}
}

@media screen and (max-width: 1000px) { 
    #footer .footer-events {padding:30px;}
    .footer-temoignage .a-temoignage {text-align:center;}
    #header .navigation {height: 284px;    overflow: hidden;    position: relative;    display: block;}
    #header .logo {    max-width: 210px; padding:10px;}
    #header .logo a {top:65px;}
    .lSPager {bottom:15px;  width:44%;}
    .section .a_section .section_content {    max-width: 62%;}
    .slides .slide-content {top:25px;}
    .footer-left .an_address {width:100%;}
    .footer-left .an_address .titre {font-size:22px; width:160px;}
    #header .top-menu li > a { padding:1px 10px;}
    .mesure-ecole-selection .wpcf7-list-item, .rapport-specialiste .wpcf7-list-item, .rapport-specialiste .enfant-defi, .enfant-defi .wpcf7-list-item {width:95%;}
    #page .wrapper .custom-background li {font-size:20px;}
    #page .wrapper .custom-background ul.half_width li {}
    #page .wrapper .custom-background ul.third_width li {font-size:20px; width:45%}
    
}

@media screen and (max-width: 900px) { 
    .lSPager {bottom:10px; width:50%;}
    .slides .slide-content p {font-size:13px;}
    .slides .slide-content { top:10px;   background: rgba(255,255,255,0.3);    box-shadow: rgba(255,255,255,0.25) 0px 0px 10px 1px; width:50%;}
    .section .a_section {text-align:center;}
    .section .a_section .section_icone {float: none;    display: inline-block;}
    .section .a_section .section_titre {float: none;    display: inline-block;    border-right: none;}
    .section .a_section .section_content {max-width:100%; height:auto;}
    .contenu_accueil .contenu {text-align:center;}
    #header .top-menu li > a { padding:1px 7px;}
    .navigation .wrapper {width:98%;}
    #header .main-menu .menu-1 li > a {font-size:13px; padding:1px 4px;}
    #header .main-menu .menu-2 li > a {font-size:13px; padding:1px 5px;}
    .slides .slide-content hr {margin:5px auto;}
    .slider {min-height:250px;}
    .custom-background {width:100%!important;}
    .col-sidebar {padding-left:30px;}
    .col-main {padding-right:30px;}
}

@media screen and (max-width: 800px) { 
    #header .lien-paiement { display:none; }
    .mobileonly { display:block; }
    #menu_navigation_btn {display:block; background-color:#20358c; color:#fff; border-radius:2px; width:50px; height:50px; margin:0 auto; text-align:center; padding:10px; margin-top:10px; transition:background-color 400ms ease-out;}
    #menu_navigation_btn svg {fill: #fff; max-width:100%; max-height:100%; transition:all 300ms ease-out;}
    #menu_navigation_btn svg path {fill: #fff;  transition:all 300ms ease-out;}
    #menu_navigation_btn.active {background-color:#247a28;}
    #header .navigation {background:none; padding-bottom:10px;}
    .navigation .wrapper {width:100%!important;}
    #header .logo {width: 100%;  margin: 0; padding: 10px; min-height: 100px; height: auto; height: auto;  max-width: 100%; text-align:center; float:none; margin-top:20px;}
    #header .logo a {float:none; top:0px;}
    #header .navigation {height:100%;}
    .contenu_accueil { background-position: 50% bottom;}
    .contenu_accueil .image-a-la-une {display:none;}
    #header .top-menu {width:100%; background:#247a28; padding: 0px; top:0px; float: none; clear:both; min-width:inherit; max-height:0px; overflow:hidden; position:relative; transition:all 450ms ease-out;}
    #header .top-menu ul {padding:10px 0px; margin:0;}
    #header .top-menu.active {max-height:500px;}
    #header .top-menu li {float:none; display:block; text-align:Center; border:none;}
    #header .top-menu li > a {font-size:14px; padding:5px 0px; border:none; text-transform:uppercase;}
    #header .main-menu {top:0px; float:none; background:#43b649; padding:0px 0px; max-height:0px; overflow:hidden; position:relative; transition:all 450ms ease-out;}
    #header .main-menu.active {max-height:500px;}
    #header .main-menu ul {padding:0px 0px; margin:0;}
    #header .main-menu li {display:block; float:none; text-align:center; width:100%; padding:0;}
    #header .main-menu .menu-1,#header .main-menu ul {margin-bottom:0px;}
    #header .main-menu .menu-1 li > a { padding:5px 0px; font-weight:normal; font-size:14px;}
    #header .main-menu .menu-2 li > a { padding:5px 0px; font-weight:normal; font-size:14px;}
    .slider {min-height:200px;}
    #page .wrapper .custom-background li {font-size:18px;}
    #page .wrapper .custom-background ul.half_width li {width:95%}
    #page .wrapper .custom-background ul.third_width li {width:45%; font-size:18px;}
}

@media screen and (max-width: 768px) { 
    .footer-left .address { margin-top: 30px; margin-bottom: 0px; }
    .footer-left .an_address .titre {width:50%; margin:0 auto; margin-bottom:10px; border-right:none; text-align:center; border-bottom:2px solid #fff; min-height:100%; float:none;}
    .footer-left .an_address .contenu {width:100%; text-align:center; border-left:none; padding-left:0; }
    #page .wrapper .custom-background li {font-size:16px;}
    #page .wrapper .custom-background ul.half_width li {width:95%}
    #page .wrapper .custom-background ul.third_width li {width:95%; font-size:16px;}
    .slides .slide-content {width:100%; height:100%; top:0px; margin:0 auto; left:0%!important; right:0%!important; background: rgba(255,255,255,0.8);
    box-shadow: rgba(255,255,255,0.6) 0px 0px 10px 1px; min-height:270px;}
    .slides .slide-content h2 {font-size:22px;}
    #lightSlider {min-height:270px;}
    #lightSlider .lslide > img {height:270px; width:auto; margin:0 auto;}
    #footer {position: relative;    overflow: hidden;}
    .footer-left .menu-footer li {display:block; border:none; padding:4px 0px;}
    #header {background-size: auto 400px; background-position:top center;}
    .col-sidebar {padding-left:0; border-left:0px; padding-bottom:10px;}
    #page .wrapper h1 {font-size:24px;}
    #page .wrapper h2 {font-size:22px;}
    #page .wrapper h3 {font-size:21px;}
    #page .wrapper h5 {font-size:16px; border-bottom-size:12px;}
    #page .wrapper h6 {font-size:16px; border-bottom-size:12px;}
    .column-contact {border-right:none;}
    #page .wrapper {padding:0px 15px;}
    .services-content .a-service.active .toggle-content {max-height:350px;}
    .menu-footer { margin: 20px 0 0; }
}

@media screen and (max-width: 700px) { 
    .section .a_section .section_icone img {max-width:60%}
    #page .wrapper h1 {font-size:24px;}
    .page-header {padding-bottom:40px;}
    #page .wrapper p {font-size:16px;} 
}

@media screen and (max-width: 540px) { 
    .slides .slide-content {padding:10px 0px;}
    #lightSlider .slides > img {opacity:0; min-height:300px;}
    .slider {background-color:#fff;}
    .footer-left .an_address .titre {width:80%;}
    .page-header h1:after {width:280px; margin-left:-140px;}
    #page .wrapper {padding:0px 10px;}
    #page .wrapper p {font-size:15px;}
    #page .wrapper ul li,#page .wrapper ol li {font-size: 16px;}
    .services-content .a-service.active .toggle-content {max-height:400px;}
}

@media screen and (max-width: 420px){ 
    #page .wrapper {padding:0px 10px;}
    #page .wrapper p {font-size:15px;}
    #page .wrapper p br {display:none;}
    #page .wrapper h1 {font-size:22px;}
    #page .wrapper h2 {font-size:20px;}
    #page .wrapper h3 {font-size:18px;}
    #page .wrapper h5 {font-size:15px; border-bottom-size:10px;}
    #page .wrapper h6 {font-size:15px; border-bottom-size:10px;}
    #page .wrapper ul li,#page .wrapper ol li {font-size: 14px;}
    .slider {display:none;}
    .services-content .a-service.active .toggle-content {max-height:450px;}
}