﻿.w_826 {
    max-width: 828px;
}

.big_linear_line {
    top: 154px;
}

.detail_height {
    min-height: 700px;
    height: 100vh;
}

.z_10 {
    z-index: 10;
    position: relative;
}

.bg_blue_purple {
    background: -o-linear-gradient(1.7deg, #6432d0 25.62%, #784dd5 42.44%, #04C8C8 70.5%, #04BFBF 90.41%);
    background: linear-gradient(88.3deg, #6432d0 25.62%, #784dd5 42.44%, #04C8C8 70.5%, #04BFBF 90.41%);
}

.explore_hov,
.svg_hover svg path {
    -webkit-transition: all 0.3s linear !important;
    -o-transition: all 0.3s linear !important;
    transition: all 0.3s linear !important;
}

.svg_hover:hover svg path {
    fill: #04C8C8 !important;

}

.svg_hover a:hover {
    color: #04C8C8 !important;

}

.w_746px {
    max-width: 746px;
}

.details_hero_img_w {
    width: 100%;
}

.footer_detail_bg {
    background-image: url("/assets/img/detail_footer_bg.png");
    border-radius: 20px;
    background-size: cover;
    background-repeat: no-repeat;
}

.view_btn_purple {
    background: #7239EA;
    border-radius: 15px;
    padding: 11px 11px 11px 24px;
}

/* ===============DEFINE WOBBLE IMAGES=============== */
.details_common_wobble {
    position: relative;
}

.details_common_wobble {
    position: absolute;
    background: #Cfffff;
    width: 15.2px;
    height: 15.2px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 0;
}


.details_wobble_effect1 {
    top: 8%;
    right: 40%;
    -webkit-animation: wobbleAnimate1 12s linear infinite;
    animation: wobbleAnimate1 12s linear infinite;
}

.details_wobble_effect2 {
    top: 10%;
    right: 25%;
    -webkit-animation: wobbleAnimate2 18s linear infinite;
    animation: wobbleAnimate2 18s linear infinite;
}

.details_wobble_effect3 {
    bottom: 18%;
    left: 4%;
    -webkit-animation: wobbleAnimate3 20s linear infinite;
    animation: wobbleAnimate3 20s linear infinite;
}

.details_wobble_effect4 {
    bottom: 20%;
    left: 30%;
    -webkit-animation: wobbleAnimate2 10s linear infinite;
    animation: wobbleAnimate2 10s linear infinite;
}

.details_wobble_effect5 {
    top: 60%;
    left: 55%;
    -webkit-animation: wobbleAnimate1 12s linear infinite;
    animation: wobbleAnimate1 12s linear infinite;
}

.details_wobble_effect6 {
    bottom: 8%;
    right: 30%;
    -webkit-animation: wobbleAnimate3 15s linear infinite;
    animation: wobbleAnimate3 15s linear infinite;
}

.details_wobble_effect7 {
    top: 5%;
    right: 25%;
    -webkit-animation: wobbleAnimate1 18s linear infinite;
    animation: wobbleAnimate1 18s linear infinite;
}

.details_wobble_effect8 {
    top: 30%;
    left: -10%;
    -webkit-animation: wobbleAnimate3 12s linear infinite;
    animation: wobbleAnimate3 12s linear infinite;
}

.details_wobble_effect9 {
    top: 18%;
    right: 14%;
    -webkit-animation: wobbleAnimate2 12s linear infinite;
    animation: wobbleAnimate2 12s linear infinite;
}

.details_wobble_effect10 {
    top: -12%;
    right: 15%;
    -webkit-animation: wobbleAnimate2 20s linear infinite;
    animation: wobbleAnimate2 20s linear infinite;
}

.details_wobble_effect11 {
    top: -25%;
    right: 3%;
    -webkit-animation: wobbleAnimate3 15s linear infinite;
    animation: wobbleAnimate3 15s linear infinite;
}

.details_wobble_effect12 {
    top: 18%;
    right: 4%;
    -webkit-animation: wobbleAnimate3 8s linear infinite;
    animation: wobbleAnimate3 8s linear infinite;
}

.details_wobble_effect13 {
    top: 60%;
    right: 3%;
    -webkit-animation: wobbleAnimate3 15s linear infinite;
    animation: wobbleAnimate3 15s linear infinite;
}

.details_wobble_effect14 {
    bottom: 15%;
    left: 5%;
    -webkit-animation: wobbleAnimate1 8s linear infinite;
    animation: wobbleAnimate1 8s linear infinite;
}

.details_wobble_effect15 {
    bottom: 10%;
    left: 20%;
    -webkit-animation: wobbleAnimate2 15s linear infinite;
    animation: wobbleAnimate2 15s linear infinite;
}

.details_wobble_effect16 {
    top: 114%;
    left: 8%;
    -webkit-animation: wobbleAnimate3 22s linear infinite;
    animation: wobbleAnimate3 22s linear infinite;
}

@media (min-width:1441px) and (max-width:1850px) {
    .big_linear_line {
        top: 154px;
        width: 26%;
    }
}

@media (min-width:1200px) {
    .detail_hero_img {
        position: absolute;
        top: 20%;
        right: -13%;
    }


}

@media (min-width:1440px) {
    .max_w_421 {
        max-width: 421px;
    }
}

@media (min-width:1441px) {
    .detail_hero_img {
        right: -10%;
    }

    .details_hero_img_w {
        width: 75%;
    }
}

@media (min-width:1500px) {
    .detail_hero_img {
        right: -9%;
    }

    .details_hero_img_w {
        width: 75%;
    }
}

@media (min-width:1750px) {
    .detail_hero_img {
        right: 2%;
        top: 15%;
    }

    .details_hero_img_w {
        width: 96%;
    }

    .w_100 {
        width: 78%;
    }
}

@media (max-width:1440px) {
    .details_hero_img_w {
        width: 72%;
    }

    .big_linear_line {
        top: 159px;
        width: 25%;
    }

    .max_w_421 {
        width: 100%;
    }
}

@media (max-width:1200px) {
    .big_linear_line {
        top: 159px;
        width: 18%;
    }

    .details_wobble_effect1 {
        top: 8%;
        left: 10%;

    }

    .details_wobble_effect2 {
        top: 10%;
        right: 25%;
    }

    .details_wobble_effect3 {
        bottom: 60%;
        left: 50%;
    }
}

@media (max-width:991.98px) {
    .details_hero_img_w {
        width: 95%;
    }

}

@media (max-width:768px) {
    .details_hero_img_w {
        width: 100%;
    }

    .details_wobble_effect15 {
        bottom: 0%;
        left: 60%;
    }

    .turn_information {
        max-width: 60px;
    }

    .details_wobble_effect10 {
        top: 10%;
        right: 15%;
    }

}