/* CSS Document for Cheryl Collins, MD and JH Family Psychiatry */

@import url('https://fonts.googleapis.com/css?family=Sree+Krushnadevaraya');
@import url("https://use.typekit.net/uky1amg.css");
		
		html, body{
			height:100%;
			font-family:'quiet-sans', serif;
		}
		
		h1{
			font-family: 'Sree Krushnadevaraya', serif;
			font-size:52px;
			color:#584f75;
			letter-spacing: 2px;
		}
		h2 {
			font-family: 'Sree Krushnadevaraya', serif;
			font-size:30px;
			color:#615c7d;
			letter-spacing: 2px;
		}
		h3{
			font-family: 'Sree Krushnadevaraya', serif;
			font-size:32px;
			color:#615c7d ;
			letter-spacing: 2px;
		}
		h4 {
			font-family: 'Sree Krushnadevaraya', serif;
			color:#615c7d;
		}
		p {
			font-family: 'quiet-sans', sans-serif;
			font-style: normal;
			font-weight: 300;
			font-size:18px;
			color:#000;
		}
		strong {
			color: #584f75;
		}
		blockquote {
			background-color:#d6d6d6 ;
			color:#584f75 ;	
			font-family:'Quiet Sans Light', serif;
			font-size:22px ;
		}
		#masthead{
			background-color:#fff;
			padding: 25px 0px;
		}
		.main-navigation ul {	
			margin:25px;
			display:none;
			padding-left:0px;
			text-align:center;
			float:left;
		}
		.main-navigation li {
			list-style:none;
			font-family: 'Sree Krushnadevaraya', serif;
			font-size:20px;
			letter-spacing:2px;
			position:relative;
			padding-right:35px;
			padding-left:15px;
			border-left:1px solid #fff;
		}
		.main-navigation a {
			color:#706992;
		}
		.main-navigation a:hover {
			text-decoration:none ;
			color:#706992;
		}
		.menu-toggle {
			margin:0 auto;
		}
		.menu-toggle, .main-navigation.toggled ul {
			display:block ;
		}
		
		.logo {
			width: auto;
			height:100px;
		}
		button {
			border: 1px solid #615c7d;
    		text-transform: lowercase;
			font-family: 'Sree Krushnadevaraya', serif;
			color:#615c7d;
			padding: 0px 10px 10px 10px ;
			background-color: #fff;
			display:inline-block;
			font-size:24px;
			letter-spacing: 1px;
			margin:0 auto;
		}
		button:focus {
			outline:none ;
		}
		button:hover{
			background-color:rgba(97,92,125,.7);
			color:#fff;
		}
		.content {
 		   background-image: url('images/hernandez-main-edit.jpg');
	       min-height:704px;
		   width:auto;
		   background-size:cover;
		   background-position:bottom;
		   list-style:none;
		   display:flex;
		   align-items:center;
		   position:relative;
		   font-family: quiet-sans, sans-serif;
		   font-style: normal;
		   font-weight: 300;
		}
		.content-container {
			width:75%;
			margin:0 auto;
			max-width:1100px;font-family: quiet-sans, sans-serif;
		   font-style: normal;
		   font-weight: 300;
			overflow-wrap:normal;
			min-width: 300px;
		}
		.transparent-box {
			border:1px solid #706992;
			background-color:rgba(255,255,255,.83);
			margin: 0 auto;
			padding: 50px 65px;
			margin-bottom: 5%;
    		margin-top: 5%;
		}
		ul {
			list-style:none;
			position:relative;
			padding:0px;
   			list-style-position: outside;
		}
		.transparent-box li{
			margin-left: 1em;
			text-indent: -1em;
		}
		.transparent-box ul>li:before {
			font-size:16px;
			padding-right:5px;
			content:'\002B';
			color:#584f75;
			width:15px;
		}
		.image-aside{
			margin: 30px 0px;
			max-height:505px;
			width:auto;
		}
		#colophon {
			background-color:rgba(97,92,125,.7) ;
			color:#fff ;
			font-family: 'Sree Krushnadevaraya', serif ;
			text-align:center ;
			padding:10px ;
			letter-spacing:1px ;
			position:relative ;
			text-transform:uppercase;
		}
		#colophon p {
			color:#fff ;
		}
		.copyright, .copyright a{
			color:#fff
		}
		.copyright a:hover{
			color:#584f75;
			text-decoration:none;
			font-family: quiet-sans, sans-serif;
font-style: normal;
font-weight: 300;
		}
		.small {
			font-size: 65% ;
			color:#fff;
			font-family: quiet-sans, sans-serif;
font-style: normal;
font-weight: 300;
		}
		.large {
			font-size: 125% ;
			letter-spacing: 1px;
			font-family: 'Sree Krushnadevaraya', serif ;
		}
		img {
			max-width:100%;
			height:auto;
		}
		@media screen and (min-width:715px) {
			.logo {
				float:right;
			}
			.menu-toggle{
				display:none ;
			}
			.main-navigation ul{
				display:block;
			}
			.main-navigation li {
				display:inline;
			}
			.main-navigation li:hover, .main-navigation li:active {
				border-left:1px solid #584f75;
			}
		}
		@media screen and (max-width:714px) {
			h1{
				font-size:45px;
			}
			h2{
				font-size:26px;
			}
			h3{
				font-size:20px;
			}
			.main-navigation{
				background-color:#fff
			}
			.menu-container {
				margin: 15px;
			}
			.main-navigation ul {
				padding-left:0px;
				margin:0px;
				float:none;
			}
			.main-navigation li {
				text-align:center;
				padding-right:0px ;
				padding-left:0px ;
			}
			.image-aside{
				margin: 0px;
			}
			.main-navigation li{
				padding-right:0;
				text-align: center;
			}
		}
		 @media screen and (max-width:1092px) {
			 .logo {
				 float:none;
				 text-align:center;
				 height:100px;
			 }
			 .main-navigation ul {
				text-align:center;
				float:none;
			}
		}
		 @media screen and (min-width:589px) and (max-width:926px) {
			.main-navigation li {
				font-size:18px;
			}
		}
		@media screen and (max-width:1319px) {
			.header-logo {
				padding:0px;
				text-align:center;
			}
		}
		@media screen and (max-width:320px){
			h1, .h1{
				font-size:2rem;
			}
		}