body {
	font-family:'Asap';
	line-height:1.3;
	font-size:18px;
}
b, strong {
	font-weight:700
}
i, em {
	font-style:italic
}
.container {
	width:990px;
	margin:0 auto;
	text-align:center;
}

.container-inner {
	text-align:left;
	padding:40px 0;
}
#header .container-inner {
	padding:0
}

#header {
	background:url('images/header-leaves.jpg') no-repeat 50% 50%;
	background-size:cover;
	margin-bottom:60px;
}

.enter-phone {
	color:white;
	margin-top:10px;
	text-shadow:1px 1px 5px #666;
	font-size:20px;
}
.enter-phone input[type=tel] {
	box-sizing:border-box;
	padding:10px;
	border:1px solid #ddd;
	font-size:20px;
}

#nav {
	position: fixed;
    top: 0;
    width: 100%;
	z-index:100;
}
#nav.fill-bg, .show-mobile-nav #nav {
	background:white;
	box-shadow:0px 0px 5px #666;
}
#nav.fill-bg .nav-table {
	color:#333
}
#nav.fill-bg li a {
	color:#333;
}
#nav.fill-bg li a.orange {
	color:#fff;
}

.nav-table {
	display:table;
	width:100%;
	color:white;
}
.nav-left, .nav-right {
	display:table-cell;
	vertical-align:middle;
	box-sizing:border-box;
	padding:10px;
}
.nav-left img {
	vertical-align:middle
}

.nav-left {
	font-size:24px;
	font-weight:500;
	padding-left:40px;
}
.nav-right {
	text-align:left
}

.nav-right ul {
	list-style:none;
}
.nav-right li {
	display:inline-block;
}
.nav-right li a {
	display:block;
	padding:10px 20px;
	text-decoration:none;
	color:white;
	font-weight:600;
	font-size:20px;
}

a.orange, .send {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffc335+0,ff9a27+100 */
	background: #ffc335; /* Old browsers */
	background: -moz-linear-gradient(top, #ffc335 0%, #ff9a27 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #ffc335 0%,#ff9a27 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #ffc335 0%,#ff9a27 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc335', endColorstr='#ff9a27',GradientType=0 ); /* IE6-9 */
	
	border-radius:10px;
	box-shadow:1px 1px 5px #666;
	font-style:italic;
	text-align:center;
	color:white !important;
}
.send {
	padding:10px 20px;
	display:inline-block;
	border:0;
	font-size:20px;
	font-weight:bold;
	border-radius:5px;
}
.nav-button {
	float:right;
	margin-right:30px;
}
.show-mobile-nav #dynamic-nav {
	display:block !important;	
}
.show-mobile-nav li {
	padding:5px 10px 5px 20px;	
}
.show-mobile-nav .nav-table {
	border-bottom:1px solid #999;
}
.show-mobile-nav li a {
	text-decoration:none;
	font-weight:600;
	border-bottom:1px solid #bbb;
	box-sizing:border-box;
	display:block;
	padding:10px 0;
	color:#333
}
.show-mobile-nav .nav-left {
	color:#333
}
.show-mobile-nav .nav-mobile a {
	background-image:url('images/menu-icon-gray-X.png') !important;
}


.header-outer {
	padding-top:50px;
}
#header-main h1{
	font-size:48px;
	font-weight:600;
	font-style:italic;
	color:white;
	text-shadow:1px 1px 5px #666;
	margin-top:75px;
	margin-bottom:20px;
}
.width-50 {
	float:left;
	box-sizing:border-box;
	width:50%;
	padding-bottom:20px;
}
#as-seen {
	background:#f1f1f1;
	color:#9d9d9d;
	padding:20px 0;
	font-weight:600;
	font-style:italic;
}
#as-seen img {
	width:100%;
	margin-top:10px;
}
#as-seen .container-inner {
	padding:20px 0
}
.width-50.phone img {
	position:relative;
	top:50px;
	width:100%;
}

h2 {
	color:#1598be;
	font-size:36px;
	font-weight:600;
	text-align:center;
	margin-bottom:20px;
}
.h2-left h2 {
	text-align:left;
	margin-top:20px;
}
.h2-left2 h2 {
	text-align:left;
	margin-bottom:10px;

}
.h2-left2 a {
	color:#1598be;
}
h3 {
	color:#1598be;
	font-size:30px;
	text-transform:uppercase;
	letter-spacing:4px;
	margin:20px 0;
	font-weight:500;
}
.box-700 {
	width:700px;
	margin:0 auto;
	max-width:100%
}
.center {
	text-align:center !important
}
#library-icons {
	
}
#library-icons img {
	width:23%;
	margin:1%;
	border-radius:10px;
}

#blue-trees {
	background:url('images/blue-trees-bg.jpg') no-repeat 50% 50%;
	background-size:cover;
	color:white;
}
#blue-trees h2, #purple-clouds h2 {
	color:white;
	text-align:left;
}
#blue-trees .video {
	padding-right:20px;
}

#purple-clouds {
	background:url('images/purple-clouds-bg.jpg') no-repeat 50% 50%;
	background-size:cover;
	color:white;
}
#purple-clouds .container-inner {
	padding-bottom:0;
}
#purple-clouds .jess-med img {
	position:relative;
	top:50px;
	margin-top:-50px;
	width:100%;
}

#saying .container-inner {
	padding:80px 10px
}

#blue-mountains {
	background:url('images/blue-mountains-bg.jpg') no-repeat 50% 50%;
	background-size:cover;
	color:white;
}
#blue-mountains .phone2 img{
	width:100%;
	margin-top:-25px;
	margin-bottom:-50px;
}
#blue-mountains .text {
	text-align:center;
	width:30%
}
#blue-mountains h2 {
	font-size:36px;
	font-weight:500;
	font-style:italic;
	color:white;
	text-shadow:1px 1px 5px #666;
	margin:0 auto 20px;
	width:500px;
	max-width:100%;
	
}
.box-500 {
	width:500px;
	margin:0 auto;
	max-width:100%
}
#blue-mt-table {
	display:table;
	width:100%;
}
#blue-mt-table .width-50 {
	display:table-cell;
	vertical-align:middle;
	float:none;
}
.video-container {
	position:relative;
	padding-bottom:54%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin-bottom:20px;
}

.video-container iframe {
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height:100%;
}

#footer {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#068db9+0,64c7d9+100 */
	background: #068db9; /* Old browsers */
	background: -moz-linear-gradient(top, #068db9 0%, #64c7d9 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #068db9 0%,#64c7d9 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #068db9 0%,#64c7d9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#068db9', endColorstr='#64c7d9',GradientType=0 ); /* IE6-9 */
	
	color:white;
}
#footer .container-inner {
	padding:80px 0
}

.footer-table {
	display:table;
	margin:0 auto
}

.footer-column {
	box-sizing:border-box;
	display:table-cell;
	vertical-align:top;
	padding:0 40px;
	color:white;
}
.footer-column span {
	display:block;
	font-size:20px;
	font-weight:600;
}
.footer-column a {
	display:block;
	color:white;
	text-decoration:none;
	margin-top:10px;
}

#footer2 {
	padding:0 0 20px;
	color:#a4a4a4;
	text-align:center;
}
#footer2 a {
	margin-top:-25px;
	display:block;
	margin-bottom:20px;
}

.clear {
	clear:both;
	height:0;
	content:'';
}

.expert-column {
	width:50%;
	float:left;
	box-sizing:border-box;
	padding:10px;
}

.expert {
	border:1px solid #aaa;
	padding:0 20px 20px;
	border-radius:5px;
	box-shadow:3px 3px 10px #bbb;
	text-align:center;
	color:#545454;
	margin-top:50px;
	margin-bottom:70px;
}
.expert span {
	font-size:20px;
	color:#333;
	display:block;
	font-weight:600;
	margin-bottom:5px;
}
.expert img {
	display:block;
	width:100px;
	margin:-50px auto 20px;
	border-radius:50%;
}
.expert h6 {
	display:block;
	color:#078eba;
	font-weight:600;
	margin-top:20px;
	font-size:24px;
	font-style:italic;
}

.blue-header {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#61c5d8+0,1a9ac0+100 */
	background: #61c5d8; /* Old browsers */
	background: -moz-linear-gradient(left, #61c5d8 0%, #1a9ac0 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #61c5d8 0%,#1a9ac0 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #61c5d8 0%,#1a9ac0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#61c5d8', endColorstr='#1a9ac0',GradientType=1 ); /* IE6-9 */
	
	color:white;
	font-weight:600;
	font-size:38px;
	text-align:center;
	padding:40px 0;
}


.people-box {
	box-sizing:border-box;
	padding:20px;
	border-radius:5px;
	border:1px solid #ddd;
	box-shadow:1px 1px 5px #666;
	margin:10px;
}
.people-box .left {
	float:left;
	color:#078eba;
	font-weight:bold;
	font-style:italic;
	font-size:22px;
	text-align:left;
	width:50%;
	word-break: break-word;
}
.people-box .right {
	float:right;
	color:#bbb;
	width:45%;
	text-align:right;
	word-break: break-word;
}
.people-box .text {
	margin-top:20px;
}


.app-table {
	display:table;
}
.app-row {
	display:table-row;
}
.app-cell {
	display:table-cell;
	vertical-align:top;
}
.app-cell.left {
	padding-right:50px
}
.app-cell.right {
	width:300px;
	box-sizing:border-box;
	padding:10px;
}
.app-cell img {
	width:100%;
	margin-bottom:20px;
}

.green-button {
	border-radius:5px;
	box-sizing:border-box;
	text-decoration:none;
	color:white !important;
	background:#7bb701;
	font-style:italic;
	font-weight:700;
	display:inline-block;
	padding:20px 80px;
	font-size:22px
}
.green-button.smaller {
	padding:13px 35px;
	font-size:16px;
}
ul.bullet {
	list-style:disc;
	margin:20px 0 20px 30px
}
ul.bullet li {
	margin-bottom:10px
}

.line {
	height:1px;
	background:#ccc;
	margin:40px 0;
	content:'';
}
.img-right {
	float:right;
	margin:0 0 20px 20px;
	width:400px;
}

#banner {
	background-repeat: no-repeat;
	background-position: 25% 50%;
	background-size:cover;
	padding:150px 50px;
	text-align:center;
	box-sizing:border-box;
	height:440px;
}
#banner-outer {
	max-width:800px;
	display:inline-block;
	background:white;
	box-sizing:border-box;
	padding:10px;
	margin:0 auto;
	background:url('https://www.thetappingsolution.com/wp-content/themes/tappingsolution/new-images/trans-white-bg.png');
}
#banner-inner {
	background:white;
	padding:20px 110px;
	text-align:center;
}

#banner-inner h1, #banner h1 a, #banner h2, #banner h2 a {
	font-weight:bold;
	font-size:36px;
	text-decoration:none;
	color:#000;
}
#banner-inner h4 {
	color:#1598be;
	text-transform:uppercase;
	font-size:16px;
	font-weight: 500;
    letter-spacing: 2px;
}

.swirl-left {
	float:left;
	margin:0 20px 90px 0
}

.screenshot {
	width:19%;
	margin:1% 1% 1% 0;
}

.lifestyle {
	width:24%;
	margin-right:1%;
	box-sizing:border-box;
	display:inline-block;
	vertical-align:top;
	font-weight:bold;
	margin-bottom:20px;
	font-size:16px;
}
.lifestyle img {
	width:235px;
	height:235px;
	object-fit:cover;
	display:block;
	margin-bottom:10px;
	border:1px solid #ddd;
	border-radius:5px;
}
.lifestyle a {
	display:block;
	margin-top:10px;
	
}
.button-right {
	float:right;
	padding:13px 35px;
	font-size:16px;
	margin:0 1% 10px 0;
}

.preview-box {
	display:inline-block;
	margin-right:20px;
	vertical-align:top;
	width:180px;
}
.preview-box img {
	display:block;
	border:1px solid #ccc;
	width:100%;
}
.preview-box a {
	width:100%;
	margin-top:10px;
}

@media only screen and (min-width:1378px) {
	#dynamic-nav, .show-mobile-nav #dynamic-nav {
		display:none !important
	}
	#nav li {
		padding:0 !important
	}
	#nav li a {
		border-bottom:0 !important;
		padding:10px 20px !important;
	}
	
}

@media only screen and (max-width:1377px) {
	.nav-right {
		display:none
	}
	.nav-mobile {
		display:table-cell !important;
		box-sizing:border-box;
		padding:20px;
		text-align:right;
	}
	.nav-mobile a {
		display:inline-block;
		width:25px;
		height:19px;
		background:url('images/menu-icon-white.png') no-repeat top left;
		text-decoration:none;
	}
	.show-mobile-nav .nav-mobile a {
		background:url('images/menu-icon-white-X.png') no-repeat top left;
	}
	.fill-bg .nav-mobile a {
		background:url('images/menu-icon-gray.png') no-repeat top left;
	}
	.show-mobile-nav .fill-bg .nav-mobile a {
		background:url('images/menu-icon-gray-X.png') no-repeat top left;
	}
	.nav-button {
		float:none
	}
	
}


@media only screen and (max-width:1010px) {
	.container {
		width:100%
	}
	.container-inner {
		padding:20px 10px
	}
	.lifestyle {
		width:230px;
		margin:3%
	}
	.screenshot {
		width:180px;
		margin:1% 3%;
	}
	.center-outer {
		text-align:center;
	}
}

@media only screen and (max-width:950px) {
	#header-main h1 {
		font-size:40px;
	}
	.app-table, .app-row, .app-cell {
		display:block;
	}
	.app-cell.left {
		margin-bottom:20px;
		padding-right:0;
	}
	.app-cell.right {
		width:100%
	}
	.app-cell.right img {
		width:18%;
		margin:0 1%;
	}
}

@media only screen and (max-width:880px) {
	.width-50 {
		width:100%;
		padding:10px;
	}
    .width-50.img img {
        display:block;
        margin:0 auto 10px;
        max-width:100%;
    }
	#header-main .width-50 {
		text-align:center;
	}
	#as-seen {
		text-align:center
	}
	#purple-clouds .download {
		display:block;
		margin:0 auto;
	}
	#purple-clouds .jess-med img {
		margin:0 auto;
		width:400px;
		max-width:100%;
		display:block;
		top:0;
	}
	#blue-trees .video {
		padding:0 20px
	}
	#blue-mt-table {
		display:block;
	}
	#blue-mt-table .width-50 {
		display:block;
	}
	#blue-mountains .phone2 img {
		display:block;
		margin:0px auto;
		width:400px;
		max-width:100%;
	}
	#blue-mountains .text {
		width:100%
	}
	.img-right {
		float:none;
		display:block;
		margin:0 auto 20px
	}
}

@media only screen and (max-width:700px) {
	.footer-column {
		width:100%;
		display:block;
		margin-bottom:40px;
	}
	
	.expert-column {
		width:100%;
		float:none;
		padding:0;
	}
	#banner {
		height:auto;
		padding:15px;
	}
	#banner-inner {
		padding:20px 50px;
	}
	.app-cell.right .img-50 {
		width:48%;
	}
	.app-cell.right .img-33 {
		width:31%
	}
	.app-cell.right {
		text-align:center
	}
}

@media only screen and (max-width:600px) {
	#as-seen .full {
		display:none
	}
	#as-seen .mobile {
		width:100%;
		display:block !important
	}
	#library-icons img {
		width:48%;
	}
	.button-right {	
		margin:20px auto;
		float:none;
		display:block;
		width:170px;
	}
}

@media only screen and (max-width:400px) {
	.nav-left {
		font-size:17px;
	}
}


#med:before, #what:before, #how:before { 
 display: block; 
 content: " "; 
   height: 70px;      /* Give height of your fixed element */
   margin-top: -70px; /* Give negative margin of your fixed element */   
        visibility: hidden; 
}