@import url("https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");

body {
   background: rgb(0, 31, 113);
   background: linear-gradient(
      0deg,
      rgba(0, 31, 113, 1) 0%,
      rgba(0, 20, 74, 1) 100%
   );
   background-position: fixed;
   color: #eeeeee;
   font-family: "Roboto", "Arial";
}

h1 {
   text-align: center;
   margin: 70px 0 20px;
   color: #ffffff;
   font-weight: bold;
   font-size: 50px;
   text-shadow: 2px 2px 0px #41becb;
}

h2 {
   margin: 20px 0 30px 0;
   color: #a2d5ff;
}

h3 {
   font-size: 24px;
   margin: 50px 0 20px 0;
   color: #a2d5ff;
}

hr {
   border-top: solid 1px #4f5f8b;
}

#content {
   max-width: 700px;
   margin: 0 auto;
}

pre {
   background: #00000038;
   padding: 10px;
   border-radius: 10px;
   color: #fff;
   overflow: hidden;
}

code {
   color: #ff5e00;
}

section {
   border-bottom: solid 2px #00000024;
   padding-bottom: 30px;
}

.sidebar {
   position: fixed;
   top: 0;
   left: 0;
   width: 250px;
   height: 100vh;
   background: #0000001c;
   color: white;
   padding: 30px 0px 0;
   border-right: solid 1px #09173d;
   font-size: 14px;
   overflow: auto;
}

.sidebar ul {
   list-style: none;
   padding: 0;
}

.sidebar ul li a {
   color: #b4deff;
   text-decoration: none;
   display: block;
   padding: 5px 30px;
   transition: background 0.3s;
}

.sidebar ul li a.active,
.sidebar ul li a:hover {
   background: #0000007a;
}

.sidebar ul .sub-item {
   padding-left: 20px;
   font-size: 0.9em;
   opacity: 0.8;
}

.sidebar .menuHeading {
   font-weight: bold;
   padding: 20px 0 0 30px;
   font-size: 16px;
   color: #f0f4ff;
}

#footer {
   text-align: center;
   font-size: 12px;
   max-width: 700px;
   margin: 50px auto 20px;
   color: #2e4da1;
   padding: 0 30px;
}

#footer a {
   color: #3557b6;
   text-decoration:none
}

#footer a:hover {
   text-decoration:underline
}

#footerWrapper {
   padding: 1px 0 30px;
   margin: 100px 0 0;
}

.lastModified {
   text-align: center;
   font-size: 12px;
   font-style: italic;
   margin: 0 0 80px;
   color: #ffffff59;
}

@media only screen and (max-width: 760px) {
   h1 {
      font-size: 30px;
   }

   #content {
      padding: 0 30px;
   }
}

@media only screen and (max-width: 1255px) {
   .sidebar {
      display: none;
   }
}