/* --------------------------- PC -------------------------------------------------------------------------------------------  */
@media all and (max-width: 1050px) {
    .desktop {display: none;}
    .tablet, .mobil-tablet {display: initial;}
    .eshop-hp-banner {display: none;}            
    
    #hlavicka .kosik {position: relative; display: block; width: 100%; margin-bottom: 0px; top: 0px; margin-top: 10px;}

    .obchod.detail .produkt .informace {max-width: 100%; }
    .obchod.detail .produkt .prolistovat {position: relative; width: 180px; margin-top: 30px; margin-left: 60px; padding-left: 22px;}
    .obchod.detail .produkt .parametry {position: relative; margin-top: 30px; }

    .navigace-procesem li {display: block; width: 100%; margin-bottom: 2px; text-align: left; padding-left: 90px !important;}
    .navigace-procesem li.kosik {background: url('img/proces_1.png') no-repeat 20px 7px rgb(236,235,242); }
    .navigace-procesem li.kosik.aktivni {background: url('img/proces_1_akt.png') no-repeat 20px 7px rgb(124,191,29); color: white;}
    .navigace-procesem li.udaje {background: url('img/proces_2.png') no-repeat 20px 7px rgb(236,235,242);}
    .navigace-procesem li.udaje.aktivni {background: url('img/proces_2_akt.png') no-repeat 20px 7px rgb(124,191,29); color: white;}
    .navigace-procesem li.dokonceni {background: url('img/proces_3.png') no-repeat 20px 7px rgb(236,235,242);}
    .navigace-procesem li.dokonceni.aktivni {background: url('img/proces_3_akt.png') no-repeat 20px 7px rgb(124,191,29); color: white;}

    .kosik-prihlaseni  {padding-top: 20px; padding-bottom: 20px;}
    .kosik-prihlaseni  a {display: inline-block;}
    .kosik-prihlaseni span {display: block; margin-top: 10px; margin-bottom: 0;}
}

/* --------------------------- TABLET ---------------------------------------------------------------------------------------  */
@media all and (max-width: 970px) {

    #nav {position: relative; background: rgb(242,242,242);}

    #hlavicka .kosik {display: none;}
    .obchod.detail .hodnoceni .rozdelovnik {display: block; color: white;}
    .obchod.detail .hodnoceni a.vlastni {padding-left: 0px;}
    #nav {margin-bottom: 0px;}
    .obchod.detail .produkt .stitek {margin-top: 10px;}
    #obsah.eshop {margin-top: 15px;}

    .kosik.krok2 .sekce .leva {width: 100%;  }
    .kosik.krok2 .sekce .prava {width: 100%;  }
    .kosik.krok2 .sekce.firemni .leva {width: 100%; }
    .kosik.krok2 .sekce.firemni .prava {width: 100%; }
    .kosik.krok2 .sekce.firemni .obchodni-jmeno {width: 91%; }
    .kosik.krok2 .sekce.firemni .platceDPH {display: block; float: none; margin-top: 0px; }

    .kosik.krok3 .sekce .leva {width: 100%;  }
    .kosik.krok3 .sekce .prava {width: 100%;  }
    .kosik.krok3 .sekce.firemni .leva {width: 100%; }
    .kosik.krok3 .sekce.firemni .prava {width: 100%; }
    .kosik.krok3 .sekce.firemni .obchodni-jmeno {width: 91%; }
    .kosik.krok3 .sekce.firemni .platceDPH {display: block; float: none; margin-top: 0px; }

    .kosik.krok3 .levy {width: 100%; float: none; margin-right: 0px;}
    .kosik.krok3 .pravy {width: 100%; float: none;}


    .obchod.detail .produkt .parametry {width: 100%; position: relative; }
    .obchod.detail .produkt .parametry td {width: 50%; }
    .obchod.detail .popis {margin-top: 30px;}

    .kosik .poznamka {margin-bottom: 0 !important; padding-bottom: 0 !important;}
    .kosik .poznamka-info {padding-top: 5px; padding-left: 20px; padding-right: 20px; padding-bottom: 25px; padding-top: 0 !important; margin-top: 0 !important;}

    .kosik.krok2 .ares {display: none}
}

/* --------------------------- TABLET ---------------------------------------------------------------------------------------  */
@media all and (max-width: 750px) {
    .obchod.detail .produkt .btn {display: inline-block; margin-top: 10px;}    
    .obchod.detail .produkt .cena span {padding-right: 15px;}
   
    .obchod.kosik .obrazek, .kosik.krok3 .obrazek {display: none;}
    .obchod.kosik .moznosti, .kosik.krok3 .moznosti  {display: none;}
    .obchod.kosik .btnPokracovat {position: relative; right: 0; float: right; background: rgb(124,191,29); color: white; border: none; cursor: pointer; display: block; margin-top: 10px;} 

    .kosik.krok2 .sekce.firemni .platceDPH {margin-top: 0;}
}


/* --------------------------- MOBIL ---------------------------------------------------------------------------------------  */
@media all and (max-width: 500px) {
    .desktop, .tablet {display: none;}
    .mobil, .mobil-tablet {display:initial;}
    .desktop-tablet {display: none !important;}
        
    .obchod.kosik .cenaCelk, .kosik.krok3 .cenaMJ {display: none;}
    .obchod.kosik .produkt {width: 100%; border: none; border-bottom: 1px solid rgb(217,217,217); color: rgb(77,77,77); padding: 20px; margin-bottom: 20px; padding-left: 0; padding-right: 0;}
    .obchod.kosik .produkt .mnozstvi a, .obchod.kosik .produkt .mnozstvi span {padding-top: 6px; padding-bottom: 6px; padding-left: 10px; padding-right: 10px; border: 1px solid rgb(204,204,204);}

    .kosik.krok2 .sekce.firemni .platceDPH {margin-top: 0;}
    .kosik.krok2 .ares2 span {padding-left: 20px;}

}