/*Imports */
@import url(spinbox.css);


body {
    background: #fff;
    color: #6f7072;
    font-size: 120%
}

body.login .container {
    background: #FFF;
    padding-bottom: 80px
}

h1 {
    margin-top: 0;
    font-weight: normal
}

#intro-banner {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 270px
}

#intro-banner img {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

#intro-banner h1 {
    display: none;
    margin: 0;
    padding: 0
}

#intro-banner #introZalozky {
    position: absolute;
    top: 225px;
    left: 0;
    right: 0;
    height: 21px;
    width: 200px;
    z-index: 1000;
    margin-left: auto;
    margin-right: auto;
}

#intro-banner #introZalozky li {
    float: left;
    list-style: none
}

#introZalozky a {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #CCC;
    margin: 0 10px 0 0
}

#introZalozky a.active {
    text-decoration: none;
    background: #FFF;
    color: #fff
}

#intro-banner img {
    position: absolute;
    z-index: 10;
    top: 5px;
    left: 5px
}

.obrCont a {
    margin: 0 !important;
    padding: 0 !important;
    display: inline !important
}

.obrCont a img {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none
}

.obrHandler {
    overflow: hidden;
    width: 170px
}

.obrHandler div {
    width: 1000px
}

.highslide-wrapper {
    margin: -30px auto auto 50px !important
}

#my-cont {
    padding: 0;
    margin: 0;
    width: 700px !important;
    overflow: hidden !important;
    border: solid 3px #333
}

#okno {
    position: relative;
    padding: 0;
    margin: 0 !important
}

#okno div {
    margin: 0 !important;
    padding: 0 !important
}

#okno img {
    margin: 0;
    padding: 0;
    display: block
}

#okno a {
    display: inline-block;
    padding: 0 !important
}

.zavreni-okna {
    position: absolute;
    top: 0;
    right: 0
}

.ajax-inner {
    padding: 0 15px 10px
}

#okno .obsah-okna {
    padding: 20px !important
}

table {
    width: 100%
}

/* Tabulka kosik */
.red {
    color: #c21c1d
}

.old {
    display: none
}

.w30 {
    width: 30px
}

.w100 {
    width: 100px
}

.w200 {
    width: 200px
}

.w150 {
    width: 150px
}

.w170 {
    width: 170px
}

table.kosik {
    margin-bottom: 0;
    width: 100%
}

table.kosik th {
    background: #dedede;
    border: solid 1px #eaeaea;
    padding: 5px;
    vertical-align: middle
}

table.kosik td {
    padding: 5px;
    height: 2em;
    vertical-align: middle
}

table.kosik td img {
    margin: 0 5px 0 0
}

table.kosik tr.odd td {
    background: #f2f2f3;
    border: solid 1px #eaeaea
}

table.kosik tr.even td {
    background: #eaeaea;
    border: solid 1px #eaeaea
}

table.kosik td input {
    width: 35px;
    display: block;
    margin: 0 auto
}

table.kosik td input.button {
    width: 60px;
    margin: 0 3px 0 0;
    display: inline-block
}

/* Tabulka kosik */

/*  OBECNE TRIDY */

.cb {
    clear: both
}

.tc {
    text-align: center
}

.tl {
    text-align: left
}

.tr {
    text-align: right
}

.fl {
    float: left
}

.fr {
    float: right
}

.w50 {
    width: 50px
}

.button {
    background: black;
    border: 1px solid black;
    padding: 3px 8px;
    display: inline-block;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    font-weight: 400;
    font-size: 1em
}

#login {
    text-align: center
}

#login input {
    padding: 8px 15px;
    margin: 5px
}

#header {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#panel-limity {
    padding-left: 10px;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

#panel-limity a span {
    font-weight: bolder;
    font-size: 120%;
}

#limity a {
    color: #c21c1d
}

#kosik div {
    margin: auto;
    padding: 5px 10px 0 5px;
}

#kosik a {
    color: black;
    font-weight: bold;
    width: 40px;

}

#kosik a.fa-heart {
    color: #CC0000;
}

/* Prosor s logem, vyhledavanim, logem, kosikem */
#top {
    margin: 0;
    padding: 0;
    background: #FFF;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    flex: 1;
    height: 80px;
}

#search {
    padding: 0;
    float: none;
    width: 100%;
}

#search .form-group {
    padding: 0;
    width: 100%;
    margin-right: 0;
    border: 1px solid;
    border-radius: 5px;
}

#search .inp {
    border: none;
    float: left;
    height: 40px;
    line-height: 44px;
    width: 190px;
    color: black;
    background: transparent;
    padding: 8px;
}

#search input.button {
    width: 67px;
    display: block;
    float: right
}

#search input {
    background: transparent;
    border: none
}

#search .input-group-addon {
    background: transparent;
    border: none
}

/* Strom - hlavni uroven */
#menu {
    background: #FFF;
    min-height: 42px;
    border-bottom: solid 5px #c21c1d;
    font-size: 140%;
    max-width: 1200px
}

#menu .container {
    width: 500px;
    float: left;
    padding: 0;
    margin: 0
}

#menu div {
    padding: 0 0
}

#menu ul {
    margin: 0 0 0 -1px;
    padding: 0
}

#menu li {
    list-style: none;
    float: left
}

#menu li a:hover {
    color: #c21c1d;
    background: #FFF;
    display: inline-block;
    text-decoration: none
}

#menu li ul {
    position: absolute;
    left: -999em;
    height: auto;
    z-index: 999;
    color: #FFF;
    background: #c21c1d;
    margin: 0;
    padding: 0;
    float: none
}

#menu li li {
    width: 100%;
    border: none
}

#menu li li a {
    color: #FFF;
    float: none;
    width: 100%;
    text-transform: normal;
    border: 0;
    height: auto;
    font-weight: normal;
    line-height: 1.2em;
    display: block;
    padding: 3px 10px
}

#menu li li a:hover {
    background: #FFF;
}

#menu li li ul {
    display: none
}

#mobilMenu {
    float: right;
    margin-left: 15px
}

a#menu-admin:hover {
    background: black;
    color: #FFF;
    display: inline-block;
    text-decoration: none
}

/* Cesta */
.path {
    padding: 0 0 0 5px;
    font-size: 0.917em;
    margin: 0 0 8px
}

.path a {
    color: #6f7072
}

#left li.active {
}

#left li.active a {
    color: #FFF
}

/* Levy sloupec */
#left h2 a {
    color: black;
    font-size: large;
}

#left h2 a:hover {

}

#left h1 {
    font-size: 130%;
    font-weight: bold;
    padding: 10px 15px
}


.aktuality {
    background: #f1dede;
    margin: -10px 0 0 -40px;
    padding: 5px 15px;
    margin-bottom: 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.aktuality h4 {
    font-weight: normal !important;
    font-size: 110%;
    font-weight: bold
}

.aktuality a {
    color: #c21c1d;
}

.akt {
    margin: -20px 0 0;
    font-size: 85%
}

#dotaznik h4 {
    margin-bottom: .1em
}

#dotaznik ul {
    margin: 0;
    padding: 0
}

#dotaznik ul li {
    list-style: none;
    padding: 4px 10px;
    background: #f1dede;
    margin-bottom: 2px
}

#dotaznik ul li input {
    margin: 2px 5px 0 0
}

#dotaznik select {
    padding: 4px 4px;
    margin-right: 10px
}

#dotaznik textarea {
    padding: 4px 4px;
    font-family: sans-serif;
    box-sizing: border-box;
    width: 100%
}

#dotaznik .otazka {
    border: solid #c21c1d 1px;
    padding: 0px 20px 20px;
    margin: 20px 0 10px
}

#dotaznik .otazka .cislo {
    display: block;
    margin: -15px 0 0;
    text-align: center;
    float: left;
    width: 100%
}

#dotaznik .otazka .cislo span {
    background: #c21c1d;
    color: #FFF;
    font-weight: bold;
    padding: 4px 10px;
    margin: 0 auto;
    display: inline-block
}

#panel-prihlaseni li.active {
    color: #FFF !important
}

#panel-prihlaseni li small {
    margin: 6px 5px 0;
    display: block
}

/* Doklady Filtr */
.filtr {
    background: #f2f2f3;
    padding: 15px;
    margin-bottom: 25px
}

.filtr input {
    float: left;
    margin: 8px 5px 10px 0
}

.filtr ul {
    padding: 0;
    margin: 0
}

.filtr ul li {
    clear: both;
    list-style: none;
    padding: 0;
    margin: 0
}

.filtr ul li a {
    color: #231f20;
    padding: 3px 10px 3px 0;
    display: block;
    text-decoration: none !important
}

.filtr ul ul {
    margin: 0 0 0 15px
}

.filtr ul li ul li a {
    font-weight: 400
}

.filtr h4 {
    margin: 15px 0 5px
}

.filtr input {
    margin-top: 5px
}

.filtr label {
    float: left;
    line-height: 30px;
    padding: 0;
    text-align: left;
    margin: 0 5px 0 0
}

/* Oblibene produkty */
.oblibene {
    background: #f2f2f3;
    padding: 15px;
    margin-bottom: 25px
}

.oblibene ul li {
    clear: both
}

.oblibene ul li a {
    color: #231f20;
    padding: 3px 10px 3px 0;
    display: block;
    text-decoration: none !important;
    font-weight: 600
}

.oblibene h4 {
    margin: 15px 0 5px
}

/* Obsah */
#middle {
    max-width: 1200px;
    margin: 25px auto;
    padding: 0
}

.fnpanel {
    clear: both;
    height: 22px;
    line-height: 22px;
    margin-bottom: 22px
}

.fnpanel a {
    color: #6f7072
}

.fnpanel a.active {
    color: black;
    font-size: 110%;
    font-weight: bold;
    text-decoration: underline;
}

.fnpanel p {
    text-align: right
}

.fnpanel .fr {
    font-size: 130%;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    margin-top: -1px;
    margin-left: -1px;
}

.fnpanel .fr span {
    outline: 1px solid; /* use instead of border */
    margin-top: 1px;
    margin-left: 1px;
    background-color: white;
    color: black;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
}

.fnpanel .fr span.dots {
    outline-style: none;
}

.fnpanel .fr span a {
    color: black;
    line-height: 30px;
}

.fnpanel .fr span.active {
    background-color: black;
}

.fnpanel .fr span.active a {
    color: white;
}


#top-fnpanel p {
    display: none
}

/* Produkt vypis */
#cont .produkt {
    float: left;
    padding: 0 0 0 1%;
}

@media (min-width: 768px) {
    #cont .produkt {
        width: 25%;
    }
}

.prod {
    padding: 0;
    margin: 0 0 10px;
    display: inline-block;
    position: relative;
    display: inline-block;
    /*background: #cdcece;*/
    width: 100%
}

.prod table {
    width: 100%;
    font-size: 105%;
    line-height: 1.4em
}

.prod img {
    width: 100%;
}

.prod h3 {
    text-align: center;
    color: #231f20;
    font-size: 140%;
    display: block;
    height: 2.6em;

}

.prod h3 a {
    color: black
}

.prod .info {
    padding: 10px;
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid #6f7072;
}

.prod .info .info1, .info2 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.prod .info .info1 span {
    color: #666666;
    line-height: 20px;
    font-weight: bolder;
}

.info2 span.left {
    color: black;
    font-weight: bold;
    font-size: 110%;
    line-height: 31px;
}

.info2 span.right {
    display: flex;
    flex-direction: row;
}

.prod .detail-odkaz {
    position: relative;
    text-decoration: none;
    font-weight: bold;
    color: #FFF;
    display: block;
    font-size: 120%;
    /*border-bottom: 1px solid #6f7072;*/
}

.prod .detail-odkaz .stitek-sleva {
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 78px;
    height: 48px;
    background: url("/img/bkg-pikt.png") no-repeat 0 0;
    text-align: right;
    line-height: 58px;
    box-sizing: border-box;
    padding-right: 2px;
}

.prod .button {
    float: right;
    padding: 4px 15px
}

.prod4 {
    margin-right: 0
}

.prod .barvy {
    height: 24px
}

.prod table, .prod table td {
    margin: 0;
    border: none;
    padding: 2px 0
}

.prod .barva {
    width: 12px;
    height: 12px;
    border: solid 1px #aaa;
    display: inline-block;
    margin: 5px 5px 5px 0
}

.prod .hover {
    display: none
}

.prod:hover .hover {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../img/prod-hover.png") repeat-x 0 0
}

.prod:hover .hover .dostupnost {
    position: absolute;
    top: 15px;
    right: 15px;
    display: block;
    width: 15px;
    height: 16px;
    background: url("../img/sklad.png") no-repeat 0 0
}

.prod:hover .hover .button {
    display: block;
    width: 140px;
    margin: 60px auto 40px
}

.prod:hover .hover .predbVyber {
    color: #FFF;
    width: 105px;
    background: url("../img/oblibene.png") no-repeat 0 0;
    padding-left: 36px;
    line-height: 1.1em;
    margin: 15px auto
}

.prod input {
    padding: 4px 3px;
    margin: 0 0 0 2px
}

.nborder, .nborder td, nborder th {
    border: none
}

/* Detail informace */
#detail-produktu {
    margin-top: 20px;
}

.detailTable {
    width: 100%
}

#detailImg .stitek-sleva {
    position: absolute;
    bottom: -1px;
    right: 0px;
    width: 147px;
    height: 91px;
    background: url("/img/bkg-pikt-detail.png") no-repeat 0 0;
    text-align: right;
    line-height: 130px;
    box-sizing: border-box;
    padding-right: 10px;
    font-size: 230%
}

#detailInfo span {
    color: black;
}

#detailKatalog {
    font-size: 120%;
    color: #6f7072 !important;
    padding-bottom: 10px;
    margin-right: auto;
    font-weight: bold;
}

#detailPopis {
    font-size: 130%;
    min-height: 150px;
    padding-bottom: 10px;
}

#detailPopis {
}

#detailCena {
    border: solid 1px #bababa;
    width: 100%
}

#detailCena td {
    padding: 10px 15px

}

#detailCena input {
    width: 30px
}

#detailCena .button {
    width: auto
}

#detail-kosik {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

#detail-kosik button span {
    color: white;
    font-size: 150%;
}

#detail-jednotka {
    line-height: 40px;
    margin: 0;
    font-size: 110%;
}


#detailObrazky img {
    border: solid 1px #bababa
}

#detailPripojene img {
    float: left;
    margin: 15px 15px 15px 0;
    display: inline
}

.detail-fav {
    display: flex;
    align-items: center;
    height: 40px;
    margin-right: 10px;
}

.detail-master-cart {
    display: flex;
    align-items: center;
    height: 40px;
    margin-right: 10px;
}

.detail-master-cart .button {
    padding: 8px 15px;
    margin: 0 5px;
    display: inline-block;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    font-weight: 400;
    font-size: 1.2em;
}


/* Tabulka variant Detail produktu*/
table {
    margin-bottom: 5px;
    width: 100%
}

table th {
    background: #dedede;
    border: solid 1px #eaeaea;
    padding: 5px
}

table.varianty th div {
    height: 2em
}

table td {
    padding: 5px;
    vertical-align: middle;
    border: solid 1px #eaeaea
}

table.varianty tr.odd td {
    background: #f2f2f3;
    border: solid 1px #eaeaea
}

table.varianty tr.even td {
    background: #eaeaea;
    border: solid 1px #eaeaea
}

table.varianty td input {
    width: 35px;
    display: block;
    margin: 0 auto
}

#cont .buttonVarianty {
    float: left;
    margin: 0 20px 30px 0;
    background: #ee1c25;
    border: 1px solid #ee1c25;
    padding: 8px 15px;
    display: inline-block;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    font-weight: 400;
    font-size: 1.2em
}

#cont .buttonVarianty:hover {
    background: #ff000b
}

/* Tabulka doklady */
table.tableDoklady {
    width: 100%;
    background: #FFF;
    border: solid 10px #FFF;
    font-size: .9em;
    margin-bottom: 1em
}

table.tableDoklady th {
    border: none;
    border-bottom: 2px solid #dddddd;
    padding: 3px 5px;
    vertical-align: middle;
    color: #231f20;
    font-weight: 600
}

table.tableDoklady td {
    border: none;
    border-bottom: 1px solid #dddddd;
    font-size: .85em;
    padding: 3px 5px;
    vertical-align: middle
}

#cart {
    margin: 55px 0 0;
    float: right;
    width: 200px;
    height: 72px;
    background: url("../img/kosik.png") no-repeat 0 0
}

#cart .inner {
    padding-left: 70px
}

#cart span {
    display: block
}

#hlavniObrazek {
    margin: 0 0 25px;
    float: left
}

#infoDetail {
    float: right;
    width: 56%
}

#infoDetail table {
    width: 100%
}

table.ceny {
    margin: 18px 0;
    font-size: 1.2em
}

#registrace label, #formular label, .formular label, #regFormUzivatel label {
    width: 150px;
    float: left;
}

#registrace input, .formular input, #regFormUzivatel input {
    text-align: left !important;
    width: 200px
}

/* COOKIES */
.cc_container {
    background: #c2c2c2 none repeat scroll 0 0 !important;
    color: #000 !important;
    text-align: left !important;
}

.cc_container .cc_btn {
    background-color: #FFF !important;
    display: inline-block !important;
    text-align: left;
    float: none !important;
}

.cc_container .cc_message {
    float: left !important;
    padding-left: 20px !important;
}

.cc_container .cc_logo {
    display: none !important;
}

.cc_container .cc_btn:hover {
    background-color: #FFFF00 !important;
}

.sub::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

.pre::before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

#menu-shop {

}

#menu-panel-login {
    display: flex;
    flex-direction: row;
    justify-content: right;
}

#menu-shop ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-transform: uppercase;
}

#menu-shop ul li {
    float: left;
}

#menu-shop ul li a {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 4px 16px;
}

/*#menu-shop ul li a:hover {*/
/*	background-color: white;*/
/*	color: black;*/
/*}*/

#menu-shop ul li ul {
    display: none;
    position: absolute;
    background-color: black;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}


#menu-shop ul li ul a {
    color: black;
    padding: 12px 16px;
    /*text-decoration: none;*/
    display: block;
    text-align: left;
}

#menu-shop ul li a.sub::after {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f107";
}


#menu-shop ul li ul a:hover {
    /*background-color: #F1F1F1;*/
}

#menu-shop ul li:hover ul {
    display: block;
}

#menu-shop ul li:hover ul li {
    display: block;
    float: none;
}

#search .input-group {
    display: flex;
}

#searchQuery {
    flex: 1;
}

#search .input-group button {
    flex: 0;
    border: none;
    background-color: white;
}

.fav, .nofav {
    font-size: 200%;
    color: #CC0000;
    line-height: 31px;
    width: 24px;
    height: 27px;
    display: inline-block;
}

.fav:hover, .nofav:hover {
    text-decoration: none;
}

.fav::after {
    content: url(/img/hearth_solid.svg);
}

.nofav::after {
    content: url(/img/hearth_regular.svg);
}

.vypis-produkt-kosik button {
    background-color: white;
    color: black;
    line-height: 20px;
    border-style: none;
    padding: 2px !important;
}

#breadcrumb {
    display: flex;
    flex-direction: row;
}

#breadcrumb span, a {
    color: black;
    line-height: 15px;
}

.kosik-item-actions {
    display: flex;
}

.kosik-item-actions a i {
    line-height: 39px;
    padding-left: 5px;
}