/*=======Fonts=======*/
@font-face {
    font-family: 'MavenPro-Bold';
    src: url('../fonts/MavenPro-Bold.ttf');
}

@font-face {
    font-family: 'MavenPro-Medium';
    src: url('../fonts/MavenPro-Medium.ttf');
}

@font-face {
    font-family: 'MavenPro-Regular';
    src: url('../fonts/MavenPro-Regular.ttf');
}

@font-face {
    font-family: 'MavenPro-SemiBold';
    src: url('../fonts/MavenPro-SemiBold.ttf');
}
/*=======Fonts=======*/


/*======General======*/

body {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
}

h1, h2 {
    font-family: 'MavenPro-Bold';
}

h3, h4, h5, h6 {
    font-family: 'MavenPro-Regular';
}

p {
    font-size: 14px;
    margin-bottom: 0;
    font-family: 'MavenPro-Regular';
}
/* a,a:hover{
    text-decoration: none;
} */
a:hover {
    opacity: 0.7;
}

img {
    max-width: 100%;
    height: auto !important;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

a, button, input[type="submit"] {
    transition: all 0.5s ease !important;
    /* text-decoration: none; */
}

    a:hover, button:hover, input[type="submit"]:hover {
        opacity: 0.8 !important;
        /* text-decoration: none!important; */
        transition: all 0.5s ease !important;
    }

/*======General======*/

/* Header css start */
.header.fixheight {
    height: 10vh;
    display: flex;
    align-items: center;
}

section.header {
    background: #666666;
    padding: 10px 0px;
}

.right-side {
    align-items: center;
}

    .right-side a {
        margin-left: 20px;
    }

.sitelogo img {
    width: 18%;
}
/* Header css end */


/* footer css start */
.footer.fixheight {
    height: 10vh;
}

.footer {
    background-color: #000000;
    text-align: center;
    padding: 30px 0px;
    color: #fff;
}

    .footer h4 {
        margin-bottom: 0px;
    }
/* footer css end */

/* signup 1 page  form start*/
.signup.fixheight {
    height: 80vh;
}


.signup-form h1 {
    font-size: 42px;
    color: #1380AF;
    font-weight: 700;
    text-transform: uppercase;
}

.signup-form p {
    font-size: 14px;
    color: #666666;
    margin-bottom: 15px;
    font-family: 'MavenPro-Regular';
}

.form-label {
    margin-bottom: .5rem;
    color: #000;
    font-size: 15px;
    font-family: 'MavenPro-Regular';
    display: block;
}

    .form-label span {
        color: #FF0000;
    }

.error-message {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    margin-top: 0.60rem;
}

.error-icon {
    margin-right: 0.5rem;
}

.error-message.email-error {
    color: #dc3545; /* Bootstrap's red color */
    font-size: 12px;
}

.error-message.password-error i {
    color: #FF9900;
}

.error-message.password-error {
    color: #666666;
}

.form-control, .form-select {
    display: block;
    width: 100%;
    padding: 15px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    font-family: 'MavenPro-Regular';
}

.signup .container {
    padding: 60px 100px !important;
}

.col-md-7.signup-form {
    padding-right: 100px;
}

.input-group-text {
    background-color: #fff;
    border: 1px solid #ced4da;
}

.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: #000 !important;
    outline: 0;
    box-shadow: none !important;
}

.input-group .form-control:focus {
    box-shadow: none;
    border-color: #000;
}

.input-group-text {
    cursor: pointer;
    background-color: #fff;
    border-left: none;
}

.input-group .form-control {
    border-right: none;
}

    .input-group .form-control:focus + .input-group-text {
        border-color: #000;
    }

.btn-primary.singupsumit {
    text-transform: uppercase;
    background-color: #1693C9;
    padding: 16px 35px !important;
    font-size: 14px;
    line-height: 20px;
    outline: none;
    border-color: #1693C9;
}

.alredylogin {
    align-self: center;
    text-align: end;
}

    .alredylogin p {
        color: #000 !important;
        font-size: 14px;
        font-family: 'MavenPro-Regular';
        margin-bottom: 0;
    }

        .alredylogin p a {
            color: #1380AF;
            font-size: 14px;
            font-family: 'MavenPro-Bold';
            margin-left: 5px;
            text-decoration: underline;
        }

.form-check-label a {
    text-decoration: underline;
    color: #000;
}

/* signup 1 page form end */

/* login css start */
.login.fixheight {
    height: 80vh;
}

.forgetpass {
    text-align: end;
}

    .forgetpass a {
        color: #FF0000;
        text-decoration: underline;
        font-size: 12px;
    }

.form-check-label {
    font-size: 14px;
}

.input-group-text {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #999999;
    text-align: center;
    white-space: nowrap;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    background-color: #fff !important; /* or any color you prefer */
    -webkit-box-shadow: 0 0 0px 1000px #fff inset !important; /* Fallback for autofill */
    box-shadow: 0 0 0px 1000px #fff inset !important; /* Fallback for autofill */
}

.forgetpass a:hover {
    text-decoration: underline !important;
}

.btn {
    transition: unset;
}

a, button, input[type="submit"] {
    transition: unset !important
    /* text-decoration: none; */
}

.login.fixheight .signup-form {
    align-self: center;
}

.login .container,
.forget-password .container,
.reset-password .container {
    padding: 60px 100px !important;
}

.btn-primary:active:focus {
    box-shadow: unset !important;
}
/* login css end */

/* forget password page start*/
.forget-password.fixheight {
    height: 80vh;
}

    .forget-password.fixheight .signup-form,
    .reset-password.fixheight .signup-form {
        align-self: center;
    }

.backtologin a {
    color: #666666;
    text-decoration: none;
    font-size: 14px;
}

.backtologin i {
    color: #666666;
    text-decoration: none;
    font-size: 12px;
    margin-right: 8px;
}
/* forget password page  end */

/* reset password page css start */
.reset-password.fixheight {
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

#secretCode {
    background-color: #999999;
    border: 1px solid #666666;
    margin-bottom: 20px;
    color: #666666;
}

.reset-password #passwordError {
    margin-bottom: 20px;
}

.reset-password .btn-primary.singupsumit {
    margin-top: 17px;
}
/* reset password page css end */

/* toaster css start */
.toast {
    position: absolute;
    right: 0%;
    top: 110px;
    z-index: 2;
}
/* toaster css end */

.bodybg {
    background-color: #fff;
}

/* profile eid css start */

.welcome-box, .menu-box, .action-box {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 15px;
}

.menu-box {
    padding: 20px;
}

    .menu-box ul {
        list-style: none;
        padding: 0;
    }

        .menu-box ul li {
            padding: 10px 10px;
            display: flex;
            align-items: center;
            color: #000;
            font-size: 14px;
            margin-bottom: 5px;
        }

            .menu-box ul li i {
                margin-right: 10px;
            }

            .menu-box ul li:hover {
                background-color: #f1f1f1;
                border-radius: 5px;
            }

.top-bar-dash .container {
    background-color: #fff;
    padding: 30px 30px;
    border-radius: 15px;
    margin: 60px auto 25px auto;
    border: 1px solid #d6d6d6;
}

.top-bar-dash h3 {
    color: #666666;
    font-size: 18px;
    font-family: 'MavenPro-Regular';
}

    .top-bar-dash h3 span {
        font-size: 20px;
        font-family: 'MavenPro-Bold';
    }

.top-bar-dash h1 {
    color: #666666;
    font-size: 35px;
    font-family: 'MavenPro-Bold';
}

.welomc h4 {
    color: #000;
    font-size: 18px;
    font-family: 'MavenPro-Regular';
}

    .welomc h4 span {
        color: #000;
        font-size: 20px;
        font-family: 'MavenPro-Bold';
        margin-bottom: 15px;
    }

.btn-profile {
    color: #000;
    background-color: #f0faff;
    border: 1px solid #1cbbff;
    padding: 9px 26px;
    font-family: 'MavenPro-Regular';
    border-radius: 5px;
    font-size: 14px;
}

.btn-logout {
    color: #000;
    background-color: #fff2f2;
    border: 1px solid #ff9999;
    padding: 9px 26px;
    border-radius: 5px;
    margin: 0px 10px;
    font-size: 14px;
    font-family: 'MavenPro-Regular';
}

.welomc {
    align-self: center;
}

.profileimage {
    width: 130px;
    border-radius: 50%;
}

    .profileimage img {
        width: 100%;
    }



.menu-box.box-1,
.menu-box.box-2 {
    background-color: #fff;
}

.menu-box .active {
    color: #000;
    font-size: 14px;
    font-family: 'MavenPro-Bold';
    background-color: #F0FAFF;
    border: 1px solid #1CBBFF;
    border-radius: 4px;
}

.action-box.etisalat {
    background-color: #F0FAFF;
    border: 1px solid #1CBBFF;
}

.action-box h5 {
    font-size: 21px;
    font-family: 'MavenPro-Bold';
    font-weight: bolder;
}

.action-box p {
    font-size: 12px;
    font-family: 'MavenPro-Regular';
    margin-bottom: 12px;
}

.action-box.uaebby h5,
.action-box.uaebby p,
.uaebby button {
    color: #00732F;
}

.action-box.etisalat h5,
.action-box.etisalat p,
.etisalat button {
    color: #1380AF;
}

.uaebby button {
    width: 100%;
    background-color: #DAF2E4;
}

.welocome {
    align-self: center;
}

.etisalat button {
    width: 100%;
    background-color: #CFF0FF;
}

.action-box button {
    padding: 15px;
    border: none;
    border-radius: 5px;
    text-align: left;
    font-size: 14px;
    font-family: 'MavenPro-Bold';
    font-weight: bolder;
}

.dasbord .container {
    padding: 0px 0px;
}

.menu-box svg {
    margin-right: 10px;
}

.formm-box {
    border: none;
    padding: 20px 10px;
}

.fmainheading h2 {
    font-size: 33px !important;
    color: #000;
    text-transform: uppercase;
}

.phoneselect {
    padding: 18px 15px;
    background-color: #E6E6E6;
    border: none;
    border-radius: 5px 0px 0px 5px;
    color: #333;
}

#wordcount1,
#wordcount2 {
    color: #000 !important;
    margin-left: 10px;
    font-weight: bolder;
}

.menu-box a {
    text-decoration: none;
}

.custom-file-input {
    display: flex;
    align-items: center;
    border: 1px solid #80808069;
    border-radius: 4px;
    background-color: white;
}

.file-btn {
    padding: 18px 15px;
    background-color: #E6E6E6;
    border: none;
    border-radius: 5px 0px 0px 5px;
    color: #333;
}

.file-name {
    flex: 1;
    background-color: #fff;
    border: none !important;
    outline: none;
    padding: 8px;
    font-size: 12px;
}

.showfilename {
    display: none;
    align-items: center;
    gap: 8px;
    background-color: white;
    padding: 15px;
}

.remove-file {
    cursor: pointer;
    color: #800000;
    font-size: 20px;
    display: flex;
    align-items: center;
    padding: 4px 10px 9px 10px;
    background-color: #FF4D4D;
    border: 1px solid #800000;
    border-radius: 4px;
    line-height: 1;
    margin-left: 7px;
}

.show-file-name {
    background-color: #E6E6E6;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #999999;
    font-size: 12px;
}

.file-name.form-control.chosefiell {
    background-color: white;
}

.dasbord {
    margin-bottom: 80px;
}
/* profile eid css end */

/* profile view page css start */
.proimag {
    width: 100%;
    margin-bottom: 20px;
}

    .proimag img {
        width: 100%;
        max-height: 170px !important;
        object-fit: cover;
    }

.profilecontent h1 {
    font-size: 16px;
    font-family: 'MavenPro-Regular';
    margin-bottom: 10px;
    font-weight: bold;
}

.brief {
    font-size: 16px;
    font-family: 'MavenPro-Bold';
    margin-bottom: 10px;
    margin-bottom: 20px;
    margin-top: 30px;
}

#name-eg {
    margin-left: 10px;
    font-weight: normal;
}

.addresfo {
    margin-top: 30px;
    margin-bottom: 20px;
}

.tel {
    margin-bottom: 0px;
}

.png {
    background-color: white;
    padding: 15px 20px;
    border-radius: 5px;
    border: 1px solid lightgray;
    color: gray;
}

.tradelicense h3 {
    font-size: 16px;
    font-family: 'MavenPro-Bold';
    margin-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 30px;
}

.dashbords .btn-profile {
    padding: 15px 26px;
    font-family: 'MavenPro-Regular';
    border-radius: 5px;
    font-size: 14px;
}

.backlis {
    justify-content: space-between;
    display: flex;
}
/* progile view page css end */

/* auther page css start */
.searchbr input {
    width: auto;
    padding: 6px !important;
    margin-right: 5px;
}

.searchbr {
    display: flex;
    align-items: center;
    justify-content: right;
}

.btn-profile.autherbt {
    padding: 9px 25px;
}
/* auther page css end */
/* table css start */
#dataTable_info,
#submitbook_info,
#archives_info {
    display: none;
}

#dataTable_paginate,
#submitbook_paginate,
#archives_paginate {
    margin-bottom: 20px;
    text-align: end;
}

    #dataTable_paginate a,
    #submitbook_paginate a,
    #archives_paginate a {
        margin: 0px 5px;
        padding: 9px 15px;
        background-color: white;
        border: 1px solid #80808082;
        border-radius: 4px;
        color: #CCCCCC;
        text-decoration: none;
    }

        #dataTable_paginate a.paginate_button.current,
        #submitbook_paginate a.paginate_button.current,
        #archives_paginate a.paginate_button.current {
            color: #000 !important;
            background-color: #CCCCCC;
            text-decoration: none;
        }

#dataTable,
.tablesty {
    margin-bottom: 40px;
}

#dataTable_filter,
#submitbook_filter,
#archives_filter {
    display: none;
}

.tablehr {
    margin-top: 18px !important;
    margin-bottom: 0px !important;
    margin: auto;
}

.formm-box.fmainheading.tablels {
    padding: 20px 0px;
}

.tabledesign th {
    background-color: white;
    position: relative;
    text-align: left;
    /*    height: 60px;*/
}

#archives {
    margin-top: 50px;
}

.tabledesign th img {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.table > :not(:last-child) > :last-child > * {
    border-color: #dddddd;
    border-top: none;
}

.tabledesign tbody tr {
    background-color: transparent;
    height: 50px;
}

.name-ar {
    text-align: right;
}

.tabledesign th, .tabledesign td {
    padding: 15px;
    border: 1px solid #ddd;
}

.tabledesign th {
    background-color: white;
    position: relative;
    text-align: left;
    /*    height: 60px;*/
}

    .tabledesign th .sort-ico {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
    }

.tabledesign tbody tr {
    background-color: transparent;
}

    .tabledesign tbody tr td {
        vertical-align: middle;
        padding: 15px;
        border: 1px solid #ddd;
    }

    /* Remove the default Bootstrap table row striping */
    .tabledesign tbody tr:nth-child(odd),
    .tabledesign tbody tr:nth-child(even) {
        background-color: transparent;
    }

.table-striped > tbody > tr:nth-of-type(2n+1) {
    --bs-table-accent-bg: unset !important;
}

.tabledesign {
    font-family: 'MavenPro-Regular';
}

.act-btn {
    background-color: unset !important;
    border: unset;
}

.table-responsive {
    overflow-x: auto; /* Enable horizontal scrolling on small screens */
}

.table th,
.table td {
    white-space: nowrap; /* Prevent text from wrapping */
}

/* table css end */

/* submitted book list css start */
.season {
    font-size: 16px !important;
    color: #000;
    text-transform: capitalize;
    margin-top: 15px;
    font-weight: bolder;
    font-family: inherit;
}

.table-responsive {
    overflow-y: hidden;
    overflow-x: visible;
}

#archives_paginate {
    margin-bottom: 30px;
}
/* #submitbook_paginate {
	display: none;
} */
#submitbook_wrapper td:nth-child(6),
#archives_wrapper td:nth-child(6) {
    font-weight: bolder;
}

#submitbook th,
#archives th {
    padding-left: 10px;
    padding-right: 0px;
    font-size: 13px;
    line-height: 26px;
}

#submitbook td,
#archives td {
    font-size: 13px;
}

.helpicon {
    background-color: transparent;
    box-shadow: none;
    border: none;
}

.modal-title {
    font-size: 25px;
    font-weight: bolder;
    color: #000;
    font-family: 'MavenPro-Regular';
}

.select2-container .select2-selection--single {
    height: 56px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 55px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 50px !important;
}

.toast {
    transition: opacity 0.5s ease;
}

.alert-toast {
    position: fixed;
    top: 20px;
    left: 48%;
    transform: translateX(-50%);
    z-index: 1050;
    width: 400px !important;
    max-width: 400px !important;
    right: auto;
}

.select2-selection__clear {
    display: none;
}

.file-entry img {
    display: none;
}

.file-entry {
    display: flex;
    margin-bottom: 9px;
}

.sizebook {
    font-size: 16px !important;
    color: #000;
    text-transform: capitalize;
    font-weight: bolder;
    font-family: 'MavenPro-Bold';
}

#book_illustrate {
    background-color: white;
}

/* web header start */

.navbar-custom {
    background-image: url('background.jpg'); /* Replace with your background image */
    background-size: cover;
    background-position: center;
    padding: 10px 20px;
    color: white;
}

    .navbar-custom .navbar-brand img {
        height: 40px; /* Adjust logo height */
    }

    .navbar-custom .navbar-brand small {
        font-size: 12px;
        display: block;
        color: #ddd;
    }

    .navbar-custom .navbar-nav .nav-link {
        color: black;
        font-weight: bold;
        padding: 0 10px;
    }

    .navbar-custom .btn-support,
    .navbar-custom .btn-join {
        border-radius: 50px;
        color: white;
        margin: 0 5px;
    }

    .navbar-custom .icon-button {
        border-radius: 50%;
        color: black;
        width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 5px;
    }

/* web header end */

/*Home page css start  */
.home-banner {
    margin-top: -100px;
    background-image: url("images/website-images/home-banner.png");
    background-size: cover;
    background-repeat: no-repeat;
}
/* Home page css end */

/* webfooter css start */
.webfooter {
    /* background: linear-gradient(to bottom, #001720, #000203); */
    /* background: linear-gradient(to bottom, #007DB2 -5%, #000203 40%); */
    background: linear-gradient(0deg, #000, #001720b8), linear-gradient(5deg, rgb(0, 0, 0) 0%, rgb(0, 125, 178) 100%);
    font-size: 14px;
}

    .webfooter a {
        text-decoration: none;
    }

    .webfooter h5, .webfooter h6 {
        color: #ffffff;
    }

    .webfooter .material-icons {
        font-size: 24px;
    }

    .webfooter form .btn-light {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        width: 40px;
        height: 40px;
    }

    .webfooter hr {
        border-color: rgba(255, 255, 255, 0.3);
    }
/* webfooter css end */


/* web header css start */
/* Header background styling */
.web-header {
    background: transparent;
    padding-top: 25px;
    padding-bottom: 25px;
    z-index: 1;
}

    .web-header .navbar-brand img {
        width: 120px;
    }

    .web-header .tagline {
        color: #ffffff;
        font-size: 12px;
    }

    .web-header .nav-link {
        color: #ffffff;
        margin-right: 15px;
    }

/* .web-header .material-icons {
    font-size: 24px;
} */

/* Full-screen overlay menu styles */
.overlay-menu {
    position: fixed;
    top: 78px; /* Adjust to the height of the navbar */
    left: 0;
    width: 100%;
    height: calc(100% - 78px); /* Ensures full coverage without gap */
    background: rgba(0, 0, 0, 0.9);
    z-index: 1050;
    display: none;
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

    .overlay-menu .nav-link {
        font-size: 24px;
        margin-bottom: 10px;
        color: #ffffff;
    }

    .overlay-menu .btn {
        width: 80%;
        text-align: center;
    }

.first-nav .navbar-nav {
    display: flex;
    flex-direction: initial !important;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.first-nav {
    float: right;
}

    .first-nav .navbar-nav .nav-item {
        margin-right: 15px;
    }

    .first-nav .nav-link {
        color: white;
        text-decoration: none;
    }

.home-banner.section-padding {
    margin-top: -130px;
    z-index: 0;
}

.inner-banner.section-padding {
    margin-top: -130px;
    z-index: 0;
    padding-bottom: 50px;
}

/* Overlay background styling */
/* Overlay for mobile navigation */
.overlay {
    height: 100%;
    width: 0;
    position: fixed;
    top: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.9);
    overflow-x: hidden;
    transition: 0.5s;
    z-index: 1000;
}

.overlay-content {
    position: relative;
    top: 20%;
    text-align: center;
    color: #fff;
}

    .overlay-content a {
        padding: 10px;
        font-size: 24px;
        color: #fff;
        display: block;
        transition: 0.3s;
    }

        .overlay-content a:hover {
            color: #f1f1f1;
        }

.closebtn {
    position: absolute;
    top: 20px;
    right: 35px;
    font-size: 40px;
    color: #fff;
}

.navbar-toggler.custom-toggler {
    color: white;
}

.navbar-toggler.custom-toggler {
    color: transparent !important;
}

#navbarNav {
    background: url(images/tab-5.jpeg) no-repeat center /cover;
}

    #navbarNav::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 10;
        width: 100%;
        background: linear-gradient(0deg, rgba(20, 20, 20, 0.7), rgba(20, 20, 20, 0.7)), linear-gradient(180deg, rgba(0, 115, 47, 0) 0%, rgba(0, 115, 47, 0.2) 100%), linear-gradient(360deg, rgba(0, 0, 0, 0) 66.94%, rgba(0, 0, 0, 0.2) 100%);
    }

.navbar-toggler-icon {
    width: auto !important;
    height: auto !important;
}

.navbar.navbar-expand-lg:focus-visible {
    border: none !important;
    outline: none !important;
}

.second-nav .navbar {
    justify-content: end;
}

.web-headerlogo {
    align-self: center !important;
}

.first-nav ul li:last-child {
    margin-right: 0px !important;
}

.btn-outline-light {
    color: #f8f9fa;
    border-color: #f8f9fa;
    border-radius: 50px;
    padding: 5px 15px;
    font-size: 12px;
    font-weight: 600;
}

.web-header .material-icons {
    color: black;
    border-radius: 50px;
    background-color: #fff;
    padding: 0px 10px 2px;
}

.first-nav ul li a {
    font-size: 13px;
    font-weight: 400;
    font-family: 'MavenPro-Regular';
}

.second-nav ul li a,
.overy-nav a {
    font-size: 17px;
    font-weight: 600;
    font-family: 'MavenPro-Medium';
    text-transform: uppercase;
}

.navbar.navbar-expand-lg {
    padding-top: 0 !important;
    padding-bottom: 0px;
}

.second-nav ul li {
    margin-right: 30px;
}

.second-nav {
    margin-top: 10px;
}

    .second-nav ul li:last-child {
        margin-right: 0px;
    }

    .second-nav ul li a {
        margin-right: 0px !important;
        padding-right: 0px !important;
    }
/* web header css end */



/* website gerner css start */
body.webpage {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
    font-family: 'MavenPro-Regular';
    line-height: normal;
}

.webpage p {
    font-size: 16px;
    margin-bottom: 0;
    font-family: 'MavenPro-Regular';
}

.webpage b {
    font-weight: bold !important;
}

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

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center !important;
}

.left {
    text-align: left !important;
}

.right {
    text-align: right !important;
}

.webpage a,
.webpage button,
.webpage input[type="submit"] {
    transition: all 0.5s ease !important;
    text-decoration: none !important;
}

    .webpage a,
    .webpage a:hover,
    .webpage button:hover,
    .webpage input[type="submit"]:hover {
        text-decoration: none !important;
        transition: all 0.5s ease !important;
    }

.webpage header,
.webpage section,
.webpage footer {
    float: left;
    width: 100%;
    position: relative;
    margin-top: -1px;
}

.view-all-btn {
    background: #000;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    padding: 12px 30px;
    border-radius: 25px;
    display: inline-block;
}

    .view-all-btn:hover {
        background-color: #fff;
        color: #000;
    }

    .view-all-btn svg {
        margin-left: 15px;
    }

    .view-all-btn:hover svg {
        color: #000;
        fill: #000;
    }

.upper-case {
    text-transform: uppercase;
}

.section-heading {
    font-size: 40px;
    font-family: 'MavenPro-Bold';
}

.white {
    color: #fff;
    fill: #fff;
}

.section-padding {
    padding: 80px 0;
}

.ccont {
    display: block ruby;
    text-align: end;
}

.slider-button-prev .icon svg, .slider-button-next .icon svg {
    margin-top: -4.2px !important;
    width: 35px;
    height: 35px;
}

.slider-button-next .icon svg {
    margin-right: -3px;
}
/* website gener css end */



/* =====Home Banner Section Start===== */
.home-banner {
    background: url(images/tab-5.jpeg) no-repeat center /cover;
    padding-top: 150px;
}

.inner-banner {
    background: url(images/tab-5.jpeg) no-repeat center /cover;
    padding-top: 150px;
}

    .inner-banner:after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: -1;
        width: 100%;
        background: linear-gradient(0deg, rgba(20, 20, 20, 0.7), rgba(20, 20, 20, 0.7)), linear-gradient(180deg, rgba(0, 115, 47, 0) 0%, rgba(0, 115, 47, 0.2) 100%), linear-gradient(360deg, rgba(0, 0, 0, 0) 66.94%, rgba(0, 0, 0, 0.2) 100%);
    }

.home-banner:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    width: 100%;
    background: linear-gradient(0deg, rgba(20, 20, 20, 0.7), rgba(20, 20, 20, 0.7)), linear-gradient(180deg, rgba(0, 115, 47, 0) 0%, rgba(0, 115, 47, 0.2) 100%), linear-gradient(360deg, rgba(0, 0, 0, 0) 66.94%, rgba(0, 0, 0, 0.2) 100%);
}

.home-banner .container,
.home-banner .spotlight-row {
    position: relative;
    z-index: 100;
}

.home-banner .spotlight-row {
    width: 100%;
    margin: auto;
}

.home-banner h1 {
    font-size: 26px;
}

.inner-banner h1 {
    font-size: 48px;
    line-height: 48px;
    margin-bottom: 60px;
    margin-top: 40px;
}

.home-banner h4 {
    font-size: 20px;
    padding-right: 25px;
    margin-top: 12px;
}


.home-banner .news-text p {
    font-size: 10px;
}

.home-banner .news-text h2 {
    font-size: 20px;
}

.home-banner .news-text .registration {
    font-size: 12px;
    font-family: 'MavenPro-Bold';
}

.home-banner .slick-next,
.home-banner .slick-prev {
    top: -40px !important;
    right: 6% !important;
}

.home-banner .slick-prev {
    right: 8% !important;
}

/* =====Home Banner Section End===== */

/* =====Books Made Section Start===== */
.books-made:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    width: 100%;
    background: linear-gradient(360deg, rgba(20, 20, 20, 0.7) 0%, #141414 100%), linear-gradient(0deg, rgba(0, 125, 178, 0.1), rgba(0, 125, 178, 0.1));
}

.btn-outline {
    color: #fff;
    border: 1px solid #fff;
    padding: 10px 25px;
    display: inline-block;
    border-radius: 50px;
    text-transform: uppercase;
    font-weight: bold;
}

    .btn-outline svg {
        margin-left: 5px;
    }

    .btn-outline:hover {
        background-color: #fff;
        color: #000;
    }

        .btn-outline:hover svg {
            fill: #000;
        }

.initiatives {
    background: #00000080;
    padding: 15px 0;
    border-radius: 50px;
}

.books-made .container {
    position: relative;
    z-index: 100;
}

.books-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .books-tabs .tab img {
        border-radius: 50px;
        border: 2px solid #000;
        opacity: 80%;
        margin: 0 10px;
    }

    .books-tabs .small img {
        width: 100px;
        height: 60px !important;
    }

    .books-tabs .medium img {
        width: 160px;
        height: 90px !important;
    }

    .books-tabs .tab.active img {
        width: 220px !important;
        height: 125px !important;
        border-radius: 100px;
        border: 2px solid red;
    }

/* =====Books Made Section End===== */

/* =====Events Section Start===== */
.events {
    background: linear-gradient(180deg, #222 0%, #031621e3 100%);
}

    .events .event-box {
        margin: 20px;
        margin-left: 0px;
    }

    .events .event-img img {
        height: 250px !important;
        object-fit: cover;
        object-position: center;
        border-radius: 10px 10px 0 0;
    }

    .events .event-detail {
        background: #fff;
        padding: 30px 20px;
        border-radius: 0 0 10px 10px;
    }

    .events .categories {
        margin-bottom: 10px;
    }

        .events .categories a {
            padding: 6px 10px;
            font-size: 12px;
            font-weight: bold;
            display: inline-block;
            border-radius: 25px;
            margin-right: 3px;
        }

        .events .categories .cat-yellow {
            background: #FFCC0066;
            color: #FF6600;
        }

        .events .categories .cat-green {
            background: #00FF0080;
            color: #009900;
        }

        .events .categories .cat-red {
            background: #FFE5E5;
        }

            .events .categories .cat-red svg {
                fill: #f40103;
                width: 16px;
                height: 16px;
            }

        .events .categories .cat-blue {
            background: #CFF0FF;
            color: #1380AF;
        }



    .events .event-heading h3 a {
        color: #000;
    }

    .events .list {
        margin: 10px 0;
    }

        .events .list p {
            display: flex;
        }

        .events .list svg {
            fill: #000;
            margin-right: 10px;
            width: 20px;
        }

.event-box .register {
    background-color: #000;
    color: #fff;
    display: block;
    text-align: center;
    padding: 20px;
    font-size: 20px;
    border-radius: 50px;
    margin-top: 20px;
}

.events .event-heading h3 {
    text-align: left;
}
/* =====Events Section End===== */



/* =====5 Reasons Section Start===== */
.reasons {
    background: url(images/reasons-bg.jpeg) no-repeat center / cover;
}

    .reasons:after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: linear-gradient(0deg, rgba(0, 125, 178, 0.6), rgba(0, 125, 178, 0.6)), linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6));
    }

.reasons-inner {
    position: relative;
    z-index: 100;
}

.reasons-icon svg {
    border: 3px solid #fff;
    border-radius: 100%;
    padding: 10px;
    width: 60px;
    height: 60px;
    margin-right: 25px;
}

.reasons .arrow svg {
    opacity: 0.5;
    margin-left: 50px;
}

/* =====5 Reasons Section End===== */


/* =====Media & News Section Start===== */

.media-news {
    background: linear-gradient(180deg, #031621e3 0%, rgba(0, 0, 0) 100%);
}

.news-box .news-img img {
    height: 400px !important;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
    /* border: 1px solid black; */
}

.news-img {
    position: relative;
}

.news-box .news-img:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: block;
    z-index: 100;
    background: #00000090;
    border-radius: 10px;
}

.news-box {
    padding: 20px 0px 20px 20px;
    position: relative;
}

    .news-box h3 {
        font-size: 20px;
        font-weight: bold;
        margin-top: 10px;
        margin-left: 5px;
    }

    .news-box .news-text {
        position: absolute;
        bottom: 50px;
        z-index: 1000;
        left: 20px;
        width: 90%;
    }

        .news-box .news-text svg {
            margin-top: -4px;
        }

.slick-next,
.slick-prev {
    top: -100px !important;
    right: 23% !important;
}

.slick-prev {
    left: unset !important;
    right: 26% !important;
}

    .slick-next:before,
    .slick-prev:before {
        font-size: 30px !important;
    }

.home-banner .news-text p {
    background-color: #00000080;
    padding: 10px 20px;
    position: absolute;
    top: -55px;
    left: -20px;
    border-radius: 0 20px 20px 0px;
}
/* =====Media & News Section End===== */


/* join section css start */
.support-join-section {
    /* background-color: #0d0d0d;  */
    padding: 40px 0;
    color: white;
    /* background: linear-gradient(0deg, rgba(0, 125, 178, 0.6), rgba(0, 125, 178, 0.6)), linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6));
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)),
linear-gradient(0deg, rgba(0, 125, 178, 0.1), rgba(0, 125, 178, 0.1)); */
    background: linear-gradient(1deg, #000, #001720b8), linear-gradient(5deg, rgba(0, 125, 178, 0) 0%, rgb(47, 47, 47) 100%);
}

    .support-join-section .col-md-6 {
        text-align: center;
    }

    .support-join-section h5 {
        font-weight: 800;
        margin-bottom: 20px;
        font-size: 32px;
        font-family: 'MavenPro-Bold';
    }

    .support-join-section .icon-box {
        display: inline-block;
        margin: 10px;
        padding: 20px 20px;
        background-color: transparent;
        border-radius: 8px;
        transition: background-color 0.3s ease;
        text-align: center;
        border: 1px solid white;
    }

.support-join-section {
    padding: 100px 0px;
}

.row.text-white.copyright {
    padding-top: 20px !important;
}
/* .support-join-section::after{

    background: linear-gradient(0deg, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)),
    linear-gradient(0deg, rgba(0, 125, 178, 0.1), rgba(0, 125, 178, 0.1));
    
} */
.join-box {
    text-align: end;
}

    .join-box .icon-box {
        padding: 20px 18px;
        width: 100px;
    }

.support-join-section .icon-box:hover {
    background-color: #333;
}

.support-join-section .icon-box i {
    font-size: 24px;
    margin-bottom: 5px;
}
/* join section css end */

/* Custom styling for slick previous button */
.slick-prev {
    content: "<"; /* Replace with the icon you want */
    font-size: 24px; /* Adjust size as needed */
    width: 40px; /* Set width */
    height: 40px; /* Set height */
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent; /* Optional: Background */
    border: none; /* Optional: Remove border */
    color: #333; /* Optional: Color */
    cursor: pointer;
}

.web-header .navbar-brand img {
    width: 120px;
}

.web-header .tagline {
    color: #ffffff;
    font-size: 12px;
}

.web-header .nav-link {
    color: #ffffff;
    margin-right: 15px;
}
/* Full-screen overlay menu styles */
.overlay-menu {
    position: fixed !important;
    top: 78px !important;
    left: 0;
    width: 100% !important;
    height: calc(100% - 78px) !important;
    z-index: 1050;
    display: none;
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

    .overlay-menu.show {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        opacity: 1 !important;
        transform: translateY(0) !important;
    }

    .overlay-menu .navbar-nav {
        flex-direction: column;
        align-items: center;
        width: 100%;
    }

    .overlay-menu .navbar-nav {
        width: 100%;
    }

    .overlay-menu .nav-link {
        font-size: 24px;
        margin-bottom: 10px;
        color: #ffffff;
    }

    .overlay-menu .btn {
        width: 80%;
        text-align: center;
    }

.icon-box svg {
    margin-bottom: 15px;
}

.icon-box small {
    font-size: 13px;
    font-weight: 400;
    color: #fff;
}

.webfooter h2 {
    font-size: 16px;
    margin: 10px 0px;
    font-weight: 600;
}

.web-log a img {
    margin-bottom: 10px !important;
}

.col-md-4.mb-4.web-log {
    padding-right: 100px;
}

.secon-colom ul li a,
.third-colom ul li a {
    font-size: 17px !important;
    font-weight: 500;
    line-height: 32px;
}

.webfooter {
    padding: 100px;
}

.butfar {
    position: relative;
}

    .butfar .btn.btn-light {
        background-color: transparent;
        position: absolute;
        z-index: 12;
        right: 11px;
        line-height: 0px;
        height: 100% !important;
        border: none;
        outline: none;
    }

.webfooter h6 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 20px;
}

.butfar .form-control.me-2 {
    background-color: #192429;
    border: none;
    outline: none;
    color:white;
}

.slick-next::before, .slick-prev::before {
    font-family: 'Material Icons' !important;
    font-size: 25px !important;
    line-height: 1;
    opacity: .75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border: none;
    outline: none;
    position: absolute;
    top: 10px;
    z-index: 10;
    cursor: pointer;
    padding: 5px;
    background: #000;
    color: #fff;
    border-radius: 50px;
    padding: 3px 10px;
}

.slick-prev:before {
    right: 7%;
    content: "navigate_before" !important; /* Google icon for "<" */
}

.slick-next:before {
    content: "navigate_next" !important; /* Google icon for ">" */
}

.swiper-container {
    padding: 20px 0;
}

.event-box {
    background: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 20px;
    overflow: hidden;
    text-align: center;
}

.event-img img {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.event-detail {
    padding: 15px;
}

.categories {
    display: flex;
    gap: 5px;
}

    .categories .cat-yellow {
        color: #f0c808;
    }

    .categories .cat-green {
        color: #28a745;
    }

    .categories .cat-red {
        color: #dc3545;
    }

.newsand-event {
    position: relative;
    width: 100%;
    padding: 0;
    overflow: hidden;
}

.newsand-event-slider {
    width: 100%;
    padding: 0 15px; /* Space around the container to align within edges */
}

.news-box {
    margin: 0;
    width: 100%;
    border-radius: 10px; /* Optional: Rounded edges */
    overflow: hidden;
}

.events.slider.section-padding {
    overflow: hidden;
}

.mobile-menu {
    display: none;
}

.events .swiper-slide {
    height: 600px !important; /* Adjust height as needed */
    display: flex;
    flex-direction: column;
}


.events .event-box {
    height: 100%; /* Makes the event-box fill the slide's height */
    display: flex;
    flex-direction: column;
}

/* Image with a maximum height to fit inside the event box */
.event-img img {
    max-height: 250px !important; /* Adjust as needed */
    width: 100%;
    object-fit: cover;
}

.register-btn {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    text-align: center;
    width: 90%;
    margin: auto;
}

.event-heading {
    height: 50px;
}

.events .event-heading h3 {
    font-family: 'MavenPro-Bold';
    line-height: 24px;
    font-size: 20px !important;
}

    .events .event-heading h3 a {
        font-family: 'MavenPro-Bold';
        line-height: 24px;
        font-size: 20px !important;
    }

.slider-button-prev .icon,
.slider-button-next .icon {
    top: 10px;
    cursor: pointer;
    padding: 5px;
    background: #000;
    color: #fff;
    border-radius: 50px;
    padding: 9px 11px;
}

.slider-button-prev {
    margin-right: 10px;
}

.media-news.slider.section-padding {
    overflow: hidden;
}

.news-box.swiper-slide {
    padding-left: 0px !important;
    margin-left: 0px;
}

.copyright p br {
    display: none;
}

.home-banner.section-padding {
    overflow: hidden;
}

.head-contro {
    display: flex;
    align-content: revert;
    align-items: center;
    justify-content: space-between;
    padding-right: 30px;
}

.swiper-button-disabled {
    opacity: 0.4;
}

.books-made .heading-text p {
    line-height: 16px;
    padding: 0px 90px !important;
}

.news-img:hover,
.event-img:hover img,
.register-btn:hover {
    transform: scale(1.1);
}

.news-img,
.event-img img,
.register-btn {
    transition: all .6s ease;
}

.intiti-text,
.project-btn {
    align-self: center;
}

.project-btn {
    text-align: right !important;
    padding-right: 50px;
}

.ccont {
    margin-right: -35px;
}

.slider-button-wrap {
    margin-right: 10px;
    margin-top: 5px;
}


.books-made {
    position: relative;
    overflow: hidden;
}

    .books-made::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.5); /* Black overlay */
        opacity: 0;
        transition: opacity 0.5s ease; /* Transition for the overlay */
        z-index: 1;
    }

/* about us page css start */
.fillr {
    color: black;
    border-radius: 50px;
    background-color: #fff;
    padding: 6px 12px;
}

.inner-banner-button a {
    margin-right: 6px;
}

.inner-banner-button {
    display: initial;
}

.about-iamg-text {
    background-image: url("images/tab-3.jpeg");
    background-size: cover;
    background-repeat: no-repeat;
}

    .about-iamg-text::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1;
        width: 100%;
        /* background: linear-gradient(360deg, rgba(20, 20, 20, 0.7) 0%, #141414 100%), linear-gradient(0deg, rgba(0, 125, 178, 0.1), rgba(0, 125, 178, 0.1)); */
        background: linear-gradient(0deg, #007DB22E, #1A3E4D57), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    }

.about-iamg-text {
    padding: 100px 0px;
}

.about-text-sty p {
    color: #fff;
    font-size: 16px;
    font-family: 'MavenPro-Regular';
}

    .about-text-sty p a {
        font-weight: bold;
        text-decoration: underline !important;
        color: #fff;
        line-height: 20px;
    }

.about-inner {
    z-index: 2;
    position: relative;
}

.about-text-sty {
    align-content: center;
}

    .about-text-sty .left-text {
        padding-right: 50px;
    }

        .about-text-sty .left-text br {
            margin-bottom: 20px;
        }

    .about-text-sty .right-text {
        padding-right: 50px;
    }

.ourmission {
    /* background: linear-gradient(180deg, #031621e3 0%, rgba(0, 0, 0) 100%); */
    background: linear-gradient(180deg, #10a7ffdb 0%, rgb(0, 0, 0) 100%);
    overflow: hidden;
}

.ourmission {
    background: linear-gradient(0deg, #007DB2, #007DB2), /* Top layer gradient (solid blue) */
    linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222222 100%); /* Bottom layer gradient (dark) */
    background-blend-mode: overlay; /* Adds an overlay effect for blending */
    background-size: cover; /* Ensures the gradient covers the entire area */
}

.section-heading h1 {
    margin-bottom: 20px;
    font-size: 40px;
    font-family: 'MavenPro-Bold';
    color: white;
}

.ourmission {
    padding: 80px 0px;
}

.mission-sldies {
    margin-top: 30px;
}

.mission-card-box {
    background: #0000004D;
    padding: 25px;
    border-radius: 10px;
}

.mission-card-text p {
    color: #fff;
    font-size: 18px;
    margin: 20px 0px 0px;
    line-height: 22px;
}

.mission-card-box img {
    height: 250px !important;
    min-width: 170px !important;
    border-radius: 10px;
}

.mission-card-box {
    height: 440px !important;
    overflow: hidden;
}

.teamsection {
    background: linear-gradient(0deg, #00732F78, #00732F), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    background-blend-mode: overlay; /* Overlay blending mode to combine the gradients */
    background-size: cover; /* Ensures the background covers the entire area */
}

.slider-herdig h1 {
    font-size: 28px;
    font-family: 'MavenPro-Bold';
    color: white;
}

.webpage section {
    overflow: hidden;
}

.teamsection {
    padding: 80px 0px;
}

    .teamsection .col-md-4 p {
        color: #fff;
        font-size: 17px;
        margin: 20px 0px 0px;
        line-height: 22px;
    }

.news-text p {
    background-color: #00000080;
    padding: 10px 20px;
    position: absolute;
    top: -55px;
    left: -20px;
    border-radius: 0 20px 20px 0px;
}

/* .news-box.swiper-slide.swiper-slide-prev,
.news-box.swiper-slide.first-slide{
	opacity: 0.5;
}
.news-box.swiper-slide{
	opacity: 0.5 !important;
}
.news-box.swiper-slide.swiper-slide-active,
.news-box.swiper-slide.swiper-slide-next,
.news-box.swiper-slide.first-slide.swiper-slide-active {
	opacity: 1 !important;
} */



.swiper-team .news-box.swiper-slide {
    filter: blur(3px);
}

    .swiper-team .news-box.swiper-slide.swiper-slide-active,
    .swiper-team .news-box.swiper-slide.swiper-slide-next {
        filter: blur(0px);
    }

    /* Remove blur for the slide after swiper-slide-next */
    .swiper-team .news-box.swiper-slide.remove-blur {
        filter: blur(0px);
    }

.ibby {
    background: linear-gradient(0deg, rgba(34, 34, 34, 0.88), rgba(34, 34, 34, 0.91)), #FF0000BF;
    padding: 80px 0px;
}

.tesm-left {
    z-index: 6;
}

.how-it-begin {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    padding: 12px 30px;
    border-radius: 25px;
    display: inline-block;
    border: 1px solid rgba(255, 255, 255, 0.5);
    margin-top: 30px;
}

    .how-it-begin:hover {
        background: #000;
        color: #fff;
        border-color: #000;
    }

/* about us page css end */

/* All initiatives page css start */
.about-iamg-text.about-initiatives {
    padding: 80px 0px;
}

    .about-iamg-text.about-initiatives p {
        color: #fff;
        font-size: 17px;
        line-height: 22px;
        font-family: 'MavenPro-Regular';
    }

.list-initiatives {
    background: linear-gradient(0deg, #007DB2, #007DB2), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222222 100%);
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
}

.book-right-text h1 {
    font-size: 32px;
    font-family: 'MavenPro-Bold';
    color: white;
}

.book-right-text p {
    color: #fff;
    font-size: 17px;
    margin: 20px 0px 40px;
    line-height: 22px;
}

.book-right-text a {
    background: rgba(19, 128, 175, 0.2);
    padding: 15px 35px;
    font-size: 16px;
    line-height: normal;
    color: white;
    border-radius: 4px;
    display: inline-block;
}

.book-right-text {
    align-self: center;
    padding-left: 20px;
}

.book-box.left-book,
.book-box.right-book {
    margin-bottom: 110px;
}

.ourmis-layer .book-box:last-child {
    margin-bottom: 0px;
}

.book-box img {
    width: 100%;
}

.right-book .book-right-text {
    padding-left: 10px;
    padding-right: 20px;
}

.muktab-text p {
    line-height: 20px;
}

.about-iamg-text.initiatives-muktab {
    padding: 80px !important;
}

.initiatives-muktab img {
    width: 150px !important;
    height: 155px !important;
}

.editions {
    background: linear-gradient(0deg, #007DB2, #007DB2), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222222 100%);
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
    overflow: hidden;
    padding: 80px 0px;
}

.edition-img::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: block;
    z-index: 1;
    background: #00000090;
    border-radius: 10px;
}

.edition-text h2 {
    position: absolute;
    bottom: 20px;
    left: 20px;
    font-size: 16px;
    margin-bottom: 0;
    font-family: 'MavenPro-Regular';
    font-weight: 700;
    z-index: 121;
    color: #fff;
}

.edition-img img {
    /* width:250px; */
    height: 250px !important;
    border-radius: 10px;
}




#editionsModal .modal-dialog,
#workshopModal .modal-dialog {
    position: absolute;
    top: 47%;
    left: 49.5%;
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.6);
    border: none;
    border-radius: 5px;
    text-decoration: none;
}

#editionsModal .btn-close,
#workshopModal .btn-close {
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .25em;
    color: red;
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff0000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
    background-color: transparent;
    border: 3px solid red;
    border-radius: 50%;
    opacity: 0.8;
    background-color: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#editionsModal .modal-header,
#workshopModal .modal-header {
    border: none;
}

.btn.btn-outline-light:focus {
    box-shadow: none;
}

#editionsModal .modal-body,
#workshopModal .modal-body {
    padding: 60px;
    border-radius: 50px !important;
    padding-top: 30px;
}

#workshopModal .modal-dialog {
    width: 100%;
}

#editionsModal .modal-content,
#workshopModal .modal-content {
    border-radius: 20px !important;
}

#editionsModal .modal-body,
#workshopModal .modal-body {
    margin-top: -20px;
}

#editionsModal h1 {
    font-family: 'MavenPro-Bold';
    color: rgba(0, 125, 178, 1);
    font-size: 36px;
}

#workshopModal h5 {
    font-family: 'MavenPro-SemiBold';
    color: rgba(0, 125, 178, 1);
    font-size: 25px;
}


/* evvnts training courses start */
.event-training {
    background: linear-gradient(0deg, #007DB2, #007DB2), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222222 100%);
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
}

.workshop-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #0d3a4f;
    color: #ffffff;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .workshop-item:hover {
        background-color: #1e6a8b !important;
    }

        .workshop-item:hover .material-icons,
        .workshop-item.active .material-icons {
            opacity: 0.9;
        }

        .workshop-item:hover span,
        .workshop-item.active span {
            opacity: 0.9;
        }

.material-icons {
    font-size: 24px;
    transition: color 0.3s ease;
}

.workshop-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
}

.left-icon {
    margin-right: 20px;
}

/* .right-icon {
    margin-left: 10px; 
} */
.event-training p {
    margin-bottom: 60px;
}

.content-text {
    flex-grow: 1;
    text-align: left;
    color: #fff;
    font-size: 16px;
    font-family: 'MavenPro-Bold';
}

.event-training .left-list {
    padding-right: 5px;
}

.event-training .right-list {
    padding-left: 5px;
}

.event-training .material-symbols-outlined {
    font-size: 30px !important;
}

#about-initiative,
#all-initive {
    z-index: 0;
}
/* evvnts training courses end */


/*  exhibition page start */
.about-exhibition {
    background: linear-gradient(0deg, #184153, #34738E), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    background-size: auto, auto;
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
}

.about-exbhi p {
    color: #fff;
    font-size: 17px;
    line-height: 22px;
    font-family: 'MavenPro-Regular';
}

.exhibitions {
    background: linear-gradient(0deg, #007DB2, #007DB2), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222222 100%);
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
    overflow: hidden;
    padding: 80px 0px;
}

.exhibitions-text {
    margin-top: 25px;
    display: flex;
    justify-content: space-between;
}

.exhibitions-card-box {
    background: rgba(8, 54, 74, 1);
    padding: 25px 25px;
    border-radius: 5px;
}

    .exhibitions-card-box .news-heading {
        font-size: 16px;
        font-family: 'MavenPro-Bold';
        color: white;
        margin-bottom: 0px;
    }

.exhibitions-text .material-symbols-outlined {
    font-size: 16px;
    color: #fff;
    line-height: normal;
}

.exhibitions-img {
    width: 350px;
    height: 280px;
}
/*  exhibition page end */
.about-exhibition-detail {
    background: linear-gradient(0deg, #184153, #34738E), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    background-size: auto, auto;
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
}

    .about-exhibition-detail .about-exbhi {
        align-self: center;
        padding-left: 50px;
    }

.file-download {
    background: linear-gradient(0deg, #5a5f62, #777A7B), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    background-size: auto, auto;
    background-size: auto, auto;
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
}

.file-down h6 {
    color: #fff;
    margin-bottom: 0px;
    font-size: 16px;
    font-family: 'MavenPro-Bold';
    align-self: center;
}

.file-down.d-flex {
    background: rgba(8, 54, 74, 1);
    padding: 15px 30px;
    border-radius: 5px;
}

.file-down .material-symbols-outlined {
    color: white;
    font-size: 35px;
    margin-right: 30px;
    line-height: normal;
}

.file-download h1 {
    margin-bottom: 25px;
}

.virtual-tour.section-padding {
    background: linear-gradient(0deg, #184153, #34738E), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    background-size: auto, auto;
    background-size: auto, auto;
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
}

.virtual-tour p {
    margin-bottom: 40px;
}

.virtual-tour img {
    width: 100%;
}

.virtual-tour h1 {
    margin-bottom: 0px;
}

/* All initiatives pages css end */
/* news page css start */
.bread-cram {
    font-size: 24px;
    font-family: 'MavenPro-SemiBold';
    line-height: normal;
    margin-bottom: 0px;
    margin-top: 0px;
    color: #fff;
}

.inner-banner.section-padding.news-banner h1 {
    margin-top: 10px;
    font-size: 40px;
}

.about-news p {
    color: #fff;
    font-size: 17px;
    line-height: 20px;
    font-family: 'MavenPro-Regular';
}

.date {
    color: #fff;
    font-size: 15px;
    line-height: 20px;
    font-family: 'MavenPro-Regular';
    align-self: center;
}

.about-news-detail {
    background: linear-gradient(0deg, #184153, #34738E), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    background-size: auto, auto;
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
}

    .about-news-detail .material-symbols-outlined {
        color: #fff;
        margin-right: 10px;
    }

.about-news {
    margin-top: 20px;
}

#news-detail,
#all-exhibition-detialpg,
#all-exhibition,
.exhibitions {
    z-index: 0;
}
/* news page css end  */


/* media page css start */
.photo-gallery-sldier {
    background: linear-gradient(0deg, #00732F, #00732F), /* First layer: solid green */
    linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222222 100%); /* Second layer: dark transparent gradient */
    background-blend-mode: overlay;
}

.publications-sldier {
    background: linear-gradient(0deg, rgba(0, 125, 178, 0.6), rgba(0, 125, 178, 0.6)), linear-gradient(0deg, rgba(0, 0, 0, 0.43), rgba(0, 0, 0, 0.42));
    background-blend-mode: overlay;
}
/* media page css end */


.view-all-btn svg {
    width: 20px;
    height: 20px;
}

.slider .white.section-heading.upper-case {
    margin-bottom: 0px;
}

.pdf-text h3 {
    font-size: 16px;
    font-family: 'MavenPro-Bold';
    color: #fff;
    text-align: center;
    margin-bottom: 25px;
}

.pdf-text a {
    padding: 9px 20px;
    font-size: 14px;
}

.pdf-text {
    text-align: center;
}

.pdf-img img {
    min-width: 310px;
    min-height: 421px;
}

.photo-gallery-sldier .news-box .news-img img {
    height: 300px !important;
}
/* Existing CSS, but with adjusted padding and margin */

/* work shop banner start */
.workshopbanner h1 {
    font-size: 40px;
    line-height: 48px;
    margin-bottom: 60px;
    margin-top: 5px;
}

.sessions .news-box .news-img img {
    height: 250px !important;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
}


.workshop-form {
    background: linear-gradient(0deg, #092535e3, #062d44e3), linear-gradient(360deg, rgba(15, 7, 7, 0.7) 0%, #1183c6 100%), linear-gradient(0deg, rgba(0, 125, 178, 0.1), rgba(0, 125, 178, 0.1));
}

.right-form-text-register .card {
    background-color: #106e96;
    color: white;
    border-radius: 20px;
    text-align: left;
}

.right-form-text-register .icon {
    font-size: 21px;
    vertical-align: middle;
    margin-right: 15px;
}

.right-form-text-register .event-details,
.right-form-text-register .register-form,
.right-form-text-register .login-signup {
    margin-bottom: 10px;
}

.right-form-text-register .form-control {
    background-color: #0e5b7d;
    border: none;
    color: white;
}

    .right-form-text-register .form-control::placeholder {
        color: #a1d1d9;
    }

.right-form-text-register .btn-primary {
    border: none;
    background: rgba(8, 54, 74, 1);
    width: 100%;
    padding: 11px 10px;
    font-size: 16px !important;
}

    .right-form-text-register .btn-primary:hover {
        background-color: #21454e;
    }

.right-form-text-register .toggle-button {
    text-align: left;
    cursor: pointer;
    color: #fff;
    margin-top: 10px;
}

.add-calendar {
    padding: 25px 30px;
    border-bottom: 1px solid #337491;
    color: #fff;
    font-size: 17px;
    font-family: 'MavenPro-Regular';
}

/* .register{
    padding: 20px 25px;
    color: #fff;
    font-size: 16px;
    font-family: 'MavenPro-Regular';
} */
.event-details {
    background-color: #0e5b7d;
    padding: 45px 25px;
    border-bottom: 1px solid #337491;
}

.register {
    padding: 20px 25px;
}

.event-details p {
    margin-bottom: 20px;
}

    .event-details p:last-child {
        margin-bottom: 0px;
    }

.register h5 {
    color: #fff;
    font-size: 30px;
    font-family: 'MavenPro-SemiBold';
    margin-bottom: 20px;
}

.register .login-signup {
    display: inline-flex;
    margin-bottom: 0px;
}

.login-signup.login-work a {
    color: #fff !important;
    text-decoration: underline !important;
    font-size: 17px;
    line-height: 26px;
}

.login-signup.login-work .material-icons.icon {
    margin-top: 9px;
}

.left-form-text p {
    color: #fff;
    font-size: 24px;
    line-height: 28px;
    font-family: 'MavenPro-Regular';
}

.col-md-5.right-form-text-register {
    padding: 0px 0px 0px 120px !important;
}

.left-form-text {
    padding-right: 50px;
    align-self: center;
}

.event-box .date.list {
    color: #212529;
}

.register-form .first-nam {
    padding-right: 5px;
}

.register-form .last-nam {
    padding-left: 5px;
}

.form-check.mt-2 {
    text-align: center;
    justify-content: center;
    display: flex;
    padding-top: 10px;
}

.form-check a {
    color: #fff !important;
    text-decoration: underline !important;
}

#terms {
    margin-right: 10px;
    margin-top: 1px;
}

.work-register {
    background: linear-gradient(0deg, #071b26e3, #031722e3), linear-gradient(360deg, rgba(15, 7, 7, 0.7) 0%, #1183c6 100%), linear-gradient(0deg, rgba(0, 125, 178, 0.1), rgba(0, 125, 178, 0.1));
}
/* work shop baner end */





/* network page css start */
.all-person-network {
    background: linear-gradient(0deg, #184153, #34738E), linear-gradient(360deg, rgba(34, 34, 34, 0.9) 0%, #222 100%);
    background-size: auto, auto;
    background-size: auto, auto;
    background-blend-mode: overlay;
    background-size: cover;
    padding-top: 20px;
    padding-bottom: 20px;
}

.filter-container input,
.filter-container select {
    padding: 10px;
}

.all-person-network .card {
    background-color: transparent !important;
    color: white;
    border: none;
    height: 305px !important;
}

    .all-person-network .card img {
        width: 100%;
        height: auto;
    }

.all-person-network .filter-container {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 20px;
}

.all-person-network .pagination-container {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    margin-bottom: 0px;
}

.card-body.text-center h5 {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 2px;
}

.card-body.text-center p:first-child {
    font-size: 13px;
    font-weight: 600 !important;
    margin-bottom: 2px;
}

.card-body.text-center p:last-child {
    font-size: 13px;
    font-weight: 500;
}

.all-person-network .card img {
    width: 100%;
    height: 221px !important;
    border-radius: 10px;
}

.pre .page-link {
    /* Style for previous button */
    color: #000;
    background-color: #f1f1f1;
}

.next .page-link {
    /* Style for next button */
    color: #000;
    background-color: #f1f1f1;
}

.all-person-network-heigh {
    min-height: 650px !important;
    margin-top: 50px;
    margin-bottom: 30px;
}

.filter-container .row {
    width: 100%;
}

.filter-container span {
    color: #fff;
    align-self: center;
    margin-right: 15px;
}

.all-person-network .filter-container input,
.all-person-network .filter-container select,
.all-person-network .filter-container .btn.btn-primary {
    background: rgba(8, 54, 74, 1);
    border: none;
    color: #fff;
    margin: 0px 5px;
}

.filter-container .btn.btn-primary {
    margin-left: 12px;
    padding: 10px 15px;
}

#categoryFilter,
#countryFilter,
#sortFilter {
    color: white; /* Text color */
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="%23e8eaed"%3E%3Cpath d="M480-371.69 267.69-584 296-612.31l184 184 184-184L692.31-584 480-371.69Z"/%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px;
    appearance: none;
    -webkit-appearance: none; /* Safari and Chrome */
    -moz-appearance: none; /* Firefox */
    padding-right: 30px; /* Space for the custom icon */
}

.pagination .page-item a,
.page-item.pre.disabled a {
    padding: 15px 20px;
    background: rgba(8, 54, 74, 1);
    border: none;
    opacity: 0.5;
    color: #fff;
}

.page-item.active .page-link,
.page-item.next a,
.page-item.pre a {
    z-index: 3;
    color: #fff;
    background-color: rgba(8, 54, 74, 1) !important;
    border: none !important;
    opacity: 1;
}

.page-item.next.disabled a,
.page-item.pre.disabled a {
    opacity: 0.5;
}

.network-join .supportbox {
    text-align: left;
}

.network-join .join-box .icon-box {
    padding: 20px 18px;
    width: 160px;
}

.network-join .join-box {
    text-align: right;
}

.animate__animated.animate__fadeInRight.animate__delay-4s {
    margin-right: 0px !important;
}

#all-list-person {
    z-index: 0;
}
/* netwok page css end */

/* contact page */
.text-contact {
    display: inline-block;
    padding-left: 20px;
    font-size: 15px;
    line-height: normal;
}

.contact-icons {
    display: flex;
    align-items: center;
    gap: 8px;
}

.contact-form .contact-icons {
    margin-bottom: 25px;
}

.contact-form {
    padding: 0;
}

.btn-contact {
    border: none;
    color: #fff;
    background: rgba(14, 91, 125, 1);
    width: 20%;
    padding: 11px 10px;
    font-size: 16px !important;
}

    .btn-contact:hover {
        opacity: 0.8;
        color: white;
    }

.contact_map {
    width: 100%;
    height: 500px;
}

.work-register .left-form-text {
    padding-right: 200px;
    align-self: start !important;
}

.container-fluid.cont-mapps {
    padding: 0;
}

.pagination {
    margin-bottom: 0px !important;
}

.network-detail h1 {
    margin-bottom: 0px;
}

.network-detail h6 {
    font-size: 25px;
    line-height: 48px;
    margin-bottom: 60px;
    /* margin-top: ; */
    color: #fff;
}
/* contact page end */


/* network personal detail page css start */
.person-detail-networ {
    background: linear-gradient(0deg, #0c232d, #071A22), linear-gradient(360deg, rgb(34, 34, 34) 0%, #222 100%);
}

.person-det-img img {
    width: 100%;
    height: 340px !important;
}

.person-detail-text {
    padding-left: 160px;
    align-self: center;
}

#person-detailll {
    background: linear-gradient(0deg, #18516a, #0D506C), linear-gradient(360deg, rgb(34, 34, 34) 0%, #222222ba 100%);
    padding: 80px 0px;
}

    #person-detailll h2 {
        font-weight: 800;
        font-size: 50px;
        font-family: 'MavenPro-Bold';
        color: white;
        text-transform: uppercase !important;
        margin-bottom: 50px;
    }

.book-lis h2 {
    font-weight: 800;
    font-size: 50px;
    font-family: 'MavenPro-Bold';
    color: white;
    text-transform: uppercase !important;
    margin-bottom: 20px;
}

.book-list-btn.d-flex a {
    color: #fff;
    font-size: 16px;
    padding: 15px 20px;
    margin-right: 10px;
    background: rgba(8, 54, 74, 1);
    border-radius: 5px;
}

.network-join .join-box .icon-box:last-child {
    margin-right: 0px;
}

.action-box.uaebby p {
    margin-bottom: 15px;
}

.action-box.etisalat p {
    margin-bottom: 15px;
}
/* network personal detail page css end */

/* etisalat-awaid- page css start */

.etisalat-awaid-banner::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    width: 100%;
    background: linear-gradient(0deg, rgba(20, 20, 20, 0.7), rgba(20, 20, 20, 0.7)), linear-gradient(180deg, rgba(0, 115, 47, 0) 0%, rgba(0, 115, 47, 0.2) 100%), linear-gradient(360deg, rgba(0, 0, 0, 0) 66.94%, rgba(0, 0, 0, 0.2) 100%);
}

.etisalat-awaid-banner {
    background: url(images/tab-2.jpeg) no-repeat center /cover;
    margin-top: -150px !important;
    z-index: 0;
    height: 810px;
    padding: 0px;
    margin: 0px;
}

.second-est-nav {
    background-color: #fff;
    padding: 20px;
}

    .second-est-nav .nav-link {
        color: #259991;
    }

.web-header.etis-headie {
    padding: 0px;
}

.container.etis-top-nav {
    padding: 15px 0px;
}

a.alrbic {
    background-color: #fff;
    color: #000;
}

.second-est-nav a img {
    width: 80%;
}

.second-est-nav .second-nav.desktopmenu.animate__animated.animate__fadeInDown.animate__delay-2s {
    margin-top: 0px;
}

.etisalat-awaid-banner .container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.etisalat-awaid-banner.section-padding svg path {
    fill: #259991 !important;
}

.container.banner-social-icon {
    position: absolute;
    right: 16px;
    top: 95%;
}

.register-btns {
    background-color: #000;
    padding: 16px 30px;
    color: #fff;
    border-radius: 5px;
    font-size: 20px !important;
    text-transform: uppercase !important;
}

.etisalat-awaid-banner.section-padding h1 {
    font-size: 40px;
    text-transform: uppercase;
    margin-bottom: 50px;
}

.register-btns:hover {
    color: #fff;
    opacity: 0.6 !important;
}

.text-white.youtube-icon.etis-link {
    font-size: 24px;
    font-weight: 500;
    color: #259991 !important;
    ;
}

.second-est-nav .material-icons {
    color: #259991 !important;
    border-radius: 50px;
    font-size: 45px;
    background-color: transparent;
}

.timeline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    color: white;
    background-color: #259991;
    padding: 48px 0px;
}

.timeline-item {
    text-align: left;
    font-size: 16px;
}

    .timeline-item h3 {
        font-size: 18px;
        font-family: 'MavenPro-SemiBold';
        margin: 0;
    }

    .timeline-item p {
        font-size: 14px;
        margin: 5px 0 0 0;
    }

.about-etiheidgn {
    margin-bottom: 20px;
    font-size: 40px;
    font-family: 'MavenPro-Bold';
    color: white;
    padding-right: 80px;
}

.about-right-sub h2 {
    margin-bottom: 20px;
    font-size: 20px;
    font-family: 'MavenPro-Bold';
    color: white;
}

.about-right-sub p {
    margin-bottom: 50px;
    font-size: 18px;
}

.col-lg-7.about-text-sty.about-right-sub {
    padding-left: 90px;
}

.about-right-sub a,
.meet-section a.see-list {
    background-color: #0000009e;
    padding: 16px 30px;
    color: #fff;
    border-radius: 5px;
    font-size: 20px !important;
    text-transform: capitalize;
    font-weight: bold;
}

.ets-Categories .mission-card-box {
    height: 340px !important;
}

.ourmission.ets-Categories a h3 {
    color: #fff;
    font-size: 20px !important;
    text-transform: capitalize;
    font-weight: bold;
    margin-top: 15px;
}

.about-award {
    padding-right: 40px;
}

.meet-section h1 {
    margin-bottom: 50px;
    font-size: 40px;
}

.value-award h1 {
    font-size: 36px;
    margin-bottom: 20px;
}

.value-award h6 {
    font-size: 12px;
    color: #fff;
}

.value-award h2 {
    font-size: 50px;
    margin-bottom: 20px;
    margin-top: -15px;
    color: #fff;
}

.value-award .book-right-text a {
    font-weight: bold;
}

.left-book .book-right-text {
    padding-left: 34px;
    align-self: initial !important;
}

.sponsor {
    background-color: #239088;
}

    .sponsor h1 {
        margin-bottom: 20px;
        font-size: 40px;
        font-family: 'MavenPro-Bold';
        color: white;
    }

    .sponsor h6 {
        margin-bottom: 20px;
        font-size: 16px;
        font-family: 'MavenPro-Bold';
        color: white;
    }

    .sponsor p {
        margin-bottom: 20px;
        font-size: 16px;
        font-family: 'MavenPro-Regular';
        color: white;
    }

.spon-left {
    padding-right: 60px;
}

.sponsor a {
    color: #fff;
    font-size: 16px;
    font-family: 'MavenPro-Regular';
    text-decoration: underline !important;
}

.sponsor img {
    margin-top: 50px;
}

.span-text {
    height: 255px;
}





.media-center {
    z-index: 1;
    position: relative;
}

.nav-tabs {
    border: none; /* Remove the default border under the tabs */
    justify-content: center;
}

    .nav-tabs .nav-link {
        color: white;
        background-color: transparent;
        border: 1px solid transparent;
        border-radius: 25px;
        padding: 10px 20px;
    }

        .nav-tabs .nav-link.active {
            background-color: white;
            color: black;
            font-weight: bold;
        }

.tab-content img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.content-details {
    margin-top: 15px;
}

    .content-details .date {
        font-size: 14px;
        color: #bbb;
    }

    .content-details h5 {
        font-size: 16px;
        margin-top: 5px;
        color: #fff;
    }

.nav-tabs {
    border: none;
    justify-content: left;
    margin: 30px 0px;
}

.fade:not(.show) {
    opacity: 0;
    display: none;
}

.media-heading {
    margin-bottom: 20px;
    font-size: 40px;
    font-family: 'MavenPro-Bold';
    color: white;
}

.nav-tabs .nav-link.active {
    background-color: #000;
    color: #fff;
    border: none;
}

.nav-tabs .nav-link {
    background-color: #0000009e;
    padding: 15px 20px;
    color: #fff;
    border-radius: 5px;
    font-size: 16px !important;
    text-transform: capitalize;
    font-weight: bold;
    border: none;
    opacity: 0.7;
    margin-right: 20px;
}

.content-details .date {
    font-size: 14px;
    display: flex;
    font-weight: bolder;
    color: #fff !important;
}

    .content-details .date span {
        margin-right: 9px;
    }

.tab-pane .col-md-4 {
    margin-bottom: 52px;
}

.reasons.section-padding.media-centerss {
    height: 650px;
}

.inner-banner.section-padding.etis-award-detial {
    margin-top: -150px;
    z-index: 0;
    padding-bottom: 90px;
    padding-top: 250px;
    background: url(images/Etisalat-award-detail.jpg) no-repeat center /cover;
}

/* Smooth transition for tabs */

/* etisalat-awaid-banner css end */
.timeline-section.section-padding {
    background-color: #239088;
}

.timeline-section.ets-award h1 {
    font-family: 'MavenPro-Bold';
    color: #fff;
    font-size: 20px;
}

.timeline-section.ets-award li {
    color: #fff;
    font-size: 16px;
    margin-bottom: 14px;
}

.timeline-section.ets-award ul {
    margin-top: 30px;
    padding-left: 15px;
}

.ets-value .section-heading h1 {
    margin-bottom: 0px;
    font-size: 40px;
    font-family: 'MavenPro-Bold';
    color: #000;
}

.ets-value .section-heading p {
    font-family: 'MavenPro-Medium';
}

.mission-card-box.value-text {
    background: #239088;
    padding: 25px;
    border-radius: 10px;
    height: auto !important;
    color: #fff;
}

    .mission-card-box.value-text h5 {
        font-family: 'MavenPro-Bold';
        font-size: 20px;
        margin-bottom: 20px;
    }

    .mission-card-box.value-text p {
        font-family: 'MavenPro-Regular';
        font-size: 16px;
        margin-bottom: 20px;
    }

    .mission-card-box.value-text li {
        font-family: 'MavenPro-Regular';
        font-size: 16px;
        margin-bottom: 20px;
        padding-left: 5px !important;
    }

.all-book-result .card {
    color: #000 !important;
    border-radius: 15px !important;
}

.book-result .section-heading h1 {
    color: #000;
}

.filter-3 {
    background-color: #ededed;
    padding: 25px 20px;
    border-radius: 5px;
}

.input-bg {
    width: 140px;
    margin-right: 20px;
}

.book-result .input-bg label {
    font-size: 16px;
    font-family: 'MavenPro-SemiBold';
    margin-bottom: 10px;
}

.book-result .input-bg select {
    background-color: #cccccc;
    font-weight: bold;
    border-radius: 5px;
    border: none;
}

.book-result .card img {
    background: #239088;
    padding: 25px;
}

.book-result .card strong {
    color: #d6d6d6;
    font-size: 14px;
    font-weight: normal !important;
    margin-right: 15px;
}

.book-result .card-title {
    font-size: 15px;
    font-family: 'MavenPro-SemiBold';
    margin-bottom: 15px;
}

.card-body .text-muted {
    margin-bottom: 0px !important;
}

.card-text br {
    margin-bottom: 5px;
}

.all-book-result {
    margin: 30px 0px;
}

.book-result .pagination-container {
    display: none;
}

.section-heading.faq-heading h1 {
    color: #000;
    margin-bottom: 40px;
}

.faqssection {
    margin-bottom: 80px;
}

    .faqssection .accordion-item,
    .faqssection .accordion-button {
        background-color: rgb(245, 245, 245);
        border: none;
        box-shadow: none;
        border-radius: 10px !important;
    }

.accordion-item {
    margin-bottom: 10px;
}

.accordion-collapse.show {
    padding-bottom: 0px;
}

.accordion-body {
    padding-top: 5px;
}

    .accordion-body p {
        margin-bottom: 10px;
    }

    .accordion-body ul {
        padding-left: 10px;
    }

    .accordion-body li {
        padding-bottom: 10px;
    }

.accordion-button.collapsed {
    padding: 25px 20px;
}

.mission-card-box.value-text ul {
    padding-left: 15px;
}

.dropdown-toggle::after {
    display: none;
}

.expandable .sub-menu {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    padding-left: 20px;
}

.expandable .menu-expandable-header {
    display: flex;
    justify-content: space-between;
    cursor: pointer;
}

.expandable.open .sub-menu {
    display: block;
}

.expand-icon {
    font-size: 20px;
    font-weight: bold;
}

.menu-nav.expand {
    border: 1px solid #FFFFFF4D !important;
    border-radius: 30px !important;
    width: 90% !important;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    margin-bottom: 20px !important;
}

    .menu-nav.expand ul {
        padding-left: 0px;
    }

.menu-expandable-header {
    padding: 10px 20px !important;
}

.menu-item.expandable .sub-menu li {
    border-bottom: 1px solid #FFFFFF4D;
}

    .menu-item.expandable .sub-menu li:first-child {
        border-top: 1px solid #FFFFFF4D;
    }

    .menu-item.expandable .sub-menu li:last-child {
        border-bottom: none;
    }

#workshop-from .left-form-text {
    padding-right: 20px;
    align-self: center !important;
}

.modal-dialog.modal-dialog-centered.modal-xl {
    max-width: 80% !important;
}

.image-container {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 30px;
    padding: 10px;
    flex-wrap: wrap;
}

.image-box {
    flex: 1 1 calc(25% - 30px);
    position: relative;
    overflow: hidden;
    height: 250px;
}

    .image-box img {
        aspect-ratio: 4/3;
        border-radius: 5%;
        width: auto;
        height: 100% !important;
        object-fit: cover;
    }

.overlay-icon {
    opacity: 1;
    position: absolute;
    top: 90%;
    left: 8%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 36px;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

/* Show icon on hover */
.image-box:hover .overlay-icon {
    opacity: 1;
}

.image-box img {
    filter: brightness(0.8) contrast(0.8) saturate(0.6);
    transition: filter 0.3s ease;
}

.image-box:hover img {
    filter: brightness(0.8) contrast(0.8) saturate(0.6);
}

/* photo gallery section */

.overlay-text {
    position: absolute;
    bottom: 10px;
    left: 10px;
    color: white;
    font-size: 20px;
    font-weight: bold;
    text-align: left;
    padding: 10px;
}


.news-img-gallery:hover {
    opacity: 0.9;
}


.carousel-control-next,
.carousel-control-prev {
    width: 5% !important;
}

.ratio.ratio-16x9 {
    background-color: #13070700 !important;
}

.image-box img {
    width: 100%;
}

.image-box {
    flex: 1 1 calc(30% - 30px);
    position: relative;
    overflow: hidden;
    height: 300px;
}

.image-container {
    gap: 20px;
}

.image-box video {
    aspect-ratio: 4/3;
    border-radius: 5%;
    width: auto;
    height: 100% !important;
    object-fit: cover;
    filter: brightness(0.8) contrast(0.8) saturate(0.6);
    transition: filter 0.3s ease;
}

.image-box {
    flex: 1 1 calc(30% - 30px);
    position: relative;
    overflow: hidden;
    height: 300px;
    transition: all .5s ease;
}

    .image-box:hover {
        transform: scale(0.9);
    }

.carousel-item.active img {
    width: 90% !important;
    max-width: 100% !important;
}


.media-news.slider.section-padding.galler-photo .news-box {
    padding: 0px;
    position: relative;
}

#u-tool.about-exhibition {
    background: none;
    background-color: rgb(204, 204, 204);
}

#u-tool p {
    color: #000;
    font-size: 26px;
    line-height: 29px;
}








/* step form start */

.step {
    display: none;
}

    .step.active {
        display: block;
    }

.btn-disabled {
    pointer-events: none;
    opacity: 0.6;
}

.btn-group {
    display: flex;
    justify-content: space-between;
}

.step-indicator {
    display: flex;
    justify-content: space-between;
}

    .step-indicator .step-number {
        color: #fff;
        /* width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center; */
    }

        .step-indicator .step-number.active {
            background-color: #28a745;
        }

        .step-indicator .step-number.completed {
            background-color: #007bff;
        }

.step-section-1 .exhibitions-img {
    width: 100%;
    height: 110px;
}

.step-section-1 .exhibitions-text {
    margin-top: 25px;
    display: block;
    text-align: center;
}

.top-step {
    background-color: rgba(16, 110, 150, 1);
    padding: 50px 0px;
}

.step-indicator .step-number.active {
    background-color: rgb(19, 128, 175);
    padding: 15px;
    border-radius: 5px;
}

.step-number {
    font-size: 16px;
    font-family: 'MavenPro-Bold';
    align-self: center;
}

    .step-number span {
        font-size: 14px;
        font-family: 'MavenPro-Regular';
    }

.step .exhibitions-card-box {
    background-color: rgba(221, 221, 221, 1);
    padding: 20px 20px;
}

.step {
    margin: 100px 0px;
}

    .step h1 {
        text-transform: uppercase !important;
        font-size: 45px;
        margin-bottom: 50px;
    }

.step-form button {
    background-color: rgb(19, 128, 175);
    color: #fff;
    font-family: 'MavenPro-Medium';
    display: block;
    text-align: center;
    padding: 10px 35px;
    font-size: 20px;
    border-radius: 50px;
    margin-top: 100px;
    outline: none;
    border: none;
}

.exhibitions-text h6 {
    color: #000;
    margin-top: 2px;
    margin-bottom: -5px;
    font-size: 12px;
}

.step .news-heading {
    font-size: 16px;
    font-family: 'MavenPro-Bold';
    color: #000;
    margin-bottom: 0px;
}

.butonrow {
    display: flex;
}

    .butonrow .btn.btn-secondar {
        margin-right: 20px;
    }

#continue-1:hover {
    background-color: rgb(19, 128, 175);
}

.butonrow .btn:hover {
    color: #fff;
}


.step-indicator svg {
    align-self: center;
    padding: 0px 21px;
}
/* step form end */
























































/*====Media Quereis===*/
@media(min-width: 2600px) {
    .home-banner .news-box.swiper-slide {
        width: 400px !important;
    }
}

@media(min-width: 1680px) {
}

@media(min-width: 1560px) {
}

@media(min-width: 1440px) {
    .right-form-text-register {
        padding: 0px 0px 0px 130px !important;
    }
}

@media(min-width: 1280px) {
}

@media(max-width: 1439.98px) {
    .events .event-heading h3 {
        font-size: 18px;
    }

    .home-banner .slick-prev {
        right: 9% !important;
    }

    .about-text-sty .left-text,
    .about-text-sty .right-text {
        padding-right: 20px;
    }

    .left-form-text {
        padding-right: 0px;
        align-self: center;
    }

        .left-form-text p {
            font-size: 22px;
            line-height: 28px;
        }

    .workshopbanner h1 {
        font-size: 32px;
        line-height: 48px;
        margin-bottom: 60px;
        margin-top: 5px;
    }

    .person-detail-text {
        padding-left: 70px;
        align-self: center;
    }

    .network-join .join-box .icon-box {
        padding: 20px 18px;
        width: 140px;
    }

    .step-number span {
        font-size: 11px;
    }
}

@media (max-width: 1365.98px) {

    .col-md-5.right-form-text-register {
        padding: 0px 0px 0px 70px !important;
    }
}

@media(max-width: 1279.98px) {
    .container {
        max-width: 98%;
    }

    .section-heading {
        font-size: 32px;
    }

    .events .event-heading h3 {
        font-size: 20px;
    }

    .workshopbanner h1 {
        font-size: 32px;
        line-height: 37px;
        margin-bottom: 60px;
        margin-top: 5px;
    }
}

@media (max-width: 1151.98px) {
    .image-box {
        flex: 1 1 calc(33.33% - 30px);
        /* 3 images per row */
    }
}

@media (max-width: 1023.98px) {
    .signup .container,
    .login .container,
    .forget-password .container,
    .reset-password .container {
        padding: 20px 15px !important;
    }

    .signup-form {
        padding-right: 50px !important;
    }

    .left-image {
        align-self: center;
    }

    .about-iamg-text.initiatives-muktab {
        padding: 50px 20px !important;
    }

    .initiatives-muktab img {
        margin-bottom: 40px;
    }

    .col-md-5.right-form-text-register {
        padding: 0px 0px 0px 25px !important;
    }

    .network-detail h6 {
        font-size: 25px;
        line-height: 48px;
        margin-bottom: 20px;
        color: #fff;
    }

    .person-detail-text {
        padding-left: 30px;
        align-self: center;
    }

    .person-det-img img {
        width: 100%;
        height: auto !important;
    }

    .timeline-section {
        display: none;
    }

    .about-etiheidgn {
        margin-bottom: 20px;
        font-size: 25px;
        font-family: 'MavenPro-Bold';
        color: white;
        padding-right: 0px;
        text-align: left;
    }

    .col-lg-7.about-text-sty.about-right-sub {
        padding-left: 0px;
    }

    .webfooter {
        padding: 20px;
    }

    .spon-left {
        padding-right: 0px;
    }

    .about-award {
        margin-bottom: 20px;
    }

    #about-deat {
        padding: 50px 20px;
    }

        #about-deat .ablut-img {
            padding: 0;
        }

    .about-etiheidgn {
        margin-bottom: 0px;
    }

    .ets-value.section-padding {
        padding-bottom: 0;
    }

    .step-indicator svg {
        display: none;
    }

    .step-number span {
        font-size: 11px;
        font-family: 'MavenPro-Regular';
    }

    .step-section-1 .exhibitions-img {
        width: 100%;
        height: 100%;
    }

    #u-tool p {
        color: #000;
        font-size: 20px;
        line-height: 26px;
    }
}

@media (max-width: 991.98px) {
    .signup-form {
        padding-right: 10px !important;
    }

    .btn-primary.singupsumit {
        padding: 16px 20px;
    }

    .alredylogin p {
        font-size: 12px;
    }

    #passwordError {
        font-size: 10px;
    }

    .forget-password h1 {
        font-size: 30px;
        margin-top: 15px;
    }

    .navbar-custom .navbar-nav {
        text-align: center;
    }

    .navbar-custom .btn-support,
    .navbar-custom .btn-join {
        margin: 5px 0;
    }

    .navbar-custom .icon-button {
        margin: 5px 0;
    }

    .first-nav {
        display: none !important;
    }
    /* .first-nav, .second-nav {
        display: none;
    } */
    .initiatives {
        padding: 20px 30px;
        border-radius: 20px;
    }

        .initiatives .text p,
        .slider .text p {
            margin: 10px 0 20px;
        }

    .events .event-heading h3 {
        font-size: 20px;
        height: 45px;
    }

    .books-tabs .tab img {
        margin: 0;
    }

    .overlay-menu {
        position: absolute;
        height: auto;
        background: none;
        display: flex !important;
    }

    .desktopmenu {
        display: none;
    }

    .mobile-menu {
        display: block;
    }

        .mobile-menu .menu-panel {
            position: fixed;
            top: 0;
            right: -100%;
            width: 100%;
            height: 100vh;
            background-color: rgba(0, 0, 0, 0.9); /* semi-transparent dark background */
            color: #fff;
            background-image: url('images/tab-5.jpeg'); /* Replace with your background image URL */
            background-size: cover;
            background-position: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: start;
            transition: right 0.3s ease;
            z-index: 9999;
        }

        .mobile-menu .menu-toggler {
            display: block;
            position: relative;
            right: -5px;
            background: none;
            border: none;
            color: #fff;
            font-size: 2rem;
            z-index: 10000;
        }

        /* Custom close icon styling for mobile */
        .mobile-menu .menu-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
            padding: 25px;
        }

        .mobile-menu .menu-logo img {
            max-width: 100px;
            height: auto;
        }

        .mobile-menu .close-icon .material-icons,
        .mobile-menu .close-icon svg {
            color: #fff;
            font-size: 0rem;
            cursor: pointer;
        }
        /* Menu items styling */
        .mobile-menu .menu-nav {
            list-style: none;
            padding: 0;
            margin: 0;
            width: 90%;
            text-align: center;
            border: 1px solid rgba(255, 255, 255, 0.3);
            border-radius: 15px;
        }









            .mobile-menu .menu-nav li:last-child a {
                border: none !important;
            }

            .mobile-menu .menu-nav .menu-item {
                margin: 0.5rem 0;
            }

            .mobile-menu .menu-nav .menu-link {
                color: #fff;
                font-size: 17px;
                font-weight: 600;
                padding: 14px 0px;
                text-decoration: none;
                border-bottom: 1px solid #FFFFFF4D;
                display: block;
                /* font-family: 'MavenPro-Bold';  */
                text-transform: uppercase;
            }

    .language span {
        color: #fff !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        text-transform: uppercase;
    }

    .dashbor-login,
    .dashbor-not-login {
        border: 1px solid #FFFFFF4D;
        border-radius: 30px;
        width: 90%;
        text-align: center;
        color: #fff !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        text-transform: uppercase;
        margin-bottom: 10px;
    }

        .dashbor-login a,
        .dashbor-not-login a {
            color: #fff !important;
            font-size: 17px !important;
            font-weight: 600 !important;
            text-transform: uppercase;
            padding: 0px !important;
        }

        .dashbor-login a {
            display: block;
            padding: 15px 15px 10px !important;
            margin-bottom: 0px;
        }

        .dashbor-not-login a:first-child {
            padding: 15px 0px 10px !important;
            display: inline-block;
        }

        .dashbor-login svg,
        .dashbor-not-login svg {
            margin-bottom: 5px;
            margin-right: 5px;
        }

    .mobile-menu .menu-panel.open {
        right: 0;
    }

    .web-header .material-icons {
        color: white;
        border-radius: 50px;
        font-size: 45px;
        background-color: transparent;
    }

    .col-6.col-md-10.d-flex.justify-content-center.align-items-center {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .mobile-menu {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .menu-toggler {
        background: none;
        border: none;
        font-size: 2rem;
        color: #fff;
    }

    .mobile-menu .language {
        width: 90%;
        display: flex;
        margin: 15px 0px;
    }

    .eng,
    .ar {
        width: 50%;
        text-align: center;
    }

        .eng a,
        .ar a {
            display: block;
            padding: 15px;
        }

    .eng {
        border: 1px solid #FFFFFF4D;
        border-top-left-radius: 32px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-bottom-left-radius: 32px;
    }

    .ar {
        border: 1px solid #FFFFFF4D;
        border-top-left-radius: 0px;
        border-top-right-radius: 32px;
        border-bottom-right-radius: 32px;
        border-bottom-left-radius: 0px;
        border: 1px solid #FFFFFF4D
    }

    .mobile-menu .active-lang {
        background: #FFFFFF1A;
    }

    .menu-logo img {
        width: 85% !important;
        max-width: 100% !important;
    }

    .support-join-section .icon-box {
        display: inline-block;
        margin: 10px;
        padding: 15px 19px;
        text-align: center;
        border: 1px solid white;
        width: 100%;
        text-align: left;
    }

    .icon-box br {
        display: none;
    }

    .icon-box svg {
        width: 20px;
        height: 20px;
        margin-bottom: 8px !important;
    }

    .support-join-section .icon-box {
        padding: 15px 19px;
        border: 1px solid white;
        width: 100%;
        text-align: left;
        margin: auto;
        margin-bottom: 17px;
        border-radius: 50px;
    }

    .join-box {
        text-align: left;
    }

    .web-log {
        padding-right: 0px !important;
    }

    .webfooter {
        padding: 10px !important;
    }

    .row.text-white.copyright {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .insiper {
        display: none;
    }

    .row.text-white.copyright br {
        display: block;
    }

    .copyright p br {
        display: block;
    }

    .project-btn.text-lg-center {
        margin-top: 20px;
    }

    .col-lg-2.ccont {
        display: none;
    }

    .events.slider.section-padding .view-all-btn {
        width: max-content;
    }

    .webfooter {
        padding: 60px 0px !important;
    }

    .copyright a {
        text-decoration: underline !important;
    }

    .about-text-sty {
        margin-top: 40px;
    }

    .ablut-img {
        text-align: center;
    }

    .inner-banner h1 {
        font-size: 48px;
        margin-bottom: 30px;
        margin-top: 15px;
    }

    .about-exhibition-detail .about-exbhi {
        padding-left: 10px;
        margin-top: 20px;
    }

    .bread-cram {
        font-size: 20px;
        margin-bottom: 0px;
        margin-top: 0px;
    }

    .workshopbanner h1 {
        font-size: 26px !important;
        line-height: 31px;
        margin-bottom: 60px !important;
        margin-top: 10px !important;
    }

    .col-md-5.right-form-text-register {
        padding: 0px 0px 0px 0px !important;
    }

    .event-details p {
        margin-bottom: 20px;
        font-size: 14px;
    }

    .all-person-network-heigh {
        height: auto !important;
        margin-top: 50px;
        margin-bottom: 30px;
    }

    .network-detail h1 {
        margin-bottom: 0px !important;
        font-size: 40px !important;
        line-height: 30px;
    }

    #about-deat,
    .media-news.slider.section-padding {
        z-index: 0;
    }

    .work-register .left-form-text {
        padding-right: 0px;
        align-self: start !important;
    }

    .right-form-text-register {
        padding: 0px;
    }

    .about-award {
        padding-right: 0px;
    }

    .span-text {
        height: auto;
    }

    .sponsor img {
        margin-top: 20px;
        margin-bottom: 50px;
    }

    #all-list-person .col-md-1.filter-3 {
        display: none;
    }

    .mobile-menu .menu-panel::after {
        content: "";
        position: absolute;
        /* top: 0; */
        /* bottom: 0; */
        left: 0;
        right: 0;
        z-index: -1;
        width: 100%;
        background: linear-gradient(0deg, rgba(20, 20, 20, 0.7), rgba(20, 20, 20, 0.7)), linear-gradient(180deg, rgba(0, 115, 47, 0) 0%, rgba(0, 115, 47, 0.2) 100%), linear-gradient(360deg, rgba(0, 0, 0, 0) 66.94%, rgba(0, 0, 0, 0.2) 100%);
        height: 168vh;
    }

    .image-box {
        flex: 1 1 calc(50% - 30px);
    }

    .image-box {
        flex: 1 1 calc(1000% - 30px);
    }

    .modal-dialog.modal-dialog-centered.modal-xl {
        max-width: 100% !important;
    }

    .btn-close.position-absolute.top-0.end-0.p-3 {
        margin-top: -60px;
    }
}

@media (max-width: 767.98px) {
    .signup.fixheight,
    .login.fixheight,
    .forget-password.fixheight,
    .reset-password.fixheight {
        height: auto;
    }

    .signup-form {
        margin: 40px 0px;
    }

    .btn-primary.singupsumit {
        padding: 16px 17px;
        font-size: 11px;
    }

    .forget-password .btn-primary.singupsumit,
    .reset-password .btn-primary.singupsumit {
        padding: 11px 35px !important;
        line-height: 23px;
        font-size: 14px;
    }

    .welomc {
        margin-right: 0px;
        align-self: center;
    }

    .profilerigh {
        justify-content: space-between !important;
    }

    .btn-profile,
    .btn-logout {
        padding: 9px 13px;
        font-size: 12px;
    }

    .profileimage {
        width: 60px;
    }

    .dasbord {
        padding: 0px 5px;
    }

    .alert-toast {
        width: 330px !important;
        max-width: 330px !important;
        right: auto;
        left: 50%;
    }

    .select2.select2-container.select2-container--default.select2-container--focus {
        width: 100% !important;
    }

    .select2.select2-container.select2-container--default.select2-container--below.select2-container--focus,
    .select2.select2-container.select2-container--default.select2-container--below.select2-container--focus {
        width: 100% !important;
    }

    .section-padding {
        padding: 50px 8px;
    }

    .home-banner {
        padding-top: 100px;
    }

    .events .event-heading h3 {
        font-size: 18px;
    }

    .initiatives {
        padding: 20px;
    }

    .events .event-box {
        margin: 10px;
    }

    .books-tabs .medium img {
        width: 100px;
        height: 60px;
    }

    .books-tabs .tab.active img {
        width: 150px !important;
        height: 75px !important;
    }

    .books-tabs .small img {
        width: 80px;
        height: 45px;
    }

    .books-tabs {
        margin-top: -35px;
    }

    .reasons-inner {
        display: block !important;
    }

    .event-box .register {
        padding: 14px;
    }

    .news-box {
        padding: 10px;
    }

        .news-box .news-text {
            left: 30px;
            width: 85%;
        }

    .home-banner .news-text p {
        background-color: #00000080;
        padding: 10px 20px;
        position: absolute;
        top: -55px;
        left: -20px;
        border-radius: 0 20px 20px 0px;
    }

    .col-md-2.ccont {
        display: none;
    }

    .event-heading {
        height: 80px;
    }

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

    .media-news.slider.section-padding {
        padding-bottom: 0px;
    }

    .support-join-section {
        padding: 30px 0px;
    }

    .webfooter {
        padding-top: 50px !important;
    }

    .slider-button-wrap.d-flex.justify-content-center {
        display: none !important;
    }

    .news-box .news-img img {
        height: 190px !important;
    }
    /* .home-banner.section-padding {
        margin-top: 50px;
        z-index: 0;
    } */
    #menuContent {
        overflow: scroll;
        padding-bottom: 25px;
    }

    .home-banner.section-padding {
        margin-top: -130px;
        z-index: 0;
        height: 100vh;
    }

    .about-iamg-text.about-initiatives {
        padding: 50px 0px;
    }

    .book-right-text h1 {
        font-size: 21px;
        margin-bottom: 0px;
        margin-top: 20px;
    }

    .book-right-text {
        padding-left: 15px;
    }

        .book-right-text p {
            margin: 15px 0px 40px;
        }

    .right-book .book-right-text {
        padding-left: 10px;
        padding-right: 10px;
    }

    .container.ourmis-layer {
        padding: 5px;
    }

    .content-text {
        font-size: 14px;
    }

    .event-training .right-list {
        padding-left: 10px;
    }

    .event-training .left-list {
        padding-right: 10px;
    }

    #workshopModal .modal-dialog {
        width: 95%;
        margin: auto;
    }

    #editionsModal .modal-body, #workshopModal .modal-body {
        padding: 30px;
        border-radius: 50px !important;
        padding-top: 15px;
    }

    .exhibitions-img {
        width: 100%;
        height: auto;
    }

    .exhibitions {
        padding: 50px 0px;
    }

    .inner-banner.section-padding.news-banner h1 {
        font-size: 18px;
    }

    .bread-cram {
        font-size: 20px;
        margin-top: 100px;
        color: #fff;
    }

    .filter-container .col-md-4 {
        margin-bottom: 14px;
    }

    .filter-container .col-md-3 {
        margin-bottom: 4px;
    }

    .all-person-network .card img {
        width: 100%;
        height: 415px !important;
        border-radius: 10px;
    }

    .all-person-network .card {
        background-color: transparent !important;
        color: white;
        border: none;
        height: auto !important;
    }

    .network-join .join-box {
        text-align: left;
        margin-top: 26px;
    }

        .network-join .join-box .icon-box {
            padding: 18px 25px;
            width: 150px;
        }

    .work-register .left-form-text {
        padding-right: 0px;
        padding-left: 0px;
        margin-bottom: 0px;
    }

    .register-form .first-nam {
        padding: 0px 10px
    }

    .register-form .last-nam {
        padding: 0px 10px
    }

    .register-form .btn-contact {
        width: 60%;
    }

    .cont-mapps {
        padding: 0;
    }

    #person-detailll h2 {
        font-weight: 800;
        font-size: 25px;
        font-family: 'MavenPro-Bold';
        color: white;
        text-transform: uppercase !important;
        margin-bottom: 26px;
    }

    #person-detailll {
        padding: 50px 0px;
    }

    .all-person-network .card {
        margin-bottom: 10px;
    }

    .reasons.section-padding.book-lis .col-md-12 {
        padding: 0px;
    }

    .book-list-btn.d-flex a {
        font-size: 12px;
        padding: 11px 10px;
        margin-right: 10px;
        background: rgba(8, 54, 74, 1);
        border-radius: 5px;
    }

    .book-lis h2 {
        font-size: 25px;
    }

    .network-join .join-box .icon-box {
        padding: 15px 25px 9px;
        width: 150px;
    }

    .second-est-nav {
        padding: 10px 0px;
    }

    .etisalat-awaid-banner.section-padding h1 {
        font-size: 23px;
        text-transform: uppercase;
        margin-bottom: 44px;
    }

    .text-white.youtube-icon.etis-link {
        font-size: 18px;
        font-weight: 500;
    }

    .ets-value .section-heading h1 {
        margin-bottom: 15px;
        font-size: 40px;
        font-family: 'MavenPro-Bold';
        color: #000;
    }

    .mission-card-box.value-text h5 {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .all-book-result .col-md-4.col-lg-3 {
        padding: 0;
    }

    .book-result.section-padding {
        padding-bottom: 0;
    }

    .ets-value.section-padding,
    #all-book-result {
        z-index: 0;
    }

    #workshop-from .left-form-text p {
        padding-bottom: 50px !important;
    }

    #workshop-from .left-form-text {
        padding-right: 0px;
        align-self: start !important;
    }

    .col-md-6.text-lg-end.d-flex.align-items-center.justify-content-end.image-gallery {
        justify-content: start !important;
        margin-top: 10px;
    }

    .media-news.slider.section-padding {
        padding-bottom: 50px;
    }

    .image-box video {
        width: 100% !important;
    }

    .galler-photo .col-md-6.text-lg-end.d-flex.align-items-center.justify-content-end {
        margin-top: 20px;
        justify-content: left !important;
    }

    .media-news.slider.section-padding.galler-photo .news-box {
        padding: 0px;
        position: relative;
        margin-bottom: 30px;
    }
}

@media (max-width: 575.98px) {
    .btn-primary.singupsumit {
        padding: 11px 11px !important;
        line-height: 20px;
    }

    .form-check {
        margin-bottom: 18px;
    }

    .login .singupsumit {
        padding: 11px 35px !important;
        font-size: 14px;
    }

    .sitelogo img {
        width: 60%;
    }

    .forget-password h1,
    .reset-password h1 {
        font-size: 25px;
        margin-top: 15px;
    }

    .top-bar-dash,
    .dasbord {
        margin: 0px 5px;
    }

    .dashbords .btn-primary.singupsumit {
        padding: 11px 40px !important;
        line-height: 20px;
    }

    .tabledesign th,
    .tabledesign td {
        min-width: 210px !important;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .searchbr input {
        width: 40%;
    }

    .welomc h4 {
        font-size: 18px;
    }

        .welomc h4 span {
            display: block;
        }

    .formm-box {
        padding: 20px 0px;
    }

    .dasbord {
        margin-bottom: 40px;
    }

    .formm-box.fmainheading.add-author h2 {
        font-size: 20px !important;
        margin-bottom: 0px !important;
    }

    .formm-box.fmainheading.add-author .col-8.col-md-8 {
        align-self: center;
    }

    .backlis .singupsumit {
        font-size: 16px;
    }

    .dashbords.backlis {
        padding: 5px;
    }

    #dataTable_paginate a, #submitbook_paginate a, #archives_paginate a {
        margin: 0px 3px;
        padding: 10px 10px;
        background-color: white;
        border: 1px solid #80808082;
        border-radius: 4px;
        color: #CCCCCC;
        text-decoration: none;
    }

    .row.tablefirststar {
        margin-left: -4px;
    }

    #dataTable_paginate {
        margin-bottom: 20px;
    }

    h2.sub-book-he {
        font-size: 19px !important;
        margin-bottom: 20px;
    }

    .btn-profile.autherbt.sub-newobk {
        padding: 19px 10px !important;
    }

    .row.inner-row {
        padding-right: 5px;
        margin-left: -1px;
    }

    .home-banner h1 {
        font-size: 23px;
        margin-top: 100px;
    }

    .home-banner h4 {
        font-size: 18px;
        padding-right: 0px;
        margin-top: 22px;
        line-height: 21px;
    }

    .spotlight-row .section-heading {
        padding-left: 11px;
    }

    .news-box .news-text {
        left: 15px;
        width: 85%;
    }

    .events .swiper-slide {
        height: auto !important;
    }

    .register-btn {
        position: relative;
        bottom: 0px;
        left: 0;
        right: 0;
        text-align: center;
        width: 90%;
        margin: auto;
    }

    .news-box .news-text {
        bottom: 33px;
        width: 90%;
    }

    .initiatives {
        width: 100%;
        margin: auto;
    }

    .btn-outline {
        padding: 15px 30px;
    }

    .books-made .heading-text p {
        line-height: 16px;
        padding: 0px 0px !important;
    }

    .events .event-heading h3 a {
        font-family: 'MavenPro-Bold';
        line-height: 24px;
        font-size: 18px !important;
    }


    /* Container for scrollable content */
    .books-tabs {
        display: flex;
        overflow-x: auto;
        gap: 10px;
        padding: 10px 20px; /* Add padding on the left and right */
        scrollbar-width: thin;
        scroll-snap-type: x mandatory; /* Ensure snapping to each item */
        -webkit-overflow-scrolling: touch; /* Smooth scrolling on mobile */
    }

        /* Active tab styling */
        .books-tabs .tab.active img {
            width: 200px !important;
            height: 90px !important;
        }

        /* Default image styling */
        .books-tabs img {
            display: block;
            max-width: 100%;
        }

    /* Small and medium tab widths */

    .tab {
        flex: 0 0 130px;
        text-align: center;
        margin: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        scroll-snap-align: center;
        margin: 0px 10px 20px;
    }

    /* Ensures consistent image size */
    .books-tabs .small img,
    .books-tabs .medium img {
        width: 170px !important;
        height: 80px !important;
    }

    /* Hide scrollbar on WebKit browsers for cleaner appearance */
    .books-tabs::-webkit-scrollbar {
        display: none;
    }

    #tab-image-5 {
        margin-left: 400px;
    }

    .tabs-img {
        margin-left: -25px;
        margin-right: -25px;
    }

    .media-content {
        margin: 50px auto;
    }

        .media-content .news-box .news-img img {
            height: 350px !important;
        }

    .icon-box small {
        font-size: 16px;
    }

    .webfooter .fourt-colom {
        order: -1;
    }

    .webfooter .web-log {
        display: none;
    }

    .webfooter {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .bg-white.opacity-50 {
        margin: 0;
    }

    .books-made.section-padding {
        overflow: hidden;
    }

    .webfooter p {
        font-size: 16px;
        line-height: 24px;
    }

    .webfooter {
        padding: 50px 0px 10px !important;
    }

    .slider-button-wrap {
        display: none !important;
    }

    .project-btn {
        text-align: left !important;
        padding-right: 0px;
    }

    .home-banner .swiper-signposting {
        padding-left: 15px;
    }

    .events.slider.section-padding .col-lg-4.text-lg-end.d-flex.align-items-center.justify-content-end {
        justify-content: left !important;
    }

    .events .event-box {
        margin-left: 0px !important;
    }

    .inner-banner.section-padding {
        margin-top: -130px;
        z-index: 0;
        padding-bottom: 70px;
    }

    .inner-banner h1 {
        font-size: 21px;
        margin-bottom: 40px;
        margin-top: 100px;
        line-height: 23px;
    }

    .ourmission,
    .teamsection,
    .about-iamg-text {
        padding: 50px 0px;
    }

    .ibby {
        padding: 50px 0px;
    }

    .section-heading h1 {
        margin-bottom: 0px;
        font-size: 30px;
    }

    .btn-outline-light {
        color: #f8f9fa;
        border-color: #f8f9fa;
        border-radius: 50px;
        padding: 5px 12px;
        font-size: 11px;
        font-weight: 600;
    }

    .inner-banner-button a {
        margin-right: 3px;
    }

    .about-text-sty .left-text, .about-text-sty .right-text {
        padding-right: 15px;
    }

    .slider-herdig h1 {
        font-size: 24px;
        margin-top: 20px;
    }

    .teamsection .news-heading a {
        font-size: 16px !important;
    }

    .teamsection .news-text p {
        font-size: 12px;
    }

    .mission-card-box {
        padding: 10px;
    }

    .section-heading h1 {
        margin-bottom: 10px;
        font-size: 30px;
    }

    .book-right-text p {
        margin: 15px 0px 25px;
    }

    .book-box.left-book, .book-box.right-book {
        margin-bottom: 50px;
    }

    .about-iamg-text.initiatives-muktab {
        padding: 50px 0px !important;
    }

    .initiatives-muktab img {
        width: 130px !important;
        height: 140px !important;
    }

    .editions {
        padding: 50px 0px;
    }

    #editionsModal .modal-body {
        padding: 30px;
        border-radius: 50px !important;
    }

    #editionsModal .modal-dialog.modal-lg {
        width: 90%;
        margin: auto;
    }

    .top-bar-dash, .dasbord {
        margin: 0px 0px !important;
    }
    /* .bodybg.webpage {
        width: 99% !important;
    } */
    #editionsModal .modal-body, #workshopModal .modal-body {
        padding: 30px;
        border-radius: 50px !important;
        padding-top: 15px;
    }

    .about-exhibition-detail .about-exbhi {
        margin-top: 30px;
    }

    .file-down.d-flex {
        padding: 15px 15px;
    }

    .file-down .material-symbols-outlined {
        font-size: 25px;
        margin-right: 20px;
    }

    .file-down h6 {
        font-size: 12px;
    }

    .photo-gallery-sldier .col-lg-6.text-lg-end.d-flex.align-items-center.justify-content-end {
        justify-content: left !important;
    }

    .photo-gallery-sldier .media-content .news-box .news-img img {
        height: 270px !important;
    }

    .photo-gallery-sldier .row.align-items-center.mb-5.animate__animated.animate__zoomIn.animate__delay-2s {
        margin-bottom: 0px !important;
    }

    .photo-gallery-sldier .media-content {
        margin: 31px auto 0px;
    }

    .photo-gallery-sldier .view-btns {
        margin-top: 10px;
    }

    .media-content .news-box .news-img img {
        height: 270px !important;
    }

    .media-news.slider .media-content {
        margin-top: 20px;
    }

    .media-news .news-box h3 {
        font-size: 16px;
        font-weight: bold;
    }

    .media-news .row.justify-content-center.media-content .col-md-12,
    .photo-gallery-sldier .row.justify-content-center.media-content .col-md-12 {
        padding-left: 0px;
    }

    .news-box .news-text {
        bottom: 33px;
        width: 85%;
    }

    .mobile-viewbuton {
        justify-content: left !important;
    }

        .mobile-viewbuton .view-btns {
            margin-top: 20px;
        }

    .mobile-marign {
        margin: 0px;
    }

    .pdf-img img {
        min-width: 260px;
        min-height: auto;
    }

    .photo-gallery-sldier .media-content .news-box .news-img img {
        height: 200px !important;
    }

    .workshopbanner h1 {
        font-size: 21px !important;
        line-height: 24px !important;
        margin-bottom: 35px !important;
        margin-top: 10px !important;
    }

    .left-form-text {
        padding-right: 0px;
        padding-left: 0px;
        margin-bottom: 49px;
    }

        .left-form-text p {
            font-size: 18px !important;
            line-height: 25px;
        }

    .register h5 {
        color: #fff;
        font-size: 30px;
        font-family: 'MavenPro-SemiBold';
        margin-bottom: 10px;
    }

    .event-details p {
        margin-bottom: 15px;
        font-size: 16px !important;
    }

    .event-details {
        padding: 35px 15px;
    }

    .add-calendar {
        padding: 25px 15px;
    }

    .register {
        padding: 20px 15px;
    }

    .col-md-6.text-lg-end.d-flex.align-items-center.justify-content-start.justify-content-md-end {
        margin-top: 20px;
    }

    .network-detail h1 {
        margin-bottom: 0px !important;
        font-size: 23px !important;
        line-height: 21px !important;
    }

    .network-detail h6 {
        font-size: 18px;
        line-height: 38px;
        margin-bottom: 15px;
        color: #fff;
    }

    .person-detail-text {
        padding-left: 10px;
        align-self: left;
        margin-top: 50px;
    }

    .perso-text p {
        font-size: 16px;
    }

    .all-person-network-heigh {
        margin-right: 0px !important;
        margin-left: 0px;
    }

    .action-box.uaebby p {
        margin-bottom: 15px;
    }

    .action-box.etisalat p {
        margin-bottom: 15px;
    }

    .about-text-sty {
        margin-top: 10px;
    }

    .book-right-text h1 {
        font-size: 21px;
        margin-bottom: 20px;
        margin-top: 20px;
    }

    .left-book .book-right-text {
        padding-left: 10px;
    }

    .reasons.section-padding.media-centerss {
        height: auto !important;
    }

    .nav-tabs .nav-link {
        padding: 15px 15px;
        font-size: 14px !important;
        margin-right: 20px;
        margin-bottom: 20px;
    }

    .about-award {
        padding-right: 20px;
        padding-left: 20px;
    }

    .about-text-sty {
        margin-top: 10px !important;
    }

    #about-deat {
        padding: 50px 10px;
    }

    .value-award h2 {
        font-size: 30px;
        margin-bottom: 20px;
        margin-top: -15px;
        color: #fff;
    }

    #press {
        padding: 0px;
        width: 100%;
        margin: auto;
    }

    .all-person-network .card img {
        width: 100%;
        border-radius: 10px;
        height: auto !important;
    }

    .all-person-network .filter-container {
        margin-right: -25px;
    }

    .input-bg {
        width: 140px;
        margin-right: 3px;
    }

    .etis-award-detial h1 {
        margin: 0;
    }

    .ets-value .section-heading h1 {
        font-size: 25px;
    }

    .mission-card-box.value-text h5 {
        font-size: 16px;
    }

    .mission-card-box.value-text p {
        font-size: 14px;
    }

    .mission-card-box.value-text li {
        font-size: 12px;
        margin-bottom: 5px;
    }

    .filter-3 {
        padding: 25px 10px;
    }

    .book-result .input-bg select {
        font-size: 10px;
    }

    .input-bg {
        width: 140px;
        margin-right: 6px;
    }

    .sponsor h1 {
        margin-bottom: 10px;
        font-size: 35px;
    }

    .sponsor h6 {
        font-size: 12px;
    }

    .sponsor img {
        margin-top: 20px;
        margin-bottom: 30px;
        width: 35%;
    }

    .col-lg-12.about-exbhi {
        padding: 0px;
    }

    .step-indicator {
        display: block;
    }

        .step-indicator .step-number {
            padding: 15px;
        }

    .step {
        margin: 50px 0px;
    }

        .step h1 {
            font-size: 20px;
            margin-bottom: 30px;
        }

        .step .exhibitions-card-box {
            margin-bottom: 20px;
        }
}

@media (max-width: 413.98px) {
    .alredylogin p {
        font-size: 11px;
    }

        .alredylogin p a {
            font-size: 11px;
        }

    .btn-primary.singupsumit {
        padding: 11px 11px !important;
        line-height: 20px;
    }

    .login .singupsumit {
        padding: 11px 35px !important;
        font-size: 14px;
    }

    h2.sub-book-he {
        font-size: 19px !important;
        margin-bottom: 20px;
    }
}

@media (max-width: 374.98px) {
    .btn-primary.singupsumit {
        text-transform: capitalize;
    }

    .alredylogin {
        padding-left: 0px;
    }

    .alert-toast {
        width: 300px !important;
        max-width: 300px !important;
        right: auto;
        left: 50%;
    }

    .btn-outline-light {
        color: #f8f9fa;
        border-color: #f8f9fa;
        border-radius: 50px;
        padding: 4px 7px;
        font-size: 9px;
        font-weight: 600;
    }

    .inner-banner-button a {
        margin-right: 3px;
    }
}

@media (max-width: 359.98px) {
}

/*====Media Quereis===*/

/*Raza*/
.top-bar-dash h1 {
    margin: 0;
    text-transform: uppercase;
}

.top-bar-dash .container {
    padding: 10px 20px;
}

.welomc {
    text-align: left;
    margin-left: 10px;
    display: inline-block;
    vertical-align: middle;
}

    .welomc h4 {
        margin: 0;
        text-align: left;
        display: unset;
        font-size: 16px;
    }

        .welomc h4 span {
            display: block;
            margin: 0;
        }

.profileimage {
    display: inline-block;
    width: auto !important;
}

    .profileimage img {
        width: 90px;
        height: 90px !important;
        object-fit: cover;
    }

.btn-profile, .btn-logout {
    padding: 10px 20px;
}

.btn-logout {
    margin-right: 0;
}

.top-bar-dash {
    display: none;
}

.dasbord {
    margin: 0 !important;
}

    .dasbord .box-pro {
        background: #eee;
        border: 1px solid #ccc;
        margin-bottom: 0px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

.leftmenulist {
    background: #fff;
    padding-top: 40px;
    padding-bottom: 40px;
}

.rightbox {
    padding-top: 20px;
    padding-bottom: 20px;
}

.leftmenulist .box-1:nth-child(2) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.action-btn-green {
    display: block;
    padding: 15px;
    border-radius: 5px;
    font-size: 14px;
    font-family: 'MavenPro-Bold';
    font-weight: bolder;
    background-color: #DAF2E4;
    color: #00732F;
}

    .action-btn-green:hover {
        background-color: #00732F;
        color: #DAF2E4;
    }

.action-btn-blue {
    display: block;
    padding: 15px;
    border-radius: 5px;
    font-size: 14px;
    font-family: 'MavenPro-Bold';
    font-weight: bolder;
    background-color: #CFF0FF;
    color: #1380AF;
}

    .action-btn-blue:hover {
        background-color: #1380AF;
        color: #CFF0FF;
    }

.dashboard-alert-bar {
    display: block;
    padding: 16px 24px;
    border: rgba(0, 0, 0, 0.25);
    margin-bottom: 10px;
    border-radius: 10px;
    font-weight: bold;
    font-size: 16px;
}

.alert-error {
    background: #c00;
    color: #fff;
}

.alert-warning {
    background: #fc0;
    color: #000;
}

.alert-success {
    background: #090;
    color: #fff;
}

.profileimage form {
    display: unset;
}

.addresfo {
    padding-top: 0px;
    margin-top: 20px;
}

.socialinks {
}

    .socialinks a {
        display: block;
        color: #666;
        margin-bottom: 10px;
    }



.dataTables_length {
    display: none !important;
}

.dataTables_wrapper {
    padding-left: 10px;
}


/*-------------------------------------------------*/

.loader {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    position: absolute;
    z-index: 10;
    top: 45%;
    left: 50%;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*Naveed*/

.profilecontent ul {
    list-style: none;
    padding-left: 0px;
}

    .profilecontent ul li {
        margin: 10px 0px;
    }

.profile-bio .left-text {
    text-align: left;
}

.profile-bio .right-text {
    text-align: right;
}

.view-btn {
    color: #000;
    background-color: #f0faff;
    border: 1px solid #1cbbff;
    padding: 4px 14px;
    font-family: 'MavenPro-Regular';
    border-radius: 5px;
    font-size: 13px;
}

#add-btn {
    color: #000;
    background-color: #f0faff;
    border: 1px solid #1cbbff;
    padding: 9px 26px;
    font-family: 'MavenPro-Regular';
    border-radius: 5px;
    font-size: 14px;
    font-weight: bold;
}

.role-select-form .custom-check {
    display: none;
}

.role-select-form .action-box {
    position: relative;
}



.role-select-form .action-box {
    color: #007DB2;
    border-color: #007DB2;
    text-align: center;
    padding: 10px 0px;
}

    .role-select-form .action-box h3 {
        background-color: #007DB2;
        color: white;
        margin-top: 30px;
        padding: 10px 20px;
        width: 80%;
        border-radius: 0px 5px 5px 0px;
        text-align: left;
    }

    .role-select-form .action-box .content {
        padding: 25px;
        color: #000000;
        text-align: left;
    }

        .role-select-form .action-box .content p {
            color: #000000;
        }

        .role-select-form .action-box .content ul li {
            margin: 7px 0px;
        }

    .role-select-form .action-box .btn-role {
        width: auto;
        padding: 15px 40px;
        font-size: 15px;
        font-weight: normal;
        text-transform: uppercase;
        background-color: #007DB2;
        color: #fff;
    }

.menu-box ul .logout-btn {
    color: #ff9999;
    font-weight: bold;
    padding: 10px 10px;
    display: flex;
    align-items: center;
    font-size: 14px;
    margin-bottom: 5px;
    width: 100%;
    background: transparent;
    border: none;
    font-weight: bold;
}

.accordion-button:not(.collapsed) {
    color: #000;
}

.translate-ico {
    color: #007DB2 !important;
    float: right;
}

.accnt-switch {
    margin-top: 35px;
    text-align: center;
}

    .accnt-switch .dropdown-toggle {
        background-color: #007DB2;
        color: #fff;
        padding: 10px 20px;
        border-radius: 5px;
    }
    .accnt-switch .dropdown-toggle::after {
        display: inline-block !important;
    }
    .accnt-switch .active a {
        pointer-events: none;
    }
/*End Naveed*/
.loginuae-card, .logineti-card {
    padding: 5%;
    position: relative;
}
    .loginuae-card img, .logineti-card img{
        border-radius: 10px;
        
    }
    .loginuae-card h2, .logineti-card h2 {
        position: absolute;
        top: 14%;
        /*z-index: 1;*/
        color: white;
        background: linear-gradient(0deg, #000, #001720b8), linear-gradient(5deg, rgb(0, 0, 0) 0%, rgb(0, 125, 178) 100%);
        padding: 15px;
        font-size: 22px;
        border-radius: 0px 10px 10px 0px;
    }

@media (max-width: 767.98px) {
    .loginuae-card h2, .logineti-card h2 {
        top: 8%;
        font-size:18px;
    }
    }