/*https://templatemo.com/tm-569-edu-download*/
/* font*/
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,400i,700,700i&display=swap');
:root {
  /* Core Colors */
  --white: #FFFFFF;
  --black: #000000;
  --light: #f6f6f6; 
  --dark: #212529;
  --primary: #00529c;
  --secondary: #00a6b6; 

  /*  Accent Colors */
--success: #2CC1F5;
--danger: #F24D56;
--warning: #de5126;
--info:#e8e8e8; 
}
.bg-dark{background-color:VAR(--black)!important;color: VAR(--white) !important;}
.bg-primary{background-color:var(--primary)!important;}
.text-primary{color:var(--primary)!important;}
.text-secondary{color:var(--secondary)!important;}
.text-success{color:var(--success)!important;}
.text-danger{color:var(--danger)!important;}
.text-warning{color:var(--warning)!important;}
.text-info{color:var(--info)!important;}
.text-dark{color:var(--dark)!important;}
.text-light{color:var(--light)!important;}
.text-white{color:var(--white)!important;}
.text-black{color:var(--black)!important;}
/*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{border:0;margin:0;outline:0;padding:0;}
.clearfix:after{clear:both;content:".";display:block;height:0;line-height:0;visibility:hidden;}
.clearfix{display:inline-block;}
html[xmlns] .clearfix{display:block;}
* html .clearfix{height:1%;}
ul, li{list-style:none;margin:0;padding:0;}
header, nav, section, article, aside, footer, hgroup{display:block;}
*{box-sizing:border-box;}
html, body{background-color:var(--white);font-family:'Montserrat', sans-serif;font-size:16px;font-weight:400;moz-osx-font-smoothing:grayscale;ms-text-size-adjust:100%;webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none !important;}
a:hover{color:var(--secondary);}
h1, h2, h3, h4, h5, h6,.h1,.h2,.h3,.h4,.h5,.h6,.display-2{font-weight: 900!important;}
.title {
    margin-bottom: 1rem; /* Adjusted from 3.125rem, which likely included space for ::after.
                             This margin is for space *after* the whole title block (text + line).
                             The space *between* text and line is handled by ::after's margin-top. */
    position: relative; /* Good practice for positioning pseudo-elements if needed, though not strictly here. */
    text-wrap: balance; /* For modern browsers, improves text flow in multi-line headings. */
}
.title::after {
    content: ""; /* Necessary for the pseudo-element to be generated */
    display: block; /* Allows setting width, height, and margins */
    width: 5.25rem; /* Length of the decorator line */
    height: 5px;    /* Thickness of the decorator line (simplified from border+background) */
    background-color: var(--secondary); /* Color of the line */
    margin-top: 2.1875rem; /* Space between the title text and this decorator line */
}
ul{margin-bottom:0px;}
p{color:VAR(--black);line-height:25px;}
img{overflow:hidden;width:100%;}
ul.square-list {margin-inline-start:20px;}
ul.square-list > li {list-style-type: square}
.object-fit-cover {width:100%;height:100%;object-fit:cover;}
/*global styles*/
::selection{}
@media (max-width: 991px){html, body{overflow-x:hidden;}
    .mobile-top-fix{margin-bottom:0px;margin-top:30px;}
    .mobile-bottom-fix{margin-bottom:30px;}
    .mobile-bottom-fix-big{margin-bottom:60px;}
}
:focus-visible {outline: 2px dashed var(--primary);outline-offset: 1px;}
.offscreen {position: absolute;height: 1px;width: 1px;overflow: hidden;clip-path: inset(1px 1px 1px 1px);clip-path: inset(1px, 1px, 1px, 1px);}
.skip-to-content.offscreen:focus {position: relative;display: inline;}
.sub-header{background-color:var(--primary);position:relative;z-index:1111;height:25px;display:flex;align-items:center;}
.sub-header .left-content p{color:var(--white);font-size:13px;padding:8px 0px;}
.sub-header .right-icons{padding:8px 0px;text-align:right;}
.sub-header .right-icons ul li{display:inline-block;margin-left:15px;}
.sub-header .right-icons ul li a{color:var(--white);font-size:14px;transition:all .3s;}
.sub-header .right-icons ul li a:hover{color:var(--primary);}
.sub-header .left-content a:hover{color:var(--secondary);}
.background-header{background-color:var(--white)!important;box-shadow:0px 0px 10px rgba(0,0,0,0.15)!important;height:75px!important;left:0;position:fixed!important;right:0;top:0!important;}
.background-header .main-nav .nav li a{color:var(--black)!important;}
.background-header .main-nav .nav li a{color:var(--black)!important;}
.background-header .main-nav .nav li:hover a{color:var(--primary)!important;}
.background-header .nav li a.active{color:var(--primary)!important;}
.header-area{background-color:var(--white);left:0;moz-transition:all .5s ease 0s;o-transition:all .5s ease 0s;position:absolute;right:0;top:25px;transition:all .5s ease 0s;webkit-transition:all .5s ease 0s;z-index:100;}
.header-area .main-nav{background:transparent;min-height:75px;}
.header-area .main-nav .logo{height:75px;}
a.logo { display: inline-flex;align-items: center;margin-right:auto!important;}
.header-area .main-nav a.logo > img { display: block; height: 60px;width: auto; max-height: none; }
@media screen and (min-width: 768px) and (max-width: 991px) {.header-area .main-nav a.logo > img{max-height:50px;}}
.header-area .main-nav .nav{background-color:transparent;float:right;margin-right:0px;moz-transition:all 0.3s ease 0s;o-transition:all 0.3s ease 0s;position:relative;transition:all 0.3s ease 0s;webkit-transition:all 0.3s ease 0s;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{border:transparent;color:var(--black);display:block;font-size:16px;font-weight:700;height:40px;line-height:40px;moz-transition:all 0.3s ease 0s;o-transition:all 0.3s ease 0s;transition:all 0.3s ease 0s;webkit-transition:all 0.3s ease 0s;}
@media screen and (min-width: 768px) and (max-width: 991px){.header-area .main-nav .nav li a{font-size:10px;}}
@media screen and (min-width: 768px) {.header-area .main-nav {display:flex;align-items:center;}}
@media screen and (min-width: 992px) {.header-area .main-nav .nav li a{font-size:13px;}}
.header-area .main-nav .nav li:hover a,
.header-area .main-nav .nav li a.active{color:var(--primary)!important;}
.background-header .main-nav .nav li:hover a,
.background-header .main-nav .nav li a.active{color:var(--primary)!important;opacity:1;}
.header-area .main-nav .nav li.has-sub{padding-right:15px;position:relative;}
.header-area .main-nav .nav li.has-sub:after{color:var(--white);content:"\f107";font-family:FontAwesome;font-size:12px;position:absolute;right:5px;top:12px;}
.background-header .main-nav .nav li.has-sub:after{color:var(--black);}
.header-area .main-nav .nav li.has-sub ul.sub-menu{box-shadow:0 2px 28px 0 rgba(0, 0, 0, 0.06);opacity:0;overflow:hidden;position:absolute;top:40px;transform:translateY(+2em);transition:all .3s;visibility:hidden;width:200px;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{background:var(--white);border-bottom:1px solid var(--light);color:VAR(--black)!important;display:block;font-size:13px;font-weight:400;height:40px;line-height:40px;moz-transition:all 0.3s ease 0s;opacity:1;o-transition:all 0.3s ease 0s;padding-left:20px;position:relative;transition:all 0.3s ease 0s;webkit-transition:all 0.3s ease 0s;}
.header-area .main-nav .nav li.has-sub ul li a:hover{background:var(--white);color:var(--primary)!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{opacity:1;transform:translateY(0%);transition-delay:0s, 0s, 0.3s;visibility:visible;z-index:1;}
.header-area .main-nav .menu-trigger{cursor:pointer;display:block;display:none;height:40px;position:absolute;right:10px;text-indent:-9999em;top:6px;width:32px;z-index:99;}
.header-area .main-nav .menu-trigger span,
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after{background-color:var(--black);display:block;height:2px;left:0;moz-transition:all 0.4s;o-transition:all 0.4s;position:absolute;transition:all 0.4s;webkit-transition:all 0.4s;width:30px;}
.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:var(--black);}
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after{background-color:var(--black);display:block;height:2px;left:0;moz-transition:all 0.4s;o-transition:all 0.4s;position:absolute;transition:all 0.4s;webkit-transition:all 0.4s;width:30px;width:75%;}
.background-header .main-nav .menu-trigger span:before,
.background-header .main-nav .menu-trigger span:after{background-color:var(--black);}
.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%;top:-10px;transform-origin:33% 100%;webkit-transform-origin:33% 100%;z-index:10;}
.header-area .main-nav .menu-trigger span:after{moz-transform-origin:33% 0;ms-transform-origin:33% 0;top:10px;transform-origin:33% 0;webkit-transform-origin:33% 0;}
.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{background-color:var(--black);moz-transform:translateY(6px) translateX(1px) rotate(45deg);ms-transform:translateY(6px) translateX(1px) rotate(45deg);transform:translateY(6px) translateX(1px) rotate(45deg);webkit-transform:translateY(6px) translateX(1px) rotate(45deg);}
.background-header .main-nav .menu-trigger.active span:before{background-color:var(--black);}
.header-area .main-nav .menu-trigger.active span:after{background-color:var(--black);moz-transform:translateY(-6px) translateX(1px) rotate(-45deg);ms-transform:translateY(-6px) translateX(1px) rotate(-45deg);transform:translateY(-6px) translateX(1px) rotate(-45deg);webkit-transform:translateY(-6px) translateX(1px) rotate(-45deg);}
.background-header .main-nav .menu-trigger.active span:after{background-color:var(--black);}
.header-area.header-sticky{min-height:75px;}
.header-area.header-sticky .nav li a.active{color:var(--primary);}
@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.header-sticky .nav li a:hover,
    .header-area.header-sticky .nav li a.active{color:var(--primary)!important;opacity:1;}
    .header-area.header-sticky .nav li.search-icon a{width:100%;}
    .header-area{background-color:var(--white);box-shadow:none;height:75px;padding:0px 15px;text-align:center;}
    .header-area .container{padding:0px;}
    .header-area .menu-trigger{display:block !important;}
    .header-area .main-nav{overflow:hidden;}
    .header-area .main-nav .nav{display:none;float:none;margin-left:0px;moz-transition:all 0s ease 0s;o-transition:all 0s ease 0s;transition:all 0s ease 0s;webkit-transition:all 0s ease 0s;width:100%;}
    .header-area .main-nav .nav li:first-child{border-top:1px solid var(--light);}
    .header-area.header-sticky .nav{}
    .header-area .main-nav .nav li{background:var(--white);border-bottom:1px solid var(--light);padding-left:0px !important;padding-right:0px !important;width:100%;}
    .header-area .main-nav .nav li a{background:var(--white) !important;border:none !important;color:#191a20 !important;height:75px !important;line-height:75px !important;padding:0px !important;}
    .header-area .main-nav .nav li a:hover{background:var(--light) !important;color:var(--primary)!important;}
    .header-area .main-nav .nav li.has-sub ul.sub-menu{box-shadow:none;height:0px;opacity:1;position:relative;top:0px;transform:translateY(0%);transition:all 0s;visibility:inherit;width:100%;z-index:1;}
    .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;font-size:14px;right:30px;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;}}

section.heading-page{background:linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)), url(/assets/images/heading-bg.jpg);background-position:center top;background-repeat:no-repeat;background-size:cover;padding-bottom:110px;padding-top:230px;text-align:center;}
section.heading-page h6, section.heading-page .h6{color:var(--white);font-size:15px;font-weight:700;letter-spacing:1px;margin-top:0px;}
section.heading-page h2, section.heading-page .h2{color:var(--white);font-size:36px;font-weight:800;letter-spacing:1px;margin-bottom:20px;margin-top:20px;}

section.landing-header{background:linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)), url(/assets/images/landing-bg.jpg);background-position:center 15%;background-repeat:no-repeat;background-size:cover;padding-bottom:110px;padding-top:230px;text-align:center;}
section.landing-header h6, section.landing-header .h6{color:var(--white);font-size:15px;font-weight:700;letter-spacing:1px;margin-top:0px;}
section.landing-header h2, section.landing-header .h2{color:var(--white);font-size:36px;font-weight:800;letter-spacing:1px;margin-bottom:20px;margin-top:20px;}
section.landing-page{padding-bottom:0px;padding-top:30px;}
legend {font-size:16px;margin-top:15px;}
.form-group {margin-bottom:15px!important}

section.donor-header{background:linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)), url(/assets/images/donor-bg.jpg);background-position:center center;background-repeat:no-repeat;background-size:cover;padding-bottom:110px;padding-top:230px;text-align:center;}
section.donor-header h6, section.donor-header .h6{color:var(--white);font-size:15px;font-weight:700;letter-spacing:1px;margin-top:0px;}
section.donor-header h2, section.donor-header .h2{color:var(--white);font-size:36px;font-weight:800;letter-spacing:1px;margin-bottom:20px;margin-top:20px;}
section.donor-page{padding-bottom:0px;padding-top:30px;}

.print-logo {height:100px;width:auto;margin:2em auto .5em;}
.main-banner {
    position:relative;
    max-height:  700px;
    overflow: hidden;
    background-color: var(--black);
    height: calc(100vh - 41px); /* Full viewport height */
    margin-top:0
}

#bg-video {
    width: 100%;
    height:  700px; /* Adjust height to account for header */
    z-index: 0; /* Ensure the video or images are behind the overlay */
    overflow: hidden;
}

.owl-main.owl-carousel .owl-item img {
    width: 100%;
    height:  700px; /* Ensure images cover the full height of the viewport */
    object-fit: cover; /* Cover the entire container without distortion */
}

.video-overlay {
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 0%);
    position: absolute;
    inset: 0; /* shorthand for top, right, bottom, left */
    z-index: 1; /* Ensure the overlay is above the background images */
    pointer-events: none; /* Allow clicks to pass through to elements behind */
}
.content-topper {
    display: flex;
    flex-direction: row;
    height: .625rem;
    left: 0;
    width: 100%;}
.content-topper .color-box {
    display: block
}

.content-topper .color-box:first-child {
    background-color: #1A3D80; /* Replaced var(--mhs-1-003897) */
    width: 31%;
}

.content-topper .color-box:nth-child(2) {
    background-color: #2CC1F5; /* Replaced var(--mhs-3-00b7f0) */
    width: 22%;
}

.content-topper .color-box:nth-child(3) {
    background-color: #5D2A7F; /* Replaced var(--mhs-7-592c82) */
    width: 16%;
}

.content-topper .color-box:nth-child(4) {
    background-color: #F24D56; /* Replaced var(--mhs-5-ef3742) */
    width: 14%;
}

.content-topper .color-box:nth-child(5) {
    background-color: #2AA8AA; /* Replaced var(--mhs-2-aa-00a4b3) */
    width: 10%;
}

.content-topper .color-box:last-child {
    background-color: #E58C1E; /* Replaced var(--jdch-3-aa-df7a07) */
    width: 7%;
}
.main-banner .caption {
    max-width: 625px;
    background-color: var(--light);
    z-index: 2; /* Ensure the caption is on top of everything else */
    pointer-events: all; /* Allow interaction with buttons/links in the caption */
    text-align:left;
    color: var(--dark) !important;
}
.blue-background {
    background-image: url(/assets/images/mhs-page-title-background.svg);
    background-color: VAR(--primary); /* Added this line */
    background-position-x: 50%;
    background-position-y: 50%;
    background-repeat: no-repeat;
    background-size: auto 1250px;
    color:var(--white)
}
.orange-background {
    background: url(/assets/images/games-pattern-background-short.svg) no-repeat 100% 0;
    background-color: VAR(--warning);
    border-radius: 0 0 5rem 0;
    color: var(--white);
    background-size: auto 100%; /* Make image height 100% of container */
}
.services{margin-top:-135px;position:absolute;width:100%;}
.services .item{background:var(--primary);background-position:center center;background-repeat:no-repeat;background-size:cover;border-radius:20px;color:var(--white);padding:40px;text-align:center;}
.services .item .icon{margin:0 auto;max-width:100px;}
.services .item p{color:var(--white);font-size:13px;}
.services .item p.h4 > a{color:var(--white);font-size:18px;font-weight:700;margin-bottom:15px;margin-top:25px;}
.services .owl-nav{display:inline-block !important;position:absolute;text-align:center;top:50%;transform:translateY(-25px);width:100%;}
.services .owl-nav .owl-prev{left:-80px;margin-right:10px;outline:none;position:absolute;}
.services .owl-nav .owl-prev span,
.services .owl-nav .owl-next span{opacity:0;}
.services .owl-nav .owl-prev:before{background-color:var(--white);border-radius:50%;color:var(--black);content:'\f104';display:inline-block;font-family:'FontAwesome';font-size:25px;font-weight:700;height:50px;line-height:50px;width: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{background-color:var(--white);border-radius:50%;color:var(--black);content:'\f105';display:inline-block;font-family:'FontAwesome';font-size:25px;font-weight:700;height:50px;line-height:50px;width:50px;}

section.legacy{}
.legacy .blue-background .row .col-lg-4 {
    /* Ensure the column itself allows content to be visually outside its bounds if needed.
       Bootstrap columns are usually fine, but if you have custom overflow rules, check them. */
}

.image-extend-right-wrapper {
    /* Make the wrapper 100% of its column's width PLUS the extra 100px */
    width: calc(100% + 100px);
    /* If you want the extension to happen only on large screens (matching col-lg-4): */
    /* For smaller screens, you might want it to be width: 100%; or handle differently */
}

.image-extend-right-wrapper img {
    width: 100%;         /* Image fills the new, wider wrapper */
    height: auto;        /* Maintain aspect ratio */
    display: block;      /* Removes any extra space below the image if it's inline */
    max-width: none;     /* IMPORTANT: Override Bootstrap's default max-width: 100% for images,
                             which would otherwise constrain it to the original column width. */
}

/* Optional: Media query to only apply this effect on large screens and up */
@media (max-width: 991.98px) { /* Below Bootstrap's 'lg' breakpoint */
    .image-extend-right-wrapper {
        width: 100%; /* Revert to normal width on smaller screens */
    }
    .image-extend-right-wrapper img {
        max-width: 100%; /* Restore default Bootstrap behavior if needed */
    }
}
.society-section {
    background-image: url('/assets/images/parallex.jpg');
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


section.upcoming-how-to-give {background: linear-gradient(180deg, var(--transparent) 0, #eaeaea 80%, var(--transparent) 100%);}
section.upcoming-how-to-give .categories{background-color:var(--white);margin-right:45px;padding:40px;}
section.upcoming-how-to-give .categories h3{border-bottom:1px solid var(--light);color:var(--primary);font-size:18px;font-weight:700;margin-bottom:30px;padding-bottom:20px;font-weight:700;}
/* Base styles for give-item */
.give-item { margin-bottom: 30px; border-radius: 0 !important; position: relative;border:none;box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);}
.give-item h3 {color:var(--primary)}
.give-title span { font-weight: 700; font-size: 12px; margin-bottom: 15px; color:var(--secondary);text-transform:uppercase}
.give-item .down-content { background-color: var(--white); padding: 2em; position: relative; z-index: 2; }
.give-icon { width: 75px; margin-bottom: 15px; opacity: 100%; transition: all .5s; }
.give-item:hover .give-icon { opacity: 50%; }


section.our-courses{background-color:var(--white);}
.our-courses .item .down-content{background-color:var(--white);}
.our-courses .item .down-content h3.h4{border-bottom:1px solid var(--light);color:var(--primary);font-size:18px;padding:25px;text-align:center;}
.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:var(--primary);font-size:14px;}
.our-courses .item .down-content .info span{color:var(--primary);display:inline-block;font-size:15px;font-weight:700;text-align:right;width:100%;}
.our-courses .owl-nav{position:absolute;text-align:center;top:50%;transform:translateY(-45px);width:100%;}
.our-courses .owl-dots{display:inline-block;margin-top:40px;text-align:center;width:100%;}
.our-courses .owl-dots .owl-dot{background-color:var(--white);border-radius:50%;height:7px;margin:0px 5px;outline:none;transition:all .5s;width:7px;}
.our-courses .owl-dots .active{border-radius:4px;height:8px;width:24px;}
.our-courses .owl-nav .owl-prev{left:-80px;margin-right:10px;outline:none;position:absolute;}
.our-courses .owl-nav .owl-prev span,
.our-courses .owl-nav .owl-next span{opacity:0;}
.our-courses .owl-nav .owl-prev:before{background-color:var(--white);border-radius:50%;color:var(--black);content:'\f104';display:inline-block;font-family:'FontAwesome';font-size:25px;font-weight:700;height:50px;line-height:50px;width: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{background-color:var(--white);border-radius:50%;color:var(--black);content:'\f105';display:inline-block;font-family:'FontAwesome';font-size:25px;font-weight:700;height:50px;line-height:50px;width:50px;}
section.services > div > div > div.owl-stage-outer > div,#donors div.owl-stage-outer > div {display:flex;}
#donors > div > div.owl-courses-item.owl-carousel.owl-loaded.owl-drag > div.owl-stage-outer > div > div,#donors > div > div.owl-courses-item.owl-carousel.owl-loaded.owl-drag > div.owl-stage-outer,#donors > div > div.owl-courses-item.owl-carousel.owl-loaded.owl-drag > div.owl-stage-outer > div {display:flex;align-items:stretch;align-content:stretch;}
.down-content {height:100%;}

section.contact-us{background-color:var(--light);}
section.contact-us #contact{}
section.contact-us #contact input:not([type='submit']){background-color:var(--white);border:none;height:40px;margin-bottom:10px;margin-right:10px;outline:none;padding:0px 15px;width:100%;}
._checkbox-radio{display:flex;}
._checkbox-radio input{width:15px!important;height:15px!important}
section.contact-us #contact textarea{background-color:var(--white);border:none;border-radius:20px;box-shadow:none;color:#7a7a7a;font-size:13px;font-weight:500;margin-bottom:30px;max-height:180px;min-height:140px;outline:none;padding:15px;width:100%;}
section.contact-us #contact button{background-color:var(--primary);border:none;color:var(--white);display:inline-block;font-size:13px;font-weight:500;outline:none;padding:12px 30px;transition:all .3s;}
section.contact-us #contact button:hover{opacity:0.9;}
section.contact-us .right-info{}
section.contact-us .right-info ul li{}
section.contact-us .right-info ul li:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
section.contact-us .right-info ul li h3.h6{}
section.contact-us .right-info ul li span{}
section.contact-us .right-info-2{background-color: var(--white);
    z-index: 2; /* Ensure the caption is on top of everything else */
    pointer-events: all; /* Allow interaction with buttons/links in the caption */
    text-align:left;
    color: var(--dark) !important;}
section.contact-us .right-info-2 ul li{}
section.contact-us .right-info-2 ul li:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
section.contact-us .right-info-2 ul li h3.h6{}
section.contact-us .right-info-2 ul li span{}
.contact-image {border-radius:50%;max-width:125px;margin-bottom:1em;}
#radio1,#radio2,#radio3 {height:15px!important;display:inline-block;width:auto!important;margin-bottom:0!important;}
#contactForm label {display:inline-block;}

.footer-section{font-size:.75rem;padding:1rem;}
label{display:inline !important;}

section.downloads-page{padding-bottom:0px;padding-top:30px;}

.btn{border-radius:0px;text-align: left !important;}

.btn-primary {
    /* Flexbox for centering content */
    display: inline-flex;
    align-items: center;
    justify-content: center;

    /* Typography */
    font-family: Montserrat, montserrat, sans-serif;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.5;
    color: var(--primary);
    text-transform: uppercase;
    text-decoration: none; /* Remove default underline; we'll use a pseudo-element */
    -webkit-font-smoothing: antialiased;
    text-size-adjust: 100%;

    /* Background and Border */
    background-color: transparent;
    border: 2px solid var(--primary);
    border-radius: 100px; /* Pill shape */

    /* Sizing and Spacing */
    box-sizing: border-box;
    min-height: 50px;
    padding: 11.75px 20px; /* Horizontal padding is 20px on each side */
    min-width: 222px;
    margin: 0px;

    /* Interactivity & Position */
    cursor: pointer;
    position: relative; /* Needed for the ::after pseudo-element's positioning */
    transition: box-shadow 0.2s ease-in-out;
    outline-style: none;
}

/* Pseudo-element for the animated underline */
.btn-primary::after {
    content: '';
    position: absolute;
    width: 0;                      /* Start with no width */
    left: 20px;                    /* Align with start of text (after left padding) */
    height: 1px;                   /* New underline thickness (1/2 of previous 2px) */
    background-color: var(--primary);
    bottom: 11px;                  /* Positioned just below the text */
                                   /* (Adjust slightly if needed, e.g., 10px or 12px, for perfect visual alignment with your font's baseline) */
    transition: width 0.4s ease;
}

.btn-primary:hover::after {
    /* Expand underline to the width of the text area (button's content width - horizontal paddings) */
    width: calc(100% - 40px);      /* 100% of button's inner width minus 20px left & 20px right padding */
}

/* Styles for :hover and :focus states of the button itself */
.btn-primary:hover,
.btn-primary:focus {
    /* Ensure these do not change from the base state as per your request */
    color: var(--primary);
    background-color: transparent;
    border-color: var(--primary);
    text-decoration: none; /* Ensure no default underline appears */
}

/* Bootstrap 5 style focus ring for accessibility */
.btn-primary:focus {
    outline: 0; /* Remove default browser outline */
    box-shadow: 0 0 0 0.25rem var(--light);
}

/* Disabled state */
.btn-primary:disabled,
.btn-primary.disabled {
    color: var(--primary);
    background-color: transparent;
    border-color: var(--primary);
    opacity: 0.65;
    cursor: not-allowed;
    pointer-events: none;
}

/* Ensure the ::after element is hidden for disabled buttons */
.btn-primary:disabled::after,
.btn-primary.disabled::after {
    width: 0;
}
/* --- Secondary Button (White version) --- */
.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.5;
    color: VAR(--white); /* Changed to white */
    text-transform: uppercase;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    text-size-adjust: 100%;
    background-color: transparent; /* Stays transparent */
    border: 2px solid VAR(--white); /* Changed to white */
    border-radius: 100px;
    box-sizing: border-box;
    min-height: 50px;
    padding: 11.75px 20px;
    min-width: 222px;
    margin: 0px;
    cursor: pointer;
    position: relative;
    transition: box-shadow 0.2s ease-in-out;
    outline-style: none;
}

.btn-secondary::after {
    content: '';
    position: absolute;
    width: 0;
    left: 20px;
    height: 1px;
    background-color: VAR(--white); /* Underline color changed to white */
    bottom: 11px;
    transition: width 0.4s ease;
}

.btn-secondary:hover::after {
    width: calc(100% - 40px);
}

.btn-secondary:hover,
.btn-secondary:focus {
    color: VAR(--white); /* Stays white */
    background-color: transparent; /* Stays transparent */
    border-color: VAR(--white); /* Stays white */
    text-decoration: none;
}

.btn-secondary:focus {
    outline: 0;
    /* Consider a different shadow for white buttons for better contrast,
       or ensure --light provides enough contrast against the button's background.
       A light gray shadow is common for white elements.
       Example: box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.15);
       For now, using the existing --light: */
    box-shadow: 0 0 0 0.25rem var(--light);
}

.btn-secondary:disabled,
.btn-secondary.disabled {
    color: VAR(--white); /* Stays white */
    background-color: transparent; /* Stays transparent */
    border-color: VAR(--white); /* Stays white */
    opacity: 0.65; /* You might want a different opacity for a white button on a dark background */
    cursor: not-allowed;
    pointer-events: none;
}

.btn-secondary:disabled::after,
.btn-secondary.disabled::after {
    width: 0;
}

@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 h2{font-size:22px;margin-bottom:10px;margin-top:10px;}
    .main-banner .caption .main-button-1{margin-top:15px;}
    .services{margin-top:-135px;}
    section.upcoming-how-to-give{padding-top:20px;padding-bottom:0px;}
    section.upcoming-how-to-give .categories{margin-bottom:30px;margin-right:0px;}
    .accordions{margin-left:0px;padding:20px;}
    .new-students{margin-top:15px;}
    section.contact-us #contact{margin-bottom:30px;}
    section.society-section{padding:30px 0px;}
    .section-heading h2{padding-bottom:0px;} 
    section.our-courses {padding-top:20px;padding-bottom:20px;}
    section.contact-us {padding-top:30px;padding-bottom:20px;}
}
@media (max-width: 767px){
    .sub-header .left-content p{}
    .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:var(--primary);}
    .display-2{font-size: calc(1.2rem + 1.9vw);}
}

h2 > small {display:inline-block!important;line-height:1em!important;}
label {display: inline !important;}
._checkbox-radio {display:block!important;}
@media print {
    .print-logo {height:75px;width:auto;margin:00;}
    .print-header-text {font-size:11px;align-self:center;}
    body,p,blockquote {font-size:13px;line-height:18px;}
    h1,.h1 {font-size:28px;}
    h2,.h2 {font-size:21px;}
    h3,.h3 {font-size:18px;}
    h4,.h4 {font-size:16px;}
    h5,.h5 {font-size:14px;}
    h6,.h6 {font-size:12px;}
    .mb-3 {margin-bottom:10px!important;}
    .container {width:100%!important;max-width:100%!important}
    .footer-section{display:none;}
}
@page {
  size: 8.5in 11in;
  margin-top: .5in;
  margin-bottom: .5in;
}
@media (max-width:991px) {.h-100{height:auto!important;}}