@import url('https://fonts.googleapis.com/css2?family=Aboreto&display=swap');
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");
@font-face {
    font-family: Heading;
    src:  url(/assets/fonts/Gallient.ttf);
  }
@font-face {
    font-family: gm;
    src: url(/assets/fonts/Graphik-Medium-Web.ttf);
  }
@font-face {
    font-family: gr;
    src: url(/assets/fonts/Graphik-Regular-Web.ttf);
  }
@font-face {
    font-family: gsb;
    src: url(/assets/fonts/Graphik-Semibold-Web.ttf);
  }
@font-face {
    font-family: gallient;
    src: url(Gallient.ttf);
  }
  @font-face {
    font-family: neu;
    src: url(/assets/fonts/NeueHaasDisplayMediu.ttf);
}

@font-face {
    font-family: neu;
    font-weight: 100;
    src: url(/assets/fonts/NeueHaasDisplayLight.ttf);
}

@font-face {
    font-family: neu;
    font-weight: 200;
    src: url(/assets/fonts/NeueHaasDisplayRoman.ttf);
}
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  color: #fff;
    font-family: gr;
}
html, body {
    height: 100%;
    width: 100%;
}
*::selection {
    background-color: #fff;
    color: #96b73d;
  }
  .c-scrollbar {
    background: transparent;
}
.c-scrollbar_thumb {
    background-color: transparent;
}
::-webkit-scrollbar{
  display: none;
}
:root {
  /* black family */
  --black:#000;
  --offblack:#0C0C0C;
  /* white family */
  --white:#ffffff;
 --offwhite:#E7E5E6;
 /* purple family */
 --offpurple:#B084D3;
 /* yellow family */
 --offyellow:#D3FF4E;
 /* yellow family */
 --lightbg:#FAF8F3;
 --darkbg:#EDECE7;
 /* para gray set*/
 --ParaGray:#A1A2A3;
 --mtext:#575b5f;
  --mdgwt:#777c81;
  
}
#main{
  position: relative;
  background-color: #000  ;
}

#nav {

  opacity: 0; /* Hide initially */
  pointer-events: none; /* Disable interaction */
  transition: opacity 1s ease-in-out;
}

#homepage1 {
    height: 100%;
    width: 100%;
    position: relative;
    padding: 0 4vw;
    background-color: #000000;
   
}

#homepage1-center {
    height: 86vh;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    border-bottom: 1px solid var(--mdgwt);
    padding-bottom: 2.5vw;
    z-index: 999999;
}
.homepage1-left{

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2vw;
}


.homepage1-left p {
    width: 25vw;
    font-size: 1.2vw;
    color: var(--mdgwt);
    font-family: gr;
    font-weight: 400;
}
.homepage1-left p span{
  color: #fff;
}
#homepage1-right h1 {
    font-size: 12vw;
    text-align:right;
    line-height: 11vw;
    color: var(--mtext);
    font-family: neu;
    font-weight: 900;
}
#homepage1-right span{
  font-family: neu;
  color: transparent;
 -webkit-text-stroke: 0.01px #b084d3;
}

@media (max-width:768px) {
  
#homepage1 {
    height: 90vh;
    padding: 0 4vw;
}

#homepage1-center {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    justify-content: space-between;
    border-bottom: 1px solid var(--mdgwt);
    padding-bottom: 4vh;
    z-index: 999999;
    gap: 8vh;
    padding-top: 20vh;
}

.homepage1-left p {
    width: 100%;
    font-size: 2vh;
    line-height: 2.2vh;
}

#homepage1-right h1 {
    font-size: 10vh;
    line-height: 9vh; 
}

}




#homepage2-bottom {
    height: 100%;
    width: 100%;
    padding:2vw 4vw 4vw;
    display: flex;

    justify-content: space-between;

    z-index: 9;
    
}
#homepage2-bottom ul{
  display: flex;
  flex-direction: column;
  gap: 1vw;
}
#homepage2-bottom ul h3{
    font-size: 1.2vw;
    position: relative;
    margin-left: 20px;
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: .1vw;
}
#homepage2-bottom ul h3 span{
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: linear-gradient(to top right, #833ab4, #b084d3);
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
}
#homepage2-bottom ul p{
  font-size: 1.1vw;
  font-family: gr;
  color: var(--mdgwt);
  margin-left: 20px;
}
#homepage2bottom-part2 {
    width: 40%;
}

#homepage2bottom-part2 p {
    font-weight: 200;
    font-size: 1.2vw;
    font-family: neu;
    color: var(--mdgwt);
}

#homepage2bottom-part2 #grleftswipebtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    margin-top: 50px;
    height: 1.5vw;
    cursor: pointer;
  }
  #homepage2bottom-part2 #grleftswipebtn a{
    text-decoration: none ;
  }
  #homepage2bottom-part2 #grleftswipebtn-effect h3 {
    font-weight: 300;
    font-family: neu;
    color:#ffffff;
    font-size: 1.2vw;
    z-index: 999;
  }
  
  #homepage2bottom-part2 #grleftswipebtn-effect {
    padding:12px 28px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    position: relative;
    border-radius: 50px;
    overflow: hidden;
    background: linear-gradient(to top right, #833ab4, #b084d3);
}


#homepage2bottom-part2 #grleftswipebtn-after {
    height: 100%;
    position: absolute;
    width: 100%;
    -webkit-transition: left 0.4s ease;
    -o-transition: left 0.4s ease;
    transition: left 0.4s ease;
    background: linear-gradient(to top right, #833ab4, #b084d3);
    left: -100%;
    top: 0;
    z-index: 999;
    border-radius: 50px;
}

#homepage2bottom-part2 #grleftswipebtn-effect:hover #grleftswipebtn-after {
    left: 0;
}



@media (max-width:768px) {

#homepage2-bottom {
    height: 100%;
    width: 100%;
    padding:2vh 4vw 8vh;
    display: flex;
    gap: 4vh;
    justify-content: space-between;
  flex-direction: column;
    z-index: 9;
    
}
#homepage2-bottom ul{
  display: flex;
  flex-direction: column;
  gap: 1vh;
}
#homepage2-bottom ul h3{
    font-size: 2.2vh;
}

#homepage2-bottom ul p{
  font-size: 1.8vh;
}
#homepage2bottom-part2 {
    width: 100%;
}

#homepage2bottom-part2 p {
    font-size: 2vh;
}
  #homepage2bottom-part2 #grleftswipebtn-effect h3 {
    font-size: 2vh;
  }
  
}



#homepage3{
  width: 100%;
  height: 100%;
  padding: 2vw;
  background-color: #000000;
}

.homepage3-wrapp {
	position: relative;
	display: flex;
  border-radius: 20px;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	z-index: 1;
  background: url(/assets/img/worktest8.avif);
  background-position: left;
  /* background-size: cover; */
}
.homepage3-wrapp_menu{
	width: 40%;
	display: flex;
  justify-content: space-between;
  flex-direction: column;
  /* background-color: var(--white); */
  background: linear-gradient(to top right, #833ab4, #b084d3);
  padding: 4vw;


}
.homepage3-wrapp_menu h3{
    font-size: 1.2vw;
    position: relative;
    margin-left: 20px;
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 1vw;
}
.homepage3-wrapp_menu h3 span{
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: linear-gradient(to top right, #D3FF4E, #D3FF4E);
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
}
.homepage3-wrapp_menu ul{
	display: flex;
	flex-direction: column;
  justify-content: center;
	width: 100%;
  gap: 1vw;
  border-left: 1px solid var(--white);
  padding-bottom: 4vw;
	
}

.homepage3-wrapp_menu-img {
	position: absolute;
	width: 57.5%;
	height: 100%;
	top: 0;
	right: 0;
	opacity: 1;
	filter: blur(0px);
	overflow: hidden;
	transform: scale(1.1);
  z-index: 9999999;
}

.homepage3-wrapp_menu-img img {
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
	top: 0;
	right: 0;
	transition: .1s cubic-bezier(.9, 0, .1, 1);
	transform: scale(1.2);
	clip-path: polygon(0 0, 0 0, 0 110%, 0 110%);

}

.homepage3-wrapp_menu-img img.active {
	transform: scale(1);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.homepage3-wrapp_menu__item {
	position: relative;
	list-style: none;

}
.homepage3-wrapp_menu__item:hover {
    
    -webkit-transition: 1s ease;
    -o-transition: 1s ease;
    transition: 1s ease;
    position: relative;
}
#homepage3 .menu__link {
	width: 100%;
	position: relative;
	display: block;
	z-index: 2;
	transition: .2s cubic-bezier(.9, 0, .1, 1);
	color: #401c58;
    font-size: 4vw;
    font-weight: 400;
	z-index: 99999;
	cursor: pointer;
  font-family: gsb;
  margin-left: 2vw;

}
#homepage3 .menu__link.active{
   color: #ffffff;
   margin-left: 0;
}
#homepage3 .menu__link:hover{
   color: #ffffff;
}
.homepage3-wrapp_menu p{
  font-size: 1.1vw;
  color: var(--white);
}

.homepage3-wrapp_menu__item img {
    opacity: 0;
    pointer-events: none;
    height: 300px;
    z-index: 999;
    position: absolute;
    transform: translate(-50%, -50%);
	-webkit-transition: .1s ease;
    -o-transition: .1s ease;
    transition: .1s ease;
  
}
@media (max-width:768px) {
  

#homepage3{
  padding: 4vh 2vw;
  overflow: hidden;
}

.homepage3-wrapp {
	width: 100%;
	height: 110vh;
	overflow: hidden;
}
.homepage3-wrapp_menu{
  height: 55vh;
	width: 100%;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  padding: 3vh;
  z-index: 999999999999999999;
  gap: 5vh;
}
.homepage3-wrapp_menu h3{
    font-size: 1.6vh;
    gap: 1vh;
}

#linewalabutton{
  font-size: 1.8vh;
  justify-content: center;
  gap: 1vh;
}
.homepage3-wrapp_menu ul{
  padding-bottom: 4vh;
}
.homepage3-wrapp_menu-img {
	width: 100%;
}
#homepage3 .menu__link {
	width: 100%;
  font-size: 4vh;
  margin-left: 2vh;

}
.homepage3-wrapp_menu p{
  font-size: 1.8vh;
}


}

#page4 {
    height: 100%;
    width: 100%;
    background-color: #000000;
    padding: 10vw 4vw 4vw;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

#page4 .swiper {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 2vw;
}
#page4 .swiper-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 2vw 0;
}
#page4 .swiper h1{
    font-size: 1.2vw;
    position: relative;
    margin-left: 20px;
    color: var(--offwhite);
}
#page4 .swiper h1 span{
    border-radius: 50%;
    width: 10px;
    height: 10px;
       background: linear-gradient(to top right, #833ab4, #b084d3);
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
}
#page4 .swiper-slide {
    width: 28%;
    border-left: 1px solid #aeadad;
    padding: 0 2vw;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 1vw;
    -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; 
}
#page4 .swiper-slide img{
    width: 50%;
    -webkit-filter: invert(10);
    filter: invert(10);
    object-fit: cover;
    height: 100%;
}
#page4 .swiper-slide p{
    width: 75%;
    font-size: 1.1vw;
    font-family: gr;
    color: var(--mdgwt);
}
@media (max-width:768px) {
  #page4 {
    padding: 4vh 4vw ;
  }
#page4  .swiper {
    width: 100%;
    gap: 6vh;
}
#page4  .swiper-wrapper {
    padding: 2vw 0;
}
#page4  .swiper h1{
    font-size: 2vh;
}

#page4  .swiper-slide {
    width: 80%;
    padding: 0 2vh;
    gap: 4vh;
}
#page4  .swiper-slide img{
    width: 100%;
}
#page4  .swiper-slide p{
    width: 100%;
    font-size: 1.8vh;
    font-family: gr;

}
}



#homepage5 {
    height: 100%;
    background-color:#000000 ;
    width: 100%;
    position: relative;
    padding: 4vw 4vw;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

#homepage5 h2{
    font-size: 1.2vw;
    position: relative;
    margin-left: 20px;
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 1vw;
}
#homepage5 h2 span{
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: linear-gradient(to top right, #833ab4, #b084d3);
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
}

#page-container {
    width: 70%;
    position: relative;

}
#homepage5-top{
  padding-bottom: 3vw;
  display: flex;
  flex-direction: column;
  gap: 1vw;
}
#homepage5-top p {
    font-weight: 200;
    font-size: 1.2vw;
    font-family: gr;
    color: var(--mdgwt);
    width: 90%;
}

#homepage5-top #grleftswipebtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    margin-top: 40px;
    height: 1.5vw;
    cursor: pointer;
  }
  #homepage5-top #grleftswipebtn a{
    text-decoration: none ;
  }
  #homepage5-top #grleftswipebtn-effect h3 {
    font-weight: 300;
    font-family: neu;
    color:#ffffff;
    font-size: 1.2vw;
    z-index: 999;
  }
  
  #homepage5-top #grleftswipebtn-effect {
    padding:12px 28px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    position: relative;
    border-radius: 50px;
    overflow: hidden;
    background: linear-gradient(to top right, #833ab4, #b084d3);
}


#homepage5-top #grleftswipebtn-after {
    height: 100%;
    position: absolute;
    width: 100%;
    -webkit-transition: left 0.4s ease;
    -o-transition: left 0.4s ease;
    transition: left 0.4s ease;
    background: linear-gradient(to top right, #833ab4, #b084d3);
    left: -100%;
    top: 0;
    z-index: 999;
    border-radius: 50px;
}

#homepage5-top #grleftswipebtn-effect:hover #grleftswipebtn-after {
    left: 0;
}


#page-container a{
  text-decoration: none;
}

.homepage5-elem {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    transition: all cubic-bezier(0.19, 1, 0.22, 1) 1s;
    padding-top: 3vh;
    padding-bottom: 9vh;
    border-top: 1px solid var(--mdgwt);
    position: relative;
    padding-right: 1vw;
}  
.homepage5-elem .homepage5-over{
  display: none;
} 

.homepage5-elem img {
    height: 10vw;
    width: 10vw;
    border-radius: 50%;
    object-fit: cover;
    opacity: 0;
    position: absolute;
    scale: 0;
    z-index: 99999;
}
.homepage5-elem p {
    width: 55%;
    font-size: 1.1vw;
    position: relative;
    z-index: 8;
    color: var(--mdgwt);
    transition: all cubic-bezier(0.19, 1, 0.22, 1) 1s;
    display: flex;
    flex-direction: column;
    gap: 1vw;
}
.homepage5-elem h6{
  display: none;
}
.homepage5-elem h3 {
  width: 30%;
    font-size: 1.6vw;
    font-weight: 400;
    position: relative;
    transition: all cubic-bezier(0.19, 1, 0.22, 1) 1s;
    z-index: 8;
}

@media (max-width:768px) { 

#homepage5 {
    flex-direction: column;
    gap: 4vh;
    padding-bottom: 4vh;
}
#homepage5 h2{
    font-size: 2vh;
    gap: 2vw;

}
#homepage5-top{
  padding-bottom: 4vh;
  display: flex;
  flex-direction: column;
  gap: 2vh;
}
#homepage5-top p {
    font-size: 1.8vh;
    width: 100%;
}
#homepage5-top #grleftswipebtn {
    margin-top: 30px;
  }
  #homepage5-top #grleftswipebtn-effect h3 {
    font-size: 1.5vh;
  }
  
#page-container {
    width: 100%;
    position: relative;
}
#page-container h1{
  font-size: 2.6vh;
}
.homepage5-elem {
    padding-right: 0vw;
    flex-direction: column;
    gap: 2vh;
    border-top: 1px solid var(--mdgwt);
    padding-bottom: 4vh;
}
.homepage5-elem p {
    width: 100%;
    font-size: 1.8vh;
}
.homepage5-elem h6{
  display: block;
  font-size: 1.8vh;
  cursor: pointer;
  border: none;
  background-color: #575b5f;
  color: #fff;
  padding:2vw 3vw;
  font-family: gr;
  font-weight: 400;
}
.homepage5-elem h3 {
     width: 100%;
    font-size: 2.2vh;
}

.homepage5-elem:hover h3 {
    padding-left: 0vw;
  }
  .homepage5-elem:hover p {
  color: var(--mdgwt);
}
.homepage5-elem:hover {
    border-top: 1px solid var(--mdgwt);
}
.homepage5-elem .homepage5-over{
  display: block;
  width: 100%;
  height: 28vh;
  border-radius: 5px;
   background-position: center;
  background-size: cover;
}
.homepage5-elem #hpover1{
  background: url(/assets/img/StrategicFoundations.png);
  background-position: center;
  background-size: cover;

}
.homepage5-elem #hpover2{
  background: url(/assets/img/VisualEvolution.png);
   background-position: center;
  background-size: cover;
}
.homepage5-elem #hpover3{
  background: url(/assets/img/BrandedContent.png);
   background-position: center;
  background-size: cover;
}
.homepage5-elem #hpover4{
  background: url(/assets/img/BeyondTheBuild.png);
   background-position: center;
  background-size: cover;
}
.homepage5-elem #hpover5{
  background: url(/assets/img/Growth&Retention.png);
   background-position: center;
  background-size: cover;
}

.homepage5-elem img{
  display: none;
}
}



#csin{
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  padding: 4vw 4vw 10vw;
  flex-direction: column;
  gap: 1vw;
  
}
#csin h3{
    font-size: 1.3vw;
    position: relative;
    margin-left: 20px;
    color: #fff;
    display: flex;
    align-items: center;
    font-family: gr;
    gap: 1vw;
}
#csin h3 span{
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: linear-gradient(to top right, #833ab4, #b084d3);
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
}
#csin-wrapp{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 2vw;
  padding-top: 1vw;
}
#csin-wrapp a{
  text-decoration: none;
}

#blogin{
  width: 100%;
  height: 100%;
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2vw;
  padding: 2vw 0;
}

#blogin-image{
  width: 100%;
  height: 52vh;
  background-color: #B084D3;
    overflow: hidden;
  border-radius: 10px;
  object-fit: cover;

}


#blogin-content{
  width: 100%;
  height: 100%;
  padding: 1vw 0;
  display: flex;
  flex-direction: column;
  gap: 1vw;
}

#blogin-content h1{
  font-size: 1.5vw;
  display: flex;
  flex-direction: column;
  gap: 1vw;
  font-family: gr;
  color: var(--offwhite);
  font-weight: 600;
}
#blogin-content h6{
  font-size: 1vw;
  color: #777c81;
}
#blogin-content h2{
  font-size: 1vw;
  color: #777c81;
}
#blogin-content p{
  font-size: 1.2vw;
  font-family: gr;
  color: #777c81;
}
@media (max-width:768px) {
  
#csin{
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  padding: 2vw 4vw 10vh;
  flex-direction: column;
  gap: 1vh;
  
}
#csin h3{
    font-size: 2.2vh;
}
#csin-wrapp{
  padding: 4vw 0 4vh;
}

#blogin{
  width: 100%;
  grid-template-columns: repeat(1, 1fr);
  gap: 4vh;
}
#blogin-image{
  width: 100%;
  height: 32vh;
}


#blogin-content{
  padding: 2vh 0;
  gap: 2vh;
}

#blogin-content h1{
  font-size: 2.4vh;
}
#blogin-content h6{
  font-size: 1.8vh;
}
#blogin-content p{
  font-size: 2vh;
  font-family: gr;
  font-weight: 500;
}
#blogin-content h2{
  font-size: 1.8vh;
  color: #777c81;
}
}



#newsroomhome {
  height: 80vh;
  width: 100%;
  cursor: pointer;
  padding-left: 2.5vw;

  border-bottom: 1px solid #777c81;
    

}
#newsroomhome h3{
    font-size: 1.2vw;
    position: relative;
    margin-left: 35px;
  color: #ffffff;
  font-family: gr;
  font-weight: 500;
}
#newsroomhome h3 span{
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: linear-gradient(to top right, #833ab4, #b084d3);
    position: absolute;
    left: -20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
}
#newsroomhome .swiper {
  width: 100%;
  height: 100%;
 position: relative;
}
.swiper-wrapper{
  width: 100%;
  height: 100%;
}
#newsroomhome .swiper-slide {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row-reverse;
  margin-top: 4vw;


  
}
.swiper-slideimg{
  width: 100%;
  height: 40vh;
  overflow: hidden;
  -webkit-transition: .6s ease;
    -o-transition: .6s ease;
    transition: .6s ease;
}
#newsroomhome .swiper-slideimg:hover img{
  scale: 1.1;
}

#newsroomhome .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;

 

}

#newsroomhome .swiper-slide {
  width: 30%;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 1vw;
  -webkit-transition: left 0.4s ease;
    -o-transition: left 0.4s ease;
    transition: left 0.4s ease;
}
#newsroomhome .swiper-slide h1{
  font-family: gr;
  font-size: 1.2vw;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 1vw;
  font-weight: 500;
}
#newsroomhome .swiper-slide span{
  font-size: 1vw;
  color: #777c81;

}


#newsroomhome .swiper-button-next {
  color: #ffffff;
  background: linear-gradient(to top right, #833ab4, #b084d3);
  padding: 5px 20px;
  height: 20px;
  border-radius: 50px;
  position: absolute;
  top: 4%;
  right: 5%;
  z-index: 9999;
}
#newsroomhome .swiper-button-prev {
  color: #ffffff;
  background: linear-gradient(to top right, #833ab4, #b084d3);
  padding: 5px 20px;
  height: 20px;
  border-radius: 50px;
  position: absolute;
  top: 4%;
  left: 80%;
  margin-bottom: 3vw;
}

#newsroomhome .swiper-button-next::after {
  content: "";
}
#newsroomhome .swiper-button-prev::after {
  content: "";
}

#newsroomhome .swiper-pagination{
    /* background-color: red; */
    height: 5%;
    width: 5%;
    left: 85%;
    top: 1%;
    font-weight: 700;
    color: #ffffff;
    font-size: 14px;
}

/* liquid hover effect */

._canvas_container {
  z-index: 999999999 !important;
  pointer-events: none;
}

.swiper-slideimg .image-div {
  height:100%;
  width: 100%;
  position: relative;
 
  -ms-flex-negative: 0;
      flex-shrink: 0;
  

}

.swiper-slideimg .image-div:nth-child(1) {
  height: 100%;
  width: 100%;
}

.swiper-slideimg .image-div img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (max-width:768px) {
#newsroomhome {
  height: 64vh;
}
#newsroomhome h3{
    font-size: 1.8vh;
}
#newsroomhome .swiper-slide {
  margin-top: 7vh;
}
.swiper-slideimg{
  height: 28vh;
}
#newsroomhome .swiper-slide {
  width: 90%;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 1vh;
}
#newsroomhome .swiper-slide h1{
  font-size: 2vh;
  gap: 1vh;
  font-weight: 400;
}
#newsroomhome .swiper-slide span{
  font-size: 1.5vh;
}
#newsroomhome .swiper-button-next {
  color: #000000;
  background: transparent;
  padding: 0;
  border-radius:0;
  top: 10%;
}
#newsroomhome .swiper-button-prev {
  color: #000000;
  background: transparent;
  padding: 0;
  border-radius: 0;
  top: 10%;
  left: 60%;
 
}
#newsroomhome .swiper-pagination{
    height: 5%;
    width: 15%;
    left: 70%;
    top: 5.5%;
    font-size: 12px;
}

}

#newsarrowbtn {
    position: absolute;
    top: 85%;
    left: 0%;
    text-decoration: none;
}

#arrowbtn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1vw;
    height: 30px;
    width: 100%;
    text-decoration: none;
}

#arrowbtn h2 {
  font-size: 18px;
  font-family: gr;
  font-weight: 500;
    color:#ffffff;
}
#arrowbtn h2 span{
  padding: 0 2px;
  font-size: 15px;
  font-family: gr;
  font-weight: 600;
  color:#000;
  background: linear-gradient(to top right, #833ab4, #b084d3);

}

#arrowbtn-effect {
    padding: 0px 19px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
     position: relative;
    border-radius: 50px;
    overflow: hidden;
    background: linear-gradient(to top right, #833ab4, #b084d3);
}

#arrowbtn img {
    z-index: 99;
    height: 25px;

}

#arrowbtn-effect::before {
   content: "";
    height: 100%;
    width: 100%;
    -webkit-transition: left 0.4s ease;
    -o-transition: left 0.4s ease;
    transition: left 0.4s ease;
    background: linear-gradient(to top right, #833ab4, #b084d3);
    position: absolute;
    left: -100%;
    z-index: 9;
    top: 0;
}

#arrowbtn-effect:hover::before {
    left: 0;
}
 #arrowbtn h6 {
  font-size: 18px;
  font-family: gr;
  font-weight: 600;
    color:#ffffff;
}

@media (max-width:768px) {

#arrowbtn {
    gap: 2vh;
}
}