/*I'll go ahead and mention that this is all VERY MUCH cobbled together from both my own limited knowledge, and some junk I googled.*/

 /*FONTS*/
 
 @font-face {
   font-family: Palladio;
   src: url("https://majorlysucking.neocities.org/Fonts/Palladio.ttf");
 }
 @font-face {
   font-family: Palladio;
   src: url("https://majorlysucking.neocities.org/Fonts/Palladio-Bold.ttf");
   font-weight: bold;
 }
 @font-face {
   font-family: Palladio;
   src: url("https://majorlysucking.neocities.org/Fonts/Palladio-Italic.ttf");
   font-style: italic;
 }
 @font-face {
   font-family: Palladio;
   src: url("https://majorlysucking.neocities.org/Fonts/Palladio-BoldItalic.ttf");
   font-weight: bold;
   font-style: italic;
 }
 
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: #c980be; 
  border-radius: 20px;
}

::-webkit-scrollbar-thumb {
  background: #843b78; 
  border-radius: 20px;
}

::-webkit-scrollbar-thumb:hover {
  background: #ffddff; 
} 


#serif{
  font-family: Palladio, serif;
  font-size: 14pt;
}
#print{
  text-indent: 50px;
  margin-bottom: 24pt;
  margin-left: 60px;
  margin-right: 60px;
  line-height: 24pt;
}

#container {
  max-width: 1500px;
  margin: 0 auto;
}

#header {
 width: 100%; 
 background: #91cfa6;
 height: 150px;
 margin-top: 15px;
}

/*Navbar stuff*/
#navigation {
 width: 100%;
 height: 45px;
 background: #d5f5e0;
 font-weight: bold;
}
#navigation ul{
 padding: 0;
 margin: 0;
 display: flex;
 list-style-type: none;
 justify-content: space-evenly;
 height: 100%;
}
#navigation ul a{
  display: block;
  padding: 12px 14px;
  color: #39bd8e;
  text-decoration: none;
  transition: .2s;
}
#navigation ul a:hover{
  color: #d5f5e0;
  background: #39bd8e;
  transition: .2s;
}

.currentPage{
  background: #edfcf3;
}

/*Actual content stuff!*/
#flex {
  display: flex;
}
main {
 background: #8febd9;
 flex: 1;
 padding: 0 20px;
 order: 2;
}

aside{
  background: #64c4b2;
  width: 20%;
  padding: 8px 2px;
  margin-right: 0;
  order: 1;
  font-size: 11pt;
}
aside a {
  text-decoration: none;
  text-align: center;
  font-weight: bold;
}

footer{
  color: #00474c;
  background: #ef558e;
  width: 100%;
  height: 40px;
  padding: 7px 0;
  margin-bottom: 0;
  text-align: center;
  font-weight: bold;
}
footer a {
  color: #26470b;
  font-weight: bold;
}

body {
  height: 100%;
  background: #db99d1 url(/Assets/bg-tile_big2.png);
  color: black;
  font-family: Verdana;
  padding: 10px;
}


/*Dropdowns*/
details {
  margin-bottom: 12px;
  padding-bottom: 3px;
  background: #bf4471;
  width: 40%;
  border-left: 3px solid #bf4471;
}

details[open] {
  border-bottom: 5px solid #722743;
  border-right: 5px solid #722743;
}

details[open] a{
  color: #9df7af;
  font-weight: bold;
}
details[open] a:hover{
  color: #eeffee;
  transition: .2s;
}

details > summary {
  cursor: pointer;
  font-size: 18pt;
  font-weight: bold;
  background: #91cfa6;
  margin-top: 24px;
  transition: .2s;
  padding-left: 8px;

}

details > summary:hover {
  background: #d5f5e0;
}

details[open] > summary {
  transition: .2s;
  background: #bf4471;
}

details[open] > summary a {
  transition: .2s;
  color: #9df7af;
}

details[open] > summary:hover {
  background: #f06699;
}



#nested details {
  background: #91cfa6;
  border-left: 3px solid #91cfa6;
}

#nested details[open] {
  border-bottom: 5px solid #6da780;
  border-right: 5px solid #6da780;
}

#nested details[open] a{
  color: #993737;
  font-weight: bold;
}
#nested details[open] a:hover{
  color: #fff0f0;
  transition: .2s;
}

#nested details > summary {
  cursor: pointer;
  font-size: 18pt;
  font-weight: bold;
  background: #983459;
  transition: .2s;
}

#nested details > summary:hover {
  background: #d17a9a;
}

#nested details[open] > summary {
  transition: .2s;
  background: #91cfa6;
}

#nested details[open] > summary a {
  transition: .2s;
  color: #993737;
}

#nested details[open] > summary:hover {
  background: #b8e0c5;
}



/*Misc garbage stuff I should clean up later.*/


#review p{
  text-indent: 24px;
}


#arrowlist {
  list-style-type: "➤";
}

#no-bullet {
  list-style-type: none;
}

ul {
  padding-left: 16px;
}

li {
  margin: 6px 2px
}


a {
  color: #993737;
  transition: .2s;
}

a:hover {
  color: #fff0f0;
  transition: .2s;
}



.sideheader a{
  color: #a93093;
}
.sideheader a:hover{
  color: #ffddf9;
}

#sidebar {
  font-size: 11pt;
}
#sidebar a {
  text-decoration: none;
  text-align: center;
  font-weight: bold;
}
#sidebar::-webkit-scrollbar {
  width: 4px;
}

#sidebar::-webkit-scrollbar-track {
  background: #3fa693; 
}

#sidebar::-webkit-scrollbar-thumb {
  background: #90d5c8; 
}

#sidebar::-webkit-scrollbar-thumb:hover {
  background: #daf1ed; 
}

.logo {
  height: 70%;
  margin: auto;
  display: block;
  padding-top: 15px;
  padding-bottom: 0;
  margin-bottom: 0;
}

hr{
  color: #74d4c2;
  background-color: #74d4c2;
  border: none;
  height:6px
}

.leftLine {
  padding: 8px;
  border-left: 3px solid #000;
}
.header {
 text-align: center; 
 padding-top: 50px;
 margin-bottom: 5px;
}
.subheader {
  font-weight: normal;
  text-align: center;
  margin-top: 5px;
}
.sideheader {
  text-align: center;
  margin-bottom: 5px;
}

.unbutton {
  background: #b0bfb9;
}