/*
Table Of Contents
1.0 Global Styles
2.0 Services
3.0 Categories
4.0 Owl Carousel
5.0 Faq
6.0 Media Queries
7.0 Banner
8.0 Extra 
*/

/* ****************************************************************************************************************************** */
/* 1.0 Global Styles */
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
/* @import url(https://fonts.googleapis.com/css?family=Roboto); */
@font-face {
    font-family: 'montserratextrabold';
    src: url('aia_fonts/montserrat-extrabold-webfont.woff2') format('woff2'),
         url('aia_fonts/montserrat-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'montserratsemibold';
    src: url('aia_fonts/montserrat-semibold-webfont.woff2') format('woff2'),
         url('aia_fonts/montserrat-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
img {
	display: block;
}
* {
	box-sizing: border-box;
}
html, body {
    background-color: #fff;
    font-family: 'Open Sans';
	color: #888;
	font-size: 18px;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    /* -webkit-overflow-scrolling: touch; */
}
h2 {
    font-family: 'montserratextrabold';
	margin-top: 0;
	margin-bottom: 0;
	color: #D01144;
}
.fullwidth {
	width: 100%;
}
.txt-center {
  cursor: pointer;
	text-align: center;
}
.flex-box {
	display: flex;
}
.bg-gray {
	background: #F6F6F6;
}
.bg-white {
	background: #fff;
}
.wrapper {
    max-width: 1280px;
    margin: 0 auto;
	  padding: 3em;
}
/* ****************************************************************************************************************************** */
/* 2.0 Services */
.services {
	max-width: 54em;
	margin: 0 auto;
}
.services > div {
	flex-basis: 25%;
}
.services > div img {
	margin: 0 auto;
	max-width: 10em;
	width: 100%;
}
.service p {
	margin-top: 0;
	font-family: 'montserratsemibold';
	color: #420014;
}
/* ****************************************************************************************************************************** */
/* 3.0 Categories */
.category {
	padding-bottom: 3em;
}
.description {
	align-items: center;
}
.description .icon {
	flex-basis: 10em;
	flex-grow: 0;
	flex-shrink: 0;
}
.description .content {
	flex-basis: auto;
	padding-left: 2em;
}
.dr-price {
	font-family: 'montserratsemibold';
	font-size: 1.5em !important;
	color: #D01144;
}
/* ****************************************************************************************************************************** */
/* 4.0 Owl Carousel */
.owl-carousel img.pic {
  max-width: 100px;
	margin: 0 auto;
	border-radius: 50%;
  /* pic issue */
  /* width: calc(1.3rem + 0.6vw) !important; */
}
.owl-carousel .owl-stage-outer {
	padding: 0.5em 0;
}
/* always display dots issue */
.owl-carousel .owl-item {
	padding: 1em;
	background: #F6F6F6;
  border-radius: 0.5em;
  box-shadow: 0.1em 0.3em 0.3em 0.1em rgb(0 0 0 / 5%);
}
.bg-gray .owl-carousel .owl-item {
  padding: 1em;
	background: #fff;
  border-radius: 0.5em;
  box-shadow: 0.1em 0.3em 0.3em 0.1em rgb(0 0 0 / 5%);

  
  /* card size issue */
  /* max-width: 30em;  */
  width: calc(1.3rem + 0.6vw)
}
.owl-carousel .dr-name {
	font-family: 'montserratextrabold';
	color: #D01144;;
	font-size: 1.2em;
	padding-top: 1em;
}
.owl-carousel .dr-specialisation {
	font-style: italic;
}
.owl-carousel .info, .owl-carousel .card p {
	font-size: 0.8em;
}
.owl-carousel .card p strong {
	font-family: 'montserratsemibold';
	color: #420014;
}
.owl-carousel a {
	display: block;
	width: 100%;
	background: #D01144;
	color: #fff;
	font-family: 'montserratextrabold';
	text-decoration: none;
	padding: 1em 0;
	border-radius: 0.5em;
}
/* ****************************************************************************************************************************** */
/* 5.0 Faq */
input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
.faqs {
  border-radius: 0.5em;
  overflow: hidden;
  box-shadow: 0 4px 4px -2px rgba(0,0,0,0.5);
}
.faq {
    width: 100%;
    color: white;
    overflow: hidden;
}
.faq-label {
	font-family: 'montserratextrabold';
    display: flex;
    justify-content: space-between;
    padding: 1em;
    background: #D01144;
    cursor: pointer;

	text-transform: uppercase;
}
.faq-label:hover {
	background: darken(red, 10%);
}
.faq-label::after {
	content: "\276F";
      width: 1em;
      height: 1em;
      text-align: center;
      transition: all .35s;
}
.faq-content {
	max-height: 0;
    padding: 0 1em;
    color: #888;
    background: #fff;
    transition: all .35s;
}
.faq-close {
	display: flex;
    justify-content: flex-end;
    padding: 1em;
    font-size: 0.75em;
    background: b;
    cursor: pointer;
}
.faq-close:hover {
	background: darken(blue, 10%);
}
input:checked + .faq-label {
	background: darken(blue, 10%);
}
input:checked + .faq-label::after {
      transform: rotate(90deg);
    }
input:checked ~ .faq-content {
	max-height: 100vh;
	padding: 1em;
}
.faq-header {
  margin-bottom: 1em;
}
.faq-question {
  width: 95%; /* solve the question text overflow issue*/
}
/* ****************************************************************************************************************************** */
/* 6.0 Media Queries */
@media (max-width: 1280px) {
	html, body {
		font-size: 16px;
	}
}
@media (max-width: 1024px) {
	.description .icon {
		flex-basis: 10em;
	}
}
@media (max-width: 767px) {
	.services {
		flex-wrap: wrap;
		max-width: 28em;
	}
	.services > div {
		flex-basis: 50%;
	}
	.description.flex-box {
		flex-direction: column;
		align-items: center;
	}
	.description .icon {
		flex-basis: fit-content;
		margin-bottom: 2em;
	}
	.description .content {
		padding-left: 0;
		text-align: center;
	}
	.wrapper {
		padding-left: 1em;
		padding-right: 1em;
	}
}
/* ****************************************************************************************************************************** */
/* 7.0 Banner */
.pos-rel {
    position: relative;
  }
  .pos-abs {
    position: absolute;
  }
  .banner {
    background: rgb(211, 18, 70);
    background: linear-gradient(135deg, rgba(211, 18, 70, 1) 0%, rgba(208, 17, 68, 1) 100%);
    position: relative;
    overflow: hidden;
  }
  .banner * {
    color: #fff;
  }
  .banner .wrapper {
    height: 25em;
  }
  .banner h1 {
    font-family: 'montserratextrabold';
    font-size: 2.6em;
    line-height: 1.2em;
    margin-top: 0;
    margin-bottom: 0;
  }
  .banner p {
    font-family: 'montserratsemibold';
    font-size: 1.3em;
  }
  .banner .triangle {
    width: 31em;
    right: 0;
    bottom: 0;
    z-index: 1;
  }
  .banner .phone {
    width: 21em;
    right: 1em;
    bottom: -9em;
    z-index: 2;
  }
  .banner .dr {
    width: 20em;
    right: 4.3em;
    bottom: 0;
    z-index: 3;
  }
  .banner .content {
    width: 50%;
    height: 100%;
    top: 0;
    z-index: 100;
    padding-top: 3em;
    padding-bottom: 3em;
    align-items: center;
    text-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, 0.5);
  }
  .banner .partnership {
    align-items: center;
    bottom: 0.5em;
    left: 3em;
  }
  .banner .partnership img {
    height: 3em;
    width: auto;
    margin-left: 1em;
  }
  .banner .ico1 {
    width: 6em;
  }
  .banner .ico1.anim {
    animation: float 8s infinite ease;
    z-index: 5;
  }
  .banner .ico1.shadow {
    animation: shadow 8s infinite ease;
  }
  .banner .ico2 {
    width: 4em;
    bottom: 1em;
    left: -3em;
  }
  .banner .ico2.anim {
    animation: float 5s infinite ease;
    z-index: 6;
  }
  .banner .ico2.shadow {
    animation: shadow 5s infinite ease;
  }
  .banner .ico3 {
    width: 4em;
    right: -2em;
    top: 8em;
  }
  .banner .ico3.anim {
    animation: float 12s infinite ease;
    z-index: 7;
  }
  .banner .ico3.shadow {
    animation: shadow 12s infinite ease;
  }
  .banner .ico4 {
    width: 6.8em;
    bottom: 0.5em;
    right: 0;
  }
  .banner .ico4.anim {
    animation: float 16s infinite ease;
    z-index: 8;
  }
  .banner .ico4.shadow {
    animation: shadow 16s infinite ease;
  }
  .banner .shadow {
    transform: translateX(2em) translateY(4em) scale(0.8);
    filter: blur(0.3em) brightness(0) opacity(0.5);
  }
  .banner .heart1 {
      animation: fly 10s infinite linear;
    transform: rotateY(0) rotateZ(22deg);
    bottom: -2em;
    width: 2em;
    left: -5em;
  }
  .banner .heart2 {
      animation: fly 6s infinite linear;
    transform: rotateY(0) rotateZ(22deg);
    bottom: -2em;
    width: 2.5em;
    right: -1em;
  }
  @keyframes float {
    0% {
      transform: translateX(2em) translateY(4em) scale(0.8);
    }
    50% {
      transform: translateX(0) translateY(0) scale(1);
    }
    100% {
      transform: translateX(2em) translateY(4em) scale(0.8);
    }
  }
  @keyframes shadow {
    0% {
      transform: translateX(2em) translateY(4em) scale(0.8);
      filter: blur(0.3em) brightness(0) opacity(0.5);
    }
    50% {
      transform: translateX(2em) translateY(4em) scale(1.2);
      filter: blur(0.3em) brightness(0) opacity(0.3);
    }
    100% {
      transform: translateX(2em) translateY(4em) scale(0.8);
      filter: blur(0.3em) brightness(0) opacity(0.5);
    }
  }
  @keyframes fly {
    0% {
      transform: rotateY(0) translateY(0) translateX(0) rotateZ(22deg);
    }
      80% {
          opacity: 1;
      }
    90% {
     transform: rotateY(360deg) translateY(-30em) translateX(4em) rotateZ(22deg);
        opacity: 0;
    }
    100% {
      transform: rotateY(360deg) translateY(-30em) translateX(4em) rotateZ(22deg);
        opacity: 0;
    }
  }
  @media (max-width: 1125px) {
    .banner .content {
      font-size: 0.9em;
    }
  }
  @media (max-width: 1024px) {
    .banner .content {
      font-size: 1em;
      width: 35em;
    }
  }
  @media (max-width: 850px) {
    .banner .wrapper {
      font-size: 0.8em;
    }
  }
  @media (max-width: 767px) {
    .banner .wrapper {
      height: 39em;
      padding-left: 3em;
      padding-right: 3em;
    }
    .banner .content.flex-box {
      display: block;
      width: 100%;
      max-width: 42em;
      left: 3em;
      padding-right: 6em;
    }
  }
  @media (max-width: 560px) {
    .banner .wrapper {
      font-size: 0.75em;
      height: 45em;
    }
    .banner .partnership {
      bottom: 23em;
    }
    .banner .partnership {
      left: 3.5em;
    }
  }
  @media (max-width: 470px) {
    .banner .wrapper {
      height: 50em;
    }
  }
  @media (max-width: 420px) {
    .banner .wrapper {
      height: 55em;
    }
  }
/* ****************************************************************************************************************************** */
/* 8.0 Extra */
.owl-carousel .owl-stage {
  /* solve card's "book now" misalignment issue */
	display: flex; 
  /* solve card align center issue */
  margin: 0 auto;
}
.owl-carousel .card > .other-info > p:last-child {
	margin-bottom: 10em;
}
.book-now {
	bottom: 0;
	left: 0;
	padding: 0 1em 1em;
	width: 100%;
}
/* REMOVE WHEN MANY CARDS */
/* .cards {
	padding-left: 2em;
	padding-right: 2em;
	max-width: 60em;
	margin: 0 auto;

  cursor: pointer;
} */