/*https://templatemo.com/tm-569-edu-download*/
/* font*/
@import url(https://fonts.bunny.net/css?family=montserrat:400,400i,700,700i|roboto:400,400i,700,700i);
:root {
  /* Core Colors */
  --white: #FFFFFF;
  --black: #000000;
  --light: rgba(255,255,255,.9); 
  --dark: #212529;
  --primary: #e4002b;
  --secondary: #ffc72c; 

  /*  Accent Colors */
--success: #f8f8f8;
--danger:rgba(207, 0, 25, .9);
--warning:#cf0019;
--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:'Roboto', 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-family: 'Montserrat', sans-serif;font-weight:700}
.p-accent {
    font-weight: 700;
    letter-spacing: 1.625px;
    text-transform: uppercase;
    font-size:11px;
}
.p-accent::before {
    content: "";
    display: inline-block; 
    width: 7px;
    height: 14px;
    background-color:var(--secondary);
    margin-right:10px;
    vertical-align: middle;
}
/* Ensure the parent .h-accent has relative positioning */
.h-accent {
    position: relative;
    display: inline-block; /* So the ::after width: 100% matches the text width.
                              If h-accent is display: block, ::after will span the full block width. */
    padding-bottom: 5px;   /* Space below the ::after element */
    /* Add other h-accent specific styles here if needed, e.g.,
       color: rgb(33, 37, 41);
       font-family: "Montserrat", sans-serif;
       font-size: 30.524px; (or whatever the actual h2 font-size is)
       font-weight: 700;
       line-height: 36.6288px; (or actual line-height)
    */
}

.h-accent::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 10px; /* You have this */

    /* --- TEMPORARY CHANGES FOR DEBUGGING --- */
    background-color: var(--secondary);   /* Use a very obvious color */
    opacity: .18 !important;              /* Make it fully opaque */
    /* z-index: 1 !important; */       /* Temporarily bring it to the front (optional for this step) */
    /* --- END TEMPORARY CHANGES --- */

    /* Original styles to restore later: */
    /* background-color: var(--secondary); */
    /* opacity: 0.18; */
    /* z-index: -1; */

    box-sizing: border-box;
    pointer-events: none;
}
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(--white);position:relative;z-index:1111;height:25px;display:flex;align-items:center;}
.sub-header .left-content p{color:var(--black);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{height:75px!important;left:0;position:fixed!important;right:0;top:0!important;}
.background-header .main-nav .nav li a{}
.background-header .main-nav .nav li a{}
.background-header .main-nav .nav li:hover a{}
.background-header .nav li a.active{}
.header-area{background-color:var(--danger);border-bottom:8px solid var(--warning);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(--white);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(--black)!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{}
@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{}
    .header-area.header-sticky .nav li.search-icon a{width:100%;}
    .header-area{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 10%;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: 600px;
    overflow: hidden;
    background-color: var(--black);
    height: calc(100vh - 41px); /* Full viewport height */
    margin-top:75px
}

#bg-video {
    width: 100%;
    height: 600px; /* 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:  600px; /* 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 */
}
.main-banner .caption {
    max-width: 425px;
    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;
}
.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{}

.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-color:var(--success)}

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 {}
.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;}
/* Base state of your card (ensuring smooth animation) */
#donors .card {
    transition: transform 0.25s ease-in-out, box-shadow 0.25s ease-in-out;
    backface-visibility: hidden; /* Keeps text rendering crisp during animation */
}

/* Hover state effect */
#donors .card:hover {
    transform: translateY(-5px); /* Smoothly lifts the card up 5 pixels */
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.12) !important; /* Deepens the shadow layer */
}
#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-image: url('/assets/images/parallex2.jpg');
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
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: 700;
    font-size: 12px;
    line-height: 1.5;
    color: var(--black);
    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;
    padding: 10px 30px; /* Horizontal padding is 20px on each side */
    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;
}

/* 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(--white);
    background-color: var(--primary);
    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;}}