Update index.html

This commit is contained in:
mathias 2015-12-11 22:14:53 +02:00
parent 947a597a93
commit 45d10fb9f9

View file

@ -111,25 +111,46 @@
background: #fcfcfc; background: #fcfcfc;
background: rgba(255,255,255,.2); background: rgba(255,255,255,.2);
} }
::-webkit-input-placeholder {
color: #808080;
}
:-moz-placeholder {
color: #808080;
}
::-moz-placeholder {
color: #808080;
}
:-ms-input-placeholder {
color: #808080;
}
h1, h2, h3, p, #logo, #ip {
cursor: default;
}
h1, h2, h3 { h1, h2, h3 {
text-transform: uppercase; text-transform: uppercase;
font-style: normal; font-style: normal;
font-weight: normal; font-weight: normal;
cursor: default; }
h1 {
font-size: 12px;
text-transform: uppercase;
font-family: montserratregular,"Helvetica Neue",Helvetica,Arial,sans-serif;
margin-top: 0;
padding: 0 0 22px 0;
line-height: 6px;
} }
h2 { h2 {
margin: 0 0 15px;
text-transform: uppercase;
font-family: montserratbold,"Helvetica Neue",Helvetica,Arial,sans-serif;
letter-spacing: 1px;
text-align: center;
font-size: 19px; font-size: 19px;
text-transform: uppercase;
text-align: center;
font-family: montserratbold,"Helvetica Neue",Helvetica,Arial,sans-serif;
margin: 0 0 15px;
letter-spacing: 1px;
} }
p { p {
text-align: center;
margin: 0 0 15px; margin: 0 0 15px;
line-height: 1.5; line-height: 1.5;
text-align: center;
cursor: default;
} }
a { a {
text-decoration: none; text-decoration: none;
@ -170,196 +191,134 @@
letter-spacing: 1px; letter-spacing: 1px;
text-align: center; text-align: center;
margin: 0; margin: 0;
cursor: default;
} }
#about, #news, #contact {
h1 {
font-size: 12px;
text-transform: uppercase;
font-family: montserratregular,"Helvetica Neue",Helvetica,Arial,sans-serif;
margin-top: 0;
padding-bottom: 22px;
line-height: 6px;
cursor: default;
}
#about, #news, #contact {
width: 100%; width: 100%;
height: 100%; height: 100%;
color: #fff; color: #fff;
display: table; display: table;
} }
#about, #contact {
#about, #contact {
background: #000; background: #000;
} }
#news {
#news { background: #0b0b0b;
background-color: #0b0b0b;
text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2); text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
} }
#about-body, #news-body, #contact-body {
#about-body, #news-body, #contact-body {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
padding-left: 10px; padding: 30px 10px 30px 10px;
padding-right: 10px;
padding-top: 30px;
padding-bottom: 30px;
font-size: 12px; font-size: 12px;
text-align: center; text-align: center;
} }
input, textarea {
input, textarea { font-family: montserratlight,"Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 12px;
border: none; border: none;
color: #000; color: #000;
background: #fff; background: #fff;
padding: 6px 8px 6px 9px; padding: 6px 8px 6px 9px;
font-family: montserratlight,"Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 12px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px; border-radius: 4px;
-webkit-transition: background .3s ease-in-out;
-moz-transition: background .3s ease-in-out;
transition: background .3s ease-in-out; transition: background .3s ease-in-out;
resize: none; resize: none;
margin: 0; margin: 0;
} }
input:focus, textarea:focus {
::-webkit-input-placeholder { background: rgba(255,255,255,.8);
color: #808080; }
} #ipinput {
:-moz-placeholder {
color: #808080;
}
::-moz-placeholder {
color: #808080;
}
:-ms-input-placeholder {
color: #808080;
}
#ipinput {
border: #fff solid 1px; border: #fff solid 1px;
background: none; background: none;
color: #fff; color: #fff;
width: 53px; width: 53px;
margin: 10px 0 0 0; margin: 10px 0 0 0;
-moz-border-radius: 0px 5px 5px 0px;
-webkit-border-radius: 0px 5px 5px 0px;
border-radius: 0px 5px 5px 0px; border-radius: 0px 5px 5px 0px;
} }
#ipinput:hover, #ipinput:focus {
#ipinput:hover, #ipinput:focus {
outline: 0;
background: rgba(255,255,255,.1); background: rgba(255,255,255,.1);
text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.2); text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.2);
} }
button {
input:focus, textarea:focus { font-family: montserratlight,"Helvetica Neue",Helvetica,Arial,sans-serif;
outline: 0; font-size: 12px;
background: rgba(255,255,255,.8);
}
button {
color: #fff; color: #fff;
background: none; background: none;
border: #fff solid 1px; border: #fff solid 1px;
padding: 6px 8px 6px 9px; padding: 6px 8px 6px 9px;
font-family: montserratlight,"Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 12px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px; border-radius: 5px;
-webkit-transition: background .3s ease-in-out;
-moz-transition: background .3s ease-in-out;
transition: background .3s ease-in-out; transition: background .3s ease-in-out;
cursor: pointer; cursor: pointer;
} }
button:hover, button:focus {
button:hover, button:focus {
outline: 0;
background: rgba(255,255,255,.1); background: rgba(255,255,255,.1);
} }
#ip {
#ip {
border: #fff solid 1px; border: #fff solid 1px;
color: #000; color: #000;
background: #fff; background: #fff;
padding: 6px 6px 6px 9px; padding: 6px 6px 6px 9px;
margin: 10px 0 0 0; margin: 10px 0 0 0;
font-size: 12px; font-size: 12px;
-moz-border-radius: 5px 0px 0px 5px;
-webkit-border-radius: 5px 0px 0px 5px;
border-radius: 5px 0px 0px 5px; border-radius: 5px 0px 0px 5px;
cursor: default; }
} #facebook:before, #twitter:before {
#facebook:before, #twitter:before {
border-radius: 50%; border-radius: 50%;
display: inline-block; display: inline-block;
padding: 8px; padding: 8px;
font-size: 15px; font-size: 15px;
color: #fff; color: #fff;
text-shadow: 0px 3px 2px rgba(0, 0, 0, 0.11); }
} #facebook {
#facebook { margin: 0 6px 0 0;
margin-right: 6px; }
} #twitter {
#twitter { margin: 0 0 0 6px;
margin-left: 6px; }
} #facebook:before {
#facebook:before {
background: #3b5998; background: #3b5998;
font-family: 'icon'; font-family: 'icons';
content: '\e603'; content: '\e603';
} }
#twitter:before { #twitter:before {
background: #0084b4; background: #0084b4;
font-family: 'icon'; font-family: 'icons';
content: '\e604'; content: '\e604';
} }
#aboutbutton, #newsbutton, #contactbutton { #aboutbutton, #newsbutton, #contactbutton {
background: #fff; background: #fff;
color: #aa0000; color: #aa0000;
font-size: 14px; font-size: 14px;
-webkit-transition: background .1s ease-in-out;
-moz-transition: background .1s ease-in-out;
transition: background .1s ease-in-out; transition: background .1s ease-in-out;
text-decoration: none; }
} input:focus, textarea:focus, button:hover, button:focus, #aboutbutton:hover, #aboutbutton:focus, #newsbutton:hover, #newsbutton:focus, #contactbutton:hover, #contactbutton:focus {
#aboutbutton:hover, #aboutbutton:focus, #newsbutton:hover, #newsbutton:focus, #contactbutton:hover, #contactbutton:focus {
outline: 0; outline: 0;
} }
#newsbutton { #newsbutton {
border-left: 1px solid #aa0000; border-left: 1px solid #aa0000;
padding: 6px 10px 6px 10px; padding: 6px 10px 6px 10px;
} }
#aboutbutton { #aboutbutton {
-moz-border-radius: 21px 0px 0px 21px;
-webkit-border-radius: 21px 0px 0px 21px;
border-radius: 21px 0px 0px 21px; border-radius: 21px 0px 0px 21px;
padding: 6px 10px 6px 12px; padding: 6px 10px 6px 12px;
} }
#contactbutton { #contactbutton {
-moz-border-radius: 0px 21px 21px 0px;
-webkit-border-radius: 0px 21px 21px 0px;
border-radius: 0px 21px 21px 0px; border-radius: 0px 21px 21px 0px;
padding: 6px 13px 6px 10px;
border-left: 1px solid #aa0000; border-left: 1px solid #aa0000;
} padding: 6px 13px 6px 10px;
#aboutbutton:before, #about-title:before { }
font-family: 'icon'; #aboutbutton:before, #about-title:before {
font-family: 'icons';
content: "\e605"; content: "\e605";
} }
#newsbutton:before, #news-title:before { #newsbutton:before, #news-title:before {
font-family: 'icon'; font-family: 'icons';
content: "\e602"; content: "\e602";
} }
#contactbutton:before, #contact-title:before { #contactbutton:before, #contact-title:before {
font-family: 'icon'; font-family: 'icons';
content: "\e600"; content: "\e600";
} }