/*
Theme Name: HTMLgraphic Designs
Theme URI: http://www.htmlgraphic.com
Version: 0.1
Description: This theme has been enhanced for HTMLgraphic. Custom buttons, colors, images and server side development has been edited.
Author: Jason Gegere
Author URI: http://www.gegere.com
Tags: one-column, two-columns, three-columns, fixed-width, sticky-post, threaded-comments, microformats, HTMLgraphic
HG Framework is licensed under the terms of the GNU General Public License version 2.
*/
/**
* Reset - Resets all browsers down to common default settings
*
* @credits Eric Meyer's CSS Reset
* @package HGFramework
* @subpackage Media
*/
/* Eric Meyer Reset Reloaded */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0px; padding: 0px; border: 0px; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
/* Removes dotted line when focus */
:focus { outline: none; }
/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0px; }
caption, th, td { /*text-align: left;*/ font-weight: normal; }
table, td, th { vertical-align: middle; }
/* Remove possible quote marks (") from , . */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
/* Remove annoying border on linked images. */
a img { border: none; }
/* Clearing floats without extra markup
Based on How To Clear Floats Without Structural Markup by PiE
[http://www.positioniseverything.net/easyclearing.html] */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: block; }
/* Regular clearing, just in case! */
.clear { clear: both; }
/* Apply base theme styles and colors */
/**
* Base - Sets vertical rhythm and basic overall typographic face-lift
*
* @package HGFramework
* @subpackage Media
* @beta
*/
/* Document Body */
body, input, textarea {background:#FFF url("/images/bg_body.gif") repeat; font: 13px/1.5 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, Sans-Serif;}
/* Font Styles */
.serif { font-family: Georgia, "Times New Roman", Times, serif; }
.sans-serif { font-family: "lucida sans", Verdana, Arial, Helvetica, sans-serif; }
/* Content header and footers */
.post .entry-header{padding:5px 0 10px 0;}
.entry-header{color: #666; font-size:.9em;}
.entry-header a{color:#F60;}
.entry-footer { margin: 10px 0; }
.entry-footer.tags{ background:#993333; padding:5px; color:#FFF; margin-left:-15px;}
.entry-footer .entry-tags strong, .entry-footer.tags a{color: #FFF;}
#content .entry-footer{border-bottom: #efefef 1px solid; margin-bottom:10px; padding-bottom:5px;}
p, pre, ul, ol, dl, dd, blockquote, address, table, fieldset, form, .gallery-row, .comment-list ul, .comment-list ol { margin-bottom: 10px; }
.hentry, .widget, .comment, .navigation-links { margin-bottom: 30px; }
/* Menu */
.nav { float:right; line-height: 1; font-family:'Trebuchet MS',Arial,Sans-Serif; font-size:1.3em; text-align:right;}
.nav, .nav * { list-style: none; margin-left: 0;}
.nav li {float:left; border-right: 1px solid #ccc;}
.nav li.page-item-3{ border:none;}
.nav ul li { width: 100%;}
.nav a { display: block; position: relative; padding: 8px 10px; text-transform:uppercase; }
.nav a:hover{ color:#CC0000;}
/* Hides items under top menu */
.nav ul { position: absolute; top: -9999em; width: 20em; /* left offset of submenus need to match (see below) */ }
/* Shows submenus */
.nav li:hover ul,
.nav li.nav-hover ul { left: -1px; top: 29px; /* match top ul list item height */ z-index: 99; }
/* Hides all sub items (4 levels deep) */
.nav li:hover li ul,
.nav li.nav-hover li ul,
.nav li li:hover li ul,
.nav li li.nav-hover li ul,
.nav li li li:hover li ul,
.nav li li li.nav-hover li ul { top: -999em; }
/* On :hover, displays all sub items (4 levels deep) */
.nav li li:hover ul,
.nav li li.nav-hover ul,
.nav li li li:hover ul,
.nav li li li.nav-hover ul,
.nav li li li li:hover ul,
.nav li li li li.nav-hover ul { left: 20em; /* match .nav ul width */ top: -1px; }
/* Default Skin */
.nav { }
.nav ul { border: 1px solid #ddd; border-bottom: none; }
.nav ul li a { border-bottom: 1px solid #ddd; }
.nav li:hover ul,
.nav li.nav-hover ul { background: #fff; }
.nav a { color: #666; }
.nav a:hover { text-decoration: none; /*background: #fafafa;*/ }
.nav ul a { border-right: none; }
.nav li:hover, .nav li.nav-hover,
.nav a:focus { /*background: #fafafa;*/ }
/* Menu bugfix */
.ie7 .nav:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ }
/* Links */
a { color: #2361a1; text-decoration: none; }
a:hover { text-decoration: underline; }
.entry-content a:link, .entry-content a:active, .entry-content a:visited { color: #2361a1; text-decoration: underline; }
.entry-content a:hover { text-decoration: none; }
/* Headings */
h1, h2, h3, h4, h5, h6 { font-weight: normal; clear: both; font-family:Georgia,'Times New Roman',Times,Serif; color:#333;}
h1 { font-size: 24px; line-height: 28px; padding: 5px 0px; }
h2 { font-size: 22px; line-height: 29px; padding: 5px 0px; }
h3 { font-size: 16px; line-height: 20px; padding: 5px 0px; }
#jobs h3{ text-transform:uppercase;}
h4 { font-size: 14px; line-height: 18px; padding: 5px 0px; }
h5 { font-size: 12px; line-height: 18px; padding: 5px 0px; }
h6 { font-size: 10px; line-height: 16px; }
/* Content */
#primary{margin-top:15px; background:url(../../../images/category_bg.png) no-repeat right top; }
.post .entry-title{border-bottom: #efefef 1px solid; margin-right:10px;}
.post .entry-meta{margin-right:10px;}
.article { font-family:'Lucida Grande','Lucida Sans Unicode',Geneva,Verdana,Sans-Serif; font-size:.9em; color:#333; line-height:20px; padding-right:15px;}
.page-title {font-weight: normal; margin-bottom:20px; }
.page-title span { font-style: italic; font-weight: normal; }
.search-title, .archive-title{ padding-left:15px;}
.entry-title a, .entry-title a:link, .entry-title a:active{font-size: .9em; line-height: 26px; color: #333; /* #2361a1; */ text-decoration: underline; padding:3px;}
.entry-title a:visited { text-decoration: none; background:#CCC; color: #666; text-shadow:1px 1px 0 #EFEFEF;}
.entry-title a:hover { text-decoration: none; background:#993333; color:#FFF; text-shadow:none;}
.entry-content a.red_link, .entry-content a.red_link:link, .entry-content a.red_link:active{text-decoration: none; background:#993333; color:#FFF; padding:5px 10px;}
.entry-content a.red_link:hover{ background:#CC0000;}
.dl { margin-bottom:-15px; text-align:left;}
.dl img { padding-bottom:15px; vertical-align:top;}
/* Text Elements */
address { font-style: italic; }
abbr[title], acronym[title], dfn[title] { cursor: help; border-bottom: 1px dotted #666; }
blockquote { color: #666; font-style: italic; border-left: 1px solid #ddd; margin-left: 15px; padding-left: 10px; }
strong { font-weight: bold; }
em, dfn, cite { font-style: italic; }
dfn { font-weight: bold; }
sup { bottom: 1ex; }
sub { top: .5ex; }
small { font-size: 12px; }
del { text-decoration: line-through; }
ins { text-decoration: underline; }
code, pre { line-height: 15px; }
var, kbd, samp, code, pre { font: 12px/1.4 Consolas, "Andale Mono", Courier, "Courier New", monospace; background: #fafafa; }
kbd { font-weight: bold; }
samp, var { font-style: italic; }
pre { white-space: pre; overflow: auto; padding: 10px 10px 0px 10px; border: 1px solid #ddd; clear: both; }
code { padding: 0px 3px; }
/* Lists: (ul, ol, dl) */
ul, ol, dl { margin-left: 15px; }
.nav { margin-left: 0px; }
.entry-content ul, .entry-content ol, #search-query { margin-left: 25px; }
li ul, li ol { margin-bottom: 0; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
ol { list-style-type: decimal; }
ul { list-style-type: disc; }
ul ul { list-style-type: circle; }
ul ul ul { list-style-type: square; }
dt { font-weight: bold; }
.fat li { margin-bottom: 10px; }
/* Tables */
table { /*border: 1px solid #ccc; border-width: 1px;*/ line-height: 18px; margin: 0 0 22px 0; text-align: left; padding: 0 5px; }
table .even { background: #ddd; }
caption { text-align: left; }
tr { border-bottom: 1px solid #ccc; }
th, td { padding: 5px 3px; }
/* Forms */
input, textarea, button { background: #fafafa; border-color: #aaa #ddd #ddd #aaa; border-style: solid; border-width: 1px; color: #444; font-size: 14px; }
input, textarea, button { font-family: Cambria, Georgia, "Times New Roman", Times, serif; padding: 3px; }
button { font: 12px; padding: 2px 10px; cursor: pointer; }
input:focus, textarea:focus, button:hover { background: #fff; border-color: #777 #ccc #ccc #777; }
/* bugfix */
.safari input { padding: 0px 3px; }
.chrome input { padding: 1px 3px; }
/* Comments */
/*.comment-list, .comment-list .children { list-style: none; }
.comment-list { margin-left: 10px; }
.comment { margin-bottom: 40px; }
.comment-list .children { margin-top: 40px; }
.comment-meta { margin-bottom: 10px; }
.commenter { font-size: 16px; }
.avatar { float: right; margin: 0px 0px 10px 20px; border: 1px #ddd solid; padding: 1px; }*/
/*#respond{padding-left:40px;}
#comment-form .form-section input { margin-right: 10px; }
.form-section { margin-bottom: 10px; }
.form-section label { cursor: pointer; }
#commenter-details input { margin-right: 10px; }
#allowed-tags { font: 11px Verdana, Arial, Helvetica, sans-serif; padding: 5px 10px; background: #fff; border: 1px #ddd dotted; border-top: none; width: 573px; }*/
/* Comment Reply */
#submit{cursor:pointer; font-weight:bold; background:url('/images/btn_post_comment.png') no-repeat center; border:none; padding:10px 0; color:#FFFFFF; margin:0 0 10px 0; width:240px; text-transform:uppercase;}
/* Images */
img.alignleft { float: left; margin-right: 20px; margin-top: 5px; }
img.alignright { display: block; float: right; margin-left: 20px; margin-top: 5px; }
img.aligncenter { margin-left: auto; margin-right: auto; display: block; clear: both; margin-top: 5px; }
.wp-caption { text-align: center; }
.wp-caption img { margin: 0; padding: 0; border: 0 none; }
.wp-caption .wp-caption-text { margin: 0; padding: 5px; }
.wp-smiley { max-height: 13px; margin: 0 !important; } /* Prevent the smileys from breaking line-height */
/* Gallery */
.gallery { margin: auto; }
.gallery-image { border: 2px solid #cfcfcf; margin-left: 0; }
.gallery-caption { margin-left: 0; }
.gallery-item { float: left; text-align: center; margin-left: 0; }
.gallery-columns-2 { width: 50%; }
.gallery-columns-3 { width: 33%; }
.gallery-columns-4 { width: 25%; }
.gallery-columns-5 { width: 20%; }
.gallery-columns-6 { width: 16%; }
.gallery-columns-7 { width: 14%; }
.gallery-columns-8 { width: 12%; }
.gallery-columns-9 { width: 11%; }
/* Header */
.container #logo{float:left; padding:10px 10px 0 10px; width:450px;}
.container #account{text-align:right; padding: 5px 15px 0 0; width:400px; float:right;}
.container #account a{ color:#666; text-decoration:underline;}
.container #account a:hover{ text-decoration:none;}
.container #address{float:right; text-align:right; padding:10px 15px 0 0; font-family:'Trebuchet MS',Arial,Sans-Serif; font-size:1.2em; color: #999;}
.container #social{float:left; padding-bottom:10px;}
.container #social img{padding:10px 15px;}
/* Navigation */
.page-navigation .nav-next { float:right; text-decoration:none; text-transform:uppercase;}
.page-navigation .nav-next a, .page-navigation .nav-next a:link, .page-navigation .nav-next a:active{text-decoration: none; background:#993333; color:#FFF; padding:5px 10px;}
.page-navigation .nav-next a:hover{ background:#CC0000;}
.page-navigation .nav-previous { float:left; text-decoration:none; text-transform:uppercase;}
.page-navigation .nav-previous a, .page-navigation .nav-previous a:link, .page-navigation .nav-previous a:active{text-decoration: none; background:#993333; color:#FFF; padding:5px 10px;}
.page-navigation .nav-previous a:hover{ background:#CC0000;}
.single-page-navigation .nav-next { float:left; }
.single-page-navigation .nav-previous { float:right; }
/* [gallery] + navigation clearfix */
.gallery-row:after, .navigation-links:after, .container:after, .menu:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.gallery-row, .navigation-links, .container, .menu { display: block; }
/* Basic Alignments */
.alignleft { float: left; }
.alignright { float: right; }
.aligncenter { margin-left: auto; margin-right: auto; display: block; clear: both; }
/* SEARCH BOX */
#secondary form#quick-search {margin: 10px 0 0 5px;width: 270px;height: 33px;background: #fff url(/wp-content/themes/HTMLgraphic/images/header-search.gif) no-repeat;border: none;}
#secondary form#quick-search p {border: none;}
#secondary form#quick-search input {border: none;background: transparent;color: #666;margin: 0;padding: 5px;font-size: .9em;float: left;}
#secondary form#quick-search .tbox {margin: 2px 0 0 5px;width: 220px;display: inline;font-size:1.1em;}
#secondary form#quick-search .btn {width: 24px;height: 24px;margin: 5px 0 0 0;padding: 0;}
#secondary form#quick-search label {display: none;}
#secondary #quick-search-error {color: #ea5200;font-style:italic;padding: 5px;}
/* SIDE MENU LISTS */
.widget_categories ul, ul.blogroll {text-align: left;margin: 10px 8px 8px 8px;padding: 0;border-top: 1px solid #EBEBEB;}
.widget_categories ul li,ul.blogroll li {list-style: none;background: url(/wp-content/themes/HTMLgraphic/images/dotted-lines.gif) repeat-x left bottom; padding:7px 5px; margin:0;}
* html body ul.blogroll li {height: 1%;}
.widget_categories ul li a, .widget_categories ul li a:visited, ul.blogroll li a, ul.blogroll li a:visited {color: #5D95CA; padding-left: 0;}
.widget_categories ul li a span, ul.blogroll li a span {color: #9F9F9F;font-family: Georgia, 'Times New Roman', Times, Serif;font-style: normal;font-weight: normal;font-size: .9em;}
.widget_categories ul li a:hover, ul.blogroll li a:hover {border: none;}
.widget_categories ul ul ,ul.blogroll ul {margin: 0 0 0 5px;padding: 0;}
.widget_categories ul ul li, ul.blogroll ul li {background: none;}
#secondary h3{margin-left: 10px; font-size: 2.2em;}
/* MAIL WALKTHROUGH SLIDER */
#instructions{ width:630px;}
#buttons{ width:2400px padding-top:10px; float:right;}
div#prevBtn{ width:100px; text-align:left; float:left; margin-left:20px;}
div#nextBtn{ width:100px; text-align:right; float:right; margin-right:20px;}
#buttons div#prevBtn a, #buttons div#prevBtn a:link, #buttons div#prevBtn a:active, #buttons div#nextBtn a, #buttons div#nextBtn a:link, #buttons div#nextBtn a:active{text-decoration: none; background:#993333; color:#FFF; padding:5px 10px;}
#buttons div#prevBtn a:hover, #buttons div#nextBtn a:hover{ background:#CC0000;}
#slider ul, #slider li{
margin:10px 0 0 0;
padding:0;
list-style:none;
}
#slider, #slider li{
/*
define width and height of container element and list item (slide)
list items must be the same size as the slider area
*/
width:630px;
height:655px;
overflow:hidden;
text-align:center;
}
#slider p{ text-align:left;}
/* FOURSQUARE PAGE SIDE WIDGET */
.home #stickers img { float:right; padding-right:10px;}
.home #stickers a.order, .home #stickers a.order:link, .home #stickers a.order:active{margin:10px 0 10px 0; width:200px;}
#stickers { float:right; width:200px;}
#stickers a.order,#stickers a.order:link, #stickers a.order:active{background:#933; display:block; color:#FFF; font-family:Arial, Helvetica, sans-serif; text-align:center; padding:10px 0; text-shadow:1px 1px 0 #CC0000; text-transform:uppercase; font-weight:bold; text-decoration:none; font-size:13px;}
#stickers a.order:hover{background:#CC0000;}
/* FOURSQUARE PAGE */
#foursquare #stickers a.order,#foursquare #stickers a.order:link, #foursquare #stickers a.order:active {width:180px;}
#foursquare{ padding-top:20px; font-size:1.2em;float:left; width:430px;}
#foursquare .heart{margin-bottom:-15px;}
#foursquare .more_love{ margin:20px 0 0 -60px;}
#foursquare p, #primary #foursquare div{line-height:28px; color:#333;}
#foursquare p em{ font-style:normal; color: #666; font-weight:bold;}
#secondary #foursquare{padding:0; width:300px;}
#foursquare #team{margin-top:10px; }
#foursquare #team img{float:left; }
#foursquare #team div{float:left; margin-bottom:4px;}
#foursquare #team ul{ width:220px; float:left; padding:0; margin:2px 0; list-style: none;}
#foursquare #team ul li a{ font-size:1.1em;}
#foursquare #team ul li{ float:left; padding:7px 0 0 10px; font-size:.7em; font-family: HelveticaNeue-Light, Helvetica, Neue Light; width:80%;}
#foursquare #team ul li.name{ display:block; width:150px; padding:0 0 0 10px; margin:0; text-transform: capitalize; background:#FFF; opacity:0.7;filter:alpha(opacity=70); border-bottom: #999 1px solid; border-right: #999 1px solid; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-size:.8em}
#foursquare #team .l, #foursquare #team .g{-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; }
#foursquare #team .l{background:#D1EEB5 url(../../../images/logos/foursquare_padded.png) no-repeat bottom right;}
#foursquare #team .g{background:#ABEAF8 url(../../../images/logos/foursquare_padded.png) no-repeat bottom right;}
.make_purchase, .wpsc_submit_zipcode, .wpsc_buy_button{cursor:pointer; font-weight:bold; color:#FFFFFF; margin:0 0 10px 0; width:161px; text-transform:uppercase;}
.make_purchase, .wpsc_submit_zipcode, .wpsc_buy_button {
border-top: 1px solid #1e8c1c;
background: #3cb040;
background: -webkit-gradient(linear, left top, left bottom, from(#2e332e), to(#3cb040));
background: -moz-linear-gradient(top, #2e332e, #3cb040);
padding: 7.5px 15px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
font-size: 14px;
font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
text-decoration: none;
vertical-align: middle;
}
.make_purchase, .wpsc_submit_zipcode, .wpsc_buy_button{cursor:pointer; font-weight:bold; background:url('/images/btn_post_comment.png') no-repeat center; border:none; padding:10px 0; color:#FFFFFF; margin:0 0 10px 0; width:161px; text-transform:uppercase;}
.make_purchase{margin-left:300px;}
/* HOME PAGE PORTFOLIO */
#examples{width:760px; float:left;}
.portfolio h2 {text-transform:uppercase; font-family: HelveticaNeue-Light, Helvetica, Neue Light; font-size:1em; line-height:18px; color:#333;}
.portfolio {float:left; margin:0 0 10px 10px;}
.portfolio,.expand {width:750px;}
#expand_break{width:860px;}
#expand_break span{float:right; font-weight:bold;}
#expand_break div{float:left; padding-left:10px;}
a.expand{display:block; width:560px; background:#933; cursor: pointer; color: #fff; font-family:Arial, Helvetica, sans-serif; text-transform:uppercase; padding:10px 20px; margin:20px 0; text-shadow:1px 1px 0 #CC0000; float:left;}
.expand:hover{ background:#CC0000; text-decoration:none;}
.portfolio .blurbage h2 { font-size:1.6em; color:#CC0000; font-family:Tahoma; }
.portfolio .screenshot { float:left; padding-top:10px; }
.portfolio .blurbage { float:left; width:350px; margin:10px 0 0 15px; color: #666; font-family: HelveticaNeue-Light, Helvetica, Neue Light; font-size:.9em; line-height:20px;}
.portfolio .blurbage a {padding:5px; font-weight:bold;}
.portfolio .blurbage a, .blurbage a:link, .blurbage a:active{text-decoration: none; background:#993333; color:#FFF;}
.blurbage a:link{text-shadow:1px 1px 0 #666; }
.blurbage a:visited{ background:#ccc; text-shadow:1px 1px 0 #999; color:#FFF;}
.blurbage a:hover{ background:#CC0000; text-shadow: none;}
.imagecontainer{float:left; clear:left; background: url(/images/shadowAlpha.png) no-repeat bottom right !important; background: url(/images/shadow.gif) no-repeat bottom right; margin: 10px 0 10px 10px !important; margin: 10px 0 10px 5px; width: auto;}
.imagecontainer img{display: block; position: relative; background-color: #fff; border: 1px solid #a9a9a9; margin: -6px 6px 6px -6px; padding: 4px;}
/* MAIL SERVICE EXPAND */
.expand-show0{ width:400px; margin-left:20px; background: url(/images/expand_mail.jpg) no-repeat top; padding-top:40px;}
.expand-show0 div{ padding:5px 0 20px 0;}
.expand-show0 h3{ color:#fff; font-size:1em; font-family:Arial, Helvetica, sans-serif; background:#933 url(/images/expand_mail_bg.jpg); padding:3px 0px 4px 10px; border-top: #C30 1px solid; margin:0px; cursor: pointer; text-shadow:1px 1px 0 #933;}
/* MAIL CONFIGURE */
#overview{width:500px;}
#configure{ width:460px;}
#configure table#os td {text-align:center; vertical-align:top;}
#configure table#os td ul{text-align:left; list-style-type:none;}
/* COPYRIGHT */
.footer{color:#999;}
.footer a{color:#999; text-decoration:underline;}
.footer a:hover{text-decoration:none;}
.footer #left{float:left; padding-left:20px;}
.footer #right{float:right; padding-right:20px;}
/* Basic 2 Column Layout */
/**
* Basic 2 column (content)(aside) fixed layout
*
* @package HGFramework
* @subpackage Layouts
* @beta
*/
.container { width: 960px; margin:0 auto 100px auto; background:#FFF url("/images/bg_main.jpg") no-repeat top right;}
.hfeed { width: 645px; float: left; padding-left:15px;}
.aside { width: 300px; float: right; }
.footer { clear: both; }
/* PRODUCT PAGE */
.pricedisplay{font-size:1.4em;}
.message{ width:600px; margin:20px auto 0 auto; background:url(/images/bg_product_bracket.gif) no-repeat; padding:0 0 20px 0;}
.message p{ width:500px; margin:0 auto;}
/* These empty css selectors are temporarily here for compatiability with the WordPress theme repository checklist. */
.aligncenter {} .alignleft {} .alignright {} .wp-caption {} .wp-caption-text {}