/*
Theme Name: SEHA
Theme URI: http://underscores.me/
Author: Lanetwelve
Author URI: https://www.lanetwelve.com/
Description: Quality primary health care for the neediest | Seha Welfare Organization
*/

/*@font-face {
  font-family: 'MazdaType-Regular';
  src: url('../fonts/StratumGMC-Medium.eot');
  src: url('../fonts/StratumGMC-Medium.eot?#iefix') format('embedded-opentype'),
  url('../fonts/StratumGMC-Medium.svg#StratumGMC-Medium') format('svg'),
  url('../fonts/StratumGMC-Medium.ttf') format('truetype'),
  url('../fonts/StratumGMC-Medium.woff') format('woff'),
  url('../fonts/StratumGMC-Medium.woff2') format('woff2');
  }*/
  html{scroll-behavior: smooth;}
  *{padding: 0; margin: 0; box-sizing: border-box;}
  body{width: 100%; display: flex; flex-direction: column; margin-bottom: 0 !important; }
  h1,h2,h3,h4,h5,h6{font-family: 'PT Sans', sans-serif; font-weight: bold;}
  a{text-decoration: none; font-family: 'PT Sans', sans-serif; outline: none;}
  p{color: #000000; /*font-size: 20px; */ line-height: 1.5; margin: 10px 0; font-family: 'Abel', sans-serif;}
  img{width: 100%;}
  .main-navigation a{color: #1488ca; font-family: 'Abel', sans-serif; outline: none;}
  .main-navigation a:hover{color: #000000; font-family: 'Abel', sans-serif; outline: none;}
  .hamburger{width: 35px;}
  .container{max-width: 1170px; width: 100%; margin: 0 auto;}
  .header-area{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; width: 95%; margin: 0 auto;}
  .logo{}
  .logo img{max-width: 200px; width: 100%;}
  .menu-area{}
  .menu-area ul{list-style: none; padding: 0; display: flex; flex-wrap: wrap; justify-content: space-around; font-family: 'Abel', sans-serif;}
  .menu-area ul li{padding: 10px 20px; text-align: center;}
  .menu-area ul li:nth-last-child(1){border: 2px solid #d12d2b;}
  .menu-area ul li:nth-last-child(1) a{color: #cb2928;}

  .home-banner{width: 100%;}
  .home-banner img{width: 100%;}

  #about{display: flex; flex-direction: column; text-align: center;}
  .section-heading{margin: 15px 0; font-size: 46px; line-height: 48px; font-weight: 400; letter-spacing: 0px; font-family: 'PT Sans', sans-serif; font-weight: bold; color: #d02d2b; text-transform: uppercase;}
  .read-more{width: 150px; background: #1a8ac9; color: #fff !important; padding: 10px; font-size: 20px; margin: 15px auto; transition: 1s;}
  .read-more:hover{background: #d02d2b;}

  #services{display: flex; flex-direction: column; text-align: center;}
  .service-container{display: flex; flex-wrap: wrap;}
  .service-box{flex-basis: 46%; margin: 2%;}
  .service-img{display: flex; flex-direction: column; position: relative;}
  .middle-img img{width: 50px;}
  .middle{transition: .5s ease; opacity: 0; position: absolute; background: rgba(210, 47, 45, 0.8); width: 100%; height: 100%;}
  .middle-img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
  .middle-img img{width: 50px;}
  .service-img:hover .service-img {opacity: 0.3;}
  .service-img:hover .middle{opacity: 1;}
  .service-title{margin: 15px 0; text-transform: uppercase;}

  #team{display: flex; flex-direction: column; text-align: center;}
  .team-container{display: flex; flex-wrap: wrap;}
  .team-box{flex-basis: 18%; margin: 1%;}
  .team-img{display: flex; flex-direction: column; position: relative;}
  .team-title{margin: 15px 0;}
  .team-desc{padding: 0 5px;}
  .team-desc p{color: #fff;}
  .team-img:hover .team-img {opacity: 0.3;}
  .team-img:hover .middle{opacity: 1;}
  .hamburger{display: none;}

  #gallery{display: flex; flex-direction: column; text-align: center;}

  #testimonial{display: flex; flex-direction: column; text-align: center;}

  .address-container{display: flex; flex-wrap: wrap; text-align: center;}
  .area-box{flex-basis: 46%; margin: 2%;}

  footer{background-color: #282828; padding-top: 30px;}
  .inner-box{margin-bottom: 30px;}

  .area-name{padding: 13px 0 13px 0; background: url(../images/marker.png) no-repeat; background-position: left center; width: 40%; margin: 0 auto; background-size: 20px; color: #fff;}
  .area-text p{color: #fff;}
  .email{text-align: center;}
  .email a{padding: 13px 0 13px 30px; background: url(../images/envelope.png) no-repeat; background-position: left center; margin: 0 auto; background-size: 20px; color: #fff; font-size: 20px; font-weight: bold;}

  #wpcf7-f75-o1{display: flex;}
  #wpcf7-f75-o1 form{width: 100%;}
  .your-name{width: 48%; margin: 1% 1%; float: left;}
  .your-email{width: 48%; margin: 1% 1%; float: left;}
  .your-subject{width: 98%; margin: 1% 1%; float: left;}
  .your-message{width: 98%; margin: 1% 1%; float: left;}
  .wpcf7-submit{width: 98%; margin: 1% 1%; background-color: #d22f2d !important; color: #ffffff !important; padding: 11px 20px !important; font-size: 25px !important; font-family: 'PT Sans', sans-serif; font-weight: bold; cursor:pointer;}

  input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea{width: 100%; color: #d22f2d; background-color: rgba(46, 46, 46, 1); border-color: #585858; font-family: 'Abel', sans-serif !important;}

  .site-info{text-align: center; padding: 20px 0; border-top: 1px solid rgba(255,255,255,.1); color: #9b9b9b; font-family: 'Abel', sans-serif !important;}
  .site-list{margin-left: 0;}    
  .site-list li{background: url(../images/bullet.png)no-repeat top 7px left; padding: 0px 18px; color: #000; list-style: none;}

  .success{color: red;}

  .wpcf7 form.sent .wpcf7-response-output {text-align: center; color: #fff;}
  div#n2-ss-2 .n2-font-78018f996fcd365fe3fd602f15258194-paragraph{font-family: 'Abel', sans-serif !important;}
  div#n2-ss-2 .n2-font-31c34e4ae0bac08b1edd5e4248201530-hover{font-family: 'PT Sans', sans-serif; font-weight: bold;}

@media only screen and (max-width: 600px) {
 .container{width: 95%;}
 .service-box {flex-basis: 100%; margin: 2% 0;}
 .team-box {flex-basis: 100%; margin: 2%;}
 .menu-area {width: 100%;}
 .menu-area ul{flex-direction: column;}
 .area-box{flex-basis: 100%; margin: 2% 0;}
 .area-name{width: 65%;}
 .your-name{width: 98%;}
 .your-email{width: 98%;}
}

@media only screen and (max-width: 768px) {
 .menu-area {width: 100%; }
 .menu-area ul{flex-direction: column;}	
}

@media only screen and (max-width: 1024px) {
 .menu-area {width: 100%; display: none; background: #000; padding: 10px;}
 .menu-area ul{flex-direction: column;}
 .menu-area ul li{width: fit-content;  text-align: left;}	
 .menu-area ul li a{color: #fff;}
 .hamburger{display: block;}	
}


@media only screen and (min-width: 768px) {
 .container{max-width: 750px; width: 100%;}	
}

@media only screen and (min-width: 992px) {
 .container{max-width: 970px; width: 100%;}
}

@media only screen and (min-width: 1200px) {
 .container{max-width: 1170px; width: 100%;}
}