@charset "UTF-8";
/* CSS Document */

/*resetting from Eric Meyers http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/   */

html, body, div, span, applet, object, iframe, p, h1, h2, h3, h4, h5, h6, 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,
b, u, i, center,
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-size: 100%;
	background: transparent;
}

body {
	line-height: 100%;
	/*these are my own custom inserts*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
}
ol, ul {
	list-style: none;
}
ul.bodycopy {
	list-style: square;
	margin-left: 20px;
}
blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*------------------------------

INFORMATION FOR WEBSITE ARE:

Purple: #606692
Mid Purple: #A7AAC3
Light Purple: #E0E1EA
Secure Dark Purple: #2A2649

Green: #87A79C
Light Green: #D1E1D9

Yellow-Gold: #BBB36D
Light Yellow: #E5E2C2

Orange: #E6B961
Light Orange: #FAE1BE

Banner Background: #DCD5C5


Full page width: 950px;
Left width: 170px;
Left content width: 150px;
Main column width: 770px

------------------------------*/


/*==========GLOBAL TEXT AND LINK SETTINGS===========*/

a {
	color: #606692;
	text-decoration:underline;
}
a:hover {
	color:#E6B961;
	text-decoration: none;
}
a:visited {
	color: #606692;
}
a:visited:hover {
	color: #E6B961;
}
h1, h2, h3, h4, h5, h6 {
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;	
	line-height: 110%;
}
h1{
	font-size: 18px;
	margin-top: 7px;
	margin-bottom: 5px;
	color: #606692;
}
h2{
	font-size: 16px;
	margin-top: 8px;
	margin-bottom: 4px;
	color: #606692;
}
h3{
	font-size: 15px;
	margin-top: 8px;
	margin-bottom: 2px;
	color: #606692;
}
h4{
	font-size: 14px;
	margin-top: 5px;
	font-style: italic;
	margin-bottom: 0px;
	color: #666666;
}
h5{
	font-size: 13px;
	font-style: italic;
	margin-top: 3px;
	color: #666666;
}
h6{
	font-size: 14px;
	margin-top: 8px;
	margin-bottom: 8px;
	color: #606692;
}
    
p {
	margin-bottom: 4px;
	line-height: 16px;
	font-size: 12px;
	font-weight: normal;
}
div.clear{   /* A clear tag used to clean up floats etc */
	clear:both;
}


/*=======CONTAINER - GOES AROUND TOP NAVIGATION ONLY======*/
#containerNav{
	width: 950px;
	margin: 0 auto 0 auto;
}
/*ALL MENU STYLES ARE IN THE PETPLAN_MENUS.CSS DOCUMENT*/



/*======CONTAINERBODY - GOES AROUND CONTENT AREA==========*/
#containerBody {
	width: 950px;
	overflow: hidden;
	margin: 10px auto 0px auto;
	background: url(../images/content_lineBknd.gif) bottom right no-repeat;
}

/*======CONTAINERBODY COLUMNS - LEFT AND RIGHT ==========*/

div.left_Column {
	float: left;
	width: 170px;	
	padding-bottom: 7000px;
	margin-bottom: -7000px;	
}
/*PADDING AND MARGINS NEEDED FOR EQUAL HEIGHT COLUMNS*/
/*SEE CONTENT DIV BELOW FOR MORE DETAILS*/

.yellow {
		background-image: url(../images/leftBar_bknd_yellow.png);
		background-position:left;
		background-repeat:repeat-y;		
}
.green {
		background: url(../images/leftBar_bknd_green.png) center bottom repeat-y;	
}
.brown {
		background: url(../images/leftBar_bknd_brown.png) center bottom repeat-y;	
}

#right_Column {   /*This is the overall DIV tag for the content area*/
	float: left;
	width: 720px;
	margin-left: 20px;
	padding-bottom: 7010px;  
	margin-bottom: -7000px;
}
/*EXTREME PADDING AND MARGINS NEEDED FOR EQUAL HEIGHT COLUMNS*/
/*Padding is more than margin to compensate for the footer, which contains 
the leftBar bottom corners. this 10px difference
separates any content element from the footer outline shape.... nifty trick!*/



/*========================LEFT MENU BAR========================*/

#left_nav{  /*Overall white boxed area in the leftBar*/
	background: url(../images/leftBar_corners_yellow.gif); 
	background-repeat: no-repeat;
	background-position:top left;
	padding: 22px 10px 25px 10px;
}
div.left_Head {
	width: 150px;
	height: 23px;
}
#left_Ticker {
	width: 150px;
	background:#FFF;
	border-bottom: 1px solid #CCC;
}
#left_Hacker {
	width: 150px;
	background:#FFF;
}
div.left_livehelp{
	width: 150px;
	margin-left: -31px;
	margin-top: -10px;
}
div.left_Buttons{
	width: 150px;
	background-image:url(../images/left_bg.gif);
	background-position:left;
	background-repeat:repeat-y;
	margin: 0px;

}
div.left_Buttons a{
	display:block;
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-size:12px;
	font-weight:bold;
	text-decoration:none;
	padding: 10px 13px 10px 32px;
	border-bottom: 1px solid #CCC;
}
div.left_Buttons li:hover {
	background: url(../images/leftBar_buttons_hover.jpg) left center repeat-x;
}

/*CLASSES BELOW SET STYLES FOR DIFFERENT BUTTONS WITH DIFFERENT ICONS*/
a.tc {
	background: url(../images/icon_topClaim_orange.gif) 6px center no-repeat;
	border-bottom: 1px solid #fff;
}
a.hpiw {
	background: url(../images/icon_qMark_orange.gif) 6px center no-repeat;
}
a.htc {
	background: url(../images/icon_checkMark_orange.gif) 6px center no-repeat;
}
a.tac {
	background: url(../images/icon_i_orange.gif) 6px center no-repeat;
}
a.gaq {
	background: url(../images/icon_dollar_green.gif) 6px center no-repeat;
}
a.wom {
	background: url(../images/icon_movie_blue.gif) 6px center no-repeat;
}
a.activate 
{
   margin-left: -25px;
   border-bottom: none;
}
#left_Footer {     /*THIS IS THE BOTTOM OF THE WHITE BOX*/
	width: 150px;
	height: 15px;
	background-image: url(../images/leftBar_corners_bottom.gif);
	background-position: top;
	background-repeat: no-repeat;
}




/*========================CONTENT AREA OF SITE========================*/

#phoneNumber, #frenchLink {
 	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-size: 13px;
	color:#999999;
}
#phoneNumber {
	float: right;
	padding: 0px 0px 6px 28px;
	background: url(../images/icon_canada_bug.gif) 3px top no-repeat;
}
#frenchLink {
	float: right;
	padding: 0px 20px 4px 25px;
    height: 11px;
}


/*-------BREADCRUMBS------*/
#breadcrumbs {
	float: left;
	margin-left: 15px;
}
#breadcrumbs ul{
	list-style: none;
}
#breadcrumbs li{
	float: left;
	font-size: .7em;
	margin-top: -1px;
	background: url(../images/breadcrumb_divider.gif) right center no-repeat;
	padding-right: 13px;
	padding-left: 3px;
}
#breadcrubmb a{
}



/*------ BANNERS ------*/

#flashWrap {
	clear:both;
}
#flashBanner {
	z-index:-10; /*this sends the flash banner behind the drop-down menu system*/
}
#slideNav {
	width: 770px;
	padding-bottom: 10px;
	padding-top: 10px;
}
div.banner {   /*base banner style for all pages*/
	clear: both;
	height: 180px;
	width: 770px;
	margin-bottom: 15px;
	text-indent:-5000px; /*sends text far off the page, allowing you to tag the live text area with anything you want - no alt tags needed*/
}

/*create one style per different banner on the site*/
.dog_protection{
	background: url(../images/banner_dog_protection.jpg) top center no-repeat;
}
.cat_protection{
}



/*------ CONTENT AREA UNDER BREADCRUMBS AND BANNERS ------*/

#content{ /*This is your main text area*/
	float: left;
	width:570px;
	padding-right: 20px;
	padding-left: 10px;
}
div.BSA_Box{ /*This is the floating "Be Secure About:" box*/
	width: 160px;
	float: left;
	padding: 0px 0px;
}
.BSA_Yellow {  /*below are your options to change the background colours*/
		background: url(../images/BSA_bknd_yellow.png) center bottom repeat-y;	
}
.BSA_Green {
		background: url(../images/BSA_bknd_green.png) center bottom repeat-y;	
}
.BSA_Brown {
		background: url(../images/BSA_bknd_brown.png) center bottom repeat-y;	
}
.BSA_Box h4 {
	margin: 0px 10px 5px 10px;
	color: #606692;
}
.BSA_Box p {
	font-size: .75em;
	margin-left: 10px;
	margin-right: 10px;
	color:#555;
}



/*========================HOME QUOTE========================*/

#homeQuote {
	float:left;
	width: 340px;
	background: url(../images/homeQuote_corners_bottom.gif) bottom no-repeat #D1E1D9;
	margin-bottom: 0px;
}
#homeQuote h3{
	width: 340px;
	font-size: 1em;
	color: #FFF;
	padding: 4px 0px;
	margin: 0px;
	border-bottom: 3px solid #FFF;
	background: url(../images/homeQuote_corners_top.gif) top no-repeat #87A79C;
	text-align: center;
	font-weight:normal;
}
#homeQuote table{
	margin: 10px 0px 0px 10px;
	line-height: 1.4em;
	font-size: .8em;
	font-weight: normal;
}
#homeQuote td {
	padding: 9px 5px 0px 5px;
}

a.quoteQmark {
	height:20px;
	width:20px;
	display:block;
	background: url(../images/homeQuote_qmark.gif) 0px 0px no-repeat;
}
a.quoteQmark:hover {
	background: url(../images/homeQuote_qmark.gif) 0px -20px no-repeat;
	/*qMark is one graphic, with both states included. On hover, the image moves up 20px revealing
	the second version of the graphic. This prevents the need of a preload for rollover*/
}
a.showQuote {
	height:25px;
	width:114px;
	display:block;
	background: url(../images/homeQuote_submit.gif) 0px 0px no-repeat;
}
a.showQuote:hover {
	background: url(../images/homeQuote_submit.gif) 0px -26px no-repeat;
	/*qMark is one graphic, with both states included. On hover, the image moves up 20px revealing
	the second version of the graphic. This prevents the need of a preload for rollover*/
}



/*========================HOME NEWS========================*/
#homeNews {
	float: right;
	width: 710px;
	padding: 10px 20px 10px 20px;
	overflow:auto;
    border: 1px dashed #cccccc;

}

.newsItem {
	margin-bottom: 10px;
}

.learnMore {
	font-weight:bold;
}
.quote{
	float: right;
	color: #666666
}
#homeNews img{
	float: left;
	padding: 0px 6px 6px 0px;
}





/*========================FOOTER========================*/

#footer {
	width:950px;
	position:relative;
	text-align:center;
	font-size: 10px;
	background: url(../images/footer_top.gif) top center no-repeat;
	padding-top: 34px;
	color: #C6C08F;
	margin: -24px auto 0 auto;    
/*FOOTER CONTAINER MUST CENTER ON PAGE USING THESE MARGINS
Footer background graphic contains the bottom corners to the leftBar background patter. 
The negative margin allows it to layer these corners ontop of the leftBar creating 
the bottom rounded corners.*/
}
#footer ul{
	list-style:none;
	text-align:center;
	margin-bottom: 0px;
}
#footer li{
	display: inline;
}
#footer p{
	clear:both;
	font-size: 10px;
	line-height: 110%;
}
#footer a {
	text-decoration: none;
}
#footer a:hover {
	text-decoration: underline;
}
#footer li a{
	padding: 0px 6px;
	border-right: 1px solid #ccc;
}
#footer a.last {
	border-right: none;
}
#footer .footerBottom {
	width: 950px;
	height: 13px;
	background: url(../images/footer_bottom.gif) top no-repeat;
}
#footer table {
	text-align: center;
	margin: 2px auto 0px auto;
	}
#footer td {	
	width: 200px;
	text-align:left;
}
#footer td.flag{
	width: 21px;
	padding-right: 6px;
}
#footer td.logos{
	width: 91px;
}
#footer td.copyright {
	width: 500px;
	text-align:center;
	
}

/*========================Left Bar========================*/

p.leftbar
 {
     color: #666666;
     font-size: 11px;
     padding-left:20px;
     padding-top:15px;
     padding-bottom:0px;
 }
 /*========================Voucher home========================*/
 
div.vchrleft 
{
    float: left;
    width:410px;
    padding-left:20px;
    padding-bottom:10px
}
div.vchrlist 
{
    width:550px;
    margin-left: 100px;
}
div.vchrlist  ul{
	list-style:disc;
	margin-bottom: 10px;
	margin-left:0px;
	font-size: 0.9em;
}
div.vchrlist  li{
	margin-bottom: 10px;
}

img.activate2
{
    padding: 0px 0px 9px 40px;
}
img.livehelp 
{
    padding: 10px 5px 5px 7px;
}
/*Member Benefits Chart*/
td.flushLeft {
	text-align:left !important;
}

table.memberChart {
	background-color:#E5E2C2;
	border: 10px solid #E5E2C2;
}
table.memberChart td {
	padding: 8px 4px 8px 4px !important;
	border-bottom: 1px #fff solid;
}

/*---------FORMS----------*/

#reminder {
	padding-left:25px;
}

.mandatory_field {
	font-family: Arial, helvetica, sans-serif;
	font-size: 10px;
	color:#606692;
}

.mandatory_field_activation {
	font-family: Arial, helvetica, sans-serif;
	font-size: 10px;
	padding-right:25px;
	color:#606692;
}

.activaton_title {
	background-color:#606692;
	font-family: Arial, helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#FFFFFF;
	padding-left:25px;
	padding-top:3px;
	padding-bottom:3px;
}

.example {font-size: 9px}

.reminder_form_table {
	margin-left:25px;
	padding-left:25px;
	font-family: Arial, helvetica, sans-serif;
	font-size: 12px;
	color:#606692;
	line-height:16px;
}

.form_table {
	margin-left:7px;
	padding-left:7px;
	font-family: Arial, helvetica, sans-serif;
	font-size: 12px;
	color:#000000;
	line-height:16px;
}

.form_table a {
	font-family: Arial, helvetica, sans-serif;
	font-size: 12px;
	color:#606692;
	line-height:16px;
	text-decoration:none;
}

.form_table a:hover {
	font-family: Arial, helvetica, sans-serif;
	font-size: 12px;
	color:#E6B961;
	line-height:16px;
	text-decoration:none;
}


.subhead_bold {
	font-size: 12px;
	font-weight: bold;
	padding-left:25px;
	color:#606692;
}



/*small buttons*/

.main_nav img {
	margin-left:25px;
	margin-right:0px;
	margin-top:8px;
	margin-bottom: 2px;
}

	
.main_nav_form_form img {
	margin-right:0px;
	margin-top:8px;
	margin-bottom: 2px;
}


/*end small buttons*/

.real_clients_header {
	font-family: Arial, helvetica, sans-serif;
	font-size: 14px;
	font-weight:bold;
	color:#FFFFFF;
	padding-left:29px;
	padding-right:10px;
}

.real_clients {
	font-family: Arial, helvetica, sans-serif;
	font-size: 11px;
	color:#FFFFFF;
	padding-left:29px;
	padding-right:10px;
}

.real_clients a {
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-weight: bold;
	text-decoration:none;
	font-size: 11px;
	color:#FFFFFF;
}

.real_clients a:hover {
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-weight: bold;
	text-decoration:none;
	font-size: 11px;
	color:#E6B961;
}

.real_clients a:visited {
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-weight: bold;
	text-decoration:none;
	font-size: 11px;
	color:#FFFFFF;
}

.real_clients a:visited:hover {
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-weight: bold;
	text-decoration:none;
	font-size: 11px;
	color:#E6B961;
}


.position {
	padding-top:25px;
	padding-left:25px;
}

.position_chart {
	padding-top:0px;
	padding-left:25px;
}


.navigation_main {
	background-color:#606692;

}



/* start button navigation*/

.button_nav img {
	margin-right:5px;
	margin-top:10px;
	margin-bottom: 2px;

}

.button_nav a{
	font-weight: bold;
	color: #606692;
	text-decoration: none;
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-size: 18px;
	line-height: 16px;
	padding-left:30px;
	}
	
.button_nav a:hover {
	font-weight: bold;
	color: #E6B961;
	text-decoration: none;
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-size: 18px;
	line-height: 16x;
	padding-left:25px;
	}
	
.button_nav a:visited {
	font-weight: bold;
	color: #606692;
	text-decoration: none;
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-size: 18px;
	line-height: 16px;
	padding-left:30px;
	}	
	
.button_nav a:visited:hover {
	font-weight: bold;
	color: #E6B961;
	text-decoration: none;
	font-family: "Trebuchet MS", "Arial Narrow", Arial, sans-serif;
	font-size: 18px;
	line-height: 16x;
	padding-left:25px;
	}
	
/* end button navigation*/


#wrapper span.thawte {

	padding-left:50px;
}

#activation span.thawte {

	padding-left:50px;
}


.four_week_bold {
	color: #A7AAC3;
	font-weight: bold;
}

.Error_Summary 
{
	padding-left:10px;
	color: #cc0000;
	font-weight: bold;
	font-size: 14px;
}

.Error_Summary li a
{
	color: #cc0000;
	font-weight: normal;
	font-size: 12px;
}

.form_main {
	background-color:#ffffff;
	font-family: Arial, helvetica, sans-serif;
	font-size:9px;
	color:#000000;
	padding-top:5px;
	padding-bottom:10px;
}