/**
 * 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:'Montserrat', sans-serif; }
:focus, button:focus { outline:none; }

/* Images */
img { max-width:100%; height:auto; }
img[data-sizes] { display:block; width:100%; }

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

/* Link */
a:hover { text-decoration:none; }

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

/* Links */
h1 { font-size:3rem; font-weight:700; }

/* Buttons */
.btn { display:inline-block; padding:10px 30px; text-transform:uppercase; text-align:center; cursor:pointer; border:1px solid transparent; background:#000; color:#fff; }
.btn.outline { border:1px solid #fff; color:#fff; background:transparent; font-weight:bold; font-size:2rem; }

/* forms */
.field { margin-bottom:15px; }
.field label { font-size:1.4rem; }

.field .comment { font-size:1rem; font-style:italic; }

.clear { width:100%; }

.section { text-transform:uppercase; font-weight:bold; }

[data-validate-for] { color:#ff0000; }

/* Fancybox */
.fancybox-content { width:850px; }
.fancybox-content .submit { margin-bottom:0; text-align:right; }
.fancybox-content .field.captcha { justify-content:flex-start; margin-bottom:0; }


/**
 * Components
 **/

/* 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; }

/* Utility */
.relative { position:relative; }
.align-center { align-items:center; }
.padding { padding-top:80px; padding-bottom:80px; }
.grey { background:#f2f2f2; }

/* Heading */
.heading { margin-top:-70px; }
.heading .text { background:#2C99CF; color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; align-self:stretch; padding:70px; }
.heading .text blockquote { margin:70px 0 0 0; }
.heading .text p { font-weight:300; font-size:2.5rem; }
.heading .text footer { font-family:'Rage Italic'; font-size:3.6rem; text-align:right; margin-top:30px; }
.heading .image img { height:100%; object-fit:cover; }
.heading .plusquepro { margin:30px 0; }

/* Offers */
.offers .col { margin-bottom:30px; }
.offers .center { text-align:center; margin-bottom:30px; }

.offers .record {  height:100%; overflow:hidden; display:flex; flex-direction:column; min-height:700px; background-repeat:no-repeat; background-size:cover; }
.offers .record .text { text-align:center; padding:30px 50px; color:#fff; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:space-between; }
.offers .record .text .discount { font-size:12rem; font-weight:900; line-height:0.75em; }
.offers .record .text .discount.small { font-size:5rem; line-height:1em;}
.offers .record .text .name { margin:30px 0; font-size:1.8rem; }
.offers .record .text .name span { text-transform:uppercase; font-weight:900; font-size:2.2rem; }
.offers .record .text .name small { font-size:1.8rem; text-tranform:none; font-weight:400; }
.offers .record .text .conditions { font-weight:300; margin-top:30px; font-size:1rem; }

.offers .gan { background:#fff; text-align:center;  display:flex; height:100%; flex-direction:column; justify-content:center; }
.offers .gan .image img { padding:30px; background:#fff; border:1px solid #000; }
.offers .gan .text { margin:50px 0; font-weight:bold; font-size:2rem; height:auto; color:#000000;}
.offers .gan .svg img { width:30px; }

.offers .background { background-size:cover; background-position:center center; background-repeat:no-repeat; padding:100px 0 30px 0; }
.offers .background .text { height:100%; display:flex; flex-direction:column; justify-content:space-between; }
.offers .background .text .conditions { margin-top:15px; }
.offers .background .btn { background:rgba(255,255,255,0.65); color:#000; }

.offers .logo .image { text-align:center; padding:15px 30px; max-height:200px; display:flex; align-items:center; justify-content:center; }
.offers .logo .image img { max-height:100%; }
.offers .logo .text { padding:30px; background-size:cover; background-repeat:no-repeat; }
.offers .logo .btn { background:rgba(255,255,255,0.7); color:#000; }

/* Code */
.code strong { font-size:3rem; font-weight:800; margin-top:30px; display:inline-block; }

/* Intro */
.intro h2 { color:#2C99CF; font-size:4rem; font-weight:900; margin:1em 0; }
.intro p { margin-bottom:3em; line-height:2.4em; }

/* Targets */
.targets { position:relative; }
.targets:before { content:''; position:absolute; left:0; top:0; width:100%; height:220px; background:#f2f2f2; }
.target { text-align:center; }
.target .image { margin-bottom:80px; position:relative; }
.target .image:after { content:''; position:absolute; left:50%; bottom:0; transform:translate(-50%, 50%); background:url(../themes/gan/assets/img/shape.svg) no-repeat center center / contain; width:80px; height:80px; }
.target h2 { font-size:2rem; font-weight:900; text-transform:uppercase; margin-bottom:30px; }
.target li { margin:10px 0; }

/* Partners */
.partners .featured { text-align:center; padding:0 100px; }
.partners h2 { font-size:3rem; font-weight:900; }
.partners .featured:before { content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); background:url(../themes/gan/assets/img/shape-right.svg) no-repeat center center / contain; width:80px; height:80px; }
.partners .featured:after { content:''; position:absolute; right:0; top:50%; transform:translateY(-50%); background:url(../themes/gan/assets/img/shape-left.svg) no-repeat center center / contain; width:80px; height:80px; }
.partners .logos { display:flex; flex-direction:row; align-items:center; justify-content:center; margin-top:50px; flex-wrap:wrap; }
.partners .logos img { margin:0 30px; }

/**
 * Layout
 **/
 
/* Header */
#header { padding-top:60px; }
#header .logo { text-align:center; position:relative; z-index:1; }
#header .logo .gan { padding:0 50px 30px 50px; background:#fff; }
#header .logo .club { position:absolute; right:-50px; }
#header .navigation { margin-bottom:50px; }
#header .navigation ul { display:flex; flex-direction:row; align-items:center; justify-content:flex-end; }
#header .navigation li { margin-left:30px; }
#header .navigation a { color:#000; text-transform:uppercase; font-weight:bold; font-size:2rem; transition:all 0.5s ease 0s; }
#header .navigation li.back a { font-weight:300; font-size:1.4rem; text-transform:none; }
#header .navigation a:hover,
#header .navigation li.active a { color:#2C99CF; }

#footer { padding:30px 0; background:#fff; }
#footer a { font-weight:300; font-size:1.8rem; text-transform:nonse; color:#000000; }

/* Login */
#accueil .login { height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; }
#accueil .header { text-align:center; }
#accueil .header .logos { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#accueil .header .logos .gan { margin-right:30px; }
#accueil .header .logos .club { margin-left:30px; }
#accueil .sign { font-family:'Rage Italic'; font-size:3.6rem; margin-top:30px; }
#accueil .form { margin-top:80px; min-width:400px; }
#accueil .form .submit { text-align:center; margin-top:80px; }

#accueil .btn.outline {color: blue; text-transform: initial; font-size: 1.2rem;}






















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

/**
 * Extra large
 **/
@media (max-width: 1350px) {
    #header { padding-top:30px; }
    #header .navigation a { font-size:1.8rem; }
    #header .navigation li { margin-left:15px; }
    
    .heading h1 { font-size:2.6rem; }
    .heading .text { padding:50px; }
    .heading .text p { font-size:2.2rem; }
    
    
    .offers .record .text { padding:15px 30px; }
    .offers .record .text .discount { font-size:10rem; }
    .offers .record .text .name span { font-size:2rem; }
}

/**
 * Large devices
 **/
@media (max-width: 1199px) {
    #header .navigation a { font-size:1.6rem; }
    
    .heading h1 { font-size:2.4rem; }
    .heading .text { padding:30px; }
    .heading .text p { font-size:2rem; }
    
    .offers .record { min-height:600px; }
    .offers .record .text .discount { font-size:8rem; }
    
    .intro p { margin-bottom:2em; line-height:2em; }
    
    .targets:before { height:180px; }
    .target h2 { margin-bottom:15px; }
    .target li { margin:5px 0; }
    .target .image:after { width:65px; height:65px; } 
    
    .partners h2 { font-size:2.4rem; }
}

/**
 * Medium devices
 **/
@media (max-width: 991px) {
    #header .logo .gan { padding:0; margin-bottom:30px; }
    #header .logo .relative { display:inline-block; padding:0 60px 0 0; }
    #header .navigation { margin-bottom:30px; }
    #header .navigation ul { justify-content:center; }
    
    .padding { padding-top:60px; padding-bottom:60px; }
    
    .heading { margin-top:0; }
    .heading .text blockquote { margin-top:0; }
    
    .offers .col:nth-child(5) { display:none; }
    
    .intro h2 { margin-top:0; font-size:3rem; }
    .intro p { margin-bottom:1em; line-height:1.8em; font-size:1.6rem; }
    
    .targets:before { height:150px; }
    .target h2 { font-size:1.8rem; }
    .target .image { margin-bottom:50px; }
    .target .image:after { width:50px; height:50px; }
    
    .partners .featured { padding:0 70px; }
    .partners .featured:before,
    .partners .featured:after { width:50px; height:50px; }
}

/**
 * Small devices
 **/
@media (max-width: 767px) {
    
    body { font-size:1.4rem; }
    
    .padding { padding-top:40px; padding-bottom:40px; }
    
    .offers .record { min-height:500px; }
    .offers .record .text .discount { font-size:6rem; }
    .offers .record .text .name { font-size:1.6rem; margin:15px 0; }
    .offers .record .text .name span { font-size:1.8rem; }
    
    .btn.outline { font-size:1.6rem; padding:8px 15px; }
    
    .offers .logo .image { height:150px; max-height:150px; min-height:150px; }
    
    #header .navigation { position:static; }
    #header .navigation li { margin:0 10px; }
    #header .navigation .back { display:none; }
    
    .intro h2 { font-size:2.4rem; margin:0 0 0.5em 0; }
    .intro p { font-size:1.4rem; line-height:1.6em; margin-bottom:0.5em; }
    
    .target h2 { font-size:1.6rem; }
    
    .partners h2 { font-size:2rem; }
    .partners .featured:before, .partners .featured:after { width:30px; height:30px; }
    .partners .featured { padding:0 35px; }
    
}

/**
 * Extra small devices
 **/
@media (max-width: 575px) {
    #header .logo .relative { display:block; padding:0; }
    #header .logo a { display:flex; flex-direction:row; align-items:center; justify-content:space-between; }
    #header .logo .club { position:static; right:auto; }
    #header .navigation ul { flex-direction:column; }
    #header .navigation li { width:100%; padding:10px 0; text-align:center; border-bottom:1px solid #ccc; }
    #header .navigation li:first-child { border-top:1px solid #ccc; }
    
    #footer { text-align:center; }
    
    .fancybox-content .field.captcha { justify-content:center; }
    .fancybox-content .submit { text-align:center; margin-top:30px; }
    .fancybox-content .submit .btn { display:block; width:100%; }
    
    .target { margin-bottom:30px; }
}