/*what we do
-------------------------------------*/
.will, .luke{z-index: 550;}
.director_bios{z-index: 600;}


.us_intro_strip{position: relative; background: url(../images/about/fader-with-strip.jpg) repeat-x bottom; height: 501px;border-top: 50px solid #fff;}
.us_intro_strip .bar{background: #eb2b21; height: 111px; position: absolute; top:5px; right:60%; width: 100%;}
.us_intro_strip .intro{text-align: right; position: absolute; top:5px; right: 0; width: 500px; font-size:14px; color: #666; line-height: 24px;}
.us_intro_strip .intro p{padding-bottom: 12px;}
.us_intro_strip .intro .first{font-weight: bold; color: #555;}
.us_intro_strip .intro p a{color: #c00;}
.us_intro_strip .intro p a:hover{color: #f00;}

.us_intro_strip .intro .inline_directors{padding: 2px 18px 2px 5px; background: #f4f4f4 url(../vendor/images.sw/arrows/down/5/808080.gif) no-repeat 95% 9px; text-decoration: none;}
.us_intro_strip .intro .inline_directors:hover{background-image: url(../vendor/images.sw/arrows/down/5/ffffff.gif); background-color: #c00; color: #fff;}

.us_intro_strip .directors{background: url(../images/about/meet-the-directors.jpg) no-repeat 0 0; width: 337px; height: 73px; display: block; text-decoration: none; position: absolute; top:287px; right:0;}
.us_intro_strip .directors:hover{background-position: 0 -73px;}

.us_intro_strip .we_make_web_apps{width: 408px; height: 416px; background: url(../images/about/we-make-web-apps.jpg); text-indent: -9999em;}

.what_we_are {position:relative; padding-top:50px;}
.what_we_are p{font-size:14px; line-height:24px;}
.ninjas{background: url(../images/about/ninjas.gif) 100% 100% no-repeat; height:162px;}
.crew{height:290px;position:relative; background: url(../images/about/top-repeater.jpg) repeat-x; padding-top:65px;}
.crew p{color: #ffffff; font-size:14px; line-height:32px;}
.crew a{display:block; color:#84ceff; font-weight:bold; text-decoration:none; font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;}  
.crew a:hover{text-decoration: underline;}
.align-right{text-align:right;}

/*
.wasteland{height:365px; position:relative;}
.wasteland .bar{position:absolute; overflow: hidden; right:50%; top:0; height:187px; width:4000px; background:url(../images/about/wasteland-left.gif) repeat-x;}
.wasteland_image{height:360px;position:relative; background:#ffffff url(../images/about/wasteland.gif) no-repeat;}

.evil{height:134px; position:relative;}
.evil .bar{position:absolute; overflow: hidden; height:100%; width:4000px;  top:0; left:50%; background:#000;}
.evil_image{height:134px; position:relative; background:#ffffff url(../images/about/evil.gif) 100% no-repeat;}

.obfuscation{background: url(../images/about/obfuscation.gif) no-repeat; height:580px; position: relative;}
*/

h3.love{font-size: 24px; font-weight: bold;  max-width: 880px; margin: 0 auto; text-transform: uppercase; color: #333; padding: 0 0 40px 0; display: none;}

.centrequote{text-align: left; max-width: 880px; margin: 0 auto;}
.centrequote p{font-size: 16px; line-height: 24px; padding-bottom: 12px; color: #666;}
.centrequote p em{color: #c00;}
.centrequote p.bigups{font-size: 24px; text-align: center; background: #c00; color: #fff; padding: 15px 0; margin: 10px 0 20px;
	-webkit-transform: rotate(-0.5deg);
	-moz-transform: rotate(-0.5deg);
	transform: rotate(-0.5deg);
}
.centrequote cite{display: block; text-align: right; font-size: 13px; color: #666; padding: 10px 0 50px;}
.centrequote cite a{color: #555;}
.centrequote cite a:hover{color: #111;}

.bigquote{height:234px; position:relative;}
.bigquote .bar{height:170px; position:absolute; overflow: hidden; left:50%; top:3px; width:4000px; background:#e72b2a;}
.bigquote_image{position:relative; height:184px; background: url(../images/about/bigquote.gif) no-repeat;}
.bigquote_image cite{display: block; font-size: 10px; text-align: right; width: 300px; color: #333; position: absolute; top:200px; left: 240px;}
.bigquote_image cite strong{display: block; font-weight: bold;}
.bigquote_image cite a{color: #999; text-decoration: none;}
.bigquote_image cite a:hover{color: #c00;}

.the_team{height:1110px;}
.the_team .will{position:absolute; left:436px; top:93px;  background: url(../images/about/will.jpg) no-repeat 0 0; width:775px; height: 1010px;}
.the_team .luke{ position:absolute; left:-143px; top:93px;  background: url(../images/about/luke.jpg) no-repeat 0 0; width: 580px; height: 1010px;}

.the_team .will span, .the_team .luke span{display: none; position: absolute; width: 200px; height: 60px; background: #fff no-repeat center;}

.the_team .will span{background-image: url(../images/about/more-about-will.jpg);top:295px; left: 140px;}
.the_team .luke span{background-image: url(../images/about/more-about-luke.jpg);top:-10px; left: 340px;}

/* this is for the close */
.the_team_active .will span{background-image: url(../images/about/less-about-will.jpg);}
.the_team_active .luke span{background-image: url(../images/about/less-about-luke.jpg);}


.the_team .will:hover, .the_team .luke:hover{opacity:0.9}
.the_team .will:hover span, .the_team .luke:hover span{display: block;}

#directors{display: block; position: absolute; width: 1px; height: 1px; top:20px; left: 0;}

.director_bios{display: none; width: 330px; position: absolute; top:80px;}
.more_about_will,
.more_about_luke{margin-top: -100px; padding-top: 100px;}

.more_about_will{padding-top: 200px;}

.director_bios h3{color: #c00; padding-bottom: 12px; display: none;}
.director_bios h4{color: #333; font-size: 14px; padding-bottom: 12px;}
.director_bios p{font-size: 12px; color: #666; line-height: 24px; padding-bottom: 12px;}
.director_bios p strong{color: #000;}
.director_bios p em{font-style: italic; color: #333;}
.director_bios blockquote{background: #e0f3ff; padding: 10px 20px; margin: 0 -20px 18px;}
.director_bios blockquote p{font-size: 16px; font-style: italic; color: #006fb8;}

.director_bios blockquote cite{font-size: 9px; text-align: right; display: block;}
.director_bios blockquote cite strong{display: block; color: #333; font-weight: bold;}

.director_bios a{color: #c00;}
.director_bios a:hover{color: #f00;}

.more_about_will{left:120px;text-align: right;}
.more_about_luke{right:120px;}
