/*
device screen height 	      web site safe area
                              width 	height
iphone portrait (480 px) 	 310 px 	352 px
iphone landscape (320 px) 	 468 px 	202 px
ipad portrait (1024 px) 	 750 px 	920 px
ipad landscape (768 px)     1010 px 	660 px
screen : 768 px              989 px 	548 px
screen : 800 px             1245 px 	580 px
screen : 864 px             1117 px 	644 px
screen : 900 px             1405 px 	680 px
screen : 1024 px            1245 xp 	775 px
screen : 1050 px            1645 px 	825 px
screen : 1080 px            1885 px 	860 px
screen : 1200 px            1885 px 	980 px
screen : 1440 px            2525 px 	1220 px
*/



@media screen and (max-width: 1250px) {
    body#pageid-1 div#header  {
        background-size: auto 100%;
    }
    div#header diw.shadow  {
        width: 100%;
    }
}


@media screen and (max-width: 1000px) {
    div#main, #footer, .wrapper {
        width: 100%;
    }
    .eshop-order-step-info a,
    .eshop-order-step-info a .no-mobile {
        display: none;
        margin-right: 0px;
    }
    .eshop-order-step-info a.sel {
        display: block;
    }
    .eshop-order-step-info a span.mobile {
        display: inline;
    }
}

@media screen and (max-width: 900px) {
    
     a.mobile-menu {
        display: block;
        z-index: 100;
        right: 50px;

        position: absolute;
        top: 40px;
        background-color: #A60505;
        
    }

    div#lng-switch {
        right: 50px;
        top: 10px;
    }

    div.mobile-menu-content {
        position: absolute;
        width: 100%;
        top: 90px;
        z-index: 100;
        text-align: center;
    }

    div.mobile-menu-content a {
        display: block;
        font-size: 1.5em;
        color: #fff;
        background: #A60505;
        border-bottom: 1px solid #ccc;
        padding: 5px;
    }
    div.mobile-menu-content a:first-child {
        border-top: 1px solid #ccc;
    }

    div#menu-main {
        display: none;
    }
        
    div#left {
        display: none;
    }

    div#header a#logo {

        left: 50px;
    }
    div#header  div.header-picture {
        margin-top: 130px;
    }

    div#header .contact {
        top: 90px;
        left: 0px;
        right: auto;
        width: 100vw;
        text-align: center;
    }

    div#header div.slogan {
        padding-top: 100px;
    }
}

@media screen and (max-width: 750px) {


    div#header div.slogan {
        width: 100%;
    }
    div#header div.slogan > div:nth-child(1),
    div#header div.slogan > div:nth-child(2) {
        text-align: center;
    }

    .div-products-sort {
        display: none;
    }
    .div-web-search-input .form-text {
        width: 300px;
    }
    .div-web-search-input {
        top: 75px;
        left: 10px;
        right: auto;
        position: absolute;
        
    }
    .div-web-search-input .quicksearchResult {
        left: 0px;
    }

    #eshop-basket-content-little, #eshop-basket-content-little-link {
        top: 10px;
    }
    
    
    
    #left {
        display: none;
    }
    
    #menu-main > div {
        display: none;
        position: absolute;
        top: 50px;
        background: #464646;
        z-index: 1500;
    }
    #menu-main > div a {
        display: block;
        padding: 15px 30px;
        white-space: nowrap;
    }
    #menu-main > div a:hover {
        background: #222;
    }
    #menu-main > div a.sel {
        border: 0px;
        background: #222;
    }

    div#footer, div.pocitadla {
        background-size: auto 100%;
    }
    #footer .inner > div:nth-child(1),
    #footer .inner > div {
        float: none;
        display: block;
        width: 100%;
        padding-bottom: 20px;
        margin-bottom: 20px;
        text-align: center;
        border-bottom: 2px solid #555;
    }
    #footer .inner > div:last-child {
        border-bottom: 0px;
        margin-bottom: 0px;
        padding-bottom: 0px;
    }
    #footer .inner > div a {
        background: none;
    }

    div#footer > .inner {
        box-sizing: border-box;
    }

    div#footer > .inner > div {
        width: 100%;
        display: block;
        box-sizing: border-box;
    }

    div.showtrailbox {
        display: none;
    }
}

@media screen and (max-width: 580px) {

    .eshop-product.preview {
        width: 48%;
        margin-right: 1%;
    }

    .eshop-product.preview2 .price {
        right: 10px;
        top: 30px;
    }
    .eshop-product.preview2 .order-form {
        top: 80px;
    }


    .div-web-search-input {
        top: 110px;
        left: calc(50% - 140px);
    }
    .div-web-search-input .form-text {
        width: 250px;
    }
    .div-web-search-input .quicksearchResult {
        width: 450px;
        left: -100px;
    }

    div.module-text-content table td {
        display: block;
        text-align: center;
        width: 100%;
        box-sizing: border-box;
    }
}

@media screen and (max-width: 520px) {
    
    div#header .contact > div {
        display: block;
    }

    div#header .slogan {
        bottom: 0px;
    }

    div.instagram-feed a {
        widtH: 48%;
    }

    div#header div.icons > div,
    .pocitadla .content > div {
        float: none;
        width: 100%;
        margin: 0px 0px 50px 0px;
    }
}



@media screen and (max-width: 480px) {
    .eshop-product.preview2 .parameters {
        display: none;
    }
    
    .div-web-search-input .quicksearchResult {
        width: 320px;
        left: -30px;
    }


    form#barber div.arrow-down input[type="radio"] {

        left: 20px;
    }
    form#barber div#barber .item label {
        padding: 40px 20px 40px 140px;
        text-align: left;
        display: block;
        position: relative;
    }
    form#barber div#barber div.item:first-child label {
        padding-top: 25px;
    }
    form#barber div#barber .item label > img {
        left: 60px;
    }
    


}


@media screen and (max-width: 360px) {

    div.instagram-feed a {
        widtH: 98%;
    }

    div#header div.header-picture {
        height: 33vw;
    }

    .eshop-product.preview {
        width: 100%;
        margin-right: 0%;
    }
}

