.style-4 input[type="text"] {
padding: 10px;
border: none;
border-bottom: solid 2px #c9c9c9;
transition: border 0.3s;
margin: 0px 20%;
font-family: 'Dosis', sans-serif;
font-size:100%;
}
.style-4 input[type="text"]:focus,
.style-4 input[type="text"]:focus {
border-bottom: solid 2px black;
}
.style-5 input[type="password"] {
padding: 10px;
border: none;
border-bottom: solid 2px #c9c9c9;
transition: border 0.3s;
margin: 0px 20%;
font-family: 'Dosis', sans-serif;
font-size:100%;
}
.style-5 input[type="password"]:focus,
.style-5 input[type="password"]:focus {
border-bottom: solid 2px black;
}
.style-6 input[type="text"] {
padding: 10px;
border: none;
border-bottom: solid 2px #c9c9c9;
transition: border 0.3s;
margin: -15px 20%;
font-family: 'Dosis', sans-serif;
font-size:100%;
}
.style-6 input[type="text"]:focus,
.style-6 input[type="text"]:focus {
border-bottom: solid 2px black;
}
.hackerl_login {
margin-top:0.5%;
height:20%;
width: 3%;
}
.ghost-button-semi-transparent {
display: inline-block;
width: 20%;
padding: 1%;
color: #fff;
border: 3px solid #fff;
font-size: 130%;
text-align:center;
font-weight:bold;
text-decoration: none;
transition: background-color 0.2s ease-out,
border-color 0.2s ease-out;
}
.ghost-button-semi-transparent:hover,
.ghost-button-semi-transparent:active {
background-color: rgba(255, 255, 255, 0.4);
border-color: #fff;
transition: background-color 0.3s ease-in,
border-color 0.3s ease-in;
}
.ghost-button-semi-transparent2 {
display: inline-block;
width: 20%;
padding: 1%;
color: #fff;
border: 3px solid #fff;
font-size: 130%;
text-align:center;
font-weight:bold;
text-decoration: none;
transition: background-color 0.2s ease-out, border-color 0.2s ease-out;
margin-left: 25%;
}
.ghost-button-semi-transparent2:hover,
.ghost-button-semi-transparent2:active {
background-color: rgba(255, 255, 255, 0.4);
border-color: #fff;
transition: background-color 0.3s ease-in,
border-color 0.3s ease-in;
}
}
h2{
text-align:center;
font-size:200%;
color:#1f232d;
margin-top:0%;
font-family: 'Baloo Bhaina', cursive;
}
.impressum{
position:absolute;
margin-left:1%;
margin-top:2.5%;
color:#1f232d;
text-decoration:none;
font-size:20px;
font-family: Arial;
}
.img_schriftzug{
position:relative;
margin-top:2%;
margin-left:25%;
}
.overlay {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
visibility: hidden;
opacity: 0;
}
.overlay:target {
visibility: visible;
opacity: 1;
}
.popup {
margin: 20px auto;
padding: 20px;
background: #1f232d;
border-radius: 5px;
width: 30%;
position: relative;
}
.popup h2 {
text-align:center;
font-size:200%;
margin-top:-5%;
font-family: 'Baloo Bhaina', cursive;
color: #fff;
}
.popup .close {
position: absolute;
top: 20px;
right: 30px;
font-size: 30px;
font-weight: bold;
text-decoration: none;
color: #fff;
}
.popup .close:hover {
color: orange;
}
.popup .content {
max-height: 30%;
overflow: auto;
}
[type="submit"] {
font-family: 'Montserrat', Arial, Helvetica, sans-serif;
width: 50%;
background:#ed295d;
border-radius:5px;
border:0;
cursor:pointer;
color:#191c21;
font-size:30px;
padding-top:15px;
padding-bottom:15px;
transition: all 0.3s;
margin-top:7%;
margin-left:25%;
font-weight:700;
}
[type="submit"]:hover { background:#ed295d; }
ul {
list-style-type: none;
}
.overlay_pw {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
visibility: hidden;
opacity: 0;
}
.overlay_pw:target {
visibility: visible;
opacity: 1;
}
.popup_pw {
margin: 0% auto;
padding: 20px;
background: #ed295d;
border-radius: 5px;
width: 35%;
position: relative;
}
.popup_pw h2 {
margin-top: 0;
color: #fff;
font-family: Tahoma, Arial, sans-serif;
}
.popup_pw .close_pw {
position: absolute;
top: 15px;
right: 30px;
font-size: 30px;
font-weight: bold;
text-decoration: none;
color: #fff;
}
.popup_pw .close_pw:hover {
color: orange;
}
.popup_pw .content_pw {
color:#fff;
font-size:20px;
font-family: Tahoma, Arial, sans-serif;
max-height: 10%;
max-height: 50%;
overflow: auto;
}