:root {
  
  --color-red: red;
  --color-orange: orange;
  --color-yellow: yellow;
  --color-green: green;
  --color-blue: blue;
  --color-purple: purple;
  --color-violet: violet;

  /* ÃƒÆ’Ã‚Â°Ãƒâ€¦Ã‚Â¸ÃƒÂ¢Ã¢â€šÂ¬Ã‚ÂÃƒâ€šÃ‚Â³ Loader background */
  --loader-bg: #000;
}


body {
  font-family: "Montserrat", sans-serif;
    color: #000;    
	font-size: 16px;
    font-weight: 400;
	line-height: 24px;
	margin: 0px;
	padding: 0px;
      overflow-x:hidden;
	
}

.pdl{ padding-left: 9% !important; padding-right: 9% !important;}

.result {
    line-height: 38px;
    font-size: 17px;
}

a, article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {
  font-family: "Montserrat", sans-serif;
	color: #000;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	margin: 0px;
	padding: 0px;
}
h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat", sans-serif;
    font-weight: 700;
    font-style: normal;
	line-height: 1.4em;
    color: #000;
}

.testimonial-section {
      max-width: 1200px;
      margin: auto;
      padding: 40px 0px;
      background: #fff;
      border-radius: 12px;
    }

    .testimonial-title {
      text-align: center;
      font-size: 2em;
      margin-bottom: 30px;
      color: #333;
    }

    .testimonials {
      display: flex;
      flex-wrap: wrap;
      gap: 17px;
      justify-content: center;
    }

    .testimonial {
      background: #dae4e5;
      padding: 20px;
      border-radius: 10px;
      width: 49%;
      box-sizing: border-box;
      position: relative;
    }

    .testimonial img {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      object-fit: cover;
    }

    .testimonial .name {
      font-weight: bold;
      margin-top: 10px;
      color: #222;
    }

    .testimonial .role {
      font-size: 0.9em;
      color: #777;
    }

    .testimonial .message {
      margin-top: 15px;
      font-size: 0.95em;
      color: #555;
      line-height: 1.5;
      position: relative;
      padding-left: 30px;
    }

    .testimonial .message::before {
      content: "\201C";
      font-size: 2em;
      color: #ccc;
      position: absolute;
      left: 0;
      top: 0;
    }

    @media (max-width: 768px) {
      .testimonial {
        width: 100%;
      }
    }

a {
	outline: 0;
	color: #222;
	-webkit-transition: all .25s ease-in;
	-moz-transition: all .25s ease-in;
	-ms-transition: all .25s ease-in;
	-o-transition: all .25s ease-in;
	transition: all .25s ease-in;
    text-decoration: none;
      font-family: "Montserrat", sans-serif;

}
a:hover {
	color: #0a1729;
	text-decoration: none;
}
.btn {
	outline: 0;
	-webkit-transition: all .25s ease-in;
	-moz-transition: all .25s ease-in;
	-ms-transition: all .25s ease-in;
	-o-transition: all .25s ease-in;
	transition: all .25s ease-in;
	cursor: pointer;
}
button:focus {
	outline: none;
}
.container {
    max-width: 1260px;
    width: 100%;
    margin: 0 auto;
    padding: 0px;
}
.main_section {
	width: 100%;
	margin: 0px;
	padding: 80px 0;
}

/******* Header ************/

/******* Back-to-top ************/
.back-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 54px;
	height: 54px;
	display: block;
	text-decoration: none;
	-webkit-border-radius: 35px;
	-moz-border-radius: 35px;
	border-radius: 35px;
	display: none;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	z-index: 9999;
	font-size: 21px;
	padding: 11px 0;
	background-color: #fbc508;
	border-color: #fbc508;
}
.btn-dark:hover {
	color: #fff;
	background-color: #fbc508;
	border-color: #fbc508;
}
/******* Menu ************/
.top_menu{
    position: absolute;
    top: 0;
    z-index: 1034;
    padding: 9px 12px 30px;
    background-color: #ffffff;
}

.home-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.logo {
      width: 12%;
    padding: 0;
    text-align: center;
}
.home-logo {
    width: 100%;
}
.home-menu  span {
    color: #fff;
}

.menu-bar{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 6%;
    padding-top: 17px;
}

.logo img{
    width: 100%;
    transition: 2s;
    -webkit-transition: 2s;
    text-align: center;
}

.cus-menu {
    display: flex;
    align-items: center;
    width: 70%;
}

.vg-nav>ul>li>a {
    font-size: 16px;
    line-height: 1.2;
    display: block;
    color: #000000 !important;
    text-decoration: none;
    font-weight: 500;
    border-radius: 7px;
    letter-spacing: 0px;
    position: relative;
    transition: 2s;
    -webkit-transition: 2s;
    padding-right: 13px;
}

.vg-nav>ul>li {
    padding: 6px 1px;
}

.vg-nav .dropdown ul li a {
    text-align: left;
}
.vg-nav .dropdown ul li a {
    text-align: left;
    text-transform: uppercase;
    font-size: 13px;
    padding: 7px;
}
.vg-nav>ul>li.active a, .vg-nav>ul>li a:hover {
    color: #fff;

}
.vg-nav>ul>li a:before{
    content: '';
    background: #fff;
    height: 1px;
    width: 0%;
    position: absolute;
    bottom: -4px;
    opacity: 0;
    transition: 1s;
    -webkit-transition: 1s;
}
.vg-nav>ul>li.active a:before{
    content: '';
    background: #fff;
    height: 1px;
    width: 100%;
    position: absolute;
    bottom: -4px;
    opacity: 1;
    
}
.vg-nav>ul>li a:hover:before{
    content: '';
    background: #fff;
    height: 1px;
    width: 100%;
    position: absolute;
    bottom: -4px;
    opacity: 1;
}

.vg-nav .dropdown ul li a:hover{
    color: #000;
}


.book {
    width: 44%;
}

.book a {
    background: #078f96;
    padding: 12px 13px;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #078f96;
    border-radius: 6px;
    font-size: 14px;
    margin-left: 12px;
}
.book a:hover{
    background: #078f96;
    color: #fff;
    border: 1px solid #33638a;
}
.book a i{
margin-right: 4px;
}
.contact a{
    background: #c79e46;
    padding: 8px 22px;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #254864;
    border-radius: 50px;
    font-size: 19px;
    margin-left: 12px;
}
.contact a i{
    margin-right: 4px;
}


.header-social {
    display: flex
;
}
.header-social a{
color: #fff;
    font-size: 18px;
    margin-right: 17px;
}
.fixed-header {
    position: fixed;
    top: 0;
    z-index: 9;
    transition: 2s;
    -webkit-transition: 2s;
    background: #ffffff;
}

/******* Slider ************/

/******* banner ************/
.banner {
    padding: 0px;
    position: relative;
    z-index: 0;
}
/* .banner::before{
    content: '';
    background: #0000004f;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;

} */

.cus-banner-text {
    position: absolute;
    bottom: 0px;
    z-index: 9;
    left: 11px;
}
.cus-banner-text p{
    color: #fff;
    font-weight: 400;
    font-size: 14px;
}
.banner .carousel-caption {
    text-align: left;
    bottom: 40px;
    top: 0;
    padding: 0px;
    display: flex !important;
    flex-wrap: wrap;
    align-items: self-end;
    justify-content: start;
    left: 3%;
    right: 5%;
    z-index: 9;
}

.banner .carousel-caption::after{
     content: '';
    background-image: linear-gradient(to top, rgb(0 0 0), #00000000);
    position: absolute;
    bottom: -50px;
    width: 109%;
    height: 300px;
    left: -40px;
    z-index: -1;
}


.banner-text h1{
color: #fff;
    font-size: 60px;
    font-weight: 800;
    line-height: 66px;

}
.banner-text a{
        background: #078f96;
    padding: 8px 18px;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #078f96;
    border-radius: 6px;
    font-size: 19px;
    margin-left: 12px;
    text-transform: uppercase;
    display: inline-block;
}
.banner-text a:hover{
        background: #254864;
            border: 1px solid #254864;
}



.banner-text p{
    color: #fff;
    font-size: 20px;
    width: 70%;
    font-weight: 200;
}


.banner .carousel-item img{
    height: 100vh;
    object-fit: cover;
}
.carousel-indicators{
    z-index: 99;
}
.carousel-indicators [data-bs-target]{
    width: 7px;
    height: 7px;
    border-radius: 30px;
    border: 0px solid #fff;
}

.carousel-control-next {
    right: 0;
    z-index: 9;
}
.carousel-indicators {

    justify-content: right;
    padding: 0;
    margin-right: 6%;
    margin-bottom: 1rem;
    margin-left: 15%;
    list-style: none;
    bottom: 20px;
}

.carousel-indicators .active {
    opacity: 1;
    width: 40px !important;
}
.carousel-control-prev{
    position: absolute;
    width: 30px;
    height: 30px;
    left: 86%;
    bottom: 0px;
    top: 92.8%;
    z-index: 999;
}

.carousel-control-next{
    position: absolute;
    width: 30px;
    height: 30px;
    bottom: 0px;
    top: 92.8%;
    right: 3%;
    z-index: 999;
}
.payment-section {
    background: linear-gradient(to right, #d8c950, #3cbf9a); /* Gold to Teal */
    padding: 1.5rem 0;
}

.payment-list {
    display: grid
;
    grid-template-columns: repeat(4, 1fr);
}

.payment-box {
    display: flex
;
    align-items: center;
}
.payment-box img{
    margin-right: .5rem;
    filter: invert(1);
    width: 65%;
}
.payment-text{

}
.payment-text p{
    color: #fff;
    font-weight: 600;
    margin-bottom: 0;
}

.about-box {
    position: relative;
}
.tm-sc-funfact {
transition: all 0.3s ease;
    position: absolute;
    padding: 25px 15px 30px 15px;
    background-color: #078f96;
    border-radius: 10px 10px 0px 10px;
    border-style: solid;
    border-width: 0px 0px 0px 0px;
    width: 216px;
    --container-widget-width: 236px;
    --container-widget-flex-grow: 0;
    bottom: 20px;
    z-index: 2;
    left: -40px;
}
.tm-sc-funfact::before {
    position: absolute;
    right: -20px;
    bottom: 0;
    border-left: 20px solid #078f96;
    border-top: 20px solid transparent;
    content: "";
}
.element-left {
float: left;
    margin-right: .8rem;
    margin-bottom: 1.5rem;
}
.funfact-icon {
    display: inline-block;
    transition: all 0.3s ease-in-out;
}

.funfact-icon i {
    color: #fff;
    font-size: 2.2em;
    line-height: 1.2em;
}
.counter {
    color: #fff;
    font-size: 45px;
    margin: 0px 0px 0px 0px;
    margin-top: 0;
    transition: all 0.3s ease;
    font-weight: 700;
}
.title {
    font-size: 15px;
    margin: 0px 0px 0px 0px;
    transition: all 0.3s ease;
    color: #fff;
}

.main-title {
    padding-right: 44px;
    padding-left: 0;
    position: relative;
    color: #078f96;
    font-weight: 600;
    margin-bottom: 22px;
    display: inline-block;
    text-transform: uppercase;
}
.line-left {
    width: 31px;
    height: 6px;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -khtml-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
    right: 0;
}
.line-left:before {
    content: '';
    background-color: #078f96;
    position: absolute;
    height: 2px;
        width: 100%;
    top: 0;
    right: 0;
        left: 0;
}

.line-left:after{
    content: '';
    background-color: #078f96;
    position: absolute;
    height: 2px;
        width: 17px;
    bottom: 0;
        left: 0;
}
.about-right-text h3{ 
    font-weight: 700;
}

.connect {
    width: 50%;
}
.connect h3{
    color: #fff;
}
.connect p{
    color: #fff;
    width: 60%;
    margin-bottom: 28px;
}
.connect .form-control{
    padding: .675rem .75rem;
    width: 60%;
    border: 1px solid #fff;
    background-color: #fff;
    color: #000;
}
.connect .btn-primary {

    border-radius: 6px;
   background-color: #078f96;
    border-color: #078f96;
    color: #fff;
    padding: 8px 25px;
}
.connect .btn-primary:hover{
    background-color: #078f96;
    border-color: #078f96;
    color: #fff;
}

.connect input::placeholder{
    color: #000;
}
.media {
    display: -ms-flexbox;
    display: flex
;
    -ms-flex-align: start;
    align-items: flex-start;
}
.cus-border {
    padding: 3rem 0;
    border-top: 1px solid #66666642;
    margin-top: 3rem;
}
.media-body h2{
    font-weight: 700;
    margin-bottom: 0;
}
.butn{
    background: #07878e;
    padding: 10px 14px;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #078f96;
    border-radius: 6px;
    font-size: 15px;
    margin-left: 12px;
    text-transform: uppercase;
    font-weight: 600;
    display: block;
    text-align: center;
}
.butn:hover{
        background: #078f96;
        border: 1px solid #254864;
        color: #FFF;
}
.about-right-text {
    padding: 1rem 85px 1px 0px;
}
.card-style1 {
  position: relative;
  overflow: hidden;
  border: none;
  border-radius: 5px;
}
.card-style1 img{
height: 30rem;
    object-fit: cover;
}
.card-style1 .service-data {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 22px 30px 22px 40px;
background-color: #078f96eb;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(19, 191, 54, 0.95)',endColorStr='rgba(131, 236, 56, 0.95)');
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  transition: all 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.card-style1 .card-body {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(40, 92, 177, 0.83);
  padding: 45px 40px;
  transition: all 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
  transform: translateY(100%);
  border-radius: 5px;
}
.card-style1 .card-body .service-inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  margin-bottom: 20px;
}
.service-inner h3 a{
    font-size: 1.5rem;
    font-weight: 600;
}

.card-body .butn{
    background: #fff;
    padding: 10px 17px;
    color: #078f96;
    font-size: 15px;
    border: 1px solid #fff;

    font-size: 16px;

}



.card-style1 .card-body .service-title {
  margin-bottom: 0;
  font-size: 22px;
}
.card-style1:hover .service-data {
  transform: translateY(100%);
  opacity: 0;
}
.card-style1:hover .card-body {
  transform: translateY(0%);
  opacity: 1;
}
@media screen and (min-width: 1330px) {
  .card-style1 .service-data {
    padding: 22px 20px 22px 30px;
  }
	
	.book a {
    background: #078f96;
    padding: 12px 7px !important;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #078f96;
    border-radius: 6px;
    font-size: 16px !important;
    margin-left: 12px;
}
}
@media screen and (max-width: 991px) {
  .card-style1 .card-body {
    padding: 15px 24px;
  }
  .card-style1 .service-data {
    padding: 22px 12px 22px 18px;
  }
	
}
@media screen and (max-width: 767px) {
  .card-style1 .card-body {
    padding: 45px 40px;
  }
}
.service-text h2{
    font-weight: 700;
    font-size: 1.4rem;
    line-height: 1.6rem;
}
.book a {
    background: #078f96;
    padding: 12px 7px;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #078f96;
    border-radius: 6px;
    font-size: 12px;
    margin-left: 12px;
}


.service-box {
    margin-bottom: 2rem;
}

.card-style1 .card-body  i{
    color:#FFF;
    font-size: 35PX;
}
.lh-1 I{
       color:#FFF;
          font-size: 35PX;
}
.our-process {
    background-color: #dae4e5;
}
.our-process-text{

}
.our-process-text span{
        color: #078f96;
        text-transform: uppercase;
        font-weight: 500;
}
.our-process-text h2{
    font-weight: 700;
    font-size: 3rem;
}
.process-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3rem;
    margin-top: 4rem;
    margin-right: 52px;
}

.process-line {
  position: relative;
  z-index: 1;
  text-align: center;
}
.w-40px {
    width: 40px;
}
.process-line:before {
position: absolute;
    width: 70%;
    height: 0;
    content: "";
    left: 15%;
    top: 110px;
    z-index: -1;
    opacity: 0.1;
    border-top: 2px dashed #000;
}
.process-style1 {
  position: relative;
  
}
.process-style1 .icon {
  position: relative;
  display: flex;
  width: 88px;
  height: 88px;
  background: linear-gradient(to right, #d8c950, #3cbf9a);
  text-align: center;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  margin: 0 auto 30px;
}
.process-style1 .icon .number {
  top: -8px;
  right: -8px;
  width: 35px;
  height: 35px;
  font-size: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  border: 3px solid #fff;
  background: #078f96;
  color: #fff;
}
.process-style1.before-after-circle:before {
  left: -24px;
}
.process-style1.before-after-circle:after,
.process-style1.before-after-circle:before {
  content: "";
  top: 36px;
  width: 14px;
  height: 14px;
  border: 5px solid #ffc64d;
  position: absolute;
  border-radius: 50%;
  padding: 5px;
  animation: zoomInOut 4s infinite cubic-bezier(0.66, 0, 0, 1);
  background: #4990f3;
}
.after-circle:after {
  content: "";
  top: 36px;
  width: 14px;
  height: 14px;
  border: 5px solid #ffc64d;
  position: absolute;
  border-radius: 50%;
  padding: 5px;
  animation: zoomInOut 4s infinite cubic-bezier(0.66, 0, 0, 1);
  background: #4990f3;
}
.process-style1.before-after-circle:after,
.after-circle:after {
  right: -24px;
}
@keyframes zoomInOut {
  0% {
    -webkit-transform: scale(0.35);
    transform: scale(0.35);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.35);
    transform: scale(0.35);
  }
}
.process-left-shape {
  position: absolute;
  height: 50px;
  width: 50px;
  background-color: #ffc64d;
  left: 0px;
  top: 24%;
}
.process-left-shape:before {
  position: absolute;
  height: 30px;
  width: 30px;
  background-color: #4990f3;
  right: -14px;
  top: -43px;
  content: "";
}
.process-left-shape:after {
  position: absolute;
  height: 20px;
  width: 20px;
  background-color: #d5d5d5;
  right: -36px;
  top: 4px;
  content: "";
}
@media screen and (max-width: 991px) {
  .process-line:before {
    display: none;
  }
  .before-after-circle:after,
  .before-after-circle:before {
    display: none;
  }
  .after-circle:after {
    display: none;
  }
  .process-style1 .icon {
    margin-bottom: 0 auto 20px;
  }
}
.process-style2 .icon {
  width: 150px;
  height: 150px;
  background-color: #4990f3;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-bottom: 40px;
}
.process-style2 .icon:before {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  border: 1px solid #f2f2f2;
  border-radius: 50%;
}
.process-style2 .icon .number {
  position: absolute;
  top: -30px;
  right: -20px;
  width: 65px;
  height: 65px;
  background-color: #ffc64d;
  border-radius: 50%;
  font-weight: 500;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
.process-style2 .dots:after {
  content: "............";
  font-size: 60px;
  color: #efeae4;
  position: absolute;
  right: -153%;
  top: 6%;
  z-index: 0;
}
@media screen and (max-width: 1399px) {
  .process-style2 .dots:after {
    right: -138%;
  }
  .process-style2 .icon .number {
    width: 55px;
    height: 55px;
    top: -20px;
  }
}
@media screen and (max-width: 1199px) {
  .process-style2 .dots:after {
    display: none;
  }
}
.content h5{
    font-weight: 700;
}

.calculator{
    background-image: url(../images/bg-02.jpg);
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    padding: 120px 0;
    position: relative;
    z-index: 1;
}

.calculator:before{
        content: '';
    background: #00000094;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
}

.calculator-text span{
    text-transform: uppercase;
    color: #fff;
    font-weight: 600;
}

.calculator-text h2{
    color: #fff;
    font-weight: 700;
    font-weight: 3rem;
    margin-bottom: 3rem;
}
.accrue-field-amount p {
    margin: 0 0 20px;
}

.accrue-field-amount label {
font-weight: bold;
    font-size: 16px;
    display: inline-block;
    color: #fff;
    width: 100%;
}

.accrue-field-amount input {
    min-height: 46px;
        width: 90%;
    border-radius: 0;
    display: block;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.bg-primary {
    background: linear-gradient(to right, #d8c950, #3cbf9a);
}

.results-label {
    margin-bottom: 1rem;
    display: block;
    text-align: left;
    font-size: 22px;
    color: #fff;
    font-weight: bold;
}


.results>p {
    display: inline-block;
    width: 49%;
    font-size: 18px;
    margin-bottom: 2rem;
    font-weight: 500;
    line-height: 1.5;
}
.right-calculator {
    margin: 8rem 0 0 0;
}

small {
    color: #fff;
}

    .ps-xl-10, .px-xl-10 {
        padding-left: 5.5rem;
    }


.accordion-style .card {
  background: transparent;
  box-shadow: none;
  margin-bottom: 15px;
  margin-top: 0 !important;
  border: none;
}
.accordion-style .card:last-child {
  margin-bottom: 0;
}
.accordion-style .card-header {
  border: 0;
  background: none;
  padding: 0;
  border-bottom: none;
}
.accordion-style .btn-link {
  color: #254864;
  position: relative;
  display: block;
  width: 100%;
  text-align: left;
  white-space: normal;
  box-shadow: none;
  padding: 15px 55px;
  text-decoration: none;
      font-weight: 600;
}
.accordion-style .btn-link:hover {
  text-decoration: none;
}
.accordion-style .btn-link.collapsed {
  background: linear-gradient(to right, #d8c950, #3cbf9a);
      
      color: transparent;
    background-clip: text;
    
}
.accordion-style .btn-link.collapsed:after {
  content: "+";
  position: absolute;
  top: 50%;
  left: 0;
  font-size: 1rem;
  color: #254864;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  box-shadow: 8px 8px 30px 0 rgba(0, 0, 0, 0.12);
}
.accordion-style .btn-link:after {
  content: "-";
  position: absolute;
  top: 50%;
  left: 0;
  font-size: 1rem;
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #254864;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  box-shadow: 8px 8px 30px 0 rgba(0, 0, 0, 0.12);
}
.accordion-style .card-body {
  padding-top: 0px;
  padding-left: 3.5rem;
  padding-bottom: 0;
}
.accordion-style .card-body:before {
  position: absolute;
  content: "";
  border-style: dashed;
  border-width: 0 0 0 1.2px;
  border-color: #254864;
  left: 20px;
  top: 0;
  z-index: 1;
  bottom: 0;
}
@media screen and (max-width: 767px) {
  .accordion-style .btn-link {
    padding: 15px 40px 15px 55px;
  }
}
@media screen and (max-width: 575px) {
  .accordion-style .btn-link {
    padding: 15px 30px 15px 55px;
  }
  
  .process-style1 {
    position: relative;
    margin-top: 32px;
}
	.main_section {
    width: 100%;
    margin: 0px;
    padding: 30px 0;
}
	.pdl {
    padding-left: 3% !important;
    padding-right: 3% !important;
}
	.right-calculator {
    margin: 1rem 0 0 0;
}
	.fixed-contact-bar{ display: none; }
	
	.butn {
    background: #07878e;
    padding: 12px 20px;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #078f96;
    border-radius: 6px;
    font-size: 18px;
    margin-left: 12px;
    text-transform: uppercase;
    font-weight: 600;
    display: block;
    text-align: center;
    margin: 9px;
    margin-bottom: 21px;
}
}
.client {
    background: #f1f1f1;
}

.client-logo {
margin: 2rem 1rem;
    background: #fff;
    padding: 0 1rem;
}
.client-logo img {
width: auto !important;
    height: 100px;
    object-fit: contain;
}






.footer{
    background: linear-gradient(to right, #d8c950, #3cbf9a);
    position: relative;
    z-index: 1;
    padding: 80px 0 70px;
}
.footer-logo{
    position: absolute;
    z-index: -1;
    /* width: 100%; */
    top: 30px;
    left: 505px;


}
.footer-logo img{
    opacity: .2;
    width: 740px;
    height: 330px;
}
.footer-box {
    display: flex
;
    flex-wrap: wrap;
}


.footer-menu{
    width: 25%;
}
.footer-menu ul{ 

}
.footer-menu ul li{ 
    list-style-type: none;
    margin-bottom: 12px;
}
.footer-menu ul li a {
    color: #fff;
    font-size: 16px;
    font-weight: 400;
}

.footer-address{
    width: 25%;
}
.footer-address p{
    font-size: 16px;
    color: #fff;
}
.footer-address p a{
    font-size: 16px;
    color: #fff;
    font-weight: 400;
}
.copy {
    display: flex
;
    justify-content: space-between;
    margin: 70px 0 0 0;
    border-top: 1px solid #ddddddc7;
    padding: 3rem 0 0 0;
}
.footer-social a{
    color: #fff;
    margin-right: 9px;
    font-size: 20px;
}
.footer-social a svg{
    height: 20px;
    width: 20px;
}
.copy-right {
    display: flex
;
}
.copy-right p{
    color: #fff;
}
.priviacy {
    margin-left: 40px;
}
.priviacy p a{
    color: #fff;
    margin: 0px 5px;
}

.inner-banner .carousel-item img {
    height: 80vh;
    margin-top: 7%;
}
.loan-type ul li {
  margin-bottom: 15px;
}
.loan-type ul li a {
  display: block;
  box-shadow: 0px 0px 23px 0 rgba(0, 0, 0, 0.12);
  padding: 16px 18px;
  transition: all 0.5s ease;
  border-radius: 5px;
}
	.loan-type ul li.active a {
  color: #ffffff !important;
  border-color: #254864;
  background: linear-gradient(to right, #d8c950, #3cbf9a);
}
.loan-type ul li a:hover {
  color: #078f96;
}
.modal-backdrop {
  z-index: 99999;
}
.modal {
  z-index: 999999;
}
.icon-gallery .d-table {
  margin-top: 30px;
}
.bg-secondary {
    background: #078f96 !important;
}

.display-14 {
    font-size: 2.5rem;
}
.bg-white {
    background-color: #fff !important;
}
.separator-line-horrizontal-full {
    width: 100%;
    height: 1px;
}
.opacity4 {
    opacity: .4;
}
.list-unstyled li a{
    font-weight: 500;
}
.sidebar .widget {
    box-shadow: 8px 8px 30px 0 rgba(0, 0, 0, 0.12);
    border-radius: 5px;
}

.social-icon-style2 a {
    display: inline-block;
    font-size: 13px;
    text-align: center;
    color: #ffffff;
    background: #254864;
    height: 35px;
    line-height: 35px;
    width: 35px;
    border-radius: 50%;
    border: 1px solid #254864;
}

.social-icon-style2 a:hover {
    color: #254864;
    background: #fff;
    border: 1px solid #254864;
}

.service-detail{
    padding-left: 2rem;
}
.service-detail img{
    border-radius: 6px;
    margin-bottom: 1rem;
}

.service-content {
    margin: 2rem 0 0 0;
}

.card-style4 {
    border: none;
    box-shadow: 8px 8px 30px 0 rgba(0, 0, 0, 0.12);
    border-radius: 5px;
    padding: 1rem;
}

.display-xl-16 {
    font-size: 2.3rem;
    color: #078f96 !important;
}
.card-body .text-secondary{
    color: #254864 !important;
}
.bottom-services{

}
.bottom-services h4{
    font-weight: 600;
}

.list-unstyled {
    padding-left: 0;
    list-style: none;
}
.list-style2 li {
    line-height: 24px;
    position: relative;
    padding-left: 30px;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
.list-style2 li:before {
    content: '';
    position: absolute;
    left: 4px;
    top: 10px;
    width: 8px;
    height: 8px;
    background: #f99218;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -o-border-radius: 100px;
    border-radius: 100px;
    z-index: 2;
}
.list-style2 li:after {
    content: '';
    position: absolute;
    left: 0px;
    top: 6px;
    width: 16px;
    height: 16px;
    background: #fff;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -o-border-radius: 100px;
    border-radius: 100px;
    z-index: 1;
    border: 1px solid #f99218;
}
.bottom-services img{
    height: 100%;
    object-fit: cover;
}
.loan-section .butn{
    margin-left: 0;
}
.wp-according{
    margin-top: 30px;
}

.wp-according .accordion {
    display: flex
;
    height: 55vh;
    position: relative;
    overflow: hidden;
    margin-bottom: 40px;
}
ol, ul {
    padding-left: 0rem;
}
  
  .wp-according .accordion .item {
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    flex: 2;
    transition: flex 400ms;
    z-index: 7;
    position: relative;
  }
  .wp-according .accordion .item::before{
    content: '';
    background: #00000036;
    width: 100%;
    height: 100%;
    position: absolute;

  }
  
  .wp-according .accordion .item:hover {
    flex: 3;
  }
  
  .bg-barcelona {
    background-image: url(../images/team-1-3.webp);
  }
  
  .bg-sydney {
    background-image: url(../images/team-1-6.webp);
  }
  
  .bg-venice {
    background-image: url(../images/team-2.jpg);
  }
  
  .bg-singapore {
    background-image: url(../images/team-6.jpg);
  }
  

  .overlay {
    position: absolute;
    width: 100%;
    top: 89%;
    transition: 2s;
    -webkit-transition: 1s;
}
.wp-according .accordion .item:hover   .overlay{
    top: 35%;
}

 .overlay-inner{
    padding: 10px;
 } 
  .overlay-inner h3{
    color: #fff;
    font-size: 24px;
    line-height: 26px;
  }
  .overlay-inner p{
    color: #fff;
    margin: 0 0 5px;
  }
  .overlay-inner p a{
    color: #fff;
    margin: 0 0 8px;
    display: inline-block;
  }

  .overlay-inner ul li{
    display: inline-block;
  }
  .overlay-inner ul li a{
    display: inline-block;
    font-size: 16px;
    line-height: 32px;
    padding: 5px;
    border: 1px solid #fff;
    border-radius: 100px;
    width: 40px;
    height: 40px;
    text-align: center;
    color: #fff;
  }
  .athelete-team {
    display: flex;
    flex-wrap: wrap;
}

.athelete-team-box {
    width: 50%;
    padding: 0 15px;
    display: flex;
}
.athelete-team-img {
    width: 50%;
}
.athelete-team-img img{
    height: 380px;
    object-fit: cover;
    width: 100%;
}

.athelete-texm-text {
    width: 50%;
    background: #f7f4f4;
    padding: 54px 25px 0 30px;
}
.athelete-texm-text h4 {
    font-size: 19px;
    margin-bottom: 4px;
}
.athelete-texm-text p span {
    margin-bottom: 0px;
    font-weight: 600;
}
.athelete-texm-text p{
    margin: 10px 0;
}
.news-block-three .inner-box {
    position: relative;
    background: #fff;
}

.news-block-three .inner-box .image-box {
    position: relative;
}
.news-block-three .inner-box .image-box .image {
    overflow: hidden;
}
.overlay-anim:before {
    background: rgba(255, 255, 255, 0.3);
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 0;
    opacity: 1;
    z-index: 9;
    pointer-events: none;
}
.overlay-anim:hover:before {
    height: 100%;
    opacity: 0;
    -webkit-transition: all 400ms linear;
    transition: all 400ms linear;
}

.wp-contact1 {
    margin: 0px;
    padding: 60px 0;
    position: relative;
    z-index: 0;
    background-image: linear-gradient(100deg, #f7f7f7 34%, #078f96 100%);
}
.wp-contact1 h2{
    font-size: 50px;
    line-height: 55px;
}

.about-bg {
    position: absolute;
    left: 40px;
    top: 120px;
    width: 50%;
    z-index: -1;
}
.contact-page {
    width: 80%;
    margin: 30px auto 0;
}

.contact-page .form-control {
    display: block;
    width: 100%;
    padding: .775rem .75rem;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d5d4d4;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.wp-phone{
    padding: 60px 0 30px;
}
.main-phone {
    display: flex;
    justify-content: space-between;
    padding: 0 0 30px 120px;
}
.phone-box{
  
}
.phone-box p{
    text-transform: uppercase;
    letter-spacing: 5px;
    font-size: 15px;
    font-weight: 500;
}
.phone-box h3{
    font-size: 25px;
    font-weight: 400;
}
.phone-box .cus-btn {
    background: #3a403200;
    padding: 12px 25px;
    color: #3a4032;
    border-radius: 0;
    display: inline-block;
    text-transform: uppercase;
    font-size: 15px;
    letter-spacing: 4px;
    font-weight: 500;
    margin-top: 20px;
    border: none;
    border-bottom: 2px solid #078f96;
}
.phone-box .cus-btn:hover{
    background: #078f96;
    padding: 12px 25px;
    color: #fff;
}
.wp-phone span{
    font-family: "Noto Serif Display", serif;
    display: block;
    margin: 0px 0 20px 150px;
    font-style: italic;
    font-weight: 500;
    color: #666;
    font-size: 15px;
}

iframe.lazyloaded {
    width: 100%;
    height: 400px;
}
.cus-btn {
    background: #078f96;
    padding: 11px 25px;
    color: #fff;
    border-radius: 5px;
    display: inline-block;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 2px;
    font-weight: 600;
    margin-top: 10px;
    border: 0px solid #3a4032;
}

.cus-btn:hover {
    background: #254864;
    color: #fff;
}
.what {
    position: fixed;
    z-index: 9999;
    left: 6px;
    bottom: 20px;
    background: #4ccc5b;
    color: #fff;
    padding: 10px 0 0 12px;
    height: 55px;
    width: 54px;
    border-radius: 100px;
}
.what a i {
    font-size: 36px;
    color: #fff;
}
.bottom-footer{
    display: none;
}
.mission {
    padding: 2rem;
    box-shadow: 0px 0px 5px #0000003d;
    border-radius: .5rem;
    height: 250PX;
    margin: 12px 1rem;
}
.wp-service .process-list {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1.5rem;
    margin-top: 4rem;
}
.wp-service .content h5 {
    font-weight: 700;
    font-size: 1.2rem;
}
.wp-service .content p{
      font-size: .8rem;  
}






/* media screen and (max-width: 1170px)
---------------------------------------------------------------------- */
@media screen and (max-width:1170px) {
.container {
	max-width: 100%;
	width: 100%;
	margin: 0 auto;
	padding: 0px 15px;
}


}

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

   

}
/* media screen and (max-width: 728px)
---------------------------------------------------------------------- */
@media screen and (max-width:728px) {
 .book {
    display: none;
}   
.logo {
    width: 40%;
}
.cus-menu {
    width: 60%;
}
    .vg-nav-lg .vg-nav-hamburger {
        display: block;
        float: right;
    
    }
.vg-nav-hamburger span{
    background: #035f60;
}
.banner-text h1 {
    font-size: 28px;
    line-height: 36px;
}
.banner .carousel-caption::after {

    width: 117%;
}
.carousel-control-next {
        top: 87.8%;
    right: 0%;

}
.carousel-control-prev {
    left: 69%;
         top: 87.8%;
}
.banner .carousel-item img {
    height: 30vh;
    object-fit: scale-down;
    width: 100% !important;
    margin-top: 10%;
}
.payment-list {
    grid-template-columns: repeat(1, 1fr);
}
.payment-box {
    display: flex
;
    align-items: center;
    justify-content: left;
    margin-bottom: 1rem;
}
.about{
    padding: 60px 0;
}
.tm-sc-funfact {
    left: 0px;
}
.media {

    justify-content: center;
}
.services{
    padding: 0 0 60px;
}
.service-text h2 {
    font-size: 1.8rem;
    line-height: 2rem;
    margin-bottom: 2rem;
}
.our-process-text h2 {
    font-size: 1.8rem;
}
.process-list {
    grid-template-columns: repeat(1, 1fr);
    gap: 5rem;
    margin-top: 3rem;
    display: contents !important;
}
.cus-loan img{
    width: 100%;
}
.ps-xl-10, .px-xl-10 {
    padding-left: 0.5rem;
}
.connect {
    width: 100%;
}
.footer-menu {
    width: 100%;
          margin-top: 0rem;
}
.footer-address {
    width: 100%;
}
.copy {
    margin: 40px 0 0 0;
    padding: 2rem 0 0 0;
}
.copy {
    display: block;
    text-align: center;
}
.copy-right {
    display: block;
}
.footer-social {
    margin-bottom: 1rem;
}
.top_menu{
    padding: 9px 12px 10px;
}
.banner-text p {
    font-size: 16px;
    width: 100%;
    font-weight: 300;
}
.mb-5 {
    margin-bottom: 0rem !important;
}
.wp-according .accordion {
    display: block;
    height: auto;
    position: relative;
    overflow: auto;
    margin-bottom: 40px;
}
.overlay {
    position: relative;
        top: 85%;
}
.wp-according .accordion .item{
        height: 46vh;
}
.wp-according .accordion .item:hover .overlay {
    top: 47%;
}
.team{
    padding: 60px 0 40px;
}
.wp-contact1 h2 {
    font-size: 30px;
    line-height: 45px;
}
.main-phone {
    padding: 0 0 30px 0px;
}
    .main-phone {
        padding: 0 0 30px 0px;
        display: block;
    }
    .phone-box {
    margin-bottom: 2rem;
}
.wp-phone span{
    margin: 0;
}

.service-detail {
    padding-left: 0rem;
}
.p-3 {
    padding: 0rem !important;
}
.card-style4 {
    margin-bottom: 1rem;
}
.bottom-footer{
    display: block;
}
.connect p {
    color: #fff;
    width: 100%;
    margin-bottom: 28px;
}
    .bottom-footer {
        position: fixed;
        z-index: 9999;
        width: 100%;
        bottom: 0px;
        /* display: flex
; */
        text-align: center;
        background: #078f96;
        height: 4rem;
    }
    .bottom-footer .book {
        display: block;
        width: 100%;
        margin: 1.2rem 0 0 0;
    }

}



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

}


/* media screen and (max-width: 550px)
---------------------------------------------------------------------- */
@media screen and (max-width:550px) {

}



/* media screen and (max-width: 480px)
---------------------------------------------------------------------- */
@media screen and (max-width:500px) {
.book a {
    background: #078f96;
    padding: 12px 7px;
    border-radius: 0;
    color: #ffff;
    font-weight: 400;
    /* text-transform: uppercase; */
    font-size: 15px;
    border: 1px solid #078f96;
    border-radius: 6px;
    font-size: 12px;
    margin-left: 12px;
}
	
	.about-right-text {
    padding: 1rem 20px 1px 0px;
}
}



/* media screen and (max-width: 414px)
---------------------------------------------------------------------- */
@media screen and (max-width:375px) {


}

.responsive-table {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
    margin: 20px 0;
  }

  .responsive-table th,
  .responsive-table td {
    border: 1px solid #ddd;
    padding: 13px 13px;
    text-align: left;
  }

  .responsive-table th {
    background-color: #004080;
    color: white;
  }

  .responsive-table a {
    color: #0066cc;
    text-decoration: none;
  }

  @media screen and (max-width: 768px) {
    .responsive-table thead {
      display: none;
    }

    .responsive-table,
    .responsive-table tbody,
    .responsive-table tr,
    .responsive-table td {
      display: block;
      width: 100%;
    }

    .responsive-table tr {
      margin-bottom: 15px;
      border: 1px solid #ccc;
      padding: 10px;
      border-radius: 8px;
      background: #f9f9f9;
    }

    .responsive-table td {
      text-align: right;
      position: relative;
      width: 100%;
    }

    .responsive-table td::before {
      content: attr(data-label);
      position: absolute;
      left: 15px;
      width: 45%;
      padding-left: 10px;
      font-weight: bold;
      text-align: left;
    }
  }

.enquire-btn {
    background-color: #004080;
    color: white;
    padding: 12px 25px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    margin-top: 20px;
  }

  .modal {
    display: none;
    position: fixed;
    z-index: 999;
    padding-top: 60px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.6);
  }

  .modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 30px;
    border: 1px solid #888;
    width: 100%;
    max-width: 500px;
    border-radius: 10px;
    margin-top: 10%;
  }

  .modal-content h2 {
    margin-top: 0;
    color: #004080;
  }

  .form-group {
    margin-bottom: 15px;
  }

  .form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
  }

  .form-group input,
  .form-group select {
    width: 100%;
    padding: 10px;
    border: 1px solid #aaa;
    border-radius: 5px;
  }

  .close {
    color: #ffc107 !important;
    float: right;
    font-size: 28px;
    font-weight: bold;
    margin-top: -52px;
    background-color: #03393c;
    width: 50px;
    height: 49px;
    text-align: center;
    padding-top: 8px;
    border-radius: 39px;
    float: right;
    margin-left: 90%;
    border: solid #fff 4px;
    box-shadow: 10px 10px 10px #ccc;
  }

  .close:hover,
  .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
  }

  @media (max-width: 500px) {
    .modal-content {
      padding: 20px;
      margin-top: 18%;
      margin-bottom: 15%;
    }
  }

 .icon-section {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
      max-width: 1200px;
      margin: 0 auto;
    }

    @media (max-width: 768px) {
      .icon-section {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 480px) {
      .icon-section {
        grid-template-columns: 1fr;
      }
    }

     .icon-section {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
      max-width: 1200px;
      margin: 26px auto;
    }

    @media (max-width: 768px) {
      .icon-section {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 480px) {
      .icon-section {
        grid-template-columns: 1fr;
      }
    }

    .icon-box {
      text-align: center;
      padding: 20px;
      border-radius: 12px;
      background: #fff;
      transition: all 0.4s ease;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
      position: relative;
      overflow: hidden;
    }

    .icon-box:hover {
      transform: translateY(-5px);
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
      background: linear-gradient(to right, #d8c950, #3cbf9a);
    }

    .icon-box .icon {
      width: 60px;
      height: 60px;
      margin: 0 auto 15px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      background: #f0f0f0;
      transition: 0.5s;
    }

    .icon-box:hover .icon {
      background: #fff;
      transform: scale(1.2);
    }

    .icon-box .icon svg {
      width: 30px;
      height: 30px;
      fill: #333;
      transition: fill 0.3s ease;
    }

    .icon-box:hover .icon svg {
      fill: #3cbf9a;
    }

    .icon-box h4 {
      font-size: 18px;
      font-weight: 600;
      margin: 10px 0 0;
      transition: color 0.3s ease;
    }

    .icon-box:hover h4 {
      color: #fff;
    }

.team-section {
      max-width: 1200px;
      margin: 0 auto;
    }

    .team-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 60px;
      flex-wrap: wrap;
    }

    .team-row.reverse {
      flex-direction: row-reverse;
    }

    .team-image,
    .team-text {
      flex: 1 1 45%;
      max-width: 48%;
    }

    .team-image img {
      width: 82%;
      border-radius: 8px;
      object-fit: cover;
    }

    .team-text {
      padding: 20px;
    }

    .team-text h3 {
      font-size: 24px;
      margin-bottom: 10px;
    }

    .team-text p {
      font-size: 16px;
      color: #333;
    }

    @media screen and (max-width: 768px) {
      .team-row {
        flex-direction: column;
      }
      .team-row.reverse {
        flex-direction: column;
      }
      .team-image,
      .team-text {
        max-width: 100%;
      }
    }

.fixed-contact-bar {
      position: fixed;
      top: 30%;
      right: 0;
      background-color: #078f96;
      padding: 10px 5px;
      border-radius: 10px 0 0 10px;
      z-index: 9999;
    }

    .contact-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin: 10px 0;
      color: white;
      font-size: 12px;
      cursor: pointer;
      text-align: center;
      transition: background 0.3s;
      padding: 8px 5px;
      line-height: 12px;
    }

    .contact-item:hover {
      background: linear-gradient(to right, #d8c950, #3cbf9a);
      border-radius: 10px 0 0 10px;
    }

    .contact-item img {
      margin-bottom: 5px;
      width: 24px;
      height: 24px;
    }