/*****************************************************************
    Responsive
*****************************************************************/


/*****************************************************************
    Tablet
*****************************************************************/
@media (max-width: 1315px) {
    /*.wrapper { width: 95%; }
    #ZCmsContent .wrapper { width: 95%; }*/
    /*Fix for horizontal scrolling*/
    .wrapper { width: auto; }
    #ZCmsContent .wrapper { width: auto; }

    #Header li .menu-blue { font-size: 12px; font-family: 'Open Sans'; padding: 0 5px; }
        #Header li .menu-blue:hover, #Header li .menu-blue.active { font-size: 12px; }
    #Header li .no-hover { padding-left: 10px; padding-right: 10px; }
    #Header .space { width: 10px; }
    #Header.closed .wrapper { width: 100%; }
    #HomePage .slogan h2 { margin-top: 36px; }
    #HomePage .slogan h3 { margin-bottom: 0; }
    #HomePage .box { height: 160px; line-height: 160px; }
        #HomePage .box img { max-width: 100%; max-height: 100%; height: auto; width: auto; }
        #HomePage .box.box-orange { max-width: 100%; }
    #HomePage .section.products .description-box .text { width: 100%; }
    #HomePage .box .icon { margin-top: 20px; }
    #HomePage .section .typegray.gray-section h2 { margin-left: 10px; }

    #About .flexslider .flex-direction-nav .flex-next { top: 36%; }
    #About .flexslider .flex-direction-nav .flex-prev { top: 36%; }

    #ProductsCategoriesPage .wrapper { width: 100%; }

    .brand-slider .flex-direction-nav .flex-prev { left: 0; }
    .brand-slider .flex-direction-nav .flex-next { right: 0; }
    .brand-slider .flex-direction-nav a { margin-top: -36px; }

    #About .wrapper { padding: 0 10px; }
    #About h2 { font-size: 25px; }
    #About .flexslider img { border-radius: 10px; max-width: 470px; }
    #About .flexslider { width: 479px; height: auto; }

    .icon.icon-second-line { background: url('/Content/app/images/sprites.png') -309px -212px; }
    .icon.icon-line-left { background: url('/Content/app/images/sprites.png') -365px -212px; position: absolute; top: 0; }
    .icon.icon-line-right { background: url('/Content/app/images/sprites.png') -60px -259px; }
}

/*****************************************************************
    Medium Devices
*****************************************************************/
@media (max-width: 991px) {

    #AccountIndexSection .prod { padding-right: 10px; }
    #Products .prod { padding-right: 10px; }

    #ProductsDetailPage .make-margin { padding-right: 0; }
    #ProductInfosTable thead { display: table-header-group; }
    #ProductsDetailPage .related-product { padding-right: 0; margin-left: 0; margin-right: 0; }
    #AccountIndexPage form .col-md-6 .col-md-6 { padding-right: 0; padding-bottom: 5px; }
}

@media (max-width: 900px) {

    .marg-left { margin-left: 0; }
    .section.section-announcement h2 { display: block; text-align: center; }
    .section-header .section-header-bottom p { width: 82%; font-size: 16px; margin-top: 12px; }
    .icon.icon-shop-btn { display: none; }
    .section .zcmsdoor.visible-door { display: none; }
    #LoginModal .modal-dialog { width: 95%; }
    .hideHighlights { display: none; }

    #Header { display: none; }
    #Header-Mobile { display: block; font-family: 'Open Sans'; position: fixed; top: 0; width: 100%; z-index: 20; }
        #Header-Mobile .logo { margin-left: 34%; display: block; background: url('/Content/app/images/sprites.png') -611px -5px; width: 168px; height: 40px; z-index: 11; position: relative; margin-top: 10px; }
        #Header-Mobile .list-icon { position: absolute; z-index: 12; top: 0; right: 0; }
            #Header-Mobile .list-icon li { display: inline-block; padding: 15px; }
                #Header-Mobile .list-icon li a .fa { position: relative; font-size: 26px; top: 6px; }
    #ZCmsContent { margin-top: 60px; }

    #MobMenuBtn { background: #333333; padding: 9px 20px; font-size: 30px; cursor: pointer; text-transform: none; display: block; color: #008DD2; width: 100%; position: absolute; top: 0; margin: auto; }
    #MobMenu { display: none; background: #333333; margin: 0; text-align: left; padding: 10px 20px; }
        #MobMenu li { display: block; padding: 0 !important; font-size: 13px; font-weight: 700; }
            #MobMenu li a { display: block; color: white; text-transform: uppercase; font-size: 16px; line-height: 45px; }
                #MobMenu li a:hover { color: #008DD2; }

    #AccountIndexPage .wrapper { margin: 0; }

    #HomePage .logo { display: none; }
    #HomePage .section.presenter { display: block; min-height: 299px !important; }
    #HomePage .section .icon-arrow { display: none; }
    #HomePage .slogan { display: block; margin-top: 100px; padding-right: 0; text-align: center; width: 100%; }
        #HomePage .slogan h3 { text-align: center; }
    #HomePage .backgroung-pic { max-height: 300px; height: auto; }
    #HomePage .box { display: none; }
    #HomePage .quality { width: 55%; display: inline-block; float: left; }
    #HomePage .section.products .col-md-5 { display: none; }
    #HomePage .section.products .col-md-7 { width: 100%; text-align: center; }
    #HomePage .section.products .description-box { width: 100%; float: left; display: inline-block; }
        #HomePage .section.products .description-box .text p { font-size: 16px; }
    #HomePage .section.products .menu-products h3 { text-align: left; }
    #HomePage .section.an-recent .col-md-4 { width: 100%; }
    #HomePage .section.an-recent .part-center { font-size: 26px; }
    #HomePage .hideHighlights { display: none; }
    #HomePage .section.products .description-box .btn { text-align: center; display: block; }

    #Products h2 { position: relative; font-size: 20px; top: 15px; }
    #ProductsDetailPage .icon-custom-ball { display: none; }

    #Products .section.section-announcement h2 { display: block; padding-top: 30px; text-align: center; }
    #ProductInfosTableZone .rotative { height: 285px; }

    #ProductsDetailPage .related-product .prod-desc h5 { font-size: 12px; }
    #Products.productsDetailPage .wrapper { margin: 0 10px; }

    #ProductsCategoriesPage .wrapper { width: 100%; }
    #ProductsCategoriesPage .icon-custom-ball { display: none; }
    #ProductsCategoriesPage h4 { padding: 30px 0; font-size: 26px; font-family: 'Open Sans'; }

    #Products .no-results { width: 100%; margin: 0; }

    #Products .detail .col-md-6 { width: 100%; float: left; display: inline-block; }
    #Products .cenas { display: none; }
    #ProductsDetailPage .related-product-brand { display: none; }

    #About .flexslider { width: 100%; height: auto; }
    #About .col-md-4 { width: 100%; margin-bottom: 10px; }
    #About .row > .allow-padding { width: 100%; }
    #About .graycircle { width: 150px; height: 150px; line-height: 146px; }

    #ContactForm .col-md-5 { width: 100%; text-align: center; display: inline-block; }
    #ContactForm .col-md-7 { width: 100%; text-align: center; display: inline-block; }

    #Footer .footer-top .col-md-3 { width: 50%; display: inline-block; float: left; margin-bottom: 10px; }
    #Footer .center { padding: 0; }
        #Footer .center ul { margin-right: 0; }
    #Footer .footer-bottom .copyright { width: 100%; text-align: center; }
    #Footer .footer-bottom .menu { display: none; }

    .icon.icon-line-left { display: none; }
    .icon.icon-line-right { display: none; }
}

@media (max-width: 767px) {
    #AccountIndexPage .bg-gray-effect { display: none; }
    #AccountIndexPage .bg-gray { text-align: center; }
        #AccountIndexPage .bg-gray ul { display: table; width: 100%; }
            #AccountIndexPage .bg-gray ul li { margin: 0; padding: 0; display: table-cell; }
                #AccountIndexPage .bg-gray ul li .style-cat { margin: 0; padding: 0; }
                #AccountIndexPage .bg-gray ul li:last-child .icon-arrow-cat { right: unset; left: -10px; -moz-transform: rotateZ(180deg); -ms-transform: rotateZ(180deg); -o-transform: rotateZ(180deg); -webkit-transform: rotateZ(180deg); transform: rotateZ(180deg); }
    #AccountIndexSection .tab-content { padding: 15px; }
    #AccountIndexSection .icon-custom-ball { display: none; }
    #AccountIndexSection .prod { width: 100%; padding: 0; display: block; background-color: #F5F5F5; }
        #AccountIndexSection .prod .prod-brand { display: none; }
        #AccountIndexSection .prod .prod-photo { width: 30%; display: inline-block; float: left; }
        #AccountIndexSection .prod .icon-vertical-line { display: none; }
        #AccountIndexSection .prod .prod-desc { display: inline-block; width: 68%; float: right; }
            #AccountIndexSection .prod .prod-desc h5 { font-size: 14px; padding-right: 10px; }
}

/*****************************************************************
    Smartphones
*****************************************************************/
@media (max-width: 600px) {
    #ZCmsContent .section-header .wrapper { margin: 5px; display: block; }
    .padding20 { padding: 0; }
    .section.section-announcement h2 { font-size: 20px; }
    .section-header { padding-top: 30px; }
    #Products .section-header h2 { height: auto; }
    .section-header .section-header-bottom p { display: none; }
    .section-header .sub-menu { left: 0; right: auto; position: relative; top: auto; bottom: -45px; }
    .section-header .icon-trans-arrow { display: none; position: absolute; bottom: -58px; left: 75px; }
    .section-header .icon-ticket { margin: 0; }
    .section-header .icon-tool { margin: 0; }

    #Header-Mobile .logo { background: url('/Content/app/images/sprites.png') -22px -374px; width: 116px; height: 28px; margin-top: 10px; margin-left: 35%; }
    #Header-Mobile .list-icon li { padding: 5px 10px; }
        #Header-Mobile .list-icon li a { display: inline-block; height: 28px; width: 25px; }
    #ZCmsContent { margin-top: 48px; }

    #MobMenuBtn { font-size: 22px; }


    #HomePage .quality { padding-top: 100px; padding-bottom: 100px; width: 75%; }
        #HomePage .quality h2 { font-size: 26px; }
        #HomePage .quality h3 { font-size: 20px; }
    #HomePage .section.section-top-fix { display: none; }
    #HomePage .section.products .menu-products li a { margin-bottom: 5px; }
    #HomePage .section .menu-products .col-md-4 { width: 100%; float: left; display: inline-block; margin-bottom: 10px; }
    #HomePage .section .menu-products .col-md-8 { width: 100%; float: left; display: inline-block; }
    #HomePage .section.an-recent .recent { margin-bottom: 0; }
        #HomePage .section.an-recent .recent .col-md-6 { width: 100%; float: left; display: inline-block; margin-bottom: 82px; }
    #HomePage .section.an-recent .text h3 { display: block; margin: 0; padding-top: 10px; padding-bottom: 8px; padding-left: 10px; text-align: left; font-size: 13px; }
    #HomePage .section.an-recent .text p { display: block; margin: 0; margin-left: 10px; font-weight: 300; font-size: 12px; }
    #HomePage .section.an-recent .text-style { width: 100%; }
    #HomePage .section.an-recent .back-style { height: auto; max-height: 750px; margin-top: 0; }
        #HomePage .section.an-recent .back-style .col-md-5 { width: 91%; padding-bottom: 20px; }
    #HomePage .section.an-recent .ad-description { width: 100%; display: inline-block; }
    #HomePage .section.an-recent .left-line { margin-bottom: 30px; }
    #HomePage .section.an-recent .text { position: absolute; }
    #HomePage .section.an-recent .left-line .icon { display: none; }
    #HomePage .section.an-recent .left-line.active .icon { z-index: 1; display: none; }
    #HomePage .section.an-recent .left-line:hover .icon { z-index: 1; display: none; }
    #HomePage .section.products .description-box h2 { font-size: 38px; }
    #HomePage .section.an-recent .left-line.active .calendar-box { position: relative; z-index: 2; border: 3px red solid; background-color: #3399FF; }
    #HomePage .section.an-recent .left-line.active .text h3 { margin-left: -3px; background-color: #3399FF; color: white; }
    #HomePage .backgroung-pic { max-height: 310px; height: 300px; }
    #HomePage .slogan { margin-top: 60px; }
    #HomePage .section.an-recent .line-style.line-blue { display: none; }
    #HomePage .section.an-recent .line-style.line-orange { display: none; }

    #Products h2 { font-size: 24px; }

    #Products .line-bottom.line-right .icon-ball { display: none; }
    #Products .line-bottom { position: relative; padding: 30px 0; padding-left: 160px; border-bottom: 0 #CBCBCB solid; border-right: 0 #FFF solid; text-align: left; }
        #Products .line-bottom.line-custom { padding: 0; border-right: 0 #CBCBCB solid !important; line-height: 0; height: 50px; }
        #Products .line-bottom.line-right { padding: 0; text-align: left; border-right: 0 #CBCBCB solid; }
        #Products .line-bottom.col-md-6 { padding: 0; width: 100%; display: inline-block; float: left; margin-left: 0; line-height: 94px; }
    #Products .lab_item { padding: 0; display: block; position: static; margin-left: 25px; }
    #Products h3 { margin-right: 0; padding: 0; }
    #Products .lab_item2 { padding: 0; display: block; position: static; margin-left: 25px; }
    #Products .orange { margin: 0; float: left; margin-left: 150px; }
    #Products .blue { margin: 0; float: left; margin-left: 150px; }
    #Products .line-bottom h2 { text-align: center; position: absolute; top: -44px; left: 0; right: 0; margin: auto; font-family: 'Open Sans'; }
    #Products .prod-brand { display: none; }
    #Products .prod { width: 100%; padding: 0; display: block; background-color: #F5F5F5; }
    #Products .prod-photo { width: 30%; display: inline-block; float: left; }
    #Products .prod .icon-vertical-line { display: none; }
    #Products .prod .prod-desc { display: inline-block; width: 68%; float: right; }
    #Products .bg-gray-effect { width: 100%; float: left; display: block; }
    #Products .prod .prod-desc h5 { font-size: 14px; padding-right: 10px; }
    #Products .style-cat:hover .icon-arrow-cat, #Products .style-cat.active .icon-arrow-cat { display: none; }
    #Products .bg-gray { width: 100%; float: left; display: inline-block; }
    #Products .col-md-9 { width: 100%; float: left; display: inline-block; }
        #Products .col-md-9 img { max-width: 100%; }
    #Products .mobile { display: none; }
    #Products .gray { color: #CBCBCB; text-align: left; width: 100%; position: relative; }
    #Products .style-cat { margin-left: -645px; }
    #Products .children { padding-left: 20%; }
    #Products .pagination { display: block; margin-left: 0; text-align: center; }
    #ProductsCategoriesPage { padding: 0 10px; }
        #ProductsCategoriesPage .sub-category-cards { padding: 10px 0; }
        #ProductsCategoriesPage .navigation-xs { padding: 10px 0; margin-left: 0; }
        #ProductsCategoriesPage h4 { margin-left: 0; }

    #Brands .col-md-4 { width: 100%; float: left; display: inline-block; }
    #Brands .col-md-3 { width: 100%; display: inline-block; margin: auto; }
    #Brands .brand { width: 100%; }

    #About h1 { font-size: 32px; }
    #About .body p { margin-left: 0 !important; text-align: center !important; }
    #About .center-do { margin: auto; width: 100%; text-align: center; }
    #About p { margin-left: 0; }
    #About .col-md-6 { width: 100%; float: left; display: inline-block; }
    #About .graycircle { width: 90px; height: 90px; line-height: 90px; }
        #About .graycircle img { max-width: 60px; }
    #About .inline { display: block; width: 100%; text-align: center; margin-bottom: 25px; }


    #ProductsDetailPage .product-name h3 { font-size: 22px; }
    #ProductsDetailPage .product-name .col-md-8 { width: 100%; float: left; display: inline-block; }
    #ProductsDetailPage .product-name .col-md-4 { width: 100%; float: left; display: inline-block; }
    #ProductsDetailPage .make-margin { width: 100%; float: left; display: inline-block; }
    #ProductsDetailPage .col-md-4 { width: 100%; float: left; display: inline-block; }
    #Products .nav-back { float: left; }

    #Footer .left p { display: none; }
    #Footer .footer-top { padding-top: 20px; }
        #Footer .footer-top .col-md-3 { width: 100%; display: inline-block; float: left; margin-bottom: 10px; text-align: center; }
    #Footer .footer-bottom .menu { display: none; }
    #Footer .left { width: 100%; display: block; text-align: center; margin-bottom: 15px; }
        #Footer .left .logo { margin: auto; margin-bottom: 15px; }
    #Footer .center { width: 100%; display: block; text-align: center; margin-bottom: 15px; }
        #Footer .center ul { margin: auto; margin-bottom: 15px; text-align: left; }
    #Footer .social { display: block; }
    #Footer .contacts { display: block; width: 100%; text-align: center; }
        #Footer .contacts .right { display: inline-block; width: 100%; margin-bottom: 15px; }
            #Footer .contacts .right h4 { margin-bottom: 5px; }
    #Footer .footer-bottom .footer-style { text-align: center; }
        #Footer .footer-bottom .footer-style .copyright { width: 100%; display: block; margin: auto; }

    #Footer .right h3 { display: none; }
    .icon.icon-line { display: none; }
    .icon-ticket { background: url('/Content/app/images/sprites.png') -723px -278px; width: 67px; height: 50px; }
    .icon-tool { float: right; width: 62px; height: 62px; background: url('/Content/app/images/sprites.png') -650px -278px; }
    #Footer .footer-bottom .footer-style .col-md-2 { text-align: center; width: 100%; margin-top: 10px; }
}