/*
Theme Name: Custom Theme
Theme URI: 
Description: 
Version:
Author: 
Author URI: 
Tags: Custom Theme
*/

@import "style/css/reset.css";

html 			{ background:#fff url(images/bg/gradient.jpg) repeat-x; } /* required for dual background image */
body 			{ font-family:Georgia, 'Times New Roman', Palatino, 'Palatino Linotype', Times, serif; 
				  margin:0; 
				  padding:0;
			      background:url(images/bg/full_bgd.jpg) no-repeat center top; 
				  width:100%; 
				  display:table; 
				  color:#76645C; 
				  text-align:left; 
				  letter-spacing:0px; }
:link img 		{ border:none }
a 				{ outline:none;}
.hidden 			{ display:none; }
br.clear 		{ clear:both; display:block; height:1px; margin:-1px 0 0 0 }

div.clear {clear; both; }

/* Presentational classes generated by WordPress. http://codex.wordpress.org/CSS */
.aligncenter 	{ display:block; margin:0 auto }
.alignleft 		{ float:left }
.alignright 		{ float:right }
.wp-caption 		{ border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px } 

/* -------- COLOR SCHEME
			text:			#76645C;
			headings:		#000;
			links:			#9D0A0E;
			background:		#fff;
			dk blue border:	#5D7B83;
			blue back:		#7297A1;
*/

/* -------- TYPOGRAPHY
			p    	all posts etc.
			h1 		all paragrahs, posts, comments, etc. 
			h2		titles: 404 Error, Archives for, Search Results, Sidebar headings
			h3		Comments: How many replies, leave reply 
					Permalink on archive page,
*/

/* ==== universal typography ==== */
p,h2,h3,h4,h5,h6 { text-align:left; }

/* paragraphs */
p 		{ font-size:14px; letter-spacing:.5px; padding:10px 0; margin:0px; line-height:1.4em; }

/* site logo */
h1 		{ width:500px; height:200px; text-indent:-9999px; } 
h1 a 		{ width:500px; height:200px; display:block; }

/* headings */
h2 		{ font-size:26px; font-weight:normal; margin:0px 10px 5px 0px; }
h3 		{ font-size:18px; font-weight:bold; margin:0px 10px 5px 0px;}
h4 		{ font-size:16px; font-weight:bold; margin:0px 10px 5px 0px;}
h5		{ font-size:16px; font-weight:normal; margin:0px 10px 5px 0px;}
h5		{ font-size:14px; font-weight:bold; margin:0px 10px 5px 0px;}
h6		{ font-size:14px; font-weight:normal; margin:0px 10px 5px 0px;}

a:link, 
a:visited 	{ color:#9D0A0E; text-decoration:none; }
a:hover 		{ color:#9D0A0E; text-decoration:underline }

/* ul list items */
ul 			{ margin:10px 0 0 0; list-style:disk; }
ul li			{ display:list-item; font-size:14px; text-align:left; padding:3px 0; margin-left:30px; }
ul li a		{  }
/* ordered list items */
ol 			{ margin:10px 0 0 0; list-style:decimal; }
ol li			{ font-size:14px; text-align:left; padding:3px 0; margin-left:30px; }
ol li a		{  }
/* other */
blockquote	{ padding:5px 30px 5px 30px; border-left:10px solid #99D6FF; border-right:10px solid #99D6FF;
			  border-top:2px solid #99D6FF; border-bottom:2px solid #99D6FF; }

/*======================= Default layout ======================= */
#wrapper 			{ width:1200px; margin:0 auto; overflow:hidden; } /* wider for paw placement */
#header 				{ width:100%; height:225px; position:relative; }
#content-wrap		{ width:950px; margin:20px auto 0 auto; position:relative; } /* actual page width of content and sidebar */
#main-content-wrap	{ width:688px; background:#7297A1; padding:8px; margin-right:20px; float:left; overflow:hidden; border:1px solid #5D7B83; } /* allows the blue border */
#main-content		{ background:#fff; min-height:520px; border:1px solid #5D7B83; padding:100px 16px 20px 16px; }
#sidebar-wrap 		{ width:191px; background:#7297A1; position:relative; z-index:10; padding:8px 10px 8px 8px; float:left; border:1px solid #5D7B83; }
#sidebar			{ background:#fff; min-height:590px; border:1px solid #5D7B83; padding:10px; }
#footer 				{ width:100%; height:244px; position:relative; margin:-40px 0 0 0; padding:0; background:url(images/bg/footer_full_width.png) no-repeat center top; }


/* ======================= header ====================== */
#logo				{ float:left; margin:0 0 0 95px; width:605px; }
#logo p				{ margin:0px 0 0 38px; color:#000; }
#photo-area			{ float:left; margin-left:0px; }

/* slideshow frame */
img#pic-frame				{ position:absolute; width:416px; height:271px; top:-5px; right:120px; z-index:100; }
/* slideshow */
#slideshow-wrapper			{ position:absolute; width:365px; height:232px; top:-5px; right:150px; overflow:hidden; }
#slideshow					{ position:relative; width:365px; height:232px; }
#slideshow img 				{ position:absolute; top:0; left:0; z-index:8; opacity:0.0; }
#slideshow img.active 		{ z-index:10; opacity:1.0; }
#slideshow img.last-active 	{ z-index:9; }

/* ======================= Universal / Random ====================== */
img#corner-bone			{ position:absolute; top:-7px; left:-44px; } /* the dog bone in the corner of each page */
/* light blue title area - besure to see the font replacement css at bottom */
.page-title h2			{ position:absolute; top:43px; left:-23px; padding:4px 0 0 20px; height:45px; background:#99D6FF url(images/bg/title_gradient.gif); border:1px solid #88B7D3; }
.page-title h2 a			{ margin:0px 40px 0px 0px; line-height:49px; }
.page-title h2 a:hover	{ text-decoration:none; }
.page-title img			{ position:absolute; top:94px; left:-23px; }
/* span for pet of the month title */
span.potm				{ display:block; width:658px; height:33px; background:url(images/bg/pet_of_the_month.jpg) no-repeat 0 0; padding:6px 0 0 210px;
						  margin:5px 0; color:#000; font-size:16px; }
/* contact form */
form.wpcf7-form	input,
form.wpcf7-form	textarea	{ padding:5px; font-family:Georgia, serif; }

/* ------------------ Drop Down Navigation 
--------------------- Use div id="menu", ul class="nav" 
------------------------------------------------------------- */
/* Menu */
.nav 				{ line-height:1; width:165px; padding:0; margin:10px 0; }
.nav, .nav * 		{ list-style:none; margin-left:0; }
.nav li 				{ padding:0; position:relative; border-bottom:dashed 2px #C4D8B0; }
.nav ul li 			{ width:100%; }
.nav a 				{ color:#9D0A0E; display:block; position:relative; padding:8px 10px; text-transform:uppercase; }
/* Hides items under top menu */
.nav ul 				{ position:absolute; top:-9999em; width:20em; /* left offset of submenus need to match (see below) */ }
/* Shows submenus */
.nav li:hover ul, .nav li.nav-hover ul 	{ left:-1px; top:29px; /* match top ul list item height */ z-index: 99; } /* Hides all sub items (4 levels deep) */
.nav li:hover li ul, .nav li.nav-hover li ul, .nav li li:hover li ul, .nav li li.nav-hover li ul, .nav li li li:hover li ul, .nav li li li.nav-hover li ul { top:-999em; }
/* On :hover, displays all sub items (4 levels deep) */
.nav li li:hover ul, .nav li li.nav-hover ul, .nav li li li:hover ul, .nav li li li.nav-hover ul, .nav li li li li:hover ul, 
.nav li li li li.nav-hover ul { left:20em; /* match .nav ul width */ top: -1px; }
/* Default Skin */
.nav 				{  }
.nav ul 				{  }
.nav ul li a 			{  }
.nav li:hover ul,
.nav li.nav-hover ul 	{ background:#fff; } 							/* overall ul color for drop 1 */
.nav a:hover 		{ text-decoration:underline; } 		/* background color for all li links on hover */
.nav ul a 			{ border-right:none; }
.nav li:hover, 
.nav li.nav-hover,
.nav a:focus 		{  }


/* ======================= Sidebar ====================== */
.sidebar-module			{ margin:20px 0 20px 0; text-align:center; }
.sidebar-module h2		{ text-indent:-9999px; margin-left:-34px; }
h2.store				{ width:240px; height:54px; background:url(images/bg/visit_our_store.jpg); } /* for later activation */
h2.classes				{ width:240px; height:53px; background:url(images/bg/upcoming_classes.jpg); }
h2.classes a				{ display:block; width:240px; height:53px; }
h2.events               { width:240px; height:53px; background:url(images/bg/upcoming_events.jpg); }
h2.events a				   { display:block; width:240px; height:53px; }
.sidebar-module ul		{ list-style:none; padding:0px 0 10px 0; margin:0; }
.sidebar-module ul li		{ text-align:center; padding:10px 0 10px 0; margin:0; border-bottom:dashed 2px #C4D8B0; }
.sidebar-module ul li a	{ font-size:12px; }

/* ======================= Footer ======================= */
.centering-div		{ margin-left:50%; } /* faux centering point */
#footer-content 		{ width:660px; margin:0 0 0 -240px; padding-top:103px; overflow:hidden; } /* negative margin places content back in place */
#footer-content	p	{ width:400px; color:#34373B; padding-top:9px; font-size:12px; float:left; }
#footer-content img	{ float:right; }

/* ======================= Classes / Events ======================= */
ul.class-list				{ list-style:none; margin:10px 0 0 0; clear: both;}
ul.class-list li				{ display:block; float:left; padding: 5px 0; border-bottom:dashed 2px #C4D8B0; margin-left:0; clear: both;}
ul.class-list li.prev-event	{ background:#f2f2f2; }
ul.class-list li.titles:hover	{ background:#fff; }
ul.class-list li:hover		{ background:#EBF0F0; }
ul.class-list li a:link,
ul.class-list li a:visited	{ padding:0; display:block; }
ul.class-list li a:hover		{ text-decoration:none; }
span.the-title				{ display:block; float:left; width:330px; }  /* set widths for listings */
span.the-date				{ display:block; float:left; width:170px; }
span.the-time				{ display:block; float:left; width:150px; }


/* ======================= Posts ====================== */
.post 				{ overflow:hidden; margin:0px; }
p.meta				{ font-size:1em; width:20em; padding:3px 10px; } /* author and date */
div.exceprt p		{ padding:10px 20px 5px 0px; } /* archive and search div */
p.tags				{ padding:5px 20px 5px 0px; }


/* ======================= Photos (single.php) ====================== */
/* lists the A-B etc. */
#sub-cats				{ margin:10px 0; }
#sub-cats a				{ padding:0px 10px; }
.photo-cat-list ul		{ margin:0 0 25px 0; padding:0 0 25px 0; } 
.photo-cat-list ul li		{ float: left; display:block; list-style-type:none; margin:0; padding:0 10px 0 20px; background:url(images/bg/li_paw.gif) no-repeat 0 0; }

/* ======================= Archive (only for photos as of now) ====================== */
.album-archive			{ width:170px; height: 160px; padding: 0 10px; float:left; overflow:hidden; }
.album-display ul		{  }
.album-display ul li		{ list-style-type:none; margin:0; padding:0 10px 10px 20px; background:url(images/bg/li_paw.gif) no-repeat 0 0; }

/* ======================= Search ======================= */
#search-area			{ text-align:left; padding:0px 0px 0px 0px; } /* the div holding the search area */
input#s 					{ width:180px; height:16px; padding:3px; border:1px solid #c2c2c2; } /* search text area */
input#s:focus		 	{ border:1px solid #3d3d3d; }
input#searchsubmit 		{ display:none; width:22px; height:23px; position:relative; top:5px; left:3px; } /* style for custom button */


/* ======================= Comments List ======================= */
h3#comments				{  } /* leave a reply text */
/* the whole list */
ol.commentlist			{ border:1px solid #c7c7c7; margin:0px 0px 20px 0px; }

/* enclosing class for comment */
ol li.comment				{ }
ol li.even				{ } /* optional */
ol li.odd					{ } /* optional */

	/* the comment */
	div.comment-body		{ position:relative; border:1px solid #c7c7c7; margin:8px 20px; padding:10px; overflow: hidden; }

		div.comment-author 				{ width:60px; float:left; padding:0px 20px 10px 0px; }
		div.comment-author img.avatar 	{ display:block; } 		/* make sure width matches gravatar width */
		div.comment-author cite			{ }						/* link for commenter */
		div.comment-author span.says		{ display:none; } 		/* removes the word "says" */
		div.comment-meta					{ font-size:.9em; margin-left:80px; padding:0px 20px 4px 0px; } 	/* date of comment NOTE: matches the margin of the li p */ 

/* the comment text NOTE: check ie6 styling if changed! */
.comment-body p 			{ margin-left:80px; padding:0px 5em 0px 0px; } /* right border to not overlap reply NOTE: matches the margin of the date */
div.reply				{ position:absolute; width:4em; right:0; bottom:0; background:#dedede; padding:4px; text-align:center; margin:10px 0px 0px 10px; 
						  border-top:1px solid #c7c7c7; border-left:1px solid #c7c7c7;}
/* additional styling for LEVELS */
ul.children li.depth-2	{ margin:0px 0px 0px 30px; }
ul.children li.depth-3	{ margin:0px 0px 0px 60px; }
ul.children li.depth-3 .reply	{ display:none; } /* NOTE: remove the reply link at the depth level for replies or part of the link will show!! */


/* ======================= Comment Form ======================= */
form#commentform 			{ margin:10px 0px 10px 0px; border:1px solid #c7c7c7; padding:10px 0px 10px 20px; } /* the whole form area */

/* text input areas */
#commentform input, 			
#commentform textarea 			{ margin:5px 0px; padding:5px; border:1px solid #c7c7c7; }

/* text input areas with focus */
#commentform input:focus, 			
#commentform textarea:focus	{ border:1px solid #3d3d3d; }
#commentform label 			{ padding:5px; }
#commentform label span		{ font-size:.8em; } /* required text */
#comment 					{ margin:10px 0px 10px 0px; } /* comment text area */
#commentform input#submit	{ background:#c7c7c7; cursor:pointer; }


/* ======================= Contact Form ======================= */
form#form_mailer					{ margin-top:20px; }
form#form_mailer p				{ margin:5px 0px; }
form#form_mailer label				{ display:block; padding:0px 0px 3px 0px; }
form#form_mailer input				{ width:200px; padding:3px; }
form#form_mailer input.checkbox	{ width:5%; margin-right:10px; }
form#form_mailer input#submit		{ width:6em; }
form#form_mailer textarea:focus, 
form#form_mailer input:focus 		{ border: 2px solid #5D7B83; }
form#form_mailer select			{ padding:2px; }
form#form_mailer textarea			{ font-family:arial; font-size:14px; }
span.required					{ color:#FF2424; font-style:italic; }
textarea#Message					{ width:97%; height:220px; }
span.form-hints					{ font-size:12px; color:#555; }


/* ======================= FONT REPLACEMENT ======================= */
.font-bg		{ background:url(images/bg/fonts.jpg); float:left; width:34px; height:40px; overflow:hidden; }
.letter-a		{ background-position:0 0; }
.letter-b		{ background-position:-36px 0; }
.letter-c		{ background-position:-69px 0; }
.letter-d		{ background-position:-103px 0; }
.letter-e		{ background-position:-137px 0; }
.letter-f		{ background-position:-170px 0; }
.letter-g		{ background-position:-206px 0; }
.letter-h		{ background-position:-240px 0; }
.letter-i		{ background-position:-281px 0; width:20px; }
.letter-j		{ background-position:-314px 0; width:25px; }
.letter-k		{ background-position:-344px 0; width:30px; }
.letter-l		{ background-position:-382px 0; width:25px; }
.letter-m		{ background-position:-410px 0; width:41px; } /**/
.letter-n		{ background-position:-454px 0; }
.letter-o		{ background-position:-488px 0; }
.letter-p		{ background-position:-524px 0; width:29px; }
.letter-q		{ background-position:-555px 0; }
.letter-r		{ background-position:-593px 0; width:29px; }
.letter-s		{ background-position:-625px 0; }
.letter-t		{ background-position:-659px 0; width:30px; }
.letter-u		{ background-position:-692px 0; }
.letter-v		{ background-position:-724px 0; width:32px; }
.letter-w		{ background-position:-759px 0; width:42px; } /**/
.letter-x		{ background-position:-803px 0; }
.letter-y		{ background-position:-836px 0; }
.letter-z		{ background-position:-871px 0; }
.letter-qt2		{ background-position:-910px 0; width:20px; } /* " */
.letter-qt1		{ background-position:-945px 0; width:20px; } /* ' */
.letter-com		{ background-position:-1012px 0; width:20px; } /* , */
.letter-Lp		{ background-position:-1042px 0; width:20px; } /* ( */
.letter-Rp		{ background-position:-1079px 0; width:20px; } /* ) */
.letter-space	{ background-position:-1104px 0; width:15px; } /* space */