* {
    padding:0;
    margin:0; 
    --primary: #453493;
    --color-primary:#444444;
    --font-primary: 'Quicksand', sans-serif;
    border-radius: 0px!important;
    
 }
 
 html,body {
     font-family: var(--font-primary) !important;
     background-color: #F5F5F5 !important;
 }
 
 .form-control {
     border-radius: 0 !important;
     border: 0px !important;
 }
 
 
 .left-sidebar {
     /* height: 100vh; */
     height: 100%;
 }
 
 .hero {
     background: url("../img/hero.png");
     background-size: 70% auto !important;
     background-repeat: no-repeat;
     background-size: cover;
     height: 100vh;
     background-position: center center;
     background-color: white;
     position: fixed!important;
     top: 0;
     right: 0;
 }
 
 .left-sidebar {
     padding: 40px;
     background-color: #F5F5F5;
 }
 
 .left-sidebar .header {
     width: 100%;
 }
 
 .left-sidebar .header .logo {
     height: 80px;
     width: 80px;
     float: left;
 }
 
 .left-sidebar .header .title {
     height: 80px;
     font-weight: bolder;
     line-height: 40px;
     display: flex;
     align-items: center;
     float: left;
     padding-left: 20px;
 }
 
 .form {
     margin-top: 150px;
 }
 
 .form .title {
     color: var(--primary);
     font-weight: bold;
     font-size: 16pt;
 }
 
 .form .desc {
     color: var(--primary);
     margin-top: 24px;
 }
 
 .form .form-group-input {
     margin-top:32px;
     background-color: white;
     filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.161));
     /* padding:15px 0px; */
 }
 
 .form-label {
     color: var(--color-primary);
 }
 
 .forgot-password{
     margin-top:32px;
     text-align:right;
 }

 .forgot-password a {
    color:var(--primary)!important;
 }
 
 .btn-primary-2 {
     background-color: var(--primary)!important;
     border:  2px solid var(--primary) !important;
     color: white !important;
 }
 
 .btn-outline-primary-2 {
     border:  2px solid var(--primary) !important;
     box-sizing: border-box !important;
     color: var(--primary) !important;
 }
 
 .text-primary-2 {
     color: var(--primary);
     text-decoration: none;
 }


 textarea:hover, 

textarea:active, 
textarea:focus, 
button:focus,
button:active,
button:hover,
label:focus,
.btn:active,
.btn.active
{
    outline:0px !important;
    -webkit-appearance:none;
    box-shadow: none !important;
}

input:focus,
input:active {
    border-left: 5px solid var(--primary) !important;
    box-shadow: none !important;
}

@media (max-width:321px) {
    .header .title {
        display: none !important;
    }
    .header {
        display: flex;
        justify-content: center;
    }
    .form {
        margin-top:32px !important;
    }
}