#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    background-color: black;
}

html,
body {
    background-color: #0b111c;
}

body {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(47, 140, 255, 0.16), transparent 30%),
        radial-gradient(circle at bottom right, rgba(116, 199, 255, 0.08), transparent 34%),
        linear-gradient(180deg, #06101f 0%, #0b111c 100%);
    background-attachment: fixed;
    color: #f3f9ff;
}

a {
    color: #74c7ff;
}

#top {
    display: flex;
    flex-direction: row;
    height: 54px;
    justify-content: space-between;
}

#logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-left: 10px;
}

#logoImage {
    display: flex;
    flex-direction: row;
}

#siteTitle {
    display: flex;
    flex-direction: row;
    font-size: 30px;
    font-weight: bold;
    margin-left: 10px;
}

#siteTitle a {
    color: white;
    text-decoration: none;
}

#profileActions {
    display: flex;
    flex-direction: row;
    align-items: center;
    min-width: 225px;
    height: 54px;
    /*justify-content: flex-end;*/
}

#addVideoAction,
#accountAction {
    margin-right: 10px;
    line-height: 54px;
    vertical-align: center;
    align-items: center;
}

.profileAction {
    margin-right: 10px;
    line-height: 54px;
    vertical-align: center;
    align-items: center;
}


#siteLink {
    text-decoration: none;
    font-weight: bold;
}

#siteLink:visited {
    text-decoration: none;
    font-weight: bold;
}

#siteLink:link {
    text-decoration: none;
    font-weight: bold;
}

#siteLink:hover {
    text-decoration: none;
    font-weight: bold;
}


#siteLink:active {
    text-decoration: none;
    font-weight: bold;
}

#categoriesHolder {
    display: flex;
    transition: transform 0.15s cubic-bezier(.05, 0, 0, 1);
}

#categoryContainer {
    display: flex;
    padding-left: 10px;
    padding-right: 10px;
    height: 34px;
    position: relative; /* Needed for positioning the pseudo-elements */
}


.categoryItem {
    height: 34px;
    text-align: center;
    font-size: 1.2rem;
    line-height: 34px;
    margin-right: 10px;
    white-space: nowrap;

}

#headerBehindSpacer {
    display: flex;
    height: 88px;
    width: 100%;
    margin-bottom: 10px;
}

#container {
    margin: 20px;
}
#container2 {
    margin: 20px;
}

input,
select,
textarea {
    background-color: #f8fcff;
    border-color: #9fc8ee;
}