/*
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) {
  #page{width:300px;}
  a#logoheader{width: 140px; margin: 0 20px 0 0;}
  a#logofooter{width: 140px; margin: 0 calc(50% - 70px);}
  #menu_secondaire{width: calc(100% - 160px);}
  #menu_principal, #topfooter .menu-menu-principal-container{display: none;}
  #choix_langues{font-size: 12px; line-height: 12px; margin: 6px 40px 0 10px;}
  a.btnsocial{width: 24px; height: 24px;}
  #btnmenu, #menumobile{display: block;}
  ul.menu li{margin: 0 0 20px 0; padding: 0 0 10px;}
  ul.menu li a{font-size: 13px; line-height: 13px;}
  .signature{font-size: 11px; line-height: 11px; margin: 0 auto; width: 100%; text-align: center;}
  #topfooter{padding: 30px 0;}
  #bofooter{padding: 10px 0;}
  footer #btnlinkedin{display: none;}
  #txtslide{width: 300px; top: 45%; left: calc(50% - 150px);}
  #txtslide h2{font-size: 16px; line-height: 20px;}
  ul.dots li{width: 10px; height: 10px; margin: 0 8px;}
  ul.dots{width: 104px; height: 10px; left: calc(50% - 150px); bottom: 20px;}
  .images span{height: 170px;}
  #section1{padding: 30px 0;}
  #section1 h2{font-size: 18px; line-height: 20px; margin: 0 auto 10px;}
  #section1 h3{font-size: 12px; line-height: 16px; padding: 0;}
  #section2{padding: 30px 0 0;}
  .colgauche, .coldroite{width: 80%;}
  .colgauche{margin: 0 10% 30px;}
  .coldroite{margin: 0 10% 30px;}
  .colgauche h3, .coldroite h3{font-size: 18px; line-height: 20px; padding: 24px 10px; top: calc(50% - 46px);}
  .colgauche h3{right: -30px;}
  .coldroite h3{left: -30px;}
  .blochover{display: none;}
  #coversection{height: 180px;}
    .page-template-landing-page #coversection{height: 280px;}
  #secondcover{display: none;}
  h1, .h1-like{width: 100%; bottom: 20px; font-size: 26px; line-height: 30px; padding: 0 20px; right: 0; text-align: center;}
    .page-template-landing-page #coversection .titles_contener{
    bottom:20px;
    -webkit-transform:translate(-50%, 0);
            transform:translate(-50%, 0);

    }
  .page-template-landing-page #coversection .sous_titre{font-size:22px;}
  .page-template-landing-page #coversection h1, .page-template-landing-page #coversection .h1-like{
    margin-bottom:1em;
    }
  #postcover{min-height:inherit;}
  #description_societe{width: 100%; margin: 10px auto 0;}
  #description_societe h2, section#chiffrescles h2, #references h2, #contactform h2, #valeurs h2, #sectionactu h2, .rightblock h2, .rightblock .h2-like{font-size: 20px; line-height: 28px; padding: 12px 0 12px 35px;}
  #description_societe h2:before, #chiffrescles h2:before, #references h2:before, #contactform h2:before, #valeurs h2:before, #sectionactu h2:before, .rightblock h2::before, .rightblock .h2-like::before{width: 20px;}
  #description_societe p, .rightblock p{font-size: 15px; line-height: 19px; padding: 0; margin: 15px 0;}
  #valeurs, #confiance, #chiffrescles{margin: 40px auto 0;}
  #valeurs ul li{margin: 0 auto 40px;}
  .carrerouge1, .carrerouge2{width: 60px; height: 60px;}
  .carrerouge1{left: calc(50% - 30px); top: 170px; }
  .carrerouge2{right: calc(50% - 30px); bottom: 170px; top: auto;}
  .imageval{width: 100%; height: 200px;}
  .texteval{width: 100%; padding: 0 40px;}
  .texteval h3{font-size: 19px; line-height: 19px; margin: 15px 0;}
  .texteval p{font-size: 15px; line-height: 19px; margin: 15px 0;}
  #chiffrescles ul li{height: 240px; width: calc(50% - 10px); margin: 0 5px 10px;}
  .iconcc{width: 200px; margin: 0 calc(50% - 100px);}
  #chiffrescles ul li h3{font-size: 14px; line-height: 20px; margin: 10px auto 0; padding: 0 10px;}
  #chiffrescles ul li p{font-size: 12px; line-height: 14px; margin: 5px auto 0; padding: 0 10px;}
  #chiffrescles p{margin: 30px auto 0;}
  #chiffrescles p img{width: 100%; margin: 0; max-width: 100%; height: auto;}
  .leftblock{width: 100%;}
  .rightblock{width: 100%;}
  #confiance.join{margin: 0 auto 40px;}
  #content{margin: 40px auto 0;}
  .wp-caption{width: 100% !important; margin: 0 auto 40px; height: auto;}
  .wp-caption:nth-child(2n+2){margin: 0 auto 40px;}
  .wp-caption-text{font-size: 14px; line-height: 16px; margin: 16px auto 0;}
  #description_societe ul{padding: 0 0 0 40px; margin: 16px 0;}
  #description_societe ul li{font-size: 16px; line-height: 20px; padding: 0 0 0 15px; margin: 0 auto 16px;}
  #description_societe ul li::before{width: 5px; height: 5px; top: 7px;}
  #description_societe a{font-size: 16px; line-height: 16px; padding: 8px 16px;}
  #sectionactu{margin: 40px auto 0;}
  ul#actus li{margin: 0 auto 40px;}
  #imgactu{width: 100%; margin: 0; padding: 20px;}
  #txtactu{width: 100%;}
  #txtactu span{font-size: 14px; line-height: 16px; margin: 10px auto 0;}
  #txtactu h3{font-size: 16px; line-height: 16px; margin: 0 auto 16px;}
  #txtactu .contenu{font-size: 14px; line-height: 16px; margin: 0 auto 14px;}
  #references{margin: 40px auto;}
  ul#refs{margin: 0 auto 70px;}
  ul#refs li{width: calc(50% - 24px); margin: 0 32px 32px 0;}
  ul#refs li:nth-child(2n+2){margin: 0 auto 32px;}
  #contactform{margin: 50px auto;}
  #contactform .gform_wrapper .gform_footer{margin: 30px auto 0;}
  #contactform .gform_wrapper ul li.gfield{margin: 30px auto 0;}
  #contactform .gform_wrapper .top_label .gfield_label{font-size: 14px; line-height: 14px; margin: 0 0 10px 0;}
  #contactform .gform_wrapper .gfield_required{color: #c5233f;}
  body #contactform .gform_wrapper label.gfield_label + div.ginput_container{width: 100%;}
  #contactform .gform_wrapper .top_label input.medium, #contactform .gform_wrapper textarea.medium{font-size: 14px; line-height: 20px; padding: 10px;}
  #contactform .gform_wrapper textarea.medium{height: 200px}
  #contactform .gform_button{font-size: 16px; line-height: 16px; padding:10px 20px;}
  #contactmap iframe{height: 200px;}
  #menu_secondaire a.btnsocial, #bofooter a.btnsocial{display: none;}
  .socialmob{display: block;}
  .page-template-landing-page #realisations .reals .realisation{width: 100%;}

  #menufooter{width: 300px; margin: 30px calc(50% - 150px) 0;}
  .menufooter:first-child{margin: 0 auto 10px; padding: 0 0 10px;}
  .menufooter h4{font-size: 14px; line-height: 16px; margin: 0 auto 5px;}
  .menufooter h4{width: 100%;}
  .menufooter ul.menu{text-align: center;}
  .menufooter ul.menu li{margin: 5px 10px 10px;}
}




/* Custom, iPhone Retina */
@media only screen and (min-width : 480px) {
  #page{width:460px;}
  a#logoheader{width: 160px;}
  a#logofooter{width: 160px; margin: 0 calc(50% - 80px);}
  #menu_secondaire{width: calc(100% - 180px);}
  footer #btnlinkedin{display: block;}
  #txtslide{width: 400px; top: 45%; left: calc(50% - 230px);}
  ul.dots{left: calc(50% - 230px);}
  .images span{height: 272px;}
  #coversection{height: 240px;}
  #secondcover{display: none;}
  h1, h1-like{width: 100%; bottom: 40px; font-size: 26px; line-height: 30px; padding: 0 20px; right: 0; text-align: center;}
  .page-template-landing-page #coversection .sous_titre{font-size:22px;}
  #postcover{min-height:inherit;}
  #description_societe{width: 100%; margin: 10px auto 0;}
  #description_societe h2, section#chiffrescles h2, #references h2, #contactform h2, #valeurs h2, #sectionactu h2, .rightblock h2{font-size: 20px; line-height: 28px; padding: 12px 0 12px 35px;}
  #description_societe h2:before, #chiffrescles h2:before, #references h2:before, #contactform h2:before, #valeurs h2:before, #sectionactu h2:before, .rightblock h2::before{width: 20px;}
  #description_societe p, .rightblock p{font-size: 15px; line-height: 19px; padding: 0; margin: 15px 0;}
  #valeurs, #confiance, #chiffrescles{margin: 40px auto 0;}
  #valeurs ul li{margin: 0 auto 40px;}
  .carrerouge1, .carrerouge2{width: 60px; height: 60px;}
  .carrerouge1{left: calc(50% - 30px); top: 170px; }
  .carrerouge2{right: calc(50% - 30px); bottom: 170px; top: auto;}
  .imageval{width: 100%; height: 200px;}
  .texteval{width: 100%; padding: 0 40px;}
  .texteval h3{font-size: 19px; line-height: 19px; margin: 15px 0;}
  .texteval p{font-size: 15px; line-height: 19px; margin: 15px 0;}
  #chiffrescles ul li{height: 240px; width: calc(33.3334% - 10px); margin: 0 5px 10px;}
  .iconcc{width: 200px; margin: 0 calc(50% - 100px);}
  #chiffrescles ul li h3{font-size: 16px; line-height: 26px; margin: 15px auto 0; padding: 0 15px;}
  #chiffrescles ul li p{font-size: 12px; line-height: 14px; margin: 5px auto 0; padding: 0 15px;}
  #chiffrescles p{margin: 30px auto 0;}
  #chiffrescles p img{width: 100%; margin: 0; max-width: 100%; height: auto;}
  .leftblock{width: 100%;}
  .rightblock{width: 100%;}
  #confiance.join{margin: 0 auto 40px;}
  #content{margin: 40px auto 0;}
  .wp-caption{width: calc(50% - 20px) !important; margin: 0 40px 40px 0; height: 360px;}
  .wp-caption:nth-child(2n+2){margin: 0 0 40px 0;}
  .wp-caption-text{font-size: 16px; line-height: 20px; margin: 20px auto 0;}
  #description_societe ul{padding: 0 0 0 40px; margin: 16px 0;}
  #description_societe ul li{font-size: 16px; line-height: 20px; padding: 0 0 0 15px; margin: 0 auto 16px;}
  #description_societe ul li::before{width: 5px; height: 5px; top: 7px;}
  #description_societe a{font-size: 16px; line-height: 16px; padding: 8px 16px;}
  #sectionactu{margin: 40px auto 0;}
  ul#actus li{margin: 0 auto 40px;}
  #imgactu{width: 100%; margin: 0; padding: 30px;}
  #txtactu{width: 100%;}
  #txtactu span{font-size: 16px; line-height: 20px; margin: 25px auto 0;}
  #txtactu h3{font-size: 20px; line-height: 20px; margin: 0 auto 20px;}
  #txtactu .contenu{font-size: 16px; line-height: 20px; margin: 0 auto 16px;}
  #references{margin: 40px auto;}
  ul#refs{margin: 0 auto 70px;}
  ul#refs li{width: calc(33.3334% - 24px); margin: 0 32px 32px 0;}
  ul#refs li:nth-child(2n+2){margin: 0 32px 32px 0;}
  ul#refs li:nth-child(3n+3){margin: 0 auto 32px;}
  #contactform{margin: 50px auto;}
  #contactform .gform_wrapper .gform_footer{margin: 30px auto 0;}
  #contactform .gform_wrapper ul li.gfield{margin: 30px auto 0;}
  #contactform .gform_wrapper .top_label .gfield_label{font-size: 14px; line-height: 14px; margin: 0 0 10px 0;}
  #contactform .gform_wrapper .gfield_required{color: #c5233f;}
  body #contactform .gform_wrapper label.gfield_label + div.ginput_container{width: 100%;}
  #contactform .gform_wrapper .top_label input.medium, #contactform .gform_wrapper textarea.medium{font-size: 14px; line-height: 20px; padding: 10px;}
  #contactform .gform_wrapper textarea.medium{height: 200px}
  #contactform .gform_button{font-size: 16px; line-height: 16px; padding:10px 20px;}
  #contactmap iframe{height: 300px;}

  #menufooter{width: 400px; margin: 30px calc(50% - 200px) 0;}
}




/* Custom, iPhone Retina */
@media only screen and (min-width : 768px) {
  #page{width:720px;}
  a#logoheader{width: 200px; margin: 0 30px 0 0;}
  a#logofooter{width: 200px; margin: 0 calc(50% - 100px);}
  #menu_secondaire{width: calc(100% - 230px);}
  #choix_langues{font-size: 14px; line-height: 14px; margin: 8px 40px 0 20px;}
  a.btnsocial{width: 28px; height: 28px;}
  #topfooter{padding: 50px 0;}
  #bofooter{padding: 20px 0;}
  #txtslide{width: 360px; top: 35%; left: calc(50% - 360px);}
  .signature{font-size: 12px; line-height: 12px; margin: 10px auto 0; width: auto; text-align: left;}
  #txtslide h2{font-size: 26px; line-height: 32px;}
  ul.dots li{width: 12px; height: 12px; margin: 0 10px;}
  ul.dots{width: 128px; height: 12px; left: calc(50% - 360px); bottom: 30px;}
  .images span{height: 352px;}
  #section1{padding: 40px 0;}
  #section1 h2{font-size: 20px; line-height: 26px; margin: 0 auto 10px;}
  #section1 h3{font-size: 13px; line-height: 18px; padding: 0 40px;}
  #section2{padding: 50px 0 0;}
  .colgauche, .coldroite{width: calc(50% - 20px);}
  .colgauche{margin: 0 40px 50px 0;}
  .coldroite{margin: 0 auto 50px;}
  .colgauche h3, .coldroite h3{font-size: 20px; line-height: 26px; padding: 30px 10px; top: calc(50% - 50px);}
  .colgauche h3{right: -40px;}
  .coldroite h3{left: -40px;}
  .blochover{display: block;}
  .blochover{padding: 30px 40px;}
  .blochover p{font-size: 18px; line-height: 20px;}
  .blochover span{font-size: 14px; line-height: 14px; margin: 10px auto 0;}
  #coversection{height: 320px;}
   .page-template-landing-page #coversection{height: 320px;}
  #secondcover{width: 360px; left: calc(50% - 360px); bottom: -360px; display: block;}
  h1, .h1-like{width: 360px; bottom: 30px; font-size: 30px; line-height: 36px; padding: 0 0 0 35px; right: calc(50% - 360px); text-align: left;}
  .page-template-landing-page #coversection .sous_titre{font-size:28px;}
  #postcover{min-height: 400px;}
  #description_societe{width: calc(100% - 360px); margin: 10px auto 0;}
  #description_societe h2, section#chiffrescles h2, #references h2, #contactform h2, #valeurs h2, #sectionactu h2, .rightblock h2, .rightblock .h2-like{font-size: 20px; line-height: 28px; padding: 12px 0 12px 35px;}
  #description_societe h2:before, #chiffrescles h2:before, #references h2:before, #contactform h2:before, #valeurs h2:before, #sectionactu h2:before, .rightblock h2::before, .rightblock .h2-like::before{width: 20px;}
  #description_societe p, .rightblock p{font-size: 15px; line-height: 19px; padding: 0 0 0 35px; margin: 15px 0;}
  #valeurs, #confiance, #chiffrescles{margin: 40px auto 0;}
  #valeurs ul li{margin: 0 auto 40px;}
  .carrerouge1, .carrerouge2{top: calc(50% - 35px); width: 70px; height: 70px; bottom: auto;}
  .carrerouge1{left: calc(50% - 35px);}
  .carrerouge2{right: calc(50% - 35px);}
  .imageval{width: 50%; height: 240px;}
  .texteval{width: 50%; padding: 0 65px 0;}
  .texteval h3{font-size: 19px; line-height: 19px; margin: 15px 0;}
  .texteval p{font-size: 15px; line-height: 19px; margin: 15px 0;}
  #chiffrescles ul li{height: 280px; width: calc(33.3334% - 40px); margin: 0 20px 20px;}
  .iconcc{width: 200px; margin: 0 calc(50% - 100px);}
  #chiffrescles ul li h3{font-size: 26px; line-height: 30px; margin: 20px auto 0; padding: 0 20px;}
  #chiffrescles ul li p{font-size: 13px; line-height: 16px; margin: 10px auto 0; padding: 0 20px;}
  #chiffrescles p{margin: 30px auto 0;}
  #chiffrescles p img{width: 710px; margin: 0 calc(50% - 355px); max-width: 100%;}
  .leftblock{width: 40%;}
  .rightblock{width: 60%;}
    .page-template-landing-page #confiance:nth-child(even) .leftblock{float: right;}
    .page-template-landing-page #confiance:nth-child(even) .rightblock h2, .page-template-landing-page #confiance:nth-child(even) .rightblock .h2-like {
        font-size: 20px;
        line-height: 28px;
        padding: 12px 35px 12px 0;
    }
    .page-template-landing-page #confiance:nth-child(even) .rightblock h2::before, .page-template-landing-page #confiance:nth-child(even) .rightblock .h2-like::before{
        left:auto;
        right: 0;
    }
   .page-template-landing-page #confiance:nth-child(even) .rightblock p {
        padding: 0 40px 0 0;
    }
  #confiance.join{margin: 0 auto 40px;}
  #content{margin: 40px auto 0;}
  .wp-caption{width: calc(33.3334% - 30px) !important; margin: 0 auto 30px; height: 360px;}
  .wp-caption:nth-child(2n+2){margin: 0 auto 30px;}
  .wp-caption:nth-child(3n+2){margin: 0 45px 30px;}
  .wp-caption-text{font-size: 16px; line-height: 20px; margin: 20px auto 0;}
  #description_societe ul{padding: 0 0 0 40px; margin: 16px 0;}
  #description_societe ul li{font-size: 16px; line-height: 20px; padding: 0 0 0 15px; margin: 0 auto 16px;}
  #description_societe ul li::before{width: 5px; height: 5px; top: 7px;}
  #description_societe a{font-size: 16px; line-height: 16px; padding: 8px 16px;}
  #sectionactu{margin: 40px auto 0;}
  ul#actus li{margin: 0 auto 40px;}
  #imgactu{width: 300px; margin: 0 20px 0 0; padding: 20px;}
  #txtactu{width: 400px;}
  #txtactu span{font-size: 15px; line-height: 18px; margin: 20px auto 0;}
  #txtactu h3{font-size: 18px; line-height: 18px; margin: 0 auto 18px;}
  #txtactu .contenu{font-size: 15px; line-height: 18px; margin: 0 auto 15px;}
  #references{margin: 40px auto;}
  ul#refs{margin: 0 auto 70px;}
  ul#refs li{width: calc(25% - 24px); margin: 0 32px 32px 0;}
  ul#refs li:nth-child(2n+2){margin: 0 32px 32px 0;}
  ul#refs li:nth-child(3n+3){margin: 0 32px 32px 0;}
  ul#refs li:nth-child(4n+4){margin: 0 auto 32px;}
  #contactform{margin: 50px auto;}
  #contactform .gform_wrapper .gform_footer{margin: 30px auto 0;}
  #contactform .gform_wrapper ul li.gfield{margin: 30px auto 0;}
  #contactform .gform_wrapper .top_label .gfield_label{font-size: 14px; line-height: 14px; margin: 0 0 10px 0;}
  #contactform .gform_wrapper .gfield_required{color: #c5233f;}
  body #contactform .gform_wrapper label.gfield_label + div.ginput_container{width: 50%;}
  #contactform .gform_wrapper .top_label input.medium, #contactform .gform_wrapper textarea.medium{font-size: 14px; line-height: 20px; padding: 10px;}
  #contactform .gform_wrapper textarea.medium{height: 200px}
  #contactform .gform_button{font-size: 16px; line-height: 16px; padding:10px 20px;}
  #contactmap iframe{height: 400px;}
  #menu_secondaire a.btnsocial, #bofooter a.btnsocial{display: block;}
  .socialmob{display: none;}
  .page-template-landing-page #realisations .reals .realisation{width: calc(50% - 40px);}
  #menufooter{width: 600px; margin: 40px calc(50% - 300px) 0;}
  .menufooter:first-child{margin: 0 auto 10px; padding: 0 0 10px;}
  .menufooter h4{font-size: 15px; line-height: 18px; margin: 0 auto 8px;}
}




/* Custom, iPhone Retina */
@media only screen and (min-width : 992px) {
  #page{width:900px;}
  #menu_principal{width: calc(100% - 230px); display: block;}
  a#logofooter{margin: 0 auto;}
  #topfooter .menu-menu-principal-container{width: calc(100% - 200px); margin: 20px auto 0; display: block;}
  ul.menu li{margin: 0 0 0 20px; padding: 0 0 16px;}
  ul.menu li a{font-size: 13px; line-height: 13px;}
  #choix_langues{margin: 8px 0 0 20px;}
  #btnmenu, #menumobile{display: none;}
  #txtslide{width: 450px; top: 35%; left: calc(50% - 450px);}
  #txtslide h2{font-size: 30px; line-height: 36px;}
  ul.dots li{margin: 10px auto;}
  ul.dots{width: 12px; height: 128px; left: calc(50% - 450px); bottom: 30px;}
  .images span{height: 424px;}
  #section1{padding: 50px 0;}
  #section1 h2{font-size: 24px; line-height: 30px; margin: 0 auto 10px;}
  #section1 h3{font-size: 14px; line-height: 20px; padding: 0 100px;}
  #section2{padding: 60px 0 0;}
  .colgauche, .coldroite{width: calc(50% - 25px);}
  .colgauche{margin: 0 50px 60px 0;}
  .coldroite{margin: 0 auto 60px;}
  .colgauche h3, .coldroite h3{font-size: 24px; line-height: 28px; padding: 36px 10px; top: calc(50% - 50px);}
  .colgauche h3{right: -50px;}
  .coldroite h3{left: -50px;}
  .blochover{padding: 40px 50px;}
  .blochover p{font-size: 20px; line-height: 26px;}
  .blochover span{font-size: 16px; line-height: 16px; margin: 15px auto 0;}
  #coversection{height: 440px;}
    .page-template-landing-page #coversection{height: 440px;}
  #secondcover{width: 460px; left: calc(50% - 450px); bottom: -360px;}
  h1, .h1-like{width: 440px; bottom: 100px; font-size: 34px; line-height: 40px; padding: 0 0 0 40px; right: calc(50% - 450px);}
  .page-template-landing-page #coversection .titles_contener{
    bottom:51%;
    -webkit-transform:translate(-50%, 50%);
            transform:translate(-50%, 50%);

    }
  #postcover{min-height: 360px;}
  #description_societe{width: calc(100% - 500px); margin: 10px auto 0;}
  #description_societe h2, section#chiffrescles h2, #references h2, #contactform h2, #valeurs h2, #sectionactu h2, .rightblock h2, .rightblock .h2-like{font-size: 22px; line-height: 30px; padding: 15px 0 15px 40px;}
  #description_societe h2:before, #chiffrescles h2:before, #references h2:before, #contactform h2:before, #valeurs h2:before, #sectionactu h2:before, .rightblock h2::before, .rightblock .h2-like:before{width: 25px;}
  #description_societe p, .rightblock p{font-size: 16px; line-height: 20px; padding: 0 0 0 40px; margin: 16px 0;}
  #valeurs, #confiance, #chiffrescles{margin: 50px auto 0;}
  #valeurs ul li{margin: 0 auto 50px;}
  .carrerouge1, .carrerouge2{top: calc(50% - 40px); width: 80px; height: 80px;}
  .carrerouge1{left: calc(50% - 40px);}
  .carrerouge2{right: calc(50% - 40px);}
  .imageval{width: 50%; height: 310px;}
  .texteval{width: 50%; padding: 0 70px 0;}
  .texteval h3{font-size: 20px; line-height: 20px; margin: 16px 0;}
  .texteval p{font-size: 16px; line-height: 20px; margin: 16px 0;}
  #chiffrescles ul li{height: 260px; width: calc(20% - 20px); margin: 0 20px 0 0;}
  .iconcc{width: 200px; margin: 0 calc(50% - 100px);}
  #chiffrescles ul li h3{font-size: 16px; line-height: 20px; margin: 20px auto 0; padding: 0 20px;}
  #chiffrescles ul li p{font-size: 13px; line-height: 16px; margin: 10px auto 0; padding: 0 20px;}
  #chiffrescles p{margin: 30px auto 0;}
  #chiffrescles p img{width: 710px; margin: 0 calc(50% - 355px); max-width: 100%;}
  .leftblock{width: 50%;}
  .rightblock{width: 50%;}
  #confiance.join{margin: 0 auto 50px;}
  #content{margin: 50px auto 0;}
  .wp-caption{width: calc(33.3334% - 30px) !important; margin: 0 auto 45px; height: 340px;}
  .wp-caption:nth-child(2n+2){margin: 0 auto 45px;}
  .wp-caption:nth-child(3n+2){margin: 0 45px 45px;}
  .wp-caption-text{font-size: 16px; line-height: 20px; margin: 20px auto 0;}
  #description_societe ul{padding: 0 0 0 40px; margin: 16px 0;}
  #description_societe ul li{font-size: 16px; line-height: 20px; padding: 0 0 0 15px; margin: 0 auto 16px;}
  #description_societe ul li::before{width: 5px; height: 5px; top: 7px;}
  #description_societe a{font-size: 16px; line-height: 16px; padding: 8px 16px;}
  #sectionactu{margin: 50px auto 0;}
  ul#actus li{margin: 0 auto 50px;}
  #imgactu{width: 360px; margin: 0 20px 0 0; padding: 25px;}
  #txtactu{width: 520px;}
  #txtactu span{font-size: 16px; line-height: 20px; margin: 25px auto 0;}
  #txtactu h3{font-size: 20px; line-height: 20px; margin: 0 auto 20px;}
  #txtactu .contenu{font-size: 16px; line-height: 20px; margin: 0 auto 16px;}
  #references{margin: 50px auto;}
  ul#refs{margin: 0 auto 70px;}
  ul#refs li{width: calc(25% - 24px); margin: 0 32px 32px 0;}
  ul#refs li:nth-child(4n+4){margin: 0 auto 32px;}
  #contactform{margin: 50px auto;}
  #contactform .gform_wrapper .gform_footer{margin: 30px auto 0;}
  #contactform .gform_wrapper ul li.gfield{margin: 30px auto 0;}
  #contactform .gform_wrapper .top_label .gfield_label{font-size: 14px; line-height: 14px; margin: 0 0 10px 0;}
  #contactform .gform_wrapper .gfield_required{color: #c5233f;}
  body #contactform .gform_wrapper label.gfield_label + div.ginput_container{width: 50%;}
  #contactform .gform_wrapper .top_label input.medium, #contactform .gform_wrapper textarea.medium{font-size: 14px; line-height: 20px; padding: 10px;}
  #contactform .gform_wrapper textarea.medium{height: 200px}
  #contactform .gform_button{font-size: 16px; line-height: 16px; padding:10px 20px;}
  #contactmap iframe{height: 400px;}
    .page-template-landing-page #realisations .reals .realisation{
        width: calc(25% - 40px);
    }
    #menufooter{width: calc(100% - 240px); margin: 0 0 0 40px;}
    .menufooter:first-child{margin: 0 auto 10px; padding: 0 0 10px;}
    .menufooter h4{font-size: 15px; line-height: 18px; margin: 0 auto 8px;}
    .menufooter h4{width: auto;}
    .menufooter ul.menu{text-align: right;}
    .menufooter ul.menu li{margin: 5px 10px 10px;}
    ul.sub-menu{width: 120px; top: 28px;}
}




/* Custom, iPhone Retina */
@media only screen and (min-width : 1200px) {
  #page{width:1000px;}
  a#logoheader{width: 240px; margin: 0 40px 0 0;}
  a#logofooter{width: 240px;}
  #menu_secondaire, #menu_principal{width: calc(100% - 280px);}
  #topfooter .menu-menu-principal-container{width: calc(100% - 240px); margin: 30px auto 0;}
  ul.menu li{margin: 0 0 0 25px;}
  ul.menu li a{font-size: 14px; line-height: 14px;}
  #choix_langues{font-size: 16px; line-height: 16px; margin: 8px 0 0 20px;}
  a.btnsocial{width: 32px; height: 32px;}
  #txtslide{width: 500px; top: 35%; left: calc(50% - 500px);}
  #txtslide h2{font-size: 36px; line-height: 40px;}
  ul.dots li{width: 16px; height: 16px; margin: 10px auto;}
  ul.dots{width: 20px; height: 144px; left: calc(50% - 500px); bottom: 40px;}
  .images span{height: 495px;}
  #section1 h3{padding: 0 140px;}
  #section2{padding: 100px 0 0;}
  .colgauche{margin: 0 50px 100px 0;}
  .coldroite{margin: 0 auto 100px;}
  .blochover{padding: 50px 60px;}
  .blochover p{font-size: 22px; line-height: 30px;}
  .blochover span{font-size: 17px; line-height: 17px; margin: 20px auto 0;}
  #coversection{height: 520px;}
    .page-template-landing-page #coversection{height: 520px;}
  #secondcover{width: 460px; left: calc(50% - 500px); bottom: -360px;}
  h1, h1-like{width: 540px; bottom: 100px; font-size: 34px; line-height: 40px; padding: 0 0 0 40px; right: calc(50% - 500px);}

  #postcover{min-height: 360px;}
  #description_societe{width: calc(100% - 500px); margin: 10px auto 0;}
  #description_societe h2, section#chiffrescles h2, #references h2, #contactform h2, #valeurs h2, #sectionactu h2, .rightblock h2, .rightblock .h2-like{font-size: 22px; line-height: 30px; padding: 15px 0 15px 40px;}
  #description_societe h2:before, #chiffrescles h2:before, #references h2:before, #contactform h2:before, #valeurs h2:before, #sectionactu h2:before, .rightblock h2::before, .rightblock .h2-like::before{width: 25px;}
  #description_societe p, .rightblock p{font-size: 16px; line-height: 20px; padding: 0 0 0 40px; margin: 16px 0;}
  #valeurs, #confiance, #chiffrescles{margin: 50px auto 0;}
  #valeurs ul li{margin: 0 auto 50px;}
  .carrerouge1, .carrerouge2{top: calc(50% - 50px); width: 100px; height: 100px;}
  .carrerouge1{left: calc(55% - 50px);}
  .carrerouge2{right: calc(55% - 50px);}
  .imageval{width: 55%; height: 370px;}
  .texteval{width: 45%; padding: 0 75px 0;}
  .texteval h3{font-size: 20px; line-height: 20px; margin: 16px 0;}
  .texteval p{font-size: 16px; line-height: 20px; margin: 16px 0;}
  #chiffrescles ul li{height: 260px; width: calc(20% - 20px); margin: 0 20px 0 0;}
  .iconcc{width: 200px; margin: 0 calc(50% - 100px);}
  #chiffrescles ul li h3{font-size: 20px; line-height: 30px; margin: 20px auto 0; padding: 0 20px;}
  #chiffrescles ul li p{font-size: 13px; line-height: 16px; margin: 10px auto 0; padding: 0 20px;}
  #chiffrescles p{margin: 30px auto 0;}
  #chiffrescles p img{width: 710px; margin: 0 calc(50% - 355px); max-width: 100%;}
  .leftblock{width: 50%;}
  .rightblock{width: 50%;}
  #confiance.join{margin: 0 auto 50px;}
  #content{margin: 50px auto 0;}
  .wp-caption{width: calc(33.3334% - 50px) !important; margin: 0 auto 75px; height: 340px;}
  .wp-caption:nth-child(2n+2){margin: 0 auto 75px;}
  .wp-caption:nth-child(3n+2){margin: 0 75px 75px;}
  .wp-caption-text{font-size: 16px; line-height: 20px; margin: 20px auto 0;}
  #description_societe ul{padding: 0 0 0 40px; margin: 16px 0;}
  #description_societe ul li{font-size: 16px; line-height: 20px; padding: 0 0 0 15px; margin: 0 auto 16px;}
  #description_societe ul li::before{width: 5px; height: 5px; top: 7px;}
  #description_societe a{font-size: 16px; line-height: 16px; padding: 8px 16px;}
  #sectionactu{margin: 50px auto 0;}
  ul#actus li{margin: 0 auto 50px;}
  #imgactu{width: 360px; margin: 0 40px 0 0; padding: 25px;}
  #txtactu{width: 600px;}
  #txtactu span{font-size: 16px; line-height: 20px; margin: 25px auto 0;}
  #txtactu h3{font-size: 20px; line-height: 20px; margin: 0 auto 20px;}
  #txtactu .contenu{font-size: 16px; line-height: 20px; margin: 0 auto 16px;}
  #references{margin: 50px auto;}
  ul#refs{margin: 0 auto 70px;}
  ul#refs li{width: calc(25% - 24px); margin: 0 32px 32px 0;}
  ul#refs li:nth-child(4n+4){margin: 0 auto 32px;}
  #contactform{margin: 50px auto;}
  #contactform .gform_wrapper .gform_footer{margin: 30px auto 0;}
  #contactform .gform_wrapper ul li.gfield{margin: 30px auto 0;}
  #contactform .gform_wrapper .top_label .gfield_label{font-size: 14px; line-height: 14px; margin: 0 0 10px 0;}
  #contactform .gform_wrapper .gfield_required{color: #c5233f;}
  body #contactform .gform_wrapper label.gfield_label + div.ginput_container{width: 50%;}
  #contactform .gform_wrapper .top_label input.medium, #contactform .gform_wrapper textarea.medium{font-size: 14px; line-height: 20px; padding: 10px;}
  #contactform .gform_wrapper textarea.medium{height: 200px}
  #contactform .gform_button{font-size: 16px; line-height: 16px; padding:10px 20px;}
  #contactmap iframe{height: 400px;}
  #menufooter{width: calc(100% - 300px); margin: 0 0 0 60px;}
  .menufooter:first-child{margin: 0 auto 15px; padding: 0 0 15px;}
  .menufooter h4{font-size: 16px; line-height: 20px; margin: 0 auto 10px;}
  ul.sub-menu{width: 140px; top: 30px;}
}




/* Custom, iPhone Retina */
@media only screen and (min-width : 1400px) {
  #page{width:1200px;}
  a#logoheader{width: 280px; margin: 0 60px 0 0;}
  a#logofooter{width: 280px;}
  #menu_secondaire, #menu_principal{width: calc(100% - 340px);}
  #topfooter .menu-menu-principal-container{width: calc(100% - 280px); margin: 40px auto 0;}
  ul.menu li{margin: 0 0 0 30px;}
  ul.menu li a{font-size: 16px; line-height: 16px;}
  #txtslide{width: 600px; top: 35%; left: calc(50% - 600px);}
  ul.dots{left: calc(50% - 600px);}
  .images span{height: 566px;}
  #section1 h3{padding: 0 180px;}
  .blochover{padding: 70px 80px;}
  .blochover p{font-size: 24px; line-height: 32px;}
  .blochover span{font-size: 18px; line-height: 18px; margin: 20px auto 0;}
  #coversection{height: 620px;}
    .page-template-landing-page #coversection{height: 620px;}
  #secondcover{width: 500px; left: calc(50% - 600px); bottom: -360px;}
  h1, .h1-like{width: 700px; bottom: 100px; font-size: 34px; line-height: 40px; padding: 0 0 0 40px; right: calc(50% - 600px);}
  .page-template-landing-page #coversection .sous_titre{font-size:32px;}
  #postcover{min-height: 360px;}
  #description_societe{width: calc(100% - 500px); margin: 10px auto 0;}
  #description_societe h2, section#chiffrescles h2, #references h2, #contactform h2, #valeurs h2, #sectionactu h2, .rightblock h2, .rightblock .h2-like{font-size: 22px; line-height: 30px; padding: 15px 0 15px 40px;}
  #description_societe h2:before, #chiffrescles h2:before, #references h2:before, #contactform h2:before, #valeurs h2:before, #sectionactu h2:before, .rightblock h2::before, .rightblock .h2-like::before{width: 25px;}
  #description_societe p, .rightblock p{font-size: 16px; line-height: 20px; padding: 0 0 0 40px; margin: 16px 0;}
  #valeurs, #confiance, #chiffrescles{margin: 50px auto 0;}
  #valeurs ul li{margin: 0 auto 50px;}
  .carrerouge1, .carrerouge2{top: calc(50% - 50px); width: 100px; height: 100px;}
  .carrerouge1{left: calc(55% - 50px);}
  .carrerouge2{right: calc(55% - 50px);}
  .imageval{width: 55%; height: 440px;}
  .texteval{width: 45%; padding: 0 75px 0;}
  .texteval h3{font-size: 20px; line-height: 20px; margin: 16px 0;}
  .texteval p{font-size: 16px; line-height: 20px; margin: 16px 0;}
  #chiffrescles ul li{height: 260px; width: calc(20% - 20px); margin: 0 20px 0 0;}
  .iconcc{width: 200px; margin: 0 calc(50% - 100px);}
  #chiffrescles ul li h3{font-size: 26px; line-height: 30px; margin: 20px auto 0; padding: 0 20px;}
  #chiffrescles ul li p{font-size: 13px; line-height: 16px; margin: 10px auto 0; padding: 0 20px;}
  #chiffrescles p{margin: 30px auto 0;}
  #chiffrescles p img{width: 710px; margin: 0 calc(50% - 355px); max-width: 100%;}
  .leftblock{width: 50%;}
  .rightblock{width: 50%;}
  #confiance.join{margin: 0 auto 50px;}
  #content{margin: 50px auto 0;}
  .wp-caption{width: calc(33.3334% - 100px) !important; margin: 0 auto 100px; height: 340px;}
  .wp-caption:nth-child(2n+2){margin: 0 auto 100px;}
  .wp-caption:nth-child(3n+2){margin: 0 150px 100px;}
  .wp-caption-text{font-size: 16px; line-height: 20px; margin: 20px auto 0;}
  #description_societe ul{padding: 0 0 0 40px; margin: 16px 0;}
  #description_societe ul li{font-size: 16px; line-height: 20px; padding: 0 0 0 15px; margin: 0 auto 16px;}
  #description_societe ul li::before{width: 5px; height: 5px; top: 7px;}
  #description_societe a{font-size: 16px; line-height: 16px; padding: 8px 16px;}
  #sectionactu{margin: 50px auto 0;}
  ul#actus li{margin: 0 auto 50px;}
  #imgactu{width: 400px; margin: 0 80px 0 0; padding: 25px;}
  #txtactu{width: 600px;}
  #txtactu span{font-size: 16px; line-height: 20px; margin: 25px auto 0;}
  #txtactu h3{font-size: 20px; line-height: 20px; margin: 0 auto 20px;}
  #txtactu .contenu{font-size: 16px; line-height: 20px; margin: 0 auto 16px;}
  #references{margin: 50px auto;}
  ul#refs{margin: 0 auto 70px;}
  ul#refs li{width: calc(25% - 24px); margin: 0 32px 32px 0;}
  ul#refs li:nth-child(4n+4){margin: 0 auto 32px;}
  #contactform{margin: 50px auto;}
  #contactform .gform_wrapper .gform_footer{margin: 30px auto 0;}
  #contactform .gform_wrapper ul li.gfield{margin: 30px auto 0;}
  #contactform .gform_wrapper .top_label .gfield_label{font-size: 14px; line-height: 14px; margin: 0 0 10px 0;}
  #contactform .gform_wrapper .gfield_required{color: #c5233f;}
  body #contactform .gform_wrapper label.gfield_label + div.ginput_container{width: 50%;}
  #contactform .gform_wrapper .top_label input.medium, #contactform .gform_wrapper textarea.medium{font-size: 14px; line-height: 20px; padding: 10px;}
  #contactform .gform_wrapper textarea.medium{height: 200px}
  #contactform .gform_button{font-size: 16px; line-height: 16px; padding:10px 20px;}
  #contactmap iframe{height: 400px;}
  #menufooter{width: calc(100% - 340px);}
  ul.sub-menu{width: 160px; top: 32px;}
}
@media only screen and (min-width : 1600px){
.images span{height: 636px;}
}
@media only screen and (min-width : 1800px){
.images span{height: 700px;}
}