@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');
:root{
    --colorPrimary : #F7B70B;
    /* --colorPrimary : #1a55e7; */
    --colorDark : hsl(230, 82%, 11%);
    --colorDarkBlue : #1f1d62;
    --colorGreen : #4c7544;
}
body,html{
    font-family: "Poppins", sans-serif !important;
    background:  #f0f1f3;
    color : rgba(0,0,0,.5);
    font-weight: 400;
}
a{
    color : var(--colorPrimary);
}
@media (max-width: 576px){
    .logo-top{
        width : 100px !important;
        height : 100px !important;
    }
    .card-relative{
        margin-top : 50px !important;
    }
}
.logo-top{
    position : absolute;
    width : 150px;
    height : 150px;
    object-fit : cover;
    left : 3rem;
    z-index : 3;
}
.yes-drink{
    position : absolute;
    width : 40%;
    color : white;
    right : 0px;
    bottom : 0px;
    font-size : 20px;
    font-weight : bold;
    height : 200px;
    background : var(--colorPrimary);
    padding-left : 50px;
    display : flex;
    align-items : center;
    transform : translateY(25%);
    -webkit-transform : translateY(25%);
    -moz-transform : translateY(25%);
    -o-transform : translateY(25%);
}
.card-relative{
    margin-top : 100px;
    position : relative;    
    z-index : 2;
    transform : translateY(20px);
    -webkit-transform : translateY(20px);
    -moz-transform : translateY(20px);
    -o-transform : translateY(20px);
}
.footer{
    color : white;
    position : relative;
    background : var(--colorGreen);
}
.color-green{
    color : var(--colorGreen);
}
.btn-back{
    background : var(--colorPrimary);
    color : white;
}
.btn-default{
    background: #efefef;
    color : #bd8c08 !important;
}
.btn,.form-control,.card,.card-header{
    border-radius: 0px !important;
}
.btn-success,.btn-primary,.btn-green{
    color : white !important;
}
.btn-green{
    background: var(--colorGreen);
    border-color: var(--colorGreen);
}
.btn-green:hover{
    background: var(--colorGreen);
    border-color: var(--colorGreen);
}

.btn-primary{
    /* background: var(--colorPrimary); */
    background: #F7B70B;
    border-color: #F7B70B;
    /* border-color: var(--colorPrimary); */
}
.btn-primary:hover{
    /* background: var(--colorPrimary); */
    background: #F7B70B;
    border-color: #F7B70B;
    /* border-color: var(--colorPrimary); */
}
.btn-primary:not(:disabled):not(.disabled):active {
    /* background: var(--colorPrimary); */
    background: #F7B70B;
    border-color: #F7B70B;
    /* border-color: var(--colorPrimary); */
}
@media (min-width: 1200px){
    .container,.modal-tanggal {
        max-width: 1280px !important;
    }
}
@media (min-width: 992px){
    .container,.modal-tanggal {
        max-width: 1100px;
    }
}
@media (min-width: 768px){
    .container,.modal-tanggal {
        max-width: 860px;
    }
}
@media (min-width: 576px){
    .container,.modal-tanggal {
        max-width: 680px;
    }
}
.navbar-light{
    background : white;
}
.navbar-light li{
    margin-left : 5px;
    margin-right : 5px;
}
.navbar-light li a{
    padding: 0.5rem 0.7rem !important;
}
.navbar-light li a.active,.navbar-light li a:hover{
    background : #F7B70B;
    color : white !important;
}
.box-content{
    background : white;

}
.row-breadcrumbs h5 a{
    cursor: pointer;
}
.row-breadcrumbs h5{
    font-weight: 600 !important;
    color : #F7B70B;
}
.row-breadcrumbs h6{
    color : rgba(0,0,0,.5);

}
.row-breadcrumbs h5,.row-breadcrumbs h6{
    margin-top : 0;
    margin-bottom : 0;
    font-weight: 400;
}
.table-hover tbody tr:hover{
    background: rgba(71, 145,254,0.05) !important;
}
.table-primary, .table-primary>td, .table-primary>th{
    background-color: #F7B70B !important;
    color : white
}
.td-top{
    font-weight: 500;
    color : var(--colorPrimary);
}
.b-radius-3{
    border-radius: 3px !important;
}
.badge-lg{
    font-size: 15px;
    padding : 7px 14px !important;
}
.badge{
    padding : 4px 8px;
    font-weight: 500;
}
.bg-primary{
    background: var(--colorPrimary) !important;
    color : white;
}
.bg-darkBlue{
    background: var(--colorDarkBlue) !important;
}
.bg-rgb-info,.badge-info{
    background: rgba(23, 162,184,0.2);
    color : #17a2b8;
}
.badge-primary,.btn-rgb-primary,.bg-rgb-primary{
    color: #a67e12;
    background : #F7B70B;
    /* color : var(--colorPrimary); */
}
.badge-warning,.btn-rgb-warning,.bg-rgb-warning{
    background: rgba(255, 193,7,0.2);
    color : #ffc107;
}
.badge-success,.btn-rgb-success,.bg-rgb-success{
    background: rgba(40, 167,69,0.2);
    color : #28a745;
}
.badge-danger,.btn-rgb-danger,.bg-rgb-danger{
    background: rgba(220, 53,69,0.2);
    color : #dc3545;
}
.table-custom tbody tr td{
    vertical-align: middle;
}
.table-custom tbody tr td{
    position: relative;
}
.table-custom tbody tr td .btn-action{
    opacity: 0;
    transition: all.3s ease-in-out;
}
.table-custom tbody tr:hover td .btn-action{
    opacity: 1;
}
label{
    font-weight: 600;
    color : #F7B70B;
}
.color-darkBlue{
    color : var(--colorDarkBlue)
}
.select2{
    width : 100% !important;
}
.select2-container--default .select2-selection--single{
    border-radius: 0px;
    border : 1px solid #ced4da;
    height: calc(2.25rem + 2px);
    padding : .375rem .75rem;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: inherit;
    color : inherit;
    padding : 0px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected]{
    background: #F7B70B;
    /* background: var(--colorPrimary); */
}
.datepicker{
    padding : .375rem .75rem;
    font-weight: 300;
}
.form-control:disabled, .form-control[readonly]{
    background: #f0f1f3;
}
.input-penugasan-popup{
    display :none;
}
.input-penugasan-popup.active{
    display :block;
}
.btn-pointer{
    cursor: pointer;
}
.disabled{
    cursor : no-drop;
    pointer-events: inherit !important;
}
.loop-tanggal{
    display : inline-block;
}
.select-anggota.selected-ketua{
    color : #4099ff !important;
    font-weight: bold;
}
.select-anggota.selected-ketua label:after{
    content : "(Ketua)";
}
.select-anggota .isKetua{
    display : none;
    margin-left : 10px;
    cursor : pointer;
    color : #4099ff;
    text-decoration : underline;
}
.select-anggota.checked:not(.selected-ketua):hover .isKetua{
    display : inline-block;
}
.remove-tanggal:hover{
    color : red;
    cursor: pointer !important;
}
.fc-event{
    background : var(--colorPrimary) !important;
    color : white !important;
    cursor: pointer;
}
.fc-button-group button{
    background: rgba(71, 145,254,0.2);
    color : var(--colorPrimary);
}
.fc-today-button{
    background: var(--colorPrimary);
    color : white;
}
.fc-center h2{
    font-size: 1.25rem;
    font-weight: bold;
    color : var(--colorDark);
}
.fc-unthemed td.fc-today{
    background: rgba(71, 145,254,0.05) !important;
}
.fc-day-grid-event{
    padding : 3px 8px
}
.table td, .table th{
    padding :1rem;
}
.card-body{
    overflow: hidden;
    position: relative;
}
.sticky-fa-card{
    position : absolute;
    left : 0;
    top : 0;
    font-size: 100px;
    opacity: 0.2;
    transform: translate(-20%,-20%);
    -webkit-transform: translate(-20%,-20%);
    -moz-transform: translate(-20%,-20%);
    -o-transform: translate(-20%,-20%);
}
.alert{
    padding : 1rem 1.25rem;
}
#login .input{
    position: relative;
}
#login .input input:focus{
    box-shadow: none;
}
#login .input input{
    position: relative;
    border : none;
    border-bottom :1px solid #ced4da;
    padding-left : 2rem;
}
#login .input span{
    z-index: 2;
    position: absolute;
    font-size: 18px;
    top : 50%;
    left : 2px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.content-detail{
    position: relative;
}
.loading-content-detail{
    background: #f0f1f3;
    padding : 5px 10px;
    border-radius: 3px;
    display: inline-block;
}
p .loading-content-detail{
    min-width: 300px;
}
#modalDetail .modal-body{
    padding : 0px;
}

#cek-poin .input {
    position: relative;
}

#cek-poin .input input:focus,#cek-poin .input select:focus {
    box-shadow: none;
}

#cek-poin .input input,#cek-poin .input select {
    position: relative;
    border: none;
    border-bottom: 1px solid #ced4da;
    padding-left: 2rem;
}

#cek-poin .input span {
    z-index: 2;
    position: absolute;
    font-size: 18px;
    top: 50%;
    left: 2px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

.img-responsive {
    margin-left: 0px;
}

@media (min-width: 768px) {
    .img-responsive {
        margin-left: 115px !important;
    }
}
.container.custom {
    min-width: 90% !important;
}
.alert-primary{
    color: #a67e12;
    background-color: #F7B70B;
}

.paginate_button page-item{
    padding: 0 !important;
    color: #F6B70C !important;
}