@charset "UTF-8";

body {
  font-family:var(--font-family);
  font-size:var(--font-size);
  background-image:var(--canvas-image);
}

table {
  font-family:var(--font-family);
  font-size:var(--font-size);
}

th {
  text-align:left;
}
 
a {
  color:var(--link-color);
  text-decoration:none;
}
a:hover {
  color:var(--link-color);
  text-decoration:underline;
}
 
.frontpage-title {
  top:0;
  width:100%;
  text-align:center;
  margin:0 0 20px 0;
  color:var(--frontpage-title-color);
  font-size:36px;
  font-weight:bold;
  text-shadow:2px 2px darkgray;
}
.frontpage-title:after {
  content:var(--frontpage-title);
}
 
.page-title {
  top:0;
  width:100%;
  text-align:center;
  margin:0 0 20px 0;
  color:var(--page-title-color);
  font-size:36px;
  font-weight:bold;
  text-shadow:2px 2px darkgray;
}
.page-title:after {
  content:var(--page-title);
}

.banner {
  position:relative;
  left:25%;
  width:50%;
  height:100px;
  background-image:var(--banner-image);
  background-size:100%;
  background-repeat:no-repeat;
}

.menu-line {
  position:relative;
  text-align:center;
  justify-content:center;
}

.menu {
  display:inline-block;
  padding:5px 5px 5px 5px;
  border-radius:5px;
  font-size:80%;
  background-color:var(--menu-background-color);
  box-shadow:2px 2px lightgray;
}
.menu:hover {
  transform: scale(1.5);
}

#menus a {
  color:var(--menu-color);
  text-decoration:none;
}

.page-container {
  position:relative;
  top:0;
  width:100%;
  height:76%;
  overflow-y:auto;
}

.page-content {
  position:relative;
  left:25%;
  width:50%;
}

.front-picture {
  position:relative;
  top:10px;
  left:15%;
  width:70%;
  height:90%;
  background-image:var(--frontpage-image);
  background-size:100%;
  background-repeat:no-repeat;
  background-position:center;
}
 
.front-block1 {
  position:absolute;
  bottom:0;
  left:60%;
  width:35%;
}
 
.front-block2 {
  position:absolute;
  float:left;
  bottom:0;
  left:5%;
  width:40%;
}

.copyright {
  position:fixed;
  bottom:0;
  width:95%;
  text-align:right;
  color:var(--copyright-color);
  font-size:90%;
}
.copyright:after {
  content:var(--copyright);
}
 
.box_header {
  text-align:left;
  font-size:14px;
  font-weight:bold;
  border-style:solid;
  border-width:1px;
  border-color:gray;
  box-shadow:4px 4px lightgray;
  background-color:var(--header-color);
  color:white;
  padding:0 0 0 10px;
}

.box {
  text-align:left;
  background-color:white;
  border-style:solid;
  border-width:1px;
  border-color:gray;
  box-shadow:4px 4px lightgray;
  padding:10px;
}

.breaking {
  position:relative;
  top:-10px;
  left:25%;
  width:50%;
  text-align:center;
  background-color:Yellow;
  color:IndianRed;
  font-size: 22px;
  font-weight:bold;
}
.breaking:after {
  content:var(--breaking);
}