/*Fonts*/

@font-face {
    font-family: 'TTWeb-Regular';
    src: url(/Fonts/TitilliumWeb-Regular.ttf) format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'TTWeb-Light';
    src: url(/Fonts/TitilliumWeb-ExtraLight.ttf) format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*Body*/

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    left: 0;
    top: 0;
}

body {
    background-color: rgb(15,15,15);
    color: rgb(250,250,250);
    font-family: TTWeb-Regular;
}

/*Site-wide link behaviour*/

a {
    color: rgb(255,175,0);
}

a:visited {
    color: rgb(255,175,0);
}

a:hover {
    color: rgb(255,100,0);
    text-decoration: underline;
}

/*Site Layout*/

.titleBar {
    position: absolute;
    width: 100%;
    height: 75px;
    margin: 0;
    top: 0;
    left: 0;
    background-color: rgba(255,138,0,1);
    z-index: 90002;
    font-family: 'Eras ITC';
}

.navBar {
    position: absolute;
    width: calc(100% - 100px);
    height: 25px;
    margin: 0;
    top: 75px;
    left: 100px;
    background-color: rgba(255,138,0,0.75);
    z-index: 90001;
    font-family: 'Eras ITC';
}

.contentPane {
    position: absolute;
    width: calc(100% - 20px);
    height: calc(100% - 100px);
    top: 100px;
    left: 0;
    margin-left: 10px;
    margin-right: 10px;
    z-index: 90000;
}

/*NavBar flexbox*/

.navFlexContainer {
    display: flex;
    width: 100%;
    height: 25px;
    z-index: 90001;
    margin: 0;
}

.navCategory {
    position: relative;
    width: 22.5%;
    height: 25px;
    background-color: rgba(0,0,0,0);
    margin: 0;
    text-align: center;
}

.navCategory:hover {
    background-color: rgba(255,138,0,1);
    cursor: pointer;
}

.navDropdown_active {
    position: absolute;
    top: 25px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: stretch;
    height: fit-content;
    z-index: 90002;
}

.navDropdown_inactive {
    display: none;
}

.navDropdown_active div {
    margin: 0;
    padding: 0;
    background-color: rgba(255,138,0,0.75);
}

.navDropdown_active div:hover {
    background-color: rgba(255,138,0,1);
}

/*.navFlexDropdownContainer {
    display: flex;
    flex-direction: row;
    width: 100%;
    margin: 0;
    position: absolute;
    width: 100%;
}*/

/*Images and Videos*/

.titleBarImage {
    position: absolute;
    margin: 0;
    top: 0;
    left: 0;
}

/*Headers*/

.hSiteTitle {
    position: absolute;
    margin: 0;
    top: 0;
    left: 110px;
    color: rgb(0,0,0);
    font-size: 50px;
}

.hSiteAuthor {
    position: absolute;
    margin: 0;
    top: 47.5px;
    left: 110px;
    color: rgb(0,0,0);
    font-size: 20px;
}

/*Paragraphs*/

.pNavButton {
    margin: 2.5px;
    color: rgb(0,0,0);
}

.p17 {
    margin: 5px;
    color: rgb(255,255,255);
    font-size: 17px;
}

.p12 {
    margin: 5px;
    color: rgb(255,255,255);
    font-size: 12px;
}

.p17T1 {
    margin: 5px;
    margin-left: 50px;
    color: rgb(255,255,255);
    font-size: 17px;
}

/*Spans*/

.black {
    color: rgb(0,0,0);
}