.light_font, * {
    font-weight: 300;
}

.regular_font {
    font-weight: 400 !important;
}

.transition, #loading {
    -webkit-transition: opacity 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: opacity 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.absolute_div {
    -webkit-transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), height 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), height 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.noselect, #loading {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                     supported by Chrome and Opera */
}

* {
    font-family: 'Roboto', sans-serif;
}

body, html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    /*min-height: 768px;*/
    background-color: #f1f1f1;;
}

#bodyTable {
    overflow: hidden;
}

body #bodyTable, html #bodyTable {
    display: table;
    width: 100%;
    height: 100%;
    position: relative;
}

.uvod {
    position: fixed;
    left: 0;
    width: 100%;
    background: #4e83b4;
    z-index: 10;
    color: white;
    align-items: center;
    justify-content: center;
    flex-flow: column;
    transition: all 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
    /*min-height: 768px;*/
    display: none;
    /*display: flex;*/
    opacity: 0;
    top: 60px;

    overflow-y: auto;
    height: calc(100vh - 40px);
    padding: 20px 0px;
    min-height: unset;
}


.uvod img {
    margin-left: -25px;
    margin-bottom: 15px;
}

.uvod p, .uvod h2 {
    width: 70%;
    min-width: 300px;
    text-align: center;
    /*font-weight: 600;*/

}

.uvod h2 {
    font-style: italic;
    padding: 0 10px;
}

.bg-animation {
    opacity: 0 !important;
}

#left_bg {
    position: fixed;
    left: 0;
    bottom: 10%;
    background-size: 48%;
    width: 500px;
    height: 500px;
    background-repeat: no-repeat;
    z-index: 0;
    opacity: .5;
    -webkit-transition: opacity 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: opacity 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
}

#right_bg {
    position: fixed;
    right: 0;
    bottom: 5%;
    background-size: 48%;
    width: 500px;
    height: 500px;
    background-repeat: no-repeat;
    z-index: 0;
    background-position-x: 100%;
    background-position-y: 100%;
    opacity: .5;
    -webkit-transition: opacity 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: opacity 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
}

#loading {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: table;
    background: #4e83b4;
    z-index: 1000;
    opacity: 1;
}

#loading #loadingContainer {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

#loading #loading_text {
    color: white;
    font-size: 22px;
    letter-spacing: 2px;
    margin-top: 15px;
    margin-left: 40px;
    font-weight: 100;
    display: none;
}

#container {
    font-size: 0;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding-right: 30px;
    -webkit-transition: all 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: all 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
    padding-top: 97px;
    position: relative;
    z-index: 1;
}

.absolute_div {
    height: 340px;
    width: 340px;
    margin-left: 30px;
    margin-bottom: 30px;
    display: inline-block;
    cursor: pointer;
}

.absolute_div_init {
    height: 300px !important;
    width: 300px !important;
    /*transform: scale(0.5) !important;*/
}

/*@media only screen and (min-width: 1650px) {*/
/*.absolute_div {*/
/*height: 320px;*/
/*width: 320px;*/
/*}*/
/*}*/

/*@media only screen and (max-width: 1800px) {*/
/*    .absolute_div {*/
/*        height: 375px;*/
/*        width: 375px;*/
/*    }*/
/*}*/


@media only screen and (max-width: 1500px) {
    .absolute_div {
        height: 340px;
        width: 340px;
    }

}


@media only screen and (max-width: 1400px) {
    .absolute_div {
        height: 300px;
        width: 300px;
    }

}

@media only screen and (max-width: 1300px) {
    #bodyTable {
        display: flex !important;
    }

    .absolute_div {
        width: calc(50vw - 75px);
        height: calc(50vw - 75px);
    }

    .hideUnder1300, #left_bg, #right_bg {
        display: none !important;
    }

    body, html {
        overflow-x: unset !important;
    }


}

.absolute_div_hide {
    display: none;
}

@media (max-width: 441px) {
    #goBigCart:before {
        content: none !important;
    }
}

#add-to-cart {
    outline: none;
    border: none;
}

#add-to-cart:disabled {
    opacity: 0.3;
}

@media only screen and (max-width: 768px) {
    /*.absolute_div {*/
    /*width: 80%;*/
    /*height: 80%;*/
    /*}*/
    .qty {
        flex-flow: column;
    }

    #add-to-cart {
        width: 100%;
    }

    #cena {
        display: flex;
        justify-content: center;
        align-items: center;
        line-height: unset !important;
    }

    .uvod {
        justify-content: unset;
    }

    #cart #cena {
        padding-left: 5%;
        text-align: center;
    }

    #back-button {
        width: 100%;
    }

    .mobile-next {
        top: 109px !important;
    }

    #next-button {
        width: 100%;
    }

    .uvod {
        /*display: flex;*/
        text-align: center;
        padding-top: 25px;
    }

    .uvod p {
        width: 100%;
        font-size: 14px;
        padding: 0 20px;
        box-sizing: border-box;
    }

    .uvod h2 {
        width: 100%;
        box-sizing: border-box;
        padding: 0 20px;
    }

    .absolute_div + .margin-bottom-0 {
        margin-bottom: 30px !important;
    }

    .absolute_div {
        width: calc(100vw - 60px);
        height: calc(100vw - 60px);
    }


    .absolute_div .name {
        height: 100px !important;

    }

    .absolute_div .image {
        height: calc(100% - 100px) !important;
    }

    .hide-text-on-mobile {
        display: none;
    }

    #how-to-breed:before {
        margin-left: 6px !important;
    }

    #home:before {
        margin-left: 8px !important;
    }

    .row .col:last-child {
        margin: 0 !important;
    }

    .tabs {
        border-radius: 0 !important;
    }

    .cart-item {
        height: auto !important;
        text-align: center;
        position: relative;
        display: flex;
        flex-flow: column;
        justify-content: center;
        align-items: center;
        padding: 10px 0 0 !important;
    }

    .cart-item .texts-cont {
        padding: 0 10px !important;
    }

    .cart-item img {
        margin: 10px 0 0 !important;
    }

    .cart-item .delete-items {
        position: absolute;
        top: 0;
        right: 0;
        padding-right: 10px;
        height: 60px;
    }

    #shop-cont .card {
        flex-flow: column;
        width: 100%;
        margin: 0 auto;
    }

    .card #right {
        right: 0 !important;
        top: 60px !important;
        filter: invert(80%) !important;
        z-index: 1;
    }

    .card #left {
        left: 0 !important;
        top: 60px !important;
        filter: invert(80%) !important;
        z-index: 1;
    }

    #shop-cont .container {
        align-items: unset !important;
    }

    #content-pic-bg, .content-text {
        border-radius: 0 !important;
    }

    #content-pic-bg {
        flex: 0 0 200px !important;
    }

    #shop-cont .content-text {
        flex: 1 !important;
    }

    #contact:before {
        margin-left: unset !important;
        margin-right: unset !important;
    }

}

@media only screen and (max-width: 500px) {
    .panel-container .logo {
        margin: 10px 0 0 !important;
        line-height: 22px !important;
        height: 100% !important;
    }

    .logo span {
        display: block;
    }

    #home, #how-to-breed {
        padding: 0 5px !important;
    }
}

.absolute_div .image {
    height: 70%;
    width: 100%;
    background-size: cover;
    margin-bottom: 5px;
    position: relative;
}

.absolute_div .image .poly-cont {
    text-align: center;
    position: absolute;
    width: 100%;
    bottom: 0;
}

.absolute_div .image .poly-cont .relative-container {
    position: relative;
    width: 58px;
    height: 67px;
    margin: 0 auto -24px;
    background-image: url("/assets/polygon.png");
    display: table;
}

.absolute_div .image .poly-cont .relative-container .polygon {
    width: 58px;
    height: 67px;
    display: block;
}

.absolute_div .image .poly-cont .relative-container .icon-cont {
    display: table-cell;
    vertical-align: middle;
}

.absolute_div .image .poly-cont .relative-container .icon-cont img {
    max-height: 35px;
}

.absolute_div .image .poly-cont .relative-container-hover {
    background-image: url("/assets/polygon_m.png");
    display: none;
    position: relative;
    width: 58px;
    height: 67px;
    margin: 0 auto -24px;
}

.absolute_div .image .poly-cont .relative-container-hover .polygon {
    width: 58px;
    height: 67px;
    display: block;
}

.absolute_div .image .poly-cont .relative-container-hover .icon-cont {
    display: table-cell;
    vertical-align: middle;
}

.absolute_div .image .poly-cont .relative-container-hover .icon-cont img {
    max-height: 35px;
}

.absolute_div .name {
    height: 30%;
    width: 100%;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.absolute_div .name h1 {
    font-weight: 300;
    letter-spacing: 1px;
    color: #1fb0e6;
    font-size: 24px;
    /*margin-top: 26px;*/
    top: 0;
    position: absolute;
    left: 0;
    width: calc(100% - 20px);
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0 10px;
    line-height: 34px;

}

.absolute_div .name h2 {
    font-size: 14px;
    color: #afaeae;
    letter-spacing: 1px;
}

.absolute_div .hovered-div {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background: black;
    background: rgba(0, 0, 0, 0.51);
}

.absolute_div .hovered-div .more {
    display: table-cell;
    vertical-align: middle;
}

.absolute_div .hovered-div .more button {
    width: 125px;
    height: 38px;
    border: 2px solid white;
    background: none;
    outline: none;
    color: white;
    font-size: 16px;
    letter-spacing: 1px;
}

.absolute_div .hovered-div .more button:hover {
    background: rgba(0, 0, 0, 0.21);
}

.absolute_div .hovered-div .more button:active {
    background: rgba(0, 0, 0, 0.51);
}

.absolute_div:hover .hovered-div {
    display: table;
}

.absolute_div:hover .name {
    background: #1fb0e6;
}

.absolute_div:hover .name h1, .absolute_div:hover .name h2 {
    color: white;
}

.absolute_div:hover .relative-container {
    display: none !important;
}

.absolute_div:hover .relative-container-hover {
    display: table !important;
}

.margin-bottom-0 {
    margin-bottom: 0 !important;
}

.panel {
    width: 100%;
    height: 65px;
    background: #1b1d1d;
    position: fixed;
    top: 0;
    -webkit-box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 19px 0px rgba(0, 0, 0, 0.75);
    z-index: 6;
    border-bottom: 2px solid #1fb0e6;
}

.panel .panel-container {
    position: relative;
}

.panel .panel-container .buttons-container-left {
    position: absolute;
    left: 137px;
    top: 0;
    height: 65px;
    line-height: 65px;
    z-index: 2;
}

.panel .panel-container .buttons-container-right {
    position: absolute;
    right: 0;
    top: 0;
    height: 65px;
    line-height: 65px;
    z-index: 2;
}

.panel .panel-container h1 {
    color: #1fb0e6;
    font-size: 20px;
    line-height: 38px;
    font-weight: 800;
    letter-spacing: 1px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
    z-index: 0;
}

.panel .panel-container h1 span {
    color: white;
    font-weight: 800;
    letter-spacing: 1px;
}

.panel .panel-container #home:before {
    background: url(/tiny/home.png) no-repeat;
}

.panel .panel-container .cart:before {
    background: url(/tiny/cart.png) no-repeat;
}

#how-to-breed:before {
    background: url(/fav/favicon-32x32-old.png) no-repeat;
    width: 22px;
    height: 22px;
    background-size: cover;
    margin-left: -7px;
    margin-right: 9px;
    margin-top: -3px;
}

#contact:before {
    background: url(/assets/info-circle-solid.svg) no-repeat;
    width: 22px;
    height: 22px;
    background-size: cover;
    margin-left: -7px;
    margin-right: 9px;
    margin-top: -3px;
}

#contact {
    padding: 0 14px 0 18px !important;
}

.panel .panel-container .cart #pocet-poloziek {
    margin: 0 5px;
    font-weight: 600;
}

.panel .panel-container button {
    background: none;
    outline: none;
    border: none;
    color: white;
    font-size: 16px;
    padding: 0 14px;
    margin: 0;
    height: 100%;
}

.panel .panel-container button:before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    float: left;
    margin: -4px 6px 0 0;
}

.panel .panel-container button:active {
    background: #164E6C !important;
}

.panel .panel-container button:hover {
    background: #373737;
}

#cart {
    position: fixed;
    width: 500px;
    height: 465px;
    right: -502px;
    top: 65px;
    background: #1b1d1d;
    z-index: 3;
    border-bottom: 2px solid #1fb0e6;
    border-left: 2px solid #1fb0e6;
    -webkit-transition: right 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: right 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

#cart #cena_val {
    margin-left: 5px;
}

#cart .blue-text {
    font-weight: bold;
    color: #1fb0e6;
}

#cart .nadpis {
    color: white;
    margin: 0;
    padding: 18px 20px;
    background: #2d2d2d;
}

#cart .nadpis:before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    float: left;
    margin: -3px 18px 0 0;
    background: url(/tiny/bag.png) no-repeat;
}

#cart #cartItemsContainer {
    height: 349px;
    overflow-y: auto;
}

#cart #cena {
    width: 45%;
    float: left;
    height: 58px;
    color: white;
    line-height: 58px;
    padding-left: 5%;
}

#cart #cena div {
    display: inline-block;
}

#cart #dokoncitObjednavku {
    width: 50%;
    float: right;
}

#cart #dokoncitObjednavku:active {
    background: #164E6C !important;
}

#cart #dokoncitObjednavku:hover {
    background: #373737;
}

#cart #dokoncitObjednavku #goBigCart {
    background: none;
    outline: none;
    border: none;
    color: white;
    font-size: 16px;
    padding: 0 20px 0 14px;
    height: 58px;
    margin: 0 auto;
    display: block;
}

#cart #dokoncitObjednavku #goBigCart:before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    float: left;
    margin: -5px 12px 0 0;
    background: url(/tiny/ok.png) no-repeat;
}

#cart .empty-container {
    display: none;
}

#cart .cart-item {
    height: 60px;
    padding: 10px;
    cursor: pointer;
    display: flex;
}

#cart .cart-item:hover {
    background: #373737;
}

#cart .cart-item img {
    max-width: 27px;
    max-height: 30px;
    margin-top: 14px;
    margin-left: 10px;
}

#cart .cart-item .texts-cont {
    width: 235px;
    color: white;
    padding: 0 10px 0 20px;
    height: 100%;
    white-space: nowrap;
    overflow: hidden;
    flex: 1;
}

#cart .cart-item .texts-cont .product-name {
    color: #1fb0e6;
    margin-top: 4px;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


}

#cart .cart-item .texts-cont .product-description {
    text-overflow: clip;
    text-overflow: ellipsis;
    text-overflow: fade;
    text-overflow: fade(10px);
    text-overflow: fade(5%);
    overflow: hidden;
    color: #7b7b7b;
    font-size: 13px;
}

#cart .cart-item .img-cont {
    width: 35px;
}

#cart .cart-item .img-cont, #cart .cart-item .texts-cont, #cart .cart-item .item-counter {
    display: inline-block;
    vertical-align: top;
}

#cart .counter-cont {
    display: inline-block;
    color: white;
    font-size: 24px;
    line-height: 60px;
    margin-right: 10px;
}

#cart .counter-cont div {
    display: inline-block;
}

#cart .counter-cont .minus-count, #cart .counter-cont .plus-count {
    width: 40px;
    text-align: center;
    height: 60px;
    vertical-align: top;
    background: none;
    outline: none;
    border: none;
    color: white;
    font-size: 24px;
    cursor: pointer !important;
}

#cart .counter-cont .minus-count:hover, #cart .counter-cont .plus-count:hover {
    color: #1fb0e6;
}

#cart .delete-items {
    display: inline-block;
    height: 100%;
    line-height: 52px;
    vertical-align: middle;
    cursor: pointer;
    float: right;
}

#cart .delete-items:hover img {
    background: rgba(31, 176, 230, 0.41);
    border-radius: 50px;
}

#cart .delete-items img {
    padding: 4px;
    margin-top: 13px;
    margin-right: 5px;
    margin-left: 0;
    cursor: pointer;
}

.bigCartTable {
    display: none;
}

.bodyBigCart #cart {
    position: static;
    display: table-cell;
    border: none;
    width: auto;
    padding-top: 65px;
    -webkit-transition: padding-top 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: padding-top 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 4;
}

.bodyBigCart #next-button {
    padding: 10px 65px;
    font-size: 16px;
    position: absolute;
    right: 0;
    top: 65px;
    background: #131414;
    border: 0;
    color: #1fb0e6;
    text-transform: uppercase;
    outline: none;
}

.bodyBigCart #next-button:hover {
    cursor: pointer;
    background: #373737;
}

.bodyBigCart #next-button:active {
    background: #164E6C !important;
}


.bodyBigCart #back-button {
    padding: 10px 65px;
    font-size: 16px;
    position: absolute;
    left: 0;
    top: 65px;
    background: #131414;
    border: 0;
    color: #1fb0e6;
    text-transform: uppercase;
    outline: none;
    display: none;
}

.bodyBigCart #back-button:hover {
    cursor: pointer;
    background: #373737;
}

.bodyBigCart #back-button:active {
    background: #164E6C !important;
}

.bodyBigCart #container, .bodyBigCart #cartItemsContainer, .bodyBigCart #dokoncitObjednavku, .bodyBigCart .nadpis {
    display: none;
}

.bodyBigCart #cena {
    display: none !important;
}

.bodyBigCart .blue-text {
    display: inline-block;
    float: right;
    margin-right: 25px;
}

.bodyBigCart .bigCartTable {
    display: table;
    width: 100%;
    height: 100%;
    position: relative;
    padding-bottom: 65px;
    background: #1b1d1d;
}

.bodyBigCart .bigCartTable #closeBigCart {
    width: 24px;
    height: 24px;
    position: absolute;
    right: 24px;
    top: 24px;
    background-image: url("/tiny/close.png");
}

.bodyBigCart .bigCartTable #left_bg_m {
    position: fixed;
    left: 0;
    bottom: 10%;
    background-size: 48%;
    width: 500px;
    height: 500px;
    background-repeat: no-repeat;
    z-index: 0;
    background-image: url("/assets/bg_hus_m.png");
}

.bodyBigCart .bigCartTable #right_bg_m {
    position: fixed;
    right: 0;
    bottom: 5%;
    background-size: 48%;
    width: 500px;
    height: 500px;
    background-repeat: no-repeat;
    z-index: 0;
    background-position-x: 100%;
    background-position-y: 100%;
    background-image: url("/assets/bg_kohut_m.png");
}

.bodyBigCart .bigCartTable #payment-cart {
    width: 900px;
    margin: 0 auto;
    color: white;
    border-top: 2px solid #1fb0e6;
    border-bottom: 2px solid #1fb0e6;
    z-index: 1;
    position: relative;
    background: #131414;
    background: rgba(0, 0, 0, 0.3);
    max-width: 100vw;
}

#user-info {
    width: 900px;
    margin: 0 auto;
    color: white;
    border-top: 2px solid #1fb0e6;
    border-bottom: 2px solid #1fb0e6;
    z-index: 1;
    position: relative;
    background: #131414;
    background: rgba(0, 0, 0, 0.3);
    max-width: 100vw;
    display: none;
}

.bodyBigCart .bigCartTable #payment-sum {
    width: 900px;
    margin: 0 auto;
    color: #1fb0e6;
    z-index: 1;
    position: relative;
    background: #131414;
    background: rgba(0, 0, 0, 0.3);
    height: 60px;
    font-size: 20px;
    line-height: 60px;
    max-width: 100vw;
}

.bodyBigCart .bigCartTable #payment-sum #cart-sum-text {
    padding: 0 25px;
    display: inline-block;
    color: white;
}

.bodyBigCart .bigCartTable #payment-sum #cart-sum {
    float: right;
    padding: 0 10px;
    font-weight: bold;
}

.bodyBigCart .bigCartTable .payment-status {
    width: 900px;
    margin: 50px auto 0;
    color: white;
    height: 50px;
    z-index: 1;
    position: relative;
    background: #4b4b4b;
    background: rgba(0, 0, 0, 0.3);
    max-width: 100vw;
}

.bodyBigCart .bigCartTable .payment-status .payment-category {
    width: 50%;
    height: 100%;
    display: inline-block;
}

.bodyBigCart .bigCartTable .payment-status .payment-category img {
    width: 28px;
    margin: 11px;
}

.bodyBigCart .bigCartTable .payment-status .payment-category div {
    display: inline-block;
    line-height: 50px;
    vertical-align: top;
    font-size: 18px;
    font-weight: 200;
    letter-spacing: 2px;
}

.bodyBigCart .bigCartTable .payment-status .selected-payment {
    background: #1fb0e6;
}

.bodyBigCart #left_bg, .bodyBigCart #right_bg, .bodyBigCart .ilustracne {
    display: none !important;
}

@media only screen and (max-width: 1007px) {
    .payment-category {
        display: none !important;
        width: 100% !important;
    }

    .payment-category.selected-payment {
        display: block !important;
    }

    .payment-status {
        margin: 2px auto 0 !important;
    }

    #closeBigCart {
        right: 14px !important;
        top: 16px !important;
        z-index: 2;
    }
}

.emptySmall #cartItemsContainer {
    display: table;
    width: 100%;
    height: 392px !important;
}

.emptySmall #cartItemsContainer .empty-container {
    display: table-cell;
    vertical-align: middle;
}

.emptySmall #cartItemsContainer .empty-container p {
    color: white;
    font-size: 20px;
    text-align: center;
    letter-spacing: 1px;
}

.emptySmall #dokoncitObjednavku {
    display: none;
}

.ilustracne {
    position: absolute;
    font-size: 16px;
    width: 100%;
    left: 0;
    text-align: center;
    color: #1fb0e6;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 300;
    margin: 0 0 18px;
}

#shop-cont {
    display: none;
    width: 100%;
    vertical-align: middle;
    padding-top: 65px;
    position: relative;
}

#shop-cont .shopTitle {
    /*position: absolute;*/
    width: 100%;
    height: 175px;
    left: 0;
    top: 65px;
    vertical-align: top;
    color: #e1e1e1;
    font-size: 175px;
    font-weight: 800;
    text-align: center;
    margin: 0 0 23px;
}

#shop-cont .bg-line {
    height: 300px;
    background: rgba(255, 255, 255, 0.37);
}

#shop-cont .chooseMenu {
    height: 250px;
    margin-bottom: -250px;
}

.shop {
    background-image: url("/assets/bg_motiv.png") !important;
}

.shop #bodyTable {
    background-color: rgba(169, 165, 163, 0.5);
}

.shop #container, .shop #left_bg, .shop #right_bg, .shop .ilustracne,
.how-to-breed #container, .how-to-breed #left_bg,
.how-to-breed #right_bg, .how-to-breed .ilustracne {
    display: none !important;
}

.shop #shop-cont {
    display: table-cell;
}

#how-to-breed-cont {
    display: none;
    padding-top: 67px;
    width: 100%;
    justify-content: center;
    align-items: center;
}

#how-to-breed-cont h1 {
    text-align: center;
    color: #1fb0e6;
    font-weight: 600;
    font-size: 36px;
    margin-bottom: 6px;
}

.how-to-breed #how-to-breed-cont {
    display: block;
}

@media only screen and (max-width: 890px) {
    #container {
        padding-right: 30px !important;
    }

    #container .absolute_div {
        margin-left: 30px !important;
    }

    #loading_text {
        margin-left: 0 !important;
    }

    #cart {
        width: 100%;
        right: -101%;
        height: 100%;
        position: fixed;
    }

    #cart #cartItemsContainer {
        height: auto !important;
        max-height: calc(100% - 181px);
    }
}

.button-row {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-top: 15px;
    margin-bottom: 25px;

}

.button-row > div {
    position: relative;
    width: 240px;
    height: 50px;
    margin: 0 15px;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
}

.button-row > div > a {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: translateZ(-25px);
    -moz-transform: translateZ(-25px);
    -ms-transform: translateZ(-25px);
    -o-transform: translateZ(-25px);
    transform: translateZ(-25px);
    -webkit-transition: -webkit-transform 0.25s;
    -moz-transition: -moz-transform 0.25s;
    transition: transform 0.25s;
}

.button-row > div > a::before, .button-row > div > a::after {
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin: 0;
    width: 240px;
    height: 50px;
    position: absolute;
    border: 5px solid #414159;
    box-sizing: border-box;
    content: attr(title);
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
}

.button-row > div > a::before {
    background-color: #414159;
    color: #fff;
    -webkit-transform: rotateY(0deg) translateZ(25px);
    -moz-transform: rotateY(0deg) translateZ(25px);
    -ms-transform: rotateY(0deg) translateZ(25px);
    -o-transform: rotateY(0deg) translateZ(25px);
    transform: rotateY(0deg) translateZ(25px);
}

.button-row > div > a::after {
    background-color: #fff;
    border-color: #414159;
    color: #414159;
    -webkit-transform: rotateX(90deg) translateZ(25px);
    -moz-transform: rotateX(90deg) translateZ(25px);
    -ms-transform: rotateX(90deg) translateZ(25px);
    -o-transform: rotateX(90deg) translateZ(25px);
    transform: rotateX(90deg) translateZ(25px);
}

.button-row > div > a:hover {
    -webkit-transform: translateZ(-25px) rotateX(-90deg);
    -moz-transform: translateZ(-25px) rotateX(-90deg);
    -ms-transform: translateZ(-25px) rotateX(-90deg);
    -o-transform: translateZ(-25px) rotateX(-90deg);
    transform: translateZ(-25px) rotateX(-90deg);
}

/*accordion*/

input[type=checkbox] {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.row {
    display: flex;
    width: 100%;
}

.row .col {
    flex: 1;
}

.row .col:last-child {
    margin: 30px;
}

/* Accordion styles */
.tabs {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.5);
}

.tab {
    width: 100%;
    color: white;
    overflow: hidden;
}

.tab-label {
    display: flex;
    justify-content: space-between;
    padding: 1em;
    background: #1b1d1d;
    font-weight: bold;
    cursor: pointer;
    user-select: none;

    /* Icon */
}

.tab-label span {
    margin: 9px auto 0 12px;
    font-size: 20px;
    font-weight: 600;
    padding-right: 5px;
}

.tab-label:hover {
    background: #1a252f;
}

.tab-label::after {
    content: "\276F";
    width: 1em;
    height: 1em;
    text-align: center;
    transition: all .5s cubic-bezier(0.25, 0.3, 0.25, 1);
    margin-top: 9px;
}

.tab-content {
    max-height: 0;
    padding: 0 1em;
    color: #2c3e50;
    background: white;
    transition: all .35s;
    overflow: hidden;
}

.tab-close {
    display: flex;
    justify-content: flex-end;
    padding: 1em;
    font-size: 0.75em;
    background: #2c3e50;
    cursor: pointer;
}

.tab-close:hover {
    background: #1a252f;
}

input:checked + .tab-label {
    background: #1a252f;
}

input:checked + .tab-label::after {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

input:checked ~ .tab-content {
    max-height: 250vh;
    padding: 1em;
}

.ml-18 {
    margin-left: 24px !important;
}

.minus-6 {
    margin-left: 18px !important;
}

.tab-content h2 {
    margin: 0;
    font-weight: 500;
}

.tab-content b, b u {
    font-weight: 600;
}

.death-svg, .info-svg, .thermometer {
    width: 33px;
    min-width: 33px;
    height: 33px;
    margin-bottom: 7px;
}

.death-svg path, .info-svg path, .thermometer path {
    fill: #17b2e7;
}

.thermo-cont {
    display: flex;
}

.thermo-cont img {
    width: 100%;
}

.thermo-cont .text {
    flex: 1;
    padding-left: 16px;
}

.thermo-cont h2 {
    text-align: center;
}

.thermo-cont .table {
    width: 550px;
}

@media only screen and (max-width: 1300px) {
    .thermo-cont {
        flex-flow: column-reverse;
        justify-content: center;
        align-items: center;
    }

    .thermo-cont .table {
        margin-top: 16px;
        width: 100%;
        max-width: 768px;
    }

    .thermo-cont h2 {
        text-align: left;
    }

    .bodyBigCart #cart {
        width: 100%;
        height: 100%;
    }


}

@media only screen and (min-width: 1500px) {
    .thermo-cont .table {
        width: 750px;

    }
}


/* Fonts */
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css");
@import url("https://fonts.googleapis.com/css?family=Oswald:300,400,700");
/* Utilities */
#shop-cont {
    background: #c7c7c7;
    font-family: "Oswald", sans-serif;
}

#shop-cont input[type=number] {
    padding: 10px 15px;
    border-radius: 7px;
    background-color: white;
    border: 1px solid #fc3e65;
    outline: none;
    width: 32px;
    display: inline;
    margin-left: 15px;
}

#shop-cont h4 {
    color: #BAB9B8;
    font-size: 12px;
    font-weight: 400;
    font-style: italic;
    margin-top: -15px;
}

#shop-cont h5 {
    color: #FB626A;
    font-weight: 400;
}

#shop-cont h5 del {
    margin-right: 5px;
    color: black;
}

#shop-cont h3 {
    font-size: 14px;
}

#shop-cont p {
    color: #141414;
    font-size: 13px;
    line-height: 170%;
}

/* Objects */
.container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-animation: in ease 0.5s forwards;
    animation: in ease 0.5s forwards;
}

.card {
    display: flex;
    width: 700px;
    margin: auto;
    position: relative;
    /*padding-top: 50px;*/
}

.card #menu {
    position: absolute;
    left: 0;
    width: 100%;
    /* background: blue; */
    height: 50px;
    top: 10px;
    z-index: 1;
    border-radius: 15px 15px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    background-image: linear-gradient(-180deg, #FD886E 0%, #FC3E65 100%);
}

.card #right {
    position: absolute;
    width: 80px;
    height: 80px;
    right: -90px;
    top: calc(50% - 40px);
    opacity: 1;
    cursor: pointer;
    filter: invert(100%);
}

.card #left {
    position: absolute;
    width: 80px;
    height: 80px;
    left: -90px;
    transform: rotateY(180deg);
    top: calc(50% - 40px);
    opacity: 1;
    cursor: pointer;
    filter: invert(100%);
}

#left:hover, #right:hover {
    opacity: 0.8;
}

#left:active, #right:active {
    opacity: 0.6;
}

#right img, #left img {
    width: 100%;
}

.content-picture {
    position: relative;
    flex: 0 0 35%;
    /*background-image: linear-gradient(-180deg, #1eb0e6 0%, #1eb0e6 100%);*/
    background: white;
    box-shadow: -20px 40px 70px 0px rgba(135, 145, 148, 0.29);
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content-picture li {
    list-style-type: none;
    display: inline-block;
    background: #FFFFFF;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin: 0 5px 80px;
    cursor: pointer;
}

.content-picture #grey {
    background: #3A9A96;
}

.content-picture #grey2 {
    background: #3A9A96;
}

.brand img {
    top: 50px;
    position: absolute;
    width: 70px;
    -webkit-filter: invert(100%);
    filter: invert(100%);
}

#shop-photo-cont {

}

#shop-photo-cont img {
    width: 183px;
}

.content-text {
    padding: 0 40px 25px;
    background: #FFFFFF;
    box-shadow: -20px 40px 70px 0px rgba(0, 0, 0, 0.25);
    flex: 0 1 65%;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.header {
    display: flex;
    justify-content: space-between;
}

.header i {
    color: #FA6069;
    margin: 40px 2px;
    font-size: 12px;
}

.specs {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.specs hr {
    border: 0;
    height: 60px;
    width: 2px;
    background: #BAB9B8;
    opacity: 0.3;
    margin-top: -65px;
}

.specs p {
    font-size: 15px;
    margin-top: -2px;
}

.specs p:after {
    margin-left: 15px;
    font-family: FontAwesome;
    content: "\f107";
}

.colors {
    flex: 0 1 45%;
}

.colors .mint {
    width: 15px;
    height: 15px;
    background: #5FE7C7;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    margin-right: 3px;
    border: 2px solid #FFFFFF;
    box-shadow: 0px 0px 0px 2px #5FE7C7;
}

.colors .yellow {
    width: 15px;
    height: 15px;
    background: #FEED79;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    margin-right: 3px;
    border: 2px solid #FFFFFF;
}

.colors .violet {
    width: 15px;
    height: 15px;
    background: #6657AC;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    margin-right: 3px;
    border: 2px solid #FFFFFF;
}

.colors .black {
    width: 15px;
    height: 15px;
    background: black;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    margin-right: 3px;
    border: 2px solid #FFFFFF;
}

.colors .grey {
    width: 15px;
    height: 15px;
    background: grey;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    margin-right: 3px;
    border: 2px solid #FFFFFF;
}

.size {
    flex: 0 1 35%;
}

.call_to {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: auto;
    margin-top: 25px;
}

.call_to i.fa-share-alt {
    font-size: 25px;
    color: #BAB9B8;
    margin-top: 15px;
}

.button {
    padding: 10px 15px;
    background-image: linear-gradient(-180deg, #FD886E 0%, #FC3E65 100%);
    box-shadow: 1px 9px 17px 0px rgba(252, 75, 104, 0.49);
    border-radius: 7px;
    text-align: center;
    display: inline-block;
    cursor: pointer;
    user-select: none;
}

.button span {
    color: #FFFFFF;
    font-weight: 500;
    font-size: 13px;
}

.button i {
    color: #FFFFFF;
    font-weight: 500;
    font-size: 18px;
    margin-right: 8px;
}

.button:hover i {
    -webkit-animation: shake 500ms ease;
    animation: shake 500ms ease;
}

/*Animations*/
@-webkit-keyframes in {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
    }
    60% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
    80% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@keyframes in {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
    }
    60% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
    80% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@-webkit-keyframes shake {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes shake {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

/* Radio Buttons By K.R */
#shop-cont label {
    width: 24px;
    margin-right: 5px;
}

input.radio:empty {
    margin-left: -9999px;
    display: none;
}

input.radio:empty ~ label {
    position: relative;
    float: left;
    line-height: 24px;
    text-indent: 3.25em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

input.radio:empty ~ label:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    content: '';
    width: 18px;
    height: 18px;
    background: #cccccc;
    border-radius: 50px;
    border: 4px solid #FFF;
}

/* toggle on */
input.radio:checked ~ label:before {
    content: '';
}

input#radio1 ~ label:before {
    background-color: #59e8c8;
    margin-left: 2px;
}

#radio1:checked ~ label:before {
    box-shadow: 0px 0px 0px 1px #59e8c8;
}

input#radio2 ~ label:before {
    background-color: #ffee71;
}

#radio2:checked ~ label:before {
    box-shadow: 0px 0px 0px 1px #ffee71;
}

input#radio3 ~ label:before {
    background-color: #6654af;
}

#radio3:checked ~ label:before {
    box-shadow: 0px 0px 0px 1px #6654af;
}

input#radio4 ~ label:before {
    background-color: #343434;
}

#radio4:checked ~ label:before {
    box-shadow: 0px 0px 0px 1px #343434;
}

input#radio5 ~ label:before {
    background-color: #dfdfdf;
}

#radio5:checked ~ label:before {
    box-shadow: 0px 0px 0px 1px #dfdfdf;
}


#contact-form input[type="text"], #contact-form input[type="email"], #contact-form input[type="tel"], #contact-form input[type="url"], #contact-form textarea, #contact-form button[type="submit"] {
    font: 400 14px/18px "Open Sans", Helvetica, Arial, sans-serif;
}

#contact-form {
    margin: 50px 0;
    text-align: center;
}


fieldset {
    border: medium none !important;
    margin: 0 0 10px;
    min-width: 100%;
    padding: 0;
    width: 100%;
}

#contact-form input[type="text"], #contact-form input[type="email"], #contact-form input[type="tel"], #contact-form input[type="url"], #contact-form textarea {
    width: 80%;
    border: 1px solid #CCC;
    background: #FFF;
    margin: 0 0 5px;
    padding: 10px;
}

#contact-form input[type="text"]:hover, #contact-form input[type="email"]:hover, #contact-form input[type="tel"]:hover, #contact-form input[type="url"]:hover, #contact-form textarea:hover {
    -webkit-transition: border-color 0.3s ease-in-out;
    -moz-transition: border-color 0.3s ease-in-out;
    transition: border-color 0.3s ease-in-out;
    border: 1px solid #AAA;
}

#contact-form textarea {
    height: 100px;
    max-width: 100%;
    resize: none;
}

#contact-form button[type="submit"] {
    cursor: pointer;
    width: 80px;
    border: none;
    background: gray;
    color: #FFF;
    margin: 0 0 5px;
    padding: 10px;
    font-size: 15px;
}

#contact-form button[type="submit"]:hover {
    background: #09C;
    -webkit-transition: background 0.3s ease-in-out;
    -moz-transition: background 0.3s ease-in-out;
    transition: background-color 0.3s ease-in-out;
}

#contact-form button[type="submit"]:active {
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5);
}

#contact-form input:focus, #contact-form textarea:focus {
    outline: 0;
    border: 1px solid #999;
}

::-webkit-input-placeholder {
    color: #888;
}

:-moz-placeholder {
    color: #888;
}

::-moz-placeholder {
    color: #888;
}

:-ms-input-placeholder {
    color: #888;
}

.contact {
    margin-bottom: 10px;
}

.contct div {
    line-height: 20px;
}

.contact * {
    font-weight: bold;
}

#logo-hydina {
    width: 126px;
    margin: 6px 0 0 7px;
    cursor: pointer;
}

#shop-bg {
    background: url(/assets/shop-bg.jpg);
    background-size: cover;
    opacity: 0.55;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.qty {
    display: flex;
    justify-content: center;
    align-items: center;
}

/*# sourceMappingURL=novy_style.css.map */