/***********************************************/
/* Web Site: Barnardo's Main web site          */
/*                                             */
/* Media: Print                                */
/*                                             */
/* Author: Oliver Hoad                         */
/*                                             */
/* Created: 02nd February 2010                 */
/***********************************************/

/* 
-- CSS INDEX --

1.BASIC HTML
2.STRUCTURE
3.GLOBAL NAVIGATION
4.HOMEPAGE
5.INDEX PAGES
6.DONATE
7.STANDARD PAGE ELEMENTS
8.REGIONAL PAGES
9.PAGE ACTIONS
10.POPUPS
11.NOMENSA DONATE

*/

/* ----- 1. BASIC HTML ---------------------------------------*/

h1 {
	font-family: "Georgia","Times New Roman", Times, serif;
	font-weight: normal;
	font-size: 170%;
	line-height: 170%;
	padding: 0;
	margin: 0 0 10px 0;
}

h2 {
	font-family: "Georgia", "Times New Roman", Times, serif;
	font-weight: normal;
	font-size: 150%;
	line-height: 190%;
	padding: 0;
	margin: 1em 0 0 0;
}

h3 {
	font-family: "Georgia", "Times New Roman", Times, serif;
	font-weight: bold;
	font-size: 130%;
	line-height: 190%;
	padding: 0;
	margin: 1em 0 0 0;
}

p {
	font-weight: normal;
	font-size: 130%;
	line-height: 170%;
	padding: 0;
	margin: 0.2em 0 0.8em 0;
}

p a {
	color: #6d9c16;
	text-decoration: none;
	padding: 2px 0 3px 0;
}

p a:hover {
	text-decoration: underline;
	background: #f0f7e5;
}

p a:link:after,
p a:visited:after {
  content: " (" attr(href) ") ";
  font-size: 90%;
}

ul {
	font-weight: normal;
	font-size: 130%;
	line-height: 180%;
	padding: 0;
	margin: 0.2em 0em 0.8em 1.5em;
}

ul a {
	color: #6d9c16;
	text-decoration: none;
	padding: 2px 0 3px 0;
}

ul a:hover {
	text-decoration: underline;
	background: #f0f7e5;
}

ul a:link:after,
ul a:visited:after {
  content: " (" attr(href) ") ";
  font-size: 90%;
}

ol {
	font-weight: normal;
	font-size: 130%;
	line-height: 180%;
	padding: 0;
	margin: 0.2em 0em 0.8em 2.5em;
}

ol a {
	color: #6d9c16;
	text-decoration: none;
	padding: 2px 0 3px 0;
}

ol a:hover {
	text-decoration: underline;
	background: #f0f7e5;
}

ol a:link:after,
ol a:visited:after {
  content: " (" attr(href) ") ";
  font-size: 90%;
}

hr {
	height: 1px;
	border: none;
	border-bottom: 1px dotted #bbb;
	margin: 7px 0;
}

/* ----- 2. STRUCTURE ----------------------------------------*/

body {
	margin: 0;
	padding: 0;
	background: #fff;
	font-family: "Georgia", "Times New Roman", Times, serif;
	font-size: 75%;
	color: #111;
}

.clear {
	clear: both;
}

#wrapper {
	width: auto;
	height: auto;
}

#main {
	width: auto;
	height: auto;
	background: #fff;
}

#header {
	width: auto;
	height: auto;
}

#header div {
	width: auto;
	height: auto;
}

#contRight {
	width: auto;
	height: auto;
	padding: 10px 48px 20px 48px;
}

#content {
	width: auto;
	height: auto;
}

#contentWide {
	width: auto;
	height: auto;
}

.hide,
#header div p,
#header div a,
#header div a:hover,
#search,
#searchbtn,
#searchinput,
#nav,
#rhCol,
#newsletterLink,
#newsletterLink a,
#newsletterLink a:hover,
#footer,
#footer p,
#footer a,
#footer a:hover {
	display: none;
}

/* ----- 3. GLOBAL NAVIGATION --------------------------------*/

/* hidden above */

/* ----- 4. HOMEPAGE -----------------------------------------*/

#homeHeader {
	width: 100%;
	height: 220px;
	border: 1px solid #e4e4e4;
}

#homeHeaderTxt {
	float: left;
	width: 220px;
	height: 200px;
	padding: 15px 0 3px 0;
}

#homeHeader h2 {
	clear: none;
	margin: 0 0 4px 0;
	font-size: 110%;
	font-weight: bold;
	line-height: 140%;
}

#homeHeader p {
	margin: 0 0 5px 0;
	font-size: 90%;
	color: #111;
	line-height: 165%;
}

#homeHeaderImg {
	float: left;
	width: 268px;
	margin-right: 20px;
}

.hide,
#homeHeaderTabs,
#homeHeaderTabs div,
#homeHeaderTabs div.last,
#homeHeaderTabs p,
#rhSpotlight,
#rhSpotlight h2,
#rhSpotlight h3,
#rhSpotlight p,
#rhSpotlight ul,
#rhSpotlight ol,
#spotDescription,
#footerPic,
#changingPic {
	display: none;
}

/* ----- 5. INDEX PAGES --------------------------------------*/

#indexHeader {
	width: auto;
	height: auto;
}

#indexHeaderTxt {
	float: left;
}

#indexHeader h1 {
	clear: none;
	width: 250px;
	margin: 17px 0 0 0;
}

#indexHeader p {
	width: 250px;
	color: #111;
}

#indexHeaderImg {
	float: left;
	margin-right: 20px;
}

#indexCols {
	margin-top: 25px;
}

#indexCols div {
	float: left;
	width: 121px;
	margin: 0 15px 20px 0;
}

#indexCols .last {
	float: left;
	width: 121px;
	margin-right: 0;
}

#indexCols h2 {
	margin: 0 0 5px 0;
	font-size: 105%;
	font-weight: bold;
	line-height: 135%;
}

#indexCols p {
	font-size: 90%;
	line-height: 170%;
}

/* ------6. DONATE -------------------------------------------*/

#donFormDiv {
	width: 501px;
	height: 176px;
	margin-top: 30px;
}

.donSubmit {
	width: 225px;
	height: 28px;
	border: none;
	background: url(donate-submit.gif) no-repeat;
	cursor: pointer;
}

#donFormDiv form {
	margin: 0;
	padding: 0;
}

#donFormDiv label {
	display: block;
	margin: 0;
	padding: 0;
	font-family: georgia;
	font-size: 120%;
	font-weight: bold;
	color: #fff;
}

.cashDonationTabs {
	height: 46px;
	background: url(donate-tabs-cash.gif) no-repeat;
}

.ddDonationContent, .cashDonationContent {
	height: 130px;
	margin-left: 1px;
	padding: 10px 20px 10px 20px;
	background: url(donate-bg.jpg) repeat-x;
}
	
.ddDonationTabs {
	height: 46px;
	background: url(donate-tabs-reg.gif) no-repeat;
}

.ddDonationTabs a, .cashDonationTabs a {
	display: block;
	float: left;
	width: 250px;
	height: 46px;
	padding: 0;
	cursor: pointer;
}

.ddDonationTabs a:hover, .cashDonationTabs a:hover {
	background: none;
}

.donOther {
	float: left;
	width: 50px;
	height: 17px; 
	border: 1px solid red;
	background: url(donate-other.gif) 0px -2px no-repeat; 
	background: #ff0;
}

#otherAmount {
	height: 15px;
	color: #444;
}

.donateShopList{
	margin: 0 40px 5px 20px; 
	font-size: 100%; 
	color: #666
}

.donateShopList p{
	line-height: 150%; 
}

.donatePhone {
	margin: 25px 30px 0 0;
	padding: 10px;
	border: 1px solid #e5e5e5;
	font-family: "Georgia","Times New Roman", Times, serif;
	font-size: 130%;
	color: #777;
	line-height: 150%;
}

.donateOther {
	float: left;
	margin: 15px 18px 0 0;
	background: url(donate-arrow.gif) 200px 13px no-repeat;
}

.donateOther a {
	display: block;
	width: 210px;
	padding: 15px;	
	border: 1px solid #e5e5e5;	
	font-family: "Georgia","Times New Roman", Times, serif;
	font-size: 110%;
	font-weight: bold;
}

.donateQuote {
	width: 500px;
	height: 100px;
	margin-top: 15px;
	background: url(barn08-quote-left.gif) no-repeat;
	color: #777;
}

.donateQuote div {
	padding: 10px 30px;
	background: url(barn08-quote-right.gif) bottom right no-repeat;
}

.donateQuote div p {		
	font-family: "Georgia","Times New Roman", Times, serif;
	font-size: 120%;
	line-height: 160%;
}

.hidden, .hide {
	display: none;
}

/*-------7. STANDARD PAGE ELEMENTS ---------------------------*/

.quote {
	margin: 0px 37px 20px 5px;
	background: url(barn08-quote-left.gif) no-repeat;
	color: #777;
}

.quote div {
	padding: 10px 25px;
	background: url(barn08-quote-right.gif) bottom right no-repeat;
}

.quote div p {
	font-size: 90%;
	line-height: 160%;
}

#content p a, #content li a, .highlightgrey a, .highlight a {
	font-weight: bold;
}

.alignright, .alignleft {
	float: right;
	clear: right;
	margin: 5px 0 15px 15px;
}

.highlightgrey, .highlight {
	clear: both;
	margin: 15px 0 15px 0;
	padding: 10px;
	border: 1px solid #abd067;
   	font-size: 0.90em;
   	line-height: 1.7em;
}

.highlight br, .highlightgrey br {
	line-height: 0.5em;
}

.quoteright, .quoteleft {
	float: right;
	clear: right;
	width: 170px;
	margin: 10px 0 15px 15px;
	padding: 10px;
	border: 1px solid #abd067;
   	font-size: 0.9em;
	line-height: 1.5em;
}

.extrainfotitle {
	margin: 8px 37px 0 5px;
}

.extrainfotitle h2 {
	margin: 0;
	padding: 10px;
	border: 1px solid #e5e5e5;	
	background: #f9f9f9;
	font-size: 110%;
	font-weight: bold;
	color: #666;
	line-height: 100%;
}

.ulbg {
	margin: 0px 37px 0 5px;
	padding: 10px;
	border: 1px solid #e5e5e5;
	border-top: none;
	font-size: 90%;
}

.ulbg ul li {
	line-height: 140%;
}

.adobe {
	margin: 8px 37px 0 5px;
	padding: 10px;
	border: 1px solid #e5e5e5;
	color: #666;
}

.adobe p {
	font-size: 90%;
	line-height: 160%;
}

table {
	margin: 10px 0;
}

td {
	padding: 5px;
}

.rowheader {
	background: #7fba00;
	font-weight: bold;
	color: white;
}

.rowodd {
	background: #fff;
	color: black;
	font-size: 1em;
}

.roweven {
	background: #f3f3f3;
	color: black;
	font-size: 1em;
}

.arrowBack {
	padding-left: 15px;
	background: url(arrow-back.jpg) 0px 2px  no-repeat;
}

.arrowForward {
	padding-right: 15px;
	background: url(arrow-forward.jpg) right 2px no-repeat;
}

.smalltext {
	font-size: 90%;
}

.rhQuote {
	margin: 0px 37px 20px 5px;
	background: url(barn08-quote-left.gif) no-repeat;
	color: #777;
}

.rhQuote div {
	padding: 10px 25px;
	background: url(barn08-quote-right.gif) bottom right no-repeat;
}

.rhQuote div p {
	font-size: 90%;
	line-height: 160%;
}

#rhFeature, .rhFeature {
	margin: 8px 37px 0 5px;
	border: 1px solid #e5e5e5;
}

#rhFeature h2, .rhFeature h2 {
	margin: 0 0 7px 0;
	padding: 10px;
	border-bottom: 1px solid #e5e5e5;
	background: #f9f9f9;
	font-size: 105%;
	font-weight: bold;
	color: #666;
	line-height: 120%;
}

#rhFeature p, #rhFeature ul, #rhFeature ol, .rhFeature p, .rhFeature ul, .rhFeature ol {
	padding: 0 10px 7px 10px;	
	font-size: 90%;
	color: #666;
	line-height: 150%;
}

#rhFeature li, .rhFeature li {
	margin-bottom: 3px;
}

/*-------8. REGIONAL PAGES [?] -------------------------------*/

.extraregion {
	margin: 10px 37px 0px 5px;
	padding-bottom: 10px;
	border: 1px solid #e5e5e5;
}

.extraregion h2 {
	margin: 0;
	padding: 10px;
	border-bottom: 1px solid #e5e5e5;	
	background: #f9f9f9;
	font-size: 110%;
	font-weight: bold;
	color: #666;
	line-height: 100%;
}

.extraregion p, .extraregion ul, .extraregion ol {
	padding: 10px 10px 0 10px;
	font-size: 90%;
}

/* ----- 9. PAGE ACTIONS -------------------------------------*/

.hide,
#page_actions_container,
#page_actions_share ul,
#page_actions_share li,
#page_actions_top ul,
#page_actions_top li,
#page_actions_clear {
	display: none;
}

/*-------10. POPUPS ------------------------------------------*/

#googlemap_banner_popup, #banner_popup, #popup_wrapper {
	width: 100%;
}

#googlemap_banner_popup div, #googlemap_popup, #ecard_view {
	width: 900px;
	margin: auto;
	padding: 5px;
	background: #fff;
}

#banner_popup div, #centre_popup {
	width: 480px;
	margin: auto;
	padding: 10px;
	background: #fff;
}

/*-------11. NOMENSA DONATE ----------------------------------*/

.hide,
.nomIntro,
.nomLine1,
.nomDonateSteps,
.nomContent,
.nomUnitLeft,
.nomBox,
.nomBttnA,
.nomBttnA:link {
  display: none;
}

/* Box skins */

.nomSkinL {
  background-color: #fff;
}

/* Grids */

.nomGlobalWidth {
  width: auto;
  margin: 0;
}

/* Direct Debit details */

.nomDirectDebit {
  margin: 0 0 0 38px;
  width: 700px;
}

.nomDirectDebit .nomHeader {
  margin: 0 125px 2.5em 10px;
}

.nomDirectDebit .nomTitle {
  font-family: "Georgia", "Times New Roman", Times, serif;
  font-size: 1.75em; /* 21px */
  font-weight: normal;
  margin-bottom: 0.8em;
}

.nomDirectDebit .nomSummary {
  line-height: 1.583em;
}

.nomDirectDebit .nomTitle,
.nomDirectDebit .nomSummary,
.nomDirectDebit .nomFooter p {
  color: #333;
}

.nomDirectDebit .nomImg {
  float: right;
  margin: 20px 170px 30px 0;
}

.nomDirectDebit .nomLine {
  clear: both;
  padding: 0;
}

.nomDirectDebitDetails {
  border: 1px #cdcdcd solid;
  background-color: #fff;
  padding: 0 17px;
}

.nomDirectDebitDetails .nomUnitInner {
  margin-left: 17px; 
  margin-right: 17px;
}

.nomDirectDebit .nomFooter {
  border-top: 1px #ccc dashed;
  margin: 10px 35px 0 35px;
  text-align: center;
  padding: 1em 60px 1em 60px;
}
    
.nomDirectDebit .nomFooter p {
  font-size: 1.083em; /* 13px */
  line-height: 1.2em;
  margin-bottom: 2em;
}

.nomAddress,
.nomInstructions {
  font-weight: bold;
  font-size: 1.167em; /* 14px */
  line-height: 1.286em;
  margin-bottom: 0;
}
    
.nomDirectDebit dt,
.nomDirectDebit dd {
  padding: 0.7em 10px;
}

.nomDirectDebit dt {
  margin: 1.8em 0 0 0; 
  padding-bottom: 0.5em;
}

.nomDirectDebit dd {
  margin: 0;
}
    
.nomHighlight {
  background-color: #f2f2f2;
  color: #333;
}   

.nomHighlightShort {
  width: 40%;
}

.nomHighlight,
.nomHighlightTitle {
  font-weight: bold;
  font-size: 1.167em;
}

.nomHighlightSummary {
  line-height: 1.666em;
}

/* Helpers */

.nomClearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
     
.nomRm {
  position: absolute; 
  left: -999em;
}
    
/* Grids */

.nomUnit {float:left;}
.nomCol1of2 {width: 50%;}
.nomCol1of3 {width:33.33333%;}
.nomCol2of3 {width:66.66666%;}
.nomCol1of4 {width:25%;}
.nomCol3of4 {width:75%;}

.nomUnitInner {
  margin-left: 10px; 
  margin-right: 10px;
}

.nomWrapper {
  width: 970px;
  margin: 0 auto;
}    
    
.nomLine {
  padding: 0 0 20px 0;
}

.socialMedia > *{
float:right;
}
