@font-face {
    font-family:Oceanside Typewriter; /* choose a name */
    src:url('fonts/Oceanside Typewriter.ttf'); /* url of the font */
  
}

@font-face {
    font-family:;
    src:url('fonts/');
}

body{
    color:white;
    background-image:url(imgs/background.png);
}
    
header{
    
}

div.wrap {
    display:inline-block;
    background-color:#27278A;
    margin:10px 50px;
    border-style:double;
    border-color:gold;
    border-width:10px;
    border-radius:10px;
}

div.topbanner {
    margin:30px 20px 5px 25px;
    border-radius:10px;
}

div.blinkies {
    margin:0px 30px 0px 30px;
    background-image:url(imgs/background.png);
    padding:7px 0px 0px 0px;
    border-radius:10px;
}

/* styles the topnav */
ul.topnav {
    display: flex;
    list-style-type:none;
    margin:10px 0px 10px 10px;
}

/* controls size of nav button imgs */
ul.topnav a img {
    width:150px;
    height:60px;
}

ul.topnav li a {
    display:block;
    text-decoration:none;
    margin:0px 50px 0px 0px;
}

/* Change color on hover */
ul.topnav li a:hover {
    
}

div.topnav {
    
}

div.mainwrap {
    display:flex;
    flex-direction:row;
    margin:0px 0px 30px 53px;
    border-radius:10px;
}
    
div.main {
    display:block;
    width:579px;
    padding:3px 31px 10px 31px;
    margin:0px 60px 0px 0px;
    background-color:#4343BB;
    border-radius:10px;
}

.main div.title-main {
    display:block;
    text-align:center;
    padding:10px 10px 10px 10px;
    margin:0px 0px 0px 0px;
    border-radius:10px;
    background-color:#27278A;
}

.main div.p-main {
    font-family: Oceanside Typewriter; /* use font */
    display:block;
    text-align:left;
    padding:10px 10px 10px 10px;
    margin:0px 0px 0px 0px;
    border-radius:10px;
    background-color:#3838AA;
}

.main div.title-updates {
    display:block;
    text-align:center;
    padding:10px 10px 10px 10px;
    margin:0px 0px 0px 0px;
    border-radius:10px;
    background-color:#27278A;
}

.main div.p-updates {
    font-family: Oceanside Typewriter; /* use font */
    display:block;
    text-align:center;
    padding:10px 10px 10px 10px;
    margin:0px 0px 0px 0px;
    border-radius:10px;
    background-color:#3838AA;
}

div.side {
    width:179px;
    padding:0px 30px 10px 30px;
    border-radius:10px;
    background-color:#4343BB;
}

.side div.title-moonwidget {
    display:block;
    text-align:center;
    padding:10px 10px 10px 10px;
    margin:0px 0px 15px 0px;
    border-radius:10px;
    background-color:#27278A;
}

.side div.moonbox {
    display:box;
    border-radius:10px;
}

.side div.mooniframe {
    padding:10px 10px 10px 17px;
    background-image:url(imgs/background.png);
    border-radius:10px;
}
    
.side div.moonwebring {
    margin:20px 0px 0px 20px;
}
    
    
    
    
div.footer{
    font-family: Oceanside Typewriter; /* use font */
    display:block;
    margin:30px 30px 30px 30px;
    background-color:#4343BB;
    border-radius:10px;
}

footer {
    padding:10px;
}