﻿#gridover 
{
    position: absolute;
    background: url(images/grid-overlay.png) top center repeat-y;
    width: 100%;
    height: 300%;
}



/* Browser Reset (YUI)
*************************************/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {  
	margin:0; 
	padding:0; 
} 

table 
{ 
	border-collapse:collapse; 
	border-spacing:0; 
}

fieldset,img 
{  
	border:0; 
} 

ul 
{ 
	list-style:none; 
} 

h1,h2,h3,h4,h5,h6 
{ 
	font-size:100%; 
	font-weight:normal; 
} 


/*************************************
ASPCA Pet Health Insurance Website
Version 4.0
*************************************/

body {
    background:#fff;
    line-height:1.95em;
	font-family: Lucida Sans, Lucida Grande, Arial, Sans-Serif;
	font-size: 14px;
    color:#444;
}

/* HEADINGS
*************************************/


h1, h2, h3, h4, h5, h6 {
	font-family: Myriad Pro, Helvetica, Arial, Sans-Serif;

}

h1 {
	padding: 0 0 .5em 0;
	margin: 0 0 .5em 0;
	font-size: 1.75em;
	border-bottom: 1px dotted #dddbd6;
	color: #666;
}

#innercontent h1 {
	padding: .5em 0 0 0;
	margin: 0 0 .25em 0;
	font-size: 2.2em;
	border-bottom: 1px solid #eee;
	font-weight: bold;
}

h1 span {
	font-family:  Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-transform: uppercase;
}

h2 
{
	font-size: 1.35em;
	font-weight: bold;
	color: #4d4d4d;
}


h3 {
	font-size: 1.25em;
}

h4 
{
    font-size: 1.1em;
}

h5 
{
    background-color: #6099db;
	color: #ffffff;
	padding: 4px 0 4px 5px;
	border-bottom: 3px solid #f0f0f0;
	font-size: 1.1em;
}

/* TEXT FORMATING
*************************************/

p {
	margin: 0 0 1.5em 0;

}

a:link, a:hover, a:visited, a:active {
	color: #2e63a0;
}

a:hover {
	text-decoration: none;
}

.white {
	color: #ffffff;
}

.orange {
	color: #ff6600;
}

.grey {
	color: #565656;
}

.one {
	width: 80px;
}

.two {
	width: 160px;
}

#wrapper {
	margin: 0 auto;
	width: 973px;
	padding: 0 0;
}

/* HEADER NAVIGATION
*************************************/

#topbar 
{
    height: 28px;
    -moz-border-radius: 0 0 3px 3px;
    -webkit-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
    float: right;
}

#topbar h2 
{
    float: left;
    font-style: normal;
    color: #444;
    padding-left: 8px;
    font-weight: bold;
}


#utils {
	height: 25px;
	padding: 2px 8px 2px 8px;
	float: right;
	margin-left: 300px;
	font-family: Myriad Pro, Helvetica, Arial, Sans-Serif;
}

#utils li {
	float: right;
	margin: 0 0 0 10px;
	padding: 0 10px 0 0;
	list-style: none;
	font-size: 10px;
	font-weight: bold;
	border-right: 1px solid #d6e4ea;
	height: 22px;
	

}

#utils li.members
{
    padding-right: 0;
    border-right: none;
    
}



#utils li a {
	text-transform: uppercase;
	color: #0c8eca;
}



#header 
{
    padding-top: 10px;
	height: 68px;
	clear: both;
}

.logo 
{
    float: left;
    margin: 5px 0 0 0;
}

#rightheader {
	float: right;
	text-align: right;
	margin: 8px 0 0 0;
	width: 42%;
}

#rightheader #phone 
{
    float: left;
    text-align: center;
    padding: 0 15px;
    margin:  0 15px;
    border-right: 1px dotted #ccc;

    line-height: 1.05em;
}

#rightheader #online 
{
    float: right;
}

#rightheader #online a 
{
    display: block;
    color: #71a7bd;
}

#rightheader #online a.retrieve 
{
    text-transform: uppercase;
    font-size: 9px;
    padding-top: .0;
    text-align: center;
}

#rightheader h2 {
	font-size: 19px;
	font-family: Lucida Sans, Lucida Grande, Sans-Serif;
	margin: 0 0 0 0;
	line-height: 1.45em;
	color: #444;
}

#rightheader h4 {
		color: #777;
		font-size: 10px;
		padding-top: 0;
		text-transform: uppercase;
		font-family: Lucida Sans, Lucida Grande, Sans-Serif;
}

#rightheader h6 {
		color: #999;
		font-size: 10px;
		font-weight: bold;
		padding-top: 0;
		text-transform: uppercase;
		font-family: Lucida Sans, Lucida Grande, Sans-Serif;
}

#navigation 
{
    height: 36px; 
    padding: 3px 0 0 0;  
    margin: 5px 0 10px 0; 
    font-size: 15px; 
    /*background: url(images/new-nav-bg.png) -1px 0 no-repeat;*/
    background: #ef770a;
    border-top: 3px solid #f19541;
    border-bottom: 3px solid #f19541;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			15em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
	font-weight: bold;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.05em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
}

 .sf-menu li a {
	border-right:	1px solid #e99c58;
	font-weight:  bold;
	padding: 		.8em 2em;
	font-size: 12px;
	text-shadow: 1px 1px #b65b09;
	-webkit-text-shadow: 1px 1px #b65b09;
	-moz-text-shadow: 1px 1px #b65b09;
	text-decoration:none;
	text-transform: uppercase;
	background: url(images/down-arrow.png) center 22px no-repeat;
}



.sf-menu a.last {
	border-right: none;
}


.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#fff;
}


.sf-menu li {
	background:		none;
}
.sf-menu li li {
	background:		#d65600;
	border: none;
}

.sf-menu li li a {
	border-bottom: 1px dotted #f17c2d;
	border-right: 1px solid #f17c2d;
    background: url(images/arrow-bg.png) 6px 5px no-repeat;
	font-size: 12px;
	text-shadow: none;
	-moz-text-shadow: none;
	-webkit-text-shadow: none;
	text-transform: capitalize
}

.sf-menu  li ul 
{
    -moz-box-shadow: 3px 4px 8px #444;
    -webkit-box-shadow: 3px 4px 8px #444;
    box-shadow: 3px 4px 8px #444;
    border-bottom: 1px solid #f17c2d;
}

.sf-menu li li a:hover, .sf-menu li li:hover, .sf-menu li.sfHover {
background: #e6640e;
}


.sf-menu li li li {
	background:		#9AAEDB;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline:		0;
	background: #e6640e ;
	-webkit-text-shadow: none;
	-moz-text-shadow: none;
	text-shadow: none;

}

.sf-menu li li a:hover 
{
    background: url(images/arrow-bg.png) 6px 5px no-repeat;
}


/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
	-moz-box-shadow: 4px 4px #000;
}




/* FOOTER
*************************************/
#footer
{
    padding: 0 0 3em 0;
}

#footer ul li.section 
{
    float: left;
    width: 232px;
    margin: 1.5em 15px 0 0;
    background: #fff;
    box-shadow: 0 0 6px #eee;
    -moz-box-shadow: 0 0 6px #eee;
    -webkit-box-shadow: 0 0 6px #eee;
}

#footer ul li.section h4 
{
    background: url(images/footer-header-bg-g.png) top left no-repeat;
    padding: 1px 0 9px 15px;
    font-size: 11px;
    text-transform: uppercase;
    color: #fff;
    font-family: Lucida Sans, Lucida Grande, Sans-serif;
    text-shadow: 1px 1px #666;
    -moz-text-shadow: 1px 1px #666;
    -webkit-text-shadow: 1px 1px #666;
    line-height: 1.75em;
    font-weight: bold;
}

#footer ul li.last 
{
    margin-right: 0;
}

#footer ul li ul 
{
    padding: 0 0 12px 0;
}

#footer ul li ul li 
{
    float: none;
    padding: 2px 5px 2px 25px;
    font-size: 11px;
}

#footer ul li ul li a 
{
 color: #1b83ac;
 font-size: 13px;
}

.logos
{

    margin: 0 0;
    padding: 5px 0;
    
}
.logos img
{
    padding:5px;
}

#footer p 
{
    font-size: .85em;
    line-height: 1.85em;
    margin:  1em 0;
    text-align:center;
    color:#4f7a97;
}


#footercontact  
{
    margin-top: 1.5em;
}

#footercontact #phone 
{
    border-left: none;
    margin-left: 0;
    padding-left: 0;
    border: none;
    background: #eaf5f9;
    padding: 10px;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border: 1px solid #d5e5ec;
    box-shadow: 2px 2px #c6e1ec;
    -moz-box-shadow: 2px 2px #c6e1ec;
    -webkit-box-shadow: 2px 2px #c6e1ec;
}

#footercontact #phone h2 
{
    color: #126586;
    text-shadow: 1px 1px #a8ccda;
    -moz-text-shadow: 1px 1px #a8ccda;
    -webkit-text-shadow: 1px 1px #a8ccda;
    font-size: 16px;
    padding: 5px 0;
}

#footercontact #phone h6 
{
    color: #4d91ab;
}

#footercontact #rightheader 
{
    padding-left: 15px;
}

#footerDisclaimer
{
    clear: left;
    margin: 1.5em 0;
    padding: 10px 15px;
    border: 3px solid #eee;
    border-width: 3px 0;

}

#footerDisclaimer p 
{
    font-size: .85em;
    margin:  1em 0;
    text-align:left;
    color: #777;    

}


/* CONTENT
*************************************/

#content {
	padding:  0 0 15px 0;

    

}


/* EXTRA CLASSES
*************************************/
.privacy 
{
    padding: 4em 7em;
}

.small
{
    font-size: .8em;
}

.center 
{
    text-align: center;
}

.floatleft {
	float: left;
	margin: 0 15px 0 0;
}

.floatright {
	float: right;
	margin: 0 0 0 15px;
}

.clear {
	clear: both;
}

.footnote 
{
    font-size: 11px;
	border-top: 1px dotted #dddbd6;
	padding: 1em 0 0 0;
	margin: 1.5em 0 0 0;
	color: #777;
	line-height: 1.6em;
}


/* 
	LEVEL ONE
*/

ul.dropdown li.holder                      {  zoom: 1; background: #ff860c; float: none; }
ul.dropdown a:hover		            { color: #000; }
ul.dropdown a:active                { color: #ff860c; }
ul.dropdown li a                    { display: block; padding: 4px 8px; border-right: 
	 								  color: #222;  }
ul.dropdown li.hover,
ul.dropdown li:hover                { background: #1e739f; color: black; position: relative; }
ul.dropdown li.hover a              { color: black; }


/* 
	LEVEL TWO
*/
ul.dropdown ul 						{ width: 210px; visibility: hidden; position: absolute; top: 100%; left: 0; background: #2f8ebf; }

#header #mainnav li ul.dropdown ul.sub_menu li { 
font-weight: normal; 
background: #333; 
border-bottom: 1px solid #ccc; 
float: none; 
display: block;
text-align: left;
}
									  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ border-right: none; width: 100%; display: inline-block; text-align: center; color: #215581;  } 

/* 
	LEVEL THREE
*/
ul.dropdown ul ul 					{ left: 100%; top: 0; }
ul.dropdown li:hover > ul 			{ visibility: visible; }
