body{
                margin:0px;
                background:url('../images/background2.jpg');
                background-position: center; /* Center the image */
                background-repeat: no-repeat; /* Do not repeat the image */
                background-size: cover;
            }
            .logo-container{
                text-align: center;
                margin-bottom: -20px;
            }
            .logo-container>img{
                height: 200px;
                width: 200px;
            }
        .glass-container{
            display: flex;
            justify-content: center;
            align-items: center;
         }
        .glass{
            background: #ffffff9e;
            width: 700px;
            min-height: 330px;
            
        }
        .glass {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            box-shadow: 2px 1px 8px 2px white;
            border: 1px solid white;
            }
        .form-container
        {
            padding:25px;
    
        }
        input[type="text"]{
            
            width: 100%;
        height: 45px;
        padding: 5px;
        margin: 10px 0px;
        border-radius: 10px;
        }
        input[type="text"]:active 
        {
            border-radius: 10px;
            border: 1px solid green;
        }
    
        input[type="text"]:focus {
            border-radius: 10px;
            border: 1px solid red;
            outline: 0px;
        }
    
        input[type="text"]:hover {
                border-radius: 10px;
            border: 1px solid blue;
        }

        input.button5{
            display:inline-block;
            padding:0.46em 1.6em;
            border:0.1em solid #000000;
            margin:0 0.2em 0.2em 0;
            border-radius:0.12em;
            box-sizing: border-box;
            text-decoration:none;
            font-family:'Roboto',sans-serif;
            font-weight:300;
            color:#000000;
            text-shadow: 0 0.04em 0.04em rgba(0,0,0,0.35);
            background-color:#FFFFFF;
            text-align:center;
            transition: all 0.15s;
            height: 45px;
            width: 200px;
        }
        input.button5:hover
        {
            text-shadow: 0 0 2em rgb(255 255 255);
            color: #ffffff;
            border-color: #FFFFFF;
            background: #a16cff;
        }
        @media all and (max-width:30em)
        {
            input.button5
            {
                display:block;
                margin:0.4em auto;
            }
        }

        @media only screen and (max-width: 755px) {
            /* For mobile phones: */
             .glass
             {
                      background: #ffffff9e;
                      width: 500px;
                      min-height: 330px;
                      
             }
          }
          @media only screen and (max-width: 550px) {
            
             .glass
             {
                      background: #ffffff9e;
                      width: 300px;
                      min-height: 330px;
                      
             }
              .logo-container>img
              {
                          height: 150px;
                          width: 150px;
              }
              .form-container
                  {
                      padding:15px;
              
                  }
                h2{
                    font-size:20px;
                }
                input[type="text"]{
                      
                  width: 100%;
                  height: 35px;
                  padding: 5px;
                  margin: 8px 0px;
                  border-radius: 10px;
                 }
                 input[type="submit"]{
                      
                  width: 100%;
                  height: 35px;
                  padding: 5px;
                  margin: 8px 0px;
                  border-radius: 10px;
                 }
          }