/* brand color : #29B6F6 */

body{
  color: #333 !important;
}

a{
  color: #333 !important;
}

.brand-logo span.w1{
  color: orange;
}

.brand-logo span.w2{
  color: green;
}

nav{
  background-color: #29B6F6;
}

nav ul.dropdown-content{
  margin-top: 55px;
}

nav ul.dropdown-content li:hover{
  background-color: #29B6F6;
}

.brand-logo{
  margin-left: 1%;
}

.hero{
  height: 90vh;
  background-image: url("/public/logo.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  display: flex;
  justify-content: center;
  align-items: center;
}

header div.hlcontainer{
  display: flex;
  justify-content: center;
}

.headerlogo{
  width: 45%;
  height: 45%;
}

.habout{
  height: 40vh;
  background-color: #29B6F6;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hforsec0{
  height: 60vh;
  display: flex;
  margin-bottom: 0;
}

.hforsec1{
  height: 60vh;
  display: flex;
  background-color: #29B6F6;
  margin-bottom: 0;
}

section.hforsec0 div.container{
  display: flex;
  justify-content: center;
  align-items: center;
}

section.hforsec1 div.container{
  display: flex;
  justify-content: center;
  align-items: center;
}

.forimg0{
  width: 60%;
}

.forimg1{
  width: 60%;
  float: right;
}

.btn{
  background-color: #29B6F6;
}

.btn:hover{
  background-color: white;
  color: #29B6F6;
}

.btn:active{
  background-color: #29B6F6;
}

.btn:focus{
  background-color: #29B6F6;
  color: white;
}


.hforbtn{
  float: right;
}

.hforbtn1{
  float: left;
}

/* terms & conditions section */

.tasec{
  display: flex;
  justify-content: center;
}

section.tasec div.tacontainer{
  display: flex;
  justify-content: center;
  flex-direction: column;
}

/* privacy section */

.privacysec{
  display: flex;
  justify-content: center;
}

section.privacysec div.privacycontainer{
  display: flex;
  justify-content: center;
  flex-direction: column;
}

/* legal section */

.legalsec{
  display: flex;
  justify-content: center;
}

section.legalsec div.legalcontainer{
  display: flex;
  justify-content: center;
  flex-direction: column;
}

/* contact */

div.card-action{
  background-color: #29B6F6 !important;
}

div.card-panel{
  display: flex;
  justify-content: center;
}

/* placeholder style */
.phheader{
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  height: 60vh;
}

/* fordocpage */

.fordochero{
  height: 60vh;
  background-image: url('/public/doctor.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}

section.fordochero div.fdhcontainer{
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-top: 10%;
}

section.fordochero div.fdhcontainer h2.fdh2{
  background-color: #faebd7;
}

.rpdemosec{
  height: 40vh;
  display: flex;
}

section.rpdemosec div.rpdemocontainer{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

section.rpdemosecblue{
  background-color: #29B6F6;
  margin-bottom: 0;
}


.feature0{
  height: 60vh;
  background-color: #29B6F6;
  display: flex;
  justify-content: center;
}

.feature0 img{
  width: 60%;
}

section.feature0 div.fcontainer{
  display: flex;
  justify-content: center;
  align-items: center;
}

section.feature0 div.fcontainer div.fpara{
  display: flex;
  align-items: center;
  flex-direction: column;
}

.feature1{
  height: 60vh;
  background-color: white;
  display: flex;
  justify-content: center;
}

.feature1 img{
  width: 60%;
}

section.feature1 div.fcontainer{
  display: flex;
  justify-content: center;
  align-items: center;
}

section.feature1 div.fcontainer div.fpara{
  display: flex;
  align-items: center;
  flex-direction: column;
}

/* for patient */
.forpatienthero{
  height: 60vh;
  background-image: url('/public/patient.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}

section.forpatienthero div.fdhcontainer h2.fph2{
  background-color: #faebd7;
}

/* for labs */
.forlabshero{
  height: 60vh;
  background-image: url('/public/labs.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}

section.forlabshero div.fdhcontainer h2.flh2{
  background-color: #faebd7;
}

/* for ngos */
.forngoshero{
  height: 60vh;
  background-image: url('/public/medical-camp.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}

section.forngoshero div.fdhcontainer h2.fnh2{
  background-color: #faebd7;
}


/* for education */
.foreduhero{
  height: 60vh;
  background-image: url('/public/education.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}

section.foreduhero div.fdhcontainer h2.feh2{
  background-color: #faebd7;
}

/* for goverment */
.forgovhero{
  height: 60vh;
  background-image: url('/public/government.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
}

section.forgovhero div.fdhcontainer h2.fgh2{
  background-color: #faebd7;
}


/* footer */
.page-footer{
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #29B6F6;
}

.page-footer div a{
  text-decoration: none;
  color: #333;
}

footer.pfwhite{
  background-color: white;
}

/* side nav */
.side-nav li:hover{
  background-color: #29B6F6;
}


/* Responsive */

@media only screen and (max-width: 1070px) {
  .habout{
    height: 60vh;
  }
}

@media only screen and (max-width: 1100px){
  nav ul#nav-mobile li a{
    font-size: 13px;
  }
}

/* mobilestyle homepage */
@media only screen and (max-width: 600px){

  section.habout div.container h4{
    font-size: 2rem;
  }


  section.hforsec0 div.container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  section.hforsec1 div.container{
    display: flex;
    flex-direction: column-reverse;;
    justify-content: center;
    align-items: center;
  }


  .himg img.forimg1{
    float: none !important;
  }

  .hbtn a{
    width: 100%;
  }
}

@media only screen and (max-width: 600px){
  section.habout div.container h4{
    font-size: 1.5rem;
  }
}