.loginform {
  display:block;
  width:350px;
  max-width:90vw;
  margin:20px auto 20px auto;
}
.loginform h1, profil h1 {
  font-size:35px;
  font-weight:500;
  color:black;
  margin:0 0 15px 0;
}
.loginform h1 small, profil h1 small {
  font-size:22px;
  color:inherit;
}
.loginform label, profil label {
  font-size:15px;
  display:block;
  color:#000;
}
.loginform input[type=text], .loginform input[type=password], profil input[type=text], profil input[type=password] {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  display:block;
  box-sizing:border-box;
  width:100%;
  border:1px solid #ddd;
  font-size:16px;
  font-weight:700;
  padding:10px 10px;
  box-shadow:none;
  line-height:1.1em;
  height:auto;
  border-radius:5px;
  color:black;
  font-family:inherit;
  outline:none;
}
.loginform input[type=text]:focus, .loginform input[type=password]:focus, profil input[type=text]:focus, profil input[type=password]:focus {
  border-color:#6610f2;
  box-shadow:0px 1px 15px 1px rgba(0,0,0,0.1);
}
.loginform .login-button, profil .login-button {
  display:flex;
  width:100%;
  box-sizing:border-box;
  font-size:16px;
  align-items:center;
  justify-content:center;
  font-weight:500;
  height:40px;
  border-radius:5px;
  border:1px solid #777;
  color:#777;
  margin-top:10px;
  font-family:inherit;
  transition:all 0.3s;
  letter-spacing:0.5px;
}
.loginform .login-button .iconify, profil .login-button .iconify {
  font-size:30px;
  margin-right:15px;
  transition:all 0.3s;
}
.loginform .login-button:hover, profil .login-button:hover {
  text-decoration:none;
  box-shadow:0px 1px 15px 1px rgba(0,0,0,0.1);
}
.loginform .login-button:hover svg, profil .login-button:hover svg { transform:scale(1.2) !important; }
.loginform .login-submit, profil .login-submit {
  border-color:#4dbc15;
  background:#4dbc15;
  color:white;
  font-weight:700;
}
.loginform .login-google, profil .login-google {
  border-color:#666;
  background:#f8f8f8;
  color:black;
}
.loginform .login-facebook, profil .login-facebook {
  border-color:#4267b2;
  background:#4267b2;
  color:white;
}
.loginform .login-registracia, .loginform .login-lostpwd, profil .login-registracia, profil .login-lostpwd {
  border-color:#4dbc15;
  color:#4dbc15;
  background:white;
}
.loginform .login-captcha, profil .login-captcha {
  display:flex;
  justify-content:center;
}
.loginform input[type=checkbox], profil input[type=checkbox] {
  height:20px;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  width:0;
  outline:none;
  margin-right:20px;
}
.loginform input[type=checkbox]:before, profil input[type=checkbox]:before {
  content:"\f096";
  font-family:FontAwesome;
  font-size:20px;
  line-height:15px;
}
.loginform input[type=checkbox]:checked:before, profil input[type=checkbox]:checked:before {
  content:"\f046";
  color:#3498db;
}
.loginform .login-checkbox, profil .login-checkbox {
  display:flex;
  align-items:flex-start;
  margin-bottom:10px;
}
.loginform .login-checkbox input, profil .login-checkbox input {
  flex-shrink:0;
  margin-right:25px;
}
.loginform .login-checkbox label, profil .login-checkbox label {
  font-size:12px;
  line-height:1.2em;
  text-align:justify;
}
.loginform .login-info-link, profil .login-info-link {
  margin-bottom:10px;
  font-size:13px;
  color:#3498db;
}
.loginform .login-row.error label, profil .login-row.error label {
  font-weight:600;
  color:#e74c3c;
}
.loginform .login-row.error input, profil .login-row.error input { border:2px solid #e74c3c; }
.loginform .login-checkbox.error label, .loginform .login-checkbox.error input:before, profil .login-checkbox.error label, profil .login-checkbox.error input:before { color:#e74c3c; }
.loginform .profil-logout, profil .profil-logout {
  margin-top:20px;
  display:flex;
  justify-content:flex-end;
}
.loginform .profil-logout a, profil .profil-logout a {
  color:#e74c3c;
  font-size:16px;
  display:flex;
  padding:10px;
  border:1px solid #e74c3c;
  border-radius:5px;
  align-items:center;
  transition:all 0.3s;
  letter-spacing:0.5px;
}
.loginform .profil-logout a .iconify, profil .profil-logout a .iconify {
  font-size:25px;
  margin-right:12px;
  transition:all 0.3s;
}
.loginform .profil-logout a:hover, profil .profil-logout a:hover {
  text-decoration:none;
  box-shadow:0px 1px 15px 1px rgba(0,0,0,0.1);
}
.loginform .profil-logout a:hover svg, profil .profil-logout a:hover svg { transform:scale(1.2) !important; }
.loginform .profil-icons, profil .profil-icons {
  display:flex;
  flex-wrap:wrap;
  margin-top:20px;
}
.loginform .profil-icons a, profil .profil-icons a {
  color:#2c3e50;
  font-size:15px;
  width:100px;
  height:100px;
  margin:0 15px 15px 0;
  text-align:center;
}
.loginform .profil-icons a .iconify, profil .profil-icons a .iconify {
  transition:all 0.3s;
  font-size:55px;
}
.loginform .profil-icons a label, profil .profil-icons a label {
  display:block;
  text-align:center;
  color:inherit;
  line-height:1.2em;
  margin-top:8px;
}
.loginform .profil-icons a:hover, profil .profil-icons a:hover {
  text-decoration:none;
  color:#3498db;
  filter:drop-shadow(0px 0px 10px rgba(44,62,80,0.2));
}
.loginform .profil-icons a:hover svg, profil .profil-icons a:hover svg { transform:scale(1.2) !important; }
.loginform .profil-back, profil .profil-back {
  color:#2c3e50;
  font-size:16px;
  margin-bottom:12px;
}
.loginform .profil-back a, profil .profil-back a {
  color:inherit;
  transition:all 0.3s;
}
.loginform .profil-back a .iconify, profil .profil-back a .iconify { transition:all 0.3s; }
.loginform .profil-back a:hover, profil .profil-back a:hover {
  text-decoration:none;
  color:#3498db;
  filter:drop-shadow(0px 0px 10px rgba(44,62,80,0.2));
}
.loginform .profil-back a:hover svg, profil .profil-back a:hover svg { transform:scale(1.2) !important; }
@media screen and (max-width: 550px) {
  .loginform .profil-icons, profil .profil-icons { display:block; }
  .loginform .profil-icons a, profil .profil-icons a {
    display:flex;
    align-items:center;
    width:auto;
    height:auto;
  }
  .loginform .profil-icons a svg, profil .profil-icons a svg {
    margin-right:15px;
    width:30px;
    height:30px;
  }
}
.e-alert {
  display:block;
  padding:10px;
  border-radius:5px;
  color:white;
  font-size:15px;
  background:#3498db;
  line-height:1.2em;
  margin-top:10px;
}
.e-alert.e-alert-error { background:#e74c3c; }
.e-alert.e-alert-success { background:#20c997; }
.e-alert.e-alert-warning { background:#f39c12; }
a.e-alert { transition:all 0.3s; }
a.e-alert .iconify, a.e-alert .fa { transition:all 0.3s; }
a.e-alert:hover {
  text-decoration:none;
  color:white;
  filter:drop-shadow(0px 0px 10px rgba(44,62,80,0.2));
}
a.e-alert:hover svg, a.e-alert:hover .fa { transform:scale(1.2) !important; }
.profil-edit-avatar {
  width:256px;
  height:256px;
  background-size:cover;
  background-position:50% 50%;
}
.profil-avatar-dropzone {
  width:256px;
  margin-top:20px;
}
.dropzone .dz-default.dz-message {
  text-align:center;
  margin:0;
  opacity:0.8;
  display:block;
  transition:all 0.3s;
  font-weight:300;
  font-size:15px;
  line-height:1.2;
}
.dropzone .dz-default.dz-message svg { transition:all 0.3s; }
.dropzone .dz-default.dz-message .iconify {
  display:block;
  font-size:30px;
  margin:0 auto 8px auto;
  text-align:center;
}
.dropzone:hover .dz-default.dz-message { opacity:1; }
.dropzone:hover .dz-default.dz-message svg { transform:scale(1.5); }
.profil-avatar-delete {
  width:256px;
  box-sizing:border-box;
  margin-top:20px;
  padding:20px;
  border:2px dashed #e74c3c;
  color:#e74c3c;
  text-align:center;
  display:block;
  font-weight:300;
  font-size:15px;
  opacity:.8;
}
.profil-avatar-delete .iconify {
  display:block;
  font-size:30px;
  margin:0 auto 5px auto;
}
.profil-avatar-delete:hover {
  opacity:1;
  text-decoration:none;
  color:#e74c3c;
}
.avatar {
  width:40px;
  height:40px;
  object-fit:contain;
  border-radius:25px;
  overflow:hidden;
  padding:2px;
  background:#f4f3f1;
  border:1px solid #d8d5d2;
}