sampleCSS

body {
	min-width:960px
}
.container_12, .container_16 {
	margin-left:auto;
	margin-right:auto;
	width:960px
}
.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12, .grid_13, .grid_14, .grid_15, .grid_16 {
	display:inline;
	float:left;
	margin-left:10px;
	margin-right:10px
}
.push_1, .pull_1, .push_2, .pull_2, .push_3, .pull_3, .push_4, .pull_4, .push_5, .pull_5, .push_6, .pull_6, .push_7, .pull_7, .push_8, .pull_8, .push_9, .pull_9, .push_10, .pull_10, .push_11, .pull_11, .push_12, .pull_12, .push_13, .pull_13, .push_14, .pull_14, .push_15, .pull_15 {
	position:relative
}
.container_12 .grid_3, .container_16 .grid_4 {
	width:220px
}
.container_12 .grid_6, .container_16 .grid_8 {
	width:460px
}
.container_12 .grid_9, .container_16 .grid_12 {
	width:700px
}
.container_12 .grid_12, .container_16 .grid_16 {
	width:940px
}
.alpha {
	margin-left:0
}
.omega {
	margin-right:0
}
.container_12 .grid_1 {
	width:60px
}
.container_12 .grid_2 {
	width:140px
}
.container_12 .grid_4 {
	width:300px
}
.container_12 .grid_5 {
	width:380px
}
.container_12 .grid_7 {
	width:540px
}
.container_12 .grid_8 {
	width:620px
}
.container_12 .grid_10 {
	width:780px
}
.container_12 .grid_11 {
	width:860px
}
.container_16 .grid_1 {
	width:40px
}
.container_16 .grid_2 {
	width:100px
}
.container_16 .grid_3 {
	width:160px
}
.container_16 .grid_5 {
	width:280px
}
.container_16 .grid_6 {
	width:340px
}
.container_16 .grid_7 {
	width:400px
}
.container_16 .grid_9 {
	width:520px
}
.container_16 .grid_10 {
	width:580px
}
.container_16 .grid_11 {
	width:640px
}
.container_16 .grid_13 {
	width:760px
}
.container_16 .grid_14 {
	width:820px
}
.container_16 .grid_15 {
	width:880px
}
.container_12 .prefix_3, .container_16 .prefix_4 {
	padding-left:240px
}
.container_12 .prefix_6, .container_16 .prefix_8 {
	padding-left:480px
}
.container_12 .prefix_9, .container_16 .prefix_12 {
	padding-left:720px
}
.container_12 .prefix_1 {
	padding-left:80px
}
.container_12 .prefix_2 {
	padding-left:160px
}
.container_12 .prefix_4 {
	padding-left:320px
}
.container_12 .prefix_5 {
	padding-left:400px
}
.container_12 .prefix_7 {
	padding-left:560px
}
.container_12 .prefix_8 {
	padding-left:640px
}
.container_12 .prefix_10 {
	padding-left:800px
}
.container_12 .prefix_11 {
	padding-left:880px
}
.container_16 .prefix_1 {
	padding-left:60px
}
.container_16 .prefix_2 {
	padding-left:120px
}
.container_16 .prefix_3 {
	padding-left:180px
}
.container_16 .prefix_5 {
	padding-left:300px
}
.container_16 .prefix_6 {
	padding-left:360px
}
.container_16 .prefix_7 {
	padding-left:420px
}
.container_16 .prefix_9 {
	padding-left:540px
}
.container_16 .prefix_10 {
	padding-left:600px
}
.container_16 .prefix_11 {
	padding-left:660px
}
.container_16 .prefix_13 {
	padding-left:780px
}
.container_16 .prefix_14 {
	padding-left:840px
}
.container_16 .prefix_15 {
	padding-left:900px
}
.container_12 .suffix_3, .container_16 .suffix_4 {
	padding-right:240px
}
.container_12 .suffix_6, .container_16 .suffix_8 {
	padding-right:480px
}
.container_12 .suffix_9, .container_16 .suffix_12 {
	padding-right:720px
}
.container_12 .suffix_1 {
	padding-right:80px
}
.container_12 .suffix_2 {
	padding-right:160px
}
.container_12 .suffix_4 {
	padding-right:320px
}
.container_12 .suffix_5 {
	padding-right:400px
}
.container_12 .suffix_7 {
	padding-right:560px
}
.container_12 .suffix_8 {
	padding-right:640px
}
.container_12 .suffix_10 {
	padding-right:800px
}
.container_12 .suffix_11 {
	padding-right:880px
}
.container_16 .suffix_1 {
	padding-right:60px
}
.container_16 .suffix_2 {
	padding-right:120px
}
.container_16 .suffix_3 {
	padding-right:180px
}
.container_16 .suffix_5 {
	padding-right:300px
}
.container_16 .suffix_6 {
	padding-right:360px
}
.container_16 .suffix_7 {
	padding-right:420px
}
.container_16 .suffix_9 {
	padding-right:540px
}
.container_16 .suffix_10 {
	padding-right:600px
}
.container_16 .suffix_11 {
	padding-right:660px
}
.container_16 .suffix_13 {
	padding-right:780px
}
.container_16 .suffix_14 {
	padding-right:840px
}
.container_16 .suffix_15 {
	padding-right:900px
}
.container_12 .push_3, .container_16 .push_4 {
	left:240px
}
.container_12 .push_6, .container_16 .push_8 {
	left:480px
}
.container_12 .push_9, .container_16 .push_12 {
	left:720px
}
.container_12 .push_1 {
	left:80px
}
.container_12 .push_2 {
	left:160px
}
.container_12 .push_4 {
	left:320px
}
.container_12 .push_5 {
	left:400px
}
.container_12 .push_7 {
	left:560px
}
.container_12 .push_8 {
	left:640px
}
.container_12 .push_10 {
	left:800px
}
.container_12 .push_11 {
	left:880px
}
.container_16 .push_1 {
	left:60px
}
.container_16 .push_2 {
	left:120px
}
.container_16 .push_3 {
	left:180px
}
.container_16 .push_5 {
	left:300px
}
.container_16 .push_6 {
	left:360px
}
.container_16 .push_7 {
	left:420px
}
.container_16 .push_9 {
	left:540px
}
.container_16 .push_10 {
	left:600px
}
.container_16 .push_11 {
	left:660px
}
.container_16 .push_13 {
	left:780px
}
.container_16 .push_14 {
	left:840px
}
.container_16 .push_15 {
	left:900px
}
.container_12 .pull_3, .container_16 .pull_4 {
	left:-240px
}
.container_12 .pull_6, .container_16 .pull_8 {
	left:-480px
}
.container_12 .pull_9, .container_16 .pull_12 {
	left:-720px
}
.container_12 .pull_1 {
	left:-80px
}
.container_12 .pull_2 {
	left:-160px
}
.container_12 .pull_4 {
	left:-320px
}
.container_12 .pull_5 {
	left:-400px
}
.container_12 .pull_7 {
	left:-560px
}
.container_12 .pull_8 {
	left:-640px
}
.container_12 .pull_10 {
	left:-800px
}
.container_12 .pull_11 {
	left:-880px
}
.container_16 .pull_1 {
	left:-60px
}
.container_16 .pull_2 {
	left:-120px
}
.container_16 .pull_3 {
	left:-180px
}
.container_16 .pull_5 {
	left:-300px
}
.container_16 .pull_6 {
	left:-360px
}
.container_16 .pull_7 {
	left:-420px
}
.container_16 .pull_9 {
	left:-540px
}
.container_16 .pull_10 {
	left:-600px
}
.container_16 .pull_11 {
	left:-660px
}
.container_16 .pull_13 {
	left:-780px
}
.container_16 .pull_14 {
	left:-840px
}
.container_16 .pull_15 {
	left:-900px
}
.clear {
	clear:both;
	display:block;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0
}
.clearfix:before, .clearfix:after {
	content:'\0020';
	display:block;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0
}
.clearfix:after {
	clear:both
}
.clearfix {
	zoom:1
}



html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent
}
body {
	line-height:1
}
ol, ul {
	list-style:none
}
blockquote, q {
	quotes:none
}
blockquote:before, blockquote:after, q:before, q:after {
	content:'';
	content:none
}
:focus {
	outline:0
}
ins {
	text-decoration:none
}
del {
	text-decoration:line-through
}
table {
	border-collapse:collapse;
	border-spacing:0
}



body {
	color: #1d1d1d;
	background: #fff url(../images/bg.png) repeat-x top center;
	font-size: 12px;
	font-family: Arial;
}
a {
	color: #0cb0ca;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.header_container {
	height: 100px;
	overflow: hidden;
}
.header_container .grid_5 {
	padding: 36px 0 0 0;
}
.header_container .grid_5 a {
	display: block;
	text-indent: -9999px;
	height: 61px;
	width: 280px;
	background: url(../images/logo.png) no-repeat;
	float: left;
}
.header_container .grid_7 .menu_items {
	float: right;
}
.header_container .grid_7 a {
	display: block;
	text-indent: -9999px;
	height: 100px;
	background: url(../images/menu_items.png) no-repeat;
	float: left;
	margin: 0 40px 0 0;
}
.header_container .grid_7 a.home {
	width: 62px;
}
.header_container .grid_7 a.home:hover,  .header_container .grid_7 a.home.active {
	background-position: 0px -100px;
}
.header_container .grid_7 a.portfolio {
	width: 94px;
	background-position: -100px 0px;
}
.header_container .grid_7 a.portfolio:hover,  .header_container .grid_7 a.portfolio.active {
	background-position: -100px -100px;
}
.header_container .grid_7 a.about {
	width: 75px;
	background-position: -240px 0px;
}
.header_container .grid_7 a.about:hover,  .header_container .grid_7 a.about.active {
	background-position: -240px -100px;
}
.header_container .grid_7 a.contact {
	width: 94px;
	background-position: -355px 0px;
}
.header_container .grid_7 a.contact:hover,  .header_container .grid_7 a.contact.active {
	background-position: -355px -100px;
}
.featured_container {
	height: 454px;
	overflow: hidden;
	color: #fff;
	font-size: 14px;
}
.featured_container .container_12 {
	background: url(../images/featured_bg.png) no-repeat top center;
	height: 454px;
}
.featured_container .container_12 .grid_12 .current_project {
	width: 470px;
	height: 300px;
	overflow: hidden;
	padding: 78px 0 0 0;
}
.featured_container .container_12 .grid_12 .current_project h2 {
	font-family: Georgia;
	font-size: 30px;
	font-weight: normal;
	line-height: 24px;
}
.featured_container .container_12 .grid_12 .current_project p {
	line-height: 24px;
	width: 450px;
	margin: 0 0 50px 0;
}
.featured_container .container_12 .grid_12 .current_project a {
	color: #1d1d1d;
	float: left;
	width: 150px;
	height: 38px;
	text-align: center;
	font-weight: bold;
	line-height: 38px;
	border: 5px solid #a3a4a4;
	background: #fff;
	margin: 0 10px 0 0;
	-moz-border-radius: 14px;
	border-radius: 14px;
	text-shadow: 1px 1px 0px #ffffff;
	filter: dropshadow(color=#ffffff, offx=0, offy=1);
	background: -moz-linear-gradient(top, #FFFFFF 0%, #DCDCDC 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(100%, #DCDCDC)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#DCDCDC', GradientType=0 ); /* ie */
}
.featured_container .container_12 .grid_12 .current_project a:hover {
	background: -moz-linear-gradient(top, #DCDCDC 0%, #FFFFFF 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #DCDCDC), color-stop(100%, #FFFFFF)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DCDCDC', endColorstr='#FFFFFF', GradientType=0 ); /* ie */
}
.featured_container .container_12 .grid_8 p {
	font-size: 12px;
	height: 76px;
	margin: 0;
	padding: 10px 0 0 30px;
	line-height: 24px;
}
.featured_container .container_12 .grid_8 p span.name {
	font-style: italic;
	color: #0cb0ca;
}
.featured_container .container_12 .grid_4 a {
	color: #1d1d1d;
	float: right;
	width: 235px;
	height: 40px;
	text-align: center;
	line-height: 40px;
	border: 4px solid #141a20;
	background: #fff;
	margin: 15px 0 0 0;
	-moz-border-radius: 12px;
	border-radius: 14px;
	text-shadow: 1px 1px 0px #ffffff;
	filter: dropshadow(color=#ffffff, offx=0, offy=1);
	background: -moz-linear-gradient(top, #FFFFFF 0%, #DCDCDC 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(100%, #DCDCDC)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#DCDCDC', GradientType=0 ); /* ie */
}
.featured_container .container_12 .grid_4 a:hover {
	background: -moz-linear-gradient(top, #DCDCDC 0%, #FFFFFF 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #DCDCDC), color-stop(100%, #FFFFFF)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DCDCDC', endColorstr='#FFFFFF', GradientType=0 ); /* ie */
}
.content_container {
	line-height: 24px;
	padding: 38px 0 60px 0;
}
.content_container .grid_4 h2 {
	font-family: Georgia;
	font-size: 24px;
	line-height: 18px;
	font-weight: normal;
}
.content_container .grid_4 h2 img {
	float: left;
	margin: -8px 15px 0 0;
}
.content_container .grid_4 h2 span {
	font-family: Verdana;
	font-size: 14px;
}
.content_container .grid_4 p {
	text-align: justify;
	margin: 0 0 42px 0;
}
.content_container .grid_4 ul {
	float: left;
}
.content_container .grid_4 ul li {
	list-style-type: none;
	margin: 0 40px 0 0;
}
.content_container .grid_4 ul li:before {
	content: "- ";
}
.content_container .grid_4 .social_icons a {
	display: block;
	text-decoration: none;
	line-height: 26px;
	height: 26px;
	width: 150px;
	float: left;
	margin: 0 0 35px 0;
}
.content_container .grid_4 .social_icons a:hover {
	text-decoration: underline;
}
.content_container .grid_4 .social_icons a img {
	float: left;
	margin: 0 25px 0 0;
}
.footer_container {
	background: #000 url(../images/footer_bg.png) repeat-x top center;
	height: 234px;
	width: 100%;
	display: block;
	overflow: hidden;
	color: #fff;
}
.footer_container .container_12 {
	padding: 20px 0 0 0;
}
.footer_container .container_12 .grid_4 h3 {
	font-family: Georgia;
	font-size: 18px;
	line-height: 12px;
	font-weight: normal;
}
.footer_container .container_12 .grid_4 ul li {
	list-style-type: none;
	margin: 0 0 0 35px;
	padding: 0 30px 0 0;
	height: 29px;
	line-height: 29px;
	border-bottom: 1px solid #47535d;
}
.footer_container .container_12 .contact_details p {
	margin: 0 0 15px 0;
}
.footer_container .container_12 .contact_details a {
	display: block;
	clear: both;
	height: 28px;
	line-height: 28px;
	font-style: italic;
}
.footer_container .container_12 .contact_details a img {
	float: left;
	margin: 0 10px 12px 0;
}
.footer_container .container_12.copyright {
	padding: 0;
}
.footer_container .container_12 .grid_12 {
	text-align: center;
	font-size: 11px;
	line-height: 40px;
	height: 40px;
}



body {
	font:13px/1.5 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif
}
a:focus {
	outline:1px dotted
}
hr {
	border:0 #ccc solid;
	border-top-width:1px;
	clear:both;
	height:0
}
h1 {
	font-size:25px
}
h2 {
	font-size:23px
}
h3 {
	font-size:21px
}
h4 {
	font-size:19px
}
h5 {
	font-size:17px
}
h6 {
	font-size:15px
}
ol {
	list-style:decimal
}
ul {
	list-style:disc
}
li {
	margin-left:30px
}
p, dl, hr, h1, h2, h3, h4, h5, h6, ol, ul, pre, table, address, fieldset {
	margin-bottom:20px
}



body {
	color: #1d1d1d;
	background: #fff url(../images/bg.png) repeat-x top center;
	font-size: 12px;
	font-family: Arial;
}
a {
	color: #0cb0ca;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.header_container {
	height: 100px;
	overflow: hidden;
}
.header_container .grid_5 {
	padding: 36px 0 0 0;
}
.header_container .grid_5 a {
	display: block;
	text-indent: -9999px;
	height: 61px;
	width: 280px;
	background: url(../images/logo.png) no-repeat;
	float: left;
}
.header_container .grid_7 .menu_items {
	float: right;
}
.header_container .grid_7 a {
	display: block;
	text-indent: -9999px;
	height: 100px;
	background: url(../images/menu_items.png) no-repeat;
	float: left;
	margin: 0 40px 0 0;
}
.header_container .grid_7 a.home {
	width: 62px;
}
.header_container .grid_7 a.home:hover,  .header_container .grid_7 a.home.active {
	background-position: 0px -100px;
}
.header_container .grid_7 a.portfolio {
	width: 94px;
	background-position: -100px 0px;
}
.header_container .grid_7 a.portfolio:hover,  .header_container .grid_7 a.portfolio.active {
	background-position: -100px -100px;
}
.header_container .grid_7 a.about {
	width: 75px;
	background-position: -240px 0px;
}
.header_container .grid_7 a.about:hover,  .header_container .grid_7 a.about.active {
	background-position: -240px -100px;
}
.header_container .grid_7 a.contact {
	width: 94px;
	background-position: -355px 0px;
}
.header_container .grid_7 a.contact:hover,  .header_container .grid_7 a.contact.active {
	background-position: -355px -100px;
}
.featured_container {
	height: 454px;
	overflow: hidden;
	color: #fff;
	font-size: 14px;
}
.featured_container .container_12 {
	background: url(../images/featured_bg.png) no-repeat top center;
	height: 454px;
}
.featured_container .container_12 .grid_12 .current_project {
	width: 470px;
	height: 300px;
	overflow: hidden;
	padding: 78px 0 0 0;
}
.featured_container .container_12 .grid_12 .current_project h2 {
	font-family: Georgia;
	font-size: 30px;
	font-weight: normal;
	line-height: 24px;
}
.featured_container .container_12 .grid_12 .current_project p {
	line-height: 24px;
	width: 450px;
	margin: 0 0 50px 0;
}
.featured_container .container_12 .grid_12 .current_project a {
	color: #1d1d1d;
	float: left;
	width: 150px;
	height: 38px;
	text-align: center;
	font-weight: bold;
	line-height: 38px;
	border: 5px solid #a3a4a4;
	background: #fff;
	margin: 0 10px 0 0;
	-moz-border-radius: 14px;
	border-radius: 14px;
	text-shadow: 1px 1px 0px #ffffff;
	filter: dropshadow(color=#ffffff, offx=0, offy=1);
	background: -moz-linear-gradient(top, #FFFFFF 0%, #DCDCDC 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(100%, #DCDCDC)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#DCDCDC', GradientType=0 ); /* ie */
}
.featured_container .container_12 .grid_12 .current_project a:hover {
	background: -moz-linear-gradient(top, #DCDCDC 0%, #FFFFFF 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #DCDCDC), color-stop(100%, #FFFFFF)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DCDCDC', endColorstr='#FFFFFF', GradientType=0 ); /* ie */
}
.featured_container .container_12 .grid_8 p {
	font-size: 12px;
	height: 76px;
	margin: 0;
	padding: 10px 0 0 30px;
	line-height: 24px;
}
.featured_container .container_12 .grid_8 p span.name {
	font-style: italic;
	color: #0cb0ca;
}
.featured_container .container_12 .grid_4 a {
	color: #1d1d1d;
	float: right;
	width: 235px;
	height: 40px;
	text-align: center;
	line-height: 40px;
	border: 4px solid #141a20;
	background: #fff;
	margin: 15px 0 0 0;
	-moz-border-radius: 12px;
	border-radius: 14px;
	text-shadow: 1px 1px 0px #ffffff;
	filter: dropshadow(color=#ffffff, offx=0, offy=1);
	background: -moz-linear-gradient(top, #FFFFFF 0%, #DCDCDC 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(100%, #DCDCDC)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#DCDCDC', GradientType=0 ); /* ie */
}
.featured_container .container_12 .grid_4 a:hover {
	background: -moz-linear-gradient(top, #DCDCDC 0%, #FFFFFF 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #DCDCDC), color-stop(100%, #FFFFFF)); /* webkit */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DCDCDC', endColorstr='#FFFFFF', GradientType=0 ); /* ie */
}
.content_container {
	line-height: 24px;
	padding: 38px 0 60px 0;
}
.content_container .grid_4 h2 {
	font-family: Georgia;
	font-size: 24px;
	line-height: 18px;
	font-weight: normal;
}
.content_container .grid_4 h2 img {
	float: left;
	margin: -8px 15px 0 0;
}
.content_container .grid_4 h2 span {
	font-family: Verdana;
	font-size: 14px;
}
.content_container .grid_4 p {
	text-align: justify;
	margin: 0 0 42px 0;
}
.content_container .grid_4 ul {
	float: left;
}
.content_container .grid_4 ul li {
	list-style-type: none;
	margin: 0 40px 0 0;
}
.content_container .grid_4 ul li:before {
	content: "- ";
}
.content_container .grid_4 .social_icons a {
	display: block;
	text-decoration: none;
	line-height: 26px;
	height: 26px;
	width: 150px;
	float: left;
	margin: 0 0 35px 0;
}
.content_container .grid_4 .social_icons a:hover {
	text-decoration: underline;
}
.content_container .grid_4 .social_icons a img {
	float: left;
	margin: 0 25px 0 0;
}
.footer_container {
	background: #000 url(../images/footer_bg.png) repeat-x top center;
	height: 234px;
	width: 100%;
	display: block;
	overflow: hidden;
	color: #fff;
}