@import url(https://fonts.googleapis.com/css?family=Open+Sans);

html,
body,
.main-container {
  height: 100%;
}

body {
  background: radial-gradient(#eee, #668);
}

.main {
  width: 20%;
}

/*
** FORM
*/
#form_fichaje #user,
#form_fichaje #pass {
  height: 70px;
  width: 90%;
  margin: auto;
  border-radius: 15px;
  background: rgba(0, 0, 0, 0.1);
  font-size: 2.2rem;
  text-align: center;
}

#form_fichaje #user:focus,
#form_fichaje #pass:focus {
  background: rgba(0, 250, 250, 0.1);
}

#user_submit {
  width: 80%;
  margin-left: 10%;
  height: 60px;
  line-height: 40px;
  font-size: 2.7rem;
  border-radius: 15px;
  background: linear-gradient(#aaa, #777);
}

.hoverCSSClass:hover {
  background: linear-gradient(#777, #aaa);
}

::-webkit-input-placeholder {
  text-align: center;
  color: white;
}

:-moz-placeholder {
  /* Firefox 18- */
  text-align: center;
  color: white;
}

::-moz-placeholder {
  /* Firefox 19+ */
  text-align: center;
  color: white;
}

:-ms-input-placeholder {
  text-align: center;
  color: white;
}

@media (max-width: 1200px) {
  .main {
    width: 30%;
  }
}

@media (max-width: 992px) {
  .main {
    width: 50%;
  }
  #user,
  #user_submit {
    width: 80%;
    margin-left: 10%;
  }
}

@media (max-width: 768px) {
  .main {
    width: 80%;
  }
}

/*
/********************************************************************* ADMIN STYLES
*/
.main-cont {
  padding-top: 65px;
}

.error-mod {
  color: hsla(0, 100%, 50%, 1);
  border-color: hsla(0, 100%, 50%, 1);
}

.success-mod {
  color: hsla(120, 100%, 25%, 1);
  border-color: hsla(120, 100%, 25%, 1);
}

.btn:not([disabled]) {
  cursor: pointer;
}

.navbar-dark .navbar-nav .nav-link,
ul.dropdown-menu.show li a {
  color: hsla(0, 0%, 100%, 0.8);
}

.navbar-dark .navbar-nav .nav-link:hover,
ul.dropdown-menu.show li a:hover {
  color: hsla(0, 0%, 100%, 1);
  text-decoration: underline;
}

/*
** BOTONES INFORME
*/

.button-container {
  padding-top: 28px;
}

input[type="checkbox"] {
  /* Double-sized Checkboxes */
  -ms-transform: scale(3); /* IE */
  -moz-transform: scale(3); /* FF */
  -webkit-transform: scale(3); /* Safari and Chrome */
  -o-transform: scale(3); /* Opera */
  transform: scale(3);
  margin-top: 15px;
}

.error {
  padding: 0.25em;
  color: rgb(202, 19, 19);
  text-align: center;
  font-weight: 600;
  font-size: 18px;
}