@charset "UTF-8";
/*======= 
xrosspath
team rsb 2008
kegan, kamal, moo, aizat, sean
04/22/08
version trunk.1
=======*/

body { font: 62.5% helvetica, arial, sans-serif; text-align: center; margin: 0 auto; padding: 0; background: #fff url(../images/bgtile.png) top left repeat-x; }
a { color: #16387c; }

#wrapper { width: 800px; text-align: left; margin: 0 auto; padding: 0; }
#header { width: 800px; height: 90px; padding: 0; background: url(../images/header-bg.png) top left no-repeat; margin: 0; }
#content { width: 800px; margin: 0; padding: 0 0 20px 0; font-size: 12px; }
#about-area { width: 400px; float: left; margin: 45px 0 0 40px; }
#login-bar { width: 260px; float: left; margin: 45px 0 0 50px; }
#footer { width: 800px; margin: 0; padding: 0; border-top: 1px solid #999; }

#logo h1 { text-indent: -9999px; line-height: .1em; font-size: .1em; width: 243px; height: 12px; padding: 30px 0 0 30px; float: left; }
#logo h1 a { display: block; width: 243px; height: 42px; }

#about-area { background: url(../images/people.png) top center no-repeat; text-align: center; font-size: 14px; color: #666; }
#about-area h2 { margin: 225px 0 5px 0; font: normal 24px georgia, times new roman, san-serif; color: #000; }
#about-area strong { font-weight: normal; font-size: 22px; color: #000; }
#about-area p span { font-size: 18px; }

#login-bar { }
#login-bar form { display: block; width: 261px; height: 308px; background: #b00000 url(../images/login-bg.png) top left no-repeat; padding: 25px 0 0 0; }
#login-bar form fieldset { border: none; }
#login-bar form fieldset legend { color: #fff; font-size: 16px; font-weight: bold; padding: 0 0 0 13px; }
#login-bar form fieldset label { color: #fff; margin: 15px 0 0 15px; display: block; }
#login-bar form fieldset input.chunky { margin: 0 0 0 15px; width: 210px; height: 29px; border: none; font-size: 22px; color: #999; }
#login-bar form fieldset div { margin: 5px 0 10px 11px; color: #fff; }
#login-bar form fieldset input.submit-button { background: #fff url(../images/signin-bg.png) top left no-repeat; width: 142px; height: 57px; margin: 5px 0 5px 10px; text-align: center; border: none; font-family: helvetica, arial, sans-serif; font-weight: lighter; font-size: 22px; color: #000; letter-spacing: -1px; }
#login-bar form fieldset p { margin: 32px 0 0 16px; padding: 0; color: #fff; font-size: 14px; font-weight: bold; line-height: 12px; }
#login-bar form fieldset p a { color: #fff; }
#login-bar p { display: block; padding: 0; }
#login-bar a.register-block { display: block; text-align: center; padding: 30px 0 0 0; width: 174px; height: 51px; color: #fff; font-size: 24px; background:#e57a16 url(../images/register-bg.png) top left no-repeat; text-decoration: none; line-height: 21px; margin: 0; }
#login-bar a:hover.register-block { text-decoration: underline; }

#content h2.breadcrumb { font-weight: bold; font-size: 24px; padding: 0; margin: 25px 0 10px 0; }
#content h3 { color: #cf8700; font-size: 18px; margin: 20px 0 10px 0; }
#content h3.ideas { color: #3373a8; font-size: 21px; }
#content ul#faq { margin: 5px 0 0 15px; padding: 0; }
#content ul#faq li { margin: 3px 0; list-style-type: disc; }

#content form#registration { width: 780px; margin: 0; padding: 0; }
#content form#registration p { margin: 0 0 15px 0; padding: 10px 0 0 0; font-size: 14px; letter-spacing: normal; }
#content form#registration fieldset { border-top: 1px solid #ccc; border-right: none; border-bottom: none; border-left: none; clear: both; padding: 5px 0; }
#content form#registration fieldset.last { border-bottom: 1px solid #ccc; }
#content form#registration legend { display: none; }
#content form#registration .data { float: left; width: 516px; margin: 5px 0; }
#content form#registration .help { float: left; width: 250px; color: #8c8d85; background: #f5f5de url(../images/top-cap.png) top left no-repeat; margin: 5px 0 5px 5px; font-size: 10px; font-style: italic; padding: 0; }
#content form#registration .data label { display: block; margin: 0; padding: 0; }
#content form#registration .data input { width: 97%; border: 1px solid #ddd; height: 24px; font-size: 22px; margin: 5px 0; color: #000; background: #ffffa0; }
#content form#registration .data p.need-help { margin: 0 0 5px 0; padding: 0; }
#content form#registration .data #help-locate { margin: 0; padding: 0 0 10px 0; line-height: 1em; }
#content form#registration .data #help-locate input.locate-input { width: 75%; margin: 0; padding: 0; height: 28px; }
#content form#registration .data #help-locate input.button { width: 100px; padding: 0; height: 28px; color: #666; font-size: 20px; font-weight: lighter; margin: 0; background: #ccc; }
#content form#registration .help p { display: block; background: url(../images/bottom-cap.png) bottom left no-repeat; padding: 10px; font-size: 11px; min-height: 38px; height: auto !important; height: 38px; margin: 0; }
#content form#registration .help p span#mapcontainer { display: block; height: 476px; padding: 0 0 10px 0; }
#content form#registration .help p span#maplocation { /*display: block; height: 425px; padding: 0 0 10px 0;*/ }
#content form#registration .help p.fluff { padding-bottom: 58px; }
#content form#registration div.submit { display: block; text-align: center; margin: 5px auto; }
#content form#registration input.register { border: none; height: 52px; width: 145px; background: url(../images/register-red-bg.png) top left no-repeat; text-align: center; margin: 5px 0 5px 10px; font-weight: lighter; font-size: 22px; color: #fff; letter-spacing: -1px; }

#maplocation { color: #000; margin: 0; padding: 20px 0 0 0; font-size: 14px; }
#maplocation em { display: block; margin: 20px 0 5px 0; font-style: normal; }
#maplocation .keyword { display: inline; color: #f00; font-style: italic; margin: 0; padding: 0; }
#maplocation ul#locationlist { margin: 10px 0 20px 0; padding: 20px 0; list-style: none; background: #fff; }
ul#locationlist li { margin: 10px; font-size: 12px; padding: 0; }
ul#locationlist li.odd { background: #ddd; }
ul#locationlist li a { color: #d33; }

#userbar { display: block; padding: 30px 0 10px 20px; }
#userbar img { float: left; padding: 1px; border: 1px solid #eee; margin: 0 2px 0 0; }
#userbar .detail { float: left; margin: 0 0 0 10px; }
#userbar .detail h2 { margin: 0; padding: 0; font-size: 20px; letter-spacing: -1px; }
#userbar .detail h2 .with { color: #dea129; }
#userbar .detail h2 .swap { font-weight: normal; text-transform: uppercase; font-size: 11px; padding: 0 0 0 10px; }
#userbar .detail h2 .swap a { text-decoration: none; letter-spacing: normal; padding: 0 0 0 5px; }
#userbar .detail h2 .swap a:hover { text-decoration: underline; }
#userbar .detail p { margin: 0; padding: 0; font-size: 13px; }
#userbar .detail p.about_you { position: absolute; width: 355px; padding: 10px; border-left: 1px solid #ccc; margin: -35px 0 0 285px; min-height: 45px; height: auto !important; height: 45px; line-height: 1em; color: #666; }

table#timeline { width: 800px; border-spacing: 5px 10px; margin: 0; overflow: hidden; }
table#timeline th { text-indent: -9999px; line-height: .01em; font-size: .01em; margin: 0; padding: 0; }
table#timeline td.year { color: #7aa1ff; border-bottom: 1px solid #ddd; font-size: 24px; letter-spacing: -1px; }
table#timeline td.date { vertical-align: top; text-align: right; width: 45px; font-size: 20px; color: #999; letter-spacing: -1px; text-transform: lowercase; padding: 0; margin: 0; line-height: 20px; }
table#timeline td.date span { display: block; color: #ccc; }
table#timeline td.xrossfinity { width: 56px; height: 71px; background: url(../images/xf-2-button.png) top left no-repeat; color: #fff; vertical-align: top; text-align: center; font-size: 13px; margin: 0; padding: 5px 0 0 0; }
table#timeline td.xrossfinity ul { margin: 0; padding: 0; list-style-type: none; }
table#timeline td.xrossfinity a { color: #fff; text-decoration: none; font-size: 11px; }
table#timeline td.xrossfinity a:hover { text-decoration: underline; }
table#timeline td.xrossfinity li.highest { color: #fff; font-size: 25px; font-weight: lighter; padding: 2px 0 0 0; line-height: 25px; letter-spacing: -1px;  }
table#timeline td.xrossfinity li.average { color: #fff; margin: 0; padding: 0 0 7px 0; font-size: 11px; line-height: 1em; }
table#timeline td.our_xrossfinity { color: #fff; width: 56px; height: 55px; background: url(../images/xf-1-button.png) top left no-repeat; vertical-align: top; text-align: center; font-size: 20px; margin: 0; padding: 17px 0 0 0; line-height: 1em; }

table#timeline td.description, table#timeline td.my_description, table#timeline td.your_description { font-size: 13px; vertical-align: top; padding: 2px 0 10px 0; }
table#timeline td.my_description p, table#timeline td.your_description p { width: 270px; margin: 0; padding: 0; }
table#timeline td.your_description p { color: #dea129; padding: 2px 0 0 45px; }
table#timeline td.your_description p.date { color: #308a70; font-weight: bold; margin: 0 0 5px 0; padding: 0; }
table#timeline td.description p { width: 500px; margin: 0; padding: 0; }
table#timeline td.description p.show-top_10 { font-size: 9px; letter-spacing: normal; padding: 15px 0 5px 0; }
table#timeline td.border-on { border-bottom: 1px dotted #eee; }

table#timeline .pad { margin: 20px 0 0 0; }
table#timeline .top_10 ul li { float: left; line-height: 1em; display: block; width: 90px; height: 77px; border: 1px solid #c0c0c0; margin: 0 9px 9px 0; }
table#timeline .top_10 ul li img { float: left; padding: 1px; border: 1px solid #ddd; margin: 0 5px 5px 0; }
table#timeline .top_10 ul li.full { width: 225px; height: 175px; }
table#timeline .top_10 ul li.full p { margin: 7px 0 7px 10px; padding: 0; }
table#timeline .top_10 ul li.full p.location { height: 26px; }
table#timeline .top_10 ul li .date { background: #f1f1f1; border-bottom: 1px solid #c0c0c0; }
table#timeline .top_10 ul li .date p { margin: 0 0 0 10px; padding: 4px 0; }
table#timeline .top_10 ul li.full .user_data { margin: 5px 0 0 10px; }
table#timeline .top_10 ul li.full .user_data .more_data { float: left; width: 155px; display: block; padding: 10px 0 0 0; }
table#timeline .top_10 ul li.full .user_data .more_data a { display: inline; font-size: 20px; }
table#timeline .top_10 ul li.full .user_data .more_data a.compare-block img { border: none; padding: none; position: absolute; margin: -48px 0 0 130px; }
table#timeline .top_10 ul li.full .user_data .more_data span { display: block; height: 18px; border: 1px solid #c0c0c0; margin: 5px 0 0 0; width: 115px; }
table#timeline .top_10 ul li.full .user_data .more_data span span { background: #bf9e80; width: 111px; height: 14px; margin: 2px 0 0 2px; border: none; }
table#timeline .top_10 ul li.full .user_data .more_data em { position: absolute; margin: -18px 0 0 120px; font-style: normal; }
table#timeline .top_10 ul li.full .user_description { margin: 5px 10px 10px 10px; background: #f0f0f0; }
table#timeline .top_10 ul li.full .user_description p { padding: 5px; height: 40px; }
table#timeline .top_10 ul li.updated { border: 1px solid #df7878; background: #fff0f0; }
table#timeline .top_10 ul li.updated .date { background: #9a0000; color: #fff; }
table#timeline .top_10 ul li .mini_data { margin: 3px; }
table#timeline .top_10 ul li .mini_data .img-container { height: 50px; height: 50px; }
table#timeline .top_10 ul li .mini_data img { float: none; display: block; }
table#timeline .top_10 ul li .mini_data a.compare-block img { border: none; padding: none; position: absolute; margin: -66px 0 0 56px; }
table#timeline .top_10 ul li.complete { width: 639px; height: 100px; margin: 0 0 10px 0; }
table#timeline .top_10 ul li.complete .img-container { float: left; height: 50px; width: 50px; }
table#timeline .top_10 ul li.complete img { margin: 5px; }
table#timeline .top_10 ul li.complete .name_xf { float: left; width: 141px; margin: 5px 0 0 0px; padding: 5px 0 0 5px; }
table#timeline .top_10 ul li.complete .name_xf a { font-size: 20px; }
table#timeline .top_10 ul li.complete .name_xf span { display: block; height: 18px; border: 1px solid #c0c0c0; margin: 5px 0 0 0; width: 115px; }
table#timeline .top_10 ul li.complete .name_xf span span { background: #bf9e80; width: 111px; height: 14px; margin: 2px 0 0 2px; border: none; }
table#timeline .top_10 ul li.complete .name_xf em { position: absolute; margin: -18px 0 0 125px; font-style: normal; }

table#timeline .top_10 ul li.complete .location_desc { font-size: 11px; float: left; width: 388px; margin: 5px 0 0 10px; }
table#timeline .top_10 ul li.complete .location_desc p { background: #f0f0f0; margin: 5px 0 0 0; width: 380px; }
table#timeline .top_10 ul li.complete .location_desc p span { display: block; padding: 5px; height: 35px; }

table#timeline .top_10 ul li.complete .compare { float: left; width: 28px; margin: 5px 0 0 5px; }
table#timeline .top_10 ul li.complete .compare img { padding: 0; margin: 0; border: none; }

#flash_error { margin: 0 auto 20px auto; font-size: 15px; font-family: tahoma, verdana, sans-serif; color: #000; text-align: center; border: 1px solid #eee; }
#flash_error p { padding: 10px; background: #fdf0f0; margin: 2px; }
#flash_success { argin: 0 auto 20px auto; font-size: 15px; font-family: tahoma, verdana, sans-serif; color: #000; text-align: center; border: 1px solid #eee; }
#flash_success p { padding: 10px; background: #f8fef1; margin: 2px; }
#div_start_date, #div_end_date { font-size: 11px; color: #999; }


/*=== clearfix ===*/
.clearfix:after {  
	content: ".";  
	display: block;  
	clear: both;  
	visibility: hidden;  
	line-height: 0;  
	height: 0;  
	}  

.clearfix { display: inline-block; }  
html[xmlns] .clearfix { display: block; }  
* html .clearfix { height: 1%; }  
