@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans&family=Ubuntu&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@600&family=Roboto&display=swap');
.starter, .header {
    color: whitesmoke;
    font-family: 'Kanit', sans-serif;
    font-size: 36px;
    text-align: center;
}
body::before {
    background-attachment: fixed;
}
body {
    background-color: rgb(28, 28, 69);
    background-image: url("images/bg.png");
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/* The navigation menu */
.navbar {
    overflow: hidden;
    background-color: rgb(50, 41, 91);
}
    
/* Navigation links */
.navbar a {
    float: left;
    font-size: 16px;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}
    
/* The subnavigation menu */
.subnav {
    float: left;
    overflow: hidden;
    font-family: 'Ubuntu', sans-serif;
}
    
/* Subnav button */
.subnav .subnavbtn {
    font-size: 16px;
    border: none;
    outline: none;
    color: white;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
}
    
/* Add a red background color to navigation links on hover */
.navbar a:hover, .subnav:hover .subnavbtn {
    background-color: rgb(66, 55, 117);
}
    
/* Style the subnav content - positioned absolute */
.subnav-content {
    display: none;
    position: absolute;
    left: 0;
    background-color: rgb(66, 55, 117);
    width: 100%;
    z-index: 1;
}
    
/* Style the subnav links */
.subnav-content a {
    float: left;
    color: white;
    text-decoration: none;
}
    
/* Add a grey background color on hover */
.subnav-content a:hover {
    background-color: #eee;
    color: black;
}
    
/* When you move the mouse over the subnav container, open the subnav content */
.subnav:hover .subnav-content {
    display: block;
}

p {
    color: white;
    font-family: 'Roboto', sans-serif;
    text-align: center;
    padding-left: 100px;
    padding-right: 100px;
    font-size: 18px;
}
img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    /* width: 20%; */
    text-align: center;
    color: white;
}

a {
    color: rgb(255, 136, 0);
}
a:visited {
    color: rgb(166, 89, 0);
}
.nheader {
    color: whitesmoke;
    font-family: 'Kanit', sans-serif;
    font-size: 24px;
    text-align: center;
}

.filler {
    color: white;
    font-family: 'Roboto', sans-serif;
    text-align: center;
    font-size: 18px;
}
.filler2 {
    color: white;
    font-family: 'Roboto', sans-serif;
    text-align: center;
    font-size: 18px;
    margin-top: -0.5vw;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}
.stupidfix {
    margin-top: 300px;
}

@media(max-width: 768px){
    .filler {
        font-size: 8px;
    }
    .filler2 {
        font-size: 8px;
    }
}