﻿
/* ==== INDEX2 ===== */

/* ---- GLOBAL ---- */

.hasJs {}

.grid-on .hi{ 
background-image:url("images/grid.png");
display:block;
height:800px;
left:50%;
margin-left:-490px;
position:absolute;
width:960px;
opacity:.5;
z-index:2147483647;
  }

li .slidingdoor-button.default span { font-size: 1em; line-height: 15px; }

#searchAndJoin .submit-small { margin: 0 0 0 10px;cursor: pointer;}
.search-button:hover,
.search-button:focus,
.search-button:active { position: relative; top: 1px; left: 1px;  }

/* ---- #homepage -  homepage generic ---- */

#homepage a:link,#homepage a:visited { color: #3a7fc8}
#homepage a:hover { color:#5898dd}
#homepage a:focus,#homepage a:active { color:#1a6abf}	 

#homepage { margin: 0 auto;}

#homepage p {}

.size15px p, h2.size15px,label.size15px { font-size:1.4em;line-height:135%; font-weight: 300; }
.slidingdoor-button.default span { font-size: 1.8em; }


/* ---- #topSection ---- */

#topSection { margin: 18px 0 40px; background: transparent url(images/graphics/embelish/gradient-radial-blue.jpg) no-repeat left bottom; padding: 0 0 0 20px;}
#topSection  { _display:  inline;}

#whatJustGivingDoes { font-size: 1.8em; font-weight: bold; color: #86857c; padding: 0 0 40px; margin:0 18px 0 0; border-bottom: 1px #e9f0ff solid;  }
#fundraisingSteps { position:absolute;  width: 300px; }
#fundraisingSteps h2 { margin: 12px 0 18px; font-size: 2.4em;}
#fundraisingSteps ul { margin-bottom: 16px;  }
#fundraisingSteps li { margin-bottom: 8px; font-size: 16px; color:#999;}
#fundraisingSteps li strong {  /* see "#whatsOnJustGiving h2," */}
#fundraisingSteps .slidingdoor-button.default span { padding-left: 37px; padding-right: 45px;  }

/*  .{background: transparent url(homepage-sprite.jpg) no-repeat 0 0;} */

#raiseMoreSection { 
float:right;
height:324px;
overflow:hidden;
padding:0 43px 22px 17px;
position:relative;
width:640px;
}
#raiseMoreOptions { position: absolute; bottom:-9px; *bottom: 2px; right:0; z-index:9999; }
#raiseMoreOptions ul { position: relative;width:640px; border-top:#727884 3px solid;width:619px;left:-21px;}
#raiseMoreOptions li { float: left;  display: block; background:transparent url() no-repeat 0 0; color: #fff; text-align: center; padding-bottom:2px;font-weight:bold; font-size:1.2em;   position:relative}

#raiseMoreOptions li a:link,
#raiseMoreOptions li a:visited {padding: 12px 0;width: 154px;_width: 153px;  display:block; position:relative; background:#878D9D; text-decoration:none; color:#fff; border-bottom:#E1E1E1 3px solid;border-left: 2px solid #757B89; }

#raiseMoreOptions .first a:link,
#raiseMoreOptions .first a:visited { width:153px ; border-left: 0 none; }

#raiseMoreOptions li.activeSlide a:link,
#raiseMoreOptions li.activeSlide a:visited  {  border-left: 0 none; background:#37B0CD; padding-top:18px;padding-bottom:17px; border-bottom-color:#C5C5C5; margin-top:-3px }

.first.activeSlide { width:151px  }

/* will add this via jS... as it doesn't add value without jS working.. */
#raiseMoreOptions .activeSlide .arrow { position: absolute; width:12px; height:7px; 
background: transparent url(images/graphics/icons/arrow-12x7.png) no-repeat 0 0; display:block;  top:-10px; left:65px;}
#raiseMoreOptions .arrow { display:none;}


#raiseMoreIdeas { position: relative; /*top:-304px;	*/left:43px; }
#raiseMoreIdeas .to-right{ position:relative;left:-43px !important; }
#raiseMoreIdeas .to-left {position:relative;right:43px !important; }

#raiseMoreIdeas .info-box { 
background: rgba(0, 0, 0, 0.7);
overflow:hidden; /* had to be included for IE8.  AWESOME! */
bottom:38px;
color:#FFFFFF;
right:0;
padding:6px 28px 10px;
position: relative;
width:563px;
}

body {border: 20px solid red !important;}

.ie8 #raiseMoreIdeas .info-box,.ie7 #raiseMoreIdeas .info-box,.ie6 #raiseMoreIdeas .info-box {
border: 20px solid red;
filter: alpha(opacity=80);
background: #000;
}

#raiseMoreIdeas .to-right .info-box { left:43px }

#raiseMoreIdeas .info-box a:link,#raiseMoreIdeas .info-box a:visited { color:#37B0CD; font-weight:bold;}
#raiseMoreIdeas .info-box a:hover,#raiseMoreIdeas .info-box a:focus,#raiseMoreIdeas .info-box a:active { text-decoration:none;}

#searchAndJoin { position: relative; margin: 30px 0 0 -22px; }
#searchAndJoin h2 { font-size: 128%; }
#searchAndJoin li { float: left;border-right: 1px solid #feefe4;  margin-bottom: 10px; width: 300px;_width: 280px; min-height: 150px; height:auto !important;height:150px ;  padding: 10px 0 0 20px;}
#searchAndJoin li.first{ border-right: 1px solid #ecf2fe; padding-left: 0;}
#searchAndJoin .txt-input {
padding:8px;
position:relative; 
float:left;
top:-2px; width: 178px; color: #999; font-size: 12px;
 }
#searchAndJoin .search-wrapper { position: absolute; bottom: 24px; *width:250px; zoom:1;}
#searchAndJoin #areYouFromACharity .search-wrapper {bottom: 22px; _margin-top:60px;} 
#areYouFromACharity h2 { _position:absolute; _width:280px; _top: 10px ; }
#searchAndJoin #areYouFromACharity{ _padding-top: 40px; }

/* creates left hand border top  */

#searchAndJoin #searchCharity h2 { margin-top: -20px; padding-top: 26px; border-top: 1px solid #ecf2fd; width: 258px; }
/* ///  creates left hand border top  */

#searchAndJoin #areYouFromACharity {
	float: right;
	width:222px;
	_width:202px;
 padding-right: 76px;
}

/* ---- /#topSection ---- */


/* ---- #whatsOnJustGiving - Content middle/list of what's happening on JG ---- */

#whatsOnJustGiving {}

#whatsOnJustGiving .panel { float: left; width: 300px;padding-right: 20px;padding-bottom:60px; position: relative;  line-height: 110%; min-height: 30px; color:#999;}

#whatsOnJustGiving .more-link { position: absolute; bottom: 20px; left: 0; }

#whatsOnJustGiving li img { float: left; margin: 0 12px 0 0; }
/* #ourFundraisers p,
#whatsOnJustGiving li ul,
#whatsOnJustGiving li ol { margin-left: 75px; } */

#whatsOnJustGiving #JGiPhone ul,
#whatsOnJustGiving #LatestFundraisingEvents ol { float: left; margin: 0 0 0 4px; }

#LatestFundraisingEvents ol {width:198px; _position:absolute;}

#whatsOnJustGiving li li { float: none; width: auto; padding-bottom: 0; padding-right: 0; }
#whatsOnJustGiving .grey-top { border-top: 6px solid #e9ecf9;margin-right:23px;_margin-right:23px;;width:297px;  padding-top: 30px; padding-right: 0;}
#whatsOnJustGiving .grey-top img { margin-bottom: 20px; }
#whatsOnJustGiving h2,#fundraisingSteps li strong { color: #2A42C6; font-size: 128%; margin-bottom: 20px;}
#areYouFromACharity h2 { color: #ff9933}

#whatsOnJustGiving .grey-top  {_width:276px;}
#whatsOnJustGiving .grey-top img {_width:260px;}

#whatsOnJustGiving ul li,
#LatestFundraisingEvents ol li,
#jgNews li { margin:0 0 4px 0; list-style: circle inside; height: inherit; }

#jgNews ol { 
clear:both; 
overflow:hidden;
text-overflow: ellipsis;
*width:182px;
}
#jgNews li { margin-left: 2px; }

#whatsOnJustGiving #jgNews li img { margin:0 12px 0 0 }
#jgNews .image-stripe { height:100px; width:300px; display:block; overflow:hidden; margin-bottom:20px }
#whatsOnJustGiving #jgNews li { 
white-space:nowrap;
width:282px;
position:relative;
*width:262px;
*overflow:hidden;
}

/*hide the h2 for the blog listing*/
li#jgNews .jgNews h2 {display:none;}

#whatsOnJustGiving #searchSection { width: 600px;  }
#searchSection h2,#searchSection h3 {/* see "#whatsOnJustGiving h2," */}
#searchSection h3 { font-weight: 300}
#searchSection li { float: left; width: 290px;}
#whatsOnJustGiving #LatestFundraisingEvents { width: 300px; padding-right: 0; }
#LatestFundraisingEvents li { margin-left: 12px;white-space:nowrap; }
#LatestFundraisingEvents h3 { font-weight: 300; color: #999; display: inline; padding: 0 3px 0 0 ; }
#LatestFundraisingEvents .dtstart { font-style: italic; font-size:90%; background: transparent url(images/pipe-grey.gif) no-repeat left 1px; padding-left: 7px;}

.more-link { margin: 20px 0 0; display: block;}

