@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@font-face {
    font-family: BaseNeueTrialBold;
    src: url(../fonts/base-neue-trial-bold.ttf);
  }
  @font-face {
    font-family: BaseNeueTrialMedium;
    src: url(../fonts/base-neue-trial-bold-medium.ttf);
  }
  @font-face {
    font-family: BaseNeueTrialLight;
    src: url(../fonts/base-neue-trial-light.ttf);
  }

  body {
    overflow-x: hidden;
}
html::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
	border-radius: 10px;
}
html::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}
html::-webkit-scrollbar-thumb
{
	border-radius: 0px;
	background-image: -webkit-gradient(linear,
    left bottom,
    left top,
    color-stop(0.70, #701753),
    color-stop(0.10, #000),
    color-stop(0.90, #9F3859));
}
html {
    overflow-y: scroll;
}


/* HEADER */
.navbar-expand-lg .navbar-nav .dropdown-menu {
    background: linear-gradient(180deg, #701753 0%, #000 60%, #9F3858 100%, rgba(0, 0, 0, 0.00) 100%);
    padding: 10px 0;
}
.navbar-expand-lg .navbar-nav .dropdown-menu li {
    margin: 0 0 10px;
}
.navbar-expand-lg .navbar-nav .dropdown-menu li a:hover {
    background: transparent;
    border-bottom: 1px solid;
    padding: 10px 15px;
    transition: all 0.4s linear;
}
header.header-row .collapse {
    visibility: visible;
}
.navbar-light .navbar-brand img {
    width: 60%;
}
li.nav-item.dropdown:hover ul.dropdown-menu {
    display: block;
}
header.header-row {
    padding: 0 165px 0;
    position: absolute;
    top: 0;
    z-index: 9999;
    width: 100%;
}
header.header-row ul.navbar-nav.me-auto.mb-2.mb-lg-0 {margin-left: 250px;}
header.header-row ul.navbar-nav.me-auto.mb-2.mb-lg-0 a {
    color: #FFF !IMPORTANT;
    font-family: "Open Sans";
    font-size: 20px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; 
    text-transform: capitalize;
}
header.header-row ul.navbar-nav.me-auto.mb-2.mb-lg-0 li.nav-item {
    margin: 0 20px;
}
header.header-row ul.navbar-nav.me-auto.mb-2.mb-lg-0 a.show {
    display: block;
}
header.header-row ul.right {
    padding: 0;
    margin: 0;
}
header.header-row ul.right li {
    list-style: none;
}
header.header-row ul.right li a {
    color: #FFF !important;
    font-family: "Open Sans";
    font-size: 20px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    border-radius: 60px;
    border: 2px solid var(--Linear, #CD7FEA);
    padding: 15px 20px 15px 30px;
    display: flex;
    align-items: center;
}
header.header-row ul.right li a img {
    width: 22%;
    margin-right: 10px;
}


/* BANNER */

.banner-row {
    padding: 297px 222px 296px 173px;
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 0;
}
.banner-row .banner-sec .w-head .banner-head {
    width: 100%;
    animation: bounce 300ms
      alternate infinite;
}
@keyframes bounce {
    from {
      transform: translateY(0px);
    }
    to {
      transform: translateY(-20px);
    }
  }
.banner-row .banner-sec .w-head p {
    color: #FFF;
    font-family: "Open Sans", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    margin: 0;
    padding: 30px 0 30px;
}
.banner-row .banner-sec .w-head a.w-btn img {
    width: auto;
    padding: 0 5px;
}
.banner-row .banner-sec .w-head a.w-btn {
    display: inline-flex;
    align-items: center;
    border-radius: 50px;
    border: 1px solid var(--Linear, #CD7FEA);
    background: #FFF;
    padding: 15px 15px;
    color: #000;
    font-family: "Open Sans", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    text-decoration: none;
}
.banner-row .banner-sec .w-head a.w-btn:hover {
    transform: translateY(-10px);
    transition: all ease 0.4s;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}
.banner-video-row {
    position: relative;
}

/* BANNER-BELOW */

.banner-below-row {
    background: #0C0C0C;
    padding: 10px 177px;
    margin-top: -10px;
}
.banner-below-row .banner-below-sec .main.d-flex {
    justify-content: space-evenly;
}
.banner-below-row .banner-below-sec .main.d-flex .item.d-flex {
    align-items: center;
}
.banner-below-row .banner-below-sec .main.d-flex .item.d-flex h1.count {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 70px;
    font-style: normal;
    font-weight: 900;
    line-height: 100%;
    text-transform: capitalize;
    position: relative;
}
.banner-below-row .banner-below-sec .main.d-flex .item.d-flex h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 70px;
    font-style: normal;
    font-weight: 900;
    line-height: 100%;
    text-transform: capitalize;
    position: relative;
}
.banner-below-row .banner-below-sec .main.d-flex .item.d-flex h3.text {
    color: #FFF;
    font-family: "BaseNeueTrialLight";
    font-size: 50px;
    font-style: normal;
    font-weight: 900;
    line-height: 100%;
    text-transform: capitalize;
}
.banner-below-row .banner-below-sec .main.d-flex .item.d-flex:hover img {
    transform: rotateY(45deg);
	animation: rotateAnimation 10s linear infinite;
}
@keyframes rotateAnimation {
	from {transform: rotateY(5deg);}
	to {transform: rotateY(1000deg);}
}
.banner-below-row .banner-below-sec .main.d-flex .inner:first-child .item.d-flex h1.count:after {
    content: "+";
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 70px;
    font-style: normal;
    font-weight: 900;
    line-height: 100%;
    text-transform: capitalize;
    position: relative;
    top: -5px;
    margin: 0 5px;
}
.banner-below-row .banner-below-sec .main.d-flex .item.d-flex h2:after 
{
    content: "+";
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 70px;
    font-style: normal;
    font-weight: 900;
    line-height: 100%;
    text-transform: capitalize;
    position: relative;
    top: -5px;
    margin: 0 5px;
}

/* MAIN-BG */

section#main-bg {
    background: url("../images/website-bg.jpg");
    background-size: 100% 100%;
    background-position: 100% 1000%;
    background-repeat: no-repeat;
}

/* WORK-FLOW */

.work-flow-row {
    padding: 100px 0 100px;
}
.work-flow-row .w-head h2 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    width: 50%;
    margin: 0 auto;
}
.work-flow-row .w-head h2 span {
    background: linear-gradient(180deg, #F8CEBF 68.2%, #FEA09D 80.64%, #D75461 92.08%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
}
.work-flow-row .w-head {
    margin: 0 0 50px;
}
.work-flow-row .inner-work.row {
    padding: 30px 165px;
    align-items: center;
}
.work-flow-row .inner-work.row .work-flow-sec h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: capitalize;
    align-items: center;
    display: flex;
}
.work-flow-row .inner-work.row .work-flow-sec h2 span {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialMedium";
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    margin-right: 30px;
}
.work-flow-row .inner-work.row .work-flow-sec p {
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    font-family: "Open Sans", sans-serif;
    width: 80%;
    margin: 0 auto;
}
.work-flow-row .inner-work:nth-child(1) .work-flow-sec p {
    margin-right: 0;
}
.work-flow-row .inner-work:nth-child(2) .work-flow-sec p {
    margin-right: 0;
}
.work-flow-row .inner-work:nth-child(3) .work-flow-sec p {
    margin-left: 0;
}
.work-flow-row .inner-work:nth-child(4) .work-flow-sec p {
    margin-left: 0;
}
.work-flow-row .inner-work:nth-child(3) .work-flow-sec h2 {
    justify-content: end;
}
.work-flow-row .inner-work:nth-child(4) .work-flow-sec h2 {
    justify-content: end;
}
.work-flow-row .inner-work-sec {
    position: relative;
}
.loop {
    animation: rotate 5s infinite linear;
    transform-style: preserve-3d;
}
@keyframes rotate {
    0% {
        transform: rotateX(0deg) rotateY(0deg);
    }
    100% {
        transform: rotateX(360deg) rotateY(360deg);
    }
}
.work-flow-row .inner-work-sec:after {
    content: "";
    background: #fff;
    width: 720px;
    height: 1px;
    position: absolute;
    transform: rotate(50deg);
    left: 570px;
    top: 359px;
}
.work-flow-row .inner-work-sec .inner-work:nth-child(1):hover:before {
    content: url("../images/btn-arrow.png");
    position: absolute;
    top: 70px;
    left: 688px;
    z-index: 1;
}
.work-flow-row .inner-work-sec .inner-work:nth-child(2):hover:before {
    content: url("../images/btn-arrow.png");
    position: absolute;
    top: 231px;
    left: 821px;
    z-index: 1;
}
.work-flow-row .inner-work-sec .inner-work:after {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    background: #fff;
    border-radius: 50%;
}
.work-flow-row .inner-work-sec .inner-work:nth-child(2):after {
    left: 845px;
}
.work-flow-row .inner-work-sec .inner-work:nth-child(3):after {
    left: 997px;
}
.work-flow-row .inner-work-sec .inner-work:nth-child(3):hover:before {
    content: url(../images/btn-arrow.png);
    position: absolute;
    top: 425px;
    left: 984px;
    z-index: 1;
}
.work-flow-row .inner-work-sec .inner-work:last-child:after {
    left: 1147px;
}
.work-flow-row .inner-work-sec .inner-work:last-child:hover:before {
    content: url(../images/btn-arrow.png);
    position: absolute;
    top: 612px;
    left: 1140px;
    z-index: 1;
}
.work-flow-row .inner-work.row:hover {
    background: linear-gradient(270deg, rgba(179, 100, 190, 0.15) 18.68%, rgba(215, 84, 97, 0.15) 85.36%);
    transition: all 0.4s linear;
}
.work-flow-row .inner-work.row:hover img.loop {
    display: block;
}
.work-flow-row .inner-work.row img.loop {
    display: none;
    width: 16%;
}
.work-flow-row .inner-work-sec .inner-work:first-child:after {
    left: 694px;
    top: 78px;
}
.work-flow-row .inner-work-sec .inner-work:hover:after {
    display: none;
}
.work-flow-row:after {
    background: url("../images/work-img-b.png");
    content: "";
    width: 175px;
    height: 150px;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    right: 130px;
    z-index: 9999;
    background-size: cover;
}

/* SERVICE */

.service-row {
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0.60);
    backdrop-filter: blur(27px);
    width: 90%;
    margin: 0 auto;
    padding: 100px 100px;
    background-image: url("../images/service-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
}
.service-row .w-head h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    width: 90%;
}
.service-row .w-head h2 span {
    background: linear-gradient(180deg, #F8CEBF 68.2%, #FEA09D 80.64%, #D75461 92.08%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
}
.service-row .w-head p {
    color: #FFF;
    font-family: 'Open Sans';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
}
.service-row .inner-service-row a {
    text-decoration: none;
    border-bottom: 2px solid #fff;
    width: 100%;
    display: table;
    padding: 0 0 0;
    position: relative;
    z-index: 0;
}
.service-row .inner-service-row a h3:hover {
    border-radius: 10px;
    border: 2px solid #FFF;
    background: #000;
    width: 100%;
    padding: 10px 20px;
}
.service-row .inner-service-row a h3:hover img {
    width: 6%;
    display: block;
}
.service-row .inner-service-row a h3 img {
    width: 6%;
    display: none;
}
.service-row .inner-service-row a h3 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    margin: 40px 0 40px;
}
.service-row .inner-service-row a h3 span {
    font-size: 30px;
    font-family: "BaseNeueTrialLight";
    position: relative;
    margin: 0 20px 0 0;
}
.service-row .inner-service-row a h3:after {
    content: url("../images/arrow-service2.png");
    position: absolute;
    right: 20px;
    top: 25px;
    z-index: -1;
}
.service-row .inner-service-row a h3:hover:after {
    content: url("../images/arrow-service.png");
    z-index: 0;
    top: 52px;
}
.inner-service-row {
    margin: 70px 0 0;
    width: 100%;
    overflow-y: scroll;
    min-height: 500px;
    height: 500px;
}
.inner-service-row::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
	border-radius: 10px;
}
.inner-service-row::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}
.inner-service-row::-webkit-scrollbar-thumb
{
	border-radius: 0px;
	background-image: -webkit-gradient(linear,
    left bottom,
    left top,
    color-stop(0.70, #701753),
    color-stop(0.10, #000),
    color-stop(0.90, #9F3859));
}

/* BRAND */

.brands-row {
    padding: 100px 100px;
}
.brands-row .brand-sec marquee ul li {
    list-style: none;
    display: inline-block;
}
.brands-row .brand-sec marquee ul li img {filter: grayscale(1);}

/* PORTFOLIO */

.portfolio-row {
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0.80);
    backdrop-filter: blur(27px);
    width: 90%;
    margin: 0 auto;
    padding: 100px 100px;
    background-image: url("../images/portfolio-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
}
.portfolio-row .w-head h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
}
.portfolio-row .Tabs {
    margin: 50px 0 0;
}
.portfolio-row .Tabs div#nav-tab {
    justify-content: center;
    border: none;
    margin: 0 0 50px !important;
}
.portfolio-row .Tabs .nav-tabs .nav-link.active {
    color: #000;
    font-family: 'Open Sans';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    padding: 10px 30px;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to right, #ffffffbd, #cd7fea) border-box;
    border-radius: 50em;
    border: 4px solid transparent;
}
.portfolio-row .Tabs .nav-tabs .nav-link {
    color: #FFF;
    font-family: 'Open Sans';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    padding: 10px 30px;
    border-radius: 50em;
    border: 2px solid var(--Linear, #60436a);
    margin: 0 20px;
}
.portfolio-sec .card-image img {
    width: 95%;
    margin: 0 auto;
    display: block;
    border-radius: 20px;
}
.portfolio-sec .card-image a .card-cont {
    border-radius: 20px;
    border: 2px solid #FFF;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.95) 100%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    display: none;
    width: 95%;
    margin: 0 auto;
    padding: 20px;
    transition: transform 0.5s ease;
}
.portfolio-sec .card-image a {
    position: relative;
    transition: transform 0.5s ease;
}
.portfolio-sec .card-image a .card-cont img.btn-arrow {width: 10%;margin: 0 auto;margin-right: 0;border: 1px solid #fff;border-radius: 50%;height: auto;}
.portfolio-sec .card-image a .card-cont h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: capitalize;
    text-align: center;
    transition: transform 0.5s ease;
}
.portfolio-sec .card-image img {
    height: 400px;
    object-fit: cover;
    object-position: top;
}
.portfolio-sec .card-image a:hover .card-cont {
    display: block;
}
.portfolio-sec .card-image a:hover .card-cont h2{
  transform: translateY(4em);
}
.popup{
    width: 900px;
    margin: auto;
    text-align: center
}
.popup img{
    width: 200px;
    height: 200px;
    cursor: pointer
}
div#GetAQuote .show{
    z-index: 999;
    display: none;
}
div#GetAQuote .show .overlay{
    width: 100%;
    height: 1000%;
    background: rgba(0,0,0,.6);
    backdrop-filter: blur(5px);
    position: absolute;
    top: 0;
    left: 0;
}
div#GetAQuote .show .img-show {
    /*width: 600px;
    height: auto;*/
    background: transparent;
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translate(-50%,0%);
    overflow: hidden;
}
.img-show span{
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 99;
    cursor: pointer;
}
.portfolio-sec .card-image {
    margin: 0 0 50px;
}
.portfolio-row marquee h2 {
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    --stroke-width: 2px;
    margin: 0 1rem 1rem 14rem;
    -webkit-text-stroke: var(--stroke-width) #FFF;
    color: #000;
}
.portfolio-row marquee ul {
    margin: 0;
    display: flex;
    padding: 0 !important;
}
.portfolio-row marquee ul li {
    list-style: none;
    padding: 0 !important;
    width: 40%;
}

/* PRICING */

body .pricing-sec .card-border h4 s, body .pricing-sec .card-border h4 strike{text-decoration:none !important;position:relative !important;-webkit-text-fill-color: aliceblue !important;}
body .pricing-sec .card-border h4 s::before, body .pricing-sec .card-border h4 strike::before {
    top: 50% !important; 
    background: #000 !important; 
    opacity: 1 !important;
    content: '' !important;
    width: 110% !important;
    position: absolute !important;
    height: 8px !important;
    border-radius:.1em !important;
    left: -5% !important;
    white-space:nowrap !important;
    display: block !important;
    transform: rotate(-15deg) !important;
}
body .pricing-sec .card-border h4 span {
    -webkit-text-fill-color: aliceblue !important;
}
body .pricing-sec .card-border h4 s.straight::before, body .pricing-sec .card-border h4 strike.straight::before{transform: rotate(0deg) !important;left:-1% !important;width:102% !important;}
.pricing-row {
    padding: 50px 165px 100px !important;
}
.pricing-row .w-head h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
}
.pricing-row .w-head p {
    color: #FFF;
    text-align: center;
    font-family: 'Open Sans';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; 
    text-transform: capitalize;
    margin: 0;
}
.pricing-sec .glow {
    width: 30%;
    margin: 0 auto;
    display: block;
    -webkit-filter: drop-shadow(0px 0px 10px rgba(255,255,255,0.80));
	-webkit-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	transition: all 0.5s linear;
    position: relative;
    z-index: 1;
    height: 250px;
    object-fit: scale-down;
    animation: animate 5s linear infinite;
}
.pricing-sec .glow:hover {
	-webkit-filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.8));
}
@keyframes animate {
  from {
    -webkit-filter: drop-shadow(0px 0px 5px rgba(255, 255, 255, 0.8));
  }
  to {
    -webkit-filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.8));
  }
}
.pricing-sec {
    margin: 30px 0 0;
}
.pricing-sec .card-border ul::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
	border-radius: 10px;
}
.pricing-sec .card-border ul::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}
.pricing-sec .card-border ul::-webkit-scrollbar-thumb
{
	border-radius: 0px;
	background-image: -webkit-gradient(linear,
    left bottom,
    left top,
    color-stop(0.70, #701753),
    color-stop(0.10, #000),
    color-stop(0.90, #9F3859));
}
.overflow-hide ul {
    overflow-y: hidden !important;
    height: 325px !important;
}
.mid {
    width: 33%;
    margin: 0 auto;
}
body .pricing-sec .card-border {
    border-radius: 20px;
    border: 1px solid #FFF;
    background: linear-gradient(295deg, #b364bea1, #d754614f) !important;
    backdrop-filter: blur(17px);
    padding: 100px 10px 30px;
    margin: -100px 0 0;
    min-height: 720px;
}
.pricing-sec .card-border h2 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialMedium";
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    text-transform: capitalize;
}
.pricing-sec .card-border p {
    color: #929292;
    text-align: center;
    font-family: 'Open Sans';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    margin: 20px 0 0;
}
.pricing-sec .card-border ul {
    padding: 0;
    overflow-y: scroll;
    height: 300px;
    width: 95%;
    margin: 30px auto 30px;
}
.pricing-sec .card-border ul li {
    list-style: none;
    color: #FFF;
    font-family: 'Open Sans';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    margin: 0 0 10px;
}
.pricing-sec .card-border ul li:before {
    content: "";
    background: url(../images/btn-arrow.png);
    display: inline-flex;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: contain;
    justify-content: center;
    margin-right: 10px;
    position: relative;
    align-items: center;
    top: -7px;
}
.pricing-sec .card-border h3 {
    color: #FFF;
    font-family: 'Open Sans';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    text-align: center;
    margin: 10px 0 0;
}
.pricing-sec .card-border h4 {
    text-align: center;
    font-family: "BaseNeueTrialBold";
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    text-transform: capitalize;
    background: var(--Linear, linear-gradient(180deg, #F8CEBF 29.46%, #FEA09D 62.08%, #D75461 92.08%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pricing-sec .card-border a.w-btn img {
    width: auto;
    padding: 0 5px;
    height: auto;
}
.pricing-sec .card-border a.w-btn {
    display: flex;
    align-items: center;
    border-radius: 50px;
    border: 1px solid var(--Linear, #CD7FEA);
    padding: 15px 15px;
    color: #fff;
    font-family: "Open Sans", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    text-decoration: none;
    justify-content: center;
    width: 55%;
    margin: 30px auto 0;
    background: rgba(255, 255, 255, 0.20);
    position: relative;
}
.pricing-sec .card-border a.w-btn:before {
    content: '';
    background: linear-gradient(45deg, #6b3b6d, #542840, #e57077, #7f3ee1, #5921c4, #581241, #9f3859, #5e1345, #000000);
    position: absolute;
    top: -2px;
    left:-2px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    animation: glowing 20s linear infinite;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    border-radius: 50px;
}
.pricing-sec .card-border a.w-btn:active {
    color: #000
}
.pricing-sec .card-border a.w-btn:active:after {
    background: transparent;
}
.pricing-sec .card-border a.w-btn:hover:before {
    opacity: 1;
}
.pricing-sec .card-border a.w-btn:after {
    z-index: -1;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111;
    left: 0;
    top: 0;
    border-radius: 50px;
}
@keyframes glowing {
    0% { background-position: 0 0; }
    50% { background-position: 400% 0; }
    100% { background-position: 0 0; }
}
.pricing-sec:hover {
    transform: scale(0.9);
    transition: all 0.4s;
}
.pricing-row .Tabs {
    margin: 30px 0 0;
}
.pricing-row .Tabs div#nav-tab {
    justify-content: center;
    border: none;
    margin: 0 !important;
}
.pricing-row .Tabs .nav-tabs .nav-link.active {
    color: #000;
    font-family: 'Open Sans';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    padding: 10px 30px;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to right, #ffffffbd, #cd7fea) border-box;
    border-radius: 50em;
    border: 4px solid transparent;
}
.pricing-row .Tabs .nav-tabs .nav-link {
    color: #FFF;
    font-family: 'Open Sans';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    padding: 10px 30px;
    border-radius: 50em;
    border: 2px solid var(--Linear, #60436a);
    margin: 0 20px 20px;
}

/* TESTIMONIAL */

.testimonial-row {
    padding: 0 165px 100px;
}
.testimonial-row .w-head h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; 
    text-transform: uppercase;
}
.testimonial-row .w-head h2 span {
    background: var(--Linear, linear-gradient(180deg, #F8CEBF 29.46%, #FEA09D 62.08%, #D75461 92.08%));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.item .testi-sec {
    width: 95%;
    margin: 0 auto;
}
.testi-sec .testi-cont img {
    width: 15%;
    margin-right: 50px;
    object-fit: contain;
}
.testi-sec .testi-cont h2 {
    display: flex;
    color: #FFF;
    font-family: "BaseNeueTrialLight";
    font-size: 45px;
    font-style: normal;
    font-weight: 900;
    line-height: 120%;
    text-transform: capitalize;
    align-items: self-start;
}
.testimonial-row .home-demo {
    margin: 70px 0 0;
}
.testimonial-row .testi-sec svg {
    position: relative;
    margin: -46px 0 0;
    width: 100%;
}
.slick-carousel {
    display: none;
}
.testimonial-row .testi-sec .testi-cont {
    padding: 50px 20px 50px;
    background: linear-gradient(180deg, rgba(35, 35, 35, 0.00) 0%, rgba(37, 37, 37, 0.40) 92.53%);
    backdrop-filter: blur(17px);
    clip-path: polygon(100% 0%, 100% 0, 100% 86%, 37% 87%, 24% 100%, 24% 87%, 0 87%, 0 53%, 0 0);
}
.testi-sec .testi-cont p {
    color: #FFF;
    font-family: 'Open Sans';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    padding: 20px 0 30px;
    min-height: 160px;
}
.testi-sec .client {
    display: flex;
    align-items: center;
    padding: 0 0 0 80px;
}
.testi-sec .client img {
    width: 15%;
}
.testi-sec .client ul {
    margin: 0;
    padding: 0 0 0 20px;
}
.testi-sec .client ul li {
    list-style: none;
    color: #FFF;
    font-family: 'Open Sans';
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
}
.testi-sec .client ul li strong {
    color: #FFF;
    font-family: "BaseNeueTrialLight";
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    text-transform: capitalize;
}
.testimonial-row .testi-sec svg path:before {
    width: 200px;
    height: 200px;
    display: block;
    position: absolute;
    top: 0;
    z-index: 9999;
    bottom: 0;
    color: #fff;
    background: #fff;
}
.testimonial-row .owl-dots {
    display: none;
}
.testimonial-row  .owl-nav {
    position: absolute;
    top: -200px;
    right: 100px;
}
.testimonial-row .owl-nav button.owl-prev {
    background: transparent !important;
    margin-right: 30px;
}
.testimonial-row .owl-nav button.owl-prev span {
    font-size: 0;
    position: relative;
}
.testimonial-row .owl-nav button.owl-prev span:before {
    content: url("../images/client-arrow-right.png");
}
.testimonial-row .owl-nav button.owl-next {
    background: transparent !important;
}
.testimonial-row .owl-nav button.owl-next span {
    font-size: 0;
    position: relative;
}
.testimonial-row .owl-nav button.owl-next span:before {
    content: url("../images/client-arrow-left.png");
}

/* CONTACT */

.contact-row .contact-sec form button:hover img {transform: none;animation: none;}
.contact-row .contact-sec form select:focus-visible, .contact-row .contact-sec form select:focus {
    outline: none;
    box-shadow: none;
}
.contact-row .contact-sec form textarea:focus-visible, .contact-row .contact-sec form textarea:focus {
    outline: none;
    box-shadow: none;
}
.contact-row {
    padding: 100px 100px 100px;
    margin: 0 auto;
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0.80);
    backdrop-filter: blur(27px);
    position: relative;
    z-index: 1;
    background-image: url("../images/ida-bg.png");
    width: 90%;
    background-size: cover;
    background-repeat: no-repeat;
}
.contact-row .w-head h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 120px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
}
.contact-row .w-head h2 span {
    background: var(--Linear, linear-gradient(180deg, #F8CEBF 29.46%, #FEA09D 62.08%, #D75461 92.08%));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.contact-row .w-head p {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; 
    text-transform: capitalize;
    width: 90%;
}
.contact-row .nav-link {
    transform: scale(0.8);
    background: transparent;
    border: none !important;
}
.contact-row div#nav-tab {
    border: none;
    margin: 30px 0 30px !important;
}
.contact-row .nav-link.active {
    background: transparent !important;
    transform: scale(1.1);
    border: none;
}
.contact-row .contact-info ul {
    margin: 0;
    padding: 0 0 0 15px;
}
.contact-row .contact-info ul li {
    list-style: none;
    padding: 0;
    display: flex;
    align-items: center;
    margin: 0 0 20px;
}
.contact-row .contact-info ul li a {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: unset;
    text-decoration: none;
    width: 50%;
}
.contact-row .contact-info ul li img {
    margin-right: 20px;
}
.contact-row .contact-sec img {
    margin: 0 auto 50px;
    display: block;
}
.contact-row .contact-sec:hover img {
    transform: rotateY(45deg);
    animation: rotateAnimation 10s linear infinite;
}
.contact-row .contact-sec form input {
    border: none;
    background: transparent;
    border-bottom: 2px solid #fff;
    border-radius: 0;
    margin: 0 0 50px;
    color: #fff;
}
.contact-row .contact-sec form input::placeholder {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
}
.contact-row .contact-sec form select {
    background: transparent;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    border: none;
    border-bottom: 2px solid;
    border-radius: 0;
}
.contact-row .contact-sec form textarea {
    background: transparent;
    border: none;
    border-bottom: 2px solid #fff;
    border-radius: 0;
    padding: 60px 0 0px;
    color: #fff;
}
.contact-row .contact-sec form textarea::placeholder 
{
    color: #FFF;
    font-family: "Open Sans";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
}
.contact-row .contact-sec form input:focus-visible {
    box-shadow: none !important;
    isolation:unset;
}
.contact-row .contact-sec form select option {
    color: #fff !important;
    background: #000 !important;
}
.contact-row .contact-sec form button {
    display: flex;
    align-items: center;
    border-radius: 50px;
    border: 1px solid var(--Linear, #CD7FEA);
    background: rgba(255, 255, 255, 0.20);
    backdrop-filter: blur(17px);
    padding: 15px 30px;
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    margin: 40px 0 0;
}
.contact-row .contact-sec form button img {
    margin: 0 10px 0 0;
}
.contact-row .contact-sec form button:hover {
    transform: translateY(-10px);
    transition: all ease 0.4s;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}

/* FOOTER-BG */

/* .footer-after-row {
    background: url(../images/footer-up-bg.png);
    padding: 300px 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
} */

.footer-after-row {
    margin-top: -350px;
    z-index: 0;
    position: relative;
}
.footer-after-row .container-fluid {
    padding: 0;
}

/* FOOTER */

.footer-row {
    padding: 100px 100px 20px;
    background: #000;
    margin-top: -10px;
}
.footer-row .footer-sec p {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
}
.footer-row .footer-sec a img {
    margin: 0 0 20px;
    width: 30%;
}
.footer-row .footer-sec h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 45px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    text-transform: capitalize;
    margin: 0 0 20px;
}
.footer-row .footer-sec ul {
    padding: 0;
    margin: 0;
}
.footer-row .footer-sec ul li {
    list-style: none;
    margin: 0 0 20px;
}
.footer-row .footer-sec ul li a {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; 
    text-transform: capitalize;
    text-decoration: none;
}
.footer-row .col-lg-3:nth-child(2) {
    padding-left: 150px;
}
.footer-row .footer-sec form input {
    border-radius: 50px;
    border: 2px solid var(--Linear, #CD7FEA);
    background: transparent;
    padding: 15px 10px;
    color: #fff;
}
.footer-row .footer-sec form input::placeholder {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; 
    text-transform: capitalize;
}
.footer-row .footer-sec form {
    display: flex;
    align-items: center;
    position: relative;
    margin: 20px 0 0;
}
.footer-row .footer-sec form button {
    background: transparent;
    border: none;
    box-shadow: none;
    position: absolute;
    right: 0;
}
.footer-row .footer-sec form button img {
    width: 50%;
}
.footer-row .footer-sec form button img:hover {
    transform: translate(8px, -1px);
    transition: all ease 0.4s;
}
.footer-row .footer-sec ul.icons-lists {
    display: flex;
    align-items: center;
    margin: 20px 0 0 10px;
    padding: 0;
}
.footer-row .footer-sec ul.icons-lists li {
    list-style: none;
    margin: 0 20px 0 0;
}
.footer-row .footer-sec ul.icons-lists li img {
    width: 95%;
    margin: 0;
}

/* COPYRIGHT */

.copyright-row {
    padding: 20px 0 20px !important;
    background: #000;
    border-top: 2px solid #fff;
}
.copyright-row .w-head p {
    margin: 0;
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; 
    text-transform: capitalize;
}

/* SCROLL UP */

button#top-scroll {
    display: inline-flex;
    position: fixed;
    background: transparent;
    border: none;
    bottom: 140px;
    right: -30px;
    opacity: 0;
    visibility: hidden;
}
button#top-scroll img {
    width: 60%;
    transition: all 0.4s;
}
button#top-scroll img:hover {
    transform: rotate(360deg);
    transition: all 0.4s;
}
button#top-scroll.show {
  opacity: 1;
  visibility: visible;
}


/* INNER */


.inner-banner-row {
    width: 100%;
    padding: 300px 0 0;
}
.inner-banner-row .banner-sec .w-head h2 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; 
    text-transform: uppercase;
}
.inner-video-row video {
    height: 500px;
    object-fit: cover;
}
.about-row .w-head h2 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    padding: 0 0 20px;
}
.about-row .w-head h2 span {
    background: linear-gradient(180deg, #F8CEBF 33.44%, #FEA09D 63.99%, #D75461 92.08%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.about-row .w-head p {
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    width: 85%;
    margin: 0 auto;
    padding: 0px 0 20px;
}
.about-row .w-head img {
    width: 100%;
}
.about-row {
    padding: 100px 0 0;
    margin: -10px 0 0;
}
.story-row {
    padding: 0 0 100px;
}
.story-row .w-head h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 100px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    text-align: center;
}
.story-row .w-head p {
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    width: 60%;
    margin: 0 auto 50px;
}
.story-row .w-head video {
    width: 50%;
    margin: 0 auto;
    border-radius: 20px;
}
.inner-service {
    margin-top: -10px;
    padding: 100px 0;
}
.inner-service .w-head h2 {
    text-align: center;
    width: 100%;
}
.inner-service .w-head p {
    width: 100%;
    text-align: center;
}
.inner-port {
    margin-top: -10px;
    padding: 100px 0;
}
.inner-port span {
    background: var(--Linear, linear-gradient(180deg, #F8CEBF 29.46%, #FEA09D 62.08%, #D75461 92.08%));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.inner-port p {
    color: #FFF;
    text-align: center;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; 
    text-transform: capitalize;
}
.contact-inner {
    margin-top: -10px;
    padding: 100px 0;
}
.service-content .inner-content img {
    width: 100%;
}
.service-content .inner-content h2 {
    font-family: "BaseNeueTrialBold";
    font-size: 70px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 100px */
    text-transform: uppercase;
    background: linear-gradient(180deg, #F8CEBF 29.46%, #FEA09D 62.08%, #D75461 92.08%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0 0 50px;
}
.service-content .inner-content p {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    width: 80%;
    margin: 0 0 20px;
}
.service-content .inner-content .main-flex {
    display: flex;
    align-items: center;
}
.service-content .inner-content .main-flex .inner-cont .w-head h3 {
    color: #FFF;
    font-family: "BaseNeueTrialMedium";
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
}
.service-content .inner-content .main-flex .inner-cont .w-head {
    margin: 50px 0;
}

/* PRODUCTS */

.product-row .bg-white {
    background: url(../images/project-img1.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.product-row .products ul {
    margin: 0;
    padding: 0;
}
.product-row .products ul li {
    list-style: none;
}
.product-row .products ul li h3 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialLight";
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
}
.product-row .products ul li h2 {
    color: #FFF;
    font-family: "BaseNeueTrialBold";
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: capitalize;
    margin: 10px 0 0;
    text-align: center;
}
.product-row .bg-purple-900 {
    background: url("../images/product-bg.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
}
.workit-row .workit h2 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialBold";
    font-size: 280px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    background: linear-gradient(180deg, #F8CEBF 68.2%, #FEA09D 80.64%, #D75461 92.08%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.workit-row.bg-purple-800 {
    background: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

/* APP */

.app-order {
    border: 1px solid #5e115d4d;
    border-radius: 20px;
    margin: 30px 0 0;
    text-align: center;
    background: linear-gradient(180deg, #701753 0%, #000 60%, #9F3858 100%, rgba(0, 0, 0, 0.00) 100%);
    padding: 10px 0;
}
.app-order h3 {
    font-weight: 600;
    margin: 0 0 20px;
    color: #fff;
    font-family: 'BaseNeueTrialBold';
    font-size: 30px;
}
.app-order-cntc h4 {
    color: #fff;
    font-family: 'BaseNeueTrialBold';
    font-size: 20px;
}
.app-order a.w-btn img {
    width: auto;
    padding: 0 5px;
}
.app-order a.w-btn {
    display: inline-flex;
    align-items: center;
    border-radius: 50px;
    border: 1px solid var(--Linear, #CD7FEA);
    background: #FFF;
    padding: 15px 15px;
    color: #000;
    font-family: "Open Sans", sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    text-decoration: none;
    margin: 20px 0 0;
}
.app-order a.w-btn:hover {
    transform: translateY(-10px);
    transition: all ease 0.4s;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}
.app-screen {
    padding: 10px 20px;
    border-radius: 10px;
    width: 60%;
    margin: 0 auto;
    display: block;
}
.app-order h3 span {
    display: block;
}
.app-order-flx {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    margin: 0 auto;
}
.app-order-blk {
    width: 27%;
}
.app-order-cntc {
    text-align: right;
}
.app-order-cntc a.w-btn {
    margin: 20px auto 0;
    margin-right: 0;
}
.app-order-cntc a.w-btn img {
    width: 40%;
}
.app-order-blk a.w-btn {
    margin: 20px auto 0;
    display: flex;
    width: 80%;
    margin-left: 0;
}



.workit  span {
      display: inline-block;
  }
  
  .workit .animate span:nth-of-type(2) {
      animation-delay: .05s;
  }
  .workit .animate span:nth-of-type(3) {
      animation-delay: .1s;
  }
  .workit .animate span:nth-of-type(4) {
      animation-delay: .15s;
      margin-left: 50px;
  }
  .workit .animate span:nth-of-type(5) {
      animation-delay: .2s;
      margin-right: 50px;
  }
  .workit .animate span:nth-of-type(6) {
      animation-delay: .25s;
  }
  .workit .animate span:nth-of-type(7) {
      animation-delay: .3s;
  }
  .workit .animate span:nth-of-type(8) {
      animation-delay: .35s;
  }
  .workit .animate span:nth-of-type(9) {
      animation-delay: .4s;
  }
  .workit .animate span:nth-of-type(10) {
      animation-delay: .45s;
  }
  .workit .animate span:nth-of-type(11) {
      animation-delay: .5s;
  }
  .workit .animate span:nth-of-type(12) {
      animation-delay: .55s;
  }
  .workit .animate span:nth-of-type(13) {
      animation-delay: .6s;
  }
  .workit .animate span:nth-of-type(14) {
      animation-delay: .65s;
  }
  .workit .animate span:nth-of-type(15) {
      animation-delay: .7s;
  }
  .workit .animate span:nth-of-type(16) {
      animation-delay: .75s;
  }
  .workit .animate span:nth-of-type(17) {
      animation-delay: .8s;
  }
  .workit .animate span:nth-of-type(18) {
      animation-delay: .85s;
  }
  .workit .animate span:nth-of-type(19) {
      animation-delay: .9s;
  }
  .workit .animate span:nth-of-type(20) {
      animation-delay: .95s;
  }
  
  
  /* Animation Seven */


  .workit .seven span {
	opacity: 0;
	transform: translate(-150px, 0) scale(.3);
	animation: leftRight .5s forwards;
	color: #FFF;
	text-align: center;
	font-family: "BaseNeueTrialBold";
	font-size: 220px;
	font-style: normal;
	font-weight: 700;
	line-height: 100%; /* 100px */
	text-transform: uppercase;
	margin: 0 10px;
	background: linear-gradient(180deg, #F8CEBF 68.2%, #FEA09D 80.64%, #D75461 92.08%);
	background-clip: text;
	-webkit-text-fill-color: transparent;
}


@keyframes leftRight {
	40% {
		transform: translate(50px, 0) scale(.7);
		opacity: 1;
		color: #D75461;
	}

	60% {
		color: #FEA09D;
	}

	80% {
		transform: translate(0) scale(2);
		opacity: 0;
	}

	100% {
		transform: translate(0) scale(1);
		opacity: 1;
	}
}
.modal-content {background: linear-gradient(180deg, #701753 0%, #000 60%, #9F3858 100%, rgba(0, 0, 0, 0.00) 100%);padding: 10px 0;}
.modal-content button {
    display: table;
    margin: 0 auto;
    margin-right: 10px;
}
.modal-content form select#services {
    height: 50px;
    border-radius: 20px;
    margin: 20px 0 20px;
    color: #000;
}
.modal-content form textarea:focus-visible, .modal-content form input:focus-visible, .modal-content form select:focus-visible {
    outline: unset;
}
.modal-content form textarea:focus, .modal-content form input:focus, .modal-content form select:focus {
    border: none;
}
.modal-content h6 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialMedium";
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 50px; 
    text-transform: uppercase;
}
.modal-content h3 {
    color: #FFF;
    text-align: center;
    font-family: "BaseNeueTrialLight";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px; 
    text-transform: uppercase;
}
.modal-content form input {
    height: 50px;
    border-radius: 20px;
    margin: 20px 0 20px;
    color: #000;
}
.modal-content form textarea {
    width: 100%;
    border-radius: 20px;
    height: 110px;
    padding: 10px;
    color: #000;
}
.modal-content form button#submit {
    margin-right: auto;
    margin: 40px auto 30px;
    border-radius: 50px;
    border: 1px solid var(--Linear, #CD7FEA);
    background: rgba(255, 255, 255, 0.20);
    backdrop-filter: blur(17px);
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    text-transform: capitalize;
    padding: 15px 40px;
}

/*Trust pilot*/

.trustpilot-widget {
  background: transparent;
  color: #333;
  padding: 30px 0 25px 0;
  overflow: hidden;
}
.trustpilot-widget .wrapper-left a {
  color: #333;
  font-weight: 600;
  text-decoration: underline;
}
.trustpilot-widget .wrapper-left {
  text-align: center;
}
.trustpilot-widget .wrapper-left .title {
  color: #333;
  font-size: 24px;
  padding: 0;
  margin: 0;
  margin-bottom: 10px;
}
.trustpilot-widget .wrapper-left .rating img {
  max-width: 160px;
  margin: auto;
}
.trustpilot-widget .wrapper-left .info {
  color: #333;
  font-size: 13px;
  line-height: 45px;
}
.trustpilot-widget .wrapper-left .brand-logo img {
  max-width: 25px;
  margin: auto;
  margin-top: -10px;
  display: inline-block;
}
.trustpilot-widget .wrapper-left .brand-logo p {
  font-size: 18px;
  line-height: 35px;
  color: #333;
  text-align: center;
  display: inline-block;
}
.trustpilot-widget .reviews {
  margin-left: 2%
}
/* The controlsy */
.trustpilot-widget .carousel-control {
    height: 25px;
    width: 25px;
    border: 1px solid #9E9E9E;
    border-radius: 50%;
    margin-top: 60px;
    font-size: 25px;
    background: transparent;
    line-height: 18px;
}
.trustpilot-widget .carousel-control.right {
  margin-right: -50px;
  color: #333;
  text-shadow: none;
}
.trustpilot-widget .carousel-control.left {
  left: -70px;
  color: #333;
  text-shadow: none;
}
.trustpilot-widget .carousel-control.right:hover, .trustpilot-widget .carousel-control.left:hover {
    color: #333;
}
.trustpilot-widget .carousel-inner .rating img {
  max-width: 110px
}
.trustpilot-widget .carousel-inner {
    overflow: hidden
}
.trustpilot-widget .carousel-inner .date, .trustpilot-widget .carousel-inner .name {
  color: rgba(0,0,0,0.6);
  font-size: 13px;
}
.trustpilot-widget .carousel-inner .title {
  margin: 15px 0 10px 0;
  font-weight: 700;
  text-overflow: ellipsis;
  overflow: hidden; 
  width: 100%; 
  white-space: nowrap; 
}
.trustpilot-widget .carousel-inner .descriptions {
    min-height: 42px;
}
.trustpilot-widget .carousel-inner .name {
  margin-top: 25px
}
.service-content .flex-ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.service-content .flex-ul .inner-flex-ul strong {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    text-transform: uppercase;
}
.service-content .flex-ul .inner-flex-ul li {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    width: 80%;
    margin: 0 0 10px;
}
.service-content .flex-ul2 strong {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    text-transform: uppercase;
}
.service-content .flex-ul2 li {
    color: #FFF;
    font-family: "Open Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    text-transform: capitalize;
    width: 80%;
    margin: 0 0 10px;
}



/*VIDEO*/

.video-js .vjs-big-play-button:before,
.video-js .vjs-control:before,
.video-js .vjs-modal-dialog,
.vjs-modal-dialog .vjs-modal-dialog-content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-family: "Ionicons", "Questrial" !important;
	cursor: pointer;
}

.video-js .vjs-big-play-button:before,
.video-js .vjs-control:before {
	text-align: center;
}

.vjs-icon-play:before,
.video-js .vjs-big-play-button:before,
.video-js .vjs-play-control:before {
	content: "\f488";
}

.vjs-icon-play-circle:before {
	content: "\f488";
}

.vjs-icon-pause:before,
.video-js .vjs-play-control.vjs-playing:before {
	content: "\f478";
}

.vjs-icon-volume-mute:before,
.video-js .vjs-mute-control.vjs-vol-0:before,
.video-js .vjs-volume-menu-button.vjs-vol-0:before {
	content: "\f3b8";
}

.vjs-icon-volume-low:before,
.video-js .vjs-mute-control.vjs-vol-1:before,
.video-js .vjs-volume-menu-button.vjs-vol-1:before {
	content: "\f258";
}

.vjs-icon-volume-mid:before,
.video-js .vjs-mute-control.vjs-vol-2:before,
.video-js .vjs-volume-menu-button.vjs-vol-2:before {
	content: "\f259";
}

.vjs-icon-volume-high:before,
.video-js .vjs-mute-control:before,
.video-js .vjs-volume-menu-button:before {
	content: "\f257";
}

.vjs-icon-fullscreen-enter:before,
.video-js .vjs-fullscreen-control:before {
	content: "\f3d8";
}

.vjs-icon-fullscreen-exit:before,
.video-js.vjs-fullscreen .vjs-fullscreen-control:before {
	content: "\f3d0";
}

.vjs-icon-square:before {
	content: "\f371";
}

.vjs-icon-spinner:before {
	content: "\f29c";
}

.vjs-icon-subtitles:before,
.video-js .vjs-subtitles-button:before {
	content: "\f3fa";
}

.vjs-icon-captions:before,
.video-js .vjs-captions-button:before {
	content: "\f3fa";
}

.vjs-icon-chapters:before,
.video-js .vjs-chapters-button:before {
	content: "\f453";
}

.vjs-icon-share:before {
	content: "\f3ac";
}

.vjs-icon-cog:before {
	content: "\f43d";
}

.vjs-icon-circle:before,
.video-js .vjs-mouse-display:before,
.video-js .vjs-play-progress:before,
.video-js .vjs-volume-level:before {
	content: '';
}

.vjs-icon-circle-outline:before {
	content: "";
}

.vjs-icon-circle-inner-circle:before {
	content: "";
}

.vjs-icon-hd:before {
	content: "\f4cd";
}

.vjs-icon-cancel:before,
.video-js .vjs-control.vjs-close-button:before {
	content: "\f406";
}

.vjs-icon-replay:before {
	content: "\f49c";
}

.vjs-icon-facebook:before {
	content: "\f231";
}

.vjs-icon-gplus:before {
	content: "\f235";
}

.vjs-icon-linkedin:before {
	content: "";
}

.vjs-icon-twitter:before {
	content: "\f243";
}

.vjs-icon-tumblr:before {
	content: "\f241";
}

.vjs-icon-pinterest:before {
	content: "\f2b1";
}

.vjs-icon-audio-description:before {
	content: "";
}

.video-js {
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	vertical-align: top;
	box-sizing: border-box;
	color: #fff;
	background: #000;
	position: absolute;
	padding: 0;
	font-size: 10px;
	line-height: 1;
	font-weight: normal;
	font-style: normal;
	font-family: "Ionicons", "Questrial" !important;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	overflow: hidden;
}

.video-js:-moz-full-screen {
	position: absolute;
}

.video-js:-webkit-full-screen {
	width: 100% !important;
	height: 100% !important;
}

.video-js *,
.video-js *:before,
.video-js *:after {
	box-sizing: inherit;
}

.video-js ul {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	list-style-position: outside;
	margin-left: 0;
	margin-right: 0;
	margin-top: 0;
	margin-bottom: 0;
}

.video-js.vjs-fluid,
.video-js.vjs-16-9,
.video-js.vjs-4-3 {
	width: 100%;
	max-width: 100%;
	height: 0;
}

.video-js.vjs-16-9 {
	padding-top: 56.25%;
}

.video-js.vjs-4-3 {
	padding-top: 75%;
}

.video-js.vjs-fill {
	width: 100%;
	height: 100%;
}

.video-js .vjs-tech {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

body.vjs-full-window {
	padding: 0;
	margin: 0;
	height: 100%;
	overflow-y: auto;
}

.vjs-full-window .video-js.vjs-fullscreen {
	position: fixed;
	overflow: hidden;
	z-index: 1000;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
}

.video-js.vjs-fullscreen {
	width: 100% !important;
	height: 100% !important;
	padding-top: 0 !important;
}

.video-js.vjs-fullscreen.vjs-user-inactive, .vjs-user-inactive {
	cursor: none;
}

.vjs-hidden {
	display: none !important;
}

.video-js .vjs-offscreen {
	height: 1px;
	left: -9999px;
	position: absolute;
	top: 0;
	width: 1px;
}

.vjs-lock-showing {
	display: block !important;
	opacity: 1;
	visibility: visible;
}

.vjs-no-js {
	padding: 20px;
	color: #fff;
	background-color: #000;
	font-size: 18px;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	width: 300px;
	height: 150px;
	margin: 0px auto;
}

.vjs-no-js a,
.vjs-no-js a:visited {
	color: #66A8CC;
}

.video-js .vjs-big-play-button {
	font-size: 600%;
	line-height: 100px;
	height: 100px;
	width: 100px;
	display: block;
	position: absolute;
	text-indent: 5px;
	top: calc(50% - 50px);
	left: calc(50% - 50px);
	padding: 0;
	text-align: center;
	cursor: pointer;
	background: rgba(0,0,0,.15);
	color: #fff;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	outline: none;
	-webkit-backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);
	backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);
}
/*.video-js .vjs-big-play-button:after {
	content: 'Interstellar';
	font-family: 'Questrial';
	font-size: 35%;
	line-height: 38px;
	height: auto;
	width: auto;
	position: absolute;
	top: 5px;
	left: 100px;
	padding: 0 15px;
	text-align: center;
	background: #111;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1),0 2px 10px 0 rgba(0,0,0,0.1);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}*/

.vjs-controls-disabled .vjs-big-play-button,
.vjs-has-started .vjs-big-play-button,
.vjs-using-native-controls .vjs-big-play-button,
.vjs-error .vjs-big-play-button {
	display: none;
}

.video-js button {
	background: none;
	border: none;
	color: inherit;
	display: inline-block;
	overflow: visible;
	font-size: inherit;
	line-height: inherit;
	text-transform: none;
	text-decoration: none;
	transition: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.video-js .vjs-control.vjs-close-button {
	cursor: pointer;
	height: 3em;
	position: absolute;
	right: 0;
	top: 0.5em;
	z-index: 2;
}

.vjs-menu-button {
	cursor: pointer;
}

.vjs-menu .vjs-menu-content {
	display: block;
	padding: 0;
	margin: 0;
	overflow: auto;
}

.vjs-scrubbing .vjs-menu-button:hover .vjs-menu {
	display: none;
}

.vjs-menu li {
	list-style: none;
	margin: 2px 0px;
	padding: 8px 15px;
	font-size: 14px;
	text-align: center;
	text-transform: lowercase;
	color: rgba(255,255,255,.6);
	border-radius: 3px;
	transition: all .15s ease;
	outline: none;
}

.vjs-menu li:hover {
	color: rgba(255,255,255,.85);
	text-shadow: 0 0 3px rgba(255,255,255,.5);
}
.vjs-menu li:active {
	transform: scale(.9);
}

.vjs-menu li.vjs-selected,
.vjs-menu li.vjs-selected:focus,
.vjs-menu li.vjs-selected:hover {
	color: rgba(255,255,255,1);
	text-shadow: 0 0 15px rgba(0,0,0,.5);
	/*background: -webkit-linear-gradient(to top, #FF7539 0%, #FFAB00 100%);
    background: linear-gradient(to top, #FF7539 0%, #FFAB00 100%);*/
}

.vjs-menu li.vjs-menu-title {
	text-align: center;
	text-transform: uppercase;
	font-size: 1em;
	line-height: 2em;
	padding: 0;
	margin: 0 0 0.3em 0;
	font-weight: bold;
	cursor: default;
}

.vjs-menu-button-popup .vjs-menu {
	display: none;
	position: absolute;
	bottom: 0;
	width: 50px;
	left: -3em;
	height: 0em;
	margin-bottom: 1.5em;
	border-top-color: rgba(43, 51, 63, 0.7);
}

.vjs-menu-button-popup .vjs-menu .vjs-menu-content {
	display: block;
    padding: 5px;
	/*background: -webkit-linear-gradient(top, rgba(30,30,30,.9), rgba(10,10,10,.9));
    background: linear-gradient(to bottom , rgba(30,30,30,.9), rgba(10,10,10,.9));
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.05), 0 0 10px rgba(0,0,0,.3);*/
    border-radius: 3px;
    color: #fff;
    font-size: 100%;
    margin-bottom: 8px;
    -webkit-transition: all .15s;
    transition: all .15s;
	position: absolute;
	bottom: 15px;
	float: left;
}

.vjs-menu-button-popup:hover .vjs-menu,
.vjs-menu-button-popup .vjs-menu.vjs-lock-showing {
	display: block;
}

.video-js .vjs-menu-button-inline {
	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
	overflow: hidden;
}

.video-js .vjs-menu-button-inline:before {
	width: 2.222222222em;
}

.video-js .vjs-menu-button-inline:hover,
.video-js .vjs-menu-button-inline:focus,
.video-js .vjs-menu-button-inline.vjs-slider-active,
.video-js.vjs-no-flex .vjs-menu-button-inline {
	width: 10em;
}

.video-js .vjs-menu-button-inline.vjs-slider-active {
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
}

.vjs-menu-button-inline .vjs-menu {
	opacity: 0;
	height: 100%;
	width: auto;
	position: absolute;
	left: 4em;
	top: 0;
	padding: 0;
	margin: 0;
	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
}

.vjs-menu-button-inline:hover .vjs-menu,
.vjs-menu-button-inline:focus .vjs-menu,
.vjs-menu-button-inline.vjs-slider-active .vjs-menu {
	display: block;
	opacity: 1;
}

.vjs-no-flex .vjs-menu-button-inline .vjs-menu {
	display: block;
	opacity: 1;
	position: relative;
	width: auto;
}

.vjs-no-flex .vjs-menu-button-inline:hover .vjs-menu,
.vjs-no-flex .vjs-menu-button-inline:focus .vjs-menu,
.vjs-no-flex .vjs-menu-button-inline.vjs-slider-active .vjs-menu {
	width: auto;
}

.vjs-menu-button-inline .vjs-menu-content {
	width: auto;
	height: 100%;
	margin: 0;
	overflow: hidden;
}

.video-js .vjs-control-bar {
	display: none;
	width: 700px;
	position: absolute;
	bottom: 20px;
	left: calc( 50% - 350px );
	height: 50px;
	border-radius: 5px;
	background: rgba(0,0,0,.6);
	-webkit-backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);
	backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);
}

@media screen and (max-width: 740px) {
.video-js .vjs-control-bar {
	width: calc( 100% - 40px );
	bottom: 20px;
	left: 20px;
}
}

.vjs-has-started .vjs-control-bar {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	visibility: visible;
	opacity: 1;
	transform-origin: center bottom;
	transition: all .15s cubic-bezier(.44,.14,.34,.97), width 0s, left 0s;
}

.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
	visibility: hidden;
	opacity: 0;
	bottom: 5px;
	transition: .15s cubic-bezier(.44,.14,.34,.97);
}

.vjs-controls-disabled .vjs-control-bar,
.vjs-using-native-controls .vjs-control-bar,
.vjs-error .vjs-control-bar {
	display: none !important;
}

.vjs-audio.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
	opacity: 1;
	visibility: visible;
}

@media screen {
	.vjs-user-inactive.vjs-playing .vjs-control-bar:before {
		content: "";
	}
}

.vjs-has-started.vjs-no-flex .vjs-control-bar {
	display: table;
}

.video-js .vjs-control {
	outline: none;
	position: relative;
	text-align: center;
	margin: 0;
	padding: 0;
	height: 100%;
	width: 50px;
	font-size: 120%;
	-webkit-box-flex: none;
	-moz-box-flex: none;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
}

.video-js .vjs-control:before {
	font-size: 200%;
	line-height: 50px;
	color: #fff;
}

.video-js .vjs-control-text {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	visibility: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.vjs-no-flex .vjs-control {
	display: table-cell;
	vertical-align: middle;
}

.video-js .vjs-custom-control-spacer {
	display: none;
}

.video-js .vjs-progress-control {
	-webkit-box-flex: auto;
	-moz-box-flex: auto;
	-webkit-flex: auto;
	-ms-flex: auto;
	flex: auto;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}

.vjs-live .vjs-progress-control {
	display: none;
}

.video-js .vjs-progress-holder {
	-webkit-box-flex: auto;
	-moz-box-flex: auto;
	-webkit-flex: auto;
	-ms-flex: auto;
	flex: auto;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
	height: 5px;
	border-radius: 5px;
}

.video-js .vjs-progress-control:hover .vjs-mouse-display:after,
.video-js .vjs-progress-control:hover .vjs-play-progress:after {
	display: block;
	font-size: 120%;
}

.video-js .vjs-progress-holder .vjs-play-progress,
.video-js .vjs-progress-holder .vjs-load-progress,
.video-js .vjs-progress-holder .vjs-load-progress div {
	position: absolute;
	display: block;
	height: 5px;
	margin: 0;
	padding: 0;
	width: 0;
	left: 0;
	top: 0;
	border-radius: 5px;
}

.video-js .vjs-mouse-display:before {
	display: none;
}

.video-js .vjs-play-progress {
	background: #FFF;
	border-radius: 10px;
	transition: all .25s linear;
}

.video-js .vjs-mouse-display:after,
.video-js .vjs-play-progress:after {
	display: none;
	position: absolute;
	top: -28px;
	right: 0;
	font-size: 12px !important;
	color: transparent;
	content: attr(data-current-time);
	padding: 8px;
	pointer-events: none;
	transition: .2s ease;
}

.video-js .vjs-play-progress:before,
.video-js .vjs-play-progress:after {
	z-index: 10;
}

.video-js .vjs-load-progress {
	background: rgba(255,255,255,.3);
	transition: width .25s linear;
}

.video-js .vjs-load-progress div {
	background: rgba(0,0,0,.2);
}

.video-js.vjs-no-flex .vjs-progress-control {
	width: auto;
}

.video-js .vjs-progress-control .vjs-mouse-display {
	position: absolute;
}

.vjs-no-flex .vjs-progress-control .vjs-mouse-display {
	z-index: 0;
}

.video-js .vjs-progress-control:hover .vjs-mouse-display {
	display: block;
}

.video-js.vjs-user-inactive .vjs-progress-control .vjs-mouse-display,
.video-js.vjs-user-inactive .vjs-progress-control .vjs-mouse-display:after {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: visibility 1s, opacity 1s;
	-moz-transition: visibility 1s, opacity 1s;
	-o-transition: visibility 1s, opacity 1s;
	transition: visibility 1s, opacity 1s;
}

.video-js.vjs-user-inactive.vjs-no-flex .vjs-progress-control .vjs-mouse-display,
.video-js.vjs-user-inactive.vjs-no-flex .vjs-progress-control .vjs-mouse-display:after {
	display: none;
}

.video-js .vjs-progress-control .vjs-mouse-display:after {
	color: #999;
	background: #222;
    border-radius: 5px 5px 0px 5px;
	visibility: visible;
}

.video-js .vjs-slider {
	outline: 0;
	position: relative;
	cursor: pointer;
	padding: 0;
	margin: 0 0.45em 0 0.45em;
	background: rgba(255,255,255,.15);
}

.video-js .vjs-mute-control, .video-js .vjs-volume-menu-button {
	cursor: pointer;
	-webkit-box-flex: none;
	-moz-box-flex: none;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
}

.video-js .vjs-volume-control {
	width: 5em;
	-webkit-box-flex: none;
	-moz-box-flex: none;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}

.video-js .vjs-volume-bar {
	margin: 1.35em 0.45em;
	top: 9px;
	border-radius: 5px;
}

.vjs-volume-bar.vjs-slider-horizontal {
	width: 50px;
	height: 5px;
	border-radius: 5px;
}

.vjs-volume-bar.vjs-slider-vertical {
	width: 5px;
	height: 50px;
	margin: 1.35em auto;
	border-radius: 5px;
}

.video-js .vjs-volume-level {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #FFF;
	border-radius: 5px;
	transition: all 0s;
}

/*.video-js .vjs-volume-level:before {
	content: '';
	position: absolute;
	width: 9px;
	height: 9px;
	bottom: -2px;
	right: -6px;
	background: #fff;
	border-radius: 50px;
}*/

.vjs-slider-vertical .vjs-volume-level {
	width: 5px;
}

.vjs-slider-vertical .vjs-volume-level:before {
	top: -0.5em;
	left: -0.3em;
}

.vjs-slider-horizontal .vjs-volume-level {
	height: 5px;
}

.vjs-slider-horizontal .vjs-volume-level:before {
	top: -2px;
	right: -0.5em;
}

.vjs-volume-bar.vjs-slider-vertical .vjs-volume-level {
	height: 100%;
}

.vjs-volume-bar.vjs-slider-horizontal .vjs-volume-level {
	width: 100%;
}

.vjs-menu-button-popup.vjs-volume-menu-button .vjs-menu {
	display: block;
	width: 0;
	height: 0;
	border-top-color: transparent;
}

.vjs-menu-button-popup.vjs-volume-menu-button-vertical .vjs-menu {
	left: 0.5em;
	height: 8em;
}

.vjs-menu-button-popup.vjs-volume-menu-button-horizontal .vjs-menu {
	left: -2em;
}

.vjs-menu-button-popup.vjs-volume-menu-button .vjs-menu-content {
	height: 0;
	width: 0;
	overflow-x: hidden;
	overflow-y: hidden;
}

.vjs-volume-menu-button-vertical:hover .vjs-menu-content,
.vjs-volume-menu-button-vertical .vjs-lock-showing .vjs-menu-content {
	height: 50px;
	width: 85px;
}

.vjs-volume-menu-button-horizontal:hover .vjs-menu-content,
.vjs-volume-menu-button-horizontal .vjs-lock-showing .vjs-menu-content {
	height: 50px;
	width: 60px;
}

.vjs-volume-menu-button.vjs-menu-button-inline .vjs-menu-content {
	background-color: transparent !important;
}

.vjs-poster {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  cursor: pointer;
  height: 100%;
  margin: 0;
  padding: 0;
  position: relative;
  width: 100%;
}
.vjs-poster img {
  display: block;
  margin: 0 auto;
  max-height: 100%;
  padding: 0;
  width: 100%;
}

.vjs-has-started .vjs-poster {
	visibility: hidden;
	opacity: 0;
}

.vjs-audio.vjs-has-started .vjs-poster {
	visibility: visible;
}

.vjs-controls-disabled .vjs-poster {
	visibility: hidden;
	display: none;
}

.vjs-using-native-controls .vjs-poster {
	visibility: hidden;
	display: none;
}

.video-js .vjs-live-control {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: flex-start;
	-webkit-align-items: flex-start;
	-ms-flex-align: flex-start;
	align-items: flex-start;
	-webkit-box-flex: auto;
	-moz-box-flex: auto;
	-webkit-flex: auto;
	-ms-flex: auto;
	flex: auto;
	font-size: 1em;
	line-height: 3em;
}

.vjs-no-flex .vjs-live-control {
	display: table-cell;
	width: auto;
	text-align: left;
}

.video-js .vjs-time-control {
	-webkit-box-flex: none;
	-moz-box-flex: none;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
	font-size: 100%;
	line-height: 50px;
	color: rgba(255,255,255,.8);
}

.vjs-live .vjs-time-control {
	display: none;
}

.video-js .vjs-current-time,
.vjs-no-flex .vjs-current-time {
	display: block;
}

.video-js .vjs-duration,
.vjs-no-flex .vjs-duration {
	display: block;
}
.vjs-duration.vjs-control, .vjs-current-time.vjs-control {
	width: auto !important;
	padding: 0 10px;
}

.vjs-time-divider {
	line-height: 50px;
	width: 2px;
	transform: translateX(-2px);
}
.vjs-time-divider div span {
	font-size: 150%;
	color: rgba(255,255,255,.8);
}

.vjs-live .vjs-time-divider {
	display: none;
}

.video-js .vjs-play-control {
	cursor: pointer;
	-webkit-box-flex: none;
	-moz-box-flex: none;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
}
.video-js .vjs-play-control:after {
	content: 'Play/Pause';
	position: absolute;
	top: -40px;
	left: 0px;
	width: auto;
	height: auto;
	background: #111;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1),0 2px 10px 0 rgba(0,0,0,0.1);
	border-radius: 5px;
	color: #ddd;
	text-align: center;
	letter-spacing: 1px;
	padding: 10px 15px;
	pointer-events: none;
	opacity: 0;
	transition: .2s ease;
	transition-delay: 0s;
}
.video-js .vjs-play-control:hover:after {
	opacity: 1;
	transition-delay: 1.3s;
}

.vjs-text-track-display {
	position: absolute;
	bottom: 3em;
	left: 0;
	right: 0;
	top: 0;
	pointer-events: none;
}

.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
	bottom: 1em;
}

.video-js .vjs-text-track {
	font-size: 1.4em;
	text-align: center;
	margin-bottom: 0.1em;
	background-color: #000;
	background-color: rgba(0, 0, 0, 0.5);
}

.vjs-subtitles {
	color: #fff;
}

.vjs-captions {
	color: #fc6;
}

.vjs-tt-cue {
	display: block;
}

video::-webkit-media-text-track-display {
	-moz-transform: translateY(-3em);
	-ms-transform: translateY(-3em);
	-o-transform: translateY(-3em);
	-webkit-transform: translateY(-3em);
	transform: translateY(-3em);
}

.video-js.vjs-user-inactive.vjs-playing video::-webkit-media-text-track-display {
	-moz-transform: translateY(-1.5em);
	-ms-transform: translateY(-1.5em);
	-o-transform: translateY(-1.5em);
	-webkit-transform: translateY(-1.5em);
	transform: translateY(-1.5em);
}

.video-js .vjs-fullscreen-control {
	cursor: pointer;
	-webkit-box-flex: none;
	-moz-box-flex: none;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
}
.video-js .vjs-fullscreen-control:after {
	content: 'Fullscreen';
	position: absolute;
	top: -40px;
	right: 0px;
	width: auto;
	height: auto;
	background: #111;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1),0 2px 10px 0 rgba(0,0,0,0.1);
	border-radius: 5px;
	color: #ddd;
	text-align: center;
	letter-spacing: 1px;
	padding: 10px 15px;
	pointer-events: none;
	opacity: 0;
	transition: .2s ease;
	transition-delay: 0s;
}
.video-js .vjs-fullscreen-control:hover:after {
	opacity: 1;
	transition-delay: 1.3s;
}

.vjs-playback-rate .vjs-playback-rate-value {
	font-size: 120%;
	line-height: 50px;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
}

.vjs-playback-rate .vjs-menu {
	transform: translateX(0%);
}

.vjs-error .vjs-error-display .vjs-modal-dialog-content {
	font-size: 1.4em;
	text-align: center;
}

.vjs-error .vjs-error-display:before {
	color: #fff;
	content: 'X';
	font-family: Arial, Helvetica, sans-serif;
	font-size: 4em;
	left: 0;
	line-height: 1;
	margin-top: -0.5em;
	position: absolute;
	text-shadow: 0.05em 0.05em 0.1em #000;
	text-align: center;
	top: 50%;
	vertical-align: middle;
	width: 100%;
}

.vjs-loading-spinner {
	position: absolute;
	top: 5px;
	left: calc( 50% - 65px );
	width: 130px;
	height: 40px;
	border-radius: 5px;
	background: #111;
	overflow: hidden;
	visibility: hidden;
	opacity: 0;
	transition: all .25s ease;
}
.vjs-loading-spinner:before {
	content: '';
	position: absolute;
	top: 10px;
	left: 10px;
	width: 20px;
	height: 20px;
	border-radius: 100%;
	border: solid transparent 2px;
	border-top-color: #fff;
	-webkit-animation: rotate 1s infinite linear;
	animation: rotate 1s infinite linear;
}
.vjs-loading-spinner:after {
	content: 'Loading';
	position: absolute;
	top: 0px;
	right: 5px;
	width: 90px;
	height: 40px;
	line-height: 40px;
	font-size: 150%;
	text-align: center;
}

.vjs-seeking .vjs-loading-spinner,
.vjs-waiting .vjs-loading-spinner {
	visibility: visible;
	opacity: 1;
	top: 20px;
}

@keyframes rotate {
	0% { 
		transform: rotate(0deg);
	}
	100% { 
		transform: rotate(360deg);
	}
}

.vjs-chapters-button .vjs-menu {
	left: -10em;
	width: 0;
}

.vjs-chapters-button .vjs-menu ul {
	width: 24em;
}

.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-custom-control-spacer {
	-webkit-box-flex: auto;
	-moz-box-flex: auto;
	-webkit-flex: auto;
	-ms-flex: auto;
	flex: auto;
}

.video-js.vjs-layout-tiny:not(.vjs-fullscreen).vjs-no-flex .vjs-custom-control-spacer {
	width: auto;
}

.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-progress-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-subtitles-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-volume-menu-button {
	display: none;
}

.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-subtitles-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-volume-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-fullscreen-control {
	display: none;
}

.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-subtitles-button {
	display: none;
}

.vjs-remaining-time {
	display: none;
}
.vjs-caption-settings {
	position: relative;
	top: 1em;
	/*background-color: #2B333F;
	background-color: rgba(43, 51, 63, 0.75);*/
	color: #fff;
	margin: 0 auto;
	padding: 0.5em;
	height: 15em;
	font-size: 12px;
	width: 40em;
}

.vjs-caption-settings .vjs-tracksettings {
	top: 0;
	bottom: 2em;
	left: 0;
	right: 0;
	position: absolute;
	overflow: auto;
}

.vjs-caption-settings .vjs-tracksettings-colors,
.vjs-caption-settings .vjs-tracksettings-font {
	float: left;
}

.vjs-caption-settings .vjs-tracksettings-colors:after,
.vjs-caption-settings .vjs-tracksettings-font:after,
.vjs-caption-settings .vjs-tracksettings-controls:after {
	clear: both;
}

.vjs-caption-settings .vjs-tracksettings-controls {
	position: absolute;
	bottom: 1em;
	right: 1em;
}

.vjs-caption-settings .vjs-tracksetting {
	margin: 5px;
	padding: 3px;
	min-height: 40px;
}

.vjs-caption-settings .vjs-tracksetting label {
	display: block;
	width: 100px;
	margin-bottom: 5px;
}

.vjs-caption-settings .vjs-tracksetting span {
	display: inline;
	margin-left: 5px;
}

.vjs-caption-settings .vjs-tracksetting > div {
	margin-bottom: 5px;
	min-height: 20px;
}

.vjs-caption-settings .vjs-tracksetting > div:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	min-height: 0;
}

.vjs-caption-settings label > input {
	margin-right: 10px;
}

.vjs-caption-settings input[type="button"] {
	width: 40px;
	height: 40px;
}

.video-js .vjs-modal-dialog {
	/*background: rgba(0, 0, 0, 0.8);
	background: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.8), rgba(255, 255, 255, 0));
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.8), rgba(255, 255, 255, 0));*/
}

.vjs-modal-dialog .vjs-modal-dialog-content {
	font-size: 1.2em;
	line-height: 1.5;
	padding: 20px 24px;
	z-index: 1;
}














