﻿.ButtonContainer a {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);
}

    .ButtonContainer a:hover, .ButtonContainer a:focus {
        -webkit-animation: ShadowPop 0.1s linear both;
        animation: ShadowPop 0.1s linear both;
    }

    .ButtonContainer a i {
        position: absolute;
        font-size: 20rem;
        color: antiquewhite;
        bottom: -3rem;
        left: -6rem;
    }

        .ButtonContainer a i.fa-graduation-cap, .ButtonContainer a i.fa-file-certificate {
            transform: scaleX(-1);
        }

.ButtonContainer button {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);
}

    .ButtonContainer button:hover, .ButtonContainer button:focus {
        -webkit-animation: ShadowPop 0.1s linear both;
        animation: ShadowPop 0.1s linear both;
    }

    .ButtonContainer button i {
        position: absolute;
        font-size: 20rem;
        color: antiquewhite;
        bottom: -3rem;
        left: -6rem;
    }

        .ButtonContainer button i.fa-graduation-cap, .ButtonContainer button i.fa-file-certificate {
            transform: scaleX(-1);
        }


@-webkit-keyframes ShadowPop {
    0% {
        -webkit-box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e;
        box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e !important;
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }

    100% {
        -webkit-box-shadow: 1px 1px #3e3e3e, 2px 2px #3e3e3e, 3px 3px #3e3e3e, 4px 4px #3e3e3e, 5px 5px #3e3e3e, 6px 6px #3e3e3e, 7px 7px #3e3e3e, 8px 8px #3e3e3e;
        box-shadow: 1px 1px #3e3e3e, 2px 2px #3e3e3e, 3px 3px #3e3e3e, 4px 4px #3e3e3e, 5px 5px #3e3e3e, 6px 6px #3e3e3e, 7px 7px #3e3e3e, 8px 8px #3e3e3e !important;
        -webkit-transform: translateX(-8px) translateY(-8px);
        transform: translateX(-8px) translateY(-8px);
    }
}

@keyframes ShadowPop {
    0% {
        -webkit-box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e;
        box-shadow: 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e, 0 0 #3e3e3e !important;
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }

    100% {
        -webkit-box-shadow: 1px 1px #3e3e3e, 2px 2px #3e3e3e, 3px 3px #3e3e3e, 4px 4px #3e3e3e, 5px 5px #3e3e3e, 6px 6px #3e3e3e, 7px 7px #3e3e3e, 8px 8px #3e3e3e;
        box-shadow: 1px 1px #3e3e3e, 2px 2px #3e3e3e, 3px 3px #3e3e3e, 4px 4px #3e3e3e, 5px 5px #3e3e3e, 6px 6px #3e3e3e, 7px 7px #3e3e3e, 8px 8px #3e3e3e !important;
        -webkit-transform: translateX(-8px) translateY(-8px);
        transform: translateX(-8px) translateY(-8px);
    }
}


#BackToTop {
    display: none;
}



.ButtonContainer {
    display: grid;
    justify-content: center;
    grid-gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    z-index: 1;
    position: relative;
}

    .ButtonContainer a {
        height: 15rem;
        padding: 1rem;
        border-radius: 2rem;
        display: grid;
        align-content: center;
        overflow: hidden;
    }

        .ButtonContainer a span {
            color: #212529;
            font-size: 2rem;
            font-weight: 300;
            z-index: 1;
        }

.ButtonContainer button {
    height: 15rem;
    padding: 1rem;
    border-radius: 2rem;
    display: grid;
    align-content: center;
    overflow: hidden;
}

    .ButtonContainer button span {
        color: #212529;
        font-size: 2rem;
        font-weight: 300;
        z-index: 1;
    }


@media only screen and (max-width: 600px) {
    #Wrapper {
        padding: 1rem 1rem;
    }

    .ButtonContainer a i {
        bottom: -6rem;
        transform: scale(.75);
        width: 100%;
    }

        .ButtonContainer a i.fa-graduation-cap, .ButtonContainer a i.fa-file-certificate {
            transform: scale(-.65, .65);
        }

    .ButtonContainer a {
        height: 10rem;
        display: grid;
        align-content: center;
    }

        .ButtonContainer a span {
            color: #212529;
            font-size: 2rem;
            font-weight: 300;
            z-index: 1;
        }

    .ButtonContainer button i {
        bottom: -6rem;
        transform: scale(.75);
        width: 100%;
    }

        .ButtonContainer button i.fa-graduation-cap, .ButtonContainer button i.fa-file-certificate {
            transform: scale(-.65, .65);
        }

    .ButtonContainer button {
        height: 10rem;
        display: grid;
        align-content: center;
    }

        .ButtonContainer button span {
            color: #212529;
            font-size: 2rem;
            font-weight: 300;
            z-index: 1;
        }
}

.card.admin {
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.075);
    border: 0;
}

form.custom label {
    margin: 0;
    margin-top: .5rem;
}

form.custom input, form.custom textarea, form.custom select {
    box-shadow: var(--sm-shadow);
}

.schedulebtn, .modalTriggerBtn, .covidTestingUpdate {
    padding: 16px 6px 16px 6px;
}

.modalTriggerBtn, .covidTestingUpdate {
    margin: auto;
}
.modalBtnDiv {
    margin-top: 4px;
    display: flex;
}