/* font family */
@font-face {
    font-family: "Dm-Regular";
    src: url(../fonts/DMSans-Regular.ttf);
}

@font-face {
    font-family: "Dm-Medium";
    src: url(../fonts/DMSans-Medium.ttf);
}

@font-face {
    font-family: "Dm-SemiBold";
    src: url(../fonts/DMSans-SemiBold.ttf);
}

@font-face {
    font-family: "Dm-Bold";
    src: url(../fonts/DMSans-Bold.ttf);
}

@font-face {
    font-family: "Dm-ExtraBold";
    src: url(../fonts/DMSans-ExtraBold.ttf);
}

/* color pallete 
dark gray : #1C1C1C text color;
soft white : #F5F8FA for bg content
orange  : #FF7B00 for hvr
light blue : #E8F0FA for cards */

/* font family end */

* {
    margin: 0;
    padding: 0;
}


body {
    font-size: 15px;
    font-family: "Dm-Regular";
    background-image: url(../images/section-bg-1.png);
    background-size: cover;
}

img {
    width: 100%;
}

ul {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

a {
    text-decoration: none;
}

.mb-70 {
    margin-bottom: 70px;
}

.mt-70 {
    margin-top: 70px;
}

.pt-70 {
    padding-top: 70px;
}

.mainheader .navbar-toggler {
    padding: 1px 6px;
    font-size: 22px;
    line-height: 1.5;
    color: rgb(109 109 109);
    background-color: transparent;
    border: 1px solid rgb(109 109 109);
    border-radius: var(--bs-navbar-toggler-border-radius);
    transition: var(--bs-navbar-toggler-transition);
}

.mainheader .nav-link {
    color: #000;
    padding: 8px 17px;
    font-family: 'Dm-Medium';
    font-size: 16px;
    transition: 0.5s;
    border-radius: 0px;
    margin: 0 4px;
    transition: 0.5s;
}

    .mainheader .nav-link:hover {
        color: #198422;
        transition: 0.5s;
    }

    .mainheader .nav-link.activemenu {
        border-bottom: 2px solid #198422;
        color: #198422;
        transition: 0.5s;
    }

.btnhvr:active,
.btnhvr:hover,
.btnhvr:focus {
    outline: 0 !important;
    outline-offset: 0;
}

.btnhvr::before,
.btnhvr::after {
    position: absolute;
    content: "";
}

.cursor {
    position: fixed;
    top: 0;
    left: 0;
    width: 30px;
    height: 30px;
    border: 2px solid #000;
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50%, -50%);
    transition: transform 0.15s ease-out, width 0.15s ease-out, height 0.15s ease-out;
    z-index: 9999;
}

a:hover ~ .cursor,
button:hover ~ .cursor {
    width: 50px;
    height: 50px;
    border-color: #00eaff;
}


.hamburgermenuicon {
    position: relative;
    border: none;
    margin-left: 70px;
}

    .hamburgermenuicon span::before {
        position: absolute;
        content: '';
        width: 37px;
        height: 3px;
        top: -12px;
        left: -37px;
        z-index: 1;
        background: #000;
        border-radius: 15px;
    }

    .hamburgermenuicon span::after {
        position: absolute;
        content: '';
        width: 30px;
        height: 3px;
        top: -3px;
        left: -37px;
        z-index: 1;
        background: #000;
        border-radius: 15px;
    }

.toptobottom {
    background: #fff;
    color: #fff;
    width: 50px;
    position: fixed;
    bottom: 21px;
    right: 21px;
    height: 50px;
    border-radius: 50%;
    display: none;
    border: 1px solid #ddd;
    justify-content: center;
    align-items: center;
    font-size: 21px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    z-index: 1;
    transition: 0.5s;
}

    .toptobottom.test {
        display: flex;
        transition: 0.5s;
    }

    .toptobottom i {
        background: #595c95;
        color: #fff;
        width: 40px;
        height: 39px;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 21px;
    }

/* maincss */
.mainheader {
    border-bottom: 1px solid #ddd;
    transition: ease-in 0.3s;
}

.headersticky {
    position: fixed;
    background: #fff;
    z-index: 9;
    width: 100%;
    top: 0;
    transition: ease-out 0.3s;
}

.mainheader .navbar-brand {
    max-width: 120px;
}

.mainheader .navbar-nav {
    margin-left: auto;
}

.mainheader .buttonnav {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-left: 74px;
}

.topheader {
    background: #005bab;
    padding: 8px 0;
}



@keyframes dropDown {
    0% {
        transform: translateY(-150px);
        opacity: 0;
    }

    60% {
        transform: translateY(20px);
        opacity: 1;
    }

    80% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes dropUp {
    0% {
        transform: translateY(0);
        opacity: 1;
    }

    40% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(-500px);
        opacity: 0;
    }
}

#scrollToTopBtn {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 60px;
    height: 60px;
    background: #fff;
    backdrop-filter: blur(10px);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    opacity: 0;
    pointer-events: none;
}

    #scrollToTopBtn.drop {
        animation: dropDown 0.6s ease-out forwards;
        pointer-events: auto;
    }

    #scrollToTopBtn.lift {
        animation: dropUp 0.6s ease-in forwards;
        pointer-events: none;
    }

    #scrollToTopBtn.drop::before {
        position: absolute;
        z-index: -1;
        content: '';
        top: 100%;
        left: 5%;
        height: 10px;
        width: 90%;
        opacity: 1;
        background: radial-gradient(ellipse at center, rgba(0, 0, 0, .25) 0%, rgba(0, 0, 0, 0) 80%);
    }

.progress-ring__circle {
    transition: stroke-dashoffset 0.3s;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
}

.scrollPercent1 {
    position: absolute;
    color: #FF7B00;
    font-family: 'Dm-Medium';
    font-size: 12px;
}

.mainbtn {
    border: none;
    padding: 8px 20px;
    border-radius: 9px;
    background: #3476f1;
    color: #fff;
    transition: 0.5s;
}

    .mainbtn:hover {
        transition: 0.5s;
    }

    .mainbtn i {
        transition: 0.5s;
    }

    .mainbtn:hover i {
        padding-left: 10px;
        transition: 0.5s;
    }

.mainbtn1 {
    border: none;
    padding: 8px 20px;
    border-radius: 9px;
    background: #1a8723;
    color: #fff;
    transition: 0.5s;
}

    .mainbtn1:hover {
        transition: 0.5s;
    }

    .mainbtn1 i {
        transition: 0.5s;
    }

    .mainbtn1:hover i {
        padding-left: 10px;
        transition: 0.5s;
    }

.mainbtn2 {
    border: none;
    padding: 8px 20px;
    border-radius: 9px;
    background: red;
    color: #fff;
    transition: 0.5s;
}

.mainheader .navbar {
    /* background: transparent;
    position: fixed; */
    width: 100%;
    transition: 0.5s;
}
/* .mainheader .navbar .container{
        background: #fff;
    border-radius: 13px;
    padding: 8px 15px;
    box-shadow: rgb(50 50 93 / 6%) 0px 5px 27px -5px, rgb(0 0 0 / 12%) 0px 4px 20px -8px;
    transition: 0.5s;
}
.mainheader.headersticky .navbar {
    background: #ffffff;
    box-shadow: rgb(50 50 93 / 6%) 0px 5px 27px -5px, rgb(0 0 0 / 0%) 0px 4px 20px -8px;
    transition: 0.5s;
}
.mainheader.headersticky .navbar .container {
    background: transparent;
    box-shadow: none;
    transition: 0.5s;
} */
.mainbanner {
    background: linear-gradient(rgb(0 0 0 / 32%), rgb(0 0 0 / 38%)), url(../images/mainbanner.jpg);
    padding: 80px 0 66px 0;
    background-size: cover;
    background-position: center;
    color: #fff;
}

.alumnibanner {
    background: linear-gradient(rgb(0 0 0 / 32%), rgb(0 0 0 / 38%)), url(../images/alumnibg.jpg);
    padding: 80px 0 66px 0;
    background-size: cover;
    color: #fff;
    background-position-y: 20%;
}

.bannercontent h1 {
    font-size: 60px;
    font-family: 'Dm-ExtraBold';
    text-transform: capitalize;
}

    .bannercontent h1 span {
        background: #1a8723;
        padding: 0 12px;
        border-radius: 10px;
        color: #fff;
    }

.bannercontent p {
    font-size: 18px;
}

.bannercontent ul li {
    background: #ffffff66;
    padding: 15px 10px;
    border-radius: 10px;
    display: inline-block;
    width: 23%;
    text-align: center;
    backdrop-filter: blur(9px);
    margin: 0 3px;
    margin-top: 9px;
    border: 1px solid #ddd;
    transition: 0.5s;
}

    .bannercontent ul li img {
        width: 40px;
        margin: auto;
        margin-bottom: 10px;
        display: block;
    }

    .bannercontent ul li label {
        font-size: 16px;
        font-family: 'Dm-Medium';
        line-height: 1.3;
    }

.customersupportcontent h4 {
    font-size: 18px;
    font-family: 'Dm-Medium';
}

.customersupportcontent h2 {
    font-size: 41px;
    font-family: 'Dm-ExtraBold';
}

.mvcontentwrap h5 {
    font-size: 22px;
    font-family: 'Dm-ExtraBold';
}

.eventcard {
    background: #fff;
    padding: 8px 10px;
    border-radius: 15px;
    position: relative;
    margin-top: 20px;
    width: 95% !important;
    transition: 0.5s;
    border: 1px solid #ddd;
}

    .eventcard .mainbtn1 {
        position: absolute;
        top: 100px;
        left: 15px;
        padding: 4px 15px;
    }

    .eventcard img {
        border-radius: 15px 15px 0 0;
        height: 130px;
        object-fit: cover;
        filter: brightness(0.7);
    }

    .eventcard .eventcontent h3 {
        font-size: 18px;
        font-family: "Dm-SemiBold";
        margin-bottom: 3px;
        color: #3476f1;
    }

.eventlocation ul {
    display: flex;
    justify-content: start;
    align-items: center;
    margin: 8px 0px 14px 0px;
}

    .eventlocation ul li {
        font-size: 12px;
        position: relative;
    }

        .eventlocation ul li:first-child {
            margin-right: 30px;
        }

            .eventlocation ul li:first-child::before {
                /*content: '';
                position: absolute;
                background: #676767;
                width: 1px;
                height: 18px;
                top: 0px;
                right: -14px;*/
            }

        .eventlocation ul li i {
            margin-right: 3px;
        }

.midheading {
    text-align: center;
}

    .midheading h4 {
        font-size: 41px;
        font-family: 'Dm-ExtraBold';
    }

.clientslider .slick-dots li button {
    border-radius: 10px;
    width: 8px;
    height: 8px;
    background: #248a2c6b;
    padding: 1px;
}

.clientslider .slick-dots li {
    width: auto;
    height: auto;
}

    .clientslider .slick-dots li.slick-active button {
        border-radius: 10px;
        width: 12px;
        height: 12px;
        background: #248a2c;
    }

    .clientslider .slick-dots li button:before {
        content: '';
    }

.videoslider .slick-dots li button {
    border-radius: 10px;
    width: 8px;
    height: 8px;
    background: #248a2c6b;
    padding: 1px;
}

.videoslider .slick-dots li {
    width: auto;
    height: auto;
}

    .videoslider .slick-dots li.slick-active button {
        border-radius: 10px;
        width: 12px;
        height: 12px;
        background: #248a2c;
    }

    .videoslider .slick-dots li button:before {
        content: '';
    }

.galleryslider .slick-dots li button {
    border-radius: 10px;
    width: 8px;
    height: 8px;
    background: #248a2c6b;
    padding: 1px;
}

.galleryslider .slick-dots li {
    width: auto;
    height: auto;
}

    .galleryslider .slick-dots li.slick-active button {
        border-radius: 10px;
        width: 12px;
        height: 12px;
        background: #248a2c;
    }

    .galleryslider .slick-dots li button:before {
        content: '';
    }

.galleryslider .slick-slide img {
    width: 98% !important;
    display: inline-block;
    border-radius: 15px 15px 0 0;
    height: 250px !important;
    object-fit: cover;
    filter: brightness(0.7);
}

.boardswrapper .nav-tabs {
    padding: 8px 15px;
    justify-content: center;
    border-radius: 8px;
    border-bottom: 0px;
}

    .boardswrapper .nav-tabs .nav-item {
        margin: 0 10px;
    }

        .boardswrapper .nav-tabs .nav-item .nav-link {
            background: #fff;
            color: #1a8723;
            border-radius: 8px;
        }

        .boardswrapper .nav-tabs .nav-item.show .nav-link, .boardswrapper .nav-tabs .nav-link.active {
            color: #ffffff;
            background-color: #1a8723;
            border-color: var(--bs-nav-tabs-link-active-border-color);
            border-radius: 8px;
        }


.row {
    display: flex;
    flex-wrap: wrap;
    padding: 0 4px;
}

/* Create four equal columns that sits next to each other */
.column {
    flex: 25%;
    max-width: 25%;
    padding: 0 4px;
}

    .column img {
        margin-top: 8px;
        vertical-align: middle;
        width: 100%;
        background: #fff;
        border: 1px solid #ddd;
        padding: 8px;
    }

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
    .column {
        flex: 50%;
        max-width: 50%;
    }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
    .column {
        flex: 100%;
        max-width: 100%;
    }
}

.newsimg {
    background-image: url(../images/Grid-Blog-image-1.png);
    padding: 20px 20px 0 20px;
    border-radius: 15px;
    text-align: center;
}

.newsimgcontent h4 {
    text-transform: capitalize;
    font-size: 35px;
    font-family: 'Dm-ExtraBold';
}

.newscontent1 ul li {
    display: flex;
    align-items: center;
    background: #fff;
    padding: 12px 20px;
    margin: 6px 0;
    border-radius: 13px;
    border: 1px solid #ddd;
}

    .newscontent1 ul li .newsdate {
        margin-right: 20px;
        text-align: center;
        border-right: 1px solid #b1b1b1;
        padding-right: 20px;
    }

        .newscontent1 ul li .newsdate h4 {
            margin-bottom: 0px;
            font-size: 20px;
        }

.newscontent p {
    margin-bottom: 0px;
}

.newsimg img {
    width: 65%;
    margin-top: 20px;
}

.marq {
    height: 510px;
}

footer {
    background-image: url(../images/section-bg-2.png);
    background-size: cover;
    padding-top: 50px;
    border-top: 1px solid #ddd;
}

.footercontent img {
    width: 70%;
    object-fit: contain;
}

.footercontent ul {
    display: flex;
    justify-content: start;
    align-items: center;
    margin-top: 40px;
}

    .footercontent ul li a {
        background: #3476f1;
        width: 35px;
        height: 35px;
        display: inline-flex;
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        color: #fff;
        transition: 0.5s;
        margin-right: 8px;
    }

        .footercontent ul li a:hover {
            background: #198422;
            transition: 0.5s;
        }

.footerlinks ul li a {
    color: #000;
    font-size: 16px;
    margin-right: 10px;
    border-right: 1px solid #555555;
    padding-right: 10px;
    font-family: 'Dm-Medium';
    transition: 0.5s;
}

    .footerlinks ul li a:last-child {
        border: none;
        margin-right: 0px;
        padding-right: 0px;
    }

    .footerlinks ul li a:hover {
        transition: 0.5s;
        color: #198422;
        text-decoration: underline;
    }

.footerlinks h6 {
    font-size: 16px;
    margin-top: 30px;
}

.footercontact ul li a {
    display: flex;
    justify-content: start;
    align-items: baseline;
    color: #000;
    margin-bottom: 8px;
}

.footerlinks h5 {
    font-size: 22px;
    font-family: 'Dm-SemiBold';
    margin-bottom: 15px;
}

.footercontact h5 {
    font-size: 22px;
    font-family: 'Dm-SemiBold';
    margin-bottom: 15px;
}

.footercontact ul li a i {
    margin-right: 10px;
}

.footerbottom {
    border-top: 1px solid #ddd;
    margin-top: 30px;
    padding: 10px 0;
    text-align: center;
}

    .footerbottom p {
        margin-bottom: 0px;
    }

        .footerbottom p a {
            font-family: 'Dm-SemiBold';
        }

.registrationformwrapper .form-group label {
    font-size: 14px;
    font-family: 'Dm-Medium';
    letter-spacing: 0.5px;
}

.registrationformwrapper .form-group {
    margin: 6px 0;
}

.formheading h3 {
    font-size: 20px;
    font-family: 'Dm-SemiBold';
    color: #000;
}

.formbg {
    background: #fff;
    border-radius: 15px;
    border: 1px solid #ddd;
    padding: 15px 15px;
    margin-top: 20px;
}

.alumnibanner .bannercontent {
    text-align: center;
}

    .alumnibanner .bannercontent h2 {
        font-size: 75px;
        font-family: 'Dm-SemiBold';
    }

.eventcontent p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#newsmodal .modal-header {
    padding: 10px 15px;
}

    #newsmodal .modal-header div h4 {
        font-size: 22px;
        font-family: 'Dm-SemiBold';
        margin-bottom: 2px;
    }

    #newsmodal .modal-header div p {
        font-size: 12px;
        color: gray;
        margin-bottom: 0px;
    }

#ulNews li:hover {
    cursor: pointer;
}

.newscontent h3 {
    font-size: 18px;
    font-family: 'Dm-Medium';
    margin-bottom: 2px;
}

.newscontent .newsreadmorebtn {
    background: transparent;
    border: none;
    padding: 0 0;
    margin-top: 6px;
    text-decoration: underline;
    color: #3476f1;
}

.newscontent p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media only screen and (max-width: 767px) {
    .bannercontent ul li {
        width: 45%;
    }

        .bannercontent ul li img {
            display: block;
            margin: auto;
            margin-bottom: 10px;
        }

    .bannercontent h1 {
        font-size: 47px;
    }

    .customersupportimg {
        margin-top: 30px;
    }

    .midheading h4 {
        font-size: 31px;
        font-family: 'Dm-ExtraBold';
    }

    .newscontent1 {
        margin-top: 20px;
        background: #fff;
        padding: 20px;
    }

    .footerlinks {
        margin: 40px 0;
    }

    .mainheader .buttonnav {
        justify-content: start;
        margin-left: 0;
        margin-top: 14px;
        margin-bottom: 15px;
    }

    .alumnibanner .bannercontent h2 {
        font-size: 45px;
        font-family: 'Dm-SemiBold';
    }
}
