input:focus, select:focus, textarea:focus, button:focus {outline: none;}
body, p, h1, h2 {margin: 0; padding: 0; font-family: 'Montserrat', sans-serif;}
login {width: 100%; min-height: 100vh; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; background: #2f4858; position: relative; z-index: 1; background-position: 50%; background-size: cover;}
login > block {position: relative; background: #fff; border-radius: 0px; padding: 50px;}
login > block > h1 {text-align: center; font-weight: bold; font-size: 4vh;}
login > block > h2 {text-align: center; font-weight: normal; font-size: 3vh;}
login > block > email, login > block > password {display: block; margin-top: 25px; text-align: left; font-weight: normal; font-size: 16px; margin-bottom: 5px;}
login > block > input {padding: 10px; border: solid 1px #d2d2d2; width: calc(100% - 20px);}
login > block > forgot {display: block; width: 100%; text-align: right; font-size: 12px; margin-top: 5px; cursor: pointer;}
login > block > button {padding: 10px; border: 0; width: 100%; text-align: center; margin-top: 25px; color: #fff; background: #333; font-size: 20px; transition: 0.25s; cursor: pointer;}
login > block > button.error {background: red; color: #fff;}
login > block > website {position: absolute; bottom: -33px; left: 0; padding: 10px 25px; background: #e2e2e2; width: calc(100% - 50px); font-size: 12px; border-radius: 0px 0px 5px 5px; text-align: center; font-weight: bold; border-top: solid 1px #d2d2d2; transition: 0.25s; cursor: pointer; box-shadow: 0 3px 9px #000000;}
login > block > website:hover {background: #c5c5c5;}
login > block > cardlogin {padding: 10px; border: 0; width: calc(100% - 20px); text-align: center; margin-top: 10px; color: #fff; background: #333; font-size: 14px; transition: 0.25s; cursor: pointer; display: block;}
login > block > cardlogin > i {margin: 0 5px;}

login > block > getcard {display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: white; z-index: 100; border-radius: 10px; text-align: center;}
login > block > getcard .uitleg {display: block; text-align: center; font-size: 24px; margin-top: 25%; margin-bottom: 25px;}
login > block > getcard > i {font-size: 100px; color: #222; margin-top: 50px;}
login > block > getcard > i.correct {display: none; color: #8fbc8f;}
login > block > getcard > i.error {display: none; color: #cd5c5c;}

@media only screen and (max-width: 768px) {
    login > block {width: 75%;}
}

@-ms-viewport{
    width: device-width;
}