@charset "utf-8";

/* CSS Document */

/******************************

[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
    3.1 Top Bar
    2.2 Header Content
    3.3 Logo
    3.4 Main Nav
    3.5 Hamburger
4. Menu
5. Section
6. Home
7. Features
8. Courses
9. Counter
10. Events
11. Team
12. News
13. Newsletter
14. Footer



******************************/

/***********
1. Fonts
***********/

@import "https://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:300,400,500,700,900";

/*********************************
2. Body and some general stuff
*********************************/

* {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

body {
    font-family: Roboto, sans-serif;
    font-size: 16px;
    font-weight: 400;
    background: #ffffff;
    margin-top: 80px; /* Matches the height of the fixed navbar */
    /* color: #a5a5a5; */
    color: #656668;
}

div {
    display: block;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

ul {
    list-style: none;
    margin-bottom: 0;
}

p {
    font-family: Roboto, sans-serif;
    font-size: 16px;
    line-height: 1.85;
    font-weight: 400;
    color: #656668;
    -webkit-font-smoothing: antialiased;
    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

p a {
    display: inline;
    position: relative;
    color: inherit;
    border-bottom: solid 1px #ffa07f;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

p:last-of-type {
    margin-bottom: 0;
}

a,
a:hover,
a:visited,
a:active,
a:link {
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}

p a:active {
    position: relative;
    color: #ff6347;
}

p a:hover {
    color: #ffffff;
    background: #ffa07f;
}

p a:hover::after {
    opacity: 0.2;
}

::selection {
}

p::selection {
}

h1 {
    font-size: 48px;
}

h2 {
    font-size: 36px;
}

h3 {
    font-size: 24px;
}

h4 {
    font-size: 18px;
}

h5 {
    font-size: 14px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Roboto Slab', serif;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    -webkit-text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
    color: #384158;
    margin-bottom: 0;
}

h1::selection,
h2::selection,
h3::selection,
h4::selection,
h5::selection,
h6::selection {
}

.form-control {
    color: #db5246;
}

section {
    display: block;
    position: relative;
    box-sizing: border-box;
}

.clear {
    clear: both;
}

.clearfix::before,
.clearfix::after {
    content: "";
    display: table;
}

.clearfix::after {
    clear: both;
}

.clearfix {
    zoom: 1;
}

.float_left {
    float: left;
}

.float_right {
    float: right;
}

.trans_200 {
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.trans_300 {
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.trans_400 {
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}

.trans_500 {
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.fill_height {
    height: 100%;
}

.super_container {
    width: 100%;
    overflow: hidden;
}

.prlx_parent {
    overflow: hidden;
}

.prlx {
    height: 130% !important;
}

.parallax-window {
    min-height: 400px;
    background: transparent;
}

.nopadding {
    padding: 0px !important;
}

/*********************************
3. Header
*********************************/

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.header.scrolled {
    /* top: -40px; */
}

/*********************************
3.1 Top Bar
*********************************/

.top_bar {
    width: 100%;
    background: #f26513;
}

.header.scrolled .top_bar {
}

.top_bar_container {
    width: 100%;
    height: 100%;
}

.top_bar_content {
    width: 100%;
    height: 40px;
}

.top_bar_contact_list li {
    display: inline-block;
}

.question {
    font-family: 'Roboto Slab', serif;
    font-size: 14px;
    color: #ffffff;
    margin-left: 0px;
}

.top_bar_contact_list li i,
.top_bar_contact_list li > div {
    display: inline-block;
    font-size: 14px;
    color: #ffffff;
}

.top_bar_contact_list li > div {
    margin-left: 1px;
}

.top_bar_contact_list li:not(:last-child) {
    margin-right: 21px;
}

.top_bar_login {
    height: 100%;
}

.login_button {
    width: 160px;
    height: 100%;
    background: #f3f3f3;
    text-align: center;
}

.login_button a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: 40px;
    color: #384158;
}

/* Top bar link styling */
.top_bar_link {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s ease;
}

.top_bar_link:hover {
    color: #ffffff; /* Changed to white for better contrast on orange background */
    text-decoration: none;
    background-color: transparent;
    font-weight: bold; /* Optional: add boldness for extra emphasis */
}

/*********************************
3.2 Header Content
*********************************/

.header_container {
    width: 100%;
    background: #ffffff;
}

.header_content {
    height: 90px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.header.scrolled .header_content {
    height: 80px;
}

/*********************************
3.3 Logo
*********************************/

.logo,
.logo_text {
    display: inline-block;
}

.logo {
    width: 60px;
    height: 60px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.logo img {
    max-width: 100%;
}

.logo_text {
    font-family: 'Roboto Slab', serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 0.75;
    color: #384158;
    vertical-align: middle;
    margin-left: 7px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.logo_text span {
    color: #f26513;
}

.header.scrolled .logo {
    width: 40px;
    height: 40px;
}

.header.scrolled .logo_text {
    font-size: 24px;
}

/*********************************
3.4 Main Nav
*********************************/

.main_nav_container {
}

.main_nav,
.search_button,
.shopping_cart {
    display: inline-block;
}

.main_nav li {
    display: inline-block;
    position: relative;
}

.main_nav li:not(:last-child) {
    margin-right: 44px;
}

.main_nav li a {
    font-size: 18px;
    font-weight: 500;
    color: #384158;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.main_nav li a:hover,
.main_nav li.active a {
    color: #f26513;
}

.main_nav li.active::after {
    display: block;
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #f26513;
    content: '';
}

.search_button {
    margin-left: 46px;
    cursor: pointer;
}

.shopping_cart {
    margin-left: 23px;
    cursor: pointer;
}

.search_button i,
.shopping_cart i {
    font-size: 18px;
    color: #181818;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.search_button:hover i,
.shopping_cart:hover i {
    color: #f26513;
}

.header_search_form {
    display: block;
    position: relative;
    width: 40%;
}

.header_search_container {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: #f26513;
    z-index: -1;
    opacity: 0;
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}

.header_search_container.active {
    bottom: -73px;
    opacity: 1;
}

.header_search_content {
    width: 100%;
    height: 73px;
}

.search_input {
    width: 100%;
    height: 40px;
    border: none;
    outline: none;
    padding-left: 20px;
}

.header_search_button {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 100%;
    border: none;
    outline: none;
    cursor: pointer;
}

/* Dropdown Container (hidden by default) */
.custom-contact-dropdown {
    display: none;
    position: absolute;
    top: 100%; /* Position dropdown below the Contact button */
    left: 0;
    z-index: 1000;
    background: #ffffff; /* White dropdown background for a clean look */
    border: 1px solid #dddddd; /* Subtle border */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Light shadow for depth */
    padding: 10px 0;
    border-radius: 4px;
    width: 200px; /* Adjust width as needed */
}

/* Show Dropdown on Hover */
.custom-hover-dropdown:hover .custom-contact-dropdown {
    display: block;
}

/* Dropdown Links */
.custom-contact-dropdown .custom-dropdown-item {
    display: block;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 500;
    color: #656668; /* Matches the default text color on the website */
    text-decoration: none;
    font-family: Roboto, sans-serif;
    transition: all 0.3s ease-in-out;
}

/* Hover State for Buttons */
.custom-contact-dropdown .custom-dropdown-item:hover {
    background-color: #f26513; /* Matching hover color */
    color: #ffffff; /* White text on hover */
    border-radius: 3px;
}

/* Dropdown Heading Style */
.nav-link.dropdown-toggle {
    font-size: 18px;
    font-weight: 500;
    color: #384158; /* Matching navigation font color */
    /*text-transform: uppercase; !* Consistent with the website's header style *!*/
    transition: all 0.2s ease-in-out;
}

.nav-link.dropdown-toggle:hover {
    color: #f26513; /* Matches the hover color in the main navigation */
}

/* Dropdown Animation (Optional) */
.custom-contact-dropdown {
    opacity: 0; /* Start hidden */
    transform: translateY(-10px); /* Subtle upward offset */
    transition: opacity 0.3s ease, transform 0.3s ease; /* Smooth fade and slide */
}

.custom-hover-dropdown:hover .custom-contact-dropdown {
    opacity: 1; /* Become visible */
    transform: translateY(0); /* Slide into place */
}

/*********************************
3.5 Hamburger
*********************************/

.hamburger_container {
}

.hamburger {
    display: none;
    cursor: pointer;
}

.hamburger i {
    font-size: 20px;
    color: #353535;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.hamburger:hover i {
    color: #f26513;
}

/*********************************
4. Menu
*********************************/

.menu {
    position: fixed;
    top: 0;
    right: -400px;
    width: 400px;
    height: 100vh;
    background: #ffffff;
    z-index: 101;
    padding-right: 60px;
    padding-top: 87px;
    padding-left: 50px;
}

.menu .logo a {
    color: #000000;
}

.menu.active {
    right: 0;
}

.menu_close_container {
    position: absolute;
    top: 30px;
    right: 60px;
    width: 18px;
    height: 18px;
    transform-origin: center center;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    cursor: pointer;
}

.menu_close {
    width: 100%;
    height: 100%;
    transform-style: preserve-3D;
}

.menu_close div {
    width: 100%;
    height: 2px;
    background: #232323;
    top: 8px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.menu_close div:last-of-type {
    -webkit-transform: rotate(90deg) translateX(-2px);
    -moz-transform: rotate(90deg) translateX(-2px);
    -ms-transform: rotate(90deg) translateX(-2px);
    -o-transform: rotate(90deg) translateX(-2px);
    transform: rotate(90deg) translateX(-2px);
    transform-origin: center;
}

.menu_close:hover div {
    background: #937c6f;
}

.menu .logo {
    margin-bottom: 60px;
}

.menu_nav ul li {
    margin-bottom: 9px;
}

.menu_nav ul li a {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 1);
    font-weight: 700;
    letter-spacing: 0.1em;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.menu_nav ul li a:hover {
    color: #f26513;
}

.menu .search {
    width: 100%;
    margin-bottom: 67px;
}

.search {
    display: inline-block;
    width: 400px;
    -webkit-transform: translateY(2px);
    -moz-transform: translateY(2px);
    -ms-transform: translateY(2px);
    -o-transform: translateY(2px);
    transform: translateY(2px);
}

.menu .header_search_form {
    width: 100%;
}

.search form {
    position: relative;
}

.menu .search_input {
    width: 100%;
    height: 40px;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    border: none;
    outline: none;
    padding-left: 15px;
    color: rgba(0, 0, 0, 0.5);
}

.menu .search_input::-webkit-input-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: rgba(0, 0, 0, 0.4) !important;
}

.menu .search_input:-moz-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: rgba(0, 0, 0, 0.4) !important;
}

.menu .search_input::-moz-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: rgba(0, 0, 0, 0.4) !important;
}

.menu .search_input:-ms-input-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: rgba(0, 0, 0, 0.4) !important;
}

.menu .search_input::input-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: rgba(0, 0, 0, 0.4) !important;
}

/*********************************
5. Section
*********************************/

.section_title_container {
    max-width: 600px;
    margin: 0 auto;
}

.section_title {
    line-height: 1.2;
}

.section_subtitle {
    line-height: 1.85;
    margin-top: 14px;
}

.section_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*********************************
6. Home
*********************************/

.home {
    width: 100%;
    height: 850px;
    margin-bottom: 0;
    border-bottom: none;
    padding-top: 20px; /* Add padding to create space below navbar */
}

.home_slider_container {
    width: 100%;
    height: 100%;
}

.home_slider {
    width: 100%;
    height: 100%;
}

.home_slider_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.home_slider_background:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.5)); /* Gradient overlay */
    z-index: 1;
}

.home_slider_content {
    position: relative;
    z-index: 2; /* Ensure content is above the overlay */
    padding-top: 300px; /* Add padding to move content down */
}

.home_slider_title {
    font-family: 'Roboto Slab', serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 1.2;
    color: #ffffff;
    text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
    margin-bottom: 15px;
}

.home_slider_subtitle {
    font-size: 22px;
    color: #ffffff;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
    font-weight: 500;
    margin-bottom: 20px;
    letter-spacing: 0.5px;
}

.home_slider_form_container {
    width: 832px;
    margin: 0 auto;
    margin-top: 35px;
}

.home_search_form div {
    width: calc(100% - 140px);
    height: 46px;
    background: #ffffff;
    border-radius: 3px;
}

.home_search_input {
    width: 33.33333333%;
    border: none;
    outline: none;
    height: 25px;
    padding-left: 20px;
}

.home_search_input:not(:last-child) {
    border-right: solid 1px #e5e5e5;
}

.home_search_input::-webkit-input-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.home_search_input:-moz-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.home_search_input::-moz-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.home_search_input:-ms-input-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.home_search_input::input-placeholder {
    font-family: 'Roboto', sans-serif;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.dropdown_item_select {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    background-image: url(../images/down.png);
    background-position: center right;
    background-repeat: no-repeat;
    padding-right: 20px;
    padding-left: 20px;
}

.home_search_button {
    width: 120px;
    height: 46px;
    background: #f26513;
    border: none;
    outline: none;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 500;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
}

.home_slider_nav {
    position: absolute;
    top: 55.8%;
    width: 50px;
    background: #b6b7bd;
    border-radius: 50%;
    text-align: center;
    z-index: 10;
    cursor: pointer;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.home_slider_prev {
    left: 75px;
}

.home_slider_next {
    right: 75px;
}

.home_slider_nav i {
    line-height: 50px;
    color: #ffffff;
    font-size: 22px;
}

.home_slider_nav:hover {
    background: #f26513;
}

.home_slider_container,
.home_slider,
.owl-carousel,
.owl-stage-outer,
.owl-stage,
.owl-item {
    height: 100%;
}

/*********************************
7. Features
*********************************/

.features {
    width: 100%;
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
    padding-top: 93px;
    padding-bottom: 103px;
    position: relative;
    overflow: hidden;
}

.features:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(#f26513 1px, transparent 1px);
    background-size: 30px 30px;
    opacity: 0.08;
    z-index: 0;
}

.features_row {
    margin-top: 55px;
    position: relative;
    z-index: 1;
}

.feature_col {
    margin-bottom: 30px;
    opacity: 0;
    transform: translateY(30px);
    animation: feature_fade_in 0.6s ease forwards;
}

.feature_col:nth-child(1) { animation-delay: 0.1s; }
.feature_col:nth-child(2) { animation-delay: 0.3s; }
.feature_col:nth-child(3) { animation-delay: 0.5s; }
.feature_col:nth-child(4) { animation-delay: 0.7s; }

@keyframes feature_fade_in {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.feature_card {
    width: 100%;
    height: 100%;
    padding: 40px 20px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 330px;
}

.feature_card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(242, 101, 19, 0.15);
}

.feature_card:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg, #f26513, #ff7533);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s ease;
}

.feature_card:hover:before {
    transform: scaleX(1);
}

.feature_icon_container {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: rgba(242, 101, 19, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    transition: all 0.3s ease;
}

.feature_card:hover .feature_icon_container {
    background: rgba(242, 101, 19, 0.2);
    transform: scale(1.1);
}

.feature_icon {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feature_icon img {
    max-width: 100%;
    transition: transform 0.4s ease;
}

.feature_card:hover .feature_icon img {
    transform: scale(1.1);
}

.feature_title {
    position: relative;
    font-size: 22px;
    margin: 15px 0;
    color: #384158;
    font-weight: 700;
}

.feature_text {
    margin-top: 10px;
    line-height: 1.6;
}

.feature_text p {
    color: #656668;
    font-size: 15px;
}

.feature_button {
    margin-top: 20px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease;
}

.feature_card:hover .feature_button {
    opacity: 1;
    transform: translateY(0);
}

.feature_button a {
    display: inline-block;
    padding: 8px 20px;
    background: transparent;
    border: 1px solid #f26513;
    border-radius: 30px;
    color: #f26513;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.feature_button a:hover {
    background: #f26513;
    color: #ffffff;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
    .feature_card {
        min-height: 350px;
    }
}

@media (max-width: 767px) {
    .features {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .feature_col {
        margin-bottom: 25px;
    }

    .feature_card {
        min-height: auto;
        padding: 30px 15px;
    }

    .feature_icon_container {
        width: 70px;
        height: 70px;
    }

    .feature_icon {
        width: 50px;
        height: 50px;
    }

    .feature_title {
        font-size: 20px;
        margin: 10px 0;
    }

    .feature_text p {
        font-size: 14px;
    }

    .feature_button {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Features Section Mobile Optimization */
@media (max-width: 767px) {
  .features {
    padding: 50px 0;
  }

  .section_title {
    font-size: 28px;
  }

  .section_subtitle p {
    font-size: 15px;
    padding: 0 15px;
  }

  .features_row {
    margin-top: 30px;
  }

  .feature_col {
    margin-bottom: 20px;
  }

  .feature_card {
    padding: 25px 15px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    border-left: 4px solid #f26513;
    display: flex;
    flex-direction: row;
    align-items: center;
    text-align: left;
    min-height: auto;
  }

  .feature_icon_container {
    width: 60px;
    height: 60px;
    margin: 0 15px 0 0;
    flex-shrink: 0;
  }

  .feature_icon {
    width: 40px;
    height: 40px;
  }

  .feature_content_mobile {
    flex: 1;
  }

  .feature_title {
    font-size: 18px;
    margin: 0 0 5px 0;
  }

  .feature_text p {
    font-size: 14px;
    margin-bottom: 0;
    line-height: 1.4;
  }
}

/* Extra small devices */
@media (max-width: 480px) {
  .feature_card {
    flex-direction: column;
    text-align: center;
    padding: 20px 18px;
  }

  .feature_icon_container {
    margin: 0 0 12px 0;
  }

  .feature_title {
    font-size: 17px;
  }
  /* Remove top border animation on small screens */
  .feature_card:before {
    display: none; /* Hide the animated top border completely */
  }

  /* Use a static border instead for better visual definition */
  .feature_card {
    border-top: 3px solid #f26513;
    border-left: none;
  }

  /* Remove hover transform to prevent layout issues on small screens */
  .feature_card:hover {
    transform: none;
  }
}


/*********************************
8. Courses
*********************************/

.courses {
  width: 100%;
  padding: 93px 0 100px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
}

.courses:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(#f26513 1px, transparent 1px);
  background-size: 30px 30px;
  opacity: 0.05;
  z-index: 0;
}

.section_background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  opacity: 0.1;
}

.courses .container {
  position: relative;
  z-index: 1;
}

.courses_row {
  margin-top: 55px;
}

/* Course card animations */
.course_col {
  margin-bottom: 30px;
  opacity: 0;
  transform: translateY(30px);
  animation: course_fade_in 0.7s ease forwards;
}

.course_col:nth-child(1) { animation-delay: 0.1s; }
.course_col:nth-child(2) { animation-delay: 0.3s; }
.course_col:nth-child(3) { animation-delay: 0.5s; }

@keyframes course_fade_in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Enhanced course card styling */
.course {
  width: 100%;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06);
  transition: all 0.4s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
}

.course:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 35px rgba(242, 101, 19, 0.15);
}

/* Top border animation */
.course:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(90deg, #f26513, #ff7533);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.5s ease;
  z-index: 1;
}

.course:hover:before {
  transform: scaleX(1);
  transform-origin: left;
}

/* Image enhancements */
.course_image {
  width: 100%;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  overflow: hidden;
  position: relative;
}

.course_image:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(242, 101, 19, 0);
  transition: all 0.4s ease;
}

.course:hover .course_image:after {
  background: rgba(242, 101, 19, 0.1);
}

.course_image img {
  max-width: 100%;
  transition: transform 0.8s ease;
  display: block;
  width: 100%;
}

.course:hover .course_image img {
  transform: scale(1.05);
}

/* Course content styling */
.course_body {
  padding: 25px 30px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.course_title {
  margin-bottom: 8px;
}

.course_title a {
  font-family: 'Roboto Slab', serif;
  font-size: 22px;
  font-weight: 700;
  color: #384158;
  line-height: 1.3;
  transition: all 0.3s ease;
}

.course_title a:hover {
  color: #f26513;
}

.course_teacher {
  font-size: 16px;
  font-weight: 500;
  color: #384158;
  margin-top: 6px;
  display: flex;
  align-items: center;
}

.course_teacher:before {
  content: "\f19d"; /* FontAwesome graduation cap */
  font-family: FontAwesome;
  margin-right: 8px;
  color: #f26513;
  font-size: 14px;
}

.course_text {
  margin-top: 15px;
  flex: 1;
}

.course_text p {
  color: #656668;
  font-size: 15px;
  line-height: 1.6;
}

/* Course footer enhancements */
.course_footer {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  padding: 15px 30px;
  background: #f9f9fa;
}

.course_footer_content {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.course_info {
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
  color: #656668;
  transition: all 0.3s ease;
}

.course_info:hover {
  color: #f26513;
}

.course_info i {
  color: #f26513;
  margin-right: 6px;
  font-size: 16px;
}

.course_info a {
  color: inherit;
  transition: all 0.3s ease;
}

.course_info a:hover {
  color: #f26513;
}

.course_info:first-child {
  margin-right: 18px;
}

/* View all courses button enhancement */
.courses_button {
  width: 220px;
  height: 54px;
  border-radius: 30px;
  background: #f26513;
  text-align: center;
  margin: 50px auto 0;
  box-shadow: 0px 8px 20px rgba(242, 101, 19, 0.3);
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
  z-index: 1;
}

.courses_button:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #f26513, #ff7533);
  z-index: -1;
  transition: all 0.6s ease;
  transform: translateX(-100%);
}

.courses_button:hover {
  box-shadow: 0px 10px 30px rgba(242, 101, 19, 0.5);
  transform: translateY(-3px);
}

.courses_button:hover:before {
  transform: translateX(0);
}

.courses_button a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #ffffff;
}

.courses_button a:after {
  content: "\f105"; /* FontAwesome arrow */
  font-family: FontAwesome;
  margin-left: 8px;
  font-size: 18px;
  transition: transform 0.3s ease;
}

.courses_button:hover a:after {
  transform: translateX(4px);
}

/* Mobile Optimizations */
@media (max-width: 991px) {
  .course_col {
    margin-bottom: 30px;
  }

  .course_body {
    padding: 22px 25px;
  }

  .course_title a {
    font-size: 20px;
  }

  .course_footer {
    padding: 12px 25px;
  }
}

@media (max-width: 767px) {
  .courses {
    padding: 60px 0 70px;
  }

  .courses_row {
    margin-top: 35px;
  }

  .course_col {
    margin-bottom: 25px;
  }

  .course {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
  }

  .course:hover {
    transform: translateY(-5px);
  }

  .course_body {
    padding: 20px 22px;
  }

  .course_title a {
    font-size: 19px;
  }

  .course_teacher {
    font-size: 15px;
  }

  .course_text p {
    font-size: 14px;
  }

  .course_footer {
    padding: 12px 22px;
  }

  .course_info {
    font-size: 13px;
  }

  .courses_button {
    width: 200px;
    height: 50px;
    margin-top: 35px;
  }

  .courses_button a {
    font-size: 15px;
  }
}

@media (max-width: 480px) {
  .courses {
    padding: 50px 0 60px;
  }

  .course {
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  }

  .course:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(242, 101, 19, 0.1);
  }

  /* Remove top border animation on smallest screens for better performance */
  .course:before {
    display: none;
  }

  /* Use a static border instead */
  .course {
    border-top: 3px solid #f26513;
  }

  .course_body {
    padding: 18px 20px;
  }

  .course_title a {
    font-size: 18px;
  }

  .course_teacher {
    font-size: 14px;
  }

  .course_teacher:before {
    font-size: 12px;
  }

  .course_text {
    margin-top: 12px;
  }

  .course_text p {
    font-size: 14px;
    line-height: 1.5;
  }

  .course_footer {
    padding: 10px 20px;
  }

  .course_info {
    font-size: 12px;
  }

  .course_info i {
    font-size: 14px;
  }

  .courses_button {
    width: 180px;
    height: 46px;
    margin-top: 30px;
  }

  .courses_button a {
    font-size: 14px;
  }

  /* Remove hover animations on mobile for better performance */
  .course:hover .course_image img {
    transform: none;
  }

  .course:hover .course_image:after {
    background: transparent;
  }
}

/*********************************
9. Counter
*********************************/

.counter {
    width: 100%;
    background: #ffffff;
    z-index: 2;
}

.counter_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.counter_content {
    padding-top: 119px;
    padding-bottom: 125px;
}

.counter_title {
    font-family: 'Roboto Slab', serif;
    color: #ffffff;
    font-weight: 700;
}

.counter_text {
    margin-top: 19px;
}

.counter_text p {
    color: #ffffff;
}

.milestones {
    margin-top: 39px;
}

.milestone {
    text-align: center;
}

.milestone:not(:last-child)::after {
    display: block;
    position: absolute;
    top: 0;
    right: -45px;
    width: 1px;
    height: 70px;
    background: rgba(255, 255, 255, 0.2);
    content: '';
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);

}

.milestone_counter {
    font-size: 42px;
    font-weight: 700;
    line-height: 0.75;
    color: #f26513;
}

.milestone_text {
    font-size: 16px;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    margin-top: 14px;
}

.counter_form {
    position: absolute;
    top: 0;
    right: 30px;
    width: 380px;
    height: 100%;
    background: #ffffff;
    padding: 5px 40px;
    box-shadow: 0px 5px 40px rgba(29, 34, 47, 0.15);
}

.counter_form_content {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
}

.counter_form_title {
    font-family: 'Roboto Slab', serif;
    font-size: 24px;
    font-weight: 700;
    color: #384158;
    text-transform: uppercase;
    line-height: 0.75;
    margin-top: 10px;
    margin-bottom: 20px;
}

.counter_input {
    width: 100%;
    height: 46px;
    border: solid 1px #e5e5e5;
    border-radius: 3px;
    padding-left: 20px;
    padding-top: 7px;
    padding-bottom: 7px;
    outline: none;
    color: #384158;
    font-size: 14px;
}

.counter_input:not(:last-child) {
    margin-bottom: 10px;
}

.counter_text_input {
    height: 90px;
    padding-top: 10px;
}

.counter_options {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    background-image: url(../images/down.png);
    background-position: center right;
    background-repeat: no-repeat;
}

.counter_input::-webkit-input-placeholder,
.counter_text_input::-webkit-input-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.counter_input:-moz-placeholder,
.counter_text_input:-moz-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.counter_input::-moz-placeholder,
.counter_text_input::-moz-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.counter_input:-ms-input-placeholder,
.counter_text_input:-ms-input-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.counter_input::input-placeholder,
.counter_text_input::input-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #b5b8be !important;
}

.counter_form_button {
    width: 100%;
    height: 46px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    border: none;
    outline: none;
    background: #f26513;
    cursor: pointer;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px 0;
    box-shadow: 0 5px 40px rgba(29, 34, 47, 0.15);
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.counter_form_button:hover {
    box-shadow: 0px 5px 40px rgba(29, 34, 47, 0.45);
    /*background-color: #6bc2f9;*/
    background-color: #db5246;
}


/* Optional: Customize the transition for smooth border change */


.confirmation {
    margin-top: 20px;
    padding: 15px;
    border: 1px solid #28a745;
    background-color: #d4edda;
    color: #155724;
    border-radius: 5px;
    font-size: 16px;
    text-align: center;
}

.hidden {
    display: none;
}

.error {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
    border-radius: 5px;
    text-align: center;
}

/* General styles for all input fields */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
    width: 100%; /* Make all fields stretch to the container's width */
    height: 40px; /* Set a consistent height */
    box-sizing: border-box; /* Include padding and borders in calculations */
    padding: 8px 10px; /* Equal padding for all fields for consistency */
    font-size: 16px; /* Consistent font size for all fields */
    border: 1px solid #cccccc; /* Standard border for all inputs */
    border-radius: 4px; /* Optional: Rounded corners for inputs */
    margin: 0;
}

/* Styling for inputs grouped in a row (e.g., phone number with country code) */
.phone-input {
    display: flex;
    gap: 10px; /* Space between country code and phone number inputs */
    width: 100%; /* Ensure the row matches the width of other fields */
    /* Align the row precisely with other form fields */
    box-sizing: border-box; /* Include padding/borders in layout calculations */
    margin: 0 0 10px;
}

/* Country code and phone number inputs inside the row */
/*.phone-input input {*/
/*    height: 40px; !* Match the height of other fields *!*/
/*    padding: 8px 10px;*/
/*    box-sizing: border-box;*/
/*    font-size: 16px;*/
/*}*/

/* Optional: Adjust width proportions for country-code and phone-number fields */
input.country-code {
    flex: 0.3; /* Allocate 30% of the row to the country code */
    height: 40px; /* Match the height of other inputs */
    padding: 8px 10px; /* Consistent padding */
    box-sizing: border-box; /* Include padding/borders */
}

input.phone-number {
    flex: 0.7; /* Allocate 70% of the row to the phone number */
    height: 40px; /* Match the height of other inputs */
    padding: 8px 10px; /* Consistent padding */
    box-sizing: border-box; /* Include padding/borders */
}

select option {
    background-color: white; /* Default background color for options */
    color: black; /* Default text color */
}

/* Focus on select: Change background of selected dropdown element */
select:focus {
    outline: none; /* Optional: Remove default blue border */
    border-color: #f26513; /* Highlight the border of the focused select */
    box-shadow: 0 0 4px #f26513; /* Optional: Add subtle shadow */
}

/* On hover or focus for the options */
select option:focus,
select option:hover {
    background-color: #f26513; /* Background color for focused/hovered option */
    color: #ffffff; /* Text color to maintain readability */
}

input, textarea, select {
    transition: border-color 0.3s ease-in-out;
}

/* Style the border of the active form field */
input:focus, textarea:focus, select:focus {
    border: 2px solid #f26513; /* Change border color to #f26513 */
    outline: none; /* Optional: Remove the default outline for better styling */
}

/*********************************
10. Events
*********************************/

.events {
    width: 100%;
    padding-top: 93px;
    padding-bottom: 70px;
    background: #ffffff;
}

.events_row {
    margin-top: 47px;
}

.event_left {
    padding-right: 20px;
}

.event_mid {
    padding-left: 10px;
    padding-right: 10px;
}

.event_right {
    padding-left: 20px;
}

.event_image {
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
}

.event_image img {
    max-width: 100%;
}

.event_body {
    padding-top: 30px;
    padding-bottom: 30px;
}

.event_date {
    box-shadow: 0 1px 10px rgba(29, 34, 47, 0.1);
}

.event_date > div {
    width: 60px;
    height: 60px;
}

.event_day {
    font-family: 'Roboto Slab', serif;
    font-size: 24px;
    color: #f26513;
    font-weight: 700;
    line-height: 0.75;
}

.event_month {
    font-family: 'Roboto Slab', serif;
    font-size: 14px;
    color: #f26513;
    font-weight: 400;
    line-height: 0.75;
    margin-top: 9px;
}

.event:hover .event_date > div {
    background: #f26513;
}

.event:hover .event_day,
.event:hover .event_month {
    color: #ffffff;
}

.event_content {
    padding-left: 20px;
}

.event_title a {
    font-family: 'Roboto Slab', serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
    color: #384158;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.event_title a:hover {
    color: #f26513;
}

.event_info_container {
    margin-top: 11px;
}

.event_info {
    display: inline-block;
    color: #b5b8be;
    font-size: 14px;
}

.event_info:not(:last-child) {
    margin-right: 17px;
}

.event_info span {
    margin-left: 4px;
}

.event_text {
    margin-top: 12px;
}

/*********************************
11. Team
*********************************/

.team {
    width: 100%;
    padding-top: 93px;
    padding-bottom: 60px;
}

.team_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.team_row {
    margin-top: 43px;
}

.team_col {
    margin-bottom: 40px;
}

.team_item {
    width: 100%;
}

.team_image {
    width: 180px;
    height: 160px;
    border-radius: 6px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -86px;
    z-index: 5;
}

.team_image img {
    max-width: 100%;
}

.team_body {
    width: 100%;
    padding-top: 108px;
    padding-bottom: 24px;
    background: #ffffff;
    border-radius: 6px;
    box-shadow: 0 1px 10px rgba(29, 34, 47, 0.1);
    text-align: center;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.team_item:hover .team_body {
    box-shadow: 0 5px 40px rgba(29, 34, 47, 0.15);
}

.team_title a {
    font-family: 'Roboto Slab', serif;
    font-size: 20px;
    font-weight: 700;
    color: #384158;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.team_title a:hover {
    color: #f26513;
}

.team_subtitle {
    font-size: 14px;
    font-weight: 400;
    color: #76777a;
    margin-top: 6px;
}

.social_list {
    margin-top: 16px;
}

.social_list ul li {
    display: inline-block;
}

.social_list ul li:not(:last-child) {
    margin-right: 10px;
}

.social_list ul li a i {
    font-size: 18px;
    color: #76777a;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.social_list ul li:hover a i {
    color: #f26513;
}

.team_col .team_item {
    padding-left: 6px;
    padding-right: 6px;
}

.team_col:first-child .team_item {
    padding-left: 0;
    padding-right: 6px;
}

.team_col:nth-child(4n) .team_item {
    padding-left: 6px;
    padding-right: 0;
}

/*********************************
12. News
*********************************/

.news {
    width: 100%;
    padding-top: 93px;
    padding-bottom: 100px;
    background: #ffffff;
}

.news_row {
    margin-top: 55px;
}

.news_post_large_container {
    padding-right: 30px;
}

.news_post_large {
    width: 100%;
}

.news_post_image {
    width: 100%;
    border-radius: 6px;
    overflow: hidden;
}

.news_post_image img {
    max-width: 100%;
}

.news_post_large_title {
    margin-top: 23px;
}

.news_post_large_title a {
    font-family: 'Roboto Slab', serif;
    font-size: 20px;
    font-weight: 700;
    color: #384158;
    line-height: 1.4;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.news_post_large_title a:hover {
    color: #f26513;
}

.news_post_meta {
    margin-top: 11px;
}

.news_post_meta ul li {
    display: inline-block;
    position: relative;
}

.news_post_meta ul li:not(:last-of-type)::after {
    display: inline-block;
    position: relative;
    content: '|';
    margin-left: 14px;
    margin-right: 11px;
}

.news_post_meta ul li a {
    font-size: 14px;
    font-weight: 400;
    color: #b5b8be;
    text-transform: uppercase;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.news_post_meta ul li a:hover {
    color: #f26513;
}

.news_post_text {
    margin-top: 13px;
}

.news_post_link {
    margin-top: 19px;
}

.news_post_link a {
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    color: #384158;
    text-decoration: underline;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.news_post_link a:hover {
    color: #f26513;
}

.news_posts_small {
    margin-top: -6px;
}

.news_post_small:not(:last-child) {
    padding-bottom: 31px;
    border-bottom: solid 1px #e5e5e5;
}

.news_post_small:not(:first-child) {
    padding-top: 29px;
}

.news_post_small_title a {
    font-family: 'Roboto Slab', serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.55;
    color: #384158;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.news_post_small_title a:hover {
    color: #f26513;
}

/*********************************
13. Newsletter
*********************************/

.newsletter {
    width: 100%;
}

.newsletter_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.newsletter_container {
    width: 100%;
    height: 120px;
}

.newsletter_title {
    font-family: 'Roboto Slab', serif;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff;
}

.newsletter_subtitle {
    font-size: 14px;
    font-weight: 400;
    color: #ffffff;
    margin-top: 6px;
}

.newsletter_form_container {
    width: 450px;
    padding-left: 20px;
}

.newsletter_form {
    display: block;
    position: relative;
    width: 100%;
}

.newsletter_input {
    width: calc(100% - 136px);
    height: 40px;
    background: rgba(255, 255, 255, 0.4);
    border: none;
    outline: none;
    padding-left: 20px;
    color: #ffffff;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.newsletter_input::-webkit-input-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #ffffff !important;
}

.newsletter_input:-moz-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #ffffff !important;
}

.newsletter_input::-moz-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #ffffff !important;
}

.newsletter_input:-ms-input-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #ffffff !important;
}

.newsletter_input::input-placeholder {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #ffffff !important;
}

.newsletter_button {
    width: 136px;
    height: 40px;
    background: #ffffff;
    border-radius: 3px;
    border: none;
    outline: none;
    cursor: pointer;
    font-size: 14px;
    text-transform: uppercase;
    color: #f26513;
    font-weight: 500;
    letter-spacing: 0.1em;
}

/*********************************
14. Footer
*********************************/

.footer {
    display: block;
    position: relative;
    width: 100%;
    background: #1e2434;
    padding-top: 94px;
}

.footer_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.footer_content {
    padding-bottom: 53px;
}

.footer_logo_text {
    font-family: 'Roboto Slab', serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 0.75;
    color: #ffffff;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.footer_logo_text span {
    color: #f26513;
}

.footer_title {
    font-family: 'Roboto Slab', serif;
    font-size: 18px;
    font-weight: 700;
    color: #ffffff;
    line-height: 0.75;
}

.footer_logo_container {
    margin-top: -14px;
}

.footer_about_text {
    margin-top: 31px;
}

.footer_about_text p {
    color: #ffffff;
}

.footer_social {
    margin-top: 23px;
}

.footer_social ul li {
    display: inline-block;
    width: 45px;
    height: 45px;
    background: #4b505d;
    border-radius: 50%;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.footer_social ul li:not(:last-child) {
    margin-right: 6px;
}

.footer_social ul li a {
    display: block;
    position: relative;
    text-align: center;
}

.footer_social ul li a i {
    color: #ffffff;
    line-height: 45px;
}

.footer_social ul li:hover {
    background: #f26513;
}

.footer_contact {
    padding-left: 36px;
}

.footer_contact_info {
    margin-top: 33px;
}

.footer_contact_info ul li {
    font-size: 14px;
    font-weight: 400;
    color: #b5b8be;
}

.footer_contact_info ul li:not(:last-child) {
    margin-bottom: 15px;
}

.footer_links {
    padding-left: 80px;
}

.footer_links_container ul {
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
}

.footer_links_container {
    margin-top: 33px;
}

.footer_links_container ul li a {
    font-size: 14px;
    color: #b5b8be;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.footer_links_container ul li:not(:last-child) {
    margin-bottom: 15px;
}

.footer_links_container ul li a:hover {
    color: #f26513;
}

.footer_mobile {
    display: inline-block;
    float: right;
}

.footer_mobile_content {
    padding-top: 35px;
}

.footer_image:not(:last-child) {
    margin-bottom: 10px;
}

.copyright {
    height: 54px;
    border-top: solid 1px #353a49;
}

.cr_list li {
    display: inline-block;
}

.copyright div {
    font-size: 14px;
    color: #b5b8be;
}

.cr_text a {
    color: #ffffff;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.cr_text a:hover {
    color: #f26513;
}

.cr_list li:not(:last-child) {
    margin-right: 50px;
}

.cr_list li a {
    font-size: 14px;
    color: #b5b8be;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.cr_list li a:hover {
    color: #f26513;
}

.faq_section {
    padding: 60px 0;
}

.faq_title {
    text-align: center;
    margin-bottom: 40px;
    font-size: 32px;
    font-weight: 700;
}

.card {
    margin-bottom: 15px;
}

.card-header {
    background-color: #f8f9fa;
}

.card-header .btn {
    width: 100%;
    text-align: left;
    font-size: 18px;
    font-weight: 500;
    color: #333333;
}

.card-header .btn:hover {
    color: #f26513;
}

.card-body {
    font-size: 16px;
    color: #656668;
}


/* Testimonial section */
.testimonial_section {
    padding: 50px 0;
    background-color: #f9f9f9;
}

.testimonial_title {
    text-align: center;
    margin-bottom: 30px;
    font-size: 2em;
    color: #333333;
}

.owl-carousel .testimonial_card {
    background: #ffffff;
    margin-top: 30px;
    margin-bottom: 30px; /* Add bottom margin for spacing */
    padding: 25px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: center;
    position: relative; /* Ensure proper containment for quote icon */
}

.owl-carousel {
    padding-bottom: 20px; /* Add padding to the carousel container */
    margin-bottom: 20px; /* Add margin between carousel and navigation buttons */
}

/* Ensure the quote icon doesn't disrupt layout */
.quote_icon {
    position: absolute;
    top: 1px;
    left: 6px;
    font-size: 3em;
    color: #6bc2f9;
    font-family: fantasy;
    z-index: 1; /* Keep it above the content but don't let it affect layout */
}

.testimonial_text {
    font-size: 1em;
    color: #656668;
    margin-bottom: 15px;
}

.testimonial_author {
    font-size: 1em;
    color: #888888;
}

.custom-nav {
    text-align: center;
    margin-top: 20px;
}

.custom-nav button {
    background-color: #f26513;
    color: #ffffff;
    border: none;
    padding: 5px 10px;
    margin: 0 5px;
    cursor: pointer;
    border-radius: 5px;
    transition: background-color 0.3s;
}

.custom-nav button:hover {
    /*background-color: #6bc2f9;*/
    background-color: #db5246;
}

.quote_icon {
    position: absolute;
    top: 1px;
    left: 6px;
    font-size: 3em;
    color: #6bc2f9;
    font-family: fantasy;
}



/********************************
15. GCSE Page Styling
*********************************/

/* General styles for sections */
#curriculum-description,
#grading-details,
#subject-navigation,
#subject-topics,
#assessment-details {
    padding: 30px 20px;
    margin-bottom: 30px;
    background: #f9f9f9; /* Light background for contrast */
    border-radius: 10px; /* Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
}

/* Styling headings in sections */
section h2 {
    font-size: 28px;
    color: #f26513; /* Consistent with theme's primary color */
    text-align: center;
    margin-bottom: 20px;
}

/* Paragraph styling inside each section */
section p {
    font-size: 16px;
    line-height: 1.8;
    text-align: justify;
    color: #555555;
}

/* Subject navigation styling */
#subject-navigation ul.nav {
    justify-content: center;
    background: #ffffff;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

#subject-navigation ul.nav li.nav-item {
    margin: 0 10px;
}

#subject-navigation ul.nav a.nav-link {
    font-size: 16px;
    font-weight: 500;
    color: #656668;
    border: 1px solid #eeeeee;
    padding: 10px 20px;
    border-radius: 20px;
    transition: all 0.3s ease;
}

#subject-navigation ul.nav a.nav-link.active,
#subject-navigation ul.nav a.nav-link:hover {
    background: #f26513;
    color: #ffffff;
    border-color: #f26513;
}

/* Topic list styling */
#subject-topics ul {
    list-style: none;
    padding: 10px 20px;
}

#subject-topics ul li {
    font-size: 16px;
    margin-bottom: 10px;
    padding: 10px 15px;
    background: #ffffff;
    border-radius: 8px;
    border: 1px solid #dddddd;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s, box-shadow 0.2s;
}

#subject-topics ul li:hover {
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(-3px);
}

/* Assessment section */
#assessment-details p {
    font-size: 16px;
    line-height: 1.8;
    text-align: justify;
    color: #555555;
}

#assessment-details {
    border-left: 5px solid #f26513;
    padding-left: 15px;
    background: #f9f9f9;
}

/* Responsive Design */
@media only screen and (max-width: 768px) {
    /* Ensure sections stack properly on smaller screens */
    #curriculum-description,
    #grading-details,
    #subject-navigation,
    #subject-topics,
    #assessment-details {
        padding: 20px 15px;
        margin-bottom: 20px;
    }

    #subject-navigation ul.nav a.nav-link {
        font-size: 14px;
        padding: 8px 15px;
    }

    section h2 {
        font-size: 24px;
    }

    #subject-topics ul li {
        padding: 8px 12px;
        font-size: 14px;
    }
}

/********************************
GCSE Custom Styling to Avoid Conflicts
*********************************/

/* General Container */
.curriculum-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    margin-top: 150px;
}

/* Hide initially */
.subject-nav-list-item {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

/* Hero Section */
#gcse-hero-section {
    padding: 50px 20px;
    background: linear-gradient(135deg, #f26513, #ff8000);
    color: #ffffff;
    text-align: center;
    border-radius: 10px;
    margin-bottom: 40px;
}

#gcse-hero-section h1 {
    font-size: 36px;
    font-weight: bold;
    margin-bottom: 20px;
}

#gcse-hero-section p {
    font-size: 18px;
}

/* Shared Section Styling */
.selected-curriculum-section {
    background: #ffffff;
    padding: 30px;
    margin-bottom: 30px;
    border-radius: 12px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
}

.selected-curriculum-section h2 {
    font-family: Roboto Slab, serif;
    font-size: 28px;
    color: #333333;
    text-align: center;
    border-bottom: 2px solid #f26513;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

/* Lists */
.grading-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.grading-list li {
    margin-bottom: 10px;
    padding: 10px 15px;
    background: #f8f9fb;
    border-radius: 10px;
}

/* Nav Styles */
.curriculum-subject-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-top: 20px;
}

.subject-nav-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
}

.subject-nav-link {
    color: #555555;
    border: 2px solid #f26513;
    padding: 10px 20px;
    border-radius: 30px;
}

.subject-nav-link:hover,
.subject-active {
    background: #f26513;
    color: #ffffff;
}

/* Highlight */
.subject-highlight {
    border-left: 5px solid #f26513;
    background: #f8f9fb;
}

.subject-nav-list-item a {
    display: block;
    padding: 10px 15px;
    font-size: 1rem;
    color: #384158;
    background: #f9f9f9;
    border: 1px solid #dddddd;
    border-radius: 5px;
    text-align: center;
    transition: transform 0.2s ease, background-color 0.4s;
    position: relative;
    overflow: hidden;
}

.subject-nav-list-item a:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);
    background-color: #f26513;;
    color: #ffffff;
}


.subject-active {
    background-color: #f26513 !important; /* Highlight active subject */
    color: white !important; /* Make the text white */
    font-weight: bold;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2); /* Add slight shadow for effect */
}

.subject-active:hover {
    background-color: #d85410; /* Slightly darker tone on hover */
}

/* Additional Animation: Pulse Effect on Hover */
.subject-nav-list-item a:hover::before {
    content: "";
    position: absolute;
    width: 200%;
    height: 200%;
    top: -50%;
    left: -50%;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    z-index: 1;
    animation: pulse 0.8s ease-out infinite;
}

/* Keyframe for Pulse Effect */
@keyframes pulse {
    0% {
        transform: scale(0);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

/* Style for categories navigation to match subject navigation */
#categories-nav {
    background: #ffffff;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

#categories-nav ul.categories-nav-list {
    display: flex;
    justify-content: center;
    gap: 10px;
}

#categories-nav ul.categories-nav-list li {
    list-style: none;
}

#categories-nav ul.categories-nav-list a {
    font-size: 16px;
    font-weight: 500;
    color: #656668;
    border: 1px solid #eeeeee;
    padding: 10px 20px;
    border-radius: 20px;
    text-align: center;
    display: inline-block;
    transition: all 0.3s ease;
}

#categories-nav ul.categories-nav-list a:hover,
#categories-nav ul.categories-nav-list a.category-active {
    background: #f26513;
    color: #ffffff;
    border-color: #f26513;
    text-decoration: none;
}

.curriculum-title {
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 20px;
    margin-top: 40px;
}

.navbar {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10;
}

body {
    margin-top: 80px; /* Matches the height of the fixed navbar */
}

.hero_buttons_container {
    display: flex;
    justify-content: center;
    gap: 30px; /* Spacing between buttons */
    margin-top: 40px; /* Positive margin to create space after slider */
    margin-bottom: 60px; /* Add space before the features section */
    position: relative;
    z-index: 1;
}

.hero_button {
    display: inline-block;
    padding: 16px 35px;
    font-family: 'Roboto Slab', serif;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff;
    border: none;
    border-radius: 50px; /* More rounded corners */
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in-out;
    text-align: center;
    letter-spacing: 1px;
    min-width: 220px; /* Ensure consistent button width */
}

.student_button {
    background: linear-gradient(135deg, #f26513, #ff7533); /* Gradient background */
}

.teacher_button {
    background: linear-gradient(135deg, #0056b3, #0076ff); /* Gradient background */
}

.hero_button:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.2);
}

/* Main Footer Styling */
/* Main Footer Styling */
.custom-footer {
    background: linear-gradient(to top, #0d0d0d, #1a1a1a
    ); /* Gradient background */
    color: #f8f9fa; /* Light text color */
    padding: 50px 0;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 15px;
}

.custom-footer .footer-logo {
    max-height: 70px;
    animation: fadeIn 2s ease;
}

.custom-footer .footer-logo-section .footer-tagline {
    font-style: italic;
    color: #f26513;
    font-size: 16px;
    margin-bottom: 20px;
    letter-spacing: 0.5px;
}

.custom-footer .footer-logo-section .footer-contact {
    font-size: 15px;
    color: #cccccc;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
}

.custom-footer .footer-logo-section .footer-contact i {
    color: #f26513; /* Accent color */
    margin-right: 10px;
}

.custom-footer .footer-links-section .footer-heading,
.custom-footer .footer-social-section .footer-heading {
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1px;
    color: #ffffff;
    text-transform: uppercase;
    margin-bottom: 20px;
    border-bottom: 2px solid #f26513;
    display: inline-block;
    padding-bottom: 5px;
}

.custom-footer .footer-links-section .footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
    animation: slideIn 1.5s ease;
}

.custom-footer .footer-links-section .footer-links li {
    margin-bottom: 10px;
}

.custom-footer .footer-links-section .footer-links li a {
    color: #cccccc;
    text-decoration: none;
    transition: color 0.3s ease, transform 0.3s ease;
}

.custom-footer .footer-links-section .footer-links li a:hover {
    color: #f26513;
    transform: translateX(5px); /* Stylish hover effect */
    background-color: transparent;
}

.custom-footer .footer-social-section .footer-social-links {
    list-style: none;
    padding: 0;
    display: flex;
    gap: 20px;
    justify-content: flex-start;
}

.custom-footer .footer-social-section .footer-social-links li a {
    color: #ffffff;
    font-size: 20px;
    transition: transform 0.3s ease, color 0.4s ease;
}

.custom-footer .footer-social-section .footer-social-links li a:hover {
    color: #f26513;
    transform: scale(1.2); /* Enlarge the icon slightly */
}

.custom-footer .footer-social-section .footer-note {
    color: #aaaaaa;
    font-size: 15px;
    margin-top: 15px;
}

.custom-footer .footer-divider {
    border-color: rgba(255, 255, 255, 0.1);
    margin: 20px 0;
}

.custom-footer .footer-copyright {
    color: #bbbbbb;
    font-size: 14px;
}

/* Responsive Adjustments */
@media screen and (max-width: 576px) {
    .custom-footer .footer-links-section,
    .custom-footer .footer-social-section,
    .custom-footer .footer-logo-section {
        text-align: center;
    }

    .custom-footer .footer-social-section .footer-social-links {
        justify-content: center;
    }
}

/* Keyframes for Animation */
@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideIn {
    0% {
        opacity: 0;
        transform: translateX(-20px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Add after the existing footer contact styles */

.custom-footer .footer-logo-section .footer-contact a {
    color: #cccccc;
    text-decoration: none;
    transition: color 0.3s ease, transform 0.3s ease;
    display: inline-block; /* Required for transform to work */
}

.custom-footer .footer-logo-section .footer-contact a:hover {
    color: #f26513;
    transform: translateX(5px); /* Keep the sliding effect */
    background-color: transparent; /* Ensure no background highlight appears */
}

/* Restore the hover transform effect for footer quick links */
.custom-footer .footer-links-section .footer-links li a:hover {
    color: #f26513;
    transform: translateX(5px); /* Restore the sliding effect */
    background-color: transparent;
}

/* Fix for both footer contact links and quick links */
.custom-footer .footer-logo-section .footer-contact a {
    color: #cccccc;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease; /* Ensure transition is properly set */
}

.custom-footer .footer-logo-section .footer-contact a:hover {
    color: #f26513;
    transform: translateX(5px);
    background-color: transparent;
}

/* Make sure the quick links animation works too */
.custom-footer .footer-links-section .footer-links li a {
    color: #cccccc;
    text-decoration: none;
    display: inline-block; /* Required for transform to work */
    transition: all 0.3s ease; /* Consistent transition */
}

.custom-footer .footer-links-section .footer-links li a:hover {
    color: #f26513;
    transform: translateX(5px);
    background-color: transparent;
}

/* Center footer contacts and increase gap on mobile view */
@media screen and (max-width: 576px) {
    .custom-footer .footer-logo-section {
        text-align: center; /* Center align the content */
        margin-bottom: 30px; /* Increase the gap between footer contacts and Quick Links */
    }

    .custom-footer .footer-logo-section .footer-contact {
        justify-content: center; /* Center the contact items */
        display: flex; /* Use flexbox for alignment */
        gap: 10px; /* Add spacing between contact items */
    }
}

/* Consolidated Media Queries */

@media (max-width: 768px) {
    .home {
        height: 600px; /* Reduced height for mobile */
    }

    .home_slider_content {
        padding-top: 50px; /* Less padding on mobile */
    }

    .home_slider_title {
        font-size: 18px; /* Smaller font size */
        padding: 0 5px; /* Add padding on sides */
        margin-bottom: 8px; /* Reduce bottom margin */
        line-height: 1.2; /* Tighten line height */
    }

    .home_slider_subtitle {
        font-size: 16px; /* Make subtitle smaller */
        padding: 0 10px; /* Add padding on sides */
        margin-bottom: 10px; /* Reduce bottom margin */
    }

    .owl_button {
        width: 180px;
        height: 45px;
        margin-top: 15px; /* Reduce top margin of button */
    }

    .owl_button a {
        font-size: 16px;
        line-height: 45px;
    }

    .hero_buttons_container {
        flex-direction: column; /* Stack buttons vertically */
        gap: 15px;
        margin-top: 30px;
        align-items: center;
    }

    .hero_button {
        width: 80%; /* Make buttons wider on mobile */
        padding: 14px 20px;
    }

    .home_slider_nav {
        display: none; /* Hide slider navigation on mobile */
    }

    #curriculum-description,
    #grading-details,
    #subject-navigation,
    #subject-topics,
    #assessment-details {
        padding: 20px 15px;
        margin-bottom: 20px;
    }

    #subject-navigation ul.nav a.nav-link {
        font-size: 14px;
        padding: 8px 15px;
    }

    section h2 {
        font-size: 24px;
    }

    #subject-topics ul li {
        padding: 8px 12px;
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .home {
        height: 550px; /* Further reduce height for very small screens */
    }

    .home_slider_content {
        padding-top: 30px; /* Even less padding on very small screens */
    }

    .home_slider_title {
        font-size: 18px; /* Even smaller title */
        line-height: 1.1;
        margin-bottom: 5px;
    }

    .home_slider_subtitle {
        font-size: 16px; /* Smaller subtitle */
        margin-bottom: 8px;
    }

    .owl_button {
        width: 160px; /* Slightly smaller button */
        height: 40px; /* Slightly shorter button */
        margin-top: 10px; /* Less margin */
    }

    .owl_button a {
        font-size: 14px; /* Smaller button text */
        line-height: 40px; /* Adjust line height to match button height */
    }
}

@media screen and (max-width: 576px) {
    .custom-footer .footer-links-section,
    .custom-footer .footer-social-section,
    .custom-footer .footer-logo-section {
        text-align: center;
    }

    .custom-footer .footer-social-section .footer-social-links {
        justify-content: center;
    }
}

/* FAQ Section Styling */
.faq_section {
  padding: 80px 0;
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
  position: relative;
  overflow: hidden;
}

.faq_section:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(#f26513 1px, transparent 1px);
  background-size: 30px 30px;
  opacity: 0.05;
  z-index: 0;
}

.faq_section .section_title_container {
  margin-bottom: 50px;
}

.custom_accordion {
  max-width: 850px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.accordion_item {
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  margin-bottom: 16px;
  border: 1px solid rgba(0, 0, 0, 0.05);
  overflow: hidden;
  transition: all 0.4s ease;
}

.accordion_item:hover {
  box-shadow: 0 8px 18px rgba(242, 101, 19, 0.1);
  transform: translateY(-2px);
}

.accordion_header {
  position: relative;
  padding: 0;
  background: transparent;
  border: none;
}

.accordion_button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 20px 25px;
  background: transparent;
  border: none;
  text-align: left;
  color: #384158;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  transition: all 0.3s ease;
}

.accordion_button:focus {
  outline: none;
}

.accordion_button:hover {
  color: #f26513;
}

.accordion_button:not(.collapsed) {
  color: #f26513;
  background-color: rgba(242, 101, 19, 0.03);
}

.accordion_title {
  flex: 1;
  padding-right: 20px;
}

.accordion_icon {
  position: relative;
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}

.accordion_icon:before,
.accordion_icon:after {
  content: '';
  position: absolute;
  background-color: #f26513;
  transition: all 0.3s ease;
}

.accordion_icon:before {
  top: 10px;
  left: 0;
  width: 100%;
  height: 2px;
}

.accordion_icon:after {
  top: 0;
  left: 10px;
  width: 2px;
  height: 100%;
}

.accordion_button:not(.collapsed) .accordion_icon:after {
  transform: rotate(90deg);
  opacity: 0;
}

.accordion_body {
  padding: 5px 25px 25px;
  color: #656668;
  font-size: 16px;
  line-height: 1.7;
}

.faq_list {
  margin: 15px 0;
  padding-left: 20px;
}

.faq_list li {
  margin-bottom: 8px;
  position: relative;
  padding-left: 15px;
}

.faq_list li:before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f26513;
}

/* Animation for accordion items */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.accordion_body {
  animation: fadeIn 0.4s ease-in-out;
}

/* Mobile Adjustments */
@media (max-width: 767px) {
  .faq_section {
    padding: 50px 0;
  }

  .faq_section .section_title_container {
    margin-bottom: 30px;
  }

  .accordion_button {
    padding: 15px 20px;
    font-size: 16px;
  }

  .accordion_body {
    padding: 5px 20px 20px;
    font-size: 15px;
  }

  .accordion_item {
    margin-bottom: 12px;
  }

  /* Reduce hover effect on mobile to prevent layout issues */
  .accordion_item:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 15px rgba(242, 101, 19, 0.08);
  }
}

/* Extra small devices */
@media (max-width: 480px) {
  .faq_section {
    padding: 40px 0;
  }

  .accordion_button {
    padding: 15px;
    font-size: 15px;
  }

  .accordion_body {
    padding: 5px 15px 15px;
    font-size: 14px;
  }

  .accordion_icon {
    width: 18px;
    height: 18px;
  }

  .accordion_icon:before {
    top: 8px;
  }

  .accordion_icon:after {
    left: 8px;
  }

  .faq_list {
    padding-left: 15px;
  }

  /* Remove hover effects on smallest screens */
  .accordion_item:hover {
    transform: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  }
}

/* Fix for Bootstrap collapse conflict */
.collapse:not(.show) {
  display: none;
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}

/* Testimonial Section Styling */
.testimonial_section {
  padding: 80px 0;
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
  position: relative;
  overflow: hidden;
}

.testimonial_section:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(#f26513 1px, transparent 1px);
  background-size: 30px 30px;
  opacity: 0.05;
  z-index: 0;
}

.testimonial_slider_container {
  position: relative;
  padding: 20px 0;
  margin: 40px 0 20px;
}

.testimonial_item {
  padding: 10px;
}

.testimonial_card {
  position: relative;
  background: #ffffff;
  border-radius: 15px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  transition: all 0.4s ease;
  height: 100%;
}

.testimonial_card:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 35px rgba(242, 101, 19, 0.15);
}

.testimonial_card_inner {
  position: relative;
  padding: 35px 30px 30px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.testimonial_card:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(90deg, #f26513, #ff7533);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.5s ease;
}

.testimonial_card:hover:before {
  transform: scaleX(1);
  transform-origin: left;
}

.quote_icon {
  position: absolute;
  top: 15px;
  left: 20px;
  font-size: 60px;
  font-family: "Georgia", serif;
  color: rgba(242, 101, 19, 0.1);
  line-height: 1;
  z-index: 1;
}

.testimonial_content {
  position: relative;
  z-index: 2;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.testimonial_text {
  color: #656668;
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 25px;
  flex: 1;
}

.testimonial_author_container {
  display: flex;
  align-items: center;
  margin-top: auto;
  padding-top: 15px;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.testimonial_author_avatar {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: linear-gradient(135deg, #f26513, #ff7533);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
  box-shadow: 0 3px 10px rgba(242, 101, 19, 0.2);
}

.testimonial_author_avatar span {
  color: #ffffff;
  font-size: 20px;
  font-weight: bold;
}

.testimonial_author_info {
  flex: 1;
}

.testimonial_author_name {
  font-size: 16px;
  font-weight: 600;
  color: #384158;
  margin: 0;
}

.testimonial_author_title {
  font-size: 13px;
  color: #888888;
  margin: 5px 0 0;
}

.testimonial_nav {
  position: absolute;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 15px;
  z-index: 10;
}

.testimonial_nav_prev,
.testimonial_nav_next {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #ffffff;
  border: none;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
  color: #f26513;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.testimonial_nav_prev:hover,
.testimonial_nav_next:hover {
  background: #f26513;
  color: #ffffff;
  box-shadow: 0 5px 20px rgba(242, 101, 19, 0.3);
}

/* Home Slider Button Fix */
.home_slider_content .owl_button {
  width: 220px;
  height: 50px;
  background: #f26513;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
  box-shadow: 0px 8px 20px rgba(242, 101, 19, 0.3);
  margin: 30px auto 0;
  z-index: 10;
  transition: all 0.4s ease;
}

.home_slider_content .owl_button:hover {
  background: #e85702;
  transform: translateY(-3px);
  box-shadow: 0px 10px 25px rgba(242, 101, 19, 0.4);
}

.home_slider_content .owl_button a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  color: #ffffff;
  letter-spacing: 1px;
}

/* Ensure these styles don't affect other buttons */
.owl_button,
.home_search_button {
  z-index: 10;
  position: relative;
}


/* Mobile Responsiveness */
@media (max-width: 991px) {
  .testimonial_card_inner {
    padding: 30px 25px 25px;
  }
}

@media (max-width: 767px) {
  .testimonial_section {
    padding: 60px 0;
  }

  .testimonial_slider_container {
    margin: 30px 0 30px;
  }

  .testimonial_item {
    padding: 5px;
  }

  .testimonial_card_inner {
    padding: 25px 20px 20px;
  }

  .quote_icon {
    font-size: 50px;
    top: 10px;
    left: 15px;
  }

  .testimonial_text {
    font-size: 14px;
    margin-bottom: 20px;
  }

  .testimonial_author_avatar {
    width: 40px;
    height: 40px;
  }

  .testimonial_author_avatar span {
    font-size: 18px;
  }

  .testimonial_author_name {
    font-size: 15px;
  }

  .testimonial_author_title {
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .testimonial_section {
    padding: 50px 0;
  }

  .testimonial_card {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.06);
  }

  .testimonial_card:hover {
    transform: translateY(-3px);
  }

  .testimonial_card_inner {
    padding: 20px 15px 15px;
  }

  .quote_icon {
    font-size: 40px;
    top: 8px;
    left: 10px;
  }

  .testimonial_nav {
    bottom: -15px;
  }

  .testimonial_nav_prev,
  .testimonial_nav_next {
    width: 40px;
    height: 40px;
    font-size: 16px;
  }
}