@import url("https://fonts.googleapis.com/css2?family=Poppins&display=swap");

html {
    font-family: "Poppins" !important;
}
body {
    font-family: "Poppins" !important;
    color: #333333;
}

.main-header {
    border: none;
}

[class*=sidebar-light-] .sidebar a {
    color: #5b6064;
}

[class*="sidebar-light"] .brand-link {
    border: none;
}
.sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active {
    background-color: #9f5bfeb7;
    color: #fff;
}

.modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 35%;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

.modal.left .modal-dialog {
    position: fixed;
    margin: auto;
    max-width: 100%;
    width: 60%;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body {
    padding: 15px 15px 80px;
}

/*Left*/
.modal.left.fade .modal-dialog {
    left: -400px;
    -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
    -o-transition: opacity 0.3s linear, left 0.3s ease-out;
    transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left.fade.show .modal-dialog {
    left: 0;
}

/*Right*/
.modal.right.fade .modal-dialog {
    right: -400px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.show .modal-dialog {
    right: 0;
}

.rounded-lg {
    border-radius: 0.5rem !important;
}

.rounded-xl {
    border-radius: 1rem !important;
}

.card-add-project {
    color: #333333;
}

.card-add-project:hover {
    text-decoration: underline;
    box-shadow: 2px 1px 8px 1px rgba(0, 0, 0, 0.44);
    -webkit-box-shadow: 2px 1px 8px 1px rgba(0, 0, 0, 0.44);
    -moz-box-shadow: 2px 1px 8px 1px rgba(0, 0, 0, 0.44);
}

.card-detail-project:hover {
    text-decoration: underline;
    box-shadow: 2px 1px 8px 1px rgba(0, 0, 0, 0.44);
    -webkit-box-shadow: 2px 1px 8px 1px rgba(0, 0, 0, 0.44);
    -moz-box-shadow: 2px 1px 8px 1px rgba(0, 0, 0, 0.44);
}