/* ##########################################
   ##  Name: DreamFolio                    ##
   ##  Developed by: cesiel1993            ##
   ##  File: style.css                     ##
   ##  Last Updated: May 19th, 2009        ##
   ##  Help: Email - cesiel1993@gmail.com  ##
   ##########################################
*/

body {
	background: #444444;
	font: 12px Arial, Helvetica, Sans-Serif;
	color: #333333;
	margin: 0;
	padding: 0;
}


/* ---- Standard Elements ---- */

a img {
	border: none;
}

img.border {
	background: #EEEEEE;
	padding: 7px;
	border: 1px solid #CCCCCC;
}

h1, h2, h3, h4, h5 {
	font-family: Arial, Helvetica, Sans-Serif;
	font-weight: bolder;
	color: #222222;
	margin: 0 0 8px 0;
}

h1 { font-size: 30px; letter-spacing: -1px; }
h2 { font-size: 24px; letter-spacing: -.9px; }
h3 { font-size: 18px; letter-spacing: -.5px; }
h4 { font-size: 16px; }
h5 { font-size: 14px; margin-bottom: 3px; }

p {
	line-height: 2em;
	padding: 0;
	margin: 5px 0 10px 0;
}

blockquote {

	line-height: 2em;
	font-style: italic;
}

ul {
	list-style-type: square;
	line-height: 1.8em;
}

ol {
	line-height: 1.8em;
}

hr {
	height: 1px;
	color: #DDD;
	background-color: #DDD;
	border: 0;
	margin: 5px 0 10px 0;
}

hr.space {
	height: 1px;
	color: #DDD;
	background-color: #DDD;
	border: 0;
	margin: 15px 0 15px 0;
}

input {
	border: 1px solid #CCCCCC;
	padding: 4px;
	font: 12px Arial, Helvetica, Sans-Serif;
}

textarea {
	border: 1px solid #CCCCCC;
	padding: 4px;
	font: 12px Arial, Helvetica, Sans-Serif;
}


/* ---- Header ---- */

#header {
	height: 392px;
}

#header_inner {
	height: 158px;
}

#header_container {
	width: 960px;
	margin: 0 auto;
}

.header_title {
	position: absolute;
	float: left;
	background: url(../images/header_title.gif);
	width: 396px;
	height: 70px;
	cursor: pointer;
}

/* -- Header: Navigation -- */

#navigation {
	position: absolute;
	margin: 13px 0 0 399px;
}

#navigation ul {
	margin: 0;
	padding: 0;
	line-height: normal;
}

#navigation ul li {
	background: url(../images/nav_divider.gif) no-repeat top right;
	display: inline;
	padding: 12px 2px 15px 0;
	margin-left: -3px;
	list-style-type: none;
}

#navigation ul li a {
	padding: 14px 28px 15px 27px;
	color: #333333;
	text-decoration: none;
}

#navigation ul li a:hover {
	background: url(../images/nav_hover.gif) repeat-x;
}

/* -- Header: Display -- */

#display {
	position: absolute;
	float: right;
	background: url(../images/display_bg.jpg) no-repeat;
	width: 535px;
	height: 295px;
	margin: 70px 0 0 425px;
}

#display div {
	margin: 10px;
}

/* -- Header: Message -- */

#header_message {
	position: absolute;
	float: left;
	margin: 85px 0 0 10px;
	width: 400px;
	color: #e0f6ff;
}

#header_message a {
	color: #e0f6ff;
}

#header_message a:hover {
	color: #FFFFFF;
	text-decoration: none;
}

#header_message h2 {
	color: #FFFFFF;
}

#header_message h1 {
	color: #FFFFFF;
	margin-top: 10px;
}

#header_message ul {
	margin: 0;
	padding: 0;
}

#header_message ul li {
	background: url(../images/check.png) no-repeat left;
	line-height: 2.5em;
	padding-left: 25px;
	list-style-type: none;
}

.projectslink {
	position: absolute;
	float: left;
	margin-top: 329px;
	cursor: pointer;
}

.projectslink small {
	color: #999999;
	font: 12px Arial, Helvetica, Sans-Serif;
}

.projectslink span {
	color: #FFFFFF;
	font: bolder 24px Arial, Helvetica, Sans-Serif;
	margin-bottom: 3px;
}


/* ---- Content ---- */

#content_background {
	background: #E5E5E5;
	width: 100%;
	height: 100%;
	padding-top: 25px;
}

#content_container {
	width: 960px;
	margin: 0 auto;
}

#content  {
	float: left;
	background: url(../images/content_bg.gif) repeat-y;
	width: 958px;
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	padding: 0 1px 0 1px;
	margin-bottom: 25px;
}

#left {
	float: left;
	background: #f3f3f3;
	width: 269px;
	border-right: 1px solid #d7d7;
}

.left_title {
	background: url(../images/left_titlebg.gif);
	font: bolder 16px Arial, Helvetica, Sans-Serif;
	width: 254px;
	height: 33px;
	padding: 12px 0 0 15px;
	border-top: 1px solid #d7d7d7;
}

.first {
	border-top: none;
}

.left_text {
	margin: 13px 17px 17px 17px;
}

#left ul {
	margin: 0;
	padding: 0;
}

#left ul.borders li {
	list-style-type: none;
	border-bottom: 1px solid #E0E0E0;
	border-top: 1px solid #FFFFFF;
	padding: 8px 0 8px 15px;
}

#left ul.borders li a {
	color: #333333;
}

#left ul.borders li.selected {
	background: #FFFFFF;
	margin-right: -1px;
}

.small {
	font-size: 11px;
	color: #666666;
}

.smallest {
	font-size: 10px;
	text-transform: uppercase;
	color: #666666;
}

#left ul.borders li ul li {
	border: none;
	padding: 5px 17px 0 0;
}

.right_section {
	float: right;
	background: #FFFFFF url(../images/right_bg.gif) repeat-x;
	border-top: 1px solid #D7D7D7;
	width: 643px;
	padding: 25px 15px 25px 30px;
}

.column {
	background: url(../images/column_bg.gif) no-repeat;
	float: left;
	width: 260px;
	margin-top: 15px;
	padding: 20px 20px 10px 20px;
}

.services ul {
	float: left;
	width: 314px;
	list-style-type: none;
	margin: 10px 0 5px 0;
	padding: 0;
}

ul.services {
	float: left;
	width: 286px;
	list-style-type: none;
	margin: 0 0 0 30px;
	padding: 0;
}

ul.services li {
	margin-bottom: 10px;
}

.button a {
	float: left;
	background: url(../images/button.gif) repeat-x;
	height: 16px;
	font: bolder 11px Arial, Sans-Serif;
	color: #FFFFFF;
	padding: 7px 15px 7px 15px;
	margin-top: 5px;
}

.button a:hover {
	color: #FFFFFF;
	text-decoration: none;
}

.button a:visited {
	color: #FFFFFF;
}

.featured_portfolioitem {
	float: left;
	background: url(../images/featured_portfolioitem.gif);
	width: 590px;
	height: 160px;
	padding: 20px;
}

.featured_portfolioitem img {
	float: left;
}

.featured_portfolioitem div {
	float: left;
	width: 310px;
	margin-left: 20px;
}

.featured_portfolioitem .button {
	margin: 0;
}

.portfolioitem {
	float: left;
	background: url(../images/portfolioitem.gif);
	width: 260px;
	height: 210px;
	padding: 20px;
	margin-top: 30px;
}

.portfolioitem img {
	margin-bottom: 10px;
}

.portfolioitem div {
	float: left;
}

.portfolioitem .button {
	float: right;
	margin-top: 3px;
}

.form {
	margin: 0;
	width: 600px;
	padding-top: 10px;
}

#contact_form label {
	color: #333333;
	display: block;
	font-weight: bold;
	text-align: right;
	width: 140px;
	float: left;
	margin-top: 10px;
}
	
#contact_form .small {
	color: #666666;
	display: block;
	font-size: 11px;
	font-weight: normal;
	text-align: right;
	width: 140px;
}
	
#contact_form input {
	float: left;
	width: 330px;
	margin: 10px 0 15px 19px;
	padding: 5px;
	color: #444444;
}
	
#contact_form textarea {
	float: left;
	width: 330px;
	margin: 10px 0 15px 19px;
	padding: 5px;
	color: #444444;
}
	
#contact_form button { 
	clear: both;
	background: url(../images/button.gif) repeat-x;
	margin-left: 382px;
	height: 30px;
	font: bolder 11px Arial, Sans-Serif;
	color: #FFFFFF;
	padding: 7px 15px 7px 15px;
	margin-top: 5px;
	border: none;
}

#contact_form button:hover {
	cursor: pointer;
}

.spacer {
	height: 1px;
	clear: both;
}


/* ---- Footer ---- */

#footer {
	float: left;
	background: url(../images/footer_bg.gif) repeat-x;
	width: 100%;
	height: 37px;
	padding-top: 30px;
	color: #999999;
}

.footer_container {
	width: 960px;
	margin: 0 auto;
}

.footer_left {
	float: left;
}

.footer_right {
	float: right;
}

.footer_right ul {
	margin: 0;
	padding: 0;
	line-height: normal;
}

.footer_right ul li {
	display: inline;
	padding: 12px 0 15px 40px;
	list-style-type: none;
}

.footer_right ul li a {
	color: #999999;
	text-decoration: none;
}

.footer_right ul li a:hover {
	color: #FFFFFF;
}


/* ---- prettyPhoto - Lightbox Clone ---- */
/* ------------------------------------------------------------------------
	This you can edit.
------------------------------------------------------------------------- */

	div.pp_pic_holder .pp_top .pp_left { background: url(../images/prettyPhoto/light_rounded/tl.gif) top left no-repeat; } /* Top left corner */
	div.pp_pic_holder .pp_top .pp_middle { background: #fff; } /* Top pattern/color */
	div.pp_pic_holder .pp_top .pp_right { background: url(../images/prettyPhoto/light_rounded/tr.gif) top left no-repeat; } /* Top right corner */
	
	div.pp_pic_holder .pp_content { background-color: #fff; } /* Content background */
	div.pp_pic_holder .pp_content a.pp_next:hover { background: url(../images/prettyPhoto/light_rounded/btnNext.png) center right no-repeat; cursor: pointer; } /* Next button */
	div.pp_pic_holder .pp_content a.pp_previous:hover { background: url(../images/prettyPhoto/light_rounded/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */
	div.pp_pic_holder .pp_content a.pp_expand { background: url(../images/prettyPhoto/light_rounded/btnExpand.gif) top left no-repeat; cursor: pointer; } /* Expand button */
	div.pp_pic_holder .pp_content a.pp_expand:hover { background: url(../images/prettyPhoto/light_rounded/btnExpand.gif) bottom left no-repeat; cursor: pointer; } /* Expand button hover */
	div.pp_pic_holder .pp_content a.pp_contract { background: url(../images/prettyPhoto/light_rounded/btnContract.gif) top left no-repeat; cursor: pointer; } /* Contract button */
	div.pp_pic_holder .pp_content a.pp_contract:hover { background: url(../images/prettyPhoto/light_rounded/btnContract.gif) bottom left no-repeat; cursor: pointer; } /* Contract button hover */
	div.pp_pic_holder .pp_content a.pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/light_rounded/btnClose.png) center left no-repeat; cursor: pointer; } /* Close button */

	div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_previous { background: url(../images/prettyPhoto/light_rounded/arrow_previous.png) top left no-repeat; } /* The previous arrow in the bottom nav */
	div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_next { background: url(../images/prettyPhoto/light_rounded/arrow_next.png) top left no-repeat; } /* The next arrow in the bottom nav */

	div.pp_pic_holder .pp_bottom .pp_left { background: url(../images/prettyPhoto/light_rounded/bl.gif) top left no-repeat; } /* Bottom left corner */
	div.pp_pic_holder .pp_bottom .pp_middle { background: #fff; } /* Bottom pattern/color */
	div.pp_pic_holder .pp_bottom .pp_right { background: url(../images/prettyPhoto/light_rounded/br.gif) top left no-repeat; } /* Bottom right corner */

	div.pp_pic_holder .pp_loaderIcon { background: url(../images/prettyPhoto/light_rounded/loader.gif) center center no-repeat; } /* Loader icon */
	
	div.light_square .pp_top .pp_left ,
	div.light_square .pp_top .pp_middle,
	div.light_square .pp_top .pp_right,
	div.light_square .pp_bottom .pp_left,
	div.light_square .pp_bottom .pp_middle,
	div.light_square .pp_bottom .pp_right,
	div.light_square .pp_content { background: #fff; }


/* ------------------------------------------------------------------------
	DO NOT CHANGE
------------------------------------------------------------------------- */

	div.pp_pic_holder a:focus { outline:none; }

	div.pp_overlay {
		background: #000;
		position: absolute; top: 0; left: 0;
		z-index: 9500;
		width: 100%;
	}
	
	div.pp_pic_holder {
		position: absolute; z-index: 10000;
		width: 100px;
	}
		
		div.pp_pic_holder .pp_top {
			position: relative;
			height: 20px;
		}
			* html div.pp_pic_holder .pp_top { padding: 0 20px; }
		
			div.pp_pic_holder .pp_top .pp_left {
				position: absolute;
				left: 0;
				width: 20px; height: 20px;
			}
			div.pp_pic_holder .pp_top .pp_middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 20px;
			}
				* html div.pp_pic_holder .pp_top .pp_middle { position: static; left: 0; }
			
			div.pp_pic_holder .pp_top .pp_right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 20px; height: 20px;
			}
		
		div.pp_pic_holder .pp_content {
			position: relative;
			text-align: left;
			width: 100%; height: 40px;
		}
		
			div.pp_pic_holder .pp_content .pp_details {
				display: none;
				margin: 10px 15px 2px 20px;
			}
				div.pp_pic_holder .pp_content .pp_details p.pp_description { display: none; float: left; margin: 0; }
				
				div.pp_pic_holder .pp_content .pp_details .pp_nav {
					float: left;
					margin: 3px 0 0 0;
				}
				
					div.pp_pic_holder .pp_content .pp_details .pp_nav p { float: left; margin: 0 4px; }
				
					div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_previous,
					div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_next {
						float: left;
						display: block;
						width: 14px; height: 15px;
						overflow: hidden;
						text-indent: -10000px;
						margin-top: 3px;
					}
					
					div.pp_pic_holder .pp_content .pp_details .pp_nav a.disabled { background-position: 0 -16px; cursor: default; }
		
		div.pp_pic_holder .pp_content div.pp_hoverContainer {
			position: absolute; z-index: 2000;
			top: 0; left: 0;
			width: 100%;
		}
		
		div.pp_pic_holder .pp_content a.pp_next {
			display: block; float: right;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;
		}
			
		div.pp_pic_holder .pp_content a.pp_previous {
			display: block; float: left;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;
		}
		
		div.pp_pic_holder .pp_content a.pp_expand,
		div.pp_pic_holder .pp_content a.pp_contract {
			position: absolute; z-index: 20000;
			top: 10px; right: 30px;
			cursor: pointer;
			display: none;
			text-indent: -10000px;
			width: 20px; height: 20px;	
		}
			
		div.pp_pic_holder .pp_content a.pp_close {
			float: right;
			display: block;
			text-indent: -10000px;
		}
		
		div.pp_pic_holder .pp_bottom {
			position: relative;
			height: 20px;
		}
			* html div.pp_pic_holder .pp_bottom { padding: 0 20px; }
			
			div.pp_pic_holder .pp_bottom .pp_left {
				position: absolute;
				left: 0;
				width: 20px; height: 20px;
			}
			div.pp_pic_holder .pp_bottom .pp_middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 20px;
			}
				* html div.pp_pic_holder .pp_bottom .pp_middle { position: static; left: 0; }
				
			div.pp_pic_holder .pp_bottom .pp_right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 20px; height: 20px;
			}
		
		div.pp_pic_holder .pp_loaderIcon {
			display: none;
			position: absolute;
			top: 50%; left: 50%;
			margin: -12px 0 0 -12px;
			width: 24px; height: 24px;
		}
		
		div.pp_pic_holder #pp_full_res { display: block; margin: 0 auto; width: 100%; text-align: center; }
		div.pp_pic_holder #pp_full_res object,
		div.pp_pic_holder #pp_full_res embed { visibility: hidden; }
	
		div.ppt {
			display: none;
			position: absolute;
			top: 0; left: 0;
			z-index: 9999;
			color: #fff;
			font-size: 17px;
		}

/* ------------------------------------------------------------------------
	Miscellaneous
------------------------------------------------------------------------- */

	.clearfix:after {
	    content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
	}

	.clearfix {display: inline-block;}

	/* Hides from IE-mac \*/
	* html .clearfix {height: 1%;}
	.clearfix {display: block;}
	/* End hide from IE-mac */