/**
 * General
 **/

/* Hamburger */
.hamburger { display:none; }
.hamburger:hover { opacity:1; }
.hamburger:focus { outline:none; }

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

[data-contextual] { position:relative; overflow:hidden; }
[data-contextual] .contextual { position:absolute; right:10px; top:10px; text-align:center; font-size:14px;  list-style:none; margin:0; padding:0; opacity:0; visibility:hidden; transform:translateY(-35px); transition:all 0.5s ease 0s; }
[data-contextual] .contextual li { float:left; }
[data-contextual] .contextual a { display:block; width:24px; height:24px; line-height:24px; color:#fff; border-radius:50%; margin-left:5px; transition:all 0.2s ease 0s; }
[data-contextual] .contextual .edit { background:#2980b9; }
[data-contextual] .contextual .edit:hover { transform:scale(1.2); }
[data-contextual] .contextual .add { background:#27ae60; }
[data-contextual] .contextual .add:hover { transform:scale(1.2); }

.editor .ct-widget.ct-ignition { bottom:40px; }
.editor [data-contextual] .contextual { opacity:1; visibility:visible; z-index:100; transform:translateY(0); }
.editor [data-contextual],
.editor [data-editable] { outline:2px dashed #f39c12; }

/* Pagination */
.pagination { margin:30px 0; text-align:center; }
.pagination .loading { position: relative; }
.pagination .loading:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; z-index:2; background:#fff; }
.pagination .loading:after { font-family:'Font Awesome 5 Regular'; content:"\f3f4"; display:inline-block; width:24px; height:24px; line-height:24px; animation:fa-spin 2s infinite linear; position:absolute; left:50%; top:50%; margin-top:-12px; margin-left:-12px; z-index:3; }

.pagination.simple ul { margin:0; padding:0; }
.pagination.simple li { display:inline-block; margin:0 2px; }
.pagination.simple i { line-height:inherit; }
.pagination.simple a { display:block; width:30px; height:30px; line-height:30px; border:1px solid #ccc; color:#777; }
.pagination.simple a.active { background:rgba(0,0,0,0.1); }

.pagination.scroll { text-align:center; }

.pagination.dropdown { display:flex; justify-content:flex-end; }



/**
 * Responsive
 * Modifier le media query en selon du besoin
 **/
@media (min-width:1px) {
  
  .hamburger { display:inline-block; }
  .menu { z-index:5; transition:all 0.5s ease 0s; overflow:hidden; background:rgba(0,0,0,0.5); display:flex; flex-direction:column; align-items:center; justify-content:center; }
  .menu ul { opacity:0; transition:all 0.4s ease 0.3s; transform:translateY(30px); list-style:none; margin:0; padding:0;  }
  .open .menu ul { opacity:1; transform:translateY(0); }
  
  /**
   * Fullscreen
   **/
  .fullscreen .menu { position:fixed; left:0; top:0; width:100%; height:100%; }

  /* Fullscreen Fade */
  .fullscreen.fade .menu { opacity:0; visibility:hidden; }
  .fullscreen.fade.open .menu { opacity:1; visibility:visible; }
  
  /* Fullscreen Top */
  .fullscreen.top .menu { transform:translateY(-100%); }
  .fullscreen.top.open .menu { transform:translateY(0); }
  
  /* Fullscreen Right */
  .fullscreen.right .menu { transform:translateX(100%); }
  .fullscreen.right.open .menu { transform:translateX(0); }
  
  /* Fullscreen Bottom */
  .fullscreen.bottom .menu { transform:translateY(100%); }
  .fullscreen.bottom.open .menu { transform:translateY(0); }
  
  /* Fullscreen Left */
  .fullscreen.left .menu { transform:translateX(-100%); }
  .fullscreen.left.open .menu { transform:translateX(0); }
  
  /**
   * Over
   **/
   
  .over .menu { position:fixed; }
  .over .hamburger { position:relative; z-index: 10; }
  
  /* Over Top */
  .over.top .menu { left:0; top:0; width:100%; height:auto; transform:translateY(-100%); }
  .over.top.open .menu { transform:translateY(0); }
  
  /* Over Right */
  .over.right .menu { right:0; top:0; width:300px; height:100%; transform:translateX(100%); }
  .over.right.open .menu { transform:translateX(0); }
  
  /* Over Bottom */
  .over.bottom .menu { left:0; bottom:0; width:100%; height:auto; transform:translateY(100%); }
  .over.bottom.open .menu { transform:translateY(0); }
  
  /* Over Left */
  .over.left .menu { left:0; top:0; width:300px; height:100%; transform:translateX(-100%); }
  .over.left.open .menu { transform:translateX(0); }
  
  /**
   * Push
   **/
   
  .push { transition:all 0.5s ease 0s; }
  .push.open { overflow:hidden; }
  .push .menu { position:fixed; }
  
  /* Push Top */
  .push.top .menu { left:0; top:0; height:300px; width:100%; transform:translateY(-100%); overflow-y:hidden; }
  .push.top.open { transform:translateY(300px); }
  
  /* Push Right */
  .push.right .menu { right:0; top:0; height:100vh; width:300px; transform:translateX(100%); overflow-x:hidden; }
  .push.right.open { transform:translateX(-300px); }
  
  /* Push Bottom */
  .push.bottom .menu { left:0;margin-top:100vh; height:300px; width:100%; overflow-y:hidden; }
  .push.bottom.open { transform:translateY(-300px); }
  
  /* Push Left */
  .push.left .menu { left:0; top:0; height:100vh; width:300px; transform:translateX(-100%); overflow-x:hidden; }
  .push.left.open { transform:translateX(300px); }
}
/**
 * All elements
 */

.field { margin-bottom: 15px; position:relative; }
.field label { display: inline-block; margin:0; }

.field.required label { position:relative; }
.field.required label:after { content:'*'; color:#d9534f; }

.field .message { font-size:10px; position:absolute; right:0; top:8px; }

/**
 * Textfields & Textarea
 */

.field.textfield input,
.field.textarea textarea { display: block; width: 100%; padding: 10px; border: 1px solid rgba(0, 0, 0, 0.15); }
.field.textfield input:focus,
.field.textarea textarea:focus { outline: none; border-color: rgba(0, 0, 0, 0.40); }

.field.textfield.success,
.field.textarea.success { color:#5cb85c; }
.field.textfield.success input { border-color:#5cb85c; }
.field.textarea.success textarea { border-color:#5cb85c; }

.field.textfield.error,
.field.textarea.error { color:#d9534f; }
.field.textfield.error input { border-color:#d9534f; }
.field.textarea.error textarea { border-color:#d9534f; }


/**
 * Checkbox & Radio
 */

.field.checkbox,
.field.radio { line-height: 20px; }
.field.checkbox input,
.field.radio input { width:20px; height:20px; float:left; margin-right:10px; }
.field.checkbox label,
.field.radio label { position:relative; margin-bottom: 0; cursor: pointer; }

.field.checkbox span:before,
.field.radio span:before { content:''; position:absolute; left:0; top:0; width:20px; height:20px; border:1px solid rgba(0, 0, 0, 0.15); background:#fff; }

.field.checkbox span:after,
.field.radio span:after { content:''; position:absolute; left:3px; top:3px; width: 14px; height:14px; background:rgba(0, 0, 0, 0.15); opacity:0; transition:all 0.5s ease 0s; }

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

.field.checkbox.error,
.field.radio.error { color:#d9534f; }
.field.checkbox.error span:before,
.field.radio.error span:before{ border-color:#d9534f; }
.field.checkbox.error span:after,
.field.radio.error span:after{ background-color:#d9534f; }

.field.checkbox.success,
.field.radio.success { color:#5cb85c; }
.field.checkbox.success span:before,
.field.radio.success span:before{ border-color:#5cb85c; }
.field.checkbox.success span:after,
.field.radio.success span:after{ background-color:#5cb85c; }

.field.checkbox .message:before,
.field.checkbox .message:after,
.field.radio .message:before,
.field.radio .message:after { content:none; }

/* checkbox */

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

/* Radio */

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

/**
 * Select
 */

.field.select .selectize-control { max-height:45px; }
.field.select .selectize-input { padding:13px; display:block; }
.field.select .selectize-input,
.field.select .selectize-input.focus { border-radius: 0; box-shadow: none; }
.field.select .selectize-input.focus,
.field.select .selectize-dropdown { border-color:rgba(0, 0, 0, 0.40); }
.field.select .selectize-dropdown .optgroup-header { color: #aaa; text-transform: uppercase; font-size: 12px }
.field.select .selectize-control.multi .selectize-input > div { padding:7px 5px; }

.field.select.error { color:#d9534f; }
.field.select.error .selectize-input { border-color:#d9534f; }
.field.select.success { color:#5cb85c; }
.field.select.success .selectize-input { border-color:#5cb85c; }

/**
 * Addresses
 */

.field.address .ap-input { height:auto; line-height:auto; border-radius:0; }
.field.address .ap-dropdown-menu { color:#000; }

/**
 * Captcha
 **/

.field.captcha { display:flex; justify-content:center; }

/**
 * Submit
 */

.field.submit { margin-top:15px; text-align:center; }

.field.submit button { padding: 10px 20px; border: 1px solid rgba(0, 0, 0, 0.15); background: none; cursor: pointer; transition:all 0.5s ease 0s; }
.field.submit button:focus,
.field.submit button:active { outline: none; border-color: rgba(0, 0, 0, 0.40); }

.field.submit.loading button { position:relative; }
.field.submit.loading button:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255, 255, 255, 0.95); }
.field.submit.loading button:after { font-family:'Font Awesome 5 Regular' !important; font-weight:400; content:"\f3f4"; animation: fa-spin 2s infinite linear; font-family:'fontawesome'; font-size:20px; width:20px; height:20px; line-height: 20px; position:absolute; left:50%; top:50%; margin:-10px 0 0 -10px; }
/**
 * General Elements
 **/

body { font-family:'Montserrat'; font-weight:300; line-height:2em; overflow-x:hidden; }

/* Titles */
h1 { text-transform:uppercase; font-weight:900; text-align:center; background:url(../themes/clubaffaires/assets/img/tache.png) no-repeat center bottom; padding-bottom:60px; margin-bottom:40px; }
h2 { font-weight:900; text-transform:uppercase; font-size:30px; }
h3 { }
h4 { }
h5 { }
h6 { }

strong, b { font-weight:700; }


/* Links */
a { }
a:visited { }
a:hover { text-decoration:none; }
a:focus { text-decoration:none; }

/* Images */
img { max-width:100%; height:auto; }

/* Sliders */
.slider .caption { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
.slider .caption .title { font-size:50px; font-weight:900; text-transform:uppercase; }

/* Carousel */

/* Buttons */
.btn { padding:10px 30px; border:1px solid #049bba; color:#049bba; background:transparent; display:inline-block; font-weight:bold; border-radius:30px; transition:all 0.5s ease 0s; }
.btn:hover { background:#049bba; color:#fff; }

/* hide */
.hide { display:none !important; }
.more { text-align:center; }

/* Forms */
.field .message { bottom:-30px; top:auto; }

.field.textfield { position:relative; margin-bottom:30px; }
.field.textfield label { position:absolute; left:10px; top:50%; transform:translateY(-50%); font-weight:500; transition:all 0.3s ease 0s; }
.field.textfield input { border:none; border-bottom:2px solid #029fbf; font-weight:700;  }
.field.textfield.active label { top:0; font-size:14px; }
.field.textfield.active input { border-color:#029fbf; }
.field.textfield.success input { border-color:#5cb85c; }
.field.textfield.error input { border-color:#d9534f; }

.field.textarea { position:relative; margin-top:30px; }
.field.textarea label { position:absolute; left:10px; top:12px; font-weight:500; transition:all 0.3s ease 0s; }
.field.textarea.active label { top:-30px; }

.field.submit { text-align:right; }
.field.submit .btn { border-color:#049bba; }
.field.submit .btn:hover { background:#049bba; }
.field.submit .btn:focus { border-color:#049bba; }

/**
 * Layout
 **/
 
/* Header */
#header { background:url(../themes/clubaffaires/assets/img/header-bg.jpg) no-repeat center center; min-height:330px; }
#header .row { align-items: center; }
#header .logo { display:inline-block; margin:0; position:absolute; left:10px; top:10px; max-width:300px; z-index:2; }

.hamburger { position:absolute; right:30px; top:30px; padding:0; display:flex; align-items:center; z-index:10; }
.hamburger .text { text-transform:uppercase; font-weight:900; line-height:1em; display:inline-block; margin-right:15px; color:#56555a; }
.hamburger .hamburger-box { padding:10px; border:1px solid #56555a; width:50px; height:40px; }
.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before { width:30px; background:#505153; }

#header .navigation { }
#header .navigation .menu { background:rgba(4,155,186,0.9); }
#header .navigation ul { display:flex; flex-direction:column; list-style:none; padding:0; margin:0; justify-content:flex-end; text-align:center; }
#header .navigation li { margin:10px 0; }
#header .navigation a { color:#fff; text-transform:uppercase; font-family:'Montserrat'; font-weight:900; margin:10px 0; font-size:24px; }
#header .navigation li.active a { opacity:0.5; }

#header .navigation .menu-accueil a { color:#363739; }
#header .navigation .menu-accueil a:after { content:"\f107"; display:block; font-size:40px; font-family:'Font Awesome 5 Solid'; margin:15px 0; }

/* Content */

/* Footer */
#footer ul { list-style:none; margin:0; padding:0; }

#footer .footer-top { text-align:center; padding:30px 0; }
#footer .footer-top img { margin-bottom:15px; }
#footer .footer-top b { font-weight:900; }
#footer .footer-top li { margin:10px 0; }
#footer .footer-top .facebook { font-size:34px; }
#footer .footer-top .facebook a { color:#049bba; }

#footer .footer-bottom { background:#75797d; color:#fff; text-align:center; padding:15px 0; }
#footer .footer-bottom li { display:inline-block; }
#footer .footer-bottom li:after { content:'|'; margin:0 0 0 5px; }
#footer .footer-bottom li:last-child:after { content:none; }
#footer .footer-bottom a { color:#fff; }
#footer .footer-bottom a:hover { text-decoration:underline; }

/**
 * Pages
 */
 
/* General */
.hero { background:#f6f6f6; min-height:840px; min-height:100vh; pointer-events:auto !important; width:100%; overflow:hidden; }
.hero .layer { width:100%; height:100%; left:0; top:0; position:absolute; }
.hero .badminton { z-index:1;  }
.hero .peinture { z-index:2; }
.hero .cycliste { z-index:3; mix-blend-mode:overlay; background-blend-mode:overlay; }
.hero .title { text-align:center; z-index:4; mix-blend-mode:overlay; }
.hero .subtitle { text-align:center; z-index:4; }
.hero .badminton .inner { position:absolute; left:20%; top:50px; }
.hero .cycliste .inner  { position:absolute; left:65%; top:60%; transform:translate(-50%, -50%) !important;  }
.hero .peinture .inner { position:absolute; left:75%; top:50%; transform:translate(-50%, -50%); }
.hero img { max-width:none; }
.hero .title { font-weight:900; font-size:100px; text-transform:uppercase; color:#fff; line-height:1em; mix-blend-mode:overlay; }
.hero .title .inner { position:relative; top:350px; text-shadow:1px 1px 1px rgba(0,0,0,6); }
.hero .subtitle { font-family:Cheddar Jack; font-size:60px; color:#000; }
.hero .subtitle .inner { position:relative; top:250px; }
.hero .scrolldown { position:absolute; left:50%; bottom:50px; margin-left:-19px; font-size:60px; z-index:2000; cursor:pointer; color:#000; animation: bounce 3s infinite; }

.ff-fix .title { transform:none !important; transform-style:flat !important; }
.ff-fix .cycliste { transform:none !important; transform-style:flat !important; }
.ie-fix .title { opacity:0.8; }
.ie-fix .peinture { opacity:0.8; }
.ie-fix .cycliste { z-index:1; opacity:0.7; }
.sg-fix { display:none !important; }


.paper { background:url(../themes/clubaffaires/assets/img/paper.png) repeat left top; padding:60px 0; }
.paper .traits { color:#049bba; }
.paper .traits:before, .paper .traits:after { background:#049bba; }

.traits { display:flex; flex-direction:row; align-items:center; }
.traits:before, .traits:after { content:''; width:40px; height:2px; background:#000; }
.traits:before { margin-right:20px; }
.traits:after { margin-left:20px; }

.intro { padding-top:60px; padding-bottom:60px; }
.intro h1, .intro h2 { text-transform:uppercase; font-weight:900; text-align:center; background:url(../themes/clubaffaires/assets/img/tache.png) no-repeat center bottom; padding-bottom:60px; margin-bottom:40px; }
.intro h1 b, .intro h2 b { font-weight:900; }
.intro > .container { padding:60px 0; text-align:center; }
.intro a { text-decoration:underline; color:#000; }

.separator { position:relative; }
.separator:before { content:''; display:block; width:90px; height:14px; background:#00a7bf; position:absolute; left:50%; top:-7px; transform:translateX(-50%); }

.swiper-pagination-bullet-active { background:#049bba; }

.grey { background:#363739; padding:60px 0; }

.content { padding:60px 0; }


/* Accueil */
#accueil #header { background:none; min-height:0; }

#accueil .temoignages { font-weight:700; }
#accueil .temoignages blockquote { padding:40px 0; }
#accueil .temoignages blockquote:before,
#accueil .temoignages blockquote:after { position:absolute; font-family:'Font Awesome 5 Solid'; font-size:130px; line-height:1em; opacity:0.1; }
#accueil .temoignages blockquote:before { content:"\f10d"; left:0; top:0; }
#accueil .temoignages blockquote:after { content:"\f10e"; right:0; bottom:80px; }
#accueil .temoignages blockquote footer { text-align:right; }
#accueil .temoignages blockquote .function { color:#049bba; }

#accueil .news .right h2 { margin-bottom:40px; justify-content:center; }

#accueil .clubs { background:#363739; padding:80px 0; color:#fff; }
#accueil .clubs .title { position:absolute; left:30px; top:30px; }
#accueil .clubs h2 { text-align:center; margin-bottom:60px; }
#accueil .clubs h3 { color:#fff; font-weight:900; font-size:32px; text-transform:uppercase; min-height:64px;}
#accueil .clubs img { width:100%; }
#accueil .clubs p { position:absolute; right:30px; bottom:30px; color:#fff; font-weight:bold; text-transform:uppercase; font-weight:900; margin:0; font-size:18px; text-align:right; }
#accueil .clubs .btn { opacity:0; transition:all 0.5s ease 0s; margin-top:15px; }
#accueil .clubs .club:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); opacity:0; transition:all 0.3s ease 0s; }
#accueil .clubs .club:hover:before { opacity:1; }
#accueil .clubs .club:hover .btn { opacity:1; margin-top:0; }

#accueil .adherents { padding:60px 0; }
#accueil .adherents .record { margin:60px auto; max-width:980px; }
#accueil .adherents .btn { color:#000; border-color:#56555a; margin-top:40px; }
#accueil .adherents .btn:hover { color:#fff; background:#000; border-color:#56555a; margin-top:40px; }

/* Bureau */
#bureau .content { padding:0; }
#bureau .white { padding:30px 0; background:#fff; }
#bureau .grey { padding:30px 0; background:#363739; color:#fff; }
#bureau .row { list-style:none; justify-content:center; }
#bureau .membre { max-width:500px; margin:30px 0; }
#bureau .membre header h2 { font-size:18px; font-weight:800; }
#bureau .membre header p { margin:0;  font-weight:700;}
#bureau .membre .entreprise { text-transform:uppercase; }
#bureau .membre .adresse { margin-top:20px; }

#bureau .light { position:relative; padding-top:0; text-align:center; }
#bureau .light h2 { background:#049dc6; color:#fff; padding:30px 50px; font-size:18px; display:inline-block; font-weight:700; margin-bottom:60px; }
#bureau .light .row { justify-content:flex-start; text-align:left; }
#bureau .light .nom { font-weight:700; }
#bureau .light .image { float:left; margin-right:15px; border-radius:50%; overflow:hidden; }

/* Rencontres */
#rencontres .content { padding:0; }

/* Adhérents */
#adherents .tag { margin-bottom:30px; }
#adherents .tag h2 { font-size:16px; font-weight:600; color:#fff; background:#bababa; padding:5px 10px;}
#adherents .tag.artisans h2 { background-color:#029fbf; }
#adherents .tag.commerce h2 { background-color:#bababa; }
#adherents .tag.hotellerie h2 { background-color:#363739; }
#adherents .tag.service h2 { background-color:#363739; }
#adherents .tag.informatique h2 { background-color:#029fbf; }
#adherents .tag ul { list-style:none; margin:0; padding:0 15px; }
#adherents .tag a { color:#000; transition:all 0.3s ease 0s; }
#adherents .tag a:hover { color:#029fbf; }

#adherent .logo { margin-bottom:15px; text-align:center; }
#adherent .content { font-weight:normal; }
#adherent .dirigeant { text-align:right;  font-weight:normal;  }
#adherent .dirigeant img { margin-bottom:30px; }
#adherent .dirigeant .nom { font-weight:800; text-transform:uppercase; font-size:18px; }
#adherent .dirigeant .nom:after { content:''; height:6px; display:block; border-right:40px solid #00a7bf; margin:15px 0;  }
#adherent h1,
#adherent h2 { font-size:18px; font-weight:800; text-transform:uppercase; text-align:left; padding:0; margin:0 0 10px 0; background:none; }
#adherent .socials ul { list-style:none; margin:15px 0; padding:0; }
#adherent .socials ul li { display:inline-block; margin-right:15px; }
#adherent .socials ul a { font-size:30px; }
#adherent .socials .facebook a { color:#0c649b; }
#adherent .socials .linkedin a { color:#288ab8; }
#adherent .promos { margin-top:40px; }

/* VCMM */
#vcmm h2 { display:flex; flex-direction:row; align-items:center; color:#029fbf; margin:40px 0; font-size:22px; }
#vcmm h2:before, #vcmm h2:after { content:''; width:40px; height:2px; background:#288ab8; }
#vcmm h2:before { margin-right:20px; }
#vcmm h2:after { margin-left:20px; }
#vcmm .grey { display:flex; flex-direction:row; justify-content:center; margin:60px 0; }

#badminton h2 { display:flex; flex-direction:row; align-items:center; color:#029fbf; margin:80px 0 40px 0; font-size:22px; }
#badminton h2:before, #badminton h2:after { content:''; width:40px; height:2px; background:#288ab8; }
#badminton h2:before { margin-right:20px; }
#badminton h2:after { margin-left:20px; }
#badminton .grey { display:flex; flex-direction:row; justify-content:center; margin:60px 0;}

/* Contact */
#contact .content { padding:0 0 60px 0; }
#contact .intro { text-align:center; }
#contact .right { text-align:right; }
#contact .adresse { background:url(../themes/clubaffaires/assets/img/paper.png) repeat left top; padding:40px; text-align:right;  text-transform:uppercase; display:inline-block; }
#contact .adresse b { font-weight:800; }

/* Aniamtions */
@keyframes bounce { 
  0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
  40% { transform: translateY(-15px); }
  60% { transform: translateY(-7px); }
}


/**
 * Large devices (desktops, less than 1200px)
 **/
@media (max-width: 1199px) {
  .hero .badminton .inner { left:5%; top:50px; }
  .hero .cycliste .inner { left:70%; top:55%; }

}

/**
 * Medium devices (tablets, less than 992px)
 **/
@media (max-width: 991px) {
  #header { background-position-y:130px; background-size:130%; }
  
  #bureau .membre { text-align:center;}
  
  .hero .badminton .inner { left:5%; top:150px; }
  .hero .badminton img { max-height:500px; }
  .hero .cycliste .inner { left:70%; top:55%; }
  .hero .cycliste img { max-height:400px; }
  
  #accueil .clubs .btn { opacity:1; padding:5px 10px; font-size:14px; }

}

/**
 * Small devices (landscape phones, less than 768px)
 **/
@media (max-width: 767px) {
  #header { background-position-y:130px; background-size:170%; }

  #accueil .news .traits { justify-content:center; }
  #accueil .adherents .record { text-align:center; }
  #accueil .adherents .record img { max-width:200px; margin:15px auto; }
  
  #contact .left { order:2; }
  #contact .right { order:1; }
  #contact .adresse { width:100%; text-align:center; margin-bottom:50px; }
  
  .hero .badminton .inner { left:0; }
  .hero .cycliste .inner { left:75%;  }
  
  
  .hero .peinture .inner { left:50%; }
  .hero .peinture img { min-width:800px; }  
  
  #accueil .clubs h3 { font-size:22px; min-height:0; }
  #accueil .clubs p { font-size:14px; }
}

/**
 * Extra small devices (portrait phones, less than 544px)
 **/
@media (max-width: 575px) {
  #header { background-position-y:130px; background-size:200%; }
  
  #header { min-height:300px; }
  #header .logo { max-width:200px; }
  #header .hamburger .text { display:none; }
  
  .hero .subtitle { position:absolute !important; }
  .hero .subtitle .inner { font-size:40px; top:50%; width:100%; position:absolute; transform:translateY(-100px);  }
  .hero .title .inner { font-size:50px; top:50%; width:100%; position:absolute; transform:translateY(-60%); }
  .hero .badminton { display:none !important; }
  
  
  
}