/* 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 */

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

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

/* Global Colors */
.green, a, ul.navigation li a.active, ul.navigation li a:hover { color:#c7ff00; }
ul.navigation li a { color:#7a7a7a; }
.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; }
.footer a.validxhtml, .footer a.validcss, .smashingwidget h3 a, div.widgettwitter h3 a { color:#fff; }
.blue { color:#3bb7ff; }

/* Typography */
a { text-decoration:underline; }
a:hover, ul.navigation li a, div.widgettwitter h3 a { text-decoration:none; }
p { font:12px Verdana, Geneva, sans-serif; }
ul.navigation, .follow h4 { font:16px Verdana, Geneva, sans-serif; line-height:61px; }
#main_copy .left_column div.box h3 { font:14px Verdana, Geneva, sans-serif; }
#main_copy .left_column div.box h3 { line-height:39px; text-transform:uppercase; }
#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 ul li small {font-size:11px; display:block; clear:both; padding:5px 40px 10px 0;}
#main_copy .left_column div.box p { font-family:Tahoma, Geneva, sans-serif; }
#main_copy .right_column div.content div.bar h3 { font:16px 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.services { background:url(../images/navi_services.png) no-repeat left; }
ul.navigation li.portfolio { background:url(../images/navi_works.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; padding-left:40px; } 
#main_copy .left_column div.box h3.blue { background:url(../images/left_h3_blue.png); height:48px; padding-left:40px; } 
#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; }

#envatomarket {display:block; clear:both; height:298px;}
#envatomarket li {overflow:hidden;}

/* 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;  }
.footer a.creativecommons { background:url(../images/cclogo.png) no-repeat left; height:40px; display:block; width:300px; padding:15px 0 5px 50px;}
.footer p.valid { padding-top:5px; }
.footer p.valid span { float:left; padding-right:3px; }
.footer a.validxhtml { width:43px; height:15px; background:url(../images/valid_html.png) no-repeat left; display:block; text-align:center; line-height:15px; text-decoration:none; float:left; padding-right:5px; padding-top:0; padding-bottom:0; }
.footer a.validcss { width:43px; height:15px; background:url(../images/valid_css.png); display:block; text-align:center; line-height:15px; text-decoration:none; float:left; padding-top:0; padding-bottom:0; }

/* Smashing Widget */
.smashingwidget {font-family:Arial, Helvetica, sans-serif;}
.smashingwidget h3 {background:url(../images/left_h3_blue.png); height:48px; position:relative; padding-left:40px;}
.smashingwidget h3 a {text-decoration:none;}
.smashingwidget h3 img {position:absolute; right:30px; top:3px;}
.smashingwidget ol {list-style:none; font-size:12px; padding:0 40px;}
.smashingwidget ol li {display:block; clear:both; border-bottom:1px dotted #ccc; padding:10px 0;}

/* Twitter Widget */
div.widgettwitter {padding-top:20px;}
div.widgettwitter h3 {position:relative;}
div.twtr-widget {padding-left:40px; font-size:10px;}
div.twtr-bd p, div.twtr-bd p a, div.twtr-widget span {font-size:11px;}
.twtr-hd h3 {text-align:left;}
.twtr-hd h4 {font-weight:normal;}
img.twtr-profile-img {width:100px; height:100px;}
img.icontwitter {position:absolute; right:10px; top:-18px;}

/* Contact Info Widget */
h3.contactinfo {position:relative;}
img.iconcontact {position:absolute; right:5px; top:-18px;}
