/*
Thanks to Dynamic Drive CSS Library 
URL: http://www.dynamicdrive.com/style/
for the code examples of CSS and JavaScript Gradient Shadow technique and CSS Frames Layouts
*/

.invisibleHR{
	border:0;
	color:#FFFFFF;
	background-color:#FFFFFF;
	visibility:hidden;
}

#dropDownNav{
	background-color: #c3ccff;
	font-size:10px;
	width:94%;
	padding-top: 5px;
}
#dropDownNav a:link{
	color:#323f98;
	text-decoration:none;
}
#dropDownNav a:visited{
	color:#323f98;
	text-decoration:none;
}
#dropDownNav a:hover{
	color:#323f98;
	text-decoration:underline;
}
.dropNavBottom{
	background-image:url(../images/dropNavBottom.png);
	background-repeat: no-repeat;
	background-position: center;
	height:10px;
	width:100%;
}
.innertubeDropDown{
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 20px;	
}

.dropDownSelected{
	background-image: url(../images/dropShadowOver.png);
	background-repeat: no-repeat;
	background-position: center;
	padding-left: 40px;
	padding-top: 6px;
	padding-bottom: 6px;
	color: #38459b;
}

a:link{
	color:#323f98;
	text-decoration:none;
}
a:visited{
	color:#323f98;
	text-decoration:none;
}

a:hover{
	color:#323f98;
	text-decoration:underline;
}

b {
	color: #384798;	
}

body{
	border: 0;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	height: 100%;
	margin: 0;
	max-height: 100%;
	overflow: hidden;
	padding: 0;
}

form table tr {
	vertical-align:middle;
}

h1, h2, h3, h4, h5 {
	color: #384798;
	font-size: 14px;
	margin-bottom: 10px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
}

h2 {
	font-size: 26px;
	margin-bottom: 3px;
}

h3 {
	font-size: 11px;
	margin-bottom:0px;
}

h4 {
	margin-bottom:0px;	
}

h5 {
	font-size: 12px;
	margin-bottom:0px;
}

hr {
	color:	#384798;
	size: 1;
}

p {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;	
}

table {
	border: 0;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0;
	padding: 0;
}

tr {
	vertical-align:top;	
}

ul {
	margin-bottom:0px;
	margin-top:0px;
	padding-top:0px;
	list-style-position: outside;
}


#framecontentLeft{
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 0px; 
	height: 100%;
	overflow: hidden; 
	background-color: #FFF;
	color: #384798;
}

#framecontentTop, #framecontentBottom{
	position: absolute;
	top: auto; 
	left: 0px; /*Set left value to WidthOfLeftFrameDiv*/
	right: 0px; /*Set right value to WidthOfRightFrameDiv*/
	width: auto;
	height: 104px; /*Height of top frame div*/
	overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/
	background-color: #c3ccff;
	color: #384798;
}
#framecontentTop{
	top:16px;
	background-image: url(../images/topBanner.png);/*Banner Image*/
	background-repeat: repeat-x;
	background-position: center;
}
#framecontentBottom{
	top: auto;
	height: 45px; /*Height of bottom frame div*/
	bottom: 0;
}
#framecontentBottom a:link{
	color:#323f98;
	text-decoration:none;
}
#framecontentBottom a:visited{
	color:#323f98;
	text-decoration:none;
}
#framecontentBottom a:hover{
	color:#323f98;
	text-decoration:underline;
}

#maincontent{
	background: #fff;
	overflow: auto; 
	position: fixed; 
	top: 123px; /*Set top value to HeightOfTop plus top nav*/
	bottom: 0px; /*Set bottom value to HeightOfBottom*/
	left: 230px; /*Set left value to WidthOfLeft*/
	right: 0px; /*Set right value to width of right */
}

#maincontentWithSubNav{
	background: #fff;
	overflow: auto;
	position: fixed; 
	top: 150px; /*Set top value to HeightOfTop plus top nav*/
	bottom: 0px; /*Set bottom value to HeightOfBotto*/
	left: 230px; /*Set left value to WidthOfLeft*/
	right: 0px; /*Set right value to width of right */ 
}

#puppy, #kitten{
	z-index: 2;
	position: absolute;
	top: auto;
	bottom: 10px;
	background-repeat: no-repeat;
}
#puppy {
	left: 120px;
	height: 141px;
	width: 106px;
	background-image: url(../images/puppy.png);	
}
#kitten {
	left: 10px;
	height: 108px;
	width: 67px;
	background-image: url(../images/kitten.png);
}

#sideNav{
	position: absolute;
	top:0;
	left:20px;
	width:200px;
	height:100%;
	min-height:610px;
	background-image: url(../images/backNav.png);
	background-repeat: repeat-x;
	background-color: #6f78b7;
	background-position: bottom;
	z-index: 1;
}

#subNav{
	position: absolute;
	top:123px;
	left:0;
	width:100%;
	overflow:hidden;
	background-color:#FFF;
	/*color:#323f98;*/
	color:#FFF;
	font-size:9px;
	/*background-color:#c3ccff;*/
	background-color: #6f78b7;
}
#subNav a:link {
	text-decoration:none;	
	color: #FFF;	
}
#subNav a:visited {
	text-decoration:none;	
	color: #FFF;	
}
#subNav a:hover {
	text-decoration:underline;	
	color: #FFF;	
}

#topNav{
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:16px;
	overflow:hidden;
	background-color:#FFF;
	color:#323f98;
	font-size:9px;
}
#topNav a:link{
	color:#323f98;
	text-decoration:none;
}
#topNav a:visited{
	color:#323f98;
	text-decoration:none;
}
#topNav a:hover{
	color:#323f98;
	text-decoration:underline;
}


.accent{
	border:solid;
	border-color:#D9DFFF;
	border-width:thin;
	color:#2B356A;
	font-style:italic;
	padding:10px;
}

.innertubeBottom{
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 20px;
	margin-left: 230px;
	text-align: right;
	font-size: 9px;
	color: #323f98;
}

.innertubeContent{
	margin-top: 10px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 10px;
}

.innertubeLogo{
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;		
}

.innertubeNavItems{
	margin-top: 20px;
	margin-right: 10px;
	margin-bottom: 50px;
	margin-left: 0px;
	text-align: left;
	font-size: 12px;
}

.innertubeSide{
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;	
}

.innertubeSubNav{
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 233px;
	margin-right: 10px;
	font-size:12px;
}

.innertubeTop{
	margin-top: 3px;
	margin-right: 10px;
	margin-bottom: 3px;
	text-align: right;
}

table.linedTable {
	border-width: 1px;
	border-style: solid;
	border-color: #384798;
	border-collapse: collapse;	
}
table.linedTable td {
	border-width: 1px;
	padding: 3px;
	border-style: solid;
	border-color: #384798;	
}

.navBackOver, .navItem:hover, .navItem:active {
	background-image: url(../images/navBackOver.png);
	background-repeat: no-repeat;
	background-position: center;
	padding-left: 40px;
	padding-top: 6px;
	padding-bottom: 6px;
	color: #38459b;
}
.navBackOver a:link {
	color: #38459b;
	text-decoration:none;
}
.navBackOver a:visited {
	color: #38459b;
	text-decoration:none;
}

.navItem {
	padding-left: 40px;
	color: #FFF;
	padding-top: 6px;
	padding-bottom: 6px;
}
.navItem a:link {
	color:#FFF;	
	text-decoration:none;
}
.navItem a:visited {
	color:#FFF;	
	text-decoration:none;
}

.petfinder {
	position:absolute;
	height:100%;
	width:100%;
}

.sideContent {
	padding-left: 15px;
	width:300px;
}

.shadow{
	position:relative;
	display:inline;
	background:#4753a3;
}

.shadow_inner{
	overflow:hidden;
	position:absolute;
	top: -1000px;
	filter:alpha(Opacity=10); /*modify to change the shade solidity/opacity, same as below*/
	opacity:0.1; /*firefox 1.5 opacity*/
	-moz-opacity:0.1; /*mozilla opacity*/
	-khtml-opacity:0.1; /*opacity*/
}

.shortP {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 3px;
	margin-left: 0px;
	font-size: 3px;
}

.tableHighlight {
	background-color: #c3ccff;
	color: #384798;
	font-weight:bold;
}


/* The following are IE hacks - only IE will read these styles */

* html body
{ 
padding: 120px 0px 0px 0px; /*Set padding for top and bottom*/
}

* html #framecontentTop, * html #framecontentBottom
{
width: 100%;
}

* html #maincontent, * html #maincontentWithSubNav
{ 
height: 100%; 
width: 100%; 
}

* html .innertubeContent
{
	left:0px;
	padding-left:230px;
}

* html .innertubeDropDown{
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;	
}

* html .petfinder
{
	left:0px;
	padding-left:230px;
	
}