/*   
Theme Name: Soul Mate Readings
Theme URI: http://www.st8.la/
Description: Default theme for Soul Mate Readings
Author: ST8 Creative
Author URI: http://www.st8.la/
Version: 1
*/


/* CSS Sheet
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers. 
   There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  

/* new Linux- and Windows-friendly sans-serif font stack: http://mky.be/fontstack */
body {font: 13px Helvetica, Arial, sans-serif; background-color: #000000;}

/* using local fonts? make sure to read up on Paul Irish's 
	Bulletproof @font-face syntax: http://mky.be/font-face/bulletproof/ */

/* we like off-black for text */
body, select, input, textarea {color: #FFFFFF;}

a {color: #03f;}
a:hover {text-decoration: underline;}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}



/* And here begins the Wordpress fun.
-------------------------------------------------------------------------------*/


.post {}

.entry-content {}
.entry-content a {}
.entry-content a:hover {}

#meta {}
.postmetadata {}

#sidebar {}

.navgation {}
.next-posts {}
.prev-posts {}

#searchform {}
#s {}
#searchsubmt {}
	
ol.commentlist {list-style: none;}
ol.commentlist li {}
ol.commentlist li.alt {}
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment {border-bottom: 1px dotted #666; padding: 10px;}
ol.commentlist li.comment div.comment-author {}
ol.commentlist li.comment div.vcard {}
ol.commentlist li.comment div.vcard cite.fn {font-style: normal;}
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar {float:right; margin: 0 0 10px 10px;}
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta {font-size: 10px;}
ol.commentlist li.comment div.comment-meta a {color: #ccc;}
ol.commentlist li.comment p {}
ol.commentlist li.comment ul {}
ol.commentlist li.comment div.reply {font-size: 11px;}
ol.commentlist li.comment div.reply a {font-weight: bold;}
ol.commentlist li.comment ul.children {list-style: none; margin: 10px 0 0;}
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {border-left: 5px solid #555; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-3 {border-left: 5px solid #999; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-4 {border-left: 5px solid #bbb; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-5 {}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even {background: #fff;}
ol.commentlist li.odd {background: #f6f6f6;}
ol.commentlist li.parent {border-left: 5px solid #111;}
ol.commentlist li.thread-alt {}
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}

img.alignright {float:right;}
img.alignleft {float:left;}
img.aligncenter {display: block; margin-left: auto; margin-right: auto;}
.alignright {float:right; margin:0 0 1em 1em; }
.alignleft {float:left; margin:0 1em 1em 0;}
.aligncenter {display: block; margin-left: auto; margin-right: auto;}


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {



}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
	
		
}

@media all and (orientation: portrait) {
	
}

@media all and (orientation: landscape) {
	
}

/* Header
-------------------------------------------------------------------------------*/

#home-top {
	background-image: url(images/home-bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 428px;
	width: 100%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}
#reincarnation-top {
	background-image: url(images/reincarnation-bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 428px;
	width: 100%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}
#karma-top {
	background-image: url(images/karma-bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 428px;
	width: 100%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}
#energy-top {
	background-image: url(images/energy-bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 428px;
	width: 100%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}
#prosperity-top {
	background-image: url(images/prosperity-bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 428px;
	width: 100%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}
#angel-top {
	background-image: url(images/angel-bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 428px;
	width: 100%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}


/* Navigation
-------------------------------------------------------------------------------*/

nav {
	margin: 0;
	font-size: 18px;
	line-height: 20px;
	font-family: Helvetica, Arial, sans-serif;
}
nav ul {
	list-style:none outside none;
	width: 970px;
	height: 25px;
    margin: 0 auto;
    padding:0;
}
nav ul li {
    display:block;
    float:left;
	height: 20px;
    margin: 0 40px 0 0;
	padding: 5px 0 0 0;
}
nav ul li a {
	text-decoration: none;
	color: #FFFFFF;
}
nav ul li a:hover {
	border-bottom: solid 1px #FFFFFF;
}


/* Main Content - Home/Default
-------------------------------------------------------------------------------*/

.page-wrap {
	width: 980px;
	height: 100%;
	margin: 0 auto;
}
#main {
	width: 595px;
	height: 100%;
	padding: 20px 0 0 5px;
	float: left;
	text-align: left;
}
#main h1 {
	font-size: 38px;
	line-height: 38px;
	letter-spacing: -2px;
	color: #00baff;
	margin: 0 0 20px 0;
}
#main h2 {
	font-size: 18px;
	color: #00BAFF;
	font-weight: normal;
	line-height: 24px;
	margin: 0 0 20px 0;
}
#main p {
	font-size: 16px;
	line-height: 20px;
	margin: 0 0 20px 0;
}
#main h3 {
	font-size: 16px;
	line-height: 20px;
	color: #00baff;
	font-weight: normal;
	margin: 0 0 20px 0;
}
#main h4 {
	font-size: 26px;
	color: #00baff;
	margin: 30px 0 20px 0;
}
#main p.wp-caption-text {
	font-size: 12px;
	font-style: italic;
	color: #CCCCCC;
	padding: 10px 10px;
}
#main input {
	width: 245px;
	height: 20px;
	color: #bebabe;
	margin: 0 20px 20px 0;
}


/* Main Content - Reincarnation & Relationships
-------------------------------------------------------------------------------*/
#reincarnation h1 {
	color: #00c2ca;
}
#reincarnation #main h2 {
	color: #00c2ca;
}
#reincarnation h3 {
	color: #00c2ca;
}
#reincarnation h4 {
	color: #00c2ca;
}


/* Main Content - Karma
-------------------------------------------------------------------------------*/
#karma h1 {
	color: #ffae00;
}
#karma #main h2 {
	color: #ffae00;
}
#karma h3 {
	color: #ffae00;
}
#karma h4 {
	color: #ffae00;
}
#karma blockquote {
	color: #ffae00;
	font-style: italic;
	padding: 20px 0 0 0;
	margin: 0 0 20px 0;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #ffae00;
	border-bottom-color: #ffae00;
}


/* Main Content - Energy
-------------------------------------------------------------------------------*/
#energy h1 {
	color: #ff54f1;
}
#energy #main h2 {
	color: #ff54f1;
}
#energy h3 {
	color: #ff54f1;
}
#energy h4 {
	color: #ff54f1;
}


/* Main Content - Prosperity
-------------------------------------------------------------------------------*/
#prosperity h1 {
	color: #ffde00;
}
#prosperity #main h2 {
	color: #ffde00;
}
#prosperity h3 {
	color: #ffde00;
}
#prosperity h4 {
	color: #ffde00;
}


/* Main Content - Free Angel Readings
-------------------------------------------------------------------------------*/
#angel h1 {
	color: #ffcc8b;
}
#angel #main h2 {
	color: #ffcc8b;
}
#angel h3 {
	color: #ffcc8b;
}
#angel h4 {
	color: #ffcc8b;
}


/* Sidebar
-------------------------------------------------------------------------------*/

aside {
	width: 310px;
	margin: 0 15px 0 55px;
	padding: 30px 0 0 0;
	height: 100%;
	float: right;
}
aside h2 {
	font-size: 18px;
	color: #dbdcbc;
	font-weight: normal;
	line-height: 24px;
	margin: 0 0 10px 30px;
}
aside form {
	margin: 0 0 0 30px;
}
aside input {
	width: 245px;
	height: 20px;
	color: #bebabe;
}


/* Form Processing
-------------------------------------------------------------------------------*/
#fade {
	display: none;
	background: #000; 
	position: fixed; left: 0; top: 0; 
	z-index: 10;
	width: 100%; height: 100%;
	opacity: .80;
	z-index: 9999;
}
.popup_block{
	display: none;
	background: #fff;
	padding: 20px; 	
	border: 20px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 50%; left: 50%;
	z-index: 99999;
	-webkit-box-shadow: 0px 0px 20px #000;
	-moz-box-shadow: 0px 0px 20px #000;
	box-shadow: 0px 0px 20px #000;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
img.btn_close {
	float: right; 
	margin: -55px -55px 0 0;
}
.popup p {
	padding: 5px 10px;
	margin: 5px 0;
}
/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
	position: absolute;
}
*html .popup_block {
	position: absolute;
}


/* Footer
-------------------------------------------------------------------------------*/

footer {
	clear: both;
	font-size: 11px;
	line-height: 16px;
	color: #929192;
	text-align: center;
	font-style: italic;
	padding: 40px 0 20px 0;
}
footer ul {
	list-style:none outside none;
	width: 800px;
	height: 25px;
    	margin: 0 auto;
    	padding:0;
}
footer ul li {
    display:block;
    float:left;
	height: 20px;
    margin: 0 40px 0 0;
	padding: 5px 0 0 0;
}
footer ul li a {
	font-style: normal;
	text-decoration: none;
	color: #929192;
	font-size: 12px;
}
footer ul li a:hover {
	text-decoration: underline;
	color: #929192;
}
footer a {
	text-decoration: none;
	color: #929192;
}
footer a:hover {
	text-decoration: underline;
	color: #929192;
}

h3 a {color: #00BAFF; text-decoration:none;}
h3 a:hover {text-decoration: underline;}
