* {
  font-family: "Open Sans", sans-serif;
  font-weight: 300;
  text-rendering: optimizeLegibility;
}

body {
  margin: 0;
  padding: 0;
  background: #fff;
  color: #fff;
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
}

body.main {
  /*background-image: linear-gradient(75deg, #4fc3f7 0%,  #d7ccc8 99%);*/
  padding: 4rem 0 6rem;
  /* relative to font-size of the root element */
  background: #02111D;
  /* fallback for old browsers */
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #02111D, #037BB5, #02111D);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

body.skyline {
  background: #1488CC;
  /* fallback for old browsers */
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #2B32B2, #1488CC);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

body.frozen {
  background: #403B4A;
  /* fallback for old browsers */
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #E7E9BB, #403B4A);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.login,
.register {
  position: absolute;
  top: calc(40% - calc(180px/2));
  left: calc(50% - calc(300px/2));
  height: 180px;
  width: 300px;
  padding: 10px;
  z-index: 2;
}

.login .logo,
.register .logo {
  text-align: center;
}

.login input[type=text],
.login input[type=password],
.login input[type=email],
.register input[type=text],
.register input[type=password],
.register input[type=email] {
  width: 300px;
  height: 36px;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 2px;
  color: #fff;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  padding: 2px 10px;
}

.login input[type=text]:focus,
.login input[type=password]:focus,
.login input[type=email]:focus,
.register input[type=text]:focus,
.register input[type=password]:focus,
.register input[type=email]:focus {
  outline: none;
  border: 1px solid rgba(255, 255, 255, 0.9);
}

.login a,
.register a {
  font-size: 14px;
  color: #fff;
  text-decoration: none;
}

.login a:hover,
.login a:active,
.login a:visited,
.register a:hover,
.register a:active,
.register a:visited {
  font-size: 14px;
  color: #fff;
  text-decoration: none;
}

.login a:hover,
.register a:hover {
  text-decoration: underline;
}

.login label,
.register label {
  font-size: 12px;
}

.register {
  top: calc(30% - calc(180px/2));
}

/*
.backstretch-item img {
    -webkit-filter: blur(1px);
    -moz-filter: blur(1px);
    -o-filter: blur(1px);
    -ms-filter: blur(1px);
    filter: blur(1px);
}
*/

.btn-auth {
  width: 300px;
  height: 36px;
  background: #FFF;
  border: 1px solid #FFF;
  cursor: pointer;
  border-radius: 2px;
  color: #666;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 300;
  margin-top: 10px;
}

.btn-auth:hover {
  opacity: 0.8;
  color: black;
}

.btn-auth:active {
  opacity: 0.6;
}

.btn-auth:focus {
  outline: none;
}

::-webkit-input-placeholder,
::-moz-input-placeholder {
  color: rgba(255, 255, 255, 0.6);
}