.center-image {
    display: block;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 4px;
    width: 90%;
    background-color: red !important;
    align-content: center !important;
    align-items: center !important;
    vertical-align: central !important;
}

.center-text {
    margin: auto;
    width: 50%;
    /*border: 1px solid #c0c0c0;*/
    padding: 10px;
    text-align: center;
}
.center-text2 {
    text-align: center !important;
}
/*.loginbody {*/
    /* Image for testing purposes, thanks for Unsplash */
    /*background-image: url("../../assets/images/login/sairam-cover10.png");
    background-repeat: no-repeat;
    background-size: 100%;
    background-attachment: fixed;*/
    /*background-position: center;*/
/*}*/

/*.card {
    box-shadow: 0 0 5px 0;
    background: inherit;
    backdrop-filter: blur(10px);
    margin: 100px;*/
    /* according to your need-*/
/*}*/

.glass {
    /* CSS for Glass UI, play with it for better or more suitable results */
    backdrop-filter: blur(25px) saturate(180%);
    -webkit-backdrop-filter: blur(25px) saturate(180%);
    background-color: rgba(255, 255, 255, 0.57);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
    /* <div> size */
    /*    width: 400px;
    height: 300px;*/
    /* Make nice text */
    text-align: center;
    vertical-align: middle;
    line-height: 300px;
    font-family: cursive;
    font-size: 40px;
}

.ehashsoftware {
    font-size: 9px;
    color: #6473b6;
}


.colororange {
    color: #ff6a00 !important;
}

.colorbgorange {
    background-color: #ff6a00 !important;
}

.colorviolet {
    color: #7366ff !important;
}


.colorsairam1 {
    color: #005baa !important;
}

.colorsairam2 {
    color: #a7cf38 !important;
}


.studentproject {
    font-size: 32px;
    color: #005baa;
    letter-spacing: 1px;
    padding-left:20px !important;
}


.signaccountcolor {
    color: #a7cf38;
    font-weight: bold;
    /*font-style: oblique;*/
}


.whitebg {
background-color:#fff!important;
}

.fontsize11 {
    font-size: 11px;
}
.fontsize9 {
    font-size: 9px;
}

.fontsize10 {
    font-size: 10px;
}

.fontcolorwhite {
    color: #fff !important;
}
.fontsize12 {
    font-size: 12px;
}

.projectsstyle1 {
    color: #fff !important;
    font-size: 14px;
    font-weight: 500;
    letter-spacing:1px;
}

.ct-label {
    font-size: 8px !important;
}


.paddingtop10 {
    padding-top:10px;
}
.margintop10 {
    margin-top: 10px;
}


.secondfield {
    font-size: 12px;
    color: #730099;
}

.thirdfield {
    font-size: 12px;
    color: #b0a9c1;
}

.typeahead {
    background-color: #e6eeff !important;
}

.required {
    color: #ff471a !important;
}

.form-control {
    font-size: 14px !important;
    color: #52527a !important;
}


input::placeholder {
    font-size: 14px !important;
    color: #b3b3cc !important;
}

.col-form-label {
    color: #808080;
    font-weight: 400;
}
.invalid-feedback {
    color: #808080 !important;
}

.swal2-popup {
    font-size: 13px !important;
    color: #7575a3!important;
}

.fontsize11 {
    font-size: 11px !important;
}

.fontsize12 {
    font-size: 12px !important;
}

.deptlevels {
    font-size: 12px !important;
    color: #467ab9;
    padding-top: 10px;
    font-weight: 500;
    padding-left: 5px;
    padding-bottom: 5px;
}

.deptlevels2 {
    font-size: 12px !important;
    color: #467ab9;
    padding-top: 10px;
    font-weight: 500;
    padding-left: 5px;
    padding-bottom: 5px;
}

.competency-value a {
    font-size: 12px !important;
    color: #79a6d2;
    font-weight: 500;
/*    text-decoration: none;
    font-weight: bold;
    font-size: 12px;
    color: #007bff;*/
}




.deptlevels2 {
    font-size: 12px !important;
    color: #79a6d2;
    font-weight: 500;
}

.ideathonbgcolor {
    background-color: #217e47;
}
.solvathonbgcolor {
    background-color: #dc2925;
}
.innovathonbgcolor {
    background-color: #3b2b98;
}

.inspirathonbgcolor {
    background-color: #a12654;
}

.ct-series-a .ct-bar {
    /* Colour of your bars */
    stroke: #217e47 !important;
}

.ct-series-b .ct-bar {
    /* Colour of your bars */
    stroke: #dc2925 !important;
}

.ct-series-c .ct-bar {
    /* Colour of your bars */
    stroke: #3b2b98 !important;
}
.ct-series-d .ct-bar {
    /* Colour of your bars */
    stroke: #a12654 !important;
}


.ideathoncolor {
    color: #217e47;
}

.solvathoncolor {
    color: #dc2925;
}
.innovathoncolor {
    color: #3b2b98;
}

.inspirathoncolor {
    color: #a12654;
}






.pendingcolor, .txt-danger {
    color: #6699ff !important;
}
.inprogresscolor, .txt-warning {
    color: #ffbf00 !important;
}
.completedcolor, .txt-success {
    color: #00cc00 !important;
}
.pendingbgcolor {
    background-color: #ccddff;
}

.inprogressbgcolor {
    background-color: #fff2cc;
}

.completedbgcolor {
    background-color: #ccffcc;
}

.competency-list {
    max-height: 300px; /* Adjust height as needed */
    overflow-y: auto;
    overflow-x: hidden;
    padding: 5px;
    border-radius: 5px;
    background-color: #f8f9fa;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
}

.competency-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px;
    margin-bottom: 5px;
    border-radius: 5px;
    background-color: #ffffff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.competency-title {
    font-weight: bold;
    font-size: 12px;
    color: #333;
}


.custom-dropdown {
    border-radius: 5px;
    padding: 5px;
    font-size: 14px;
    height: 30px;
    width: 100%;
    background: #f8f9fa;
    border: 1px solid #ccc;
    outline: none;
    transition: all 0.3s ease;
}
.custom-dropdown:focus {
    border-color: #007bff;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
}



div.dropdown-display.dropdown-disabled, select.dropdown-display.dropdown-disabled, select.dropdown-display[disabled] {
    background-color: blue !important;
}

select:disabled {
    background-color: blue; /* Change to your desired color */
    color: black; /* Optional: Adjust text color for better contrast */
}



/*The below background color is used for disabled checkboxes, select*/
.form-control:disabled, .form-control[readonly], .select:disabled, .select[readonly] {
    background-color: #f0f0f5;
    /*opacity: 1;*/
}

/*The below background color is used for disabled checkboxes. For bootstrap select, need to more color to match with input disabled color*/
.bootstrap-select.disabled {
    background-color: #9494b8;
    /*opacity: 1;*/
}


/*Same level colors are used in customstyles.css and GetLevelChartColorsArray (common1.js). Any changes should be updated in both places*/
.level1color {
    color: #b3ffb3;
}
.level2color {
    color: #d2ff4d;
}
.level3color {
    color: #ace600;
}
.level4color {
    color: #4dff4d;
}
.level5color {
    color: #00e600;
}
.level6color {
    color: #008000;
}

.paddingright20 {
    padding-right: 20px!important;
}
.marginright20 {
    padding-right: 20px !important;
}

.colorgreen {
    color: #009900 !important;
}

.colororange {
    color: #cc6600 !important;
}


.markentryinput {
    border: 1px solid rgba(33,33,33,.07);
    background-color: white;
    width: 60px
}

.markentryinputdisabled {
    border: 1px solid rgba(33,33,33,.07);
    background-color: #c0c0c0;
    width: 60px
}

.markentryinputcomplete {
    border: 1px solid #009900 !important;
    background-color: #e6ffe6;
    width: 60px
}

.infomsg10 {
    font-weight: bold;
    font-size: 10px;
    color: #3498db;
}

.evaluatecolumncss1 {
    vertical-align: top !important;
    padding-top:10px;

}

.evaluateprg {
    background-color: #cce6ff !important;
}

.evaluatecatname {
    font-weight: bold;
    font-size: 12px;
    color: #9494b8 !important;
}


.evaluateroundname {
    font-weight: bold;
    font-size: 13px;
    color: #9494b8 !important;
    text-align: right;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 5px
}

.teamleader {
    font-size: 12px;
    color: forestgreen;
}

.projectgrade {
    padding-left: 10px !important;
    font-size: 20px !important;
    color: forestgreen !important;
}

.pull-right2 {
    align-items: flex-end !important;
    padding-right: 20px !important;
    text-align: right!important;
}

.loginimg {
    /*filter: brightness(80%);*/
    /*filter: blur(1px);*/ /* Applies a 5-pixel blur radius */
    /*-webkit-filter: blur(1px);*/ /* For older WebKit browsers */
}


.canvasimage img {
    filter: brightness(50%);
}


/*select[readonly] {
    background-color: blue !important;
}

.bootstrap-select.disabled {
    background-color: green !important;
}

.select:disabled {
    background-color: green !important;
}




*/

.loginfooter {
    /*background-image: url("../assets/images/footer2.jpg");*/
    /*    background-repeat: no-repeat;
    background-size: 100%;
    background-attachment: fixed;
    background-position: center;*/
    padding-bottom: 20px;
}


h3 {
    font-size: 18px !important;
    color: #495909 !important;
    text-transform: uppercase !important;
}


h6 {
    font-size: 16px !important;
    color: #707e8f !important;
    text-transform: uppercase !important;
}

h5 {
    font-size: 16px !important;
    color: #707e8f !important;
    text-transform: uppercase !important;
}


.dt-column-title {
    color: #707e8f !important;
}

.fourthfield {
    font-size: 16px;
    color: #fff;
}

.fifthfield {
    font-size: 14px;
    color: #fff;
}

.page-title {
    /*background-color: #effbd0 !important;*/
    /*background-color: #eaeffb !important;*/
    background-color: #f2fad1 !important;
}

.sidebar-links {
    top: 15px !important;
}

.hp-col-form-label {
    padding-left: 10px;
    padding-bottom:10px;
    line-height: 30px;
    color: #808080;
    font-weight: 400;
}


.hp-col-form-label2 {
    font-weight: 600;
    color: #9494b8;
}


.login-card2 {
    background-color: #effbd0;
}

.login-page-body {
    /*background-image: url("../assets/images/top-bg.png");*/
    /*background-color: #ebebfa;*/
    background-image: url("../assets/images/login/loginbg1.png");
    /*
    
        top-bg.png
        background-repeat: no-repeat;
    background-size: 100%;
    background-attachment: fixed;
    background-position: center;*/
}



.homepagehdr1 {
    font-size: 24px !important;
    color: #0b3894 !important;
    text-transform: uppercase !important;
    align-content: center !important;
    align-items: center !important;
    padding-left:10px;
}

.loginpg1 {
    background: url(" .. /images/login/loginbg1.png") !important;
    background-repeat: no-repeat !important; /* Prevent image repetition */
    background-position: center center !important; /* Center the image */
    background-size: cover !important; /* Scale the image to cover the entire container */
    background-attachment: fixed !important; /* Keep the image fixed when scrolling */
    height: 100vh !important; /* Set height to 100% of the viewport height */
    width: 100vw; /* Set width to 100% of the viewport width */
}

.helpinfo {
    color: #ffb366;
    padding-left:2px;
}

.footer-copyright {
    color: #ace600 !important;
    font-size: 10px !important;
}


.partialpymts1 {
    /*font-weight: bold;*/
    font-size: 8px;
    color: #3498db;
    text-decoration: none !important;
    padding-top: 4px;
}

.fontsize11a {
    font-size: 11px;
}

.forgot-password-link {
    display: block;
    text-align: right;
    margin-top: 10px;
    font-size: 14px;
    color: #007bff;
    text-decoration: none;
    font-weight: 500;
    cursor: pointer;
}

    .forgot-password-link:hover {
        text-decoration: underline;
        color: #0056b3;
    }

    .forgot-password-link i {
        margin-right: 5px;
    }

.loginpg2 {
    background: linear-gradient(135deg, #4b79a1, #283e51);
    background-size: cover;
}




/* Card Design */
.otp-card {
    background: #ffffff;
    padding: 25px;
    width: 360px;
    border-radius: 18px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.25);
}

/* Logo Project Name */
.project-name {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 1.5px;
    margin-top: 8px;
    color: #003b73;
}

/* Titles */
.title-text {
    font-size: 20px;
    font-weight: 600;
    color: #222;
}

.subtitle-text {
    font-size: 14px;
    color: #6c757d;
}

/* OTP Boxes */
.otp-box-container {
    display: flex;
    justify-content: space-between;
}

.otp-input {
    width: 65px;
    height: 65px;
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    border: 2px solid #0d6efd;
    border-radius: 10px;
    transition: 0.3s;
}

    .otp-input:focus {
        border-color: #003b73;
        box-shadow: 0 0 8px rgba(0, 123, 255, .5);
        outline: none;
    }

/* Verify Button */
.verify-btn {
    width: 100%;
    padding: 12px;
    background: #495909;
    border: none;
    border-radius: 10px;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    transition: 0.3s;
}

    .verify-btn:hover {
        background: #495909;
    }



.reset-card {
    background: #ffffff;
    padding: 25px;
    width: 360px;
    border-radius: 18px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.25);
}

.project-name {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 1.5px;
    margin-top: 8px;
    color: #003b73;
}

.title-text {
    font-size: 20px;
    font-weight: 600;
    color: #222;
}

.subtitle-text {
    font-size: 14px;
    color: #6c757d;
}

.label-text {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 14px;
}

.input-reset {
    height: 45px;
    border-radius: 10px;
    font-size: 15px;
}

.reset-btn {
    width: 100%;
    padding: 12px;
    background: #495909;
    border: none;
    border-radius: 10px;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    transition: 0.3s;
}

    .reset-btn:hover {
        background: #495909;
    }