@font-face {
  font-family: JetBrains Mono; /* set name */
  src: url(JetBrainsMono/fonts/webfonts/JetBrainsMono-Regular.woff2); /* url of the font */
  font-weight: normal;
}
@font-face {
  font-family: JetBrains Mono Bold; /* set name */
  src: url(JetBrainsMono/fonts/webfonts/JetBrainsMono-Bold.woff2); /* url of the font */
  font-weight: bold;
}
@font-face {
  font-family: JetBrains Mono Italic; /* set name */
  src: url(JetBrainsMono/fonts/webfonts/JetBrainsMono-Italic.woff2); /* url of the font */
  font-style:italic;
}/*----------------------------------------------------------Universal-------------------------------------------------------*/
body{
  margin: 0px;
  background-color: #FBF7F3;
  color:#20283D;
  font-family: Garamond, serif;
}
a:link {
  color: #20283D;
  background-color: transparent;
  text-decoration: none;
}
a:visited {
  color: #20283D;
  background-color: transparent;
  text-decoration: none;
}
a:hover {
  color: #20283D;
  background-color: transparent;
  text-decoration: none;
}
a:active {
  color: #20283D;
  background-color: transparent;
  text-decoration: none;
  
}
Span{
    color:red;
  }/*----------------------------------------------------------Header---------------------------------------------------------*/
Header{
  position:sticky;
  top:0;
  z-index: 100;
  background-color: #20283D;
  Width: 100vw;
  height: 3vw;
  margin: 0px;
  border: 0px;
  padding: 0px;
  color: #FBF7F3;
}
#Header_Table{
  margin: 0px;
  border: 0px;
  padding: 0px;
  height: 3vw;
  padding-top: 0.5vw;
  padding-bottom: 0.5vw;
  border-spacing: 0px;
}
#Header_Image{
  height: 2vw;
  margin: 0px;
  border: 0px;
  padding: 0px;
  padding-left: 0.5vw;
  padding-right: 0.5vw;
}
#Header_Cell{
  margin: 0px;
  border: 0px;
  padding: 0px;
  font-size: 1.2vw;
  padding-left: 0.5vw;
  padding-right: 0.5vw;
  border-right: 0.2px solid #FBF7F3;
}
#Header_Cell:hover{
  text-decoration: underline;
  text-decoration-thickness: 0.1vw;
  text-decoration-color:#FBF7F3;
}
Header a:link {
  color: #FBF7F3;
  background-color: transparent;
  text-decoration: none;
}
Header a:visited {
  color: #FBF7F3;
  background-color: transparent;
  text-decoration: none;
}
Header a:hover {
  color: #FBF7F3;
  background-color: transparent;
  text-decoration: none;
}
Header a:active {
  color: #FBF7F3;
  background-color: transparent;
  text-decoration: none;

}/*----------------------------------------------------------Login-----------------------------------------------------------*/
#Login_Page{
  background-color: #20283D;
  font-size: 1vw;
}
#Login_Page input{
  width: 100%;
  height: 1.5vw;
  font-size: 1vw;
  border-width: 0.05vw;
  border-style:solid;
  border-color: #20283D;
  margin: 0px;
  padding: 0px;
}
#Login_Outer_Box{
  width:30vw;
  margin:auto;
  margin-top: 1;
  position:sticky;
  top:500;
  z-index: 100;
}
#Login_Inner_Box{
  background-color: #FBF7F3;
  padding: 1.5vw;
  border-radius: 0.5vw;;
}/*----------------------------------------------------------grid display-----------------------------------------------------------*/
#Grid{
  display: grid;
  width:78vw;
  margin:auto;
  grid-template-columns: calc(100%/3) calc(100%/3) calc(100%/3);
  background-color: transparent;
}
#Grid_Cell{
  padding: 0px;
  text-align: left;
  height: 16.5vw;
  border-radius: 0.5vw;
  border: 0.2px solid #20283D;
  margin: 1vw;
}
#Grid_Image{
  background-size: 100%;
  height: 13.5vw;
  border-radius: 0.5vw;
  border-bottom: 0.2px solid #20283D;
}
#Grid_Text{
  height: 2vw;
  font-size: 1vw;
  font-weight: bold;
  padding-left: 1vw;
}/*------------------------------------------------------------klasse laver--------------------------------------------------------*/
#Klasse_Laver{
  margin-top:20vw;
  padding:1vw;
  width:40vw;
  margin:auto;
  border-radius: 0.5vw;
  border: 0.2px solid #20283D;
  font-size: 0.8vw;
}
#Klasse_Laver_Select{
  font-size:0.8vw;
  border: 0.2px solid #20283D;
  margin:0px;
  padding:0px;
  width:100%;
}
#Klasse_Laver_Tabel{
  font-weight: normal;
  font-size: 0.8vw;

}
#Klasse_Laver_Tabel_Select{
  width:60%;
}
#Klasse_Laver_Tabel_Label{
  width:40%;
}/*------------------------------------------------------------Main page----------------------------------------------------------*/
#Main_page{
  width:40vw;
  margin:auto;
}
#Main_page_afleveringer{
  font-size:0.8vw;
  border: 0.2px solid #20283D;
  margin:0px;
  padding:0px;
  width:100%;
  border-radius: 0.5vw;
}
#Main_page_afleveringer_tabel{
  width: 100%;
}
#Main_page_afleveringer_data{
  width: calc(100%/3);
  border-left: 0.2px solid #20283D;
  padding:0.5vw;
}
#Main_page_klasser{
  width:100%;
  border-radius: 0.5vw;
  border: 0.2px solid #20283D;
}
#Main_page_klasser_grid{
  display: grid;
  width:100%;
  margin:auto;
  grid-template-columns: calc(100%/3) calc(100%/3) calc(100%/3);
  background-color: transparent;
}
#Main_page_klasse{
  padding: 0px;
  text-align: left;
  height: 8.25vw;
  border-radius: 0.5vw;
  border: 0.2px solid #20283D;
  margin: 0.5vw;
}
#Main_page_klasse_billede{
  background-size: 100%;
  height: 6.75vw;
  border-radius: 0.5vw;
  border-bottom: 0.2px solid #20283D;
}
#Main_page_klasse_tekst{
  height: 1.5vw;
  font-size: 0.8vw;
  font-weight: bold;
  padding-left: 0.5vw;
}/*------------------------------------------------------------lektion----------------------------------------------------------*/
#Grid_lektion{
  display: grid;
  width:40vw;
  margin:auto;
  grid-template-columns: 100%;
  background-color: transparent;
}
#Grid_Cell_lektion{
  padding-left: 1vw;
  text-align: left;
  border-radius: 0.5vw;
  border: 0.2px solid #20283D;
  margin-bottom: 1vw;
}
#Grid_Text_lektion{
  font-size: 1vw;
}
#lektion_billede{
  height:3vw;
  border-radius: 0.5vw;
  border: 0.2px solid #20283D;
  margin: 0.5vw;
  margin-left:0px;
}