﻿/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 20px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="select"] {
    max-width: 280px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }

    .body-content {
        padding: 0;
    }
}


.card {
    margin: 20px;
    width: auto;
}

h5 {
    margin-bottom: 25px;
}

.form-submission-fields {
    padding-left: 25px;
}

.submit-button {
    width: 100px;
    margin: auto;
}

.button-wrap {
    text-align: center;
}

.logo {
    width: 191px;
    display: block;
    margin: 0 auto;
}

h2 {
    text-align: center;
    width: 100%;
    white-space: nowrap;
    margin-top: 10px;
    text-align: center;
}

small {
    margin-bottom: 20px;
}

span {
    padding-top: 5px;
}

#myFieldset {
    margin-bottom: -40px;
}

.btn-outline-success {
    color: rgb(57, 143, 205) !important;
    background: white !important;
    border-color: rgb(57, 143, 205) !important;
}

    .btn-outline-success:hover {
        color: white !important;
        background-color: rgb(57, 143, 205) !important;
        border-color: rgb(57, 143, 205) !important;
    }

    .btn-outline-success:active {
        color: white !important;
        background-color: rgb(57, 143, 205) !important;
        border-color: rgb(57, 143, 205) !important;
    }

    .btn-outline-success:focus {
        box-shadow: 0 0 0 0.2rem rgba(57, 143, 205, 0.5) !important;
    }

    .btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-success.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(57, 143, 205, 0.5) !important;
    }

    .btn-outline-success.disabled, .btn-outline-success:disabled {
        color: dimgray !important;
        background-color: transparent;
        border-color: dimgray !important;
    }

        .btn-outline-success.disabled:hover, .btn-outline-success:disabled:hover {
            background-color: dimgray !important;
            color: white !important;
        }

        .btn-outline-success.disabled:focus, .btn-outline-success:disabled:focus {
            box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5) !important;
        }

.was-validated .form-control:valid, .form-control.is-valid, .was-validated .custom-select:valid, .custom-select.is-valid {
    border: 1px solid #ced4da !important;
}

    .was-validated .form-control:valid:focus, .form-control.is-valid:focus, .was-validated .custom-select:valid:focus, .custom-select.is-valid:focus {
        border-color: rgb(57, 143, 205) !important;
        box-shadow: 0 0 0 0.2rem rgba(57, 143, 205, 0.5) !important;
    }

.was-validated .custom-control-input:valid ~ .custom-control-label::before, .custom-control-input.is-valid ~ .custom-control-label::before {
    background-color: rgba(57, 143, 205, 0.25) !important;
}

.was-validated .custom-control-input:valid:checked ~ .custom-control-label::before, .custom-control-input.is-valid:checked ~ .custom-control-label::before {
    background-color: rgb(57, 143, 205) !important;
}

.was-validated .custom-control-input:valid ~ .custom-control-label, .custom-control-input.is-valid ~ .custom-control-label {
    color: black !important;
}

.myAnchor {
    color: #007bff !important;
    text-decoration: none !important;
    background-color: transparent !important;
    border: 0px;
}

    .myAnchor:hover {
        color: #0056b3 !important;
        text-decoration: underline !important;
        cursor: help !important;
    }

    .myAnchor:disabled {
        pointer-events: none !important;
        cursor: default !important;
        color: black !important;
    }

.anchorWrap {
    text-align: center;
}

.loader {
    position: fixed;
    z-index: 999;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid rgb(57, 143, 205) !important;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}

#loaderWrapper {
    background-color: rgba(0,0,0,0.3);
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
