@font-face {
    font-family: 'Calibri';
    src: url('/assets/Calibri.ttf') format('truetype');
}

* {
    font-family: Calibri;
}
html {
  position: relative;
  min-height: 100%;
    /*--s: 15px;
    --_g: #0000 83%, #111 85% 99%, #0000 101%;
    background: radial-gradient(27% 29% at right, var(--_g)) calc(var(--s) / 2) var(--s), radial-gradient(27% 29% at left, var(--_g)) calc(var(--s) / -2) var(--s), radial-gradient(29% 27% at top, var(--_g)) 0 calc(var(--s) / 2), radial-gradient(29% 27% at bottom, var(--_g)) 0 calc(var(--s) / -2) #000;
    background-size: calc(2* var(--s)) calc(2* var(--s));
    background-attachment: fixed;*/
}

body {
    padding-bottom: 20px;
    background:#060d0d;
}

.jo-section {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
}

#main-nav .nav-item.active a {
    color: #fff !important;
}
/* Bob Up Down*/
@-webkit-keyframes float_up_down {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }

    50% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes float_up_down {
    0% {
        transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }

    25% {
        transform: translateY(30px);
        transform: translateY(30px);
        opacity: 1;
    }

    75% {
        transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 1;
    }

    100% {
        transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
}

.shaking {
    animation-name: float_up_down;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float_up_down;
    -webkit-animation-duration: 4s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float_up_down;
    -moz-animation-duration: 4s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float_up_down;
    -ms-animation-duration: 4s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float_left_right;
    -o-animation-duration: 4s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.nav-link:focus, .nav-link:hover{
    color:#fff;
}

.m90vh{
    min-height:90dvh;
}
.m80vh{
    min-height:80dvh;
}
.m70vh{
    min-height:70dvh;
}

.list-style-count{
    list-style:decimal-leading-zero;
}


.dropdown-item.active, .dropdown-item:active {
    background: white;
    color: black;
}

@keyframes flicker_green {
    0%, 18%, 22%, 25%, 53%, 57%, 100% {
        text-shadow: 0 0 1px #FFF, 0 0 1px #fff, 0 0 5px #fff, 0 0 6px #0fa, 0 0 5px #0fa, 0 0 1px #0fa, 0 0 1px #0fa, 0 0 1px #0fa;
    }

    20%, 24%, 55% {
        text-shadow: none;
    }
}

.green_glow {
    color: #0fa;
    text-shadow: 0 0 1px #FFF, 0 0 1px #fff, 0 0 5px #fff, 0 0 6px #0fa, 0 0 5px #0fa, 0 0 1px #0fa, 0 0 1px #0fa, 0 0 1px #0fa;
}
.green_flicker {
    color: #0fa;
    animation: flicker_green 1.5s infinite alternate;
}

.neonText {
    text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 15px #fff, 0 0 30px #fff;
    /*text-shadow: 0 0 1px #fff, 0 0 1px #fff, 0 0 1px #fff, 0 0 3px #0fa, 0 0 10px #0fa, 0 0 10px #0fa, 0 0 75px #0fa, 0 0 40px #0fa;*/
}

.datepicker table tr td.day:hover, .datepicker table tr td.day.focused{
    color:black;
}

.navbar-nav .icon {
    font-size: 1.5rem;
    color: gray;
    margin: 2px 5px;
    -webkit-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    transition: all 600ms ease;
}
    .navbar-nav .icon + .badge {
        color: gray;
        -webkit-transition: all 600ms ease;
        -ms-transition: all 600ms ease;
        -o-transition: all 600ms ease;
        -moz-transition: all 600ms ease;
        transition: all 600ms ease;
        position: absolute;
        top: 0;
        right: -10px;
    }
    .navbar-nav .icon:hover, .navbar-nav .icon:hover +.badge {
        color: white;
    }


@media (max-width:768px) {
    .navbar-brand{
        font-size:large !important;
    }
    .mylogo {
        width: 40px !important;
        height: 40px !important;
        top: 15px !important;
    }
}

.swal2-modal {
    box-shadow: lightgrey 0px 0px 5px;
}