@charset "UTF-8";
/* CSS Document */

/********************************************/
/***               Reset                  ***/
/********************************************/
body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, li, dl, dt, dd, form, a, fieldset, input, th, td {
	margin: 0; padding: 0; border: 0; outline: none;	font-family:Helvetica, Arial,"Sans Serif";
	font-size:14px;
} 



/* headers */ 
h1, h2, h3, h4{
	font-weight:normal;	font-family:"Gill Sans", "Helvetica Neue", Helvetica, "Sans Serif";
/*	font: bold 1em;
	/*color: #65944A;*/
}
h1 { font-size: 24px; }
h2 { font-size: 16px; font-style:oblique; font-weight:lighter}
h3 { font-size: 16px; }
h4 { font-size: 17px; font-style:oblique; font-weight:lighter; margin-bottom:12px;}

p, h1, h2, h3 {
	/*margin: 5px 10px;*/
}
ul, ol {
	margin: 10px 30px;
	padding: 0 15px;	
}
ul span, ol span {
	/* wtf is ul? color: #333; */
}

/* images */
img {
	/* border: 2px solid #CCC;	NO BORDER DAMMIT */
}
img.float-right {
  margin: 5px 0px 5px 15px;  
}
img.float-left {
  margin: 20px 20px 20px 20px;
}

/*
a img {  
  border: 2px solid #72A545; /* #32CD32; 
}
a:hover img {  
  border: 2px solid #806B4D !important; /* IE fix 
  border: 2px solid #72A545; /* #32CD32;
}
*/

body{
	background-color:#EDF8F9
}
#container {
	margin: 0 auto;
	padding-left: 0px;
	padding-right: 0px;
}

#main {
	width:812px;
	height:612px;
	background-image:url(../img/site_panel.png);
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
}

#content{
	margin-left:auto;
	margin-right:auto;
	position:relative;
	top:22px;
	width:800px;
	height:425px;
	color:#33332E;
}

#content #text_panel{
	height:400px;
	width:340px;
	top:90px;
	left:40px;
	position:absolute;
/*	background-color:#999;	*/
}

#text_panel #header {
	text-align:center;
}

#text-block{
	font-size:12px;
	width:300px;
	margin-left:auto;
	margin-right:auto;
	margin-top:6px;
	margin-bottom:8px;
}

#line-break {
	background-image:url(../img/linebreak.png);
	height:8px;
	margin:8px auto 10px auto;
	padding: 0 0 0 0;
	background-repeat:repeat-x;
	/*display:inline;*/
}

.major {
	opacity:.5;
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
	/* For IE ge 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
.minor {
	opacity:.2;
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
	/* For IE ge 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
}

#info-nav{
	position:absolute;
	top:290px;
	left:45px;
	width:370px;
}

#content #video_viewer{
	width:400px;
	height:356px;
	background:url(../img/vidbox.png) no-repeat;
	position:absolute;
	top:70px;
	left:376px;
}

#content #video_viewer #vidbox {
	position:absolute;
	top:17px;
	left:20px;	
}

#content #image_viewer{
	height:400px;
	width:200px;
	position:absolute;
	top:42px;
	left:582px;
/*	background-color:#FF0;	*/
}

#image_viewer #iPhone {
	height:370px;
	width:180px;
	position:absolute;
	left:15px;
	top:10px;
	background-image:url(../img/iPhone_3GV.png);
}

#iPhone #screen #sshot1, #sshot2, #sshot3, #sshot4 {
	position:absolute;
	top:65px;
	left:18px;
/*	background-color:#FFF;*/
	width:144px;
	height:216px;
}

#image_viewer #title-box{
	text-align:center;
	width:220px;
	position:relative;
	left:-10px;
}

#image_viewer #text-box {
	width:160px;
	font-size:14px;
	margin-left:auto;
	margin-right:auto;
}

#image_viewer #pic_nav{
	width:240px;
	height:44px;
	position:absolute;
	top:356px;
	left:22px;
}

#sshot2-button, #sshot3-button, #sshot4-button {
	opacity:.33;
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=33);
	/* For IE ge 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=33)";
}



#main #footer{
	background-image:url(../img/footer_bar.png);
	width:768px;
	height:125px;
	position:relative;
	top:30px;
	margin-left:auto;
	margin-right:auto;
}

#nav_bar{
	width:620px;
	height:40px;
	position:relative;
	top:8px;
	left:85px;
	display:inline-block;
}

#networking{
	width:300px;
	height:50px;
	position:relative;
	float:right;
	right:15px;
	top:22px;
/*  	border: 1px solid #AAA;*/
}


.twitters {
	height:40px;
	margin-top:5px;
	margin-left:5px;
	margin-right:10px;
	width:240px;
	text-align:center;
	float:left;
	font-size:11px;
	vertical-align:middle;
}

.twitterTime{
	font-style:italic;
	font-size:11px;
}

.twitters p {
 	list-style: none;
  	padding: 0;
	font-size:11px;
}

#button{
	width:100px;
	height:36px;
/*	background-color:#00F;*/
	margin-right:20px;
	display:inline;
	position:relative;
	float:left;
}

#sshot1-button, #sshot2-button, #sshot3-button, #sshot4-button {
	height:36px;
	width:32px;
	margin-right:5px;
	margin-left:5px;
	display:inline-block;
	position:relative;
	float:left;
}


#sshot2, #sshot3, #sshot4 {
	display:none;
}

/* About */
#mugshot{
	float:left;
	width:60px;
	height:60px;
	margin-left:10px;
}
#name-and-title{
	float:left;
	margin-left:10px;
	width:120px;
	height:60px;

}
#info-box {
	float:left;
	height:60px;
	margin-left:10px;
	width:475px;
	font-size:12px;
}
#bio{
	width:625px;
	height:50px;
	margin-left:auto;
	margin-right:auto;
}


.text_input, .text_area{
padding:5px;
}

/*#searchsubmit, #send, #submit{
padding:4px 20px;
}*/

.text_input{
width:200px;
margin-right:20px;
margin-top:1px;
margin-bottom:3px;
border:1px solid;
border-color:#C1BEB0;
}
.text_area{
width:400px;
height:130px;
}

/*CONTACT FORM*/	
.valid .text_input, .valid .text_area{border:1px solid #70A41B;} /*#70A41B*/
.error .text_input, .error .text_area{border:1px solid #EE2A00;}
.ajax_alert .text_input, .ajax_alert .text_area{border:1px solid #ffb628;}

/*
#s, .text_input, .text_area, textarea, #commentform input{
	border:1px solid #ababab;
	color:#333;
	}*/

#s, textarea, #commentform input{
	border:1px solid #ababab;
	color:#333;
	}

#searchsubmit, #send, #top #submit{
	border:1px solid #ababab;
	background-color:#333;
	cursor:pointer;
	color:#fff;
	padding:4px 20px;

	}
	
#searchsubmit:hover, #send:hover, #top #submit:hover{
	background-color:#999;
	color:#333;
	}

	
.corner_left, .corner_right{
	background:transparent url(../images/jquery_corners.png) no-repeat scroll top left;
	}
	
#top .corner_right{
	background:transparent url(../images/jquery_corners.png) no-repeat scroll top right;
	}
	


#panel {
	position:relative;
	float:left;
	font-size:12px;
	margin-bottom:25px;
	font-size:12px;
	display:inline;
	
}

#panel #sshot {
	height:100px;
	width:100px;
	position:relative;
}

#panel #textbox {
	width:380px;
	position:relative;
	font-size:12px;	
	padding-left:12px;
	padding-right:12px;
}

#feature-block {
	width:550px;
	position:absolute;
	top:60px;
	left:50px;
}

#content #fb_box{
	height:400px;
	width:200px;
	position:absolute;
	top:36px;
	left:520px;
/*	background-color:#FF0;	*/
}

/*

#banner {
	background-image:url(../img/banner.png);
	width: 900px;
	height: 60px;
	position: relative;
	margin-top: 5px;
	background-repeat:no-repeat;
	background-position: center;

}

.logo {
	width: 100px;
	height: 20px;
	position: absolute;
	top: 3px;
	left: 5px;
}

.button_box {
	background-repeat:no-repeat;
	position: absolute;
	right: 10px;
	height: 40px;
}

#banner .button_box {
	width: 450px;
}

#footer .button_box {
	width: 400px;
}

.nav_button {
	background-repeat:no-repeat;
	position: relative;
	
}

#banner .nav_button {
	width: 110px;
	height: 40px;
	float: left;
	left: 5px;
	top: 18px;
}

#billboard .nav_button {
	width: 50px;
	height: 50px;
	float: left;
}


#billboard { background-repeat:repeat-x; background-image:url(../img/billboard_mid.png); width: 900px; height: 390px; 
	position: relative; margin-top: 2px; margin-bottom:2px;
	/*background: #CCC;}

#billboard .boardleft {background-image:url(../img/billboard_left.png); background-repeat:no-repeat; width:100%; height:100%;
	position:absolute; top:0px; left:0px}
#billboard .boardright {background-image:url(../img/billboard_right.png); background-repeat:no-repeat; width:100%; height:100%; 
	position:absolute; top:0px; left:886px}


#media_panel{background-repeat:no-repeat; width: 400px; height: 380px; position: absolute;
	/*	background:#00F;	}
#media_panel .frame_1{left: 130px; top: 25px; position:absolute}
#info_panel{background-repeat:no-repeat; width: 420px; height: 380px; position: absolute; left: 420px; top: 5px;
	/*	background:#00A;	}
.main_text{width: 400px; height: 320px; position: absolute;
	/*	background-color:#CFF;	}
.main_text .frame_1{top: 60px; left: 60px; position: absolute}
.info_nav{height: 30px; width: 250px; position: absolute; bottom: 45px; left: 90px;
	/*	background-color:#FFF;	}
	
/* End Billboard 




#minor_board {
/*	background-color:#300;	
	background-repeat:no-repeat;
	width: 900px;
	height: 240px;
	position: relative;
	margin-top: 4px;
}

#panel_1 {
/*	background-color:#906;	
	background-repeat:no-repeat;
	height: 240px;
	width: 290px;
	top: 0px;
	position: absolute;
	left:0px;

}

#panel_2 {
/*	background-color:#906;	
	background-repeat:no-repeat;
	height: 240px;
	width: 290px;
	top: 0px;
	position: absolute;
	left: 305px;

}

#panel_3 {
/*	background-color:#906;	
	background-repeat:no-repeat;
	height: 240px;
	width: 290px;
	top: 0px;
	position: absolute;
	left: 610px;

}

.spacer {
	position: relative;
	float: left;
	width: 10px;
	height: 10px;
/*	background-color:#906;	
	background-repeat:no-repeat;
}

.panel_header {
/*	background-color:#FFF;	
	width: 290px;
	height: 32px;
		
}
.panel_content {
	position:relative;
	left:0px;
	top:20px;
	font-size:.8em;
}



#footer {
	/*background:#0FF;	
	background-image:url(../img/footer.png);
	background-repeat:no-repeat;
	width: 900px;
	height: 50px;
	position: relative;
	margin-top: 5px;
	color:#F5F3DF
}


#footer .nav_button {
	width: 80px;
	height: 24px;
	float: left;
	left: 5px;
	top: 4px;
}

#footer .copyright {
	height:	24px;
	width: 300px;
	position: absolute;
	top: 4px;
	left: 20px;
	
}

a.footer:link    {text-decoration:none;color:#F5F3DF;background-color:transparent}
a.footer:visited {text-decoration:none;color:#F5F3DF;background-color:transparent}
a.footer:hover   {text-decoration:underline;color:#F5F3DF;background-color:transparent}
a.footer:active  {text-decoration:underline;color:#F5F3DF;background-color:transparent}




/*#####################################
	Content Pages	
#####################################

#media_board {
	position: relative;
	height: 200px;
	width: 900px;
	background-image: url(../img/mediaboard_mid.png);
	/*	background-color:#FC0;		
	margin-top: 2px;
	margin-bottom: 2px;
	background-repeat:repeat-x;
}

#media_board .leftside {
	background-image:url(../img/mediaboard_left.png);
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	position:absolute;
	left:0px;
}

#media_board .rightside {
	background-image:url(../img/mediaboard_right.png);
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	position:absolute;
	left:886px;
	
}
#media_board .mid_content {
	position:absolute;
	width:900px;
	margin-left:50px;
}
#media_board .icon {
/*	margin-left:50px; 
	margin-left:15px;
	margin-right:20px;
	float:left;
	margin-top:20px
	}
	

#content_body {
/*	background:#F03;	
	width: 900px;
	position: relative;
	background-repeat:no-repeat;
}


#content_frame {
/*	background:#F03;	
	width: 900px;
	height: 100%;
	position: relative;
	background-repeat:no-repeat;
	margin-top:10px;
	margin-bottom:0px;
}


#content_body #main {
	background-repeat:repeat-y;
	/*	background:#6FF;	
	width: 675px;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 225px;
	background-image:url(../img/mainbdr_mid.png);
	font-size:14px;
}

#main .bdrtop {
	background-image:url(../img/mainbdr_top.png);
	background-repeat:no-repeat;
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
}

#main .bdrbot {
	background-image:url(../img/mainbdr_bot.png);
	background-repeat:no-repeat;
	position:absolute;
	width:100%;		/* Really 14px 
	height:100%;
	left:0px;
}


#content_body #sidebar {
	background-repeat:no-repeat;
	background:#E5E5E1;
	height:100%;
	width:200px;
	position: absolute;
	top: 0px;
	left: 0px;
	font-size:12px;
}

#sidebar .top {
	background-image:url(../img/sidebar_top.png);
	background-repeat:no-repeat;
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}

#sidebar .bot {
	background-image:url(../img/sidebar_bot.png);
	background-repeat:no-repeat;
	position:absolute;
	left:0px;
	width:100%;
	height:100%;
}


#content_body #sidebar .app_logo {
	position:relative;
	width: 150px;
	height: 150px;
	left: 25px;
	top:30px;
}

#content_body #sidebar .app_list {
	width: 150px;
	position: relative;
	left: 25px;
	top: 20px;
	margin: 28px 0px 48px 0px;
	text-align:center;
}

.appstore_link {
	width: 150px;
	height: 75px;
	position: relative;
	left: 25px;
	top: 20px;
}

/* Maybe use this... 
#sidebar li {
	display: inline;
}
#sidebar li a {
	float: left;
	display: block;
	padding: 3px 12px;	
	color: #FFF;
	background-color: #333;
	text-decoration: none;
	border-right: 1px solid #272727;
}
#sidebar li a:hover {
	background: #65944A;
	color: #FFF;
}
#sidebar li a#current  {
	background: #65944A;
	color: #FFF;
}


#sidebar .button {
	position:relative;
	float:left;
	top:15px;
	left:25px;
	margin-top: 6px;
	margin-bottom: 12px;
}



.title_bar {
	/*height: 40px;
	width: 500px;
	position: relative;
	/*	background-color:#060;	
	float: left;
/*	font-size:32px; 

}

#main .title_bar{
	top: 15px;
	left: 30px;
}

#main_overview .title_bar{
	top: 15px;
	left: 50px;
}

.block {
	position: relative;
	top: 30px;
	left: 25px;
	bottom: 10px;
	width: 625px;
	height: 200px; /* REMOVE ME 
/*	background-color:#7CE3FF;	
	background-repeat:no-repeat;
	float: left;
	
}

.block .info_text {
	position: relative;
	width: 350px;
/*	height: 100px;
	left: 20px;
	right: 20px;
/*	background-color:#666;
	top:20px;
	float: left;
	margin-top:8px;
	margin-right:16px;
	margin-left:6px;
	margin-bottom:20px;
	vertical-align:middle;

}

.block .info_img {
	position: relative;
	height: 200px;
	width:200px;
	left:10px;
	right:40px;
	top:0px;
	background-color:#000;
}

.twitters {
  border: 1px solid #e5e5e5;

}
.twitterTime{
	font-size:.75em;
}

.twitters ul {
  list-style: none;
  padding: 0;
}



/* alignment classes 
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right {	text-align: right; }
img.floatLeft {margin: 10px 10px 5px 5px; float:left;}

#fr1-button {
	opacity:1;
}
#fr2-button, #fr3-button, #fr4-button {
	opacity:.3;
}

.fr1{
	display:block;
}
.fr2, .fr3, .fr4 {
	display:none;
}

#main_overview {
	background-repeat:repeat-y;
	/*	background:#6FF;	
	width: 900px;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	background-image:url(../img/mainbdr_midW.png);
	font-size:14px;	
}

#main_overview .bdrtop {
	background-image:url(../img/mainbdr_topW.png);
	background-repeat:no-repeat;
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
}

#main_overview .bdrbot {
	background-image:url(../img/mainbdr_botW.png);
	background-repeat:no-repeat;
	position:absolute;
	width:100%;		/* Really 14px 
	height:100%;
	left:0px;
}
*/