body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
}
.container-92{padding:0 4vw}
.container-96{padding:0 2vw}

.header{font-size:40px;text-align:center;margin:25px 0px;color: #F08080}

.left{float:left;}

.clearfix:after {
  content:"";
  display:block;
  clear:both;
 }

.button {
  background-color: #7297A0;
  border: none;
  color: white !important;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}



.topnav {
  overflow: hidden;
  //background-color: #F08080;
  background-color: #FFF;
  height:100px;
  position:fixed;
  left:0;
  top:0;
  width:100vw;
  border-bottom:2px solid #F5F5F5;
  z-index:500
}
#medianav-overlay{display:none;
	background: #00000080;;
	position:fixed;
	width:100vw;
	top:0;
	left:0;
	bottom:0;
	z-index:400;
	}
.medianav {
  overflow: hidden;
  //background-color: #F08080;
  background-color: #FFF;
  height:100px;
  position:fixed;
  left:0;
  top:0;
  width:100vw;
  border-bottom:2px solid #F5F5F5;
  z-index:500;
  display:none;
}


.topnav a, .medianav a {
  float: left;
  color: #F08080;
  text-align: center;
  Padding: 40px 25px;
  text-decoration: none;
  font-size: 30px;
  height:100px;
}


#nav-close{display:none}
 #media-nav-slide{
       position:fixed;
       top:101px;
       left:35vw;
       bottom:0;
       right:0;
       background:#fff;
       z-index:500;
       display:none;
       border-left:2px solid #f5f5f5;
   }

#media-nav-slide li{
	width:65vw;
  font-size: 20px;
  height:50px;
  list-style:none;
  padding-top:15px;
  border-bottom:2px solid #f5f5f5;
 

  z-index:500}
#media-nav-slide a{color: #F08080; text-decoration: none;padding-left:50px;}

.topnav a:hover {
 
  color: #7297A0;

}

.topnav a.active {
  background-color: #04AA6D;
  color: white;
 
}

.topnav-right, .medianav-right {
  float: right;
}



#banner{
height:calc(75 - 100px);
background-color: #F08080;
width:100vw;
margin-top: 100px;
}
.banner-image{
background-image: url("images/micha_hug_ashley.png");
height:calc(75vh - 100px);
width:100vw;
background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}


#callout{
background:white; margin-top:100px;margin-bottom:100px;
}

.callout{width:calc(88vw/3);margin:0vw 1vw}
.callout img{width:calc(88vw/3);margin:0vw 1vw}




#about{	margin:50px 0px;
	color:#7297A0;
	background:#fff;
	display: flex;
  position: relative;
	}
.about-1{width:35vw;
	background:url("images/micha_shiloh.png") no-repeat center center;
        background-size:contain
        }
.about-1 img{width:35vw;}
.about-2{width:51vw;margin:0vw 3vw;text-align:justify;}


#services{background-color:#F5F5F5; width:92vw;color:#7297A0;padding:100px 0px;margin-bottom:100px}
#services-1{width:37vw;padding:0px 4.5vw}
#services-1-title{color:#F08080 ;font-size:20px;padding-top:25px }
.services-1-big{margin-top:50px;font-size:50px; font-weight:bold;}
.services-1-small{font-size:30px;font-weight:normal;}
#services-btn{margin-top:25px;}

#services-list-container{height:100%;width:41vw;margin-right:0vw; background:white;border-radius:20px}

#services-list{padding:5vh 2.5vw;}
.services-list{background:#f5f5f5;margin-top:25px;height:100px;width:36vw;border-radius:20px}
.services-list-circle {height:calc(100px - 4vh);width:calc(100px - 4vh);margin:2vh }
.services-list-circle img{width:100%}
.services-list-text{padding-top:40px;font-size:20px;}

#benefits{margin-bottom:100px;}
.benefits{width: calc((92vw / 6) - 2vw);margin:0vw 1vw;color:#7297A0;text-align:center;}
.benefits-desc{margin-top:15px}
/* (A) PIE CHART */
.donut {
  /* (A1) CIRCLE */
  width: calc((92vw / 6) - 2vw); height:calc((92vw / 6) - 2vw);
  border-radius: 50%;
  
  /* (A2) SEGMENTS */
}
#donut-medicine{
  background: conic-gradient(
    #F08080 0deg 32.4deg,
    #F5F5F5 32.4deg 360deg
  );
}
#donut-vaginal{
  background: conic-gradient(
    #F08080 0deg 43.2deg,
    #F5F5F5 43.2deg 360deg
  );
}
#donut-nicu{
  background: conic-gradient(
    #F08080 0deg 50.4deg,
    #F5F5F5 50.4deg 360deg
  );
}
#donut-c-section{
  background: conic-gradient(
    #F08080 0deg 100.8deg,
    #F5F5F5 100.8deg 360deg
  );
}
#donut-pitocin{
  background: conic-gradient(
    #F08080 0deg 111.6deg,
    #F5F5F5 111.6deg 360deg
  );
}
#donut-experience{
  background: conic-gradient(
    #F08080 0deg 122.4deg,
    #F5F5F5 122.4deg 360deg
  );
}
/* (B) DONUT "CONVERSION" */
/* (B1) SMALLER CIRCLE */
.hole {
  width: calc((92vw / 9) - 2vw); height:calc((92vw / 9) - 2vw);
  border-radius: 50%;
  background: #fff;
}
 
/* (B2) "CONVERT PIE TO DONUT" - CENTER SMALLER CIRCLE */
.donut {
  display: flex;
  align-items: center;
  justify-content: center;
}
.donut-text{text-align:center;font-size:30px;padding-top:calc(50% - 15px);color:#7297A0;}



#contact{background: #7297A0;
padding:50px 25px;
margin-bottom:100px;}

input, textarea {
 
  padding: 20px 15px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #fff;
  background:none;
  box-sizing: border-box;
  font-size:15px;
  color: #fff;
}
.contact-form-text{width:calc((92vw / 2) - 35px)}
.contact-form-text-r{margin-left:20px !important}

.contact-form-textarea{width:100%}

::placeholder {
  color: white;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
 color: white;
}

::-ms-input-placeholder { /* Microsoft Edge */
 color: white;
}

#footer{float:left;width:100vw;background: #CD5C5C;padding:75px 0px;color:#fff;//margin-top:100px}
.footer-space{width:calc(70vw/4);padding:0px 3vw;}
.sm-banner{height:3vw;width:calc(70vw/4);border:2px solid white;padding:10px}
.sm-img{width:3vw}
.sm-text{width:10vw;text-align:center;padding-top:1vw;color:white}

.contact-banner{height:3vw;width:calc(70vw/4);padding:10px}
.contact-img{padding-top:1vw;}
.contact-text{width:15vw;text-align:left;padding-top:1vw;padding-left:10px;color:white}

#footer a {
  //float: left;
  color: #fff;
  text-align: center;
  //Padding: 40px 25px;
  text-decoration: none;
  //font-size: 17px;
  //height:100px;
}

#footer li {
  list-style:none;
  padding:5px 0px;
}


/****************************** MEDIA QUERIES********************/


@media only screen and (max-width: 1075px) {
  .topnav {
    display:none;
  }
.medianav{display:block}
.services-1-big{font-size:43px;}
.services-1-small{font-size:27px;}

}

@media only screen and (max-width: 975px) {
 
.footer-media{width:92vw}

}

@media only screen and (max-width: 875px) {
  .topnav-right {
    display:none
  }
  #about{display:block;height:100%}
  .about-1{width:92vw;height:50vw;}
  .about-2{width:86vw;}
  
  #services-1{width:84vw;padding:0 4.5vw}
  #services-list-container{margin-top:50px;margin-left:4vw;margin-right:4vw;width:84vw;}
  .services-list{width:79vw}
  
}

@media only screen and (max-width: 750px) {

.benefits{width: calc((92vw / 3) - 2vw);margin-top:25px}

.donut {
  /* (A1) CIRCLE */
  width: calc((92vw / 3) - 2vw); height:calc((92vw / 3) - 2vw);
}

.hole {
  width: calc((92vw / 6) - 2vw); height:calc((92vw / 6) - 2vw)
}


}

@media only screen and (max-width: 650px) {

.callout{width:calc(90vw/1);margin:0vw 1vw}
.callout img{width:calc(90vw/1);margin:0vw 1vw}

.benefits{width: calc((92vw / 2) - 3vw);margin-top:25px}

.donut {
  /* (A1) CIRCLE */
  width: calc((92vw / 2) - 2vw); height:calc((92vw / 2) - 2vw);}

.hole {
  width: calc((92vw / 3) - 2vw); height:calc((92vw / 3) - 2vw)
}

.footer-space{width:92vw;}

.sm-img{width:5vw;}

.sm-banner{height:5vw;width:80vw}
.sm-text{width:65vw}

.contact-form-text{width:100% !important;}
.contact-form-text-r{margin-left:0px !important}

}








//for spacing


