/* ========================================================================== Media Queries ========================================================================== */ /* ---------------------------------------------------------------------- */ /* Mobile Version 480px /* ---------------------------------------------------------------------- */ @media handheld, only screen and (max-width: 568px) { .js .nav-collapse-0.opened{max-height:9999px !important;} .nav-collapse ul{width:100%; background:rgba(0,0,0, .7)} .navigation ul li{width:100%;} .navigation .social_icons{display:none;} .slides li .slide1_box{bottom:45px !important; width:auto; left:40%;} .image-caption-contact{display:none;} .image-caption-contact2{display:block;} .image-caption-contact{right:2%; left:2%; width:90%; padding:15px; text-align:center;} .image-caption-contact h1{font-size:16px; line-height:16px;} .image-caption-contact h2{font-size:12px; line-height:15px; margin:0 0 20px 0;} .contact-form{height:auto;} .icon-title h3::after{background:none;} } /* ---------------------------------------------------------------------- */ /* Mobile Version 320px /* ---------------------------------------------------------------------- */ @media handheld, only screen and (min-width: 320px) and (max-width: 568px) { body iframe#sunnyandsunny{display:none !important;} header .logo a img{float:none;} .header_R{width:100% !important; background:#000;} .header_Rtop{width:65%; margin:10px 0 0 25px; border:0px;} .header_Rtop h2{font-size:14px; letter-spacing:3px; text-align:left;} header .logo{position: absolute; left:0; width:100%; top:48px; background:#000; text-align:center; padding-bottom:5px;} .slider{margin:0px; height:100%; top:183px;} .flexslider{min-height:212px;;} .flexslider .slides > li, .flexslider .slides, .flexslider{height:100%;} .flexslider .slides img{height:100%;} .flex-control-nav{ bottom:8px;} .main-2{ position:relative; top:183px;} .footer .container{width:280px;} .container{width:100%; margin:0px auto; position:relative;} .navigation .social_icons{display:none;} .nav-collapse ul{width:100%; background:rgba(0,0,0, .7)} .navigation ul li{width:100%;} .slides li .slide1_box p, .slides li .slide1_box p span, .slides li .slide1_box p strong{font-size:12px; letter-spacing:2px;} .slides li .slide1_box p{line-height:18px;} .slider{padding:0px;} .form{left: 13px;} .gallery_row{ float:none; width:280px; margin:0 auto;} .gallery_box span{left:9.5%; top:1px; width:82%;} .gallery_box.gallery_boxbig span{width:100%;} .gallery_boxbig span{left:0%; top:0px; background-image: url(../images/gallery_bordermobile.png);} .gallery_boxmedium span{left:0%; top:0px; background-image: url(../images/gallery_bordermed_mobile.png);} .cont_topred{background:#b90000 url(../images/red_bg.jpg) repeat-x left bottom; height:auto; padding:0px 0 20px 0; margin-bottom:13px;} .cont_topred .container{text-align:center; width:90%;} .cont_topred p{float:none; width:100%; font-size:12px; font-weight:normal; line-height:16px;} .cont_topred a{float:none; width:226px; display:block; margin:0px auto; } .gallery_box{width:280px; margin:0px auto 24px auto; text-align:center; float:none;} .gallery_box img{float:none;} .branches{margin:0px auto 30px auto; width:90%;} .under_gallery{font-size:13px;} .cont_temoignages{background:url(../images/testimonials_bg.gif) no-repeat center center; width:100%; height:350px;} .cont_temoignagestext{width:80%; float:none; margin:0px auto; padding:8% 0 0 0;} .cont_temoignagestext h3{margin:17px 0 100px 0;} .cont_temoignagestext p{font-size:14px; line-height:18px;} .cont_temoignagestext h2{font-size:14px;} .footer_address{width:100%; text-align:center;} .footer_form{width:100%; margin:0px;} .F_addressul{ margin:0px auto; float:none;} .footer_address ul.F_addressul li{ float:none; display:inline-block; width:81%;} .footer_address ul.F_addressul li a{ float:left;} .footer_logos{ text-align:left;} .footer_form h1{ text-align:center; padding-top:40px;} .footer_form form label{ display:none;} .footer_form form input{ width:99.5%;} input.m-input.hide{ display:none;} .footer_form form input.phone_long{width: 219px;} .footer_form form input{ padding-left:0px; text-indent:5px; } .footer_form form textarea{ width:99.5%; padding-left:0px; text-indent:5px;} #captchaimg{margin:0px auto; text-align:center;} #captchaimg img{ width:95px;} p.mobile-capcha{ display:block; text-align:center;} .footer_form form p.mobile-capcha img{ float:none; text-align:center;} .footer_form form .mobile-capcha span{ width:170px;} .footer_form form p input{width:66%; margin:0px;} .footer-section{float:none;width: 100%; text-align:center;} .footer-2{position:relative; top:183px; margin-bottom:16em} .fb-page.fb_iframe_widget{ width:277px;} /*-----------Services Page------------*/ .header-banner-services{background:url(../images/header-banner-services-2.jpg) no-repeat; background-size:100vw; margin-top:15.2em; height:79vw;} .header-banner-services .project_contact_inner{width: 100%; right:auto; top:61%;} .header-banner-services .header-banner-text{width:76%; top:35%;} .header-banner-realisation{background:url(../images/header-banner-realisation-2.jpg) no-repeat; background-size:100vw; margin-top:15.2em; height:80vw;} .header-banner-realisation .project_contact_inner{width: 100%; right:auto; top:55%;} .header-banner-realisation .header-banner-text{width:76%; top:35%;} .header-banner-contact{background:url(../images/header-banner-realisation-2.jpg) no-repeat; background-size:100vw; margin-top:15.2em; height:77vw;} .header-banner-contact .project_contact_inner{width: 100%; right:auto; top:60%;} .header-banner-contact .header-banner-text{width:76%; top:35%;} .header-banner-entreprise{background:url(../images/header-banner-entreprise-2.jpg) no-repeat; background-size:100vw; margin-top:15.2em; height:77vw;} .header-banner-entreprise .header-banner-text {width:75%; right:auto; top:35%;} .header-banner-entreprise .project_contact_inner{width:100%; top:57%; right:auto;} .soumission-btn{width:40vw; text-align:center; margin:0px auto;} .header-banner-text h3{font-size:4vw; letter-spacing:0px; height:7vw; line-height:8vw;} .header-banner-text p{font-size:3vw; letter-spacing:2px; margin-top:1.5vw;} #finition{background: url(../images/finition-solage-bg.gif) no-repeat left top; height:auto;padding-top:44px; background:none;} #finition-2{background: url(../images/finition-solage-bg.gif) no-repeat center center; height:147px; padding-top: 68px; background-size:cover; clear:both;} #finition .container{ width:100% !important; margin:0px auto; text-align:center; padding-bottom: 24px; background: rgba(0,0,0, .5);padding-top: 32px;} .services h1{font-size: 24px;} .services p{font-family: "Times New Roman", Times, serif; font-size: 12px; color: #d7d7d7; line-height:18px; width:80%; margin:10px auto auto auto;} #finition-content{background:url(../images/plus-icon-2.png) no-repeat; width:35px; height:35px; margin:5px auto -10px auto; display: block;} #finition-content img{display:none;} #revetements{padding-left:0px;padding-top: 68px; background:none; margin-top:0px; height:auto;} #revetements-content{background:url(../images/plus-icon-2.png) no-repeat; width:35px; height:35px; margin:5px auto -10px auto; display: block;} #revetements-content img{display:none;} #revetements .container{ width:100% !important; margin-left:0px !important;padding-bottom: 24px; text-align:center; background: rgba(0,0,0, .5);padding-top: 32px;} #revetements-content-container .container{ width:100%;} #revetements-2{background: url(../images/services/services-img-02.jpg) no-repeat left top; height:147px; padding-top: 68px; background-size:cover; clear:both;} #stucco{padding-top: 68px; background:none; margin-top:0px; height:auto;} #stucco .container{ width:100% !important; text-align:center; margin:0px auto;background: rgba(0,0,0, .5);padding-top: 32px;padding-bottom: 24px; } #stucco-content{background:url(../images/plus-icon-2.png) no-repeat; width:35px; height:35px; margin:5px auto -10px auto; display: block;} #stucco-content img{display:none;} #stucco-2{background: url(../images/services/services-img-03.jpg) no-repeat right top; height:147px; padding-top: 68px; background-size:cover; clear:both;} #recouvrement{padding-top:0px; background:none; margin-top:0px; height:auto;} #recouvrement .container{ width:100% !important; text-align:center; margin:0px auto !important;background: rgba(0,0,0, .5);padding-top: 32px;padding-bottom: 24px;} #recouvrement-2{background: url(../images/services/services-img-04.jpg) no-repeat right top; height:147px; padding-top: 68px; background-size:cover; clear:both;} #agregat{padding-top:0px; background:none; margin-top:0px; height:auto;} #agregat .container{ width:100% !important; text-align:center; margin:0px auto !important;background: rgba(0,0,0, .5);padding-top: 32px;padding-bottom: 24px;} #agregat-content{background:url(../images/plus-icon-2.png) no-repeat; width:35px; height:35px; margin:5px auto -10px auto; display: block;} #agregat-content img{display:none;} #agregat-2{background: url(../images/services/services-img-05.jpg) no-repeat left top; height:147px; padding-top: 68px; background-size:cover; clear:both;} #tirage{padding-top:0px; background:none; margin-top:0px; height:auto;} #tirage .container{ width:100% !important; text-align:center; margin:0px auto !important;background: rgba(0,0,0, .5);padding-top: 32px;padding-bottom: 24px;} #tirage-content{background:url(../images/plus-icon-2.png) no-repeat; width:35px; height:35px; margin:5px auto -10px auto; display: block;} #tirage-content img{display:none;} #tirage-2{background: url(../images/services/services-img-06.jpg) no-repeat right top; height:147px; padding-top: 68px; background-size:cover; clear:both;} #recouvrement-content{background:url(../images/plus-icon-2.png) no-repeat; width:35px; height:35px; margin:5px auto -10px auto; display: block;} #recouvrement-content img{display:none;} #recouvrement-content-container .container{width:90%; margin:0px auto;} #revetements-content-container .container{width:90%; margin:0px auto;} #finition-content-container .container{width:90%; margin:0px auto;} #stucco-content-container .container{width:90%; margin:0px auto;} #agregat-content-container .container{width:90%; margin:0px auto;} #tirage-content-container .container{width:90%; margin:0px auto;} #recouvrement-content-container .services-items .services-qoute{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; color:#fff; text-align:center;} #recouvrement-content-container .services-items p{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; text-align:center;} #revetements-content-container .services-items .services-qoute{ font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; color:#fff; text-align:center;} #revetements-content-container .services-items p{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; text-align:center;} .services-qoute{border-left:none !important;} .border-bot{border:2px solid red; width:80px; margin:0px auto 16px auto; clear:both;} #finition-content-container .services-items .services-qoute{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; color:#fff; text-align:center;} #finition-content-container .services-items p{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; text-align:center;} #stucco-content-container .services-items .services-qoute{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; color:#fff; text-align:center;} #stucco-content-container .services-items p{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; text-align:center;} #agregat-content-container .services-items .services-qoute{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; color:#fff; text-align:center;} #agregat-content-container .services-items p{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; text-align:center;} #tirage-content-container .services-items .services-qoute{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; color:#fff; text-align:center;} #tirage-content-container .services-items p{font-size:12px; letter-spacing:1px; line-height:18px; margin:0px 15px; text-align:center;} #recouvrement-content-container .gallery_boxes{margin:0 auto; width:303px; float:none;} #recouvrement-content-container .gallery_box{width:90%; margin:15px;} #revetements-content-container .gallery_boxes{margin:0 auto; width:303px; float:none;} #revetements-content-container .gallery_box{width:90%; margin:15px;} #finition-content-container .gallery_boxes{width:303px; margin:0px auto; float:none;} #finition-content-container .gallery_box{width:90%; margin:15px;} #stucco-content-container .gallery_boxes{margin:0 auto; width:303px; float:none;} #stucco-content-container .gallery_box{width:90%; margin:15px;} #agregat-content-container .gallery_boxes{margin:0 auto; width:303px; float:none;} #agregat-content-container .gallery_box{width:90%; margin:15px;} #tirage-content-container .gallery_boxes{margin:0 auto; width:303px; float:none;} #tirage-content-container .gallery_box{width:90%; margin:15px;} #finition-content-container .gallery_box{border:0px;} #stucco-content-container .gallery_box{border:0px;} #agregat-content-container .gallery_box{border:0px;} #tirage-content-container .gallery_box{border:0px;} #revetements-content-container .gallery_box{border:0px;} #recouvrement-content-container .gallery_box{border:0px;} .services-container .gallery_box span{background:url(../images/service_gallery_border_mobile.png) no-repeat left top !important; width:288px !important; height:288px !important; left:-8px !important; top:-5px !important;} .services-container .gallery_box a{top:42% !important;} /*-----------Realisation Page------------*/ .gallery_text{width:100%;} .gallery_text h3{font-size:14px;} .gallery_text p{font-size:12px; line-height:18px; margin:20px 0;} /*-----------Entreprise Page------------*/ .cont_topred .title{width:100%; float:none; font-size:16px; margin:4% 0 4% 0; font-weight:bold;} .cont_topred p{font-size:14px; line-height:18px;} .icon{width:100%;} .icon p{font-size:13px; color:#ffffff;} .icon-title{text-align:center;} .icon-title h3:after{left:100px; position:relative;} .icon-title h3{width:188px; border-bottom:3px solid #b90000; margin:0px auto;} .icon-container {padding:20px 20px 40px 20px; margin-top:-1px;} .icon-container{display:none;} .mobile-enterprise{display:block !important;} .image-caption{display:none;} .image-caption h1{font-size:16px; line-height:16px;} .image-caption h2{font-size:12px; line-height:15px;} .owl-carousel .owl-wrapper-outer, .owl-carousel{padding:0px;} .cont_topred_bottom .container{padding:0px; width:90%; margin:45px auto;} .icon-eye, .icon-star, .icon-hand, .icon-flag{background-position:center top;} .icon-eye:hover, .icon-star:hover, .icon-hand:hover, .icon-flag:hover{background-position:center -74px;} /*-----------Contact Page------------*/ .contact-container{padding:0px;} .contact-left{width:100%; text-align:center;} .contact-details{padding:20px 0; width:90%; margin:0px auto; text-align:center;} .contact-details li{float:left; width:100%; text-align:left;} .contact-right{width:100%; text-align:center;} .contact-details a.quebec{display:block; width:50%; float:right;} .contact-details a.fright{display:block; width:50%; float:right;} .image-caption-contact{right:2%; left:2%; width:90%; padding:15px; text-align:center;} .image-caption-contact h1{font-size:16px; line-height:16px;} .image-caption-contact h2{font-size:12px; line-height:15px; margin:0 0 20px 0;} .image-caption2{display:block;} .dds{width:167px; margin:25px auto;} .dds a{color:#fff; font-size:10px; text-transform:uppercase; border:1px solid #fff; padding:12px; font-weight:bold;} .fb-button.pull-left{float:none; width:124px; margin:0px auto;} .contact-form{ background-image:none; padding:0px 20px;} .contact-form-container{padding:30px 0; width:100%;} .contact-form-container h1{text-align:center;} .contact-form-container input.input-md{width:94%; margin-right:0px;} .contact-form-container input{width:94%; margin-right:0px; float:left;} .mhide{display:none;} }