@charset "utf-8";
/* CSS Document */
   
	 body {
        margin: 0;
        background-image: url("/images/login-bg.jpg");
        background-repeat: no-repeat;
        background-size: cover;
		font-family: 'Inter', sans-serif
      }
	  .modal-close {
		float: right;
		background: none;
		border: none;
	}
	.hidden {
	  display: none !important;
	  visibility: hidden !important;
	}
	input.form-control,input.form-control:focus {
		box-shadow: none;
	   -webkit-box-shadow: none;
	   -moz-box-shadow: none;
	   -moz-transition: none;
	   -webkit-transition: none;
	}
em {
    font-style: normal;
    font-size: 26px;
}
.edit-link{color:#1E88E5;cursor:pointer }
.edit-link:hover{color:#90CAF9}
.items{
	height: -moz-calc(100% - 150px);
    height: -webkit-calc(100% - 150px);
    height: calc(100% - 150px);
    display:block;
	overflow:hidden
}
.color-green{color:#66BB6A;}
.color-red{color:#ec407a;}
.divider{border-bottom:1px solid #bdbdbd; margin-top:10px;margin-bottom:10px}
.int-text{font-size:18px;padding-top:10px;text-align:center}
.help-block{position:relative;color:#ff0000;font-size:11px; text-align:left;}
.btn-primary-red {
	color:#ffffff;
	background-color: #f44336
}

.btn-primary-red:hover, .btn-primary-red:focus, .btn-primary-red:active, .btn-primary-red.active {
  background-color: #e53935 !important
}

.btn-primary {
  background-color: #2473B3
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
  background-color: #2082b3 !important
}

.btn-primary.dropdown-toggle {
  background-color: #269AD5 !important
}

.btn-primary.dropdown-toggle:hover, .btn-primary.dropdown-toggle:focus {
  background-color: #2082b3 !important
}

.btn-outline-primary {
  border: 2px solid #269AD5;
  color: #269AD5 !important;
  background-color: transparent
}

.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active, .btn-outline-primary:active:focus, .btn-outline-primary.active {
  background-color: transparent;
  color: #269AD5;
  border-color: #269AD5
}

.checkmark-circle {
  width: 80px;
  height: 80px;
  position: relative;
  display: inline-block;
  vertical-align: top;
}
.checkmark-circle .background {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: #66bb6a;
  position: absolute;
}
.checkmark-circle .checkmark {
  border-radius: 5px;
}
.checkmark-circle .checkmark.draw:after {
  -webkit-animation-delay: 100ms;
  -moz-animation-delay: 100ms;
  animation-delay: 100ms;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease;
  -moz-animation-timing-function: ease;
  animation-timing-function: ease;
  -webkit-animation-name: checkmark;
  -moz-animation-name: checkmark;
  animation-name: checkmark;
  -webkit-transform: scaleX(-1) rotate(135deg);
  -moz-transform: scaleX(-1) rotate(135deg);
  -ms-transform: scaleX(-1) rotate(135deg);
  -o-transform: scaleX(-1) rotate(135deg);
  transform: scaleX(-1) rotate(135deg);
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
.checkmark-circle .checkmark:after {
  opacity: 1;
  height: 25px;
  width: 25px;
  -webkit-transform-origin: left top;
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  -o-transform-origin: left top;
  transform-origin: left top;
  border-right: 15px solid white;
  border-top: 15px solid white;
  border-radius: 1.5px !important;
  content: "";
  left: 5px;
  top: 35px;
  position: absolute;
}

@-webkit-keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 37.5px;
    opacity: 1;
  }
  40% {
    height: 55px;
    width: 37.5px;
    opacity: 1;
  }
  100% {
    height: 25px;
    width: 37.5px;
    opacity: 1;
  }
}
@-moz-keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 37.5px;
    opacity: 1;
  }
  40% {
    height: 55px;
    width: 37.5px;
    opacity: 1;
  }
  100% {
    height: 55px;
    width: 37.5px;
    opacity: 1;
  }
}
@keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 37.5px;
    opacity: 1;
  }
  40% {
    height: 55px;
    width: 37.5px;
    opacity: 1;
  }
  100% {
    height: 55px;
    width: 37.5px;
    opacity: 1;
  }
}

      
      
      #fContinueBtn {
        margin: 1em 0;
        width: 11.2em;
      }
      
	  .err-msg{font-size:12px;color:#ff0000}
	  .has-error .form-control:focus {
		border-color: #a94442;
		-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
		box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
		background-color:#Fce4ec 
		}
		.has-error .form-control {
			border-color: #a94442;
			-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
			box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
			background-color:#Fce4ec 
		}
	.login-side {
		display: none;
	}
	.login-content {
		margin: 1em auto;
	}
	.login-logo-md-screen{
		display: block;
	}
	 .login-content {
        display: flex;
		flex-direction: column;
       justify-content: safe center;
         /* height: 100vh; min-height: 100% !important; */ 
		height:100%; min-height: 100vh;
      }
	   
      .login-content-form {
        margin: 0 auto;
        width: 90%;
      }
	 .login-logo-md-screen{
		width: 200px;
		margin-bottom:10px
      }
	 

	.btn-block-xs-only {
		display: block;
		width: 100%;
	  }

@media screen and (min-width: 34em) {
	.login-side {
		display: none;
	}
	.login-content {
		margin: 1em auto;
	}
	.login-logo-md-screen{
		display: block;
	}
}

/* Medium. Above 48em (768px) */
@media screen and (min-width: 48em) {
	.login-side {
		display: none;
	}
	.login-content {
		margin: 1em auto;
	}
	.login-logo-md-screen{
		display: block;
	}
}

/* Large. Above 62em (992px) */
@media screen and (min-width: 62em) {
	.login-side {
		display: block;
        background-color: rgba(33, 143, 207, 0.8);
        color: white;
        height: 100%;
        width: 30vw;
        float: left;
        position: fixed;
        overflow: hidden;
        top: 0;
        left: 0;
      }
      .login-side div {
        width: 75%;
        margin: 0 auto;
        text-align: right;
        padding-top: 40vh;
      }
      .login-side div p {
        color: #ffffff;
      }
	  .login-content{
        margin-left: 30vw;
        display: flex;
       flex-direction: column;
		justify-content: safe center;
         /* height: 100vh; min-height: 100% !important; */ 
    height:100%; min-height: 100vh;
      }
	  
      .login-content-form {
        margin: 0 auto;
        width: 90%;
      }
      .login-content p {
        margin: 1em 0;
      }
      .login-content .form-control {
        background-color: rgba(255, 255, 255, 0.8);
      }
      .login-logo {
        width: 75%;
        margin-bottom: 1em;
      }
      .login-logo-md-screen {
        display: none;
        width: 150px;
        margin-bottom: 1em;
      }
	   .btn-block-xs-only {
		width: auto;
	  }
}

/* Extra large. Above 75em (1200px) */
@media screen and (min-width: 75em) {
	.login-side {
		display: block;
        background-color: rgba(33, 143, 207, 0.8);
        color: white;
        height: 100%;
        width: 30vw;
        float: left;
        position: fixed;
        overflow: hidden;
        top: 0;
        left: 0;
      }
      .login-side div {
        width: 75%;
        margin: 0 auto;
        text-align: right;
        padding-top: 40vh;
      }
      .login-side div p {
        color: #ffffff;
      }
	  .login-content {
        margin-left: 30vw;
        display: flex;
       flex-direction: column;
		justify-content: safe center;
         /* height: 100vh; min-height: 100% !important; */ 
    height:100%; min-height: 100vh;
      }
      .login-content-form {
        margin: 0 auto;
        width: 90%;
      }
      .login-content p {
        margin: 1em 0;
      }
      .login-content .form-control {
        background-color: rgba(255, 255, 255, 0.8);
      }
      .login-logo {
        width: 75%;
        margin-bottom: 1em;
      }
      .login-logo-md-screen {
        display: none;
        width: 150px;
        margin-bottom: 1em;
      }
	  .btn-block-xs-only {
		width: auto;
	  }
}
@media (min-width: 992px) {
		.modal.left.fade:not(.show) .modal-dialog {
			-webkit-transform: translate3d(-25%, 0, 0);
			transform: translate3d(-25%, 0, 0);
		}
		.modal.right.fade:not(.show) .modal-dialog {
			-webkit-transform: translate3d(25%, 0, 0);
			transform: translate3d(25%, 0, 0);
		}
		
		.modal.fade:not(.in).bottom .modal-dialog {
			-webkit-transform: translate3d(0, 25%, 0);
			transform: translate3d(0, 25%, 0);
		}
		.modal.right.fade .modal-dialog {
			position:absolute;
			top:0;
			right:0;
			margin:0;
			min-width:500px;			
		}
		.modal.right .modal-dialog.modal-sm {
			max-width:500px;
		}
		.modal.right .modal-dialog.modal-lg {
			width:800px;
		}
		.modal.left.fade .modal-dialog {
			position:absolute;
			top:0;
			left:0;
			margin:0;
			min-width:500px;
		}

		.modal.left .modal-dialog.modal-sm {
			max-width:300px;
		}

		.modal.left .modal-content, .modal.right .modal-content {
			min-height:100vh;
			border:0;
		}
	}
	/* 
Extra small devices (portrait phones, less than 544px) 
No media query since this is the default in Bootstrap because it is "mobile first"
*/
h1 {font-size:1rem;} /*1rem = 16px*/
@media (min-width: 544px) {  
  h1 {font-size:2rem;} /*1rem = 16px*/
}
 
/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {  
  h1 {font-size:2rem;} /*1rem = 16px*/
}
 
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
  h1 {font-size:2.5rem;} /*1rem = 16px*/
}
 
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
  h1 {font-size:3rem;} /*1rem = 16px*/    
}
 
/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Custom media queries
*/
 
/* Set width to make card deck cards 100% width */
@media (min-width: 950px) and (max-width:1100px) { 
  h1 {font-size:2.75rem;} 
}