/*** TEXT HIGHLIGHTS ***/

.hl1 {
color: #f13836;
background-image: url(https://media.istockphoto.com/photos/red-old-matte-grunge-faded-adobe-plaster-texture-abstract-cement-picture-id1299674661?b=1&k=20&m=1299674661&s=170667a&w=0&h=TI7PCc8wsK7eaL7bLFwLQJ8w0b1uR5JiYubOSy9OaKk=);
 background-repeat: repeat;
 background-size: 80%;
  background-position: center center;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}

/*** LAYOUT ***/

.html, body {
height: 100vh;
width: 100vw;
line-height: normal;}

.pagewrap {
display: flex;
justify-content: center;
height: 100vh;
width: 100vw;
background: url("") 50% repeat;
background-color: black;
background-blend-mode: multiply;}

.bodywrap {
display: flex;
justify-content: center;
width:100%;
margin: 0 auto;
background-color: none;}

.contentwrap {
display: flex;
flex-direction: column;
align-content: center;
justify-content: center;
max-width: 36em;
width: 100%;
height: 100vh;
background-color: none;
overflow-y: auto;
scrollbar-width: none;}

.headerbox {
display: flex;
order: 1;
flex-direction: row;
justify-content: center;
margin: 2vh 0 2vh 0;
min-height: 12em;
background-color: #46595c;
border-width: 10em;
border: solid;
border-color: #17191f;
border-radius: 1%;}

.centerbox {
display: flex;
order: 2;
flex-direction: row;
align-items: center;
justify-content: center;
text-align: right;
margin-bottom: 2vh;
height: 100%;
max-height: 36em;}

.footerbox {
display: flex;
order: 3;
padding: 2.5%;
min-height: 10vh;
background-color: #17191f;
border-width: 10em;
border: solid;
border-color: #17191f;
border-radius: 1%;}

/*** INNER-LAYOUT ***/

.headerimg {
display: flex;
flex-direction: row;  
position: relative;  
padding: 1.5%;
width: 70%;
height: 100%;
background-color: #17191f;}

.headernav {
display: flex;
width: 30%;
height: 100%;
background-color: #e1e4eb;}

.navboxcont {
display: flex;
flex-direction: column;
justify-content: center;
padding: 6.5% 0% 6.5% 6%;
width: 100%;
height: 100%;
background-color: #17191f;}

.navbox {
display: flex;
justify-content: center;
align-items: center;
list-style: none;
width: 100%;
height: 100%;
border: 1.25px solid #17191f;
background-color: #e1e4eb;}

a.navbox {
font-family: SourceSerif4SB;
color: #17191f;
font-size: 10.6px;
letter-spacing: 1.5px;
text-decoration: underline overline #17191f;
text-underline-offset: 3.5px;
transition: all .25s;
user-select: none;}

a.navbox:hover {
letter-spacing: 2.5px;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
color: #f3dbdb;
text-decoration: underline overline #e79b77;
text-underline-offset: 3.5px;
background-color: #31343d;
user-select: none;}	

.centerleft {
display: flex;
flex-direction: row;
padding: 2%;
width: 26%;
height: 100%;
background-color: #17191f;
background-image: url("img/sidebarimg.png");
background-position: 40% 110%;
background-size: 130% 70%;
background-origin: border-box;
background-repeat: no-repeat;
}

.centerright {
display: flex;
flex-direction: column;
overflow-y: scroll;
scrollbar-color: #000000 #e1e4eb;
scrollbar-width: thin;
width: 74%;
height: 100%;
padding: 2%;
background-color: #e1e4eb;
}

/*** ELEMENTS ***/

.topimg {
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 0.5%;
pointer-events: none;
}

.headertxt {
display: flex;
position: absolute;
align-self: flex-end;
width: 248px;
height: 71px;
margin: 0% 0% 2.5% 4%;
transition: 0.4s;

}
.headertxt:hover {
margin: 0% 0% 2.8% 4%;
}

.centertext {
display: flex;
flex-direction: column;
flex-direction: column;
flex: 1;
width: 100%;
height: 100%;
padding: 4.5%;
margin: 2% 0% 2% 0%;
border-radius: 1%;
border: 1.5px solid #17191f;
background-color: #e1e4eb;}

.tagbox, a.tagbox {
display: flex;
flex-direction: column;
align-self: flex-end;
justify-content: center;
align-items: center;
margin: 2%;
width: 100%;
height: 20px;
font-family: AdobeGaramondProB;
font-size: 10px;
letter-spacing: 1px;
color: #e1e4eb;
transition: all .25s;
user-select: none;
background-color: #31343d;
opacity: 80%;
}

a.tagbox:hover {
opacity: 100%;
letter-spacing: 1.5px;
text-underline-offset: 3.5px;
border: 1px solid #e79b77;
color: #f3dbdb;}

.tx1 {
display: flex;
align-items: center;
margin: 0;
color: #e1e4eb;
font-size: 15px;}

.tx2 {
display: flex;
color: #31343d;
margin: 2%;
}

.tx3 {
display: flex;
align-items: flex-start;
padding: 0% 0% 2.5% 0%;
margin: 0%;
font-size: 10.75px;
font-weight: 600;
color: #31343d;
opacity:75%;}

.centerimg {
display: flex;
object-fit: contain;
margin: 1.5%;
filter: hue-rotate(35deg);}

hr {
display: flex;
width: 100%;
border: 0.66px solid #7d818a;
margin: 2.75% auto;}

::selection {
  background: #c2c6d5;
}

.copyrightbox {
display: flex;
flex-direction: column;
justify-content: flex-end;
height: 100%;
width: 25%;
}

.copyrighttxt {
display: flex;
margin: 0%;
opacity: 20%;
font-size: 7.4pt;
color: #e1e4eb;
pointer-events: none;
user-select: none;
}

.copyrightimg {
display: flex;
height: 31px;
width: 88px;
opacity: 15%;
pointer-events: none;
}

/* Terminal */