@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500&display=swap');


    body {
    
      font-family:'Open Sans', sans-serif;
    
      box-sizing: border-box;
      color: #000;
  overflow-x: hidden;
  height: 100%;
  
  background-repeat: no-repeat
      
      }
    
      .envelope img{
        width:300px
      }

      @media screen and (max-width: 600px)
{
  .envelope img{
    width:210px
  }
  #logos {
  width:40%;
  height:50%;
  margin:0 28%;

    
  }
  
  .navbar-custom{
    text-align: center;
   margin-top:0%;

  }
  
}
@media screen and (max-width: 900px)
{
  #logos {
  width:40%;
  height:50%;
  margin:0 28%;

    
  }
  
  .navbar-custom{
    text-align: center;
   margin-top:0%;

  }
  
}
.text-uppercase
{
  color:#1D3461;
  text-align: center;
  margin:10px;
}
.form-group label
{
  color:black;
  float:left;
  
}
.dropdown-menu :hover {
  background-color: #A5020C;

}
.dropdown-menu a{
  font-size: 11pt;
  font-weight: 300;
}

.navbar-custom span {
  color: black;
  font-size: 1em;
  font-weight: 400;
}
.navbar-custom
{
  background-color: rgba(204, 204, 204, 0.555);
}
.dropdown-menu a {
  font-size: 11pt;
  font-weight: 300;
}
.dropdown-menu a:hover {
  color:white;
}
.dropdown-menu {
  float: left;
  min-width: 7.5rem !important;
  padding: 0.5rem 0;
  margin: 0.150rem 0 4rem;
  border-bottom: 1px solid transparent !important;
}
.socialmedia  .fab
{
color:#A5020C;
font-weight: 400;
}
/* .nav-item  {
  color:#A5020C;
} */
 .walk-help-clinic  i
{
  color:#A5020C;
}
.text-span 
{
  color:#A5020C;
  font-size: 1em;
  font-weight: 400;
   font-style: normal;  

}
.content {
  padding: 7rem 0; }


.half, .half .container > .row {
  height: 100vh;
  min-height: 700px; }

.half .contents {
  background: #f6f7fc; }

.half .bg {
  width: 25%; }
  @media (max-width: 767.98px) {
    html{
      width:100vw;
      overflow-x:hidden;
    }
    .half .bg {
      width: 100%;
      height: 200px; } }

.half .contents {
  width: 50%; 
}
  @media (max-width: 767.98px) {
    html{
      width:100vw;
      overflow-x:hidden;
    }
    .half .contents {
      width: 100%; } }

.half .contents .form-control, .half .bg .form-control {
  border: none;
  border-radius: 4px;
  height: 54px;
  background: #efefef; }
  .half .contents .form-control:active, .half .contents .form-control:focus, .half .bg .form-control:active, .half .bg .form-control:focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none; }

.half .bg {
  background-size: cover;
  background-position: center; }

.half a {
  color: #888;
  text-decoration: underline; }

.half .btn {
  padding-left: 30px;
  padding-right: 30px; }

.half .forgot-pass {
  position: relative;
  top: 2px;
  font-size: 14px; }

.form-block {
  background: #fff;
  padding: 40px;
  
  -webkit-box-shadow: 0 15px 30px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 15px 30px 0 rgba(0, 0, 0, 0.2); }
  @media (max-width: 767.98px) {
    html{
      width:100vw;
      overflow-x:hidden;
    }
    .form-block {
      padding: 25px; } }

.control {
  display: block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 15px;
  cursor: pointer;
  font-size: 14px; }
  .control .caption {
    position: relative;
    top: .2rem;
    color: #888; }

.control input {
  position: absolute;
  z-index: -1;
  opacity: 0; }
  
.form-control.success input {
	border-color: #2ecc71;
}

.form.error input {
	border-color: #e74c3c;
}

.form i {
	visibility: hidden;
	position: absolute;
	top: 40px;
	right: 10px;
}

.form.success i.fa-check-circle {
	color: #2ecc71;
	visibility: visible;
}

.form.error i.fa-exclamation-circle {
	color: #e74c3c;
	visibility: visible;
}

.form small {
	color: #e74c3c;
	position: absolute;
	bottom: 0;
	left: 0;
	visibility: hidden;
}

.form-control input:focus {
	outline: 0;
	border-color: #777;
}

.form-control.success input {
	border-color: #2ecc71;
}

.form-control.error input {
	border-color: #e74c3c;
}

.form-control i {
	visibility: hidden;
	position: absolute;
	top: 40px;
	right: 10px;
}

.card0 {
    box-shadow: 0px 4px 8px 0px #d3d3d3;
    border-radius: 0px
}
.card0 .card2 h3
{
    color:#A5020C;
}
.container-fluid
{
    width:75%;
}
.card2 {
    margin: 0px 40px
}

.image {
    width: 100%;
    height: 100%;
    padding:0px;
    margin: 0px;
}
.images img {
 
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0px;
}




.line {
    height: 1px;
    width: 37%;
    background-color: #E0E0E0;
    margin-top: 13px;
    
}



.text-sm {
    font-size: 14px !important
}

::placeholder {
    color: #BDBDBD;
    opacity: 1;
    font-weight: 300
}

:-ms-input-placeholder {
    color: #BDBDBD;
    font-weight: 300
}

::-ms-input-placeholder {
    color: #BDBDBD;
    font-weight: 300
}

input,
textarea {
    padding: 10px 12px 10px 12px;
    border: 1px solid lightgrey;
    border-radius: 12px;
    margin-bottom: 5px;
    margin-top: 2px;
    width: 100%;
    box-sizing: border-box;
    color: #2C3E50;
    font-size: 14px;
    letter-spacing: 1px
}

input:focus,
textarea:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 1px solid #304FFE;
    outline-width: 0
}

button:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    outline-width: 0
}

a {
    color: inherit;
    cursor: pointer
}

.btn-blue {
    background-color: #1A237E;
    width: 150px;
    color: #fff;
    border-radius: 2px
}

.btn-blue:hover {
    background-color: #000;
    cursor: pointer
}

.bg-blue {
    color: #fff;
    background-color: #1A237E
}

@media screen and (max-width: 991px) {
  html{
    width:100vw;
    overflow-x:hidden;
  }

    .image {
        width: 300px;
        /* height: 220px */
    }

    .border-line {
        border-right: none
    }

    .card2 {
        border-top: 1px solid #EEEEEE !important;
        margin: 0px 15px
    }
}

.form-control.success i.fa-check-circle {
	color: #2ecc71;
	visibility: visible;
}

.form-control.error i.fa-exclamation-circle {
	color: #e74c3c;
	visibility: visible;
}

.form-control small {
	color: #e74c3c;
	position: absolute;
	bottom: 0;
	left: 0;
	visibility: hidden;
}


.form-control.error small {
	visibility: visible;
}
      button 
      {

          align-items: center;
      }
      .login-button{
          color:white;
        background-color:#A5020C !important;
        border:none;
      }
      @keyframes pulsate{
        0%{
          box-shadow:0 0 25px #ea4335, 0 0 50px #A5020C;
        }
      }
      .login-button:hover{
        animation:pulsate 1s ease-in-out;
    }
      .verification-button
      {
        color:white;
        background-color: #A5020C;
        border: 1px solid #a5020d00 !important;
        /* width:30%; */
        box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
        
      }
      .verification-button:hover
      {
        color:#A5020C;
        background-color: white;
        border: 1px solid #A5020C !important;
        /* width:30%; */
        
      }
      .btn:focus
      {
          outline:0 !important;
      }
      .left-section
      {
        padding: 15px;
        background:#1D3461;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
        background-image: url("back.png");
        border-radius: 0px;
        margin: auto;
        width:30%;
       
       
        padding: 10px;
      }
      .signup-img {
        background-color: #1D3461;
        
        height:100%;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    }
   
      .form-left {
        background: #1D3461;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        padding: 20px 40px;
        position: relative;
        width: 40%;
        color: #fff;
    }
    #logo {
        position: absolute;
        top: 0px;
        width:100px; 
        height:100px;
        left:0;
        margin-left:0;
      }
      

.main-section{
  padding: 15px;
  background:#ffffffa9;
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
  border-radius: 0px;
  margin: auto;
  width: 60%;
 
  padding: 10px;

}
.btn:active
{
    outline:0;
}
.custom-file-control::after {
content: "Choose file...";
}
.custom-file-control::before {
content: "Browse";
}
.text-inverse
{
    color:black;
    text-align: left!important;
}

.text-center
{ 
  
  color: #A5020C;
  padding: 5px;
  text-align: center;
  font-size: 400;
}
.form-left {
	background: #1D3461;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	padding: 20px 40px;
	position: relative;
	width: 40%;
	color: #fff;
}
@media screen and (max-width: 991px) {
  html{
    width:100vw;
    overflow-x:hidden;
  }
	.form-v4-content {
		margin: 180px 20px;
		flex-direction:  column;
		-o-flex-direction:  column;
		-ms-flex-direction:  column;
		-moz-flex-direction:  column;
		-webkit-flex-direction:  column;
	}
	.form-v4-content .form-left {
		width: auto;
		border-top-right-radius: 10px;
		border-bottom-left-radius: 0;
	}
	.form-v4-content .form-detail {
		padding: 30px 20px 30px 20px;
	    width: auto;
	}
}
.dropdown-menu a{
  font-size: 11pt;
  font-weight: 300;
}
.scrollable-menu {
  height: auto;
  max-height: 200px;
  overflow-x: hidden;
  max-width: 320px;
  margin: auto;
}

.dropdown-menu a:hover
{
 
 color: white;
 background-color: #A5020C;
 
}
@media (max-width:300px) {

  .image {
    width: 15rem;
    height: 25rem;
    padding:0.3rem 0.3rem 0.2rem 1rem;
}
}

@media (max-width:420px) {
  html{
    width:100vw;
    overflow-x:hidden;
  }
  .image {
    width: 15rem;
    height: 25rem;
    padding:0.3rem 0.3rem 0.2rem 1rem;
}

  .img-illustration img
  {
    height:10rem;
    
     margin-top: -10%;
     margin-right: 1rem;
  }
  


.images img {
    width: 80%;
    height: 70%;
    padding: 0rem 0rem 0.2rem 0rem;
    margin: 0px;
}
     
.line {
  height: 1px;
  width: 33%;

  
}


	.form-v4-content .form-detail .form-group {
		flex-direction: column;
		-o-flex-direction:  column;
		-ms-flex-direction:  column;
		-moz-flex-direction:  column;
		-webkit-flex-direction:  column;
		margin: 0;
	}
 

  
	.form-v4-content .form-detail .form-group .form-row.form-row-1 {
		width: 100%;
		padding:  0;
	}
  #logo {
    position: absolute;
    top: 0px;
    width:100px; 
    height:100px;
    left:50%;
  }
}
.animated {
  
  background-repeat: no-repeat;
  margin-bottom:60px;
  animation-duration: 6s; 
 margin-top: 2rem;
  animation-fill-mode: both; 
}

@-webkit-keyframes bounceInLeft {
  0% {
     opacity: 0;
     -webkit-transform: translateX(-1000px);
  }
  60% {
     opacity: 1;
     -webkit-transform: translateX(0px);
  }
  80% {
     -webkit-transform: translateX(-10px);
  }
  100% {
     -webkit-transform: translateX(0);
  }
}
@keyframes bounceInLeft {
  0% {
     opacity: 0;
     transform: translateX(-2000px);
  }
  60% {
     opacity: 1;
     transform: translateX(30px);
  }
  80% {
     transform: translateX(-10px);
  }
  100% {
     transform: translateX(0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
  0% {
     opacity: 0;
     -webkit-transform: translateX(2000px);
  }
  60% {
     opacity: 1;
     -webkit-transform: translateX(-30px);
  }
  80% {
     -webkit-transform: translateX(10px);
  }
  100% {
     -webkit-transform: translateX(0);
  }
}

@keyframes bounceInRight {
  0% {
     opacity: 0;
     transform: translateX(2000px);
  }
  60% {
     opacity: 1;
     transform: translateX(-30px);
  }
  80% {
     transform: translateX(10px);
  }
  100% {
     transform: translateX(0);
  }
}



.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

.subinput
{
    color:black;
}
.info
{
    color:black;
}
.radio-label
{
    color:black;
}

.text-wrap{
  white-space:normal;
}

  .img-illustration img
  {
    height:31rem;
    width:350px;
     margin-top: -10%;
     padding-left:20px;
  }

.control__indicator {
  position: absolute;
  top: 2px;
  left: 0;
  height: 20px;
  width: 20px;
  background: #e6e6e6;
  border-radius: 4px; }

.control--radio .control__indicator {
  border-radius: 50%; }

.control:hover input ~ .control__indicator,
.control input:focus ~ .control__indicator {
  background: #ccc; }

.control input:checked ~ .control__indicator {
  background: #1D3461; }

.control:hover input:not([disabled]):checked ~ .control__indicator,
.control input:checked:focus ~ .control__indicator {
  background: #1D3461; }

.control input:disabled ~ .control__indicator {
  background: #e6e6e6;
  opacity: 0.9;
  pointer-events: none; }

.control__indicator:after {

  content: '\e5ca';
  position: absolute;
  display: none;
  font-size: 16px;
  -webkit-transition: .3s all ease;
  -o-transition: .3s all ease;
  transition: .3s all ease; }

.control input:checked ~ .control__indicator:after {
  display: block;
  color: #fff; }

.control--checkbox .control__indicator:after {
  top: 50%;
  left: 50%;
  margin-top: -1px;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

.control--checkbox input:disabled ~ .control__indicator:after {
  border-color: #7b7b7b; }

.control--checkbox input:disabled:checked ~ .control__indicator {
  background-color: #7e0cf5;
  opacity: .2; }

.btn {
  text-decoration: none !important; }
  .btn.btn-facebook {
    display: block;
    background: #3b5998;
    color: #fff; }
  .btn.btn-google {
    background: #ea4335;
    color: #fff; }