@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;900&display=swap');

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* html element 62.5% font-size for REM use */
html {
	font-size:62.5%;
}

body {
	font-family:'Montserrat', sans-serif;
	color:#000;
	font-size:17px;
	line-height:1.5;
}

p {
	font-size:16px;
	line-height:1.8;
	margin:0 0 30px;
	float:left;
	clear:both;
}

a {
	text-decoration: none;
	color:#000;
}

a:hover {
	color:#58d7dd;
}

/* ---------- HEADER ----------- */

header {
	position:fixed;
	top:0;
	width:100%;
	height:auto;
	padding:25px 0 25px;
	background:#fff;
	z-index:1000;
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.1);
	box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.1);
}

#logo {
	
}

#logo:hover {
	color:#000;
}

h1 {
	float:left;
	font-size:26px;
	font-weight:900;
	line-height:1.4;
}

span.h1-light {
	font-weight:400;
	color:#58d7dd;
	display:block;
	font-size:.65em;
}

nav {
	float:right;
	clear:right;
	margin-top:15px;
}

nav a {
	font-size:16px;
	color:#000;
	margin-left:50px;
	font-weight:900;
	transition:.25s all linear;
}

nav a:hover {
	color:#58d7dd;
}

a#menu-btn {
	width:30px;
	height:16px;
	z-index:1001;
	position:absolute;
	right:4%;
	top:42px;
	display:none;
}

a#menu-btn:hover .burger-line {
	background:#58d7dd;
}

.burger-line {
	height:2px;
	background:#000;
	position:absolute;
	right:0;
	width:100%;
}

#burger-2 {
	top:50%;
	margin-top:-1px;
}

#burger-3 {
	bottom:0;
}

#phone {
	font-size:15px;
	letter-spacing: 1px;
	color:#58d7dd;
	float:right;
	font-weight:700;
	background:url(../img/phone-icon.svg) left top no-repeat;
	background-size:auto 200%;
	padding-left:25px;
}

#phone:hover {
	background-position:left bottom;
	color:#42b2b2;
}

#top-banner {
	width:100%;
	height:auto;
	overflow:hidden;
	background:url(../img/home-banner.jpg) center center no-repeat;
	background-size:cover;
	margin-top:112px;
	position:relative;
	padding:160px 0 200px;
}

#top-banner h2 {
	font-size:60px;
	line-height:1.1;
	padding:0;
	margin-bottom:12px;
}

#top-banner h2::after {
	display:none;
}

h2#seminars-header::after {
	content:"";
	position:absolute;
	width:130px;
	height:130px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	top:0;
	left:0;
	background:url(/img/seminars.jpg) center center no-repeat;
	background-size:cover;
	border:1px solid #000;
}

h2#seminars-header {
	padding:16px 0 16px 160px;
}

/*h2#seminars-header {
	margin-top:12px;
	padding-bottom:20px;
}

#seminars-image {
	width:130px;
	float:left;
	margin-right:30px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	}*/

#top-banner p {
	font-size:20px;
	line-height:1.6;
	margin-bottom:0;
}

#top-banner .btn {
	margin-top:40px;
}

.btn {
	padding:15px 30px 17px;
	color:#fff;
	font-weight:900;
	background:#58d7dd;
	float:left;
	clear:both;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	transition:.5s all linear;
}

.btn:hover {
	color:#fff;
	background:#000;
}

#swoop {
	position:absolute;
	width:100%;
	bottom:-1px;
	left:0;
}

/* ---------- PAGE CONTENT ----------- */

h2 {
	font-size:45px;
	line-height:1.2;
	font-weight:900;
	padding-bottom:40px;
	margin-bottom:40px;
	position:relative;
}

span.h2-sm {
	color:#58d7dd;
	font-weight:400;
	display:block;
	font-size:.6em;
	margin-top:10px;
}

h2::after {
	content:'';
	position:absolute;
	bottom:0;
	left:0;
	width:90px;
	height:4px;
	background:#58d7dd;
}

h3 {
	font-weight:900;
	font-size:20px;
	margin:60px 0 30px;
	float:left;
	clear:both;
}

.content-wrapper {
	width:92%;
	height:auto;
	overflow:hidden;
	max-width:1300px;
	margin:0 auto;
	position:relative;
}

.dr-image {
	position:absolute;
	left:0;
	width:35%;
	height:100%;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	background:url(../img/dr-randy-patch.jpg) top right no-repeat;
	background-size:cover;
}

.dr-text {
	width:60%;
	float:right;
}

section {
	float:left;
	width:100%;
	padding:130px 0;
	position:relative;
}

section.no-padding {
	padding:0;
}

section.grey-ground {
	background:#f8f8f8;
}

#sleep-apnea-graphic {
	width:60%;
	float:right;
}

.sleep-apnea-text {
	width:35%;
	float:left;
}

.silencer-image {
	position:absolute;
	width:50%;
	height:100%;
	background:url(../img/woman-sleeping.jpg) center center no-repeat;
	background-size:cover;
}

.silencer-text {
	width:50%;
	float:right;
	padding:130px 6%;
}

#hinge {
	width:85px;
	margin-bottom:25px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	border:1px solid #000;
	padding:10px;
}

.col-2 {
	width:46%;
	margin-right:8%;
	float:left;
}

.col-2:nth-child(2n+2){
	margin-right:0;
}

.col-3 {
	width:30%;
	margin-right:5%;
	float:left;
}

.col-3:nth-child(3n+3){
	margin-right:0;
}

#contact-info {
	padding-top:15px;
}

.text-col {
	padding:60px 0;
}

.col-2 img {
	-webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

.contact-block {
	margin-bottom:40px;
}

.contact-block h3 {
	font-weight:900;
	font-size:18px;
	margin-bottom:3px;
	margin-top:40px;
}

.contact-block p {
	line-height:1.5;
	margin:0;
}

.copyright {
	background:#000;
	width:100%;
	height:auto;
	padding:15px 0 17px;
	color:#999;
	font-size:11px;
	text-align:center;
	float:left;
}

.img-shadow {
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.1);
	box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.1);
	margin-left:5px;
}



@media only screen and (max-width:1200px) {
	nav {
		margin-top:10px;
	}

	nav a {
		font-size:14px;
		margin-left:25px;
	}

	#phone {
		font-size:13px;
	}

	h1 {
		font-size:23px;
	}

	header {
		padding:15px 0;
	}

	#top-banner {
		margin-top:84px;
		padding:100px 0 140px;
	}

	#top-banner h2 {
		font-size:50px;
	}

	#top-banner p {
		font-size:16px;
	}

	.btn {
		padding:12px 25px 14px;
	}

	section {
		padding:100px 0;
	}

	body,
	p {
		font-size:15px;
	}

	h2 {
		font-size:35px;
	}

	span.h2-sm {
		margin-top:5px;
	}

	.text-col {
		padding:20px 0;
	}

	.silencer-text {
		padding:90px 6% 50px;
	}

	.contact-block h3 {
		font-size:16px;
		margin-top:20px;
	}

	h2#seminars-header::after {
		width:100px;
		height:100px;
	}

	h2#seminars-header {
		padding:13px 0 13px 130px;
	}
}

@media only screen and (max-width:950px) {
	h1 {
		font-size:21px;
	}

	nav {
		margin-top:8px;
	}

	nav a {
		font-size:13px;
		margin-left:20px;
	}

	#top-banner {
		margin-top:78px;
	}
}

@media only screen and (max-width:850px) {
	a#menu-btn {
		display:block;
	}

	nav {
		display:none;
		width:100%;
		float:left;
		margin:0;
	}

	nav a {
		width:100%;
		float:left;
		margin:0;
		padding:10px 0;
		text-align:center;
		border-top:1px solid #ddd;
		background:#efefef;
	}

	nav a:hover {
		background:#58d7dd;
		border-color:#58d7dd;
		color:#fff;
	}

	header .content-wrapper {
		width:100%;
	}

	h1 {
		margin-left:4%;
		margin:15px 0 15px 4%;
	}

	#phone {
		margin:12px 4% 0 0;
	}

	header {
		padding:0;
	}

	#top-banner {
		padding:60px 0 100px;
	}

	#top-banner h2 {
		font-size:35px;
	}

	#top-banner p {
		font-size:13px;
	}

	body,
	p {
		font-size:14px;
	}

	#top-banner .btn {
		margin-top:20px;
	}

	h2 {
		font-size:25px;
		padding-bottom:20px;
		margin-bottom:20px;
	}

	h2::after {
		width:80px;
		height:2px;
	}

	h3 {
		font-size:18px;
		margin:40px 0 20px;
	}

	p {
		margin-bottom:20px;
	}

	.silencer-image {
		width:100%;
		height:400px;
	}

	.silencer-text {
		width:100%;
		float:left;
		margin-top:400px;
		padding:60px 4% 40px;
	}

	section {
		padding:60px 0;
	}

	.col-2,
	.col-3 {
		width:100%;
		margin-right:0;
	}

	h2#seminars-header::after {
		width:80px;
		height:80px;
	}

	h2#seminars-header {
		padding:12px 0 12px 100px;
	}

}

@media only screen and (max-width:650px) {
	.silencer-image {
		height:300px;
	}

	.silencer-text {
		margin-top:300px;
	}

	.dr-image {
		width:100%;
		height:280px;
		position:relative;
		float:left;
		background-position:top center;
		max-width:280px;
	}

	.text-bol {
		padding:0;
	}

	.dr-text {
		width:100%;
		float:left;
		margin-top:15px;
	}

	#top-banner {
		padding:40px 0 40px;
	}

	#top-banner h2 {
		font-size:30px;
	}

	#top-banner p {
		font-size:11px;
	}
}

@media only screen and (max-width:500px) {
	#top-banner {
		padding:30px 0 40px;
	}

	#top-banner h2 {
		font-size:23px;
	}

	#top-banner p {
		font-size:9px;
		background:rgba(255,255,255,.85);
		float:left;
		padding:5px 6px;
	}

	#top-banner .btn {
		float:left;
		clear:both;
	}

	.btn {
		padding:8px 20px 10px;
		font-size:13px;
	}

	#phone {
		font-size:12px;
		letter-spacing: 0;
		padding-left:20px;
	}
}