/*
Template Name: UBold Dashboard
Author: Coderthemes
Email: coderthemes@gmail.com
File: Main Css
*/
@import url("https://fonts.googleapis.com/css?family=Roboto:400,500,700");

/*-------Rahul Done------*/
.Field {
    display: flex;
    flex-direction: row;
    margin-bottom: 20px;
}

.Field .AddRow,
.Field .DeleteRow {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-self: center;
    margin-left: 20px;
    width: 34px !important;
    height: 30px !important;
    border-radius: 100%;
    box-shadow: 0 0 10px black;
    transition: 0.50s;
}

.Field .AddRow:hover,
.Field .DeleteRow:hover {
    box-shadow: 0 0 20px black;
    cursor: pointer;
}

.Field .AddRow input,
.Field .DeleteRow input {
    display: block
}

.Field .AddRow i,
.Field .DeleteRow i {
    align-self: center;
    font-size: 25px !important;
    font-weight: bold;
}

.FieldAdd .AddRow {
    background-color: #2bbbad;
}

.FieldDelete .DeleteRow {
    background-color: red;
}

.Logo .smallLogo,
.Logo .favIcon {
    background-color: #2bbbad;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    width: 50px !important;
    height: 50px !important;
    border-radius: 10px;
    box-shadow: 0 0 10px black;
    transition: 0.50s;
    margin: 5px 0 0 10px;
    cursor: pointer;
}

.Logo .smallLogo:hover,
.Logo .favIcon:hover {
    box-shadow: 0 0 20px black;
}

.Logo .smallLogo i,
.Logo .favIcon i {
    align-self: center;
    font-size: 30px !important;
    font-weight: bold;
}


/*--------Loader-------*/
.internalLoader {
    display: none;
}

.internalLoader,
.pageLoader {
    z-index: 99999 !important;
    margin: 0;
    padding: 0;
    background: #f3f3f3;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
}


/*-------Action Align--------*/
.ActionAlign {
    display: flex;
    justify-content: space-around;
}

.ActionAlign button {
    border-radius: 100%;
    border: none;
    box-shadow: 0 0 10px darkgrey;
    transition: 0.50s;
}

.ActionAlign button:hover {
    cursor: pointer;
    box-shadow: 0 0 10px black;
}


.dt-responsive thead tr td,
.dt-responsive thead tr th {
    font-weight: bold;
    letter-spacing: .5px;
    /* text-transform: uppercase;
    text-align: center; */
}



/*---------- ( MODEL ) -----------*/
#con-detail-modal .common {
    padding: 0px 0 10px 0;
}

#con-detail-modal .common:nth-child(5) {
    padding: 0px !important;
}

#con-detail-modal .common label {
    color: black;
    font-weight: bold;
    margin: 0;
}

#con-detail-modal .common span {
    color: black;
    word-break: break-all;
}

#con-detail-modal .btnDemo label {
    color: #6f6f6f !important;
    font-weight: bold !important;
    font-size: 16px !important;
    text-align: center !important;
    padding: 0 10px !important;
    letter-spacing: 2px !important;
    word-spacing: 3px !important;
    text-shadow: 0px 0px 28px black !important;
}

table .statusBlocked {
    border-radius: 0;
    border: none;
    box-shadow: 0 2px 5px 0 rgba(251, 0, 0, 0.16), 0 2px 10px 0 rgba(255, 0, 0, 0.18);
    padding: 5px 10px;
    background-color: #ef4554;
}

table .statusActive {
    border-radius: 0;
    border: none;
    box-shadow: 0 2px 5px 0 rgba(52, 193, 134, 0.16), 0 2px 10px 0 rgba(12, 225, 185, 0.18);
    padding: 5px 10px;
    background-color: #2bbbad;
}

.Appearance {
    background: linear-gradient(0deg, transparent, lightgray) !important;
    padding: 10px 10px 0px 10px;
}

.tableCommon .tableFormRow {
    border-top: 2px solid #d5d5d5;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.tableCommon .tableFormRow .fontStyleCommon {
    margin: 15px 0;
}

.tableCommon .tableFormRow .fontStyleCommon .applyStyle {
    align-self: center;
    margin: 0;
    text-align: right;
}

.tableCommon .tableFormRow .fontStyleCommon label {
    align-self: center;
    margin: 0;
    font-weight: bold;
}

.tableCommon {
    box-shadow: 0 3px 8px lightgray;
    padding: 10px 10px 0px 10px;
    margin: 0 auto 25px auto;
    min-width: 98%;
    transition: all 0.3s ease-out;
}

.tableCommon:hover {
    box-shadow: 0 5px 12px lightgray;
}

.tableCommon .col-md-12 p {
    color: black;
    text-shadow: 0px 0 35px black;
    font-size: 18px;
    padding-bottom: 10px;
}


/*------- Accordion Strat--------*/
.accordion {
    border-radius: 0;
    box-shadow: 0 5px 8px lightgray;
    transition: all 0.50s ease-out;
}

.accordion:hover {
    box-shadow: 0 8px 13px lightgray;
}

.accordion .card-header {
    padding: 0;
    margin: 0;
    background-color: #ececec;
    transition: all 0.50s ease-out;
}

.accordion .card-header:hover {
    background-color: #e3e3e3;
}

.accordion .text-dark {
    display: block;
    width: 100%;
    padding: 10px;
    transition: all 0.50s ease-out;
}

.accordion .text-dark:focus,
.accordion .text-dark:hover {
    color: #1d2124 !important;
    display: block;
    width: 100%;
    padding: 10px;
}

.accordion .text-dark:active {
    display: block;
    width: 100%;
    padding: 10px;
}

/*------- Accordion End--------*/

.Arance {
    background: linear-gradient(0deg, transparent, lightgray);
}


/*------- Validation Start--------*/
/* form .form-group{
    position: relative;
}

form .form-group span[role="alert"]{
    display: block !important;
    background-color: yellow;

} */
/*------- Validation End--------*/





/*----- (Button Style) -----*/

.addBtn:hover,
.addBtn i:hover,
.saveBtn:hover,
.saveBtn i:hover,
.updateBtn:hover,
.updateBtn i:hover,
.searchBtn:hover,
.searchBtn i:hover,
.reloadBtn:hover,
.reloadBtn i:hover,
.printBtn:hover,
.printBtn i:hover,
.backBtn:hover,
.backBtn i:hover,
.downloadBtn:hover,
.downloadBtn i:hover,
.closeBtn:hover,
.closeBtn i:hover {
    color: white;
}


.addBtn,
.addBtn i,
.saveBtn,
.saveBtn i,
.updateBtn,
.updateBtn i,
.backBtn,
.backBtn i {
    background: linear-gradient(236.22deg, #6c0873 6.51%, #cd449a 94.28%);
    color: white;
    transition: all 0.3s ease-out;
}

.searchBtn,
.searchBtn i {
    background-color: #2960b3;
    color: white;
    transition: all 0.3s ease-out;
}

.reloadBtn,
.reloadBtn i {
    background-color: #2992b3;
    color: white;
    transition: all 0.3s ease-out;
}

.printBtn,
.printBtn i {
    background-color: #9a08ad;
    color: white;
    transition: all 0.3s ease-out;
}

.downloadBtn,
.downloadBtn i {
    background-color: #b751c6;
    color: white;
    transition: all 0.3s ease-out;
}

.closeBtn,
.closeBtn i {
    background-color: #d53957;
    color: white;
    transition: all 0.3s ease-out;
}


.addBtn,
.saveBtn,
.updateBtn,
.searchBtn,
.reloadBtn,
.printBtn,
.backBtn,
.downloadBtn,
.closeBtn {
    border-radius: 50px !important;
}

.tableStyle tfoot,
.tableStyle thead {
    background: linear-gradient(236.22deg, #6c0873 6.51%, #cd449a 94.28%) !important;
    color: #fff;
}









.chartLoader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 1;
    display: none;
}

.chartLoader .innerLoader {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.chartLoader .innerLoader img {
    width: 60px;
    animation: loader 1s linear infinite;
}

@keyframes loader {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.NoticeBoard {
    position: absolute;
    width: 100%;
    height: 59px;
    background: linear-gradient(186deg, #d2d2d2, #fff0);
    top: -60px;
    right: 0;
    transition: 0.30s;
}

.card-box:hover .NoticeBoard {
    top: 0;
}

.NoticeBoard .Common {
    text-align: right;
    padding: 10px 20px 0 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.NoticeBoard .NoticeBoardDelete,
.NoticeBoard .NoticeBoardRead,
.NoticeBoard .NoticeBoardArchive,
.NoticeBoard .NoticeBoardImportant {
    cursor: pointer;
    display: block;
    padding: 0 7px;
}









/* .dataTables_length {
    margin: auto !important;
    float: none !important;
} */


/*========= Responsive Start =================*/
@media screen and (max-width: 767px) {
    div.dataTables_wrapper div.dataTables_paginate ul.pagination {
        margin: 6px 0;
        justify-content: center;
    }
}


.table-responsive {
    overflow-x: scroll;
}

.table-responsive::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 5px;
    height: 5px;
}

.table-responsive::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
}

/*========= Responsive End =================*/