/*

TemplateMo 569 Edu Meeting

https://templatemo.com/tm-569-edu-meeting

*/

/* ---------------------------------------------
Table of contents
------------------------------------------------
01. font & reset css
02. reset
03. global styles
04. header
05. banner
06. features
07. testimonials
08. contact
09. footer
10. preloader
11. search
12. portfolio

--------------------------------------------- */
/* 
---------------------------------------------
font & reset css
--------------------------------------------- 
*/
@import url("https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900");
/* 
---------------------------------------------
reset
--------------------------------------------- 
*/
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: 14px;
  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: #fff!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;
}

.main-nav .logo img {
  width: 80px;
  height: 70px; /* Explicitly set the height */
}


.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; 
  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: 28px;
  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: 14px;
  text-transform: uppercase;
  color: white;
  -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: #f7f7f7;
    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 {
 
  max-height: 100%;
  overflow: hidden;
  margin-bottom: -7px;
  justify-content: center; /* Horizontally center all content */
  align-items: center; /* Vertically center all content */
}

.bg-image {
  background-image: url(../images/uni2.webp); /* Replace with your actual image path */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  
}



#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 {
  justify-content: center;
    position: absolute;
    background-color: transparent;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
}



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

.main-banner .caption h6 {
  justify-self: center;
  margin-top: 0px;
  font-size: 15px;
  text-transform: uppercase;
  font-weight: 600;
  color: #fff;
  letter-spacing: 1px;
}

.main-banner .caption h5{
  font-weight: bold;
  color: white;
}

.main-banner .caption h2 {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 36px;
  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: white;
  font-size: 28px;
  max-width: 570px;
  font-weight: bold;
}

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

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

  .main-banner .caption h6 {
    margin-top: 100px;
    font-weight: 500;
  }

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

}


/*
---------------------------------------------
services
---------------------------------------------
*/

.services {
  margin-top: -135px;
  position: absolute;
  width: 100%;
}

.services .item {
  background-image: url(../images/service-item-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  border-radius: 20px;
  text-align: center;
  color: #fff;
  padding: 40px;
}

.services .item .icon {
  max-width: 60px;
  margin: 0 auto;
}

.services .item h4 {
  margin-top: 25px;
  margin-bottom: 15px;
  font-size: 18px;
  font-weight: 600;
}

.services .item p {
  color: #fff;
  font-size: 13px;
}

.services .owl-nav {
  display: inline-block !important;
  text-align: center;
  position: absolute;
  width: 100%;
  top: 50%;
  transform: translateY(-25px);
}
    
.services .owl-nav .owl-prev{
  margin-right: 10px;
  outline: none;
  position: absolute;
  left: -80px;
}

.services .owl-nav .owl-prev span,
.services .owl-nav .owl-next span {
  opacity: 0;
}

.services .owl-nav .owl-prev:before {
  display: inline-block;
  font-family: 'FontAwesome';
  color: #1e1e1e;
  font-size: 25px;
  font-weight: 700;
  content: '\f104';
  background-color: #fff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 50px;
}

.services .owl-nav .owl-prev {
  opacity: 1;
  transition: all .5s;
}

.services .owl-nav .owl-prev:hover {
  opacity: 0.9;
}

.services .owl-nav .owl-next {
  opacity: 1;
  transition: all .5s;
}

.services .owl-nav .owl-next:hover {
  opacity: 0.9;
}

.services .owl-nav .owl-next{
  margin-left: 10px;
  outline: none;
  position: absolute;
  right: -85px;
}

.services .owl-nav .owl-next:before {
  display: inline-block;
  font-family: 'FontAwesome';
  color: #1e1e1e;
  font-size: 25px;
  font-weight: 700;
  content: '\f105';
  background-color: #fff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 50px;
}


/*
---------------------------------------------
upcoming meetings
---------------------------------------------
*/

section.upcoming-meetings {
  background-image: url(../images/letter.png);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 130px;
  padding-bottom: 110px;
}

section.upcoming-meetings .section-heading {
  text-align: center;
}

section.upcoming-meetings .categories {
  background-color: #fff;
  border-radius: 20px;
  padding: 40px;
  margin-right: 45px;
}

section.upcoming-meetings h2 {
  color: #5C5C5C;
  text-decoration: underline; 

}

section.upcoming-meetings .categories h4 {
  font-size: 18px;
  font-weight: 600;
  color: #1f272b;
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
}

section.upcoming-meetings .categories ul li {
  display: inline-block;
  margin-bottom: 15px;
}

section.upcoming-meetings .categories ul li a {
  font-size: 15px;
  color: #1f272b;
  font-weight: 500;
  transition: all .3s;
}

section.upcoming-meetings .categories ul li a:hover {
  color: #a12c2f;
}

section.upcoming-meetings .categories .main-button-red {
  border-top: 1px solid #eee;
  padding-top: 30px;
  margin-top: 15px;
}

section.upcoming-meetings .categories .main-button-red a {
  width: 100%;
  text-align: center;
}

.meeting-item {
  margin-bottom: 30px;
}

.meeting-item .thumb {
  position: relative;
}

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

.meeting-item .thumb .price {
  position: absolute;
  left: 20px;
  top: 20px;
}

.meeting-item .thumb .price span {
  font-size: 16px;
  color: #1f272b;
  font-weight: 600;
  background-color: rgba(250,250,250,0.9);
  padding: 7px 12px;
  border-radius: 10px;
}

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

.meeting-item .down-content .date {
  float: left;
  text-align: center;
  display: inline-block;
  margin-right: 20px;
}

.meeting-item .down-content .date h6 {
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 600;
  color: #a12c2f;
}

.meeting-item .down-content .date span {
  display: block;
  color: #1f272b;
  font-size: 22px;
  margin-top: 7px;
}

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

.meeting-item .down-content p {
  margin-left: 50px;
  color: #1f272b;
  font-size: 14px;
}



/*
---------------------------------------------
apply now
---------------------------------------------
*/

section.apply-now {
 background-color: #256393;
  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;
}


/* 
---------------------------------------------
courses
--------------------------------------------- 
*/

section.our-courses {
  background-image: url(../images/letter.png);
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 140px;
  padding-bottom: 130px;
}
#courses .section-heading h2 {
  color: black; /* Replace with your desired color */
  font-size: 2rem; /* Optional: Adjust font size if needed */
  font-weight: bold; /* Optional: Adjust font weight */
  text-transform: uppercase; /* Optional: Make text uppercase */
}


.our-courses .item .down-content {
  background-color: transparent;
}

.our-courses .item .down-content h4 {
  padding: 25px;
  font-size: 18px;
  color: #1f272b;
  text-align: center; 
  border-bottom: 1px solid #eee;
}

.our-courses .item .down-content .info {
  padding: 25px;
}

.our-courses .item .down-content .info ul li {
  display: inline-block;
  margin-right: 1px;
}

.our-courses .item .down-content .info ul li i {
  color: #f5a425;
  font-size: 14px;
}

.our-courses .item .down-content .info span {
  color: #a12c2f;
  font-size: 15px;
  font-weight: 600;
  text-align: right;
  display: inline-block;
  width: 100%;
}

.our-courses .owl-nav {
  text-align: center;
  position: absolute;
  width: 100%;
  top: 50%;
  transform: translateY(-45px);
}

.our-courses .owl-dots {
  display: inline-block;
  text-align: center;
  width: 100%;
  margin-top: 40px;
}

.our-courses .owl-dots .owl-dot {
  transition: all .5s;
  width: 7px;
  height: 7px;
  background-color: #fff;
  margin: 0px 5px;
  border-radius: 50%;
  outline: none;
}

.our-courses .owl-dots .active {
  width: 24px;
  height: 8px;
  border-radius: 4px;
}
    
.our-courses .owl-nav .owl-prev{
  margin-right: 10px;
  outline: none;
  position: absolute;
  left: -80px;
}

.our-courses .owl-nav .owl-prev span,
.our-courses .owl-nav .owl-next span {
  opacity: 0;
}

.our-courses .owl-nav .owl-prev:before {
  display: inline-block;
  font-family: 'FontAwesome';
  color: #1e1e1e;
  font-size: 25px;
  font-weight: 700;
  content: '\f104';
  background-color: #fff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 50px;
}

.our-courses .owl-nav .owl-prev {
  opacity: 1;
  transition: all .5s;
}

.our-courses .owl-nav .owl-prev:hover {
  opacity: 0.9;
}

.our-courses .owl-nav .owl-next {
  opacity: 1;
  transition: all .5s;
}

.our-courses .owl-nav .owl-next:hover {
  opacity: 0.9;
}

.our-courses .owl-nav .owl-next{
  margin-left: 10px;
  outline: none;
  position: absolute;
  right: -85px;
}

.our-courses .owl-nav .owl-next:before {
  display: inline-block;
  font-family: 'FontAwesome';
  color: #1e1e1e;
  font-size: 25px;
  font-weight: 700;
  content: '\f105';
  background-color: #fff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 50px;
}


/*
---------------------------------------------
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;
}

.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;
}

.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;
}


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

section.contact-us {
  background-image: url(../images/letter.png);
  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: #256393;
  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;
    
}

.footer p a {
  color: #f5a425;
}


/*
---------------------------------------------
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: 15px;
  text-transform: uppercase;
  font-weight: 600;
  color: #fff;
  letter-spacing: 1px;
}

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


/*
---------------------------------------------
upcoming meetings page
---------------------------------------------
*/

section.meetings-page {
  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.meetings-page .filters {
  text-align: center;
  margin-bottom: 60px;
}

section.meetings-page .filters li {
  font-size: 13px;
  color: #a12c2f;
  background-color: #fff;
  padding: 11px 30px;
  display: inline-block;
  border-radius: 22px;
  font-weight: 600;
  text-transform: uppercase;
  transition: all .3s;
  cursor: pointer;
  margin: 0px 3px;
}

section.meetings-page .filters ul li.active,
section.meetings-page .filters ul li:hover {
  background-color: #a12c2f;
  color: #fff;
}

section.meetings-page .pagination {
  text-align: center;
  width: 100%;
  margin-top: 30px;
  display: inline-block;
}

section.meetings-page .pagination ul li {
  display: inline-block;
}

section.meetings-page .pagination ul li a {
  width: 40px;
  height: 40px;
  background-color: #fff;
  border-radius: 10px;
  color: #1f272b;
  display: inline-block;
  text-align: center;
  line-height: 40px;
  font-weight: 600;
  font-size: 15px;
  transition: all .3s;
}

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

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

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

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

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

.meeting-single-item .thumb .price {
  position: absolute;
  left: 20px;
  top: 20px;
}

.meeting-single-item .thumb .price span {
  font-size: 16px;
  color: #1f272b;
  font-weight: 600;
  background-color: rgba(250,250,250,0.9);
  padding: 7px 12px;
  border-radius: 10px;
}

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

.meeting-single-item .thumb .date {
  position: absolute;
  background-color: rgba(250,250,250,0.9);
  width: 80px;
  height: 80px;
  text-align: center;
  padding: 15px 0px;
  border-radius: 10px;
  right: 20px;
  top: 20px;
}

.meeting-single-item .thumb .date h6 {
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 600;
  color: #a12c2f;
}

.meeting-single-item .thumb .date span {
  display: block;
  color: #1f272b;
  font-size: 22px;
  margin-top: 7px;
}

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

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

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

.meeting-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-single-item .down-content .share {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid #eee;
}

.meeting-single-item .down-content .share h5 {
  float: left;
  margin-right: 10px;
  margin-bottom: 0px;
}

.meeting-single-item .down-content .share ul li {
  display: inline;
}

.meeting-single-item .down-content .share ul li a {
  font-size: 14px;
  color: #1f272b;
  transition: all .3s;
}

.meeting-single-item .down-content .share ul li a:hover {
  color: #f5a425;
}

/* 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%;
	}
}

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

@media (max-width: 1300px) {
  .services .owl-nav .owl-next{
    right: -30px;
  }
  .services .owl-nav .owl-prev{
    left: -25px;
  }
  .our-courses .owl-nav .owl-next{
    right: -30px;
  }
  .our-courses .owl-nav .owl-prev{
    left: -25px;
  }
}

@media (max-width: 1200px) {
  .services .owl-nav .owl-next{
    right: -70px;
  }
  .services .owl-nav .owl-prev{
    left: -65px;
  }
  .our-courses .owl-nav .owl-next{
    right: -70px;
  }
  .our-courses .owl-nav .owl-prev{
    left: -65px;
  }
}

@media (max-width: 1085px) {
  .services .owl-nav .owl-next{
    right: -30px;
  }
  .services .owl-nav .owl-prev{
    left: -25px;
  }
  .our-courses .owl-nav .owl-next{
    right: -30px;
  }
  .our-courses .owl-nav .owl-prev{
    left: -25px;
  }
}

@media (max-width: 1005px) {
  .services .owl-nav .owl-next{
    display: none;
  }
  .services .owl-nav .owl-prev{
    display: none;
  }
  .our-courses .owl-nav .owl-next{
    display: none;
  }
  .our-courses .owl-nav .owl-prev{
    display: none;
  }
}

@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;
  }

}


.letter-content {
  max-width: 900px; /* Restricts the width for readability */
  line-height: 1.8; /* Improves readability with proper line spacing */
  text-align: justify; /* Justifies the text for clean edges */
  color: #333333; /* Neutral and legible text color */
  font-size: 16px; /* Sets an appropriate font size */
  margin: 0 auto; /* Ensures content stays centered */
}

.letter-content strong {
  font-weight: bold; /* Makes important parts bold */
  color: #000; /* Ensures bold text is solid black */
}

@media (max-width: 768px) {
  .letter-content {
    padding: 15px; /* Reduce padding on smaller screens */
  }
}


.apply-now {
  padding: 50px 20px;
  color: #FFFFFF; /* White text for readability */
  /* Matches the background color in the image */
}

.apply-now .container {
  max-width: 1200px;
  margin: 0 auto;
}

.apply-now .row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.apply-now .text-content {
  padding-right: 20px;
}

.apply-now .text-content h5 {
  color: white;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 10px;
  position: relative;
}

.apply-now .text-content h5::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 2px;
  
  margin-right: 10px;
}

.apply-now .text-content h2 {
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #FFFFFF;
  text-decoration: underline dashed 2px #FFFFFF; /* Adds dashed underline */
}

.apply-now .text-content p {
  color: white;
  line-height: 1.8;
  margin-bottom: 20px;
  font-size: 16px;
}

.apply-now .text-content strong {
  font-weight: bold;
}

.apply-now .image-content img {
  width: 100%;
  border: 5px solid #FFFFFF; /* Adds white border */
  border-radius: 5px; /* Optional rounded corners */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Adds a subtle shadow */
}


.apply-now .btn-pill {
  display: inline-block;
  padding: 10px 30px; /* Adjust padding for size */
  background-color: #C9984E; /* Button background color */
  color: #FFFFFF; /* Button text color */
  font-size: 16px; /* Adjust font size */
  font-weight: bold; /* Make text bold */
  text-align: center;
  text-decoration: none; /* Remove underline */
  border: none; /* Remove default border */
  border-radius: 50px; /* Makes the button pill-shaped */
  transition: all 0.3s ease; /* Smooth hover transition */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Optional: Adds a shadow */
}

.apply-now .btn-pill:hover {
  background-color: #C7432F; /* Darker shade on hover */
  color: #FFFFFF; /* Keep text color consistent */
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.3); /* Slightly larger shadow on hover */
}

/* Section Styling */
.tile-section {
  padding: 50px 20px;
  background-color: #f5f5f5; /* Light gray background */
  text-align: center; /* Center-align text in the tiles */
}

/* Tile Container (Grid Layout) */
.tile-section .tiles {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* Two columns for the first row */
  grid-gap: 20px; /* Space between the tiles */
  justify-items: center; /* Center tiles horizontally */
}

/* Responsive Design */
@media (max-width: 768px) {
  .tile-section .tiles {
    grid-template-columns: 1fr; /* Single column for mobile */
  }
}

/* Tile Styling */
.tile-section .tile {
  background-color: #007BFF; /* Blue background for tiles */
  color: #ffffff; /* White text */
  padding: 20px;
  border-radius: 10px; /* Rounded corners */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */
  font-size: 18px;
  font-weight: bold;
  width: 100%; /* Full width inside the grid */
  max-width: 300px; /* Restrict max width of tiles */
}

/* Align the last tile in the middle of the second row */
.tile-section .tile:nth-child(3) {
  grid-column: span 2; /* Span across two columns for centering */
  justify-self: center; /* Center it horizontally */
}




section.tile-section {
  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.tile-section #contact {
  background-color: #fff;
  border-radius: 20px;
  padding: 40px;
}

section.tile-section #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: #256393;
  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:black;
}

.footer p a {
  color: #f5a425;
}


/* FAQ */

section.FAQ {
  background-color: #256393;
   background-position: center center;
   background-attachment: scroll;
   background-repeat: no-repeat;
   background-size: cover;
   padding: 140px 0px;
 }
 
 section.FAQ .item {
   background-color: rgba(250,250,250,0.15);
   padding: 40px;
  
 }
 
 section.FAQ .item h3 {
   color: #fff;
   text-transform: uppercase;
   font-size: 24px;
   font-weight: 700;
  
 }
 
 section.FAQ .item p {
   color: #fff;
   
 }
 
 .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;
 }
 




.main-banner .caption {
  display: flex; /* Flexbox for content alignment */
  flex-direction: column; /* Stack items vertically */
  justify-content: center; /* Center content vertically */
  align-items: center; /* Center content horizontally */
  
  top: 50%; /* Start vertically centering */
  left: 50%; /* Start horizontally centering */
  transform: translate(-50%, -50%); /* Finalize centering */
  text-align: center; /* Center-align text */
}



/* Meet the Team Section */
/* Meet the Team Section */
.meet-the-team {
  text-align: center;
  background-color: #f9f9f9; /* Light background color */
  padding: 50px 0;
}

/* Meet the Team Heading */
.meet-the-team h2 {
  font-weight: bold;
  font-size: 2rem;
  border-bottom: 2px solid #000; /* Underline for "Meet the Team" */
  display: inline-block;
  padding-bottom: 10px;
  margin-bottom: 15px;
}

/* Secretariat Heading */
.meet-the-team h4 {
  font-weight: bold;
  font-size: 1.5rem;
  color: #6c757d; /* Muted subtitle color */
  margin-bottom: 30px;
}

/* Group Picture */
.meet-the-team .group-picture {
  width: 100%; /* Full width */
  max-width: 600px; /* Restrict maximum width */
  height: auto; /* Maintain aspect ratio */
  margin: 0 auto 30px; /* Center and add spacing below */
  display: block;
  border-radius: 10px; /* Optional: Slight rounding for better aesthetics */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
}

/* Team Member Photos */
.team-photo img {
  width: 100%; /* Ensure the image fits the container */
  height: auto; /* Maintain aspect ratio */
  max-width: 150px; /* Restrict size */
  border-radius: 0; /* Square shape */
  display: block;
  margin: 0 auto; /* Center the image */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Add shadow for effect */
}

/* Team Member Text */
.meet-the-team h5 {
  font-weight: bold;
  margin-top: 15px;
}

.meet-the-team p {
  font-size: 0.9rem;
  margin-bottom: 0;
}


/* Responsive behavior */
@media (max-width: 768px) {
  .meet-the-team .group-picture {
    max-width: 100%; /* Allow group picture to scale on smaller screens */
  }

  .team-photo img {
    max-width: 120px; /* Reduce size of individual photos */
  }
}



#countdown-timer {
  font-size: 1.5rem;
  font-weight: bold;
  color: white; /* Adjust color for visibility */
  margin-bottom: 10px;
}

@media (max-width: 768px) {
  #countdown-timer {
    font-size: 1.2rem; /* Slightly reduce size for smaller screens */
  }
}

/* Registration Section Styling */
.registration-section {
  min-height: 100vh; /* Full screen height */
  display: flex;
  flex-direction: column;
  justify-content: center; /* Center content vertically */
  align-items: center; /* Center content horizontally */
  text-align: center; /* Center text */
  background-color: #f9f9f9; /* Light background color */
}

.registration-heading {
  font-size: 2.5rem;
  font-weight: bold;
  margin-bottom: 30px; /* Space below heading */
  color: #333; /* Dark text color */
}

/* Registration Details Styling */
.registration-details {
  margin-bottom: 20px; /* Space below the details and buttons */
  font-size: 1.2rem; /* Font size for details */
  color: #555; /* Slightly muted text color */
  text-align: left; /* Align text to the left */
}

.registration-details p {
  margin: 10px 0; /* Space between each line of details */
}

/* Options (Buttons) */
.options {
  display: flex;
  flex-direction: column;
  gap: 20px; /* Space between buttons */
}

/* Pill Button Styling */
.btn-pill {
  display: inline-block;
  padding: 10px 30px; /* Size of the pill button */
  font-size: 1.2rem; /* Button text size */
  font-weight: bold;
  text-decoration: none; /* Remove underline */
  color: #fff; /* White text */
  background-color: #007BFF; /* Blue background */
  border-radius: 50px; /* Makes the buttons pill-shaped */
  text-align: center;
  transition: background-color 0.3s ease; /* Smooth hover transition */
}

.btn-pill:hover {
  background-color: #0056b3; /* Darker blue on hover */
}
/* Sub-heading Styling */
.sub-heading {
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 15px;
  color: #333; /* Darker text color */
}

/* Registration Group Styling */
.registration-group {
  width: 100%;
  max-width: 600px; /* Limit width of each group */
  text-align: center;
  margin-bottom: 30px;
}

/* Registration Details Styling */
.registration-details {
  margin-bottom: 20px; /* Space below the details and buttons */
  font-size: 1.2rem; /* Font size for details */
  color: #555; /* Slightly muted text color */
  text-align: center; /* Align text to the left */
}

.registration-details p {
  margin: 10px 0; /* Space between each line of details */
}

/* Options (Buttons) */
.options {
  display: flex;
  flex-direction: column;
  gap: 15px; /* Space between buttons */
}

/* Pill Button Styling */
.btn-pill {
  display: inline-block;
  padding: 10px 30px; /* Size of the pill button */
  font-size: 1.2rem; /* Button text size */
  font-weight: bold;
  text-decoration: none; /* Remove underline */
  color: #fff; /* White text */
  background-color: #007BFF; /* Blue background */
  border-radius: 50px; /* Makes the buttons pill-shaped */
  text-align: center;
  transition: background-color 0.3s ease; /* Smooth hover transition */
}

.btn-pill:hover {
  background-color: #0056b3; /* Darker blue on hover */
}

/* Options (Buttons) for Delegate Registration */
.registration-group .options {
  display: flex;
  flex-direction: row; /* Align buttons side by side */
  justify-content: center; /* Center buttons horizontally */
  gap: 20px; /* Space between buttons */
}


/* Footer */
.footer {
  text-align: center;
  margin-top: 50px; /* Space above the footer */
  font-size: 0.9rem;
  color: #777; /* Muted text color */
}

.contact-us {
  display: flex;
  flex-direction: column; /* Stack content vertically */
  min-height: 100vh; /* Ensure the section takes full viewport height */
  justify-content: center; /* Vertically center content */
}

.contact-us .container {
  flex: 1; /* Allow the container to grow and fill the space */
}

.contact-us .footer {
  margin-top: auto; /* Push the footer to the bottom of the section */
  text-align: center;
  font-size: 0.9rem;
  color: #777; /* Optional: Adjust footer text color */
}




/* General Section Styling */

.section-title {
  font-size: 2.5rem;
  font-weight: bold;
  margin-bottom: 15px;
}

.section-subtitle {
  font-size: 1.5rem;
  color: #6c757d;
}

.team-photo {
  width: 150px;
  height: 150px;
  background-color: #ddd;
  border-radius: 50%;
  margin: 0 auto 10px;
}

.team-member h5 {
  font-size: 1.1rem;
  font-weight: bold;
}

.team-member p {
  font-size: 0.9rem;
  color: #6c757d;
}

/* Marketing Section Styling */
.marketing-section {
  background-color: #004085; /* Dark blue background */
  color: #fff; /* White text */
}

.marketing-section .team-photo {
  background-color: #0056b3; /* Lighter blue for marketing photos */
}

/* Departments Section Styling */
.departments-section {
  background-color: #f9f9f9; /* Light gray background */
}
/* Team Member Styling */
.team-member {
  text-align: center;
}

.team-photo {
  width: 150px; /* Width for square photo */
  height: 150px; /* Height to make it square */
  overflow: hidden; /* Ensures the image doesn't exceed the bounds */
  border-radius: 0; /* Removes circular appearance */
  margin: 0 auto 10px; /* Centers the photo and adds spacing below */
}

.team-photo img {
  width: 100%; /* Ensures the image fits within the square */
  height: 100%; /* Ensures the image fills the square */
  object-fit: cover; /* Maintains the aspect ratio and prevents distortion */
}

.team-member h5 {
  font-weight: bold;
  margin: 10px 0 5px; /* Adds spacing between the name and the photo */
}

.team-member p {
  font-size: 0.9rem;
  color: #333; /* Adjust the text color as needed */
}

/* Responsive Styling */
@media (max-width: 768px) {
  .team-photo {
    width: 120px;
    height: 120px;
  }
  .section-title {
    font-size: 2rem;
  }
}

/*schedule/*
/* Full-Screen Background */
/* Full-Screen Background with Image */
.conference-schedule {
  position: relative;
  min-height: 100vh; /* Full screen height */
  background: url(../images/schedule.png) no-repeat center center / cover; /* Adjust the file path */
 
  color: #000; /* Text color for contrast */
}



.page-title {
  font-size: 2.5rem;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.schedule-box {
  background-color: #fff; /* White background for boxes */
  color: #333; /* Dark text for readability */
  border: 2px solid #daae2d;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.schedule-box h3 {
  font-size: 1.5rem;
  font-weight: bold;
  margin-bottom: 15px;
  text-transform: uppercase;
}

.schedule-box ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.schedule-box ul li {
  margin-bottom: 15px;
  font-size: 1rem;
  line-height: 1.5;
}

.schedule-box ul li strong {
  font-weight: bold;
}

/* Responsive Design */
@media (max-width: 768px) {
  .page-title {
    font-size: 2rem;
  }
  .schedule-box {
    padding: 15px;
  }
}

/* Offset the schedule section to avoid clashing with the header */
.conference-schedule {
  position: relative;
  min-height: 100vh; /* Ensure full-screen height */
  background: #f1f1f1; /* Light gray background */
 /* Adjust this value to match your header height */
  color: white; /* Ensure text contrast */
}

.conference-schedule .page-title {
  font-size: 2.5rem;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 30px;
  text-align: left;
}

.schedule-box {
  background: url(../images/sch.jpg) no-repeat center center; /* Replace 'your-image-path.jpg' with the actual image path or URL */
  background-size: cover; /* Ensures the image covers the entire card */
}


.timeline {
  position: relative;
  list-style: none;
  padding-left: 20px;
}

.timeline li {
  position: relative;
  padding-left: 30px; /* Space for the timeline */
  margin-bottom: 20px;
}

.timeline li::before {
  content: "";
  position: absolute;
  left: 10px; /* Align with the timeline */
  top: 0;
  width: 10px;
  height: 10px;
  background-color: #333; /* Dot color */
  border-radius: 50%;
}

.timeline li::after {
  content: "";
  position: absolute;
  left: 14px; /* Center the line with the dot */
  top: 10px;
  bottom: -10px;
  width: 2px;
  background-color: #ccc; /* Line color */
}

.timeline li:last-child::after {
  content: none; /* Remove the line for the last item */
}

.time-red {
  color: #ce202a;
}
.time-blue {
  color: #33679d;
}
.time-yellow {
  color: #daae2d;
}

.schedule-box ul {
  text-align: center; /* Align the text inside the list */
}

.schedule-box ul li {
  text-align: left; /* Ensure list items align to the left */
}

.page-title {
  text-align: center !important; /* Ensure it is centered */
  margin: 0 auto; /* Center the element within its container */
  display: block; /* Ensure block-level behavior for proper alignment */
}

.page-title, .schedule-box, .schedule-box ul li, .timeline {
  font-family: 'Larken', sans-serif;
}

.conference-schedule {
  background: #256393 url(../images/letter.png) no-repeat center center; /* Replace #f0f4f8 with your color */
  background-size: cover; /* Ensures the image covers the entire section */
  min-height: 100vh; /* Full viewport height */
  padding: 50px 0; /* Add padding for spacing */
}







.filler {
  background: url(../images/filler2.jpg); /* Replace with your image path */
  background-size: cover; /* Ensures the image covers the section */
  background-position: center center; /* Centers the image */
  height: 300px; /* Set the height as per your requirement */
  width: 100%; /* Ensure it spans the full width */
}


/* General Section Styling */
.committee-info {
  background-image: url('../images/letter.png');
  background-color: #256393;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  min-height: 100vh;
  padding: 60px 20px;
  position: relative;
  z-index: 1;
}

.committee-info::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: -1;
}

.committee-card {
  background-color: rgba(255, 255, 255, 0.9);
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  align-items: center;
  text-align: center;
}

.committee-logo {
  display: block;
  margin: 0 auto 20px auto;
  width: 100px;
  height: 100px;
  object-fit: contain;
}

.committee-title {
  text-align: center;
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 10px;
}

.chair-cards {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  margin-top: 20px;
  gap: 20px;
}

.chair-card {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 10px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  padding: 20px;
  text-align: center;
  width: 500px;
  transition: transform 0.3s ease;
}



.chair-photo {
  width: 100%;
  height: auto;
  max-height: 350px;
  margin-bottom: 15px;
  object-fit: contain;
  border-radius: 10px;
}

.chair-card h3 {
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 5px;
}

.chair-title {
  font-size: 1rem;
  color: #777;
  margin-bottom: 10px;
}

.chair-bio {
  font-size: 0.9rem;
  color: #555;
}

.chair-cards {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    margin-top: 20px;
    gap: 10px; /* Reduce gap between cards */
}

.chair-card {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    padding: 20px;
    text-align: center;
    width: 375px; /* Increase card width */
   margin-bottom: 50px;
}

.chair-cards {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap; /* Allows wrapping for responsive design */
  gap: 20px; /* Space between cards */
  align-items: flex-start; /* Ensures cards are not stretched */
}

.chair-card {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 10px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  padding: 20px;
  text-align: center;
  width: 375px; /* Fixed card width */
  margin-bottom: 50px;
  flex-grow: 0; /* Prevent cards from growing */
  flex-shrink: 0; /* Prevent cards from shrinking */
}


#ch {
  display: none;
}

#ch:checked ~ .bio {
  display: block;
}

#ch:checked ~ label{
  display: none;
}

#ch2 {
  display: none;
}

#ch2:checked ~ .bio {
  display: block;
}

#ch2:checked ~ label{
  display: none;
}

#ch3 {
  display: none;
}

#ch3:checked ~ .bio {
  display: block;
}

#ch3:checked ~ label{
  display: none;
}
.bio {
  display: none;

}
.chair-card label {
  display:flex;
  justify-self: center;
  cursor: pointer;
  padding: 10px 30px; /* Adjust padding for size */
  background-color: #C9984E; /* Button background color */
  color: #FFFFFF; /* Button text color */
  font-size: 16px; /* Adjust font size */
  font-weight: bold; /* Make text bold */
  text-align: center;
  text-decoration: none; /* Remove underline */
  border: none; /* Remove default border */
  border-radius: 50px; /* Makes the button pill-shaped */
  transition: all 0.3s ease; /* Smooth hover transition */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Optional: Adds a shadow */
}

.chair-card label:hover {
  background-color: #C7432F; /* Darker shade on hover */
  color: #FFFFFF; /* Keep text color consistent */
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.3); /* Slightly larger shadow on hover */
}


.chair-title {
  font-weight: bold;
  font-size: 1rem;
  color: black;
  margin-bottom: 15px; /* Add extra margin to push the button below */
}

/* Ensure the chair-card is responsive */
.chair-card {
  display: flex;
  flex-direction: column; /* Stack elements vertically */
  align-items: center;
  justify-content: flex-start;
  padding: 20px;
  width: 100%; /* Allow the card to fit the screen width on mobile */
  max-width: 400px; /* Optional: Limit maximum width for better appearance */
  margin: 10px auto; /* Center the card on the screen */
}

/* Adjust bio and button spacing */
.bio {
  display: none;
  margin-top: 15px; /* Add spacing between the bio and button */
  text-align: center; /* Ensure bio text is centered */
}

/* Button styling */
label {
  display: inline-block;
  cursor: pointer;
  color: white;
  background-color: #d1a354;
  padding: 8px 15px;
  border-radius: 20px;
  margin-top: 15px; /* Add spacing above the button */
  text-align: center;
  width: fit-content; /* Ensure button wraps content */
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .chair-card {
    width: 90%; /* Reduce card width for smaller screens */
    margin: 15px auto; /* Add spacing around cards */
  }

  label {
    width: auto; /* Allow button to adjust size based on content */
    font-size: 0.9rem; /* Adjust button text size for smaller screens */
    padding: 10px 20px; /* Adjust padding for better tap area */
  }

  .bio {
    margin-top: 20px; /* Add extra space for better readability */
  }
}


.back-button a {
  display: inline-block;
  margin-bottom: 20px;
  color: #007bff;
  text-decoration: none;
  font-size: 1rem;
}

.back-button a:hover {
  text-decoration: underline;
}

.our-courses .item {
  text-decoration: none;
  color: inherit;
  text-align: center;
  padding: 15px;
  background: #f9f9f9;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease-in-out;
  display: block; /* Ensures the whole block is clickable */
}

.our-courses .item:hover {
  transform: scale(1.05);
}

.our-courses .item img {
  max-width: 100%;
  border-radius: 10px;
  margin-bottom: 15px;
}

.our-courses .down-content h4 {
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 0;
}

.our-courses a {
  text-decoration: none; /* Removes underline from links */
}


.filler-2 {
  background: url(".."); /* Replace with your image path */
  background-size: cover; /* Ensures the image covers the entire viewport */
  background-position: center; /* Centers the image */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  width: 100%; /* Full width */
  height: 100vh; /* Full height of the viewport */
}





.section.main-banner {
  position: relative; /* Makes sure child elements like #bg-image are positioned correctly */
  width: 100%; /* Full width */
  height: 100vh; /* Full viewport height */
  display: flex;
  justify-content: center; /* Center the content horizontally */
  align-items: center; /* Center the content vertically */
  overflow: hidden; /* Prevents any overflow issues */
}

.video-overlay {
  position: absolute;
  background-color: rgba(31, 39, 43, 0.75); /* Overlay color */
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1; /* Keeps the overlay above the background */
}

.caption {
  position: relative;
  text-align: center;
  z-index: 2; /* Keeps content above overlay and background */
  color: white;
}

.committee-card {
  text-align: center; /* Center-aligns all text content inside committee-card */
}

.committee-title {
  margin: 20px 0; /* Optional: Adjust spacing for the title */
}

.committee-card p {
  font-size: 1rem; /* Optional: Adjust font size for readability */
  margin: 10px 0; /* Add space above and below the paragraph */
  text-align: center; /* Explicitly center the Agenda line */
  display: inline-block; /* Ensures proper centering of content */
}


.footer {
  text-align: center;
  margin-top: 20px;
  font-size: 0.9rem;
  color: #777;
}

.footer .social-icons {
  margin-top: 10px; /* Space between the copyright and icons */
}

.footer .social-icons a {
  text-decoration: none;
  margin: 0 10px; /* Spacing between icons */
  color: #777; /* Default color for icons */
  font-size: 1.5rem; /* Size of icons */
  transition: color 0.3s ease;
}

.footer .social-icons a:hover {
  color: #0077b5; /* Highlight color on hover (LinkedIn blue for both) */
}

/*index fixes*/
@media (max-width: 768px) {
  .image-content {
    padding-top: 20px; /* Add equal padding above the image container */
  }

  
}



/*faq */
.accordion-body {
  overflow: hidden; /* Ensures content is clipped when hidden */
  height: 0; /* Sets the height to 0 when collapsed */
  transition: height 300ms ease-in-out; /* Smooth height transition */
  border-bottom: 1px solid #fff; /* Keeps the border for closed state */
  padding: 0; /* Remove padding when collapsed */
  margin: 0; /* Remove margin when collapsed */
}

.accordion-body > .content {
  padding: 20px; /* Applies padding only when expanded */
}

.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;
  margin: 0; /* Remove any margin to avoid extra space */
}

.accordion-head.is-open + .accordion-body {
  height: auto; /* Expands the content when open */
  overflow: visible; /* Allow visible content when expanded */
}

section.FAQ {
  background-color: #256393;
  background-position: center center;
  background-attachment: scroll;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 140px 20px; /* Added padding to ensure spacing on smaller screens */
  display: flex;
  align-items: center; /* Vertically center the container */
  text-align: center; /* Center the text */
  flex-direction: column; /* Ensure content stacks vertically */
}

.accordions {
  border-radius: 20px;
  padding: 40px;
  background-color: #fff;
  max-width: 800px; /* Restrict width for better centering */
  width: 100%; /* Ensure responsiveness */
  margin: 0 auto; /* Center the accordion container horizontally */
}

.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;
  margin: 0;
  text-align: left; /* Ensure text alignment looks consistent */
}

@media (max-width: 768px) {
  section.FAQ {
    padding: 100px 10px; /* Adjust padding for smaller screens */
  }

  .accordions {
    padding: 20px; /* Reduce padding inside the accordion on smaller screens */
    max-width: 95%; /* Allow more flexibility for smaller screens */
  }

  .accordion-head {
    font-size: 16px; /* Adjust font size for smaller screens */
  }
}


/* Team Member Styling */
.team-member {
  text-align: center;
}

.team-photo {
  width: 200px; /* Increased width */
  height: 250px; /* Increased height for rectangular appearance */
  overflow: hidden; /* Ensures the image doesn't exceed the bounds */
  border-radius: 10px; /* Adds slight rounding to edges */
  margin: 0 auto 10px; /* Centers the photo and adds spacing below */
}

.team-photo img {
  width: 100%; /* Ensures the image fits within the photo dimensions */
  height: 100%; /* Ensures the image fills the photo dimensions */
  object-fit: cover; /* Maintains aspect ratio and prevents distortion */
}

.team-member h5 {
  font-weight: bold;
  margin: 15px 0 10px; /* Adds spacing between the name and the photo */
}

.team-member p {
  font-size: 1rem; /* Adjust font size for better readability */
  color: #333; /* Adjust the text color as needed */
}

/* Responsive Styling */
@media (max-width: 768px) {
  .team-photo {
    width: 150px; /* Adjust width for smaller screens */
    height: 200px; /* Adjust height for smaller screens */
  }
  .section-title {
    font-size: 2rem; /* Adjust title font size for smaller screens */
  }
}

.our-courses .container > .row:first-child p {
  margin-bottom: 40px; /* Adjust the value as needed */
}