Home

@import url(http://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700);

body {
background: url(../img/bg.png);
margin: 0px auto;
font-family: ‘ubuntu’;
}

a {
color: rgba(1, 152, 202, 1.0);
}

a:hover {
color: rgba(255, 255, 255, 1.0);
}

#header {
background: #181818;
width: 100%;
height: 110px;
border-bottom: 8px solid rgba(1, 152, 202, 1.0);
}

.headbg {
background: url(../img/headbg.png);
width: 400px;
height: 110px;
float: left;
}

#subheader {
background: black;
width: 100%;
height: 170px;
}

#subheader > .bild {
background: url(../img/sub_bg2.png);
width: 100%;
height: 170px;
float: left;
border-bottom: 8px solid rgba(1, 152, 202, 1.0);
}

#subheader > .bild > .text {
font-family: Ubuntu;
font-weight: bold;
font-size: 72px;
color: #FFFFFF;
text-align: center;
text-shadow: -2px -1px 10px black;
padding-top: 40px;
}

#logo {
background: url(../img/logo.png);
width: 220px;
height: 102px;
margin: auto;
}

#container {
background: rgba(0, 0, 0, 0.0);
width: 1300px;
height: 800px;
margin: auto;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

div#main {
width: 1300px;
padding: 0px 10x;
z-index: 8;
margin: auto;
clear: both;
position: relative;
margin-top: 80px;
font-family: Ubuntu;
}
#box1 {
background-color: #181818;
width: 20%;
height: 390px;
overflow: hidden;
padding: 15px;
color: #FFFFFF;
float: right;
border-radius: 5px;
}
#box1 .title {
border-radius: 3px;
font-size: 18px;
font-weight: bold;
padding-bottom: 10px;
padding-left: 5px;
}
#box1 .text {
font-family: Ubuntu;
font-weight: lighter;
font-size: 13px;
color: #FFFFFF;
padding-left: 5px;
}
.box2 {
background-color: #181818;
width: 20%;
padding: 15px;
color: #bdc3c7;
height: 390px;
position: relative;
float: left;
border-radius: 6px;
}
.box2 .inbox {
background-color: #ecf0f1;
width: 97%;
margin-top: 12px;
height: 85px;
margin-right: auto;
margin-left: auto;
color: #7f8c8d;
border-radius: 3px;
}
.inbox:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.box2 .inbox .title {
border-radius: 3px;
padding-top: 7px;
font-size: 14px;
font-weight: bold;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 30px;
margin-top: -10px;
color: #7f8c8d;
}
.box2 .inbox2 {
background-color: #ecf0f1;
width: 97%;
margin-top: 25px;
height: 85px;
margin-right: auto;
margin-left: auto;
color: #7f8c8d;
border-radius: 3px;
}
.inbox2:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.box2 .inbox2 .title {
border-radius: 3px;
font-size: 14px;
font-weight: bold;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 30px;
margin-top: -10px;
color: #7f8c8d;
}
.box2 .title {
border-radius: 3px;
font-size: 18px;
font-weight: bold;
padding-bottom: 10px;
padding-left: 5px;
color: #FFFFFF
}
.box2 .text {
font-family: Ubuntu;
font-weight: bold;
font-size: 12px;
color: #7f8c8d;
padding-left: 15px;
padding-right: 15px;
margin-top: -35px;
}
.box2 .inbox3 {
background-color: #ecf0f1;
width: 97%;
margin-top: 25px;
height: 85px;
margin-right: auto;
margin-left: auto;
color: #7f8c8d;
border-radius: 3px;
}
.inbox3:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.box2 .inbox3 .title {
border-radius: 3px;
font-size: 14px;
font-weight: bold;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 30px;
margin-top: -10px;
color: #7f8c8d;
}
.box3 {
background-color: #181818;
width: 50%;
margin: 30px;
padding: 15px;
color: #FFFFFF;
height: 390px;
position: relative;
margin-right: auto;
margin-left: auto;
border-radius: 6px;
}
.box3 .infotext {
font-family: Ubuntu;
font-weight: lighter;
font-size: 13px;
color: #FFFFFF;
padding-left: 5px
}
.box3 .title {
border-radius: 3px;
font-size: 18px;
font-weight: bold;
padding-bottom: 10px;
padding-left: 5px;
}
.team {
list-style-type: none;
margin-left: 20px;
margin-right: 1em;
margin-top: 10px;
position: absolute;
}
.team li {
background-color: #eee;
border: 2px solid #FFFFFF;
width: 70px;
height: 70px;
border-radius: 37.5px;
float: left;
margin-right: 15px;
background-position: 50% 20%;
background-repeat: no-repeat;
background-size: cover;
}
.team li:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.aufgaben {
position: absolute;
width: 220px;
height: auto;
background-color: rgba(0, 0, 0, 0.8);
margin-left: 12px;
padding: 10px;
border-radius: 3px;
color: #fff;
font-size: 13px;
margin-top: 90px;
display: none;
}
.arrow {
border-style: solid;
border-color: transparent transparent rgba(0, 0, 0, 0.8) transparent;
border-width: 10px;
position: absolute;
margin-left: 0px;
margin-top: -30px;
}
.Login {
width: 500px;
height: 25px;
margin-top: 25px;
padding: 20px;
left: 264px;
position: relative;
float: right;
}
.Login > form input {
background-color: rgba(255, 255, 255, 0.9);
font-family: Ubuntu;
font-size: 13px;
font-weight: bold;
outline: #FFFFFF;
color: #bdc3c7;
margin-bottom: 20px;
border-bottom: solid rgba(0, 0, 0, 0.4);
border-radius: 4px;
width: 240px;
height: 38px;
padding-left: 7px;
}
.Login > form button {
border-bottom: solid rgba(0, 0, 0, 0.4);
background: rgba(255, 255, 255, 0.9);
height: 42px;
width: 242px;
font-family: Ubuntu;
cursor: pointer;
font-weight: bold;
font-size: 15px;
float: left;
color: #bdc3c7;
border-radius: 4px;
}
.Login > form button:active {
position: relative;
top: 2px;
box-shadow: 0 1px 0 #1E5600;
}
#iconusername {
background-image: url(/username.gif);
background-repeat: no-repeat;
background-position: 9px 9px;
}
#iconpasswort {
background-image: url(/passwort.gif);
background-repeat: no-repeat;
background-position: 6px 9
}

#footer {
background-color: #181818;
width: 1280px;
height: auto;
padding: 10px;
border-radius: 5px;
margin-top: 0px;
margin: auto;
color: rgba(255, 255, 255, 1.0);
}

WordPress.com ile böyle bir site tasarlayın
Başlayın