/********** CONTENTS **********/
/** 01. RESET **/
/** 02. GENERAL **/
/** 03. TEXT STYLES **/
/** 04. HEADER **/
/** 05. MAIN **/
/** 06. TWITTER **/
/** 07. CONTACT **/
/** 08. BUTTONS & ICONS **/


/***** 01. RESET *****/
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, blockquote {
	margin: 0; padding: 0; border: 0;
}

/***** 02. GENERAL *****/
	body {
		background: #cdcbc6 url(images/bg_glow.png) repeat-y center top;
		font-family: Arial, Helvetica, sans-serif;
	}
	
	#header, #main, #footer {
		margin: 0 auto;
		width: 960px;
		overflow: hidden;
	}
	
	#footer {
		margin-bottom: 100px;
	}
	
	.box435 { /**Half width**/
	width: 435px;
	float: right;
	margin-top: 0;
	margin-right: 30px;
	margin-bottom: 30px;
	margin-left: 0;
	}
	
	.box900 { /**Full width**/
	width: 435px;
	float: left;
	margin-top: 0;
	margin-right: 30px;
	margin-bottom: 30px;
	margin-left: 0;
	}
	
	.box280 { /**One third for footer**/
		width: 240px;
		float: left;
		margin: 0 30px 30px 0;
		background: url("images/1px_light.png") repeat-x #f1efec;
		padding: 20px;
		border-style: solid;
		border-width: 1px;
		border-color: #cdcbc8 #cdcbc8 #b2b2b2 #cdcbc8;
		min-height: 370px;
	}
	
	.box590 { /**Combined with .box280 creates main content area and sidebar**/
		width: 590px;
		float: left;
		margin: 0 30px 30px 0;
	}

	.float_left {
		float: left;
	}
	
	.float_right {
		float: right;
	}
	
	img.float_left {
		margin: 0 10px 5px 0;
	}
	
	img.float_right {
		margin: 0 0 5px 10px;
	}
				
/***** 03. TEXT STYLES *****/				
	a {
		color: #c43c00;
		text-decoration: none;
		outline: none;
	}
	
	a:hover {
		color: #df784a;
	}
	
	p {
		color: #666;
		font-size: 12px;
		line-height: 18px;
	}
	
	h1 {
		color: #555;
		font-size: 40px;
		margin: 0 0 30px 0;
		font-weight: bold;
	}
	
	h2 {
		color: #555;
		font-size: 22px;
		margin: 0 0 10px 0;
	}
	
	h3 {
		color: #888;
		font-size: 16px;
		line-height: 28px;
		font-style: oblique;
		margin-bottom: 10px;
	}
	
	ul.list {
		color: #666;
		font-size: 12px;
		line-height: 18px;
		margin: 20px 0 20px 0;
		list-style-position: inside;
	}
	
		ul.list ul {
			margin: 0;
			padding: 3px 0 3px 25px;
		}

	ol.list {
		color: #666;
		font-size: 12px;
		line-height: 18px;
		margin: 20px 0 20px 0;
		list-style-position: inside;
	}	
	
		ol.list ol {
			margin: 0;
			padding: 3px 0 3px 25px;
		}

				
/***** 04. HEADER *****/
	#header {
		height: 110px;
		padding: 30px 0;
		background: url(images/divide.png) no-repeat bottom center;
	}
	
	.logo {
	float: left;
	background: url(images/logo.png) no-repeat;
	width: 900px;
	height: 111px;
	text-indent: -9999px;
	}
	
	ul.social_icons {
		list-style: none;
		float: right;
		margin-right: 60px;
		margin-top: 37px;
	}
	
		ul.social_icons li a {
			float: right;
			margin: 0 0 0 8px;
			height: 24px;
			width: 24px;
			text-indent: -9999px;
			opacity: 0.70;
		}
		
		ul.social_icons li {
			display: inline;
		}
		
		ul.social_icons li a:hover {
			opacity: 1;
		}
	
/***** 05. MAIN *****/
	#main {
		margin-top: 20px;
	}
	
	#tag {
		text-align: center;
	}
	
	#showcase {
		margin: 0 0 20px 0;
	}
	
		.imac {
			background: url(images/imac.png) no-repeat;
			height: 414px;
		}
			
			.imac#showcase ul {
				list-style: none;
				position: relative;
				top: 23px;
				left: 22px;
				width: 376px;
				height: 233px;
				overflow: hidden;
			}
			
		.macbook {
			background: url(images/macbook.png) no-repeat;
			height: 238px;
		}
			
			.macbook#showcase ul {
				list-style: none;
				position: relative;
				top: 15px;
				left: 63px;
				width: 303px;
				height: 188px;
				overflow: hidden;
			}

/***** 06. TWITTER *****/
	#twitter_update_list {
		font-size: 12px;
		color: #666;
	}
	
		#twitter_update_list li {
			list-style: none;
			margin-bottom: 20px;
		}

/***** 07. CONTACT *****/
.notification_error {
	font-size: 12px;
	line-height: 20px;
	padding: 10px 0 15px 70px;
	background: url(images/icons/icon_mail_no.png) no-repeat 0 50%;
	color: #a1272c;
}

.notification_ok {
	font-size: 12px;
	line-height: 20px;
	padding: 10px 0 15px 70px;
	background: url(images/icons/icon_mail_yes.png) no-repeat 0 50%;
	color: #518f2c;
}

.info_fieldset {
	margin: 0;
	padding: 0;
}

/***Contact form label text***/
.label {
	width: 80px;
	float: left;
	text-align: left;
	font-size: 14px;
	color: #666;
}

/***Input & Textarea styles***/
input[type=text], textarea {
	margin: 5px 0 10px 0;
	padding: 3px;
	float: left;
	background: url(images/form_grad.png) repeat-x #fbfafa;
	color: #999;
	border: 1px solid #d3d3d2;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	font: 14px arial;
}

/***Input & Textarea styles on hover***/
input[type=text]:hover, textarea:hover {
	border-color: #bbb;
}

/***Input & Textarea styles on input***/
input[type=text]:focus, textarea:focus {
	border-color: #de6e00;
	-webkit-box-shadow: #ffc039 0 0 5px;
	-moz-box-shadow: #ffc039 0 0 5px;
	-o-box-shadow: #ffc039 0 0 5px;
	box-shadow: #ffc039 0 0 5px;
}
	
br { clear: left; }
	
/***** 08. BUTTONS & ICONS *****/
/***Orange Button***/
	.button {
		cursor: pointer;
		color: #fff;
		text-shadow: #de6e00 0 -1px 0;
		font-weight: bold;
		font-family: Arial, Helvetica, sans-serif;
		border: 1px solid #ff920d;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		border-radius: 5px;
		-webkit-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		-moz-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		-o-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		background: #ff920d;
		background: -webkit-gradient(linear, left top, left bottom, from(#ffc039), to(#ff920d));
		background: -moz-linear-gradient(top, #ffc039, #ff920d);
		background: -o-linear-gradient(top, #ffc039, #ff920d);
		background: linear-gradient(top, #ffc039, #ff920d);
		margin: 5px 10px 10px 0;
		padding: 3px 10px;
		font-size: 14px;
	}
	
	.button:hover, .button:focus {
		color: #fff;
		text-shadow: #de6e00 0 -1px 0;
		font-weight: bold;
		font-family: Arial, Helvetica, sans-serif;
		border-color: #de6e00;
		-webkit-box-shadow: #ffc039 0 0 5px;
		-moz-box-shadow: #ffc039 0 0 5px;
		-o-box-shadow: #ffc039 0 0 5px;
		box-shadow: #ffc039 0 0 5px;
	}
	
	.button:active {
		background: #de6e00;
		background: -webkit-gradient(linear, left top, left bottom, from(#ff920d), to(#de6e00));
		background: -moz-linear-gradient(top, #ff920d, #de6e00);
		background: -o-linear-gradient(top, #ff920d, #de6e00);
		background: linear-gradient(top, #ff920d, #de6e00);
	}

/***Black Button***/
.button_bl {
		cursor: pointer;
		color: #fff;
		text-shadow: #000 0 -1px 0;
		font-weight: bold;
		font-family: Arial, Helvetica, sans-serif;
		border: 1px solid #111;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		border-radius: 5px;
		-webkit-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		-moz-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		-o-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		background: #111;
		background: -webkit-gradient(linear, left top, left bottom, from(#333), to(#111));
		background: -moz-linear-gradient(top, #333, #111);
		background: -o-linear-gradient(top, #333, #111);
		background: linear-gradient(top, #333, #111);
		margin: 5px 10px 10px 0;
		padding: 3px 10px;
		font-size: 14px;
	}
	
	.button_bl:hover, .button_bl:focus {
		color: #fff;
		text-shadow: #000 0 -1px 0;
		font-weight: bold;
		font-family: Arial, Helvetica, sans-serif;
		border-color: #000;
		-webkit-box-shadow: #666 0 0 5px;
		-moz-box-shadow: #666 0 0 5px;
		-o-box-shadow: #666 0 0 5px;
		box-shadow: #666 0 0 5px;
	}
	
	.button_bl:active {
		background: #000;
		background: -webkit-gradient(linear, left top, left bottom, from(#222), to(#000));
		background: -moz-linear-gradient(top, #222, #000);
		background: -o-linear-gradient(top, #222, #000);
		background: linear-gradient(top, #222, #000);
	}
	
/***White Button***/
.button_wh {
		cursor: pointer;
		color: #333;
		text-shadow: #fff 0 1px 0;
		font-weight: bold;
		font-family: Arial, Helvetica, sans-serif;
		border: 1px solid #ddd;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-o-border-radius: 5px;
		border-radius: 5px;
		-webkit-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		-moz-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		-o-box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		box-shadow: rgba(0, 0, 0, .25) 0 1px 1px;
		background: #ddd;
		background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ddd));
		background: -moz-linear-gradient(top, #f9f9f9, #ddd);
		background: -o-linear-gradient(top, #f9f9f9, #ddd);
		background: linear-gradient(top, #f9f9f9, #ddd);
		margin: 5px 10px 10px 0;
		padding: 3px 10px;
		font-size: 14px;
	}
	
	.button_wh:hover, .button_wh:focus {
		color: #333;
		text-shadow: #fff 0 1px 0;
		font-weight: bold;
		font-family: Arial, Helvetica, sans-serif;
		border-color: #ccc;
		-webkit-box-shadow: #ccc 0 0 5px;
		-moz-box-shadow: #ccc 0 0 5px;
		-o-box-shadow: #ccc 0 0 5px;
		box-shadow: #ccc 0 0 5px;
	}
	
	.button_wh:active {
		background: #ccc;
		background: -webkit-gradient(linear, left top, left bottom, from(#e9e9e9), to(#ccc));
		background: -moz-linear-gradient(top, #e9e9e9, #ccc);
		background: -o-linear-gradient(top, #e9e9e9, #ccc);
		background: linear-gradient(top, #e9e9e9, #ccc);
	}
		
/***Social Media Icons***/
	.facebook24 {
		background: url(images/icons/icon_facebook_24.png) no-repeat left;
	}
	
	.flickr24 {
		background: url(images/icons/icon_flickr_24.png) no-repeat left;
	}
	
	.linkedin24 {
		background: url(images/icons/icon_linkedin_24.png) no-repeat left;
	}	
	
	.rss24 {
		background: url(images/icons/icon_rss_24.png) no-repeat left;
	}
	
	.skype24 {
		background: url(images/icons/icon_skype_24.png) no-repeat left;
	}
	
	.twitter24 {
		background: url(images/icons/icon_twitter_24.png) no-repeat left;
	}	
	
/***Header Icons***/
	.icon_about {
		background: url(images/icons/icon_comments.png) no-repeat 0 30%;
		padding: 7px 0 0 70px;
	}
	
	.icon_twitter {
		background: url(images/icons/icon_twitter.png) no-repeat 0 30%;
		padding: 7px 0 0 70px;
	}
	
	.icon_contact {
		background: url(images/icons/icon_mail.png) no-repeat 0 30%;
		padding: 7px 0 0 70px;
	}
