@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');



:root {

  /* --primary-color: #9d1540; */

  --primary-color: #004da2;

  --secondary-color: #cd9e2b;

  --body-color: #212121;

  --light: #f8fcff;

  --facebook: #4267B2;

  --twitter: #00acee;

  --linkedin: #0e76a8;

  --youtube: #FF0000;

  --whatsapp: #25D366;

  --instagram: #c92bb7;

}



body {

  color: var(--body-color);

  font: 400 1rem "Montserrat", sans-serif;

  overflow-x: hidden;

}



.table td,

.table th{

  padding: 1.25rem 1rem 1rem;

}



p {

  line-height: 1.5;

}



.padding {

    padding-top: 4rem;

    padding-bottom: 4rem;

}



ul {

  padding-left: 0;

  margin-bottom: 0;

}



a,

a:hover {

  text-decoration: none;

}

a {

  color: var(--primary-color);

}



.rounded{

  border-radius: 10px !important;

}



svg:not([fill]) {

  fill: currentColor;

}



i svg {

  width: 16px;

}



img, video, iframe {

  width: 100%;

  display: block;

}



.object-cover {

  object-fit: cover;

}



.container-fluid{

    padding-left: 2rem;

    padding-right: 2rem;

}



.filter-white {

  -ms-filter: brightness(70);

  filter: brightness(70);

}



.filter-dark {

  -ms-filter: grayscale(1) brightness(0.5);

  filter: grayscale(1) brightness(0.5);

}



/*header*/

.header {

  width: 100%;

  position: fixed;

  top: 0;

  padding: 5px 1rem;

  background-color: #fff;

  box-shadow: 0 10px 20px rgb(0 0 0 / 10%);

  display: flex;

  justify-content: space-between;

  z-index: 999;

  transition: all 300ms ease-in-out;

}



.logo {

  width: 140px;

  position: relative;

  min-height: 1px;

  transition: all 300ms ease-in-out;

  display: flex;

  align-items: center;

  justify-content: center;

}



.logo img {

  transition: all 300ms ease-in-out;

}



/* .header.fixed .logo {

  width: 90px;

} */



/* .header.fixed .logo img{

  padding: 0 10px;

} */



.header .nav > ul {

  display: flex;

  align-items: center;

  position: relative;

}



.header .nav > ul > li{

  height: 100%;

}



.header .nav > ul > li > a {

  height: 100%;

  color: var(--body-color);

  display: flex;

  align-items: center;

  gap: 0 10px;

  position: relative;

  font-size: 87.5%;

  font-weight: 500;

  text-transform: uppercase;

  transition: all 300ms ease-in-out;

  padding: 1rem;

  z-index: 1;

}



.header .nav > ul > li > a small{

    display: block;

    text-transform: capitalize;

}



.header .nav ul li a i{

  font-size: 75%;

}



.header .nav ul li:hover > a{

  color: var(--primary-color);

}



.header .nav > ul > li > a::before {

  content: '';

  position: absolute;

  left: calc(50% - 8px);

  top: 0;

  border: 8px solid;

  border-color: #fff transparent transparent transparent;

  transition: all 300ms ease-in-out;

  opacity: 0;

  z-index: -1;

}



.header .nav ul li > a.active::before,

.header .nav ul li:hover > a::before {

  opacity: 1;

}



.header .nav ul li .dropdown{

  position: absolute;

  left: 0;

  top: 100%;

  width: 100%;

  background-color: #fff;

  border-top: 2px solid var(--primary-color);

  border-bottom: 2px solid var(--primary-color);

  padding: 2rem;

  opacity: 0;

  visibility: hidden;

  translate: 0 20px;

  pointer-events: none;

  transition: all 300ms ease-in-out;

}



.header .nav ul li:hover .dropdown{

  opacity: 1;

  visibility: visible;

  translate: 0 0;

  pointer-events: all;

}



.header .nav ul li .dropdown.dropdown-sm{

  width: 250px;

  padding: 10px 20px;

}



.header .nav ul li .dropdown.dropdown-sm ul li a{

  font-size: 15px;

  display: block;

  color: var(--body-color);

  padding: 10px 0;

  border-bottom: 1px solid rgb(0 0 0 / 15%);

}



.header .nav ul li .dropdown.dropdown-sm ul li:last-of-type a{

  border-bottom: none;

}



.header .nav ul li .dropdown.dropdown-sm ul li a.active,

.header .nav ul li .dropdown.dropdown-sm ul li a:hover{

  color: var(--secondary-color);

}



.header .nav ul li .dropdown.dropdown-sm ul li a.btn.disabled{

  font-size: 15px;

  border-radius: 0;

  border: none;

  line-height: normal;

}



.header .nav ul li .dropdown .drop-section{

  display: flex;

  justify-content: center;

  border-right: 1px solid rgb(0 0 0 / 20%);

}



.header .nav ul li .dropdown .drop-section:last-child{

  border-right: none;

}



.header .nav ul li .dropdown .drop-section h5{

  color: var(--primary-color);

  font-weight: 700;

  font-size: 1rem;

}



.header .nav ul li .dropdown .drop-section ul{

  padding-left: 15px;

}



.header .nav ul li .dropdown .drop-section li{

  margin: 8px 0;

}



.header .nav ul li .dropdown .drop-section li::marker{

  color:var(--primary-color)

}



.header .nav ul li .dropdown .drop-section li a{

  color: #828282;

  display: block;

  font-weight: 600;

  font-size: 13px;

}



.header .nav ul li .dropdown .drop-section li a:hover{

  color: var(--primary-color);

}



.header.fixed .menuBtn span::before {

  background: var(--primary-color);

}



.menuBtn {

  width: 30px;

  height: 30px;

  overflow: hidden;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  transition: all 300ms ease-in-out;

  position: relative;

  cursor: pointer;

}



.menuBtn div {

  position: relative;

  width: 100%;

  overflow: hidden;

  display: inline-block;

  vertical-align: middle;

  transition: all 300ms ease-in-out;

}



.menuBtn span {

  display: block;

  position: relative;

  width: 100%;

  height: 2px;

  margin: 3px 0;

  transition: all 0.6s cubic-bezier(0.785, 0.135, 0.15, 0.86);

}



.menuBtn span::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: var(--primary-color);

  transform-origin: center center;

  transition: all 0.6s cubic-bezier(0.785, 0.135, 0.15, 0.86);

}



.menuBtn.closeMenuBtn span#menuLine1 {

  -webkit-transform: rotate(45deg) translate(4px, 4px);

  transform: rotate(45deg) translate(4px, 4px);

}



.menuBtn.closeMenuBtn span#menuLine2 {

  right: 100px;

}



.menuBtn.closeMenuBtn span#menuLine3 {

  -webkit-transform: rotate(-45deg) translate(5px, -4px);

  transform: rotate(-45deg) translate(5px, -4px);

}



.mbMenuContainer {

  position: fixed;

  left: 0;

  right: 0;

  top: 40px;

  bottom: 0;

  z-index: 999;

  display: none;

}



.mbMenuContainer .inner {

  background-color: rgb(0 77 162 / 78%);

  backdrop-filter: blur(8px) brightness(1);

  position: relative;

  height: 100%;

  width: 100%;

  padding: 2rem;

  overflow: auto;

}



.mbMenuContainer .mbMenu ul li a {

  display: flex;

  align-items: center;

  color: #fff;

  font-size: 8vw;

  font-weight: 700;

  line-height: 0.8;

  text-transform: uppercase;

  gap: 1rem;

  transition: all 300ms ease-in-out;

}



.mbMenuContainer .mbMenu ul li:hover > a,

.mbMenuContainer .mbMenu ul li a:focus {

  color: var(--secondary-color);

}



.mbMenuContainer .mbMenu ul li a i{

  font-size: 1rem;

  color: var(--secondary-color);

}



.mbMenuContainer .mbMenu ul li .mb-dropdown {

  width: 100%;

  margin-bottom: 1.25rem;

  border-top: 2px solid #fff;

  display: none;

}



.mbMenuContainer .mbMenu ul li .mb-dropdown ul {

  padding: 5px 15px;

  background-color: rgb(255 255 255 / 14%);

}



.mbMenuContainer .mbMenu ul li .mb-dropdown ul li a {

  text-transform: capitalize;

  font-size: 1rem;

  padding: 10px 0;

  font-weight: 500;

}



.mbMenuContainer .mb-Social{

  display: flex;

  gap: 1.5rem;

  margin-top: 2rem;

  padding-top: 2rem;

  border-top: 1px solid rgb(255 255 255 / 12%);

}



.mb-Social a{

  color: #fff;

}



.mb-Social a i{

  width: 35px;

  height: 35px;

  display: flex;

  align-items: center;

  justify-content: center;

  border: 1px solid rgb(255 255 255 / 15%);

  border-radius: 50%;

}



.mb-Social a i:hover{

  background-color: #fff;

  color: var(--primary-color);

}

/*header*/



.banner {

  height: 100vh;

  position: relative;

  background: var(--primary-color);

  z-index: 1;

}



/* .banner::after {

    content: '';

    position: absolute;

    right: 0;

    top: 0;

    display: block;

    width: 6vw;

    height: 6vw;

    border-top: 3vw solid var(--primary-color);

    border-right: 3vw solid var(--primary-color);

    border-bottom: 3vw solid transparent;

    border-left: 3vw solid transparent;

} */



.typed-cursor{

    font-weight: 300;

    line-height: .7;

    vertical-align: top;

}



.banner .carousel-item::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  background: rgb(0 0 0 / 20%);

  background: linear-gradient(transparent,rgb(0 0 0 / 70%));

  z-index: -1;

}



/* .banner img.h-100{

  clip-path: circle(50% at 50% 50%);

} */



.banner-img img{

  opacity: 0.5;

  animation: blink 10s alternate infinite;

}



@keyframes blink{

  0%{opacity: 0.2;}

  100%{opacity: 1;}

}



.bannerText {

  padding: 0 4rem;

  opacity: 0;

  color: #fff;

  transition: all .3s linear;

}



.banner .carousel-item.active .bannerText{

  opacity: 1;

}



.bannerText .h1 {

  font-size: 2.75rem;

  font-weight: 700;

  text-transform: uppercase;

  position: relative;

  padding: 1px 0;

}



.bannerText h5{

  font-weight: 400;

  font-size: 1rem;

}





.bannerBottom{

	position:absolute;

	bottom:20px;

	right:20px;

	display:flex;

	justify-content:space-between;

	align-items:center;

	z-index:9;

}



.bannerControlsContainer{

	display:flex;

	align-items:center;

}



.bannerControlsContainer .carousel-indicators{

	position:static;

	align-items:center;

	margin-right:0px;

	margin-left:0;

}



.bannerControlsContainer .carousel-indicators li{

	width:auto;

	height:auto;

	background-color:transparent;

	opacity:1;

	color:#fff;

	margin:0 20px;

	text-indent:inherit;

	border-top:1px solid transparent;

	border-bottom:1px solid transparent;

	font-weight:600;

	font-size:12px;

	transition:all 300ms ease-in-out;

}



.bannerControlsContainer .carousel-indicators li:hover, .bannerControlsContainer .carousel-indicators .active{

	border-bottom-color:#fff;

}



.bannerControlsContainer .bannerControl{

	display:flex;

	align-items:center;

	justify-content:center;

}



.bannerControlsContainer .bannerControl >span{

	width:120px;

}



.bannerControlsContainer .bannerControl .carousel-control-next.banner-next, 

.bannerControlsContainer .bannerControl .carousel-control-prev.banner-prev{

	position:static;

	top:auto;

	width:40px;

	height:40px;

	border-radius:5px;

	margin:0 5px;

	opacity:1;

	z-index:9;

}



.carousel-control-next.banner-next .carousel-control-next-icon, .carousel-control-prev.banner-prev .carousel-control-prev-icon{

	background-size:60%;

}



.carousel-control-next.banner-next:hover, .carousel-control-prev.banner-prev:hover{

	background-color:var(--secondary-color);

}



.bannerSocial{

	display:flex;

	flex-direction:column;

	align-items:center;

	justify-content:center;

	position:absolute;

	left:20px;

	bottom:20px;

	z-index:9;

}



.bannerSocial a{

	font-size:13px;

	display:block;

	padding:5px;

	margin:5px 0;

	color:#fff;

}



.bannerSocial a:hover{

	color:var(--facebook);

}



.scrollDown{

	position:absolute;

	left:calc(50% - 15px);

	bottom:20px;

	width:30px;

	cursor:pointer;

	z-index:9;

  animation: bounce 1s alternate infinite;

}



@keyframes bounce {

  100% {

    bottom:10px;

  }

}



.cloud {

  position: absolute;

  left: 0;

  right: 0;

  top: 0;

  height: 39%;

  background: url(../images/cloud.png);

  animation: animateclouds 80s linear infinite;

  pointer-events: none;

  opacity: 0.7;

}



@keyframes animateclouds {

  0% {

    background-position: 0px;

  }



  100% {

    background-position: -3000px;

  }

}



/* overview */

.watermark{

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%,-50%);

  max-width: 700px;

  width: 100%;

  opacity: 0.05;

  z-index: -1;

}



.overview-text{

  text-align: justify;

  text-align-last: center;

}

.counterContainer .inner{

  padding-left: 4rem;

}



.counterContainer .count:not(:last-child){

  margin-bottom: 10px;

}



.counterContainer .count{

  padding: 1rem;

  background: linear-gradient(to bottom right,var(--light),#dbefff);

  border-radius: 5px;

}



.count .counter{

  font-weight: 800;

  font-size: 2rem;

  color: var(--primary-color);

  margin-right: 10px;

}

/* overview */



/* Business */

.hm-someIconsContainer{

	height:55vh;

	display:flex;

	overflow:hidden;

  border-radius: 10px;

  box-shadow: 0 1rem 3rem rgb(0 0 0 / 15%);

  background-color: #000;

}



.hm-someIconsContainer .iconbox{

	flex-grow:1;

	flex-basis:0;

	display:flex;

  width: 100%;

	align-items:flex-end;

	padding:1rem;

	position:relative;

	z-index:1;

	overflow:hidden;

}



.hm-someIconsContainer .iconbox:not(:last-child){

  border-right: 1px solid rgb(255 255 255 / 25%);

}



.hm-someIconsContainer .iconbox::before{

	content:'';

	position:absolute;

	left:0;

	right:0;

	bottom:0;

	height:0;

	background:linear-gradient(transparent,rgba(0,0,0,0.60));

	z-index:-1;

	transition:all 300ms ease-in-out;

}



.hm-someIconsContainer .iconbox.active::before,

.hm-someIconsContainer .iconbox:hover::before{

	height:100%;

}



.hm-someIconsContainer .iconbox .iconImgs{

	position:absolute;

	left:0;

	right:0;

	bottom:0;

	top:0;

	background:center no-repeat;

	background-size:cover;

	z-index:-2;

	pointer-events:none;

	opacity:0.75;

	transition:all 300ms ease-in-out;

}



.hm-someIconsContainer .iconbox.active .iconImgs,

.hm-someIconsContainer .iconbox:hover .iconImgs{

	opacity:1;

}



.business-location{

  position: absolute;

  left: 1rem;

  top: 1rem;

  z-index: 1;

  transform: translateX(-120%);

  opacity: 0;

  transition: all 300ms ease-in-out;

}



.hm-someIconsContainer .iconbox.active .business-location,

.hm-someIconsContainer .iconbox:hover .business-location{

	opacity:1;

  transform: translateX(0%);

}



.business-location li{

  font-weight: 700;

  font-size: 12px;

  text-transform: uppercase;

  padding-left: 5px;

  border-left: 2px solid var(--primary-color);

  margin-bottom: 4px;

}



.hm-someIconsContainer .iconbox section{

	transition:all 300ms ease-in-out;

	transform:translateY(calc(100% - 80px));

  color: #fff;

}



.hm-someIconsContainer .iconbox section .img-fluid{

	width:40px;

	margin-bottom:20px;

}



.hm-someIconsContainer .iconbox section h5{

	text-transform:uppercase;

	font-weight:700;

	letter-spacing:1px;

	color:#fff;

	margin-bottom:25px;

}



.hm-someIconsContainer .iconbox section .listContainer{

	opacity:0;

	transform:translateY(30px);

	transition-delay:200ms;

	transition:all 300ms ease-in-out;

	line-height:1.8;

}



.hm-someIconsContainer .iconbox.active section,

.hm-someIconsContainer .iconbox:hover section{

	transform:translateY(0px);

	opacity:1;

}

/* Business */



/* policy */

.policy-slider .swiper-slide{

    width: max-content;

}

.policy-slider .swiper-slide img{

    width: auto;

    height: 41vw;

    filter: grayscale(0.5);

}

/* policy */



/* csr */

.csr-container{

  background-color: #123628;

  color: #fff;

}

/* csr */



/* Video and growth */

.modal-title{

  font-weight: 700;

  color: var(--primary-color);

}



.videoth{

  translate: 0 15%;

  position: relative;

  z-index: 1;

}



.videoth::before{

  content: '';

  position: absolute;

  inset: 0;

  background-color: rgb(0 0 0 / 50%);

}



.videoth img{

  height: 440px;

  object-fit: cover;

}



.videoBtn{

  position: absolute;

  left: 50%;

  top: 50%;

  translate: -50% -50%;

  width: 40px;

  height: 40px;

  border: none;

  border-radius: 50%;

  background-color: var(--primary-color);

  color: #fff;

  transition: all 300ms ease-in-out;

  animation: breathe 800ms alternate infinite;

}



.videoBtn::before{

  content: '';

  position: absolute;

  inset: -10px;

  border-radius: 50%;

  border: 1px solid rgb(255 255 255 / 30%);

  z-index: -1;

  transition: all 300ms ease-in-out;

  transition-delay: 100ms;

  animation: breathe 800ms alternate infinite;

}



@keyframes breathe{

  100%{scale: 1.2;}

}



.videoBtn:hover{

  scale: 1.2;

}



.videoBtn:hover::before{

  scale: 1.2;

  border-color: #fff;

}

.viewmore {
  width: 100%;
  margin-top: 1.25rem;
}

.viewmore .button {
  text-transform: uppercase;
  color: var(--body-color);
  font-size: 67.5%;
  font-weight: 700;
  border: 0;
  background-color: transparent;
  padding: 0;
}



.viewmore .button.circular {

  width: 24px;

  height: 24px;

  font-size: 12px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background-color: var(--primary-color);

  color: #fff;

}



.viewmore .button.circular:hover {

  background-color: var(--secondary-color);

}



.newsBox section article h4 a:hover,

.viewmore .button:hover {

  color: var(--primary-color);

}



.hollow-us

{

    justify-content: center;

    display: flex;

    margin-top: 14px;

}

.hollow-us h3

{    

    display: flex;

    align-items: center;

    gap: 12px;

}

.hollow-us img

{

    width:40px;

    border-radius: 50%;	

}



.heading-xl{

    margin-bottom: 0;

    font-weight: 400;

    font-size: 3rem;

    line-height: 1;

    text-transform: uppercase;

}



.heading {

  display: table;

  position: relative;

  margin-bottom: 30px;

  z-index: 1;

  padding-top: 1.5rem;

}



.heading::before{

  content: '';

  position: absolute;

  left: 0;

  top: 0;

  width: 34px;

  height: 8px;

  background: url(../images/icons/decoration-dot.svg) no-repeat;

}



.heading.mx-auto::before{

  left: 50%;

  transform: translateX(-50%);

}



.heading h2,

.heading h4,

.heading h5,

.heading h6 {

  display: block;

}



.heading h2, .heading h1 {

  color: var(--primary-color);

  font-weight: 800;

}



.heading h2 strong{

  font-weight: 800;

}



.heading h3 {

  font-weight: 800;

}



.heading h4 {

  font-weight:800;

}



.heading h6 {

  font-weight: 400;

  letter-spacing: 2px;

}



.text-primary{

  color: var(--primary-color) !important;

}

.text-secondary{

	color:var(--secondary-color) !important;

}



.bg-primary{

  background-color: var(--primary-color) !important;

  color: var(--light);

}

.bg-secondary{

  background-color: var(--secondary-color) !important;

}



.bg-light{

    background-color: var(--light) !important;

}



.bg-light-gray{

  background-color: var(--light-gray) !important;

}



.bg-image{

  background: center / cover no-repeat fixed;

}



.bg-image::before{

  content: '';

  position: absolute;

  inset: 0;

  background-color: rgb(0 0 0 / 70%);

  z-index: -1;

}



.scroller{

  overflow: auto;

}



.scroller::-webkit-scrollbar {

  width: 5px;

}



/* Track */

.scroller::-webkit-scrollbar-track {

  box-shadow: inset 0 0 5px var(--light);

  border-radius: 10px;

}



/* Handle */

.scroller::-webkit-scrollbar-thumb {

  background: var(--secondary-color);

  border-radius: 10px;

}



/* Handle on hover */

.scroller::-webkit-scrollbar-thumb:hover {

  background: #000;

}



.readmore {

  width: 100%;

  margin-top: 2rem;

}



.readmore .button {

  position: relative;

  z-index: 1;

  display: table;

  padding: 13px 20px 10px;

  min-width: 130px;

  border-radius: 40px;

  color: var(--primary-color);

  background-color: transparent;

  border: 1px solid var(--primary-color);

  font-size: 14px;

  font-weight: 600;

  letter-spacing: 1px;

  text-align: center;

  text-transform: uppercase;

  transition: all ease-in-out 0.3s;

}



.readmore button {

  width: 100%;

  background: none;

}



.readmore .button:hover {

  color: #fff;

  background: var(--primary-color);

  border-color: transparent;

}



.readmore .button.text-white{

  color: var(--light) !important;

  border-color: var(--light);

}



.readmore .button.text-white:hover {

  color: var(--primary-color) !important;

  background: var(--light);

  border-color: transparent;

}



.readmore .button.solid.white:hover,

.readmore .button.solid {

  background-color: var(--primary-color);

  color: var(--light);

  border: none;

}



.readmore .button.solid.white,

.readmore .button.solid:hover {

  background-color: var(--light-gray);

  color: var(--primary-color);

  border: none;

}



.controls {

  position: absolute;

  width: 110px;

  height: 40px;

  right: 10px;

  bottom: 10px;

  z-index: 9;

}



.controls a {

  position: static;

  display: table;

  width: 100%;

  height: 50px;

  line-height: 50px;

  cursor: pointer;

  text-align: center;

  color: var(--primary-color);

  font-size: 13px;

  border-bottom: 1px solid rgb(0 0 0 / 20%);

  opacity: 1;

}



.controls a:last-child {

  border-bottom: none;

}



.controls a:focus,

.controls a:hover {

  color: var(--primary-color) !important;

  opacity: 1;

}



.multiply{

  mix-blend-mode: multiply;

}



/* key points */

.key-points .inner{

  padding: 0 25% 12.5vw 10%;

}

.benefits-list {

  width: 100%;

  max-width: 600px;

  margin: 0;

  padding: 0;

  list-style: none;

  line-height: 1.75;

}

.heading-md+.benefits-list {

  margin-top: 23px;

}



.benefits-list li {

  position: relative;

  padding: 1em 0 1em 1.5em;

  border-bottom: 1px solid rgb(0 0 0 / 7%);

}



.bg-primary .benefits-list li {

  border-bottom: 1px solid rgb(255 255 255 / 15%);

}



.benefits-list li::before {

  content: '';

  position: absolute;

  left: 0;

  top: 1.625em;

  display: block;

  width: 6px;

  height: 12px;

  background-image: url(../images/icons/bullet.svg);

  background-position: center;

  background-repeat: no-repeat;

  background-size: contain;

}

.bg-primary .benefits-list li::before{

  filter: brightness(50) grayscale(1);

}
.button.disabled1{
    cursor: context-menu;
    color: #636363;
    border: 1px solid #cccccc;
    background: #ccc;
}
.button.disabled1:hover{
    cursor: context-menu;
    color: #636363;
    border: 1px solid #cccccc;
    background: #ccc;
}


@media (min-width: 768px){

  .benefits-list li {

      padding: 1em 0 1em 1.5em;

  }

  .benefits-list li::before {

    top: 1.75em;

  }

}

/* key points */





/* benefits */

.benefitBox{

  margin: 15px 0;

}



.benefitBox section {

  border-radius: 5px;

  height: 100%;

	padding: 1rem;

  background: linear-gradient(to bottom right,var(--light),#dbefff);

}



.benefitBox section .img-fluid {

	width: 70px;

  margin-bottom: 1rem;

  padding: 1rem;

  border-radius: 50%;

  background: linear-gradient(to bottom right,var(--light),#dbefff);

  box-shadow: 3px 3px 3px var(--light), -3px -3px 3px #dbefff;

}



.benefitBox section p {

    margin-bottom: 0px;

    line-height: 1.3;

}

/* benefits */



.bg-circle::before{

  content: '';

  position: absolute;

  inset: 0;

  /* background: radial-gradient(circle at 50% -50%, var(--primary-color), var(--body-color)); */

  background-color: var(--primary-color);

  opacity: 0.1;

  clip-path: circle(60% at 90% -20%);

  z-index: -1;

  pointer-events: none;

}



.position-relative{

  z-index: 1;

}



/* testimonials */

.testimBox{

  height: auto;

}



.testimBox .inner{

  height: 100%;

  padding: 3rem;

  background: linear-gradient(to bottom right,var(--light),#dbefff);

  border-radius: 10px;

}



.quotation-mark{

  display: flex;

  align-items: center;

  justify-content: center;

  color: var(--primary-color);

  font-size: 3rem;

  line-height: 0;

  width: 50px;

  height: 50px;

  margin-bottom: 1rem;

  padding: 1rem 0 0;

  border-radius: 50%;

  background: linear-gradient(to bottom right,var(--light),#dbefff);

  box-shadow: 3px 3px 3px var(--light), -3px -3px 3px #dbefff;

}



.testim-name{

  display: block;

  margin-top: 1.25rem;

  color: var(--primary-color);

}

/* testimonials */



/* other section */

.otherBox .inner{

  display: block;

  height: 100%;

  padding: 1rem;

  background: linear-gradient(to bottom right,var(--light),#dbefff);

  color: var(--body-color);

  border-radius: 10px;

}

.otherBox .inner img{

  border-radius: 10px;

  margin-bottom: 1rem;

}

/* other section */



/* custom swiper controls */

.swiper-button-next, .swiper-button-prev{

  width: 40px;

  height: 40px;

  margin-top: -20px;

  border-radius: 50%;

  background: url(../images/arrow-left.png) center / 20px no-repeat var(--body-color);

  transition: all 300ms ease-in-out;

}



.swiper-button-next:hover, .swiper-button-prev:hover{

  background-color: var(--primary-color);

    scale: 1.2;

}



.swiper-button-next, .swiper-rtl .swiper-button-prev{

  transform: rotate(-180deg);

}



.swiper-button-next:after, .swiper-button-prev:after{

  display: none;

}



.bottom-control{

  top: calc(100% - 1.5rem);

}



.bottom-control.swiper-button-next{

  right: 13%;

}

.bottom-control.swiper-button-prev{

  left: 13%;

}



.swiper-pagination{

  bottom: 0 !important;

}



.swiper-pagination-bullet-active{

  background-color: var(--primary-color);

  width: 20px;

  border-radius: 10px;

}



.bar-controls{

  display: flex;

  position: relative;

  align-items: center;

  justify-content: space-between;

  padding: 10px;

}



.bar-controls .bar-arrows{

  position: relative;

  width: 100px;

  display: flex;

  align-items: center;

  gap: 10px;

}



.bar-controls .bar-arrows > div{

  position: static !important;

  margin-top: 0 !important;

  width: 40px;

  height: 40px;

  background-size: 22px;

}



.bar-controls .swiper-horizontal>.swiper-pagination-progressbar,

.bar-controls .swiper-pagination-progressbar.swiper-pagination-horizontal{

  position: static;

  width: calc(100% - 120px);

}



.bar-controls .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{

  background: linear-gradient(45deg,var(--secondary-color),var(--primary-color),var(--secondary-color));

}

/* custom swiper controls */



.certified{

  padding: 3rem 0;

}



.certified-seal .img-fluid{

  text-align: center;

  font-weight: 700;

  font-size: 14px;

}



.certified-seal .img-fluid img{

  margin: 0 auto 10px;

}



.certified-seal:not(:first-of-type) .img-fluid img{

  width: 100px;

}



.certified-seal:not(:first-of-type) .img-fluid{

  padding-top: 1rem;

  padding-bottom: 1rem;

  border: 1px solid rgb(255 255 255 / 12%);

  transition: all 300ms ease-in-out;

}



.certified-seal:not(:first-of-type) .img-fluid:hover{

  box-shadow: 0 1rem 3rem rgb(0 0 0 / 15%);

}



/*Footer*/

.footer-area {

  background: radial-gradient(circle at 50% -10%, var(--body-color), #000);

  color: #fff;

  position: relative;

  z-index: 1;

}



.footer-area::before{

  content: '';

  position: absolute;

  inset: 0;

  z-index: -1;

}



.footer-area a{color:#fff; font-size: 14px;}

.footer-area a:hover{color: var(--secondary-color);}



.footerAbout {

  font-size: 14px;

}



.footerAbout .footer-title{

  font-size: 11px;

  font-weight: 600;

  text-transform: uppercase;

  margin-bottom: 1.5rem;

}



.footerAbout .footerSocial {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 20px;

  margin-top: 2rem;

}



.footerAbout .footerSocial li a {

  color: #fff;

  display: block;

  width: 35px;

  height: 35px;

  line-height: 33px;

  border: 1px solid rgb(255 255 255 / 15%);

  border-radius: 50%;

  transition: all 300ms ease-in-out;

  text-align: center;

}



.footerAbout .footerSocial li a:hover {

  background-color: var(--light);

}



.footerSocial li a:hover .fa-facebook-f{

	color: var(--facebook);

}

.footerSocial li a:hover .fa-linkedin-in{

	color: var(--linkedin);

}

.footerSocial li a:hover .fa-twitter{

	color: var(--twitter);

}

.footerSocial li a:hover .fa-youtube{

	color: var(--youtube);

}

.footerSocial li a:hover .fa-whatsapp{

	color: var(--whatsapp);

}

.footerSocial li a:hover .fa-instagram{

	color: var(--instagram);

}



.footerBox ul li {

  margin: 8px 0;

}



.footerBox ul li a {

  position: relative;

  padding-bottom: 5px;

  display: inline-block;

  transition: all 300ms ease-in-out;

}



.footerBox .footerLinks li a:before {

  content: "";

  position: absolute;

  bottom: 0;

  left: 0;

  width: 0;

  border-bottom: 1px solid;

  transition: all 300ms ease-in-out;

}



.footerBox .footerLinks li a:hover:before {

  width: 100%;

}



.footer-area .bottom {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding-top: 3rem;

}



.footer-area .bottom ul {

  display: flex;

  justify-content: center;

  flex-basis: 0;

  flex-grow: 1;

}



.footer-area .bottom li {

  font-size: 12px;

  display: flex;

  margin: 0 10px;

  line-height: 1;

}



.footer-area .bottom p {

  display: flex;

  font-size: 12px;

  align-items: center;

  margin-bottom: 0;

  flex-basis: 0;

  flex-grow: 1;

}



.footer-area .bottom p:last-child {

  justify-content: flex-end;

}



.footer-area .bottom p img {

  width: 20px;

}



.button-top {

  background: rgb(70 70 70 / 32%);

  position: fixed;

  right: 20px;

  bottom: -40px;

  color: #ffffff;

  font-size: 13px;

  opacity: 0;

  width: 40px;

  height: 40px;

  line-height: 40px;

  border-radius: 50%;

  text-align: center;

  z-index: 99;

  cursor: pointer;

  transition: all 300ms ease-in-out;

}



.button-top:hover {

  background: var(--primary-color);

}

/*Footer*/



/* Inside page */

.pageHead{

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%,-50%);

  opacity: 0;

  transition: opacity 1s linear;

  z-index: 1;

  text-align: center;

}



.page-title{

  font-size: 5vw;

  font-weight: 700;

}



.breadcrumb{

  background-color: transparent;

  margin-bottom: 0;

  border-radius: 0;

  padding-left: 0;

  padding-right: 0;

  font-size: 12px;

  justify-content: center;

}



.breadcrumb li a, .breadcrumb-item+.breadcrumb-item::before{

  color: #fff;

  font-weight: 600;

}



.breadcrumb li a:hover{

  color: var(--primary-color);

}



.breadcrumb li.active{

  color: var(--primary-color);

}



/* Team wrapper */
.foundersBox .inner{
	/* display: flex;
	flex-wrap: wrap; */
	gap: 1.5rem;
  padding: 2rem;
  background-color: var(--light);
  border-bottom: 2px solid var(--primary-color);
  border-radius: 10px;
}

.foundersBox .picture img{
  border-radius: 10px;
  margin-bottom: 1rem;
}

.moreText {
  display: none;
}

.our-team {

  border-radius: 10px;

  height: 100%;

  padding: 2rem 0 3rem;

  background-color: var(--light);

  border-bottom: 2px solid var(--primary-color);

  text-align: center;

  overflow: hidden;

  position: relative;

}



.our-team .picture {

  display: inline-block;

  height: 130px;

  width: 130px;

  margin-bottom: 2rem;

  z-index: 1;

  position: relative;

}



.our-team .picture::before {

  content: "";

  width: 100%;

  height: 0;

  border-radius: 50%;

  background-color: var(--primary-color);

  position: absolute;

  bottom: 135%;

  right: 0;

  left: 0;

  opacity: 0.9;

  transform: scale(3);

  transition: all 0.3s linear 0s;

}



.our-team:hover .picture::before {

  height: 100%;

}

.our-team .picture::after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--primary-color);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.our-team .picture img {
  width: 100%;
  height: auto;
  border-radius: 50%;
  transform: scale(1);
  transition: all 0.9s ease 0s;
}

.our-team:hover .picture img {
  box-shadow: 0 0 0 14px #f7f5ec;
  transform: scale(0.7);
}

.team-designation .title {
  display: block;
  text-transform: capitalize;
}

.team-designation .name{

  font-weight: 700;

}



.our-team .knowmore {

  width: 100%;

  padding: 8px;

  margin: 0;

  color: #fff;

  background-color: var(--primary-color);

  position: absolute;

  bottom: -100px;

  left: 0;

  transition: all 0.5s ease 0s;

}



.our-team:hover .knowmore {

  bottom: 0;

}



.our-team .knowmore:hover {

  background-color: var(--body-color);

}

/* team card */

.teamBtns a{

  gap: 1rem;

  color: var(--body-color);

  font-weight: 700;

}

.teamBtns a:hover{

  background-color: rgb(11 158 231 / 8%);

  color: var(--primary-color);

}

/* Team wrapper */



.operationContainer .benefitBox section{

  padding: 20px 1rem;

}



.operationContainer .benefitBox section .img-fluid{

  width: 60px;

  padding: 8px;

  margin: 0 auto 1rem;

}



.operationContainer .benefitBox section p{

  letter-spacing: normal;

}



.hazardous-waste-handling{

  height: calc(95vh - (4vw + 1rem));

}



.handleBox .benefits-list li{

  padding: .5em 0 0.4em 1em;

}



.handleBox .benefits-list li:last-of-type{

  padding-bottom: 0;

  border-bottom: none;

}



.handleBox .benefits-list li::before{

  top: 1em;

}



/* csr start */

.imgBox{

  margin: 15px 0;

}



.imgBox .inner iframe{

  outline: 2px solid var(--light-gray);

  overflow: hidden;

}



.newsBox {

  margin: 15px 0;

}



.newsBox a {

  color: var(--primary-color);

  display: block;

  background-color: var(--light-gray);

  transition: all 300ms ease;

}



.newsBox a .img-fluid img {

  height: 300px;

  object-fit: cover;

}



.newsBox a article {

  padding: 3rem 1.6rem 2rem;

  background-color: #fff;

  transition: all 300ms ease-in-out;

  box-shadow: 0 10px 20px rgb(0 0 0 / 6%);

  position: relative;

  z-index: 1;

}



.newsBox a:hover article {

  background-color: var(--primary-color);

  color: #fff;

}



.newsBox a article h4 {

  font-weight: 800;

}



.newsBox a article p {

  font-weight: 500;

  margin-bottom: 0px;

  color: var(--secondary-color);

}

.newsBox a:hover article p{

  color: #fff;

}

/* csr end */

/* testimonials start */

.testim-card{

  width: 100%;

  height: auto;

  padding: 0 10px;

}

.testim-card .inner {

  color: inherit;

  outline: none;

  height: 100%;

  padding: 2.5rem;

  border-radius: 5px;

  background: linear-gradient(to bottom right, #002c71, #4a0060);

  color: #fff;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

}

/* hm projects */

.project-slide .inner{

  height: 100%;

  display: block;

  position: relative;

  color: var(--body-color);

  background-color: #fff;

  border-radius: 10px;

  text-align-last: left;

  overflow: hidden;

  transition: all 300ms ease-in-out;

}

.project-slide .inner:hover{

  box-shadow: 0 1rem 3rem rgb(0 0 0 / 10%);

}



.project-slide .inner .img-fluid{

  background-color: #000;

  filter: grayscale(0.5);

  height: 250px;

  border-radius: 10px 10px;

  overflow: hidden;

}



.project-slide .inner .img-fluid img{

  opacity: 0.75;

}



.project-slide .position-absolute{

  z-index: 2;

}



.project-slide .rera{

  right: 25px;

  top: 10px;

  padding: 4px 8px;

  font-size: 11px;

  border-radius: 20px;

  text-transform: uppercase;

  letter-spacing: 1px;

  background-color: var(--secondary-color);

  color: #fff;

}



.project-slide .project-details-box{

  padding: 1rem;

}



.project-slide .project-box-title{

  font-size: 1.5rem;

  font-weight: 800;

  color: var(--primary-color);

  margin-bottom: 1.5rem;

}



.project-slide .project-details-box li,

.project-slide .project-details-box li strong{

  display: flex;

  align-items: center;

  gap: 10px;

}



.project-slide .project-details-box li{

  font-size: 14px;

  text-transform: uppercase;

}



.project-slide .project-details-box li:not(:last-of-type){

  margin-bottom: 10px;

  padding-bottom: 10px;

  border-bottom: 1px dashed rgb(0 0 0 / 10%);

}



.project-slide .project-details-box li strong{

  max-width: 150px;

  flex: 0 0 150px;

}

.project-slide .project-details-box li strong i{

  width: 20px;

  text-align: center;

}



.project-slide .project-details-box li span{

  max-width: 200px;

  flex: 0 0 200px;

}



.gap-row {

    row-gap: 30px;

}

.gap-form-row {

    row-gap: 10px;

}

/* hm projects */

/* why choose us */

.whyUsBox section{

  height: 100%;

  padding: 2rem;

  display: flex;

  align-items: flex-start;

  gap: 1rem;

}



.whyUsBox .imgBox {

  flex: 0 0 100px;

  max-width: 100px;

  border-radius: 50%;

  padding: 1.5rem;

    background-color:#D8D3D3;

}



.whyUsBox section .imgBox svg path,

.whyUsBox section .imgBox svg circle{

	fill:none;

	stroke:var(--body-color);

	stroke-miterlimit:50;

	stroke-dasharray:2620;

	stroke-dashoffset:0;

  stroke-width: 8px;

}



.whyUsBox section:hover .imgBox svg path,

.whyUsBox section:hover .imgBox svg circle{

	fill:none;

	stroke:var(--body-color);

	-webkit-animation:path 5s infinite;

	animation:path 5s infinite;

}



@-webkit-keyframes path{

	0%{stroke-dashoffset:2620;}

	100%{stroke-dashoffset:0; stroke:none;}

}



@keyframes path{

	0%{stroke-dashoffset:2620;}

	100%{stroke-dashoffset:0; stroke:none; fill: var(--body-color);}

}



.whyUsBox .whyUsText h6 {

  margin-bottom: 15px;

  color: var(--body-color);

  font-size: 14px;

  font-weight:800;

  text-transform: uppercase;

}



.whyUsBox section p{

  margin-bottom: 0;

}

/* why choose us */

.bg-gray {

    background-color:#E4E4E4;

}

.iconBox .inner{

  display: flex;

  align-items: center;

  flex-direction: column;

  justify-content: center;

  gap: 10px;

}

.iconBox .ikon{

  width: 100px;

  height: 100px;

  border-radius: 50%;

    background-color: #D8D3D3;

  display: flex;

  align-items: center;

  justify-content: center;

}

.iconBox .ikon img, .iconBox .ikon svg {

    width: 25px;

}

/* Inside page */

.insideBanner{

  margin-top: 61px;

  position: relative;

  overflow: hidden;

  color: #fff;

}

.insideBanner::before{

  content: '';

  position: absolute;

  inset: 0;

  background-color: rgb(0 0 0 / 50%);

  z-index: 1;

}



.pageHead{

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%,-50%);

  opacity: 0;

  transition: opacity 1s linear;

  z-index: 1;

  text-align: center;

}



.page-title{

  font-size: 5vw;

  font-weight: 700;

}



.breadcrumb{

  background-color: transparent;

  margin-bottom: 0;

  border-radius: 0;

  padding-left: 0;

  padding-right: 0;

  font-size: 12px;

  justify-content: center;

}



.breadcrumb li a, .breadcrumb-item+.breadcrumb-item::before{

  color: #fff;

  font-weight: 600;

}



.breadcrumb li a:hover{

  color: var(--secondary-color);

}



.breadcrumb li.active{

  color: var(--secondary-color);

}



.project-logo{

  width: 220px;

  margin: -9rem auto 2rem;

  background-color: #fff;

  padding: 10px;

  border: 10px solid;

  border-color: var(--secondary-light-color) var(--gray);

  box-shadow: 0 10px 2rem rgb(0 0 0 / 15%);

}



.configuration {

	display: flex;

	border-top: 1px solid var(--secondary-color);

	border-bottom: 1px solid var(--secondary-color);

}



.configuration-box {

	border-right: 1px solid var(--secondary-color);

	padding: 1em 0;

	flex: auto;

	text-align: center;

	margin: 10px 0;

}



.configuration-box:nth-last-child(1) {

	border-right: none;

}



.configuration-box p {

	text-align: center;

}



/* amenities */

.amenities-img {

	width: 44px;

	margin: auto;

	/* filter: invert(1); */

}



.amenitiesBox .inner {

  height: 100%;

	padding: 2rem;

	align-items: center;

	background: #ffffff;

	color: #000;

	min-height: 78px;

	border: 1px solid rgb(0 0 0 / 10%);

}

.amenitiesBox .img-fluid {

	width: 44px;

	margin: auto;

	/* filter: invert(1); */

}

.amenitiesBox .d-flex .img-fluid {

  height: 100%;

  width: 60px;

  padding-right: 1rem;

  margin: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  border-right: 1px solid rgb(0 0 0 / 10%);

}



.amenitiesBox p {

	color: #000000;

	line-height: 1.1;

	margin-top: 8px;

	width: 100%;

	text-align: center;

	min-height: 52px;

	display: flex;

	justify-content: center;

	align-items: center;

}

.amenitiesBox .d-flex p {

  width: calc(100% - 61px);

  text-align: left;

  padding-left: 1rem;

  margin-top: 0;

  line-height: 1.4;

}

/* amenities */



.location-wrapper::before{

  content: '';

  position: absolute;

  inset: 0;

  background: url(../images/location-bg.png) center bottom / 100% no-repeat;

  opacity: 0.075;

  z-index: -1;

}

.whyUsBox.locationBox section{

  padding: 0 2rem 2rem;

}

.whyUsBox.locationBox:first-of-type section,

.whyUsBox.locationBox:last-of-type section{

  padding: 2rem;

}



.emptyBox{height: 60px;}

/* Inside page */

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

  .testim-card .inner {

    padding-left: 4rem;

    padding-right: 4rem;

  }

}



@media only screen and (max-width: 360px) {

  .testim-card .inner {

    padding: 20px 10px;

  }

}

.testim-card .inner::before {

  content: '\f10d';

  font: 900 4em 'Font Awesome 5 Free';

}



.testim-card .inner p {

  margin-bottom: 2rem;

}



@media only screen and (max-width: 640px) {

  .testim-card .inner p {

    font-size: 1.1rem;

  }

}



.testim-card .inner .testim-footer{

  display: flex;

  align-items: center;

  gap: 0px 1rem;

}



.testim-card .inner .client-img {

  width: 90px;

  border-radius: 50%;

  padding: 5px;

  background: var(--primary-color);

  background: linear-gradient(to bottom right, #9ec3ff, #a7ff70,

    #dd64ff);

  box-shadow: 3px 3px 3px rgb(46 97 163 / 67%), -3px -3px 3px rgb(125 53 155 / 60%);

}



.testim-card .inner .client-img img{

  background-color: #fff;

  border-radius: 50%;

  padding: 5px;

}



.testim-card .inner .client-name {

  font-weight: 600;

  font-size: 1.15em;

}

/* testimonials end */

/* Awards start */

.awards-card .award-card{

  margin: 15px 0;

}

.awards-card .award-card .card {

  text-align: center;

  border-radius: 5px;

  background: linear-gradient(to bottom right, #eff0f3, #ffffff);

  box-shadow: 3px 3px 3px #e8e6e6, -3px -3px 3px #ffffff;

  height: 100%;

  border: none;

  padding: 2rem 5rem;

  flex-direction: row;

  justify-content: space-between;

  align-items: center;

}



.awards-card .award-card .card .icon {

  position: absolute;

  width: 5rem;

}



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

  .awards-card .award-card .card .icon {

    width: 6rem;

  }

}



.awards-card .award-card .card .icon:first-child {

  left: 1rem;

}



.awards-card .award-card .card .icon:last-child {

  right: 1rem;

}



.awards-card .award-card .card .card-body {

  padding: 0;

}



@media only screen and (max-width: 640px) {

  .awards-card .award-card .card .card-body br {

    display: none;

  }

}



.awards-card .award-card .card .card-body .award-title {

  font-weight: 700;

}



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

  .awards-card .award-card .card .card-body .award-title {

    font-size: 20px;

  }

}



.awards-card .award-card .card .card-body p {

  color: var(--secondary-color);

  font-weight: 500;

}



.awards-card .award-card .card .award-yr {

  font-weight: 600;

}

/* Awards end */



/* industries start */

.industriesContainer{

  overflow: hidden;

  border-radius: 5px;

  background: linear-gradient(to bottom right, #eff0f3, #ffffff);

  box-shadow: 3px 3px 3px #e8e6e6, -3px -3px 3px #ffffff;

}

.indusText .inner{

  padding: 3rem;

  height: 100%;

}

/* industries end */

/* Inside page */



.form-group {

  margin-bottom: 20px;

}



.form-group>div {

  margin-top: 15px;

}



.form-group label {

  margin-bottom: 0;

  font-size: 13px;

  font-weight: 500;

}



.form-control {

  border-radius: 0;

  border: none;

  border-bottom: 1px solid rgb(0 0 0 / 16%);

  background: none;

  outline: none;

  padding-left: 0;

  padding-top: 0;

}



.form-control[readonly] {

  background: none;

}



.form-control.form-control-dark{

  border-bottom-color: rgb(255 255 255 / 15%);

  color: #fff;

}



select.form-control.form-control-dark{

  background-color: var(--primary-color);

}



.form-control.form-control-dark::placeholder{

  color: #8f8f8f;

}



.form-control:focus {

  box-shadow: none;

  border-bottom-color: var(--primary-color);

  background: none;

}

/* Contact */

.contactBox .inner {

  background: linear-gradient(to bottom right,var(--light), #dbefff);

  height: 100%;

  padding: 2.5rem;

  border-radius: 5px;

}



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

  .contactBox .inner {

    padding-left: 4rem;

    padding-right: 4rem;

  }

}



@media only screen and (max-width: 360px) {

  .contactBox .inner {

    padding: 20px 10px;

  }

}



.contactBox h4 {

  margin-bottom: 1rem;

  font-weight: 700;

}



.contactBox ul li{

  font-size: 14px;

  display: flex;

  gap: 10px;

  margin-bottom: 10px;

}

.contactBox ul li:last-child{margin-bottom: 0;}



.contactBox ul li i{

  color: var(--secondary-color);

}



.contactBox ul li a{

  color: var(--body-color);

}



.contactBox ul li a:hover{

  text-decoration: underline;

}

/* Contact us */



/* Blogs page */

.category-panel section {

    padding: 1rem;

}



.category-panel .inner section:not(:last-of-type),

.side-recentBlogs .recentBlogs-box:not(:last-of-type) {

    margin-bottom: .75rem;

}

.side-recentBlogs .recentBlogs-box a {

  display: flex;

  align-items: center;

  gap: 10px;

  color: var(--body-color);

  font-weight: 600;

  padding: 1rem;

  background-color: #fff;

  border-radius: 10px;

  border: 1px solid rgb(0 0 0 / 10%);

  line-height: 1.2;

  font-size: 14px;

}

.side-recentBlogs .recentBlogs-box a:hover {

  color: var(--secondary-color);

}



.side-recentBlogs a .img-fluid {

  border-radius: 5px;

  height: 80px;

  max-width: 100px;

  flex: 0 0 100px;

  overflow: hidden;

}



.blog-content-body img {

  margin: 1rem 0;

  border-radius: 10px;

}

.blog-content-body img{

  margin-bottom: 1rem;

  border-radius: 10px;

}



.list-inline-item{

  line-height: 1;

  font-weight: 600;

  font-size: 0.875rem;

}

.list-inline-item:not(:last-child){

  padding-right: 0.75rem;

  border-right: 1px solid rgb(0 0 0 / 15%);

}

/* Blogs */



/* customize modal */

.modal-backdrop.show{

  opacity: 1;

  background: rgb(0 0 0 / 90%);

  background: linear-gradient(-42deg, rgb(153 19 19 / 90%), rgb(35 66 96 / 95%));

  backdrop-filter: blur(5px);

}

/* customize modal */



/*transformation Animation*/

.leftTranslate {

  -webkit-transform: translate(-200px, 0);

  transform: translate(-200px, 0);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.rightTranslate {

  -webkit-transform: translate(200px, 0);

  transform: translate(200px, 0);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.topTranslate {

  -webkit-transform: translate(0, -200px);

  transform: translate(0, -200px);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.bottomTranslate {

  -webkit-transform: translate(0, 200px);

  transform: translate(0, 200px);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.doneTranslate {

  -webkit-transform: translate(0, 0);

  transform: translate(0, 0);

  opacity: 1;

}



.fadeOut {

  opacity: 0;

  visibility: hidden;

  pointer-events: none;

  -webkit-transition: all 1000ms ease-in-out;

  transition: all 1000ms ease-in-out;

}



.fadeIn {

  opacity: 1;

  visibility: visible;

  pointer-events: auto;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.zoomOut{

  transform: scale(0);

  transition: all .8s ease-in-out;

}



.zoomIn{

  transform: scale(1);

}

/*transformation Animation*/



.list li {
  margin-bottom: 10px;
}

.list li::marker{
  color: var(--primary-color);
}


.list,
.list {
  padding-left: 20px;
}