@import url('fonts.googleapis.com/css?family=Roboto:400,900&display=swap');

body {

margin: 0px;
padding: 0px;
font-size: 16px;
font-family: "Roboto", sans-serif;

}

a {

color: white;
text-decoration: none;

}

a:hover {

text-decoration: underline;

}

.headerbar {

margin: 0px;
display: flex;
flex-direction: column;
justify-content: flex-start;
box-shadow: 2px 2px 10px darkgrey;
color: white;
background-color: rgb(10, 169, 121);
position: fixed;
left: 0;
top: 0;
width: 84.5vw;
transition: padding 1s;

}

.headerbar-full {

padding: 30px 100px 30px 100px;

}

.headerbar-compact {

padding: 5px 100px 5px 100px;

}

.headerbar-level {

display: flex;
flex-direction: row;
justify-content: flex-start;

}

.headerbar-spacer {

flex-grow: 3;

}

.headerbar-author {

display: flex;
flex-direction: row;
justify-content: center;

}

.headerbar-logo {

border-radius: 7px;
margin: 0px 0px 0px 7px;
padding: 7px 0px 7px 7px;
display: none;

}

.headerbar-author-image {

border-radius: 7px;
margin: 10px;
height: 75px;

}

.headerbar-author-text {

margin: 10px;
display: flex;
flex-direction: column;
justify-content: center;

}

.headerbar-author-text-name {

font-size: 18px;

}

.headerbar-author-text-description {

font-size: 14px;

}

.headerbar-title {

padding: 20px;
font-weight: bolder;
font-size: 48px;

}

.headerbar-buttons {

margin: 10px 0px 10px 0px;
display: flex;
flex-direction: row;
justify-content: flex-start;

}

.headerbar-buttons a {

border-radius: 7px;
margin: 0px 0px 0px 7px;
padding: 7px;
background-color: rgb(10, 180, 121);
transition: box-shadow 1s, text-shadow 1s;

}

.headerbar-buttons a:hover {

text-decoration: none;
text-shadow: 0px 0px 7px darkslategrey;
box-shadow: 0px 0px 7px darkslategrey;

}

.content {

line-height: 0.4in;
transition: margin 1s;

}

.content-full {

margin: 240px 100px 10px 100px;

}

.content-compact {

margin: 130px 100px 10px 100px;

}

.footerbar {

margin: 0px;
padding: 20px 10px 20px 10px;
box-shadow: -2px -2px 10px darkgrey;
font-weight: lighter;
font-size: 12px;
text-align: center;
color: white;
background-color: rgb(10, 169, 121);

}

.parallel-content {

display: flex;
flex-direction: row;
justify-content: flex-start;

}

.parallel-item { }

.parallel-spacer {

flex-grow: 3;

}

.slideshow {

display: flex;
flex-direction: row;
justify-content: flex-start;

}

.slideshow-slide {

text-align: center;
display: none;

}

.slideshow-button {

outline: none;
border: none;
padding: 7px;
border-radius: 7px;
color: white;
background-color: rgb(10, 169, 121);
font-size: 24px;
transition: box-shadow 1s;

}

.slideshow-button:hover {

box-shadow: 0px 0px 7px darkslategrey;
cursor: pointer;

}