/* Resets
--------------------------------------------- */
html, body, h1, h2, h3, h4, h5, h6, p, span, ul, li, div, form, input, select, textarea, button {margin:0; padding:0;}
html {overflow:-moz-scrollbars-vertical !important;}
ul {list-style:none;}
a, a:hover {text-decoration:none; outline:0;}
a img {border:0;}
img {-ms-interpolation-mode:bicubic;} 

/* Structure
--------------------------------------------- */
body {font:12px/16px Verdana, Arial, Helvetica, sans-serif; color:#FFF; text-align:center; background:#000 url(../img/body_bg.jpg) 50% 48px no-repeat;}

#header {position:relative; z-index:10; text-align:left; background:#06021A url(../img/header_bg.jpg) top center no-repeat;}
#header div {width:900px; height:48px; margin:0 auto; overflow:hidden;}
#header h1 a {display:block; float:left; width:208px; height:27px; margin-top:13px; text-indent:-999em; background:url(../img/logo.png) top left no-repeat;}
#header ul {float:right; overflow:hidden;}
#header li {float:left;}
#header li a {display:block; height:48px; text-indent:-999em; background:url(../img/nav_bg.png) top left no-repeat;}
#header li#portfolio a {width:104px;}
#header li#blog a {width:86px; background-position:-104px 0;}
#header li#contact a {width:89px; background-position:-190px 0;}
#header li#portfolio a:hover, body.portfolio #header li#portfolio a {background-position:bottom left;}
#header li#blog a:hover, body.blog #header li#blog a {background-position:-104px -48px;}
#header li#contact a:hover, body.contact #header li#contact a {background-position:-190px -48px;}

#container {position:relative; width:900px; margin:30px auto; text-align:left;}
body.blog #container, body.search #container, body.demo #container {width:960px; margin:0 auto;}

p.rss_icon {text-align:right;}
body.blog p.rss_icon {margin:0; padding:0;}

/* Portfolio
----------------*/
ul#categories {height:36px; padding:0 10px; overflow:hidden; background:#000 url(../img/categories_bg.jpg) top left no-repeat;}
ul#categories li {display:inline; float:left; margin-right:10px; color:#CCC; line-height:36px;}
ul#categories li:last-child {float:right; margin-right:0;}
ul#categories li:last-child a {display:block; padding:10px 0 0; border-right:0;}
ul#categories li a {padding-right:10px; color:#FFF; border-right:1px solid #FFF;}
ul#categories li a.current {color:#699;}

ul#showcase {margin-top:30px; overflow:hidden;}
ul#showcase li {float:left; position:relative; width:261px; height:156px; margin:0 28px 25px 0; padding:10px; background:url(../img/showcase_bg.png) top left no-repeat;}
ul#showcase li + li + li, ul#showcase li + li + li + li + li + li {margin-right:0;}
ul#showcase li + li + li + li {margin-right:28px;}
ul#showcase li div {display:none; position:absolute; z-index:2; top:10px; left:10px; width:241px; height:136px; padding:10px; overflow:hidden; background:url(../img/showcase_overlay.png);}
ul#showcase li div h2 {margin-bottom:3px; font-size:16px; font-weight:normal;}
ul#showcase li div p {float:left; clear:both; margin-bottom:8px; line-height:18px;}
ul#showcase li div a.zoom {position:absolute; bottom:10px; right:10px; display:block; width:25px; height:20px; text-indent:-999em; background:url(../img/zoom.png) top left no-repeat;}
/*ul#showcase li:hover div {display:block;}*/

body.portfolio .paging {clear:both; float:right; padding-left:8px; background:url(../img/paging_bg_left.png) top left no-repeat;}
body.portfolio .paging ul {height:29px; margin:0; padding-right:8px; overflow:hidden; background:url(../img/paging_bg_right.png) top right no-repeat;}
body.portfolio .paging li {display:inline; margin:0 5px; line-height:29px;}
body.portfolio .paging li a {padding:0 4px; color:#FFF; border:0; background:none;}
body.portfolio .paging li a:hover {text-decoration:underline; border:0;}
body.portfolio .paging li.current span {padding:0 4px; color:#699; border:0; background:none;}
body.portfolio .paging li.disabled span {display:none;}

/* Blog
----------------*/
#content {float:left; width:647px;}
#content_top {height:55px; background:url(../img/blog_bg_caps.png) bottom left no-repeat;}
#content_page {padding:0 45px; color:#000; overflow:hidden; background:url(../img/blog_bg.png) top left repeat-y;}
#content_page hr {display:block; clear:both; width:587px; height:0px; margin-left:-15px; border:0; border-top:1px solid #999; border-bottom:1px solid #FFF; background:#CCC;}
#content_page hr:last-child {display:none;}
#content_bottom {height:55px; background:url(../img/blog_bg_caps.png) top left no-repeat;}

.post {margin:40px 0; overflow:hidden;}
.post:first-child {margin-top:0;}
.post:last-child {margin-bottom:0;}
.post h2 {margin:0;}
.post img {max-width:539px;}
.post small.post_meta {display:block; margin:5px 0 15px; font-size:10px;}
.post .post_info {overflow:hidden; border:1px solid #666; border-bottom-color:#FFF; border-right-color:#FFF; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; background:url(../img/post_info_bg.png);}
.post a.comments {display:block; float:left; padding:5px 10px; border-top-left-radius:4px; -moz-border-radius-topleft:4px; -webkit-border-top-left-radius:4px; border-bottom-left-radius:4px; -moz-border-radius-bottomleft:4px; -webkit-border-bottom-left-radius:4px;}
.post a.read_more {display:block; float:right; padding:5px 10px; border-top-right-radius:4px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px;}
.post a.comments:hover, .post a.read_more:hover {color:#FFF; background:#699;}

h2#comments {margin-top:24px;}
ul.comments {margin-bottom:40px;}
ul.comments li {margin-bottom:12px;}
ul.comments .comment {}
ul.comments .author .comment_content {color:#FFF; border:1px solid #000; background:#333;}
ul.comments .comment_meta {width:100px; float:left;}
ul.comments .comment_meta img {display:block; width:80px; height:80px;}
ul.comments .comment_meta span {display:block; font-size:10px; color:#999;}
ul.comments .comment_content {position:relative; float:left; width:435px; min-height:105px; padding:10px; border:1px solid #CCC; background:#F9F9F9;}
ul.comments .comment_content img.comment_arrow {position:absolute; top:10px; left:-16px;}
ul.comments .comment_content img {max-width:435px; max-height:200px;}

h2#add_comment {margin-top:30px;}
#comment_form {}
#comment_form li {margin-bottom:5px; overflow:hidden;}
#comment_form li.submit {text-align:right;}
#comment_form label {display:block; float:left; width:70px; margin-right:5px; text-align:right;}
#comment_form .input {width:400px;}
#comment_form textarea.input {width:474px;}
#comment_form input + span {font-size:10px; color:#999;}
#comment_form .error {border:1px solid #C00;}
#comment_errors {margin-bottom:10px; padding:10px; list-style:square inside; border:1px solid #C00; background:#FFEFEF;}
#comment_errors li {margin:4px 0;}
#comment_form .left {width:482px;}
#comment_format {margin-bottom:5px; color:#FFF; background:#333;}
#comment_format h4 {padding:10px 0 0 10px;}
#comment_format ul {padding:0 10px 10px; list-style:square inside;}

#sidebar {float:left; width:313px;}
#sidebar_top {height:55px; background:url(../img/sidebar_bg_caps.png) bottom left no-repeat;}
#sidebar_content {min-height:650px; padding:0 45px 0 15px; color:#FFF; overflow:hidden; background:url(../img/sidebar_bg.png) top left repeat-y;}

#sidebar .module {clear:both; margin-bottom:40px;}

#sidebar .search, #search_page .search {overflow:hidden;}
#sidebar .search .input, #search_page .search .input {display:block; float:left; width:165px; padding:7px; color:#FFF; border:1px solid #000; border-bottom-color:#666; border-right-color:#666; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; background:#333;}
#sidebar .search button, #search_page .search button {display:block; float:right; width:65px; margin-left:3px; padding-left:0; padding-right:0;}
#search_page .search .input {width:300px;}
#search_page .search button {float:left; margin-left:5px;}

#sidebar .categories ul {padding:4px 0; border:1px solid #000; border-bottom-color:#666; border-right-color:#666; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; background:url(../img/sidebar_categories_bg.png);}
#sidebar .categories li a {display:block; padding:3px 0 3px 15px; color:#FFF;}
#sidebar .categories li a:hover, #sidebar .categories li.current a {text-decoration:none; background:#2B1B2B;}

#sidebar .extras li a {padding:3px 0 3px 40px; background-position:15px 3px; background-repeat:no-repeat;}
#sidebar .extras li a:hover {background:#2B1B2B no-repeat 15px 3px;}
#sidebar .extras li a.rss {background-image:url(../img/feed.png);}
#sidebar .extras li a.twitter {background-image:url(../img/twitter.gif);}
#sidebar .extras li a.flickr {background-image:url(../img/flickr.png);}

#sidebar .flickr ul {overflow:hidden;}
#sidebar .flickr li {display:inline; float:left; margin-bottom:5px;}
#sidebar .flickr li.middle {margin:0 8px;}
#sidebar .flickr li a img {padding:1px; border:1px solid #666;}
#sidebar .flickr li a:hover img {border:1px solid #FFF;}

/* Calendar Styles */
.calendar {width:100%; border-collapse:collapse;}
.calendar tr.navigation th {padding-bottom:20px;}
.calendar th.prev-month {text-align:left;}
.calendar th.current-month {text-align:center; font-size:1.5em;}
.calendar th.next-month {text-align:right;}
.calendar tr.weekdays th {text-align:left;}
.calendar td {width:14%; height:100px; vertical-align:top; border:1px solid #CCC;}
.calendar td.today {background:#FFD;}
.calendar td.prev-next {background:#000;}
.calendar td.prev-next span.date {color:#222;}
.calendar td.holiday {background:#DDFFDE;}
.calendar span.date {display:block; padding:4px; line-height:12px; background:#EEE;}
.calendar div.day-content {}
.calendar ul.output {margin:0; padding:0 4px; list-style:none;}
.calendar ul.output li {margin:0; padding:5px 0; line-height:1em; border-bottom:1px solid #CCC;}
.calendar ul.output li:last-child {border:0;}

/* Small Calendar */
.calendar.small {width:auto; border-collapse:separate;}
.calendar.small tr.navigation th {padding-bottom:5px;}
.calendar.small tr.navigation th a span {font-size:1.5em;}
.calendar.small th.current-month {font-size:1em;}
.calendar.small tr.weekdays th {text-align:center;}
.calendar.small td {width:auto; height:auto; padding:8px; text-align:center; border:0; background:#121212;}
.calendar.small span.date {display:inline; padding:0; background:none;}

/* Contact
----------------*/
#contact_container {display:none; position:absolute; top:-30px; right:0; z-index:5; width:420px; color:#000; text-align:left;}
body.blog #contact_container, body.demo #contact_container, body.search #contact_container {top:0;}
#contact_container div {padding:10px; border:8px solid #000; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; background:url(../img/body_bg.jpg) 50% 50% no-repeat;}
#contact_form p {clear:both; overflow:hidden;}
#contact_form p:last-child {margin-bottom:0;}
#contact_form label {display:block; float:left; width:65px; text-align:right;}
#contact_form .input, #contact_form textarea {display:block; float:left; width:300px; margin-left:8px; border:1px solid #666; border-top-width:2px;}
#contact_form button {float:right; margin-top:10px;}
#contact_form span.error {display:block; text-align:right; color:#C00;}

/* Demos
----------------*/
/* #FF7F7F, #8FFFDD */
#php_menu_builder ul {}
#php_menu_builder li {float:left; width:130px;}
#php_menu_builder li a {display:block; width:89px; line-height:30px; padding:0 20px; color:#FFF; border-bottom:1px solid #FFF; border-right:1px solid #FFF; background:#FF7F7F;}
#php_menu_builder li a:hover, #php_menu_builder li.active > a {text-decoration:none; color:#333; background:#8FFFDD;}
#php_menu_builder li ul {position:absolute; background:#FF7F7F; width:129px; left:-999em;}
#php_menu_builder li ul li a {width:89px; border-right:0;}
#php_menu_builder li ul ul {margin:-31px 0 0 129px; border-left:1px solid #FFF;}
#php_menu_builder li:hover ul ul, #php_menu_builder li.sfhover ul ul {left:-999em;}
#php_menu_builder li:hover ul, #php_menu_builder li li:hover ul, #php_menu_builder li.sfhover ul, #php_menu_builder li li.sfhover ul {left:auto;}

/* Search
----------------*/
#search {width:960px;}
#search_top {height:55px; background:url(../img/search_bg_caps.png) bottom left no-repeat;}
#search_page {padding:0 45px; color:#000; overflow:hidden; background:url(../img/search_bg.png) top left repeat-y;}
#search_bottom {height:55px; background:url(../img/search_bg_caps.png) top left no-repeat;}

/* Type
--------------------------------------------- */
h2, h3, h4, h5 {font-family:'HelveticaNeue-Light', 'Helvetica Nueu Light', Helvetica, Arial, sans-serif; font-weight:normal;}
h2 {font-size:30px; line-height:30px; margin-bottom:20px;}
h3 {font-size:22px; line-height:22px; margin-bottom:20px;}
h4 {font-size:18px; line-height:18px; margin-bottom:16px;}
h5 {font-size:14px; line-height:14px; margin-bottom:10px;}

p {line-height:24px; margin-bottom:24px;}
form p {margin:10px 0;}

a {color:#456F6F;}
a:hover {text-decoration:underline;}

blockquote {font-family:Georgia, 'Times New Roman', serif; font-style:italic;}

a.download, a.demo {display:block; clear:both; padding:5px 5px 5px 60px; font:22px/48px 'HelveticaNeue-Light', 'Helvetica Nueu Light', Helvetica, Arial, sans-serif; border:1px solid #CCC; background:#FFF url(../img/box_download.png) 5px 5px no-repeat;}
a.zip {background-image:url(../img/box_zip.png);}
a.demo {background-image:url(../img/applications.png);}

/* Misc. Stuff
--------------------------------------------- */
.clear {clear:both;}
.clear-invisible {clear:both; width:100%; height:0;}

.left {float:left; overflow:hidden;}
.right {float:right; overflow:hidden;}

img.left {margin:10px 10px 10px 0;}
img.right {margin:10px 0 10px 10px;}
img.full, img.left, img.right {padding:8px; border:1px solid #CCC; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; background:#F9F9F9;}

.overflow {overflow:hidden;}

.hidden {display:none;}

/* Lists
--------------------------------------------- */
.paging ul {float:right; margin:10px 0; overflow:hidden;}
.paging li {float:left; margin:0 2px;}
.paging li.ellipse {padding-top:6px;}
.paging li a, .paging ul span {display:block; padding:2px 4px; border:1px solid #CCC; background:#FFF;}
.paging li.disabled span {color:#CCC;}
.paging li.disabled {display:none;}
.paging li.current span {color:#FFF; border:1px solid #333; background:#699;}
.paging li a:hover {text-decoration:none; border:1px solid #666;}

.post ul {margin:0 0 12px 35px; list-style:square;}
.post li {margin:8px 0;}

/* Forms
--------------------------------------------- */
form div.fix {margin-right:10px;}

fieldset {border:1px solid #CCC; background:#F9F9F9;}

.input, textarea, select {padding:3px; font-family:Verdana, Arial, sans-serif; font-size:12px; color:#404040; border:1px solid #CCC;}
select.input {padding:2px;}

.input, textarea {border:1px solid;  border-color:#AAAFB4 #DCE1E6 #E1E6F0 #E1E6EB;}
.input:hover, .input:focus, textarea:hover, textarea:focus {border:1px solid;  border-color:#5A96C8 #B4D2E6 #C8E6F0 #C8DCF0;}

form.full input, form.full textarea, form.full select, form.full button, input.full, textarea.full, select.full, button.full {float:none; width:100%;}
form.half input, form.half textarea, form.half select, form.half button, input.half, textarea.half, select.half, button.half {float:none; width:50%;}

form.large input, form.large textarea, form.large select, input.large, textarea.large, select.large, button.large {font-size:22px; font-weight:bold;}

label {cursor:pointer;}

button {cursor:pointer; padding:0.4em 1.25em 0.5em; font-size:12px; color:#FFF; line-height:1.33em; text-transform:uppercase; text-shadow:0 -1px 0 #18767E; border:1px solid #15788C; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; background:#0B767F url(../img/white_overlays.png) repeat-x scroll 0 0;}
button:hover {background-color:#1DB3C0;}
button:active {padding:0.5em 1.25em 0.4em;}

/* Tables
--------------------------------------------- */
table.list {width:100%; border-spacing:1px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; background:#CCC;}
table.list th {padding:4px 5px; text-align:left; color:#FFF; border-bottom:1px solid #333; background:#036 url(../img/th-bg.png) top left repeat-x;}
table.list th a {color:#FFF; white-space:nowrap;}
table.list th a:hover {text-decoration:none;}
table.list tr td {padding:4px; border:1px solid #FFF; background:#EFF8FF;}
table.list tr.alt td {background:#FFF;}
table.list tr.selected td, table.list tr.selected:hover td {background:#FFD;}
table.list tr:hover td {background:#F1F1F1;}

table .tl {border-top-left-radius:4px; -moz-border-radius-topleft:4px; -webkit-border-top-left-radius:4px;}
table .tr {border-top-right-radius:4px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px;}
table .bl {border-bottom-left-radius:4px; -moz-border-radius-bottomleft:4px; -webkit-border-bottom-left-radius:4px;}
table .br {border-bottom-right-radius:4px; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px;}