/*
 * Theme Name: Roulettes & Sac à dos 2017
 *
 * Responsive CSS:
 *		1. Width < 1024px
 *    2. Width < 825px
 *	  3. Width < 768px
 *    4. Width < 700px
 *		5. Width < 600px
 *		6. Width < 450px
 *		7. Width < 320px
 *    8. Retina
 */


@media screen and (min-height: 915px) {
 .img-bg { max-height: 60vh; }
}

@media screen and (min-height: 860px) and (max-height: 914px) {
  .img-bg { max-height: 65vh; }
}

@media screen and (min-height: 680px) and (max-height: 859px) {
  .img-bg { max-height: 75vh; }
}

@media screen and (min-height: 680px) and (max-height: 859px) and (max-width: 768px){
  .img-bg { max-height: 50vh; }
}

@media screen and (min-height: 580px) and (max-height: 679px) {
  .img-bg { max-height: 75vh; top: 350px; }
}

@media screen and (min-height: 630px) and (max-height: 680px) {
  .rs-pane-left { max-width: 375px; min-width: 350px; }
}

@media screen and (max-height: 629px)  {
  .rs-pane-left { max-width: 325px; min-width: 250px; }*/
}

/* 0. Width < 1120px */
@media screen and (max-width: 1120px) and (max-height: 579px) {
}

/* 1. Width < 1024px */
@media screen and (max-width: 1024px) {
  .rs-home-menu-pane { position: relative; }
  .rs-menu-social { position: absolute; bottom: -4em; padding-left: 100px; width: 100%; z-index: 10; }
  .rs-menu-social li { display: inline-block; }
  #first-post .rs-col-50:first-child, .category-header .rs-col-50:first-child { width: 50%; }
  .rs2017-outer-container { margin-left: 90px; }
  .social-links ul { margin-bottom: 50px; }
  .social-links { flex: 0 1 100%; }
  .fb-links, .newsletters-register { flex: 1 0 50%; }
  .rs-content .cat-nav span, .rs-content .cat-nav a { font-size: 2.4rem; }
  .rs-content-list article h2 a { font-size: 2.6rem; }
  .rs-content .rs-content-sidebar { display: none; }
  .post-details { display: none; }
  .rs2017-outer-container { width: 100%; margin: 0 auto; }
}

/* 2. Width < 825px */
@media screen and (max-width: 825px) {
  .rs-pane-right h1, .rs-menu-social { padding-left: 60px; }
  .rs-menu-before { width: 29px; }
  #first-post .rs-col-50:first-child { padding: 40px 0; }
  #first-post .rs-col-50:first-child img { bottom:0; }
  .category-header .rs-col-50:first-child { width:0; }
  .rs-content { margin-top: -40px; }
  #first-post .rs-col-50:nth-child(2){ padding: 40px 10px 60px 30px; }
  .widget-area .rs-newsletter-register .widget-title { font-size: 1.5rem; }
  .widget-area .rs-newsletter-register form { bottom: 15px;  }
  .widget-area .rs-newsletter-register form input[type="submit"] { padding: 3px; margin-left: 5px; }
  .widget-area .rs-instagram > p.clear > a { font-size: 1.7rem; width: 75%; }
  #rs2017-mainmenu { font-size: 1.7em; padding-left: 20px; }
  .page-handicap article a { width: 250px; }
  .rs-home-apropos, .rs-home-newsletter { margin-left: 62px; }
}

/* 3. Width < 768px */
@media screen and (max-width: 768px) {
  #rs-home-img { margin-left: -90px; max-height: 705px;  max-width: none; }
  .rs-pane-left { max-width: 320px; min-width: inherit; }
  .main-navigation { height: 64px; }
  .rs-top-social { margin: 0 auto; width: 130px; height: 32px; }
  .rs-top-social li { margin-top: 8px; }
  .rs-topnav-oiseau-r { top: 39px; }
  .rs-topnav-feuillage-r, .rs-topnav-feuillage-l { top: 55px; }
  .single main .rs-centered-container { width: 100%; }
  .single main .rs2017-outer-container { width: 100%; max-width: none; }
  .rs2017-outer-container { margin: 0 auto; }
  #rs2017-author-bloc .rs2017-inner-container > img { margin-left: 0; }
  #comments > h2 > i { display: none; }
  #comments > h2 { margin-left: 0; }
  .rs-la-content article {  width: 49%; }
  #rs2017-author-bloc .rs2017-inner-container > a { margin-left: 0; }
}

/* 4. Width < 700px */
@media screen and (max-width: 700px) {
  #rs-home-img { margin-left: -135px; max-height: 705px;  max-width: none; }
  .rs-pane-left { max-width: 270px; }
  .rs-feuillage-l, .rs-feuillage-r { display: none; }
  .rs-content-list article h2 a { font-size: 1.7rem; }
  .page-handicap article a { width: 175px; }
  #desktop-logo { display: block; }
  #mobile-logo { display: none; }
}

/* 5. Width < 600px */
@media screen and (max-width: 600px) {
  /*#rs-home-img { margin-left: -210px; max-height: 705px;  max-width: none; }
  .rs-pane-left { max-width: 190px; }*/
  .category .entry-content { display: none; }
  .category .entry-header { margin-top: 25px; }
  #first-post .rs-col-50:first-child img { padding-right: 0;  width: 80%; }
  .rs-content .rs-content-main article .entry-header { position: relative; }
  .rs-content .rs-content-main article .entry-header:before { content:" "; display:block; position: absolute; left: 0px; top: 4px; width:15px; height:73px; background-image: url("../images/titre-article.jpg"); background-repeat:no-repeat; }
  .rs-content .rs-content-main article .entry-title a { text-transform: uppercase; font-family: 'Dosis', sans-serif; color: #5a4741; text-decoration: none; font-weight: 600; font-size: 2rem; }
  .rs-content .rs-content-main article { width: 100%; display: flex; background-color: transparent; }
  .rs-content .rs-content-main article a:first-child { width: 50%; }
  .rs-content .rs-content-main article a:first-child img { padding:0; width: 90%; }
  .rs-content .rs-content-main article .entry-header { flex: 1; padding:0px 10px 0px 30px; text-align: left; }
  .rs-content .rs-content-main article .entry-header h2 { margin: 10px 0; }
  .rs-content .rs-content-main article .date-post { color: #5a4741; }
  .rs-content .rs-content-main article:hover img { border: 0; }
  .hentry { margin: 0 0 1.1em;}
  .rs-content .rs-content-main article:hover img, .rs-content-list article:hover img, .page-handicap article:hover img, #rs2017-posts-related ul li:hover img { border: 6px solid white; }
  #rs2017-posts-related ul { width: 70%; margin: 0 auto; }
  #rs2017-posts-related ul li { width: 48%; }
  #desktop-logo { display: none; }
  #mobile-logo { display: block; width: 160px; }
}

/* 5. Width < 550px */
@media screen and (max-width: 550px) {
  .fb-links, .newsletters-register { flex: 1 0 100%; }
  .fb-links { margin-bottom: 50px; }
  .newsletters-register { text-align: center; }
  .newsletters-register > h2.widget-title { max-width: none; }
  .newsletters-register form { left: 0; right: 0; margin: 0 auto; }
  .rs-content-list article h2 { top: 15%; }
  .alignleft, .alignright { float: none; }
  .img-bg { max-width: 110%; min-width: inherit; }
}

/* 6. Width < 480px */
@media screen and (max-width: 480px) {
  .single main header h1 { font-size: 3rem; line-height: 3.5rem; padding: 0 30px; }
}

/* 6. Width < 500px */
@media screen and (max-width: 500px) {
  .rs-pane-right h1, .rs-menu-social { padding-left: 0; text-align: center; }
  .rs-home-img-container { position: inherit; }
  #rs2017-mainmenu { display:none; }
  #menu-mobile { display: block; }
  .rs-top-social { margin: 0; }
  #rs-themes-content, #rs-countries-content { display: block; }
  #rs-themes-content { display: none; }
  .rs-content-list article { width: 100%; height: 95px; background-color: #529b87; }
  .rs-content-list article img { max-width: 95px; }
  .page-themespays .rs-content .rs-centered-container { display: block; }
  .rs-content-list article h2 { margin-left: 115px; font-size: 1.8rem; text-align: left; }
  #rs-countries-content h2, #rs-themes-content h2 { top: 0;  height: 100%; display: flex; align-items: center; }
  #rs-countries-content h2 a, #rs-themes-content h2 a { font-size: 2.5rem; }
  .rs-content-list article h2:before { content:" "; display:block; position: absolute; left: -20px; top: 0; width:15px; height: 95px; background-image: url("../images/titre-article.jpg"); background-repeat: repeat; }
  .cat-nav a, .cat-nav span { font-size: 1.6rem; }
  .page-handicap .entry-content { display: none; }
  .page-handicap article { display: block; width: 100%; height: 95px; background-color: #529b87; position: relative; margin-bottom: 25px; }
  .page-handicap article img { max-width: 95px; }
  .page-handicap .rs-cathandi-content { position: absolute; top: 0; width: 100%; margin-left: 90px;  }
  .page-handicap .entry-header:before { content:" "; display:block; position: absolute; left: 5px; top: 0px; width:15px; height:95px; background-image: url("../images/titre-article.jpg"); background-repeat: repeat; }
  .page-handicap h2.entry-title { line-height: 95px; margin: 0; margin-left: 45px; font-family: 'Dosis', sans-serif; color: white; font-weight: 600; font-size: 2rem; }
  .page-handicap .entry-title a { color: white; font-size: 2.5rem; }
  .rs-menu-before { width: 0; }
  .page-handicap .rs-content .rs-centered-container { padding-top: 25px; }
  footer > a { font-size: 3rem; }
  #rs-home-img { max-height: 480px; margin-left: -90px; }
  .rs-pane-left .flex-fill:first-child { flex: none; height: 75px; }
  .rs-pane-right .flex-fill:first-child { flex: none; height: 210px; }
  .img-bg { top: 320px; margin-left: -15px; }
  .rs-home-menu { margin-left: -19px; }
  #rs-title h1 { left: 10px; }
  .rs-menu-social { margin-left: 10px; text-align: left; }
  .rs-home-apropos, .rs-home-newsletter { margin-left: 10px; }
  .rs-la-content article { width: 100%; }
}

@media screen and (max-width: 375px) {
  .img-bg { top: 300px; }
  #rs-home-img { margin-left: -130px; }
  .rs-pane-left { max-width: 165px; }
}

/* 7. Width < 320px */
@media screen and (max-width: 320px) {
  #first-post .rs-centered-container, .rs-content .rs-content-main article { display: block;  }
  .rs-content .rs-content-main article a:first-child, #first-post .rs-col-50:first-child, #first-post .rs-col-50:first-child img, .rs-content .rs-content-main article a:first-child img { width: 100%; }
  #first-post .rs-col-50:first-child { padding-bottom: 0; }
  #first-post .rs-col-50:nth-child(2) { padding-top: 0; }
  .category .entry-header { margin-top: 10px; }
  .rs-content .rs-content-main article .entry-header,#first-post .rs-col-50:nth-child(2) { flex: none; padding-bottom: 30px; margin-bottom: 0;  }
  .rs-content { margin-top: 0; }
  #rs2017-footermenu li { margin-right: 10px; font-size: 1.7rem; }
  footer > img { max-width: 80%; }
  footer { height: 180px; }
  .menu-footer-menu-container { margin-bottom: 40px; }
  #comments > h2, .rs2017-comments-link a { font-size: 2.2rem; }
  #rs2017-author-bloc .rs2017-inner-container { display: block; }
  #rs2017-author-bloc .rs2017-inner-container > img { width: 64px; height: 64px; }
  #rs2017-author-bloc .rs2017-inner-container > div { flex: none; }
  #rs2017-author-bloc .rs2017-inner-container > div > a { position: absolute; top: 10px; left: 110px; }
  #rs2017-posts-related h3 { font-size: 2rem; }
  #rs2017-posts-related ul li { width: 100%; margin-bottom: 20px; }
  .comment-form-email, .comment-form-url, .comment-form-author { float: none; width: 100%; padding: 0; }
  .comment-list ol.children { padding-left: 0; }
  .fb-links { margin-bottom: 30px; }
  .social-links ul { margin-bottom: 25px; }
  .rs-home-apropos, .rs-home-newsletter { margin-left: 28px; }
  .img-bg { top: 250px; overflow: hidden; margin-left: -4px; }
  .rs-home-menu { margin-left: 0; }
  #rs-home-img { max-height: 360px; margin-left: -82px; }
  .rs-pane-right h1 img { max-width: 160px; margin-left: 30px; }
  .rs-home-menu a > img { margin-left: 0; }
  .rs-menu-social { margin-left: 40px;}
  .rs-home-apropos, .rs-home-newsletter { margin-left: 40px; }
  .rs-pane-right .flex-fill:first-child { height: 155px; }
  #mobile-logo { width: 135px; }
}

/* 8. Retina */
@media all and (-webkit-min-device-pixel-ratio: 1.5),
       all and (-o-min-device-pixel-ratio: 3 / 2),
       all and (min--moz-device-pixel-ratio: 1.5),
       all and (min-device-pixel-ratio: 1.5) {
  .site-banner .banner { background-image: url('../images/feuillage-top@2x.jpg'); }
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .site-banner .banner { background-image: url('../images/feuillage-top@2x.jpg'); }
}
