/*=== === === === === === === === === === */

/*=STRUCTURE
=== === === === === === === === === === */

@import 'reset.css';

html {

}

body {
	font: 10px "Lucida Grande", Lucida, Verdana, sans-serif;
	text-align: center;
	background: #f7f6f1 url(../images/bg-page.jpg) repeat-y center;
}

div#WrapOuter {
	width: 985px;
	margin-left:auto;
	margin-right:auto;
}

div#WrapInner {
	width: 985px;
	margin: auto;
	text-align: center;
	background-color: #fff;
	float: left;
	background-image: url(../images/topline.png);
	background-repeat: repeat-x;
}


/*=COMMON
=== === === === === === === === === === */

* {
	padding: 0;
	margin: 0
}

p {
	line-height: 150%;
	margin-bottom: 8px;
}

a:link, a:visited {
	color: #d83c29;
	text-decoration: none;
}

a:hover {
	color: #d83c29;
	text-decoration: underline;
}

.line {
	height: 2px;
	border-top: 0px dotted #fff;
	border-right: 0px dotted #fff;
	border-left: 0px dotted #fff;
	border-bottom: 1px dotted #6f6f6f;
	display: block;
}

h2 {color: #d83c29;}

div#ContentMain #Item h2 {
	font-size: 14px;
	margin-bottom: 10px;
	text-transform: uppercase;
}

div#ContentSub #Item h2 {
	font-size: 12px;
	margin-bottom: 10px;
}

div#ContentSubpage #Item h2 {
	font-size: 14px;
	margin-bottom: 10px;
	text-transform: uppercase;
}

#ContentSubpage #Item h2.h2-replace-1 {
	background:transparent url(../images/h2-replace-1.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:20px;	
	margin-bottom: 20px;
}

#ContentSubpage #Item h2.h2-replace-2 {
	background:transparent url(../images/h2-replace-2.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:16px;	
	margin-bottom: 20px;
}

#ContentSubpage #Item h2.h2-replace-3 {
	background:transparent url(../images/h2-replace-3.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:16px;	
	margin-bottom: 20px;
}

#ecard-how h2.h2-replace-4 {
	background:transparent url(../images/h2-replace-4.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:10px;	
	margin-bottom: 26px;
}

#ContentSubpage #Item h2.h2-replace-5 {
	background:transparent url(../images/h2-replace-5.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:20px;	
	margin-bottom: 30px;
}

.select-donation h2.h2-replace-6 {
	background:transparent url(../images/h2-replace-6.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:20px;	
	margin-bottom: 30px;
}

.details h2.h2-replace-7 {
	background:transparent url(../images/h2-replace-7.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:17px;	
	margin-bottom: 30px;
}

.contact h2.h2-replace-8 {
	background:transparent url(../images/h2-replace-8.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:18px;	
	margin-bottom: 30px;
}

#ContentSubpage #Item h2.h2-replace-9 {
	background:transparent url(../images/h2-replace-9.jpg) no-repeat;
	display:block;
	height:0 !important;
	overflow:hidden !important;
	padding-top:30px;	
	margin-bottom: 30px;
}

#Item .cart {
	border: 1px solid #c5c7d8;
	padding: 4px 7px 3px;	
	position: absolute;
	top: 0;
	right: 0;
}

#Item .cart p {
	color: #636993;
	margin: 0;
	padding-left: 25px;
	background: url(../images/cart-icon.jpg) no-repeat left center;
	text-transform: uppercase;
	letter-spacing: 0.5px
}

#Item .cart p a,
#Item .cart p a:hover {color: #636993;}

#Item .even {
	width:297px;;
	float: left;
	margin: 20px 20px 10px 0;
}

#Item .odd {
	width:297px;;
	float: left;
	margin: 20px 0 10px 0;
}

#Item .last {margin-top: 30px; margin-bottom: 30px;}

#Item .ecard img {
	background: url(../images/ecard-bg.jpg) no-repeat center;
	padding: 8px;
	margin-bottom: 10px;
}

.order #Item .ecard img {
	float: left;
	margin-right: 20px;
}

#Item .send {
	border: 1px solid #c5c7d8;
	padding: 2px 7px 1px 3px;
	float: left;
}

#Item .send a {
	color: #636993;
	margin: 0;
	padding-left: 30px;
	background: url(../images/send-icon.jpg) no-repeat left center;
	text-transform: uppercase;
	letter-spacing: 0.5px
}

div#ContentSubpage #Item .ecard h2 {
	text-transform: none;
	font-weight: normal;
}

#ecard-how {
	position: absolute;
	right: 60px;
	bottom: 80px;
	width: 225px;
	height: 221px;
}

#ecard-how ul li {
	padding:10px 10px 10px 60px;
	color: #6d6e71;
	text-align: left;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-bottom: 8px;	
}

#ecard-how ul li.step-1 {background:#E8DAB2 url(../images/1.jpg) no-repeat scroll 25px center;}

#ecard-how ul li.step-2 {background:#E8DAB2 url(../images/2.jpg) no-repeat scroll 25px center;}

#ecard-how ul li.step-3 {background:#E8DAB2 url(../images/3.jpg) no-repeat scroll 25px center;}

p.recipientEmail {float:left; margin-right:25px;}

.order .ecard {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px dotted #AFAFAF; 
}

.cart .ecard {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px dotted #AFAFAF; 
	position: relative;
	min-height: 210px;
}

.cart .ecard img {
	float: left;
	margin-right: 20px;
}

/* Replaced with below
.cart .controls {
	bottom:20px;
	left:317px;
	position:absolute;
}
*/

.cart .controls {position:static;}

.cart .controls li {float: left;}

.cart .controls li a {
	text-transform: uppercase;
	border-right:1px solid;
	margin-right:10px;
	padding-right:10px;
}

.cart .controls li.no-border a {border-right: none;}

p.donation-amount {
	text-transform: uppercase;
	font-size: 12px;
}

.selectedAmount {
	float:left;
	padding:19px 69px 21px 7px;
	margin-right: 10px;
}

.amount-25 {background:transparent url(../images/amount-25.jpg) no-repeat;}

.amount-50 {background:transparent url(../images/amount-50.jpg) no-repeat;}

.amount-100 {
	background:transparent url(../images/amount-100.jpg) no-repeat;
	padding:19px 74px 21px 10px;
}

.amount-500 {
	background:transparent url(../images/amount-500.jpg) no-repeat;
	padding:19px 79px 21px 10px;
}

.amount-other {
	background:transparent url(../images/amount-other.jpg) no-repeat;
	padding:19px 84px 21px 10px;
}

.select-donation p {
	clear:both;
	margin-top:10px;
}

.order .clear-block,
.cart .clear-block {
	clear: both;	
	margin-bottom: 20px;
	border-bottom: 1px dotted #AFAFAF; 
}

.details .fieldset,
.contact .fieldset {
	background: #F7F0E0;
	padding: 20px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.order input.form-text,
.cart input.form-text {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background: #fff;
	border:none;
	color: #828386;
	font: 12px "Lucida Grande", Lucida, Verdana, sans-serif;
	padding: 4px 10px 4px 10px;
	width: 245px;
}

.order input.form-text2,
.cart input.form-text2 {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background: #fff;
	border:1px solid #828386;
	color: #828386;
	font: 12px "Lucida Grande", Lucida, Verdana, sans-serif;
	padding: 4px 10px 4px 10px;
	width: 120px;
}

.details textarea {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background: #fff;
	border:none;
	color: #828386;
	font: 10px "Lucida Grande", Lucida, Verdana, sans-serif;
	padding: 4px 10px;
	width: 545px;
	margin-top: 5px;
}

.message label {
	color: #828386;
	font: 10px "Lucida Grande", Lucida, Verdana, sans-serif;
	margin-top: 10px;
}

.message {margin-top: 15px;}

.details .required input {background: #FFFFFF url(../images/required.jpg) no-repeat scroll right center}

.error input {
	border: 1px solid red !important; 
	color: red !important;
}

#error {
	background:#FFEEEE url(../images/error.png) no-repeat scroll 4px center;
	border:1px solid red !important;
	color:red !important;
	font-size:12px;
	margin-bottom:15px;
	padding:1px 8px 3px 25px;
	width:400px;
}

#error p {margin: 0;}

.recip-email input,
.card-name input,
.contact .name,
.contact .email {
	float: left;
	margin: 0 30px 0 0;
	width: 245px;
}

.visibility,
.updates {
	color: #828386;
	font: 10px "Lucida Grande", Lucida, Verdana, sans-serif;
	padding-top: 3px;
}

.visibility label,
.updates label {margin-left: 5px;}

.order .preview {
	border: 1px solid #c5c7d8;
	padding: 4px 20px 3px;
	float: left;
	margin-right: 10px;
}

.order .preview a {
	color: #636993;
	margin: 0;
	text-transform: uppercase;
	letter-spacing: 0.5px
}

.cart .payment {float: right;}

.cart-bottom {
	border: 1px solid #c5c7d8;
	padding: 4px 20px 3px;
	float: left;
	margin-right: 10px;
}

.cart-bottom a {
	color: #636993;
	margin: 0;
	padding:3px 0 3px 25px;
	background: url(../images/cart-icon.jpg) no-repeat left center;
	text-transform: uppercase;
	letter-spacing: 0.5px
}

.payment input {
	background:transparent url(../images/basket.jpg) no-repeat scroll 9px 2px;
	border:1px solid #C5C7D8;
	color:#636993;
	float:left;
	letter-spacing:0.5px;
	margin:0;
	padding:5px 10px 4px 35px;
	text-transform:uppercase;
	outline: none !important;
	font-size: 10px;
	font-family:"Lucida Grande",Lucida,Verdana,sans-serif;
} 

.payment input:hover {text-decoration: underline; cursor: pointer;}

form {clear: both;}

.total a {
	color:#636993;
	letter-spacing:0.5px;
	text-transform:uppercase;
}

.create-more {
	border:1px solid #C5C7D8;
	margin-right:10px;
	padding:4px 20px 3px;
	float: right;
}

.total {text-align: right;}

.total {
clear:both;
display:block;
text-align:right;
}

p.sum {
	float: right;
	color: #b4282e;
	margin-right:20px;
	font-size: 14px;
}

#eCardDescriptionPage {margin-left:318px;}

/*=STRUCTURE
=== === === === === === === === === === */

#PageContainer {
	width: 985px;
	height: 800px;
}

#Masthead {
	width: 985px;
	height: 367px;
	background-image: url(../images/masthead_01.png);
	background-repeat: no-repeat;
	background-position: 30pt 96px;
}

div#Logo {
	width: 320px;
	height: 300px;
	margin-top: 30px;
	float: left;
	background: url(../images/logo.png) no-repeat 40px 29px;
}

#LowerHalf {
	width: 985px;
	min-height: 500px;
	background-image: url(../images/masthead_02.jpg);
	background-repeat: no-repeat;
	background-position: 30pt 0;
	position: relative;
}


/*=NAVIGATION
=== === === === === === === === === === */

/* META NAVIGATION */

#navcontainer { 
	float: right;
	margin-right: 30px; 
}

#Meta div.searchform {
	color: #afafaf;
	font-size: 10px;
	padding-top: 6px;
	height: 20px;
	float: right;
}

#Meta input#search.form-text {
	border: 1px #afafaf solid;
}

input#submit.submit {
	padding: 0;
	margin: 0;
	font-size: 10px;
	color: #707070;
	border: none;
	background: none;
}

input#submit.submit:hover {color: #000;}

/*Fat Erik's Pipelist*/

#NavMeta {
	color: #afafaf;
	height: 26px;
	float: right;
	padding-right: 30px;
	margin-top: 0;
}

#NavMeta #navlist {
	list-style: none;
	padding: 0;
	margin: 0;
}

#NavMeta #navlist li {
	line-height: 26px;
	display: inline;
	padding: 0;
	margin: 0;
}

#NavMeta #navlist li a {
	line-height: 26px;
	text-decoration: none;
	color: #afafaf;
	padding-left: 4px;
	padding-right: 4px;
}

#NavMeta #navlist li a:hover {
	line-height: 26px;
	text-decoration: underline;
}

#NavMeta #navlist li:before { content: "| "; }
#NavMeta #navlist li:first-child:before { content: ""; }

/*IE workaround*/
/*All IE browsers*/
* html #NavMeta #navlist li {
	border-left: 1px solid black;
	padding: 0 0.4em 0 0.4em;
	margin: 0 0.4em 0 -0.4em;
}

/*Win IE browsers - hide from Mac IE\*/
* html #NavMeta #navlist { height: 1%; }

* html #NavMeta #navlist li {
	display: block;
	float: left;
}

/*End hide*/
/*Mac IE 5*/
* html #NavMeta #navlist li:first-child { border-left: 0; }


/* MAIN NAVIGATION */

#NavMain {
	width: 985px;
	height: 36px;
	float: left;
}

#NavMain, #nav ul { /* all lists */
	padding: 0;
	margin: 0;
	text-align: center;
	list-style: none;
	line-height: 1;
}

#NavMain a {
	line-height: 36px;
	display: block;
	width: 180px;
	text-decoration: none;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 1px;
}

#NavMain a:hover {
	color: #000;
}

#NavMain ul#nav {
	float: left;
	position: relative;
	z-index: 999;
	top: 1px;
	padding-left: 44px;
}

#NavMain li { /* all list items */
	float: left;
	width: 180px; /* width needed or else Opera goes nuts */
}

#nav li.LinkOne a {	background-image: url(../images/navmain_01.png);}

#nav li.LinkTwo a {	background-image: url(../images/navmain_02.png);}

#nav li.LinkThree a {background-image: url(../images/navmain_03.png);}

#nav li.LinkFour a {background-image: url(../images/navmain_04.png);}

#nav li.LinkFive a {background-image: url(../images/navmain_05.png);}

#NavMain li ul { /* second-level lists */
	position: absolute;
	width: 180px;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	background-color: #7b776b;
	z-index: 999;
}

#NavMain li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}

#NavMain li:hover ul li a, #nav li.sfhover ul li a{
	color: #fff;
	background-image: none;
	line-height: 14px;
	padding-top: 11px;
	padding-bottom: 11px;
}

#NavMain li:hover ul li a:hover, #nav li.sfhover ul li a:hover {color: #000;}

#NavMain li:hover ul li, #nav li.sfhover ul li {border-bottom: 1px #afafaf dotted;}

#NavSub {
	width: 160px;
	height: 400px;
	float: right;
	margin-left: 0px;
	margin-right: 60px;
	margin-top: 58px;
	background: url(../images/bg-subnav.png) no-repeat;
	z-index: 5;
}

#NavSub ul {
	padding-left: 10px;
	width: 135px;
}

#NavSub li {
	list-style: none;
	margin: 0;
	border-bottom: 1px #6e6052 dotted;
	text-align: left;
}

#NavSub li a { 
	text-align: left;
	color: #6e6052;
	text-decoration: none; 
	line-height: 40px;
	text-transform: uppercase;
	font-size: 11px;
}

#NavSub li a:hover {color: #333332;}

div#Breadcrumbs {
	margin-top: 20px;
	line-height: 170%;
	width: 450px;
	float: left;
	margin-left: 45px;
	padding-top: 20px;
	padding-right: 30px;
	padding-left: 20px;
	text-align: left;
}

#Breadcrumbs a {
	color: #6e6052;
	text-decoration: none;
}

#Breadcrumbs a:link,
#Breadcrumbs a:visited {
	color: #6e6052;
	text-decoration: none;
}

#Breadcrumbs a:hover {
	color: #000;
	text-decoration: underline;
}


/*=CONTENT
=== === === === === === === === === === */

div#Content {
	clear: both;	
}

div#ContentSub {
	width: 185px;
	float: right;
	margin-top: 72px;
	padding-right: 30px;
	padding-bottom: 20px;
	padding-left: 0;
	text-align: left;
}

div#ContentSub div#Item {
	padding-bottom: 20px;
	padding-left: 20px;
}

div#ContentSub div#aeroplan {
	padding-bottom: 20px;
	padding-left: 20px;
}

div#ContentMain {
	line-height: 170%;
	width: 450px;
	float: left;
	border-right: 1px #afafaf dotted;
	margin-left: 45px;
	margin-top: 20px;	
	padding-right: 30px;
	padding-left: 20px;
	text-align: left;
}

div#ContentSubpage {
	line-height: 170%;
	width: 615px;
	float: left;
	margin-left: 45px;
	margin-top: 20px;	
	padding-left: 20px;
	padding-bottom: 20px;
	text-align: left;
	position: relative;
}

div#ContentMain div#Item {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px #afafaf dotted;
}

div#ContentMain div#Item2 {
	margin-top: 20px;
	padding-bottom: 20px;
}

div#SubContentMain div#Item {
	margin-top: 20px;
	padding-bottom: 20px;
	border-bottom: 1px #afafaf dotted;
}

div#SubContentMain div#Item2 {
	margin-top: 20px;
	padding-bottom: 20px;
}


/*=FOOTER
=== === === === === === === === === === */

#Footer {
	width: 900px;
	height: 30px;
	padding-top: 12px;
	clear: both;
	border-top: 1px #afafaf dotted;
	color: #7b7b7b;
	font-size: 9px;
	margin-left: 45px;
	margin-right: 30px;
}