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


/* Styles for Basic Layout */


body, html {
	margin: 0;
	padding: 0;
	background-color: #fff;
	font-family: "Lucida Grande", Verdana, Arial, sans-serif;
}

.wrapper {
	width: 1000px;
	margin: 0 auto;
	}
	
.featuredWrapper { width: 1020px; padding-top: 20px; }
	
p {
	font-family: "Lucida Grande", Verdana, Arial, sans-serif;
	line-height: 1.5em;
	font-size: 12px;
	font-weight: normal;
	}
	
h1 {
	font-family: "museo-sans-1","museo-sans-2",sans-serif;
	font-weight: 300;
	margin: 0;
	padding: 0;
	font-size: 26px;
	}
	
h2 {
	font-family: "museo-sans-1","museo-sans-2",sans-serif;
	font-weight: 300;
	margin: 0;
	padding: 0;
	font-size: 18px;
	}


.thanks { font-size: 100px; color: white; line-height: 1em; }


/* Styles for Header */

.top {text-align: center; }




/* Styles for Content */

.mainContent {
	width: 100%;
	padding: 0 0 10px 0;
	background: url(images/mainBG.gif) center top repeat-x #4d545a;
	min-height: 500px;
	}
	
	
	
	
/*Styles for Navigation */

ul.topnav {
	list-style: none;
	padding: 20px 0;
	margin: 0;
	float: left;
	width: 1000px;
	font-size: 1.2em;
	z-index: 1000;
}
ul.topnav li {
	float: left;
	margin: 0;
	padding: 0 15px 0 0;
	position: relative; /*--Declare X and Y axis base for sub navigation--*/
}

ul.topnav li a {
	padding: 10px 5px;
	color: #fff;
	display: block;
	text-decoration: none;
	float: left;
	font-family:  "Lucida Grande", Verdana, Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	}


ul.topnav li a:hover{
	color: #CCCCCC;
}
ul.topnav li span { /*--Drop down trigger styles--*/
	width: 20px;
	height: 35px;
	float: left;
	background: url(images/navArrows.gif) no-repeat center top; /* Arrow */
}
ul.topnav li span.subhover {background-position: center bottom; cursor: pointer;} /*--Hover effect for trigger--*/
ul.topnav li ul.subnav {
	list-style: none;
	position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
	left: 0; top: 35px;
	background: #333;
	margin: 0; padding: 0;
	display: none;
	float: left;
	width: 170px;
	border: 1px solid #394046;
}
ul.topnav li ul.subnav li{
	margin: 0; padding: 0;
	border-top: 1px solid #4c555d; /*--Create bevel effect--*/
	border-bottom: 1px solid #444; /*--Create bevel effect--*/
	clear: both;
	width: 170px;
}
html ul.topnav li ul.subnav li a {
	float: left;
	width: 145px;
	background: #333 url(dropdown_linkbg.gif) no-repeat 10px center;
	padding-left: 20px;
	font: 14px normal "Lucida Grande", Verdana, Arial, sans-serif;
}

html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/
	background: #606c76;
}

.wrapperNav {
	width: 1000px;
	margin: 0 auto;
	position: relative;
	z-index: 1000;
	height: 90px;
	}
	
	
	
	


/* Styles for home page */

#featuredBG {
	width: 1000px;
	background-color:#b6bfc7;
	padding: 0;
	background-image:url(images/featured_BG.gif);
	background-repeat:repeat-x;
	-moz-border-radius: 3px; -webkit-border-radius: 3px;
	}
	
#featuredOne {
	width: 309px;
	float: left;
	margin: 12px;
	padding: 0;
	}
	
#featuredTwo {
	width: 309px;
	float: left;
	margin: 12px;
	padding: 0;
	}
	
#featuredThree {
	width: 309px;
	float: left;
	margin: 12px;
	padding: 0;
	}

	
	
.blueBox { padding: 10px; background-color: #138fc6; margin-bottom: 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 2px solid #0d79b7;}
.greenBox { padding: 10px; background-color: #94c43d; margin-bottom: 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.pinkBox { padding: 10px; background-color: #eb468f; margin-bottom: 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.yellowBox { padding: 10px; background-color: #e6ca66; margin-bottom: 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 2px solid #debb51; }
.raspberryBox { padding: 10px; background-color: #b6295a; margin-bottom: 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 2px solid #a41d46; }



/* Styles for inside pages */

.lightgreen { border-top: 10px solid #c2da4d; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.blue { border-top: 10px solid #138fc6; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.darkgreen { border-top: 10px solid #94c43d; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.pink { border-top: 10px solid #eb468f; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.yellow { color: #e6ca6c; }

#sectionHeader {
	width: 960px;
	padding: 20px;
	color: white;
	margin-bottom: 30px;
	filter:progid:DXImageTransform.Microsoft.DropShadow(Color=#3c4346, OffX=2, OffY=2);
	-webkit-box-shadow: 2px 2px 3px #3c4346;

	}
	
.insideRight {
	float: right;
	width: 730px;
	padding: 0 20px 20px 20px;
	}

	
	
	
	
/* Styles for Footer */

#footer {
	width: 100%;
	padding: 20px 0;
	}

.footerLeft {
	float: left; 
	margin-right: 40px;
	}
	
.footerRight {
	float: right;
	text-align: right;
	margin-top: 0;
	padding: 0;
	}
	
#footer ul {
	margin: 0; padding: 0;
	}

#footer ul li {
	color: #b60050;
	font-size: 11px;
	list-style-type: none;
	margin: 5px 0;
	padding: 0;
	}
	
#footer ul li ul {
	margin: 0; padding: 0; }
	
#footer ul li ul li {
	color: #69737C;
	font-size: 11px;
	list-style-type: none;
	}
	
#footer ul li a {
	color: #69737C; text-decoration: none;
	}
	
#footer ul li a:hover {
	color: #4a535c; text-decoration: underline;
	}
	
#footer ul li a.raspberryText {
	color: #b60050; text-decoration: none;
	}
	
#footer ul li a.raspberryText:hover {
	color: #b60050; text-decoration: underline;
	}
	
	
#like { clear: left; padding-top: 30px; }
	

/* Styles for portfolioTop */

#portfolioTop {
	width: 100%;
	padding: 20px 0;
	color: white;
	}

	
	
/* Styles for Portfolio Navigation */

* { margin: 0; padding: 0; }

#portfolioNav {
	color: white;
	}
	
#portfolioNav ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}
	
#portfolioNav ul li {
	margin: 10px 0 0 0;
	padding: 0;
	}
	
#portfolioNav ul li a {
	color: white;
	text-decoration: none;
	font-weight: bold;
	}
	
#portfolioNav ul li a:hover {
	color: #CCC;
	}
	
#portfolioNav ul li ul li {
	margin-left: 20px;
	}
	
#portfolioNav ul li ul li a {
	font-weight: normal;
	}
	
#portfolioNav ul li ul li a:hover {
	color:#CCCCCC; text-decoration: underline;
	}
	
	
	
/* Styles for Gallery */

	#portfolioRight { width: 700px; float: right; margin-left: 20px; }

	.demo{position:relative;margin-top:2em;}
	
	.gallery_demo{width:702px; }

	.gallery_demo ul { margin: 0; padding: 0; }
	
	.gallery_demo li{width:131px; height:75px; border: none; margin: 0 10px 0 0; float: left; list-style-type: none;}
		
	#main_image{margin: 10px 0 10px 0; height:450px; width:700px; background-color: none;}
	
	#main_image img{margin-bottom:10px;}
	
	.caption{ color:white; font-size: 11px;}
	
	
	
	
	
/* Misc Styles */

.clear { clear: both; }

.divider {
	margin: 20px 0; border: 1px solid #a2abb4;
	}

img { border: none; }

a  { text-decoration: none; border: none; color: #EBEBEB; }

.whiteText { color: white; }
.greyText { color: #EBEBEB; }
.darkgreyText { color: #b8b8b8 ; }
.darkText { color: #4d545a; }

.sectionBox { padding: 5px 0 5px 20px; background-color:#4d545a; color: white; text-transform: uppercase; width: 150px; margin: 0 0 10px -20px; }


.raspberryText {color: #ac004c; }
.lightpinkText { color: #EEB4DC; }
.darkyellowText { color: #b9a256; }


.picRight { float: right; margin: 0 0 0 20px; }
.picLeft { float: left; margin: 0 20px 10px 0; }

.bigText { font-size: 16px; }

.featuredPic { margin-bottom: 10px; }

a.white { color: white; }
a.white:hover { color: #EBEBEB; text-decoration: underline;}


.columns { width: 30%; padding: 3px; float: left; }

.bio { width: 545px; float: right;  padding: 10px 0 10px 30px; margin: 0 0 10px 20px; border-left: 1px solid #999999; }
.bioWrapper { padding-top: 10px; }

.bigideas { float: right; margin: 0 10px 0 0; }





/* BEGIN BUTTON CSS */
	
a.fadeBtn, a.fadeBtn:visited {  
display:block;  
background-color: #4d545a;  
padding:4px;  
text-align:center;  
font-weight:normal;  
border-radius: 5px;  
-moz-border-radius: 3px;  
-webkit-border-radius: 3px;  
color:#fff;  
text-decoration: none;  
opacity:.85;
height: 16px;
width: 110px;
font-size: 12px;
border: 1px solid #999999;
font-family: "museo-sans-1","museo-sans-2",sans-serif;
font-weight: 500;
}

a.fadeBtn:hover { background-color: #636c74; }



/* Styles for Contact Form */

input { padding: 3px; margin-top: 5px; }

textarea { padding: 0; }

#contactform { margin-top: 20px; }

select { margin-top: 5px; }

.btn { background-color: #b5004f; color: white; width: 80px; border: none; padding: 5px 0; font-family: "museo-sans-1","museo-sans-2",sans-serif; font-weight: 500; font-size: 12px; text-align: center; cursor:pointer;} 
.btnClear { background-color: #4d545a; color: white; width: 80px; border: none; padding: 5px 0; font-family: "museo-sans-1","museo-sans-2",sans-serif; font-weight: 500; font-size: 12px; text-align: center; cursor:pointer; }

.btn:hover { background-color: #d0015b; }
.btnClear:hover { background-color: #636c74; }




/* NEW Portfolio Slider Gallery */

/*--Main Container--*/
.main_view {
	float: left;
	position: relative;
}
/*--Window/Masking Styles--*/
.window {
	height:400px;	width: 700px;
	overflow: hidden; /*--Hides anything outside of the set width/height--*/
	position: relative;
}
.image_reel {
	position: absolute;
	top: 0; left: 0;
}
.image_reel img {float: left;}

/*--Paging Styles--*/
.paging {
	margin-top: 10px;
	z-index: 100; /*--Assures the paging stays on the top layer--*/
	line-height: 40px;
	float: right;
}
.paging a {
	padding: 5px;
	text-decoration: none;
	color: #b8b8b8;
	font-size: 12px;
}
.paging a.active {
	font-weight: normal;
	background: #b8b8b8;
	color: #4d545a;
	border: 1px solid #4d545a;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.paging a:hover {font-weight: bold;}






.proBono_Content {
	float: right;
	width: 730px;
	padding: 20px;
	background-color: #c8d2dc;
	background-image:url(images/proBono_flyer.jpg);
	background-position:top;
	background-repeat:no-repeat;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	padding-top: 402px;
	}
	
	
	
	
	
	
/* NEW Rotating Banner */



		/*------------------------
		--------------- LEFT ARROW
		------------------------*/
		
		/* Sets position and main configs */
		.slider_arrow_left {
			
			bottom: 10px;
			cursor: pointer !important;
			float: left;
			height: 22px;
			left: 10px;
			position: absolute;
			width: 22px;
			z-index: 5;
			
		}
		
		/* left arrow image */
		.slider_arrow_left {
			
			background: url(images/left_arrow.png) no-repeat top left;
			
		}


		/*------------------------
		-------------- RIGHT ARROW
		------------------------*/
		
		/* Sets position and main configs */
		.slider_arrow_right {
			
			bottom: 10px;
			cursor: pointer;
			float: left;
			height: 22px;
			left: 37px;
			position: absolute;
			width: 22px;
			z-index: 5;
			
		}
		
		/* Right arrow Background */
		.slider_arrow_right {
			
			background: url(images/right_arrow.png) no-repeat top left;
			
		}




	/*------------------------
	---------------- SELECTORS
	------------------------*/
	
	/* Sets configs for selectors containers : absolute positioned in relation to #slider */
	.slider_selector, .slider_selector_dis {
		
		bottom: 10px;
		list-style: none;
		margin: 0 0 0 5px;
		position: absolute;
		right: 10px;
		z-index: 5;
		
	}
	
		/* Sets image of selectors */
		.slider_selector li, .slider_selector_dis li {
			
			display: block !important;
			background: url(images/slider_selector.png) no-repeat top left;
			cursor: pointer;
			float: left;
			margin: 0 3px !important;
			height: 10px !important;
			position: relative !important;
			width: 10px !important;
			
		}
		
		/* Sets the current selector */
		.slider_selector li.current, .slider_selector_dis li.current {
			
			background: url(images/slider_selector_current.png) no-repeat top left;
			
		}
	
	/* Disables the selectors */
	.slider_selector_dis li {
		
		cursor: default !important;
		z-index: 5;
		
	}
	
	.container {
		
		float: left;
		position: relative;
		width: 100%;
		z-index: 15;
		
	}
	
	
	
	
/* New Navigation */

.navBtn { border-top: 10px solid #636c74; }
.navBtn:hover {border-top: 10px solid #b3c0cc; }

#Navigate { padding: 20px 0; }
#Navigate ul { margin: 0; padding: 0; list-style: none; }
#Navigate ul li { display: inline-block; margin: 0 ; float: left; padding: 0 30px 0 0; list-style: none; }
#Navigate ul li a { font-family: "museo-sans-1","museo-sans-2",sans-serif; font-size: 16px; color: #d5dfe8; text-decoration: none; display: block; padding: 10px 10px 10px 0; width: 100%; height: 100%; font-weight: 300; }

.navBtnlast { background-color: #CCC; margin: 0; }





/*------------------------
/*-- Portfolio Navigation 
/*------------------------

/* remove the list style */

	.WorkNav { font-family: "museo-sans-1","museo-sans-2",sans-serif; font-size: 11px; margin: -20px -20px 20px -20px; padding: 0 20px 20px 20px; font-weight:300; }
	
	#nav {
		margin:0; 
		padding:0;
		list-style:none;
	}	
	
		/* make the LI display inline */
		/* it's position relative so that position absolute */
		/* can be used in submenu */
				
		#nav li {
			float:left; 
			display:block; 
			width:225px; 
			background:#fff; 
			position:relative;
			z-index:500; 
			margin-right: 20px;;
		}
		
		.dropdownIcon { background-image: url(images/plusIcon.png); background-repeat:no-repeat; background-position: 200px center; }
		
		/* this is the parent menu */
		#nav li a {
			display:block; 
			padding:10px; 
			text-decoration:none; 
			color:#333;
		}

		#nav li a:hover {
			background-color: #F7F7F7;
		}
	
		/* you can make a different style for default selected value */
		#nav a.selected {
			color:#f00;
		}
	
		/* submenu, it's hidden by default */
		#nav ul {
			position:absolute; 
			left:0; 
			display:none; 
			margin:0; 
			padding:0; 
			list-style:none;
		}
		
		#nav ul li {
			width:225px; 
			float:left; 
			border-top:1px solid #CCCCCC;
		}
		
		/* display block will make the link fill the whole area of LI */
		#nav ul a {
			display:block;  
			height:15px;
			padding: 10px; 
			color:#666;
		}
		
		#nav ul a:hover {
			text-decoration:underline;	
		}

		/* fix ie6 small issue */
		/* we should always avoid using hack like this */
		/* should put it into separate file : ) */
		*html #nav ul {
			margin:0 0 0 -2px;
		}
		
		
/* Portfolio div */

.projectBox { width: 205px; background-color: none; margin-left: 20px; float: left; margin-bottom: 20px; padding: 10px; border-top: 10px solid #939ba3; }
.projectBoxfirst { width: 205px; margin-left: 0; float: left; margin-bottom: 20px; padding: 10px; border-top: 10px solid #939ba3; }

.thumbImage { margin-bottom: 5px; border: 1px solid #939ba3; }
.editBox { float: right; padding: 0; margin-bottom: 10px;}
.featuresText { height: 26px; margin-top: 3px;}
.adminLinks {margin-left: 10px; }
.thumbText { font-size: 11px; color: #4d545a; width: 200px; }

.workBox {
	width: 960px;
	padding: 20px;
	background-image:url(images/rightContentBG.gif);
	background-repeat:repeat-x;
	background-color: #aeb6be;
	margin-top: 0;
	min-height: 700px;
	}
	

.portfolioPic { margin-bottom: 20px; border: 1px solid #939ba3;}


.backBtn, .backBtn:visited {  
display:block;  
background-color: #4d545a;  
padding:4px;  
text-align:center;  
font-weight:normal;  
border-radius: 5px;  
-moz-border-radius: 3px;  
-webkit-border-radius: 3px;  
color:#fff;  
text-decoration: none;  
opacity:.85;
height: 16px;
width: 150px;
font-size: 12px;
border: 1px solid #999999;
font-family: "museo-sans-1","museo-sans-2",sans-serif;
font-weight: 500;
margin-top: 10px;
}

.backBtn:hover { background-color: #636c74; }







/* Portfolio pagination */

.paginate {
	font-family: "Lucida Grande", Verdana, Arial, sans-serif; padding: 3px; margin-bottom: 10px; float: right; }

.paginate a {
	padding:2px 5px 2px 5px;
	margin:2px;
	text-decoration:none;
	color: #4d545a;
	font-size: 12px;
}
.paginate a:hover, .paginate a:active {
	color: white;
	background-color: #4d545a;
}
.paginate span.current {
    margin: 2px;
	padding: 2px 5px 2px 5px;
	background-color: #4d545a;
	color: #FFF;
	font-size: 12px;
	}

.paginate span.disabled {
	padding:2px 5px 2px 5px;
	margin:2px;
	color: #EBEBEB;
	font-size: 12px;
	}

.paginate ul li{
		padding:4px;
		margin-bottom:3px;
		background-color:#FCC;
		list-style:none;}

.paginate ul { margin:6px; padding:0px;}
	
	
	
	


/* New Circle header */

.circle { float: right; margin: -70px 20px 0 0; z-index:1000; }

.banner { float: right; padding-left: 15px; }

.sectionTopper { }

.topperBG { padding: 0; }

.labelBox {
	float: right; background-color: #cc3569; padding: 10px 50px; margin: 10px -20px 0 0;
	-moz-border-radius-bottomleft: 3px; border-bottom-left-radius: 3px; -moz-border-radius-topleft: 3px; border-top-left-radius: 3px;
	}
	
/*.labelText { color: #fff; margin-bottom: 20px; border: 1px dotted #636c74; padding: 10px 30px;  } */
.labelText { color: #fff; margin: 0 -20px 40px -20px; padding: 10px 20px 0 0; font-size: 36px; text-align: right; text-transform: uppercase; font-style: italic; border-bottom: 1px solid #fff; overflow: hidden; height: 34px;  }

.videoBox { width: 700px; text-align: center; background-image:url(images/videoBG.jpg); margin-bottom: 20px; }




/* Home page equally spaced divs */

.featured { background-color:#0CC; padding: 10px 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; background-color:#aeb6be; background-image:url(images/rightContentBG.gif); background-repeat:repeat-x; margin-top: 20px; }

.featuredLeft { float: left; width: 235px; height: 320px; padding: 0; margin-right: 20px; }
.featuredRight { float: right; width: 235px; height: 320px; padding: 0;  }

.boxContent { background-color:#aeb6be; padding: 10px; }
.boxContentBLOG { height: 170px; }

.more { margin-top: 10px; }
.more a { font-size:11px; text-transform:uppercase; font-family: "museo-sans-1","museo-sans-2",sans-serif; font-weight: 500; color: white; }
.more a:hover {color:#ffe05e; }

.moreBlog { margin-top: 10px; }
.moreBlog a { font-size:11px; text-transform:uppercase; font-family: "museo-sans-1","museo-sans-2",sans-serif; font-weight: 500; color:#aeb6be; }
.moreBlog a:hover {color:#ac004c; }


.boxContent h2 { margin-bottom: 5px; }

.blogRight { float: right; width: 215px; height: 314px; background-color:none ;padding:10px; background-image:url(images/blogBoxBG.png); background-position: left bottom; background-repeat:no-repeat;  }


.boxesText { padding: 10px; background-color:#aeb6be; }
.lastBox { float: right; margin-right: 0; }
.boxesBlog { background-color: #fff; padding: 10px; }

#blogBox { background: transparent url(images/blogBalloonBtm.gif) bottom center no-repeat; }



/* RSS feed */

#feed { font-family: "Lucida Grande", Verdana, Arial, sans-serif; font-weight: 12px; margin-top: 10px; }
#feed ul { list-style-type: none; }
#feed ul li { margin-bottom: 10px; padding-top: 10px; border-top:1px solid #CCCCCC; }
#feed .headline a { font-weight: bold; color: #000; }
#feed div { font-size: 11px; font-weight: normal; color:#4d545a; }

#creditfooter {
display: none;
}

.btnTab { padding: 5px 0; background-color:#4d545a; color: white; text-transform: uppercase; width: 100px; text-align:center; margin-top: 10px; }
.btnTab:hover { background-color: #888888; }


/* Need help? */

.help { margin-top: -27px; float: right; height: 109px; width:109px;}


/* Help Wanted? */

.helpwanted {
	padding: 20px;
	background-image:url(images/rightContentBG.gif);
	background-repeat:repeat-x;
	background-color: #aeb6be;
	margin: 0 0 0 40px;
	float: right;
	}
	
	
#helpwantedList { margin: 10px 0; }
#helpwantedList ul { list-style-type: none; margin: 20px 0 0 0; padding: 0; }
#helpwantedList ul li { margin: 0; padding: 0; background-image: url(images/helpwantedArrow.png); background-repeat: no-repeat; background-position: center left; height: 40px; }
.helpText { color: white; margin: 0; padding: 11px 0 0 50px; }