.web-app-user-login-block
{
    padding: 10px;
    background: #ffffff;
    width: 98%;
}
.web-app-login-inputs
{
    width: 40%;
    padding: 10px;
    /* border:1px solid #CCC; */
    display: inline-block;
    margin: 20px;
    margin-top: 0px;
}
.web-app-login-title
{
    color:#AE1022 !important;
    font-size: 20px;
}

.web-app-user-input
{
    padding: 10px;
    padding-left: 0px;

}

.web-app-user-input > p
{
    color: #555;
    font-size: 18px;
}

.web-app-user-input > input[type=email],
.web-app-user-input > input[type=text],
.web-app-user-input > input[type=password]
{
    width: 90%;
    padding: 10px;
    border: 0px ;
    background: #F7F7F7;
}

.web-app-user-input > input[type="checkbox"] {
    visibility: hidden;
  }
  label {
    cursor: pointer;
  }
  .web-app-user-input > input[type="checkbox"] + label:before {
    border: 1px solid #333;
    content: "\00a0";
    display: inline-block;
    font: 16px/1em sans-serif;
    height: 16px;
    margin: 0em 0 0;
    padding: 0;
    vertical-align: top;
    width: 16px;
    margin-left: -25px;
  }
  .web-app-user-input > input[type="checkbox"]:checked + label:before {
    background: #fff;
    color: #333;
    content: "\2713";
    text-align: center;
    font-weight: bold;
  }
  .web-app-user-input  > label > span
  {
      padding: 10px;
  }
 

.web-app-user-input > label
{
    
    padding: 5px;font-size: 18px;
}

.red-login-button{
    background:#AE1022;
    color : #FFF;
    font-size: 18px;
    width: 90%; 
}
.web-app-wrong-input
{
    color: #AE1022;
    padding: 10px;
    font-size: 16px;
}

/***************SIGN UP *****************/

.web-app-sign-up
{ 
    display: inline-block;
    margin: 0;
    /* background: gold; */
    padding: 20px;
    vertical-align: top;
    width: 40%;
    color: #2B2B2B;
    font-size: 18px;
    margin: 20px;
    margin-top: 0px;
}

.web-app-sign-up > ul, .web-app-sign-up > p
{
    padding: 5px; color: #2B2B2B;
}
.web-app-sign-up > ul, .web-app-sign-up > p >a
{
    color: #5555FF;
    text-decoration: none;
}
.web-app-sign-up > ul > li
{
    margin-left: 20px;
    padding: 2px 4px;
    color: #2B2B2B;
}
.web-app-button-sign-up
{
    background: #666666;
    color: #FFF;
    padding: 10px;
    border:none;
    width: 88%;
    font-size: 18px;
}

.web-app-sign-up-mobile{
    width: 95%;
    padding: 10px;
    display: inline-block;
    margin: 20px;
    border-bottom: 2px solid #666666;
    border-left: 2px solid #666666;
    padding-top: 15px;
    margin-top: -20px
}
.web-app-client-icon-large-mobile{
    padding-top : 15px;
    padding-bottom: 10px;
    height: 50px;
}
.web-app-client-icon-large{
    margin-left: -10px;
}
.web-app-login-bottom-link{
    padding-left: 20px;
    margin-top: -30px;
    font-weight: bold;
}
/********RESPONSIVE********/
@media only screen and (max-width: 700px) {
    .web-app-sign-up, .web-app-login-inputs
    {
        width: 80%; 
        border-bottom: 2px solid #666666;
        border-left: 2px solid #666666;
        margin-top: -32px;
    }
    .web-app-login-bottom-link{
        margin-top: -15px;
    }
    .web-app-user-login-block{
        margin-bottom: 52;
    }
}

@media only screen and (max-width: 512px) {
    body{
        height: 100%;
    }
    .web-app-login-inputs
    {
        display: block !important;
        width:95%!important;
        margin-top: -32px;
    }
    .web-app-sign-up
    {
        display: none !important;
    } 
    .web-app-sign-up-mobile{
         display: block !important;
    }
    .web-app-client-brand-logo{
         display: block !important;
    }
    .web-app-client-icon-large{
        display: none !important;
    }
    .web-app-user-login-block{
        margin-left: 0 !important;
        margin-right:0 !important;
        margin-bottom: 52;
    }
    .web-app-landing-page{
        margin-left: 0 !important;
        margin-right:0 !important;
    }
    .web-app-login-bottom-link{
        margin-top: -15px;
    }
}
@media only screen and (min-width: 2048px) {
    body{
        width: 50% !important;
        vertical-align: middle !important;
    }
    .web-app-user-login-block{
        margin-left: 50%;
    }
    .web-app-landing-page{
        margin-left: 50%;
    }
    .web-app-banner-image{
        width: 50vw;
    }
}
@media only screen and (max-width: 2048px) {
    body{
        width: 1024px !important;
        vertical-align: middle !important;
    }
    .web-app-banner-image{
        width:1024px !important;
    }
    .web-app-user-login-block{
        margin-left: 24vw;
    }
    .web-app-landing-page{
        margin-left: 24vw;
    }
}
@media only screen and (max-width: 1800px) {
    body{
        width: 1024px !important;
        vertical-align: middle !important;
    }
    .web-app-banner-image{
        width:1024px !important;
    }
    .web-app-user-login-block{
        margin-left: 15vw;
    }
    .web-app-landing-page{
        margin-left: 15vw;
    }
}
@media only screen and (max-width: 1500px) {
    body{
        width: 1024px !important;
        vertical-align: middle !important;
    }
    .web-app-banner-image{
        width:1024px !important;
    }
    .web-app-user-login-block{
        margin-left: 13vw;
    }
    .web-app-landing-page{
        margin-left: 13vw;
    }
}
@media only screen and (max-width: 1340px) {
    body{
        width: 100% !important;
        vertical-align: middle !important;
    }
    
    .web-app-banner-image{
        width: 100% !important;
    }
    .web-app-user-login-block{
        margin-left: 0 !important;
        margin-right:0 !important;
    }
    .web-app-landing-page{
        margin-left: 0 !important;
        margin-right:0 !important;
    }
}