/*
	Filename         :	homepage.css
	Version			 :	3.1 (REDESIGN_2010)
	Last updated by  :	KS, The Guild (kaoru@theguildnetwork.com)
	Last Updated     :	3.0 / 20 January 2010: Homepage and Day page specific styles (initial release)
						Jan - May 2010: Minor cosmetic updates
						3.1 / 25 June 2010: Search added (NOTE THIS RELEASE BREAKS THE OLD HOMEPAGES WITHOUT SEARCH)
						3.1.2 / 12 July 2010: Tweaks to J4G Day tabs and login box
						3.1.3 / 22 July 2010: Layout tweaks and Opera browser fixes
						3.1.4 / 4 Aug 2010: Home page hero messaging change
						3.1.5 / 11 Aug 2010: Overlap fix on "webshop" panel
						3.1.7 / 24 Aug 2010: Amendments for new "Day" hero panel
*/

/*the rows */

#topRow, #middleRow, #bottomRow
{
	padding: 6px;
	clear: both;
}

#topRow .fullHeight, #bottomRow .fullHeight, #topRow .halfHeight, #middleRow .fullHeight
{
	width: 194px;
	min-height: 246px;
	background: url(../images/bgHomepageTopRowFullHeight.gif) no-repeat;
	float: left;
	margin-right: 7px;
	padding: 20px;
	font-size: 1em;
}

#middleRow .fullHeight
{
	width: 440px;
	min-height: 119px;
	background-image: url(../images/bgHomepageMiddleRowFullHeight.gif);
	padding-top: 12px;
	padding-right: 13px;
}

#bottomRow .fullHeight
{
	min-height: 205px;
	background-image: url(../images/bgHomepageBottomRowFullHeight.gif);
}

#bottomRow .lastItem, #topRow .lastItem, #middleRow .lastItem { margin-right: 0; }

#topRow .fullHeight h2, #bottomRow .fullHeight h2, #topRow .halfHeight h2, #middleRow .fullHeight h2
{
	padding-bottom: -3px;
	border-bottom: 1px #ece9e9 solid;
	margin-bottom: 6px;
	margin-top: -10px;
}

.vignette
{
	position: absolute;
	margin-top: -121px;
	width: 195px;
	height: 114px;
	display: block;
	background-image: url(../images/bgHomePageVignette.png);
	margin-bottom: 6px;
}

#topRow a.tileButton, #bottomRow a.tileButton, #middleRow a.tileButton
{
	position: absolute;
	display: block;
	width: 234px;
	height: 286px;
	z-index: 1000;
	margin-left: -20px;
	margin-top: -20px;
}
#middleRow a.tileButton
{
	height: 151px;
	width: 473px;
	margin-top: -12px;
}
#bottomRow a.tileButton { height: 245px; }
#topRow a:hover, #topRow a:active { background-image: url(../images/bgHomepageTopRowFullHeight_hover.png); }
#middleRow a:hover, #middleRow a:active { background-image: url(../images/bgHomepageMiddleRowFullHeight_hover.png); }
#bottomRow a:hover, #bottomRow a:active { background-image: url(../images/bgHomepageBottomRowFullHeight_hover.png); }

#middleRow p img { float: left; }
#middleRow .vignette { 	margin-top: -6px; }
#middleRow div.middleText
{
	width: 230px;
	float: right;
	padding-top: 3px;
}

/* temporary half height styles - to be deprecated when search UI added */
/* now amended for search UI - Jun 2010 */

#topRow .halfHeight
{
	min-height: 80px;
	background-image: url(../images/bgHomepageTopRowHalfHeightNew.gif);
}
#topRow .halfHeight a.tileButton { height: 120px; }
#topRow .halfHeight a:hover, #topRow .halfHeight a:active { background-image: url(../images/bgHomepageTopRowHalfHeightNew_hover.png); }

#topRow .halfHeight p img
{
	float: right;
	margin-top: 4px;
	width: 72px !important;
	height: 64px !important;
}

#topRow .halfHeight h2 { margin-bottom: -6px; }
#topRow .halfHeight p
{
	line-height: 1.25em;
	padding-right: 3px;
}

/* hero area */

#heroPanel
{
	width: 466px;
	height: 286px;
	background: url(../images/bgHomeHeroPanel.gif) no-repeat;
	float: left;
	margin-right: 7px;
	padding-top: 4px;
	padding-left: 6px;
}

#heroPanel div { height: 286px; }

#heroPanel h2.info
{
	width: 460px;
	height: 156px;
	position: relative;
	margin-top: -210px;
	background-image: url(../images/bgHomeHeroDayOverlayText.png);
	background-repeat: no-repeat;
	z-index: 1000;
}

#heroPanel p a
{
	width: 161px;
	height: 50px;
	display: block;
	background-image: url(../images/btnHomepageFindOtMore.png);
	position: relative;
	margin-top: -16px;
	margin-left: 280px;
	z-index: 1000;
}

.J4Gday #heroPanel p a { background-image: url(../images/btnHomepageSignUpNow.png); }

#heroPanel p a:hover, #heroPanel p a:active 
{ background: url(../images/btnHomepageFindOtMore.png) 0 -50px; }

.J4Gday #heroPanel p a:hover, .J4Gday #heroPanel p a:active 
{ background: url(../images/btnHomepageSignUpNow.png) 0 -50px; }

/* additional styles for J4G day hero tabs navigation */

#heroPanel ul#heroTabs
{
	list-style-type: none;
	margin: 0;
	position: relative;
}

#heroPanel ul#heroTabs li
{
	display: inline;
	margin: 0;
	height: 40px;
}

#heroPanel ul#heroTabs li a
{
	width: 106px;
	height: 34px;
	display: inline-block;
	background: url(../images/bgHeroTab2.png) 0 -5px;
	margin-right: 1px;
	text-align: center;
	vertical-align: top;
	padding-top: 6px;
	font-weight: bold;
	padding-right: 4px;
	padding-left: 4px;
}

#heroPanel ul#heroTabs li.lastItem a
{
	width: 107px;
	margin-right: 0;
}

#heroPanel ul#heroTabs li a.current,
#heroPanel ul#heroTabs li a.current:hover
{
	background-position: 0 -50px;
	color: #fff;
}

#heroPanel ul#heroTabs li a:hover
{
	background-position: 0 -95px;
	text-decoration: none;
	color: #4e4e4e;
}

#heroPanel div#heroPanes { height: 232px; }

#heroPanes a.infoPanel
{
	background: url(../images/bgHeroPaneInfopanel2.png) top no-repeat;
	display: block;
/*	padding: 15px; */
	padding: 10px 15px;
	font-size: 0.8em;
	color: #fff;
	width: 430px;
/*	height: 40px; */
	height: 30px;
	position: relative;
	margin-top: -90px;
}

/* Donate button */

#donateButton
{
	float: left;
	margin-bottom: 0.8em;
	margin-top: 0.4em;
}
#donateButton a
{
	background-image: url(../images/btnHomepageDonateNow.gif);
	width: 223px;
	height: 66px;
	display: block;
}
#donateButton a:hover, #donateButton a:active { background: url(../images/btnHomepageDonateNow.gif) 0 -66px; }

/* Fundraising pack button */

a.fundraisingPack
{
	background-image: url(../images/btnHomepageFundraisingPack.gif);
	width: 192px;
	height: 86px;
	display: block;
}

a.fundraisingPack:hover, a.fundraisingPack:active
{ 
	background: url(../images/btnHomepageFundraisingPack.gif)!important;
	background-position: 0 -86px!important;
}

/* Login box */

#loginBox
{
	width: 194px;
	float: left;
	padding: 14px 20px 26px 20px;
	font-size: 1em;
	background: url(../images/bgHomepageSearch.gif) no-repeat;
	height: 40px;
	margin-top: 6px;
}

a.goButton
{
	width: 69px;
	height: 33px;
	display: block;
	position: relative;
	background-image: url(../images/btnGo.png);
	margin-top: -40px;
	margin-left: 130px;
}
a.goButton:hover, a.goButton:active
{ 
	background: url(../images/btnGo.png)!important;
	background-position: 0 -33px!important;
}

/* search box - June 2010 */

div.homeSearch
{
	background: url(../images/bgHomepageSearch.gif) no-repeat;
	width: 235px;
	height: 80px;
	float: left;
/*	margin-bottom: 8px; */
}

div.homeSearch fieldset
{
	border: 0;
	border-style: none;
	margin-top: 10px;
	margin-left: 15px;
}

div.homeSearch fieldset legend
{
	margin-bottom: -4px;
	font-weight: bold;
	display: block;
	width: 200px;
	margin-left: 5px;
	height: 25px;
}

div.homeSearch fieldset input.textBox
{
	background: url(../images/bgSearchTextBox.gif) no-repeat;
	width: 125px;
	height: 17px;
	padding: 3px;
	border: 0;
	border-style: none;
	margin-left: 2px;
	color: #2a2a2a;
}

div.homeSearch input.goButton
{
	width: 69px;
	height: 33px;
	background: url(../images/btnGo.png);
	border: 0;
	border-style: none;
	padding-left: 69px!important;
	outline: none!important;
	color: transparent!important;
	font-size: 0;
	line-height: 0;
}
div.homeSearch input.goButton:hover, div.homeSearch input.goButton:active
{ 
	background-image: url(../images/btnGo.png)!important;
	background-position: 0 -33px!important;
}

/* New Fundraising pack button for search release Jun 2010 */

a.fundraisingPackNew
{
	background-image: url(../images/btnHomepageFundraisingPackNew.gif);
	width: 230px;
	height: 122px;
	display: block;
	float: left;
	margin-left: 3px;
}

a.fundraisingPackNew:hover, a.fundraisingPackNew:active
{ 
	background: url(../images/btnHomepageFundraisingPackNew.gif)!important;
	background-position: 0 -122px!important;
}

/* items hidden left from stylesheet enabled browsers (Accessibility) */

h1,
a span,
#heroPanel h2 span
{
	position: absolute;
	left: -3000px;
}