* {
 margin:0;
 padding:0;
}
html, body {
 width: 100%;
 height: 100%;
}
body {
 font-family: sans-serif;
 background-color:#FFFFFF; 
 color:#000000; 
}
a {
 color:#666666;
 font-family:sans-serif;
 text-decoration: none;
}

/* Login zentriert */
.centervh {
 display: -webkit-flex;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-align-items: center;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 width: 100%;
 height: 100%;
}
.centervh_inner {
 text-align: center;
 margin: 0 auto;
 width: 200px;
 min-width: 200px;
}









/* font size on different screens sizes */
@media screen and (max-width: 1060px) {
 #primary { width:67%; }
 #secondary { width:30%; margin-left:3%;}
}
@media screen and (max-width: 768px) {
 #primary { width:100%; }
 #secondary { width:100%; margin:0; border:none; }
}
@media only screen and (min-width:0px)  { body {font-size:0.7rem;} }
@media only screen and (min-width:450px)  { 
 body {font-size:0.7rem;}
}
@media only screen and (min-width:550px)  { 
 body {font-size:0.7rem;} 
}
@media only screen and (min-width:640px)  { body {font-size:1.0rem;} } 
@media only screen and (min-width:960px)  { body {font-size:1.0rem;} } 
@media only screen and (min-width:1100px) { 
 body {font-size:1.0rem;} 
 div.menu_menu {display: none;}
 div.menu_div {display: block; top: 0px; border: 0px; position: static;float:right;}
 div.menu_button {clear: both;}
 div.menu_text {display:none;}
 div.menu_trenner {display: none;}
 div.menu_full {float: left; text-align: center;margin: 0px auto;}
 div.menu_full_inner {text-align: center;margin: 0px auto;}
 div.menu_inner {padding:0px;}
}
img {
 width: 100%;
 height: auto;
}
.font_small {
 font-size:0.8rem;
}












.container {
 position: absolute;
 background: #ffffff;
 top: 0%;
 left: 0%;
 width: 100%;
 height: 100%;
 padding: 0px;
 box-sizing: border-box;
 z-index: 1;
}
.inner {
 position: relative;
 top: 50%;
 -webkit-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 transform: translateY(-50%);
 text-align: center;
 max-width: 400px;
 margin: 0 auto;
}









/* select, input */
.input {
 width: 100%;
 padding: 10px 15px;
 box-sizing: border-box;
 border: 1px solid #a3a3a3;
 background-color: #FFFFFF;
 color: #7b7b7b;
 border-radius: 5px;
}
.input:focus {
 outline:none;
}
.select {
 position: relative;
 display: inline-block;
 margin-bottom: 15px;
 width: 100%;
}
.select select {
 font-family: sans-serif;
 display: inline-block;
 width: 100%;
 cursor: pointer;
 padding: 10px 15px;
 outline: 0;
 border: 1px solid #a3a3a3;
 border-radius: 5px;
 background: #ffffff;
 color: #7b7b7b;
 appearance: none;
 -webkit-appearance: none;
 -moz-appearance: none;
}
.select select_flat {
 padding: 0px 15px;
}
.select select::-ms-expand {
 display: none;
}
.select select:hover, .select select:focus {
 color: #000000;
 background: #f6f6f6;
}
.select select:disabled {
 opacity: 0.5;
 pointer-events: none;
}
.select_arrow1 {
 position: absolute;
 top: 8px;
 right: 15px;
 width: 6px;
 height: 6px;
 border: solid #7b7b7b;
 border-width: 0 3px 3px 0;
 display: inline-block;
 padding: 3px;
 transform: rotate(45deg);
 -webkit-transform: rotate(45deg);
}
.select select:hover ~ .select_arrow, .select select:focus ~ .select_arrow {
 border-color: #000000;
}
.select select:disabled ~ .select_arrow {
 border-top-color: #cccccc;
}
.input_row {
 float: left;
 padding-right: 5px;
}








/* buttons */
.button {
 background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
 background-color:#599bb3;
 border-radius:5px;
 border:1px solid #29668f;
 display:inline-block;
 cursor:pointer;
 color:#ffffff;
 font-family: sans-serif;
 padding:5px 32px;
 text-decoration:none;
 text-shadow:0px 1px 0px #3d768a;
}
.button:hover {
 background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
 background-color:#408c99;
}
.button:active {
 position:relative;
 top:1px;
}





/* message window */
.alert {
 position: absolute;
 top: 0%;
 left: 0%;
 width: 100%;
 height: 100%;
 padding: 0px;
 box-sizing: border-box;
 z-index: 1;
}
.alert_inner {
 position: relative;
 top: 50%;
 -webkit-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 transform: translateY(-50%);
 text-align: center;
 max-width: 400px;
 margin: 0 auto;
 padding: 10px;
 background-color: #f44336;
 color: white;
}
.closebtn {
 margin-left: 15px;
 color: white;
 font-weight: bold;
 float: right;
 line-height: 15px;
 cursor: pointer;
 transition: 0.3s;
}
.closebtn:hover {
 color: black;
}





/* main */
.clear {
 clear: both;
}
.main {
 padding: 0px;
 padding-bottom:40px;
}
.main_inner {
 padding: 10px;
}
.main_blur {
 filter: blur(5px);
 -webkit-filter: blur(5px);
 -moz-filter: blur(5px);
 -o-filter: blur(5px);
 -ms-filter: blur(5px);
 color: transparent;
 text-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.footer {
 background: #ffffff;
 width: 100%;
 position: fixed;
 bottom: 0px;
}
.footer_inner {
 padding: 5px;
 text-align: center;
}
.table_row {
 float: left;
}
.table_row_inner {
 padding: 5px;
}
.events {
 padding-top: 15px;
}
.events_inner {
 padding: 10px;
}
.event_name {
 width: 100%;
}
.runs_trenner {
 border-top: 1px solid #cccccc;
}
.runs_round {
 float:left;
 background: #cccccc;
 padding: 0;
 margin: 0;
 width:20px;
 display: flex;
 justify-content: center;
 align-items: center;
}
.runs_content {
 float:left;
 width:100%;
}
.runs_row {
 float:left;
 width:20%;
 min-width:130px;
}
.runs_row_menu {
 float:left;
 width:20%;
 min-width:130px;
}
.runs_row_inner {
 padding: 5px;
}
.runs_data {
 float:left;
 padding:0px;
 margin:0px;
 width:80%;
}
.img_icon {
 width: 12px;
}





/* menu */
.menu {
 z-index:10;
}
.menu_home {
 float: left;
 padding-top: 12px;
 padding-left: 15px;
}
.menu_menu {
 float: right;
 padding-top: 12px;
 padding-right: 15px;
}
.menu_button {
 float: left;
 padding-right: 10px;
 padding-top: 10px;
}
.menu_text {
 padding-top: 15px;
 float:left;
}
.menu_trenner {
 width: 100%;
 border-bottom:1px solid #cccccc;
}
.menu_inner {
 padding: 10px;
}
.menu_center {
 float: left;
 padding-top:5px;
}
.menu_img {
 height: 30px;
}
.menu_div {
 display:none;
 position: fixed;
 top: 0px;
 right: 0%;
 padding: 0px;
 box-sizing: border-box;
 z-index: 20;
 background:#ffffff;
 border-left:1px solid #cccccc;
 border-bottom:1px solid #cccccc;
 z-index: 10;
}
.menu_div_back {
 display:none;
 position:fixed;
 width:100%;
 height:100%;
 top:0px;
 left:0px;
 background:#cccccc;
 opacity:0.5;
 z-index: 5;
}











/* blinking */
.dot_green {
 background-color: #1c87c9;
 -webkit-border-radius: 5px;
 border-radius: 5px;
 border: none;
 cursor: pointer;
 display: inline-block;
 padding: 5px 5px;
 text-align: center;
 text-decoration: none;
}
@keyframes glowing_green {
 0% { background-color: #2ba805; box-shadow: 0 0 2px #2ba805; }
 50% { background-color: #49e819; box-shadow: 0 0 5px #49e819; }
 100% { background-color: #2ba805; box-shadow: 0 0 2px #2ba805; }
}
.dot_green {
 animation: glowing_green 1300ms infinite;
}
.dot_red {
 background-color: #1c87c9;
 -webkit-border-radius: 5px;
 border-radius: 5px;
 border: none;
 cursor: pointer;
 display: inline-block;
 padding: 5px 5px;
 text-align: center;
 text-decoration: none;
}
@keyframes glowing_red {
 0% { background-color: #FB0303; box-shadow: 0 0 2px #FB0303; }
 50% { background-color: #F00E0E; box-shadow: 0 0 5px #F00E0E; }
 100% { background-color: #FB0303; box-shadow: 0 0 2px #FB0303; }
}
.dot_red {
 animation: glowing_red 1300ms infinite;
}