body{
    font-family: Arial;
    font-size:11pt;
    margin:0;
    background: #1f324c;
    
}
A{
	font-family: Arial;
    font-size:11pt;
    color: #577ea4;	
}
.center_me{
	margin-left: auto;
	margin-right: auto;
	text-align:center;
	}
img.w3c{
	border: 0px;
}
.float_left{
	float:left;
	display:inline;
	}
.float_right{
	float:right;
	display:inline;
	}
h3{
	color: #27598b;
	font-family: Arial;
	}	
h4{
	color: #27598b;
	font-family: Arial;
	}	
.hidden{
	display:none;
}
.pad_right{
	padding-right:10px;
	}
.page_title{
	padding-top:15px;
	padding-left:15px;
	text-align:left;
	color: #27598b;
	font-family: Arial;
	font-size: 16pt;
}
.page_sub_title A {
	padding-top:15px;
	padding-left:15px;
	text-align:left;
	color: #27598b;
	font-family: Arial;
	font-size: 12pt;
	text-decoration: none;
	}

.prototype_blue, .prototype_blue A{
	color: #6D9ECE;
	}

.small_blue{
	color: #6D9ECE;
	font-size:8pt;
	}
/* back to top fixed bottom/left */	
#back_top {
  text-align: center;
  position: fixed;
  top: auto;
  bottom: 15px;
  left:auto;
  right:auto;
  background-color:white;
  padding:5px;
  border: 1px solid black;
  z-index:10;
}

.underlined{
	text-decoration: underline;
	}
.width_all{
	width: 100%;
}
.border1{
	border: 1px solid black;
	}
/* **************************************
 * 404 Page Styles							* 	
 ************************************* */ 
 
#message404{
	border:3px solid #910708;
	width: 300px;
	text-align: center;
	font: 12pt tahoma;
	color:black;
	padding:10px;
	}
.fourohfour{
	color: #910708;
	font-family: tahoma;
	font-size: 20pt;
}		
/* **************************************
 * Title Styles							* 	
 ************************************* */ 
 
h2.free_estimate {
	padding-top:15px;
	padding-bottom:15px;
	text-align: center;
	color: #27598b;
	font-family: Arial;
	font-size: 17pt;
	} 
	h2.free_estimate A{
	text-decoration:none;
	padding-top:15px;
	padding-bottom:15px;
	text-align: center;
	color: #27598b;
	font-family: Arial;
	font-size: 17pt;
	}  
/* **************************************
 * List Styles							* 	
 ************************************* */ 
ol.I{
	list-style-type: upper-roman;
	}

ul.plain{
	list-style-type: none;
	} 
  
/* **************************************
 * Form Styles							* 	
 ************************************* */   

/*Div to contain the form itself*/
#form{
	margin-left: auto;
	margin-right:auto;
	width:375px;
	background-color:#80a6cd;
	border: 1px solid #253868;
	padding:10px;
	text-align: right;
}

#page_wrapper{
	margin-left: auto;
	margin-right:auto;
	width:600px;
}

/* FORM ELEMENTS: INACTIVE */
input.inactive{
	border: 1px solid #2a5178;
	padding:5px;
	font-size:12pt;
}	
textarea.inactive{
	border: 1px solid #2a5178;
	padding:5px;
	font-size:12pt;
	}
/* FORM ELEMENTS: ACTIVE */

input.active{
	border: 1px solid #183a5d;
	background-color: #dcedfe;
	padding:5px;
	font-size:12pt;
}

textarea.active{
	border: 1px solid #183a5d;
	background-color: #dcedfe;
	padding:5px;
	font-size:12pt;
}

.input_response{
	width:35px;
	height:35px;
	border:0px;
}


/* FORM ELEMENTS: INVALID */

input.invalid{
	border: 2px solid #ba2810;
	background-color: #f98a77;
	padding:5px;
	font-size:12pt;
}

.invalidlabel{
	color: red;
}
textarea.invalid{
	border: 2px solid #ba2810;
	background-color: #f98a77;
	padding:5px;
	font-size:12pt;
}
.red_error{
	background: url(http://img.larkingabout.com/forms/red_no.gif) no-repeat;
	width:35px;
	height:35px;
	border:0px;
}

#form_errors{
	font-size:12pt;
	color: #f98a77;
	position:relative;
	width:410px;
	height:50px;
	left:165px;
	
}

/* FORM ELEMENTS: VALID */

.green_check{
	background: url(http://img.larkingabout.com/forms/green_check.gif) no-repeat;
	width:35px;
	height:35px;
	border:0px;
}

input.valid{
	border: 2px solid #5baf71;
	background-color: #d5f8de;
	padding:5px;
	font-size:12pt;
}
textarea.valid{
	border: 2px solid #5baf71;
	background-color: #d5f8de;
	padding:5px;
	font-size:12pt;
}

/* Email validation span */

.message_error{
	font-size: 14pt;
	color: #993111;
	font-weight:bold;
	border:0px;
	padding:5px;
	text-align:center;
}
.message_checking{
	font-size: 14pt;
	color: #072342;
	font-weight:bold;
	border:0px;
	padding:5px;
	text-align:center;
}
 
/* Form Lark Animation */

img.login_bird{
	position : absolute;
    left:0px;
    top:0px;
}
#lark_animation{
    position:absolute;
	top:40px;
	left:13px;
	width:150px;
	height:150px;
	background: url(http://img.larkingabout.com/lark/animated_annoyed.gif) no-repeat;
    }
#login_link_right A{
	position:relative;
	left:280px;
	text-decoration:none;
}
#login_link_left A{
	position:relative;
	left:160px;
	text-decoration:none;
}

/* Submit Buttons */

.submitButton{
	padding:5px;
}
.submitEstimate{
	padding:5px;
}
  
#est_discount_ad{
	z-index:5;
	text-align:center;
	border: 2px dotted #416e9c;
	width:400px;
	padding:10px;
	margin-right:auto;
	margin-left:auto;
	margin-top:30px;
	margin-bottom:30px;
}
#form_estimate{
	margin-left: auto;
	margin-right:auto;
	width:550px;
	background-color:#80a6cd;
	border: 1px solid #253868;
	padding:10px;
	text-align: right;
}	
span.checkbox {
	width: 19px;
	height: 25px;
	padding: 0 5px 0 0;
	background: url(http://img.larkingabout.com/forms/checkbox.png) no-repeat;
	display: block;
	clear: left;
	float: left;
}
span.radio {
	width: 19px;
	height: 25px;
	padding: 0 5px 0 0;
	background: url(http://img.larkingabout.com/forms/radio.png) no-repeat;
	display: block;
	clear: left;
	float: left;
}
span.select {
	position: absolute;
	width: 158px; /* With the padding included, the width is 190 pixels: the actual width of the image. */
	height: 21px;
	padding: 0 24px 0 8px;
	color: #fff;
	font: 12px/21px arial,sans-serif;
	background: url(select.gif) no-repeat;
	overflow: hidden;
}  
  
  
/* **************************************
 * Main Navigation Styles 				* 	
 ************************************* */   
#nav_freelance{
	position:absolute;
	bottom:0px;
	left:0px;
	width:65px;
	height:65px;
}#nav_freelance A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
		z-index:10;
		}
#nav_portfolio{
	position:absolute;
	bottom:50px;
	left:66px;
	width:65px;
	height:45px;
}#nav_portfolio A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
		z-index:10;
		}
#nav_experiments{
	position:absolute;
	bottom:75px;
	left:137px;
	width:95px;
	height:40px;
}#nav_experiments A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
		z-index:10;
		}
#nav_prototypes{
	position:absolute;
	bottom:60px;
	left:235px;
	width:82px;
	height:47px;
}#nav_prototypes A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
		z-index:10;
		}
#nav_about{
	position:absolute;
	bottom:40px;
	left:320px;
	width:45px;
	height:47px;
}#nav_about A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
		z-index:10;
		}	
#nav_contact{
	position:absolute;
	bottom:20px;
	left:367px;
	width:70px;
	height:43px;
}#nav_contact A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
		z-index:10;
		}  
.nav_links_active A{
	font-size:12pt;
    color: #27598b;	
    
}
.nav_links_inactive A{
	font-size:10pt;
    color: #27598b;	
    text-decoration:none;
}  
  
/* For Account Pages */
#admin_navigation{
	padding:5px;
	background-color: #d1e3f6;
	border: 1px solid #346699;
	width:690px;
	text-align:center;
}
.nav_admin_ina A{
	color: #346699;
	text-decoration:none;
}
.nav_admin_a A{
	color: white;
}  
/* **************************************
 * Page Layout Structure				* 	
 ************************************* */ 
 
#body-center {
	text-align:center;
	}	
#body {
	position: relative;
	width: 900px; 
	margin-left: auto;
	margin-right: auto;
	text-align:left;	
	background: url(../images/background.gif) no-repeat;
	border:1px solid #1f324c;		
	}

#header {
	position:relative;
	left:0px;
	top:0px;
	height:215px;	
	text-align:center;
	background: url(http://img.larkingabout.com/layout/swooptop.jpg) no-repeat;
	}
	#header_index{
		position: absolute;
		top:0px;
		left:0px;
		width:900px;
		height:100px;
		border: 0px solid red;
		}
			#header_index A{
				display: block;
				height: 100%;
				width: 100%; 
				text-decoration: none;
				border-bottom: 0px;
				z-index:10;
			}	
	#header_navigation {
		position:absolute;
		left:0px;
		top:90px;	
		text-align:center;
		width:450px;
		height:120px;
		}
	#header_title {
		position:absolute;
		left:10px;
		bottom:20px;	
		text-align:center;
		color: #27598b;
		}	
	
#content {
	position:relative;
	left:0px;
	top:0px;
	min-height:500px;
	height:auto !important;
	height:550px;	
	padding-bottom:10px;
	background: white;
	}
	
	#content_left {
		position:relative;
		left:0px;
		top:0px;
		width:705px;	
		padding-left:10px;
		padding-right:10px;
		padding-top:10px;
		
		}
	
	#right_bar {
		position:absolute;
		right:0px;
		top:0px;
		width:175px;
		height:100%;	
		border:1px solid #27598b;	
		text-align:center;
		background: url(http://img.larkingabout.com/layout/bg_pinstripe.jpg) repeat;
		}
#footer_spacer{
	clear:both;
	height:250px;
	text-align:center;
	padding-top: 20px;
	margin-top:200px;
	border:0px solid #000000;	
	
	}
	
#footer {
	position:relative;
	padding-top:55px;
	left:0px;
	top:0px;
	height:130px;	
	font-family: Arial;
    font-size:9pt;
	border:1px solid #1f324c;	
	text-align:center;
	background: #80a6cd url(http://img.larkingabout.com/layout/footer_divider.jpg) no-repeat;
	}
	#footer A{
		font-family: Arial;
	    font-size:9pt;
	    color: #1f324c;
	}
	
/* **************************************
 * Footer Styles						* 	
 ************************************* */ 
 		
#browser_notice{
	position: absolute;
	padding-left:5px;
	bottom:0px;
	left:0px;
	width:250px;
	border: 0px solid red;
	font-family: Arial;
    font-size:8pt;
    text-align: left;
}
#footer_feather{
	background: url(http://img.larkingabout.com/layout/down_feather.png) no-repeat;
	width:150px;
	height:100px;
	position:absolute;
	right: 5px;
	bottom:0px;
	}

/* **************************************
 * Index.php Specific Styles			* 	
 ************************************* */ 	
 
/* Welcome message box on index.php */
#welcome_box{
	border: 3px solid #163b60;
	background-color: #80a6cd;
	width:400px;
	height: 90px;
	padding:10px;
	padding-left:90px;
	position:absolute;
	top:65px;
    left:100px;
    z-index:1;
}#welcome_box A{
	color: white;
}
	#welcome_bird{
		width:188px;
		height:261px;
		margin-left:auto;
		margin-right:auto;
		position:absolute;
		top:0px;
		left:50px;
		background: url(http://img.larkingabout.com/lark/lark_happy_flit.png) no-repeat;
		z-index:2;
	}

/* Mousover Navigation Boxes -- Structure */
#index_select{
	position: absolute;
	top:205px;
	background: url(http://img.larkingabout.com/layout/index_selectors.gif) no-repeat;
	width:665px;
	height:70px;
	margin-left:auto;
	margin-right:auto;
	z-index:4;
	}
	#iselect_box1{
		position: absolute;
		left:15px;
		top:0px;
		width:75px;
		height:70px;
	}
	#iselect_box1 A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
	}	
	#iselect_text1{
		position: absolute;
		top:10px;
		left:140px;
	}
	#iselect_box2{
		position: absolute;
		left:234px;
		top:0px;
		width:75px;
		height:70px;
	}
	#iselect_box2 A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
	}
	#iselect_text2{
		position: absolute;
		top:10px;
		left:355px;
	}
	#iselect_box3{
		position: absolute;
		left:453px;
		top:0px;
		width:75px;
		height:70px;
	}
	#iselect_box3 A{
		display: block;
		height: 100%;
		width: 100%; 
		text-decoration: none;
		border-bottom: 0px;
	}
	#iselect_text3{
		position: absolute;
		top:10px;
		left:600px;
	}
	
/* Mousover Navigation Boxes -- Active */

	.iselect_text_active A{
		text-decoration:none;
		color: #bfd8f0;
	}
	.desc_active A{
		text-decoration:none;
		position: absolute;
		top:260px;
		display:block;
		margin: 35px;
	}
	.iselect_active1{
		background: url(http://img.larkingabout.com/layout/select_boxes/box_ideas_active.gif) no-repeat;	
	}	
	.iselect_active2{
		background: url(http://img.larkingabout.com/layout/select_boxes/box_uc_active.gif) no-repeat;	
	}
	.iselect_active3{
		background: url(http://img.larkingabout.com/layout/select_boxes/box_port_active.gif) no-repeat;	
	}
		
/* Mousover Navigation Boxes -- Inactive */	
	.iselect_text_inactive A{
		color: #163b60;
		text-decoration: none;
	}
	.desc_inactive{
		display: none;
	}
	.iselect_inactive1{
		background: url(http://img.larkingabout.com/layout/select_boxes/box_ideas_inactive.gif) no-repeat;	
	}
	.iselect_inactive2{
		background: url(http://img.larkingabout.com/layout/select_boxes/box_uc_inactive.gif) no-repeat;	
	}
	.iselect_inactive3{
		background: url(http://img.larkingabout.com/layout/select_boxes/box_port_inactive.gif) no-repeat;	
	}

	
/* **************************************
 * Prototypes.php Specific Styles		* 	
 ************************************* */ 	

#prototype_mod{
	border: 1px dotted #6d9ece;
	padding:5px;
	font-size:10pt;
	margin-top:55px;
	}
	#prototype_mod h3{
	margin: 0px;
	margin-bottom: 5px;
	color: #6d9ece;
	text-align: left;
	}
	#prototype_mod h4, #prototype_mod h4 A{
	margin: 0px;
	margin-bottom: 10px;
	color: #6d9ece;
	text-align: left;
	}
	.prototype_image{
	border:0px;
	float: left;
	margin-right:10px;
	}
	.prototype_links, .prototype_links A{
		text-align: right;
		color: #6d9ece;
		text-decoration: none;
		padding-top: 10px;
	}


/* **************************************
 * Twitter Styles						* 	
 ************************************* */ 	

#twitter_div{
	background-color: #80a6cd;
	color: white;
	border: 2px dotted #416e9c;
	width:171px;
	margin-top:25px;
	position: absolute;
	bottom:0px;
	right:0px;
}
#twitter_header{
	background-color: #416e9c;
	width:100%;
}
.twitter_lark{
	float:left;
	border:0px;
}
#twitter_update_list{
	list-style-type: none;
	text-align:left;
	margin:0px;
	padding:0px;
}

#twitter_update_list A{
	font-size:8px;
	color: #d1e3f6;
	text-decoration: none;
	display: block;
}
#twitter-link{
	color: white;
	text-decoration: none;
}


/* **************************************
 * Right Bar Menu Styles				* 	
 ************************************* */ 	
.right_bar_module{
	background-color: #80a6cd;
	color: white;
	border: 2px dotted #416e9c;
	width:171px;
}
#estimate_plug{
	background: url(http://img.larkingabout.com/layout/ban_estimate.jpg) no-repeat;	
	height:50px;
	margin-bottom:2px;
	background-color: #80a6cd;
	color: white;
	border: 2px dotted #416e9c;
	width:171px;
	}
	#estimate_plug A{
				display: block;
				height: 100%;
				width: 100%; 
				text-decoration: none;
				border-bottom: 0px;
				z-index:10;
			}	
#specials_plug{
	height:90px;
	margin-top:60px;
	background: url(http://img.larkingabout.com/banners/ad_ban_1.jpg) no-repeat;
	background-color: #80a6cd;	
	color: white;
	border: 2px dotted #416e9c;
	width:171px;
}
	#specials_plug A{
				display: block;
				height: 100%;
				width: 100%; 
				text-decoration: none;
				border-bottom: 0px;
				z-index:10;
			}	
#user_actions{
	padding: 5px 0px 5px 0px;
	background-color: #346699;
	color: white;
	border: 2px dotted #416e9c;
	width:171px;
}
#user_actions A{
	text-decoration:none;
	color: white;
}
 
/* **************************************
 * Freelance Hub Page Navigation		* 	
 ************************************* */ 
 
.fl_feather_left{
	width:50px;
	height:50px;
	position:absolute;
	top:0px;
	left:0px;	
	display: inline-block;	
}
.fl_feather_right{
	width:50px;
	height:50px;
	position:absolute;
	top:0px;
	right:0px;	
		
}

img.fl_feather{
	margin-top: -32px;
	z-index:5;
}

.fl_box{
	background-color: #fbfbff;
	width:20px;
	height:20px;
	border: 1px solid #163b60;
	position:absolute;
	bottom:0px;
	left:0px;
}
.fl_box_active{
	background-color: #c4dbf1;
}

.fl_text A{
	visibility:hidden;
	display:block;
}

.fl_text_active A{
	display:block;
	text-decoration: none;
	color: #a7c5e2;
	visibility: visible;
	position:relative;
	top:35px;
}

.fl_title A{
	color: #a7c5e2;
	display: inline-block;
	text-decoration: none;
	font-size:13pt;
	position:relative;
	top:32px;
}
.fl_title_right A{
	left:40px;
}
.fl_title_left A{
	right:65px;
}
.fl_title_active A{
	color: #476d93;
}

.fl_wrapper{
	text-decoration: none;
	color: black;
	margin-top:5px;
	margin-left:150px;
	position:relative;
	margin-bottom:25px;
}
.fl_wrapper_right{
	text-decoration: none;
	color: black;
	margin-top:5px;
	margin-right:150px;
	position:relative;
	text-align:right;
	margin-bottom:25px;
}

/* **************************************
 * Pricing Packages Styles				* 	
 ************************************* */ 

#package_wrapper{
	position:relative;
	width:100%;
	padding:5px;
	margin-bottom:20px;
	height:435px;
}
#package_menu{
	/*margin-left:auto;
	margin-right:auto; */
	background: url(http://img.larkingabout.com/layout/bg_pinstripe.jpg) repeat;
	padding:10px;
	width:90px;
	border: 1px #416e9c dotted;
}

.div_package{
	padding: 10px;
	border: 2px #416e9c solid;
	text-align: center;
	width:150px;
	height:100px;
	background-color:white;
	margin-bottom:10px;
	margin-top:10px;
}
#package_desc{
	float:right;
	padding:10px;
	margin-right:50px;
	border: 1px #416e9c dotted;
	width:400px;
	min-height:280px;
	font-size:9pt;
}
	#package_desc A{
		font-size:9pt;
	}

/* **************************************
 * Experiments Page Styles				* 	
 ************************************* */ 	
#game_blurb_container{
	width:550px;
	border: 2px solid #80a6cd;
	color: #27598b;
	padding:5px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	top:40px;
	}
#exp_intro{
	width: 550px;
	border: 2px solid #163b60;
	background-color: #80a6cd;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	top:10px;
	padding:5px;
	color:white;
}	
/* **************************************
 * Portfolio Page Styles				* 	
 ************************************* */ 	
	.slidder_indent{
	margin-left:25px;
	text-align: justify;
	font-size:9pt;
	}
	#slider{
		margin-right:auto;
		margin-left:auto;
		margin-top: 75px;
		width:400px;
	}
	#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:700px;
		height:1000px;
		overflow: visible;
		}
	span#prevBtn A{text-decoration:none; position:absolute; top:120px; left: 20px;}
	span#nextBtn A{text-decoration:none; position:absolute; top:120px; right: 20px;}
	
/* **************************************
 * Current.php Styles					* 	
 ************************************* */ 		
 
#current_box{
	border: 2px solid #163b60;
	background-color: #c1d5ed;
	width:400px;
	height: 300px;
	padding:10px;
	padding-left:90px;
	position:absolute;
	top:65px;
    left:100px;
    z-index:1;
}#current_box A{
	color: white;
}
#current_burd{
		width:206px;
		height:217px;
		margin-left:auto;
		margin-right:auto;
		position:absolute;
		top:0px;
		left:0px;
		background: url(http://img.larkingabout.com/lark/lark_raised.png) no-repeat;
		z-index:2;
	}
	
/* **************************************
 * Javascript Disabled Warning			* 	
 ************************************* */ 	
.poop{
	position: absolute;
	top:0px;
	right:0px;
	padding:10px;
	width:300px;
	height:50px;
	z-index:10000; 
	text-align:center;
	background-color: white;
	border:1px solid black;
}