﻿/*****************************************************************
    Responsive (mobile | mediumdevice | tablet | desktop)

    <div data-responsive="desktop">Only Desktop</div>
    <div data-responsive="tablet">Only Tablet</div>
    <div data-responsive="mediumdevice">Only Small Tablet</div>
    <div data-responsive="mobile">Only Mobile</div>
    <div data-responsive="mobile-mediumdevice-tablet-desktop">All weeee</div>

*****************************************************************/
[data-responsive] { display:none; }
[data-responsive*="desktop"] { display:block; }
td[data-responsive*="desktop"],th[data-responsive*="desktop"] { display:table-cell; }

#HeaderMobile { z-index: 30; background-color:  #1e4266; line-height: 50px; font-size: 1.7em; position: fixed; left: 0; right: 0; top: 0; }
    #HeaderMobile .top { padding:0 15px; }
    #HeaderMobile .top a.logo { display:inline-block; max-width:140px; margin-left:25px;  }
    #HeaderMobile .top a.logo img{max-width:100%; }
    #HeaderMobile .top .language{font-size:22px;}
        #HeaderMobile .top a { color:#FFF; }
    #HeaderMobile ul { font-size:14px; display:none; }
        #HeaderMobile ul a { display:block; padding:10px 25px; background-color: white; color:#1e4266; text-transform:uppercase; }

/*@media (max-width: 1024px) 
{
    body:before{position: fixed;display: block;left: 0;top: 0;right: 0;bottom: 0;background: #fff;content: ' '; z-index: 999998;}
    body:after {position: fixed;top: 50px;left: 0;right: 0;content: 'A versão responsiva para esta resolução ainda não está disponível! Aceda ao website num dispositivo com um ecrã maior para visualizar :) '; margin: auto; z-index: 999999; display: inline-block;max-width: 80%;text-align: center;font-size: 24px;text-transform: uppercase;}
}*/

/*****************************************************************
    Tablets
*****************************************************************/
@media (max-width: 1230px) {
    #Header .headerBottom .btMenu {height: 100px; margin-left: -68px;}
     #Header .headerBottom .btMenu svg{max-height:100%;}
         #Header .headerBottom .logoprincipal a{max-width:250px;}
    #Header .headerBottom .logoprincipal { padding-left: 50px; padding-top: 18px; padding-bottom: 18px; }
}

@media (max-width: 1024px) {
   body { overflow-x:hidden; }
   body .wrapper { width:100% !important; display:block; padding:0 35px; }
   body img { max-width:100% !important; }
   body .flexslider { max-width:100% !important; }
   [data-responsive],td[data-responsive],th[data-responsive] { display:none; }
   [data-responsive*="tablet"] { display:block; }
   td[data-responsive*="tablet"],th[data-responsive*="tablet"] { display:table-cell; }
   #Header .headerBottom{overflow:hidden;}
    #Header .headerBottom .logoprincipal { padding-left: 50px; padding-top: 15px; padding-bottom: 10px; }
    #Header .headerBottom .logoprincipal a{max-width:200px;}
    #Header .headerBottom .logoprincipal a img{max-width:100%;}
       #Header .headerBottom .btMenu {height: 80px; margin-left: -51px; margin-right:-50px; font-size:24px !important; }
    #Footer .topPart a.logo{display:inline-block; max-width:150px;}
    #Home .infoProdText { width: 100%; display: inline-block; padding-top: 25px; padding-bottom: 36px; padding-left: 15px; }
    #Home .infoProd .subtitulo h2 { font-size: 28px; }
    #Home .ThePortfolio { padding-top: 75px; padding-bottom: 60px;  }
    .ThePortfolio .imagePort { height: 180px; position: relative; }
   body .imagemTopo { height: 150px !important; }
    #Portfolio .ThePortfolio .titulo { text-align: center; color: #254e77; margin-bottom: 25px; }
    #Portfolio .ThePortfolio .btnsPortfolio li{width:auto;}
    #Portfolio .ThePortfolio .btnsPortfolio a{padding-bottom:15px;}
}

@media (max-width: 992px) 
{
        #Header .headerBottom .logoprincipal a{max-width:150px; padding-top: 15px;}
}

/*****************************************************************
   Medium Devices 
*****************************************************************/
@media (max-width: 768px) {
   [data-responsive],td[data-responsive],th[data-responsive] { display:none; }
   [data-responsive*="mediumdevice"] { display:block; }
   td[data-responsive*="mediumdevice"],th[data-responsive*="mediumdevice"] { display:table-cell; }
   body { padding-top:50px; }
   #LoginModal .modal-dialog { margin:auto; margin-top:15px; }
   #BasketModal { top: 0; right: 0; bottom: 0; left: 0; width:auto; }
   #BasketModal .modal-dialog { margin:auto; margin-top:15px; width: 450px; }
   #BasketDetail .box-content table td, #BasketDetail .box-content table th { padding:10px; }
   #BasketDetail .box-content table .price-total { font-size:25px; }
   #BasketCheckout .basket-lines table p { height:auto; line-height:none; margin:3px 0; }
   #BasketCheckout .basket-steps .row { margin:0 !important; height:auto; line-height:normal; }
        #BasketCheckout .basket-steps .row > * { min-height:0; padding:0; }
   #BasketCheckout .basket-steps .row label { display:block; margin-bottom:5px; margin-top:15px; }
   #BasketCheckout .basket-steps h3 { margin-bottom:10px; margin-top:20px; }
   body .responsive-scroll { overflow-x:scroll; }
   /* TODO */
   #HomeContentGalery { margin-right:0; }
    body h1 { font-size: 28px; font-family: 'Oswald', sans-serif; }
    #Home .infoProd .subtitulo h2 { font-size: 22px; }
    body h2{font-size: 22px;}
    #Home .infoProd { background: white; position: relative; padding-left: 35%; }
    #Home .ThePortfolio {     background-position: 24% !important; }
    #Footer .topPart .pull-right{float:none !important; text-align:center;}
    #Footer .topPart .pull-left{float:none !important; text-align:center;}
    #Footer .topPart ul{padding-left:0; margin-top:15px; margin-bottom:0;}

        #Footer .bottomPart .pull-right{float:none !important; text-align:center;}
    #Footer .bottomPart .pull-left{float:none !important; text-align:center;}

    .zcmscontent .is-bg-grey h1 { color: #254e77; font-family: Oswald; font-size: 28px; font-weight: 500; text-align: center; }
    body .zcmscontent h2 { font-size: 22px !important; }
    #Portfolio .ThePortfolio .btnsPortfolio li{padding: 0 5px;}
}

/*****************************************************************
    Smartphones
*****************************************************************/
@media (max-width: 500px) {
   [data-responsive],td[data-responsive],th[data-responsive] { display:none; }
   [data-responsive*="mobile"] { display:block; }
   td[data-responsive*="mobile"],th[data-responsive*="mobile"] { display:table-cell; }
      body .wrapper { width:100% !important; display:block; padding:0 15px; }
   #LoginModal .modal-dialog { width:auto; margin:15px; }
   #BasketModal .modal-dialog { width:auto; margin:15px;  }
         body .zcmsdoor, body zcmscontent-options, body zcmscontentbox-options { display:none !important; }
   /* TODO */
   #CoockiesTerms{ width: 100%; max-width: 100%; left:0; bottom:0; border-top: 1px solid #DDD;}

   .imagesContent .padding-interesse{width:100%;}
    .ThePortfolio .padding-portfolio{width:100%;}
    #Portfolio .fotosPortfolio { padding-top: 50px; padding-bottom: 55px; position: relative; padding: 50px 15px; }
    #Home .ThePortfolio { background-position: 27% !important; }
    #Home .infoProd .imgProd{display:none;}
    #Home .infoProd { background: white; position: relative; padding-left: 0; }
    #Portfolio .ThePortfolio .btnsPortfolio { font-size: 14px; font-weight: bold; }
    #Home .image-support {
        height: 45px!important;
    }
    #HeaderMobile .top .language {
        font-size: 18px;
    }
}