/*
Theme Name: Naked Wordpress
Theme URI: http://bckmn.com/naked-wordpress
Author: J Beckman
Author URI: http://bckmn.com
Description: A super bare theme for designers who don't know Wordpress PHP but want to build with Wordpress.
Version: 1.0
License: GNU General Public License

-------------------------------------------------------------- */
/* RESPONSIVE
-------------------------------------------------------------- */





/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
  .inner{width: 300px;}
  header {height: 116px; padding: 0 !important;}
  header #brand{margin: 10px calc(50% - 102px);}
  header #brand h1 a img {height: 60px;}
  .center {width: 100% !important; float: left; margin: 0 !important; padding: 10px !important; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; background: #000;}
  header nav a.subNavBtn{border-bottom: none; padding: 0; margin: 0 0 0 13px;}
  .main-fluid{margin: 116px auto 0 !important;}
  #slider{display: none;}
  .section.s1{background-position: 280px center;}
  .section.s1 h3, .section.s1 h4, .section.s1 p{width: 100%;}
  ul#icones{padding: 0;}
  ul#icones li{width: 80px; margin: 0 10px;}
  ul#icones li a > h4{font-size: 20px; line-height: 20px;}
  ul#icones li a > span.bgicone{width: 80px; height: 80px; margin: 0;}
  @keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -800px;} 100%{background-position: 0 0;}}
  @-webkit-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -800px;} 100%{background-position: 0 0;}}
  @-moz-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -800px;} 100%{background-position: 0 0;}}
  @-ms-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -800px;} 100%{background-position: 0 0;}}
  @-o-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -800px;} 100%{background-position: 0 0;}}
  ul#icones li img{width: 80px; left: 0;}
  ul#filtres li{margin: 0 5px 5px 0;}
  ul#titres li{width: 192px; height: 348px; margin:0 calc(50% - 96px) 20px;}
  .cd-popup-container {width: 96%; margin: 60px auto; height: 465px;}
  #couverture{display: none;}
  #lefttitre{width: 250px; margin: 0 0 0 0;}
  #lefttitre h1{font-size: 24px; line-height: 30px;}
  #lefttitre .the-content h2{font-size: 16px; line-height: 20px;}
  #lefttitre .the-content p{font-size: 12px; line-height: 18px; margin: 0 auto 6px;}
  .section.s_single{padding: 70px 20px 20px;}
  span.loading{top: calc(50% - 40px); left: calc(50% - 135px); width: 270px; height: 80px;}
  ul#team li{width: calc(50% - 20px); margin: 0 0 40px 40px; height: 160px;}
  ul#team li:nth-child(1), ul#team li:nth-child(3){margin: 0 auto 40px;}
  ul#team li img{width: 80px; margin: 0 calc(50% - 40px) 10px;}
  ul#team li h4{margin: 0 auto 10px; font-size: 16px; line-height: 20px;}
  ul#team li p{font-size: 11px; line-height: 16px;}
  #coordonnees{width: 100%; margin:0 0 30px 0;}
  #formulaire{width: 100%;}
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
  .inner{width: 460px;}
  ul#titres li{margin:0 19px 20px;}
  ul#icones li{margin: 0 36px;}
  header nav a.subNavBtn{margin: 0 0 0 46px;}
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
  .inner{width: 760px;}
  header {height: 110px; padding: 15px 40px !important;}
  header #brand{margin: 0;}
  header #brand h1 a img {height: auto;}
  .center {width: auto !important; float: right; margin: 32px auto 0 !important; padding: 0 !important; background:none;}
  header nav a.subNavBtn{border-bottom: 2px rgb(40,40,50) solid; padding: 0 0 10px 0; margin: 0 0 0 40px;}
  .main-fluid{margin: 110px auto 0 !important;}
  #slider{display: block;}
  .section.s1{background-position: 310px center;}
  .section.s1 h3, .section.s1 h4, .section.s1 p{width: 56%;}
  ul#icones{padding: 0 50px;}
  ul#icones li{width: 160px; margin: 0 30px;}
  ul#icones li a > h4{font-size: 30px; line-height: 30px;}
  ul#icones li a > span.bgicone{width: 130px; height: 130px; margin: 0 calc(50% - 65px);}
  @keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -1300px;} 100%{background-position: 0 0;}}
  @-webkit-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -1300px;} 100%{background-position: 0 0;}}
  @-moz-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -1300px;} 100%{background-position: 0 0;}}
  @-ms-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -1300px;} 100%{background-position: 0 0;}}
  @-o-keyframes bgicone {0%{background-position: 0 0;} 50%{background-position: 0 -1300px;} 100%{background-position: 0 0;}}
  ul#icones li img{width: 130px; left: calc(50% - 65px);}
  ul#filtres li{margin: 0 10px 10px 0;}
  ul#titres li{width: 192px; height: 348px; margin: 0 92px 60px 0;}
  ul#titres li:nth-child(3n+3){margin: 0 auto 60px;}
  .cd-popup-container {width: 96%; margin: 60px auto; height: 465px;}
  #couverture{width: 200px; display: block;}
  #lefttitre{width: 380px; margin: 0 0 0 40px;}
  #lefttitre h1{font-size: 24px; line-height: 30px;}
  #lefttitre .the-content h2{font-size: 16px; line-height: 20px;}
  #lefttitre .the-content p{font-size: 12px; line-height: 18px; margin: 0 auto 6px;}
  .section.s_single{padding: 50px;}
  span.loading{top: calc(50% - 40px); left: calc(50% - 135px); width: 270px; height: 80px;}
  .section h3{font-size: 26px; line-height: 30px;}
  .section.s1 h4{font-size: 16px; line-height: 20px;}
  ul#team li{width: calc(50% - 20px); margin: 0 0 40px 40px; height: auto;}
  ul#team li:nth-child(1), ul#team li:nth-child(3){margin: 0 auto 40px;}
  ul#team li img{width: 120px; margin: 0 calc(50% - 60px) 20px;}
  ul#team li h4{margin: 0 auto 16px; font-size: 20px; line-height: 24px;}
  ul#team li p{font-size: 14px; line-height: 22px;}
  #coordonnees{width: 240px; margin:0 30px 0 0;}
  #formulaire{width: 490px;}
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
  .inner{width: 980px;}
  ul#icones li{width: 200px; margin: 0 46px;}
  ul#titres li{width: 192px; height: 348px; margin: 0 70px 60px 0;}
  ul#titres li:nth-child(3n+3){margin:0 70px 60px 0;}
  ul#titres li:nth-child(4n+4){margin: 0 auto 60px;}
  .cd-popup-container {width: 96%; margin: 60px auto; height: 465px;}
  #couverture{width: 280px;}
  #lefttitre{width: 520px; margin: 0 0 0 40px;}
  #lefttitre h1{font-size: 30px; line-height: 40px;}
  #lefttitre .the-content h2{font-size: 18px; line-height: 24px;}
  #lefttitre .the-content p{font-size: 14px; line-height: 22px; margin: 0 auto 6px;}
  #coordonnees{margin:0 50px 0 30px;}
  .section h3{font-size: 30px; line-height: 40px;}
  .section.s1 h4{font-size: 18px; line-height: 24px;}
  .section.s1{background-position: right center;}
  ul#icones li a > h4{font-size: 40px; line-height: 40px;}
  ul#filtres li{margin: 0 20px 20px 0;}
  ul#team li, ul#team li:nth-child(3){width: calc(25% - 30px); margin: 0 0 0 40px;}
  ul#team li:nth-child(1){margin: 0;}
  #formulaire{width: 630px;}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
  .inner{width: 1120px;}
  ul#icones li{margin: 0 70px;}
  ul#titres li{width: 192px; height: 348px; margin: 0 40px 60px 0;}
  ul#titres li:nth-child(3n+3){margin:0 40px 60px 0;}
  ul#titres li:nth-child(4n+4){margin: 0 40px 60px 0;}
  ul#titres li:nth-child(5n+5){margin: 0 auto 60px;}
  .cd-popup-container {width: 70%; margin: 60px auto; height: 595px;}
  #couverture{width: 380px;}
  .single #lefttitre{width: 300px;}
  #lefttitre{width: 400px;}
  #lefttitre h1{font-size: 40px; line-height: 50px;}
  #lefttitre .the-content h2{font-size: 20px; line-height: 30px;}
  #lefttitre .the-content p{margin: 0 auto 14px;}
  #coordonnees{margin: 0 50px 0 100px;}
  .section h3{font-size: 40px; line-height: 50px;}
  .section.s1 h4{font-size: 20px; line-height: 30px;}
}