body {
         margin: 0;
         font-family: "Nunito", sans-serif;
         font-size: 0.9rem;  
         font-weight: 400;
         line-height: 1.6;
         color: #212529;
         text-align: left;
         background-color: #fafafa;
         }
         #app {
         font-family: 'Avenir', Helvetica, Arial, sans-serif;
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;
         text-align: center;
         color: #2c3e50;
         margin-top: 60px;
         }
         h1,
         h2 {
         font-weight: normal;
         }
         h4, .h4 {
         line-height: 1.2;
         font-size: 1.35rem;
         }
         ul {
         list-style-type: none;
         padding: 0;
         }
         li {
         display: inline-block;
         margin: 0 10px;
         }
         a {
         color: #42b983;
         }
         button {
         margin: 15px; 
         text-transform: none;
         }
         button,
         [type=button],
         [type=reset],
         [type=submit] {
         -webkit-appearance: button;
         }
         input[type=button].btn-block {
         width: 100%;
         }
         .login{
         background-color: #179bd7;
         width: 14%;
         font-size: 13px;
         font-family: "Open Sans",sans-serif;
         font-weight: 600;
         padding-top: 7px;
         padding-bottom: 7px;
         text-align: center;
         text-decoration: none;
         border: 1px solid #095779;
         -khtml-border-radius: 4px;
         border-radius: 4px;
         color: #fff;
         cursor: pointer;
         }
         .login-container{
         margin-top: 5% !important;
         margin-bottom: 5% !important;
         }
         .login-form-1{
         padding: 5%;
         box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.2), 0 9px 26px 0 rgba(0, 0, 0, 0.19);
         }
         .login-form-1 h3{
         text-align: center;
         color: #333;
         }
         .login-container form{
         padding: 10%;
         }
         .btnSubmit
         {
         /* width: 50% !important; */
         width: 42.1% !important;
         border-radius: 1rem;
         padding: 1.5%;
         border: none;
         cursor: pointer;
         }
         .login-form-1 .btnSubmit{
         font-weight: 600;
         color: #fff;
         background-color: #0062cc;
         }
         .login-form-2 .btnSubmit{
         font-weight: 600;
         color: #0062cc;
         background-color: #fff;
         }
         .login-form-2 .ForgetPwd{
         color: #fff;
         font-weight: 600;
         text-decoration: none;
         }
         .login-form-1 .ForgetPwd{
         color: #0062cc;
         font-weight: 600;
         text-decoration: none;
         }
         .m-0 {
         margin: 0!important;
         }
         .mb-3, .my-3 {
         margin-bottom: 1rem !important;
         }
         a, a:hover, a:focus {
         color: inherit;
         text-decoration: none;
         transition: all 0.3s;
         }
         img {
         vertical-align: middle;
         border-style: none;
         }
         /*
         * DOM element resizing detection
         * https://github.com/marcj/css-element-queries
         */
         *,
         *::before,
         *::after {
         box-sizing: border-box;
         }
         h1,
         h2,
         h3,
         h4,
         h5,
         h6 {
         margin-top: 0;
         margin-bottom: 0.5rem;
         }
         img {
         vertical-align: middle;
         border-style: none;
         }
         button {
         border-radius: 0;
         }
         button:focus {
         outline: 1px dotted;
         outline: 5px auto -webkit-focus-ring-color;
         }
         input,
         button,
         select,
         optgroup,
         textarea {
         margin: 0;
         font-family: inherit;
         font-size: inherit;
         line-height: inherit;
         }
         button,
         input {
         overflow: visible;
         }
         button,
         select {
         text-transform: none;
         }
         select {
         word-wrap: normal;
         }
         button,
         [type=button],
         [type=reset],
         [type=submit] {
         -webkit-appearance: button;
         }
         h1,
         h2,
         h3,
         h4,
         h5,
         h6,
         .h1,
         .h2,
         .h3,
         .h4,
         .h5,
         .h6 {
         margin-bottom: 0.5rem;
         font-weight: 500;
         line-height: 1.2;
         }
         h4,
         .h4 {
         font-size: 1.35rem;
         }
         .container {
         width: 100%;
         padding-right: 15px;
         padding-left: 15px;
         margin-right: auto;
         margin-left: auto;
         }
         @media (min-width: 576px) {
         .container {
         max-width: 540px;
         }
         }
         @media (min-width: 768px) {
         .container {
         max-width: 720px;
         }
         }
         @media (min-width: 992px) {
         .container {
         max-width: 960px;
         }
         }
         @media (min-width: 1200px) {
         .container {
         max-width: 1140px;
         }
         }
         .container-fluid,
         .container-xl,
         .container-lg,
         .container-md,
         .container-sm {
         width: 100%;
         padding-right: 15px;
         padding-left: 15px;
         margin-right: auto;
         margin-left: auto;
         }
         @media (min-width: 576px) {
         .container-sm,
         .container {
         max-width: 540px;
         }
         }
         @media (min-width: 768px) {
         .container-md,
         .container-sm,
         .container {
         max-width: 720px;
         }
         }
         @media (min-width: 992px) {
         .container-lg,
         .container-md,
         .container-sm,
         .container {
         max-width: 960px;
         }
         }
         @media (min-width: 1200px) {
         .container-xl,
         .container-lg,
         .container-md,
         .container-sm,
         .container {
         max-width: 1140px;
         }
         }
         .row {
         display: flex;
         flex-wrap: wrap;
         margin-right: -15px;
         margin-left: -15px;
         }
         .col-lg,
         .col-lg-auto,
         .col-lg-12,
         .col-lg-11,
         .col-lg-10,
         .col-lg-9,
         .col-lg-8,
         .col-lg-7,
         .col-lg-6,
         .col-lg-5,
         .col-lg-4,
         .col-lg-3,
         .col-lg-2,
         .col-lg-1,
         .col-md,
         .col-md-auto,
         .col-md-12,
         .col-md-11,
         .col-md-10,
         .col-md-9,
         .col-md-8,
         .col-md-7,
         .col-md-6,
         .col-md-5,
         .col-md-4,
         .col-md-3,
         .col-md-2,
         .col-md-1,
         .col-sm,
         .col-sm-auto,
         .col-sm-12,
         .col-sm-11,
         .col-sm-10,
         .col-sm-9,
         .col-sm-8,
         .col-sm-7,
         .col-sm-6,
         .col-sm-5,
         .col-sm-4,
         .col-sm-3,
         .col-sm-2,
         .col-sm-1,
         .col,
         .col-auto,
         .col-12,
         .col-11,
         .col-10,
         .col-9,
         .col-8,
         .col-7,
         .col-6,
         .col-5,
         .col-4,
         .col-3,
         .col-2,
         .col-1 {
         position: relative;
         width: 100%;
         padding-right: 15px;
         padding-left: 15px;
         }
         .col {
         flex-basis: 0;
         flex-grow: 1;
         max-width: 100%;
         }
         @media (min-width: 576px) {
         .col-sm {
         flex-basis: 0;
         flex-grow: 1;
         max-width: 100%;
         }
         .row-cols-sm-1 > * {
         flex: 0 0 100%;
         max-width: 100%;
         }
         .row-cols-sm-2 > * {
         flex: 0 0 50%;
         max-width: 50%;
         }
         .row-cols-sm-3 > * {
         flex: 0 0 33.3333333333%;
         max-width: 33.3333333333%;
         }
         .row-cols-sm-4 > * {
         flex: 0 0 25%;
         max-width: 25%;
         }
         .row-cols-sm-5 > * {
         flex: 0 0 20%;
         max-width: 20%;
         }
         .row-cols-sm-6 > * {
         flex: 0 0 16.6666666667%;
         max-width: 16.6666666667%;
         }
         .col-sm-auto {
         flex: 0 0 auto;
         width: auto;
         max-width: 100%;
         }
         .col-sm-1 {
         flex: 0 0 8.3333333333%;
         max-width: 8.3333333333%;
         }
         .col-sm-2 {
         flex: 0 0 16.6666666667%;
         max-width: 16.6666666667%;
         }
         .col-sm-3 {
         flex: 0 0 25%;
         max-width: 25%;
         }
         .col-sm-4 {
         flex: 0 0 33.3333333333%;
         max-width: 33.3333333333%;
         }
         .col-sm-5 {
         flex: 0 0 41.6666666667%;
         max-width: 41.6666666667%;
         }
         .col-sm-6 {
         flex: 0 0 50%;
         max-width: 50%;
         }
         .col-sm-7 {
         flex: 0 0 58.3333333333%;
         max-width: 58.3333333333%;
         }
         .col-sm-8 {
         flex: 0 0 66.6666666667%;
         max-width: 66.6666666667%;
         }
         .col-sm-9 {
         flex: 0 0 75%;
         max-width: 75%;
         }
         .col-sm-10 {
         flex: 0 0 83.3333333333%;
         max-width: 83.3333333333%;
         }
         .col-sm-11 {
         flex: 0 0 91.6666666667%;
         max-width: 91.6666666667%;
         }
         .col-sm-12 {
         flex: 0 0 100%;
         max-width: 100%;
         }
         .order-sm-first {
         order: -1;
         }
         .order-sm-last {
         order: 13;
         }
         .order-sm-0 {
         order: 0;
         }
         .order-sm-1 {
         order: 1;
         }
         .order-sm-2 {
         order: 2;
         }
         .order-sm-3 {
         order: 3;
         }
         }
         @media (min-width: 768px) {
         .col-md {
         flex-basis: 0;
         flex-grow: 1;
         max-width: 100%;
         }
         .row-cols-md-1 > * {
         flex: 0 0 100%;
         max-width: 100%;
         }
         .row-cols-md-2 > * {
         flex: 0 0 50%;
         max-width: 50%;
         }
         .row-cols-md-3 > * {
         flex: 0 0 33.3333333333%;
         max-width: 33.3333333333%;
         }
         .row-cols-md-4 > * {
         flex: 0 0 25%;
         max-width: 25%;
         }
         .row-cols-md-5 > * {
         flex: 0 0 20%;
         max-width: 20%;
         }
         .row-cols-md-6 > * {
         flex: 0 0 16.6666666667%;
         max-width: 16.6666666667%;
         }
         .col-md-auto {
         flex: 0 0 auto;
         width: auto;
         max-width: 100%;
         }
         .col-md-1 {
         flex: 0 0 8.3333333333%;
         max-width: 8.3333333333%;
         }
         .col-md-2 {
         flex: 0 0 16.6666666667%;
         max-width: 16.6666666667%;
         }
         .col-md-3 {
         flex: 0 0 25%;
         max-width: 25%;
         }
         .col-md-4 {
         flex: 0 0 33.3333333333%;
         max-width: 33.3333333333%;
         }
         .col-md-5 {
         flex: 0 0 41.6666666667%;
         max-width: 41.6666666667%;
         }
         .col-md-6 {
         flex: 0 0 50%;
         max-width: 50%;
         }
         }
         a,
         a:hover,
         a:focus {
         color: inherit;
         text-decoration: none;
         transition: all 0.3s;
         }
         /* width */
         ::-webkit-scrollbar {
         width: 5px;
         }
         /* Track */
         ::-webkit-scrollbar-track {
         background: #fff;
         }
         /* Handle */
         ::-webkit-scrollbar-thumb {
         background: #c8c6c4;
         border-radius: 20px;
         }
         /* Handle on hover */
         ::-webkit-scrollbar-thumb:hover {
         background: #605e5c;
         }