@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Rajdhani:wght@300;400;500;600;700&display=swap');
 body{
/*     overflow-x:hidden; */
       background-image: linear-gradient(#EEFAFF, #F1FBFF) !important;
 }

h1,h2,h3,h4,p{margin:0;}
p{font-size:0.85rem;}
/* *{
 margin:0;
 padding:0;
 box-sizing: border-box;
} */

#section-2{
 background-image: linear-gradient(90deg, #E6F0FF -11.26%, #FFFDF4 111.12%);
}

/* section{
 position: relative;
 height: 100%;
 display: flex;
 justify-content: center;
} */

.section-2-title-container{
 width: 1353px;
 height: fit-content;
}

.section-2-title-mobile,
.section-2-title{
 position: absolute;
 width: 497.24px;
 height: fit-content;
 margin-left: 20px;
 text-shadow: 0px 0px 10px #EEF4FC, 0px 0px 10px #EEF4FC, 0px 0px 10px #EEF4FC;
}

.section-2-title-mobile h1,
.section-2-title h1{
 font-family: 'Figtree';
 font-style: normal;
 font-weight: 700;
 font-size: 52px;
 line-height: 120%;
 display: flex;
 align-items: center;
 color: #061A4D;
}

.section-2-title-mobile p,
.section-2-title p{
 font-family: 'Figtree';
 font-style: normal;
 font-weight: 400;
 font-size: 15px;
 line-height: 150%;
 display: flex;
 align-items: center;
 color: #061A4D;
}

.all-instrument{
position: absolute;
/* height: 100vh;
 width: 1354px; */
}

.instruments{
 z-index: 1;
/*   display: flex; */
 flex-direction: row;
 justify-content: center;
 align-items: center;
 padding: 26.25px;
 gap: 9.08px;
/*   position: fixed; */
 width: 315px;
 height: 250px;
 background: #FFFFFF;
 box-shadow: 7.26194px 7.26194px 40.8484px rgba(0, 0, 0, 0.15);
 border-radius: 27.2323px;
}

/* .instruments-card {
 display: flex;
 flex-direction: column;
 padding: 8.4px 12.6px;
 gap: 16.8px;
 justify-content: center;
 align-items: flex-start;
} */

.instruments-card img{
 width: 50px;
 height: 50px;
}

.instruments-card h2{
 font-family: 'Figtree';
 font-style: normal;
 font-weight: 700;
 font-size: 1rem;
 line-height: 1.4;
 align-items: center;
 color: #061A4D;
}

.instruments-card p{
 font-family: 'Figtree';
 font-style: normal;
 font-weight: 400;
 font-size: 0.85rem;
 line-height: 1.4;
 align-items: center;
 color: #061A4D;
}

.lines {
 position: absolute;
 width: 100%;
 height: 100%;
 min-height:900px;
 display: flex;
 justify-content: space-between;
 mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 5%, #000000 15%, #000000 85%, rgba(255, 255, 255, 0) 95%);
 -webkit-mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 5%, #000000 15%, #000000 85%, rgba(255, 255, 255, 0) 95%);
}
.vl {
 width: 20px;
 height: 100%;
 border-width: 0px 1px;
 border-style: solid;
 border-color: #D6D6D6;
 /* border-image: linear-gradient(0deg, rgba(255, 255, 255, 0) 41.22%, rgba(0, 0, 0) 47.35%, rgba(0, 0, 0) 82.6%, rgba(255, 255, 255, 0) 100%); */
}


@media (min-width: 992px) {
 .mxh{height:1300px;}
 #section-2 .ins-1{
   margin-left: 20px;
   margin-top: calc(100vh - 45vh);
 }
 #section-2 .ins-2{
   margin-left: 249px;
   margin-top: calc(100vh - 35vh);
 }
 #section-2 .ins-3{
   margin-left: 478px;
   margin-top: calc(100vh - 23vh);
 }
 #section-2 .ins-4{
   margin-left: 706px;
   margin-top: calc(100vh - 11vh);
 }

 #section-2 .ins-5{
   margin-left: 249px;
   margin-top: calc(100vh - 8vh);
 }
 #section-2 .ins-6{
   margin-left: 478px;
   margin-top: calc(100vh - 2vh);
 }
 #section-2 .ins-7{
   margin-left: 706px;
   margin-top: calc(100vh - 1vh);
 }
}



/* *{
 margin:0;
 padding:0;
 box-sizing: border-box;
} */
 
 .landing {
   background-color: unset;
 }
 .bg_multimedia{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   overflow: hidden;
 }

 .gallery {
 position: absolute;
   top: -30%;
   left: 15%;
   width: 100%;
   height: 100%;
   transform: rotate(340deg);
}
.block-33 {
 width: 45%;
}
.display--inline-top {
 display: inline-block;
 vertical-align: top;
}
.fill-dimensions {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
}
.relative {
 position: relative;
}
.cover-img {
 background-size: cover;
 background-repeat: no-repeat;
}
.gallery-image {
 padding-bottom: 2.35em;
 animation: marqueeTop 12s linear infinite;
}
.gallery-h--tb .gallery-image {
 animation: marqueeBottom 12s linear infinite;
}
.gallery-image__img {
 padding-top: 50vh;
}
.gallery-h {
 overflow: hidden;
}

@keyframes marqueeTop {
 0% {
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
  }
 100% {
   -webkit-transform: translate3d(0, -100%, 0);
   transform: translate3d(0, -100%, 0);
  }
}
@keyframes marqueeBottom {
 0% {
   -webkit-transform: translate3d(0, -100%, 0);
   transform: translate3d(0, -100%, 0);
  }
 100% {
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
  }
}

 .container-01{grid-area:one;}
 .container-02{grid-area:two;}
 .container-03{grid-area:three;}
 .container-04{grid-area:four;}
 .container-05{grid-area:five;}
 .container-06{grid-area:six;}
 .container-07{grid-area:seven;}
 

.pdt70{padding-top:70px;}
.pdb70{padding-bottom:70px;}
.img_fit{max-height:680px;height:100%;}
/*   @media screen and (min-width:992px){
   .mb-display{display:none;}
   .lp-display{display:block;}
 } */

 @media screen and (min-width:768px){
   .mb-display{display:none;}
   .lp-display{display:block;}
   
 }

 @media screen and (min-width:992px){
   .instruments{
     width: 210px !important;
   }
   
   .laptop_view_only{display:block;}
   .mb_view_only{display:none;}
   .best_container{display:grid;grid-template-areas:'one two''three four';gap:15px;grid-template-columns:unset ;justify-items: center;}
   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:250px;
   width:250px;
   display:flex;
   padding: 15px;
   
 }
   
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 }
 }

 @media screen and (min-width:1200px){
   .mxh{height:1200px;}
 .instruments{
     width: 254px !important;
   }

   #section-2 .ins-1{
   margin-left: 20px;
   margin-top: calc(100vh - 45vh);
 }
 #section-2 .ins-2{
   margin-left: 294px;
   margin-top: calc(100vh - 35vh);
 }
 #section-2 .ins-3{
   margin-left: 568px;
   margin-top: calc(100vh - 23vh);
 }
 #section-2 .ins-4{
   margin-left: 842px;
   margin-top: calc(100vh - 11vh);
 }

 #section-2 .ins-5{
   margin-left: 294px;
   margin-top: calc(100vh - 8vh);
 }
 #section-2 .ins-6{
   margin-left: 568px;
   margin-top: calc(100vh - 2vh);
 }
 #section-2 .ins-7{
   margin-left: 842px;
   margin-top: calc(100vh - 1vh);
 }
   
 .deposit_small_container{
   grid-area:one;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:315px;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_small_container2{
   grid-area:two;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:315px;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_big_container{
   grid-area:three;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height: 580px;
   padding: 25px;
   word-break: break-word;
 }
   .laptop_view{display:block;}
   .mobile_view{display:none;}
   .best_container{display:grid;grid-template-areas:'one two three four';gap:15px;grid-template-columns: 24% 24% 24% 24% ;justify-items: center;}
   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:250px;
   width:250px;
   display:flex;
   padding: 15px;
   
 }
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 }
}

 @media screen and (min-width:1400px){

   .instruments{
     width: 298px !important;
   }

   #section-2 .ins-1{
   margin-left: 20px;
   margin-top: calc(100vh - 45vh);
 }
 #section-2 .ins-2{
   margin-left: 340px;
   margin-top: calc(100vh - 35vh);
 }
 #section-2 .ins-3{
   margin-left: 659px;
   margin-top: calc(100vh - 23vh);
 }
 #section-2 .ins-4{
   margin-left: 978px;
   margin-top: calc(100vh - 11vh);
 }

 #section-2 .ins-5{
   margin-left: 340px;
   margin-top: calc(100vh - 8vh);
 }
 #section-2 .ins-6{
   margin-left: 659px;
   margin-top: calc(100vh - 2vh);
 }
 #section-2 .ins-7{
   margin-left: 978px;
   margin-top: calc(100vh - 1vh);
 }

   
   
   .best_container{display:grid;grid-template-areas:'one two three four';gap:15px;grid-template-columns: 24% 24% 24% 24% ;justify-items: center;}
   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:300px;
   width:300px;
   display:flex;
   padding: 15px;
   
 }
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 }
 }

 @media (min-width:992px) and (min-height: 1200px){
 #section-2 .ins-1{
   margin-left: 20px;
   margin-top: calc(100vh - 66vh);
 }
 #section-2 .ins-2{
   margin-left: 249px;
   margin-top: calc(100vh - 61vh);
 }
 #section-2 .ins-3{
   margin-left: 478px;
   margin-top: calc(100vh - 52vh);
 }
 #section-2 .ins-4{
   margin-left: 706px;
   margin-top: calc(100vh - 45vh);
 }

 #section-2 .ins-5{
   margin-left: 249px;
   margin-top: calc(100vh - 46vh);
 }
 #section-2 .ins-6{
   margin-left: 478px;
   margin-top: calc(100vh - 41vh);
 }
 #section-2 .ins-7{
   margin-left: 706px;
   margin-top: calc(100vh - 40vh);
 }
}

  @media (min-width:1400px) and (min-height: 1000px) and (max-height: 1200px){
 #section-2 .ins-1{
   margin-left: 20px;
   margin-top: calc(100vh - 60vh);
 }
 #section-2 .ins-2{
   margin-left: 249px;
   margin-top: calc(100vh - 53vh);
 }
 #section-2 .ins-3{
   margin-left: 478px;
   margin-top: calc(100vh - 44vh);
 }
 #section-2 .ins-4{
   margin-left: 706px;
   margin-top: calc(100vh - 34vh);
 }

 #section-2 .ins-5{
   margin-left: 249px;
   margin-top: calc(100vh - 35vh);
 }
 #section-2 .ins-6{
   margin-left: 478px;
   margin-top: calc(100vh - 35vh);
 }
 #section-2 .ins-7{
   margin-left: 706px;
   margin-top: calc(100vh - 28vh);
 }
}

 @media (min-width:1600px) and (max-height: 1350px){
 #section-2 .ins-1{
   margin-left: 20px;
   margin-top: calc(100vh - 60vh);
 }
 #section-2 .ins-2{
   margin-left: 341px;
   margin-top: calc(100vh - 53vh);
 }
 #section-2 .ins-3{
   margin-left: 660px;
   margin-top: calc(100vh - 44vh);
 }
 #section-2 .ins-4{
   margin-left: 978px;
   margin-top: calc(100vh - 34vh);
 }

 #section-2 .ins-5{
   margin-left: 341px;
   margin-top: calc(100vh - 36vh);
 }
 #section-2 .ins-6{
   margin-left: 660px;
   margin-top: calc(100vh - 31vh);
 }
 #section-2 .ins-7{
   margin-left: 978px;
   margin-top: calc(100vh - 28vh);
 }
}

  @media (min-width:1600px) and (min-height: 1351px){
 #section-2 .ins-1{
   margin-left: 20px;
   margin-top: calc(100vh - 66vh);
 }
 #section-2 .ins-2{
   margin-left: 341px;
   margin-top: calc(100vh - 61vh);
 }
 #section-2 .ins-3{
   margin-left: 660px;
   margin-top: calc(100vh - 54vh);
 }
 #section-2 .ins-4{
   margin-left: 978px;
   margin-top: calc(100vh - 47vh);
 }

 #section-2 .ins-5{
   margin-left: 341px;
   margin-top: calc(100vh - 45vh);
 }
 #section-2 .ins-6{
   margin-left: 660px;
   margin-top: calc(100vh - 41vh);
 }
 #section-2 .ins-7{
   margin-left: 978px;
   margin-top: calc(100vh - 40vh);
 }
}

 @media screen and (max-width:1199px){
   .laptop_view{display:none;}
   .mobile_view{display:block;}
   
   .sticky_column{justify-self:end;}
   .sticky_column2{justify-self:start;}

   .grid_container_temp{
   display:grid;grid-template-areas:'one three''two three'; gap:15px;align-items: center;
 }
 .deposit_small_container{
   grid-area:one;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:260px;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_small_container2{
   grid-area:two;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:260px;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_big_container{
   grid-area:three;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height: 580px;
   width:300px;
   padding: 25px;
   word-break: break-word;
 }
 }
 
 @media screen and (max-width:991px){
   .laptop_view_only{display:none;}
   .mb_view_only{display:block;}
   .instruments_container{display:grid;grid-template-areas:'one two''three four''five six''seven seven';gap:15px;grid-template-columns:48% 48% ;justify-items: center;}
   .instrument_container_content{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:300px;
   width:100%;
   display:flex;
   padding: 25px;
 }
   
   .first-section-500{height:initial!important;}
   .img_fit{max-height:400px !important;height:100%;}
   .pdb70{padding-bottom:unset!important;}
   .pdt70{padding-top:unset!important;}
   .best_container{display:grid;grid-template-areas:'one two''three four';gap:15px;grid-template-columns: 48% 48%;justify-items: center;}

   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:250px;
   width:250px;
   display:flex;
   padding: 15px;
   
 }
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 }
 }
 
 @media screen and (max-width:767px){
   .mb-display{display:block;}
   .lp-display{display:none;}
 .best_container{display:grid;grid-template-areas:'one two''three four';gap:15px;grid-template-columns: 48% 48%;justify-items: center;}
   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:250px;
   width:250px;
   display:flex;
   padding: 15px;
   
 }
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 }
   .sticky_column{justify-self:center;}
   .sticky_column2{justify-self:center;}

   .grid_container_temp{
     display:grid;grid-template-areas:'one two''three three'; gap:15px;align-items: center;
 }
 .deposit_small_container{
   grid-area:one;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:260px;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_small_container2{
   grid-area:two;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:260px;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_big_container{
   grid-area:three;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height: 580px;
   width:100%;
   padding: 65px;
   word-break: break-word;
 }
}

 @media screen and (max-width:576px){
.instruments_container{display:grid;grid-template-areas:'one''two''three''four''five''six''seven';gap:15px;grid-template-columns: 100% ;justify-items: center;}
   .instrument_container_content{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:300px;
   width:100%;
   display:flex;
   padding: 25px;
 }
   
   .grid_container_temp{
   display:grid;grid-template-areas:'one''two''three'; gap:15px;align-items: center;
 }
   .best_container{display:grid;grid-template-areas:'one''two''three''four';gap:15px;grid-template-columns: 100%;justify-items: center;}
   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:250px;
   width:100%;
   display:flex;
   padding: 25px;
   
 }
   .sticky_column{justify-self:center;}
   .sticky_column2{justify-self:center;}
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 }
.deposit_small_container{
   grid-area:one;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:100%;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_small_container2{
   grid-area:two;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:100%;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_big_container{
   grid-area:three;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height: 580px;
   width:100%;
   padding: 65px;
   word-break: break-word;
 }
   
 }

 @media screen and (max-width:470px){
   .best_container{display:grid;grid-template-areas:'one''two''three''four';gap:15px;grid-template-columns: 100%;justify-items: center;}
   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:250px;
   width:100%;
   display:flex;
   padding: 25px;
   
 }
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 }

   .deposit_small_container{
   grid-area:one;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:100%;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_small_container2{
   grid-area:two;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:260px;
   width:100%;
   padding: 25px;
   word-break: break-word;
 }
 .deposit_big_container{
   grid-area:three;
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height: 580px;
   width:100%;
   padding: 25px;
   word-break: break-word;
 }
 }

 
 .section-1{
   background-color:unset !important;
 }

 .bg_section_1 {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684722829152-768-bg-1.webp');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg_section_2 {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684681940904-437-bg-2.webp');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg_section_3 {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684681940694-888-bg-3.webp');
        background-size: 100%;
        background-position: center;
        background-repeat: no-repeat;
    }

    .bg_deposit {
        background-image: url('https://cms.blueoceanfin.com/assets/media/1684681938903-787-vector-1.webp');
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

/*   .small_container_background{
   background: #FFFFFF;
   box-shadow: 0px 13.8359px 53.499px rgba(0, 0, 0, 0.15);
   border-radius: 27.6719px;
   height:300px;
   width:300px;
   display:flex;
   padding: 25px;
   
 }
 .small_container_content{
   height:230px;
   margin:auto;
 }
 .step_content{
   color: rgba(94, 230, 235, 0.2);
   margin:0;
   font-size:4rem;
   text-align:center;
 } */

 
 .pd0{padding:0;}
 .title_border_height{
   border-left: 3px solid #5ee6eb;
   height: 40px;
   float: left;
   margin-right: 8px;
 }
 .title_border_height2{
   border-left: 3px solid #5ee6eb;
   height: 68px;
   float: left;
   margin-right: 8px;
 }
 .instrument_content{
   font-size:1.5rem;
 }

.swiper-button-next:after,
.swiper-button-prev:after {
  color: #000000 !important;
  opacity: 0.2 !important;
}

.wave-button,
.wave-header-button {
  padding: 5px 20px;
  width: auto;
  text-align: center;
  background-color: transparent;
  border: 1px solid #3d3d3d20;
  border-radius: 15px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.wave-button span,
.wave-header-button span {
  position: relative;
  color: #fff;
}

.wave-button .wave {
  position: absolute;
  top: -100px;
  left: 0;
  width: 100%;
  height: 250px;
  background: #4d77ff;
  transition: .5s ease;
}

.wave-button:hover .wave::after,
.wave-button:hover .wave::before {
  width: 0;
  height: 0;
  transition: 2s ease;
}

.wave-button .wave::after,
.wave-button .wave::before {
  content: '';
  position: absolute;
  width: 200%;
  height: 200%;
  top: -10px;
  left: 50%;
  transform: translate(-50%, -75%);
  transition: .5s ease;
}

.wave-button .wave::before {
  border-radius: 40%;
  background-image: linear-gradient(#EEFAFF, #F1FBFF);
  animation: wave 7s linear infinite;
}

.wave-button .wave::after {
  border-radius: 45%;
  background-image: linear-gradient(#EEFAFF, #F1FBFF);
  animation: wave 12s linear infinite;
}

button.wave-header-button{
    font-size: 13px !important;
    line-height: 0 !important;
    height: 25.5px;
}

.wave-header-button .wave1 {
  position: absolute;
  top: -100px;
  left: 0;
  width: 100%;
  height: 250px;
  background: #4d77ff;
  transition: .5s ease;
}

.wave-header-button:hover .wave1::after,
.wave-header-button:hover .wave1::before {
  width: 0;
  height: 0;
  transition: 2s ease;
}

.wave-header-button .wave1::after,
.wave-header-button .wave1::before {
  content: '';
  position: absolute;
  width: 200%;
  height: 200%;
  top: -10px;
  left: 50%;
  transform: translate(-50%, -75%);
  transition: .5s ease;
}


.wave-header-button .wave1::before {
  border-radius: 40%;
  background-image: linear-gradient(#fafafa, #fcfcfc);
  animation: wave 7s linear infinite;
}

.wave-header-button .wave1::after {
  border-radius: 45%;
  background-image: linear-gradient(#fafafa, #fcfcfc);
  animation: wave 12s linear infinite;
}

@keyframes wave {
  0% {
    transform: translate(-50%, -75%) rotate(0deg);
  }

  100% {
    transform: translate(-50%, -75%) rotate(360deg);
  }
}

@keyframes wave1 {
  0% {
    transform: translate(-50%, -75%) rotate(0deg);
  }

  100% {
    transform: translate(-50%, -75%) rotate(360deg);
  }
}
 

  @font-face {
  font-family: 'Blender Pro';
  src: url('https://cms.blueoceanfin.com/assets/media/1700446273296-394-Blender Pro Medium.ttf') format('truetype');

  font-family: 'General Sans';
  src: url('https://cms.blueoceanfin.com/assets/media/1700446302691-605-GeneralSans-Variable.ttf') format('truetype');
}

  #double-12-display .display-bg{
    position: relative;
    background-image: url(https://cms.blueoceanfin.com/assets/media/1700445473045-610-1920-latest.webp);
    background-position: center;
    height: 650px;
    max-width: 1920px;
    overflow: hidden;
   
  }

  #double-12-display .tnc-applied{
    z-index: 1;
    color: #4DFFFF;
    font-family: General Sans;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    bottom: 1%;
    left: 2%;
  }

  /* for screen size > 1920px */
  @media (min-width: 1920px){
     #double-12-display .display-bg{
        border-radius: 0 0 27px 27px;
       box-shadow: 0px 0px 50px 5px rgba(0, 0, 0, 0.5);
}
     
  }

  .double-12-icon{
    width: 25%;
    min-width: 475px;
  }

  .text-container{
    z-index: 5;
    margin-top: -20px;
  }

  .double-text{
    font-family: Work Sans;
    font-size: 105px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
     background: linear-gradient(275deg, #C6E7E5 1.33%, #7AB3C2 5.7%, #6CADBD 7.97%, #73BCD0 10.46%, #7ACCE4 13.04%, #99DFEF 15.93%, #BCE4E3 18.03%, #B9E4E2 19.27%, #83BBC9 22.39%, #6BABBA 24.41%, #71B7C9 25.67%, #79CAE1 27.94%, #90DDF1 29.54%, #B2E2E1 31.72%, #9CD7DD 33.57%, #81B9C7 36.19%, #6CAEBE 39.06%, #77C5DB 41.9%, #80D8F4 44.44%, #88DBF4 45.5%, #9BDBDC 47.66%, #95C8D7 49.11%, #81B9C7 50.81%, #6CACBB 53.11%, #79C9E0 56.72%, #85DBF5 59.32%, #97DFEF 61.45%, #BEE5E4 63.78%, #9CD9DD 66.23%, #95C8D7 67.77%, #82BAC8 69.3%, #6EABB9 73.02%, #78C8DF 75.67%, #AAE5F9 77.98%, #CCE9E7 80.73%, #9BDCDC 83.04%, #A0D1E0 85.34%, #69A7B5 89.57%, #81DBF7 94.47%, #99E0EF 97.96%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px white;
    filter: drop-shadow(0px 6px 0px rgba(7, 4, 28, 0.70));
  }

  .deposit-text{
    color: #FFF;
    text-shadow: 0px 4px 0px rgba(0, 0, 0, 0.50);
    font-family: Montserrat;
    font-size: 35px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
  }

  .projector-container{
    bottom: -2px;
    perspective: 1000px;
  }

  .projection-base-wrapper{
    height: 100%;
    bottom: -25%;
    left: 50%;
    transform: translate(-50%, 0px);
    transform: translate3d(-50%, 0px, 50px) rotateX(86deg);
    rotate: 0deg;
  }

  .projection-base{
    animation: rotateBase 60s linear infinite;
  }

  

  @keyframes rotateBase {
  0%{
    transform: rotate(0deg);
  }
  100%{
    transform: rotate(360deg);
  }
}

  /* btn animation */
  .explore-btn {
  --primary: rgba(1, 16, 48, 0.80);
  --btn-padding: 10px 50px;
  --color: hsl(0, 0%, 100%);
  --font-size: 27px;
  --shadow-primary-hue: 180;
  --label-size: 9px;
  --shadow-secondary-hue: 60;
  --shadow-secondary: hsl(var(--shadow-secondary-hue), 90%, 60%);
  --clip: polygon(0 0, 100% 0, 100% 50%, 100% 100%, 8% 100%, 0 73%);
  --border: 4px;
  --shimmy-distance: 5;
  --clip-one: polygon(0 2%, 100% 2%, 100% 95%, 95% 95%, 95% 90%, 85% 90%, 85% 95%, 8% 95%, 0 70%);
  --clip-two: polygon(0 78%, 100% 78%, 100% 100%, 95% 100%, 95% 90%, 85% 90%, 85% 100%, 8% 100%, 0 78%);
  --clip-three: polygon(0 44%, 100% 44%, 100% 54%, 95% 54%, 95% 54%, 85% 54%, 85% 54%, 8% 54%, 0 54%);
  --clip-four: polygon(0 0, 100% 0, 100% 0, 95% 0, 95% 0, 85% 0, 85% 0, 8% 0, 0 0);
  --clip-five: polygon(0 0, 100% 0, 100% 0, 95% 0, 95% 0, 85% 0, 85% 0, 8% 0, 0 0);
  --clip-six: polygon(0 40%, 100% 40%, 100% 85%, 95% 85%, 95% 85%, 85% 85%, 85% 85%, 8% 85%, 0 70%);
  --clip-seven: polygon(0 63%, 100% 63%, 100% 80%, 95% 80%, 95% 80%, 85% 80%, 85% 80%, 8% 80%, 0 70%);
  font-family: 'Blender Pro', sans-serif;
  color: var(--color);
  cursor: pointer;
  background: transparent;
  font-size: var(--font-size);
  outline: transparent;
  letter-spacing: 2px;
  position: relative;
  font-weight: 700;
  border: 0;
  line-height: normal;
  padding: var(--btn-padding);
  transition: background 0.2s;
  border-right: 2px solid white;
}

.explore-btn:after,
.explore-btn:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  clip-path: var(--clip);
  z-index: -1;
}

.explore-btn:before {
  background: var(--shadow-primary);
  transform: translate(var(--border), 0);
}

.explore-btn:after {
  background: var(--primary);
}

.explore-btn__glitch {
  position: absolute;
  top: calc(var(--border) * -1);
  left: calc(var(--border) * -1);
  right: calc(var(--border) * -1);
  bottom: calc(var(--border) * -1);
  background: var(--shadow-primary);
  text-shadow: 2px 2px var(--shadow-primary), -2px -2px var(--shadow-secondary);
  clip-path: var(--clip);
  animation: glitch 2s infinite;
  padding: var(--btn-padding);
  border-right: 2px solid white;
  display: none;
}

.explore-btn:hover .explore-btn__glitch {
  display: block;
}

.explore-btn__glitch:before {
  content: '';
  position: absolute;
  top: calc(var(--border) * 1);
  right: calc(var(--border) * 1);
  bottom: calc(var(--border) * 1);
  left: calc(var(--border) * 1);
  clip-path: var(--clip);
  background: var(--primary);
  z-index: -1;
}

@keyframes glitch {
  0% {
    clip-path: var(--clip-one);
  }
  2%, 8% {
    clip-path: var(--clip-two);
    transform: translate(calc(var(--shimmy-distance) * -1%), 0);
  }
  6% {
    clip-path: var(--clip-two);
    transform: translate(calc(var(--shimmy-distance) * 1%), 0);
  }
  9% {
    clip-path: var(--clip-two);
    transform: translate(0, 0);
  }
  10% {
    clip-path: var(--clip-three);
    transform: translate(calc(var(--shimmy-distance) * 1%), 0);
  }
  13% {
    clip-path: var(--clip-three);
    transform: translate(0, 0);
  }
  14%, 21% {
    clip-path: var(--clip-four);
    transform: translate(calc(var(--shimmy-distance) * 1%), 0);
  }
  25% {
    clip-path: var(--clip-five);
    transform: translate(calc(var(--shimmy-distance) * 1%), 0);
  }
  30% {
    clip-path: var(--clip-five);
    transform: translate(calc(var(--shimmy-distance) * -1%), 0);
  }
  35%, 45% {
    clip-path: var(--clip-six);
    transform: translate(calc(var(--shimmy-distance) * -1%));
  }
  40% {
    clip-path: var(--clip-six);
    transform: translate(calc(var(--shimmy-distance) * 1%));
  }
  50% {
    clip-path: var(--clip-six);
    transform: translate(0, 0);
  }
  55% {
    clip-path: var(--clip-seven);
    transform: translate(calc(var(--shimmy-distance) * 1%), 0);
  }
  60% {
    clip-path: var(--clip-seven);
    transform: translate(0, 0);
  }
  31%, 61%, 100% {
    clip-path: var(--clip-four);
  }
}

  @media (max-width: 1200px){.double-12-icon{width: 37%;}}
  @media (max-width: 834px){
    
    #double-12-display .display-bg{
      background-image: url(https://cms.blueoceanfin.com/assets/media/1700445473024-239-tablet-bg.webp);
      height: 900px;
    }

    .projection-base-wrapper{
      height: 70%;
      bottom: -3%;
    }
  }
  @media (max-width: 575px){
    .double-12-icon{
      width: 65%;
      min-width: 300px;
    }

    .double-text{
      font-size: 70px;
    }

    .deposit-text{
      font-size: 30px;
    }

    .explore-btn{
      --btn-padding: 9px 35px;
      --font-size: 27px;
    }
  }
  @media (max-width: 450px){
    #double-12-display .display-bg{
      background-image: url(https://cms.blueoceanfin.com/assets/media/1700445472341-4-mobile-bg.webp);
      height: 650px;
    }
    .double-12-icon{
      width: 60%;
    }

    .double-text{
      font-size: 65px;
    }

    .deposit-text{
      font-size: 24px;
    }

    .projection-base-wrapper{
      height: 50%;
      bottom: 6%;
    }

    .explore-btn{
      --btn-padding: 5px 30px;
      --font-size: 18px;
    }
  }