@import url("../styles/resetknacss.css");
/* /////////////////////    BASE      ////////////////////// */
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif&family=Open+Sans&display=swap");
* {
  margin: 0;
  padding: 0; }

body, html {
  height: 100%;
  font-size: 16px;
  background: #D0CFCF; }

body {
  font-family: 'Open Sans', Verdana, sans-serif; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Noto Serif', Georgia, serif; }

a:link {
  color: #212121;
  text-decoration: none; }

a:visited {
  color: purple;
  text-decoration: underline; }

a:hover {
  color: darkblue;
  text-decoration: underline;
  font-weight: 500; }

input, textarea, select, button {
  font-family: inherit;
  font-size: 100%;
  width: 15rem;
  margin: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

label {
  font: .8rem "typewriter", sans-serif; }

input, textarea {
  font: .9rem/1.5rem "handwriting", sans-serif;
  padding: 0 10px;
  margin: 0;
  width: 240px;
  background: none;
  border: none; }

input:focus, textarea:focus {
  background: rgba(0, 0, 0, 0.1);
  border-radius: 0.5rem;
  outline: none; }

.dateIn {
  background-color: lime; }

.dateOut {
  background-color: red; }

.container {
  z-index: auto; }

/* /////////////////////    LAYOUT    ////////////////////// */
wrapper {
  background: #D0CFCF; }

header {
  width: 100%;
  min-height: 2rem;
  position: fixed;
  top: 0;
  box-shadow: 0.2rem .2rem .2rem #666; }

main {
  width: 100%;
  min-height: 40rem;
  margin-top: 2.6rem;
  background: -webkit-linear-gradient(111deg, #f7f7f8, #f7f7f8, #eeeff1, #e5e6e9, #dedede);
  background: linear-gradient(111deg, #f7f7f8, #f7f7f8, #eeeff1, #e5e6e9, #dedede);
  background-attachment: fixed;
  background-size: 600% 600%;
  animation: gradient 15s ease infinite; }

@keyframes gradient {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
footer {
  background: #D0CFCF; }

/* /////////////////////    MODULE    ////////////////////// */
.logoLZM {
  max-width: 40%; }
  .logoLZM svg {
    fill: rgba(0, 0, 0, 0.8); }

nav.mainMenu {
  margin: 0;
  padding: 0 2rem;
  width: 100%;
  height: 2.6rem;
  background: -webkit-linear-gradient(111deg, #e6e7eb, #e6e7eb, #dde0e3, #d4d7db, #cfcfcf);
  background: linear-gradient(111deg, #e6e7eb, #e6e7eb, #dde0e3, #d4d7db, #cfcfcf); }
  nav.mainMenu ul {
    margin: 0;
    padding: 0;
    list-style-type: none; }
  nav.mainMenu ul li {
    margin: 0;
    padding: 0;
    float: left; }
  nav.mainMenu ul::after {
    clear: left; }

main > section {
  margin: 0;
  padding: 2rem 0;
  width: 100%; }

.container {
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 4px 5px 5px rgba(127, 127, 127, 0.9);
  border-radius: 5px;
  margin: 2rem;
  padding: 2rem; }

.container h1 {
  text-shadow: .1rem .1rem .1rem #666; }

.pictoHome, .pictoLogin, .pictoLogout {
  width: 2rem;
  height: 2rem;
  line-height: 2rem;
  margin: .2rem;
  padding: 0;
  border-radius: 50%; }

.pictoHome {
  fill: #666; }

.pictoLogin {
  fill: #666; }

.pictoLogout {
  fill: #666;
  transition: all 0.5s; }

a:hover .pictoHome {
  fill: #212121; }

a:hover .pictoLogin {
  fill: #212121; }

a:hover .pictoLogout {
  fill: red;
  background: white; }

.loginForm {
  display: block;
  margin: 2rem;
  width: 28rem;
  overflow: visible; }
  .loginForm form {
    width: 100%; }
  .loginForm fieldset {
    margin: 1rem;
    padding: 1rem;
    background: #DADADA; }
  .loginForm input[type="text"], .loginForm input[type="password"] {
    width: 100%;
    background: rgba(255, 255, 255, 0.6);
    border: thin solid #a1a1a1;
    border-radius: 0.5rem; }
  .loginForm input[type="submit"] {
    margin-top: 10px;
    width: 100%;
    cursor: pointer; }
  .loginForm .message {
    font-size: 1rem; }

.loginBtn {
  margin: .8rem;
  height: 5rem;
  line-height: 5rem;
  width: 5rem;
  font-size: 5rem;
  font-weight: bold;
  border-radius: 50%;
  background-color: #999;
  border: .5rem dashed #FFF;
  text-align: center;
  cursor: pointer; }
  .loginBtn a {
    display: block;
    text-decoration: none;
    color: #212121;
    transition: transform .7s ease-in-out; }
  .loginBtn a:hover {
    transform: rotate(360deg); }

/* /////////////////////    STATE     ////////////////////// */
/* /////////////////////    THEME     ////////////////////// */

/*# sourceMappingURL=default.css.map */
