@import "..\\..\\styles\\globals.css";

.form {
     /* width: 300px; */
     width: min-content;
     margin: 0 auto;
     vertical-align: middle;
}

html {
     height: 100%;
}

body {
     font-family: 'PoppinsRegularFont', sans-serif;
     font-size: 15px;
     color: #fff;
     background: url(/img/BAUMA.svg);
     background-repeat: no-repeat;
     background-size: 100vw 100vh;
     height: 100vh;
     margin: 0;
}

.clearfix:before,
.clearfix:after {
     content: "";
     display: table;
}

.clearfix:after {
     clear: both;
}

a {
     color: #0067ab;
     text-decoration: none;
}

a:hover {
     text-decoration: underline;
}

input[type='text'],
input[type='email'],
input[type='password'] {
     width: 200px;
     border-radius: 2px;
     border: 1px solid #CCC;
     padding: 10px;
     color: #333;
     font-size: 14px;
     margin-top: 10px;
}

input[type='submit'] {
     padding: 10px 25px 8px;
     color: #fff;
     background-color: #00a9ff;
     text-shadow: rgba(0, 0, 0, 0.24) 0 1px 0;
     font-size: 16px;
     box-shadow: rgba(255, 255, 255, 0.24) 0 2px 0 0 inset, #2480c4 0 1px 0 0;
     border: 1px solid #00a9ff;
     border-radius: 3px;
     margin-top: 10px;
     cursor: pointer;
     width: 223px;
}

input[type='submit']:hover {
     background-color: #024978;
}

input[type='button'] {
     padding: 10px 25px 8px;
     color: #fff;
     background-color: #0067ab;
     text-shadow: rgba(0, 0, 0, 0.24) 0 1px 0;
     font-size: 16px;
     box-shadow: rgba(255, 255, 255, 0.24) 0 2px 0 0 inset, #fff 0 1px 0 0;
     border: 1px solid #0164a5;
     border-radius: 2px;
     margin-top: 10px;
     cursor: pointer;
}

input[type='button']:hover {
     background-color: #024978;
}

#synergyCircleDiv {
     width: 49vw;
     height: 72vh;
}

#imgCircleOfDeath {
     position: absolute;
     top: 16%;
     left: 25%;
}

#login_Div {
     position: absolute;
     top: 30%;
     left: 43%;
}

#login_header {
     padding-left: 20px;
     font-family: 'PoppinsBoldFont', sans-serif;
     font-size: 30px;
}


#login_version {
     text-align: left;
     position: absolute;
     bottom: 5%;
     left: 2%;
}

#login_contact {
     text-align: right;
     position: absolute;
     bottom: 2%;
     right: 2%;
     font-size: 12px;
}


@media (max-width: 768px) {
     #login_Div {
          position: absolute;
          top: 20vh;
          left: 28vw;
     }

     input[type='text'],
     input[type='email'],
     input[type='password'] {
          width: 158px;
          border-radius: 5px;
          border: 1px solid #CCC;
          padding: 7px 5px;
          color: #333;
          font-size: 12px;
          margin-top: 10px;
     }

     input[type='submit'] {
          padding: 7px 5px;
          border: 1px solid #00a9ff;
          border-radius: 5px;
          width: 170px;
     }

     #login_header {
          padding-left: 25px;
          padding-bottom: 35px;
          font-size: 20px;
     }

     #imgCircleOfDeath {
          top: 16%;
          left: 1%;
     }

     #synergyCircleDiv {
          width: 98vw;
          height: 71vh;
     }

     #login_version{
          font-size: 10px;
          bottom: 1%;
     }

     #login_contact {
          font-size: 10px;
          bottom: 0.5%;
     }
}