/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
©2010 centresource interactive agency.  /z
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */

@import url("reset.css");
@import url("text.css");
@import url("jquery.fancybox-1.3.1.css");
@import url("font-face.css");
@import url("non-awesome-browsers.css");

/*=================================
@group [GENERAL] 
===================================*/

body { background: #1e1e1e url(../images/body-bg.jpg);background-attachment:fixed;color: #fff;font:200 14px/1.5 "Titillium",Helvetica,Arial,'Liberation Sans',FreeSans,sans-serif;position:relative; }
/*Clearfix*/
.group:after { visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0; }
* html .group { zoom: 1; }
*:first-child+html .group { zoom: 1; }

/*=================================
@group [LINKS] 
===================================*/
a { color:#e69021;text-decoration:none !important; }

/*=================================
@group [HEADERS] 
===================================*/
h1 { width:240px;height:246px;background:url(../images/logo.png) no-repeat;text-indent:-9999px;position:relative;left:-50px;float:left;margin:0; }
h1 a { display:block;width:100%;height:100%; }
h2 {font-size:16px;color:#999;text-transform:uppercase;margin-bottom:10px;font-weight:600; }

/*=================================
@group [BRANDING HEADER] 
===================================*/
#header { width:780px;margin:0 auto;position:relative; }
#header > div { float:right; line-height:246px; }
a.login, a.signup { background:#6a6a6a; font-weight:800; padding:7px 10px 5px; color:#fff; text-decoration:none; text-transform:uppercase; -webkit-border-radius:4px; -moz-border-radius:4px; -webkit-transition:.2s linear all; margin-right:10px; position:absolute; right:160px; bottom:35px; }
a.login:hover { color:rgba(255,255,255,.5); }
a.signup { background:#2b5a7e; right:40px; }
header .social { display:block; width:32px; height:32px; overflow: hidden; position:absolute; right:20px; top:20px; z-index:1000; }
header .social + .social { top:70px; }

/*=================================
@group [CONTENT] 
===================================*/
/*Main*/
#content-main { width:780px; margin:0 auto; clear:both; font-size:20px; margin-bottom:30px; }
#content-main > div { float:left; width:245px; margin-left:22px; }
#content-main > div:first-child { margin:0; }

/*Secondary*/
#content-secondary { background:#2b5a7e; padding:30px 0; clear:both; background:url(../images/wrapper-bg.jpg); margin-bottom:60px; -webkit-box-shadow:0 -10px 20px rgba(0,0,0,.5); -moz-box-shadow:0 -10px 20px rgba(0,0,0,.5); box-shadow:0 -10px 20px rgba(0,0,0,.5); }
#content-secondary > * { width:780px; margin:0 auto; }
#content-secondary > p { margin-bottom:30px;
  font-weight:400; }
#content-secondary a { display:block; height:90px; background:rgba(0,0,0,.3); color:rgba(255,255,255,1); -webkit-transition:.2s linear all; -moz-transition:.2s linear all; width:740px; padding:0 20px; margin-bottom:10px; clear:both; overflow:hidden; }
#content-secondary a:hover { background:rgba(0,0,0,.6); color:rgba(255,255,255,.6); -webkit-transform:scale(1.05); -moz-transform:scale(1.05); }
#content-secondary a h3,
#content-secondary a p { float:left; margin:0; line-height:90px; }
#content-secondary a p { float:right; font-size:18px; }
#content-secondary a h3 { font-size:36px; font-weight:200; }

/*=================================
@group [TABS] 
===================================*/
#tabs { width:780px; margin:0 auto; list-style:none; font-size:16px; font-weight:600; text-transform:uppercase; border-bottom:1px solid #666; }
#tabs li { float:left; line-height:2; margin-left:50px; position:relative; cursor:pointer; }
#tabs li:first-child { margin-left:0; }
#tabs li span { display:none; width:100%; height:9px; background:url(../images/tab-caret.png) center bottom no-repeat; position:absolute; left:0; bottom:-9px; }
#tabs li:hover { color:rgba(255,255,255,.8); }
#tabs li.current { color:rgba(255,255,255,.6); }
#tabs li.current span { display:block; }
#tabs-content { width:780px; height:340px; margin:0 auto; clear:both; overflow:hidden; position:relative; }
#tabs-content > div { position:absolute; width:780px; height:340px; }
.content-a { float:left; width:390px; font-size:16px; }
.content-a p:first-child { font-weight:600; padding-top:20px; }
.content-b { position:relative; top:-20px; padding-top:20px; float:right; width:315px; color:#999; background:url(../images/notalone-fund-logo.png) 150px top no-repeat; min-height: 260px; }
.content-b p { font-size:12px;font-family:Helvetica,Arial,sans-serif;padding-right:180px; padding-top:20px; }
.content-b a { background:#bf7b22 url(../images/donate-arrow.png) right center no-repeat;-webkit-border-radius:4px;-moz-border-radius:4px;padding:2px 30px 0 8px;color:#fff;font-weight:600;display:inline-block;line-height:2;position:relative;font-size:16px;-webkit-transition:.1s linear all; }
.content-b a:hover { -webkit-transform:scale(1.1);-webkit-box-shadow:0 0 15px rgba(0,0,0,.5); -moz-transform:scale(1.1);-moz-box-shadow:0 0 15px rgba(0,0,0,.5); }

/*Team*/
#team { position:relative; float:left; width:100%; padding-top:20px; }
#team li { list-style:none; margin:0; position:relative; float:left; width:225px; height:115px; border:5px solid #222; margin-left:37px; margin-bottom:20px; }
#team li#jeff, #team li#jayne { margin-left:0; }
#team div { opacity:0; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5);  text-align:center; -webkit-transition:.2s linear all;}
#team span { padding:3px 28px 3px 7px; background:rgba(0,0,0,1) url(../images/donate-arrow.png) right center no-repeat; -webkit-border-radius:8px; -moz-border-radius:8px; position:absolute; right:10px; bottom:7px; font-size:12px; }
#team a { color:#fff; }
#team li:hover div { opacity:1; }
.bio h2 {margin-bottom:0;}

/*Advisory Board*/
#board { float:left; position:relative; padding-top:20px; }
#board li { list-style:none; margin:0; position:relative; float:left; width:140px; margin-left:20px; margin-bottom:20px; font-size:11px; line-height:18px; font-family:Helvetica;}
#board p { margin:0; }
#board li:first-child { margin-left:0; }

/*================================= 
@group [MISC] 
===================================*/

/*Coming Soon Message*/
body > .message { background:#333;color:#ccc;padding:20px 0;font:12px/12px Helvetica,Arial,sans-serif; }
body > .message p { width:780px;margin:0 auto; }
body > .message a { background:#ccc;padding:3px 9px;color:#666;text-decoration:none;margin-left:20px;-webkit-transition:.2s linear all;-webkit-border-radius:24px;-moz-border-radius:24px; }
body > .message a:hover { background:#000;color:#fff; }
#message-content { background:#000; color:#fff; padding:20px 40px; background:url(../images/ipadscreenshot.jpg) right 60px no-repeat; min-height:475px; }
#message-content h2 { font-size:300%; font-weight:100; text-transform:none !important; color:#fff; margin-bottom:20px; position:relative; z-index:30001; }
#message-content p { padding-right:50%; font-size:16px; color:#ccc; }
#message-content > div p { font-size:14px; margin-bottom:5px; color:#666; font-weight:600; }
#message-content > div a { font-size:18px; display:inline-block; margin-bottom:10px; }
#message-content > div a:hover { font-weight:600; }
#message-content img { position:absolute; right:35px; bottom:-10px; }

/*=================================
@group [FOOTER] 
===================================*/

#footer { clear:both;border-top:1px solid #666; width:780px; margin:0 auto; overflow:hidden; }
#footer ul { float:left;list-style:none; }
#footer ul + ul { float:right; }
#footer li { float:left;margin-left:25px;padding-top:10px; }
#footer li.current { background:url(../images/footer-current-bg.png) center top no-repeat; }
#footer li:first-child { margin:0; }
#footer a { color:rgba(255,255,255,.6);text-decoration:none;font:200 12px/12px "Titillium",Helvetica,Arial,sans-serif;text-transform:uppercase;-webkit-transition:.1s all linear; }
#footer a:hover { color:rgba(255,255,255,.3); }
#footer ul + ul {clear:right}
#footer ul + ul li:last-child a { font-weight:600; color:#e69021; }
#footer > p { clear:left; float:left; font-size:10px; }
#footer > p + p { clear:right; float:right; }
#footer > p + p a { color:#fff; text-transform:lowercase; font-size: 10px;}

/*=================================
@group [NEW HOME SLIDESHOW] 
===================================*/

#wrapper { position:relative; overflow:hidden; min-width:992px; max-width:1042px; margin:0 auto; background:url(../images/wrapper-bg.png) center center repeat-y; }

#wrapper > header h1 { position:absolute; left:120px; top:0; width:110px; height:115px; background:url(../images/home/logo.png) no-repeat; text-indent:-9999px; z-index:200; }

/*Logo*/
body.home > header h1 { width:134px; height:139px; background:url(../images/home/logo.png) no-repeat; text-indent:-9999px; position:absolute; left:120px; top:35px; z-index:3999; }

/* Header */
body.home #wrapper header { height:500px; width:1020px; margin:0 auto; background:#000; position:relative; overflow:hidden; max-width:1020px; }
body.home header h2 { background:url("../images/home/header-h2-bg.png") no-repeat scroll 0 0 transparent;
height:160px;
position:absolute;
right:120px;
text-indent:-9999px;
top:35px;
width:548px;
z-index:4000; }
body.home header h3{ background:rgba(0,0,0,.8); color:#fff; padding:25px 305px 25px 40px; font-size:16px; line-height:1.2; position:absolute; left:0; bottom:0; margin:0; font:100 18px/24px "Titillium"; }

/*Slideshow*/
body.home header { -webkit-box-shadow:0 0 30px rgba(0,0,0,.5); -moz-box-shadow:0 0 30px rgba(0,0,0,.5); box-shadow:0 0 30px rgba(0,0,0,.5); }
body.home header ul { width:1020px !important; overflow:hidden; margin:0; }
body.home header li { list-style:none; margin:0; height:500px !important; width:1020px !important; position:relative; overflow:hidden; }
body.home header li#community { background:url(../images/home/slide-community.jpg) no-repeat; }
body.home header li#togetherness { background:url(../images/home/slide-togetherness.jpg) no-repeat; }
body.home header .previous,
body.home header .next { display:block; position:absolute; left:40px; bottom:200px; width:46px; height:46px; background:url(../images/home/arrows.png) no-repeat; text-indent:-9999px; z-index:4005; opacity:.5; -webkit-transition:.2s linear all; -moz-transition:.2s linear all; }
body.home header .next { left:auto; right:40px; background-position:-46px 0; }
body.home header .previous:hover,
body.home header .next:hover { opacity:1; }
