html,
body {
    margin: 0;
    padding: 0;
    height: 100%;
}

canvas {
    display: block;
    vertical-align: bottom;
}


/* ---- particles.js container ---- */

#particles-js {
    width: 100%;
    height: 100%;
    background-image: url('');
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

@font-face {
    font-family: consolas;
    src: url(consola.ttf);
}

@font-face {
    font-family: alliance;
    src: url(Alliance-No1-Light.otf);
}

@font-face {
    font-family: din;
    src: url(DIN.ttf);
}

@font-face {
    font-family: 'Raleway', sans-serif;
    src: url(Raleway-Regular.ttf);
}

.font-raleway {
    font-family: 'Raleway', sans-serif;
}

.font-consola {
    font-family: consola;
    font-weight: 600;
}

.font-alliance {
    font-family: alliance;
    font-weight: 600;
}

.font-din {
    font-family: din;
    font-weight: 500;
}

.nav-svg svg {
    fill: white;
}


/* end::tooltip */

.iclass {
    color: #ffffff;
}

.iclass:hover {
    color: #4f46e5;
}

.turbolinks-progress-bar {
    height: 5px;
    background-color: #4f46e5;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* Firefox */

input[type=number] {
    -moz-appearance: textfield;
}

.selectArrowHide {
    /* for Firefox */
    -moz-appearance: none;
    /* for Chrome */
    -webkit-appearance: none;
}

.bg-auto-change {
    animation: bganimation 120s infinite alternate;
}

@keyframes bganimation {
    0% {
        background-color: #818cf8;
    }
    25% {
        background-color: #94a3b8;
    }
    50% {
        background-color: #da4b4b;
    }
    75% {
        background-color: #10b981;
    }
    100% {
        background-color: #155e75;
    }
}

.inputBlank {
    border: none !important;
    outline: none !important;
    padding: 0.30rem 0.75rem !important;
    width: 100%;
}

.inputBlank:focus {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

#particles-js {
    background-image: url("academic-bg-icon.svg");
    background-repeat: repeat;
    background-position: left top;
    background-attachment: fixed;
}


/* Top Nav */

.text-85vw {
    font-size: 0.85vw;
}

.hightlight-code {
    padding: 2px 3px;
    font-size: 12px;
    background-color: #e6fcf5;
    border-radius: 3px;
}