/*--------------------------------------------------------------------------------------*/


/*keyframe
/*--------------------------------------------------------------------------------------*/

@-webkit-keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
}

@-webkit-keyframes spinAround {
    from {
        -webkit-transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes spinAround {
    from {
        -moz-transform: rotate(0deg)
    }

    to {
        -moz-transform: rotate(360deg);
    }
}

@keyframes spinAround {
    from {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes rotateme {
    0% {
        transform: rotate(0deg);
        opacity: 1;
    }

    50% {
        transform: rotate(180deg);
    }

    100% {
        transform: rotate(360deg);
        opacity: 1;
    }
}


/* Bob Up Down*/

@-webkit-keyframes float_up_down {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }

    50% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes float_up_down {
    0% {
        transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }

    50% {
        transform: translateY(30px);
        transform: translateY(30px);
        opacity: 1;
    }

    100% {
        transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}

@-webkit-keyframes zoom-fade {
    0% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }

    50% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    100% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }
}

@keyframes zoom-fade {
    0% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }

    50% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    100% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }
}

.hvr-sweep-to-right:hover,
.hvr-sweep-to-right:focus,
.hvr-sweep-to-right:active {
    color: #fff !important
}

.hvr-sweep-to-right {
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    overflow: hidden;
    cursor: pointer
}

.hvr-sweep-to-right:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    overflow: hidden;

}

.hvr-sweep-to-right:hover:before,
.hvr-sweep-to-right:focus:before,
.hvr-sweep-to-right:active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.shape-1,
.shape-2,
.shape-3,
.shape-4,
.shape-5,
.shape-6,
.shape-7,
.shape-8,
.shape-9,
.shape-10,
.shape-11 {
    animation-name: zoom-fade;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: zoom-fade;
    -webkit-animation-duration: 8s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: zoom-fade;
    -moz-animation-duration: 8s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: zoom-fade;
    -ms-animation-duration: 8s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: zoom-fade;
    -o-animation-duration: 8s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear
}

.banner-top-R figure:after {


    animation-name: rotateme;
    animation-duration: 22s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: rotateme;
    -webkit-animation-duration: 22s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotateme;
    -moz-animation-duration: 22s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: rotateme;
    -ms-animation-duration: 22s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: rotateme;
    -o-animation-duration: 22s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

@-webkit-keyframes zoom-fade {
    0% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }

    50% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    100% {
        -webkit-transform: scale(0.8);
        transform: scale(0.5)
    }
}

@keyframes zoom-fade {
    0% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }

    50% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    100% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }
}

.shape-1 {
    position: absolute;
    left: 91px;
    bottom: 0;
}


.shape-2 {
    position: absolute;
    right: 73px;
    top: 50px;
}

.shape-3 {
    position: absolute;
    top: -12px;
    left: 220px;
}

.shape-4 {

    position: absolute;
    bottom: -12px;
    right: 220px;
}

.shape-4 img {

    transform: rotate(180deg);

}

.shape-5 {
    position: var(--position-abso);
    right: 350px;
    top: -20px;
}

.shape-6 {
    position: var(--position-abso);
    left: 350px;
    bottom: -20px;

}

.shape-6 img {

    transform: rotate(180deg);


}

.shape-7 {
    position: absolute;
    left: -48px;
    top: 172px;
    width: 118px;
    height: 118px;
    background: #FFAF18;
    border-radius: 50%;
}

.shape-8 {
    position: absolute;
    right: -48px;
    bottom: 172px;
    width: 118px;
    height: 118px;
    background: #FFAF18;
    border-radius: 50%;
}


.banner-btn {
    position: relative;
    overflow: hidden;
}

/*.banner-btn:after {
    -webkit-animation: shine 3s infinite ease-in-out;
    animation: shine 3s infinite ease-in-out;
    content: "";
    position: absolute;
    top: 0;
    left: -70px;
    width: 50px;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.75);
    transition: 0.2s;
    -webkit-transform: skewX(-15deg);
    transform: skewX(-15deg);
}*/


/*@-webkit-keyframes shine {
  0% {
    left: -40px;
  }
  25% {
    left: 230px;
  }
  100% {
    left: 230px;
  }
}
@keyframes shine {
  0% {
    left: -40px;
  }
  25% {
    left: 230px;
  }
  100% {
    left: 230px;
  }
}*/


/* Zoom in Keyframes */
@-webkit-keyframes zoomin {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

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

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

/*End of Zoom in Keyframes */

/* Zoom out Keyframes */
@-webkit-keyframes zoomout {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.30);
    }

    100% {
        transform: scale(1);
    }
}

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

    50% {
        transform: scale(0.20);
    }

    100% {
        transform: scale(1);
    }
}


@keyframes "bannermove" {
    0% {
        margin-left: 0px;
    }

    100% {
        margin-left: -5746px;
    }

}

@-moz-keyframes bannermove {
    0% {
        margin-left: 0px;
    }

    100% {
        margin-left: -5746px;
    }

}

@-webkit-keyframes "bannermove" {
    0% {
        margin-left: 0px;
    }

    100% {
        margin-left: -5746px;
    }

}

@-ms-keyframes "bannermove" {
    0% {
        margin-left: 0px;
    }

    100% {
        margin-left: -5746px;
    }

}

@-o-keyframes "bannermove" {
    0% {
        margin-left: 0px;
    }

    100% {
        margin-left: -5746px;
    }

}

@keyframes odsoky {
    0% {
        transform: translateY(6px)
    }

    100% {
        transform: translateY(1px)
    }
}

.play-btn:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 80px;
    height: 80px;
     background: rgb(0 0 0 / 50%);
    border-radius: 50%;
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite;
    border: 1px solid #8A2B42;
}
.play-btn:after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 85px;
    height: 85px;
    background: rgb(0 0 0 / 65%);
    border-radius: 50%;
    transition: all 200ms;
}
.play-btn span {
    display: flex;
    position: relative;
    z-index: 3;
    width: 0;
    height: 0;
    border-left: 28px solid #fff;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent;
    align-items: center;
    justify-content: center;
}



@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}