@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/WorkSans-Bold.eot');
    src: url('../fonts/WorkSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/WorkSans-Bold.woff2') format('woff2'),
        url('../fonts/WorkSans-Bold.woff') format('woff'),
        url('../fonts/WorkSans-Bold.ttf') format('truetype'),
        url('../fonts/WorkSans-Bold.svg#WorkSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/WorkSans-SemiBold.eot');
    src: url('../fonts/WorkSans-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/WorkSans-SemiBold.woff2') format('woff2'),
        url('../fonts/WorkSans-SemiBold.woff') format('woff'),
        url('../fonts/WorkSans-SemiBold.ttf') format('truetype'),
        url('../fonts/WorkSans-SemiBold.svg#WorkSans-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/WorkSans-Light.eot');
    src: url('../fonts/WorkSans-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/WorkSans-Light.woff2') format('woff2'),
        url('../fonts/WorkSans-Light.woff') format('woff'),
        url('../fonts/WorkSans-Light.ttf') format('truetype'),
        url('../fonts/WorkSans-Light.svg#WorkSans-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/WorkSans-Regular.eot');
    src: url('../fonts/WorkSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/WorkSans-Regular.woff2') format('woff2'),
        url('../fonts/WorkSans-Regular.woff') format('woff'),
        url('../fonts/WorkSans-Regular.ttf') format('truetype'),
        url('../fonts/WorkSans-Regular.svg#WorkSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work Sans';
    src: url('../fonts/WorkSans-Medium.eot');
    src: url('../fonts/WorkSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/WorkSans-Medium.woff2') format('woff2'),
        url('../fonts/WorkSans-Medium.woff') format('woff'),
        url('../fonts/WorkSans-Medium.ttf') format('truetype'),
        url('../fonts/WorkSans-Medium.svg#WorkSans-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
body{ font-family:'Work Sans' }
h2{ font:700 22px/22px 'Work Sans'; padding: 0; margin: 0 0 15px  }
a{ color: #85AA79 }
@media (min-width: 768px) {
    .sidebar { width: 353px !important; }
    .sidebar .nav-item .nav-link{ width: 100%; padding:20px 32px; overflow: hidden; }
    .sidebar .nav-item .nav-link .icon-wrapper{ width: 35px; float: left;  }
    .sidebar-toggled .sidebar .nav-item .nav-link .icon-wrapper{ width: 35px; float: none; margin: 0 auto }
    .sidebar .nav-item .nav-link svg{ height: 20px; font-size: 13px; fill: #85AA79 }
    .sidebar .nav-item .nav-link span{ font-weight: 600; color:#495057; font-family:'Work Sans' }
    .sidebar-dark .nav-item.active .nav-link span{font-weight: 600; color: #495057 }
    .sidebar-dark .nav-item.active{ background-color: rgba(224, 224, 224, 0.5) }
    .sidebar.toggled{ width:86px !important }
    .sidebar.toggled .sidebar-brand .sidebar-brand-text{ display: block }
    .sidebar.toggled .nav-item .nav-link{ width: 86px; padding: 33px 12px !important }
    .sidebar.toggled .nav-item .collapse{ left: 86px; background: #fff; z-index: 99; border-radius: 10px }
    .sidebar .nav-item .collapse .collapse-inner{ margin-bottom: 0px }
    .sidebar-toggled .sidebar .nav-item .collapse .collapse-inner .collapse-item{ margin:0; padding: 12px 20px !important }
} 
.sidebar #sidebarToggle{ width: 24px; height: 18.67px; padding: 0; margin: 0; background-color: inherit; position: absolute; top:23px; left:34px; z-index: 999; }
.sidebar-dark #sidebarToggle:hover{ background-color: transparent }
.sidebar #sidebarToggle svg{ color: #85AA79 }
.sidebar #sidebarToggle:after{ display: none }
.sidebar .sidebar-brand{ width: 350px; height: auto; padding:10px 45px 10px 102px; background: #fff }
.sidebar .sidebar-brand .sidebar-brand-icon{ height: 50px; display: flex; align-items: center }
.sidebar .sidebar-brand .sidebar-brand-icon img{ height: 31px }
/* .sidebar .sidebar-brand .sidebar-brand-text{ width: 152.97px; height: 25.44px; padding-top: 4px; padding-left: 10px } */
/* .sidebar .nav-item .nav-link[data-toggle=collapse]:after{ background: url('../img/down-arrow.svg') no-repeat right center; background-size: 12px; text-indent: -200000px  } */
/* .sidebar .nav-item .nav-link[data-toggle="collapse"].collapsed:after{ background: url('../img/up-arrow.svg') no-repeat right center; background-size: 12px; text-indent: -200000px  } */
.sidebar .nav-item .nav-link[data-toggle=collapse]::after{ display: none }
.sidebar .nav-item .nav-link.collapsed[data-toggle=collapse]{ background: url('../img/down-arrow.svg') no-repeat 94% center ; background-size: 15px  }
.sidebar .nav-item .nav-link[data-toggle=collapse]{ background: url('../img/up-arrow.svg') no-repeat 94% center rgba(224, 224, 224,0.5); background-size: 15px  }
.sidebar .nav-item .collapse, .sidebar .nav-item .collapsing{ background-color: rgba(224, 224, 224,0.5); margin: 0 }

.sidebar-toggled .sidebar .nav-item .nav-link.collapsed[data-toggle=collapse]{ background:inherit  }
.sidebar-toggled .sidebar .nav-item .nav-link[data-toggle=collapse]{ background: inherit  }
.sidebar .nav-item .collapse .collapse-inner .collapse-item, .sidebar .nav-item .collapsing .collapse-inner .collapse-item{ color: #495057; font-size: 13px; font-weight: 300; padding: 12px 25px 12px 60px !important }
#wrapper #content-wrapper{ background: #F3F4F8 }
.sidebar .nav-item .nav-link .img-profile, .topbar .nav-item .nav-link .img-profile{ width:44px; height: 44px; padding: 2px; margin-right: 10px; border: 1px solid #85AA79; }
.topbar.navbar-light .navbar-nav .nav-item .nav-link{ color:#85AA79; font-family:'Work Sans'; font-size: 14px; padding: 0 20px 0 5px }
.topbar.navbar-light .navbar-nav .nav-item:first-child .nav-link{ padding: 0 }
.topbar.navbar-light .navbar-nav .nav-item .nav-link .btn{ min-width: inherit }
.topbar .navbar-search{ width: 20rem }
.topbar .navbar-search input.form-control{ background-color: transparent !important }
.topbar .navbar-search input.form-control:focus{ box-shadow: inherit !important }
.topbar .navbar-search .btn{ height:70px; padding: 0; }
.topbar {background-color: #FFFFFF}
.sidebar .nav-item .collapse .collapse-inner .collapse-item.active, .sidebar .nav-item .collapsing .collapse-inner .collapse-item.active{ color: #495057 }
.sidebar.toggled .nav-item .nav-link span{ display: none }
.sidebar .nav-item .collapse .collapse-inner, .sidebar .nav-item .collapsing .collapse-inner{ padding: 0 }
.sidebar .nav-item .collapse .collapse-inner .collapse-item:hover, .sidebar .nav-item .collapsing .collapse-inner .collapse-item:hover{background-color: inherit}
.topbar #sidebarToggleTop{ font-size: 24px; fill:#85AA79; color: #85AA79 }
.topbar #sidebarToggleTop:focus{ box-shadow: inherit }
.sidebar .nav-item .collapse .collapse-inner{ margin-bottom: 0px }
@media (max-width: 767px) {
    .sidebar .nav-item .nav-link svg{ height: 20px; font-size: 13px; fill: #85AA79 }
    .sidebar.toggled .nav-item .nav-link{ width: 86px; padding: 33px 12px !important }
    .sidebar .nav-item .nav-link.collapsed[data-toggle=collapse], .sidebar .nav-item .nav-link[data-toggle=collapse]{ background: none !important } 
    .sidebar .nav-item .collapse{z-index: 3 }
    .sidebar .nav-item .collapse .collapse-inner{ background-color: #fff }
    .sidebar > .nav-item >.nav-link{ margin:0; padding: 25px 20px !important }
    .sidebar .nav-item .collapse .collapse-inner .collapse-item, .sidebar .nav-item .collapsing .collapse-inner .collapse-item { padding: 12px 20px !important; margin: 0 }
    .sidebar .nav-item .nav-link span{ display: none }
    .topbar #sidebarToggleTop{ min-width: auto; width: 24px; height: 18.67px; padding: 0; margin: 0; background-color: inherit; position: absolute; top:23px; left:15px; z-index: 999; }
    .topbar #sidebarToggleTop:hover{ background-color: transparent }
    .sidebar #sidebarToggle svg{ color: #85AA79 }
    .sidebar #sidebarToggle:after{ display: none }
    .sidebar .sidebar-brand{ width: 50px; height: 50px; padding:0; margin: 15px 0 0 28px; overflow: hidden; background: #fff }
    .sidebar .sidebar-brand .sidebar-brand-icon{ height: 50px }
    .sidebar .sidebar-brand .sidebar-brand-icon img{ height: 31px }
    .topbar.navbar-light .navbar-nav .nav-item .nav-link{ padding: 0 0 0 10px }
    .sidebar .nav-item .nav-link .img-profile, .topbar .nav-item .nav-link .img-profile{ margin-right: 0px }
    .topbar .nav-item.dropdown .dropdown-toggle::after{ display: none }
    .topbar .dropdown-list .dropdown-header{ background-color: #85AA79; border-color: #85AA79 }
}


.ue-slider .slide{ position: relative; margin-right:30px }
.ue-slider .slide img{ width:100% }

/* Upcoming Event Section Css Start */
.upcoming-event-section{ width: 100%; position: relative; padding-top: 50px; padding-bottom: 50px; }
/* .upcoming-event-section:before{ height: 203px; position: absolute; bottom: 0; left:-1.5rem; right: -1.5rem; content: ''; z-index: 1; background:url('../img/upcoming-event-bg.jpg') no-repeat 0 0; background-size: cover } */
.upcoming-event-list{ position: relative; z-index: 2; }
.event-info{ padding: 5%; position: absolute; bottom: 0; left: 0 }
.event-info h2{ font:700 22px/28px 'Work Sans'; padding: 0; margin: 0 0 15px; color: #fff }
.event-info p{ font:400 14px/19px 'Work Sans'; padding: 0; margin: 0 0 15px; color: #fff }
@media (max-width: 768px) {
    .event-info h2{ font-size: 18px; line-height: 22px }
    .ue-slider .slide{ margin-right: 10px }
}
@media (max-width: 479px) {
    .ue-slider .slide{ margin-right: 0px }
}
.upcoming-event-section .slick-dots{ bottom: -40px }
.upcoming-event-section .slick-dots li button{ width: 12px; height: 12px; border: 2px solid #000; border-radius: 100% }
.upcoming-event-section .slick-dots li.slick-active button{ width: 12px; height: 12px; border: 2px solid #000; background: #000; border-radius: 100% }
.upcoming-event-section .slick-dots li button:before{ color: #000; display: none }

/* News Section */
.news-section{ width: 100%; position: relative; }
.news-list{ position: relative; z-index: 2;margin-left: 15px; }
.news-info{ padding: 5%; position: absolute; top: 0; left: 0 }
.news-info h2{ font:700 22px/28px 'Work Sans'; padding: 0; margin: 0 0 15px; color: #fff }
.news-info p{ font:400 14px/19px 'Work Sans'; padding: 0; margin: 0 0 15px; color: #fff }
@media (max-width: 768px) {
    .news-info h2{ font-size: 18px; line-height: 22px }
    .ue-slider .slide{ margin-right: 10px }
}
@media (max-width: 479px) {
    .ue-slider .slide{ margin-right: 0px }
}
.news-section .slick-dots{ bottom: -40px }
.news-section .slick-dots li button{ width: 12px; height: 12px; border: 2px solid #000; border-radius: 100% }
.news-section .slick-dots li.slick-active button{ width: 12px; height: 12px; border: 2px solid #000; background: #000; border-radius: 100% }
.news-section .slick-dots li button:before{ color: #000; display: none }

/* Announcement Section */
.announcement-section{ width: 100%; position: relative; padding-top: 50px; padding-bottom: 50px; }
.announcement-list{ position: relative; z-index: 2; }
.announcement-info{ padding: 2%; position: absolute; top: 15%; left: 0; height: 100%; width: 100%; }
.announcement-info h2{ font:700 22px/28px 'Work Sans'; padding: 0; margin: 0 0 15px; color: #fff }
.announcement-info p{ font:400 14px/19px 'Work Sans'; padding: 0; margin: 0 0 15px; color: #fff }
@media (max-width: 768px) {
    .announcement-info h2{ font-size: 18px; line-height: 22px }
    .ue-slider .slide{ margin-right: 10px }
}
@media (max-width: 479px) {
    .ue-slider .slide{ margin-right: 0px }
}
.announcement-section .slick-dots{ bottom: -50px }
.announcement-section .slick-dots li button{ width: 12px; height: 12px; border: 2px solid #000; border-radius: 100% }
.announcement-section .slick-dots li.slick-active button{ width: 12px; height: 12px; border: 2px solid #000; background: #000; border-radius: 100% }
.announcement-section .slick-dots li button:before{ color: #000; display: none }
.ribbon-top-right {
    width: 50px;
    height: 50px;
    overflow: hidden;
    position: absolute;
    top: 0px;
    right: 0px;
}

.ribbon-top-right span {
    position: absolute;
    display: block;
    width: 70px;
    padding: 5px 0;
    background: orange;
    color: black;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    transform: rotate(45deg);
    top: 10px;
    right: -20px;
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
}
.language-badge {
    position: absolute;
    top: 0;
    right: 8px;
    background-color: #f57c00; /* warna oranye */
    color: white;
    padding: 5px 10px;
    font-weight: bold;
    border-bottom-left-radius: 5px;
    font-size: 14px;
    z-index: 10;
}


/* Form Element Css Start */
.btn{ height: 50px; text-align: center; padding: 0 15px; font:600 16px/48px 'Work Sans'; border-radius:8px }
.btn-outline-white{ border:1px solid #fff;  color: #fff; background-color: transparent }
.btn-outline-white:hover{ border:1px solid #85AA79; color: #fff; background-color: #85AA79 }

.btn-outline-custom{ border:1px solid #85AA79;  color: #ACB5BD; background-color: transparent }
.btn-outline-custom:hover{ border:1px solid #85AA79; color: #fff; background-color: #85AA79 }

.btn-link{ color: #ACB5BD; font:600 16px/18px 'Work Sans'  }
.btn-link:hover{ color: #85AA79; text-decoration: none }
.custom-control{ min-height: 24px; margin-bottom: 8px }
.custom-control-label{ padding-left: 16px; font:700 16px/24px 'Work Sans' !important; color: #495057; padding-top: 4px }
.custom-control-input{ width: 24px; height: 24px; }
.custom-control-label:before{ width: 24px; height: 24px; border:2px solid #85AA79 }
.custom-checkbox .custom-control-label:before{ border-radius: 0px }
.custom-control-label:after{ width: 24px; height: 24px }
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after{ background: url('../img/check-arrow.svg') no-repeat center }
.custom-control-input:checked ~ .custom-control-label:before{ background-color: inherit; border-color: #85AA79 }
.custom-control-input:focus ~ .custom-control-label:before{ box-shadow: inherit }
.custom-control-input:focus:not(:checked) ~ .custom-control-label:before{ border-color:#85AA79 }
.custom-control-input:not(:disabled):active ~ .custom-control-label:before{ background-color: #fff ; border-color:#85AA79 }
.btn-primary{ background-color: #85AA79; border-color: #85AA79 }
.btn-primary:hover{ background-color: rgb(150, 192, 136) ; border-color: #85AA79 }
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle, .btn-primary.focus, .btn-primary:focus{ background-color: rgb(150, 192, 136); border-color: #85AA79; box-shadow:0 0 0 0.2rem  rgba(162, 134, 190,0.4) }
label{ font: 700 13px/16px 'Work Sans'; color: #495057 }
label span{ color: #0b517a }
.form-control{ height: 50px; font:400 14px/48px 'Work Sans'; border: 1px solid #DDE2E5; color: #3a3b45; background: #FFFFFF;border-radius: 8px; }
.form-control::-webkit-input-placeholder { /* Edge */ color: #ACB5BD }
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #ACB5BD; }
.form-control::placeholder { color: #ACB5BD; }
.custom-checkbox-sm .custom-control-label{ font-size: 14px; line-height: 19px; font-weight: 400 }
.btn-info{ background-color: #495057; border-color: #495057 }
.btn-info:hover{ background-color: #9fc0df; border-color: #9fc0df }
.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show > .btn-info.dropdown-toggle, .btn-info.focus, .btn-info:focus{ background-color: #9fc0df; border-color: #9fc0df; box-shadow:0 0 0 0.2rem  #9fc0df }
.btn-link{ border: inherit; padding: 0; margin:0 ; font:400 16px/34px 'Work Sans'; color: #ACB5BD }
.btn-link.add{ padding: 0 0 0 44px; background: url('../img/add-btn.svg') no-repeat 0 0; background-size: 34px }
.btn-primary.disabled, .btn-primary:disabled{ background-color: #999; border-color: #999 }
@media (max-width: 1199px) {
    .btn{ padding: 0 20px } 
}
@media (max-width: 767px) {
    .btn{ height: 42px; line-height: 40px; padding: 0 12px; font-size: 14px }
    .btn-link.add{ font-size: 14px; background-size: 28px; line-height: 28px; padding-left: 34px }
}


/* Page Title Css Start */
.page-title{ width: 100%; padding: 30px 0; position: relative; }
.page-title > div{ position: relative; z-index: 2; }
.page-title:before{ height: 130px; position: absolute; top: 0; left:-1.5rem; right: -1.5rem; z-index: 1; content: ''; 
    /* background: linear-gradient(0deg, #FBC653 -0.04%, #DC5696 100%)  */
    background: url('../img/title-bg.svg') no-repeat 0 0; background-size: cover }

/* Breadcrumb Css Start */
.breadcrumb{ background-color: inherit; padding: 0 }
.breadcrumb-item{ font: 400 14px/14px 'Work Sans' }
.breadcrumb-item a{ color: #fff }
.breadcrumb-item.active{color: #fff}
.breadcrumb-item + .breadcrumb-item:before{ content: '>'; color: #fff }
@media (max-width: 767px) {
    .breadcrumb-item{ margin-bottom: 5px }
}

/* Registration Form Css Start */
.form-wrapper{ position: relative; z-index: 2 }
.form-wrapper .card{ border: inherit; box-shadow: 0px 7px 20px -6px rgba(166, 183, 199, 0.25); border-radius: 8px;}
.form-wrapper .card.shadow{ box-shadow: 0px 7px 20px -6px rgba(166, 183, 199, 0.25) }
.form-wrapper .card-body{ padding: 30px }
.form-wrapper .card h3{ font:700 22px/28px 'Work Sans'; color: #495057; padding: 0; margin-bottom: 8px }
.form-wrapper .card p{ font:400 16px/20px 'Work Sans'; padding: 0; margin-bottom: 5px }
.form-wrapper .card .form-title h4{ color: #495057; font:700 16px/20px 'Work Sans'; }
.form-wrapper .card .form-title h4 span{ color: #85AA79; font-weight: 400; position: relative; padding-left: 12px }
.form-wrapper .card .form-title h4 span:before{ color: #495057; font-weight: 400; position: absolute; top: 0; left: 0; content: '/' }
.form-wrapper .card .form-title p{ margin-bottom: 10px; color: #495057; font:400 16px/20px 'Work Sans'; }
.form-wrapper .card .form-title p span{ color: #85AA79; position: relative; padding-left: 12px }
.form-wrapper .card .form-title p span:before{ color: #495057; font-weight: 400; position: absolute; top: 0; left: 0; content: '/' }
.form-wrapper .card .btn{ margin-top: 30px }
.form-wrapper .card p.p1{ font-size: 14px; line-height: 19px; color: #ACB5BD }
@media (max-width: 569px) {
    .form-wrapper .card-body{ padding: 20px }
}
/* Theme Text Color Css Start */
.text-primary{ color: #85AA79 !important }
.text-secondary{ color: #815EA3 !important }
.text-gray-500{ color: #ACB5BD !important }

/* Personal Info section Css Start */
.personal-info-section{ width: 100%; padding: 100px 0 0; position: relative; z-index: 2 }
.personal-info-section .card{ border: inherit; box-shadow: 0px 7px 20px -6px rgba(166, 183, 199, 0.25); border-radius: 8px;}
.personal-info-section .card h2{ color: #85AA79; margin-bottom: 40px }
.profile-img{ width: 144px; float: left; padding: 0; margin: 0; border-radius: 100%; }
.profile-img img{ box-shadow: 0px 7px 20px -6px rgba(166, 183, 199, 0.25); border-radius: 100%; }
.p-info-right{ margin-left: 194px }
.p-info-list{ font:400 14px/19px 'Work Sans'; margin-bottom: 30px }
.p-info-list .font-weight-bold{ color: #495057; font-size: 13px }
.p-info-list .span{ width: 12px; height: 100%; float: left; }
.p-info-list h4{ color: #85AA79; font:700 16px/20px 'Work Sans'; padding: 0 0 8px; margin: 0 0 20px; border-bottom: 2px solid rgba(133, 170, 121,0.6) }
@media(max-width:991px){
    .nav-pills-mobile{ white-space: nowrap; flex-wrap:nowrap; overflow-x:auto }
}
@media(max-width:640px){
    .profile-img{ float: none; margin: 0 auto 30px }
    .p-info-right{ float: none; margin-left: 0 }
}
@media(max-width:575px){
    .p-info-list .span{ display: none }
}

/* Tab Custom Css Start */
.nav-pills{ width: 100%; position: relative; }
.nav-pills:before{ height: 1px; background: #ACB5BD; position: absolute; bottom: 0; left:-1.5rem; right: -1.5rem; content: '';  }
.nav-pills .nav-link{ font:300 13px/16px 'Work Sans'; color: #495057; margin:0 50px 0 0; padding:0 0 8px; border-bottom:4px solid rgba(0,0,0,0); border-radius: inherit }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link{ color:#495057; background-color: inherit; font-weight: 700; border-bottom-color: #85AA79 }


/* Data Table Custom Css start */
.dataTables_wrapper{ width:100%; padding-bottom: 30px; position: relative; }
.dataTables_wrapper table{ border-collapse:separate; border-spacing: 0 5px; text-align: center }
.dataTables_wrapper thead{ background:#85AA79; margin-bottom: 5px }
.dataTables_wrapper thead tr th{ white-space: nowrap; font:400 14px/19px 'Work Sans'; color: #fff  }
.dataTables_wrapper thead tr th:first-child{ border-radius: 8px 0 0 8px  }
.dataTables_wrapper thead tr th:last-child{ border-radius: 0 8px 8px 0  }
.dataTables_wrapper tbody tr{ box-shadow:0px 7px 20px -6px rgba(166, 183, 199, 0.25); margin-bottom: 5px }
.dataTables_wrapper tbody tr td{ background:#FAFBFD; font:400 14px/19px 'Work Sans'; color: #495057  }
.dataTables_wrapper tbody tr:nth-of-type(odd) td{ background:#fff }
.dataTables_wrapper tbody tr td:first-child{ border-radius: 8px 0 0 8px  }
.dataTables_wrapper tbody tr td:last-child{ border-radius: 0 8px 8px 0  }
div.dataTables_wrapper div.dataTables_length select{ margin-left: 8px; padding: 0 8px }
div.dataTables_wrapper .page-item{ padding: 0; margin: 0 0 0 20px; font:400 14px/34px 'Work Sans';  background: transparent; border: inherit; color: #ACB5BD }
div.dataTables_wrapper .page-item .page-link{ padding: 0; font:400 14px/34px 'Work Sans';  background: transparent; border: inherit; color: #ACB5BD; outline: none }
div.dataTables_wrapper .page-item.disabled .page-link{padding: 0; font:400 14px/34px 'Work Sans';  background: transparent; border: inherit; color: #ACB5BD }
div.dataTables_wrapper .page-item.active .page-link{ width: 34px; height: 34px; border-radius: 100%; text-align: center; color: #fff; text-align: center; background: #85AA79; border: inherit }
.dataTables_wrapper tbody tr td a{ color:#85AA79 !important }
div.dataTables_wrapper .page-item a:focus{ box-shadow: inherit !important; outline: none !important }
/* Modal Css Start */
.modal{ overflow: auto }
.modal-header{ padding:0.8rem 25px }
.modal-body{ padding:1rem 25px }
.modal-footer{ padding:10px 25px }
.modal-title{ font:500 20px/22px 'Work Sans'; color: #495057 }
.modal-body label{ font: 500 13px/16px 'Work Sans' }
.modal h3{ font-size: 16px; line-height: 18px; font-weight: 600; color: #000 }
.modal .close{ font-weight: 300; color: #85AA79; font-size: 40px; line-height: 22px; }
.btn-circle { width: auto; }
form .error{ font-size: 0.85rem; color: #c00; width: 100% !important; font-weight: 500; }
div.dataTables_wrapper div.dataTables_processing{ background-color: rgba(0,0,0,.7); color: #fff; border:inherit }
.dataTables_filter .form-control, .dataTables_length .form-control{ height: 42px; line-height: 40px }
@media(max-width:575px){ 
    div.dataTables_wrapper div.dataTables_paginate ul.pagination{ justify-content: flex-start !important; margin-top: 12px !important }
    div.dataTables_wrapper .page-item{ margin: 0 12px 0 0 }
    .nav-pills li .nav-link{ margin-right: 15px }
    .nav-pills li:last-child .nav-link{ margin-right:0 }
}

/* Login Page Css Start */
.login-section{ width: 100% }
.login-section .card{ border-radius: 0px }
.login-section .container-fluid{ padding-left:0px; padding-right: 0px }
.bg-gradient-primary{ background-color: inherit; background-image:inherit }
.login-section .bg-login-image{ height: 100vh; background: url('../img/login.jpg') no-repeat 0 0; background-size: cover }
.login-section .login-form{ height: 100vh; display: flex; justify-content: center; align-items: center }
.login-section .login-form-inner{ width: 350px }
.login-section .logo{ width:350px; margin:0 auto; display: block } 
.login-section .logo-tagline{ width:350px; margin:0 auto 55px; display: block }
.login-section h1{ font:400 24px/26px "Work Sans"; color: #1A202C; padding: 0; margin: 0 0 22px }
.login-section label{ font:400 16px/20px "Work Sans"; color: #1A202C; padding: 0 0 10px; margin:0; color: #4A5568 }
.login-section .form-control{ border:1px solid #ACB5BD; color: #2D3748 }
.login-section a{ color: #8FADC9 }
.forgot-password{ font-size: 14px; font-family:"Work Sans" }
.login-section button[type="submit"]{ margin-bottom: 30px }
.view-password{ position: relative; }
.view-password input.form-control{ padding-right: 45px }
.view-password .btn-link{ width: 18.33px; height: 13.33px; outline: none; position: absolute; top: 16px; right: 21px; background: inherit; border: inherit; padding: 0; margin: 0 }
.view-password .btn-link:hover{ opacity: 0.7; }
.view-password .btn-link img{ vertical-align: top }
@media(max-width:480px){
    .login-section .login-form-inner{ width:90% }
    .login-section .logo{ width:200px }
    .swal2-popup{ max-width:450px !important;}
}
@media screen and (orientation:landscape)
and (min-device-width: 319px) 
and (max-device-width: 640px) {
    .login-section .login-form{ height:auto; padding: 30px 0 }
}

/* Loader Css Start */
.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation{ background: rgba(0,0,0,.7) !important }
.swal2-popup{ max-width:1000px !important; background: rgba(0,0,0,0.7) !important }
.swal2-header{ padding: 0 !important }
.swal2-title, .swal2-html-container{ font-size: 14px !important; color: #fff !important }
.swal2-loader{ border-color:#85AA79 transparent #85AA79 transparent !important }
.swal2-styled.swal2-confirm{ background-color: #85AA79 !important; border: none !important }
.swal2-styled.swal2-confirm:hover{ background-color: #85AA79 !important; border: none !important }
.swal2-success-circular-line-left, .swal2-success-circular-line-right, .swal2-success-fix{ background-color: inherit !important }
.swal2-modal .swal2-content{ padding-left: 0px !important; padding-right: 0px !important }
.swal2-styled:focus{ box-shadow:inherit !important }

/* Bootstrap Multiselect Css */
.bootstrap-select .btn.dropdown-toggle{ margin-top:0px; padding-top:0px; border:1px solid #DDE2E5; font:400 14px/48px 'Work Sans' }
.bootstrap-select > .dropdown-toggle:after{ margin-top:9px}
.dropdown-item.active, .dropdown-item:active{ background-color:#85AA79 }
.label_required:after {
    content:"*";
    color:red;
}

/* General Width Css Start */
.w-500{ max-width: 500px }

/* Browse file Css Start */
.custom-file{ height: 50px }
.custom-file-label{ height: 50px; font: 400 14px/48px 'Work Sans'; padding: 0 .75rem; border: 1px solid #DDE2E5; border-radius: 8px }
.custom-file-input{ height: 50px; font: 400 14px/48px 'Work Sans'; padding: 0 .75rem  }
.custom-file-label::after{ height: 48px; line-height: 48px; padding: 0 .75rem; background-color: #85AA79; color: #fff }


.cover { object-fit: cover; }

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 17px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 13px;
  width: 13px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #85AA79;
}

input:focus + .slider {
  box-shadow: 0 0 1px #85AA79;
}

input:checked + .slider:before {
  -webkit-transform: translateX(13px);
  -ms-transform: translateX(13px);
  transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 17px;
}

.slider.round:before {
  border-radius: 50%;
}