/*
Theme Name: Sara's Sanctuary custom
Theme URI: none
Description: A Wordpress theme designed and built from scratch.
Version: 1.0
Author: Josh Cunningham
Author URI: http://joshcanhelp.com/
*/


/*** CSS RESET 

Adapted from Eric Meyer's CSS Reset Reloaded
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ ***/ 

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0;	font-weight: inherit;	font-style: inherit;	font-size: 100%; line-height: 100%;	font-family: inherit;	vertical-align: baseline; }
	
:focus {outline: 0;}

ol, ul {list-style: none;}

table {border-collapse: separate;	border-spacing: 0;}

caption, th, td {	text-align: left;	font-weight: normal;}

img {border: 0;}

b, strong {font-weight: bold;}

blockquote {padding: 10px; background: #ccc; border: 1px solid #aaa; width: 80%; margin: 10px auto; font-style: italic; }

/*** universal styles ***/

h1,h2,h3,h4,h5,h6{font-size:100%; }
h1{font-size:2em;}
h2{font-size:1.7em;}
h3{font-size:1.5em;}
h4{font-size:1.3em;}
h5{font-size:1.1em;}
h6{font-weight:bold;}

ul, ol {list-style:none;}

a img {border: none;}

.code {font:1.2em 'Courier New',Courier,Fixed;}

.clear {clear:both;}

.aligncenter {display:block;margin-right:auto;margin-left:auto;}

.alignleft {margin:8px 8px 8px 20px;float:left;}

.alignright {margin:8px 0 8px 8px;float:right;}

acronym, abbr {cursor:help; border-bottom:1px dashed #999;}

.center{text-align:center;}

.sys-msg {margin: 10px 0; width: 50%; border: #999 1px solid; background: #ccc url(images/checkmark.png) 6px 6px no-repeat; padding: 8px 8px 8px 30px;}

.locksize {clear: both; display: block;}

a.give-link {padding: 6px 8px; color: #333; text-decoration: none; background: #BCD3D4; margin: 0 1px 0 0; border: 1px solid #555; font-family: georgia, 'times new roman', serif; letter-spacing: -1px; }
		a.give-link:hover {background: #DAF5F6;}

/*** header.php styles ***/

body {line-height: 1em; background: #eeeeee url(images/main-bg.png) repeat-x; font-family:  helvetica, arial, sans-serif; font-size: 90%; }

  #wrapper {width: 960px; margin: 0 auto; height: auto; clear: both;}

    #header {position: relative; padding: 50px 0 0 0; }
      
      #top-logo {width: 350px; height: 63px; position: absolute; top: 20px; left: 20px; display: block; background: url(images/saras-logo01.png) no-repeat;} 
      
      #main-nav {width: 500px; height: 30px; margin: 0 0 0 440px; background: url(images/main-nav-bg.jpg) repeat-x; border: 1px solid #11261d; border-right: none;}
        #main-nav li {width: 100px; height: 30px; float: left;  }
          #main-nav li a {width: 98px; height: 23px; padding: 7px 0 0 0; text-align: center; display: block; color: white; text-decoration: none; border-left: 1px solid #3d584b; border-right: 1px solid #11261d;}
          #main-nav li a:hover {background: url(images/nav-float.jpg) repeat-x; border-left: 1px solid #4E6458;}
              
      #animals {width: 100%;;}
        #animals img {width: 120px; height: 120px; margin: 30px 75px 0 0; border: 4px solid #141414;}
        #animals img.last {margin: 0;}
      
      #main-msg {margin: 20px 0; font-size: 1.1em; line-height: 1.4em; font-style: italic; color: black;}
        #main-msg a {color: #444; font-weight: bold; text-decoration: none;} 
          #main-msg a:hover {text-decoration: underline;}
          
    #help-us {margin: 0 auto; padding: 10px 0 20px; background: #ddd; border: 1px solid #aaa;}
      #help-us h2 {margin: 0 0 10px; color: black; font-size: 1.7em; font-weight: bold; text-align: center; letter-spacing: -1px;}
      #help-us p {padding: 16px 45px 26px; line-height: 1.2em; }
      .action-btn {width: 33%; float: left; text-align: center; font-size: 21px;}
		  .action-btn a.give-link {color: #262F2B; border: 1px solid #262F2B; display: block; width: 80%; height: 28px; padding: 6px 0 0 0 ;margin: 0 auto;}
        
    #main-content {padding: 10px 0 50px 20px ; clear: both;}
      #main-content h1 {margin: 10px 0 20px -20px;}
      
    #homepage-text {padding: 0 0 20px 0; font-size: 1.2em;}

/*** content styles for front page, single posts, contact pages, and regular pages ***/
	
	.post-content {padding: 0 20px 0 0; }
    .post-content h2 {margin: 18px 0 4px 20px; font-size: 1.6em; }
    .post-content h3 {margin: 16px 0 4px 20px; font-size: 1.4em; }
    .post-content h4 {margin: 14px 0 4px 20px; font-size: 1.2em; font-weight: bold; }
    .post-content p {padding: 0 20px; margin: 0 0 8px 0; line-height: 1.5em; }
	.post-content strong {line-height: 1.5em; }
    .post-content ul {list-style-type: square; margin: 10px 0 0 60px; line-height: 1.5em; }
    .post-content ol {list-style-type: decimal; margin: 10px 0 0 60px; line-height: 1.5em; }
    .post-content li {margin: 0 0 0.5em 0; line-height: 1.5em; }
    .post-content img {padding: 1px; background: white; border: 5px solid black; }
    .more-link {color: black; font-weight: bold; }
      a:hover.more-link {color: #555;}
    h3#respond {margin: 0 0 10px 0;}
    
    h1#single {margin: 8px 0 10px 0;}
	
	a.post-edit-link {width: 50px; height: 18px; margin: 10px 0 0 0; padding: 4px 0 0 24px; display: block; background: #999 url(images/edit.png) 3px 3px no-repeat; border: 1px solid #444; color: white; text-decoration: none; }
		a.post-edit-link:hover {background: #aaa url(images/edit.png) 3px 3px no-repeat;}
		a.post-edit-link:active {background: #aaa url(images/edit.png) 4px 4px no-repeat;}
	
	img.clear-style {border: none; padding: 0; background-color: transparent;}

/*** front page post styles ***/

.post-wrap {padding: 15px; margin: 15px; border: #bbb 1px solid; background: white; clear: both; }
  .post-wrap h2 {font-size: 1.4em; margin: 0 0 10px 0;}
    .post-wrap h2 a {color: black; text-decoration: none; }
      .post-wrap h2 a:hover {color: #555; text-decoration: underline;}
   .post-wrap p {padding: 6px 0 6px 20px;}

/*** single post styles ***/

.single-post-wrap {padding: 15px; margin: 15px; border: #bbb 1px solid; background: white; clear: both; }
	.single-post-wrap h1#single {margin: 0 10px 10px 10px; }
  .post-meta {text-transform: uppercase; font-size: 0.65em; margin: 10px 0 8px 0; 0 #ddd; color: black; padding: 6px 12px; border-top: #ccc dashed 1px; border-bottom: #ccc dashed 1px;  }
    .post-meta a {color: black; text-decoration: none; font-weight: bold; }
      .post-meta a:hover {text-decoration: underline; }

/*** contact page styles ***/

  .contact-text {width: 58%; float: left;}
    .contact-text p {padding: 6px 0;}
  
  .contact-form {width: 39%; float: left; padding: 90px 0 0 0; }
    .contact-form form {padding: 0 0 0 20px;}
      .contact-form label {margin: 10px 0 3px 0; font-weight: bold;}
      .contact-form textarea {height: 140px;}
      .contact-form input, .contact-form textarea {width: 100%; padding: 4px 0;}
      .contact-form input#saveForm {width: 100px; cursor: pointer;}
      .contact-form input#donate-btn {width: 154px;}
      #field0 {display: none;}
  
    
  .post-nav {width: 100%; padding: 10px 0; font-size: 0.9em; font-weight: bold;}
  .post-nav .alignright {text-align: right; margin-right: 20px; width: 15%; }
  .post-nav .alignleft {text-align: left; width: 15%;}
    .post-nav a {color: black; text-decoration: none;}
      .post-nav a:hover {color: #666;}
	 
   
   #posts-left {width: 80%; float: left;}
   
  
/*** page styles ***/
  
  .wp-caption {font-size: 0.9em; font-style: italic;}
    p.wp-caption-text {padding: 4px; text-align: center;}

  .edit-page {margin: 0 0 20px -22px;}
    .edit-page a {color: black; font-weight: bold;}
	
	#parent-text {width: 690px; float: left; padding: 0 0 60px 0;}
		#menu-box {width: 220px; margin: 100px 0 0 0; padding: 0 0 20px ; float: left; font-size: 0.9em;}
		#menu-box h3 {font-size: 1.3em; margin: 0 0 10px 0;}
		#menu-box ul {list-style: none; padding: 0;}
			#menu-box ul li {margin: 0 0 2px 0; font-size: 1.1em; }
		#menu-box a {display: block; background: #4B5952; padding: 6px 0 6px 6px; color: white; text-decoration: none; }
			#menu-box a:hover, #menu-box li.current_page_item a {background: #6f857a;}
  
/*** all Help Sara's page styles ***/
	
  	#donate-right {width: 35%; float: left; margin: 10px 20px 0 0; padding: 24px 10px 10px ; background: white; border: 1px #ddd solid; }	
		#donate-right h2 {font-size: 1.8em; margin: 10px 0; }
		#donate-right p {font-size: 0.9em; line-height: 1.5em; margin: 0 0 12px 8px;}
		#help-saras td {width: 32%; padding: 0 10px 20px 0;}
		#help-saras a {font-size: 0.9em; color: black;}
			#help-saras a.give-link, .post-content a.give-link {font-size: 18px; }
			#donate-right a.give-link {font-size: 25px; }
	.vol-app {width: 80px; float: right; padding: 20px 10px 10px; margin: 0 0 0 30px; border: 1px solid #ccc; background: white;}
		.vol-app a {display: block; width: 80px; height: 40px; padding: 90px 0 0 0; background: url(images/pdf-icon.jpg) no-repeat; font-weight: bold; text-decoration: none; color: black; font-size: 0.8em; line-height: 1.6em;}
			.vol-app a:hover {text-decoration: underline; }
	
			
	a.more-help {width: 220px; height: 26px; color: white; padding: 12px 0 0 0; display: block; background: url(images/button-bg3.png) 0 -76px no-repeat; text-decoration: none; text-align: center; font-weight: bold}
        	a.more-help:hover {background: url(images/button-bg3.png) 0 -38px no-repeat; color: black; }
			
	#peSiteTargetDiv984786708 {float: left !important; display: inline !important; margin: 0 20px 10px 10px !important; font-family: Arial, Helvetica, sans-serif !important;}
		#peSiteTargetDiv984786708 div {padding-top: 10px !important; background-image: none !important;}
		#peSiteTargetDiv984786708 div div { font-family: Arial, Helvetica, sans-serif !important;}
			#peSiteTargetDiv984786708 div div a {text-decoration: none !important; line-height: 1.2em; }
				#peSiteTargetDiv984786708 div div a:hover {text-decoration: underline !important;}
		
/*** sidebar.php styles ***/

#sidebar {width: 17%; padding: 10px; float: left; font-size: 0.8em;}
  #sidebar h5 {font-size: 1.6em; margin: 0 0 10px 0; }
  #sidebar strong {line-height: 1.3em}
  #sidebar p {margin: 0 0 10px 0; line-height: 1.3em; }
  #sidebar ul, #sidebar .textwidget {margin: 6px 0 30px 0; width: 100%;}
  	#sidebar li {margin: 2px 0 0 0; }
  		#sidebar ul li a {display: block; background: #4B5952; padding: 6px 0 6px 6px; color: white; text-decoration: none; }
    		#sidebar ul li a:hover {background: #6f857a;}
    #sidebar .aktt_tweets a {background: transparent; color: #444; text-decoration: underline; display: inline; padding: 0;}
    #sidebar .aktt_tweets li {margin: 6px 0 0 0; }
    #sidebar .aktt_tweets ul {padding: 0;}
    #twitter a, #twitter a:hover {background: transparent; border: none;}
	
	#sidebar #menu-box {float: none; margin: 0}

#search {padding: 0 0 30px 0;}

/*** footer.php ***/

#foot-help {width: 100%; clear: both; float: left; margin: 20px 0; }

#footer {position: relative; width: 100%; clear: both; padding: 20px 0; background: #4B5952; border: 1px solid #3B3B3B; font-size: 0.9em; text-align: center}
  #footer p {width: 960px; margin: 0 auto; padding: 8px 0; color: white; } 

/*** 404.php styles ***/

#404 {}

/*																							
|	WordPress Plugin: WP-PageNavi 2.40									
|	Copyright (c) 2008 Lester "GaMerZ" Chan									
|																							
|	File Written By:																	
|	- Lester "GaMerZ" Chan															
|	- http://lesterchan.net													

*/

div.wp-pagenavi {margin-top: 50px; height: 60px; font-size: 0.8em}

.wp-pagenavi a, .wp-pagenavi a:link {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid black;
	color: black;
	background: white;

}
.wp-pagenavi a:visited {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid black;
	color: black;

}
.wp-pagenavi a:hover {	
	border: 1px solid black;
	color: black;
	font-weight: bold; 
	background: #ffffff;

}
.wp-pagenavi a:active {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid black;
	color: black;

}
.wp-pagenavi span.pages {
	padding: 2px 4px 2px 4px; 
	margin: 2px 2px 2px 2px;
	color: #000000;
	border: none; 
	background: transparent;

}
.wp-pagenavi span.current {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	font-weight: bold;
	color: #000000;
	border: none; 
	background: transparent;

}
.wp-pagenavi span.extend {
	padding: 2px 4px 2px 4px; 
	margin: 2px;	
	color: #000000;
	border: none; 
	background: transparent;

}

/** NGGallery Styles **/

/*
CSS Name: Default Styles
Description: NextGEN Default Gallery Stylesheet
Author: Alex Rabe
Version: 1.50

This is a template stylesheet that can be used with NextGEN Gallery. I tested the
styles with a default theme Kubrick. Modify it when your theme struggle with it,
it's only a template design

*/

/* ----------- Album Styles Extend -------------*/

.ngg-albumoverview {
	margin-top: 10px;
	width: 100%;
	clear:both; 
	display:block !important;
}

.ngg-album {
    height: 100%;
    padding: 5px;
    margin-bottom: 5px;
    border: 1px solid #fff;
}

/* IE6 will ignore this , again I hate IE6 */
/* See also http://www.sitepoint.com/article/browser-specific-css-hacks */
html>body .ngg-album {
    overflow:hidden;
    padding: 5px;
    margin-bottom: 5px;
    border: 1px solid #cccccc;
} 

.ngg-album {
	overflow: hidden;
	padding: 5px;
	margin-bottom: 5px;
	border: 1px solid #cccccc;
}

.ngg-albumtitle {
	text-align: left;
 	font-weight: bold;
	margin:0px;
	padding:0px;
	font-size: 1.4em;
	margin-bottom: 10px;
}

.ngg-thumbnail {
	float: left;
	margin-right: 12px;
}

.ngg-thumbnail img {
	background-color:#FFFFFF;
	border:1px solid #A9A9A9;
	margin:4px 0px 4px 5px;
	padding:4px;
	position:relative;
}

.ngg-thumbnail img:hover {
	background-color: #A9A9A9;
}

.ngg-description {
	text-align: left;
}

/* ----------- Album Styles Compact -------------*/

.ngg-album-compact {
	float:left;
	height:180px;
	padding-right:6px !important;
	margin:0px !important; 
	text-align:left;
	width:120px;	
}

.ngg-album-compactbox {
	background:transparent url(albumset.gif) no-repeat scroll 0%;
	height:86px;
	margin:0pt 0pt 6px !important;
	padding:12px 0pt 0pt 7px !important;
	width:120px;
}


.ngg-album-compactbox .Thumb {
	border:1px solid #000000;
	margin:0px !important;
	padding:0px !important;
	width:91px; 
	height:68px;
}

.ngg-album-compact h4 {
	font-size:15px;
	font-weight:bold;
	margin-bottom:0px;
	margin-top:0px;
	width:110px;
}

.ngg-album-compact p {
	font-size:11px;
	margin-top:2px;
}

/* ----------- Gallery style -------------*/

.ngg-galleryoverview {
	padding-left: 15px;
	overflow: hidden;
	margin-top: 10px;
	width: 100%;
	clear:both; 
	display:block !important;
}

.ngg-galleryoverview .desc {
/* required for description */
   margin:0px 10px 10px 0px;
   padding:5px;
}

.ngg-gallery-thumbnail-box {
	float: left;
}

.ngg-gallery-thumbnail {
	float: left;
	margin-right: 10px;
	text-align: center;
}

.ngg-gallery-thumbnail img {
	background-color:#FFFFFF;
	border:1px solid #A9A9A9;
	display:block;  
	margin:4px 0px 4px 5px;
	padding:4px;
	position:relative;
}

.ngg-gallery-thumbnail img:hover {
	background-color: #A9A9A9;
} 

.ngg-gallery-thumbnail span {
	/* Images description */
	font-size:90%;
	padding-left:5px;
	display:block;
}

.ngg-clear {
	clear: both;
}

/* ----------- Gallery navigation -------------*/

.ngg-navigation {
	font-size:0.9em !important;
	clear:both !important;
	display:block !important;
	padding-top:15px;
	text-align:center;
	
}

.ngg-navigation span {
	font-weight:bold;
	margin:0pt 6px;
}

.ngg-navigation a.page-numbers,
.ngg-navigation a.next,
.ngg-navigation a.prev, 
.ngg-navigation span.page-numbers,
.ngg-navigation span.next,
.ngg-navigation span.prev {
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-navigation a.page-numbers:hover,
.ngg-navigation a.next:hover,
.ngg-navigation a.prev:hover, 
.ngg-navigation span.page-numbers:hover,
.ngg-navigation span.next:hover,
.ngg-navigation span.prev:hover {
	background-color: #0066CC;
	color: #FFFFFF !important;
	text-decoration: none !important;
}

/* ----------- Image browser style -------------*/

.ngg-imagebrowser {
}

.ngg-imagebrowser h3 {
	text-align:center;
}

.ngg-imagebrowser img {
	border:1px solid #A9A9A9;
	margin-top: 10px; 
	margin-bottom: 10px; 
	width: 100%;
	display:block !important;
	padding:5px;
}

.ngg-imagebrowser-nav {
	padding:5px;
	margin-left:10px;	
}

.ngg-imagebrowser-nav .back {
	float:left;
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-imagebrowser-nav .next {
	float:right;
	border:1px solid #DDDDDD;
	margin-right:3px;
	padding:3px 7px;
}

.ngg-imagebrowser-nav .counter {
	text-align:center;
	font-size:0.9em !important;
}

.exif-data {
  	margin-left: auto !important;
    margin-right: auto !important;	
}

/* ----------- Slideshow -------------*/
.slideshow {
	margin-left: auto; 
	margin-right: auto;
	text-align:center;
	outline: none;	
}

.slideshowlink {
	
}

/* ----------- Single picture -------------*/
.ngg-singlepic {
	background-color:#FFFFFF;
	display:block;  
	padding:4px;
}

.ngg-left {
	float: left;
	margin-right:10px;
}

.ngg-right {
	float: right;
	margin-left:10px;
}

.ngg-center {
  	margin-left: auto !important;
    margin-right: auto !important;
}

/* ----------- Sidebar widget -------------*/
.ngg-widget,
.ngg-widget-slideshow {
	overflow: hidden;
	margin:0pt;
	padding:5px 0px 0px 0pt;
}

.ngg-widget img {
	border:2px solid #A9A9A9;
	margin:0pt 2px 2px 0px; 
	padding:1px; 
}

/* ----------- Related images -------------*/
.ngg-related-gallery {
	background:#F9F9F9;
	border:1px solid #E0E0E0;
	overflow:hidden;
	margin-bottom:1em;
	margin-top:1em;
	padding:5px;
}
.ngg-related-gallery img {
	border: 1px solid #DDDDDD;
	float: left;
	margin: 0pt 3px;
	padding: 2px;
	height: 50px;
	width:  50px;
}

.ngg-related-gallery img:hover {
	border: 1px solid #000000;
} 

/*** Lightbox CSS ***/

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }