/*
Updated by LACS
2019-05-31
*/
.container, .row{
  height: 100%;
}
/*@media screen and (max-width: 750px) and (max-height: 700px){
	#divPanelLogin{
    height: 100%;
    overflow-y: auto;
  }
}*/
#divLogin{
  /*height: 100%;*/
	/*margin-top: 15%;*/
  z-index: 1;
  /*opacity: 0.5;*/
	/*left: 33.3%;*/
}
#divContentCanvas{
  width: 100%;
  height: 45%;
  overflow: hidden;
}
#divCanvas{
  height: 100%;
  text-align: center;
}

/* enable absolute positioning */
.inner-addon { 
	position: relative; 
}

/* style icon */
.inner-addon .fas {
	position: absolute;
	padding: 10px;
	pointer-events: none;
	color: #b4b9c1;
}

/* align icon */
.left-addon .fas  { left:  0px;}
.right-addon .fas { right: 0px;}

/* add padding  */
.left-addon input  { padding-left:  30px; }
.right-addon input { padding-right: 30px; }

#username,#password{
	text-transform: none;
}
input::-webkit-input-placeholder {
	text-transform: uppercase;
}
input:-moz-placeholder {
	text-transform: uppercase;
}
input:-ms-input-placeholder { 
	text-transform: uppercase;
}
.rc-anchor-normal-light{
	width: 500px;
}

video { 
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
 
  position: fixed;    
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%); 
 
  z-index: 1;
 
  background-size: cover;
  opacity: 0.5;
}

#logo, #appName{
  display: inline;
  font-size: 24px;
}
#logo {
  max-width: 100px;
  max-height: 40px;
  margin: -5px 10px 0 0;
}

.tl-login {
  font-size: 45px;
  line-height: 1.1;
  font-weight: bold;
  color: aliceblue;
  text-shadow: 1px 1px 5px grey;
  margin-bottom: 5px;
}

.tl-login-sub {
  font-size: 25px;
  line-height: 1.1;
  color: #4CBDD1;
  font-weight: 500;
  text-shadow: 1px 1px 10px grey;
}

.card-login {
  max-width: 400px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

body{
  background: url("/img/bg_book_medic_v1.png");
  background-repeat: no-repeat;
  background-size: cover;
}


.login-img-doctor{
  position: absolute;
  bottom: 0px;
  left: 0px;
}

.login-img-doctor img{
  height: 70px;
}

.container, .container-lg, .container-md, .container-sm {
  max-width: 100%!important;
}

.col {
  height: 100% !important;
  display: flex;
  align-content: center;
  flex-direction: column;
}

.col-left {
  height: 100% !important;
  display: flex;
  align-content: center;
  flex-direction: column;
  justify-content: center;
  flex-wrap: wrap;
}

.col-right {
  justify-content: end;
  /* flex-wrap: wrap; */
  padding-bottom: 100px;
  max-width: 500px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.form-control{
  background-color: #EEEEEF;
  border-radius: 20px;
  box-shadow: 1px 1px 5px #fafafa;
}

::placeholder{
  opacity: 0.5!important;
  font-size: 15px !important;
}

.form-controls-pbi{
  max-width: 300px;
}

.text-login-muted{
  opacity: 0.5;
  font-size: 15px;;
}

.text-forgot-psw{
  padding-right: 5px;
  width: 100%;
}

.btn-access{
  border-radius: 20px;
}

.term-conds span {
  text-align: center;
  width: 100%;
}

.border-term-conds{
  border-top: 5px #b4b9c1 solid;
  opacity: 0.5;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
  margin-bottom: 20px;
}

.card-login-header{
  display: flex;
    align-items: center;
    margin-top: 0px;
    background: #f8f9fa!important;
    padding: 10px 20px 10px 20px !important;
    border-radius: 0px !important;
}



@media (max-width: 820px) {
  .col-left {
    height: auto !important;
    display: flex;
    align-content: center;
    flex-direction: column;
    justify-content: center;
    flex-wrap: wrap;
  }
  
  .col-right {
    justify-content: center;
    padding-bottom: 100px;
    max-width: 500px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-content: center;
    flex-wrap: wrap;
}

.tl-login {
  font-size: 40px;
  line-height: 1.1;
  font-weight: bold;
  color: aliceblue;
  text-shadow: 1px 1px 5px grey;
  margin-bottom: 5px;
}

.tl-login-sub {
  font-size: 25px;
  line-height: 1.1;
  text-shadow: 1px 1px 5px grey;
  text-align: center;
}
}

@media (max-width: 420px) {
  .col-left {
    height: auto !important;
    display: flex;
    align-content: center;
    flex-direction: column;
    justify-content: center;
    flex-wrap: wrap;
}
  
  .col-right {
    padding-bottom: 0px;
    max-width: 500px;
    height: auto !important;
    display: block;
    margin-top: 100px;
    margin-bottom: 50px;
}

.container, .row {
  height: auto;
  display: flex;
  flex-direction: column-reverse;
}

.tl-login-sub {
  font-size: 25px;
  line-height: 1.1;
  color: #fafafa;
  text-shadow: 1px 1px 5px grey;
  text-align: center;
}

.tl-login {
  text-align: center;
  font-size: 40px;
  line-height: 1.1;
  font-weight: bold;
  color: aliceblue;
  text-shadow: 1px 1px 5px grey;
  margin-bottom: 5px;
}
}