/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/roboto-v27-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/roboto-v27-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/roboto-v27-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/roboto-v27-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/roboto-v27-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/roboto-v27-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* orbitron-900 - latin */
@font-face {
    font-family: 'Orbitron';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/orbitron-v17-latin-900.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/orbitron-v17-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/orbitron-v17-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/orbitron-v17-latin-900.woff') format('woff'), /* Modern Browsers */
         url('../fonts/orbitron-v17-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/orbitron-v17-latin-900.svg#Orbitron') format('svg'); /* Legacy iOS */
}

:root {
    --gnmenusize: 60px;
    --footersize: 60px;
}

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    font-family: "Roboto","Open Sans", Arial, sans-serif;
    color: #022d53;
    /* background-color: #cee6ff; */
}

.customobenmitte {
    background-color: #abd7fd;
    z-index: 1;
    top: 0;
    opacity: 0.65;
    width: 100%;
    height: var(--gnmvsize);
    position: fixed;
}

br {
    line-height: 150%;
}

h1 {
    font-family: 'Orbitron',"Open Sans", Arial, sans-serif;
    font-size: 22px;
    font-weight:600;
    letter-spacing: 0.1em;
}

h2 {
    font-family: 'Orbitron',"Open Sans", Arial, sans-serif;
    font-size: 22px;
    font-weight:600;
    font-weight: 900;
    letter-spacing: 0.1em;
}

h3 {
    font-family: 'Orbitron',"Open Sans", Arial, sans-serif; 
    font-weight: 900;
    letter-spacing: 0.6em;
}

h4 {
    font-family: "Roboto","Open Sans", Arial, sans-serif;
    font-size: 22px;
    font-weight:600;
}


a:link {
  text-decoration: none;
  color: #57b0fc;
}

a:visited {
  text-decoration: none;
  color: #57b0fc;
}

a:hover {
  text-decoration: underline;
}

a:active {
  text-decoration: underline;
}

.profile-edit {
    text-align: center;
}

.obenlinks {
    grid-area: obenlinks;
    background-color: #34495e;
}

.obenmitte {
    grid-area: obenmitte;
    background-color: #FFFFFF;
}

.obenrechts {
    grid-area: obenrechts;
    background-color: #34495e;
}

.item-page {
    grid-area: inhalt;
}

.unten {
    grid-area: unten;
    background-color: #F1F6F3;
}

.logout,
.login {
    grid-area: inhalt;
}

.login-description {
    padding: 50px;
    font-weight: bold;
    grid-area: inhalt;
	margin-left: 30px;
}

.form-validate {
	width: 20em;
	align: center;
	margin-left: auto;
	margin-right: auto;
}

.control-group {
	padding: 12px;
}

.registration {
    grid-area: inhalt;
}

.login-fields
{
    margin:10px 0
}

.login-fields label
{
    float:right;
}

.login-description img,
.logout-description img
{
    float:right;
    margin-right:0px
}

.login-description,
.logout-description
{
    padding-right:5px;
    margin:20px 10px 0 0;
}

/* the blue table */
.bt {
    grid-area: inhalt;
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
    padding: 0px;
    border-radius: 10px;
    border-spacing: 0;
    border: 0px;
    box-shadow:   #9393b3 3px 3px 3px;
  /* Prevent background color leak outs */
    -webkit-background-clip: padding-box; 
    -moz-background-clip:    padding; 
    background-clip:         padding-box;
    background: none;
    table-layout: fixed;
}

.bt  td,
.bt  th {
    padding: 12px 10px;
    border-right: 0px;
    border: 0px;
    text-align: left;
    
}

.bt td:first-child,
.bt th:first-child  {
    padding: 15px 15px;
}

.bt th {
    background: #9acffd;
    color: #111111;
}

.bt tr:nth-child(2n+2) td {
	background: #cce7fe;
}

.bt tr:nth-child(2n+3) td {
	background: #bbdffe;
}

.bt tr:first-child th:first-child {
    border-top-left-radius:10px
}
.bt tr:first-child th:last-child {
    border-top-right-radius:10px
}
.bt tr:last-child td:first-child {
    border-bottom-left-radius:10px;
}
.bt tr:last-child td:last-child {
    border-bottom-right-radius:10px;
}

.mbt {
    min-width: 800px;
}

.bt br {
    line-height: 0;
}

.hdl {
    min-width: 800px;
    /*border: 1px solid black;*/
    border-collapse: collapse;
} 

.hdl td {
    /*border: 1px solid black;*/
    text-align: center;
}

.hdl td:first-child {

    text-align: left;
}   

.ct {
    width: 100%;
    color: #111111;

}
.ct td:first-child,
.ct td:last-child
{
    color: #9acffd;
    width: 32%;
    padding: 0px;
}

.colpick table,
.colpick tbody,
.colpick caption,
.colpick tbody,
.colpick tfoot,
.colpick thead,
.colpick tr,
.colpick td
{
    all: revert;
	background: none;
    padding: 15px;
    border: 0px;
    border-width: 0px;
}
.colpick td:first-child 
{
    border-top-left-radius:10px;
    border-top-right-radius:10px
}
.colpick tr {
    all: revert;
    background: #b3d7FF;
    color: #111111;
}


.myfs {
    background-color: #b3d7ff;
    border: 0px;
}

.titleval {
    font-weight: bold;
    font-size: 1.20rem;
    opacity: 0.8;
}

.boldval {
    font-weight: bold;
    font-size: 1.5rem;
}

.btn {
	padding: 12px 24px;
	border-radius: 5px;
}

.profile {
    grid-area: inhalt;
}

.gnia { /* menu item active */
    font-family: "Open Sans", Arial, sans-serif;
    font-weight: normal;
    padding-left:10px;
    white-space:nowrap;
}

.gnina { /* menu item not active */
    font-family: "Open Sans", Arial, sans-serif;
    font-weight: normal;
    padding-left:10px;
    color: #333; /* Fallback for older browsers */
    color: rgba(180, 180, 180, 1);
    white-space:nowrap;
}

.anchor-icon {
	padding-left:10px;
}

input[readonly] {
    background-color: #CCCCCC;
}

.profile-edit a:hover, .profile-edit a:active, .profile-edit a:focus,
#fontsize a:hover,  #fontsize a:active,  #fontsize a:focus,#mobile_select h2 a
{
    grid-area: inhalt;
    color: #fff;
    background: #57b0fc; /* Old browsers */
    background-color: #cce7fe;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#008885", endColorstr="#004746");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#008885), to(#004746));
             background-image: -moz-linear-gradient(top, #008885, #004746);
             background-image: -ms-linear-gradient(top, #008885, #004746);
         background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008885), color-stop(100%, #004746));
                     background-image: -webkit-linear-gradient(top, #008885, #004746);
         background-image: -o-linear-gradient(top, #008885, #004746);
             background-image: linear-gradient(#008885, #004746);
                 border-color: #004746 #004746 hsl(165, 27%, 22.5%);
             text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.29);
                     -webkit-font-smoothing: antialiased;
}

.grid-container {
  grid-template-areas:
  'obenlinks obenmitte obenrechts'
  'inhalt inhalt inhalt'
  'unten unten unten';

  grid-template-rows: var(--gnmenusize) 1fr var(--footersize);
  grid-template-columns: var(--gnmenusize) 1fr var(--gnmenusize);

  grid-gap: 0px;
  padding: 0px;
  min-height: 100%;
}

.grid-container > div {
  text-align: center;
  padding: 0px 0;
  font-size: 18px;
}

.container {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: flex-start;
    width:100%;
    height:250px;
    overflow:hidden;
}

.startimg {
    all: revert;
    overflow: hidden;
    object-fit: none;
}

.cntr {
    display: grid;
    grid-template-columns: minmax(50px, 25%) minmax(50px, 50%) minmax(50px, 25%);
    grid-template-rows: minmax(150px, 1fr);
}

.cntr div {
    padding: 20px;
}

.hdrcntr {
    display: grid;
    grid-template-areas:
        'hdr tit hdlr';
    align-items: center;
    grid-template-columns: minmax(50px, 25%) minmax(500px, 1fr) minmax(50px, 25%);
    font-size: 22px;
}

.logcntr {
    grid-template-areas:
        'lb tail rb';
    grid-gap: 0px;
    padding: 0px;
    min-height: 100%;
    display: grid;
    grid-template-columns: minmax(20px, 10%) minmax(100px, 1fr) minmax(20px, 10%);
    grid-template-rows: minmax(50px, 1fr);
}