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