@import url(../fonts/stylesheet.css);


* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#section-about::before {
    background: #31384A;
    position: absolute;
    height: 100%;
    width: 100%;
    content: '';
    opacity: 50%;
}

#section-about {
    position: relative;
}

body {
    line-height: 1.7em;
    color: #7f8c8d;
    background-color: #333;
    font-size: 13px;
    font-family: 'Avenir', 'Helvetica Neue', 'Gotham', sans-serif;
    overscroll-behavior-y: none;
    overscroll-behavior-x: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
label {
    color: #34495e;
    font-family: AryaW00-Double, sans-serif;
    font-weight: normal;
}

.right-arrow img:first-child {
    max-height: 100%
}

.right-arrow img:last-child {
    max-height: 50%;
    position: absolute;
    transform: rotate(180deg);
    transition: all ease 0.3s;
}

.is-end .right-arrow img:last-child {
    transform: rotate(0deg);
}

.right-arrow {
    display: flex;
    position: fixed;
    z-index: 9999;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 100px;
    overflow: hidden;
    align-items: center;
    justify-content: center
}

.pure-img-responsive {
    max-width: 100%;
    height: auto;
}

/*
* -- LAYOUT STYLES --
* These are some useful classes which I will need
*/

.l-box {
    padding: 1em;
}

.l-box-lrg {
    padding: 2em;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.is-center {
    text-align: center;
}

/*
* -- PURE FORM STYLES --
* Style the form inputs and labels
*/

.pure-form label {
    margin: 1em 0 0;
    font-weight: bold;
    font-size: 100%;
}

.pure-form input[type] {
    border: 2px solid #ddd;
    box-shadow: none;
    font-size: 100%;
    width: 100%;
    margin-bottom: 1em;
}

/*
* -- PURE BUTTON STYLES --
* I want my pure-button elements to look a little different
*/

.pure-button {
    background-color: #1f8dd6;
    color: white;
    padding: 0.3em 1.5em;
    border-radius: 5px;
}

a.pure-button-primary {
    background: white;
    color: #1f8dd6;
    border-radius: 5px;
    font-size: 120%;
}

a.pure-button-pink {
    background-color: #fc00ac;
}

/*
* -- MENU STYLES --
* I want to customize how my .pure-menu looks at the top of the page
*/

.logo_site {
    height: 80px;
}

.home-menu {
    padding: 0.5em;
    text-align: center;
    /*    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.10);*/
}

.home-menu {
    background: transparent;
}

.pure-menu.pure-menu-fixed {
    /* Fixed menus normally have a border at the bottom. */
    border-bottom: none;
    /* I need a higher z-index here because of the scroll-over effect. */
    z-index: 4;
}

.home-menu ul {
    position: relative;
    top: 30px;
}

.home-menu .pure-menu-heading {
    color: white;
    font-weight: 400;
    font-size: 120%;
}

.home-menu .pure-menu-selected a {
    color: white;
}

.scroll_btn {
    position: absolute;
    z-index: 9;
    bottom: 25px;
    font-size: 12px;
    right: 40px;
    font-family: Montserrat, sans-serif;
    display: flex;
    align-items: center;
}


.box_ex.box_1.open {
    background-image: url(/assets/imgs/services/service_5-bg.jpg) !important;
    background-size: cover;
    background-position: top;
}

.box_ex.box_2.open {
    background-image: url(/assets/imgs/services/curated-bg.jpg) !important;
    background-size: cover;
    background-position: unset;
}

.box_ex.box_3.open {
    background-image: url(/assets/imgs/services/service_3-bg.jpg) !important;
    background-size: cover;
    background-position: unset;
}

.box_ex.box_4.open {
    background-image: url(/assets/imgs/services/talent-bg.jpg) !important;
    background-size: cover;
    background-position: center;
}

.box_ex.box_5.open {
    background-image: url(/assets/imgs/services/edutainment-bg.jpg) !important;
    background-size: cover;
    background-position: unset;
}

.scroll_btn {
    position: absolute;
    bottom: 25px;
    right: 40px;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
}

.scroll_btn span img {
    margin-left: 0;
    height: 100%;
    width: 16px;
}

.is-end .navigate-right {
    opacity: 0.1;
}

.is-start .navigate-left {
    opacity: 0.1;
}


.scroll_btn span img:last-child {
    position: relative;
    transform: translate(4px, 0px);
    transform-origin: center;
    animation: move2 3s ease-in-out infinite;
}

.scroll_btn span img:first-child {
    position: relative;
    transform: translate(-4px, 0px);
    transform-origin: center;
    animation: move 3s ease-in-out infinite;
}

@keyframes move {

    0%,
    100% {
        transform: translate(-4px, 0px);
    }

    50% {
        transform: translate(0px, 0px);
    }
}

@keyframes move2 {

    0%,
    100% {
        transform: translate(4px, 0px);
    }

    50% {
        transform: translate(0px, 0px);
    }
}

.scroll_btn span {
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 15px;
}

.scroll_btn img {
    display: inline-block;
    width: 50px;
    margin-left: 15px;
}

.home-menu a {
    color: #FFFFFF;
    transition: all .5s ease;
    font-weight: 400;
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 1px;
    font-family: Montserrat;
    position: relative;
}

.home-menu a:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-image: url(../imgs/menu_hover.png);
    background-size: contain;
    width: 0px;
    height: 0px;
    z-index: -1;
    transition: all .5s ease;
}

#ava-form-1 {}

#ava-form-1 iframe {
    height: auto !important;
    outline: 0px;
    border: 0px;
    min-height: 400px;
    position: relative;
    top: 0px;
}

.home-menu li:hover a:before {
    width: 80px;
    height: 80px;
}

.home-menu li a.open:before {
    width: 80px;
    height: 80px;
}

.home-menu a.about_us_link:before {
    background-image: url(../imgs/btn/1.svg);
    background-repeat: no-repeat;
    background-position: top right;
    background-size: 40% auto;
}

/* .home-menu li a.about_us_link.open,
.home-menu li:hover a.about_us_link {
    color: #c02281;
} */

.home-menu li a.about_us_link.open:before,
.home-menu li:hover a.about_us_link:before {
    width: 140px;
    height: 95px;
}

#section-about {}

#whatsapp {
    background: #8DAAC3;
    border-radius: 50%;
    bottom: 4pt;
    box-shadow: rgb(0 0 0 / 15%) 0px 3px 12px;
    display: inline;
    height: 38pt;
    padding: 0px;
    position: fixed;
    left: 4pt;
    top: auto;
    width: 38pt;
    z-index: 2147483646;
    font-size: 45px;
    text-align: center;
    padding: 12px;
}

#whatsapp:hover svg {
    transform: scale(1.2);
}

#whatsapp svg {
    max-width: 100%;
    max-height: 100%;
    float: left;
    transition: all ease 0.3s;
    width: 27px;
    height: 27px;
}

a#instaapp {
    background: #8DAAC3;
    border-radius: 50%;
    bottom: 55pt;
    box-shadow: rgb(0 0 0 / 15%) 0px 3px 12px;
    display: inline;
    height: 35pt;
    padding: 0px;
    position: fixed;
    left: 4pt;
    top: auto;
    width: 35pt;
    z-index: 2147483646;
    font-size: 32px;
    text-align: center;
    padding: 11px;
    color: #c02280;
}

.socialx {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px;
    padding: 0px;
}

.socialx>a {
    font-size: 1.5rem;
    color: #ffffff;
    padding: 0.5rem;
}

.home-menu a.services_link:before {
    background-image: url(../imgs/btn/5.svg);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 70% auto;
}

.home-menu li a.services_link.open,
.home-menu li:hover a.about_us_link {
    /*    color: #c02281;*/
}

.home-menu li a.services_link.open:before,
.home-menu li:hover a.services_link:before {
    width: 140px;
    height: 65px;
}

.home-menu a.circle_link:before {
    background-image: url(../imgs/btn/3.svg);
    background-position: center;
    background-repeat: no-repeat;
}

.home-menu a.bars_link:before {
    background-image: url(../imgs/btn/6.svg);
    background-position: center;
    background-repeat: no-repeat;
    width: 120px !important;
}

.home-menu li a.circle_link.open,
.home-menu li:hover a.about_us_link {
    /*    color: #c02281;*/
}

.home-menu li a.circle_link.open:before,
.home-menu li:hover a.circle_link:before {
    width: 140px;
    height: 123px;
}

.home-menu a.contact_link:before {
    background-image: url(../imgs/btn/4.svg);
    background-repeat: no-repeat;
    background-position: center top;
}

.home-menu li a.contact_link.open:before,
.home-menu li:hover a.contact_link:before {
    width: 200px;
    height: 75px;
    margin-top: 10px;
}

.home-menu a.home_link:before {
    background-image: url(../imgs/btn/Home.svg);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 40% auto;
}

.home-menu li a.home_link.open,
.home-menu li:hover a.home_link {
    /*    color: #c02281;*/
}

.home-menu li a.home_link.open:before,
.home-menu li:hover a.home_link:before {
    width: 185px;
    height: 75px;
}

.pure-menu-item {
    margin: 0px 30px;
}

.play-button {
    display: none;
}

.pure-menu-selected>.pure-menu-link,
.pure-menu-selected>.pure-menu-link:visited {
    color: #fff;
}

.home-menu li a:hover,
.home-menu li a:focus {
    background: none;
    border: none;
    color: #FFFFFF;
}

.section-first {
    position: relative;
}

/*
* -- SPLASH STYLES --
* This is the blue top section that appears on the page.
*/

.splash-container {
    background: #1f8dd6;
    z-index: 1;
    overflow: hidden;
    /* The following styles are required for the "scroll-over" effect */
    width: 100%;
    height: 88%;
    top: 0;
    left: 0;
    position: fixed !important;
}

.splash {
    /* absolute center .splash within .splash-container */
    width: 80%;
    height: 50%;
    margin: auto;
    position: absolute;
    top: 100px;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
    text-transform: uppercase;
}

/* This is the main heading that appears on the blue section */

.splash-head {
    font-size: 20px;
    font-weight: bold;
    color: white;
    border: 3px solid white;
    padding: 1em 1.6em;
    font-weight: 100;
    border-radius: 5px;
    line-height: 1em;
}

.service_link {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    /*    background-color: #fff;*/
    z-index: -1;
}

/* This is the subheading that appears on the blue section */

.splash-subhead {
    color: white;
    letter-spacing: 0.05em;
    opacity: 0.8;
}

/*
* -- CONTENT STYLES --
* This represents the content area (everything below the blue section)
*/
.content-outer-wrapper {
    overflow: hidden;
    position: fixed;
    z-index: 3;
    top: 0;
}

.content-wrapper {
    display: flex;
    overflow: visible;
    align-items: center;
    height: 100vh;
}

.content-wrapper::-webkit-scrollbar {
    display: none;
}

section.section {
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
}

/* We want to give the content area some more padding */

.content {
    padding: 1em 1em 3em;
}

/*
* video section first section
*/

.banner_video {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    object-position: center;
    position: relative;
    left: 0px;
    top: 0px;
    /*filter: grayscale(.5);
    -webkit-filter: grayscale(.5);
    filter: grayscale(50%);*/

}

.cont_video {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100vw;
    height: 100vh;
    color: #fff;
}

.align_center {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    z-index: 1;
}

.vid_title {
    color: #fff;
    font-weight: normal;
    width: 220px;
    margin-left: 20px;
}

.snoopy_overlay {
    height: 100%;
    left: 41%;
    transform: translateX(-50%);
    z-index: 2;
    position: absolute;
    transform-origin: center;
    opacity: 1;
    animation: image_fade 3s ease-in-out infinite;
}

@keyframes image_fade {

    0%,
    100% {
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }

    50% {
        transform: translateX(-50%) scale(2);
        opacity: .7;
    }
}

/*
* section styles
*/

section {
    min-width: 100vw;
    height: 100vh;
    transition: min-height ease 0.4s;
    min-height: -webkit-fill-available;
    position: relative;
}

/*
* section about
*/

.flex-box {
    display: flex;
    height: 100%;
}

.flex-box [class*=pure-u] {
    height: 100%;
}

.vertical_middle {
    top: 50%;
    position: relative;
    transform: translateY(-50%);
}

.section-about {
    /*		background-color: #262729;*/
    background-image: url("../imgs/About.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.section-about h2.title {
    color: #fff;
    line-height: 5rem;
    font-size: 5.5rem;
    text-align: center;
    transform: rotate(-90deg);
    text-transform: uppercase;
    font-weight: normal;
}

.pure-menu-link {
    font-family: AryaW00-Double, sans-serif;
}

.audio_overlay {
    position: relative;
    display: flex;
    align-items: center;
}

.audio_overlay:before {
    content: "";
    position: absolute;
    left: -70px;
    top: 50%;
    transform: translateY(-50%);
    width: 17px;
    border-radius: 50%;
    height: 17px;
    background-color: #c02281;
    z-index: 2;
}

.audio_overlay:after {
    content: "";
    position: absolute;
    top: 50%;
    left: -58px;
    width: 42px;
    height: 4px;
    background-color: #fff;
    transform: translateY(-50%);
    z-index: 1;
}


.image_overlay img.logo_icon {
    position: relative;
    width: 220px;
    float: left;
    margin-right: 60px;
}

.image_overlay img.slide_overlay {
    opacity: .7;
    width: 355px;
}

.image_overlay img {
    display: inline-block;
}

.cont_video img {
    max-width: 100%;
}

.cont_video>div {
    position: relative;
    z-index: 2;
}

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

.cont_video:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 50%;
    background-color: #000;
    height: 100%;
    opacity: .6;
}

.cont_video:after {
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    width: 50%;
    background-color: #c02281;
    height: 100%;
    opacity: .75;
    opacity: .65;
}

/*
* card flip
*/

.flip_boxes {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    justify-content: center;
    margin: 2rem auto;
}

.card-flip {
    position: relative;
    margin: 0rem;
}

.card-flip-faces {
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: perspective(600px) rotateY(0deg);
    transform: perspective(600px) rotateY(0deg);
}

.card-flip:hover .card-flip-faces {
    -webkit-transform: perspective(600px) rotateY(180deg);
    transform: perspective(600px) rotateY(180deg);
    /*    box-shadow: 0 20px 40px -20px rgba(0, 0, 0, 0.25);*/
}

.card-flip:hover .card-flip-faces .card-flip-front {
    opacity: 0;
}

.card-flip-front,
.card-flip-back {
    padding: 0rem;
    width: 100%;
    height: 100%;
    text-align: center;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
}

.card-flip-front h4 {
    text-transform: unset;
    margin: 0px;
    font-size: 19px;
    color: #ffffff;
    font-family: 'Montserrat';
    font-weight: 400;
}

.card-flip-text {
    font-size: 13px;
    line-height: 16px;
}

.card-flip-title {
    text-transform: uppercase;
    margin: 0px;
    font-size: 18px;
    color: #fff;
}

.card-flip-front img {
    width: 100%;
    /*
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
*/
    transition: all .5s ease;
}

.abt_pic2,
.abt_pic1,
.abt_pic3 {
    width: 150px;
}

.card-flip-front {
    display: block;
}

.card-flip-back .back_inner {
    width: 100%;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    color: #fff;
}

.card-flip-back {
    position: absolute;
    top: 0;
    /*    background-color: #000;*/
    /* background-image: url(../imgs/services/hover_effect.png); */
    background-size: contain;
    background-repeat: no-repeat;
    /*    color: */
    -webkit-transform: perspective(600px) rotateY(180deg);
    transform: perspective(600px) rotateY(180deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

@media screen and (max-width: 576px) {
    .card-flip {
        width: calc(100% - 2rem);
        width: calc(100% - 0rem);
    }

    .content-outer-wrapper {
        position: unset;
    }

    .cont_inn .img_box {
        width: auto !important;
    }

    .play-button {
        display: none;
    }
}

@media screen and (min-width: 576px) {
    .card-flip {
        width: calc(50% - 2rem);

    }
}

@media screen and (min-width: 992px) {
    .card-flip {
        width: calc(33.33% - 1rem);
        width: calc(28% - 1rem);
        margin: 0 3rem 1rem;
    }
}

.flip_boxes {
    padding: 0px;
    position: relative;
    width: 95%;
    margin: 0 auto;
    padding-top: 100px;
    padding-bottom: 30px;

    will-change: transform;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

/*
* card flip finish
*/
/*
* audio animation start
*/

.freq {
    width: 100%;
    overflow: hidden;
}

.sound-wave {
    margin: 2em auto;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    height: 150px;
}

.slide_overlay {
    opacity: .7;
    width: 355px;
    height: 350px;
    object-fit: cover;
    object-position: center;
}

.sound-wave-bar {
    display: block;
    height: 100%;
    width: 2px;
    -webkit-animation: soundwave 1s infinite;
    background: #fff !important;
    animation: soundwave 1s infinite;
    -webkit-animation-fill-mode: both;
    animation-timing-function: linear;
    animation-fill-mode: both;
    will-change: transform opacity;
    border-radius: 41%;
    margin-left: 4px;
}

.sound-wave-bar:nth-child(1) {
    height: 2%;
    -webkit-animation-delay: 0.01s;
    animation-delay: 0.01s;
    background: #594cac;
    -webkit-animation-duration: 0.86s;
    animation-duration: 0.86s;
}

.sound-wave-bar:nth-child(2) {
    -webkit-animation-delay: 0.02s;
    animation-delay: 0.02s;
    background: #594dac;


    -webkit-animation-duration: 1.72s;
    animation-duration: 1.72s;
}

.sound-wave-bar:nth-child(3) {
    -webkit-animation-delay: 0.03s;
    animation-delay: 0.03s;
    background: #594ead;


    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
}

.sound-wave-bar:nth-child(4) {
    -webkit-animation-delay: 0.04s;
    animation-delay: 0.04s;
    background: #594fad;


    -webkit-animation-duration: 1.28s;
    animation-duration: 1.28s;
}

.sound-wave-bar:nth-child(5) {
    -webkit-animation-delay: 0.05s;
    animation-delay: 0.05s;
    background: #5950ae;


    -webkit-animation-duration: 0.86s;
    animation-duration: 0.86s;
}

.sound-wave-bar:nth-child(6) {
    -webkit-animation-delay: 0.06s;
    animation-delay: 0.06s;
    background: #5950ae;


    -webkit-animation-duration: 1.64s;
    animation-duration: 1.64s;
}

.sound-wave-bar:nth-child(7) {
    -webkit-animation-delay: 0.07s;
    animation-delay: 0.07s;
    background: #5951af;


    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
}

.sound-wave-bar:nth-child(8) {
    -webkit-animation-delay: 0.08s;
    animation-delay: 0.08s;
    background: #5952b0;


    -webkit-animation-duration: 0.85s;
    animation-duration: 0.85s;
}

.sound-wave-bar:nth-child(9) {
    -webkit-animation-delay: 0.09s;
    animation-delay: 0.09s;
    background: #5953b0;


    -webkit-animation-duration: 1.85s;
    animation-duration: 1.85s;
}

.sound-wave-bar:nth-child(10) {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
    background: #5954b1;


    -webkit-animation-duration: 1.41s;
    animation-duration: 1.41s;
}

.sound-wave-bar:nth-child(11) {
    -webkit-animation-delay: 0.11s;
    animation-delay: 0.11s;
    background: #5955b1;


    -webkit-animation-duration: 1.31s;
    animation-duration: 1.31s;
}

.sound-wave-bar:nth-child(12) {
    -webkit-animation-delay: 0.12s;
    animation-delay: 0.12s;
    background: #5956b2;


    -webkit-animation-duration: 1.82s;
    animation-duration: 1.82s;
}

.sound-wave-bar:nth-child(13) {
    -webkit-animation-delay: 0.13s;
    animation-delay: 0.13s;
    background: #5a57b2;


    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
}

.sound-wave-bar:nth-child(14) {
    -webkit-animation-delay: 0.14s;
    animation-delay: 0.14s;
    background: #5a58b3;


    -webkit-animation-duration: 1.59s;
    animation-duration: 1.59s;
}

.sound-wave-bar:nth-child(15) {
    -webkit-animation-delay: 0.15s;
    animation-delay: 0.15s;
    background: #5a59b4;


    -webkit-animation-duration: 0.94s;
    animation-duration: 0.94s;
}

.sound-wave-bar:nth-child(16) {
    -webkit-animation-delay: 0.16s;
    animation-delay: 0.16s;
    background: #5a5ab4;


    -webkit-animation-duration: 1.49s;
    animation-duration: 1.49s;
}

.sound-wave-bar:nth-child(17) {
    -webkit-animation-delay: 0.17s;
    animation-delay: 0.17s;
    background: #5a5bb5;


    -webkit-animation-duration: 0.95s;
    animation-duration: 0.95s;
}

.sound-wave-bar:nth-child(18) {
    -webkit-animation-delay: 0.18s;
    animation-delay: 0.18s;
    background: #5a5bb5;


    -webkit-animation-duration: 1.73s;
    animation-duration: 1.73s;
}

.sound-wave-bar:nth-child(19) {
    -webkit-animation-delay: 0.19s;
    animation-delay: 0.19s;
    background: #5a5cb6;


    -webkit-animation-duration: 1.51s;
    animation-duration: 1.51s;
}

.sound-wave-bar:nth-child(20) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
    background: #5a5db6;


    -webkit-animation-duration: 0.81s;
    animation-duration: 0.81s;
}

.sound-wave-bar:nth-child(21) {
    -webkit-animation-delay: 0.21s;
    animation-delay: 0.21s;
    background: #5a5eb7;


    -webkit-animation-duration: 0.7s;
    animation-duration: 0.7s;
}

.sound-wave-bar:nth-child(22) {
    -webkit-animation-delay: 0.22s;
    animation-delay: 0.22s;
    background: #5a5fb7;


    -webkit-animation-duration: 0.61s;
    animation-duration: 0.61s;
}

.sound-wave-bar:nth-child(23) {
    -webkit-animation-delay: 0.23s;
    animation-delay: 0.23s;
    background: #5a60b8;


    -webkit-animation-duration: 0.84s;
    animation-duration: 0.84s;
}

.sound-wave-bar:nth-child(24) {
    -webkit-animation-delay: 0.24s;
    animation-delay: 0.24s;
    background: #5a61b9;


    -webkit-animation-duration: 1.98s;
    animation-duration: 1.98s;
}

.sound-wave-bar:nth-child(25) {
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s;
    background: #5a62b9;


    -webkit-animation-duration: 1.38s;
    animation-duration: 1.38s;
}

.sound-wave-bar:nth-child(26) {
    -webkit-animation-delay: 0.26s;
    animation-delay: 0.26s;
    background: #5a63ba;


    -webkit-animation-duration: 1.66s;
    animation-duration: 1.66s;
}

.sound-wave-bar:nth-child(27) {
    -webkit-animation-delay: 0.27s;
    animation-delay: 0.27s;
    background: #5a64ba;


    -webkit-animation-duration: 1.43s;
    animation-duration: 1.43s;
}

.sound-wave-bar:nth-child(28) {
    -webkit-animation-delay: 0.28s;
    animation-delay: 0.28s;
    background: #5a65bb;


    -webkit-animation-duration: 0.6s;
    animation-duration: 0.6s;
}

.sound-wave-bar:nth-child(29) {
    -webkit-animation-delay: 0.29s;
    animation-delay: 0.29s;
    background: #5a65bb;


    -webkit-animation-duration: 1.19s;
    animation-duration: 1.19s;
}

.sound-wave-bar:nth-child(30) {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
    background: #5a66bc;


    -webkit-animation-duration: 0.82s;
    animation-duration: 0.82s;
}

.sound-wave-bar:nth-child(31) {
    -webkit-animation-delay: 0.31s;
    animation-delay: 0.31s;
    background: #5a67bd;


    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
}

.sound-wave-bar:nth-child(32) {
    -webkit-animation-delay: 0.32s;
    animation-delay: 0.32s;
    background: #5a68bd;


    -webkit-animation-duration: 0.67s;
    animation-duration: 0.67s;
}

.sound-wave-bar:nth-child(33) {
    -webkit-animation-delay: 0.33s;
    animation-delay: 0.33s;
    background: #5a69be;


    -webkit-animation-duration: 1.42s;
    animation-duration: 1.42s;
}

.sound-wave-bar:nth-child(34) {
    -webkit-animation-delay: 0.34s;
    animation-delay: 0.34s;
    background: #5a6abe;


    -webkit-animation-duration: 0.56s;
    animation-duration: 0.56s;
}

.sound-wave-bar:nth-child(35) {
    -webkit-animation-delay: 0.35s;
    animation-delay: 0.35s;
    background: #5a6bbf;


    -webkit-animation-duration: 1.85s;
    animation-duration: 1.85s;
}

.sound-wave-bar:nth-child(36) {
    -webkit-animation-delay: 0.36s;
    animation-delay: 0.36s;
    background: #5a6cbf;


    -webkit-animation-duration: 1.73s;
    animation-duration: 1.73s;
}

.sound-wave-bar:nth-child(37) {
    -webkit-animation-delay: 0.37s;
    animation-delay: 0.37s;
    background: #5b6dc0;


    -webkit-animation-duration: 0.95s;
    animation-duration: 0.95s;
}

.sound-wave-bar:nth-child(38) {
    -webkit-animation-delay: 0.38s;
    animation-delay: 0.38s;
    background: #5b6ec1;


    -webkit-animation-duration: 1.32s;
    animation-duration: 1.32s;
}

.sound-wave-bar:nth-child(39) {
    -webkit-animation-delay: 0.39s;
    animation-delay: 0.39s;
    background: #5b6fc1;


    -webkit-animation-duration: 1.94s;
    animation-duration: 1.94s;
}

.sound-wave-bar:nth-child(40) {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
    background: #5b6fc2;


    -webkit-animation-duration: 1.05s;
    animation-duration: 1.05s;
}

.sound-wave-bar:nth-child(41) {
    -webkit-animation-delay: 0.41s;
    animation-delay: 0.41s;
    background: #5b70c2;


    -webkit-animation-duration: 1.58s;
    animation-duration: 1.58s;
}

.sound-wave-bar:nth-child(42) {
    -webkit-animation-delay: 0.42s;
    animation-delay: 0.42s;
    background: #5b71c3;


    -webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
}

.sound-wave-bar:nth-child(43) {
    -webkit-animation-delay: 0.43s;
    animation-delay: 0.43s;
    background: #5b72c3;


    -webkit-animation-duration: 1.31s;
    animation-duration: 1.31s;
}

.sound-wave-bar:nth-child(44) {
    -webkit-animation-delay: 0.44s;
    animation-delay: 0.44s;
    background: #5b73c4;


    -webkit-animation-duration: 0.68s;
    animation-duration: 0.68s;
}

.sound-wave-bar:nth-child(45) {
    -webkit-animation-delay: 0.45s;
    animation-delay: 0.45s;
    background: #5b74c5;


    -webkit-animation-duration: 1.73s;
    animation-duration: 1.73s;
}

.sound-wave-bar:nth-child(46) {
    -webkit-animation-delay: 0.46s;
    animation-delay: 0.46s;
    background: #5b75c5;


    -webkit-animation-duration: 1.64s;
    animation-duration: 1.64s;
}

.sound-wave-bar:nth-child(47) {
    -webkit-animation-delay: 0.47s;
    animation-delay: 0.47s;
    background: #5b76c6;


    -webkit-animation-duration: 0.88s;
    animation-duration: 0.88s;
}

.sound-wave-bar:nth-child(48) {
    -webkit-animation-delay: 0.48s;
    animation-delay: 0.48s;
    background: #5b77c6;


    -webkit-animation-duration: 1.86s;
    animation-duration: 1.86s;
}

.sound-wave-bar:nth-child(49) {
    -webkit-animation-delay: 0.49s;
    animation-delay: 0.49s;
    background: #5b78c7;


    -webkit-animation-duration: 1s;
    animation-duration: 1s;
}

.sound-wave-bar:nth-child(50) {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    background: #5b79c7;


    -webkit-animation-duration: 0.89s;
    animation-duration: 0.89s;
}

.sound-wave-bar:nth-child(51) {
    -webkit-animation-delay: 0.51s;
    animation-delay: 0.51s;
    background: #5b7ac8;


    -webkit-animation-duration: 1.7s;
    animation-duration: 1.7s;
}

.sound-wave-bar:nth-child(52) {
    -webkit-animation-delay: 0.52s;
    animation-delay: 0.52s;
    background: #5b7ac9;


    -webkit-animation-duration: 1.69s;
    animation-duration: 1.69s;
}

.sound-wave-bar:nth-child(53) {
    -webkit-animation-delay: 0.53s;
    animation-delay: 0.53s;
    background: #5b7bc9;


    -webkit-animation-duration: 1.43s;
    animation-duration: 1.43s;
}

.sound-wave-bar:nth-child(54) {
    -webkit-animation-delay: 0.54s;
    animation-delay: 0.54s;
    background: #5b7cca;


    -webkit-animation-duration: 1.66s;
    animation-duration: 1.66s;
}

.sound-wave-bar:nth-child(55) {
    -webkit-animation-delay: 0.55s;
    animation-delay: 0.55s;
    background: #5b7dca;


    -webkit-animation-duration: 0.69s;
    animation-duration: 0.69s;
}

.sound-wave-bar:nth-child(56) {
    -webkit-animation-delay: 0.56s;
    animation-delay: 0.56s;
    background: #5b7ecb;


    -webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
}

.sound-wave-bar:nth-child(57) {
    -webkit-animation-delay: 0.57s;
    animation-delay: 0.57s;
    background: #5b7fcb;


    -webkit-animation-duration: 0.52s;
    animation-duration: 0.52s;
}

.sound-wave-bar:nth-child(58) {
    -webkit-animation-delay: 0.58s;
    animation-delay: 0.58s;
    background: #5b80cc;


    -webkit-animation-duration: 1.89s;
    animation-duration: 1.89s;
}

.sound-wave-bar:nth-child(59) {
    -webkit-animation-delay: 0.59s;
    animation-delay: 0.59s;
    background: #5b81cc;


    -webkit-animation-duration: 1.97s;
    animation-duration: 1.97s;
}

.sound-wave-bar:nth-child(60) {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
    background: #5b82cd;


    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
}

.sound-wave-bar:nth-child(61) {
    -webkit-animation-delay: 0.61s;
    animation-delay: 0.61s;
    background: #5b83ce;


    -webkit-animation-duration: 1.42s;
    animation-duration: 1.42s;
}

.sound-wave-bar:nth-child(62) {
    -webkit-animation-delay: 0.62s;
    animation-delay: 0.62s;
    background: #5c84ce;


    -webkit-animation-duration: 0.74s;
    animation-duration: 0.74s;
}

.sound-wave-bar:nth-child(63) {
    -webkit-animation-delay: 0.63s;
    animation-delay: 0.63s;
    background: #5c84cf;


    -webkit-animation-duration: 1.23s;
    animation-duration: 1.23s;
}

.sound-wave-bar:nth-child(64) {
    -webkit-animation-delay: 0.64s;
    animation-delay: 0.64s;
    background: #5c85cf;


    -webkit-animation-duration: 1.91s;
    animation-duration: 1.91s;
}

.sound-wave-bar:nth-child(65) {
    -webkit-animation-delay: 0.65s;
    animation-delay: 0.65s;
    background: #5c86d0;


    -webkit-animation-duration: 1.64s;
    animation-duration: 1.64s;
}

.sound-wave-bar:nth-child(66) {
    -webkit-animation-delay: 0.66s;
    animation-delay: 0.66s;
    background: #5c87d0;


    -webkit-animation-duration: 0.89s;
    animation-duration: 0.89s;
}

.sound-wave-bar:nth-child(67) {
    -webkit-animation-delay: 0.67s;
    animation-delay: 0.67s;
    background: #5c88d1;


    -webkit-animation-duration: 0.56s;
    animation-duration: 0.56s;
}

.sound-wave-bar:nth-child(68) {
    -webkit-animation-delay: 0.68s;
    animation-delay: 0.68s;
    background: #5c89d2;


    -webkit-animation-duration: 1.96s;
    animation-duration: 1.96s;
}

.sound-wave-bar:nth-child(69) {
    -webkit-animation-delay: 0.69s;
    animation-delay: 0.69s;
    background: #5c8ad2;


    -webkit-animation-duration: 1.36s;
    animation-duration: 1.36s;
}

.sound-wave-bar:nth-child(70) {
    -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;
    background: #5c8bd3;


    -webkit-animation-duration: 0.87s;
    animation-duration: 0.87s;
}

.sound-wave-bar:nth-child(71) {
    -webkit-animation-delay: 0.71s;
    animation-delay: 0.71s;
    background: #5c8cd3;


    -webkit-animation-duration: 1.79s;
    animation-duration: 1.79s;
}

.sound-wave-bar:nth-child(72) {
    -webkit-animation-delay: 0.72s;
    animation-delay: 0.72s;
    background: #5c8dd4;


    -webkit-animation-duration: 1.47s;
    animation-duration: 1.47s;
}

.sound-wave-bar:nth-child(73) {
    -webkit-animation-delay: 0.73s;
    animation-delay: 0.73s;
    background: #5c8ed4;


    -webkit-animation-duration: 1.85s;
    animation-duration: 1.85s;
}

.sound-wave-bar:nth-child(74) {
    -webkit-animation-delay: 0.74s;
    animation-delay: 0.74s;
    background: #5c8fd5;


    -webkit-animation-duration: 1.62s;
    animation-duration: 1.62s;
}

.sound-wave-bar:nth-child(75) {
    -webkit-animation-delay: 0.75s;
    animation-delay: 0.75s;
    background: #5c8fd6;


    -webkit-animation-duration: 1.68s;
    animation-duration: 1.68s;
}

.sound-wave-bar:nth-child(76) {
    -webkit-animation-delay: 0.76s;
    animation-delay: 0.76s;
    background: #5c90d6;


    -webkit-animation-duration: 1.49s;
    animation-duration: 1.49s;
}

.sound-wave-bar:nth-child(77) {
    -webkit-animation-delay: 0.77s;
    animation-delay: 0.77s;
    background: #5c91d7;


    -webkit-animation-duration: 1.26s;
    animation-duration: 1.26s;
}

.sound-wave-bar:nth-child(78) {
    -webkit-animation-delay: 0.78s;
    animation-delay: 0.78s;
    background: #5c92d7;


    -webkit-animation-duration: 0.54s;
    animation-duration: 0.54s;
}

.sound-wave-bar:nth-child(79) {
    -webkit-animation-delay: 0.79s;
    animation-delay: 0.79s;
    background: #5c93d8;


    -webkit-animation-duration: 0.71s;
    animation-duration: 0.71s;
}

.sound-wave-bar:nth-child(80) {
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
    background: #5c94d8;


    -webkit-animation-duration: 1.39s;
    animation-duration: 1.39s;
}

.sound-wave-bar:nth-child(81) {
    -webkit-animation-delay: 0.81s;
    animation-delay: 0.81s;
    background: #5c95d9;


    -webkit-animation-duration: 1.75s;
    animation-duration: 1.75s;
}

.sound-wave-bar:nth-child(82) {
    -webkit-animation-delay: 0.82s;
    animation-delay: 0.82s;
    background: #5c96da;


    -webkit-animation-duration: 0.86s;
    animation-duration: 0.86s;
}

.sound-wave-bar:nth-child(83) {
    -webkit-animation-delay: 0.83s;
    animation-delay: 0.83s;
    background: #5c97da;


    -webkit-animation-duration: 1.24s;
    animation-duration: 1.24s;
}

.sound-wave-bar:nth-child(84) {
    -webkit-animation-delay: 0.84s;
    animation-delay: 0.84s;
    background: #5c98db;


    -webkit-animation-duration: 1.48s;
    animation-duration: 1.48s;
}

.sound-wave-bar:nth-child(85) {
    -webkit-animation-delay: 0.85s;
    animation-delay: 0.85s;
    background: #5c99db;


    -webkit-animation-duration: 0.87s;
    animation-duration: 0.87s;
}

.sound-wave-bar:nth-child(86) {
    -webkit-animation-delay: 0.86s;
    animation-delay: 0.86s;
    background: #5c99dc;


    -webkit-animation-duration: 1.47s;
    animation-duration: 1.47s;
}

.sound-wave-bar:nth-child(87) {
    -webkit-animation-delay: 0.87s;
    animation-delay: 0.87s;
    background: #5d9adc;


    -webkit-animation-duration: 0.89s;
    animation-duration: 0.89s;
}

.sound-wave-bar:nth-child(88) {
    -webkit-animation-delay: 0.88s;
    animation-delay: 0.88s;
    background: #5d9bdd;


    -webkit-animation-duration: 1.91s;
    animation-duration: 1.91s;
}

.sound-wave-bar:nth-child(89) {
    -webkit-animation-delay: 0.89s;
    animation-delay: 0.89s;
    background: #5d9cde;


    -webkit-animation-duration: 1.12s;
    animation-duration: 1.12s;
}

.sound-wave-bar:nth-child(90) {
    -webkit-animation-delay: 0.9s;
    animation-delay: 0.9s;
    background: #5d9dde;


    -webkit-animation-duration: 0.99s;
    animation-duration: 0.99s;
}

.sound-wave-bar:nth-child(91) {
    -webkit-animation-delay: 0.91s;
    animation-delay: 0.91s;
    background: #5d9edf;


    -webkit-animation-duration: 0.76s;
    animation-duration: 0.76s;
}

.sound-wave-bar:nth-child(92) {
    -webkit-animation-delay: 0.92s;
    animation-delay: 0.92s;
    background: #5d9fdf;


    -webkit-animation-duration: 1.01s;
    animation-duration: 1.01s;
}

.sound-wave-bar:nth-child(93) {
    -webkit-animation-delay: 0.93s;
    animation-delay: 0.93s;
    background: #5da0e0;


    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
}

.sound-wave-bar:nth-child(94) {
    -webkit-animation-delay: 0.94s;
    animation-delay: 0.94s;
    background: #5da1e0;


    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
}

.sound-wave-bar:nth-child(95) {
    -webkit-animation-delay: 0.95s;
    animation-delay: 0.95s;
    background: #5da2e1;


    -webkit-animation-duration: 1.61s;
    animation-duration: 1.61s;
}

.sound-wave-bar:nth-child(96) {
    -webkit-animation-delay: 0.96s;
    animation-delay: 0.96s;
    background: #5da3e1;


    -webkit-animation-duration: 1.58s;
    animation-duration: 1.58s;
}

.sound-wave-bar:nth-child(97) {
    -webkit-animation-delay: 0.97s;
    animation-delay: 0.97s;
    background: #5da3e2;


    -webkit-animation-duration: 1.53s;
    animation-duration: 1.53s;
}

.sound-wave-bar:nth-child(98) {
    -webkit-animation-delay: 0.98s;
    animation-delay: 0.98s;
    background: #5da4e3;


    -webkit-animation-duration: 1.23s;
    animation-duration: 1.23s;
}

.sound-wave-bar:nth-child(99) {
    -webkit-animation-delay: 0.99s;
    animation-delay: 0.99s;
    background: #5da5e3;


    -webkit-animation-duration: 1.71s;
    animation-duration: 1.71s;
}

.sound-wave-bar:nth-child(100) {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    background: #5da6e4;


    -webkit-animation-duration: 0.82s;
    animation-duration: 0.82s;
}

.sound-wave-bar:nth-child(101) {
    -webkit-animation-delay: 1.01s;
    animation-delay: 1.01s;
    background: #5da7e4;


    -webkit-animation-duration: 0.71s;
    animation-duration: 0.71s;
}

.sound-wave-bar:nth-child(102) {
    -webkit-animation-delay: 1.02s;
    animation-delay: 1.02s;
    background: #5da8e5;


    -webkit-animation-duration: 1.48s;
    animation-duration: 1.48s;
}

.sound-wave-bar:nth-child(103) {
    -webkit-animation-delay: 1.03s;
    animation-delay: 1.03s;
    background: #5da9e5;


    -webkit-animation-duration: 0.61s;
    animation-duration: 0.61s;
}

.sound-wave-bar:nth-child(104) {
    -webkit-animation-delay: 1.04s;
    animation-delay: 1.04s;
    background: #5daae6;


    -webkit-animation-duration: 1.92s;
    animation-duration: 1.92s;
}

.sound-wave-bar:nth-child(105) {
    -webkit-animation-delay: 1.05s;
    animation-delay: 1.05s;
    background: #5dabe7;


    -webkit-animation-duration: 1.16s;
    animation-duration: 1.16s;
}

.sound-wave-bar:nth-child(106) {
    -webkit-animation-delay: 1.06s;
    animation-delay: 1.06s;
    background: #5dace7;


    -webkit-animation-duration: 1.39s;
    animation-duration: 1.39s;
}

.sound-wave-bar:nth-child(107) {
    -webkit-animation-delay: 1.07s;
    animation-delay: 1.07s;
    background: #5dade8;


    -webkit-animation-duration: 1.4s;
    animation-duration: 1.4s;
}

.sound-wave-bar:nth-child(108) {
    -webkit-animation-delay: 1.08s;
    animation-delay: 1.08s;
    background: #5daee8;


    -webkit-animation-duration: 0.53s;
    animation-duration: 0.53s;
}

.sound-wave-bar:nth-child(109) {
    -webkit-animation-delay: 1.09s;
    animation-delay: 1.09s;
    background: #5daee9;


    -webkit-animation-duration: 0.58s;
    animation-duration: 0.58s;
}

.sound-wave-bar:nth-child(110) {
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s;
    background: #5dafe9;


    -webkit-animation-duration: 0.65s;
    animation-duration: 0.65s;
}

.sound-wave-bar:nth-child(111) {
    -webkit-animation-delay: 1.11s;
    animation-delay: 1.11s;
    background: #5eb0ea;


    -webkit-animation-duration: 1.69s;
    animation-duration: 1.69s;
}

.sound-wave-bar:nth-child(112) {
    -webkit-animation-delay: 1.12s;
    animation-delay: 1.12s;
    background: #5eb1eb;


    -webkit-animation-duration: 1.49s;
    animation-duration: 1.49s;
}

.sound-wave-bar:nth-child(113) {
    -webkit-animation-delay: 1.13s;
    animation-delay: 1.13s;
    background: #5eb2eb;


    -webkit-animation-duration: 1.7s;
    animation-duration: 1.7s;
}

.sound-wave-bar:nth-child(114) {
    -webkit-animation-delay: 1.14s;
    animation-delay: 1.14s;
    background: #5eb3ec;


    -webkit-animation-duration: 1.97s;
    animation-duration: 1.97s;
}

.sound-wave-bar:nth-child(115) {
    -webkit-animation-delay: 1.15s;
    animation-delay: 1.15s;
    background: #5eb4ec;


    -webkit-animation-duration: 1.43s;
    animation-duration: 1.43s;
}

.sound-wave-bar:nth-child(116) {
    -webkit-animation-delay: 1.16s;
    animation-delay: 1.16s;
    background: #5eb5ed;


    -webkit-animation-duration: 1.68s;
    animation-duration: 1.68s;
}

.sound-wave-bar:nth-child(117) {
    -webkit-animation-delay: 1.17s;
    animation-delay: 1.17s;
    background: #5eb6ed;


    -webkit-animation-duration: 1.67s;
    animation-duration: 1.67s;
}

.sound-wave-bar:nth-child(118) {
    -webkit-animation-delay: 1.18s;
    animation-delay: 1.18s;
    background: #5eb7ee;


    -webkit-animation-duration: 1.54s;
    animation-duration: 1.54s;
}

.sound-wave-bar:nth-child(119) {
    -webkit-animation-delay: 1.19s;
    animation-delay: 1.19s;
    background: #5eb8ef;


    -webkit-animation-duration: 1.92s;
    animation-duration: 1.92s;
}

.sound-wave-bar:nth-child(120) {
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
    background: #5eb8ef;


    -webkit-animation-duration: 0.59s;
    animation-duration: 0.59s;
}

.sound-wave-bar:nth-child(121) {
    -webkit-animation-delay: 1.21s;
    animation-delay: 1.21s;
    background: #5eb9f0;


    -webkit-animation-duration: 1.67s;
    animation-duration: 1.67s;
}

.sound-wave-bar:nth-child(122) {
    -webkit-animation-delay: 1.22s;
    animation-delay: 1.22s;
    background: #5ebaf0;


    -webkit-animation-duration: 1.79s;
    animation-duration: 1.79s;
}

.sound-wave-bar:nth-child(123) {
    -webkit-animation-delay: 1.23s;
    animation-delay: 1.23s;
    background: #5ebbf1;


    -webkit-animation-duration: 1.36s;
    animation-duration: 1.36s;
}

.sound-wave-bar:nth-child(124) {
    -webkit-animation-delay: 1.24s;
    animation-delay: 1.24s;
    background: #5ebcf1;


    -webkit-animation-duration: 1.82s;
    animation-duration: 1.82s;
}

.sound-wave-bar:nth-child(125) {
    -webkit-animation-delay: 1.25s;
    animation-delay: 1.25s;
    background: #5ebdf2;


    -webkit-animation-duration: 1.9s;
    animation-duration: 1.9s;
}

.sound-wave-bar:nth-child(126) {
    -webkit-animation-delay: 1.26s;
    animation-delay: 1.26s;
    background: #5ebef3;


    -webkit-animation-duration: 0.69s;
    animation-duration: 0.69s;
}

.sound-wave-bar:nth-child(127) {
    -webkit-animation-delay: 1.27s;
    animation-delay: 1.27s;
    background: #5ebff3;


    -webkit-animation-duration: 1.17s;
    animation-duration: 1.17s;
}

.sound-wave-bar:nth-child(128) {
    -webkit-animation-delay: 1.28s;
    animation-delay: 1.28s;
    background: #5ec0f4;


    -webkit-animation-duration: 1.94s;
    animation-duration: 1.94s;
}

.sound-wave-bar:nth-child(129) {
    -webkit-animation-delay: 1.29s;
    animation-delay: 1.29s;
    background: #5ec1f4;


    -webkit-animation-duration: 1.08s;
    animation-duration: 1.08s;
}

.sound-wave-bar:nth-child(130) {
    -webkit-animation-delay: 1.3s;
    animation-delay: 1.3s;
    background: #5ec2f5;


    -webkit-animation-duration: 0.86s;
    animation-duration: 0.86s;
}

.sound-wave-bar:nth-child(131) {
    -webkit-animation-delay: 1.31s;
    animation-delay: 1.31s;
    background: #5ec2f5;


    -webkit-animation-duration: 0.96s;
    animation-duration: 0.96s;
}

.sound-wave-bar:nth-child(132) {
    -webkit-animation-delay: 1.32s;
    animation-delay: 1.32s;
    background: #5ec3f6;


    -webkit-animation-duration: 0.89s;
    animation-duration: 0.89s;
}

.sound-wave-bar:nth-child(133) {
    -webkit-animation-delay: 1.33s;
    animation-delay: 1.33s;
    background: #5ec4f6;


    -webkit-animation-duration: 1.86s;
    animation-duration: 1.86s;
}

.sound-wave-bar:nth-child(134) {
    -webkit-animation-delay: 1.34s;
    animation-delay: 1.34s;
    background: #5ec5f7;


    -webkit-animation-duration: 1.32s;
    animation-duration: 1.32s;
}

.sound-wave-bar:nth-child(135) {
    -webkit-animation-delay: 1.35s;
    animation-delay: 1.35s;
    background: #5ec6f8;


    -webkit-animation-duration: 1.22s;
    animation-duration: 1.22s;
}

.sound-wave-bar:nth-child(136) {
    -webkit-animation-delay: 1.36s;
    animation-delay: 1.36s;
    background: #5fc7f8;


    -webkit-animation-duration: 0.96s;
    animation-duration: 0.96s;
}

.sound-wave-bar:nth-child(137) {
    -webkit-animation-delay: 1.37s;
    animation-delay: 1.37s;
    background: #5fc8f9;


    -webkit-animation-duration: 1.43s;
    animation-duration: 1.43s;
}

.sound-wave-bar:nth-child(138) {
    -webkit-animation-delay: 1.38s;
    animation-delay: 1.38s;
    background: #5fc9f9;


    -webkit-animation-duration: 0.87s;
    animation-duration: 0.87s;
}

.sound-wave-bar:nth-child(139) {
    -webkit-animation-delay: 1.39s;
    animation-delay: 1.39s;
    background: #5fcafa;


    -webkit-animation-duration: 1.24s;
    animation-duration: 1.24s;
}

.sound-wave-bar:nth-child(140) {
    -webkit-animation-delay: 1.4s;
    animation-delay: 1.4s;
    background: #5fcbfa;


    -webkit-animation-duration: 0.86s;
    animation-duration: 0.86s;
}

.sound-wave-bar:nth-child(141) {
    -webkit-animation-delay: 1.41s;
    animation-delay: 1.41s;
    background: #5fccfb;


    -webkit-animation-duration: 1.88s;
    animation-duration: 1.88s;
}

.sound-wave-bar:nth-child(142) {
    -webkit-animation-delay: 1.42s;
    animation-delay: 1.42s;
    background: #5fcdfc;


    -webkit-animation-duration: 0.73s;
    animation-duration: 0.73s;
}

.sound-wave-bar:nth-child(143) {
    -webkit-animation-delay: 1.43s;
    animation-delay: 1.43s;
    background: #5fcdfc;


    -webkit-animation-duration: 1.11s;
    animation-duration: 1.11s;
}

.sound-wave-bar:nth-child(144) {
    -webkit-animation-delay: 1.44s;
    animation-delay: 1.44s;
    background: #5fcefd;


    -webkit-animation-duration: 0.72s;
    animation-duration: 0.72s;
}

.sound-wave-bar:nth-child(145) {
    -webkit-animation-delay: 1.45s;
    animation-delay: 1.45s;
    background: #5fcffd;


    -webkit-animation-duration: 0.88s;
    animation-duration: 0.88s;
}

.sound-wave-bar:nth-child(146) {
    -webkit-animation-delay: 1.46s;
    animation-delay: 1.46s;
    background: #5fd0fe;


    -webkit-animation-duration: 1.75s;
    animation-duration: 1.75s;
}

.sound-wave-bar:nth-child(147) {
    -webkit-animation-delay: 1.47s;
    animation-delay: 1.47s;
    background: #5fd1fe;


    -webkit-animation-duration: 0.65s;
    animation-duration: 0.65s;
}

.sound-wave-bar:nth-child(148) {
    -webkit-animation-delay: 1.48s;
    animation-delay: 1.48s;
    background: #5fd2ff;


    -webkit-animation-duration: 0.59s;
    animation-duration: 0.59s;
}

.sound-wave-bar:nth-child(0) {
    height: 8px;
}

.sound-wave-bar:nth-child(1) {
    height: 4px;
}

.sound-wave-bar:nth-child(2) {
    height: 12px;
}

.sound-wave-bar:nth-child(3) {
    height: 31px;
}

.sound-wave-bar:nth-child(4) {
    height: 39px;
}

.sound-wave-bar:nth-child(5) {
    height: 8px;
}

.sound-wave-bar:nth-child(6) {
    height: 96px;
}

.sound-wave-bar:nth-child(7) {
    height: 77px;
}

.sound-wave-bar:nth-child(8) {
    height: 69px;
}

.sound-wave-bar:nth-child(9) {
    height: 31px;
}

.sound-wave-bar:nth-child(10) {
    height: 4px;
}

.sound-wave-bar:nth-child(11) {
    height: 8px;
}

.sound-wave-bar:nth-child(12) {
    height: 31px;
}

.sound-wave-bar:nth-child(13) {
    height: 46px;
}

.sound-wave-bar:nth-child(14) {
    height: 115px;
}

.sound-wave-bar:nth-child(15) {
    height: 123px;
}

.sound-wave-bar:nth-child(16) {
    height: 58px;
}

.sound-wave-bar:nth-child(17) {
    height: 123px;
}

.sound-wave-bar:nth-child(18) {
    height: 115px;
}

.sound-wave-bar:nth-child(19) {
    height: 108px;
}

.sound-wave-bar:nth-child(20) {
    height: 69px;
}

.sound-wave-bar:nth-child(21) {
    height: 54px;
}

.sound-wave-bar:nth-child(22) {
    height: 173px;
}

.sound-wave-bar:nth-child(23) {
    height: 4px;
}

.sound-wave-bar:nth-child(24) {
    height: 8px;
}

.sound-wave-bar:nth-child(25) {
    height: 39px;
}

.sound-wave-bar:nth-child(26) {
    height: 115px;
}

.sound-wave-bar:nth-child(27) {
    height: 108px;
}

.sound-wave-bar:nth-child(28) {
    height: 81px;
}

.sound-wave-bar:nth-child(29) {
    height: 42px;
}

.sound-wave-bar:nth-child(30) {
    height: 31px;
}

.sound-wave-bar:nth-child(31) {
    height: 8px;
}

.sound-wave-bar:nth-child(32) {
    height: 4px;
}

.sound-wave-bar:nth-child(33) {
    height: 39px;
}

.sound-wave-bar:nth-child(34) {
    height: 115px;
}

.sound-wave-bar:nth-child(35) {
    height: 123px;
}

.sound-wave-bar:nth-child(36) {
    height: 58px;
}

.sound-wave-bar:nth-child(37) {
    height: 115px;
}

.sound-wave-bar:nth-child(38) {
    height: 108px;
}

.sound-wave-bar:nth-child(39) {
    height: 69px;
}

.sound-wave-bar:nth-child(40) {
    height: 54px;
}

.sound-wave-bar:nth-child(41) {
    height: 31px;
}

.sound-wave-bar:nth-child(42) {
    height: 39px;
}

.sound-wave-bar:nth-child(43) {
    height: 8px;
}

.sound-wave-bar:nth-child(44) {
    height: 96px;
}

.sound-wave-bar:nth-child(45) {
    height: 77px;
}

.sound-wave-bar:nth-child(46) {
    height: 69px;
}

.sound-wave-bar:nth-child(47) {
    height: 146px;
}

.sound-wave-bar:nth-child(48) {
    height: 115px;
}

.sound-wave-bar:nth-child(49) {
    height: 39px;
}

.sound-wave-bar:nth-child(50) {
    height: 8px;
}

.sound-wave-bar:nth-child(51) {
    height: 58px;
}

.sound-wave-bar:nth-child(52) {
    height: 115px;
}

.sound-wave-bar:nth-child(53) {
    height: 108px;
}

.sound-wave-bar:nth-child(54) {
    height: 69px;
}

.sound-wave-bar:nth-child(55) {
    height: 54px;
}

.sound-wave-bar:nth-child(56) {
    height: 31px;
}

.sound-wave-bar:nth-child(57) {
    height: 39px;
}

.sound-wave-bar:nth-child(58) {
    height: 8px;
}

.sound-wave-bar:nth-child(59) {
    height: 96px;
}

.sound-wave-bar:nth-child(60) {
    height: 77px;
}

.sound-wave-bar:nth-child(61) {
    height: 69px;
}

.sound-wave-bar:nth-child(62) {
    height: 146px;
}

.sound-wave-bar:nth-child(63) {
    height: 115px;
}

.sound-wave-bar:nth-child(64) {
    height: 39px;
}

.sound-wave-bar:nth-child(65) {
    height: 8px;
}

.sound-wave-bar:nth-child(66) {
    height: 58px;
}

.sound-wave-bar:nth-child(67) {
    height: 115px;
}

.sound-wave-bar:nth-child(68) {
    height: 108px;
}

.sound-wave-bar:nth-child(69) {
    height: 69px;
}

.sound-wave-bar:nth-child(70) {
    height: 54px;
}

.sound-wave-bar:nth-child(71) {
    height: 31px;
}

.sound-wave-bar:nth-child(72) {
    height: 39px;
}

.sound-wave-bar:nth-child(73) {
    height: 8px;
}

.sound-wave-bar:nth-child(74) {
    height: 96px;
}

.sound-wave-bar:nth-child(75) {
    height: 77px;
}

.sound-wave-bar:nth-child(76) {
    height: 69px;
}

.sound-wave-bar:nth-child(77) {
    height: 146px;
}

.sound-wave-bar:nth-child(78) {
    height: 115px;
}

.sound-wave-bar:nth-child(79) {
    height: 39px;
}

.sound-wave-bar:nth-child(80) {
    height: 8px;
}

.sound-wave-bar:nth-child(81) {
    height: 39px;
}

.sound-wave-bar:nth-child(82) {
    height: 8px;
}

.sound-wave-bar:nth-child(83) {
    height: 96px;
}

.sound-wave-bar:nth-child(84) {
    height: 77px;
}

.sound-wave-bar:nth-child(85) {
    height: 69px;
}

.sound-wave-bar:nth-child(86) {
    height: 146px;
}

.sound-wave-bar:nth-child(87) {
    height: 115px;
}

.sound-wave-bar:nth-child(88) {
    height: 39px;
}

.sound-wave-bar:nth-child(89) {
    height: 8px;
}

.sound-wave-bar:nth-child(90) {
    height: 58px;
}

.sound-wave-bar:nth-child(91) {
    height: 115px;
}

.sound-wave-bar:nth-child(92) {
    height: 108px;
}

.sound-wave-bar:nth-child(93) {
    height: 69px;
}

.sound-wave-bar:nth-child(94) {
    height: 54px;
}

.sound-wave-bar:nth-child(95) {
    height: 31px;
}

.sound-wave-bar:nth-child(96) {
    height: 39px;
}

.sound-wave-bar:nth-child(97) {
    height: 8px;
}

.sound-wave-bar:nth-child(98) {
    height: 96px;
}

.sound-wave-bar:nth-child(99) {
    height: 77px;
}

.sound-wave-bar:nth-child(100) {
    height: 69px;
}

.sound-wave-bar:nth-child(101) {
    height: 146px;
}

.sound-wave-bar:nth-child(102) {
    height: 115px;
}

.sound-wave-bar:nth-child(103) {
    height: 39px;
}

.sound-wave-bar:nth-child(104) {
    height: 8px;
}

.sound-wave-bar:nth-child(105) {
    height: 4px;
}

.sound-wave-bar:nth-child(106) {
    height: 12px;
}

.sound-wave-bar:nth-child(107) {
    height: 31px;
}

.sound-wave-bar:nth-child(108) {
    height: 39px;
}

.sound-wave-bar:nth-child(109) {
    height: 8px;
}

.sound-wave-bar:nth-child(110) {
    height: 96px;
}

.sound-wave-bar:nth-child(111) {
    height: 77px;
}

.sound-wave-bar:nth-child(112) {
    height: 69px;
}

.sound-wave-bar:nth-child(113) {
    height: 31px;
}

.sound-wave-bar:nth-child(114) {
    height: 4px;
}

.sound-wave-bar:nth-child(115) {
    height: 8px;
}

.sound-wave-bar:nth-child(116) {
    height: 31px;
}

.sound-wave-bar:nth-child(117) {
    height: 46px;
}

.sound-wave-bar:nth-child(118) {
    height: 115px;
}

.sound-wave-bar:nth-child(119) {
    height: 123px;
}

.sound-wave-bar:nth-child(120) {
    height: 58px;
}

.sound-wave-bar:nth-child(121) {
    height: 123px;
}

.sound-wave-bar:nth-child(122) {
    height: 115px;
}

.sound-wave-bar:nth-child(123) {
    height: 108px;
}

.sound-wave-bar:nth-child(124) {
    height: 69px;
}

.sound-wave-bar:nth-child(125) {
    height: 54px;
}

.sound-wave-bar:nth-child(126) {
    height: 173px;
}

.sound-wave-bar:nth-child(127) {
    height: 4px;
}

.sound-wave-bar:nth-child(128) {
    height: 8px;
}

.sound-wave-bar:nth-child(129) {
    height: 39px;
}

.sound-wave-bar:nth-child(130) {
    height: 115px;
}

.sound-wave-bar:nth-child(131) {
    height: 108px;
}

.sound-wave-bar:nth-child(132) {
    height: 81px;
}

.sound-wave-bar:nth-child(133) {
    height: 42px;
}

.sound-wave-bar:nth-child(134) {
    height: 31px;
}

.sound-wave-bar:nth-child(135) {
    height: 8px;
}

.sound-wave-bar:nth-child(136) {
    height: 4px;
}

.sound-wave-bar:nth-child(137) {
    height: 39px;
}

.sound-wave-bar:nth-child(138) {
    height: 115px;
}

.sound-wave-bar:nth-child(139) {
    height: 123px;
}

.sound-wave-bar:nth-child(140) {
    height: 58px;
}

.sound-wave-bar:nth-child(141) {
    height: 115px;
}

.sound-wave-bar:nth-child(142) {
    height: 108px;
}

.sound-wave-bar:nth-child(143) {
    height: 69px;
}

.sound-wave-bar:nth-child(144) {
    height: 54px;
}

.sound-wave-bar:nth-child(145) {
    height: 31px;
}

.sound-wave-bar:nth-child(146) {
    height: 39px;
}

.sound-wave-bar:nth-child(147) {
    height: 8px;
}

.sound-wave-bar:nth-child(148) {
    height: 193px;
}

.sound-wave-bar:nth-child(149) {
    height: 193px;
}

.sound-wave-bar:nth-child(150) {
    height: 193px;
}

.sound-wave-bar:nth-child(151) {
    height: 193px;
}

.sound-wave-bar:nth-child(152) {
    height: 193px;
}

.sound-wave-bar:nth-child(153) {
    height: 193px;
}

.sound-wave-bar:nth-child(154) {
    height: 193px;
}

.sound-wave-bar:nth-child(155) {
    height: 193px;
}

.sound-wave-bar:nth-child(156) {
    height: 193px;
}

.sound-wave-bar:nth-child(157) {
    height: 193px;
}

.sound-wave-bar:nth-child(158) {
    height: 193px;
}

.sound-wave-bar:nth-child(159) {
    height: 193px;
}

.sound-wave-bar:nth-child(160) {
    height: 193px;
}

.sound-wave-bar:nth-child(161) {
    height: 193px;
}

.sound-wave-bar:nth-child(162) {
    height: 193px;
}

.sound-wave-bar:nth-child(163) {
    height: 193px;
}

.sound-wave-bar:nth-child(164) {
    height: 193px;
}

.sound-wave-bar:nth-child(165) {
    height: 193px;
}

.sound-wave-bar:nth-child(166) {
    height: 193px;
}

.sound-wave-bar:nth-child(167) {
    height: 193px;
}

.sound-wave-bar:nth-child(168) {
    height: 193px;
}

.sound-wave-bar:nth-child(169) {
    height: 193px;
}

.sound-wave-bar:nth-child(170) {
    height: 193px;
}

.sound-wave-bar:nth-child(171) {
    height: 193px;
}

.sound-wave-bar:nth-child(172) {
    height: 193px;
}

.sound-wave-bar:nth-child(173) {
    height: 193px;
}

.sound-wave-bar:nth-child(174) {
    height: 193px;
}

.sound-wave-bar:nth-child(175) {
    height: 193px;
}

.sound-wave-bar:nth-child(176) {
    height: 193px;
}

.sound-wave-bar:nth-child(177) {
    height: 193px;
}

.sound-wave-bar:nth-child(178) {
    height: 193px;
}

.sound-wave-bar:nth-child(179) {
    height: 193px;
}

.sound-wave-bar:nth-child(180) {
    height: 193px;
}

.sound-wave-bar:nth-child(181) {
    height: 193px;
}

.sound-wave-bar:nth-child(182) {
    height: 193px;
}

.sound-wave-bar:nth-child(183) {
    height: 193px;
}

.sound-wave-bar:nth-child(184) {
    height: 193px;
}

.sound-wave-bar:nth-child(185) {
    height: 193px;
}

.sound-wave-bar:nth-child(186) {
    height: 193px;
}

.sound-wave-bar:nth-child(187) {
    height: 193px;
}

.sound-wave-bar:nth-child(188) {
    height: 193px;
}

.sound-wave-bar:nth-child(189) {
    height: 193px;
}

.sound-wave-bar:nth-child(190) {
    height: 193px;
}

.sound-wave-bar:nth-child(191) {
    height: 193px;
}

.sound-wave-bar:nth-child(192) {
    height: 193px;
}

.sound-wave-bar:nth-child(193) {
    height: 193px;
}

.sound-wave-bar:nth-child(194) {
    height: 193px;
}

.sound-wave-bar:nth-child(195) {
    height: 193px;
}

.sound-wave-bar:nth-child(196) {
    height: 193px;
}

.sound-wave-bar:nth-child(197) {
    height: 193px;
}

.sound-wave-bar:nth-child(198) {
    height: 193px;
}

.sound-wave-bar:nth-child(199) {
    height: 193px;
}

@-webkit-keyframes soundwave {
    from {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
        opacity: .90;
    }

    50% {
        -webkit-transform: scaleY(1.8);
        transform: scaleY(1.8);
        opacity: 1;
    }

    to {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        opacity: .90;
    }
}

@keyframes soundwave {
    from {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
        opacity: .90;
    }

    50% {
        -webkit-transform: scaleY(1.8);
        transform: scaleY(1.8);
        opacity: 1;
    }

    to {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        opacity: .90;
    }
}

/*
* audio animation ends
*/

.about_list li img {
    width: 61%;
}

.about_list {
    padding: 0px;
}

.about_list li {
    display: inline-block;
    margin: 0px 0px;
    width: 24%;
    text-align: center;
    position: relative;
}

.about_list li .cont_box .inner_cont {
    opacity: 0;
    position: relative;
    left: -10%;
    transition: all .5s ease;
    transition-delay: .4s;
}

.cont_box.box-invert {
    bottom: 180%;
    top: auto;
    left: -100%;
    min-height: 160px;
}

.cont_box.box-invert svg {
    height: 150px;
    position: absolute;
    top: auto;
    bottom: -90%;
    right: 10%;
    left: auto;
}

.cont_box.box-invert svg {
    -webkit-transform: scaleY(-1) scaleX(-1);
    transform: scaleY(-1) scaleX(-1);
}

.about_list li:hover .cont_box .inner_cont {
    opacity: 1;
    left: 0%;
}

.cont_box {
    position: absolute;
    left: 100%;
    top: 205%;
    width: 185%;
    text-align: left;
    color: #fff;
    min-height: 150px;
}

.cont_box {
    transition: all 5s ease;
}

.cont_box svg {
    height: 150px;
    position: absolute;
    top: 0px;
    top: -110%;
    left: -28%;
}

.cont_box h3 {
    color: #fff;
    text-transform: uppercase;
    font-size: 26px;
    margin-bottom: 0px;
    margin-top: 0px;
}

/*
* expandable_box
*/

.expandable_box {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
    transition: all .5s ease;
}

.expandable_box .box_ex .inner_con {
    position: absolute;
    bottom: 0%;
    transform: rotate(-90deg);
    left: 100px;
    transition: all .5s ease;
    transform-origin: 0;
    width: 60vh;
}

/* .expandable_box .box_ex:hover .inner_con {
    left: -2%;
}

.expandable_box .box_ex.open .inner_con {
    left: -2%;
} */

.expandable_box .box_ex .inner_con a {
    color: #fff;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    font-family: AryaW00-Double, sans-serif;
    font-weight: normal;
    letter-spacing: 1px;
    position: relative;
    top: 40px;
    opacity: 0;
    transition: all .5s ease;
}

.cont_inn .img_box:hover img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}

.cont_inn .img_box img {
    width: 270px;
    transition: all .5s ease;
}

.cont_inn .img_box {
    width: 75%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 50%;
    opacity: 0;
    transition: all ease 0.6s;
    transition-delay: 0s;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}


.open .cont_inn .img_box {
    opacity: 1;
    transition-delay: 0.4s;
}

.cont_inn .text_box {
    color: #fff;
    width: 50%;
    margin-left: 2rem;
}

.cont_inn .text_box h3 {
    color: #fff;
    font-size: 30px;
    text-transform: uppercase;
    margin-bottom: 0px;
    margin-top: 0px;
}

.cont_inn .text_box p {}

.cont_inn {
    width: 0%;
    height: 100%;
    background: #2f2f2feb;
    background: #2f2f2fc2;
    z-index: 0;
    position: absolute;
    right: 0px;
    top: 0px;
    /*transition: all .5s ease;*/
    overflow: hidden;
    transition-delay: 0.6s;
}

.open .cont_inn {
    transition-delay: 0s;
}

.expandable_box .box_ex.open .cont_inn {
    width: 90%;
    /* overflow: auto; */
}

.expandable_box .box_ex:hover .inner_con a {
    top: 5px;
    opacity: 1;
}

.box_ex .summary {
    background: #000;
    line-height: 1.1rem;
    max-width: 350px;
    width: 60%;
    position: absolute;
    bottom: 8rem;
    left: 30%;
    padding: 1rem;
    border-radius: 8px;
    box-shadow: 0 0 10px #00000063;
    color: #ffffffbd;
    font-size: 0.9rem;
    opacity: 0;
    transition: all ease 0.3s;
}

.cta-btn svg {
    width: 18px;
    height: auto;
}

.cta-btn {
    position: absolute;
    z-index: 4;
    left: 0;
    bottom: 50%;
    background-color: #8DAAC3;
    color: #fff;
    text-decoration: none;
    font-family: AryaW00-Double, sans-serif;
    padding: 1rem .5rem;
    transform: translateY(50%);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 5px 5px 0;
}

.expandable-active .box_ex:hover .summary {
    opacity: 0;
}

.box_ex:hover .summary {
    opacity: 1
}

.expandable_box .box_ex:hover h3 {
    opacity: 1 !important;
}

.expandable_box .box_ex.open .inner_con a {
    top: 5px;
    opacity: 0;
}

.expandable_box .box_ex .inner_con h3 {
    color: #fff;
    font-size: 40px;
    text-transform: uppercase;
    margin: 0px;
    padding: 0px;
    line-height: 40px;
    transition: all ease 0.3s;
}

.expandable_box .box_ex {
    flex-grow: 1;
    flex-basis: 0;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    /*transition: all .5s ease;*/
}

.expandable_box .box_ex {
    /*transition-delay: 0.4s;*/
}


.expandable_box .box_ex:hover {
    flex-grow: 1.2;
}

.close_button {
    position: absolute;
    left: 50%;
    top: 0;
    color: #fff;
    text-decoration: none;
    z-index: 99999;
    padding: 5px;
    background: #030303a8;
    line-height: 1;
    padding: 1rem 1rem 0.5rem;
    border-radius: 0 0 10px 10px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    font-family: AryaW00-Double, sans-serif;
}

.video-wrapper {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.video-wrapper-inner {
    position: relative;
    width: 38vw;
    height: 70vh;
}

.video-wrapper-inner iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.open .close_button {
    opacity: 1;
}

.gallery {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    height: 100%;
    background-color: #000;
}

.gallery a:after {
    content: "";
    position: absolute;
    right: 0;
    width: 1px;
    height: 100%;
    background-color: #000;
}

.gallery a:before {
    content: "";
    position: absolute;
    left: -25%;
    top: -25%;
    width: 150%;
    height: 150%;
    background-color: #000;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQwcHgiIGhlaWdodD0iMTMxcHgiIHZpZXdCb3g9IjAgMCAxNDAgMTMxIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgICAgIDx0aXRsZT5Hcm91cDwvdGl0bGU+CiAgICAgICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj4KICAgICAgICAgICAgPGcgaWQ9IkFydGJvYXJkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTQ1LjAwMDAwMCwgLTUxLjAwMDAwMCkiIHN0cm9rZT0iI2ZmZmZmZiIgc3Ryb2tlLXdpZHRoPSI5Ij4KICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUwLjAwMDAwMCwgNTYuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPGNpcmNsZSBpZD0iT3ZhbCIgY3g9IjQ3LjUiIGN5PSI0Ny41IiByPSI0Ny41Ij48L2NpcmNsZT4KICAgICAgICAgICAgICAgICAgICA8bGluZSB4MT0iODQuNSIgeTE9Ijc5LjUiIHgyPSIxMzAuNSIgeTI9IjEyMS41IiBpZD0iTGluZSI+PC9saW5lPgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9zdmc+);

    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px;
    opacity: 0;
    transition: all ease 0.8s;
    transform: rotate(-15deg) scale(1);
}

.gallery a[data-type="video"]:before {

    background-image: url(data:image/svg+xml;base64,CiAgICA8c3ZnIHdpZHRoPSI4OXB4IiBoZWlnaHQ9IjExMHB4IiB2aWV3Qm94PSIwIDAgODkgMTEwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgICAgIDx0aXRsZT5QYXRoIDI8L3RpdGxlPgogICAgICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+CiAgICAgICAgICAgIDxnIGlkPSJBcnRib2FyZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQwMS4wMDAwMDAsIC01NS4wMDAwMDApIiBmaWxsPSIjZmZmIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMTMiPgogICAgICAgICAgICAgICAgPHBvbHlnb24gaWQ9IlBhdGgtMiIgcG9pbnRzPSI0MDcuNzU1NDUyIDYyLjQ2MTgzMzYgNDgyLjc1NTQ1MiAxMTAuNDYxODM0IDQwNy43NTU0NTIgMTU4LjQ2MTgzNCI+PC9wb2x5Z29uPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9zdmc+);

}

.gallery a:hover::before {
    opacity: 0.5;
    transform: rotate(0deg) scale(1.4);
}

.pswp {
    z-index: 9999999;
}

.gallery a {
    flex: 0 0 50%;
    display: block;
    height: 50%;
    min-height: 200px;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid #000;
    position: relative;
    overflow: hidden
}

.gallery img {
    height: 200px;
    visibility: hidden;
}

.close_button img {
    height: 14px;
}

.pure-menu-list {
    transition: all ease 0.3s;
}

.expandable-active .right-arrow {
    display: none;
}

.expandable-active .scroll_btn {
    display: none;
}

.expandable-active .expandable_box .box_ex:not(.open):before {
    opacity: 0.8
}

.expandable-active .expandable_box .box_ex:not(.open) .inner_con h3 {
    opacity: 0.1;
}

.expandable-active .pure-menu-list {
    transform: translateY(-100%);
    opacity: 0
}

.expandable-active .home-menu {
    pointer-events: none
}

.expandable_box .box_ex.box_2 {
    background-position: 70% 50%;
}

.expandable_box .box_ex.open {
    flex-grow: 10;
    transition-delay: 0s;
}

.expandable_box .box_ex:not(.open):hover {
    cursor: pointer;
}

.expandable_box .box_ex:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .2;
    transition: all ease 0.3s
}

/* about section */
.images_about img {
    width: 100%;
}

.images_about {
    position: relative;
    text-align: center;
    color: white;
    text-transform: uppercase;
}

.abt_pic1 h5 {

    color: #faeb41bf;

}

.abt_pic2 h5 {
    color: #b41294;
}

.abt_pic3 h5 {
    color: #87a9e0e0;
}

.images_about h5 {
    font-size: 1.2rem;
    margin: 0;
    /*     white-space: nowrap; */
}

.images_about p {
    font-size: 0.8rem;
    margin: 0;
}

.abt_content {
    display: flex;
    align-items: center;

    margin-top: 100px;
    margin-bottom: 60px;
    height: calc(100% - 120px);
}

.abt_content>img {
    width: 40px;
    position: absolute;
    top: 50%;
    left: -40px;
    transform: translateY(-50%);
}

.abt_content {
    position: relative;
    margin-right: 10%;
}

.text_about {
    padding: 120px 60px 120px 120px;
    font-size: 0.85rem;
    line-height: 1.6;
    color: #fff;
    overflow: auto;
    max-height: 100vh;
}

.text_about .sc_text {
    font-weight: 400;
    letter-spacing: 1.8px;
    font-size: 16px;
    text-transform: unset;
    font-family: 'Montserrat';
}


/* end of about section */


/*
* section contact
*/
.contact_info {
    display: flex;
    align-items: flex-end;
}

.section-contact .contact_info a {
    font-weight: normal;
    color: #fff;
    text-decoration: none;
    display: block;
}

.section-contact .contact_info p {
    color: #fff;
    font-size: 20px;
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    margin-bottom: 63px;
    line-height: 30px;
    padding-left: 20px;
    flex: 1;
}

.img_bx_list {
    padding: 0px;
    top: 56%;
    position: relative;
    transform: translateY(-50%);
    width: 84%;
    margin: 0 auto;
}

.img_bx_list li {
    width: 48%;
    display: inline-block;
    /* float: left; */
    text-align: center;
    color: #fff;
    margin: 37px 0px;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.img_bx_list li:hover img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}

.img_bx_list li img {
    width: 90%;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: all .5s ease;
}

.img_bx_list li h4 {
    color: #fff;
    margin: 0px;
    font-size: 28px;
}

/*
* section-circle
*/

.section-circle {
    /* background-image: url("../imgs/circle.jpg"); */
    background-size: cover;
    background-position: center;
}

.section-circle h2.title {
    color: #fff;
    line-height: 5rem;
    font-size: 5.5rem;
    text-align: center;
    transform: rotate(-90deg);
    text-transform: uppercase;
    font-weight: normal;
}

.section-circle h2.title:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 220px;
    background-image: url(../imgs/waves_color-03.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translate(-50%, -50%) rotate(90deg);
    z-index: -1;
}

/*
* contact us
*/

.section-contact h2.title {
    color: #fff;
    line-height: 5rem;
    font-size: 2.5rem;
    text-align: center;
    transform: rotate(-90deg);
    text-transform: uppercase;
    font-weight: normal;
    margin: 0;
    font-family: AryaW00-Double;
}

/* 
.section-contact h2.title:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 220px;
    background-image: url(../imgs/waves_color-03.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: translate(-50%, -50%) rotate(90deg);
    z-index: -1;
} */

.section-contact {
    background-image: url("../imgs/contact.jpg");
    background-size: cover;
    background-position: center;
    position: relative;
}

.section-contact:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgb(192, 34, 129);
    background: -moz-linear-gradient(90deg, rgba(192, 34, 129, 1) 0%, rgba(0, 0, 0, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(192, 34, 129, 1) 0%, rgba(0, 0, 0, 1) 100%);
    background: linear-gradient(90deg, rgba(192, 34, 129, 1) 0%, rgba(0, 0, 0, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#c02281", endColorstr="#000000", GradientType=1);
    opacity: .7;
}

/* This is the class used for the main content headers (<h2>) */

.content-head {
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 2em 0 1em;
}

/* This is a modifier class used when the content-head is inside a ribbon */

.content-head-ribbon {
    color: white;
}

/* This is the class used for the content sub-headers (<h3>) */

.content-subhead {
    color: #1f8dd6;
}

.content-subhead i {
    margin-right: 7px;
}

/* This is the class used for the dark-background areas. */

.ribbon {
    background: #2d3e50;
    color: #aaa;
}

/* This is the class used for the footer */

.footer {
    background: #111;
    position: fixed;
    bottom: 0;
    width: 100%;
}

canvas {
    position: absolute;
}

nav.link-list ul {
    margin: 0;
    padding: 0;
}

nav.link-list {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 20px;
    display: inline-block;
}

nav.link-list li {
    overflow: hidden;
    float: left;
}

nav.link-list a {
    position: relative;
    width: 12px;
    height: 12px;
    margin: 5px;
    display: inline-block;
    border-radius: 50%;
    background-color: #fff;
    transition: background-color 0.5s ease;
}

nav.link-list a.is-active {
    background-color: #c8a36c;
}

nav.btns {
    position: absolute;
    top: 45%;
    width: 100%;
}

nav.btns button {
    position: absolute;
    display: inline-block;
    width: 44px;
    height: 44px;
    text-align: center;
    line-height: 44px;
    font-weight: bold;
    font-size: 15px;
    font-family: serif;
    border-radius: 50%;
    background-color: #fff;
    cursor: pointer;
    border: 0;
    transition: all 0.5s ease;
}

nav.btns button:focus {
    outline: 0;
}

nav.btns button:before {
    content: "";
    position: absolute;
    width: 44px;
    height: 44px;
    top: 0;
    left: 0;
    border: 2px solid #c8a36c;
    border-radius: 50%;
    opacity: 0;
    transition: all 0.5s ease;
}

nav.btns button span {
    opacity: 0.3;
    transition: opacity 0.2s ease;
}

nav.btns button:hover {
    background-color: #c8a36c;
    width: 64px;
    height: 64px;
    transform: translateY(-10px);
}

nav.btns button:hover:before {
    opacity: 1;
    width: 104px;
    height: 104px;
    top: -22px;
    left: -22px;
}

nav.btns button:hover span {
    opacity: 1;
}

nav.btns button.show-prev {
    left: 15%;
}

nav.btns button.show-next {
    right: 15%;
}

.loading-txt {
    text-align: center;
    width: 100%;
    font-size: 24px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.loading-txt.is-hidden {
    display: none;
}

.fixed_circle_box {
    position: absolute;
    left: 0px;
}

/*
* -- TABLET (AND UP) MEDIA QUERIES --
* On tablets and other medium-sized devices, we want to customize some
* of the mobile styles.
*/

@media (min-width: 48em) {

    /* We increase the body font size */
    body {
        font-size: 16px;
    }

    /* We can align the menu header to the left, but float the
menu items to the right. */
    .home-menu {
        text-align: left;
    }

    .home-menu ul {
        float: right;
    }

    /* We increase the height of the splash-container */
    /*    .splash-container {
height: 500px;
}*/
    /* We decrease the width of the .splash, since we have more width
to work with */
    .splash {
        width: 50%;
        height: 50%;
    }

    .splash-head {
        font-size: 250%;
    }

    /* We remove the border-separator assigned to .l-box-lrg */
    .l-box-lrg {
        border: none;
    }
}

/*
* -- DESKTOP (AND UP) MEDIA QUERIES --
* On desktops and other large devices, we want to over-ride some
* of the mobile and tablet styles.
*/

@media (min-width: 78em) {

    /* We increase the header font size even more */
    .splash-head {
        font-size: 300%;
    }
}

/* 
@media (max-width: 600px) {

    .section-contact h2.title {
        margin: 10px;
    }

    .section-contact {
        margin-top: 150px;
        height: 570px;
    }

    .section-services {
        margin-top: 0;
    }

    .box_ex .summary {
        background: transparent;
        line-height: 1.1rem;
        max-width: 350px;
        width: 100%;
        position: absolute;
        bottom: 0rem;
        left: 5%;
        padding: 1rem;
        border-radius: 8px;
        box-shadow: 0 0 10px #00000063;
        color: #ffffffbd;
        font-size: 0.9rem;
        opacity: 0;
        transition: all ease 0.3s;
    }

    .inner_con {
        width: 100%;
        left: auto;
        transform: none;
        height: auto;
        top: 30%;
        padding-left: 30px;
    }

    .abt_pic2,
    .abt_pic1,
    .abt_pic3 {
        width: 65%;
    }

    .images_about {
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }

    .abt_content>img {
        width: 50px;
        top: 55%;
    }
} */

.menu-toggle {
    width: 40px;
    height: 30px;
    position: absolute;
    top: 20px;
    right: 25px;
    cursor: pointer;
}

.menu-toggle.on .one {
    -moz-transform: rotate(45deg) translate(7px, 7px);
    -ms-transform: rotate(45deg) translate(7px, 7px);
    -webkit-transform: rotate(45deg) translate(7px, 7px);
    transform: rotate(45deg) translate(7px, 7px);
}

.menu-toggle.on .two {
    opacity: 0;
}

.menu-toggle.on .three {
    -moz-transform: rotate(-45deg) translate(8px, -10px);
    -ms-transform: rotate(-45deg) translate(8px, -10px);
    -webkit-transform: rotate(-45deg) translate(8px, -10px);
    transform: rotate(-45deg) translate(8px, -10px);
}

.one,
.two,
.three {
    width: 100%;
    height: 3px;
    background: white;
    margin: 8px auto;
    backface-visibility: hidden;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.menu-toggle {
    opacity: 0;
}

#loading-wrapper {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #222;
    z-index: 10;
}

#loading-text {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    color: #fff;
    width: 100px;
    height: 30px;
    margin: -7px 0 0 -45px;
    text-align: center;
    font-family: 'PT Sans Narrow', sans-serif;
    font-size: 20px;
}

#loading-content {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 170px;
    height: 170px;
    margin: -85px 0 0 -85px;
    border: 3px solid #c02281;
}

#loading-content:after {
    content: '';
    position: absolute;
    border: 3px solid #fff;
    left: 15px;
    right: 15px;
    top: 15px;
    bottom: 15px;
}

#loading-content:before {
    content: '';
    position: absolute;
    border: 3px solid #fff;
    left: 5px;
    right: 5px;
    top: 5px;
    bottom: 5px;
}

#loading-content {
    border: 3px solid transparent;
    border-top-color: #11eeff;
    border-bottom-color: #11eeff;
    border-radius: 50%;
    -webkit-animation: loader 2s linear infinite;
    -moz-animation: loader 2s linear infinite;
    -o-animation: loader 2s linear infinite;
    animation: loader 2s linear infinite;
}

#loading-content:before {
    border: 3px solid transparent;
    border-top-color: #be41ff;
    border-bottom-color: #be41ff;
    border-radius: 50%;
    -webkit-animation: loader 3s linear infinite;
    -moz-animation: loader 2s linear infinite;
    -o-animation: loader 2s linear infinite;
    animation: loader 3s linear infinite;
}

#loading-content:after {
    border: 3px solid transparent;
    border-top-color: #ff0007;
    border-bottom-color: #ff0007;
    border-radius: 50%;
    -webkit-animation: loader 1.5s linear infinite;
    animation: loader 1.5s linear infinite;
    -moz-animation: loader 2s linear infinite;
    -o-animation: loader 2s linear infinite;
}

@keyframes loaders {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes loader {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.pure-g [class*="pure-u"] {
    font-family: inherit;
}

.visually-hidden {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}




/* Custom */
.cont_inn {
    display: flex;
    align-items: center;
}

