/* CSS Document */
/* Title: PSD to XHTML/HTML, CSS, JQuery, Web Design, Creative Solutions, Juven A. Pajares */
/* Description: Convert PSD to XHTML/HTML, Web Design Services, Coding with Valid XHTML/HTML and CSS */
/* Author: Juven A. Pajares */
/* Date: May 16, 2010 */

/* Global Colors */
.green, a, ul.navigation li a.active, ul.navigation li a:hover { color:#c7ff00; }
ul.navigation li a { color:#007094; }
.white, .follow h4, #main_copy .left_column div.box h3, #main_copy .left_column div.box, #main_copy .right_column div.content div.bar h3, #main_copy .right_column div.content p, #main_footer div.footer p { color:#eee; }
.blue { color:#3bb7ff; }

/* Typography */
a { text-decoration:underline; }
a:hover, ul.navigation li a { text-decoration:none; }
p { font:12px Verdana, Geneva, sans-serif; }
ul.navigation, .follow h4 { font:18px Verdana, Geneva, sans-serif; line-height:61px; }
#main_copy .left_column div.box h3 { font:18px Verdana, Geneva, sans-serif; }
#main_copy .left_column div.box h3 { line-height:39px; text-align:center; }
#main_copy .left_column div.box ul { font:16px Tahoma, Geneva, sans-serif; }
#main_copy .left_column div.box ul { list-style:none; padding:0 0 18px 46px; }
#main_copy .left_column div.box p { font:14px Tahoma, Geneva, sans-serif; }
#main_copy .right_column div.content div.bar h3 { font:18px Verdana, Geneva, sans-serif; text-transform:uppercase; }
#main_copy .right_column div.content div.bar h3 { line-height:39px; padding-left:40px; margin-left:20px; }
#main_copy .right_column div.content h2 { font:36px Tahoma, Geneva, sans-serif; }
#main_footer div.footer p { font:11px Tahoma, Geneva, sans-serif; }
#main_footer div.footer p span.big { font:12px Tahoma, Geneva, sans-serif; }

/* Styles */
body { background:#000; }
#main_top { background:url(../images/img_top_bg.jpg) repeat-x; width:100%; height:66px; }
#main_header { background:url(../images/img_header_bg.jpg); width:900px; height:214px; margin:0 auto; position:relative; }
#main_copy { background:url(../images/img_copy_bg.jpg) repeat-x top #191919; padding:30px 0; }
#main_footer { background:url(../images/img_bottom_bg.jpg) repeat-x top; width:100%; height:201px; }

.container { width:900px; position:relative; margin:0 auto; }
ul.navigation { width:560px; float:left; }
ul.navigation li { list-style:none; display:inline; padding:0 20px 0 30px; }
ul.navigation li.home { background:url(../images/navi_home.png) no-repeat left; }
ul.navigation li.about { background:url(../images/navi_about.png) no-repeat left; }
ul.navigation li.works { background:url(../images/navi_works.png) no-repeat left; }
ul.navigation li.blog { background:url(../images/navi_blog.png) no-repeat left; }
.follow h4 { width:145px; float:left; }
.follow img { margin-top:8px; }
#main_header h1 { text-indent:-999999px; }
#main_header img.templates { position:absolute; left:496px; }

#main_copy .left_column { width:283px; float:left; }
#main_copy .right_column { width:617px; float:left; }
#main_copy .left_column div.box { background:url(../images/left_box_bg.png) bottom; }
#main_copy .left_column div.box h3.green { background:url(../images/left_h3_green.png); height:48px; } 
#main_copy .left_column div.box h3.blue { background:url(../images/left_h3_blue.png); height:48px; } 
#main_copy .left_column div.box p { padding:0 0 10px 50px; margin-left:30px; }
#main_copy .left_column div.box p.mail { background:url(../images/icon_mail.png) no-repeat left top; }
#main_copy .left_column div.box p.mobile { background:url(../images/icon_mobile.png) no-repeat left top; height:40px; padding-top:10px; }
#main_copy .left_column div.box_bt { background:url(../images/left_box_bt.png); height:29px; }

#main_copy .right_column div.content_top { background:url(../images/img_content_top.jpg); height:34px; }
#main_copy .right_column div.content { background:url(../images/img_content_bg.jpg) bottom; }
#main_copy .right_column div.content_bt { background:url(../images/img_content_bt.jpg); height:47px; }
#main_copy .right_column div.content div.bar { background:url(../images/img_copy_bar_bg.jpg) repeat-x; height:39px; border:1px solid #565656; }
#main_copy .right_column div.content div.bar h3.blue { background:url(../images/img_copy_h3_blue.png) no-repeat left; }
#main_copy .right_column div.content div.bar h3.green { background:url(../images/img_copy_h3_green.png) no-repeat left; }
#main_copy .right_column div.content h2 { padding:0 20px; }
#main_copy .right_column div.content p { padding:0 20px 15px 20px; }

/* Footer */
.footer { background:url(../images/img_footer_bg.jpg); height:201px; }
.footer p { width:665px; padding:20px 0 0 20px; float:left; }
.footer img { margin-top:20px;  }

/* ClearFix */
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clearfix {display:inline-block;}
* html .clearfix {height:1%;}
.clearfix {display:block;}

/* Reset */
body, h1, h2, h3, h4, h5, h6, p, ul, li { margin:0; padding:0; }
img { border:none; }