/*Navbar */

/*Outer proportions*/
.container {
    margin:0 auto;
    padding-left:-5px;
    padding-right:3px;
    flex-shrink:7;
}

.menu-area ul {
    list-style:none;
    padding-left:0px;
    padding-right:0px;
    display:flex;
    /*border:1px solid;
    border-color:red;*/
    max-width:300px;
    margin-left:-5px;
    margin-right:0px;
    margin-top:0px;
    margin-bottom:0px;
}

/*Nerdy proportions stuff*/
.menu-area li {
    flex:4;
    padding:5px;
}

.menu-area .icon-area {
    flex:1;
}

/*Button styling*/
.menu-area a {
    display:inline-block;
    width:100%;
    text-align:center;
    transition:.6s;
    color:#ca0055;
    font-weight:bold;
    letter-spacing:2px;
    text-decoration:none;
    background:#ffd2e1;
    padding:15px 0px;
    font-family:space mono;
    border:5px outset;
    border-color:#ffd2e1;
}

.menu-area a:hover {
    background:white;
    color:black;
    border:5px inset;
    border-color:white;
}

.menu-area .active {
    border:5px inset;
    border-color:#ffd2e1;
    background-color:#ffeaf1;
}

@media all and (max-width: 2000px) {
    .menu-area ul {
        flex-wrap: wrap;
    }
    .menu-area li {
        flex: 1 1 60%;
    }
    .menu-area .icon-area {
         flex:1 1 20%;
    }
}

@media all and (max-width: 500px) {
    .menu-area li {
        flex-basis:100%;
    }
}

body {
    background-color:#ffeaf1
}

/* Other boxes*/

/*outer box*/
.bounding-box {
    display:flex;
    flex-direction:row;
    align-items:left;
    justify-content:center;
    background-color:#ffeaf1;
    min-height:450px;
    margin:auto;
    margin-top:15px;
    margin-left:15px;
    margin-right:15px;
    /*border:solid;
    border-color:black;*/
    background:#ffeaf1;
    border-style:double;
    padding:10px;
    border-color:#8c003b;
}

/*header*/
.header-box {
    display:flex;
    flex-direction:column;
    max-width:100%;
    /*border:solid;
    border-color:blue;*/
    min-height:100%;
    margin-top:-21px;
    margin-right:10px;
    justify-content:left;
}

.headertext {
    position:relative;
}

/*Body box*/

.bodybox {
    padding:10px;
    border:10px inset;
    border-color:white;
    width:70%;
    min-height:100%;
}

/* Contact Me page */

table, th, tr, td {
    border:1px solid #8c003b;
    font-family:space mono;
    color:#26000d;
}


/* Generic text styling*/

h1 a {
    display:block;
    color: #ffeaf1;
    font-family:dotgothic16;
    background-color:#26000d;
    padding-top:5px;
    padding-left:10px;
    border:5px dashed;
    border-color:#ca0055;
    text-decoration:none;
}

h2, h3 {
    color:#ca0055;
    font-family:dotgothic16;
}

p {
    color:#26000d;
    font-family:space mono;
}

ul a {
    color:#ca0055;
    font-family:space mono;
}

ol {
    color:#26000d;
    font-family:space mono;
}

/* Font imports*/

.dotgothic16-regular {
  font-family: "DotGothic16", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.space-mono-regular {
  font-family: "Space Mono", monospace;
  font-weight: 400;
  font-style: normal;
}

.space-mono-bold {
  font-family: "Space Mono", monospace;
  font-weight: 700;
  font-style: normal;
}

.space-mono-regular-italic {
  font-family: "Space Mono", monospace;
  font-weight: 400;
  font-style: italic;
}

.space-mono-bold-italic {
  font-family: "Space Mono", monospace;
  font-weight: 700;
  font-style: italic;
}