.fa-star {
  cursor: pointer;
}

/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/* Sticky footer styles
-------------------------------------------------- */
#firebaseui-auth-container {
    border-style: solid !important;
    border-width: thin !important;
    border-color: #e6e6e6 !important;
    border-radius: 5px !important;
    padding: 0.5rem !important;
    margin: auto;
    margin-top: 2rem;
    margin-bottom: 2rem;
    display: block;
    width: fit-content;
    text-align: center;
}

#firebaseui-auth-container ul {
    display: grid;
}

.post {
    padding-top: 1rem;
    padding-bottom: 1rem;;
}

.external-image {
    color: unset;
    width: 250px;
}

ul.menuUL {
    display: block;
    width: unset;
    border-bottom: unset;
}

li.menuUL {
    display: block;
    width: unset;
}

button.showMenuButton {
    display: block;
}

span.upArrow {
    display: none;
}

.interesting-text {
    font-size: 1.5rem;
}

.example-image {
    border: lightgrey;
    border-style: solid;
    border-width: thin;
    margin: 10px;
}

.carousel {
    border: lightgrey;
    border-style: solid;
    border-width: thin;
}

@media screen and (max-width: 900px) {
    span .upArrow {
        display: inline-block;
    }
    ul.menuUL {
        display: none;
        width: 100%;
        border-bottom: thin solid #0350ad;
    }
    li.menuUL {
        display: none;
        width: 100%;
    }
    button.menuUL {
        display: none;
        width: 100%
    }
    button.showMenuButton {
        display: block;
    }
}

#page-container {
    padding-top: 6.5rem;
    position: relative;
    min-height: 100%;

}

#content-wrap {
    /*  padding-bottom: 10rem;  Footer height */
    flex: 1 0 auto;
}

#cookies {
    display: none;
}

html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
}

.footer {
    position: sticky;
    bottom: 0;
    width: 100%;
    flex-shrink: 0;
    /* height: 100vh;  Footer height */
}

html {
    font-size: 14px;
    color: #585858;
}

.navbar {
    height: 6.5rem;
    background-color: white;
}

.input-group-text {
    background-color: inherit;
}

.border-top {
    border-top: 1px solid #b3daff;
}
.border-bottom {
    border-bottom: 1px solid #b3daff;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

.remove-all-styles a{
    padding: 0;
    display: initial;
    text-align: unset;
    font-size: unset;
}

.remove-all-styles-hover a:hover:not(.active), a:hover:not([href]):not([tabindex]) {
    color: unset;
    background-color: unset;
}

.remove-all-styles-button button:hover:not(.active) {
    color: unset;
    background-color: unset;
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

ul.menu-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #fff;
}

ul.menu-list, li {float: left;}

ul.menu-list, h4.menu-list {
    display: block;
    color: white;
    text-align: center;
    text-decoration: none;
}

.importantImage {
    padding: 20px;

    margin-left: 10px;
    margin-right: 10px;
}

.importantButton {
    background-color: #ffa600;
    font-size: 3vw;
    color: #fff;
    width: 60%;
    margin-left: 20%;
    margin-right: 20%;
    margin-top: 3rem;
    margin-bottom: 3rem;
    font-weight: 400;
}

.importantContainer {
    margin-top: 2rem;
    margin-bottom: 2.5rem;
    font-weight: 400;
}

.importantContainer p {
    font-size: calc(12px + 1vw);
    padding: 0;
    padding-bottom: 2rem;
    margin-left: 20px;
}

.importantContainer h1 {
    font-size: calc(12px + 3.5vw);
    margin: 0;
    font-weight: 400;
}

.space {
    margin: 2.5rem;
}

ul.menu-list, li, a, button {
    display: block;
    background-color: white;
    color: #0350ad;
    text-align: center;
    text-decoration: none;
    border: none;
    padding: 10px;
    font-size: 14px;
}

a, button {
    padding: 14px 16px;
    font-weight: 400;
}

button:hover:not(.active), a:hover:not(.active), a:hover:not([href]):not([tabindex]) {
    background-color: #0350ad;
    color: white;
    text-decoration: none;
}

a.external-image:hover:not(.active), a.external-image:hover:not([href]):not([tabindex]) {
    background-color: unset;
    color: white;
    text-decoration: none;
}

error {
    color: red;
}

.card-footer {
    background-color: white;
}

.card {
    border-style: none;
}

.dropdown-container .dropdown-content {
    display: none;
    position: absolute;
    left:auto;
    right:0;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 5;
}

.dropdown-container-left .dropdown-content-left {
    display: none;
    position: absolute;
    left: inherit;
    right: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 5;
}

.dropdown-container:hover .dropdown-content {
    display: block;
    min-width: max-content;
}

.dropdown-container-left:hover .dropdown-content-left {
    display: block;
    min-width: max-content;
}

.question {
    margin: auto;
    width: 60%;
    border: 1px solid #0350ad;
    border-radius: 5px;
    padding: 5px;
    text-align: center;
    position: center;
    background: white;
}

.buttonGroup {
    display: block;
    position: center;
}

/* Sticky footer styles
-------------------------------------------------- */
::deep html {
  position: relative;
  min-height: 100%;
}

p {
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400;
}

.special-title {
    font-variant-caps: petite-caps;
    font-size: x-large;
}

.special-sub-title {
    font-variant-caps: titling-caps;
    font-size: large;
}

.milestone-title {
    font-variant-caps: titling-caps;
    font-size: large;
}

.card-title {
    font-size: medium;
    font-weight: bold;
}

.subject-card {
    border-style: none;
    color: #0350ad;
    background-color: #fbfafd;
}

.subject-card-a {
    color: #0350ad;
    background-color: #fbfafd;
}

@keyframes glowing {
    0% {
        color: white;
        background-color: #0350ad;
        box-shadow: 0 0 5px #0350ad;
    }

    50% {
        color: #0350ad;
        background-color: #CBE2FE;
        box-shadow: 0 0 20px #CBE2FE;
    }

    100% {
        color: white;
        background-color: #0350ad;
        box-shadow: 0 0 5px #0350ad;
    }
}

.flash-button {
    animation: glowing 1300ms 5;
}

ul {
    font-weight: 400;
}

.main-navbar {
    background-color: white;
    padding: 0;
    box-shadow: 0 3px 2px -2px rgba(0,0,0,.1);
    border-top-color: #0350ad;
    border-top-style: solid;
}

.table.table {
    color: #585858;
}

.firebaseui-title {
    color: #585858;
}