* {
    margin: 0;
    padding: 0;
    border-radius: 0;
    list-style-type: none;
    text-decoration: none;
}

body {
    background: radial-gradient(circle, #e9e8e8 0%, #666);
}

.wideMargin, .wideMarginWhite, .wideMarginBlack {
    padding: 0 15px;
}

.wideMarginColor, .wideMarginCyan, .wideMarginGreen, .wideMarginYellow, .wideMarginLightBlue {
    padding: 0 15px;
}

.wideMarginCyan {
    background-color: #1096b4;
}

.wideMarginGreen {
    background-color: #39980a;
}

.wideMarginYellow {
    background-color: #f7e70a;
}

.wideMarginLightBlue {
    background-color: #C2EBF5;
}

.wideMarginWhite {
    background-color: #fff;
}

.wideMarginBlack {
    background-color: #000;
}

    .wideMarginBlack img {
        border: 1px solid #666;
    }

.wideMarginWide {
    padding: 0 15px;
    /* background-color: #000;*/
}


#clearLogo, #clearSearch, #clearMenu, #clearNav, #clearColor, #clearMain, #clearBlack, #clearJumbo, #clearWide {
    display: block;
}


.footer {
    background: radial-gradient(circle, #e9e8e8 0%, #666);
    padding: 70px;
    color: #666;
    margin-top: 10px;
    border-top: 5px solid #999;
    border-bottom: 5px solid #999;
}

    .footer img {
        padding: 0 !important;
        margin: 0 !important;
    }

    .footer p {
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        font-size: 1em;
    }

.searchBox {
    width: 140px;
    border-radius: 20px;
}

.searchField {
    width: 220px;
    border: 2px solid #000;
    background-color: #555353;
    float: right;
    /*padding: 5px 0 5px 10px;*/
    margin: 5px 0 10px 0;
    border-radius: 20px;
}
.btnSearch {
    width: 60px;
    padding: 0 5px;
    /*background-color: #5e5e65;*/
    color: #000;
    border-radius: 50px;
}
fieldset {
    margin: 10px;
}
/*.onOff table
{
    border: 1px solid #C2EBF5 !important;
    background-color: #1096b4 !important
}*/

legend, legend p, label, .validate {
    font-size: 1.1em;
    color: #000;
}

.ddl {
    background-color: #000;
    color: #fff;
}

.ddlR {
    font-size: 1em;
    color: red;
    display: block;
}

.textBox {
    width: 100px;
    padding: 0 2px 0 0;
    text-align: right;
}

.textLabel {
    float: left;
    margin-left: 20px;
    font-size: 1.1em;
    font-weight: bold;
}

img {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

/*ANIMATION TEXT*/
div.mirrorBox {
    border: 10px double #666;
    margin-top: 30px;
    text-align: center;
    padding: 50px 0;
    margin-right: 30px;
    /*display: flex;
    margin: auto;*/
}

/*DIM FP*/
/*.photoDim {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    min-height: 200px;
    padding-left: 10px;
}*/

/*DETAILS ?*/
/*.detailHolder {
    position: relative;
    max-width: 400px;
    margin: 100px auto 0 auto;
    border: 3px double #000;
    background: radial-gradient(circle, #e9e8e8 0%, #666);
    overflow: hidden;
    animation: swag 7s linear infinite;
    box-shadow: 5px -5px 5px #333;
    border-radius: 50px;
}
@keyframes swag
{
    0% {
        transform: rotateX(30deg) rotateY(0);
    }
    30% {
        transform: rotateX(30deg) rotateY(30deg);
    }
    70% {
        transform: rotateX(30deg) rotateY(-30deg);
    }
    100% {
        transform: rotateX(30deg) rotateY(0);
    }
}
div.detailIMG {
    width: 100%;
    color: #000;
    text-align: center;
    margin: 0 auto;
}
    div.detailIMG h3{
       color: #175b6b;
       font-size: 1em;
    }
    div.detailIMG h6 {
        color: #000;
        font-size: 1em;
    }
    div.detailIMG img.imgD {
       margin: 50px auto 0 auto !important;
    }*/

h1.logo {
    font-family: 'BankGothic Lt BT';
    color: #69693c;
}

    h1.logo span {
        font-size: 0.5em !important;
        /*color: #1096b4;*/
    }

h1.center {
    text-align: center;
    color: #C2EBF5;
    font-size: 2em;
}

h1.centerBlack {
    text-align: center;
    color: #000;
    font-size: 2em;
    margin: 10px;
}

h2.logo {
    font-family: 'BankGothic Lt BT';
    font-size: 2.5em;
    color: #69693c;
    padding-top: 10px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

h1 {
    font-size: 2.5em;
    font-weight: bold;
}

h2 {
    font-size: 1.7em;
    font-weight: bold;
    color: #1096b4;
}

h3 {
    font-size: 1.7em;
    font-weight: bold;
}

h4 {
    font-size: 1.5em;
    font-weight: bold;
}

h5 {
    font-size: 1.2em;
    font-weight: bold;
}

h6 {
    font-size: 1em;
    /* font-weight: bold;*/
}

p, p.ingress {
    /*font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;*/
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 1.3em;
    color: #151414;
    margin-bottom: 20px;
    /* text-align: justify;*/
}

    p.big {
        font-family: Verdana;
        font-size: 1.2em;
        font-weight: bolder;
    }

    p.small {
        font-size: 1em;
    }

    p strong {
        font-size: 1em;
    }

.bgBlack p {
    color: #fff;
}

a {
    font-family: 'Times New Roman', Times, serif;
    color: #1096b4;
    font-weight: bold;
    font-size: 1.5em;
    margin: 10px 10px 10px 0;
}

    a.seeVideo {
        color: #000;
        font-size: 1.5em;
    }

    a.return {
        font-size: 2em;
        padding: 20px;
        color: #C2EBF5
    }

.linkColor {
    color: #1c6677;
}

.prewNext {
    position: relative;
    width: 260px;
    height: 45px;
    margin: 0 auto;
    overflow: hidden;
    color: #000;
    font-size: 1.5em;
    margin-top: 10px;
    background-color: #666;
    border: 1px solid #ccc;
}

.aPrew {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0;
    width: 100px;
    background-color: #999;
    border: 2px solid #c4cbcb;
    padding-top: 5px;
    border-radius: 5px;
    box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
    text-align: center;
}

.aNow {
    position: absolute;
    top: 0px;
    left: 100px;
    bottom: 0;
    right: 100px;
    padding: 8px 0 0 1px;
    text-align: center;
    color: #fff;
}

.aNext {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0;
    width: 100px;
    background-color: #999;
    border: 2px solid #c4cbcb;
    padding-top: 5px;
    border-radius: 5px;
    box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
    text-align: center;
}

    .aPrew a, .aNext a {
        color: #fff;
        font-size: 1em !important;
        font-weight: normal;
    }

.black {
    background-color: #000;
    color: #fff;
}

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

.fixed {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5000;
}

.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

.left {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5000;
}

.right {
    float: right;
}

.pink {
    color: #b435d3;
}

.red {
    color: #9b0bbe;
}

.white {
    color: #fff;
}

span.pink a {
    color: #9b0bbe;
    margin-bottom: 20px;
    height: 50px;
}

span.button {
    float: right;
    background-color: #fff;
    border-radius: 30px;
    color: #fff;
    padding: 10px;
}

span.name {
    font-size: 20px;
}

span.prosent {
    float: left;
    color: red;
}

div.center {
    text-align: center;
}

.space {
    width: 150px;
}

.place {
    height: 50px;
    /*border: 10px solid red;*/
}

.place40 {
    height: 40px;
    /*border: 25px solid red;*/
}

.place30 {
    height: 30px;
    /*border: 25px solid red;*/
}

.place20 {
    height: 20px;
    /*border: 25px solid red;*/
}

.place10 {
    height: 10px;
    /*border: 10px solid red;*/
}

.place5 {
    height: 5px;
    /*border: 10px solid red;*/
}

.placeMobile {
    height: 50px;
}

ol li {
    margin-left: 20px;
    list-style-type: decimal;
    /*color: #1096b4;*/
}

table {
    /*background: radial-gradient(circle, #e9e8e8 0%, #666) !important;*/
    /*background-color: #000;*/
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}

    table th {
        background-color: #000;
        font-size: 1.3em !important;
        color: #fff;
    }

    table td a {
        color: #000;
        font-size: 1em !important;
    }

    table td {
        font-size: 1.2em !important;
        color: #000;
        padding: 2px 10px !important;
    }

        table td.money {
            text-align: right;
        }

        table td.middleCenter {
            text-align: center;
            vertical-align: middle;
        }

    table img.max {
        margin: 0 auto;
        max-height: 200px;
        /*max-width: 200px;
       
        margin: 0 auto;
        padding: 0;*/
    }

    table.noBG, table.noBG th, table.noBG td {
        background-color: #ccc;
        padding: 5px;
    }

.bgEditor {
    overflow: hidden;
    padding: 0 10px 10px 10px;
    margin-bottom: 10px;
    display: block;
}

.copyCover {
    /*padding: 20px;*/
    overflow: hidden;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}


.detailWaterMark {
    background: transparent url('../Images/WaterMark_IsChaEl_600_600_25_4.png') no-repeat center center;
    /*    background: transparent url(../Images/iCrownWaterMarkLarge.png) no-repeat center center;
*/ position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5000;
    -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 */
}

.detailWaterMarkx {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5000;
    -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 */
}

.noSelect {
    -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 */
}

.mainDetailImage, .designDetailImage {
    margin-top: 20px;
}

img.detailImage {
    max-width: 100%;
    max-height: 300px;
    display: block;
}

.detailImage .detailWaterMark {
    background: transparent url(../Images/iCrownWaterMarkLarge.png) no-repeat center center;
    /**/ position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5000;
}

img.chapters {
    border: none;
    width: 100px;
}

img.readingBook {
    max-width: 100px;
    max-height: 100px;
    float: left;
    margin: 0 30px 20px 0;
}

img.navIconBooks {
    float: left;
    max-width: 100px;
    max-height: 100px;
    border: none;
    margin: 0 10px 10px 0;
}

img.conditions {
    max-width: 100px;
    max-height: 100px;
    /*display: none;*/
}

.youTube {
    /*border: 5px double #666;*/
    margin: 50px 0;
    text-align: center;
}

.bgWhite {
    background-color: #fff;
    padding: 5px 20px;
    margin-bottom: 30px;
}

.priceRelate {
    position: relative;
}

h5 span.bold {
    font-weight: bolder !important;
    color: #ccc;
}

.movieBox {
    width: 95%;
    border-radius: 0;
    margin: 0 auto;
    /*border: 20px double #666;*/
}

.movieBoxFrame {
    width: 95%;
    border-radius: 0;
    margin: 0 auto;
    border: 20px double #666;
}

img.cat2Image {
    max-width: 200px !important;
    max-height: 200px !important;
    float: left !important;
    margin: 0 15px 10px 0;
}

img {
    margin: 0 auto;
    /*border: 0px solid #dcd8c2; 
    width: 100%;
    max-height: 500px;*/
}

.editorImage {
    margin-top: 50px;
}

.imgMain {
    /* max-width: 150px;
    max-height: 150px;*/
}

img.iconImages {
    width: 40px;
    border: 0px solid #fff;
    margin-right: 20px;
}

img.iconImageVipps {
    width: 100px;
    border: 0px solid #fff;
    margin-right: 20px;
}

img.iconMedia {
    width: 50px;
    border: 2px solid #666;
    background-color: #fff;
}

img.iconMediaSmall {
    width: 35px;
    border: 1px solid #666;
    /*background-color: #fff;*/
    margin-right: 20px;
    margin-top: 20px;
    border-radius: 20%;
}

.languageBox {
    margin: 10px 12px 0 0;
}

.btnIn, .btnOut {
    padding: 0 10px;
    border-radius: 10px;
    border: 2px groove #666;
}

.btnIn {
    background-color: #12afca;
    color: #fff;
}

.btnOut {
    background-color: #000;
    color: #fff;
}

.btnActive, .btnInActive {
    padding: 2px 10px;
    border-radius: 50px;
    margin-top: 20px;
    margin-bottom: 10px;
    border: 2px groove #999;
}

.btnActive {
    background-color: #1096b4;
    color: #fff;
}

.btnInActive {
    background-color: #000;
    color: #fff;
}

.btnInsert, .btnUpdate, .btnDelete, .btnCancel, .btnReset, .btnImgDelete, .btnImgInsertUpdate {
    padding: 5px 10px;
    background-color: #C2EBF5;
    color: #666;
    border-radius: 50px;
    margin: 20px 0;
}

.btnLogIn {
    padding: 5px 10px;
    background-color: #000;
    color: #fff;
    border-radius: 50px;
    margin: 20px;
}

.btnLogOut {
    padding: 5px 10px;
    background-color: #000;
    border: 1px solid #666;
    color: #fff;
    border-radius: 50px;
    margin-bottom: 10px;
}

.btnMyBuyButtons, .btnMyBuyButtonsColor {
    width: 100%;
    min-height: 50px;
    background-color: #000;
    padding: 10px 10px;
    margin-bottom: 10px;
    color: #fff;
    border-radius: 10px;
}

.btnSML {
    width: 100%;
    background-color: #FECE0F;
    color: #000;
    border-radius: 50px;
}

.btnType {
    width: 100%;
    background-color: #1d87e0;
    color: #fff;
    border-radius: 50px;
}

.btnAge {
    width: 100%;
    background-color: #12afca;
    color: #fff;
    border-radius: 50px;
}

.btnPdf {
    padding: 2px 10px;
    background-color: #61c743;
    color: #000;
    border-radius: 50px;
}

.btnButton {
    padding: 20px 20px;
    background-color: #43586b;
    color: #ccc;
    border-radius: 50px;
}

.btnWide {
    width: 100%;
}



.btnGold, .btnSilver, .btnWhite, .btnBlack, .btnLime, .btnCyan, .btnOrange, .btnPink, .btnYellow, .btnRed, .btnBlue, .btnLightBlue {
    padding: 2px 10px;
    border-radius: 50px;
    margin-top: 20px;
    margin-bottom: 10px;
}

    .btnGold:hover, .btnSilver:hover, .btnWhite:hover, .btnBlack:hover, .btnLime:hover, .btnCyan:hover, .btnOrange:hover, .btnPink:hover, .btnYellow:hover, .btnRed:hover, .btnBlue:hover, .btnLightBlue:hover {
        background: none;
        color: #000;
    }

.btnGold {
    background: radial-gradient(circle, #877113 20%, #988845);
    color: #ccc;
    border: 1px solid #fff;
}

.btnSilver {
    background: radial-gradient(circle, #e9e8e8 30%, #bfbebe);
    color: #000;
    border: 1px solid #fff;
}

.btnWhite {
    background: radial-gradient(circle, #fff 30%, #e7eeed);
    /*background-color: #fff;*/
    color: #000;
    margin-bottom: 10px;
}

.btnWhiteBlock {
    /*display: block;*/
    width: 100%;
    background: radial-gradient(circle, #fff 30%, #e7eeed);
    /*background-color: #fff;*/
    color: #000;
    border-radius: 30px;
    padding: 0 10px;
}

.btnBlack {
    background-color: #000;
    color: #ccc;
    margin: 10px;
}

.btnLime {
    background-color: #a0e69a;
    color: #ccc;
}

.btnCyan {
    background-color: #30bdd7;
    color: #001;
}

.btnOrange {
    background-color: #f34110;
    color: #ccc;
}

.btnPink {
    background-color: #d239e4;
    color: #ccc;
}

.btnYellow {
    background-color: #FECE0F;
    color: #000;
}

.btnRed {
    background-color: #ef2d2d;
    color: #ccc;
}

.btnBlue {
    background-color: #007ACC;
    color: #ccc;
}

.btnLightBlue {
    background-color: #C2EBF5;
    color: #000;
}

div.chapter {
    position: absolute;
    top: 0;
    left: 70px;
    right: 70px;
    bottom: 0;
    border: 2px solid #c4cbcb;
    padding-top: 5px;
    border-radius: 5px;
    box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
    text-align: center;
    font-size: 1em !important;
    text-decoration: underline;
}

    div.chapter h2 {
        margin: 5px;
    }

a.goToCart {
    position: static;
    color: #666;
}

a.link {
    /*border: 2px solid #666;
    padding: 10px 20px;
    background-color: #FECE0F;*/
}

ul.menuDebug li {
    float: left;
    margin: 10px;
    padding: 10px;
}

    ul.menuDebug li a {
        font-size: 1em;
        color: #000;
    }

.navbar-right a, .nav .navbar a {
    color: #001 !important;
}

.navbar-nav li a {
    /* border: 1px solid red !important;*/
    color: #000 !important;
}

.navbar-toggle {
    background-color: #333;
}

.navbar-fixed-top {
    /*BOX SHADDOW*/
    -moz-box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
    -webkit-box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
    box-shadow: 1px 1px 2px hsla(0,0%,0%,.3); /* Opera, IE 9 */
    margin-bottom: 100px;
}

.navbar-collapse {
}

    .navbar-collapse ul {
        margin-right: 0px;
        text-align: center;
    }

        .navbar-collapse ul li {
            margin: 0;
            text-align: center;
        }

            .navbar-collapse ul li img {
                margin: 0 auto;
            }

.navbar {
    /*background-color: #eaeae4;*/
    background: radial-gradient(circle, #e9e8e8 0%, #666);
}
    /*.nav .navbar-nav li a
{
    color: red !important;
}*/
    .navbar img {
        max-width: 40px;
        max-height: 50px;
        float: none;
        display: block;
    }

ul.myButtons {
    overflow: hidden;
    margin-top: 10px;
}

img.myButton {
    border: none;
    float: left;
    width: 30px;
    height: 30px;
    margin-right: 10px;
}

ul.myButtons li {
    position: relative;
    height: 45px;
    border: 2px solid #ccc;
    background-color: #fff;
    margin: 0 5px 5px 0;
    padding: 5px;
    text-align: center;
}

    ul.myButtons li a {
        font-size: 1.0em;
    }

    ul.myButtons li.active {
        background-color: #C2EBF5;
    }

#toggle1 {
    max-width: 50px;
}

.toggle1 {
    width: 100%;
    overflow: auto;
    position: absolute;
    left: 10px;
    z-index: 3000;
    display: none;
    padding-bottom: 5px;
    border-radius: 5px;
}

ul.navToggle {
    list-style-type: none;
    margin: 0 0 0 0;
    padding: 0;
    width: 95%;
}

    ul.navToggle li {
        width: 260px;
        overflow: hidden;
        float: left;
        border: 1px solid #ccc;
        padding: 2px 0;
        background-color: #FECE0F;
    }

        ul.navToggle li:hover {
            background-color: #fff;
        }

            ul.navToggle li:hover a {
                color: #333;
            }

        ul.navToggle li a {
            display: block;
            color: #000;
            padding-left: 10px;
            text-decoration: none;
        }

#toggle1 {
    /*display: none;
    width: 80%;
    border: none;
    position: absolute;
    left: 15px;
    top: 100px;
    z-index: 10001;*/
}

.toggle1 {
    position: absolute;
    /*width:100%;*/
    top: 100px;
    left: 15px;
    right: 15px;
    z-index: 1000;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

ul.toggleMenu {
    /*border: 10px solid #666;*/
    margin-top: 40px;
    z-index: 7000;
    overflow: hidden;
}

    ul.toggleMenu li {
        border-bottom: 1px solid #ccc;
        background-color: #007ACC;
        padding: 3px 10px;
        text-align: center;
        width: 100%;
    }

        ul.toggleMenu li:hover {
            background-color: #ccc;
        }

            ul.toggleMenu li:hover a {
                color: #fff;
                text-decoration: none;
            }

    ul.toggleMenu:hover li {
    }

    ul.toggleMenu li a {
        text-decoration: none;
        color: #fff;
        display: block;
    }

.whole .open ul.navigation li {
    width: 170px;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}

ul.menuNav, ul.navMenu, navMenuSub {
    list-style-type: none;
    float: left;
}

    ul.menuNav li, ul.navMenu li, .navMenuSub li {
        list-style-type: none !important;
        float: left;
        text-align: center;
    }

        ul.menuNav li a, ul.navMenu li a, .navMenuSub li a {
            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
            /*font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;*/
            font-size: 1em !important;
            margin: 5px 0 0 0 !important;
            text-align: center;
        }

            ul.menuNav li a:hover, ul.navMenu li a:hover, .navMenuSub li a:hover {
                color: #666;
            }

        ul.menuNav li.active, ul.navMenu li.active, ul.navMenuSub li.active {
            /*text-decoration: underline;*/
        }

            ul.menuNav li.active a:hover, ul.navMenu li.active a:hover, ul.navMenuSub li.active a:hover {
                color: #666;
            }

            ul.menuNav li.active a, ul.navMenu li.active a, ul.navMenuSub li.active a {
                color: #186272;
                text-decoration: underline;
                /*border-bottom: 1px solid #186272;*/
            }

        ul.menuNav li a, ul.navMenu li a, ul.navMenuSub li a {
            display: block;
            font-size: 14px;
            /*letter-spacing: 0.1em;*/
            color: #000;
            padding: 5px 10px;
            text-decoration: none;
        }

ul.menu {
    margin: 0 !important;
    padding: 0 !important;
    list-style-type: none;
    clear: right;
    display: block;
    overflow: hidden;
}

    ul.menu li {
        list-style-type: none !important;
        /* height: 35px;*/
        padding: 0 !important;
        margin: 0 !important;
        float: left;
        /* border: 1px solid red;*/
        text-align: center;
    }

        ul.menu li a {
            padding: 10px 5px !important;
            margin: 0 !important;
            /* border: 1px solid red;*/
            text-align: center;
        }

        ul.menu li.active {
            /*text-decoration: underline;*/
        }

            ul.menu li.active a {
                color: #fff;
            }

        ul.menu li a {
            display: block;
            font-size: 14px;
            /*letter-spacing: 0.1em;*/
            color: #000;
            padding: 5px 10px;
            text-decoration: none;
        }

        ul.menu li:hover a {
            /*text-decoration: underline;*/
            color: #fff;
        }

        ul.menu li img.menuImage {
            width: 30px;
            float: left;
            margin: 0 0 0 10px !important;
            padding: 0 !important;
        }

        ul.menu li i {
            /*padding: 20px 10px;*/
            /*margin: 20px;*/
        }

        ul.menu li span {
            display: none;
        }

ul.menuSub {
    padding-right: 25px;
    margin-left: 0 !important;
    overflow: hidden;
    /*margin: 20px 0 30px 0;*/
    margin: 5px 0;
    /*border-bottom: 1px solid #000;*/
    /*min-height: 20px;*/
}

    ul.menuSub li {
        float: left;
        padding: 5px 0;
        margin-right: 5px;
        /*border-left: 1px solid #000;*/
        border-radius: 0;
    }

        ul.menuSub li:last-child {
            /*border-right: 1px solid #000;*/
        }

        ul.menuSub li:hover {
        }

            ul.menuSub li:hover a {
                color: #ccc;
            }

        ul.menuSub li a {
            color: #4f4c2d;
            font-size: 1em;
            font-weight: bold;
            text-decoration: none;
            letter-spacing: 0;
            margin: 0 5px;
        }

        ul.menuSub li.active {
            border-radius: 0;
            text-decoration: underline;
        }

            ul.menuSub li.active a {
                color: #fff;
            }


/*DETAIL GALLERY*/
.photoFlex {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    align-content: center;
    padding-top: 30px;
}

    .photoFlex img {
        border: 1px solid #666;
    }

.photoItem {
    width: 15%;
}

/*PHOTO FP*/
.photoFlexColor {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    border-top: 1px solid #fff;
    border: 5px double #fff;
    padding-left: 10px;
    background: radial-gradient(circle, #e9e8e8 0%, #83d6e9);
}

    .photoFlexColor:hover {
        background: radial-gradient(circle, #83d6e9 0%, #e9e8e8);
    }

    .photoFlexColor img {
        border-radius: 50%;
        border: 1px solid #000;
    }

/*PRODUCT DETAIL*/
/*.boxDetails
{
    margin-top: 30px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
    .boxDetails h3 {
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        font-size: 1.5em;
        margin: 0 0 10px 0 !important;
        padding: 0 !important;
    }
.boxDetails p{
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    font-size: 1em;
    font-weight: normal;
}
    .boxDetails p.strong, .boxDetails p strong {
        font-weight: bolder;
    }*/

.mobileHiding {
    display: block;
}

.mobileShowing {
    display: none
}

/*.photoMobileFlex {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding-left: 10px;
    padding-bottom: 30px;
}
.photoMobileFlex img{
}*/


/*DETAILS ICE*/
.room {
    /*    display: flex;
    justify-content: space-evenly;
*/ position: relative;
    background-image: url('../HTML/1920_1000_Room_Web_02_fix.png');
    background-repeat: no-repeat;
    background-size: 100%;
    margin: 10px auto;
    min-width: 200px;
    min-height: 640px;
    padding: 0 !important;
    border: 1px solid #666;
}

    .room h3 {
        position: absolute;
        top: 20px;
        right: -40px;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        /*font-family: Algerian;*/
        font-size: 1.2em;
        /*text-align: center;*/
        /*padding: 0 !important;*/
        writing-mode: vertical-lr;
    }

.wallPlacer {
    position: absolute;
    top: 40px;
    left: 400px;
    /*height: 310px;*/
    /*box-shadow: 3px -3px 10px #666;*/
   /* border: 5px solid red;*/
}

    .wallPlacer img {
        /*transform-style: preserve-3d;*/
        /*transform: rotateX(5deg) rotateY(-5deg) rotateZ(0deg);*/
        max-width: 250px;
        max-height: 250px;
        /*border: 5px solid #666;*/
        box-shadow: 3px -3px 10px #333;
    }

/*PRODUCT FP FAV*/
.boxFlex, .boxFlexWrap {
    display: flex;
    justify-content: space-evenly;
    gap: 10px;
    position: relative;
    /* border: 1px solid red;*/
}

.boxFlex {
    flex-wrap: nowrap;
}

.boxFlexWrap {
    flex-wrap: wrap;
}

    .boxFlex img, .boxFlexWrap img {
        margin: 0 auto !important;
        padding: 0 !important;
    }

.boxText h5, .boxTextBlack h5, .boxTextWhite h5 {
    /*margin: 0 20px 20px 20px;*/
    font-size: 1.2em;
}
.boxText h5.center, .boxTextBlack h5.center, .boxTextWhite h5.center {
    text-align: center;
    /*margin: 0 20px 20px 20px;*/
    font-size: 1.2em;
}
.boxText, .boxTextBlack, .boxTextWhite {
    margin: 10px;
    /* border: 1px solid red;*/
}

    .boxText ul li, .boxTextBlack ul li, .boxTextWhite ul li {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 1.3em !important;
        margin-left: 40px;
        list-style-type: circle;
    }

    .boxText ol li, .boxTextBlack ol li, .boxTextWhite ol li {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 1.3em !important;
        margin-left: 40px;
    }

    .boxText p, .boxTextBlack p, .boxTextWhite p {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 1.3em !important;
    }

    .boxText p, .boxTextBlack p, .boxText h5, .boxTextBlack h5 {
        color: #000;
    }

    .boxTextWhite p, .boxTextWhite h5 {
        color: #fff;
    }

    .boxText a.read, .boxTextBlack a.read, .boxTextWhite a.read, .boxItemsSearch a.read, a.read {
        /*position: absolute;
        right: 3px;
        bottom: 0;*/
        color: #000;
        font-family: 'Times New Roman', Times, serif;
        font-size: 1em !important;
        letter-spacing: 0.05em;
    }

    .boxText a.read, .boxTextWhite a.read {
        color: #fff;
    }

    .boxTextBlack a.read {
        color: #000;
    }

.boxItems .movieBox {
    margin-left: 10px !important;
}

.boxItems, .boxItemsBorder, .boxItems1, .boxItems2, .boxItems3, .boxItems4, .boxItems5, .boxItems6 {
    position: relative;
}

.boxItems1 {
    width: 100%;
}

.boxItems2 {
    width: 49%;
}

.boxItems3 {
    width: 30%;
    margin-bottom: -10px !important;
}

.boxItems4 {
    width: 23%;
}

.boxItems5 {
    width: 19%;
}

.boxItems6 {
    width: 15%;
}

.boxItems7 {
    width: 13%;
}

.boxItems8 {
    width: 11%;
}

.boxItems9 {
    width: 10%;
}

.boxItems10 {
    width: 9%;
}
/*TEXT FP*/
.textFp {
    padding-top: 50px;
}

    .textFp h5 {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 2em;
        color: #fff;
        writing-mode: vertical-lr;
        margin-top: 20px;
    }

    .textFp p {
        color: #000;
    }


/*BASKET CART FP*/
.basketCartFlex {
    position: relative;
    display: flex;
    /*gap: 5px;*/
    justify-content: space-evenly;
    align-items: center;
    padding-bottom: 5px;
    margin: 20px 0 0 20px;
    /*border: 1px solid red;*/
}
.basketCart {
    position: absolute;
    top: 95%;
    right: 0;
    bottom: -20px;
    left: 0;
    z-index: 20;
   /* background-image: radial-gradient(black 1%, transparent 10%),radial-gradient(black 1%, transparent 10%);*/
    /*background-size: 60px 60px;*/
    /*background-position: 0 0, 30px 30px;*/
    background-color: #000;
    border-bottom-left-radius: 150px;
    border-bottom-right-radius: 150px;
    border: 2px solid #fff;
    box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
}
.basketCart span {
    position: absolute;
    right: 100px;
    bottom: 2px;
    font-family: 'Times New Roman', Times, serif;
    font-size: 0.5em;
    color: #fff;
    letter-spacing: 0.1em;
}

img.maxSize {
    max-width: 90px;
    max-height: 90px;
    margin-left: 12px;
}

.basketCartImg1 {
    transform: rotate(-5deg);
}
.basketCartImg2 {
    transform: rotate(6deg);
}
.basketCartImg3 {
    transform: rotate(-7deg);
}
.basketCartImg4 {
    transform: rotate(5deg);
}
.basketCartImg5 {
    transform: rotate(-8deg);
}
.basketCartImg6 {
    transform: rotate(5deg);
}
.basketCartImg7 {
    transform: rotate(-5deg);
}
.basketCartImg8 {
    transform: rotate(7deg);
}
.basketCartImg9 {
    transform: rotate(-6deg);
}
.basketCartImg10 {
    transform: rotate(6deg);
}

/*BASKET FP*/
.basketFlex {
    position: relative;
    display: flex;
    justify-content: space-evenly;
    align-items: flex-end;
    padding: 20px 0;
    margin: 30px 0;
     /*border: 1px solid red;*/
}
.basket {
    position: absolute;
    top: 85%;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 20;
    background-image: radial-gradient(white 1%, transparent 10%),radial-gradient(white 1%, transparent 10%);
    background-size: 60px 60px;
    background-position: 0 0, 30px 30px;
    background-color: hsla(555,4%,76%,.5);
    border-bottom-left-radius: 150px;
    border-bottom-right-radius: 150px;
    border: 2px solid #fff;
    box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
}

.basketImg1 {
    transform: rotate(-10deg);
}
.basketImg2 {
    transform: rotate(12deg);
}
.basketImg3 {
    transform: rotate(-15deg);
}
.basketImg4 {
    transform: rotate(10deg);
}
.basketImg5 {
    transform: rotate(-15deg);
}
.basketImg6 {
    transform: rotate(10deg);
}
.basketImg7 {
    transform: rotate(-10deg);
}
.basketImg8 {
    transform: rotate(15deg);
}
.basketImg9 {
    transform: rotate(-12deg);
}
.basketImg10 {
    transform: rotate(12deg);
}



/*PLANK FP*/
.plankFlex {
    display: flex;
    justify-content: space-evenly;
    align-items: flex-end;
    gap: 35px;
}

    .plankFlex img {
        border: 0px solid #666 !important;
        /*width: 18%;*/
    }


.jeweleryBox img {
    max-width: 100px;
    max-height: 100px;
    float: right;
    margin: 20px 100px 20px 100px;
}

.wrapperMovie {
    margin-bottom: 30px;
    /* border: 3px solid #fff;*/
}

.quantity {
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 1em;
    color: #000 !important;
    border: 2px dashed #666;
    /*background: radial-gradient(circle, #e9e8e8 0%, #666);*/
    margin: 6px 0 0 0;
    padding-left: 10px;
    overflow: hidden;
    letter-spacing: 0.1em;
    /*display: inline-block;*/
}

span.pagerQuantity {
    margin-right: 5px;
    font-size: 1em;
    color: #ccc;
}
/*span.pagerLink {
    padding-top: 10px !important;
    border: 10px solid red;
}*/
span.pagerLink a, span.pagerLinkActive {
    margin: 3px !important;
    font-size: 1.5em;
}

span.pagerLink a {
    color: #000;
}

span.pagerLinkActive {
    color: red;
}

/*NON*/
.pagerICE0 img {
}
/*RED*/
.pagerICE1, img.imgBG1 {
    background: radial-gradient(circle, #f11b1b 0%, #a21212);
}
/*ORANGE*/
.pagerICE2, img.imgBG2 {
    background: radial-gradient(circle, #ef551a 0%, #ef551a);
}
/*YELLOW*/
.pagerICE3, img.imgBG3 {
    background: radial-gradient(circle, #fece0f 0%, #fece0f);
    /*background: radial-gradient(circle, #fcfd79 0%, #faf57c);*/
}
/*GREEN*/
.pagerICE4, img.imgBG4 {
    background: radial-gradient(circle, rgb(20 186 20) 0%, #4f8013);
}
/*CYAN*/
.pagerICE5, img.imgBG5 {
    background: radial-gradient(circle, #30bdd7 0%, #30bdd7);
}
/*BLUE*/
.pagerICE6, img.imgBG6 {
    background: radial-gradient(circle, #1d87e0 0%, #196fb7);
}
/*LILLAC*/
.pagerICE7, img.imgBG7 {
    /*background-color: #371dd0;*/
    background: radial-gradient(circle, #6a44cb 0%, #6a44cb);
}
/*PINK*/
.pagerICE8, img.imgBG8 {
    background: radial-gradient(circle, #e00f85 0%, #e00f85);
}
/*GREY*/
.pagerICE9, img.imgBG9 {
    /*background-color: #c6cff7;*/
    background: radial-gradient(circle, #dfdcdc 50%, #fff);
}
/*GEEY*/
.pagerICE10, img.imgBG10 {
    /*background-color: #666;*/
    background: radial-gradient(circle, #e9e8e8 0%, #666);
}
/*LIGHT GREY*/
.pagerICE11, img.imgBG11 {
    background: radial-gradient(circle, #000 0%, #000);
}
/*WHITE*/
.pagerICE12, img.imgBG12 {
    background: radial-gradient(circle, #fff 0%, #fff);
}

.cartCarry {
    max-width: 100px;
    max-height: 100px;
}

.cartCarrier {
    margin-bottom: 30px;
}

.cartCarriage {
    /*background-color: #C2EBF5;*/
    border: 0px solid #ccc;
    padding: 10px;
}

    .cartCarriage img {
    }








:root {
    --start: 0;
    --stopp: 0;
    --speed: 8s;
    /*--boxColor: #f4b7f7;
    --rotateSpeed: 30s;
    --bounceSpeed: 1.5s;
    --boxSize: 2em;*/
    --lengthRigh: 400px;
    --lengthLeft: -400px;
    --lengthRighFull: 800px;
    --lengthLeftFull: -800px;
    --cupColor1: #C2EBF5;
    --cupColor2: #91bdc7;
    --cupColor3: #999;
    --loaderColor: #666;
    /*--loaderColor: #006fff;*/
    --size-2: 5px;
    --size-3: 10px;
    --surface-2: #000;
    --radius-2: 5%;
    --shadow-2: 0 35px rgb(0,0,0,0.2);
    --spacer: 0.2rem;
}


img.roundCorners {
    border-radius: 50%;
}

img.frame {
    border: 5px double #000;
}

img.shadow {
    box-shadow: 0 0 120px;
}

img.position {
    float: left;
}

img.zoom {
    animation: imgZoom 5s infinite;
}

@keyframes imgZoom {
    0% {
        border-color: #ccc;
        transform: scale(1);
    }
    /*25% {
        border-color: #ccc;
        transform: scale(0.8);
    }*/

    50% {
        border-color: #666;
        transform: scale(0.9);
    }
    /*75% {
        border-color: #333;
        transform: scale(0.8);
    }*/

    100% {
        border-color: #ccc;
        transform: scale(1);
    }
}

img.rotate:hover {
    animation: imgRotate 5s infinite;
}

@keyframes imgRotate {
    0% {
        transform: rotateX(0) rotateY(0) rotateZ(0);
    }

    100% {
        transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
    }
}

img.spinX:hover {
    animation: imgSpinX 5s infinite;
}

@keyframes imgSpinX {
    0% {
        transform: rotateX(0deg);
    }

    100% {
        transform: rotateX(720deg);
    }
}

img.spinY:hover {
    animation: imgSpinY 5s infinite;
}

@keyframes imgSpinY {
    0% {
        transform: rotateY(0deg);
    }

    100% {
        transform: rotateY(720deg);
    }
}

img.spinZ:hover {
    animation: imgSpinZ 5s infinite;
}

@keyframes imgSpinZ {
    0% {
        transform: rotateZ(0deg);
    }

    100% {
        transform: rotateZ(720deg);
    }
}

.iceCubeBox {
    border: 10px solid transparent;
}

.iceCube {
    position: relative;
    width: 200px;
    height: 200px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg) rotateY(-30deg);
    margin: 70px auto;
    animation: cubeIce 7s linear infinite;
}
/*.iceCube:hover {
        animation: cubeIce 4s linear infinite;
    }*/
@keyframes cubeIce {
    0% {
        transform: rotateX(-30deg) rotateY(0deg);
    }
    /* 50% {
        transform: rotateX(30deg) rotateY(70deg);
    }*/

    100% {
        transform: rotateX(-30deg) rotateY(360deg);
    }
}

.iceCube div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    z-index: 50;
}

    .iceCube div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(#222, #fff);
        transform: rotateY(calc(90deg * var(--i))) translateZ(100px);
        opacity: 0.5;
    }

.iceCubeBall {
    border-radius: 50%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

    .iceCubeBall img {
        max-width: 200px;
        max-height: 200px;
    }

.iceCubeTop {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 200px;
    background: #fff;
    transform: rotateX(90deg) translateZ(100px);
    opacity: 0.5;
}
/*.iceCubeTop::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 200px;
        height: 200px;
        background: #000;
        transform: translateZ(-380px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(0,0,0,0.2), 0 0 200px rgb(0,0,0,1.4), 0 0 300px rgb(0,0,0,0.6), 0 0 400px rgb(0,0,0,0.8), 0 0 500px rgb(0,0,0,1);
    }*/
.iceCubeBottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 200px;
    background: #fff;
    transform: rotateX(90deg) translateZ(-100px);
    opacity: 0.5;
}

    .iceCubeBottom::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 200px;
        height: 200px;
        background: #000;
        transform: translateZ(-380px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(255,255,255,0.2), 0 0 200px rgb(255,255,255,1.4), 0 0 300px rgb(255,255,255,0.6), 0 0 400px rgb(255,255,255,0.8), 0 0 500px rgb(255,255,255,1);
    }

/*.iceCube {
    position: relative;
    width: 300px;
    height: 300px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg);
    margin: 150px auto;
    animation: cubeIce 12s linear infinite;
}
    @keyframes cubeIce {
    0% {
        transform: rotateX(-30deg) rotateY(0deg);
    }

    100% {
        transform: rotateX(-30deg) rotateY(360deg);
    }
}
    .iceCube h1, .iceCube span i {
        position: absolute;
        top: 50px;
        left: 30px;
        font-size: 2em;
        color: #758318;
    }

.iceCube img {
    max-width: 300px;
    max-height: 300px;
}
.iceCube div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
}
    .iceCube div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(#151515, #00cc00);
        transform: rotateY(calc(90deg * var(--i))) translateZ(150px);
        opacity: 0.5;
    }
.iceCubeBall {
    border-radius: 50%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
    .iceCubeBall img {
        max-width: 200px;
        max-height: 200px;
    }
.iceCubeTop {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 200px;
    background: #222;
    transform: rotateX(90deg) translateZ(150px);
    opacity: 0.5;
}
    .iceCubeTop::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 300px;
        height: 300px;
        background: #0f0;
        transform: translateZ(-380px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(0,255,0, 0.2), 0 0 200px rgb(0,255,0,1.4), 0 0 300px rgb(0,255,0,0.6), 0 0 400px rgb(0,255,0,0.8), 0 0 500px rgb(0,255,0,1);

    }
.iceCubeBottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    height: 300px;
    background: #00cc00;
    transform: rotateX(90deg) translateZ(-150px);
    opacity: 0.5;
}*/

.iceCubeLargeBox {
    border: 10px solid transparent;
    margin: 30px auto;
}

.iceCubeLarge {
    position: relative;
    width: 400px;
    height: 400px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg) rotateY(-30deg);
    margin: 70px auto;
    animation: cubeIceLarge 7s linear infinite;
}
/*.iceCubeLarge:hover {
        animation: cubeIce 4s linear infinite;
    }*/
@keyframes cubeIceLarge {
    0% {
        transform: rotateX(-30deg) rotateY(0deg);
    }
    /* 50% {
        transform: rotateX(30deg) rotateY(70deg);
    }*/

    100% {
        transform: rotateX(-30deg) rotateY(360deg);
    }
}

.iceCubeLarge div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    z-index: 50;
}

    .iceCubeLarge div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(#222, #fff);
        transform: rotateY(calc(90deg * var(--i))) translateZ(200px);
        opacity: 0.5;
    }

.iceCubeLargeBall {
    border-radius: 50%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

    .iceCubeLargeBall img {
        max-width: 400px;
        max-height: 400px;
    }

.iceCubeLargeTop {
    position: absolute;
    top: 0;
    left: 0;
    width: 400px !important;
    height: 400px !important;
    background: #fff;
    transform: rotateX(90deg) translateZ(200px);
    opacity: 0.5;
}
/*.iceCubeLargeTop::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 200px;
        height: 200px;
        background: #000;
        transform: translateZ(-380px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(0,0,0,0.2), 0 0 200px rgb(0,0,0,1.4), 0 0 300px rgb(0,0,0,0.6), 0 0 400px rgb(0,0,0,0.8), 0 0 500px rgb(0,0,0,1);
    }*/
.iceCubeLargeBottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 400px !important;
    height: 400px !important;
    background: #fff;
    transform: rotateX(90deg) translateZ(-200px);
    opacity: 0.5;
}

    .iceCubeLargeBottom::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 400px;
        height: 400px;
        background: #000;
        transform: translateZ(-430px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(255,255,255,0.2), 0 0 200px rgb(255,255,255,1.4), 0 0 300px rgb(255,255,255,0.6), 0 0 400px rgb(255,255,255,0.8), 0 0 500px rgb(255,255,255,1);
    }


.photoBoxLabel {
    /*border: 1px solid red;*/
    transform: rotateX(-19deg) rotateY(-20deg) rotateZ(0deg);
    /*transform: rotateX(60deg) translateZ(30px) rotateY(5deg) translateY(0px);*/
    margin-left: 50px;
}

.iceCubeFrameBox {
    border: 10px solid transparent;
    margin: 10px auto;
    /*border: 1px solid red;*/
    transform: translateX(-5px);
}

.iceCubeFrame {
    position: relative;
    width: 400px;
    height: 400px;
    transform-style: preserve-3d;
    transform: rotateX(-20deg) rotateY(-20deg);
    margin: 50px auto 0 auto;
    /*animation: cubeIceFrame 7s ease-in-out 1s;*/
    /*border: 10px solid red;*/
}

    .iceCubeFrame:hover {
        animation: cubeIceFrame 7s ease-in-out infinite;
    }
/*.iceCubeFrame:hover {
        animation: cubeIce 4s linear infinite;
    }*/
@keyframes cubeIceFrame {
    0% {
        transform: rotateX(-20deg) rotateY(-20deg);
    }
    /* 50% {
        transform: rotateX(30deg) rotateY(70deg);
    }*/

    100% {
        transform: rotateX(-20deg) rotateY(340deg);
    }
}

.iceCubeFrame div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    z-index: 50;
    /*border: 3px solid red;*/
}

    .iceCubeFrame div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(#222, #fff);
        transform: rotateY(calc(90deg * var(--i))) translateZ(200px);
        opacity: 0.5;
    }

        .iceCubeFrame div span.side1, .iceCubeFrame div span.side2, .iceCubeFrame div span.side3, .iceCubeFrame div span.side4 {
            position: absolute;
            /*background: linear-gradient(#222, #fff);*/
            background: #000 !important;
        }

        .iceCubeFrame div span.side1 {
            transform: rotateY(0deg) translateZ(0px);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0.2 !important;
            display: none;
        }

        .iceCubeFrame div span.side2 {
            transform: rotateY(90deg) translateZ(350px) translateX(0px);
            top: 0;
            left: 0;
            width: 25%;
            height: 100%;
            opacity: 0.8;
            text-align: center;
        }

            .iceCubeFrame div span.side2 i {
                position: absolute;
                writing-mode: vertical-lr;
                top: 50px;
                left: 30px;
                font-size: 2em;
                color: #079f6a !important;
                letter-spacing: 0.1em;
                opacity: 1 !important;
            }

        .iceCubeFrame div span.side3 {
            transform: rotateY(180deg) translateZ(50px);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: #000 !important;
            opacity: 0.8 !important;
            /*position: relative;*/
            text-align: center;
        }

            .iceCubeFrame div span.side3 i {
                transform: rotateY(0deg) translateZ(50px);
                position: absolute;
                top: 150px;
                left: 150px;
                font-size: 2em;
                color: #fff !important;
                opacity: 1 !important;
            }

        .iceCubeFrame div span.side4 {
            transform: rotateY(270deg) translateZ(50px) translateX(0px);
            top: 0;
            left: 0;
            width: 25%;
            height: 100%;
            opacity: 0.8;
        }

            .iceCubeFrame div span.side4 i {
                position: absolute;
                writing-mode: vertical-lr;
                top: 50px;
                left: 30px;
                font-size: 2em;
                color: #fff !important;
                opacity: 1 !important;
            }

.iceCubeFrameBall {
    border-radius: 50%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    /*border: 1px solid red;*/
}

    .iceCubeFrameBall img, .iceCubeFrameBall a {
        max-width: 400px;
        max-height: 400px;
        transform: translateZ(50px);
        /*position: absolute;
        top: 10px;
        left: 10px;*/
    }

.iceCubeFrameTop {
    position: absolute;
    top: 0;
    left: 0;
    width: 400px !important;
    height: 100px !important;
    background: #333;
    transform: rotateX(90deg) translateZ(50px) translateY(0px);
    opacity: 0.6;
    /* border: 1px solid #000;*/
}
/*.iceCubeFrameTop::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 200px;
        height: 200px;
        background: #000;
        transform: translateZ(-380px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(0,0,0,0.2), 0 0 200px rgb(0,0,0,1.4), 0 0 300px rgb(0,0,0,0.6), 0 0 400px rgb(0,0,0,0.8), 0 0 500px rgb(0,0,0,1);
    }*/
.iceCubeFrameBottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 400px !important;
    height: 100px !important;
    background: #000;
    transform: rotateX(90deg) translateZ(-350px) translateY(0px);
    opacity: 0.8;
    /*border: 2px solid red;*/
}

    .iceCubeFrameBottom::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 400px !important;
        height: 100px !important;
        background: #000;
        /*transform: translateX(-300px) !important;
        transform: translateY(-300px) !important;
        transform: translateZ(-300px) !important;*/
        filter: blur(20px);
        /*box-shadow: 0 0 120px rgb(255,255,255,0.2), 0 0 200px rgb(255,255,255,1.4), 0 0 300px rgb(255,255,255,0.6), 0 0 400px rgb(255,255,255,0.8), 0 0 500px rgb(255,255,255,1);*/

        box-shadow: 5px 5px blue, 10px 10px red, 15px 15px green;
        /*border: 10px solid red;*/
    }


.lightCube {
    position: relative;
    width: 300px;
    height: 300px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg);
    margin: 150px auto;
    /*animation: light 5s linear infinite;*/
    /*    display: table-cell;
    text-align: center;
    vertical-align: middle;*/
}
    /*@keyframes light {
    0% {
        transform: rotateX(-30deg) rotateY(0deg);
    }

    100% {
        transform: rotateX(-30deg) rotateY(360deg);
    }
}*/
    .lightCube h1, .lightCube span i {
        /*position: absolute;
    top: 50px;
    left: 30px;
    font-size: 2em;
    color: #758318;*/
    }

    .lightCube img {
        max-width: 300px;
        max-height: 300px;
        /*border: 5px solid red;*/
        margin-left: 0;
        /*margin-top: -10px;*/
        /*padding: 0;*/
    }

    .lightCube div {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        transform-style: preserve-3d;
        /*border: 5px solid blue;*/
    }

        .lightCube div span {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(#151515, #00cc00);
            transform: rotateY(calc(90deg * var(--i))) translateZ(150px);
        }

.lightCubeTop {
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    height: 300px;
    background: #222;
    transform: rotateX(90deg) translateZ(150px);
}

    .lightCubeTop::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 300px;
        height: 300px;
        /*background: #0f0;*/
        transform: translateZ(-380px);
        filter: blur(20px);
        /*        box-shadow: 0 0 120px rgb(0,255,0, 0.2), 0 0 200px rgb(0,255,0,1.4), 0 0 300px rgb(0,255,0,0.6), 0 0 400px rgb(0,255,0,0.8), 0 0 500px rgb(0,255,0,1);
*/
    }

.lightCubeBottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 300px;
    height: 300px;
    background: #00cc00;
    transform: rotateX(90deg) translateZ(-150px);
}

.lightCubeSmall {
    position: relative;
    width: 200px;
    height: 200px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg);
    margin: 90px auto;
    animation: lightCubeSmall 12s linear infinite;
}

@keyframes lightCubeSmall {
    0% {
        transform: rotateX(-50deg) rotateY(0deg);
    }

    50% {
        transform: rotateX(50deg) rotateY(180deg);
    }

    100% {
        transform: rotateX(-50deg) rotateY(360deg);
    }
}

.lightCubeSmall h1, .lightCubeSmall span i {
    /*position: absolute;
    top: 50px;
    left: 30px;
    font-size: 2em;
    color: #758318;*/
}

.lightCubeSmall img {
    max-width: 200px;
    max-height: 200px;
    margin-left: 0;
}

.lightCubeSmall div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
}

    .lightCubeSmall div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(#151515, #dce50f);
        transform: rotateY(calc(90deg * var(--i))) translateZ(100px);
    }

.lightCubeSmallTop {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
    background: #222;
    transform: rotateX(90deg) translateZ(100px);
}

    .lightCubeSmallTop::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 200px;
        height: 200px;
        transform: translateZ(100px);
        filter: blur(20px);
        /*        box-shadow: 0 0 120px rgb(0,255,0,0.2), 
                    0 0 200px rgb(0,255,0,1.4), 
                    0 0 300px rgb(0,255,0,0.6), 
                    0 0 400px rgb(0,255,0,0.8), 
                    0 0 500px rgb(0,255,0,1);*/
        /*animation: lightHoverSmall 12s linear infinite;*/
    }

@keyframes lightHoverSmall {
    0%, 100% {
        background: #dce50f;
        transform: translateZ(-380px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(0,255,0,0.2), 0 0 200px rgb(0,255,0,1.4), 0 0 300px rgb(0,255,0,0.6), 0 0 400px rgb(0,255,0,0.8), 0 0 500px rgb(0,255,0,1);
    }

    30%,70% {
        background: none;
        box-shadow: none;
    }
}

.lightCubeSmallBottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
    background: #dce50f;
    transform: rotateX(90deg) translateZ(-100px);
}

.lightCubeMedium {
    position: relative;
    width: 500px;
    height: 500px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg);
    margin: 0px auto;
    animation: lightCubeMedium 12s linear infinite;
}

.lightCubeMediumRev {
    position: relative;
    width: 500px;
    height: 500px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg);
    margin: 0px auto;
    animation: lightCubeMediumRev 12s linear infinite;
}

@keyframes lightCubeMedium {
    0% {
        transform: rotateX(-5deg) rotateY(0deg);
    }
    /*50% {
        transform: rotateX(50deg) rotateY(180deg);
    }*/

    100% {
        transform: rotateX(-5deg) rotateY(360deg);
    }
}

@keyframes lightCubeMediumRev {
    0% {
        transform: rotateX(-5deg) rotateY(0deg);
    }
    /*50% {
        transform: rotateX(50deg) rotateY(180deg);
    }*/

    100% {
        transform: rotateX(-5deg) rotateY(-360deg);
    }
}

.lightCubeMedium img, .lightCubeMediumRev img {
    max-width: 500px;
    max-height: 500px;
    margin-left: 0;
}

.lightCubeMedium div, .lightCubeMediumRev div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
}

    .lightCubeMedium div span, .lightCubeMediumRev div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        transform: rotateY(calc(120deg * var(--i))) translateZ(200px);
    }

.lightCubeLarge {
    position: relative;
    width: 500px;
    height: 500px;
    transform-style: preserve-3d;
    transform: rotateX(-30deg);
    margin: 170px auto;
    animation: lightCubeLarge 12s linear infinite;
}

@keyframes lightCubeLarge {
    0% {
        transform: rotateX(-50deg) rotateY(0deg);
    }

    50% {
        transform: rotateX(50deg) rotateY(180deg);
    }

    100% {
        transform: rotateX(-50deg) rotateY(360deg);
    }
}

.lightCubeLarge h1, .lightCubeLarge span i {
    /*position: absolute;
    top: 50px;
    left: 30px;
    font-size: 2em;
    color: #758318;*/
}

.lightCubeLarge img {
    max-width: 500px;
    max-height: 500px;
    margin-left: 0;
}

.lightCubeLarge div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
}

    .lightCubeLarge div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(#151515, #dce50f);
        transform: rotateY(calc(90deg * var(--i))) translateZ(250px);
    }

.lightCubeLargeTop {
    position: absolute;
    top: 0;
    left: 0;
    width: 450px;
    height: 450px;
    background: #222;
    transform: rotateX(90deg) translateZ(250px);
}

    .lightCubeLargeTop::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 600px;
        height: 600px;
        transform: translateZ(100px);
        filter: blur(20px);
        /*        box-shadow: 0 0 120px rgb(0,255,0,0.2), 
                    0 0 200px rgb(0,255,0,1.4), 
                    0 0 300px rgb(0,255,0,0.6), 
                    0 0 400px rgb(0,255,0,0.8), 
                    0 0 500px rgb(0,255,0,1);*/
        /*animation: lightHoverLarge 12s linear infinite;*/
    }

@keyframes lightHoverLarge {
    0%, 100% {
        background: #dce50f;
        transform: translateZ(-380px);
        filter: blur(20px);
        box-shadow: 0 0 120px rgb(0,255,0,0.2), 0 0 200px rgb(0,255,0,1.4), 0 0 300px rgb(0,255,0,0.6), 0 0 400px rgb(0,255,0,0.8), 0 0 500px rgb(0,255,0,1);
    }

    30%,70% {
        background: none;
        box-shadow: none;
    }
}

.lightCubeLargeBottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 450px;
    height: 450px;
    background: #dce50f;
    transform: rotateX(90deg) translateZ(-250px);
}

.lightCubeOne {
    position: relative;
    width: 600px;
    height: 600px;
    transform-style: preserve-3d;
    /*transform: rotateX(-30deg);*/
    margin: 100px auto;
    animation: lightCubeOne 12s linear infinite;
    border: 20px solid #fff;
    overflow: hidden;
}

@keyframes lightCubeOne {
    0% {
        transform: rotateX(-5deg) rotateY(0deg);
    }

    100% {
        transform: rotateX(-5deg) rotateY(360deg);
    }
}

.lightCubeOne img {
    max-width: 600px;
    max-height: 600px;
    margin-left: 0;
}

.lightCubeOne div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
}

    .lightCubeOne div span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        /* background: linear-gradient(#151515, #dce50f);*/
        /*background: #000;*/
        transform: rotateY(calc(120deg * var(--i))) translateZ(0px);
    }
/*.lightCubeOne:hover {
    animation: lightHoverOne 2s linear infinite;
}*/
@keyframes lightHoverOne {
    0% {
        transform: rotateY(0deg);
    }

    100% {
        transform: rotateY(360deg);
    }
}

#slideImg1 {
    left: -2%;
    z-index: 1;
}

#slideImg2 {
    left: 11%;
    z-index: 2;
}

#slideImg3 {
    left: 24%;
    z-index: 3;
}

#slideImg4 {
    left: 37%;
    z-index: 4;
}

#slideImg5 {
    right: 35.5%;
    z-index: 5;
}

#slideImg6 {
    right: 22.5%;
    z-index: 6;
}

#slideImg7 {
    right: 10%;
    z-index: 7;
}

#slideImg8 {
    right: -2%;
    z-index: 8;
}

.slideBox {
    position: relative;
    /*display: flex;
    z-index: 1;*/
    padding: 0;
    /*border: 1px solid blue;*/
    width: 100%;
    height: 150px;
    margin: 0 auto 0 auto;
}

    .slideBox img {
        position: absolute;
        top: 0;
        /*left: 0px;*/
        display: block;
        width: 150px;
        height: 150px;
        /* opacity: 0;*/
        animation: dudeSlide 2s alternate;
        animation-delay: calc(var(--i) * 1s);
    }

@keyframes dudeSlide {
    0% {
        transform: translateY(0) scale(1);
        /*opacity: 1;*/
    }

    25% {
        transform: translateY(40px) scaleY(0.5);
    }

    50% {
        transform: translateY(0) scaleY(1);
    }

    75% {
        transform: translateY(-40px) scaleY(1.1);
    }

    100% {
        /*transform: translateY(-100px) scale(0);
        opacity: 1;*/
        transform: translateY(0) scaleY(1);
    }
}




.coffeeBox {
    position: relative;
    width: 260px;
    height: 200px;
    margin: 120px auto 50px auto;
    /* top: 250px;*/
    /* border: 1px solid red;*/
    text-align: center;
    /* animation: coffeeBox 5s ease-in-out infinite;*/
}

@keyframes coffeeBox {
    0%, 100% {
        /*transform: rotateZ(0);*/
        transform: scale(0.5);
    }
    /*    50% {
        transform: translateY(50px) scale(0.9);
        --cupColor1: #eb1d1d;
    }*/
}

.coffeeCup {
    position: relative;
    width: 150px;
    height: 150px;
    margin: 0 auto 0 auto;
    background: linear-gradient(to right, var(--cupColor1), var(--cupColor2));
    border-bottom-left-radius: 45%;
    border-bottom-right-radius: 45%;
    z-index: 25;
}

.cupTop {
    position: absolute;
    top: -30px;
    left: 0;
    width: 100%;
    height: 60px;
    background: linear-gradient(to right, var(--cupColor1), var(--cupColor2));
    /*background: linear-gradient(to right, #9b9896, #ccc);*/
    border-radius: 50%;
}

    .cupTop:hover {
        /*background: linear-gradient(to right, var(--cupColor1), var(--cupColor2));*/
        /*background: linear-gradient(to right, #9b9896, #fff);*/
    }

.cupCircle {
    position: absolute;
    top: 5px;
    left: 10px;
    width: calc(100% - 20px);
    height: 50px;
    background: linear-gradient(to left, var(--cupColor1), var(--cupColor2));
    border-radius: 50%;
    overflow: hidden;
}

.cupTea {
    position: absolute;
    top: 20px;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to left, transparent, #8cea98 50%);
    border-radius: 50%;
}

.cupHandle {
    position: absolute;
    right: -30px;
    top: 10px;
    width: 70px;
    height: 90px;
    border: 15px solid var(--cupColor2);
    border-left: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-radius: 50%;
    transform: rotate(37deg);
    z-index: 20;
}

.coffeePlate {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: 250px;
    height: 150px;
    background: linear-gradient(to right, var(--cupColor1), var(--cupColor2));
    /*background: linear-gradient(to right, #9b9896, #ccc);*/
    border-radius: 50%;
    box-shadow: 0 35px rgb(0,0,0,0.2);
    z-index: 1;
}

    .coffeePlate:hover {
        /*background: linear-gradient(to right, #9b9896, #fff);*/
        background: linear-gradient(to right, var(--cupColor1), var(--cupColor2));
    }

    .coffeePlate::before {
        content: '';
        position: absolute;
        top: 10px;
        left: 10px;
        right: 10px;
        bottom: 10px;
        border-radius: 50%;
        background: linear-gradient(to left, var(--cupColor1), var(--cupColor2));
        z-index: 1;
    }

    .coffeePlate::after {
        content: '';
        position: absolute;
        top: 30px;
        left: 30px;
        right: 30px;
        bottom: 30px;
        background: radial-gradient(rgba(0,0,0,0.2) 25%, transparent, transparent);
        border-radius: 50%;
        z-index: 1;
    }

.cupText {
    position: absolute;
    top: 90px;
    left: 40px;
    font-size: 2em;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    color: #000;
}

.vapour {
    position: relative;
    display: flex;
    z-index: 1;
    padding: 0 20px;
}

    .vapour span {
        position: relative;
        bottom: 50px;
        display: block;
        margin: 0 2px 60px 0;
        min-width: 4px;
        height: 120px;
        background: #fff;
        border-radius: 50%;
        animation: coffeeSmoke 5s linear infinite;
        opacity: 0.5;
        filter: blur(8px);
        animation-delay: calc(var(--i) * 0.5s);
    }
/* .vapour span:hover {

        background: #000;

    }*/
.teaLable {
    position: absolute;
    left: 20px;
    top: 70px;
    width: 50px;
    height: 50px;
    border: 2px solid #666;
    /* border-left: 15px solid transparent;*/
    /*border-bottom: 15px solid transparent;*/
    border-radius: 10%;
    transform: rotate(17deg);
    background: linear-gradient(to left, #fff, #ccc);
    z-index: 20;
}

    .teaLable::before {
        content: '';
        position: absolute;
        top: -50px;
        left: 21px;
        right: 21px;
        bottom: 40px;
        /*border-radius: 50%;*/
        background: linear-gradient(to left, #fff, #ccc);
        z-index: 1;
    }

    .teaLable p {
        margin: 10px;
        /*    color: #fff;
*/
    }

@keyframes coffeeSmoke {
    0% {
        transform: translateY(0) scaleX(1);
    }

    15% {
        opacity: 0.9;
    }

    50% {
        transform: translateY(-150px) scaleX(5);
    }

    95% {
        opacity: 0.8;
    }

    100% {
        transform: translateY(-300px) scaleX(10);
    }
}



#ufoNarrow {
    background: transparent url(../Space/BlackNight.png) repeat 40% 30%;
    position: relative;
    height: 200px;
    z-index: 1;
    border-radius: 0;
    border-top: 5px solid #999;
    border-bottom: 5px solid #999;
}

.ufoNarrowBG {
    
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
}

#uN1 {
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 20%;
    animation: ufoN1 10s linear 0s infinite forwards;
    max-width: 100px;
    max-height: 100px;
}

#uN2 {
    z-index: 2;
    position: absolute;
    left: 1%;
    top: 40%;
    animation: ufoN2 8s linear 0s infinite forwards;
    max-width: 100px;
    max-height: 100px;
}

#uN3 {
    z-index: 2;
    position: absolute;
    left: 5%;
    top: 7%;
    animation: ufoN3 16s linear 0s infinite forwards;
    max-width: 120px;
    max-height: 120px;
}

#pN1 {
    z-index: 2;
    position: absolute;
    right: 30%;
    top: 1%;
    animation: planetN1 16s linear 0s infinite forwards;
    max-width: 120px;
    max-height: 120px;
    z-index: 1;
}

@keyframes ufoN1 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
    }

    50% {
        transform: translateX(-650px) rotateX(0deg) rotateZ(0deg) scale(0.8);
    }

    51% {
        transform: translateX(-650px) rotateX(180deg) rotateZ(180deg) scale(0.8);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
    }
}

@keyframes ufoN2 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
        opacity: 1;
    }

    50% {
        transform: translateX(800px) rotateX(0deg) rotateZ(0deg) scale(0.8);
    }

    51% {
        transform: translateX(800px) rotateX(180deg) rotateZ(180deg) scale(0.8);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
    }
}

@keyframes ufoN3 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.7);
        opacity: 1;
    }

    50% {
        transform: translateX(600px) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    51% {
        transform: translateX(600px) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }
}

@keyframes planetN1 {
    0% {
        transform: rotateZ(0deg) scale(0.7);
    }

    100% {
        transform: rotateZ(360deg) scale(0.7);
    }
}


#aquariumNarrow {
    background: transparent url(../../Aquarium/BG_004.png) repeat center 75%;
    background-size: 100%;
    position: relative;
    height: 300px;
    z-index: 1;
    border-radius: 0;
    border-top: 2px solid #666;
    border-bottom: 2px solid #666;
}

.aquariumNarrowBG {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-size: 100%;
    z-index: 3;
}
/*.aquariumNarrowFG {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: transparent url(../../Images/BG_Circle_T_BG.png) no-repeat center center;
    background-size: 100%;
    background-color: #000;
    opacity: 0.5;
    z-index: 10;
}*/
#fN1, #fN2, #fN3, #fN4, #fN5, #fN6, #fN7, #fN8, #fN9 {
    width: 15%;
}

#fN1 {
    z-index: 2;
    position: absolute;
    left: 2%;
    top: 25%;
    animation: fishN1 14s linear 0s infinite forwards;
}

#fN2 {
    z-index: 2;
    position: absolute;
    right: 5%;
    bottom: 30%;
    animation: fishN2 7s linear 0s infinite forwards;
}

#fN3 {
    z-index: 2;
    position: absolute;
    right: 2%;
    top: -25%;
    animation: fishN3 16s linear 0s infinite forwards;
}

#fN4 {
    z-index: 2;
    position: absolute;
    left: 5%;
    bottom: 10%;
    animation: fishN4 21s linear 0s infinite forwards;
}

#fN5 {
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 20%;
    animation: fishN5 9s linear 0s infinite forwards;
}

#fN6 {
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 17%;
    animation: fishN6 14s linear 0s infinite forwards;
}

#fN7 {
    z-index: 2;
    position: absolute;
    left: 2%;
    top: 28%;
    animation: fishN7 8s linear 0s infinite forwards;
}

#fN8 {
    z-index: 2;
    position: absolute;
    left: 2%;
    bottom: 7%;
    animation: fishN8 11s linear 0s infinite forwards;
}

#fN9 {
    z-index: 2;
    position: absolute;
    right: 2%;
    bottom: 0%;
    animation: fishN9 20s linear 0s infinite forwards;
}

@keyframes fishN1 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthRighFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthRighFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN2 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthLeftFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthLeftFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN3 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthLeftFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthLeftFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN4 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthRighFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthRighFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN5 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthLeftFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthLeftFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN6 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthLeftFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthLeftFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN7 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
        opacity: 1;
    }

    50% {
        transform: translateX(var(--lengthRighFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthRighFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN8 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthRighFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthRighFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}

@keyframes fishN9 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(var(--lengthLeftFull)) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(var(--lengthLeftFull)) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}


#aquarium {
    background: transparent url(../../Aquarium/BG_004.png) repeat 80% 80%;
    background-size: 100%;
    position: relative;
    height: 1000px;
    z-index: 1;
    border-radius: 0;
}

.aquariumBG {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    background-size: 100%;
    z-index: 3;
}
/*.aquariumFG {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    background: transparent url(../../Images/Black_20.png) repeat center center;
    background-color: #000;
    opacity: 0.5;
}*/
#f1, #f2, #f3, #f4, #f5, #f6, #f7, #f8, #f9 {
    width: 10%;
}

#f1 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    left: 2%;
    top: 50%;
    animation: fish1 11s linear 0s infinite forwards;
}

#f2 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 20%;
    animation: fish2 8s linear 0s infinite forwards;
}

#f3 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 0%;
    animation: fish3 6s linear 0s infinite forwards;
}

#f4 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    left: 2%;
    top: 30%;
    animation: fish4 14s linear 0s infinite forwards;
}

#f5 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 40%;
    animation: fish5 19s linear 0s infinite forwards;
}

#f6 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 55%;
    animation: fish6 16s linear 0s infinite forwards;
}

#f7 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    left: 2%;
    top: 7%;
    animation: fish7 9s linear 0s infinite forwards;
}

#f8 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    left: 2%;
    top: 70%;
    animation: fish8 7s linear 0s infinite forwards;
}

#f9 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 77%;
    animation: fish9 20s linear 0s infinite forwards;
}

#b1 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    left: 20%;
    top: 60%;
    animation: bubble1 20s linear 0s infinite forwards;
}

#b2 {
    /*width: 70px;*/
    z-index: 2;
    position: absolute;
    right: 20%;
    top: 30%;
    animation: bubble2 15s linear 0s infinite forwards;
}

@keyframes fish1 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
    }

    50% {
        transform: translateX(900px) rotateX(0deg) rotateZ(0deg) scale(0.9);
    }

    51% {
        transform: translateX(900px) rotateX(180deg) rotateZ(180deg) scale(0.9);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
    }
}

@keyframes fish2 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
        /*        opacity: 1;
*/
    }

    50% {
        transform: translateX(-850px) rotateX(0deg) rotateZ(0deg) scale(0.9);
        /*   opacity: 0;*/
    }

    51% {
        transform: translateX(-850px) rotateX(180deg) rotateZ(180deg) scale(0.9);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        /*   opacity: 0;*/
    }
}

@keyframes fish3 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    50% {
        transform: translateX(-900px) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    51% {
        transform: translateX(-900px) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }
}

@keyframes fish4 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
    }

    50% {
        transform: translateX(900px) rotateX(0deg) rotateZ(0deg) scale(0.8);
    }

    51% {
        transform: translateX(900px) rotateX(180deg) rotateZ(180deg) scale(0.8);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
    }
}

@keyframes fish5 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    50% {
        transform: translateX(-850px) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    51% {
        transform: translateX(-850px) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }
}

@keyframes fish6 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.6);
        opacity: 1;
    }

    50% {
        transform: translateX(-900px) rotateX(0deg) rotateZ(0deg) scale(0.6);
        /*   opacity: 0;*/
    }

    51% {
        transform: translateX(-900px) rotateX(180deg) rotateZ(180deg) scale(0.6);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.6);
        /*   opacity: 0;*/
    }
}

@keyframes fish7 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    50% {
        transform: translateX(900px) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    51% {
        transform: translateX(900px) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }
}

@keyframes fish8 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    50% {
        transform: translateX(900px) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    51% {
        transform: translateX(900px) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }
}

@keyframes fish9 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    50% {
        transform: translateX(-900px) rotateX(0deg) rotateZ(0deg) scale(0.7);
    }

    51% {
        transform: translateX(-900px) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.7);
    }
}

.boubleBox {
    width: 50%;
    position: absolute;
    bottom: 0;
    left: 30%;
    display: flex;
    z-index: 1;
    padding: 0 20px;
    /*border: 10px solid red;*/
}

    .boubleBox span {
        position: relative;
        bottom: 50px;
        display: block;
        margin: 0 auto;
        /*min-width: 4px;*/
        width: 90px;
        height: 90px;
        /*background: #000;*/
        background: url(../../Images/Fish_Boble.png) center center no-repeat;
        border-radius: 50%;
        animation: boubleBrus 15s linear infinite;
        opacity: 0;
        /*filter: blur(8px);*/
        animation-delay: calc(var(--i) * 3s);
    }

@keyframes boubleBrus {
    0% {
        transform: translateY(0) scale(1);
    }

    25% {
        transform: translateY(-250px) translateX(100px) scale(1);
        opacity: 0.3;
    }

    50% {
        transform: translateY(-350px) translateX(200px) scale(1);
        opacity: 0;
    }

    75% {
        transform: translateY(-100px) translateX(100px) scale(1);
        opacity: 0.5;
    }

    100% {
        transform: translateY(-700px) translateX(-100px) scale(1);
        opacity: 0;
    }
}

#aquariumWindow {
    margin: 0 auto;
    position: relative;
    width: 400px;
    height: 400px;
    background: transparent url(../../Aquarium/BG_004.png) no-repeat 0 0;
    background-size: 100%;
    /*border: 10px solid #ccc;*/
    border-radius: 50%;
    z-index: 1;
    /* border-radius: 50%;
    border: 20px solid #666;*/
    /*BOX SHADDOW
    -moz-box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
    -webkit-box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);
    box-shadow: 1px 1px 2px hsla(0,0%,0%,.3);*/
    /*border-color: transparent hsla(777,4%,76%,.5) transparent transparent;*/
    /* background: radial-gradient(circle, #ccc 0%, #000);
    background-blend-mode: screen;*/
}
.aquariumWindow {
    position: absolute;
    z-index: 10;
    top: 0;
    bottom: 0;
    border-radius: 50%;
}
    .aquariumWindow img {
        border-radius: 50%;
    }
#fw1 {
    z-index: 2;
    position: absolute;
    right: 2%;
    top: 10%;
    animation: fishW1 15s linear 0s infinite forwards;
}
@keyframes fishW1 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(-180px) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(-180px) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}
#fw2 {
    z-index: 2;
    position: absolute;
    right: 0%;
    top: 40%;
    animation: fishW2 12s linear 0s infinite forwards;
}
@keyframes fishW2 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(-200px) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(-200px) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}
#fw4 {
    z-index: 2;
    position: absolute;
    left: 1%;
    top: 25%;
    animation: fishW4 10s linear 0s infinite forwards;
}
@keyframes fishW4 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(200px) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(200px) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}
#fw6 {
    z-index: 2;
    position: absolute;
    left: 4%;
    top: 45%;
    animation: fishW6 25s linear 0s infinite forwards;
}
@keyframes fishW6 {
    0% {
        transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    50% {
        transform: translateX(200px) rotateX(0deg) rotateZ(0deg) scale(0.3);
    }

    51% {
        transform: translateX(200px) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }

    100% {
        transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.3);
    }
}




@media (min-width:991px) and (max-width: 1200px) {


    #aquariumWindow
    {
        display: none;
    }

    .room {
        min-width: 200px;
        min-height: 530px;
    }
        /*.room h3 {
            top: 20px;
            right: -25px;
            font-size: 1.5em;
        }*/

    .wallPlacer {
        top: 20px;
        left: 330px;
        /*border: 1px solid red;*/
    }
        .wallPlacer img {
            max-width: 220px;
            max-height: 220px;
        }
    .basketFlex {
        margin: 20px 0;
    }
    /*.basketCartFlex {
        margin: 40px 0 0 0;
        border: 1px solid red;
    }

    .basketCart {
        top: 65%;
        bottom: 20px;
    }*/

    ul.menu li img.menuImage {
        width: 20px;
        float: left;
        margin: 0 !important;
        padding: 0 !important;
    }

    ul.menu span {
        display: none;
    }

    img {
        border: 0px solid #dcd8c2;
        width: auto;
        margin: 0 auto;
    }

/*    span.headerOver, span.sizeOver, span.typeOver, span.priceOver, span.editionOver, span.offerOver, span.soldOver {
        font-size: 0.7em !important;
    }*/
}

@media (min-width:0) and (max-width: 991px) {

    .boxText, .boxTextBlack, .boxTextWhite {
        /*padding: 0 10px 10px 10px;*/
        margin: 10px;
    }

    .boxText, .boxTextBlack, .boxTextWhite {
        text-align: left !important;
    }

        .boxText h5, .boxTextBlack h5, .boxTextWhite h5 {
            font-size: 1.2em;
        }

        .boxText p, .boxTextBlack p, .boxTextWhite p {
            font-size: 0.5em;
        }

    /*.textFp {
        padding-top: 10px;
    }*/
    .textFp h5 {
        font-size: 1.5em;
        writing-mode: horizontal-tb;
        margin-top: 0;
    }

    h1.centerBlack {
        font-size: 1.5em;
        margin: 3px !important;
    }

    .basketFlex {
        margin: 10px 0;
        padding-top: 10px;
    }
    .basketCartFlex {
        margin: 40px 0 40px 0;
       /* border: 1px solid red;*/
    }

    .basketCart {
        /*top: 85%;
        bottom: 20px;*/
    }

    .iceCubeFrame {
        margin-top: 0;
    }

    .room {
        min-width: 100%;
        min-height: 400px;
    }

       /* .room h3 {
            top: 0;
            right: -23px;
            font-size: 1em;
        }*/

    .wallPlacer {
        top: 30px;
        left: 29%;
        /*border: 1px solid red;*/
    }

        .wallPlacer a {
            font-size: 1em !important;
            color: #000 !important :
        }

        .wallPlacer img {
            width: 60%;
            height: 60%;
        }

    .detailHolder {
        margin: 0 auto;
        background: none;
        padding: 0;
        box-shadow: none;
        border: 0px solid #fff;
    }

        .detailHolder h3 {
            border: 1px solid #666;
            background: #000;
            color: #fff !important;
            padding: 10px 30px;
            display: inline-block;
            border-radius: 25px;
        }

        div.detailIMG img.imgD, .detailHolder h6 {
            display: none;
        }

    .textBox {
        float: right;
    }

    .media-scroller {
        grid-auto-columns: 90%;
    }

    h1.center {
        font-size: 1em;
    }

    .navMenuSub li {
        float: none !important;
        border: 1px solid #999;
        text-align: center;
        background-color: #000;
    }

        .navMenuSub li:hover {
            background-color: #666;
        }

        .navMenuSub li a {
            font-size: 0.8em !important;
            color: #fff !important;
            padding: 0 !important;
            margin: 0 !important;
        }

        .navMenuSub li.active a {
            color: #1096b4 !important;
        }


    .placeMobile {
        display: none;
    }

    .mobileHiding {
        display: none !important;
    }

    .mobileShowing {
        display: block;
    }

    img {
        border: 0px solid #dcd8c2;
        width: auto;
        margin: 0 auto;
        /*max-height: 500px;*/
    }

    h1.logo, h2.logo {
        font-size: 2.5em;
        margin: 1px auto 10px auto;
        text-align: center;
    }

    .slideBox .slideImg {
        margin-top: 0px;
        width: auto;
    }

    .photoArtICE {
        display: none;
    }

    .jeweleryBox {
        display: none;
    }

    .heightFast {
        border-radius: 5px;
        height: auto;
    }

    .frontPageImage {
        max-height: 200px;
        max-width: 200px;
    }

    p.quantity {
        /*border: 1px solid red;*/
        margin-top: 50px;
    }

    span.pagerLink a, span.pagerLinkActive {
        /*border: 1px solid red;*/
        top: 50px;
    }

/*    .basketBoxCart {
        position: relative;
        min-height: 120px;
        margin-top: 15px;
    }*/


    .plankBox {
        position: relative;
        min-height: 100px;
    }

    .plank {
        top: 87%;
        bottom: 1px;
        border: 2px solid #e7eeed;
    }

    .plankImg1, .plankImg2, .plankImg3, .plankImg4, .plankImg5, .plankImg6, .plankImg7, .plankImg8 {
        bottom: 10px;
    }

    .designPager {
        background: none;
        border: none;
    }

    .pager1, .pager2, .pager3, .pager4, .pager5, .pager6, .pager7, .pager8, .pager9, .pager10, .pager11, .pager12 {
        margin: 0 auto 20px auto;
    }

        .pager1 img, .pager2 img, .pager3 img, .pager4 img, .pager5 img, .pager6 img, .pager7 img, .pager8 img, .pager9 img, .pager10 img, .pager11 img, .pager12 img {
            width: auto;
            height: auto;
            max-height: auto;
            max-width: auto;
            margin: 0 auto 10px auto;
            border: 3px solid #fff;
        }

        .pager1 span.price, .pager2 span.price, .pager3 span.price, .pager4 span.price, .pager5 span.price, .pager6 span.price, .pager7 span.price, .pager8 span.price, .pager9 span.price, .pager10 span.price, .pager11 span.price, .pager12 span.price {
            left: 30%;
        }


    .designSendert {
        width: 100%;
        overflow: hidden;
        /*border: 5px solid blue;*/
    }

        .designSendert .divIcon {
            display: normal;
            width: 2000px;
            margin: 10px auto;
            /*            border: 5px solid red;*/
        }

        .designSendert .divThumb {
            display: normal;
            width: 2000px;
            margin: 10px auto;
            /*            border: 5px solid red;*/
        }

        .designSendert .divLarge {
            display: normal;
            width: 2000px;
            margin: 10px auto;
            /*            border: 5px solid red;*/
        }

        .designSendert img {
            width: 100%;
            margin: 10px auto !important;
            /*max-height: 1900px;
        max-width: 1500px;*/
        }


    .rainbow {
        height: auto;
    }

        .rainbow .snipp {
            width: 90%;
            margin: 0 auto;
            margin-bottom: 20px;
            max-height: 1500px;
            height: 500px;
        }

        .rainbow img {
            max-height: 150px;
            height: auto;
            width: auto;
            max-width: auto;
        }

    .footer a {
        margin-left: 0;
    }

    .slideBox {
        height: 100px;
    }

        .slideBox img {
            width: 100px;
            height: 100px;
        }

    .ufoFG {
        display: none !important;
    }

    .ufoNarrowFG {
        display: none !important;
    }

    @keyframes ufoN1 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        50% {
            transform: translateX(-350px) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(-350px) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes ufoN2 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(400px) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(400px) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes ufoN3 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.7);
            opacity: 1;
        }

        50% {
            transform: translateX(400px) rotateX(0deg) rotateZ(0deg) scale(0.7);
        }

        51% {
            transform: translateX(400px) rotateX(180deg) rotateZ(180deg) scale(0.7);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.7);
        }
    }

    .aquariumNarrowFG {
        display: none !important;
    }

    img#fN1, img#fN2, img#fN3, img#fN4, img#fN5, img#fN6, img#fN7, img#fN8, img#fN9, img#b1, img#b2 {
        width: 10% !important;
        height: 7% !important;
        height: auto !important;
    }

    @keyframes fishN1 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN2 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN3 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN4 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN5 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN6 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN7 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN8 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes fishN9 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    #aquarium {
        position: relative;
        width: 100%;
        height: 300px;
        border: 0px solid #ccc;
    }

    .aquariumBG {
        z-index: 3;
        border: 0px solid #ccc;
    }

    .aquariumFG {
        display: none !important;
    }

    img#f1, img#f2, img#f3, img#f4, img#f5, img#f6, img#f7, img#f8, img#f9, img#b1, img#b2 {
        width: 10% !important;
        height: 7% !important;
        height: auto !important;
    }
    /*    img#f1, img#f2, img#f3, img#f4, img#f5, img#f6, img#f7, img#f8, img#f9 {
        
    }*/
    img#fN3 {
        top: 8%;
    }

    @keyframes fish1 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish2 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish3 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish4 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish5 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish6 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish7 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish8 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes fish9 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.9);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.9);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.9);
        }
    }

    @keyframes ufoN1 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        50% {
            transform: translateX(var(--lengthLeft)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthLeft)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes ufoN2 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.8);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.8);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.8);
        }
    }

    @keyframes ufoB3 {
        0% {
            transform: translateX(0) rotateX(0deg) rotateZ(0deg) scale(0.5);
            opacity: 1;
        }

        50% {
            transform: translateX(var(--lengthRigh)) rotateX(0deg) rotateZ(0deg) scale(0.5);
        }

        51% {
            transform: translateX(var(--lengthRigh)) rotateX(180deg) rotateZ(180deg) scale(0.5);
        }

        100% {
            transform: translateX(0) rotateX(180deg) rotateZ(180deg) scale(0.5);
        }
    }

    @keyframes bubble1 {
        0%, 100% {
            transform: translateX(0) translateY(0) rotateZ(0deg) scale(0.5);
            opacity: 0;
        }

        10% {
            opacity: 0.8;
        }

        50% {
            transform: translateY(-100px) rotateZ(180deg) scale(0.9);
        }

        99% {
            transform: translateX(300px) translateY(100px) rotateZ(360deg) scale(0.5);
            opacity: 0;
        }
    }

    @keyframes bubble2 {
        0%, 100% {
            transform: translateX(0) translateY(0) rotateZ(0deg) scale(0.5);
            opacity: 0;
        }

        10% {
            opacity: 0.8;
        }

        50% {
            transform: translateY(100px) rotateZ(180deg) scale(0.9);
        }

        99% {
            transform: translateX(-300px) translateY(100px) rotateZ(360deg) scale(0.5);
            opacity: 0;
        }
    }

    .boubleBox {
        display: none;
    }

    

    .iceCubeLargeBox {
        margin: 20px auto;
    }

    .iceCubeLarge {
        width: 350px;
        height: 350px;
    }

        .iceCubeLarge div span {
            transform: rotateY(calc(90deg * var(--i))) translateZ(175px);
        }

    .iceCubeLargeBall img {
        max-width: 350px;
        max-height: 350px;
    }

    .iceCubeLargeTop {
        width: 350px;
        height: 350px;
        transform: rotateX(90deg) translateZ(175px);
    }

    .iceCubeLargeBottom {
        width: 350px;
        height: 350px;
    }

        .iceCubeLargeBottom::before {
            width: 350px;
            height: 350px;
            transform: translateZ(-330px);
        }

    .lightCubeMedium {
        width: 350px;
        height: 350px;
    }

    .lightCubeMediumRev {
        width: 350px;
        height: 350px;
    }

        .lightCubeMedium img, .lightCubeMediumRev img {
            max-width: 350px;
            max-height: 350px;
        }

        .lightCubeMedium div span, .lightCubeMediumRev div span {
            transform: rotateY(calc(120deg * var(--i))) translateZ(120px);
        }

    .lightCubeLarge {
        width: 350px;
        height: 350px;
        margin: 120px auto;
    }

        .lightCubeLarge img {
            max-width: 350px;
            max-height: 350px;
        }

        .lightCubeLarge div span {
            transform: rotateY(calc(90deg * var(--i))) translateZ(175px);
        }

    .lightCubeLargeTop {
        width: 350px;
        height: 350px;
        transform: rotateX(90deg) translateZ(175px);
    }

        .lightCubeLargeTop::before {
            width: 350px;
            height: 350px;
            transform: translateZ(100px);
        }

    .lightCubeLargeBottom {
        width: 350px;
        height: 350px;
        transform: rotateX(90deg) translateZ(-175px);
    }

    .lightCubeOne {
        width: 400px;
        height: 400px;
    }

        .lightCubeOne img {
            max-width: 400px;
            max-height: 400px;
        }

    .circleLargeBox {
        margin: 50px auto;
    }

    .circleLarge {
        width: 350px;
        height: 350px;
    }

    .squareLarge {
        width: 300px;
        height: 300px;
    }
}
/*@media screen and (max-width: 881px) {


}*/
@media screen and (max-width: 770px) {

    .room {
        min-width: 100%;
        min-height: 350px;
    }

        /*.room h3 {
            top: -2px;
            right: -22px;
            font-size: 1em;
        }*/

    .wallPlacer {
        top: 5%;
        left:27%;
    }

        .wallPlacer img {
            width: 50%;
            height: 50%;
        }

    ul.menuNav {
        float: none;
    }

        ul.menuNav li {
            float: none;
            text-align: center;
            margin-bottom: -15px;
        }

            ul.menuNav li:hover {
                background-color: #ccc;
            }

    ul.menu {
        margin: 0;
        padding: 0;
        margin-bottom: 50px;
    }

        ul.menu li {
            width: 100%;
            padding: 2px !Important;
            margin-bottom: 2px;
            height: auto;
            background: radial-gradient(circle, #e9e8e8 0%, #666);
        }

            ul.menu li:hover {
                background: radial-gradient(circle, #e9e8e8 30%, #666);
            }

            ul.menu li.active {
                background: radial-gradient(circle, #e9e8e8 30%, #666);
            }

            ul.menu li img.menuImage {
                float: left;
                margin: 0 !important;
                padding: 0 !important;
            }

            ul.menu li a {
                padding: 2px !Important;
                color: #000 !important;
            }
}

@media screen and (max-width: 570px) {
    .room {
        min-width: 100%;
        min-height: 260px;
    }

        /*.room h3 {
            top: 2px;
            right: -15px;
            font-size: 0.6em;
        }*/

    .wallPlacer {
        top: 5%;
        left: 15%;
    }

        .wallPlacer img {
            width: 30%;
            height: 30%;
        }
}