@import url("reset.css");


/*** TAG STYLING BEGINS ***/
A {
	text-decoration:	none;
	color:				#808080;
}

A:hover {color:#93272d;}

BODY {
	background-color:	#ebebeb;
	font-family:		Helvetica, Arial, Verdana, sans-serif;
	font-size:			11px;
	color:				#1a1a1a;
}

P {
	margin-bottom:		20px;
	line-height:		14px;
	font-family:		Arial, sans-serif;
	font-size:			12px;
}
/*** TAG STYLING ENDS ***/


/*** BASE STYLING BEGINS ***/
#shadow {
	width:				845px;
	margin:				0 auto;
	background:			url("../media/images/core/shadow.gif") repeat-y;
}

#container {
	width:				800px;
	margin:				0 auto;
}

#header {
	position:			relative;
	height:				90px;
	background-color:	#f2f2f2;
}

#logo {
	display:			block;
	position:			absolute;
	top:				29px;
	left:				55px;
	width:				196px;
	height:				46px;
	background:			url("../media/images/core/contact-keeper-logo.gif");
}

#navigation {
	position:			absolute;
	right:				55px;
	bottom:				11px;
	font-size:			14px;
	color:				#666666;
}

#navigation LI {display:inline;}
#navigation .current A {color:#93272d;}

#content {
	width:				690px;
	margin-bottom:		0;
	padding:			0 55px;
	background:			#ffffff;
}

#footer {
	position:			relative;
	width:				845px;
	height:				18px;
	margin:				0 auto;
	padding-top:		10px;
	background:			url("../media/images/core/shadow-bottom.gif") 50% 0 no-repeat;
	font-size:			10px;
	clear:				both;
}

#footer UL, #footer DIV {
	position:			relative;
	float:				left;
	z-index:			99;
	width:				378px;
	padding:			0 22px;
	color:				#808080;
}

#footer LI {display:inline;}
#footer DIV {text-align:right;}

#footer DIV P {
	line-height:		100%;
	font-size:			10px;
}
/*** BASE STYLING ENDS ***/


/*** PAGE STYLING BEGINS ***/
/*** HOME PAGE STYLING BEGINS ***/
#homePage #content {
	padding-top:		45px;
	padding-bottom:		45px;
}

#homePage #content H2 {
	margin-bottom:		10px;
	font-family:		'Arial Black', Arial, sans-serif;
	font-size:			15px;
	font-weight:		normal;
	color:				#E5252A;
}

#homePage .column.left {
	width:				470px;
	margin-right:		20px;
}

#homePage #video {
	position:			relative;
	width:				468px;
	height:				263px;
	margin-bottom:		39px;
	background-color:	#cccccc;
}

#homePage #video DIV {
	position:			absolute;
	top:				-20px;
	left:				-20px;
}

#homePage .column.left UL {
	position:			relative;
	width:				468px;
	height:				125px;
	background:			url("../media/images/contact-keeper-sizes.jpg");
}

#homePage .column.left LI {margin-bottom:6px;}
#homePage .column.left LI.last {margin-bottom:0;}

#homePage .column.left A {
	display:			block;
	width:				150px;
	height:				36px;
}

#homePage UL #smallImgNav, #homePage UL #mediumImgNav, #homePage UL #largeImgNav {position:absolute;}

#homePage UL #largeImgNav {
	width:				100px;
	height:				124px;
	top:				-2px;
	left:				366px;
}

#homePage UL #mediumImgNav {
	width:				76px;
	height:				93px;
	top:				29px;
	left:				276px;
}

#homePage UL #smallImgNav {
	width:				74px;
	height:				47px;
	top:				75px;
	left:				189px;
}

#homePage UL #largeTextNav:hover, #homePage UL #mediumTextNav:hover, #homePage UL #smallTextNav:hover, #homePage UL #largeImgNav:hover, #homePage UL #smallImgNav:hover, #homePage UL #mediumImgNav:hover {border:1px solid #555555;}

#homePage .column.right {
	width:				180px;
	padding-left:		15px;
	border-left:		2px solid #eeeeee;
}

#homePage .column.right P {margin:10px 0 31px;}

#homePage .column.right UL LI {
	margin-bottom:		10px;
	line-height:		24px;
}

#homePage .column.right LI.last {margin-bottom:0;}

#homePage .column.right LI IMG {
	position:			relative;
	top:				-1px;
	vertical-align:		middle;
	margin-right:		5px;
}
/*** HOME PAGE STYLING ENDS ***/


/*** THE ISSUE PAGE STYLING BEGINS ***/
#problemPage #content {
	padding-top:		25px;
	padding-bottom:		20px;
}

#problemPage #content H1 {
	margin-bottom:		20px;
	font-size:			16px;
	font-weight:		bold;
	color:				#e5252a;
}

#problemPage .column {width:335px;}
#problemPage .column.left {margin-right:20px;}

#problemPage .column P {
	background-color:	#e2e2e2;
	margin-bottom:		0px;
	padding:			8px 20px;
	line-height:		16px;
	font-size:			14px;
}

#problemPage .columm IMG {
	width:				335px;
	height:				145px;
}

#problemPage .column DIV {
	margin-bottom:		17px;
}

A.solutions {
	display:			block;
	float:				right;
	width:				163px;
	height:				28px;
	clear:				both;
}
/*** THE ISSUE PAGE STYLING ENDS ***/


/*** PRODUCTS PAGE STYLING BEGINS ***/
#productsPage #content {
	padding-top:		23px;
	padding-bottom:		17px;
}

#typeNav {text-transform:uppercase;}

#typeNav LI {
	float:				left;
	margin-bottom:		55px;
}

#typeNav LI.current {
	margin-top:			-4px;
}

#smallNav {
	width:				20%;
	text-align:			left;
}

#mediumNav, #largeNav {
	width:				30%;
	text-align:			center;
}

#refillNav {
	width:				20%;
	text-align:			right;
}

#typeNav A {
	font-size:			14px;
	font-weight:		bold;
	color:				#CCCCCC;
}

#typeNav A:hover {
	text-decoration:	underline;
	color:				#4D4D4D;
}

#typeNav A HR {display:none;}

#typeNav .current A {
	position:			relative;
	cursor:				default;
	font-family:		"Arial Black", Arial, sans-serif;
	font-size:			20px;
	color:				#4D4D4D;
}

#typeNav .current A:hover {text-decoration:none;}

#typeNav .current A HR {
	display:			block;
	position:			absolute;
	border:				0;
	border-bottom:		1px #7a7a7a solid;
}

#smallNav A HR, #mediumNav A HR, #largeNav A HR, #refillNav A HR {
	width:				100%;
	top:				15px;
	left:				0;
}

/*#smallNav A HR {width:100%;}
#mediumNav A HR {width:92px;}
#largeNav A HR {width:75px;}
#refillNav A HR {width:91px;}*/
#productsPage #main {clear:both;}
#productsPage #bigImg {height:346px;}

#productsPage .column.medium, #productsPage .column.small, #productsPage .column.large {
	height:				351px;
	margin-right:		28px;
	border-right:		2px #eeeeee solid;
}

#productsPage .column.medium IMG, #productsPage .column.small IMG, #productsPage .column.large IMG {margin-bottom:3px;}
#productsPage .column.medium A, #productsPage .column.small A, #productsPage .column.large A {margin-bottom:0;}

#productsPage .column.medium {
	width:				153px;
	padding-right:		27px;
}

#productsPage .column.small {
	width:				152px;
	padding-right:		28px;
}

#productsPage .column.large {
	width:				160px;
	padding-right:		20px;
}

#videoPlayerArea {
	position:			relative;
	width:				480px;
	height:				270px;
}

#videoPlayerArea DIV {
	position:			absolute;
	top:				-20px;
	left:				-20px;
}

#productsPage HR {
	position:			relative;
	top:				-1px;
	width:				800px;
	left:				-55px;
	border:				1px #e0e0e0 solid;
}

#small-2, #small-3, #medium-3, #large-3 {position:relative;}
#small-2, #small-3, #medium-3 {top:5px;}
#large-3 {top:31px;}

#imgNav {padding:10px 0 0;}

#imgNavSmall, #imgNavRefills {
	margin:				0 auto;
	padding:			10px 0 0;
}

#imgNavSmall {width:466px;}
#imgNavRefills {width:487px;}

#imgNav DIV, #imgNavSmall DIV, #imgNavRefills DIV {
	float:				left;
	height:				39px;
	border-right:		1px #d9d9d9 solid;
}

#imgNav DIV IMG, #imgNavSmall DIV IMG, #imgNavRefills DIV IMG {
	opacity:			0.55;
	filter:				alpha(opacity = 55);
}

#imgNav DIV IMG:hover, #imgNavSmall DIV IMG:hover, #imgNavRefills DIV IMG:hover {
	opacity:			1;
	filter:				alpha(opacity = 100);
}

#imgNav DIV.current IMG, #imgNavSmall DIV.current IMG, #imgNavRefills DIV.current IMG {
	opacity:			1;
	filter:				alpha(opacity = 100);
}

#imgNav DIV.last, #imgNavSmall DIV.last, #imgNavRefills DIV.last {
	margin-right:		0;
	padding-right:		0;
	border-right:		none;
}

#smallBuy, #mediumBuy, #largeBuy, #refillBuy {
	position:			absolute;
	margin-top:			3px;
}

#smallBuy {margin-left:80px;}
#mediumBuy {margin-left:24px;}
#largeBuy {margin-left:23px;}
#refillBuy {margin-left:69px;}

#animatedImg {
	position:			relative;
	top:				-21px;
	left:				-70px;
}
/*** PRODUCTS PAGE STYLING ENDS ***/


/*** BUY PAGE STYLING BEGINS ***/
#buyPage #content {
	padding-top:		30px;
	padding-bottom:		30px;
}

#buyPage .column {
	width:				163px;
}

#buyPage .column.left {
	width:				455px;
	margin-right:		35px;
	padding-right:		35px;
	border-right:		2px #d9d9d9 solid;
}

#buyPage .column.left > DIV {
	clear:				both;
}

#buyPage .column.left > DIV.last {
	padding-top:		40px;
	clear:				both;
}

#buyPage .column.left DIV DIV {
	float:				left;
	width:				169px;
}

#buyPage .column.left DIV DIV.last {
	width:				116px;
	margin-right:		0;
}

#buyPage SELECT {
	display:			block;
	width:				53px;
	margin-top:			3px;
	border:				1px #808080 solid;
	text-align:			center;
}

#smallCK, #smallRefill {margin-left:5px;}
#mediumCK, #mediumRefill {margin-left:9px;}
#largeCK, #largeRefill {margin-left:29px;}

#buyPage H2 {
	margin-bottom:		50px;
	line-height:		110%;
	font-size:			18px;
	font-weight:		bold;
}

#buyPage H2 SPAN {
	line-height:		24px;
	font-size:			20px;
}

#buyPage #content P {
	margin-bottom:		95px;
	line-height:		125%;
	font-size:			15px;
	font-weight:		bold;
	color:				#666666;
}

#buyPage #checkoutNow {
	display:			block;
	width:				156px;
	height:				58px;
	background:			url('../media/images/core/checkout.gif');
	border:				none;
	cursor:				pointer;
}

#noPayPalMsg {
	position:			relative;
	z-index:			100;
	height:				0;
}

#noPayPalMsg DIV {
	display:			none;
	position:			absolute;
	top:				-79px;
	left:				-380px;
	z-index:			999;
	padding:			15px;
	background:			#ffffff;
	border:				1px #cccccc solid;
}

#paypal {
	margin-bottom:		15px;
}
/*** BUY PAGE STYLING ENDS ***/


/*** ABOUT PAGE STYLING BEGINS ***/
#aboutPage #content {padding-top:45px;padding-bottom:40px;}
#aboutPage IMG {margin-bottom:35px;}
#aboutPage #content P {text-align:justify;line-height:155%;}
#aboutPage #content A {height:31px;float:right;}
/*** ABOUT PAGE STYLING ENDS ***/


/*** CONTACT PAGE STYLING BEGINS ***/
#contactPage #content {
	padding-top:		45px;
	padding-bottom:		30px;
}

#contactPage H3 {
	font-size:			12px;
	font-weight:		bold;
	color:				#93272D;
}

#contactPage FORM .column {width:325px;}

#contactPage .leftColumn {
	width:				325px;
	margin-right:		40px;
}

#contactPage H2 {
	margin-bottom:		6px;
	font-size:			20px;
	font-weight:		bold;
	color:				#93272D;
}

#contactPage P {line-height:125%;}
#contactPage .important {color:#93272D;}
#contactPage FORM, #contactPage FORM DIV {clear:both;}
#contactPage FORM, #contactPage FORM DIV.column {clear:none;}
#contactPage FORM .leftColumn {padding-top:16px;}
#contactPage FORM DIV {margin-bottom:14px;}

#contactPage LABEL {
	position:			relative;
	font-size:			13px;
	font-weight:		bold;
}

#contactPage INPUT.inputField, #contactPage #imDiv SELECT {
	width:				245px;
	margin-bottom:		8px;
	border:				1px #808080 solid;
}

#contactPage SELECT {border:1px #808080 solid;}

#contactPage TEXTAREA {
	width:				100%;
	height:				176px;
	margin-top:			5px;
}

#contactPage FORM .rightColumn DIV {
	margin-top:			10px;
	text-align:			right;
}

#contactPage FORM .rightColumn UL {
	width:				110%;
	margin-top:			43px;
}

#contactPage FORM .rightColumn LI {
	float:				left;
	width:				23%;
}

#contactPage FORM .rightColumn LI.last {width:24%;}
#contactPage FORM .rightColumn LI SPAN {display:block;}

#contactPage #addressInfo {
	width:				148px;
	margin-right:		24px;
	padding-right:		20px;
	border-right:		1px #808080 solid;
}

#contactPage #phoneInfo {
	width:				110px;
	margin-bottom:		10px;
}
/*** CONTACT PAGE STYLING ENDS ***/


/*** NEWSLETTER PAGE STYLING BEGINS ***/
#newsletterPage #content {padding-bottom:35px;}

#newsletterPage #content P {
	margin:				0 0 15px;
	padding-top:		30px;
	line-height:		110%;
	font-size:			14px;
	color:				#666666;
}

#newsletterPage FORM {margin-bottom:30px;}

#newsletterPage INPUT {
	display:			block;
	width:				240px;
	padding:			2px 5px;
	border:				2px #9E9E9E solid;
	font-size:			13px;
}

#newsletterPage INPUT.submitButton {
	width:				71px;
	height:				19px;
	margin-top:			15px;
	padding:			2px 5px;
	background:			url("../media/images/core/submit.gif");
	border:				none;
	cursor:				pointer;
}

#newsletterPage #content P.red {color:#93272D;}
/*** NEWSLETTER PAGE STYLING ENDS ***/


/*** TERMS & PRESS PAGES STYLING BEGINS ***/
#sectionNav {padding-top:23px;}

#sectionNav LI {
	float:				left;
	margin-bottom:		45px;
}

#sectionNav LI.current {margin-top:-4px;}
#releasesNav {width:15%;}
#mentionsNav {width:15%;}
#partnershipsNav {width:18%;}
#awardsNav {width:13%;}
#linksNav {width:11%;}
#imagesNav {width:12%;}

#merchandisingNav {
	width:				1%
	text-align:			right;
}

#privacyNav {
	width:				50%;
	text-align:			right;
}

#termsNav {width:50%;}

#sectionNav A {
	font-size:			14px;
	font-weight:		bold;
	color:				#6D6E71;
}

#sectionNav A:hover {color:#000000;}

#termsPage H2, #pressPage H2 {
	margin-bottom:		15px;
	border-bottom:		1px #666666 solid;
	font-size:			16px;
	font-weight:		bold;
}

#pressPage H2 {
	margin-bottom:		30px;
}

#pressPage #content .hr {
	margin:				27px 0 28px;
}

#pressPage #main {clear:both;}

#pressPage .entry.last #downloadImg {
	position:			absolute;
	top:				27px;
	font-size:			16px;
	color:				#93272D;
}

#pressPage .entry.last P.first {margin-top:70px;}
#pressPage .entry.last P {margin-top:50px;}
#pressPage .entry.last .largeImg

#termsPage H3 {
	margin-bottom:		5px;
	font-size:			13px;
	font-weight:		bold;
}

#termsPage H4 {
	margin-bottom:		15px;
	font-size:			13px;
}

#termsPage H2 A, #pressPage H2 A {color:#E5252A;}

#termsPage #content, #pressPage #content {
	padding-bottom:		20px;
}

#termsPage #content P, #pressPage #content P {
	text-align:			justify;
}

#pressPage #content SPAN {
	position:			relative;
	float:				right;
	top:				3px;
	font-size:			12px;
	font-weight:		normal;
}

#pressPage #content SPAN A {
	color:				#666666;
}

#termsPage #content OL {
	margin-left:		50px;
	list-style-type:	upper-alpha;
	text-align:			justify;
	font-size:			12px;
}

#termsPage #content OL LI {
	margin-bottom:		10px;
	line-height:		14px;
}

#termsPage #content OL LI .bold {
	font-family:		Helvetica, Arial, sans-serif;
	font-weight:		bold;
}

#termsPage #content TABLE {
	margin-bottom:		15px;
	line-height:		14px;
	font-family:		Helvetica, Arial, sans-serif;
	font-size:			12px;
}

#pressPage .links LI {
	line-height:		150%;
	font-size:			14px;
}
/*** TERMS & PRESS PAGES STYLING ENDS ***/
/*** PAGE STYLING ENDS ***/


/*** CLASS STYLING BEGINS ***/
.asterisk {
	position:			absolute;
	top:				-2px;
	left:				-5px;
}

.bold {font-family:"Arial Black", Arial, sans-serif;}
.bold2 {font-weight:bold;}
.clearfix {display:inline-block;}

.clearfix:after {
	content:			".";
	display:			block;
	visibility:			hidden;
	height:				0;
	clear:				both;
}

.column {float:left;}
.divider {margin:0 3px;}
.entry {margin-bottom:55px;}

.err {
	font-size:			14px;
	font-weight:		bold;
	color:				#ff0000;
}

.headerImg {display:block;}
.hidden {text-indent:-9999px;}

.largeImg {
	margin-top:			13px;
	border:				1px #9E9E9E solid;
}

.last {margin:0;}
.red {color:#E5252A;}
/*** CLASS STYLING ENDS ***/