@charset "UTF-8";
/* === === === === === === === === === === 
Copyright 2010 .com
Coded By: Eric Pantoja
Designed By: Eric Pantoja
Email: eric@ericpantoja.com
Website: http://www.EricPantoja.com
=== === === === === === === === === === */

/* Resets 
======================== */
* {margin: 0px; padding: 0px;}
ul li {list-style-type: none;}
a {text-decoration: none;}
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, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea {font-family: Arial, Helvetica, sans-serif; font-size:12px;}
img {border: 0; }

/* General Styles
======================== */
body {background: url(../images/bg.png) repeat;}
.clear {clear: both;}
.uni {margin: 0 auto; padding: inherit; width: 960px;}
.wrap {margin: 0 auto; padding: inherit; width: 950px; height: 100%;}
.third {float: left; margin-top: 25px; width: 310px; margin-right: 10px;}
h1, h2, h3, h4,h5 {color: #474747;}
h2 {font-size: 16px; margin-bottom: 15px;}
h3 {font-size: 14px; margin: 25px 0px 15px 0px;}
p {color: #474747; margin-bottom: 10px;}
.topic {background-image: url(../images/topicBg.png); background-repeat:no-repeat; background-position: center bottom; padding-bottom: 30px;}

/* TopBar Styles
======================== */
#topBar {background: url(../images/topBarBg.png) repeat-x; float: left; height: 189px; width: 100%;}
#topBar div.fb-like {float: right; padding-top: 2px;}
#topBar p#date {color: #838383; float: left; padding-top: 6px;}
#topBar h1#logo {background: url(../images/logo.png) no-repeat; float: left; height: 110px; text-indent: -9999px; width: 283px; margin-top: 10px;}

/* Navigation Styles
======================== */
ul#nav {float: right; margin-top: 60px; position: relative;}
ul#nav li {display: inline; float: left;}
ul#nav li#home a {background: url(../images/homeButton.png) top no-repeat; height: 43px; float: left; text-indent: -9999px; width: 85px;}
ul#nav li#home a:hover {background: url(../images/homeButton.png) bottom no-repeat;}
ul#nav li#portfolio a {background: url(../images/portfolioButton.png) top no-repeat; height: 43px; float: left; text-indent: -9999px; width: 92px;}
ul#nav li#portfolio a:hover {background: url(../images/portfolioButton.png) bottom no-repeat;}

ul#nav li#articles {background: url(../images/articles.png) bottom no-repeat; height: 43px; float: left; width: 107px; position: relative; z-index: 500;}
ul#nav li#articles:hover {background: url(../images/articles.png) top no-repeat; cursor: pointer; position: relative; z-index: 9;}
ul#nav li#articles ul {background: #1b1717; position: absolute; border-right: 1px solid #100f0f; border-left: 1px solid #100f0f; border-bottom: 1px solid #100f0f; border-top: 3px solid #100f0f; width: 150px; left: 0; margin-top: 43px; z-index: 0; display: none;  border-bottom-left-radius: 5px; -webkit-border-bottom-left-radius: 5px; -mox-border-bottom-left-radius: 5px;border-bottom-right-radius: 5px; -webkit-border-bottom-right-radius: 5px; -mox-border-bottom-right-radius: 5px;}
ul#nav li#articles ul li {border-bottom: 1px solid #100f0f; border-top: 1px solid #323030; width: 100%;}
ul#nav li#articles ul li a {color: #4b4949; display: block; padding: 6px; margin: 4px;}
ul#nav li#articles ul li a:hover {background: #302929; color: #fff; border-radius: 5px; -webkit-border-radius: 5px; -mox-border-radius: 5px;}
ul#nav li#about a {background: url(../images/aboutButton.png) top no-repeat; height: 43px; float: left; text-indent: -9999px; width: 76px; position: relative; z-index: 500;}

ul#nav li#about a:hover {background: url(../images/aboutButton.png) bottom no-repeat;}
ul#nav li#contact a {background: url(../images/contactButton.png) top no-repeat; height: 43px; float: left; text-indent: -9999px; width: 162px;}
ul#nav li#contact a:hover {background: url(../images/contactButton.png) bottom no-repeat;}


/* Content Styles
======================== */
ul#skills li {color: #474747; list-style-type: disc; list-style-position: inside; padding: 8px 5px;}
ul#skills li span {font-style: italic;}

ul#latest li a {background: #fff; border: 1px solid #dfdfdf; border-radius: 5px; -webkit-border-radius: 5px; -mox-border-radius: 5px; padding: 5px; width: 300px; height: 100px; margin-bottom: 10px; display: block;}
ul#latest li a div.ihover {background: url(../images/latest_thumb/hover.png) no-repeat;  height: 100px; width: 300px; position: absolute; z-index: 99; display: none;}
ul#latest li a img {position: absolute; z-index: 1;}

ul#twitter_update_list li {color: #474747; margin: 5px 0px; padding: 10px 0px; border-bottom: 1px dashed #c3c3c3;}
ul#twitter_update_list li a {color: #93aa58;}
#twitter-link {background: url(../images/followme.png) top no-repeat; float: right; height: 25px; text-indent: -9999px; width: 100px; margin-top: 15px;}
#twitter-link:hover {background: url(../images/followme.png) bottom no-repeat;}

/* Footer Styles
======================== */
#footer {background: #171515; height: 35px; margin: 0 auto; padding: 0px 5px; width: 960px; margin-top: 25px; border-top-right-radius: 5px; -webkit-border-top-right-radius: 5px; -mox-border-top-right-radius: 5px; border-top-left-radius: 5px; -webkit-border-top-left-radius: 5px; -mox-border-top-left-radius: 5px;}
#footer p {color: #404040; padding-top: 10px; font-size: 10px; float: left;}
#footer p span {float: right;}
#footer p span a {display: block; float: left; padding-left: 5px; margin-top: -5px;}
#footer ul {float: right;}
#footer ul li {display: inline; float: left;}
#footer ul li a {float: left; margin-right: 5px; margin-top: 4px; height: 24px; text-indent: -9999px; width: 24px;}
#footer ul li a#facebookIcon {background: url(../images/icons/facebook.png) no-repeat;}
#footer ul li a#twitterIcon {background: url(../images/icons/twitter.png) no-repeat;}
#footer ul li a#googleIcon {background: url(../images/icons/google.png) no-repeat;}
#footer ul li a#flickrIcon {background: url(../images/icons/flickR.png) no-repeat;}
#footer ul li a#youtubeIcon {background: url(../images/icons/youtube.png) no-repeat;}
#footer ul li a#deviantArtIcon {background: url(../images/icons/deviantArt.png) no-repeat;}