@import url('/stylesheets/normalize.css');
/* above is external style sheet from Lynda training 'CSS Styling Forms'. Seems to move menu bar over a little to R  */

/*
File:			custom.css
Description:	Custom styles for Thesis
More Info:		http://diythemes.com/thesis/rtfm/custom-css/
*/


/*======= BEG: THESIS RESET =================================== 
=============================================================== */

/* Some from http://www.wpbandit.com/blog/bandits-treasure-guides/volume-1-part-3-thesis-css-reset/ */
/*   Some from Kristarella */

/* --- Misc Resets Beginning ---- */
.custom a { outline:none; }
.custom #feature_box { border-bottom:none; }
.custom #column_wrap { background:none; }
.custom .page { padding:0px; }
/* --- Misc Resets End ---- */

/* Brian 6-21-12.  IN THEORY: 2 column widths set by Thesis 'Design options' unless overridden elsewhere in custom.css. HOWEVER, that's not the case. Possibly because of the following .custom .page setting.  Regardless of the reason, we need to set the widths of the '#content' and '#sidebars' tags for entire site here (as well as in Design Options).  Changed 'Design Option' column widths to 660 and 300px */
.custom #content { width:660px; padding-top:12px }
.custom #sidebars { width: 290px; /* padding-top:12px */ padding-left: 10px; } 

/* gets rid of the default margins for all info inside the Content area. We then set a padding L and R for the Content area 
.custom .post_box { margin: 0; }
*/

/* ====== BEG: OVERRIDES DEFAULT THESIS CODE IN LAYOUT.CSS AND STYLE.CSS. Brian 6-8-12 ===== */





/* color choices: original dark charcoal #231F20, aqua blue from fuelinteractive #13A4C6, blue angel #0139FE.  #archive_intro added to deal with overriding layout.css in Category blog pages Brian 8-5-12 */
.format_text h1, .format_text h2, .format_text h3, #archive_intro h1 {
    /* font-size: 28px; */
    font-weight: normal;
    /* color: #13A4C6; */
    line-height: 1.367em;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    margin: 10px 0 10px 0;
} 

.format_text h1, #archive_intro h1  { font-size: 28px; }

.format_text h2 { font-size: 24px; }

.format_text h3 { font-size: 20px; }

/* sets image width 100%. Will need to override with specific px settings on any submit buttons */
input[type="image"] { width: 100%; }

/* format the form fields */
input[type="text"], textarea {
    background-color: white;
    border: 1px solid #0E6EBD;
    display: block;
    font-size: 12px;
    margin: 5px 0 0 0;
    width: 100%;
    padding: .214em;
}

.format_text ul {
    list-style: disc inside none;
    margin: 0;
    padding-left: 0;
}

/* --- <li> puts margin between Label and Input tag. Display:Block should normally put fields on their own line (if not for the margin-bottom of -XX px for the Label tag --- */
form ul li label {
    display: block;
    margin: 5px 0 5px 0;
}

/* ---- Brian 6-11-12: Format form when 2 columns on same line ----- */
.li_l_col { float: left; width: 42%; margin-right: 10%; }
.li_r_col {width: 48%; float: left; }


/*override layout.css formatting for footer text */
#footer, #footer a {
    color: #444444;
}




/* ====== END: OVERRIDES THESIS CODE IN LAYOUT.CSS AND STYLE.CSS ===== */

/* Brian 6-22-12: overrides fonts from normalize.css */
body, button, input, select, textarea {
    font-family: 'MuseoSans500',Helvetica,Arial,sans-serif;
}

/* ======== BEG: RELATED POSTS FORMATTING (YARPP plugin showing related posts end of each blog post) ============ */

.format_text ul.related_posts {
/*    list-style: circle outside none; */
list-style-type: circle;
}

ul.related_posts a, h3.related_posts {
    color: #F4791F;
    font-size: 16px;
    text-decoration: none;
}

/* ======== END: RELATED POSTS FORMATTING ========== */

/* ======== BEG: FORM FORMATTING. 'CONTACT' PAGE AND OTHERS ============= */


/* Contact form specifics  */
.contact_form { height:330px; }
.contact_form .div_outside_ul { margin-left: 0; }

/* provides container for unordered list  */
.div_outside_ul { margin: 0px 12px 12px 12px; padding: 0px; } 


/* ---- BEG: formatting for <ul> tag ---- */
/* removes bullets from List items <li>. *** IMPORTANT:  Provides bottom margin since margins collapse between input text fields. */
.li_all li {
    list-style: none outside none;
    margin-bottom:10px;
}

.li_all {
    font-size: 12px;
    line-height: 1em;
    margin: 0;
    overflow: hidden;
}

/* provides padding on R side of <ul> that surrounds <li> and <input> fields. Without it input fields stick out past R side of <ul> */
.input_all {
    padding: 0 10px 0 0;
}


/* ---- END: formatting for <ul> tag ---- */

/* sets formatting for class = .search_button used for Submit Buttons   */
.li_all .search_button {float: left; font-size: 12px; margin:14px 0px 0px 0px; padding:0px; border:none; width:150px; height:30px; background: transparent; }


/* ======== END: FORM FORMATTING ============= */

/* ========= END: THESIS RESET =================================== 
=================================================================*/















/* ============================== MAIN BACKGROUND CODE START ============================== */
.custom {
    background: none repeat scroll 0 0 #FFFFFF;
}
/* ============================== MAIN BACKGROUND CODE END ============================== */

/* ========== HEADER CODE BEGINNING ============= */
/* Remember that we are currently using full-width header which changes the tags */
/* For ideas see header code from http://joekraynak.com/computers/blogging/redesigning-my-wordpress-blog-with-thesis.html */

/*==== BEG: NEW FULL WIDTH MENU 6-21-12 ====*/

.custom #header { margin-top: 0em; background: transparent; background-image:url(/images/san-diego-psychic-header.png); background-repeat: no-repeat; background-position:center top; }

/*New background for header area from  */
.custom #header_area { margin-top: 0em; background: url("/images/san-diego-psychic-bg-header.png") repeat-x scroll center top transparent; }

/*==== BEG: NEW FULL WIDTH MENU ====*/

/* Making background of header so header image in *header_area is visible.  Could put header image in '.page #header' but would be cut off on left and right by .page area.  Bottom padding gives room for navigation menu. */
.custom #header_area .page {  background: transparent; }

/* The Wordpress/Thesis Title and tagline are left in so they can be searched for page ranking.  Following 3 lines set consistent space above nav menu between pages and between IE and Firefox */
.custom #header { border-bottom:none;  padding-top: 0em; padding-bottom: 108px; }  
.custom #header #logo { font-size: 0em; line-height: 0em; } 
.custom #header #tagline { height: 0; margin: 0;}

/* moves standard wordpress title and tagline to top left corner so invisible*/
.custom #header #logo {text-indent: -9999px;}
.custom #header #tagline {text-indent: -9999px;}

/* ======= HEADER CODE END ========= */


/* ======= CONTENT AREA BEGINNING ========= */

/* --- BEG: OLD CONTENT AREA CODE ------ */
.custom #content_area .page { background: #fff; border-left: #000000 solid 0px; border-right: #000000 solid 0px;}

/* affects alignment on home page layout. Need to add padding-right = 10px since removed margin from post_box class tag. */
.custom #content {padding: 0; margin: 0;} 

/* reset content_box */
.custom #content_box { background:none; } 

/* --- PAGE WIDTH BEGINNING (ENRIQUE 6-6-12) SETS WIDTH OF PAGE, ADDED WIDTH - PADDING WAS ALREADY PART OF THESIS RESET ---- */
.custom .page { background: transparent; width: 960px; padding: 0px; }
/* --- PAGE WIDTH END ---- */

/* ----- END: OLD CODE ------- */

/* ======= CONTENT AREA END ========= */


/* ======= WIDGET BEGINNING ========= */






.sidebar h3 {
    color: #231F20;
    font-family: 'myriad-pro',sans-serif;
    font-size: 20px;
    font-variant: normal;
    font-weight: bold;
    letter-spacing: normal;
    line-height: 1.85em;
    margin-bottom: 0;
    text-transform: uppercase;
}

/* Sidebar Recent Posts formatting 9-5-12 */
li#recent-posts-3.widget, li#recent-posts-4.widget, li#wdg_specialrecentpostsfree-2, li#wdg_specialrecentpostsfree-3 {
    border: 1px solid #E1E1E1;
    margin-left: -5px;
    padding: 10px;
    width: 260px;
}

/* ----END: New sidebar formatting -------- */


/* ======= WIDGET  END ========= */






/* ======== PAGE TITLES BEGINNING ======== */
/* Following code hides all page titles and removes margin at top of content area (except for blog articles).  Hides all page titles from view in browsers.  Leaves the H1 or H2 (for the home page) in the page source so Google can find, which helps SEO.  See posting at http://wordpress.org/support/topic/268110 */
.headline_area { position:absolute; top:-1500px; left:-1500px; }

/* Adds page title back for blog articles. Brian 8-5-12 added bottom margin 1em to format blog teasers/excerpts  */
.hfeed .headline_area {
    left: 0;
    margin-bottom: 1em;
    position: relative;
    top: 0;
}

h1.entry-title { color:#F4791F; font-size:20px; margin-top: 5px; }

/* Removes the title spaces completely from the page */
.custom .post_box { padding-top:0; }

/* ======== PAGE TITLES END ========== */








/* =============== NAVIGATION MENU START =============== */

/* Nav menu reset */
.custom ul#tabs {border-bottom:none; border-left:none;} 

/*==== BEG: NEW FULL WIDTH MENU ====*/

.custom ul.menu {
        background-repeat:repeat-x;
}

/* Brian 6-10-12: new menu divider. Makes menu background transparent, adds dividers, correct menu padding  */   
.custom ul.menu li a {
        background:none;
        background-image:url(/images/san-diego-psychic-menu-divider.png);
        background-repeat:no-repeat;
        background-position:right;
        padding: 5px 18px 5px 18px;	
        /* padding: 6px 18px 3px 18px; */
        font-size: 12px;
}


/*==== END: NEW FULL WIDTH MENU ====*/


/* affects individual navigation menu tabs on hover */

.custom ul.menu li a:hover {
        background-image:url(/images/san-diego-psychic-bg-nav-hover.png);
        background-repeat:repeat-x;
}

/* affects the subscribe and rss icon on the far right of the navigation menu */
.custom ul.menu li.rss a {
        padding-right:30px;
        background:url(/images/san-diego-psychic-icon-rss.png) no-repeat 90% 50%;
        font-family:Trebuchet MS, Arial, Helvetica, Verdana, sans-serif;
}

/* affects the navigation submenu tabs - background:none; removes any image on submenu tab */
.custom ul.submenu li a { background:none; background-color:#02327E; width: 13em; }

/* affects the navigation submenu tabs on hover - background:none; removes any image on submenu tab on hover */
.custom ul.submenu li a:hover { background:none; background-color:#5FCAEA; }


/* =============== NAVIGATION MENU END =============== */







/* =============== FOOTER START =============== */


/* ==== BEG: NEW FOOTER CODE ==== */
/* color choices: gray #D8E1E1, aqua #9AD0FC  , light blue #ACCCFD */
.custom #footer_area { background: #ACCCFD; }

.custom #footer { /* background: #D8E1E1; */ width: 960px; height: 240px; text-align:left; border-top:none; /* margin-top: 24px; */ margin: 0;  padding: 0;}

/* IE9 special setting. Needed because we defined a height = 200px in '.custom #footer' above. IE9 has different page tags than Firefox or earlier version IE.  IE9 uses a <label> tag that includes a <h5> unique coding. The settings in '.custom #footer' were duplicated in <h5> so the height needed to be removed */ 
.ie9 h5 #footer { height: 0px; }

.custom #footer a {border-bottom:0;} /* removes underlines from hyperlinks on footer section */
.custom #footer p {display:none;} /* gets rid of WP Admin link on the footer */

#footer_about {float: left; width: 600px; margin: 16px 0px 0px 16px;}
#footer_about h4 {color: #444444; font-size:18px; padding-bottom:2px;}
#footer_about h5 {color: #444444; font-size:13px; font-weight:normal; letter-spacing:0; text-transform:none;}
#footer_about h5 a {color: #444444; font-size:13px; font-weight:normal; letter-spacing:0; text-transform:none;}
#footer_about ul li {float: left; padding-right:10px; list-style-image:none; list-style-position:outside; list-style-type:none;}

#navigate {float: left; width: 250px; text-align: left; margin: 16px 0px 0px 0px; padding-left: 65px;}
#navigate h4 {color: #444444; font-size: 18px;}
#navigate.footerSection ul li {border-bottom: 1px solid #2D4C7A; padding:3px; list-style-image:none; list-style-position:outside; list-style-type:none;}
#navigate.footerSection ul li a {color: #444444; text-align:left; font-size:10px; border-bottom:0; text-decoration:none;}

/* ==== END: NEW FOOTER CODE ==== */
/* =============== FOOTER END =============== */






/* ===== BEG: BLOG POSTS.  Brian 8-4-12 ========= */




/* Modify images in blog posts  */
.custom .headline_area img.alignleft {
   /* background: none repeat scroll 0 0 #E7EEEF ;
    padding: 8px;  */
    margin-top: 5px;
    border: 1px solid #B3CDD3; 
}

/* ----- Beg: Change image sizes on all category blog pages.  Needed since Category blog pages using the main image photo from the blog posts (300x300) and not the thumbnail (150x150) ----- */

.cat_psychic-readings .headline_area img.alignleft {
    height: 150px;
    width: 150px;
}

.cat_tarot-readings .headline_area img.alignleft {
    height: 150px;
    width: 150px;
}

.cat_book-reviews .headline_area img.alignleft {
    height: 150px;
    width: 150px;
}

/* ----- End: Change image sizes on all category blog pages. ---- */

/* --- BEG: Make teasers on Blog2 page span full width. Code currently not needed since we are using a custom Blog page and placing posts on Blog page using code from custom_functions.php.  The default blog page was renamed 'Blog2'.  Code from http://webtrainingwheels.com/how-to-make-thesis-teasers-full-column-width/ .  Brian 8-4-12  -----  */

.custom .teaser {
width: 100%;
margin-top: 2em;
padding-top: 2em;
border-top: 1px dotted #bbb;
text-align: justify;
}
.custom .teasers_box {
padding-top: 0;
padding-bottom:0;
border-top: 0;
margin: 0;
}

/* --- END: make teasers on Blog page span full width. --- */

/*--- FOLLOWING CODE AFFECTS POST BELOW CONTENT ON PAGES: Home, Blog, San-Diego-Tarot (hidden), San-Diego-Psychic (hidden) (ENRIQUE 6-6-12) -----*/
#our_posts { background: #fff; border: 1px solid #b3cdd3; padding:12px; }
#our_posts .headline_area { position: relative; top: 0px; left: 0px; margin-bottom: 1em; }
#our_posts .headline_area img.alignleft { margin: 0px 18px 0px 0px;}
#our_posts .headline_area h2 { margin-bottom: 10px; }
#our_posts .entry-title a { color: #023d59; font-weight: bold; }
#our_posts .entry-title a:hover { color: #00acee; }

/* ======= END: HOME PAGE RECENT SETTING CHANGES =========== */

/* ========= END: BLOG POSTS ============ */

/* =====BEG: Breadcrumbs. From http://diythemes.com/thesis/rtfm/breadcrumbs-without-plugins/  ========= */
.custom .breadcrumbs {
	font-family:Verdana,Arial;
	font-size:1.2em;
	padding:1.2em 1em 1em 1em;
	/* border-bottom:1px dotted #666; */
	/* border-top:1px dotted #666; */
	border-top: 1px solid #B3CDD3;
}
.custom .breadcrumbs a {
	color:#cc0000;
	border-bottom:1px dotted #fff;
}
.custom .breadcrumbs a:hover {
	border-bottom:1px dotted #cc0000;
}

/* =====END: Breadcrumbs  ========= */