/* Input Formatting on Validation based Vuejs Vuelidate library */

.dirty {
    border-color: #5A5 !important;
    background: #EFE !important;
}

.dirty:focus {
    outline-color: #8E8 !important;
}

.error {
    border-color: red !important;
    background: #FDD !important;
}

.error:focus {
    outline-color: #F99 !important;
}

/* Set Custom Widths */

.w-90 {
    max-width: 90% !important;
}

.w-95 {
    max-width: 95% !important;
}

.w-75 {
    max-width: 75% !important;
}

.w-85 {
    max-width: 85% !important;
}

.btn-xs {
    padding: 0.4rem 0.64rem;
    font-size: 0.66562rem;
    line-height: 1;
    border-radius: 0.2rem;
}

.card {
    max-width: 100% !important;
    overflow: hidden !important;
}

.card-text {
    word-wrap: break-word !important;
}

.text-info {
    color: #72B9D1 !important;
}

#home-first-image {
    background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/assets/img/home-bg-image.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    height: 350px;
}

/* Success resource submit css */

.medium-text {
    font-size: 26px;
}

.small-link {
    font-size: 20px;
    color: #ea7066;
}

.hero-section {
    height: 40vh;
    align-items: center;
    margin-bottom: 20px;
    margin-top: -20px;
}

.title {
    font-size: 40px;
}

nav.navbar.navbar-expand-md.navbar-sticky.navbar-white {
    margin-top: 0;
}

main.py-4 {
    margin-top: 8rem;
}

.dropdown-menu {
    z-index: 9999;
}

.forgot-password {
    padding-left: 15px;
}
.input-group.home-search {
    background-color: #fff!important;
    border: 2px solid #a6ce39;
    border-radius: 7px;
}
.multiselect__tags {
    border-radius: 7px;
    border: 2px solid #a6ce39!important;
}
.multiselect__input, .multiselect__single{
    border: none!important;
}

#submit-resource input, #submit-resource textarea, #submit-resource select{
    border: 2px solid #a6ce39;
}

.form-control {
    border: 1px solid #ced4da;
    height: calc(2.4375rem);
}

@media only screen and (max-width: 600px) {
    .resource-home-heading {
    padding-top: 1em !important;
    padding-top: 1em !important;
    padding-bottom: 1em;
    padding-left: 9px;
    }
}

@media (max-width: 768px)
.group-content .card {
    text-align: center!important;
}