/*============================================================================

Primary Stylsheet for use with the web site PawsSquad.ca
                                            pawsaheadclub.com

  © Wild Hare Productions 2008. All rights reserved.

Portions of this file are copyright their respective owners.
Copyright notice for these sections is give as appropriate.

============================================================================*/

#container {
	width: 828px;
	margin: 0 auto;
	background-color:white;
}

#masthead {
	width: 100%;
	height: 101px;
	background-color: #3366FF
}

#top_nav { height: 0px; width: 100%; }

#left_col { width: 140px; float:left; text-align:center; margin: 0 auto; }

#right_col {

	width:648px;

	float:right;
	padding: 5px 5px 5px 5px;

	/*
	min-height: 400px;
	font-weight: normal;
*/
	font-family: Verdana;
	text-align: justify;
}

#footer {
	clear:both;
	width: 100%;
	height: 50px;
	color: #000000;
	background-color: #D0D0D0;
	font-size: x-small;
	z-index:10;
}

#footer a { color: #000000;  text-decoration: none; }

#lastupdate {
	font-size: x-small;
	right: 0px;
	text-align: right;
	bottom:0%;
}


/*============================================================================
	Photo-Caption PZ3 CSS
============================================================================*/
.PZ3-l { float:left; margin-right:10px; }
.PZ3-r { float:right; margin-left:10px; direction:rtl; }
  html>/**/body .PZ3-r { position:relative; }
.PZ3zoom { border:1px solid #369; }
.PZ3zoom a:visited { display:block; padding:0; overflow:hidden; text-decoration:none; height:100%; width:100%; }
.PZ3zoom a { display:block; padding:0; overflow:hidden; text-decoration:none; height:100%; width:100%; }
  html>/**/body .PZ3-r a { right:0; }
.PZ3zoom a:hover { position:absolute; z-index:999; padding:0; background:none; cursor:default; height:auto; width:auto;
				   overflow:visible; border:1px solid #369; margin:-1px 0 0 -1px; }
  html>body .PZ3zoom a:hover { margin:-1px -1px 0 -1px; }
.PZ3zoom a img { border:0; height:100%; width:100%; }
.PZ3zoom a:hover img { height:auto; width:auto; border:0; }
a:hover .PZ3cap  { display:block; direction:ltr; font:10pt verdana,sans-serif; margin-top:-3px; background:#369; color:#fff; text-align:left; }
a:hover .PZ3cap { padding:3px 5px; }
.PZ3inr { display:block; padding:2px 5px; }
.noCap a:hover .PZ3cap { display:none; }
.noBdr a:hover { border:0; }
.noBdr { border:0; }
.Lnk a:hover { cursor:pointer; }

/* End Photo-Caption Zoom CSS */ 


/*============================================================================
============================================================================*/

.arrowlistmenu {
	width: 140px; 				/*width of accordion menu*/
}

.arrowlistmenu .menuheader {
	/*CSS class for menu headers in general (expanding or not!)*/
	font: bold 14px Arial;
	color: white;
	background: black url(images/titlebar.png) repeat-x center left;
	margin-bottom: 10px; /* bottom spacing between header and rest of content */;
	text-transform: uppercase;
	padding: 4px 0 4px 10px;
/* header text is indented 10px */	text-decoration: none;
	cursor: pointer;
}

.arrowlistmenu a:visited {
	color: #FFFFFF;
	text-decoration: none;
}

.arrowlistmenu .openheader { 	/* CSS class to apply to expandable header when it's expanded */
	background-image: url(images/titlebar-active.png);
}

.arrowlistmenu ul { 			/* CSS for UL of each sub menu */
	list-style-type: none;
	margin: 0;
	padding: 0;
	margin-bottom: 8px;			/* bottom spacing between each UL and rest of content */
}

.arrowlistmenu ul li { padding-bottom: 2px; /*bottom spacing between menu items*/ }

.arrowlistmenu ul li a {
	color: #A70303;
	background: url(images/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
	display: block;
	padding: 2px 0;
	padding-left: 19px; /*link text is indented 19px*/
	text-decoration: none;
	font-weight: bold;
	border-bottom: 1px solid #dadada;
	font-size: 90%;
}

.arrowlistmenu ul li a:visited {
	color: #A70303;
}

.arrowlistmenu ul li a:hover { /*hover state CSS*/
	color: #A70303;
	background-color: #F3F3F3;
}



/*============================================================================
============================================================================*/

.holder {
	width: 400px;
	margin: 5px;
	padding: 1em;
	border: 1px solid #ddd;
	float: left;
	font-family: Verdana;
	font-size: small;
}
.holder h2 {text-align:left;}
.holder h3 {text-align:left;}
a.hid {color:#000; text-decoration:none; outline-style:none;}
a.hid em {display:none;}
a.hid:hover {text-decoration:none;}
a.hid:focus {background:#fff;}
a.hid:active {background:#fff;}
a.hid:focus span {display:none;}
a.hid:active span {display:none;}
a.hid:focus em {display:block; color:#000; width:100%; font-style:normal; cursor:default;}
a.hid:active em {display:block; color:#000; width:100%; font-style:normal; cursor:default;}
.clear {clear:both;}



/*============================================================================
============================================================================*/
.glossymenu{
margin: 5px 0;
padding: 0;
width: 140px; /*width of menu*/
border: 1px solid #9A9A9A;
border-bottom-width: 0;
}

.glossymenu a.menuitem{
background: black url(images/glossyback.gif) repeat-x bottom left;
font: bold 14px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
width: auto;
padding: 4px 0;
padding-left: 10px;
text-decoration: none;
}

.glossymenu .menuitem:active{ color: white; }
.glossymenu a.menuitem:visited{ color: white; }
.glossymenu a.menuitem .statusicon{ position: absolute; top: 5px; right: 5px; border: none; } /*CSS for icon image that gets dynamically added to headers*/
.glossymenu a.menuitem:hover{ background-image: url(images/glossyback2.gif); }
.glossymenu div.submenu{ background: white; }		/*DIV that contains each sub menu*/
.glossymenu div.submenu ul{ list-style-type: none; margin: 0; padding: 0; } /*UL of each sub menu*/
.glossymenu div.submenu ul li{ border-bottom: 1px solid blue; }

.glossymenu div.submenu ul li a{
	display: block;
	font: normal 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
	color: black;
	text-decoration: none;
	padding: 2px 0;
	padding-left: 10px;
}

.glossymenu div.submenu ul li a:hover{ background: #DFDCCB; color: white; }



/* -------------------------------------------------------------------------- */
/*  Support for more... (accordian.js)                                       */
/* -------------------------------------------------------------------------- */
#accordion { margin:20px 0px; }

h3.toggler {
	cursor: pointer;
	color: #FF0000;
	margin: 0 0 4px 0;
	padding: 3px 5px 1px;
}

p.toggler {
	cursor: pointer;
	color: #FF0000;
	margin: 0 0 4px 0;
	padding: 3px 5px 1px;
}

div.element p, div.element h3 {
	margin:0px;
	padding:4px;
}

blockquote { padding:5px 20px; }