@import url(http://fonts.googleapis.com/css?family=Ovo);

body
{
	font-family:Verdana,Geneva,sans-serif;
	color:#ffffff;
	background-color:#060606;
}


.videoFrame
{
	position: relative;
	max-width:640px;
}

.video
{
	padding-bottom: 57.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.video iframe
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


.featureBox
{
	background-color: #f89d0e;	
}

.featureBox h3 , .featureBox
{
	color:#000000;
}

.featureBox a , .featureBox a:visited
{  
	color:#fff7c0;
}

.infoBox
{
	background-color: #666666;	
}

.col1
{
	width:50%;
	float:left;
}

.col2
{
	width:50%;
	float:right;
}

.col2 span
{
	display:block;
	padding-left:2em;
	
}

.section p
{
	max-width:38em;
}

#questions .row
{
	border-bottom:solid 1px silver;
	padding:1em 0;
}

.popup
{
	color:#000000;
}

.popup
{
	max-width:90%;
}

#pickListPopup fieldset
{
	height:12em;
	overflow:auto;
}


.infoBox h3 , .infoBox
{
	color:#eeeeee;
}

.infoBox a , .infoBox a:visited
{  
	color:#fff7c0;
}

.c
{
	padding:1em;
}

.textBox
{
	background-color:#F6F6F6;
	color:#060606;
}


.al
{
	text-align:left;
}


h1, h2, h3, .bigPromo, .littlePromo
{
	font-family: 'Ovo', serif;
	font-weight:normal;
}

#header
{
	padding:.5em 2px;
	line-height:1.33em;
}


#content
{
	margin-top:2em;	
	min-height:20em;
	padding-bottom:6em;
}

p
{
	font-size:.875em;
	line-height:1.33em;
	margin-top:.5em;
}

h1
{
	text-align:center;
	font-size:2em;
	margin:0;	
}

h2
{
	font-size:2em;
	margin-bottom:.25em;
	margin-top:.5em;
}

h3
{
	font-size:1.5em;
	margin-bottom:.5em;
	margin-top:.5em;
}

em
{
	display:block;
	font-weight:normal;
	margin-left:1em;	
}


.title
{
	font-size:1em;
	margin-right:.25em;	
}

.strapline
{
	color:#000000;
	font-size:.8em;
	white-space:nowrap;
}

.tiles
{
	width:100%;
}

.tiles:after  
{
    content: "."; 
    display: block; 
    height: 0px; 
    clear: both; 
    visibility: hidden;
} 

.tile
{
	float:left;
}

#thePage
{
	background-color:#060606;	
	width:100%;
	max-width:1050px;
}


.inputBox
{
	width:25em;
	max-width:95%;
}

#ConfirmEmailLine
{
	display:none;
}

.errors
{
	display:block;
	padding:.5em;
	color:#ffffff;
	background-color:#aa0000;
}

.errors a:hover span
{
	text-decoration:underline;
}

.errors span
{
	color:#ffffff;
}

a , a:visited 
{
	color:#4b6174;
}

.lightLink a, .lightLink a:visited
{
	color:#fff7c0;
}

.bigPromo
{
	width:60%;	
}

.bigPromo div
{
	margin:2px;
	
}

.bigPromo a , .bigPromo a:visited , .littlePromo a, .littlePromo a:visited
{
	color:#333333;
	text-decoration:none;
		
}

.bigPromo a , .littlePromo a 
{
	display:block;
	min-height:3em;
	padding: .4em 40px .4em 40px;
	font-size:4em;
    text-shadow: 2px 2px 3px rgba(255,255,255,.6);
    font-weight:bold;
    letter-spacing: .1em;
}

.littlePromo a, .littlePromo a:visited
{

}

.littlePromo
{
	width:40%;
}

.littlePromo div
{
	margin:2px;
}

#hpIntro .tile
{
	width:50%;
} 

#hpIntro .tile div
{
	margin:0 2px;
}

#intro
{
	margin-bottom:2em;	
}

#intro .introText
{
	width:60%;	
}

#intro .introImage
{
	width:40%;
	background-size: cover;
	background-repeat:no-repeat;
	background-position:center;	
}

#intro .tile div
{
	margin:0px 2px;
}

.introImage img
{
	display:none;
}

.introText div
{
	padding-right:2em;
	padding-left:1em;
}

#index .tile
{
	width:33%;
}

#index .tileBackground
{
	background-image:none!important;
	background-color:#4B3827;
	margin:1px;
	height:10em;
	overflow-y:auto;
	
}


#index .tiles
{
	padding:1em 0;
}

#index .tileBackground div
{
	padding:1em;	
}

#index h3 a, #index h3 a:visited, #index p , #index h3
{
	color:#ffffff;
}

#index h3
{
	margin:0;
	font-size:1.25em;
}

.nextLink
{
	cursor:pointer;
}


.hide
{
	display:none;
}




.banner
{
	
	padding:.5em;
}


#footer p
{
	margin:0;
	padding-top:2px;
	text-align:center;
	background-color:#000000;
}


#footer a
{
	white-space:nowrap;
	color:#dddddd;
	text-decoration:none;
}

#symbol
{
	width:35%;
	float:right;	
	text-align:center;
}

#symbolPos
{
	position:relative;
	top:0px;
	//left:-1em;
	transition: top .5s ease-in-out;
	-webkit-transition: top .5s ease-in-out;
	margin:0 2px;
	zoom:1;

	

}

#symbolPos img
{
	max-width:100%;
	height:auto;
	position:absolute;
	left:0px;
	opacity=100;
	transition: opacity 1.5s ease-in;
	-webkit-transition: opacity 1.5s ease-in;
	
		
}

.openDivHead
{	
	margin-top:.5em;
	cursor:pointer;
}

.openDivOn
{
	background-color:#d2e1ef;
	border-left:solid 1px #d2e1ef;
	display:block;	
}

.openDivOn span:after
{
	content:"[hide]";
}


.openDivOff
{
	background-color:#d2e1ef;
	display:inline-block;
	margin-right:.5em;
}

.openDivOff span:after
{
	content:"[show]";
}


.openDivHead p
{
	margin-top:0;	
	padding:.2em .5em;
	position:relative;
}

.openDivBody
{	
	
	border-left:solid 1px #d2e1ef;
	max-height:0;
	overflow:hidden;
	transition: max-height .5s ease-in-out;
	-webkit-transition: max-height .5s ease-in-out;
}

.openDivContent
{
	padding:.5em 0 .5em .5em;	
}

.openDivBody p:first-child
{
	margin-top:0;
}


.openDivHead span
{
	font-size:.8em;
	//position:absolute;
	right:.5em;
}

.myButton
{
	background-color:#dbdbdb;
	padding: .25em 1em;
	text-decoration: none;
	margin-right: 1em;
	line-height: 1.33em;
	font-weight: bold;	
	cursor:pointer;
}


.textPage
{
	max-width:38em;
}

.textPage h3
{
	margin-top:2em;
}

.share
{
	margin-top:1em;	
	white-space:normal;
	line-height:24px;
	padding:0;	
}

#shareBox .share
{
	margin-top:.5em;
}

.shareText
{
	font-size:1.1em;
	border-bottom:solid 2px #888888;
}

.shareIcon
{
	width:24px;
	height:24px;
	margin:0 3px;
	vertical-align: middle;
}


.fb-comments, .fb-comments * {
	width: 100%!important;
} 

#fb
{
	background-color:#F6F6F6;
	padding:1em;
}


#hsd
{
	display:none;
}

@media screen and (max-width: 800px) /* 800px*/
{
	.bigPromo , .littlePromo
	{
		width:50%;
	}
	
	#meditationPage #symbol	
	{
		width:20%;
	}

	#meditationPage .blog	
	{
		width:80%;
	}	
}

@media screen and (max-width: 700px)
{
	.bigPromo , .littlePromo
	{
		width:100%;
	}
	
	.bigPromo a , .littlePromo a
	{
		min-height:1em;
		font-size:2em;
		padding:1em 40px;
	}
	
	#index .tile
	{
		width:50%;
	}
	
}

@media screen and (max-width: 600px)
{
	.col1 , .col2
	{
		width:100%;
		margin-left:0;
	}
	
	.col2 span
	{
		padding-left:0;
	}
	
	#toolbar
	{
		display:block;
	}
	
	
	#hpIntro .tile
	{
		width:100%;
	}
	
	#intro .tile
	{
		width:100%;
	}
	
	.introImage
	{
		background-image:none!important;
		text-align:center;
	}
	.introImage img
	{
		display:inline;
		max-width:100%;
		height:auto;
	}	

}


h1 img
{
	max-width:100%;	
	height:auto;
	display:block;
	margin:0 auto;
}

@media screen and (max-width: 500px)
{
#index .tile
	{
		width:100%;
	}
	
	#index .tileBackground
	{
		height:auto;
	}		
}