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


/*----------Generic----------*/
* { margin : 0;}
* { padding: 0;}

a {outline: none;}

body {background-color:#333333; width:100%; display:table; background-image:url(../images/bg.jpg); background-attachment:scroll; background-repeat:repeat-x; background-position:top center}

	.copy a:link {text-decoration: underline; color:#404040}
 	.copy a:visited {text-decoration: underline; color:#404040}
 	.copy a:active {text-decoration: underline; color:#404040}
 	.copy a:hover {text-decoration: none; color:#404040}
	
	.copy_w a:link {text-decoration:none; border-bottom:1px dotted; color:#FFFFFF}
 	.copy_w a:visited {text-decoration:none; border-bottom:1px dotted; color:#FFFFFF}
 	.copy_w a:active {text-decoration:none; border-bottom:1px dotted; color:#FFFFFF}
 	.copy_w a:hover {text-decoration:none; border-bottom:0px; color:#FFFFFF}


/*----------Main Wrapper----------*/
#main_wrapper {width:984px; height:1440px; margin:0 auto; top:0px; position:relative}
#work_wrapper {width:984px; height:1667px; margin:0 auto; top:0px; position:relative}
#service_wrapper {width:984px; height:1440px; margin:0 auto; top:0px; position:relative}


/*----------Header----------*/
#header {position:absolute; width:1024px; height:144px}

#shine {position:absolute; width:471px; height:144px; top:0px; left:-132px; background:url(../images/logo_shine.jpg)}

#logo {position:absolute; left:14px; top:41px; width:177px; height:59px; background-image:url(../images/logo.jpg); background-repeat:no-repeat}

#nav_wrapper {z-index:3; position:absolute; height:144px; bottom:0px; width:600px; left:352px}

#home {position:absolute; top:0px; left:0px; background:url(../images/home_up.jpg) no-repeat; height:92px; width:96px}
#home a {display:block; height:92px; width:96px; text-indent:-999em}
#home a:hover {background:url(../images/home_over.jpg) no-repeat}

#work {position:absolute; top:0px; left:108px; background:url(../images/work_up.jpg) no-repeat; height:92px; width:120px}
#work a {display:block; height:92px; width:120px; text-indent:-999em}
#work a:hover {background:url(../images/work_over.jpg) no-repeat}

#services {position:absolute; top:0px; left:240px; background:url(../images/services_up.jpg) no-repeat; height:92px; width:145px}
#services a {display:block; height:92px; width:145px; text-indent:-999em}
#services a:hover {background:url(../images/services_over.jpg) no-repeat}

#blog {position:absolute; top:0px; left:397px; background:url(../images/blog_up.jpg) no-repeat; height:92px; width:112px}
#blog a {display:block; height:92px; width:112px; text-indent:-999em}
#blog a:hover {background:url(../images/blog_over.jpg) no-repeat}

#contact {position:absolute; top:0px; left:521px; background:url(../images/contact_up.jpg) no-repeat; height:92px; width:108px}
#contact a {display:block; height:92px; width:108px; text-indent:-999em}
#contact a:hover {background:url(../images/contact_over.jpg) no-repeat}

#divider_1 {position:absolute; height:144px; width:12px; left:96px; top:0px; background-image:url(../images/nav_div.jpg); background-repeat:no-repeat}
#divider_2 {position:absolute; height:144px; width:12px; left:228px; top:0px; background-image:url(../images/nav_div.jpg); background-repeat:no-repeat}
#divider_3 {position:absolute; height:144px; width:12px; left:385px; top:0px; background-image:url(../images/nav_div.jpg); background-repeat:no-repeat}
#divider_4 {position:absolute; height:144px; width:12px; left:509px; top:0px; background-image:url(../images/nav_div.jpg); background-repeat:no-repeat}


/*----------Content----------*/
h1 {font-family:Helvetica, Arial, sans-serif; font-size:35px; color:#404040; font-weight:lighter; line-height:44px}
h2 {font-family:Helvetica, Arial, sans-serif; font-size:26px; color:#404040; font-weight:lighter}
h3 {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#404040; line-height:16px}

.copy {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#404040; line-height:15px}
.copy_w {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; line-height:28px}
.hide {text-indent:-999em}
.small {font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#999999; line-height:15px}

#freelance_head {position:absolute; top:174px; width:799px; height:138px; left:14px; background-image:url(../images/freelance_web.jpg); text-indent:-999em}

#intro {position:absolute; top:312px; width:797px; left:16px; padding-top:20px}

#me {position:absolute; width:167px; height:276px; left:813px; top:155px; background:url(../images/me.jpg) no-repeat}

#line {position:absolute; width:964px; height:1px; left:14px; top:432px; background-image:url(../images/line_break.gif)}

#current_head {position:absolute; left:14px; top:466px; width:310px; height:28px; background-image:url(../images/current_head.jpg)}
#latest_head {position:absolute; left:14px; top:857px; width:310px; height:28px; background-image:url(../images/latest_head.jpg)}

#current_project {position:absolute; left:17px; top:518px; width:961px; height:287px}
#view_details {position:absolute; left:494px; top:52px; width:120px; height:20px}

#line_2 {position:absolute; width:964px; height:1px; left:14px; top:825px; background-image:url(../images/line_break.gif)}

#latest_wrap {position:absolute; left:17px; top:909px; width:961px; height:215px}

#latest_1 {position:absolute; width:312px; height:215px; left:0px; top:0px; background:url(../images/latest_1.jpg) no-repeat}
#latest_2 {position:absolute; width:312px; height:215px; left:324px; top:0px; background:url(../images/latest_2.jpg) no-repeat}
#latest_3 {position:absolute; width:312px; height:215px; left:648px; top:0px; background:url(../images/latest_3.jpg) no-repeat}

#line_3 {position:absolute; width:964px; height:1px; left:14px; top:1144px; background-image:url(../images/line_break.gif)}


/*----------Work----------*/
#work_head {position:absolute; left:14px; top:174px; width:310px; height:28px; background-image:url(../images/latest_head.jpg); text-indent:-999em}
#work_wrap_1 {position:absolute; left:17px; top:226px; width:961px; height:215px}
#work_wrap_2 {position:absolute; left:17px; top:453px; width:961px; height:215px}
#work_wrap_3 {position:absolute; left:17px; top:680px; width:961px; height:215px}
#work_wrap_4 {position:absolute; left:17px; top:907px; width:961px; height:215px}
#work_wrap_5 {position:absolute; left:17px; top:1134px; width:961px; height:215px}

#latest_4 {position:absolute; width:312px; height:215px; left:0px; top:0px; background:url(../images/latest_1.jpg) no-repeat}
#latest_5 {position:absolute; width:312px; height:215px; left:324px; top:0px; background:url(../images/latest_2.jpg) no-repeat}
#latest_6 {position:absolute; width:312px; height:215px; left:648px; top:0px; background:url(../images/latest_3.jpg) no-repeat}

#latest_7 {position:absolute; width:312px; height:215px; left:0px; top:0px; background:url(../images/latest_1.jpg) no-repeat}
#latest_8 {position:absolute; width:312px; height:215px; left:324px; top:0px; background:url(../images/latest_2.jpg) no-repeat}
#latest_9 {position:absolute; width:312px; height:215px; left:648px; top:0px; background:url(../images/latest_3.jpg) no-repeat}

#latest_10 {position:absolute; width:312px; height:215px; left:0px; top:0px; background:url(../images/latest_1.jpg) no-repeat}
#latest_11 {position:absolute; width:312px; height:215px; left:324px; top:0px; background:url(../images/latest_2.jpg) no-repeat}
#latest_12 {position:absolute; width:312px; height:215px; left:648px; top:0px; background:url(../images/latest_3.jpg) no-repeat}

#workline_3 {position:absolute; width:964px; height:1px; left:14px; top:1371px; background-image:url(../images/line_break.gif)}
#work_footer_wrap {position:absolute; top:1437px; left:17px; height:200px; width:960px}
#work_eloquent {position:absolute; bottom:10px; right:0px; width:180px; height:20px}


/*----------Services----------*/
#services_head {position:absolute; left:14px; top:174px; width:167px; height:28px; background-image:url(../images/services_head.jpg); text-indent:-999em}
#services_2_head {position:absolute; left:14px; top:376px; width:183px; height:28px; background-image:url(../images/services_2_head.jpg); text-indent:-999em}

#experience_copy {position:absolute; width:960px; left:14px; top:226px; height:110px}

#line_4 {position:absolute; width:964px; height:1px; left:14px; top:346px; background-image:url(../images/line_break.gif)}

#logo_serv {position:absolute; width:243px; height:680px; left:39px; top:410px}
#web_serv {position:absolute; width:243px; height:680px; left:379px; top:410px}
#host_serv {position:absolute; width:243px; height:680px; left:719px; top:410px}

#logo_icon {position:absolute; width:243px; height:200px; left:0px; top:0px; background-image:url(../images/logo_services.jpg)}
#web_icon {position:absolute; width:243px; height:200px; left:0px; top:0px; background-image:url(../images/web_services.jpg)}
#host_icon {position:absolute; width:243px; height:200px; left:0px; top:0px; background-image:url(../images/hosting_services.jpg)}

#serv_div_1 {position:absolute; width:19px; height:763px; left:322px; top:366px; background-image:url(../images/serv_div.jpg)}
#serv_div_2 {position:absolute; width:19px; height:763px; left:661px; top:366px; background-image:url(../images/serv_div.jpg)}

#serv_content {position:absolute; width:243px; height:480px; top:200px; left:0px}
#web_content {position:absolute; width:243px; height:480px; top:200px; left:0px}
#host_content {position:absolute; width:243px; height:480px; top:200px; left:0px}


/*----------Contact----------*/
#contact_head {position:absolute; left:12px; top:174px; width:239px; height:28px; background-image:url(../images/contact_head.jpg); text-indent:-999em}
#contact_2_head {position:absolute; left:12px; top:396px; width:211px; height:28px; background-image:url(../images/contact_2_head.jpg); text-indent:-999em}

#big_me {position:absolute; width:481px; height:816px; left:500px; top:362px; background-image:url(../images/big_me.jpg)}

#the_form {position:absolute; left:14px; top:448px; width:480px; height:300px}
#table {z-index:10; position:absolute; left:14px; top:480px; width:534px; height:215px}


/*----------Footer----------*/
#footer_wrap {position:absolute; top:1210px; left:17px; height:200px; width:960px}

#details_head {position:absolute; top:0px; left:0px; height:28px; width:266px; background-image:url(../images/details_head.jpg); text-indent:-999em}
#social_head {position:absolute; top:0px; left:318px; height:28px; width:195px; background-image:url(../images/social_head.jpg); text-indent:-999em}
#reciprocal_head {position:absolute; top:0px; left:644px; height:28px; width:264px; background-image:url(../images/reciprocal_head.jpg); text-indent:-999em}

#icons {z-index:2; position:absolute; top:48px; left:324px; width:27px; height:120px}

#facebook {position:absolute; top:0px; left:2px; width:23px; height:23px; background-image:url(../images/facebook_icon.jpg)}
#twitter {position:absolute; top:27px; left:2px; width:23px; height:23px; background-image:url(../images/twitter_icon.jpg)}
#linkedin {position:absolute; top:55px; left:2px; width:23px; height:23px; background-image:url(../images/linkedin_icon.jpg)}
#blog_icon {position:absolute; top:81px; left:0px; width:27px; height:27px; background-image:url(../images/wordpress_icon.jpg)}

#details {position:absolute; top:24px; left:20px; width:312px; height:140px}
#social {position:absolute; top:24px; left:354px; width:312px; height:140px}
#reciprocal {position:absolute; top:24px; left:668px; width:312px; height:140px}

#eloquent {position:absolute; bottom:10px; right:0px; width:180px; height:20px}