/**
 * Forms
 */

/* All elements */
.field { margin-bottom: 30px; position:relative; }
.field label { display: inline-block; margin:0; }

[data-validate-for] { display:none; font-size:10px; line-height:10px; position:absolute; right:0; bottom:-1.2em; }
[data-validate-for].visible { display:block; }

/* Textfields & textareas */
.field.textfield input,
.field.textarea textarea { display: block; width: 100%; padding: 10px; border: 1px solid #ccc; }

/* Checkbox & Radio */
.field.checkbox label,
.field.radio label { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; position:relative; margin-bottom:10px; cursor: pointer; }

.field.checkbox input,
.field.radio input,
.field.checkbox span:before,
.field.radio span:before { width:20px; height:20px; margin-right:10px; }

.field.checkbox span:before,
.field.radio span:before { content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); border:1px solid #ccc; background:#fff; }

.field.checkbox span:after,
.field.radio span:after { content:''; position:absolute; left:3px; top:50%; transform:translateY(-50%); width: 14px; height:14px; background:#ccc; opacity:0; transition:all 0.5s ease 0s; }

.field.checkbox input:checked+span:after,
.field.radio input:checked+span:after { opacity: 1; }

.field.checkbox span:before,
.field.checkbox span:after { border-radius: 0; }

.field.radio span:before,
.field.radio span:after { border-radius: 50%; }

.field.radio.inline,
.field.checkbox.inline { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
.field.radio.inline label,
.field.checkbox.inline label { margin-right:15px; margin-bottom:0; }

/* Select */
.field.select select { display:block; width:100%; padding:10px; border:1px solid #ccc; }

/* Captcha */
.field.captcha { display:flex; flex-direction:row; justify-content:center; }

/**
 * Navigation
 **/
 
/* Frontend editor */
.ct-widget.ct-ignition { position:fixed; left:auto; top:auto; right:20px; bottom:20px; z-index:10000; transition:all 0.5s ease 0s; }
.ct-widget.ct-ignition .ct-ignition__button { position:static; margin-top:10px;}

.ce-element { outline:2px dashed rgba(243, 156, 18, 0.5); }
.ce-element--focused, .ce-element:focus { outline:2px dashed rgba(243, 156, 18, 1); }

/**
 * Legal
 **/
.legal { margin:60px 0; }
.legal h1 { font-size:4rem; margin:0 0 1em 0; }
.legal h2 { font-size:3rem; margin:1em 0; }
.legal h3 { font-size:2.5rem; margin:1em 0; }
.legal h4 { font-size:2rem; margin:1em 0; }
.legal h5 { font-size:1.5rem; margin:1em 0; }
.legal table { width:100%; margin:2em 0; }
.legal table th,
.legal table td { padding:1em; border:1px solid rgba(0,0,0,0.25); }
/**
 * General Elements
 **/

html { font-size:10px; }
body { font-size:1.6rem; font-family:'Open Sans'; font-weight:400; }
:focus, button:focus { outline:none; }

/* Images */
img, svg { max-width:100%; height:auto; }
img[data-sizes] { display:block; width:100%; }
/*
.image { position: relative; }
.image > * { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; }
.image:after { content: ''; display: block; height: 0; width: 100%; }
*/

/* Paragraphs */
p { margin-bottom:1em; line-height:2em; }
p:last-child { margin-bottom:0; }

/* Link */
a { transition:all 0.5s ease 0s; }
a:hover { text-decoration:none; }

a svg { transition:all 0.5s ease 0s; }

/* Lists */
ul, ol { margin-bottom:0; padding:0; list-style:none; }

/* Buttons */
.btn { background:#000; padding:30px 50px; color:#fff; text-transform:uppercase; font-size:1.8rem; font-weight:700; display:inline-block; border:2px solid #000; transition:all 0.5s ease 0s; }
.btn:hover { background:transparent; color:#000; }

.btn.small { padding:15px 30px; font-size:1.4rem; }


/**
 * Components
 **/
 
/* Generic */
.relative { position:relative; }
.align-center { align-items:center; }
.padding { padding-top:100px; padding-bottom:100px; }
.container-fluid { padding-left:50px; padding-right:50px; }
[data-bg] { background-size:cover; background-position:center center; background-repeat:no-repeat; }

/* Alert */
.alert { position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem; }
.alert .close { display:none; }
.alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
.alert-primary { color: #004085; background-color: #cce5ff; border-color: #b8daff; }
.alert-secondary { color: #383d41; background-color: #e2e3e5; border-color: #d6d8db; }
.alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; }
.alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; }

/* message */
.message { padding:5px 0; color:#fff; background:#07a99d; text-align:center; position:relative; z-index:2; }

/* Heading */
.heading { min-height:750px; display:flex; align-items:center; justify-content: center; position:relative; }
.heading:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; background:rgba(0,0,0,0.2); }
.heading .video a { color:#fff; text-transform:uppercase; font-weight:bold; }
.heading .video svg { width:50px; margin-right:30px; fill:#ff0000; }
.heading .container { margin-top:auto; position:relative; z-index:2; }
.heading .caption { padding-bottom:150px; }
.heading .uppertitle { color:#fff; text-transform:uppercase; font-size:2rem; font-weight:600; }
.heading .uppertitle:after { content:''; display:block; width:30px; height:2px; background:#fff; margin:10px 0 50px 0; }
.heading .title { font-weight:700; font-size:7rem; color:#fff; display:flex; flex-direction:row; align-items:flex-start; line-height:1.2em; }
.heading .title svg { width:50px; fill:#fff; margin-right:30px; margin-top:15px; }
.heading .picto { position:absolute; right:0; bottom:0; transform:translateY(50%); }

/* Accordion */
.accordions { box-shadow: 0px 0px 20px -10px rgba(0,0,0,0.5); }
.accordion .title { padding:50px 80px 50px 150px; background:#3e3e3e; color:#fff; display:flex; flex-direction:row; align-items:center; justify-content:space-between; cursor:pointer; margin-bottom:5px; border:none; }
.accordion .title .upper { display:block; font-weight:700; font-size:2.2rem; margin-bottom:5px; }
.accordion .title .lower { display:block; font-size:1.8rem; font-weight:400; }
.accordion .title .icon { width:75px; height:75px; background:rgba(0,0,0,0.2); display:flex; align-items:center; justify-content:center; border-radius:100%; transition:all 0.5s ease 0s; }
.accordion .title svg { width:15px; fill:#fff; }
.accordion .description { padding:80px 80px 80px 150px; border:none; }
.accordion:last-child .title { margin-bottom:0; }

.accordion.open .title { background:#585858; }
.accordion.open .title .icon { transform:rotate(-90deg); }

/* Forms */
.field.textfield {  }
.field.textfield label { position:absolute; left:0; top:50%; transform:translateY(-50%); transition:all 0.3s ease 0s; z-index:2; font-weight:bold; }
.field.textfield input { border-color:#a9a9a9; border-width:0 0 1px 0; padding:20px 0 5px 0; border-radius:0; height:auto; background:transparent; }
.field.textfield.active label,
.field.textfield.filled label { top:0; transform:translateY(0); font-size:1.2rem; }

.field.textarea label { position:absolute; left:0; top:10px; transition:all 0.5s ease 0s; z-index:2; font-weight:bold; }
.field.textarea textarea { border-color:#a9a9a9; border-width:0 0 1px 0; max-height:0; padding:10px 0; min-height:50px; max-height:50px; transition:all 0.5s ease 0s; background:transparent; }
.field.textarea.active textarea,
.field.textarea.filled textarea { min-height:300px;  max-height:300px; padding:40px 0;  }
.field.textarea.active label,
.field.textarea.filled label { font-size:1.2rem; }

.field.submit { text-align:center; }
.field.submit .btn { display:block; width:100%; }

.fields .label { font-weight:bold; margin-bottom:15px; }
.field.checkbox span:before, .field.radio span:before { border-color:#dcdcdc; }
.field.checkbox span:after, .field.radio span:after { left:0; width:20px; height:20px; background-color:#07a99d; }

/* Page */
.page h2 { font-size:4rem; }
.page .heading {  }
.page .intro { background-position:35% -300px; background-size:auto; background-repeat:no-repeat; }
.page .intro .image img { object-fit:cover; }
.page .intro .image:after { padding-bottom: 115.78947368421052% }
.page .intro .image iframe { max-width:100%; }
.page .intro h3 { color:#1db1a6; font-weight:bold;  }
.page .separator { background-position:center top; padding-top:150px; }
.page .separator .image:after { padding-bottom: 68.88888888888889% }
.page .separator .text h2 { font-size:3.5rem; font-weight:400; line-height:1em; margin-bottom:30px; }
.page .separator .download { color:#000; display:inline-block; }
.page .separator .more { font-size:2rem; }
.page .separator .image:after { padding-bottom: 74.54228421970357% }
.page .separator .icon { display:block; margin:40px auto; width:50px; }
.page .separator .icon svg { width:50px; height:50px; display:flex; align-items:center; justify-content:center; padding:12px; border-radius:100%; border:1px solid #000; }
.page .separator .link { font-size:3.5rem; line-height:1.2em; }
.page .separator .relative:after { content:''; position:absolute; right:0; top:100px; bottom:30px; width:calc(100% - 450px); background:#ededed; z-index:-1; }
.page .separator .text { margin-top:50px; font-size:3.5rem;  }
.page .separator .text p { line-height:1.4em; }
.page .separator .quote { font-size:3.5rem; font-weight:300; text-align:center; display:flex; max-width:500px; align-items:center; justify-content:center; margin:100px auto; position:relative; }
.page .separator .quote:before { content:''; position:absolute; left:-80px; top:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-open.png) no-repeat center center / contain; }
.page .separator .quote:after { content:''; position:absolute; right:-80px; bottom:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-close.png) no-repeat center center / contain; }
.page .separator .quote p { line-height:1.4em; }
.page .slider { position:relative; }
.page .slider .chevron-pattern { width:300px; height:500px; background-size:contain; position:absolute; right:-50px; bottom:-50px; z-index:-1; transform:rotate(180deg); }
.page .slider h2 { margin-bottom:80px; }
.page .slider .relative { padding-right:100px; }
.page .slider .swiper-wrapper { box-sizing:border-box; }
.page .slider .swiper-slide { background:#f2f2f2; padding:80px; }
.page .slider .swiper-slide h3 { margin-bottom:50px; }
.page .slider .swiper-slide h4 { color:#1db1a6; }
.page .slider .swiper-slide ul li { margin-bottom:10px; position:relative; padding-left:20px; }
.page .slider .swiper-slide ul li:before { content:''; background:url(../themes/lycee/assets/vendor/fontawesome/svgs/solid/arrow-right.svg) no-repeat center center / contain; width:15px; height:15px; display:inline-block; position:absolute; left:0; top:4px; }
.page .slider .pagination { position:absolute; right:0; top:100px; display:flex; flex-direction:column; align-items:flex-end; justify-content:flex-start; }
.page .slider .pagination .swiper-pagination-bullet  { margin-bottom:15px; display:flex; flex-direction:row; align-items:center; justify-content:flex-end; width:auto; height:auto; background:none; opacity:1; }
.page .slider .pagination .bullet { width:30px; height:30px; background:none; border:1px solid transparent; display:flex; align-items:center; justify-content:center; border-radius:100%; margin-right:10px; }
.page .slider .pagination .bullet .inner { width:19px; height:18px; display:inline-block; border:1px solid #a3a3a3; border-radius:100%; }
.page .slider .pagination .bullet-number { color:#000; font-weight:bold; font-size:2rem; }
.page .slider .pagination .swiper-pagination-bullet-active .bullet { border-color:#ffcf2a; }
.page .slider .pagination .swiper-pagination-bullet-active .bullet .inner { border-color:#ffcf2a; background-color:#ffcf2a; }
.page .slider .navigation { text-align:center; margin-top:50px; }
.page .slider .arrow { width:50px; height:50px; margin:0 15px; display:inline-flex; align-items:center; justify-content:center; background:transparent; border:1px solid #000; border-radius:100%; cursor:pointer; }
.page .slider .arrow svg { width:20px; }

/**
 * Layout
 **/
 
.hamburger { padding:25px 50px; background:#0b0b0c; color:#fff; margin-left:80px; display:flex; flex-direction:row; align-items:center; justify-content:center; position:static; }
.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before { background:#fff; border-radius:0; height:3px; }
.hamburger .text { color:#fff; text-transform:uppercase; margin-right:15px; }
.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner:after, .hamburger.is-active .hamburger-inner:before { background-color:#fff; }

#header { position:relative; left:0; top:0; width:100%; z-index:5;  }
#header .row { height:200px; }
#header .wrapper { display:flex; flex-direction:row; align-items:center; justify-content:flex-end; }
#header .navigation { display:flex; flex-direction:row; align-items:flex-start; justify-content:flex-end; }
#header .icons ul { display:flex; flex-direction:row; align-items:center; justify-content:flex-end; }
#header .icons li { list-style:none; margin-left:15px; }
#header .icons a { width:50px; height:50px; display:flex; align-items:center; justify-content:center; background:#ededed; border-radius:100%; }
#header .icons svg { width:25px; max-height:25px; fill:#555556; }
#header .icons a:hover { background:#07a99d; }
#header .icons a:hover svg { fill:#fff; }

#overlay { position:fixed; left:0; top:0; width:100%; height:100vh; background:#0b0b0c; z-index:2; transform:translateY(-100%); transition:all 0.5s ease 0s;  display:flex; align-items:center; justify-content:center; color:#fff; }
#overlay .hamburger { position:fixed; right:30px; top:30px;}
#overlay ul { list-style:none; }
#overlay ul ul { display:none; padding-left:20px; }
#overlay ul li { cursor:pointer; }
#overlay a { color:#fff; }
#overlay span { display:flex; flex-direction:row; align-items:center; justify-content:space-between; }
#overlay span img { width:10px; filter:invert(100%); transition:all 0.5s ease 0s; }
#overlay li.active > span img { transform:rotate(90deg); }

#overlay .lvl1 {  }
#overlay .lvl1 > li { padding:5px 0; font-size:2.4rem; font-weight:bold; text-transform:uppercase; border-bottom:1px solid rgba(255,255,255,0.2); }
#overlay .lvl1 > li:last-child { border:none; }
#overlay .lvl2 {  }
#overlay .lvl2 > li { font-size:2rem; text-transform:uppercase; font-weight:700; border-top:1px solid rgba(255,255,255,0.2); padding:5px 0; }
#overlay .lvl3 {  }
#overlay .lvl3 > li { font-size:2rem; text-transform:none; font-weight:400; }

body.open { overflow:hidden; }
body.open #overlay { transform:translateY(0); }

#page { /*background:url(../img/header2.png) no-repeat center top;*/ width:100%; overflow:hidden; }

#footer { color:#fff; }
#footer h3 { color:#07a99d; font-size:2.6rem; font-weight:bold; margin-bottom:20px; }
#footer .phones { margin:60px 0; font-size:2rem; font-weight:bold; }
#footer .phones p { line-height:1.4em; }
#footer .center { text-align:center; }
#footer .center .btn { background:#07a99d; margin:60px 0; border-color:#07a99d; }
#footer .center .btn:hover { background:transparent; color:#07a99d; }
#footer .center .address b { font-weight:bold; font-size:2.4rem; display:block; }
#footer .center .socials ul { list-style:none; display:flex; flex-direction:row; align-items:center; justify-content:center; }
#footer .center .socials li { margin:0 10px; }
#footer .center .socials a { display:flex; align-items:center; justify-content:center; width:50px; height:50px; color:#fff; border-radius:100%; background:#ccc; }
#footer .center .socials svg { width:26px; fill:#fff; }
#footer .center .socials .instagram a { background-color:#6926bc; }
#footer .center .socials .twitter a { background-color:#2392d8; }
#footer .center .socials .youtube a { background-color:#e40904; }
#footer .links { margin-bottom:80px; }
#footer .links:last-child { margin-bottom:0; }
#footer .links ul { list-style:none; }
#footer .links li { margin:5px 0; }
#footer .links a { color:#fff; }
#footer .copyright { color:rgba(255, 255, 255, 0.3); margin-top:60px; }
#footer .copyright a { color:rgba(255, 255, 255, 0.3); }
#footer .copyright a:hover { color:#fff; }
#footer .right { display:flex; flex-direction:column; align-items:flex-end; justify-content:flex-start; }
#footer .right .links { min-width:250px; }

/**
 * Page specific
 **/
 
/* Accueil */
#accueil #page { background:none; padding-top:0; } 
#accueil h1, #accueil h2 { font-size:4rem; font-weight:400; line-height:1.2em; margin-bottom:30px; }
#accueil h1 b, #accueil h2 b { font-weight:600; }
#accueil #header { padding:40px 0; }
#accueil #header .logo img { padding:40px 20px; background:#fff; }
#accueil #header .row { align-items:flex-start; }
#accueil #header .navigation { margin-top:30px; }

#accueil .slider { position:relative; margin-top:-280px; margin-bottom:100px; }
#accueil .slider .swiper-container { width:50vw; float:right; position:absolute; right:0; top:0; z-index:-1; height:100%; }
#accueil .slider .image img { height:100%; object-fit:cover; }
#accueil .slider .image:after { padding-bottom:100%; }
#accueil .slider .caption { position:absolute; left:32vw; top:50%; z-index:3; max-width:500px; }
#accueil .slider .caption .buttons { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
#accueil .slider .caption .btn { margin-top:30px; padding:10px 20px; margin-right:10px; display:inline-flex; flex-direction:row; align-items:center; justify-content:center; }
#accueil .slider .caption .btn svg { width:20px; fill:#fff; margin-right:10px; }
#accueil .slider .caption .btn:hover svg { fill:#000; }

#accueil .formations { text-align:center; position:relative; z-index:2; }
#accueil .formations .relative { padding-top:50px; padding-bottom:100px; }
#accueil .formations .relative:before { content:''; position:absolute; left:80px; top:0; right:80px; bottom:0; background:#ededed; z-index:-2; }
#accueil .formations h2 { font-size:4rem; font-weight:400;  line-height:1.2em; margin-bottom:50px; }
#accueil .formations .box { background:#777; padding:80px 50px 50px 50px; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; }
#accueil .formations img { margin-bottom:30px; }
#accueil .formations h3 { font-size:2rem; font-weight:700; }
#accueil .formations a { color:#fff; }
#accueil .formations .yellow { background-color:#ffcf2a; }
#accueil .formations .purple { background-color:#37246e; }
#accueil .formations .green { background-color:#07a99d; }
#accueil .blog h2 { margin-bottom:80px; text-align:center; }
#accueil .blog h3 { font-size:2.4rem; margin-bottom:30px; }
#accueil .blog .swiper-wrapper { box-sizing:border-box; }
#accueil .blog .box { box-shadow: 0px 0px 40px -10px rgba(0,0,0,0.35); padding:80px; }
#accueil .blog .date { color:#07a99d; font-weight:bold; }
#accueil .blog .date:after { content:''; display:block; width:32px; height:2px; background:#07a99d; margin:30px 0;  }
#accueil .blog .pagination { position:static; margin-top:50px; display:flex; flex-direction:row; align-items:center; justify-content:center; }
#accueil .blog .pagination .swiper-pagination-bullet  { margin-bottom:15px; display:flex; flex-direction:row; align-items:center; justify-content:center; width:auto; height:auto; background:none; opacity:1; }
#accueil .blog .pagination .bullet { width:30px; height:30px; background:none; border:1px solid transparent; display:flex; align-items:center; justify-content:center; border-radius:100%; margin-right:10px; }
#accueil .blog .pagination .bullet .inner { width:19px; height:18px; display:inline-block; border:1px solid #a3a3a3; border-radius:100%; }
#accueil .blog .pagination .bullet-number { color:#000; font-weight:bold; font-size:2rem; }
#accueil .blog .pagination .swiper-pagination-bullet-active .bullet { border-color:#ffcf2a; }
#accueil .blog .pagination .swiper-pagination-bullet-active .bullet .inner { border-color:#ffcf2a; background-color:#ffcf2a; }
#accueil .blog .btn { margin-top:30px; }
#accueil .erasmus { padding-top:150px; padding-bottom:150px; margin-top:100px; }
#accueil .erasmus .image:after { padding-bottom: 67% }
#accueil .erasmus .image img { box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.30); }
#accueil .erasmus .text .chevron { margin:30px; display:none; }
#accueil .erasmus .text .chevron svg { width:90px; }
#accueil .widgets { text-align:center; padding:60px 0; }
#accueil .widgets .social { padding:60px 0; }
#accueil .widgets .btn { padding:15px 45px 15px 30px; border-radius:50px; display:inline-flex; flex-direction:row; align-items:center; justify-content:center; margin-bottom:60px; }
#accueil .widgets .btn svg { margin-right:30px; fill:#fff; width:30px; }
#accueil .widgets .twitter .btn { background:#2392d8; border-color:#2392d8; }
#accueil .widgets .twitter .btn:hover { background:transparent; color:#2392d8; }
#accueil .widgets .twitter .btn:hover svg { fill:#2392d8; }
#accueil .widgets .instagram .btn { background:#6926bc; border-color:#6926bc; }
#accueil .widgets .instagram .btn:hover { background:transparent; color:#6926bc; }
#accueil .widgets .instagram .btn:hover svg { fill:#6926bc; }

/* Formation */
#formation-pros .content .heading .title { color:#04a69a; margin-bottom:30px; }
#formation-pros .content .heading .title svg { fill:#04a69a;  }
#formation-pros .content .testimonial { background-position:35% -300px; background-size:auto; background-repeat:no-repeat; padding:170px 0 50px 0; }
#formation-pros .content .testimonial .title { font-size:4.5rem; margin-bottom:40px; }
#formation-pros .content .testimonial .image:after { padding-bottom: 88.46153846153847% }
#formation-pros .content .testimonial .author { font-style:italic; font-weight:600; text-align:right; }
#formation-pros .content .accordion.open .title { background:#04a69a; }
#formation-pros .content .diplomas .description .icon { position:absolute; left:0; top:-15px; width:90px; height:90px; border-radius:100%; background:#00978c; display:flex; align-items:center; justify-content:center; padding:10px; }
#formation-pros .content .diplomas .description .icon img { max-width:50px; max-height:60px; }
#formation-pros .content .diplomas .description .download { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
#formation-pros .content .diplomas .description .download h3 { margin-top:15px; }
#formation-pros .content .diplomas .description .download a { color:#04a69a; }
#formation-pros .content .diplomas .description h2 { font-size:4.5rem; margin-bottom:80px; font-weight:bold; padding-left:150px; }
#formation-pros .content .diplomas .description h3 { font-size:2.5rem; font-weight:600; }
#formation-pros .content .diplomas .description ul { list-style:none; }
#formation-pros .content .diplomas .description li { margin-bottom:50px; position:relative; padding-left:150px; }
#formation-pros .content .diplomas .description p { font-size:1.5rem; }
#formation-pros .content .separator { background-position:center top; }
#formation-pros .content .video { text-align:center; }
#formation-pros .content .video h2 { font-size:3rem; margin-bottom:1em; }
#formation-pros .content .video iframe { width:800px; height:450px; }
#formation-pros .content .punchline { font-size:3.5rem; font-weight:300; text-align:center; display:flex; max-width:500px; align-items:center; justify-content:center; margin:100px auto; position:relative; }
#formation-pros .content .punchline:before { content:''; position:absolute; left:-80px; top:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-open.png) no-repeat center center / contain; }
#formation-pros .content .punchline:after { content:''; position:absolute; right:-80px; bottom:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-close.png) no-repeat center center / contain; }
#formation-pros .content .punchline p { line-height:1.4em; }
#formation-pros .content .brochure .download { color:#000; }
#formation-pros .content .brochure .more { font-size:2rem; }
#formation-pros .content .brochure .image:after { padding-bottom: 74.54228421970357% }
#formation-pros .content .brochure .icon { display:block; margin:40px 0; }
#formation-pros .content .brochure .icon svg { width:50px; height:50px; display:flex; align-items:center; justify-content:center; padding:12px; border-radius:100%; border:1px solid #000; }
#formation-pros .content .brochure .link { font-size:3.5rem; line-height:1.2em; }
#formation-pros .content .brochure .relative:after { content:''; position:absolute; right:0; top:100px; bottom:30px; width:calc(100% - 450px); background:#ededed; z-index:-1; }
#formation-pros .content .brochure .text { margin-top:50px; }

#formation-general .content .heading .title { color:#ffcf2a; margin-bottom:30px; }
#formation-general .content .heading .title svg { fill:#ffcf2a;  }
#formation-general .content .heading .caption { padding-bottom:60px; }
#formation-general .content .testimonial { background-position:35% -300px; background-size:auto; background-repeat:no-repeat; padding:170px 0 50px 0; }
#formation-general .content .testimonial .title { font-size:4.5rem; margin-bottom:40px; }
#formation-general .content .testimonial .image:after { padding-bottom: 88.46153846153847% }
#formation-general .content .testimonial .author { font-style:italic; font-weight:600; text-align:right; }
#formation-general .content .accordion.open .title { background:#ffcf2a; }
#formation-general .content .diplomas .description { padding:0 150px 80px 150px; }
#formation-general .content .diplomas .description .inner { margin-bottom:60px; }
#formation-general .content .diplomas .description .icon { position:absolute; left:0; top:-15px; width:90px; height:90px; border-radius:100%; background:#00978c; display:flex; align-items:center; justify-content:center; padding:10px; }
#formation-general .content .diplomas .description .icon img { max-width:50px; max-height:60px; }
#formation-general .content .diplomas .description h2 { font-size:4.5rem; margin-bottom:80px; font-weight:bold; padding-left:150px; }
#formation-general .content .diplomas .description h3 { font-size:2.5rem; font-weight:600; margin:0 -150px 0 -150px; background:#f3f3f3; padding:30px 150px;}
#formation-general .content .diplomas .description ul { list-style:none; margin:50px 0; }
#formation-general .content .diplomas .description li { margin:30px 0; font-size:1.8rem; display:flex; flex-direction:row; align-items:flex-start; justify-content:flex-start; }
#formation-general .content .diplomas .description li:before { content:''; display:inline-block; margin-right:15px; width:15px; height:20px; background:url(../themes/lycee/assets/img/puce-general.png) no-repeat center center / contain; }
#formation-general .content .diplomas .description p { font-size:1.5rem; }
#formation-general .content .separator { background-position:center top; }
#formation-general .content .video { text-align:center; }
#formation-general .content .video h2 { font-size:3rem; margin-bottom:1em; }
#formation-general .content .video iframe { width:800px; height:450px; }
#formation-general .content .punchline { font-size:3.5rem; font-weight:300; text-align:center; display:flex; max-width:500px; align-items:center; justify-content:center; margin:100px auto; position:relative; }
#formation-general .content .punchline:before { content:''; position:absolute; left:-80px; top:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-open.png) no-repeat center center / contain; }
#formation-general .content .punchline:after { content:''; position:absolute; right:-80px; bottom:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-close.png) no-repeat center center / contain; }
#formation-general .content .punchline p { line-height:1.4em; }
#formation-general .content .brochure .download { color:#000; }
#formation-general .content .brochure .more { font-size:2rem; }
#formation-general .content .brochure .image:after { padding-bottom: 74.54228421970357% }
#formation-general .content .brochure .icon { display:block; margin:40px 0; }
#formation-general .content .brochure .icon svg { width:50px; height:50px; display:flex; align-items:center; justify-content:center; padding:12px; border-radius:100%; border:1px solid #000; }
#formation-general .content .brochure .link { font-size:3.5rem; line-height:1.2em; }
#formation-general .content .brochure .relative:after { content:''; position:absolute; right:0; top:100px; bottom:30px; width:calc(100% - 450px); background:#ededed; z-index:-1; }
#formation-general .content .brochure .text { margin-top:50px; }

#formation-technos .content .heading .title { color:#37246e; margin-bottom:30px; }
#formation-technos .content .heading .title svg { fill:#37246e;  }
#formation-technos .content .heading .caption { padding-bottom:60px; }
#formation-technos .content .testimonial { background-position:35% -300px; background-size:auto; background-repeat:no-repeat; padding:170px 0 50px 0; }
#formation-technos .content .testimonial .title { font-size:4.5rem; margin-bottom:40px; }
#formation-technos .content .testimonial .image:after { padding-bottom: 88.46153846153847% }
#formation-technos .content .testimonial .author { font-style:italic; font-weight:600; text-align:right; }
#formation-technos .content .accordion.open .title { background:#37246e; }
#formation-technos .content .diplomas .description { padding:0 150px 80px 150px; }
#formation-technos .content .diplomas .description .inner { margin-bottom:60px; }
#formation-technos .content .diplomas .description .icon { position:absolute; left:0; top:-15px; width:90px; height:90px; border-radius:100%; background:#00978c; display:flex; align-items:center; justify-content:center; padding:10px; }
#formation-technos .content .diplomas .description .icon img { max-width:50px; max-height:60px; }
#formation-technos .content .diplomas .description h2 { font-size:4.5rem; margin-bottom:80px; font-weight:bold; padding-left:150px; }
#formation-technos .content .diplomas .description h3 { font-size:2.5rem; font-weight:600; margin:0 -150px 0 -150px; background:#f3f3f3; padding:30px 150px;}
#formation-technos .content .diplomas .description ul { list-style:none; margin:50px 0; }
#formation-technos .content .diplomas .description li { margin:30px 0; font-size:1.8rem; display:flex; flex-direction:row; align-items:flex-start; justify-content:flex-start; }
#formation-technos .content .diplomas .description li:before { content:''; display:inline-block; margin-right:15px; width:15px; height:20px; background:url(../themes/lycee/assets/img/puce-techno.png) no-repeat center center / contain; }
#formation-technos .content .diplomas .description p { font-size:1.5rem; }
#formation-technos .content .separator { background-position:center top; }
#formation-technos .content .video { text-align:center; }
#formation-technos .content .video h2 { font-size:3rem; margin-bottom:1em; }
#formation-technos .content .video iframe { width:800px; height:450px; }
#formation-technos .content .punchline { font-size:3.5rem; font-weight:300; text-align:center; display:flex; max-width:500px; align-items:center; justify-content:center; margin:100px auto; position:relative; }
#formation-technos .content .punchline:before { content:''; position:absolute; left:-80px; top:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-open.png) no-repeat center center / contain; }
#formation-technos .content .punchline:after { content:''; position:absolute; right:-80px; bottom:-80px; width:75px; height:50px; background:url(../themes/lycee/assets/img/quote-close.png) no-repeat center center / contain; }
#formation-technos .content .punchline p { line-height:1.4em; }
#formation-technos .content .brochure .download { color:#000; }
#formation-technos .content .brochure .more { font-size:2rem; }
#formation-technos .content .brochure .image:after { padding-bottom: 74.54228421970357% }
#formation-technos .content .brochure .icon { display:block; margin:40px 0; }
#formation-technos .content .brochure .icon svg { width:50px; height:50px; display:flex; align-items:center; justify-content:center; padding:12px; border-radius:100%; border:1px solid #000; }
#formation-technos .content .brochure .link { font-size:3.5rem; line-height:1.2em; }
#formation-technos .content .brochure .relative:after { content:''; position:absolute; right:0; top:100px; bottom:30px; width:calc(100% - 450px); background:#ededed; z-index:-1; }
#formation-technos .content .brochure .text { margin-top:50px; }

/* Contact */
#contact .form h2 { text-align:center; margin-bottom:80px; }
#contact .form .inner { background:#ededed; padding:80px 200px; }
#contact .form .chevron-green { width:300px; height:500px; background-size:contain; transform:rotate(180deg); position:absolute; right:-100px; top:300px; z-index:-1; }
#contact .form .chevron-pattern { width:300px; height:500px; background-size:contain; position:absolute; left:-100px; bottom:100px; z-index:-1; }

/* Les classes */
#les-classes h2 { font-size:4rem; margin-bottom:1em; }
#les-classes .carousel { margin-bottom:100px; }

#les-classes .pagination { display:flex; flex-direction:row; align-items:center; justify-content:center; margin-top:50px; }
#les-classes .pagination .swiper-pagination-bullet { display:flex; flex-direction:row; align-items:center; justify-content:flex-end; width:auto; height:auto; background:none; opacity:1; }
#les-classes .pagination .bullet { width:30px; height:30px; background:none; border:1px solid transparent; display:flex; align-items:center; justify-content:center; border-radius:100%; margin-right:10px; }
#les-classes .pagination .bullet .inner { width:18px; height:18px; display:inline-block; border:1px solid #a3a3a3; border-radius:100%; }
#les-classes .pagination .bullet-number { color:#000; font-weight:bold; font-size:2rem; }
#les-classes .pagination .swiper-pagination-bullet-active .bullet { border-color:#ffcf2a; }
#les-classes .pagination .swiper-pagination-bullet-active .bullet .inner { border-color:#ffcf2a; background-color:#ffcf2a; }

/* Les horaires */
#les-horaires .table thead th { padding-bottom:30px; }
#les-horaires .table thead th strong { display:inline-block; padding:15px 40px; background:#ccc;  border-radius:40px; color:#fff; min-width:250px; }
#les-horaires .table thead th:nth-child(1) strong { background-color:#37246e; }
#les-horaires .table thead th:nth-child(2) strong { background-color:#ffcf2a; }
#les-horaires .table thead th:nth-child(3) strong { background-color:#07a99d; }

#les-horaires .table tbody td { padding:10px; }
#les-horaires .table tbody tr:nth-child(even) { background:#f2f2f2; }










/**
 * Extra large
 **/
@media (min-width: 1600px) {
    .container { max-width:1560px; }
}

/**
 * Extra large
 **/
@media (max-width: 1599px) {
    .heading { min-height:650px; }
    .heading .title { font-size:6rem; }
    .heading .caption { padding-bottom:100px; }
    
    .accordion .title { padding:30px 60px 30px 100px; }
    .accordion .description { padding:60px 60px 30px 100px; }
    
    #accueil h1, #accueil h2 { font-size:3.5rem; }
    #accueil #header .logo img { padding:30px 20px; }
    #accueil .formations h2 { font-size:3.5rem; }
    #accueil .formations .box { padding:30px 50px 30px 50px; }
    
    #contact .form .inner { padding:80px 150px; }
    
    #formation-pros .content .testimonial .title { font-size:3.5rem; }
    #formation-pros .content .brochure .relative:after { top:50px; bottom:0; width:calc(100% - 300px); }
    
    

}

/**
 * Large devices
 **/
@media (max-width: 1199px) {
    body { font-size:1.4rem; }
    
    .btn { padding:20px 40px; font-size:1.6rem; }
    
    .hamburger { padding:20px 30px; margin-left:50px; }
    
    .heading { min-height:550px; }
    .heading .title { font-size:5rem; }
    .heading .title svg { width:40px; margin-right:15px; }
    .heading .caption { padding-bottom:80px; }
    .heading .picto { max-width:200px; }
    
    .accordion .title { padding:30px 60px; }
    .accordion .description { padding:60px; }
    
    .padding { padding-top:80px; padding-bottom:80px; }
    
    .content h2 { font-size:3.5rem; }
    
    .page .separator { padding-top:100px; }
    
    #header .row { height:150px; }
    #header .icons { }
    #header .icons a { width:40px; height:40px; }
    #header .icons svg { width:20px; max-height:20px; }
    
    #footer .center .socials a { width:40px; height:40px; }
    #footer .center .socials svg { width:20px; }
    
    #accueil h1, #accueil h2 { font-size:3rem; }
    #accueil .slider { margin-top:-230px; }
    #accueil .slider .caption { max-width:400px; }
    
    #contact .form .inner { padding:80px 100px; }
    #contact .form .chevron-green { top:200px; }
    
    #formation-pros .content .testimonial .title { font-size:3rem; margin-bottom:20px; }
    #formation-pros .content .brochure .icon { margin:30px 0; }
    #formation-pros .content .brochure .more br { display:none; }
    
    


}

/**
 * Medium devices
 **/
@media (max-width: 991px) {
    .btn { padding:15px 30px; }
    
    .hamburger { margin-left:30px; }
    
    .heading { min-height:450px; }
    .heading .title { font-size:4rem; }
    .heading .title svg { width:30px; }
    .heading .caption { padding-bottom:60px; }
    
    .padding { padding-top:60px; padding-bottom:60px; }
    
    .content h2 { font-size:3rem; }
    
    .page h2 { font-size:3rem; }
    .page .intro { padding:60px 0; }
    .page .intro .image { order:2; margin-top:15px; }
    .page .intro .text { order:1; }
    .page .slider h2 { margin-bottom:60px; }
    .page .slider .swiper-slide { padding:60px; }
    
    .accordion .title .icon { width:50px; height:50px; }
    .accordion .title svg { width:10px; }
    
    
    #footer .right { align-items:flex-start; }
    #footer .right .links { min-width:0; }
    
    #overlay .lvl1 > li { font-size:2rem; }
    #overlay .lvl2 > li { font-size:1.6rem; }
    #overlay .lvl3 > li { font-size:1.4rem; }
    
    #contact .form h2 { margin-bottom:60px; }
    #contact .form .inner { padding:60px 80px; }
    #contact .form .chevron-green { top:100px; }
    #contact .form .chevron-pattern { bottom:50px; }
    
    #accueil .formations h2 { font-size:3rem; }
    #accueil .formations .box { padding:30px; }
    
    #formation-pros .content .testimonial { padding:150px 0; }
    #formation-pros .content .diplomas .description .icon { width:70px; height:70px; }
    #formation-pros .content .diplomas .description .icon img { width:30px; }
    #formation-pros .content .diplomas .description li { padding-left:100px; }
    #formation-pros .content .brochure .relative:after { top:0; bottom:-40px; width:calc(100% - 200px); }
    #formation-pros .content .brochure .more { font-size:1.6rem; }
    #formation-pros .content .brochure .link { font-size:2.5rem; }
    
    #accueil h1 { margin-bottom:15px; }
    #accueil h1, #accueil h2 { font-size:2.5rem; }
    #accueil #header .logo img { padding:20px; }
    #accueil .slider { margin-bottom:160px; }
    #accueil .slider .caption { max-width:350px; font-size:1.3rem; top:auto; bottom:-120px; }
    #accueil .slider .caption p { line-height:1.8em; }
    #accueil .formations img { max-height:100px; }
    #accueil .formations h3 { font-size:1.6rem; }
    #accueil .blog .box { padding:40px; }

}

/**
 * Small devices
 **/
@media (max-width: 767px) {
    .btn { font-size:1.4rem; }
    
    .heading { min-height:350px; }
    .heading .title { font-size:3.5rem; }
    .heading .caption { padding-bottom:40px; }
    .heading .picto { display:none; }
    .heading .uppertitle:after { margin-bottom:30px; }
    
    .padding { padding-top:40px; padding-bottom:40px; }
    
    .container-fluid { padding-left:30px; padding-right:30px; }
    
    .hamburger { margin-left:15px; }
    
    .accordion .title { padding:30px; }
    .accordion .description { padding:30px; }
    
    .content h2 { font-size:2.5rem; }
    
    .page h2 { font-size:2.5rem; }
    .page .separator .image { margin-bottom:15px; }
    .page .separator .text br { display:none; }
    .page .slider h2 { margin-bottom:40px; }
    .page .slider .swiper-slide { padding:40px; }
    .page .slider .relative { padding-right:80px; }
    

    #header .row { height:110px; }
    
    #footer { text-align:center; }
    #footer .center { order:1; margin-bottom:30px; }
    #footer .center .btn { margin:30px 0;}
    #footer .left { order:2; }
    #footer .left .phones { margin:30px 0; }
    #footer .right { order:3; display:none; }
    
    #contact .form h2 { margin-bottom:40px; }
    #contact .form .inner { padding:40px 60px; }
    
    #formation-pros .content .testimonial { padding:60px 0; }
    #formation-pros .content .testimonial .title { font-size:2.5rem; }
    #formation-pros .content .testimonial .text { order:1; }
    #formation-pros .content .testimonial .image { margin-bottom:15px; order:2; }
    #formation-pros .content .diplomas { padding-top:80px; }
    #formation-pros .content .diplomas li { padding-left:90px; }
    #formation-pros .content .diplomas .description h3 { font-size:2rem; }
    #formation-pros .content .diplomas .icon { width:50px; height:50px; }
    #formation-pros .content .diplomas .icon img { max-width:30px; }
    #formation-pros .content .brochure { text-align:center; }
    #formation-pros .content .brochure .relative:after { content:none; }
    #formation-pros .content .brochure .icon { display:flex; justify-content:center; align-items:center; }
    
    #accueil #header { padding:20px 0; }
    #accueil #header .row { align-items:center; }
    #accueil #header .navigation { margin-top:0; }
    #accueil #header .logo img { padding:0; }
    
    #accueil .slider { margin-bottom:50px; margin-top:0; }
    #accueil .slider .swiper-container { position:static; float:none; width:100vw; margin-bottom:30px;}
    #accueil .slider .image img { width:100%; max-height:300px; object-fit:cover; }
    #accueil .slider .image > * { position:static; }
    #accueil .slider .image:after { content:none; }
    #accueil .slider .bg { min-height:300px; object-fit:cover; display:none; }
    #accueil .slider .caption { left:30px; max-width:calc(100% - 60px); position:static; margin:0 auto; }
    #accueil .formations .relative:before { left:40px; right:40px; }
    #accueil .erasmus { margin-top:0; padding-bottom:50px; }
    #accueil .erasmus .image { margin-bottom:15px; }
    #accueil .blog .image { margin-bottom:30px }

}

/**
 * Extra small devices
 **/
@media (max-width: 575px) {
    .heading { min-height:250px; }
    .heading .title { font-size:3rem; }
    .heading .caption { padding-bottom:20px; }
    
    .padding { padding-top:20px; padding-bottom:20px; }
    
    .btn { padding:10px 20px; } 

    .hamburger { padding:15px; }
    .hamburger .text { display:none; }
    
    .page h2 { font-size:3rem; }
    .page .slider h2 { margin-bottom:20px;}
    .page .slider .relative { padding-right:0; }
    .page .slider .pagination { display:none; }
    
    #header .wrapper .icons { display:none; }
    #header .wrapper .menu { margin-bottom:0; }
    #header .logo img { max-height:80px; }
    
    #contact .form h2 { margin-bottom:20px; }
    #contact .form .inner { padding:20px 40px; }
    
    
    #formation-pros .content .diplomas .description .icon { display:none; }
    #formation-pros .content .diplomas .description li { padding-left:0; }
    
    #accueil #header .navigation { margin-top:0; }
    #accueil #header .row { align-items:center; height:80px; }
    
    #accueil .formations .relative:before { left:10px; right:10px; }
    #accueil .slider .image img { max-height:200px; }

}