@charset "utf-8";
/* CSS Document */

/******************************

[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Top Bar
	3.2 Header Content
	3.3 Logo
4. Menu
5. Home
6. Boxes
7. About
8. Departments
9. Services
10. CTA
11. Footer


******************************/

/***********
1. Fonts
***********/

@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900");

/*********************************
2. Body and some general stuff
*********************************/

* {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -webkit-text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
  text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
}
body {
  font-family: "Roboto", sans-serif;
  font-size: 15px;
  font-weight: 500;
  background: #ffffff;
  color: #696969;
}
div {
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
ul {
  list-style: none;
  margin-bottom: 0px;
}
p {
  font-family: "Roboto", sans-serif;
  font-size: 15px;
  line-height: 2;
  font-weight: 500;
  color: #696969;
  -webkit-font-smoothing: antialiased;
  -webkit-text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
  text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
}
p:last-of-type {
  margin-bottom: 0;
}
a {
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
a,
a:hover,
a:visited,
a:active,
a:link {
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  -webkit-text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
  text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
}
a:hover {
  color: #3fbbc0 !important;
}
::selection {
  color: #3fbbc0;
}
p::selection {
}
h1 {
  font-size: 48px;
}
h2 {
  font-size: 36px;
}
h3 {
  font-size: 24px;
}
h4 {
  font-size: 18px;
}
h5 {
  font-size: 14px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Roboto", sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
  text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
}
h1::selection,
h2::selection,
h3::selection,
h4::selection,
h5::selection,
h6::selection {
}
.form-control {
  color: #db5246;
}
section {
  display: block;
  position: relative;
  box-sizing: border-box;
}
.clear {
  clear: both;
}
.clearfix::before,
.clearfix::after {
  content: "";
  display: table;
}
.clearfix::after {
  clear: both;
}
.clearfix {
  zoom: 1;
}
.float_left {
  float: left;
}
.float_right {
  float: right;
}
.trans_200 {
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.trans_300 {
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -ms-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease;
}
.trans_400 {
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -ms-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease;
}
.trans_500 {
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
}
.fill_height {
  height: 100%;
}
.super_container {
  width: 100%;
  overflow: hidden;
}
.prlx_parent {
  overflow: hidden;
}
.prlx {
  height: 130% !important;
}
.parallax-window {
  min-height: 400px;
  background: transparent;
}
.nopadding {
  padding: 0px !important;
}
.button {
  display: inline-block;
  height: 51px;
  background: #a82682;
}
.button::after {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: #3fbbc0;
  content: "";
  z-index: 0;
  -webkit-transition: all 400ms cubic-bezier(0.33, 0.68, 0.59, 0.99);
  -moz-transition: all 400ms cubic-bezier(0.33, 0.68, 0.59, 0.99);
  -ms-transition: all 400ms cubic-bezier(0.33, 0.68, 0.59, 0.99);
  -o-transition: all 400ms cubic-bezier(0.33, 0.68, 0.59, 0.99);
  transition: all 400ms cubic-bezier(0.33, 0.68, 0.59, 0.99);
}
.button a {
  display: block;
  position: relative;
  line-height: 51px;
  font-size: 14px;
  font-weight: 900;
  color: #ffffff;
  padding-left: 39px;
  padding-right: 45px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  z-index: 10;
}
.button:hover::after {
  height: 100%;
}
.button:hover a {
  color: #ffffff !important;
}
.section_title {
  padding-top: 17px;
}
.section_title h2 {
  font-size: 30px;
  font-weight: 500;
  color: #232323;
}
.section_title::before {
  display: block;
  position: absolute;
  left: 1px;
  top: 0;
  width: 54px;
  height: 3px;
  background: #3fbbc0;
  content: "";
}
.section_title_light h2 {
  color: #ffffff;
}

/*********************************
3. Header
*********************************/

.header {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #ffffff;
  z-index: 100;
}
.header.scrolled {
  top: -48px;
}

/*********************************
3.1 Top Bar
*********************************/

.top_bar {
  width: 100%;
  background: #a82682;
}
.top_bar_content {
  width: 100%;
  height: 48px;
  padding-left: 214px;
}
.top_bar_item {
  margin-left: 33px;
}
.top_bar_item a {
  font-size: 14px;
  color: #ffffff;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.top_bar_item:first-child {
  margin-left: 37px;
}
.emergencies {
  height: 100%;
  background: #3fbbc0;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  padding-left: 38px;
  padding-right: 38px;
}

/*********************************
3.2 Header Content
*********************************/

.header_container {
  width: 100%;
  background: #ffffff;
}
.header_content {
  width: 100%;
  height: 103px;
}
.header.scrolled .header_content {
  height: 80px;
}
.main_nav ul li {
  display: inline-block;
}
.main_nav ul li:not(:first-child) {
  margin-left: 32px;
}
.main_nav ul li a {
  font-size: 16px;
  font-weight: 500;
  color: #323232;
}
.hamburger {
  display: none;
  cursor: pointer;
}
.hamburger i {
  font-size: 24px;
  color: #272727;
}

/*********************************
3.3 Logo
*********************************/

.logo_container_outer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.logo_container {
  position: absolute;
  top: 0;
  left: 15px;
  width: 216px;
  height: 177px;
  background: #ffffff;
  box-shadow: 0px 31px 29px rgba(0, 0, 0, 0.09);
  z-index: 10;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.header.scrolled .logo_container {
  top: 48px;
  height: 120px;
}
.logo_container a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
}
.logo_content {
  width: 100%;
  height: 100%;
  /* padding-left: 36px; */
}
.logo_line {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background: #3fbbc0;
}
.logo img {
  max-width: 85%;
}
.logo_sub {
  font-size: 14px;
  font-weight: 400;
  color: #8f8e8e;
  padding-left: 3px;
  margin-top: 2px;
  text-align: center;
}

/*********************************
4. Menu
*********************************/

.menu_container {
  position: fixed;
  top: 0;
  right: -50vw;
  width: 50vw;
  height: 100vh;
  background: #ffffff;
  z-index: 101;
  -webkit-transition: all 0.6s ease;
  -moz-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
  visibility: hidden;
  opacity: 0;
}
.menu_container.active {
  visibility: visible;
  opacity: 1;
  right: 0;
}
.menu {
  position: absolute;
  top: 150px;
  left: 0;
  padding-left: 15%;
}
.menu_inner {
  width: 100%;
  height: 100%;
}
.menu_list {
  -webkit-transform: translateY(1.5rem);
  -moz-transform: translateY(1.5rem);
  -ms-transform: translateY(1.5rem);
  -o-transform: translateY(1.5rem);
  transform: translateY(1.5rem);
  -webkit-transition: all 1000ms 400ms ease;
  -moz-transition: all 1000ms 400ms ease;
  -ms-transition: all 1000ms 400ms ease;
  -o-transition: all 1000ms 400ms ease;
  transition: all 1000ms 400ms ease;
  opacity: 0;
}
.menu_container.active .menu_list {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
  opacity: 1;
}
.menu_item {
  margin-bottom: 5px;
}
.menu_item a {
  font-family: "Roboto", sans-serif;
  font-size: 36px;
  font-weight: 700;
  color: #272727;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.menu_item a:hover {
  color: #ffb606;
}
.menu_close_container {
  position: absolute;
  top: 86px;
  right: 79px;
  width: 21px;
  height: 21px;
  cursor: pointer;
  z-index: 10;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.menu_close {
  top: 9px;
  width: 21px;
  height: 3px;
  background: #3a3a3a;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.menu_close::after {
  display: block;
  position: absolute;
  top: -9px;
  left: 9px;
  content: "";
  width: 3px;
  height: 21px;
  background: #3a3a3a;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.menu_close_container:hover .menu_close,
.menu_close_container:hover .menu_close::after {
  background: #3fbbc0;
}
.menu_extra {
  position: absolute;
  left: 0;
  bottom: 0;
  padding-left: 15%;
  padding-bottom: 25px;
}
.menu_appointment a {
  font-size: 13px;
  color: #a82682;
}
.menu_emergencies {
  font-size: 13px;
  color: #272727;
}

/*********************************
5. Home
*********************************/

.home {
  width: 100%;
  height: 900px;
}
.home_slider_container {
  width: 100%;
  height: 100%;
}
.home_slider_background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.home_slider_progress {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 0;
  max-width: 100%;
  height: 2px;
  background: #3fbbc0;
  z-index: 1;
}
.home_content {
  position: absolute;
  top: 39.8%;
  left: 0;
  width: 100%;
}
.home_content_inner {
  width: 550px;
}
.home_title h1 {
  font-size: 69.24px;
  font-weight: 900;
  color: #272727;
  line-height: 1.0398;
}
.home_text {
  padding-right: 20px;
  margin-top: 10px;
  padding-left: 3px;
}
.home_text p {
  font-size: 16px;
  font-weight: 500;
  color: #747474;
  line-height: 1.75;
}
.home_button {
  margin-top: 34px;
  margin-left: 3px;
}
.home_content_inner {
  position: relative;
  width: 550px;
  padding: 25px 30px;
  border-radius: 10px;
  z-index: 2;
  overflow: hidden;
}

/* Light overlay behind the text */
.home_content_inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.65); /* light white overlay */
  backdrop-filter: blur(2px); /* adds soft glass blur effect */
  z-index: 1;
}

/* Keep text above overlay */
.home_content_inner > * {
  position: relative;
  z-index: 2;
}


/*********************************
6. Boxes
*********************************/

.boxes {
  width: 100%;
  background: transparent;
  z-index: 10;
  padding-bottom: 35px;
}
.box_col {
  margin-top: -59px;
}
.box {
  width: 100%;
  height: 287px;
  background: #a82682;
  padding-left: 42px;
  padding-top: 29px;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.box::after {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background: #3fbbc0;
  content: "";
}
.box:hover {
  box-shadow: 0px 15px 49px rgba(0, 0, 0, 0.59);
}
.box_title {
  font-size: 20px;
  font-weight: 500;
  color: #ffffff;
  margin-top: 11px;
}
.working_hours {
  padding-top: 29px;
  padding-right: 60px;
}
.working_hours_list {
  margin-top: 40px;
}
.working_hours_list ul li {
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
}
.working_hours_list ul li:not(:last-child) {
  margin-bottom: 15px;
}
.box_icon {
  width: 37px;
  height: 37px;
}
.box_icon img {
  max-width: 100%;
}
.box_text {
  font-size: 14px;
  line-height: 2.14;
  color: #ffffff;
  font-weight: 400;
  margin-top: 23px;
  text-align: justify;
}
.box_phone {
  font-size: 30px;
  font-weight: 400;
  color: #3fbbc0;
  margin-top: 20px;
}
.box_appointments {
  padding-right: 30px;
}
.box_emergency {
  padding-right: 30px;
}
.box_emergency_text {
  font-size: 14px;
  line-height: 2.14;
  color: #ffffff;
  font-weight: 400;
  margin-top: 18px;
}

/*********************************
7. About
*********************************/

.about {
  width: 100%;
  background: #ffffff;
  padding-top: 92px;
  padding-bottom: 92px;
}
.about_text {
  margin-top: 34px;
  text-align: justify;
}
.about_button {
  margin-top: 45px;
}
/* .about_image {
  position: absolute;
  right: 0;
  bottom: 0;
} */
.about_image img {
  max-width: 100%;
  border-radius: 10px;
}

.item {
  background: #a1fcffff;
  margin-bottom: 12px;
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.title {
  padding: 16px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 600;
  color: #ffff;
  font-size: 1rem;
  background: #a52580;
}

.content {
  max-height: 0;
  overflow: hidden;
  padding: 0 16px;
  line-height: 1.5;
  transition: max-height 0.4s ease, padding 0.3s ease;
}

.item.open .content {
  max-height: 300px;
  padding: 16px;
}
.accordion .content ul li {
  list-style: square inside; 
  padding-left: 1.2em;
  color: #696969ff; /* Custom bullet/text color */
  margin-bottom: 10px;
}

.accordion .content ul.custom-list li {
  margin-bottom: 0.5em;
  line-height: 1.6;
}


.icon {
  transition: transform 0.3s ease;
}

.item.open .icon {
  transform: rotate(45deg); /* + becomes × */
}
.impact_list_container h2,
.impact_list_container p {
  color: #ffffff;
  font-size: 20px;
}
.impact_list_container h2 {
  font-weight: 700;
  font-size: 25px;
}

.impact_list_container ul li {
  color: #ffffff;
  list-style: circle;
  margin-left: 20px;
}

/*********************************
8. Departments
*********************************/

.departments {
  width: 100%;
  background: transparent;
  padding-top: 75px;
  padding-bottom: 65px;
  position: relative;
}
.departments_background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.departments_row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  margin-top: 79px;
}
.dept_col {
  margin-bottom: 0;
}
.dept {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.dept:hover {
  transform: translateY(-8px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
}
.dept_image img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.dept_content {
  padding: 25px 15px;
  text-align: center;
  background: #ffffff;
  position: relative;
}
.dept_title {
  font-size: 16px;
  font-weight: 700;
  color: #232323;
  text-transform: uppercase;
}
.dept_subtitle {
  font-size: 14px;
  color: #696969;
  margin-top: 8px;
  text-align: justify;
}
/* Responsive Tweaks */
@media (max-width: 1200px) {
  .departments_row {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
}
@media (max-width: 768px) {
  .dept_image img {
    height: 180px;
  }
}
@media (max-width: 576px) {
  .dept_image img {
    height: 150px;
  }
}

/*********************************
9. Services
*********************************/

.services {
  width: 100%;
  background: #ffffff;
  padding-top: 95px;
  padding-bottom: 65px;
}
.services_row {
  margin-top: 95px;
}
.service_col {
  margin-bottom: 30px;
}
.service {
  width: 100%;
  background: #f5f7fa;
  padding-top: 46px;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 57px;
}
.service:hover {
  background: #a82682;
}
.service::after {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background: #3fbbc0;
  content: "";
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.service:hover::after {
  visibility: visible;
  opacity: 1;
}
.service_icon {
  width: 61px;
  height: 61px;
  margin-left: auto;
  margin-right: auto;
}
.service_icon svg {
  width: 61px;
  height: 61px;
}
.service_icon img {
  max-width: 100%;
}
.svg path,
.svg rect,
.svg polygon {
  fill: #3fbbc0;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.service:hover .svg path,
.service:hover .svg rect,
.service:hover .svg polygon {
  fill: #ffffff;
}
.service_text {
  margin-top: 16px;
}
.service_text p {
  color: #696969;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.service_title {
  font-size: 20px;
  font-weight: 700;
  color: #232323;
  padding-top: 41px;
  margin-top: 26px;
}
.service_title::before {
  display: block;
  position: absolute;
  left: 50%;
  top: 0;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 54px;
  height: 3px;
  background: #3fbbc0;
  content: "";
}
.service:hover .service_title {
  color: #ffffff;
}
.service:hover .service_text p {
  color: rgba(255, 255, 255, 0.65);
}

/*********************************
10. CTA
*********************************/

.cta {
  width: 100%;
  padding-top: 50px;
  padding-bottom: 116px;
}
.cta_background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.cta_content {
  max-width: 768px;
  margin-left: auto;
  margin-right: auto;
}
.cta_content h2 {
  font-size: 48px;
  font-weight: 700;
  color: #ffffff;
}
.cta_content p {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  margin-top: -3px;
}
.cta_button {
  margin-top: 38px;
}

/*********************************
11. Footer
*********************************/

.footer {
  width: 100%;
}
.footer_container {
  width: 100%;
  background: #060b3a;
  padding-bottom: 77px;
}
.footer_logo_container {
  width: 100%;
  height: 157px;
  background: #ffffff;
}
.footer_logo_container::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: #3fbbc0;
  content: "";
}
.footer_logo_container a {
  display: block;
  width: 100%;
  height: 100%;
}
.footer_logo_container .logo_content {
  display: inline-block;
  padding-left: 0;
  width: auto;
  height: auto;
}
.footer_logo_container .logo {
  margin-top: 10px;
}
.footer_about_text {
  margin-top: 36px;
}
.footer_about_text p {
  color: #b2b2b2;
}
.footer_about_list {
  margin-top: 32px;
}
.footer_about_list li:not(:last-child) {
  margin-bottom: 9px;
}
.footer_about_icon {
  display: inline-block;
  width: 31px;
  height: 31px;
  background: #3fbbc0;
  text-align: center;
  vertical-align: middle;
}
.footer_about_icon img {
  position: absolute;
  width: 16px;
  height: 16px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.footer_about_list li span {
  font-size: 14px;
  font-weight: 500;
  color: #b2b2b2;
  padding-left: 10px;
}
.footer_column {
  padding-top: 138px;
}
.footer_title {
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
}
.footer_links ul {
  -webkit-columns: 2;
  -moz-columns: 2;
  columns: 2;
  margin-top: 35px;
}
.footer_links ul li:not(:last-child) {
  margin-bottom: 20px;
}
.footer_links ul li a {
  font-size: 14px;
  font-weight: 500;
  color: #b2b2b2;
}
.footer_news ul {
  margin-top: 35px;
}
.footer_news_title a {
  font-size: 15px;
  font-weight: 500;
  color: #b2b2b2;
}
.footer_news_date {
  font-size: 14px;
  font-weight: 500;
  color: #3fbbc0;
  margin-top: 7px;
}
.footer_news ul li:not(:last-child) {
  margin-bottom: 38px;
}
.copyright {
  width: 100%;
  background: #020523;
}
.copyright_content {
  width: 100%;
  height: 62px;
}
.cr {
  font-size: 14px;
  font-weight: 500;
  color: #97979c;
}
.footer_social ul {
  margin-right: -5px;
}
.footer_social ul li {
  display: inline-block;
}
.footer_social ul li:not(:last-child) {
  margin-right: 19px;
}
.footer_social ul li a i {
  color: #3fbbc0;
  padding: 5px;
  font-size: 14px;
  -webkit-transition: all 200ms ease;
  -moz-transition: all 200ms ease;
  -ms-transition: all 200ms ease;
  -o-transition: all 200ms ease;
  transition: all 200ms ease;
}
.footer_social ul li a i:hover {
  color: #ffffff;
}

/* ---------media Queries--------- */
.box i {
  color: #ffffff;
}

/* ----circle-progress---- */
.circle-progress {
  position: relative;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  margin-bottom: 30px; /* Space For the counter */
}

.circle-progress .gradient,
.circle-progress img,
.circle-progress .track,
.circle-progress .indicator {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}

.circle-progress .gradient {
  opacity: 0; /* Hide it visually if the data-percent is 0 or less and on initial load */
  width: 100%;
  height: 100%;
  background-image: conic-gradient(
    from 0deg,
    #a82682,
    #3fbbc0,
    #ff4ac9ff,
    #adfcffff,
    #faa9e2ff
  );
  transition: opacity 0.3s ease;
  z-index: 1;
  pointer-events: none; /* Allow pointer events to go through */
}

.circle-progress .indicator {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  z-index: 3;
  display: none; /* Initially hide the indicator */
}

.circle-progress .inner-circle {
  display: block;
  width: 90%;
  height: 90%;
  border-radius: 50%;
  border: 0.5rem solid #fff;
  background-color: #e4e0e0;
  z-index: 2;
  position: relative;
  align-items: center;
  top: 10px;
  align-content: center;
  left: 10px;
}

.circle-progress .track {
  width: 100%;
  height: 100%;
  background-color: #e0e0e0;
  mask-image: radial-gradient(
    circle at center,
    transparent 0,
    transparent 56%,
    black 57%
  );
  box-shadow: inset 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
  z-index: 0;
}

.counter {
  position: absolute;
  left: 50%;
  bottom: -30px; /* Space according to margin in Parent */
  transform: translateX(-50%);
}

/* ----------------newsletter-------- */
.footer_newsletter {
  color: #fff;
}

.newsletter_form {
  margin-top: 15px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.newsletter_input {
  padding: 12px 15px;
  border-radius: 6px;
  border: none;
  outline: none;
  width: 100%;
  font-size: 15px;
}

.newsletter_button {
  background: linear-gradient(135deg, #a82682, #3fbbc0);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.3s ease;
}

.newsletter_button:hover {
  background: linear-gradient(135deg, #3fbbc0, #a82682);
  transform: translateY(-2px);
}

/* ----active link---- */
/* Default link style */
.main_nav ul li a {
    color: black;       /* normal link color */
    text-decoration: none;
    transition: color 0.3s;
}

/* Hover effect only for non-active links */
.main_nav ul li a:not(.active):hover {
    color: blue;        /* hover color for non-active links */
}

/* Active link style */
.main_nav ul li a.active {
    color: #a82682 !important;         /* active page color */
    font-weight: bold;
    pointer-events: none; /* disables hover and click for active link */
}

/* ----circle-progress---- */

@media (min-width: 1024px) {
  .home_content_inner {
    width: 650px;
  }
}
