﻿
/* >>>>>>>>>>>>>>>>>>>>>>>> YAHOO CSS RESET <<<<<<<<<<<<<<<<<<<<<<<<<<< */

/*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;
}*/
#share
{
	float:right;
	position :relative;
	text-align: center;
	width:90px;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	/*font-style:normal;
	font-weight:normal;*/
}
caption,th {
	text-align:left;
}
/*h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}*/
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

/* >>>>>>>>>>>>>>>>>>>>>>>> BASIX <<<<<<<<<<<<<<<<<<<<<<<<<<< */

body{
	/*background:url(/App_Themes/KC/images/bodyBg.jpg) repeat-x 0 0 #00AEFF;*/
	background:url(/App_Themes/KC/images/bodyBg.jpg) repeat-x 0 0 #18BBFF;
	
	/*font:14px/20px 'Trebuchet MS', 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
	color:#fff;
    behavior:url("csshover.htc");
}

.clear{
	clear:both;
	height:10px;
	font-size:0;}

.leftAlign{float:left;}

.rightAlign{float:right;}

ul li a, .intro a{ color:#fff;}


a:hover{ text-decoration:none;}



/* >>>>>>>>>>>>>>>>>>>>>>>> CORE <<<<<<<<<<<<<<<<<<<<<<<<<<< */


#wrapper{
	width:945px;
	margin:0 auto;
	}

#wrapper #header{
	width:945px;
	height:133px;
	/*width:570px;
	width:143px; height:193px;*/
	background:url(/App_Themes/KC/images/header.jpg) no-repeat center;}
#wrapper #header a.logo
{
    display:block;
    margin:10px auto;
    width:350px;
    height:120px;
    margin-left: 300px; /* centers clickable logo */
}

#wrapper #header h1{
	text-indent:-9999px;
	
	}
	
/* >>>>>>>>>>>>>>>>>>>>>>>> Karma Menu <<<<<<<<<<<<<<<<<<<<<<<<<<< */

#wrapper #menu{
	width:945px;
	height:45px;
	}
#wrapper #menu ul, .leftNav
{
    margin:0px;    
    padding:0px;
    list-style:none;
}

#wrapper #menu ul.menuNav{
	display:block;
	width:945px;
	height:45px;}

#wrapper #menu ul li {
	display:block;	
	float:left;
	position: relative;
}

#wrapper #menu ul li ul{
	position: absolute;
	left:0px;
	top:45px;
	display: none;	
	width:220px;
	background:url(/App_Themes/KC/images/menuulBg.png) right bottom no-repeat;
	_background:url(/App_Themes/KC/images/menuulBg.jpg) right bottom no-repeat;
	padding-bottom:40px;
	z-index:1000;
	}
	
	#wrapper #menu ul li ul{
	position: absolute;
	left:0px;	
	top:45px;
	display: none;	
	width:220px;
	background:url(/App_Themes/KC/images/menuulBg.png) right bottom no-repeat;
	_background:url(/App_Themes/KC/images/menuulBg.jpg) right bottom no-repeat;
	padding-bottom:40px;
	z-index:1000;
	}
	#wrapper #menu ul li ul.last
	{
	    _left:-80px;
	    _margin-left:-100px;
	}
	

#wrapper #menu ul li:hover ul li{
	float:left;
	width:180px;
	color:#000;
	margin-left:15px;
	_margin-left:8px;
	border-bottom:1px solid #fff;
	display:block;
}

#wrapper #menu ul li:hover ul li:hover{
	background:#99CC00;
	border-bottom:1px solid #fff;
}

#wrapper #menu ul li:hover ul{
	display:block;
	position: absolute;
	left: 0px;
	top:45px;
}
#wrapper #menu ul li:hover ul.last{
	margin-left:-20px;	
	}
#wrapper #menu ul li:hover ul li:hover a{
	display:block;
	float:left;
}
	
#wrapper #menu ul li a{
	display:block;
	float:left;	
}

#wrapper #menu ul li ul li
{
	padding:0;
	margin:0;	
}

#wrapper #menu ul li ul li a{
	display:block;
	float:left;
	text-transform:uppercase;
	text-decoration:none;
	padding:0px 0 0px 10px;
	margin:0;
	font-size:12px;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-weight:bold;
}

#wrapper #menu ul li a.home{
	width:57px;
	height:45px;
	background:url(/App_Themes/KC/images/home.png) no-repeat;	text-indent:-9999px;
	_background:url(/App_Themes/KC/images/home.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #menu ul li a.home:hover{ background:url(/App_Themes/KC/images/homeH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #menu ul li a.voucher{
	width:166px;
	height:45px;
	background:url(/App_Themes/KC/images/giftVouchers.png) no-repeat;	text-indent:-9999px;
	_background:url(/App_Themes/KC/images/giftVouchers.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #menu ul li a.voucher:hover{background:url(/App_Themes/KC/images/giftVouchersH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #menu ul li a.register{
	width:166px;
	height:45px;
	background:url(/App_Themes/KC/images/giftRegistry.png) no-repeat;	text-indent:-9999px;
	_background:url(/App_Themes/KC/images/giftRegistry.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #menu ul li a.register:hover{ background:url(/App_Themes/KC/images/giftRegistryH.jpg) no-repeat;
	text-indent:-9999px;}


#wrapper #menu ul li a.corporate{
	width:221px;
	height:45px;
	background:url(/App_Themes/KC/images/corporateKarma.png) no-repeat;	text-indent:-9999px;
	_background:url(/App_Themes/KC/images/corporateKarma.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #menu ul li a.corporate:hover{ background:url(/App_Themes/KC/images/corporateKarmaH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #menu ul li a.charities{
	width:166px;
	height:45px;
	background:url(/App_Themes/KC/images/charities.png) no-repeat;	text-indent:-9999px;
	_background:url(/App_Themes/KC/images/charities.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #menu ul li a.charities:hover{ background:url(/App_Themes/KC/images/charitiesH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #menu ul li a.about{
	width:167px;
	height:45px;
	background:url(/App_Themes/KC/images/aboutUs.png) no-repeat;	text-indent:-9999px;
	_background:url(/App_Themes/KC/images/aboutUs.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #menu ul li a.about:hover{ background:url(/App_Themes/KC/images/aboutUsH.jpg) no-repeat;
text-indent:-9999px;}
/* >>>>>>>>>>>>>>>>>>>>>>>> Karma Menu <<<<<<<<<<<<<<<<<<<<<<<<<<< */

/* >>>>>>>>>>>>>>>>>>>>>>>>> WPG Menu <<<<<<<<<<<<<<<<<<<<<<<<<<<< */
#wrapper #wpgmenu{
	width:auto;
	height:45px;
	margin:0px auto;
	}
#wrapper #wpgmenu ul, .leftNav
{
    margin:0px;
    padding:0px;
    list-style:none;
}

#wrapper #wpgmenu ul.wpgmenuNav{
	display:block;
	width:945px;
	height:45px;}

#wrapper #wpgmenu ul li {
	display:block;
	float:left;
	position: relative;
}

#wrapper #wpgmenu ul li ul{
	position: absolute;
	left:0px;
	top:45px;
	display: none;	
	width:220px;
	background:url(/App_Themes/KCwpg/images/menuulBg.png) right bottom no-repeat;
	padding-bottom:40px;
	z-index:1000;
	}

#wrapper #wpgmenu ul li:hover ul li{
	float:left;
	width:180px;
	color:#000;
	margin-left:15px;
	border-bottom:1px solid #fff;
	display:block;
}

#wrapper #wpgmenu ul li:hover ul li:hover{
	background:#99CC00;
	border-bottom:1px solid #fff;

}

#wrapper #wpgmenu ul li:hover ul{
	display:block;
	position: absolute;
	left: 0px;
	top:45px;
}
#wrapper #wpgmenu ul li:hover ul li:hover a{
	display:block;
	float:left;
}
	
#wrapper #wpgmenu ul li a{
	display:block;
	float:left;	
}

#wrapper #wpgmenu ul li ul li
{
	padding:0;
	margin:0;
}

#wrapper #wpgmenu ul li ul li a{
	display:block;
	float:left;
	text-transform:uppercase;
	text-decoration:none;
	padding:0px 0 0px 10px;
	margin:0;
	font-size:12px;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-weight:bold;
}

#wrapper #wpgmenu ul li a.home{
	width:57px;
	height:45px;
	/*border:solid 1px #fff;*/
	background:url(/App_Themes/KCwpg/images/home.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #wpgmenu ul li a.home:hover{background:url(/App_Themes/KCwpg/images/homeH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #wpgmenu ul li a.howitworks{
	width:173px;
	height:45px;
	background:url(/App_Themes/KCwpg/images/howitworks.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #wpgmenu ul li a.howitworks:hover{ background:url(/App_Themes/KCwpg/images/howitworksH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #wpgmenu ul li a.otherways{
	width:193px;
	height:45px;
	/*border:solid 1px #fff;*/
	background:url(/App_Themes/KCwpg/images/otherways.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #wpgmenu ul li a.otherways:hover{background:url(/App_Themes/KCwpg/images/otherwaysH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #wpgmenu ul li a.voucherredeem{
	width:176px;
	height:45px;
	background:url(/App_Themes/KCwpg/images/voucherredeem.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #wpgmenu ul li a.voucherredeem:hover{ background:url(/App_Themes/KCwpg/images/voucherredeemH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #wpgmenu ul li a.charities{
	width:135px;
	height:45px;
	background:url(/App_Themes/KCwpg/images/charities.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #wpgmenu ul li a.charities:hover{ background:url(/App_Themes/KCwpg/images/charitiesH.jpg) no-repeat;
	text-indent:-9999px;}

#wrapper #wpgmenu ul li a.faq{
	width:177px;
	height:45px;
	background:url(/App_Themes/KCwpg/images/faq.jpg) no-repeat;	text-indent:-9999px;}
#wrapper #wpgmenu ul li a.faq:hover{ background:url(/App_Themes/KCwpg/images/faqH.jpg) no-repeat;
	text-indent:-9999px;}

/* >>>>>>>>>>>>>>>>>>>>>>>>> WPG Menu <<<<<<<<<<<<<<<<<<<<<<<<<<<< */


#container
{
 background-image:none;
 width:100%;
 min-height:300px;
 margin:0px;
 padding:0px;   
}

p.intro{
	text-align:center;
	padding:20px 0;
	width:820px;
	margin:0 auto;
	font-size:14px;}

p.intro a.karma{ letter-spacing:2px;}

div.intro{
	text-align:center;
	padding:20px 0;
	width:820px;
	margin:0 auto;
	font-size:14px;}

div.intro a.karma{ letter-spacing:2px;}
	
#wrapper #leftCol{
	width:290px;
   	float:left;
	_background:url(/App_Themes/KC/images/leftBG.jpg) repeat-y;
	}
#wrapper #leftCol #leftTop{
	width:240px;	
	padding:10px 20px 5px 30px;
	background:url(/App_Themes/KC/images/leftBG.png) no-repeat 0 0;
	_background:url(/App_Themes/KC/images/leftTop.jpg) no-repeat 0 0;}
	


#wrapper #leftCol #leftBottom{
	width:290px;
	height:30px;
	float:left;	
	clear:both;
	background:url(/App_Themes/KC/images/leftBottom.png) no-repeat 0 0;
	_background:url(/App_Themes/KC/images/leftBottom.jpg) no-repeat 0 0;}

#wrapper #leftCol .ddList
{
    width:240px;    
}

#wrapper #leftCol #leftTop .charity{
	padding-bottom:10px;}

#wrapper #leftCol #leftTop .charity label{
	display:block;
	font-weight:bold;
	float:left;
	line-height:15px;		
	}

#wrapper #leftCol #leftTop form.charity select{ width:150px;}

#wrapper #leftCol #leftTop ul.leftNav{
	display:block;
	margin:10px 0 0 -10px;
	clear:both;}
	
#wrapper #leftCol #leftTop ul.leftNav li{
	display:block;
	height:20px;
	line-height:20px;
	}
	
* html #wrapper #leftCol #leftTop ul.leftNav li{overflow:hidden;}

#wrapper #leftCol #leftTop ul.leftNav li a{
	display:block;
	height:22px;
	line-height:22px;
	color:#fff;
	text-decoration:none;
	width:220px;
	padding-left:10px;
	font-weight:bold;	
	}
#wrapper #leftCol #leftTop ul.leftNav li a:hover{ background-color:#81DC28;}

#wrapper #rightCol{
	width:655px;
	height:450px;
	background:url(/App_Themes/KC/images/browseBgHome.png) no-repeat;
	_background:url(/App_Themes/KC/images/browseBgHome.jpg) no-repeat;
	float:right;
	}
	
#wrapper #rightColBrowse{
width:655px;
height:425px;
background:url(/App_Themes/KC/images/browseBg.png) no-repeat;
_background:url(/App_Themes/KC/images/browseBg.jpg) no-repeat;
float:right;
	}

#wrapper #rightCol .pad,#wrapper #rightColBrowse .pad{ padding:10px;}

#wrapper #rightCol .findGift,#wrapper #rightColBrowse .findGift{
	display:block;
	margin:0 auto;
	width:580px;}

#wrapper #rightCol .findGift label,#wrapper #rightColBrowse .findGift label{ 
	display:block;
	font-weight:bold;
	float:left;
	text-align:center;
	margin-right:10px;
	line-height:40px;}

* html #wrapper #rightCol .findGift label {margin-right:5px;}

#wrapper #rightCol .findGift select{ 
	width:130px;
	height:23px;
	margin-right:10px;}

#wrapper #rightCol .findGift .inputText{
	width:105px;
	padding-left:5px;
	height:20px;
	border:none;
	margin-right:10px;}

#wrapper #rightCol .findGift .button, #wrapper #rightColBrowse .findGift .button{
	padding-top:10px}

*+html #wrapper #rightCol .findGift .button{ top:5px;}
* html #wrapper #rightCol .findGift .button{ top:5px;}

#wrapper #footer{
	width:935px;
	clear:both;
	margin-top:50px;
	height:60px;
	padding-right:10px;
	}

#wrapper #footer p.address{
	font-size:12px;
	width:270px;
	float:left;
	padding-left:20px;
	line-height:14px;
	margin-top:5px;}

#wrapper #footer ul.footerLinks{
	float:left;
	margin-left:10px;}
	
#wrapper #footer ul.footerLinks li{ 
	display:inline;
	font-size:11px;
	line-height:35px;}

#wrapper #footer ul.footerLinks li a{
	text-decoration:none;
	padding:3px;}

#wrapper #footer ul.footerLinks li a:hover{ text-decoration:underline;}

#wrapper #footer ul.footerLinks li a.karmaAccount{
	display:block;
	background:url(/App_Themes/KC/images/karmaAccount.jpg) no-repeat;
	width:181px;
	height:46px;
	float:left;
	text-indent:-9999px;
	}
#wrapper #footer ul.footerLinks li a.karmaAccount:hover
{
	background:url(/App_Themes/KC/images/karmaAccountH.jpg) no-repeat;
}
#wrapper #footer ul.footerLinks li a.redeemVoucher{
display:block;
background:url(/App_Themes/KC/images/redeem.jpg) no-repeat;
width:184px;
height:46px;
float:left;
text-indent:-9999px;
}
#wrapper #footer ul.footerLinks li a.redeemVoucher{
display:block;
background:url(/App_Themes/KC/images/redeem.jpg) no-repeat;
width:184px;
height:46px;
float:left;
text-indent:-9999px;
}
#occassionKK
{
 clear:both;
 display:block;
 float:left;
 height:385px; 
 width:275px;
/* background:url(images/KarmaKLeft.png) no-repeat; 
 _background:url(images/KarmaKLeft.jpg) no-repeat; */
 }
 
#occassionLogo
{
 display:block;
 float:right;
 height:345px;
 width:354px; 
/* background:url(images/KarmaKRight.png) no-repeat; 
 _background:url(images/KarmaKRight.jpg) no-repeat; */
}


#cartinfo
{
    background: url(/App_Themes/KC/images/CartBox.png) no-repeat;
	_background: url(/App_Themes/KC/images/CartBox.jpg) no-repeat;

}
.startGiving
{
    float:right;
    margin:10px 10px 0px 0px;   
}
.metLogo
{
    position:absolute;
    width:103px;
    height:29px;
    top:60px;
    right:100px; 
    background:url(/App_Themes/KC/images/sponsors/MetlinkLogo.png) no-repeat;  
    z-index:1000;
}

.metCircle
{
  position:absolute;
  top:260px;
  left:940px;
  height:231px;
  width:217px;
  background:url(/App_Themes/KC/images/sponsors/MetlinkCircle.png) no-repeat;   
  z-index:1000;
}
