/*****************************************************************
    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: 1000000; line-height: 50px; font-size: 1.7em; position: fixed; left: 0; right: 0; top: 0; }
    #HeaderMobile .top { padding: 0 15px; background-color: #2a353c; z-index: 2; }
        #HeaderMobile .top > .toggle i,
        #HeaderMobile .top > .toggle.active i.opened { display: inline-block; }
            #HeaderMobile .top > .toggle i.opened,
            #HeaderMobile .top > .toggle.active i { display: none; }
                #HeaderMobile .top > .toggle.active i.opened { display: inline-block; }
        #HeaderMobile .top > .header-logo { display: inline-block; }
        #HeaderMobile .top > a { color: white; }
        #HeaderMobile .top .btn { color: white; font-size: 16px; text-transform: uppercase; text-decoration: none; }
    #HeaderMobile > ul { position: relative; z-index: -1; font-size: 14px; display: none; padding: 0 0 15px; background-color: #eee; box-shadow: 0 2px 2px 0 rgba(0,0,0,0.25); width: 100vw; max-height: 100vh; margin-top: -50px; overflow: auto; }
        #HeaderMobile > ul li a { display: block; padding: 8px 25px; color: black; text-transform: uppercase; }
        #HeaderMobile > ul li.area { display: inline-block; background-color: #2a353c; color: #F0F0F0; font-size: 14px; font-weight: bold; width: 50%; float: left; text-align: center; margin-bottom: 20px; box-shadow: 0 2px 2px 0 rgba(0,0,0,0.25); }
            #HeaderMobile > ul li.area a { padding: 20px 0; background-color: #2a353c; color: #F0F0F0; }
            #HeaderMobile > ul li.area.active a { }
            #HeaderMobile > ul li a.active,
            #HeaderMobile > ul li.active a,
            #HeaderMobile > ul li.area.active a { color: #ff4e00; }

        #HeaderMobile > ul .search-menu { padding-right: 0; padding-left: 0; border: none; background: none; position: relative; }
        #HeaderMobile > ul li.search { padding: 0 25px 10px; }
            #HeaderMobile > ul li.search .form-control { background-color: #fff; border: 1px solid #ccc; border-radius: 0; box-shadow: none; }
                #HeaderMobile > ul li.search .form-control:focus { background-color: #fff; border: 1px solid #ff4e00; }
            #HeaderMobile > ul li.search .btn { border: 1px solid #ccc; border-left: none; border-radius: 0; box-shadow: none; -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; }
                #HeaderMobile > ul li.search .form-control:focus + span .btn,
                #HeaderMobile > ul li.search .btn:focus { border: 1px solid #ff4e00; border-left: none; }
            #HeaderMobile > ul li.search .search-results { background-color: #f8f8f8; border: 1px solid #ccc; border-top: none; margin-top: -2px; text-transform: none; }
                #HeaderMobile > ul li.search .search-results p { padding: 12px 12px; color: #2a353c; }
                #HeaderMobile > ul li.search .search-results a { color: #2a353c; }


body.home-page .box-slogn-inicio > span { display: none; }


@media (max-width: 1200px) {
    .section-inicio.new .background { background-size: unset; }
    .container-inicio { padding-bottom: 40px; }
        .container-inicio + .background .container-inicio { padding: 0 20px 100px; margin-top: -100px; margin-bottom: -140px; }
    .box-areas-inicio { margin-top: 160px; }
}

/*****************************************************************
    Tablets
*****************************************************************/
@media (max-width: 1024px) {
    body { overflow-x: hidden; }
        body .wrapper { width: 100% !important; display: block; }
        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; }
    body .zcmsdoor, body zcmscontent-options { display: none !important; }
    /* TODO */
}

@media (max-width: 991px) {
    body { overflow-x: hidden; }
        body .wrapper { width: 100% !important; display: block; }
        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; }
    body .zcmsdoor, body zcmscontent-options { display: none !important; }
    /* TODO */
    .section-inicio.new .background { }
    .container-inicio + .background .container-inicio { padding: 80px 20px 140px; margin-top: -130px; margin-bottom: -140px; }
    .box-areas-inicio { margin-top: 100px; }

    #Header .menu { padding: 0 10px; }
    #Header .menu_item { padding: 4px 3px; font-size: 11px; line-height: 17px; }
    #Header .menu > form { right: 30px; top: 0; bottom: 0; background: #2a353c; text-align: left; padding: 0 25px; }

    .w-container { max-width: 750px; }
    .brand { padding: 30px 15px; }

    [id^="ZCmsContent"] > .zcmscontent-item.row > [class^="col-"] { margin: 15px 0; }
    #HomeContent [id^="ZCmsContent"] > .zcmscontent-item.row:first-child > [class^="col-"] { float: left; width: 50%; text-align: left; }
        #HomeContent [id^="ZCmsContent"] > .zcmscontent-item.row:first-child > [class^="col-"]:nth-of-type(2n+1) { text-align: right; }
        #HomeContent [id^="ZCmsContent"] > .zcmscontent-item.row:first-child > [class^="col-"] > figure { display: inline-block; max-width: 220px; }


    #Footer .box-certification img { text-align: center; }


    #ZCmsContent10 > .zcmscontent-item:last-child,
    #ZCmsContent10 > .zcmscontent-item:nth-last-child(2) { margin-bottom: 0; text-align: center; }
        #ZCmsContent10 > .zcmscontent-item:last-child p:first-child,
        #ZCmsContent10 > .zcmscontent-item:nth-last-child(2) p:first-child { display: none; }
        #ZCmsContent10 > .zcmscontent-item:last-child figure,
        #ZCmsContent10 > .zcmscontent-item:nth-last-child(2) figure { max-width: 100%; margin: 0 auto; }
    #ZCmsContent10 > .zcmscontent-item:nth-last-child(3) h2 { text-align: center; }
}

@media (min-width: 768px) and (max-width:992px) {
    #ZCmsContent10 > .zcmscontent-item:last-child > div,
    #ZCmsContent10 > .zcmscontent-item:nth-last-child(2) > div { width: 50%; float: left; }
}

/*****************************************************************
   Medium Devices 
*****************************************************************/
@media (max-width: 767px) {
    [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; }
        body.home-page { padding: 0; }
    #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 */
    .box-header-top.new3 { text-align: center !important; padding: 0 !important; }
    .box-row-language { text-align: center; }

    .section-inicio.new .background { }
    .container-inicio + .background .container-inicio { padding: 60px 20px 0; margin-top: -30px; margin-bottom: 0; }
    .modal { top: 50px; }

    #HomeContent .aplicao_docs .doc .w-col-1 { width: 8.33333333%; text-align: center; }
    #HomeContent .aplicao_docs .doc .w-col-11 { width: 91.66666667%; }

    #HomeContent .box-portfolio .w-col { width: 50%; float: left; text-align: center; }
    #HomeContent .box-portfolio .portfolio_item { display: inline-block; margin: 0 auto 20px; width: auto; max-width: 180px; }

    #HomeIndex .link-text-areas.news { float: none; margin-left: 0; display: block; text-align: center; }

    #HomeContentGalery { margin-right: 0; }
    #Header .menu-icons { display: none; }
    #HomeNotices { margin: 0; }
        #HomeNotices .slide { margin-bottom: 15px; }
    .home_row.home3 { margin-left: 0; margin-right: 0; }
        .home_row.home3 .w-col { padding-left: 15px; padding-right: 15px; }

    .news_row .headings.bottom { line-height: 32px; }
    .news_row .newshome, .newshome { margin-top: 10px; }

    body .w-col-6,
    body .col-md-6 { margin-bottom: 25px; }
    body .w-container { max-width: unset; padding: 15px 30px; }
        body .w-container.large { max-width: unset; padding: 0; }

    body.home-page .container-inicio { padding-top: 50px; }
    body.home-page .box-logo-inicial { max-width: 100%; }
    body.home-page .box-areas-inicio { text-align: center; margin-top: 50px; }
    body.home-page .box-link-ceramics.white.new.big { width: 100%; height: 100px; }
    body.home-page .box-language-inicio.color { width: 100%; }
    body.home-page .box-language-total { float: none; display: inline-block; text-align: left; }
        body.home-page .box-language-total .box-title-inicio { text-align: center; }
        body.home-page .box-language-total .box-row-language { color: #aaa; }
    body.home-page .box-slogn-inicio { width: auto; }
        body.home-page .box-slogn-inicio img { display: none; }
        body.home-page .box-slogn-inicio > span { display: inline-block; font-size: 24px; font-weight: bold; font-style: italic; color: white; line-height: 1.3; -webkit-font-smoothing: antialiased; text-shadow: rgba(0,0,0,.01) 0 0 1px; }
            body.home-page .box-slogn-inicio > span span { color: #f84b01; }


    #HomeNotices, #HomeNotices .slides, #HomeNotices .slides li { display: block; }

    #Footer > .w-container { padding: 0; }
    #Footer .box-footer { padding: 4px 15px; }
    #Footer .link-text-areas.news .box-text-footer { width: auto; display: inline-block; float: left; padding-right: 10px; }
    #Footer .box-social { top: unset; }
    #Footer .fooder-sitemap { margin-bottom: 0; padding: 15px; }
    #Footer .box-title-sitemap { font-size: 14px; font-weight: bold; }
    #Footer .text-sitemap { font-size: 14px; }
    #Footer .box-certification a { width: unset; float: unset; }
    #Footer .zenn { float: none; display: block; padding-top: 10px; text-align: center; }

    body .notice .notice-text { padding-left: 30px; padding-right: 30px; }

    #HomeContacts .zcmscontent-area { text-align: center; }

    .menu_item.aplicacao.seg { display: inline-block; width: 100% !important; float: left; margin: 5px 0 !important; font-size: 14px; }
    .sub-menu-fornor:after { content: ' '; clear: both; }

    body .zcmscontent-area figure.hdr { }
        body .zcmscontent-area figure.hdr img { max-width: unset !important; height: 100%; position: absolute; }
        body .zcmscontent-area figure.hdr figcaption { position: relative; height: unset; width: unset; padding: 5px; }
            body .zcmscontent-area figure.hdr figcaption h2 { font-size: 18px; line-height: 24px; }

    #HomeContacts .zcmscontent-item h3 br { display: none; }
    #HomeContacts .hero_text.menor { height: auto; position: relative; left: unset; top: unset; right: unset; bottom: unset; display: block; margin: auto; padding: 25px; font-size: 24px; line-height: 36px; }
    #HomeContacts .box-seg-banner.newfoto { height: auto; overflow: hidden; }
        #HomeContacts .box-seg-banner.newfoto img { max-width: unset !important; height: 100%; position: absolute; }
    #HomeContacts .aplicao_menu { position: relative; }
        #HomeContacts .aplicao_menu .menu_item.aplicacao.seg { display: inline-block; float: none; text-align: center; width: auto !important; }

    .box-portfolio { padding: 20px 15px; }

    #ZCmsContent10 { }
        #ZCmsContent10 > .zcmscontent-item:last-child,
        #ZCmsContent10 > .zcmscontent-item:nth-last-child(2) { margin-bottom: 0; text-align: center; }
            #ZCmsContent10 > .zcmscontent-item:last-child > div,
            #ZCmsContent10 > .zcmscontent-item:nth-last-child(2) > div { margin: 0; }
                #ZCmsContent10 > .zcmscontent-item:last-child > div > :last-child,
                #ZCmsContent10 > .zcmscontent-item:nth-last-child(2) > div > :last-child { padding-bottom: 35px; }

    .box-areas-inicio { margin-top: 80px; margin-left: 0 !important; margin-bottom: 0 !important; }
    .box-language-total { max-width: 100% !important; }
    body.home-page .box-language-total { float: none; display: inline-block; text-align: left; margin-bottom: 0px; min-width: 250px !important; }
    .box-language-inicio.color{min-width: 250px;}
    .news_box.notice { }
        .news_box.notice .notice-photo { position: absolute; width: 75px; height: 75px; padding: 0; margin-left: 15px; }
            .news_box.notice .notice-photo > div { height: 75px !important; }
        .news_box.notice .notice-text { width: 100%; height: unset; min-height: 75px; padding: 0 20px 0 100px; }
            .news_box.notice .notice-text .newshome { margin-top: 0; padding-top: 5px; }
            .news_box.notice .notice-text .paragraph { display: none; }

    #HomeContent [id^="ZCmsContent"] > .zcmscontent-item.row:first-child > [class^="col-"] > figure { max-width: 220px; margin: 0 auto; }
}


/*****************************************************************
    Smartphones
*****************************************************************/
@media (max-width: 479px) {
    [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; }
    #LoginModal .modal-dialog { width: auto; margin: 15px; }
    #BasketModal .modal-dialog { width: auto; margin: 15px; }
    /* TODO */
    .hero_text { font-size: 28px; line-height: 37px; }
    #HomeBanners { height: 300px; }
        #HomeBanners .slides .slide { height: 300px; }

    body .w-container { max-width: unset; padding: 15px 15px; }

    .container-inicio + .background .container-inicio { padding: 120px 20px 0; margin-top: -80px; margin-bottom: 0; }
    body.home-page .box-areas-inicio { margin-top: 25px; margin-bottom: 15px; }
        body.home-page .box-areas-inicio .w-col-6 { margin-bottom: 15px; }
    body.home-page .box-slogn-inicio { padding-top: 25px; padding-bottom: 25px; }

    #HomeContacts .hero_text.menor { height: auto; position: relative; left: unset; top: unset; right: unset; bottom: unset; display: block; margin: auto; padding: 10px; font-size: 24px; line-height: 36px; text-align: center; }
    #HomeContacts .aplicao_menu { position: relative; padding: 0; display: table; width: 100%; }
        #HomeContacts .aplicao_menu .menu_item.aplicacao.seg { display: table-cell; float: none; text-align: center; width: auto !important; }

    #HomeContent .aplicao_docs .doc .w-col-1 { width: 12%; text-align: center; }
    #HomeContent .aplicao_docs .doc .w-col-11 { width: 88%; }

    #HomeContent .box-portfolio .w-col { width: 100%; float: left; text-align: center; }

    #HomeContent [id^="ZCmsContent"] > .zcmscontent-item.row:first-child > [class^="col-"] { float: left; width: 100%; margin: 5px 0; text-align: center; }
        #HomeContent [id^="ZCmsContent"] > .zcmscontent-item.row:first-child > [class^="col-"] > figure { display: block; max-width: 220px; margin: 0 auto; }
}

@media (max-width: 400px) {
    #HeaderMobile .top { padding: 0 5px; }

    #Footer .box-certification { text-align: center; }
    #Footer .footer_down { margin-top: 50px; }
    #Footer .box-social { right: 0; left: 0; text-align: center; }

    #HomeContent .aplicao_docs .doc .w-col-1 { width: 15%; text-align: center; }
    #HomeContent .aplicao_docs .doc .w-col-11 { width: 85%; }
}