body {
background: url('digitalplane.png') no-repeat center center fixed;
font-family: Arial, sans-serif;
color: #ebe5e5;
background-color: #000000;
margin: 0;
padding: 0;
}


label {
display: flex;
width: 200px;
display: block;
margin-bottom: 8px;
color: #ebe5e5;
}

input{
margin-bottom: 2vh;
border: none;
border-bottom: 2px solid #D4AA30;
background-color:transparent;
outline: none;
color : white;
caret-color: white;
cursor: pointer;
}

input[type=text], [type="email"], [type="password"], [type="submit"]::placeholder {
text-align: center;
color: white;
font-family: Arial, sans-serif;
font-size: 14px;
}

input[type="submit"] {
background-color: #007BFF;
color: #fff;
border: none;
padding: 10px 20px;
font-size: 16px;
border-radius: 4px;
caret-color: transparent;
cursor: pointer;
transition: background-color 0.3s;
}

form i {
margin-right: 30px;
cursor: pointer;
}


h1 {        font-size:18px;
         text-shadow:
           1px 1px 1px blue,
           2px 2px 1px blue;
       }

       /* The Overlay (background) */
       .overlay {
         /* Height & width depends on how you want to reveal the overlay (see JS below) */
         height: 100%;
         width: 0;
         position: fixed; /* Stay in place */
         z-index: 1; /* Sit on top */
         left: 0;
         top: 0;
         background-color: rgb(0,0,0); /* Black fallback color */
         background-color: rgba(0,0,0, 0.9); /* Black w/opacity */
         overflow-x: auto; /* Disable horizontal scroll */
         transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
       }

       /* Position the content inside the overlay */
       .overlay-content {
         position: relative;
         top: 10%; /* 25% from the top */
         width: 100%; /* 100% width */
         text-align: center; /* Centered text/links */
         margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
       }

       /* The navigation links inside the overlay */
       .overlay a {
         padding: 8px;
         text-decoration: none;
         font-size: 36px;
         color: #818181;
         display: block; /* Display block instead of inline */
         transition: 0.3s; /* Transition effects on hover (color) */
       }

       /* When you mouse over the navigation links, change their color */
       .overlay a:hover, .overlay a:focus {
         color: #f1f1f1;
       }

       /* Position the close button (top right corner) */
       .overlay .closebtn {
         position: absolute;
         top: 20px;
         right: 45px;
         font-size: 60px;
       }


#zoomimg {
                       -webkit-transition: all 0.2s;
                       -moz-transition: all 0.2s;
                       -ms-transition: all 0.2s;
                       -o-transition: all 0.2s;
                       transition: all 0.2s;
            }
#zoomimg:hover {
                       transform:scale(1.2);
                       /* easeInQuad */
                  }



.formContainer1 {
              display: flex;
              justify-content: center;
              align-items: center;
              flex-direction: column;
              height: 100vh;
              background: linear-gradient(to top left, ##272424, #000000);
              background-repeat: cover;
              color: white;
           }
.login-container {
               max-width: 80%;
               margin: 100px auto;
               background-color: #0000;
               padding: 20px 30px;
               box-shadow: 0px 0px 10px rgba(255, 255, 255, 1);
               border-radius: 8px;
           }