.min-h-screen {
    min-height: 92.5vh !important;
}

main {
    min-height: 82.5vh;
}

.logo {
    width: 48px;
}

.card {
    border-radius: 15px !important;
}

.contact-us, .purple-color {
    background: #6C63FF !important;
    border-color: #6C63FF !important;
}

.go_to_dashboard .logo {
    width: 49px;
    cursor: pointer;
}

.welcome_screen {
    z-index: 10;
}

.fa-school {
    margin-top: 5px !important;
}

.size_modal {
    max-width: 800px;
}

.saved-quiz:hover, .organize-quiz:hover, .new-card:hover {
    background:#6C63FF;
}

.saved-quiz:hover i, .saved-quiz:hover h4, .organize-quiz:hover i, .organize-quiz:hover h4, .new-card:hover i, .new-card:hover h2 {
    color: #fff !important;
}

.update_quiz {
    color: saddlebrown;
}
.update_quiz_button {
    background-color: saddlebrown !important;
    border-color: saddlebrown !important;
}

.ques_icon {
    width: 30px;
    height: 30px;
    opacity: .85;
    margin-top: 5px;
}

.card_back_color {
    background: #fff !important;
}

.dashboard_back {
    position: absolute;
    top: 3rem;
    right: 6rem;
    width: 30%;
}

.homepage {
    z-index: 10;
}

#fa-back {
    left: 50px;
    z-index: 10;
}

.media_image {
    width: 70%;
    height: 250px;
}

.home_image {
    width: 230px;
}

.input-group-text {
    background: antiquewhite !important;
}

.purple-text {
    color: #6C63FF;
}

/************Mobile Compatible****************/

@media screen and (max-width: 991px) {
    .saved-quiz .card-body, .organize-quiz .card-body, .dashboard-quiz .card-body {
        margin: .5rem;
    }

    .saved-quiz .card-body i, .organize-quiz .card-body i, .dashboard-quiz .card-body i {
        font-size: 2rem;
    }
    
    .saved-quiz .card-body h2, .organize-quiz .card-body h2, .dashboard-quiz .card-body h2 {
        font-size: 1.25rem;
    }

    .media_image {
        width: 90%;
    }
    
    .max-w-7xl #fa-edit {
        font-size: 1.5rem;
        margin-top: 2px;
    }

    .max-w-7xl #fa-edit ~ h2 {
        font-size: 1rem;
    }

    .quiz-header > div > div:nth-child(2) > h3 {
        font-size: 1.5rem;
    }

    .welcome_screen {
        display: none;
    }

    .max-w-7xl .fa-school {
        margin-top: 0 !important;
    }

    .max-w-7xl #fa-back {
        position: relative !important;
        left: 0;
        margin: auto 0;
        margin-right: 15px;
        font-size: 26px;
    }

    .max-w-7xl #fa-back ~ h2 {
        margin: auto 0;
    }
}

@media screen and (max-width: 767px) {
    #fa-home {
        font-size: 1.75rem !important;
    }

    #fa-home ~ h2 {
        font-size: 1rem !important;
    }

    .home_image {
        width: 40%;
    }

    .save-card, .make-card {
        margin-top: 1.5rem !important;
    }

    .modal-title {
        font-size: 1rem;
    }

    #ContactUsModal .contact_image {
        margin-top: 15px !important;
    }

    /********** Header ***********/
    .logo {
        width: 45px;
    }

    .profile-info {
        display: flex;
    }

    /******** Footer *********/
    .footer {
        padding-right: 2rem !important;
    }

    /******** Update and Create Quiz **********/

    .update-set, .create-set, .play-set {
        padding-left: 16px;
        padding-right: 16px;
    }

    .dashboard-quiz > .container > .row:nth-child(2) > div:first-child {
        display: none;
    }

    .create-set {
        display: flex;
        flex-direction: column-reverse;
    }

    .update-set .card-body, .create-set .card-body, .play-set .card-body {
        padding: 0 !important;
        margin: .75rem !important;
    }

    .question-options {
        margin-left: 0 !important;
    }

    .question-media {
        margin-left: 0 !important;
    }

    .media_image {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
        height: 70%;
        width: 70%;
    }

    .back_link {
        margin-top: 5px;
    }

    .ques_icon {
        margin-top: 5px;
    }

    .go_to_dashboard {
        display: none !important;
    }

    .quiz-header {
        display: flex;
    }

    .quiz-header > div {
        width: 100%
    }

    .quiz-header #fa-edit {
        margin-right: .5rem !important;
        margin-left: .5rem !important;
    }

    .quiz-header > div > div:nth-child(2) h3 {
        font-size: 1rem !important;
        margin: auto 0 !important;
        margin-right: 12px !important;
    }

    .loading {
        height: 170% !important;
    }

    .loading > img {
        margin-top: 201px !important;
    }

    .welcome_screen.icon {
        display: block;
    }
}

@media screen and (min-width: 580px) {
    .update-set > div:first-child {
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media screen and (min-width: 767px) {
    .quiz-header {
        display: flex;
    }

    .quiz-header > div {
        width: 100%;
    }

    .quiz-header > div > div {
        margin-top: auto !important;
        margin-bottom: auto !important;
    }
}

@media screen and (min-width: 992px) {
    .quiz-header > #fa-back {
        left: -20px;
        margin: auto 0 !important;
        position: relative !important;
    }
}