.loading{
    position:fixed;
    top:0px;
    left:0px;
    width:100vw;
    height:100vh;
    background-color:#bc8192;
    z-index:10001;
}
.loader {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-30px;
    margin-top:-30px;
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #89764b;
    width: 60px;
    height: 60px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.window_wall_wrapper{
    z-index: 1;
    position: relative;
    width: 100%;
    height: 100%;
}
.update_link{
    display:none;
}
.notification_bar{
    color:#89764b;
    font-size:18px;
    line-height:40px;
    text-align:center;
    background-color:#bc8192;
    position:fixed;
    top:0px;
    left:0px;
    width:100vw;
    height:40px;
    z-index:9998;
}
.has_top_notification #main_header{
    top:40px;
}

.animation_overlay{
	position:absolute;
	top:0px;
	left:0px;
	width:100vw;
	height:400vh;
    background-color:#bc8192;
    z-index: 9991;
    pointer-events:none;
}
.animation_overlay_fixed{
    position:fixed;
    top:0px;
    left:0px;
    width:100vw;
    height:100vh;
    z-index:2;
}
.animation_overlay_fixed:after {
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    box-shadow: inset 0px -8px 100px 25px rgba(0,0,0,1);
    -webkit-box-shadow: inset 0px -8px 100px 25px rgba(0,0,0,1);
    z-index:2;
}
.arrow_down{
    position: absolute;

    width: 30px;
    height: 60px;

    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);

    z-index: 9998;
    background-image: url(img/navigation_arrow_next.svg);
    background-size: contain;
    background-repeat:no-repeat;
    background-position:center;

    cursor: pointer;
    bottom: 35px;
    left: 50vw;
    margin-left:-10px;
    -webkit-animation: flickerAnimation 2s infinite;
    -moz-animation: flickerAnimation 2s infinite;
    -o-animation: flickerAnimation 2s infinite;
     animation: flickerAnimation 2s infinite;
}
@keyframes flickerAnimation {
    0%   { opacity:0.5; }
    50%  { opacity:0; }
    100% { opacity:0.5; }
  }
  @-o-keyframes flickerAnimation{
    0%   { opacity:0.5; }
    50%  { opacity:0; }
    100% { opacity:0.5; }
  }
  @-moz-keyframes flickerAnimation{
    0%   { opacity:0.5; }
    50%  { opacity:0; }
    100% { opacity:0.5; }
  }
  @-webkit-keyframes flickerAnimation{
    0%   { opacity:0.5; }
    50%  { opacity:0; }
    100% { opacity:0.5; }
  }
.square_center{
    background-color:red;
    width:100px;
    height:100px;
    position:absolute;
    top:200px;
    left:200px;
    z-index:9999;
}
.page-id-96 #page,
.page-id-59 #page{
    margin-top:350vh;
}
.wall{
    position:absolute;
    top:0px;
    left:0px;
    width:100vw;
    /* height:83.33vh; */
    height:100vh;
    background-image:url('img/wall_2x.jpg');
    background-position:center;
    background-size:322px;
    z-index:1;
    transform-origin: bottom;
    /* transform-origin: center; */
}
.floor:before {
    content: "";
    width: 100vw;
    height: 16.67vh;
    opacity: 0.40;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #000 67%, #000);
    position:absolute;
    top:-15.67vh;
    left:0px;
    z-index:1;
}
.floor_bg{
    width:100%;
    height:100%;
    background-image:url('img/SIDEWALK-wide@2x.png');
    background-repeat:no-repeat;
    background-size:cover;
    background-position:top center;
    transform-origin: top;
    z-index: 2;
    position: relative;
}
.floor{
    position:absolute;
    top:82.33vh;
    left:0px;
    width:100vw;
    height:17.67vh;
    z-index:1;
}
.lantern{
    position:absolute;
    width:17.94vw;
    left:0.19vw;
    bottom:7.81vh;
    height:91.46vh;
    background-image:url('img/lantern_2x.png');
    background-size:contain;
    background-position:bottom;
    background-repeat:no-repeat;
    z-index:3;
}
.lantern.lantern_glow_ontop{
    background-image:url('img/lantern_2x-glow-v2-tiny.png');
    -webkit-animation: lightPulseGlow 10s linear infinite;
    animation: lightPulseGlow 10s linear infinite;
    z-index:5;
}

@-webkit-keyframes lightPulseGlow {
    0% { opacity:0.4; }
    10% { opacity:0.9; }
    20% { opacity:0.4; }
    30% { opacity:1; }
    40% { opacity:0.3; }
    50% { opacity:0.9; }
    60% { opacity:0.2; }
    70% { opacity:0.8; }
    80% { opacity:0.3; }
    90% { opacity:0.9; }
    100% { opacity:0.2 }
}
@keyframes lightPulseGlow {
    0% { opacity:0.4; }
    10% { opacity:0.9; }
    20% { opacity:0.4; }
    30% { opacity:1; }
    40% { opacity:0.3; }
    50% { opacity:0.9; }
    60% { opacity:0.2; }
    70% { opacity:0.8; }
    80% { opacity:0.3; }
    90% { opacity:0.9; }
    100% { opacity:0.2 }
}

.lantern.lantern_glow_anim{
    background-image:url('img/lantern_2x_glow.png');
    -webkit-animation: lightPulse 10s linear infinite;
    animation: lightPulse 10s linear infinite;
}

@-webkit-keyframes lightPulse {
    0% { opacity:0.4; }
    10% { opacity:0.75; }
    20% { opacity:0.3; }
    30% { opacity:1; }
    40% { opacity:0.5; }
    50% { opacity:0.8; }
    60% { opacity:0.3; }
    70% { opacity:0.4; }
    80% { opacity:0.6; }
    90% { opacity:0.3; }
    100% { opacity:0.4 }
}
@keyframes lightPulse {
    0% { opacity:0.4; }
    10% { opacity:0.75; }
    20% { opacity:0.3; }
    30% { opacity:1; }
    40% { opacity:0.5; }
    50% { opacity:0.8; }
    60% { opacity:0.3; }
    70% { opacity:0.4; }
    80% { opacity:0.6; }
    90% { opacity:0.3; }
    100% { opacity:0.4 }
}



.lantern_glow_wrapper{
    position:relative;
    width:100%;
    height:100%;
}
.lantern_glow{
    position:absolute;
    width:50px;
    height:50px;
    background-color:red;
    top:5%;
    left:22%;
}
.lantern:after{
    /* content: " ";
    width:100%;
    height:100%;
    background-color:red;
    position:absolute;
    top:0px;
    left:0px; */
}
.window{
    position:absolute;
    /* top: 3.85vh; */
    bottom: 27.81vh;
    height:68.33vh;
    width:66.63vw;
    z-index:2;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    transform-origin: bottom;
    /* min-width:1066px; */
    /* min-height:656px; */
}
.inside_window{
    margin-left:5.91%;
    /* margin-top:7.93%; */
    width:88.27%;
    /* height:82.32%; */
    display: inline-block;
    z-index:1;
    background-image:url('img/van-stapele-wallpaper.jpg');
    background-size:cover;
    background-position:center;
    position:relative;
    overflow:hidden;
}
.logo_glass{
    position:absolute;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    height:31.67vh;
    top:1.15vh;
    width:11.31vw;
    background-image:url('img/logo-van-stapele.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center;
    z-index:101;
}
.glass_animations{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index: 102;
}
.glass{
    background-color:rgba(255,255,255,0.37);
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index:100;
}
.window_frame{
    width:100%;
    height:100%;
    background-image:url('img/Window-frame.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center;
    z-index:2;
    position:absolute;
    left:0;
    top:0;
    transform: translate3d(0px, 0px, 0px);
}
.oven{
    position:absolute;
    height:61.15vh;
    top:-3.02vh;
    width:18.38vw;
    top:-2.81vh;

    background-image:url('img/OVEN_symetry_closed.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: bottom;
    z-index:5;

    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}
.oven_open{
    position:absolute;
    height:61.15vh;
    width:18.38vw;
    top:0vh;
    opacity:0;

    background-image:url('img/OVEN_symetry_open.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: bottom;
    z-index:2;
}
.girl_left_art{
    width:100%;
    height:100%;
    float:left;
    display:inline;

    background-image:url('img/Girl-L+shadow@2x.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center;
    z-index: 4;

    transform: translateZ(0);
    will-change: transform;
    transform-origin: bottom;

    -webkit-animation: girL_l_move 2s linear infinite;
    animation: girL_l_move 2s linear infinite;
    animation-direction: alternate;
}
.girl_left{
    position:absolute;
    width:16.19vw;
    height:58.96vh;

    top:34.25vh;

    z-index:3;
    transform-origin:right;

    width:20.88vw;
    height:59.38vh;
    top:34.26vh;

    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}
.boy_art{
    width:100%;
    height:100%;
    float:left;
    display:inline;

    background-image:url('img/Boy+shadow@2x.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center;

    transform: translateZ(0);
    will-change: transform;
    transform-origin: bottom;

    -webkit-animation: boySkew 2s linear infinite;
    animation: boySkew 2s linear infinite;
    animation-direction: alternate;
}
.boy{
    position:absolute;
    /* top:40.54vh; */
    top: 36.54vh;
    z-index:3;

    width:23.06vw;
    height:55.52vh;

    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

@-webkit-keyframes girL_l_move {
    0% { transform: skew(0deg, 0deg); }
    33% {  transform: skew(0deg, 0deg); }
    66% {  transform: skew(0deg, 0deg); }
    100% {  transform: skew(-0.5deg, -0.5deg); }
}
@keyframes girL_l_move {
    0% { transform: skew(0deg, 0deg); }
    33% {  transform: skew(0deg, 0deg); }
    66% {  transform: skew(0deg, 0deg); }
    100% {  transform: skew(-0.5deg, -0.5deg); }
}

@-webkit-keyframes boySkew {
    0% { transform: scale(1,1); }
    33% {  transform: scale(1.01,0.99); }
    66% {  transform: scale(1.01,0.99); }
    100% {  transform: scale(1.01,0.99); }
}
@keyframes boySkew {
    0% { transform: scale(1,1); }
    33% {  transform: scale(1.01,0.99); }
    66% {  transform: scale(1.01,0.99); }
    100% {  transform: scale(1.01,0.99); }
}

@-webkit-keyframes girL_r_move {
    0% { transform: skew(0deg, 0deg); }
    33% {  transform: skew(0deg, 0deg); }
    66% {  transform: skew(0.5deg, 0.5deg); }
    100% {  transform: skew(0.5deg, 0.5deg); }
}
@keyframes girL_r_move {
    0% { transform: skew(0deg, 0deg); }
    33% {  transform: skew(0deg, 0deg); }
    66% {  transform: skew(0.5deg, 0.5deg); }
    100% {  transform: skew(0.5deg, 0.5deg); }
}


.girl_right_art{
    width:100%;
    height:100%;
    float:left;
    display:inline;

    background-image:url('img/Gril-R+shadow@2x.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center;

    transform: translateZ(0);
    will-change: transform;
    transform-origin: bottom;

    -webkit-animation: girL_r_move 2s linear infinite;
    animation: girL_r_move 2s linear infinite;
    animation-direction: alternate;
}


.girl_right{
    position:absolute;

    top:30.81vh;
    width:34.75vw;
    height:62.69vh;
    z-index:3;
    transform-origin:left;

    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}
.glass_shadow{
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
    height:10vh;
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0), #000000 100%, #000000);
    z-index:4;
    opacity: 0.37;
}
.chandelier_l.chandelier_l_glow_glitter{
    background-image:url('img/CHANDELIER_L@2x-glitter.png');
    z-index:3;
    -webkit-animation: glitterFade 2s linear infinite;
    animation: glitterFade 2s linear infinite;
    animation-direction: reverse;
    opacity:1;
}
.chandelier_l.chandelier_l_glow_glitter_2{
    background-image:url('img/CHANDELIER_L@2x-IInd.png');
    z-index:3;
    -webkit-animation: glitterFade2 2s linear infinite;
    animation: glitterFade2 2s linear infinite;
    animation-direction: reverse;
    opacity:1;
}


@-webkit-keyframes glitterFade {
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@keyframes glitterFade {
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}

@-webkit-keyframes glitterFade2 {
    0% { opacity:0; }
    50% { opacity:1; }
    100% { opacity:0; }
}
@keyframes glitterFade2 {
    0% { opacity:0; }
    50% { opacity:1; }
    100% { opacity:0; }
}

.chandelier_r_flip.chandelier_r_glow_glitter{
    background-image:url('img/CHANDELIER_L@2x-glitter.png');

    -webkit-animation: glitterFade 2s linear infinite;
    animation: glitterFade 2s linear infinite;
    animation-direction: reverse;

    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    position:absolute;
    top:0px;
    left:0px;
    z-index:3;
}

.chandelier_r_flip.chandelier_r_glow_glitter_2{
    background-image:url('img/CHANDELIER_L@2x-IInd.png');

    -webkit-animation: glitterFade2 2s linear infinite;
    animation: glitterFade2 2s linear infinite;
    animation-direction: reverse;

    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    position:absolute;
    top:0px;
    left:0px;
    z-index:3;
}

.chandelier_l.chandelier_l_glow{
    background-image:url('img/CHANDELIER_L@2x_glow.png');
    -webkit-animation: lightPulse 10s linear infinite;
    animation: lightPulse 10s linear infinite;
    animation-direction: reverse;
    opacity:1;
    z-index:3;
}

.chandelier_l{
    position:absolute;
    width:13.25vw;
    left:7.81vw;
    height:27.19vh;
    top:-1.56vh;
    z-index:3;
    transform-origin:left;

    background-image:url('img/CHANDELIER_L@2x.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: top;
    z-index:2;
    opacity:0.75;
}
.chandelier_r{
    position:absolute;
    width:13.25vw;
    right:6vw;
    height:27.19vh;
    top:-1.56vh;
    z-index:3;
    transform-origin:left;


    /* right:-6vw; */
    right:6vw;
}
.chandelier_r_flip.chandelier_r_flip_glow{
    background-image:url('img/CHANDELIER_L@2x_glow.png');
    -webkit-animation: lightPulse 10s linear infinite;
    animation: lightPulse 10s linear infinite;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    position:absolute;
    top:0px;
    left:0px;
    opacity:1;
    z-index:1;

}
.chandelier_r_flip{
    width:100%;
    height:100%;
    background-image:url('img/CHANDELIER_L@2x.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: top;

    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    opacity:0.75;
    z-index:2;
    position:relative;

}
.table_l{
    position:absolute;
    width:15.81vw;
    left:-2.06vw;
    left:-5.06vw;
    height:21.67vh;
    bottom:-3.44vh;
    z-index:3;
    transform-origin:left;

    /* background-image:url('img/Table_L@2x.png'); */
    background-image:url('img/Counter-flip.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: left;

    width: 20.31vw;
    height: 21.67vh;

}
.table_r_flip{
    background-image:url('img/Counter-flip.png');
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    background-size:contain;
    background-repeat:no-repeat;
    background-position: right;
    width:100%;
    height:100%;
}
.table_r{
    position:absolute;
    width:15.94vw;

    right: -8vw;
    right:-5vw;
    height:21.67vh;
    bottom:-3.44vh;
    z-index:5;
    transform-origin:left;

    width: 20.31vw;
    height: 21.67vh;
}
.table_l_top{
    position:absolute;
    width:7.63vw;
    /* left:3.75vw; */
    right: 4.4vw;
    height:10.1vh;
    /* top:30.31vh; */
    top:28.9vh;
    z-index:3;
    transform-origin:center;

    background-image:url('img/table_l_top@2x.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: left;

    top:-9.7vh;
}
.table_r_top{
    position:absolute;
    width:7.19vw;
    /* right:7.19vw; */
    left:4.19vw;
    height:12.6vh;
    top:26.5vh;
    z-index:3;
    transform-origin:center;

    background-image:url('img/table_r_top@2x.png');
    background-size:contain;
    background-repeat:no-repeat;
    background-position: left;

    top:-12.3vh;
}
.girl_left img,
.boy img,
.girl_right img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
}
.show_mobile{
    display:none;
}
.show_desktop{
    display:inline;
}
.update_link{
    position:absolute;
    top:32px; /* 21 */
    left:20px;
    color:#f6ede4;
    border:2px solid #f6ede4;
    padding:5px 10px;
    z-index: 10000;
}
.bottom_left_text{
    position:fixed;
    bottom:23px;
    left:50px;
    z-index:9992;
}
.opening_icon{
    float:left;
    display:inline;
    margin-top: 3px;
}
.opening_text a{
    color:#f6ede4;
    text-decoration:underline;
}
.opening_text a:hover{
    text-decoration:underline;
}
.opening_text{
    float:left;
    display:inline;
    margin-left:18px;
    font-size:16px;
    color:#f6ede4;
    font-family: 'EB Garamond', serif;
    text-align:left;
    line-height:1.4;
    font-weight:bold;
    /* letter-spacing: 1px; */
}
.select2-container{
    max-width:100%;
}
@media screen and (max-height: 700px){
    .main_screen_logo{
        text-align:center;
    }
    body .main_screen_logo img{
        width:200px;
        margin-top: -15px;
    }
}
@media screen and (max-width:1356px){
    .lantern{
        width:20.94vw;
        left: -4vw;
    }
    body .nextArrowImg,
    body .prevArrowImg{
        width: 20px;
        height: 30px;
        background-size: contain;
        background-repeat: no-repeat;
        margin-top:15px;
        top:100%;
    }
    body .nextArrowImg{
        right:0px;
    }
    body .prevArrowImg{
        left:0px;
    }
}
@media screen and (max-width: 750px){
    body .glass_animation_1:before{
        background: rgba(246, 237, 228, 0.5);
    }
    body .glass_animation_2:before{
        background: rgba(246, 237, 228, 0.4);
    }
    body .glass_animation_3:before{
        background: rgba(246, 237, 228, 0.5);
    }
    .glass_animation.glass_hover:before {
        opacity: 0.6;
    }
    .glass_animation.glass_hover:after {
        opacity: 0.4;
      }
}
@media screen and (max-width:1200px) and (min-height:1100px){
    .lantern{
        display:none;
    }
}
@media screen and (max-width:1000px){
    .lantern{
        display:none;
    }
}
@media (orientation: portrait) and (max-height:895px){
    .main_screen_logo img {
        margin-top: -20px;
        width:230px;
    }
}
@media (orientation: portrait) and (max-height:820px){
    .main_screen_logo img {
        margin-top: -20px;
        width:181px;
    }
}
@media (orientation: portrait) and (max-width:660px){
    .bottom_left_text{
        bottom: 55px;
        width: calc(100% - 10vw);
        max-width: 350px;
        left: 0;
        right: 0;
        margin: 0px auto;
    }
    .opening_text{
        max-width: calc(100% - 50px);
        margin-left:0px;
        font-size:14px;
    }
    body .order_online{
        right:auto;
        width: 90vw;
        left: 5vw;
        text-align: center;
        bottom:26px;
    }
    body .order_online a{
        display: inline-block;
        max-width: 350px;
        padding: 3px 38px 4px 38px;
        width:100%;
    }
    .opening_icon{
        float:right;
    }
    .opening_icon img{
        width:33px!important;
    }
}
@media (orientation: portrait) {
    body .glass_animation_1:before{
        left: 25%;
        transform: translateX(0px) skewX(-15deg);
    }
    body .glass_animation_2:before{
        left: 39%;
        transform: translateX(0px) skewX(-15deg);
    }
    body .glass_animation_3:before{
        left: 63%;
        transform: translateX(0px) skewX(-15deg);
    }
    .chandelier_l,
    .chandelier_r{
        top: -10.56vh;
    }
    .animation_overlay_fixed:after{
        box-shadow: inset 0px -30px 100px 25px rgba(0,0,0,1);
        -webkit-box-shadow: inset 0px -30px 100px 25px rgba(0,0,0,1);
    }
    .animation_overlay_fixed:after{
        width: 110%;
        left: -5%;
    }
    .show_desktop{
        display:none;
    }
    .show_mobile{
        display:inline;
    }
    .main_screen_logo{
        text-align:center;
    }
    .window_wrapper{
        position:absolute;
        width: 100vw;
        height: 100vh;
    }
    .update_link{
        display:inline-block;
    }
    .notification_bar{
        display:none;
    }
    body .show_gallery{
        width:100%;
        margin-top:60px;
    }
    body .nextArrowImg,
    body .prevArrowImg{
        width: 20px;
        height: 30px;
        background-size: contain;
        background-repeat: no-repeat;
        margin-top:15px;
        top:100%;
    }
    body .nextArrowImg{
        right:0px;
    }
    body .prevArrowImg{
        left:0px;
    }
    body .arrow_down{
        bottom: 142px;
        width: 30px;
        height: 50px;
    }
    .window{
        height:53.68vh;
        bottom: 36vh;
    }
    .oven{
        top:auto;
        bottom:-1vh;
    }
    .table_l{
        left:-13.06vw;
    }
    .table_r{
        right:-13vw;
    }
    .girl_left{
        height:45.9vh;
        top:33.77vh;
        width:32.23vw;
        left:auto;
    }
    .boy{
        height:46.27vh;
        top:35.7vh;
        width:64.56vw;
    }
    .girl_right{
        top:30.76vh;
        width:91.75vw;
        height:48.92vh;
    }
    .floor{
        top: 71.33vh;
        height:29vh;
    }
}


.glass_animation_1{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%);
}
.glass_animation_1:before{
    content: '';
    display: block;
    position: absolute;
    /* background: rgba(255, 255, 255, 0.3); */
    background: rgba(246, 237, 228, 0.3);
    width: 60px;
    height: 100%;
    /* left: 30px; */
    left: -2%;
    top: 0;
    opacity: 0.8; /* updated */
    -webkit-filter: blur(10px);
            filter: blur(10px);
    -webkit-transform: translateX(300px) skewX(-15deg);
            transform: translateX(300px) skewX(-15deg);
}
.glass_animation_2{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%);
}
.glass_animation_2:before{
    content: '';
    display: block;
    position: absolute;
    /* background: rgba(255, 255, 255, 0.3); */
    background: rgba(246, 237, 228, 0.3);
    width: 25px;
    height: 100%;
    left: 60px;
    top: 0;
    opacity: 0.8; /* updated */
    -webkit-filter: blur(6px);
            filter: blur(6px);
    -webkit-transform: translateX(300px) skewX(-15deg);
            transform: translateX(400px) skewX(-15deg);
}


.glass_animation_3{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%);
}
.glass_animation_3:before{
    content: '';
    display: block;
    position: absolute;
    /* background: rgba(255, 255, 255, 0.3); */
    background: rgba(246, 237, 228, 0.3);
    width: 30px;
    height: 100%;
    left: 33%;
    top: 0;
    opacity: 0.8; /* updated */
    -webkit-filter: blur(7px);
            filter: blur(7px);
    -webkit-transform: translateX(300px) skewX(-15deg);
            transform: translateX(400px) skewX(-15deg);
}

.glass_animation {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
}
.glass_animation {
  width: 100%;
  height: 100%;
  border: 0;
  font-size: 18px;
  border-radius: 4px;
  -webkit-transition: .6s;
  transition: .6s;
  overflow: hidden;
}
.glass_animation:focus {
  outline: 0;
}
.glass_animation:before {
  content: '';
  display: block;
  position: absolute;
  /* background: rgba(255, 255, 255, 0.5); */
  background: rgba(246, 237, 228, 0.5);

  width: 130px;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0.2; /* updated */
  -webkit-filter: blur(45px);
          filter: blur(45px);
  -webkit-transform: translateX(-100px) skewX(-15deg);
          transform: translateX(-100px) skewX(-15deg);
}
.glass_animation:after {
  content: '';
  display: block;
  position: absolute;
  /* background: rgba(255, 255, 255, 0.2); */
  background: rgba(246, 237, 228, 0.2);

  width: 30px;
  height: 100%;
  left: 30px;
  top: 0;
  opacity: 0;
  -webkit-filter: blur(5px);
          filter: blur(5px);
  -webkit-transform: translateX(100vw) skewX(-15deg);
          transform: translateX(100vw) skewX(-15deg);
}
.glass_animation.glass_hover:before {
  -webkit-transform: translateX(100vw) skewX(-15deg);
          transform: translateX(100vw) skewX(-15deg);
  opacity: 0.2; /* updated */
  -webkit-transition: 4.0s;
  transition: 4.0s;
}
.glass_animation.glass_hover:after {
  -webkit-transform: translateX(-200px) skewX(-15deg);
          transform: translateX(-200px) skewX(-15deg);
  opacity: 0.2; /* updated */
  -webkit-transition: 1.8s;
  transition: 1.8s;
}



.smokes {
    position: absolute;
    right: -1.25rem;
    -webkit-transform: rotate(25deg) scale(2.5, 1);
            transform: rotate(25deg) scale(2.5, 1);
    z-index: 0;

    width: 20px;
    height: 50px;
    bottom: 30.88%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

.smoke {
    display: block;
    position: absolute;
    background-color: rgba(255, 255, 255, 0.15);
    height: 2px;
    width: 2px;
    border: 0px solid rgba(255, 255, 255, 0.15);
    border-radius: 50%;
    opacity: 0;
    -webkit-transform: scale(0.2);
            transform: scale(0.2);
    border:1px solid rgba(255,255,255,1);
}
.showSmoke .smoke:nth-child(0) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-left 10s 0s infinite;
            animation: smoke-left 10s 0s infinite;
}
.showSmoke .smoke:nth-child(1) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-right 10s 1s infinite;
            animation: smoke-right 10s 1s infinite;
}
.showSmoke .smoke:nth-child(2) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-left 10s 2s infinite;
            animation: smoke-left 10s 2s infinite;
}
.showSmoke .smoke:nth-child(3) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-right 10s 3s infinite;
            animation: smoke-right 10s 3s infinite;
}
.showSmoke .smoke:nth-child(4) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-left 10s 4s infinite;
            animation: smoke-left 10s 4s infinite;
}
.showSmoke .smoke:nth-child(5) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-right 10s 5s infinite;
            animation: smoke-right 10s 5s infinite;
}
.showSmoke .smoke:nth-child(6) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-left 10s 6s infinite;
            animation: smoke-left 10s 6s infinite;
}
.showSmoke .smoke:nth-child(7) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-right 10s 7s infinite;
            animation: smoke-right 10s 7s infinite;
}
.showSmoke .smoke:nth-child(8) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #fff;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-left 10s 8s infinite;
            animation: smoke-left 10s 8s infinite;
}
.showSmoke .smoke:nth-child(9) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #999999;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-right 10s 9s infinite;
            animation: smoke-right 10s 9s infinite;
}
.showSmoke .smoke:nth-child(10) {
    height: 0px;
    width: 0px;
    box-shadow: 0 0 84px 80px #999999;
    -moz-box-shadow: 0 0 84px 80px #fff;
    -webkit-box-shadow: 0 0 84px 80px #fff;
    -webkit-animation: smoke-left 10s 10s infinite;
            animation: smoke-left 10s 10s infinite;
}

@-webkit-keyframes smoke-left {
    0% {
        -webkit-transform: scale(0.2, 0.35) translate(0, 0);
        transform: scale(0.2, 0.35) translate(0, 0);
    }
    10% {
        opacity: 0.4;
        -webkit-transform: scale(0.2, 0.4) translate(0, -5px);
        transform: scale(0.2, 0.4) translate(0, -5px);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1, 1.25) translate(-50px, -400px);
        transform: scale(1, 1.25) translate(-50px, -400px);
    }
}

@keyframes smoke-left {
    0% {
        -webkit-transform: scale(0.2, 0.35) translate(0, 0);
        transform: scale(0.2, 0.35) translate(0, 0);
    }
    10% {
        opacity: 0.4;
        -webkit-transform: scale(0.2, 0.4) translate(0, -5px);
        transform: scale(0.2, 0.4) translate(0, -5px);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1, 1.25) translate(-50px, -400px);
        transform: scale(1, 1.25) translate(-50px, -400px);
    }
}
@-webkit-keyframes smoke-right {
    0% {
        -webkit-transform: scale(0.2, 0.35) translate(0, 0);
        transform: scale(0.2, 0.35) translate(0, 0);
    }
    10% {
        opacity: 0.4;
        -webkit-transform: scale(0.2, 0.5) translate(0, -5px);
        transform: scale(0.2, 0.5) translate(0, -5px);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(0.75, 1.25) translate(33px, -400px);
        transform: scale(0.75, 1.25) translate(33px, -400px);
    }
}
@keyframes smoke-right {
    0% {
        -webkit-transform: scale(0.2, 0.35) translate(0, 0);
        transform: scale(0.2, 0.35) translate(0, 0);
    }
    10% {
        opacity: 0.4;
        -webkit-transform: scale(0.2, 0.5) translate(0, -5px);
        transform: scale(0.2, 0.5) translate(0, -5px);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(0.75, 1.25) translate(33px, -400px);
        transform: scale(0.75, 1.25) translate(33px, -400px);
    }
}