/* ==========================================================================
Table of Contents
========================================================================== */
/* 
  - Shared Elements
    > Text Shadow
    > Buttons
    > Background
  - Sections
  - Hero
  - Info
  - Highlight
  - FAQ 
  - testimony 
  - Photos 
  - Team 
  - Contact
  - SVG
  - Responsive breakpoints
 */

/* ==========================================================================
Shared Elements
========================================================================== */
@media (min-width: 576px) {
	#maincontent {
		margin-top: 0;
	}
}
}
.content > p {
    display: none;
}

/* ------------  text-shadow  ------------ */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
}

/* ------------  buttons  ------------ */
.btn-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.3);
}
.btn-play,
.btn-play svg {
  width: 182px;
  height: 182px;
}
@media (max-width: 767.98px) {
  .btn-play,
  .btn-play svg {
    width: 100px;
    height: 100px;
  }
}
.btn-play .stroke-solid {
  stroke-dashoffset: 0;
  stroke-dasharray: 300;
  stroke-width: 2px;
  transition: stroke-dashoffset 1s ease, opacity 1s ease;
}

.btn-play .icon {
  transform: scale(0.8);
  transform-origin: 50% 50%;
  transition: transform 200ms ease-out;
}

/* Hover */
.btn-play:hover .stroke-solid {
  opacity: 1;
  stroke-dashoffset: 300;
}
.btn-play:hover .icon {
  transform: scale(0.9);
}

/* Spin animation */
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* .btn-event */
.content .btn-event {
  border: 2px solid #fff;
  padding: 0.5rem 1.25rem;
  border-radius: 50px;
  position: relative;
  overflow: hidden;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
/*   background-color: #6da3cd; */
  background-color: #33597E;
  z-index: 1;
  color: #fff !important;
  text-decoration: none !important;
  text-align: center;
  letter-spacing: 1px;
  font-weight: 500;
  text-transform: uppercase;
  text-transform: capitalize;
}

.content .btn-event:hover {
  border: 2px solid #1c335f;
  color: #1c335f !important;
}
.btn-event::before {
  content: "";
  width: 0%;
  height: 100%;
  display: block;
  background: #fff;
  position: absolute;
  -ms-transform: skewX(-20deg);
  -webkit-transform: skewX(-20deg);
  transform: skewX(-20deg);
  left: -10%;
  opacity: 1;
  top: 0;
  z-index: -12;
  -moz-transition: all 0.7s cubic-bezier(0.77, 0, 0.175, 1);
  -o-transition: all 0.7s cubic-bezier(0.77, 0, 0.175, 1);
  -webkit-transition: all 0.7s cubic-bezier(0.77, 0, 0.175, 1);
  transition: all 0.7s cubic-bezier(0.77, 0, 0.175, 1);
  box-shadow: 2px 0px 14px rgba(0, 0, 0, 0.6);
}

.btn-event::after {
  content: "";
  width: 0%;
  height: 100%;
  display: block;
  background: #51607f;
  position: absolute;
  -ms-transform: skewX(-20deg);
  -webkit-transform: skewX(-20deg);
  transform: skewX(-20deg);
  left: -10%;
  opacity: 0;
  top: 0;
  z-index: -15;
  -webkit-transition: all 0.94s cubic-bezier(0.2, 0.95, 0.57, 0.99);
  -moz-transition: all 0.4s cubic-bezier(0.2, 0.95, 0.57, 0.99);
  -o-transition: all 0.4s cubic-bezier(0.2, 0.95, 0.57, 0.99);
  transition: all 0.4s cubic-bezier(0.2, 0.95, 0.57, 0.99);
  box-shadow: 2px 0px 14px rgba(0, 0, 0, 0.6);
}
.btn-event:hover::before,
.btn-event:hover::before {
  opacity: 1;
  width: 116%;
}
.btn-event:hover::after,
.btn-event:hover::after {
  opacity: 1;
  width: 120%;
}

/* ------------ background  ------------ */
.bg-curved {
  position: relative;
  z-index: 2;
  margin-bottom: -100px;
  padding: 100px 0;
  background: linear-gradient(
    0deg,
    rgba(255, 255, 255, 0) 10%,
    rgba(28, 51, 95) 10%,
    rgba(28, 51, 95) 100%
  );
}
.bg-curved::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  height: 200px;
  width: 110%;
  background-color: rgb(28, 51, 95);
  transform: translateX(-50%);
  clip-path: ellipse(50% 50% at 50% 50%);
}
@media (max-width: 991.98px) {
  .bg-curved {
    padding: 60px 0 80px;
    background: linear-gradient(
      0deg,
      rgba(255, 255, 255, 0) 5%,
      rgba(28, 51, 95) 5%,
      rgba(28, 51, 95) 100%
    );
  }
  .bg-curved::before {
    height: 100px;
    clip-path: ellipse(50% 50% at 50% 50%);
  }
}
.bg-curved + section,
.bg-curved + p + section,
.bg-curved + p + p + section {
  padding-top: 150px !important;
}
/* ==========================================================================
Sections
========================================================================== */
.section-hero,
.section-schedule,
.section-info,
.section-highlight,
.section-faq,
.section-testimony,
.section-photos,
.section-team {
  overflow: hidden;
  position: relative;
}
.section-hero {
  /* background-color: #1c335f; */
}
.section-schedule {
  background-color: #1c335f;
}
.section-info {
  background-color: #f2f2f2;
}
.section-highlight {
  background-color: #1c335f;
}
.section-faq {
  background-color: #f2f2f2;
}
.section-testimony {
  background-color: #1c335f;
}
.section-photos {
  background-color: #f2f2f2;
}
.section-team {
  background-color: #1c335f;
}
/* ==========================================================================
Hero
========================================================================== */
.hero {
  min-height: 150px;
}
.hero__figure {
  position: relative;
}
@media (min-width: 768px) {
  .hero {
    min-height: 476px;
  }
  .hero__figure {
    overflow: hidden;
    width: 100%;
    height: 450px;
  }
  .hero__figure img {
    object-fit: cover;
    width: 100%;
    height: 100% !important;
  }
}

/* ==========================================================================
schedule
========================================================================== */
.schedule__content {
  position: relative;
}
/* .schedule-head */
.schedule-head {
  position: relative;
  background-color: #041e42;
  padding: 20px;
  border-radius: 20px 20px 0 0;
}
.schedule-head .btn {
  color: white !important;
}
.schedule-head .btn.disable {
  color: black !important;
}
@media (max-width: 767.98px) {
  .schedule-head__title .h3 {
    font-size: 1.25rem;
  }
}
@media (min-width: 992px) {
  .schedule-head__title .h3 {
    margin-bottom: -40px;
  }
}
.schedule-head__choose {
  position: relative;
}
.schedule-head__choose .icon {
  position: absolute;
  top: 50%;
  right: 5px;
  transform: translateY(-50%);
  color: rgba(255, 255, 255, 0.3);
  pointer-events: none;
}
.schedule-head__arrows,
.schedule-head__choose {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 5px;
}

/* .schedule__body */
.schedule__body {
  border-radius: 0 0 1.25rem 1.25rem;
}
@media (min-width: 768px) {
  .schedule__body {
    padding: 1.25rem;
    border-radius: 0 0 1.25rem 1.25rem;
    background-color: #ccc;
  }
}

/* .schedule__content */
@media (min-width: 768px) {
  .schedule-content {
    overflow: hidden;
    border-radius: 20px;
  }
}
.schedule-content__title {
  display: flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  background-color: #dae7f0;
  color: #2d3f63;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .schedule-content__title {
    width: 200px;
    padding: 1.25rem;
    border-right: 2px solid rgba(0, 0, 0, 0.2);
    background-image: linear-gradient(rgba(0, 0, 0, 0.2) 1px, transparent 1px);
    background-size: 100px 100px;
    background-position: 0 50px;
  }
}
.schedule-content__rotate {
  margin-bottom: 0;
  padding: 15px;
  font-size: 1.5rem;
  text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}
@media (min-width: 768px) {
  .schedule-content__rotate {
    display: block;
    transform-origin: center;
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    font-size: 5.5rem;
  }
}

.schedule-content__body {
  background-color: #fff;
  padding: 1.25rem 1.25rem 0;
  overflow-x: hidden;
  overflow-y: overlay;
  width: calc(100% - 200px);
  height: 1000px; /* update */
  background-image: linear-gradient(rgba(0, 0, 0, 0.2) 1px, transparent 1px);
  background-size: 50px 50px;
  background-position: 0 50px;
  background-attachment: local;
}
@media (max-width: 767.98px) {
  .schedule-content__body {
    padding: 1rem;
    width: 100%;
    height: auto;
    max-height: 800px;
    border-radius: 0 0 1rem 1rem;
  }
}

.schedule-card__body {
  padding-bottom: 2rem;
  color: #fff;
}
.schedule-card__title {
  color: #fff;
}
.schedule-card__snippet + .schedule-card__trigger {
  display: block;
}
.schedule-card__trigger {
  display: none;
  position: absolute;
  right: 20px;
  bottom: 10px;
  cursor: pointer;
}

.schedule-card__trigger::before {
  margin-right: 10px;
  font-size: 0.8rem;
  content: "Show Less";
}
.schedule-card__trigger.collapsed::before {
  content: "Learn More";
}
.schedule-card__trigger.collapsed .bi-chevron-down,
.schedule-card__trigger .bi-chevron-up {
  display: inline-block;
}
.schedule-card__trigger.collapsed .bi-chevron-up,
.schedule-card__trigger .bi-chevron-down {
  display: none;
}

/* ------------ cards  ------------ */
.schedule-card {
  border-width: 0;
  transition: transform 300ms;
}
.schedule-card:hover {
  transform: translateY(5px) scale(1.005) translateZ(0);
  box-shadow: 0 10px 5px rgba(0, 0, 0, 0.16);
}

@media (min-width: 768px) {
  .schedule-card__time {
    min-width: 180px;
  }
  .schedule-card__location {
    min-width: 220px;
  }
}

/* ------------ themes  ------------ */
.schedule-card.theme01 {
/*   background-color: #7cabc9; */
  background-color: #33597e;
}
.schedule-card.theme02 {
  background-color: #51607f;
}
.schedule-card.theme03 {
  background-color: #2d3f63;
  background: repeating-linear-gradient(
    135deg,
    #2d3f63,
    #2d3f63 10px,
    #51607f 10px,
    #51607f 20px
  );
}
.schedule-card.theme04 {
  background-color: #b7a679;
}
.schedule-card.theme05 {
  background: repeating-radial-gradient(
    circle,
    #a2733d,
    #a2733d 10px,
    #b57d39 10px,
    #b57d39 20px
  );
}
.schedule-card.theme06 {
  background-color: #041e42;
}

/* ------------ bootstrap  classes------------ */
.dropdown-toggle {
  min-width: 200px;
  text-align: left;
}
.dropdown-toggle::after {
  opacity: 0;
}

/* ==========================================================================
info
========================================================================== */
/* ------------ theme------------ */
.section-info--dark {
  background: #1c335f;
}
.section-info--dark,
.section-info--dark .h1 {
  color: #fff;
}

/* ==========================================================================
highlight
========================================================================== */
.highlight__link {
  overflow: hidden;
  width: 100%;
}
.highlight__link:hover {
  text-decoration: none;
}

/* ------------ card  ------------ */
.card-highlight {
  overflow: hidden;
  width: 100%;
  color: #000;
  border-width: 0;
  border-radius: 0;
  background-color: #fff;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  transition: transform 0.3s ease-out;
}
.card-highlight__img {
  position: relative;
  border-radius: 0;
  z-index: 3;
  object-fit: cover;
  width: 100%;
  height: 100% !important;
}
.card-highlight__icon {
  width: 80px;
  height: 80px;
  margin: -40px auto 0;
  z-index: 4;
}
.card-highlight__button {
  margin: -35px auto 0;
  z-index: 4;
}
.card-highlight__icon i {
  display: block;
  width: 100%;
  height: 100%;
  padding-top: 8px;
  background-color: #041e42;
  border: 2px solid #fff;
  transition: 0.3s;
  font-size: 36px;
  color: #fff;
  text-align: center;
}
.card-highlight__body {
  padding: 1.25rem 2rem 2rem;
  z-index: 2;
  transition: color 0.3s ease-out;
}
.card-highlight__text,
.card-highlight__title {
  position: relative;
  z-index: 1;
}
.card-highlight__overlay {
  position: relative;
}
@media (min-width: 768px) {
  .card-highlight__overlay {
    overflow: hidden;
    height: 230px;
  }
}
.card-highlight__body {
  position: relative;
}
.card-highlight__body::before {
  content: "";
  position: absolute;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #041e42;
  top: -70px;
  left: 50%;
  z-index: 0;
  transform: translateX(-50%);
  transition: transform 0.5s ease-out;
}
.card-highlight:hover .card-highlight__body::before {
  transform: scale(24) translateZ(0);
}
.card-highlight:hover {
  transform: translateY(-5px) scale(1.005) translateZ(0);
}
.card-highlight:hover,
.card-highlight:hover .card-highlight__title {
  color: #fff;
}

/* ==========================================================================
faq
========================================================================== */
.faq__link {
  display: block;
  position: relative;
  color: inherit;
}
.faq__link:hover {
  text-decoration: none;
}
/* ------------ theme------------ */
.section-faq--dark {
  background: #1c335f;
}
.section-faq--dark .h2,
.section-faq--dark .page-header {
  color: #fff;
}
.section-faq--dark .faq-card::before {
  background-image: radial-gradient(circle, #ccc 30%, transparent 10%),
    radial-gradient(circle, #ccc 30%, transparent 10%);
}

/* ------------ card  ------------ */
.faq-card {
  position: relative;
  height: 100%;
  border-width: 0;
  border-radius: 0;
  background-color: #fff;
  padding-left: 90px;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  border-top: 5px solid #2d3f63;
  z-index: 1;
}

.faq-card::before {
  content: "";
  position: absolute;
  top: 60px;
  left: -20px;
  width: calc(100% + 40px);
  height: calc(100% - 40px);
  /* background-color: #1c335f; */
  background-image: radial-gradient(circle, #2d3f63 30%, transparent 10%),
    radial-gradient(circle, #2d3f63 30%, transparent 10%);
  background-size: 10px 10px;
  background-position: 0 0, 0 0;
  transition: transform 300ms;
  z-index: 0;
}
.faq-card:hover::before {
  transform: rotate(2deg);
}

.faq-card__icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 90px;
  padding: 1.25rem;
  bottom: 0;
  background: #fff;
}
.faq-card__icon i {
  display: block;
  font-size: 40px;
  line-height: 1;
  text-align: center;
  color: #000;
}
.faq-card__body {
  position: relative;
  background: #fff;
}

/* ==========================================================================
testimony
========================================================================== */
/* ------------ card  ------------ */
.testimony-card {
  height: 100%;
  border-width: 0;
  background-color: transparent;
}
.testimony-card__img {
  width: 120px;
  height: 120px !important;
  border-radius: 50%;
  border: 5px solid #fff;
  position: relative;
  z-index: 2;
  margin: 0 auto -65px;
  transition: all 300ms;
}
.testimony-card__body {
  padding: 90px 1.5rem 2rem;
  background-color: #f2f2f2;
  border-radius: 20px;
  transition: transform 300ms;
}
.testimony-card:hover .testimony-card__img {
  border: 5px solid #b7a679;
}
.testimony-card:hover .testimony-card__body {
  transform: translateY(-5px);
}

/* ==========================================================================
photos
========================================================================== */
.photos__body.hide div:nth-of-type(1n + 10),
.photos__button.hide {
  display: none;
}
/* ------------ card  ------------ */
.photo-card {
  position: relative;
}
.photo-card__fig {
  position: relative;
  overflow: hidden;
  height: 165px;
}
@media (min-width: 576px) {
  .photo-card__fig {
    height: 200px;
  }
}
@media (min-width: 768px) {
  .photo-card__fig {
    height: 230px;
  }
}
.photo-card__img {
  object-fit: cover;
  width: 100%;
  height: 100% !important;
}
.photo-card__text {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  padding: 1rem 1.25rem;
  background-color: rgba(28, 51, 95, 0.85);
  color: #fff;
}
@media (max-width: 991.98px) {
  .photo-card__text {
    padding: 0.5rem;
  }
}

/* effect-apollo */
.photo-card.effect-apollo {
  overflow: hidden;
}

.photo-card.effect-apollo .photo-card__body {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.photo-card.effect-apollo .photo-card__body::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: rgba(255, 255, 255, 0.5); */
  background: rgba(28, 51, 95, 0.5);
  content: "";
  -webkit-transition: -webkit-transform 1s;
  transition: transform 1s;
  -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
    translate3d(0, -100%, 0);
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
    translate3d(0, -100%, 0);
}
.photo-card.effect-apollo:hover .photo-card__body::before {
  -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
    translate3d(0, 100%, 0);
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg)
    translate3d(0, 100%, 0);
}

/* ==========================================================================
team
========================================================================== */

/* ------------ card  ------------ */
.team-card {
  border-width: 0;
  border-radius: 0;
  background-color: transparent;
  height: 100%;
}
.team-card__img {
  border-radius: 0;
  object-fit: cover;
  width: 100%;
  height: 100% !important;
}
.team-card__fig {
  padding-right: 100px;
  transition: transform 300ms;
}
@media (min-width: 576px) {
  .team-card__fig {
    height: 350px;
  }
}
@media (min-width: 768px) {
  .team-card__fig {
    height: 300px;
  }
}
@media (min-width: 992px) {
  .team-card__fig {
    height: 250px;
  }
}
.team-card__fig:hover {
  transition: transform 300ms;
}
.team-card__body {
  margin: -60px 0 0 24px;
  background-color: #fff;
  box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
  transition: transform 300ms;
}
.team-card:hover .team-card__fig {
  transform: translateX(76px);
}
.team-card:hover .team-card__body {
  transform: translateX(-50px);
}
/* hexagon */
#Polygon_9 {
	opacity: 0.4;
}

/* ==========================================================================
Contact
========================================================================== */
section.contact-section div[class*="contact-info-box"] {
  color: #444444;
  text-align: center;
  box-shadow: 0 0 30px rgb(214 215 216 / 60%);
  padding: 30px 0;
}
section.contact-section img[class*="contact-section__map"] {
  box-shadow: 0 0 30px rgb(214 215 216 / 60%);
}
section.contact-section {
  background-color: #ffffff;
}
section.contact-section a {
  text-decoration: none !important;
}

/* ==========================================================================
SVG
========================================================================== */
.hexagon-1 {
  fill: none;
}

.hexagon-2,
.hexagon-blue,
.hexagon-gold,
.hexagon-tan {
  stroke: none;
}

.hexagon-blue {
  fill: #09254d;
}

.hexagon-gold {
  fill: #b57d39;
}

.hexagon-tan {
  fill: #b7a679;
}

.bg-svg-01,
.bg-svg-02,
.bg-svg-03,
.bg-svg-04,
.bg-svg-05,
.bg-svg-06,
.bg-svg-07,
.bg-svg-08,
.bg-svg-09,
.bg-svg-10 {
  position: absolute;
  opacity: 0.45;
}
.bg-svg-01 {
  left: -236px;
  top: -126px;
}
@media (max-width: 1499.98px) {
  .bg-svg-01 {
    left: -12%;
    top: -14%;
  }
}
.bg-svg-02 {
  right: -218px;
  top: -126px;
}
@media (max-width: 1499.98px) {
  .bg-svg-02 {
    top: -12%;
    right: -14%;
  }
}
.bg-svg-03 {
  left: -236px;
  top: 130px;
}
.bg-svg-04 {
  right: -218px;
  top: 130px;
}
.bg-svg-05 {
  left: 20px;
  bottom: 60px;
}
.bg-svg-06 {
  right: -30px;
  /* top: -20px; */
  top: 10px;
}
.bg-svg-07 {
  left: -20px;
  /* bottom: -30px; */
  bottom: 10px;
}
.bg-svg-08 {
  right: -30px;
  /* top: -20px; */
  top: 15px;
}
.bg-svg-09 {
  left: -100px;
  /* top: -45px; */
  top: 100px;
}
.bg-svg-10 {
  right: -80px;
  /* top: -15px; */
  top: 100px;
}
/* size */
.bg-svg-01 svg,
.bg-svg-02 svg,
.bg-svg-03 svg,
.bg-svg-04 svg {
  width: 671px;
  height: 800px;
}
@media (max-width: 1499.98px) {
  .bg-svg-01,
  .bg-svg-02,
  .bg-svg-03,
  .bg-svg-04 {
    width: 40%;
  }
  .bg-svg-01 svg,
  .bg-svg-02 svg,
  .bg-svg-03 svg,
  .bg-svg-04 svg {
    width: 100%;
    height: auto;
  }
}
.bg-svg-05 svg {
  width: 249px;
  height: 227px;
}
.bg-svg-06 svg {
  width: 265px;
  height: 286px;
}
.bg-svg-07 svg {
  width: 135px;
  height: 160px;
}
.bg-svg-08 svg {
  width: 187px;
  height: 266px;
}
.bg-svg-09 svg {
  width: 322px;
  height: 384px;
}
.bg-svg-10 svg {
  width: 315px;
  height: 420px;
}
