html, body {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
body {
background-repeat: no-repeat;
background-position: Center Center;
background-image: url("../img/watt.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: Center Center;
margin: 0;
background-position: Center Center;
background-attachment: fixed;
font-size: 14px;
font-family: 'Verdana';
}
#logo {
position:fixed;
height:120px;
left:30px;
top:10px;
z-index:99999;
border: 2px solid gainsboro;
margin: 12px;
filter: grayscale(0%);
}
.navbar {
position:fixed;
top:0px;
height: 100px;
width: 100%;
background-color: rgb(205, 225, 241);
padding-top: 7px;
padding-left: 10px;
}
ul { position: fixed;
height: 120px;
width: 100%;
margin-left: 13%;
float: left;
}
li {
list-style:none;
display:inline-flex;
line-height: 5;
font-size: 16px;
color:white;
position:top;
}
li a { text-decoration:none;
color:grey;
font-size: 15px;
font-family: sans-serif;
padding: 0 20px;
display:block;
margin-bottom: 10px;
}
li a:hover { text-decoration:none;
color:red;
}
/* -- Index Page Anfang -- */
#headline {
height: 100%;
width: 40%;
position: fixed;
right: 30%;
top:300px;
font-family: sans-serif;
color:white;
z-index: 99999;
}
h1 { font-size: 16;
color:whitesmoke;
text-align:center;
}
p {font-size: 15px;
color:whitesmoke;
margin-top: 19px;
line-height: 25px;
text-align:center;
}
span {
font-weight: bolder;
font-size:larger ;
}
#logo {
position:fixed;
height:120px;
left:30px;
top:10px;
z-index:99999;
border: 2px solid gainsboro;
margin: 12px;
filter: grayscale(0%);
}
/* Untermenü Referenzen /
Der Text in den Spalten ist im Hardwaretext der für die ganze Page gilt definiert*/
#container_spalten {
height: 100%;
width: 60%;
position: absolute;
right: 12%;
top:150px;
background-color:rgb(245, 245, 245);
}
#linke_spalte {
float:left;
background:rgb(245, 245, 245);
width:100%;
font-size: 13px;
font-family: sans-serif;
line-height: 1.8;
}
#linke_spalte img {
width:100%;
border: 2px solid rgba(0, 0, 255, 0.795);
filter: grayscale(0%);
position: center;
}
#text{
height: 100%;
width: 100%;
float: left;
/* right: 250px;*/
top:300px;
z-index: 99999;
}
#text h1 {font-size: 18px;
color:rgb(34, 50, 138);
line-height: 30px;
margin-top: 0px;
}
#text h2 {font-size: 14px;
color:rgb(34, 50, 138);
line-height: 20px;
margin-top: 10px;
padding:30px;
text-align:center;
}
#text p {font-size: 13px;
color:rgb(48, 26, 145);
margin-top: 15px;
line-height: 19px;
font-family: sans-serif;
padding: 30px;
font-weight:100;
text-align: left;
}
span {
font-weight: bolder;
font-size:larger ;
}
.flagge {
margin:20px;
width:40px;
border: 4px solid white;
}
#impressum {
height: 20px;
position: fixed;
top:300px;
font-family: sans-serif;
color:rgb(255, 240, 103);
top: 190px;
left: 43px;
z-index: 99999
}
#impressum a {
font-size: 14px;
color:rgb(216, 213, 213);
font-weight: 700;
line-height: 35px;
text-decoration: none;
}
@media screen and (max-width:950px) {
.navbar {
width: 180px;
height: 310px;
float:left;
top:180px;
padding-top:15px;
padding-left: 0px;
margin-left: 0px;
padding-right: 20px;
}
ul { flex-direction: column;
height: 60px;
width: 20%;
padding-top: 1px;
margin-left: 0px;
z-index: 10000000;
}
li {
width:100%;
line-height: 2.6;
}
li a {
padding: 0 30 px;
font-size: 14px;
font-family: sans-serif;
display:inline-flex;
}
li img { display:none;}
#headline {
display:none;
}
/* -- Referenzen Anfang -- */
#container_spalten {
height: 100%;
width: 60%;
position: absolute;
left: 200px;
right: 12%;
top:90px;
}
#linke_spalte {
float:left;
width:100%;
font-size: 13px;
font-family: sans-serif;
line-height: 1.8;
}
#recht_spalte {
display:none;
}
#text {
height: 100%;
width: 100%;
float: left;
top:300px;
z-index: 99999;
}
#text h1 {font-size: 18px;
color:rgb(34, 50, 138);
line-height: 30px;
margin-top: 0px;
}
#text p {font-size: 13px;
color:rgb(48, 26, 145);
margin-top: 15px;
line-height: 19px;
font-family: sans-serif;
padding: 30px;
font-weight:100;
text-align: left;
}
span {
font-weight: bolder;
font-size:larger ;
}
#impressum {
height: 20px;
position: absolute;
top:25px;
font-family: sans-serif;
color:white;
left: 200px;
}
#impressum a {
font-size: 12px;
color: rgb(4, 47, 110);
font-weight: 700;
line-height: 30px;
text-decoration: none;
}
}
@media screen and (max-width:466px) {
#logo {
position:absolute;
height:70px;
left:230px;
border: 2px solid gainsboro;
margin: 12px;
filter: grayscale(0%);
z-index: 99999999;
}
.navbar {
width: 100%;
height: 310px;
float:left;
top:180px;
padding-top:15px;
padding-left: 0px;
margin-left: 0px;
padding-right: 20px;
position:absolute;
}
ul { flex-direction: column;
height: 60px;
width: 100%;
position:absolute;
padding-top: 1px;
margin-left: 0%;
z-index: 10000000;
}
li {
width:100%;
line-height: 2.6;
}
li a {
padding: 0 10 px;
font-size: 14px;
font-family: sans-serif;
display:inline-flex;
}
li img { display:none;}
#container_spalten {
height: 100%;
width: 100%;
position: absolute;
left: 0px;
right: 0%;
top:480px;
}
#linke_spalte {
float:left;
background:rgb(245, 245, 245);
width:100%;
font-size: 13px;
font-family: sans-serif;
line-height: 1.8;
}
#recht_spalte {
display:none;
}
#text{
height: 100%;
width: 100%;
float: left;
top:300px;
z-index: 99999;
}
#text h1 {font-size: 18px;
color:rgb(34, 50, 138);
line-height: 30px;
margin-top: 0px;
}
#text p {font-size: 13px;
color:rgb(48, 26, 145);
margin-top: 15px;
line-height: 19px;
font-family: sans-serif;
padding: 30px;
font-weight:100;
}
span {
font-weight: bolder;
font-size:larger ;
}
.flagge {
margin-top:40px;
margin-left: 28px;
width:40px;
border: 4px solid white;
}
#impressum {
height: 20px;
position: absolute;
top:100px;
font-family: sans-serif;
color:rgb(57, 15, 247);
left: 243px;
z-index: 99999
}
#impressum a {
font-size: 12px;
color: rgb(7, 69, 163);
font-weight: 700;
line-height: 30px;
text-decoration: none;
}
}