/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/

/* color palette 

brown: #3F2A2A
orange: #D18C42
cream: #F9EEDE

*/

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
/* global reset */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, 
acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, 
strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
/*global tags*/

body.global {background: #3F2A2A url(images/global-bg-gradient.gif) repeat-x; }

a img { border: 0; }

#page {
	margin: 0 auto;
	width: 780px;
	overflow: visible;
	position: absolute;
	left:50%;
	top:0;
	margin-left:-390px;
	z-index:2;
	}

p{
	color: #3F2A2A;
	font: normal 11px lucida grande, lucida sans, sans-serif;	
	margin-bottom: 11px;
	}
	
a{
	color: #D18C42;
	font: normal 10px lucida grande, lucida sans, sans-serif;
	text-decoration: none;
	}
	
a:hover {color: #331A1A;}

a.button {
	background: #D18C42;
	padding: 7px 10px;
	text-decoration: none;
	font: bold 14px gill sans, sans-serif;
	color: white;
	float: left;
	}

a.button:hover {background: #3F2A2A; }

h2{
	color: #D18C42;
	font: bold 24px georgia, times, serif;	
	margin-bottom: 15px;
	padding: 0;
	}
	
h3{
	margin-bottom: 11px;
	color: #D18C42;
	font: bold 11px lucida grande, lucida sans, sans-serif;
	}

ul{
	list-style: none;
	margin-bottom: 22px;
	}
	
li{
	color: #3F2A2A;
	font: normal 11px lucida grande, lucida sans, sans-serif;
	line-height: 12px;
	}
	
#banner-image {
	background: url(images/global-bg-image.gif) center no-repeat;
	height: 200px;
	position:absolute;
	width:100%;
	left:0;
	top:0;
	z-index:1;
	}

#content{
	background: white;
	float: left;
	padding: 15px;
	width: 475px;
	margin-top: 170px;
	}

#content-no-sidebar{
	background: white;
	padding: 15px;
	width: 750px;
	margin-top: 170px;
	}

#sidebar{
	float: left;
	margin-left: 45px;
	padding: 15px;
	background: #D18C42;
	width: 200px;
	margin-top: 170px;
	}

#sidebar h3{
	background: #F9EEDE;
	color: #D18C42;
	font: bold 12px gill sans, sans-serif;
	padding: 5px 8px;
	margin-bottom: 11px;
	}

#sidebar p{
	color: #F9EEDE;
	padding-left: 8px;
	clear: both; 
	}
	
#sidebar a{color: #331A1A}

#sidebar a:hover {color: #F9EEDE}

#sidebar a.button {
	background: #F9EEDE;
	padding: 7px 8px;
	text-decoration: none;
	font: bold 12px gill sans, sans-serif;
	color: #D18C42;
	float: left;
	margin: 0 0 11px 8px;
	}

#sidebar a.button:hover {background: white; }

#sidebar ul{
	list-style:none;
	margin: 0;
	padding: 0;
	}

#sidebar li {
	margin-left: 8px;
	}

#sidebar li a{color: #F9EEDE;}

#sidebar li a:hover {color: white;}

#footer{
		clear: both;
		padding-top: 15px;
		margin-bottom:30px;
		width: 505px;
		}

#footer a{
	font: normal 9px lucida grande, lucida sans, sans-serif;
	color: #D18C42;
	}

#footer a:hover{color: #E5D9CC;}

#footer p{
	font: normal 9px lucida grande, lucida sans, sans-serif;
	color: #E5D9CC;
	margin-bottom:5px;
	}	

.clear {clear: both;}

.left-align {
	float: left;
	margin-right: 15px;
	}


/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
/*navbar*/

h1 a.logo {
	margin-top: 18px;
	float: left;
	padding-top: 50px;
	overflow: hidden;
	background-image: url(images/euroloop-logo.gif);
	background-repeat: no-repeat;
	width: 144px;
	height: 0px !important;
	height /**/: 50px;
}

h1 a.logo:hover{
	background-color: transparent;
	}

#navbar {
    position: relative;
    height: 75px;
    background: #F9EEDE;
	}

#nav {
	list-style: none;
	position: absolute;
	top:30px;
	right: -25px;
}
#nav li {
	float: left;

}

#nav a{
	display: block;
	font: bold 12px gill sans, sans-serif;
	color: #D18C42;
	text-decoration: none;
	background: #F9EEDE;
	padding: 7px 15px;
	margin-right: 25px;
	}

#nav a:hover { color: #F9EEDE; background: #D18C42; }

#nav li.active a { color: #F9EEDE; background: #3F2A2A; }

	
/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
/*home*/

body.home {background: #3F2A2A url(images/home-bg-gradient.gif) repeat-x; }

#home-banner-image {
	background: url(images/home-bg-image.gif) center no-repeat;
	height: 260px;
	position:absolute;
	width:100%;
	left:0;
	top:75px;
	z-index:1;
}

#home-banner{
	height: 260px;
	position: relative;
	}
	
#home-banner h2{
	color: #3F2A2A;
	font: 23px gill sans, sans-serif;
	font-weight: lighter;
	position:absolute;
	width: 430px;
	top: 75px;
	}

#home-banner h2 a{
	font: normal 23px gill sans, sans-serif;
	color: #D18C42;
	}

#home-banner h2 a:hover {
	color: #3F2A2A;
	}

#charities{
	text-align: center;
	position:absolute;
	right: 0px;
	top: 135px;
	}

#charities p{font-size: 12px;}

#home-networks-logo{
	float: left;
	margin-top: 20px;
	margin-left: 50px;
	padding-top: 16px;
	width: 100px;
	overflow: hidden;
	background-image: url(images/networks-logo-home.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/: 16px;
}

#home-word-logo{
	float: left;
	margin-top: 10px;
	padding: 33px 0 0 0;
	overflow: hidden;
	background-image: url(images/4word-logo-home.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/: 33px;
	}

#home-word-logo:hover, #home-networks-logo:hover, #route:hover  {
	background-color: transparent;
	}

#home-post{
	float: left;
	width: 780px;
	background: #3F2A2A url(images/home-post-bg.gif) repeat-y;
	margin-top: 40px;
	}

#holder1 {
	width: 200px;
	margin: 0 45px 0 0;
	float: left;
	padding: 15px;
	}

#holder1 h2{
	color: #F9EEDE;
	font: bold 20px georgia, times, serif;	
	margin-bottom: 15px;
	padding: 0;
	}
	
#holder1 p {color: #F9EEDE; font-size:12px; margin:0 0 11px 0; padding:0;}

#holder1 a {color: #3F2A2A; font-size:12px; margin:0; padding:0;}

#holder1 a:hover {color: #F9EEDE;}

#holder1 a.button {
	background: #F9EEDE;
	padding: 7px 10px;
	text-decoration: none;
	font: bold 14px gill sans, sans-serif;
	color: #D18C42;
	float: left;
	margin-top: 12px;
	}

#holder1 a.button:hover {background: white; }

#holder2 {
	width: 200px;
	float: left;
	padding: 15px;
	}

#holder2 h2{
	font-size: 20px;
	}


#holder2 a.button {
	margin-top: 26px;
	}

.latest-posts li,#tweet ul li{
	font: normal 9px lucida grande, lucida sans, sans-serif;
	color: #D18C42;
	padding-bottom: 6px;
	}

#tweet p{
	font-size: 11px;
	color: #D18C42;
	padding-left: 8px;
	}

.latest-posts a, #tweet a {
	font-size: 11px;
	color: #D18C42;
	}

.latest-posts a:hover, #tweet a:hover {
	color: #D18C42;
	text-decoration: underline;
	}

#holder3 {
	width: 200px;
	float: left;
	padding: 15px;
	margin-left: 45px;
	}

#holder3 h2{
	font-size: 20px;
	}

#holder3 h3{
	background: #D18C42;
	color: white;
	font: bold 12px gill sans, sans-serif;
	padding: 5px 8px;
	margin-bottom: 11px;
	}

#holder3 ul{
	margin-bottom: 15px;
	list-style: none;
	padding: 0 8px 0 8px;
	}

#creditfooter{display: none;}

.date{font: normal 9px lucida grande, lucida sans, sans-serif;
	color: #D18C42;
	padding-bottom: 6px;
	}

.headline a:hover{color: #D18C42;
	text-decoration: underline;
	}

/*--------------------------------------------------------------*/
/*--------------------------------------------------------------*/
/*route,donate,gear*/

#route-image {
	position: absolute;
	top: 23px;
	left: 23px;
	z-index: 1;
	}

#route-text {
	position: absolute;
	top: 15px;
	left: 15px;
	width: 310px;
	z-index: 2;
	}

#content-route{
	background: white;
	width: 780px;
	height: 844px;
	margin-top: 170px;
	position: relative;
	}

#donate-column1 {
	float:left;
	width: 215px;
	}

#donate-column2 {
	float:left;
	width: 215px;
	margin-left:45px;
	}
	
#donate-networks-logo{
	padding-top: 46px;
	overflow: hidden;
	background-image: url(images/networks-logo-donate.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/: 46px;
	}
	
#donate-word-logo{
	padding-top: 46px;
	overflow: hidden;
	background-image: url(images/4word-logo-donate.gif);
	background-repeat: no-repeat;
	height: 0px !important;
	height /**/: 46px;
	}

table#bike {
	float: left;
	border-collapse: collapse;
	border-spacing: 0px;
	width: 280px;
	color: #3F2A2A;
	font: normal 11px lucida grande, lucida sans, sans-serif;
	margin-left: 35px;
	margin-bottom: 40px;
	}

table#bike th{
	text-align: right;
	font: bold;
	}
	
table#bike td{
	text-align: left;
	padding-left: 5px;
	}
	
#luggage-wrapper{
	width: 780px;
	margin-left: -15px;
	}
	
#luggage-holder1{
	float: left;
	width: 200px;
	padding: 0 15px;
	}
	
#luggage-holder2{
	float: left;
	width: 200px;
	padding: 0 15px;
	margin-left: 45px;
	}

#luggage-holder3{
	float: right;
	width: 200px;
	padding: 0 15px;
	}


