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

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
figure, header, nav, section, article, aside, footer, figcaption {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}

ul, li {
  padding: 0;
  margin: 0;
  list-style: none;
}

header, nav, section, article, aside, footer, hgroup {
  display: block;
}

* {
  box-sizing: border-box;
}

html, body {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  background-color: #fff;
  font-size: 16px;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  text-decoration: none !important;
  color: #3CF;
}

a:hover {
	color: #FC3;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0px;
  margin-bottom: 0px;
}

ul {
  margin-bottom: 0px;
}

p {
  font-size: 14px;
  line-height: 25px;
  color: #2a2a2a;
}

img {
  width: 100%;
  overflow: hidden;
}

/* 
---------------------------------------------
global styles
--------------------------------------------- 
*/
html,
body {
  background: #fff;
  font-family: 'Poppins', sans-serif;
}

::selection {
  background: #f5a425;
  color: #fff;
}

::-moz-selection {
  background: #f5a425;
  color: #fff;
}

@media (max-width: 991px) {
  html, body {
    overflow-x: hidden;
  }
  .mobile-top-fix {
    margin-top: 30px;
    margin-bottom: 0px;
  }
  .mobile-bottom-fix {
    margin-bottom: 30px;
  }
  .mobile-bottom-fix-big {
    margin-bottom: 60px;
  }
}

.main-button-red a {
  font-size: 13px;
  color: #fff;
  background-color: #a12c2f;
  padding: 12px 30px;
  display: inline-block;
  border-radius: 22px;
  font-weight: 500;
  text-transform: uppercase;
  transition: all .3s;
}

.main-button-red a:hover {
  opacity: 0.9;
}

.main-button-yellow a {
  font-size: 13px;
  color: #fff;
  background-color: #f5a425;
  padding: 12px 30px;
  display: inline-block;
  border-radius: 22px;
  font-weight: 500;
  text-transform: uppercase;
  transition: all .3s;
}

.main-button-yellow a:hover {
  opacity: 0.9;
}

.section-heading h2 {
  line-height: 40px;
  margin-top: 0px;
  margin-bottom: 50px; 
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(250,250,250,0.15);
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
}



/* 
---------------------------------------------
header
--------------------------------------------- 
*/

.sub-header {
    background-color: #1f272b;
    position: relative;
    z-index: 1111;
  }
  
  .sub-header .left-content p {
    color: #fff;
    padding: 8px 0px;
    font-size: 13px;
  }
  
  .sub-header .right-icons {
    text-align: right;
    padding: 8px 0px;
  }
  
  .sub-header .right-icons ul li {
    display: inline-block;
    margin-left: 15px;
  }
  
  .sub-header .right-icons ul li a {
    color: #fff;
    font-size: 20px;
    transition: all .3s;
  }
  
  .sub-header .right-icons ul li a:hover {
    color: #f5a425;
  }
  
  .sub-header .left-content p em {
     font-style: normal;
     color: #f5a425;
  }
  
  .background-header {
    background-color: #C0C0C0!important;
    height: 80px!important;
    position: fixed!important;
    top: 0!important;
    left: 0;
    right: 0;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.15)!important;
  }
  
  .background-header .main-nav .nav li a {
    color: #1e1e1e!important;
  }
  
  .background-header .logo,
  .background-header .main-nav .nav li a {
    color: #1e1e1e!important;
  }
  
  .background-header .main-nav .nav li:hover a {
    color: #fb5849!important;
  }
  
  .background-header .nav li a.active {
    color: #fb5849!important;
  }
  
  .header-area {
    background-color: rgba(250,250,250,0.15);
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    z-index: 100;
    -webkit-transition: all .5s ease 0s;
    -moz-transition: all .5s ease 0s;
    -o-transition: all .5s ease 0s;
    transition: all .5s ease 0s;
  }
  
  .header-area .main-nav {
    min-height: 80px;
    background: transparent;
  }
  
  .header-area .main-nav .logo {
    line-height: 100px;
    color: #fff;
    font-size: 52px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    float: left;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
  }
  
  .background-header .main-nav .logo {
    line-height: 75px;
  }
  
  .background-header .nav {
    margin-top: 20px !important;
  }
  
  .header-area .main-nav .nav {
    float: right;
    margin-top: 30px;
    margin-right: 0px;
    background-color: transparent;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    position: relative;
    z-index: 999;
  }
  
  .header-area .main-nav .nav li {
    padding-left: 15px;
    padding-right: 15px;
  }
  
  .header-area .main-nav .nav li:last-child {
    padding-right: 0px;
  }
  
  .header-area .main-nav .nav li a {
    display: block;
    font-weight: 500;
    font-size: 15px;
    text-transform: uppercase;
    color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    height: 40px;
    line-height: 40px;
    border: transparent;
    letter-spacing: 1px;
  }
  
  .header-area .main-nav .nav li:hover a,
  .header-area .main-nav .nav li a.active {
    color: #f5a425!important;
  }
  
  .background-header .main-nav .nav li:hover a,
  .background-header .main-nav .nav li a.active {
    color: #f5a425!important;
    opacity: 1;
  }
  
  .header-area .main-nav .nav li.has-sub {
    position: relative;
    padding-right: 15px;
  }
  
  .header-area .main-nav .nav li.has-sub:after {
    font-family: FontAwesome;
    content: "\f107";
    font-size: 12px;
    color: #fff;
    position: absolute;
    right: 5px;
    top: 12px;
  }
  
  .background-header .main-nav .nav li.has-sub:after {
    color: #1e1e1e;
  }
  
  .header-area .main-nav .nav li.has-sub ul.sub-menu {
    position: absolute;
    width: 200px;
    box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06);
    overflow: hidden;
    top: 40px;
    opacity: 0;
    transition: all .3s;
    transform: translateY(+2em);
    visibility: hidden;
    z-index: -1;
  }
  
  .header-area .main-nav .nav li.has-sub ul.sub-menu li {
    margin-left: 0px;
    padding-left: 0px;
    padding-right: 0px;
  }
  
  .header-area .main-nav .nav li.has-sub ul.sub-menu li a {
    opacity: 1;
    display: block;
    background: #f7f7f7;
    color: #2a2a2a!important;
    padding-left: 20px;
    height: 40px;
    line-height: 40px;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    position: relative;
    font-size: 13px;
    font-weight: 400;
    border-bottom: 1px solid #eee;
  }
  
  .header-area .main-nav .nav li.has-sub ul li a:hover {
    background: #fff;
    color: #f5a425!important;
    padding-left: 25px;
  }
  
  .header-area .main-nav .nav li.has-sub ul li a:hover:before {
    width: 3px;
  }
  
  .header-area .main-nav .nav li.has-sub:hover ul.sub-menu {
    visibility: visible;
    opacity: 1;
    z-index: 1;
    transform: translateY(0%);
    transition-delay: 0s, 0s, 0.3s;
  }
  
  .header-area .main-nav .menu-trigger {
    cursor: pointer;
    display: block;
    position: absolute;
    top: 33px;
    width: 32px;
    height: 40px;
    text-indent: -9999em;
    z-index: 99;
    right: 40px;
    display: none;
  }
  
  .background-header .main-nav .menu-trigger {
    top: 23px;
  }

.header-area .main-nav .menu-trigger span,
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #1e1e1e;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
}

.background-header .main-nav .menu-trigger span,
.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after {
  background-color: #1e1e1e;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #1e1e1e;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
  width: 75%;
}

.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after {
  background-color: #1e1e1e;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  content: "";
}

.header-area .main-nav .menu-trigger span {
  top: 16px;
}

.header-area .main-nav .menu-trigger span:before {
  -moz-transform-origin: 33% 100%;
  -ms-transform-origin: 33% 100%;
  -webkit-transform-origin: 33% 100%;
  transform-origin: 33% 100%;
  top: -10px;
  z-index: 10;
}

.header-area .main-nav .menu-trigger span:after {
  -moz-transform-origin: 33% 0;
  -ms-transform-origin: 33% 0;
  -webkit-transform-origin: 33% 0;
  transform-origin: 33% 0;
  top: 10px;
}

.header-area .main-nav .menu-trigger.active span,
.header-area .main-nav .menu-trigger.active span:before,
.header-area .main-nav .menu-trigger.active span:after {
  background-color: transparent;
  width: 100%;
}

.header-area .main-nav .menu-trigger.active span:before {
  -moz-transform: translateY(6px) translateX(1px) rotate(45deg);
  -ms-transform: translateY(6px) translateX(1px) rotate(45deg);
  -webkit-transform: translateY(6px) translateX(1px) rotate(45deg);
  transform: translateY(6px) translateX(1px) rotate(45deg);
  background-color: #1e1e1e;
}

.background-header .main-nav .menu-trigger.active span:before {
  background-color: #1e1e1e;
}

.header-area .main-nav .menu-trigger.active span:after {
  -moz-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -ms-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -webkit-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  transform: translateY(-6px) translateX(1px) rotate(-45deg);
  background-color: #1e1e1e;
}

.background-header .main-nav .menu-trigger.active span:after {
  background-color: #1e1e1e;
}

.header-area.header-sticky {
  min-height: 80px;
}

.header-area .nav {
  margin-top: 30px;
}

.header-area.header-sticky .nav li a.active {
  color: #f5a425;
}

@media (max-width: 1200px) {
  .header-area .main-nav .nav li {
    padding-left: 7px;
    padding-right: 7px;
  }
  .header-area .main-nav:before {
    display: none;
  }
}

@media (max-width: 767px) {
  .header-area .main-nav .logo {
    color: #1e1e1e;
  }
  .header-area.header-sticky .nav li a:hover,
  .header-area.header-sticky .nav li a.active {
    color: #f5a425!important;
    opacity: 1;
  }
  .header-area.header-sticky .nav li.search-icon a {
    width: 100%;
  }
  .header-area {
    background-color: #C0C0C0;
    padding: 0px 15px;
    height: 100px;
    box-shadow: none;
    text-align: center;
  }
  .header-area .container {
    padding: 0px;
  }
  .header-area .logo {
    margin-left: 30px;
  }
  .header-area .menu-trigger {
    display: block !important;
  }
  .header-area .main-nav {
    overflow: hidden;
  }
  .header-area .main-nav .nav {
    float: none;
    width: 100%;
    display: none;
    -webkit-transition: all 0s ease 0s;
    -moz-transition: all 0s ease 0s;
    -o-transition: all 0s ease 0s;
    transition: all 0s ease 0s;
    margin-left: 0px;
  }
  .header-area .main-nav .nav li:first-child {
    border-top: 1px solid #eee;
  }
  .header-area.header-sticky .nav {
    margin-top: 100px !important;
  }
  .header-area .main-nav .nav li {
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #eee;
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .header-area .main-nav .nav li a {
    height: 50px !important;
    line-height: 50px !important;
    padding: 0px !important;
    border: none !important;
    background: #f7f7f7 !important;
    color: #191a20 !important;
  }
  .header-area .main-nav .nav li a:hover {
    background: #eee !important;
    color: #f5a425!important;
  }
  .header-area .main-nav .nav li.has-sub ul.sub-menu {
    position: relative;
    visibility: inherit;
    opacity: 1;
    z-index: 1;
    transform: translateY(0%);
    top: 0px;
    width: 100%;
    box-shadow: none;
    height: 0px;
    transition: all 0s;
  }
  .header-area .main-nav .nav li.submenu ul li a {
    font-size: 12px;
    font-weight: 400;
  }
  .header-area .main-nav .nav li.submenu ul li a:hover:before {
    width: 0px;
  }
  .header-area .main-nav .nav li.has-sub ul.sub-menu {
    height: auto;
  }
  .header-area .main-nav .nav li.has-sub:after {
    color: #3B566E;
    right: 30px;
    font-size: 14px;
    top: 15px;
  }
  .header-area .main-nav .nav li.submenu:hover ul, .header-area .main-nav .nav li.submenu:focus ul {
    height: 0px;
  }
}

@media (min-width: 767px) {
  .header-area .main-nav .nav {
    display: flex !important;
  }
}


/* 
---------------------------------------------
banner
--------------------------------------------- 
*/

.main-banner {
  position: relative;
  max-height: 100%;
  overflow: hidden;
  margin-bottom: -7px;
}

#bg-video {
    min-width: 100%;
    min-height: 100vh;
    max-width: 100%;
    max-height: 100vh;
    object-fit: cover;
    z-index: -1;
}

#bg-video::-webkit-media-controls {
    display: none !important;
}

.video-overlay {
    position: absolute;
    background-color: rgba(31,39,43,0.75);
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
}

.main-banner .caption {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.main-banner .caption h5 {
  margin-top: 0px;
  font-size: 20px;
  text-transform: uppercase;
  font-weight: 600;
  color: #fff;
  letter-spacing: 1px;
}

.main-banner .caption h2 {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 40px;
  text-transform: uppercase;
  font-weight: 800;
  color: #fff;
  letter-spacing: 1px;
}

.main-banner .caption h2 em {
  font-style: normal;
  color: #f5a425;
  font-weight: 900;
}

.main-banner .caption p {
  color: #fff;
  font-size: 18px;
  max-width: 570px;
}

.main-banner .caption .main-button-red {
  margin-top: 30px;
}

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

  .main-banner .caption h5 {
    font-weight: 500;
    font-size: 22px;
  }

  .main-banner .caption h2 {
    font-size: 52px;
  }

  .main-banner .caption p {
    font-size: 18px;
  }

}

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

  .main-banner .caption h5 {
    font-weight: 500;
    font-size: 17px;
  }

  .main-banner .caption h2 {
    font-size: 36px;
  }

  .main-banner .caption p {
    font-size: 15px;
  }

}

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

  .main-banner .caption h5 {
    font-weight: 500;
    font-size: 16px;
  }

  .main-banner .caption h2 {
    font-size: 34px;
  }

  .main-banner .caption p {
    font-size: 14px;
    margin-right: 5px;
  }

}


/*
---------------------------------------------
services
---------------------------------------------
*/
.services {
    position: relative;
    width: 100%;
    background-image: url(../images/meetings-bg.jpg);
    background-size: cover;
    background-position: center;
  }
  
  .services h1 {
    font-size: 56px;
    font-weight: 800;
    text-align: center;
    color: #fff;
    padding: 60px 0;
  }
  
  .services .container {
    position: relative; 
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 100px 50px;
    padding: 50px 50px;
    background: overlay;
  }
  
  .services .container .card {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 350px;
    height: 300px;
    background: #fff;
    border-radius: 20px; 
    transition: 0.5s ease-in-out;
  }
  
  .services .container .card:hover {
    height: 510px;
  }
  
  .services .container .card .imgBx {
    position: absolute;
    top: 20px;
    left: 25px;
    width: 300px;
    height: 220px;
    border-radius: 12px;
    overflow: hidden;
    transition: 0.5s;
  }
  
  .services .container .card:hover .imgBx {
    margin-top: 20px;
    top: -30px;
    scale: 0.75;
    box-shadow: 0 15px 45px rgba(0,0,0,0.2);
  } 
  
  .services .container .card .imgBx img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .services .container .card .content {
    position: absolute;
    top: 250px;
    width: 100%;
    padding: 0 30px;
    height: 35px;
    overflow: hidden;
    text-align: center;
    transition: 0.5s;
  }
  
  .services .container .card:hover .content {
    margin-top: 60px;
    position: absolute;
    top: 130px;
    width: 100%;
    padding: 0 30px;
    height: 350px;
    overflow: hidden;
    text-align: center;
    transition: 0.5s;
  }
  
  .services .container .card .content h6 {
    font-size: 1.5em;
    font-weight: 700;
    color: #000;
  }
  
  .services .container .card .content p {
    font-size: 0.9em;
    color: #000;
  }
  
  /* Tablets and iPads */
  @media (max-width: 992px) {
    .services .container {
      gap: 50px 30px; /* Adjust gap for tablets */
      padding: 40px 40px; /* Adjust padding for tablets */
    }
    .services .container .card {
      width: 55%;
      margin-bottom: 30px;
    }
    .services .container .card:nth-child(2n) {
      margin-right: 0;
    }
    .services h1 {
      font-size: 50px; /* Adjust font size for tablets */
      padding: 40px 20px; /* Adjust padding for tablets */
    }
  }
  
  /* Small devices (phones) */
  @media (max-width: 767px) {
    .services .container {
      gap: 30px 20px; /* Adjust gap for mobile screens */
      padding: 20px 20px; /* Adjust padding for mobile screens */
    }
    .services .container .card {
      width: 100%;
    }
    .services h1 {
      font-size: 40px; /* Adjust font size for smaller screens */
      padding: 30px 20px; /* Adjust padding for smaller screens */
    }
  }
  
  /* Extra small devices (phones with very small screens) */
  @media (max-width: 480px) {
    .services h1 {
      font-size: 36px; /* Further reduce font size */
      padding: 20px 10px; /* Adjust padding for very small screens */
    }
    .services .container {
      padding: 10px 10px; /* Adjust padding for very small screens */
    }
    .services .container .card {
      width: 100%;
    }
  }
  
/*
---------------------------------------------
TEACHES
---------------------------------------------
*/
.teaches {
    background-image: url(../images/apply-bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
    padding: 50px 0;
}
  
.teaches .container {
    max-width: 90%;
    margin: 0 auto;
    text-align: center;
}
  
.teaches .container h1 {
    font-size: 60px;
    font-weight: 800;
    color: #fff;
    padding: 60px 0;
}
  
.teaches .container .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 2em;
  justify-content: center;
}

.teaches .container .cards .card {
  position: relative;
  width: 200px; /* Increased width */
  height: 340px; /* Adjust height to match video aspect ratio */
  overflow: hidden;
  border-radius: 15px;
  transition: transform 0.5s ease-in-out, z-index 0s 0.5s; /* Adjust z-index after transform */
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  z-index: 1; /* Default z-index */
}

.teaches .container .cards .card:hover {
  transform: scale(1.1); /* Scale down to avoid overlapping */
  z-index: 10; /* Bring the hovered card to the front */
}

.teaches .container .cards .card video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.teaches .container .cards .card-body {
  position: absolute;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  padding: 1em;
  color: #fff;
  text-align: center;
  transition: opacity 0.3s ease;
  opacity: 1; /* Always visible */
}

.teaches .container .cards .card:hover .card-body {
  opacity: 1; /* Ensure the card body remains visible on hover */
}

.teaches .container .cards .card-body h2 {
  font-size: clamp(20px, 4vw, 24px);
  margin: 0;
}




/* Small devices (phones) */
@media (max-width: 767px) {
  .teaches .container h1 {
    font-size: 50px; /* Adjust font size for phones */
    padding: 25px 10px; /* Adjust padding for phones */
  }
  .teaches .container .cards {
    flex-direction: column; /* Stack cards vertically */
    gap: 2em; /* Adjust gap for vertical layout */
    padding: 20px 10px;
  }
  .teaches .container .cards .card {
    width: 100%; /* Full width of the container */
    height: 460px; /* Adjust height automatically */
    max-width: 500px; /* Optional: Set a max-width for large cards */
  }
}

/* Extra small devices (phones with very small screens) */
@media (max-width: 480px) {
  .teaches .container h1 {
    font-size: 40px; /* Further reduce font size */
    padding: 15px 5px; /* Further adjust padding */
  }
  .teaches .container .cards {
    gap: 2em; /* Further reduce gap for very small screens */
  }
  .teaches .container .cards .card {
    width: 100%; /* Further adjust card width */
    height: 460px; /* Further adjust card height */
  }
}

  
/*
---------------------------------------------
SESSION
---------------------------------------------
*/

.wrapper {
    background-color: #2e3141;
    position: relative;
  }
  
  .wrapper:before, .wrapper:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%232e3141%3B' /%3E%3C/svg%3E");
  }
  
  .wrapper:before {
    box-shadow: inset 0 -1px 0 0 #2e3141, 0 1px 0 0 #2e3141;
  }
  
  .wrapper:after {
    box-shadow: inset 0 -1px 0 0 #2e3141, 0 1px 0 0 #2e3141;
  }
  
  .wrapper:before, .wrapper:after {
    background-repeat: no-repeat;
    background-size: 100% 100%;
    content: '';
    display: block;
    height: 6.5em;
    position: absolute;
    width: 100%;
  }
  
  .wrapper:before {
    left: 0;
    top: -6.5em;
  }
  
  .wrapper:after {
    -moz-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
    bottom: -6.5em;
    left: 0;
  }
  
  .wrapper.alt:before {
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
  }
  
  .wrapper.alt:after {
    -moz-transform: scaleY(-1) scaleX(-1);
    -webkit-transform: scaleY(-1) scaleX(-1);
    -ms-transform: scaleY(-1) scaleX(-1);
    transform: scaleY(-1) scaleX(-1);
  }
  
  .wrapper .inner {
    padding: 3em 0 1em 0;
    margin: 0 auto;
    width: 55em;
  }
  
  @media screen and (max-width: 980px) {
    .wrapper {
      margin: 4.75em 0;
    }
    .wrapper:before, .wrapper:after {
      height: 4.75em;
    }
    .wrapper:before {
      top: -4.75em;
    }
    .wrapper:after {
      bottom: -4.75em;
      left: 0;
    }
    .wrapper .inner {
      padding: 3em;
      width: 100%;
    }
  }
  
  @media screen and (max-width: 736px) {
    .wrapper {
      margin: 2.5em 0;
    }
    .wrapper:before, .wrapper:after {
      height: 2.5em;
    }
    .wrapper:before {
      top: -2.5em;
    }
    .wrapper:after {
      bottom: -2.5em;
      left: 0;
    }
    .wrapper .inner {
      padding: 2em;
    }
  }
  
  @media screen and (max-width: 360px) {
    .wrapper .inner {
      padding: 1.5em;
    }
  }
  
  @media screen and (max-width: 767px) {
    .wrapper .inner {
      padding-bottom: 1.5em;
    }
  }
  
  section.session {
    background-image: url(../images/meetings-bg.jpg);
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 90px;
    padding-bottom: 110px;
  }
  
  section.special,
  article.special {
    text-align: center;
  }
  
  .session .major h2,
  .session .major p {
    text-align: center;
  }
  
  .session .major h2 {
    font-size: 60px;
    color: #fff;
    text-align: center;
  }
  
  .session .major p {
    font-size: 26px;
    color: #f5a425;
  }
  
  .session .major hr {
    color: #c9c9c9;
  }
  
  .session .main-button-yellow {
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: fit-content;
  }
  .session .main-button-red {
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: fit-content;
    padding-top: 20px;
  }
  
  .image {
    border-radius: 5px;
    border: 0;
    display: inline-block;
    position: relative;
  }
  
  .image img {
    border-radius: 5px;
    display: block;
  }
  
  .image.left,
  .image.right {
    max-width: 40%;
  }
  
  .image.left img,
  .image.right img {
    width: 100%;
  }
  
  .image.left {
    float: left;
    padding: 0 1.5em 1em 0;
    top: 0.25em;
  }
  
  .image.right {
    float: right;
    padding: 0 0 1em 1.5em;
    top: 0.25em;
  }
  
  .image.fit {
    display: block;
    margin: 0 0 2em 0;
    width: 100%;
  }
  
  .image.fit img {
    width: 100%;
  }
  
  .image.main {
    display: block;
    margin: 0 0 3em 0;
    width: 100%;
  }
  
  .image.main img {
    width: 100%;
  }
  
  .features {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
  }
  
  .features article {
    padding: 1.75em;
    background-color: #353849;
    border-radius: 5px;
    margin: 1.5em;
    width: calc(33.33% - 3em);
  }
  
  .features article:nth-child(3n) {
    margin-right: 0;
  }
  
  .features article h3 {
    color: #f5a425;
    font-size: 24px;
  }
  
  .features article p {
    color: #fff;
    font-size: 14px;
  }
  
  .features article .image {
    border-radius: 5px 5px 0 0;
    display: block;
    margin-bottom: 1.75em;
    position: relative;
    width: 100%;
  }
  
  .features article .image img {
    border-radius: 5px 5px 0 0;
    width: 100%;
  }
  
  @media screen and (max-width: 980px) {
    .features article {
      width: calc(50% - 3em);
    }
  }
  
  @media screen and (max-width: 736px) {
    .features article {
      width: calc(50% - 2em);
    }
  }
  
  @media screen and (max-width: 480px) {
    .features {
      flex-direction: column;
    }
    .features article {
      width: calc(100% - 3em);
    }
    .session .main-button-yellow {
      margin-top: 20px;
    }
  }
 
/*
---------------------------------------------
Admission
---------------------------------------------
*/
.timeline-section {
  background-image: url(../images/apply-bg.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
  background-size: cover;
  padding: 140px 20px;
}

.timeline-section .container .row h1{
  color: #fff;
  font-weight: 700;
  font-size: 50px;
  margin: 0; /* Added to ensure consistent spacing */
}

.timeline-section .container .row p{
  color: #fff;
  font-size: 16px;
}

.timeline-section .container .row h5{
  color: #fff;
  font-size: 20px;
} 

.timeline-container .vertical-scrollable-timeline {
  list-style-type: none;
  position: relative;
  padding-left: 0;
  margin-top: 40px;
}

.timeline-container .vertical-scrollable-timeline .list-progress {
  width: 8px;
  height: 87%;
  background-color: #333;
  position: absolute;
  left: 52px;
  top: 0;
  overflow: hidden;
}

.timeline-container .vertical-scrollable-timeline .list-progress .inner {
  position: absolute;
  right: 0;
  bottom: 0;
  height: 100%;
  background-color: #fb5849;
  width: 100%;
}

.timeline-container .vertical-scrollable-timeline li {
  position: relative;
  padding: 20px 0px 65px 145px;
  margin-bottom: 40px;
}

.timeline-container .vertical-scrollable-timeline li:last-child {
  padding-bottom: 0;
}

.timeline-container .vertical-scrollable-timeline li h4 {
  line-height: 40px;
  color: #fff;
  font-size: 30px;
}
.timeline-container .vertical-scrollable-timeline li p {
  line-height: 40px;
  color: #fff;
  font-size: 16px;
}

.timeline-container .vertical-scrollable-timeline li p:last-child {
  margin-bottom: 0;
}

.timeline-container .vertical-scrollable-timeline li .icon-holder {
  position: absolute;
  left: 0;
  top: 0;
  width: 104px;
  height: 104px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fb5849;
  border-radius: 50%;
  z-index: 1;
  transition: 0.4s all;
}

.timeline-container .vertical-scrollable-timeline li .icon-holder::before {
  content: "";
  width: 80px;
  height: 80px;
  border: 4px solid #fff;
  position: absolute;
  background-color: #fb5849;
  border-radius: 50%;
  z-index: -1;
  transition: 0.4s all;
}

.timeline-container .vertical-scrollable-timeline li .icon-holder i {
  font-size: 25px;
  color: #fff;
}

.timeline-container .vertical-scrollable-timeline li::before {
  content: "";
  position: absolute;
  height: 100%;
  width: 8px;
  background-color: transparent;
  left: 52px;
  z-index: 0;
}

.timeline-container .vertical-scrollable-timeline li.active .icon-holder {
  background-color: #333;
}

.timeline-container .vertical-scrollable-timeline li.active .icon-holder::before {
  background-color: #333;
}

.timeline-section .btn.custom-btn {
  background-color: #fb5849;
  color: #333;
  padding: 10px 20px;
  border-radius: 30px;
  text-decoration: none;
}

.timeline-section .btn.custom-btn:hover {
  background-color: #555;
  color: #fb5849;
}

  /* Responsive adjustments */
  @media (max-width: 992px) {
    .timeline-section .container .row h1 {
      font-size: 54px;
      padding: 40px 20px;
    }
  
    .timeline-container .vertical-scrollable-timeline {
      margin-top: 30px;
    }
  
    .timeline-container .vertical-scrollable-timeline li {
      padding: 20px 0px 50px 100px;
    }
  
    .timeline-container .vertical-scrollable-timeline li h4 {
      font-size: 24px;
    }
  
    .timeline-container .vertical-scrollable-timeline li p {
      font-size: 14px;
    }
  }
  
  @media (max-width: 767px) {
    .timeline-section {
      padding: 100px 10px;
    }
  
    .timeline-section .container .row h1 {
      font-size: 54px;
    }
  
    .timeline-container .vertical-scrollable-timeline li {
      padding: 20px 0px 40px 60px;
    }
  
    .timeline-container .vertical-scrollable-timeline li h4 {
      font-size: 20px;
    }
  
    .timeline-container .vertical-scrollable-timeline li p {
      font-size: 12px;
    }
  
    .timeline-container .vertical-scrollable-timeline .list-progress {
      left: 20px; /* Further adjusted for very small screens */
    }
  
    .timeline-container .vertical-scrollable-timeline li .icon-holder {
      width: 80px; /* Reduced size */
      height: 80px; /* Reduced size */
    }
  
    .timeline-container .vertical-scrollable-timeline li .icon-holder::before {
      width: 60px; /* Reduced size */
      height: 60px; /* Reduced size */
    }
  
    .timeline-container .vertical-scrollable-timeline li .icon-holder i {
      font-size: 20px; /* Reduced icon size */
    }
  
    .timeline-container .vertical-scrollable-timeline li h4,
    .timeline-container .vertical-scrollable-timeline li p {
      margin-left: 80px; /* Added margin to ensure space between icon and text */
    }
  }
  
  @media (max-width: 480px) {
    .timeline-section {
      padding: 80px 5px;
    }
  
    .timeline-section .container .row h1 {
      font-size: 50px;
    }
  
    .timeline-container .vertical-scrollable-timeline li {
      padding: 20px 0px 30px 40px;
    }
  
    .timeline-container .vertical-scrollable-timeline li h4 {
      font-size: 30px;
    }
  
    .timeline-container .vertical-scrollable-timeline li p {
      font-size: 10px;
    }
  
    .timeline-container .vertical-scrollable-timeline .list-progress {
      left: 20px; /* Adjusted for very small screens */
    }
  
    .timeline-container .vertical-scrollable-timeline li .icon-holder {
      width: 60px; /* Further reduced size */
      height: 60px; /* Further reduced size */
    }
  
    .timeline-container .vertical-scrollable-timeline li .icon-holder::before {
      width: 50px; /* Further reduced size */
      height: 50px; /* Further reduced size */
    }
  
    .timeline-container .vertical-scrollable-timeline li .icon-holder i {
      font-size: 16px; /* Further reduced icon size */
    }
  
    .timeline-container .vertical-scrollable-timeline li h4,
    .timeline-container .vertical-scrollable-timeline li p {
      margin-left: 50px; /* Increased margin to ensure adequate space between icon and text */
    }
  }

/* 
---------------------------------------------
Highlights
--------------------------------------------- 
*/
section.our-courses {
  background-image: url(../images/meetings-bg.jpg);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 140px;
  padding-bottom: 130px;
}

.section-heading h2 {
  text-align: center;
  font-size: 56px;
  margin: 5px 0;
}

.video-slider-container {
  overflow: hidden;
}

.video-slider {
  display: flex;
  transition: transform 0.9s ease;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  margin-bottom: 20px;
  scrollbar-width: none; /* Hide scrollbar for Firefox */
  -ms-overflow-style: none; /* Hide scrollbar for IE/Edge */
}

.video-slider::-webkit-scrollbar {
  display: none; /* Hide scrollbar for Chrome/Safari/Opera */
}

.video-container {
  flex: 0 0 auto;
  scroll-snap-align: start;
  margin: 0 2px; /* Adjust margin for better spacing */
}

video {
  width: 100%; /* Adjusted for responsiveness */
  height: auto;
}

h3 {
  margin: 5px 0;
  font-size: 18px;
  text-align: center;
  color: #fff;
}

.slider-dots {
  text-align: center;
  margin-bottom: 10px;
}

.dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  background-color: #a12c2f;
  border-radius: 50%;
  margin: 0 5px;
  cursor: pointer;
}

.dot.active {
  background-color: #fc9927;
}

 
  /* Responsive styles */
  @media (max-width: 768px) {
    .section.our-courses {
      padding-top: 100px;
      padding-bottom: 90px;
    }
  
    .section-heading h2 {
      font-size: 54px;
    }
  
    .video-slider {
      align-items: center;
    }
  
    .video-container {
      margin-right: 0;
      margin-bottom: 20px;
    }
  
    h3 {
      font-size: 18px;
    }
  }
  
  @media (max-width: 480px) {
    .section.our-courses {
      padding-top: 80px;
      padding-bottom: 70px;
    }
  
    .section-heading h2 {
      font-size: 50px;
    }
  
    .video-container {
      width: 100%;
      height: auto;
      margin-bottom: 10px;
    }
  
    .slider-dots {
      margin-bottom: 5px;
    }
  
    .dot {
      width: 8px;
      height: 8px;
      margin: 0 3px;
    }
    h3 {
        font-size: 16px;
      }
  }
  /* Additional styles for larger screens */
  @media (min-width: 769px) {
    .video-slider {
      justify-content: space-between; /* Distribute space evenly */
    }
  
    .video-container {
      margin-right: 20px; /* Adjust margin for larger screens */
      max-width: 300px; /* Set a max width for each video container */
    }
  
    video {
      width: 100%;
      height: auto;
    }
  
    h3 {
      font-size: 20px;
    }
  }
  
  @media (min-width: 1024px) {
    section.our-courses {
      padding-top: 160px;
      padding-bottom: 150px;
    }
  
    .section-heading h2 {
      font-size: 60px;
    }
  
    .video-container {
      margin-right: 0px; /* Adjust margin for even larger screens */
      max-width: 400px; /* Set a max width for each video container */
    }
  
    h3 {
      font-size: 20px;
      padding-right: 70px;
    }
  }
  
  


/*
---------------------------------------------
about-us
---------------------------------------------
*/

section.apply-now {
  background-image: url(../images/apply-bg.jpg);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 140px 0px;
}

section.apply-now .item {
  background-color: rgba(250,250,250,0.15);
  padding: 40px;
  margin-bottom: 30px;
}

section.apply-now .item h3 {
  color: #fff;
  text-transform: uppercase;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
}

section.apply-now .item p {
  color: #fff;
  margin-bottom: 20px;
}

.accordions {
  border-radius: 20px;
  padding: 40px;
  background-color: #fff;
  margin-left: 45px;
}
.accordions .accordion {
  border-bottom: 1px solid #eee;
}
.accordions .last-accordion {
  border-bottom: none;
}
.accordion-head {
  padding: 20px;  
  font-size: 18px;
  font-weight: 700;
  color: #1f272b;
  cursor: pointer;
  transition: color 200ms ease-in-out;
  border-bottom: 1px solid #fff;
}
@media screen and (min-width: 768px) {
  .accordion-head {
    padding: 1rem;
    font-size: 1.2rem;
  }
}
.accordion-head .icon {
  float: right;
  transition: transform 200ms ease-in-out;
}
.accordion-head.is-open {
  color: #f5a425;
  border-bottom: none;
}
.accordion-head.is-open .icon {
  transform: rotate(45deg);
}
.accordion-body {
  overflow: hidden;
  height: 0;
  transition: height 300ms ease-in-out;
  border-bottom: 1px solid #fff;
}
.accordion-body > .content {
  padding: 20px;
  padding-top: 0;
}


/*
-------------------------------
TESTIMONIAL
-------------------------------
*/
section.testimonial {
    background-image: url(../images/tes.jpg);
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 140px 0;
    flex: 2;
  }
  
  #testo .section-heading h2 {
    color: #fff;
    text-transform: uppercase;
    font-size: 55px;
    font-weight: 700;
    padding-bottom: 35px;
  }
  
  #testo .section-heading h4 {
    color: #f5a425;
    margin-bottom: 17px;
    text-align: center;
    margin-top: -40px;
  }
  
  section.testimonial .left {
    margin-top: 80px;
  }
  
  section.testimonial .left .item {
    background-color: #a12c2f;
    margin-top: 0;
    padding: 25px 30px 20px 30px;
  }
  
  .video-container {
    width: 100%;
    height: auto;
  }
  
  video {
    width: 100%;
    height: auto;
  }
  
  #testo .gallery {
    width: 100%;
    margin-top: 150px;
  }
  
  #testo .gallery-container {
    display: flex;
    height: 400px;
    margin: 0 auto;
    max-width: 1000px;
    position: relative;
  }
  
  #testo .gallery-item {
    height: 200px;
    opacity: 0;
    width: 330px;
    z-index: 0;
    position: absolute;
    transition: all 0.3s ease-in-out;
    border-radius: 15px;
    background-size: contain;
  }
  
  #testo .gallery-item-1 {
    left: 15%;
    opacity: .4;
    transform: translateX(-50%);
  }
  
  #testo .gallery-item-2, .gallery-item-4 {
    height: 250px;
    opacity: 0.8;
    width: 380px;
    z-index: 1;
  }
  
  #testo .gallery-item-2 {
    left: 30%;
    transform: translateX(-50%);
  }
  
  #testo .gallery-item-3 {
    box-shadow: -2px 5px 33px 6px rgba(0,0,0,0.35);
    height: 300px;
    opacity: 1;
    left: 50%;
    transform: translateX(-50%);
    width: 430px;
    z-index: 2;
  }
  
  #testo .gallery-item-4 {
    left: 70%;
    transform: translateX(-50%);
  }
  
  #testo .gallery-item-5 {
    left: 85%;
    opacity: .4;
    transform: translateX(-50%);
  }
  #testo .gallery-controls{
    display: flex;
    justify-content: center;
    margin: 25px 0;
    height: 100px;
  }
   
  #testo .gallery-controls button{
    background-color: transparent;
    border: 0;
    cursor: pointer;
    font-size: 30px;
    margin: 0 50px;
    padding: 0 12px;
    text-transform: capitalize;
  }
  
  #testo .gallery-controls-button:focus{
    outline: none;
  }
  
  
  /* Add the following arrow styles */
  
  #testo .gallery-controls .arrow {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  
  #testo .gallery-controls .arrow--left {
    background-image:url(../images/next.png);
  }
  
  #testo .gallery-controls .arrow--right {
    background-image: url(../images/prev.png)
  }  
  #testo .gallery-controls .arrow--left {
    margin-right: 5px;
  }
  
  #testo .gallery-controls .arrow--right {
    margin-left: 5px;
  }
  
  #testo .gallery-nav{
    bottom: -15px;
    display:flex;
    justify-content: center;
    list-style: none;
    padding: 0;
    position: absolute;
    width: 100%;
  }
  
  #testo .gallery-nav li{
    background: #ccc;
    border-radius: 50%;
    height: 10px;
    margin: 0 16px;
    width: 10px;
  }
  
  #gallery-nav li.gallery-item-selected{
    background: #555;
  }
  
  /* Media Queries */
  
/* Small screens (phones) */
@media only screen and (max-width: 600px) {
  section.testimonial {
      padding: 50px 0;
  }
  #testo .section-heading h2 {
      font-size: 25px;
  }
  #testo .section-heading h4 {
      font-size: 18px;
  }
  section.testimonial .left {
      margin-top: 40px;
  }
  section.testimonial .left .item {
      padding: 20px;
  }
  .video-container {
      width: 100%;
      height: auto;
  }
  video {
      width: 100%;
      height: auto;
  }
  #testo .gallery {
      margin-top: 100px;
  }
  #testo .gallery-container {
      height: 360px;
      margin-left: 20px;
      margin-right: 20px;
  }
  #testo .gallery-item {
      width: 110%;
      height: 260px;
  }
  #testo .gallery-item-1, .gallery-item-2, .gallery-item-3, .gallery-item-4, .gallery-item-5 {
      left: 0;
      transform: translateX(0);
  }
  #testo .gallery-controls {
      margin: 20px 0;
  }
  #testo .gallery-controls button {
      font-size: 20px;
  }
}

/* Medium screens (tablets) */
@media only screen and (min-width: 601px) and (max-width: 1024px) {
  section.testimonial {
      padding: 80px 0;
      display: flex;
      flex-direction: column;
      align-items: center; /* Center the content horizontally */
  }
  #testo .section-heading h2 {
      font-size: 30px;
  }
  #testo .section-heading h4 {
      font-size: 22px;
  }
  section.testimonial .left {
      margin-top: 60px;
      display: flex;
      flex-direction: column;
      align-items: center; /* Center the content horizontally */
  }
  section.testimonial .left .item {
      padding: 30px;
      background-color: rgba(161, 44, 47, 0.9); /* Adjust background color for better visibility */
      max-width: 80%; /* Adjust width to ensure it fits within the screen */
      text-align: center; /* Center the text content */
  }
  .video-container {
      width: 100%;
  }
  video {
      width: 100%;
      height: auto;
  }
  #testo .gallery {
      margin-top: 120px;
  }
  #testo .gallery-container {
      height: 500px;
  }
  #testo .gallery-item {
      width: 100%;
      height: 450px;
  }
  #testo .gallery-item-1, .gallery-item-2, .gallery-item-3, .gallery-item-4, .gallery-item-5 {
      left: 0;
      transform: translateX(0);
  }
  #testo .gallery-controls {
      margin: 30px 0;
  }
  #testo .gallery-controls button {
      font-size: 25px;
  }
}



/* Large screens (desktops) */
@media (min-width: 1024px) {
  section.testimonial .left .item {
      padding-right: 325px;
      margin-right: 275px;
  }
}

/*
---------------------------------------------
our facts
---------------------------------------------
*/

section.our-facts {
  background-image: url(../images/facts-bg.jpg);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 140px 0px 125px 0px;
}

section.our-facts h2 {
  font-size: 38px;
  color: #fff;
  line-height: 50px;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-bottom: 50px;
}

.count-area-content {
  text-align: center;
  background-color: rgba(250,250,250,0.15);
  border-radius: 20px;
  padding: 25px 30px 35px 30px;
  margin: 15px 0px;
}

.count-area-content h3{
  color: #f5a425;
  font-size: 36px;
}

.percentage .count-digit:after {
  content: '%';
  margin-left: 3px;
}

.count-digit {
    margin: 5px 0px;
    color: #f5a425;
    font-weight: 700;
    font-size: 36px;
}
.count-title {
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 0.5px;
}

.review-icons {
  color: #FFD700; /* Gold color for stars */
  font-size: 24px;
  vertical-align: middle;
}
.new-students {
  margin-top: 45px;
}



section.our-facts .video {
  text-align: center;
  margin-left: 70px;
  background-image: url(../images/video-item-bg.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-radius: 20px;
}

section.our-facts .video img {
  padding: 170px 0px;
  max-width: 56px;
}



/* 
---------------------------------------------
FAQs
--------------------------------------------- 
*/

.faq-heading {
  text-align: center;
  font-size: 40px;
  font-weight: 500;
  margin-top: 30px;
}

.faq-content {
  display: flex;
  flex-wrap: wrap; /* Added to handle smaller screens */
  justify-content: space-between;
  align-items: center;
}

.faq-column {
  flex: 1; /* Adjusted for responsiveness */
  margin-right: 10px; /* Added spacing between columns */
}

.accordion-item {
  margin-bottom: 10px;
}

.accordion-header {
  background-color: #333;
  color: #fff;
  padding: 10px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  cursor: pointer;
  font-size: 18px;
}

.accordion-header.active {
  background-color: #fb5849;
}

.accordion-content {
  padding: 10px;
  display: none;
  background-color: #fff;
  border-left: 2px solid #333;
}

.accordion-content p {
  margin: 0;
}

/* Media Queries */

@media screen and (max-width: 768px) {
  .faq-heading {
    font-size: 30px;
  }

  .faq-column {
    flex: 100%; /* Full width for smaller screens */
    margin-right: 9px; /* Remove right margin for smaller screens */
    margin-right: 9px;
  }
}

@media screen and (max-width: 576px) {
  .faq-heading {
    font-size: 24px;
  }
}


/* 
---------------------------------------------
contact us
--------------------------------------------- 
*/

section.contact-us {
  background-image: url(../images/meetings-bg.jpg);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 140px 0px 0px 0px;
}

section.contact-us #contact {
  background-color: #fff;
  border-radius: 20px;
  padding: 40px;
}

section.contact-us #contact h2 {
  text-transform: uppercase;
  color: #1f272b;
  border-bottom: 1px solid #eee;
  margin-bottom: 40px;
  padding-bottom: 20px;
  font-size: 22px;
  font-weight: 700;
}

section.contact-us #contact input {
  width: 100%;
  height: 40px;
  border-radius: 20px;
  background-color: #f7f7f7;
  outline: none;
  border: none;
  box-shadow: none;
  font-size: 13px;
  font-weight: 500;
  color: #7a7a7a;
  padding: 0px 15px;
  margin-bottom: 30px;
}

section.contact-us #contact textarea {
  width: 100%;
  min-height: 140px;
  max-height: 180px;
  border-radius: 20px;
  background-color: #f7f7f7;
  outline: none;
  border: none;
  box-shadow: none;
  font-size: 13px;
  font-weight: 500;
  color: #7a7a7a;
  padding: 15px;
  margin-bottom: 30px;
}

section.contact-us #contact button {
  font-size: 13px;
  color: #fff;
  background-color: #a12c2f;
  padding: 12px 30px;
  display: inline-block;
  border-radius: 22px;
  font-weight: 500;
  text-transform: uppercase;
  transition: all .3s;
  border: none;
  outline: none;
}

section.contact-us #contact button:hover {
  opacity: 0.9;
}

section.contact-us .right-info {
  background-color: #a12c2f;
  border-radius: 20px;
  padding: 40px;
}

section.contact-us .right-info ul li {
  display: inline-block;
  border-bottom: 1px solid rgba(250,250,250,0.15);
  margin-bottom: 30px;
  padding-bottom: 30px;
}

section.contact-us .right-info ul li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

section.contact-us .right-info ul li h6 {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 10px;
}

section.contact-us .right-info ul li span {
  display: block;
  font-size: 18px;
  color: #fff;
  font-weight: 700;
}

.footer {
  text-align: center;
  margin-top: 140px;
  border-top: 1px solid rgba(250,250,250,0.15);
  padding: 50px 0px;
}
.footer p {
  text-transform: uppercase;
  font-size: 14px;
  color: #fff;
}

.footer p a {
  color: #f5a425;
}


/* Session Page */

section.spotlights {
  background-image: url(../meetings-bg.jpg);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 140px 0px 0px 0px;
}

section.spotlights .left {
  margin-left: 150px;
}

section.spotlights .left .item {
  background-color: #a12c2f;
  margin-top: 0;
  padding: 25px 15px 20px 30px;
  margin-right: 275px;
}

section.spotlights .right {
  margin-right: 150px;
}

section.spotlights .right .item {
  background-color: #a12c2f;
  margin-top: 0px;
  padding: 25px 12px 20px 30px;
  margin-left: 275px;
}

.video-container {
  flex: 0 0 auto;
  scroll-snap-align: start;
}

video {
  width: 300px;
  height: auto;
}

#session .inner p {
  color: #fff;
  font-size: 16px;
}

#session .inner h3 {
  color: #f5a425;
  font-size: 32px;
  text-transform: uppercase;
}

#session .inner hr {
  color: #f5a425;
  line-height: 6em;
  margin: 0 90px;
}

.spotlights {
  border-top: 0 !important;
}

.spotlights + * {
  border-top: 0 !important;
}

.spotlights > section {
  display: flex;
  flex-direction: row;
}

.spotlights > section > .content-right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 2em 2em 0.1em 1em;
  width: 70%;
}

.spotlights > section > .content-right > .inner {
  margin: 0 auto;
  max-width: 100%;
  width: 100%;
}

.spotlights > section > .content-right > .inner .major {
  color: #e7b788;
}

.spotlights > section > .content-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 2em 1em 0.1em 2em;
  width: 70%;
}

.spotlights > section > .content-left > .inner {
  margin: 0 auto;
  max-width: 100%;
  width: 100%;
}

.spotlights > section > .content-left > .inner .major {
  color: #e7b788;
}

.spotlights > section:nth-child(2n) {
  flex-direction: row-reverse;
}

.spotlights > section:nth-child(2n) > .content {
  align-items: flex-end;
}

@media screen and (max-width: 1680px) {
  .spotlights > section > .image {
    width: 40%;
  }

  .spotlights > section > .content {
    width: 60%;
  }
}

@media screen and (max-width: 1280px) {
  .spotlights > section > .image {
    width: 45%;
  }

  .spotlights > section > .content {
    width: 55%;
  }
}

@media screen and (max-width: 980px) {
  .spotlights > section {
    display: block;
    margin-bottom: 50px; /* Increase space between sections */

  }

  .spotlights > section > .image {
    width: 100%;
  }

  .spotlights > section > .content {
    padding: 6em 2em 2em 2em;
    width: 100%;
  }

}

@media screen and (max-width: 736px) {
  .spotlights > section > .content {
    padding: 3em 1.5em 1em 1.5em;
  }
}

@media screen and (max-width: 480px) {
  section.spotlights {
    padding: 100px 10px;
  }

  section.spotlights .left, section.spotlights .right {
    margin-left: 0;
    margin-right: 0;
  }

  section.spotlights .left .item, section.spotlights .right .item {
    margin-right: 0;
    margin-left: 0;
    padding: 20px 15px;
  }

  .spotlights > section > .content-right, .spotlights > section > .content-left {
    padding: 2em 1em;
    width: 100%;
  }

  .spotlights > section > .content-right > .inner, .spotlights > section > .content-left > .inner {
    width: 100%;
  }

  .spotlights > section:nth-child(2n) > .content {
    align-items: center;
  }

  video {
    width: 100%; /* Make video responsive */
  }
}

/*
---------------------------------------------
footer
---------------------------------------------
*/


.footer {
    text-align: center;
    margin-top: 50px;
    padding: 20px 0px;
    position: relative;
  }
  
  .footer .social-icons {
    margin-bottom: 10px;
  }
  
  .footer .social-icons ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
  }
  
  .footer .social-icons ul li {
    margin: 0 10px;
  }
  
  .footer .social-icons ul li a {
    color: #fff; /* Icon color */
    font-size: 24px; /* Icon size */
    text-decoration: none;
  }
  
  .footer .social-icons ul li a:hover {
    color: #f5a425; /* Hover color */
  }
  
  .footer p {
    text-transform: uppercase;
    border-top: 1px solid rgba(250,250,250,0.15);
    font-size: 14px;
    color: #fff;
  }
  
  .footer p a {
    color: #f5a425;
  }
  
  
  @media (max-width: 768px) {
    .footer .social-icons ul li {
      margin: 0 5px;
    }
    .footer .social-icons ul li a {
      font-size: 20px; /* Adjust icon size for smaller screens */
    }
  }








/*
---------------------------------------------
heading page
---------------------------------------------
*/

section.heading-page {
  background-image: url(../images/heading-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 230px;
  padding-bottom: 110px;
  text-align: center;
  
}

section.heading-page h6 {
  margin-top: 0px;
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 600;
  color: #fff;
  letter-spacing: 1px;
}

section.heading-page h2 {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 40px;
  text-transform: uppercase;
  font-weight: 800;
  color: #fff;
  letter-spacing: 1px;
}


/*
---------------------------------------------
blog page
---------------------------------------------
*/

section.blog {
  background-image: url(../images/meetings-page-bg.jpg);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 140px;
  padding-bottom: 0px;
}

section.blog .main-button-red {
  text-align: center;
}

section.blog .main-button-red a {
  padding: 12px 60px;
  text-align: center;
  margin-top: 30px;
}

section.blog .pagination ul li.active a,
section.blog .pagination ul li a:hover {
  background-color: #a12c2f;
  color: #fff;
}

.blog-single-item .thumb {
  position: relative;
}

.blog-single-item .thumb img {
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
}

.blog-single-item .down-content {
  background-color: #fff;
  padding: 40px;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
}

.blog-single-item .down-content h4 {
  font-size: 22px;
  color: #1f272b;
  font-weight: 600;
  display: inline-block;
  margin-bottom: 15px;
}

.blog-single-item .down-content h5 {
  font-size: 18px;
  color: #1f272b;
  font-weight: 700;
  display: inline-block;
  margin-bottom: 15px;
}

.blog-single-item .down-content p {
  color: #1f272b;
  font-size: 14px;
}

.blog-single-item .down-content p.description {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #eee;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid #eee;
}


/* Meeting item column */
.templatemo-item-col {
	width: 31%;
}

@media (max-width: 992px) {
	.templatemo-item-col {
		width: 45%;
	}
}

@media (max-width: 767px) {
	.templatemo-item-col {
		width: 100%;
	}
}

/* 
---------------------------------------------
blog
--------------------------------------------- 
*/

/* Section/Article */

section.special, article.special {
  text-align: center;
}

header p {
  margin-top: -1em;
}

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

  header p {
    margin-top: 0;
  }

}



/* Box */

.box {
  border-radius: 4px;
  border: solid 1px #c9c9c9;
  margin-bottom: 2em;
  padding: 1.5em;
}

  .box > :last-child,
  .box > :last-child > :last-child,
  .box > :last-child > :last-child > :last-child {
    margin-bottom: 0;
  }

  .box.alt {
    border: 0;
    border-radius: 0;
    padding: 0;
  }

/* Image */

.titles article {

  .image {
    border-radius: 4px;
    border: 0;
    display: inline-block;
    position: relative;
  }

    .image img {
      border-radius: 4px;
      display: block;
    }

    .image.left, .image.right {
      max-width: 40%;
    }

      .image.left img, .image.right img {
        width: 100%;
      }

    .image.left {
      float: left;
      padding: 0 1.5em 1em 0;
      top: 0.25em;
    }

    .image.right {
      float: right;
      padding: 0 0 1em 1.5em;
      top: 0.25em;
    }

    .image.fit {
      display: block;
      margin: 0 0 2em 0;
      width: 100%;
    }

      .image.fit img {
        width: 100%;
      }

    .image.main {
      display: block;
      margin: 0 0 3em 0;
      width: 100%;
    }

      .image.main img {
        width: 100%;
      }

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

        .image.main {
          margin: 0 0 2em 0;
        }

      }
}




/* Tiles */

.tiles {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -moz-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
  margin: -2.5em 0 0 -2.5em;
}

  .tiles article {
    -moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease;
    -ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease;
    transition: transform 0.5s ease, opacity 0.5s ease;
    position: relative;
    width: calc(33.33333% - 2.5em);
    margin: 2.5em 0 0 2.5em;
  }

    .tiles article > .image {
      -moz-transition: -moz-transform 0.5s ease;
      -webkit-transition: -webkit-transform 0.5s ease;
      -ms-transition: -ms-transform 0.5s ease;
      transition: transform 0.5s ease;
      position: relative;
      display: block;
      width: 100%;
      border-radius: 4px;
      overflow: hidden;
    }

      .tiles article > .image img {
        display: block;
        width: 100%;
      }

      .tiles article > .image:before {
        pointer-events: none;
        -moz-transition: background-color 0.5s ease, opacity 0.5s ease;
        -webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
        -ms-transition: background-color 0.5s ease, opacity 0.5s ease;
        transition: background-color 0.5s ease, opacity 0.5s ease;
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 1.0;
        z-index: 1;
        opacity: 0.8;
      }

      .tiles article > .image:after {
        pointer-events: none;
        -moz-transition: opacity 0.5s ease;
        -webkit-transition: opacity 0.5s ease;
        -ms-transition: opacity 0.5s ease;
        transition: opacity 0.5s ease;
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 0.25px%3B stroke: %23ffffff%3B %7D%3C/style%3E%3Cline x1='0' y1='0' x2='100' y2='100' /%3E%3Cline x1='100' y1='0' x2='0' y2='100' /%3E%3C/svg%3E");
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        opacity: 0.25;
        z-index: 2;
      }

    .tiles article > a {
      display: -moz-flex;
      display: -webkit-flex;
      display: -ms-flex;
      display: flex;
      -moz-flex-direction: column;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      -moz-align-items: center;
      -webkit-align-items: center;
      -ms-align-items: center;
      align-items: center;
      -moz-justify-content: center;
      -webkit-justify-content: center;
      -ms-justify-content: center;
      justify-content: center;
      -moz-transition: background-color 0.5s ease, -moz-transform 0.5s ease;
      -webkit-transition: background-color 0.5s ease, -webkit-transform 0.5s ease;
      -ms-transition: background-color 0.5s ease, -ms-transform 0.5s ease;
      transition: background-color 0.5s ease, transform 0.5s ease;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      padding: 1em;
      border-radius: 4px;
      border-bottom: 0;
      color: #ffffff;
      text-align: center;
      text-decoration: none;
      z-index: 3;
    }

      .tiles article > a > :last-child {
        margin: 0;
      }

      .tiles article > a:hover {
        color: #ffffff !important;
      }

      .tiles article > a h2 {
        margin: 0;
      }

      .tiles article > a .content {
        -moz-transition: max-height 0.5s ease, opacity 0.5s ease;
        -webkit-transition: max-height 0.5s ease, opacity 0.5s ease;
        -ms-transition: max-height 0.5s ease, opacity 0.5s ease;
        transition: max-height 0.5s ease, opacity 0.5s ease;
        width: 100%;
        max-height: 0;
        line-height: 1.5;
        margin-top: 0.35em;
        opacity: 0;
      }

        .tiles article > a .content > :last-child {
          margin-bottom: 0;
        }

    .tiles article.style1 > .image:before {
      background-color: #f2849e;
    }

    .tiles article.style2 > .image:before {
      background-color: #7ecaf6;
    }

    .tiles article.style3 > .image:before {
      background-color: #7bd0c1;
    }

    .tiles article.style4 > .image:before {
      background-color: #c75b9b;
    }

    .tiles article.style5 > .image:before {
      background-color: #ae85ca;
    }

    .tiles article.style6 > .image:before {
      background-color: #8499e7;
    }

    body:not(.is-touch) .tiles article:hover > .image {
      -moz-transform: scale(1.1);
      -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1);
    }

      body:not(.is-touch) .tiles article:hover > .image:before {
        background-color: #333333;
        opacity: 0.35;
      }

      body:not(.is-touch) .tiles article:hover > .image:after {
        opacity: 0;
      }

    body:not(.is-touch) .tiles article:hover .content {
      max-height: 15em;
      opacity: 1;
    }

  * + .tiles {
    margin-top: 2em;
  }

  body.is-preload .tiles article {
    -moz-transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0;
  }

  body.is-touch .tiles article .content {
    max-height: 15em;
    opacity: 1;
  }

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

    .tiles {
      margin: -1.25em 0 0 -1.25em;
    }

      .tiles article {
        width: calc(33.33333% - 1.25em);
        margin: 1.25em 0 0 1.25em;
      }

  }

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

    .tiles {
      margin: -2.5em 0 0 -2.5em;
    }

      .tiles article {
        width: calc(50% - 2.5em);
        margin: 2.5em 0 0 2.5em;
      }

  }

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

    .tiles {
      margin: -1.25em 0 0 -1.25em;
    }

      .tiles article {
        width: calc(50% - 1.25em);
        margin: 1.25em 0 0 1.25em;
      }

        .tiles article:hover > .image {
          -moz-transform: scale(1.0);
          -webkit-transform: scale(1.0);
          -ms-transform: scale(1.0);
          transform: scale(1.0);
        }

  }

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

    .tiles {
      margin: 0;
    }

      .tiles article {
        width: 100%;
        margin: 1.25em 0 0 0;
      }

  }




/* Main */

#main {
  padding: 140px 0px 0px 0px;
  background-image: url(../images/meetings-bg.jpg);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
}

  #main .inner {
    margin-left: 30px;
    margin-right: 30px;
  }

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

    #main {
      padding: 0em 0 4em 0 ;
    }

  }
  
  #main .footer {
    text-align: center;
    margin-top: 140px;
    border-top: 1px solid rgba(250,250,250,0.15);
    padding: 50px 0px;
  }
  .footer p {
    text-transform: uppercase;
    font-size: 14px;
    color: #fff;
  }
  
  .footer p a {
    color: #f5a425;
  }

/* Blog */


  #blog {
    padding: 140px 0px 0px 0px;
    background-image: url(../images/meetings-bg.jpg);
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
  }
  
    #blog .inner {
      margin-left: 30px;
      margin-right: 30px;
    }
  
    @media screen and (max-width: 736px) {
  
      #blog {
        padding: 0em 0 4em 0 ;
      }
  
    }
    
    #blog .footer {
      text-align: center;
      margin-top: 140px;
      border-top: 1px solid rgba(250,250,250,0.15);
      padding: 50px 0px;
    }
    .footer p {
      text-transform: uppercase;
      font-size: 14px;
      color: #fff;
    }
    
    .footer p a {
      color: #f5a425;
    }
  

/* 
---------------------------------------------
responsive
--------------------------------------------- 
*/



@media (max-width: 992px) {

  .main-banner .caption {
    top: 60%;
  }

  .main-banner .caption h2 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 22px;
  }

  .main-banner .caption .main-button-red {
    margin-top: 15px;
  }

  .services {
    margin-top: 60px;
  }

  section.upcoming-meetings {
    padding-top: 400px;
  }

  section.upcoming-meetings .categories {
    margin-right: 0px;
    margin-bottom: 30px;
  }

  .accordions {
    margin-left: 0px;
  }

  .new-students {
    margin-top: 15px;
  }

  section.our-facts .video {
    margin-left: 0px;
    margin-top: 15px;
  }

  section.contact-us #contact {
    margin-bottom: 30px;
  }

}

@media (max-width: 767px) {

  .sub-header .left-content p {
    display: none;
  }

  .sub-header .right-icons {
    text-align: center;
  }

  .main-nav .nav .sub-menu {
    display: none;
  }

  .header-area .main-nav .nav li ul.sub-menu li a {
    color: #1f272b;
  }

}