/* CSS Document */

/*-----------------------------------------------------	*/												
/*				Default settings						*/
/*-----------------------------------------------------	*/												
body{
background-color:#3f3f3f;
background-image:url(images/background.jpg);
background-repeat:repeat-y;
background-position:center;
}
body, div, p, strong, td, input, textarea{
color:#999999; 
font-size:13px;
font-weight:normal; 
font-style:normal; 
font-family: Georgia, "Times New Roman", Times, serif;
line-height:17px;
text-decoration:none; 
vertical-align:top;
text-align:left;
}

h1{
	display:block;
	font-size:22px;
	color:#eee;
	line-height:36px;
	padding:10px;
	font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif; 
}

h1 .accent{
	background:#000;
	padding:0px 3px 3px;
	color:#fff;
}

h1 .accent2{
	background:#EF3286;
	padding:0px 3px 3px;
	color:#fff;
}

table, tr, td, div {
border-style:none; 
padding: 0px; 
background-color:transparent;}

div{border-style:none;}

a, a:link, a:visited{
color:#EF3286; 
font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif; 
font-size:14px; 
font-weight:normal; 
text-decoration:none;
}

a:hover, a:active{
color:#878787; 
}

a img, img{
border:none;
}

li {
list-style:none;
}

input {
border-style:solid; 
border-width:1px; 
border-color:#e6e6e6;
}

/*
  USAGE: All you have to do is include this one line in your CSS file, with the
  tag names to which you want the script applied:
 

 img, div { behavior: url('javascripts/iepngfix/iepngfix.htc'); }*/

 /*
  Alternatively, you can specify that this will apply to all tags like so:
   * { behavior: url(iepngfix.htc) }
 */
 

/*--------------------Pieces of all pages-------------------------------*/

/*-----------------------------------------------------	*/												
/*		div which contains page background info			*/
/*-----------------------------------------------------	*/												

.page{
width:820px;
display:block;
vertical-align:top;
margin:0 auto;
}

/*.top_span{
background-image:url(images/top_left_right_span.png);
background-repeat:repeat-x;
background-position:0 0px;
overflow:hidden;
z-index: 2;}*/


/*-----------------------------------------------------	*/												
/*	Header div containing title of page and nav bar		*/
/*-----------------------------------------------------	*/												
/*.page_top{
width: 800px;
height:100px;
background-image:url(images/top_background2.png);
background-repeat:no-repeat;
margin: 0 auto;
}*/

.header{
display:block;
width:100%;
}

.logo{
float:left;
margin-top:-10px;
}

/*-----------------------------------------------------	*/												
/*			Page title within Header div				*/
/*-----------------------------------------------------	*/												
.page_title{
color:#EF3286;	
float:left;
width:100%;
display:block;
margin-bottom:20px;
margin-left:10px;
font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
}

.page_title, .page_title a, .page_title a:link, .page_title a:visited, .page_title a:active {
font-size:24px;
line-height:30px;
letter-spacing:2px;
}

.page_title a:hover{
color:#9c9b9b;}

/*-----------------------------------------------------	*/												
/* 		Div that holds all the major content			*/
/*-----------------------------------------------------	*/												

.content {
width: 100%;
margin:0 auto;
}

div.sidebar {
background: transparent;
float:left;
width:250px;
display:block;
}

div.sidebar div.sidebar_top_level1{
background:url(images/sidebar_250px_level1_dark_top.png) no-repeat center top;
display:block;
height:15px;
width:250px;
}

div.sidebar div.sidebar_bottom_level1{
background:transparent url(images/sidebar_250px_level1_dark_bottom.png) no-repeat;
display:block;
height:20px;
width:100%;
width:250px;
}

div.sidebar div.sidebar_level1{
background:transparent url(images/sidebar_250px_level1_dark_mid.png) repeat-y;
padding:10px;
width:230px;
}

div.sidebar div.sidebar_level1_trans_level2{
background:transparent url(images/sidebar_250px_level1_dark_trans_stripes.png) no-repeat;
display:block;
height:20px;
width:250px;
}

div.sidebar div.sidebar_level2_trans_level1{
background:transparent url(images/sidebar_250px_top_level2_trans_level1_dark.png) no-repeat;
display:block;
height:20px;
width:100%;
}

div.sidebar div.sidebar_level2_top{
background:transparent url(images/sidebar_250px_top_level2_strips.png) no-repeat;
display:block;
height:20px;
width:100%;
}

div.sidebar div.sidebar_level2{
background:transparent url(images/sidebar_250px_level2_stripes_mid.png) repeat-y;
padding:10px;
padding-left:15px;
width:225px;
}

div.sidebar div.sidebar_level2_bottom{
background:transparent url(images/sidebar_250px_level2_stripes_bottom.png) no-repeat;
display:block;
height:11px;
width:100%;
}

div.main{
width:560px;
float:right;
display:block;
}

div.main div.main_level1_top{
background:transparent url(images/main_560px_level1_top.png) no-repeat;
display:block;
height:15px;
width:100%;
margin:0;
}

div.main div.main_level1{
background:transparent url(images/main_560px_level1_mid.png) repeat-y;
padding:10px;
width:540px;
margin:0;
}

div.main div.main_level1_bottom{
background:transparent url(images/main_560px_level1_bottom.png) no-repeat;
display:block;
height:20px;
width:100%;
margin:0;
}

div.main div.main_level1_trans_level2{
background:transparent url(images/main_560px_level1_trans_stripes.png) no-repeat;
display:block;
height:20px;
width:100%;
margin:0;
}

div.main div.main_level2_trans_level1{
background:transparent url(images/main_560px_top_level2_trans_level1_dark.png) no-repeat;
display:block;
height:17px;
width:100%;
}

div.main div.main_level2_top{
background-image:transparent url(images/main_560px_top_level2_stripes.png);
background-repeat:no-repeat;
display:block;
height:21px;
}

div.main div.main_level2{
background:transparent url(images/main_560px_level2_stripes_mid.png) repeat-y;
padding:10px;
width:540px;
}

div.main div.main_level2_bottom{
background:transparent url(images/main_560px_level2_stripes_bottom.png) no-repeat;
display:block;
height:11px;
width:100%;
}

/*-----------------------------------------------------	*/												
/*				formatting of footer					*/
/*-----------------------------------------------------	*/												

.page_foot{
margin:20px auto;
height:20px;
vertical-align:bottom;
margin-top:15px;
display:block;}

div.copyright{
float:left;
vertical-align:bottom;
}

div.foot_text{
float:right;
}

.foot_text a, .foot_text a:link, .foot_text a:visited, .foot_text{
font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
font-size:15px; 
color:#878787;}

.foot_text a:hover, .foot_text a:active{
color:#ffffff;
}


/*----------------------------Generic classes for multiple uses----------------------*/


div.sectitle{
display:block;
margin-left:10px;
float:left;
width:100%;
font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
}

div.sectitle span{
float:left;
font-size:20px;
letter-spacing:1.5px;
line-height:24px;
color:#ffaf04;
}

/*span.sectitle{
font-size:18px;
color:#ffaf04;}*/

.sectitle a{
float:right;
margin-right:20px;
}

div.subtitle{
line-height:26px;
display:block;
float:left;
margin-bottom:15px;
width:100%;
font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
}

div.subtitle span{
font-size:20px; 
color:#ffffff; 
float:left;
}

.email_link{
text-align:right; 
font-size: 14px; 
display:block;
margin-top:5px;
letter-spacing:.5px;}

											
div.clear {
clear: both;
height:0px;
width:0px;
}

.narrative{
border-style:none;
clear:left;
padding:10px;
line-height:18px;
}



/*------------------------------Formatting for homepage graphics ----------------------------*/


.homepage_graphic {
	width: 800px;
	display:block;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:20px;
}

/*------------------------------Formatting for portfolio.php----------------------------*/

.teaser
{
float:right;
margin-bottom:25px;
width:100%;
}

.teaser img
{
clear:both;
border-style:solid;
border-color:#ffffff;
border-width:2px;
border-bottom-color:#e6e6e6;
border-right-color:#e6e6e6;
display:block;
margin-left:10px;
margin-right:auto;
margin-bottom:0px;
margin-top:10px;

}


/*------------------------------Formatting for project.php----------------------------*/


.desc{
float:right;
padding:10px;
width:300px;
width:55%;
line-height:18px;
}

div.sidebar div.desc{
float:left;
width:91%;
margin-bottom:20px;
}

.technologies{
float:left;
width:30%;
padding:10px;
}

.technologies ul{ 
clear:left;
margin-top:0px;
}

.technologies li{
background:transparent;
list-style:url(images/bullet_orange_ball_smaller.gif);
margin-bottom:5px;
}

div.sidebar div.technologies{
width:100%;
}


div#slides_wrapper {
width:530px;
height:auto;
overflow:hidden;
display:block;
margin-top:10px;
/*clip:rect(0px, 550px, 176px, 0px);*/
}

ul#slides  {
padding:0;
margin-left:0;
width:10000px;
}

ul#slides li {
float:left;
text-align:center;
width:530px;
height:500px;
display:block;
vertical-align:middle;
}

ul#slides li img {
display:block;
margin-left:auto;
margin-right:auto;
height:auto;
margin-top:auto;
margin-bottom:auto;
}

div.slide_names_wrapper{
width:100%;
height:auto;
display:block;
margin-left:15px;
float:left;
}

ul#slide_names {
padding:0px;
width:100%;
float:left;
margin-left:0px;
}

ul#slide_names li {
	float:left;
	margin-right:15px;
	
	/*text-indent:-10px;*/
}

ul#slide_names li a, ul#slide_names li a:visited {
	background:#000;
	padding:5px;
	color:#EF3286;
	border:1px solid #000;
}

ul#slide_names li a:hover {
	background:#333;
	padding:5px;
	color:#EF3286;
	border:1px solid #000;
}




/*------------------------------Formatting for contact.php----------------------------*/

.contact_form {
float:right;
width:90%;
margin-right:20px;
margin-top:20px;
}

.contact_form .textbox {
width:350px; 
height:75px; 
border-color:#E6E6E6; 
border-style:solid; 
border-width:1px;
margin:5px;
}

.submitbutton {
color:#ffffff;
font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
font-size:14px; 
font-weight:normal;
text-align:center;
background-color:#EF3286;
clear:both;
float:right;
margin-right:22px;
}

.contact_form label{
text-align:right; 
float:left;
display:block;
width:100px;
clear:left;
font-size:14px;
margin-top:7px;
margin-right:10px;
font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
}

.textline{
width:350px; 
border-color:E6E6E6; 
border-style:solid; 
border-width:1px;
float:left;
margin:5px;}

.textlineactive{
width:350px; 
border-color:E6E6E6; 
border-style:solid; 
border-width:1px;
float:left;
margin:5px;}

.thankyou {
clear:both; 
width:400px; 
padding-top:15px; 
display:block;}
/*.textline:hover{border-color:#ffaf04;}*/



/*-----------------------------------------------------	*/												
/*			formatting of navigation bar				*/
/*-----------------------------------------------------	*/		

div.page_top{
	float:right;
	margin-top:-10px;
}

.navigation table{
	float:none;
}

.navigation td.navwrap{
	vertical-align:top;
	text-align:center;
}

.navigation .navimage{
	height:55px;
	vertical-align:top;
}

.navigation a, .navigation a:visited{
	font-size:17px;
	color:#eaeaea;
	font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica", "Arial", sans-serif;
	letter-spacing:1px;
}

.navigation a:hover, .navigation a:active{
	color:#888888;
}



#home a, #home a:link, #home a:visited{
/*background-image:url(images/nav_home_normal.png);*/
}

#home a:hover, #home a:active{
/*background-image:url(images/nav_home_gray.png);*/
}

#work a, #work a:link, #work a:visited{
/*background-image:url(images/nav_work_normal.png);*/
}

#work a:hover, #work a:active{
/*background-image:url(images/nav_work_gray.png);*/
}

#services a, #services a:link, #services a:visited{
/*background-image:url(images/nav_services_normal.png);*/
}

#services a:hover, #services a:active{
/*background-image:url(images/nav_services_gray.png);*/
}

#contact a, #contact a:link, #contact a:visited{
/*background-image:url(images/nav_contact_normal.png);*/
}

#contact a:hover, #contact a:active{
/*background-image:url(images/nav_contact_gray.png);*/
}