body {
     margin: 0px;
 }

 .lctc {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
 }

 .login_page_container {
     position: fixed;
     width: 100%;
     height: 100%;
     background:white;
     /*background-image:linear-gradient(to bottom right, #1399cc,#004084);*/

 }

 .login_popup {
     width: 800px;
     max-width: 90%;
     height: auto;
     display: grid;
     grid-template-columns: 60% 40%;
     font-family: 'Lato', sans-serif;
     letter-spacing: 1px;
     line-height: 1;
     box-shadow: 0 0 30px -5px black;
     overflow: hidden;
 }

 .blocks {
     padding: 30px 0px;
     box-sizing: border-box;
     height: 100%;

 }

  .left {
     display: grid;
/*     grid-template-rows: 200px max-content;*/
     grid-template-rows: auto;
     background-color: white;
     justify-content: center;

 }

 .company_logo_container {
     position: relative;
     width: 100%;
    
 }

 .company_logo {
     width: 300px;

 }

 .company_caption {
     font-weight: 700;
     font-size: 18px;
     color: black;

 }


 .right {
    background-color: white;
     display: grid;
     grid-template-rows: 100px max-content auto;
     text-align: center;
     justify-content: center;
    background-image: linear-gradient(to bottom right,#37929b, #08455b);
     /*background-color:#74b7be;*/
 }

 .product_logo_container {
     position: relative;
     width: 100%;
 }

 .product_logo {
     width: 70%;

 }

 .product_caption {

     font-size: 16px;
     margin-bottom: 10px;
 }

 .login_form_container {
     position: relative;
     width: 100%;
     margin-bottom: 40px;
 }

.login_form {
     width:100%;

 }

 .login_form .input_container {
     position: relative;
     width: 100%;
     margin: 20px 0px;
     /*            border: 1px solid black;*/
     border-radius: 5px;
      box-shadow: 0 0 15px -5px grey;
     overflow: hidden;

 }

 .login_form .input_icon {
     position: absolute;
     display: flex;
     justify-content: center;
     align-items: center;
     width: 45px;
     height: 45px;
     background-color: #333;
     border: none !important;
     outline: 0 !important;
     color: white;

 }

 .login_form input {
     width: 100%;
     height: 45px;
     padding-left: 50px;
     border: none;
     box-sizing: border-box;

 }

 .login_button {
     width: 95%;
     background-color: #333;    
     color: white;
     border: 1px solid #333;    
     border-radius: 4px;
     height: 45px;
     cursor: pointer;
 }

 .login_button:hover {
     background-color: #444;
     /*color: #999;   */
 }

 @media(max-width:780px) {

     .blocks {
         padding: 0px 0px;
         height: auto;

     }
     .left{
        grid-template-rows: 80px auto;
         height: 80px;
     }
     
     .company_logo{
         width:200px;
     }

     .welcome{
     font-weight: 700;
     font-size: 12px;
     color: black;

     }

     .company_caption {
         font-weight: 700;
         font-size: 14px;
         color: black;

     }


     .login_popup {
         grid-template-columns: auto;
         grid-template-rows: max-content auto;
     }

      .login_form input,
     .login_form button {
         width: 300px;
         max-width: 100%;
     
     }

     .product_logo {
         width: 150px;

     }
 }