@font-face {
  font-display: swap;
  font-family: Atma;
  font-style: normal;
  font-weight: 700;
  src: url(/assets/font/Atma/Atma-Bold.eot);
  src: url(/assets/font/Atma/Atma-Bold.eot) format("embedded-opentype"),url(/assets/font/Atma/Atma-Bold.woff2) format("woff2"),url(/assets/font/Atma/Atma-Bold.woff) format("woff"),url(/assets/font/Atma/Atma-Bold.ttf) format("truetype"),url(/assets/font/Atma/Atma-Bold.svg) format("svg")
}

@font-face {
  font-display: swap;
  font-family: Atma;
  font-style: normal;
  font-weight: 400;
  src: url(/assets/font/Atma/Atma-Regular.eot);
  src: url(/assets/font/Atma/Atma-Regular.eot) format("embedded-opentype"),url(/assets/font/Atma/Atma-Regular.woff2) format("woff2"),url(/assets/font/Atma/Atma-Regular.woff) format("woff"),url(/assets/font/Atma/Atma-Regular.ttf) format("truetype"),url(/assets/font/Atma/Atma-Regular.svg) format("svg")
}

@font-face {
  font-display: swap;
  font-family: Atma;
  font-style: normal;
  font-weight: 300;
  src: url(/assets/font/Atma/Atma-Light.eot);
  src: url(/assets/font/Atma/Atma-Light.eot) format("embedded-opentype"),url(/assets/font/Atma/Atma-Light.woff2) format("woff2"),url(/assets/font/Atma/Atma-Light.woff) format("woff"),url(/assets/font/Atma/Atma-Light.ttf) format("truetype"),url(/assets/font/Atma/Atma-Light.svg) format("svg")
}

@font-face {
  font-display: swap;
  font-family: Atma;
  font-style: normal;
  font-weight: 600;
  src: url(/assets/font/Atma/Atma-SemiBold.eot);
  src: url(/assets/font/Atma/Atma-SemiBold.eot) format("embedded-opentype"),url(/assets/font/Atma/Atma-SemiBold.woff2) format("woff2"),url(/assets/font/Atma/Atma-SemiBold.woff) format("woff"),url(/assets/font/Atma/Atma-SemiBold.ttf) format("truetype"),url(/assets/font/Atma/Atma-SemiBold.svg) format("svg")
}

@font-face {
  font-display: swap;
  font-family: Atma;
  font-style: normal;
  font-weight: 500;
  src: url(/assets/font/Atma/Atma-Medium.eot);
  src: url(/assets/font/Atma/Atma-Medium.eot) format("embedded-opentype"),url(/assets/font/Atma/Atma-Medium.woff2) format("woff2"),url(/assets/font/Atma/Atma-Medium.woff) format("woff"),url(/assets/font/Atma/Atma-Medium.ttf) format("truetype"),url(/assets/font/Atma/Atma-Medium.svg) format("svg")
}

/* @font-face {
  font-display: swap;
  font-family: Atma;
  font-style: normal;
  font-weight: 100;
  src: url(/assets/font/Atma/Atma-Thin.eot);
  src: url(/assets/font/Atma/Atma-Thin.eot) format("embedded-opentype"),url(/assets/font/Atma/Atma-Thin.woff2) format("woff2"),url(/assets/font/Atma/Atma-Thin.woff) format("woff"),url(/assets/font/Atma/Atma-Thin.ttf) format("truetype"),url(/assets/font/Atma/Atma-Thin.svg) format("svg")
} */

:root {
  --transition-fast: 0.2s cubic-bezier(0.29,0.13,0.27,0.74);
  --transition: 0.3s cubic-bezier(0.29,0.13,0.27,0.74);
  --transition-slow: 0.4s cubic-bezier(0.29,0.13,0.27,0.74);
  --c-white: #fff;
  --c-white-light: #e6e7e8;
  --c-black: #000;
  --c-primary: #414042;
  --c-primary-light: #5a5b5c;
  --c-secondary: #56c3ba;
  --c-secondary-light: #56c3ba1a;
  --c-tertiary: #faa61b;
  --c-querternary: #e50045;
  --c-pink: #f59393;
  --c-gray: #95999e;
  --c-gray-light: #ececec;
  --c-border: #c2c2c2;
  --c-border-alt: #e0e0e0;
  --c-error: #ff1f00;
  --c-success: #4bae4f;
  --c-success-light: #46c872;
  --c-warning-light: #c89c46;
  --overlay: rgba(0,0,0,.4);
  --b-shadow: 0 0 2rem 0 rgba(0,0,0,.1);
  --header-height: 11.5rem;

  --txt-rem100: 10rem;
  --txt-rem60: 6rem;
  --txt-rem48: 4.8rem;
  --txt-rem42: 4.2rem;
  --txt-rem36: 3.6rem;
  --txt-rem32: 3.2rem;
  --txt-rem30: 3rem;
  --txt-rem28: 2.8rem;
  --txt-rem26: 2.6rem;
  --txt-rem24: 2.4rem;
  --txt-rem22: 2.2rem;
  --txt-rem20: 2rem;
  --txt-rem18: 1.8rem;
  --txt-rem16: 1.6rem;
  --txt-rem15: 1.5rem;
  --txt-rem10: 1.0rem;
  --txt-rem05: 0.5rem;
}

.txt--rem100 {
    font-size: var(--txt-rem100)
}

.txt--rem60 {
    font-size: var(--txt-rem60)
}

.txt--rem48 {
    font-size: var(--txt-rem48)
}

.txt--rem32 {
    font-size: var(--txt-rem32)
}

.txt--rem30 {
    font-size: var(--txt-rem30)
}

.txt--rem28 {
    font-size: var(--txt-rem28)
}

.txt--rem26 {
    font-size: var(--txt-rem26)
}

.txt--rem24 {
    font-size: var(--txt-rem24)
}

.txt--rem22 {
    font-size: var(--txt-rem22)
}

.txt--rem20 {
    font-size: var(--txt-rem20)
}

.txt--rem18 {
    font-size: var(--txt-rem18)
}

.txt--rem16 {
    font-size: var(--txt-rem16)
}

.txt--rem15 {
    font-size: var(--txt-rem15)
}

.txt--font300 {
    font-weight: 300
}

.txt--font400 {
    font-weight: 400
}

.txt--font500 {
    font-weight: 500
}

.txt--font600 {
    font-weight: 600
}

.txt--font700 {
    font-weight: 700 !important
}


.c-white {
    color: var(--c-white)
}

.c-white-alt {
    color: var(--c-white-alt)
}

.c-black {
    color: var(--c-black)
}

.c-primary {
    color: var(--c-primary)
}

.c-primary-alt {
    color: var(--c-primary-alt)
}

.c-secondary {
    color: var(--c-secondary)
}

.c-gray {
    color: var(--c-gray)
}

.c-gray-light {
    color: var(--c-gray-light)
}

.c-border {
    color: var(--c-border)
}

.c-error {
    color: var(--c-error)
}

.c-success {
    color: var(--c-success)
}

.c-success-light {
    color: var(--c-success-light)
}

.c-warning-light {
    color: var(--c-warning-light)
}


[tabindex="-1"]:focus:not(:focus-visible) {
    outline: 0!important
}

@-ms-viewport {
    width: device-width
}

article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section {
    display: block
}

body {
    margin: 0
}

[tabindex="-1"]:focus {
    outline: 0!important
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

h1,h2,h3,h4,h5,h6 {
    font-size: inherit;
    font-weight: inherit;
    margin-bottom: 0;
    margin-top: 0
}

a,
.aHref {
    color: inherit
}

a:hover,
.aHref:hover {
    color: #fec827;
}

p {
    margin-bottom: 0;
    margin-top: 0
}

abbr[data-original-title],abbr[title] {
    border-bottom: 0;
    cursor: help;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

address {
    font-style: normal;
    line-height: inherit;
    margin-bottom: 1rem
}

dl,ol,ul {
    margin-bottom: 0;
    margin-top: 0;
}

li {
    list-style: none
}

ol ol,ol ul,ul ol,ul ul {
    margin-bottom: 0
}

dt {
    font-weight: 400
}

dd {
    margin-bottom: .5rem;
    margin-left: 0
}

blockquote {
    margin: 0 0 1rem
}

dfn {
    font-style: italic
}

b,strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

sub,sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

a {
    -webkit-text-decoration-skip: objects;
    background-color: transparent;
    text-decoration: none;
}

a:not([href]):not([tabindex]),a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover {
    color: inherit;
    text-decoration: none
}

a:not([href]):not([tabindex]):focus {
    outline: 0
}

code,kbd,pre,samp {
    font-family: monospace,monospace;
    font-size: 1em
}

pre {
    -ms-overflow-style: scrollbar;
    margin-bottom: 1rem;
    margin-top: 0;
    overflow: auto
}

figure {
    margin: 0 0 1rem
}

img {
    border-style: none;
    vertical-align: middle
}

svg:not(:root) {
    overflow: hidden
}

table {
    border-collapse: collapse;
    width: 100% !important;
}

th {
    text-align: inherit
}

label {
    display: inline-block;
    margin-bottom: .5rem
}

button {
    background-color: inherit;
    border: inherit;
    border-radius: 0;
    padding: 0
}

button:focus {
    outline: none
}

button,input,optgroup,select,textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    margin: 0;
    outline: none
}

button,input {
    overflow: visible
}

button,select {
    text-transform: none
}

button:disabled{
  cursor: no-drop;
  pointer-events: auto;
  border-width: 0;
}

[type=reset],[type=submit],button,html [type=button] {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

input[type=checkbox],input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=date],input[type=datetime-local],input[type=month],input[type=time] {
    -webkit-appearance: listbox
}

textarea {
    overflow: auto;
    resize: vertical
}

fieldset {
    border: 0;
    margin: 0;
    min-width: 0;
    padding: 0
}

legend {
    color: inherit;
    display: block;
    font-size: 1.5rem;
    line-height: inherit;
    margin-bottom: .5rem;
    max-width: 100%;
    padding: 0;
    white-space: normal;
    width: 100%
}

progress {
    vertical-align: baseline
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: none;
    outline-offset: -.2rem
}

[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

output {
    display: inline-block
}

summary {
    cursor: pointer;
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none!important
}

*,:after,:before,html {
    box-sizing: border-box
}

.transition-fade {
    opacity: 1;
    transition: .4s
}

html.is-animating .transition-fade {
    opacity: 0
}

html {
  -ms-overflow-style: scrollbar;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  font-family: sans-serif;
  line-height: 1.15;
  font-size: 10px;
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: Atma;
  font-size: 1.6rem;
  line-height: normal;
  position: relative;
  text-rendering: optimizeLegibility!important
}

body:before {
  background-color: var(--c-secondary);
  height: 103rem;
  right: 10rem;
  top: -5rem;
  width: 103rem
}

body:after,body:before {
  aspect-ratio: 1/1;
  border-radius: 50%;
  content: "";
  filter: blur(15rem);
  opacity: .15;
  pointer-events: none;
  position: absolute;
  z-index: -1
}

body:after {
  background-color: var(--c-pink);
  height: 125rem;
  left: -35rem;
  max-width: 100%;
  top: 5rem;
  width: 125rem
}

.custom-scrollbar::-webkit-scrollbar {
  cursor: pointer;
  width: .5rem
}

.custom-scrollbar::-webkit-scrollbar-track {
  background: var(--c-gray-light)
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background: var(--c-gray)
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: var(--c-primary)
}

.f-100{font-size: 100% !important;}
.text-right{text-align: right;}
.text-left{text-align: left;}
.border-none {border: unset;}

.container{
  padding: 0;
}

.navbar a{
  color:var(--c-primary);
}


/***** Search-Section *****/
.search-section {
  height: 0;
  left: 0;
  overflow: hidden;
  position: fixed;
  top: 0;
  transition: var(--transition-slow);
  width: 100%;
  z-index: 999999;
}
.search-section.opened{
  height: 100vh;
}
.search-section-overlay {
  background-color: var(--overlay);
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.search-section-container {
  padding: 4rem 0;
  position: relative;
  width: 100%;
  z-index: 1;
}
.search-section-input {
  align-items: center;
  background-color: var(--c-white-light);
  border: 0.1rem solid var(--c-primary);
  border-radius: 8rem;
  display: flex;
  gap: 1rem;
  min-height: 5rem;
  padding: 0 4rem;
  width: 100%;
}
.search-section-input input {
  background-color: unset;
  border: 0;
  outline: 0;
  width: 100%;
}
.search-section-close {
  align-items: center;
  aspect-ratio: 1/1;
  background-color: var(--c-white-light);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  flex-shrink: 0;
  height: 5rem;
  justify-content: center;
  transition: var(--transition);
  width: 5rem;
}
.search-section-form {
  align-items: center;
  display: flex;
  gap: 2rem;
  width: 100%;
}
.search-section-result {
  background-color: var(--c-white-light);
  border-radius: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 1rem;
  max-height: 50rem;
  opacity: 0;
  overflow-y: auto;
  padding: 2.5rem;
  pointer-events: none;
  transition: var(--transition);
}
.search-section-result.opened{
  opacity: 1;
  pointer-events: all;
}
/***** Search-Section *****/

.ico {
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
  display: inline-flex;
  height: 1em;
  width: 1em
}

.ico>svg {
  height: 100%;
  width: 100%
}

.btn {
  /* font-size:100%; */
}

.btn-warning-gradient {
  background: var(--c-querternary);
  border-radius: 3rem;
  overflow: hidden;
  position: relative;
  font-size: var(--txt-rem22);
}

.btn-warning-gradient:before {
  content: "";
  width: 0;
  height: 100%;
  background-color: var(--c-gray);
  border-radius: 3rem;
  opacity: .4;
  position: absolute;
  right: 0;
  top: 0;
  transition: var(--transition);
  z-index: 0;
}

.btn-warning-gradient:hover:before{
  width: 100%;
}

.btn-txt {
  position: relative;
  text-align: center;
  padding-left:2rem;
  padding-right:30px;
  display: inline-block;
}

.btn-txt.icon-left{
  padding-left:30px;
  padding-right:2rem;
}

.btn-txt .fa,
.btn-txt .fab,
.btn-txt .fas {
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 1.3rem;
  line-height: 2.6rem;
  font-size: 1.3rem;
  position: absolute;
  right: 0;
  background-color: var(--c-white);
  transition:var(--transition);
  font-weight:900;
  color:#000 !important;
  top:2px;
}

.btn-txt.icon-left .fa,
.btn-txt.icon-left .fab,
.btn-txt.icon-left .fas {
  right: auto;
  left: 0;
}

.btn-txt.text-dark,
.btn-txt.text-dark,
.btn-txt.text-dark {
  color: var(--c-primary) !important;
}

.btn-txt.text-white,
.btn-txt.text-white,
.btn-txt.text-white {
  color: var(--c-white) !important;
}

.btn-txt.text-dark .fa,
.btn-txt.text-dark .fab,
.btn-txt.text-dark .fas {
  background: var(--c-primary);
  color: var(--c-white) !important;
}

.btn-txt.text-white .fa,
.btn-txt.text-white .fab,
.btn-txt.text-white .fas {
  background: var(--c-white);
  color: var(--c-primary) !important;
}

.btn-txt:hover .fa,
.btn-txt:hover .fab,
.btn-txt:hover .fas{
  width: 100%;
  /* opacity: .8; */
}

.btn-txt.btn-disabled {
  opacity: .5;
  pointer-events: none;
  cursor: no-drop;
}

.btn-nav{
  background: var(--c-querternary);
  border-radius: 3.8rem;
  box-shadow: var(--b-shadow);
  border: none;
  width: 100%;
}

.btn-full{
  /* background: var(--c-querternary); */
  border-radius: 3.8rem;
  box-shadow: var(--b-shadow);
  border: none;
  width: 100%;
}

.btn-secondary-gradient{
  background: var(--c-querternary);
}

.btn-full .btn-txt .fas,
.btn-nav .btn-txt .fas{
  height: 5.4rem;
  width: 5.4rem;
  font-size: 2rem;
  line-height: 5.4rem;
  border-radius: 2.7rem;
  color:var(--c-secondary) !important;
  text-align:center;
}

/* .btn-full:hover .btn-txt .fa,
.btn-full:hover .btn-txt .fab,
.btn-full:hover .btn-txt .fas, */
.btn-nav:hover .btn-txt .fa,
.btn-nav:hover .btn-txt .fab,
.btn-nav:hover .btn-txt .fas{
  width: 100%;
}

/********** Top Menu **********/
nav {
  border-bottom: 0.3rem solid var(--c-border-alt);
  background-color:var(--c-gray-light);
}

.header-top {
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 99999;
}

.navbar {
  background:transparent;
  transition: var(--transition);
}

.navbar .offcanvas li.nav-item {
  align-self: center;
}
.navbar .offcanvas.show li.nav-item {
  align-self: auto;
}

.offcanvas .navbar-nav{
  gap:1rem;
}

.offcanvas.show .navbar-nav{
  gap:1rem;
}

nav.navbar-expand-xl a,
nav.navbar-expand-xl button{
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 500;
  position: relative;
}
nav.navbar-expand-xl a:hover,
nav.navbar-expand-xl i:hover,
nav.navbar-expand-xl button:hover{
  color: var(--c-secondary);
}

.nav-search svg {
  cursor: pointer;
}
.navbar-expand-xs{
  /* background: transparent !important; */
  /* border-bottom: 0px !important; */
}
.navbar-expand-xs .nav-search{
  display:none;
}
.navbar-expand-xs #nav-link-1{
  margin-top:80px;
}

nav.navbar-expand-xs a{
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 700;
  position: relative;
  transition: var(--transition);
}
nav.navbar-expand-xs a:hover{
  color: var(--c-secondary);
}

nav.fixed-top{
  border-bottom: 0.3rem solid var(--c-border-alt);
  background-color: var(--c-white);
  box-shadow: var(--b-shadow);
  transition: var(--transition);
}

nav.header-top.navbar-expand-xs .navbar-nav a,
nav.header-top.navbar-expand-xs .navbar-nav button,
nav.header-top.navbar-expand-xs .navbar-nav i{
  color: var(--c-primary) !important;
}

nav.header-top.navbar-expand-xs .navbar-nav a:hover,
nav.header-top.navbar-expand-xs .navbar-nav button:hover,
nav.header-top.navbar-expand-xs .navbar-nav i:hover{
  color: var(--c-secondary) !important;
}
nav.header-top .navbar-nav a,
nav.header-top .navbar-nav button,
nav.header-top .navbar-nav i{
  color:white !important;
}
nav.header-top .navbar-nav a:hover,
nav.header-top .navbar-nav button:hover,
nav.header-top .navbar-nav i:hover{
  color:var(--c-secondary) !important;
}

nav.header-top.fixed-top .navbar-nav a,
nav.header-top.fixed-top .navbar-nav button,
nav.header-top.fixed-top .navbar-nav i{
  color:var(--c-primary) !important;
}
nav.header-top.fixed-top .navbar-nav a:hover,
nav.header-top.fixed-top .navbar-nav button:hover,
nav.header-top.fixed-top .navbar-nav i:hover{
  color:white !important;
}

.nav-menu{
  display: flex;
  align-items: center;
}

.nav-menu button {
  z-index:1060;
  background-color: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  padding: 0;
  width: -moz-fit-content;
  width: fit-content;
}

.nav-menu button.opened .line1 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134
}

.nav-menu button.opened .line2 {
  stroke-dasharray: 0 60;
  stroke-dashoffset: -25
}

.nav-menu button.opened .line3 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134
}

.nav-menu button .line {
  fill: none;
  stroke: var(--c-primary);
  stroke-width: 3;
  transition: stroke-dasharray .6s cubic-bezier(.4,0,.2,1),stroke-dashoffset .6s cubic-bezier(.4,0,.2,1)
}

.nav-menu button .line1 { stroke-dasharray: 60 207 }
.nav-menu button .line2 { stroke-dasharray: 80 60 }
.nav-menu button .line3 { stroke-dasharray: 60 207 }
.nav-menu button .line { transition: var(--transition); }
.nav-menu button .opened .line { stroke: var(--c-primary); }
.nav-menu button:hover .line { stroke: var(--c-primary); }

.menu-1{
  /* z-index:1060; */
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.menu-2{
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.nav-link{
  color: var(--c-primary);
  font-size: var(--txt-rem32);
  line-height: 1em;
}

/******* LANG *******/
.nav-language {
  cursor: pointer;
  position: relative;
  font-size: var(--txt-rem22);
  font-weight: 700;
}

.nav-language:hover .nav-language-dropdown {
  opacity: 1;
  pointer-events: all;
  transform: translateX(-50%) translateY(0)
}

.nav-language-selected {
  align-items: center;
  color: var(--c-primary);
  display: flex;
  font-size: var(--txt-rem24);
  font-weight: 700;
  gap: 1rem;
  text-transform: uppercase
}

.nav-language-selected .icon {
  font-size: 1rem;
  transform: rotate(90deg)
}

.nav-language-dropdown {
  background-color: var(--c-white);
  box-shadow: var(--b-shadow);
  display: flex;
  flex-direction: column;
  font-size: var(--txt-rem20);
  font-weight: 400;
  gap: .75rem;
  left: 70%;
  opacity: 0;
  padding: 1rem 1.5rem;
  pointer-events: none;
  position: absolute;
  text-transform: uppercase;
  top: calc(100% + 1rem);
  transform: translateX(-50%) translateY(2rem);
  transition: var(--transition)
}

.nav-language-dropdown:before {
  content: "";
  height: 1rem;
  left: 0;
  position: absolute;
  top: -1rem;
  width: 100%
}

.nav-language-dropdown a {
  font-weight: 300 !important;
}
/******* LANG *******/

/******* Index *******/
.index-clinic-about{
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 10rem 7.5rem 10rem 4rem;
  position: relative;
}

.index-clinic-about-bg{
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.index-clinic-about-bg img,
.index-clinic-about-content-bg img{
  height: 100%;
  width: 100%;
}

.index-clinic-about-content-bg{
  left: 0;
  max-width: 100%;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  z-index: -1;
}

.index-clinic-about-title{
  color: var(--c-querternary);
  font-size: var(--txt-rem60);
  font-weight: 500;
  line-height: 1em;
}

.index-clinic-about-title2{
  color: var(--c-secondary);
  font-size: var(--txt-rem60);
  font-weight: 700;
  line-height: 1em;
  text-align: right;
}

.index-clinic-about-text{
}

.index-clinic-about-image{
  height: 60rem;
  width: 100%;
}

.index-clinic-about-image img{
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}

.index-oops{
  background-color: var(--c-querternary);
  border-radius: 7.5rem;
  margin: 10rem 0;
  position: relative;
}
.index-oops-bg{
  z-index: -1;
}
.index-oops-bg-item{
  pointer-events: none;
  position: absolute;
}
.index-oops-bg-item:nth-child(1){
  left: 8rem;
  top: 9rem;
}
.index-oops-bg-item:nth-child(2){
  left: 50%;
  top: -10rem;
  transform: translateX(-50%) rotate(-90deg);
}
.index-oops-bg-item:nth-child(3){
  bottom: 15rem;
  left: 8rem;
}
.index-oops-bg-item:nth-child(4){
  right: 6rem;
  top: 15rem;
}
.index-oops-bg-item:nth-child(5){
  bottom: 9rem;
  right: 8rem;
}
.index-oops-container{
  padding: 6rem 0;
  position: relative;
}
.index-oops-shape{
  pointer-events: none;
  position: absolute;
  z-index: 1;
  width: unset;
}
.index-oops-shape img{
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}
.index-oops-shape:nth-child(1){
  right: 0;
  top: -4.5rem;
}
.index-oops-shape:nth-child(2){
  bottom: -4.5rem;
  left: 0;
}

.index-oops .section-title{
  font-weight: 700;
  line-height: 1em;
  font-size: var(--txt-rem60);
  color: var(--c-white);
  text-align: center;
  margin-bottom: 3rem;
}

.oops-card {
  display: flex;
  flex-direction: column;
  gap: 4rem
}

.oops-card-image {
  max-height: 30rem;
}

.oops-card-image img {
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%
}

.oops-card-content {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 2rem
}

.oops-card-content-title {
  color: var(--c-white);
  font-size: var(--txt-rem32);
  font-weight: 700;
  text-align: center
}

.index-video {
	overflow: hidden
}

.index-video-play {
	border-radius: 2rem;
	height: 62.5rem;
	overflow: hidden;
	position: relative
}

.index-video-play img {
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%
}

.index-video-play-btn {
	align-items: center;
	background-color: var(--c-tertiary);
	color: var(--c-white);
	border-radius: 50%;
	display: flex;
	height: 15rem;
	justify-content: center;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%);
	width: 15rem;
	z-index: 1
}

.index-video-play-btn:before {
	background-color: var(--c-tertiary);
	border-radius: 50%;
	content: "";
	height: 125%;
	left: 50%;
	opacity: .1;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%);
	width: 125%
}

.index-video-content {
	padding: 6rem;
	position: relative
}

.index-video-content-bg {
	height: 100%;
	left: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1
}

.index-video-content-bg img {
	height: 100%;
	width: 100%
}

.index-video-content-text {
	font-size: var(--txt-rem24);
	font-weight: 400;
	line-height: 1.3em;
	padding-top: 2.5rem;
	padding-bottom: 2.5rem;
}

.index-video-content-text .section-top-title {
	color: var(--c-primary);
	font-size: var(--txt-rem32);
	font-weight: 700;
	line-height: 1em;
}

.index-video-content-list {
	display: flex;
	flex-wrap: wrap;
	gap: 4rem;
	margin-top: 4rem
}

.index-video-content-list-item {
	align-items: center;
	display: flex;
	gap: 2rem;
	width: calc(50% - 2rem)
}

.index-video-content-list-item-icon {
	align-items: center;
	background-color: var(--c-tertiary);
	border-radius: 50%;
	display: flex;
	flex-shrink: 0;
	height: 3.2rem;
	justify-content: center;
	width: 3.2rem
}

.index-video-content-list-item-icon i {
	color: var(--c-white);
	font-size: 1.6rem
}

.index-video-content-list-item-title {
	color: var(--c-primary);
	font-size: var(--txt-rem22);
	font-weight: 500
}

.index-video-shape {
	pointer-events: none;
	position: absolute;
	z-index: 1
}

.index-video-shape img {
	-o-object-fit: contain;
	object-fit: contain
}

.index-video-shape:nth-child(1) {
	left: -2rem;
	top: -2rem
}

.index-video-shape:nth-child(2) {
	bottom: -2rem;
	right: -4rem
}

.index-about-clinics-cities{
  margin: 10rem 0;
}
/******* Index *******/



.nav-appointment > span{
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 400 !important;
  background: var(--c-secondary);
  border-radius: 3rem;
  padding: .5rem 2.5rem;
  white-space: nowrap;
  transition: var(--transition)
}
.nav-appointment > span:hover{opacity: .7;transition: var(--transition)}

@media (min-width: 768px) {
  .navbar-expand-xl .offcanvas >.offcanvas-body a{}
  .navbar-expand-xs .offcanvas >.offcanvas-body a{
    font-weight: 700;
    font-size: var(--txt-rem30);
    line-height: 1.5em;
    transition: unset;
  }
}
/********** Top Menu **********/



/********** SubHeader **********/
.section-title {
  color: var(--c-primary);
  font-size: var(--txt-rem32);
  font-weight: 700;
}

.subheader {
  margin-bottom: 6.5rem;
  padding-top: 3.5rem
}

.subheader.subheader-column .subheader-file{
  margin-bottom: 6.4rem;
}

.subheader-container {
  align-items:flex-start;
  /* align-items: center; */
  display: flex;
  flex-direction: column;
  /* gap: 4rem; */
  justify-content: flex-start;
}

.subheader-file {
  height: 60rem;
  max-height: 60rem;
  position: relative;
  width: 100%;
}

.subheader-file-shape-item {
  pointer-events: none;
  position: absolute;
  z-index: 1
}

.subheader-file-shape-item img {
  border-radius: 0!important;
  -o-object-fit: contain;
  object-fit: contain
}

.subheader-file-shape-item:nth-child(1) {
  left: -5rem;
  top: 10rem
}

.subheader-file-shape-item:nth-child(2) {
  right: -2.5rem;
  top: -7.5rem
}

.subheader-file-shape-item:nth-child(3) {
  bottom: -5rem;
  left: 5rem
}

.subheader-file-shape-item:nth-child(4) {
  bottom: -5rem;
  right: 15rem
}

.subheader-file-video {
  align-items: center;
  background: var(--c-querternary);
  border-radius: 50%;
  bottom: -7.5rem;
  display: flex;
  height: 15rem;
  justify-content: center;
  position: absolute;
  right: 7.5rem;
  width: 15rem
}

.subheader-file-video .icon {
  color: var(--c-primary);
  font-size: 4rem
}

.subheader-file img,.subheader-file video {
  /* height: 100%;
  max-height: 60rem;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%; */
  border-radius: 4.5rem;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: top;
  object-position: top;
  width: 100%;
}

.subheader-title {
  color: var(--c-primary);
  font-size: var(--txt-rem48);
  font-weight: 700;
  /* line-height: 2em */
}

.subheader-simple .subheader-container {
  flex-direction: row-reverse;
  justify-content: space-between
}

.subheader-breadcrumb {
  align-items: center;
  /* display: flex; */
  display: block;
  /* height: 4rem; */
  justify-content: flex-start;
  max-width: 100%;
  /* overflow-x: auto; */
  padding-bottom: .5rem;
  line-height: 3.2em;
  --bs-breadcrumb-margin-bottom:0;
  /* white-space: nowrap */
}

.subheader-breadcrumb .icon {
  flex-shrink: 0;
  font-size: 1rem
}

.subheader-breadcrumb-item {
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 300;
  line-height: 1em
}

.subheader-breadcrumb-item:last-child {
  font-weight: 700;
}

.subheader-breadcrumb-item+.subheader-breadcrumb-item::before {
  content: "\f054";
  font-family: "Font Awesome 5 Free";
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 700;
  padding:0 5px;
}
/********** SubHeader **********/

/********** PageContent **********/
.page-content{
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 400;
  line-height: 1.4em;
}

.page-content-bg{
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.page-content-bg img{
  height: 100%;
  width: 100%;
}

.page-content * {
  line-height: 1.4em;
}

.page-content iframe {
  height:400px;
}

.page-content .youtube-button {
  background: #ff2500;
  color: white;
  padding: 6px;
  border-radius: 6px;
  width: 100%;
  display: block;
  text-align: center;
  box-shadow: 0 1px 4px #000;
  font-weight: 700;
}

.page-content .youtube-button:hover {
  color: white;
  font-weight: 700;
  zoom:1.05
}

.page-content .youtube-button:before {
  content: "\f167";
  font-family: 'Font Awesome 5 Brands';
  color: white;
  font-weight: 700;
  font-size: var(--txt-rem20);
  padding-right:10px
}

.page-content h1,.page-content h2,.page-content h3,.page-content h4,.page-content h5,.page-content h6 {
  color: var(--c-primary);
  font-weight: 700;
  line-height: 3em
}

.page-content h1 {
  font-size: var(--txt-rem48)
}

.page-content h2 {
  font-size: var(--txt-rem32)
}

.page-content h3 {
  font-size: var(--txt-rem30)
}

.page-content h4 {
  font-size: var(--txt-rem28)
}

.page-content h5 {
  font-size: var(--txt-rem26)
}

.page-content h6 {
  font-size: var(--txt-rem24)
}

.page-content p {
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 400
}

.page-content b,.page-content strong {
  font-weight: 700
}

.page-content ol {
  padding-left:4rem;
  margin: 2rem 0;
}

.page-content ol li {
  list-style: auto;
}

.page-content ol li,.page-content ul li {
  color: var(--c-black);
  margin: 1rem 0;
  padding-left: 1.5rem;
  position: relative
}

.page-content ul li:after {
  background-color: var(--c-secondary);
  border-radius: 50%;
  content: "";
  height: 1rem;
  left: 0;
  position: absolute;
  top: .8rem;
  width: 1rem;
  z-index: 1
}

.page-content ol li b,.page-content ol li strong,.page-content ul li b,.page-content ul li strong {
  font-size: 2rem
}

.page-content a {
  color: var(--c-primary);
  text-decoration-thickness: from-font;
}

.page-content a:hover{
  color: var(--c-primary-light);
  font-weight: 500;
  text-decoration: underline;
}

.page-content img {
  max-width: 100%;
  height:auto;
}

.page-content table {
  max-width: 100%
}

.page-content--white,.page-content--white h2,.page-content--white h3,.page-content--white h4,.page-content--white p {
  color: var(--c-white)
}
/********** PageContent **********/


/********** OnlineAppointment **********/
.steps {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 2rem 0 4rem 0;
  position: relative;
}

.step-item {
  z-index: 10;
  text-align: center;
  font-weight: bold;
  font-size: var(--txt-rem20);
  position: relative;
}

.step-item.active{
  -webkit-text-fill-color: transparent;
  background: var(--c-querternary);
  -webkit-background-clip: text;
}

.step-item:after {
  display: block;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  border: none;
  background-color: var(--c-gray);
  transition: .4s;
  content: "";
  position: absolute;
  left: 55%;
  transform: translateX(-50%);
}

.step-item.active:after {
  background: var(--c-querternary);
}

#progress {
  position: absolute;
  width: 99%;
  z-index: 5;
  height: .4rem;
  top: 18px;
  padding: 0 10px;
  appearance: none;
  border: none;
  border-radius: 10px;
  overflow: hidden;
  margin-top: 14px;
}

#progress::-webkit-progress-value {
  background: var(--c-querternary);
  transition: .5s ease;
}

#progress::-webkit-progress-bar {
  /* background: var(--c-querternary); */
}

section.online-appointment{
  /* background-color: var(--c-white-light); */
}
section.online-appointment .online-appointment-bg{
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 2rem;
  width: 100%;
  z-index: -1;
}
section.online-appointment .online-appointment-bg img{
  height: 100%;
  max-height: 100%;
  width: 100%;
}
/********** OnlineAppointment **********/


/********** Treatments **********/
@keyframes shakeAnim {
  0% {
    transform: rotate(0)
  }
  20% {
    transform: rotate(2deg)
  }
  40% {
    transform: rotate(-2deg)
  }
  60% {
    transform: rotate(2deg)
  }
  80% {
    transform: rotate(-2deg)
  }
  to {
    transform: rotate(2deg)
  }
}

@keyframes shakeAnimReverse {
  0% {
    transform: rotate(0)
  }
  20% {
    transform: rotate(-2deg)
  }
  40% {
    transform: rotate(2deg)
  }
  60% {
    transform: rotate(-2deg)
  }
  80% {
    transform: rotate(2deg)
  }
  to {
    transform: rotate(-2deg)
  }
}

.treatment-card {
    border-radius: 7.5rem;
    display: block;
    height: 100%;
    padding: 4rem;
    position: relative;
    transition: var(--transition)
}

.treatment-card-bg {
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0
}

.treatment-card-bg img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%
}

.treatment-card-image {
  height: auto;
  max-height: 30rem;
  position: relative;
  width: 100%;
  z-index: 1
}

.treatment-card-image img {
  height: 100%;
  max-height: 30rem;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%
}

.treatment-card-content {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-content: center;
  margin-top: 3rem;
  position: relative;
  z-index: 1
}

.treatment-card-title {
  color: var(--c-white);
  font-size: var(--txt-rem24);
  font-weight: 700;
  text-align: center
}

.treatment-card:hover {
  animation: shakeAnim .8s linear forwards
}

.treatment-card-secondary {
  background-color: var(--c-secondary)
}

.treatment-card-tertiary {
  background-color: var(--c-tertiary)
}

.treatment-card-querternary {
  background-color: var(--c-querternary)
}
/********** Treatments **********/

/********** Clinics **********/
.clinic-card {
  align-items: center;
  aspect-ratio: 1/1;
  background-color: var(--c-white-alt);
  border-radius: 4.2rem;
  display: flex;
  height: 38rem;
  justify-content: center;
  max-width: 100%;
  position: relative;
  transition: var(--transition)
}

.clinic-card:hover {
  animation: shakeAnim .8s linear forwards
}

.clinic-card-image {
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%
}

.clinic-card-image img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%
}

.clinic-card-container {
  align-items: center;
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 1rem;
  justify-content: center;
  max-height: 65%;
  padding: 4rem;
  text-align: center;
  width: 65%;
  z-index: 1
}

.clinic-card-city {
  font-weight: 300
}

.clinic-card-city,.clinic-card-district {
  color: var(--c-white);
  font-size: var(--txt-rem24);
  line-height: 1em;
  transition: var(--transition);
}

.clinic-card-district {
  font-weight: 700;
}

.clinic-card-secondary {
  background-color: var(--c-secondary);
}

.clinic-card-secondary .clinic-card-container,.clinic-card-tertiary {
  background-color: var(--c-tertiary);
}

.clinic-card-querternary,.clinic-card-tertiary .clinic-card-container {
  background-color: var(--c-querternary);
}

.clinic-card-querternary .clinic-card-container {
  background-color: var(--c-secondary);
}

.clinics-search-container {
  align-items: center;
  display: flex;
  gap: 4rem
}

.clinics-search-bar {
  align-items: center;
  border: .1rem solid var(--c-primary);
  border-radius: 8.7rem;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  min-height: 5rem;
  padding: 0 4rem;
  width: 100%
}

.clinics-search-bar-icon {
  display: flex
}

.clinics-search-bar-icon .icon {
  color: var(--c-primary);
  font-size: 2.4rem
}

.clinics-search-bar-input {
  width: 100%
}

.clinics-search-bar-input input {
  background: none;
  border: none;
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 400;
  outline: none;
  width: 100%
}

.clinics-order {
  flex-shrink: 0;
  position: relative
}

.clinics-order.dropdown-opened .clinics-order-selected .icon {
  transform: rotate(270deg)
}

.clinics-order.dropdown-opened .clinics-order-dropdown {
  opacity: 1;
  pointer-events: all
}

.clinics-order-selected {
  align-items: center;
  color: var(--c-primary);
  cursor: pointer;
  display: flex;
  font-size: var(--txt-rem24);
  gap: 1rem
}

.clinics-order-selected .icon {
  font-size: 1.2rem;
  transform: rotate(90deg);
  transition: var(--transition)
}

.clinics-order-dropdown {
  background-color: var(--c-white);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  left: 50%;
  opacity: 0;
  padding: 1.5rem;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 1rem);
  transform: translateX(-50%);
  transition: var(--transition);
  width: auto
}

.clinics-order-dropdown-item {
  color: var(--c-primary);
  cursor: pointer;
  font-size: var(--txt-rem20);
  font-weight: 400;
  line-height: 1em;
  transition: var(--transition);
  white-space: nowrap
}

.clinics-order-dropdown-item:hover {
  font-weight: 600
}
/********** Clinics **********/


/********** Clinic **********/
.team-card {
  border-radius: 4.2rem;
  display: block;
  display: flex;
  flex: 1;
  flex-direction: column;
  height: 52rem;
  overflow: hidden;
  padding: 8rem 4rem 4rem;
  position: relative;
  transition: var(--transition);
}

.team-card:hover{
  animation: shakeAnim .8s linear forwards
}

.col-6:nth-child(4n+1) .team-card {
  background-color: var(--c-secondary)
}

.col-6:nth-child(4n+2) .team-card {
  background-color: var(--c-tertiary)
}

.col-6:nth-child(4n+3) .team-card {
  background-color: var(--c-querternary);
}

.col-6:nth-child(4n+4) .team-card {
  background-color: var(--c-pink)
}

.team-card.team-card-bg-secondary {
  background-color: var(--c-secondary) !important;
}

.team-card.team-card-bg-tertiary {
  background-color: var(--c-tertiary) !important;
}

.team-card.team-card-bg-querternary {
  background-color: var(--c-querternary) !important;
}

.team-card.team-card-bg-pink {
  background-color: var(--c-pink) !important;
}

.team-card-hover{
  z-index: 2;
}

.team-card-hover,
.team-card-bg {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.team-card-bg {
  pointer-events: none
}

.team-card-bg img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
}

.team-card--doctor .team-card-image.image2 {
  display: none;
}

.team-card--doctor:hover {
  .team-card-image.image1 {
    display: none;
  }
  .team-card-image.image2 {
    display: unset;
  }
}

.team-card-image {
  aspect-ratio: 1 / 1;
  margin-left: auto;
  margin-right: auto;
  /*max-height: 55%;*/
  overflow: hidden;
  position: relative;
  border-radius: 50%;
}

.team-card-image img {
  display: flex;
  margin-left: auto;
  margin-right: auto;
  max-height: 100%;
  max-width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.team-card-image.doctor-icon img {
  width: 70%;
}

.team-card-content {
  padding: 2rem 0;
  position: relative;
  transition: var(--transition);
  width: 100%;
  z-index: 1;
  height: 14rem;
}

.team-card-content-name {
  font-size: var(--txt-rem24);
  font-weight: 700;
  color: var(--c-white);
  text-align: center;
  transition: var(--transition);
}

.team-card-content-roles {
  font-size: var(--txt-rem20);
  font-weight: 500;
  color: var(--c-white);
  text-align: center;
  transition: var(--transition);
}

.team-card-instagram {
  color: var(--c-white);
  position: absolute;
  right: 2rem;
  top: 2rem;
  z-index: 3;
}

.team-card-instagram i {
  font-size: 3.8rem
}

.clinics-doctor-container .team-card {
  height: 100%;
  display: flex;
  flex:1;
  flex-direction: column;
  justify-content: center;
}

/********** Clinic-Treatment **********/
.treatments-list-container {
  background-color: var(--c-white-light);
  padding: 4.5rem
}

.treatments-list-card {
  display: flex;
}

.treatments-list-card:hover {
  font-weight: 700;
}

.treatments-list-title {
  color:var(--c-primary);
  font-size: var(--txt-rem22);
  line-height: var(--txt-rem24);
  display: flex;
  justify-content: center;
  align-items: center;
}

.treatments-list-title i.fa {
  margin-right: 1rem;
  padding: 5px;
  background: var(--bs-teal);
  color: var(--c-white);
  border-radius: 50%;
  font-size: 80%;
  width: 26px;
  height: 26px;
}
/********** Clinic-Treatment **********/

/********** Clinic **********/

/********** Treatment **********/
.custom-pagination .swiper-pagination-bullet-active{
  background: var(--c-secondary);
}

.clinic-info-card {
  background-color: var(--c-gray-light);
  display: flex;
  flex-direction: column;
  gap: 2rem;
  height: 35rem;
  padding: 2rem;
}

.clinic-info-card-name {
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 700;
  min-height: 55px;
  display: flex;
  align-items: center;
}

.clinic-info-card-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 0.35rem;
  max-height: 100%;
  overflow-y: auto
}

.clinic-info-card-content-item {
  color: var(--c-primary);
  font-size: var(--txt-rem18);
  font-weight: 500;
  padding-left: 2rem;
  position: relative
}

.clinic-info-card-content-item:before {
  background-color: var(--c-secondary);
  border-radius: 50%;
  content: "";
  height: .8rem;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: .8rem
}

.custom-pagination.swiper {
  /* padding-bottom: 8rem!important; */
}

.swiper-wrapper {
  box-sizing: content-box !important;
  display: flex !important;
  height: 100% !important;
  position: relative !important;
  transition-property: transform !important;
  width: 100% !important;
  z-index: 1 !important;
}

.swiper-slide {
  flex-shrink: 0 !important;
  height: 100% !important;
  position: relative !important;
  transition-property: transform !important;
}

.swiper-pagination {
  position: absolute !important;
  text-align: center !important;
  transform: translateZ(0) !important;
  transition: opacity .3s !important;
  z-index: 999999 !important;
  align-items: center !important;
  bottom: 0!important;
  display: flex !important;
  gap: 2rem !important;
  justify-content: center !important;
  margin:5rem 0 3rem 0;
}

.swiper-oops{
  position: relative !important;
}

.swiper-pagination-bullet {
  background: var(--c-gray-light) !important;
  height: 1.4rem !important;
  margin: 0 !important;
  opacity: 1 !important;
  transition: var(--transition) !important;
  width: 1.4rem !important;
  cursor: pointer !important;
}

.swiper-pagination .swiper-pagination-bullet-active {
  background: var(--c-secondary) !important;
}
/********** Treatment **********/



/********** PriceList **********/
.pricing-shape-item {
  pointer-events: none;
  position: absolute;
  z-index: -1
}

.pricing-shape-item:nth-child(1) {
  left: 5rem;
  top: 5rem
}

.pricing-shape-item:nth-child(2) {
  right: 0;
  top: 0
}

.pricing-shape-item:nth-child(3) {
  left: 0;
  top: 50%;
  transform: translateY(-50%)
}

.pricing-shape-item:nth-child(4) {
  bottom: 10rem;
  right: 0
}

.accordion-item {
  border-bottom: .1rem solid var(--c-border);
}

.accordion-item.active .accordion-header-title {
  color: var(--c-primary)
}

.accordion-item.active .accordion-content {
  margin-bottom: 2rem;
  opacity: 1
}

.accordion-header {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  padding: 1rem 0;
  transition: var(--transition)
}

.accordion-header-title {
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 700;
  transition: var(--transition)
}

.accordion-header-icon {
  flex-shrink: 0;
  padding-right: 3rem;
  position: relative
}

.accordion-header-icon .icon {
  color: var(--c-border);
  font-size: 1.2rem;
  transform: rotate(90deg);
  transition: var(--transition)
}

.accordion-content {
}

.accordion-content small,.accordion-content strong {
  display: inline-block;
  margin-bottom: 1.5rem
}

.accordion-content strong {
  font-size: 2.4rem;
  font-weight: 900
}

.accordion-content b {
  font-weight: 500;
  line-height: 1.4em
}


.pricing-table {
  width: 100%
}

.pricing-table thead th {
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 700;
  padding-bottom: 2rem
}

.pricing-table tbody tr {
  border-bottom: .1rem solid var(--c-border)
}

.pricing-table tbody tr td {
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 300;
  padding: 2rem 0
}

.pricing-table.price-list tbody tr td {
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 400;
  padding: 2rem 0
}

.pricing-table.price-list tbody tr th {
  color: var(--c-primary);
  font-size: var(--txt-rem22);
  font-weight: 700;
  padding: 2rem 0
}
/********** PriceList **********/

/********** Page Detail **********/
.detail-page-desc{
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 400;
}

.search-container {
  align-items: center;
  display: flex;
  gap: 4rem
}

.search-bar {
  align-items: center;
  border: .1rem solid var(--c-primary);
  border-radius: 8.7rem;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  min-height: 5rem;
  padding: 0 4rem;
  width: 100%
}

.search-bar-icon {
  display: flex
}

.search-bar-icon .icon {
  color: var(--c-primary);
  font-size: 2.4rem
}

.search-bar-input {
  width: 100%
}

.search-bar-input input {
  background: none;
  border: none;
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 400;
  outline: none;
  width: 100%
}

.search-order-container {
  flex-shrink: 0;
  position: relative
}

.search-order-container.dropdown-opened .search-order-selected .icon {
  transform: rotate(270deg)
}

.search-order-container.dropdown-opened .search-order-dropdown {
  opacity: 1;
  pointer-events: all
}

.search-order-selected {
  align-items: center;
  color: var(--c-primary);
  cursor: pointer;
  display: flex;
  font-size: var(--txt-rem24);
  gap: 1rem
}

.search-order-selected .icon {
  font-size: 1.2rem;
  transform: rotate(90deg);
  transition: var(--transition)
}

.search-order-dropdown {
  background-color: var(--c-white);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  left: 50%;
  opacity: 0;
  padding: 1.5rem;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 1rem);
  transform: translateX(-50%);
  transition: var(--transition);
  width: auto
}

.search-order-dropdown-item {
  color: var(--c-primary);
  cursor: pointer;
  font-size: var(--txt-rem20);
  font-weight: 400;
  line-height: 1em;
  transition: var(--transition);
  white-space: nowrap
}

.search-order-dropdown-item:hover {
  font-weight: 600
}
/***** Form-CorporateAgreements *****/

.input-item {
  background: #f9f9f9;
  border: .1rem solid var(--c-gray-light);
  border-radius: 3rem;
  position: relative;
  transition: var(--transition);
  width: 100%;
}

.input-item>input,.input-item>select,.input-item>textarea {
  background: transparent;
  border: none;
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 400;
  line-height: 1em;
  min-height: 6rem;
  outline: none;
  padding: 1.5rem 3rem;
  position: relative;
  top: .2rem;
  width: 100%
}

.input-item-valued {
  border-color: var(--c-primary)!important
}

.input-item-error {
  border-color: var(--c-error)
}

/***** Region ******/
.iti {
  border-radius: 3rem!important;
  height: 100%;
  max-width: 100%!important;
  display: inline-block;
  position: relative;
}

.input-item .iti {
  height: 6rem!important;
  width: 100%!important
}

.iti__selected-flag {
  background-color: unset!important;
  outline: 0!important;
  padding-left: 2.5rem!important;
  padding-right: 4rem!important
}

.iti__selected-flag:before {
  background-color: var(--c-border);
  content: "";
  height: 50%;
  position: absolute;
  right: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: .1rem
}

.iti__flag-container {
  border-bottom-left-radius: 3rem!important;
  border-top-left-radius: 3rem!important
}

.iti input {
  background-color: unset!important;
  border: none;
  font-size: var(--txt-rem20);
  font-weight: 400;
  height: 100%;
  line-height: 1em;
  max-width: 100%;
  width: 100%
}
/***** Region ******/

.checkbox-container {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: flex-start;
  margin-bottom: 0;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}

.checkbox-container input {
  cursor: pointer;
  height: 0;
  opacity: 0;
  position: absolute;
  width: 0
}

.checkbox-icon {
  background-color: var(--c-gray-light);
  border-radius: 50%;
  flex-shrink: 0;
  height: 2.5rem;
  position: relative;
  transition: background-color var(--transition);
  width: 2.5rem;
}

.checkbox-icon:after {
  /* background-image: url(/build/images/icon-tick.svg); */
  background-repeat: no-repeat;
  background-size: 100%;
  content: "";
  height: calc(100% - 1.1rem);
  left: 50%;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%) scale(.5);
  transition: var(--transition);
  visibility: hidden;
  width: calc(100% - 1.1rem);
}

.checkbox-text {
  font-size: 1.6rem;
  padding-left: 1.5rem;
  position: relative;
  top: .1rem;
}

.checkbox-container input:checked~.checkbox-icon {
  background-color: var(--c-success);
}

.checkbox-container input:checked~.checkbox-icon:after {
  opacity: 1;
  transform: translate(-55%,-95%) scale(1);
  visibility: visible;
  content: "\f00c";
  color: white;
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
}
/***** Form-CorporateAgreements *****/

/********** Page Detail **********/


/********** DoctorSingle **********/
.page-content-email{
  color: var(--c-primary);
  font-weight: 700;
  transition: var(--transition);
  font-size: var(--txt-rem24);
  display: block;
  text-align: center;
}
.doctor-image {
  align-items: flex-end;
  background-color: var(--c-white-light);
  display: flex;
  height: 55rem;
  justify-content: center;
  position: relative;
}
.doctor-instagram{
  position: absolute;
  top:20px;
  right:20px;
  font-size: var(--txt-rem48);
}
/********** DoctorSingle **********/

/********** Oops **********/
.oops-card-image{
  height: 35rem;
}
.oops-card-image img{
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}
.oops-card-title{
  color: var(--c-primary);
  font-size: var(--txt-rem24);
  font-weight: 700;
  text-align: center;
}

.section-oops .col-12:nth-child(n+1) a .oops-card-title,
.section-oops .col-12:nth-child(n+1) a .btn-txt{
  color: var(--c-querternary) !important;
}

.section-oops .col-12:nth-child(n+2) a .oops-card-title,
.section-oops .col-12:nth-child(n+2) a .btn-txt{
  color: var(--c-secondary)!important
}

.section-oops .col-12:nth-child(n+3) a .oops-card-title,
.section-oops .col-12:nth-child(n+3) a .btn-txt{
  color: var(--c-tertiary)!important
}

.section-oops .col-12:nth-child(n+4) a .oops-card-title,
.section-oops .col-12:nth-child(n+4) a .btn-txt{
  color: var(--c-pink)!important
}
/********** Oops **********/


/********** Contact **********/
.nav-bg-container{
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}
.nav-bg-container img{
  height: auto;
  max-height: 100%;
  width: 100%;
}
.contact-map{
  height: 50rem;
  border-radius: 4.5rem;
  overflow: hidden;
}
.contact-item{
  text-align: center;
  gap: 1rem;
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
.contact-item-icon{
  font-size: var(--txt-rem32);
}
.contact-item-title{
  color: var(--c-primary);
  text-transform: lowercase;
  font-size: var(--txt-rem24);
  font-weight: 600;
}
.contact-item-content{
  font-size: var(--txt-rem20);
  font-weight: 300;
  line-height: 1em;
}
/********** Contact **********/


/********** About **********/
.page-content-bg{
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}
.page-content-bg img{
  height: 100%;
  width: 100%;
}

.about-shape {
  height: 100%;
  position: absolute;
  width: 100%
}

.about-shape-item {
  pointer-events: none;
  position: absolute;
  z-index: -1
}

.about-shape-item:nth-child(4n+1) {
  right: 3rem;
  top: 2rem
}

.about-shape-item:nth-child(4n+2) {
  bottom: -8rem;
  left: -3rem
}
/********** About **********/


/********** 404 Found **********/
.page-not-found {
  position: relative;
}

.page-not-found-bg {
  height: 100%;
  left: 0;
  opacity: .1;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}

.page-not-found-bg img {
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%;
}

.page-not-found-container {
  text-align:center;
  display: flex;
  flex-direction:column;
  gap:3em;
}

.page-not-found-container h1{
  font-size: var(--txt-rem60);
  font-weight: 800;
}

.page-not-found-container .page-not-found-container-text{
  font-size: var(--txt-rem32);
}
/********** 404 Found **********/


/********** Form Success **********/
.form-success-section {
  background: #333333;
  position:relative;
  height:70vh;
  justify-content: center;
  align-items: center;
  text-align:center;
  display:flex;
  flex-direction: column;
}
.form-success-section .radial-container {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: .2;
  pointer-events: none;
  position: absolute;
  width: 100%;
  z-index: 0;
}
.form-success-section .radial-effect {
  height: 100%;
  background: repeating-radial-gradient(circle, transparent 0 10%, #000000 10% 20%);
}
.form-success-section .page-content{
  width:50%;
  color:white;
  z-index: 1;
}
.form-success-section .dg-logo{
  position: absolute;
  bottom: 10%;
}
/********** Form Success **********/

/********** FOOTER **********/
footer {
  padding: 7rem 0
}

.footer-menu {
  display: flex;
  gap: 6rem;
  justify-content: space-between;
  margin-bottom: 4rem
}

.footer-menu-title {
  align-items: center;
  color: var(--c-primary);
  cursor: pointer;
  display: flex;
  font-size: var(--txt-rem24);
  font-weight: 700;
  justify-content: space-between;
  margin-bottom: 1rem;
  transition: var(--transition)
}

.footer-menu-list:nth-child(1) .footer-menu-title{
  color: var(--c-secondary);
}
.footer-menu-list:nth-child(2) .footer-menu-title{
  color: var(--c-querternary)
}
.footer-menu-list:nth-child(3) .footer-menu-title{
  color: var(--c-tertiary);
}
.footer-menu-list:nth-child(4) .footer-menu-title{
  color: var(--c-pink);
}

.footer-menu-list {
  flex: 1
}

.footer-menu-list-content {
  border-top: .1rem solid var(--c-border);
  display: flex;
  height: 0;
  overflow: hidden;
  transition: var(--transition);
  flex-direction: column;
  gap: 1.5rem;
  padding-top: 2rem;
}

.opened .footer-menu-list-content {
  height: 100%;
}

.footer-menu-list-item {
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 300
}

.footer-menu-list-item:hover {
  text-decoration: underline
}

.footer-social-media {
  align-items: center;
  display: flex;
  justify-content: space-between
}

.footer-social-media img{
  width: 100%;
}

.footer-brands-item {
  height: 14rem;
  padding: 0 3rem
}

.footer-brands-item img {
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  width: 100%
}

.footer-copyright {
  color: var(--c-primary);
  font-size: var(--txt-rem20);
  font-weight: 500;
  text-align: center;
}

.social-list {
  align-items: center;
  display: flex;
}
.social-list-item {
  color: var(--c-primary);
  font-size: var(--txt-rem26);
  transition: var(--transition);
}
.social-list-item:nth-child(1){
  color: var(--c-secondary);
}
.social-list-item:nth-child(2){
  color: var(--c-querternary)
}
.social-list-item:nth-child(3){
  color: var(--c-tertiary);
}
.social-list-item:nth-child(4){
  color: var(--c-pink);
}
.social-list-item span {
  display: none;
}
/********** FOOTER **********/
