/*
Theme Name: Webfolio
Author: Site5.com
Author URI: http://www.site5.com/
*/

/* MAIN STYLES
-------------------------------------------*/
* { margin: 0; padding: 0; }
body, html { font-weight:normal; font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#333; background:#EFEFEF url(images/bk_body.jpg) repeat-x; line-height:130%; }
ul { list-style:none; }
a { text-decoration:none; }
a:hover { text-decoration:underline; }
a:focus { outline:none; }
p { margin:0 0 1em; }
h1, h2, h3 { font-size:28px; letter-spacing:-1px; line-height:100%; padding-bottom:15px; }
h1 { padding-top:10px; }
h2 { font-size:20px; padding-top:10px; font-weight:normal; }
h3 { font-size:16px; padding-top:10px; }
/* LAYOUT STRUCTURE
--------------------------------------------------*/
#wrapper { margin:0 auto; width:910px; }
#header { height:165px; position:relative; z-index:99; padding:0 8px; }
#content { padding-bottom:20px; }
#colLeft { width:615px; float:left; padding-left:3px; padding-top:15px; }
/* page container for Portfolio */
#colFull { padding-left:0px; padding-top:15px; width:925px; }
#colRight { padding:8px; float:left; width:256px; border:1px solid #ccc; background:#fff; margin-left:17px; margin-top:15px; font-size:12px; }
#colRight #inner { padding:10px; background:url(images/bk_colright.jpg); }
#footer { background:#000 url(images/bk_footer.jpg) 0 0 repeat-x; margin:0; color:#666; position:relative; font-size:11px; padding-bottom:20px; }
#innerFooter { width:950px; margin:0 auto; padding:15px 0 25px; position:relative; }
/* HEADER ELEMENTS
------------------------------------------*/
/* -- logo --*/
#logo { position:absolute; top:0; left:5px; color:#FFF; }
#logo a img { border:none; vertical-align:middle; margin-right:20px; }
#logo span { display:none; font-size:16px; padding-top:15px; }
/* -- search --*/
#searchTop {background:url(images/bk_search.jpg) 0 0 no-repeat;height:69px; padding:5px; position:absolute; right:0; top:38px; width:470px; }
#site5top { position:absolute; top:12px; right:0; }
/* -- main menu --*/

#topMenu { width:910px; height:53px; position:absolute; top:108px; left:0; }
#topMenu ul.sf-menu { padding-top:18px; padding-left:3px; }
#topMenu ul.sf-menu li { float:left; padding:0 15px; font-size:12px; }
#topMenu ul.sf-menu li a { text-decoration:none; text-transform:uppercase; }
#topMenu ul.sf-menu li li a { padding:0 12px; }
#topMenu ul.sf-menu li a:hover { text-shadow:none; }
#topMenu ul.sf-menu li li { padding:0; padding-top:2px; border:none; }
#topMenu ul.sf-menu li ul.children { padding:0; background:url(../images/green/bk_submenu.png) 0 -4px repeat-x; }
#topMenu ul.sf-menu li ul.children li, #topMenu ul.sf-menu li.page_item ul li { position:relative; line-height:100%; height:28px; text-transform:none; }
#topMenu ul.sf-menu li ul.children li a, #topMenu ul.sf-menu li.page_item ul li a { text-decoration: none; display:block; padding-top:7px; line-height:100%; border:none; text-transform:none; }
#topMenu ul.sf-menu li ul.children li ul.children a { text-decoration: none; position:relative; border:none; }
#topMenu ul.sf-menu li ul.children, #topMenu ul.sf-menu li.page_item ul { margin-top:-4px; }
#topMenu ul.sf-menu li ul.children ul.children { margin:0 0 0 25px; }
.rssTag { position:absolute; width:50px; height:41px; background:url(images/ico_rss.png) 0 0 no-repeat; text-indent:-9999px; right:10px; top:108px; z-index:9999; }
/* CONTENT ELEMENTS
----------------------------------------------*/
#colFull h1 { text-transform:capitalize; position:relative; }
#colFull h1 ul { position:absolute; right:15px; top:20px; }
#colFull h1 ul li { float:left; padding:0 10px; border-left:1px solid #ccc; line-height:100%; font-size:12px; }
#colFull h1 ul li a { font-size:12px; font-weight:normal; color:#0093CA; letter-spacing:normal; }
#colFull h1 ul li a:hover { text-decoration:underline; }
#archive-title, .searchQuery { padding:0 0 10px 0; font-size:12px; margin-bottom:5px; background:url(images/bk_separattor_horiz.jpg) 0 100% repeat-x; }
.alignleft { float:left; margin:5px 10px 5px 0; }
.alignright { float:right; margin:5px 0 5px 10px; }
#homeBoxes { padding-top:15px; }
#homeBoxes .homeBox { width:276px; float:left; margin-right:40px; background:url(images/bk_dotted_thick.png) 0 0 repeat-x; font-size:12px; }
#homeBoxes .last { margin-right:0; }
#homeBoxes .homeBox h2 { padding:15px 0 15px; }
.more-link { display:block; width:92px; height:30px; padding-left:12px; padding-top:2px; font-size:12px; clear:both; }
.more-link:hover { text-decoration:none; }
.blogPost { background:url(images/bk_separattor_horiz.jpg) 0 100% repeat-x; padding-bottom:5px; margin-bottom:10px; }
.blogPost .meta { background:url(images/bk_meta.jpg) 1px 0 repeat-x; height:34px; font-size:11px; line-height:34px; padding-left:48px; position:relative; margin-bottom:20px; text-shadow:#efefef 1px 1px; }
.blogPost .meta img { vertical-align:middle; margin-right:3px; }
.blogPost .meta .date { position:absolute; left:1px; top:-3px; width:39px; height:44px; text-align:center; text-transform:uppercase; padding-right:1px; line-height:155%; text-shadow:none; }
.blogPost .meta .date strong { font-size:20px; }
#colLeft .blogPost p img { margin:0 10px 10px 0; border:8px solid #fff; }
/* share icons */
#colLeft .social { padding:10px 0; background:url(images/bk_separattor_horiz.jpg) 0 100% repeat-x; margin-bottom:10px; }
#colLeft .social a img { padding:0; border:none; background:none; vertical-align:middle; }
#colLeft .social strong { padding-right:10px; }
#colLeft ul { list-style:disc; list-style-position:inside; }
/* COL RIGHT
-------------------------------------------*/

#colRight h2 { text-transform:uppercase; font-size:15px; padding:0; margin:0; padding-bottom:5px; font-weight:bold; }
#colRight ul { padding-bottom:15px; }
#colRight ul li { border-bottom:1px solid #D1D1D1; border-top:1px solid #fff; padding:7px 0 7px 12px; }
/* FOOTER ELEMENTS
--------------------------------------------*/

.textwidget { padding-top:10px; }
#footer .footerBox { width:276px; float:left; margin:0 20px; background:url(images/bk_dotted_thick.png) 0 0 repeat-x; font-size:12px; color:#515151; }
#footer .footerBox { background:none; }
#footer .footerBox h2 { padding-bottom:10px; }
#footer .last { margin-right:0; }
#footer .footerBox ul li { padding:7px 0; padding-left:12px; }
#footer .footerBox ul li a { text-decoration:none; }
#footer .footerBox ul#social li { padding:10px 0; padding-left:40px; line-height:110%; }
#footer .footerBox ul#social li a { font-size:11px; }
#footer .footerBox ul#social li.twitter { background:url(images/ico_twitter.png) 0 50% no-repeat; }
#footer .footerBox ul#social li.facebook { background:url(images/ico_facebook.png) 0 50% no-repeat; }
#footer .footerBox ul#social li.flickr { background:url(images/ico_flickr.png) 0 50% no-repeat; }
#footer .footerBox ul#social li.linkedin { background:url(images/ico_linkedin.png) 0 50% no-repeat; }
#copy { clear:both; padding:20px 0 10px 20px; }
#footer ul#footerMenu { padding-left:20px; }
#footer ul#footerMenu li { float:left; padding:0 10px; border-left:1px solid #292929; line-height:100%; }
#site5bottom { position:absolute; right:97px; bottom:15px; }
/* HOME SLIDER
-----------------------------------------------*/

#slider { padding:7px 0; height:363px; }
.panel .right { padding:10px; float:left; width:252px; border:1px solid #ccc; background:#fff; }
.panel .right .text { padding:10px; font-size:14px; background:url(images/bk_slider_text.jpg) 100% 0 no-repeat; height:317px; }
.panel .right .text .featured { font-size:11px; }
.panel .right .text .featured img { margin-right:5px; }
.panel .right .text p { display:block; background:url(images/bk_dotted.png) 0 0 repeat-x; margin:0; padding-top:10px; }
.panel .right .text h1, .panel .text h1 a { font-size:22px; font-weight:normal; margin-bottom:0; line-height:110%; padding:8px 0; color:#333; }
.panel .image { float:left; padding:10px; border:1px solid #ccc; background:#fff; margin-right:13px; }
/* CAROUSEL
---------------------------------------------*/

.stepcarousel { float:left; position: relative; /*leave this value alone*/ overflow: hidden; /*leave this value alone*/ width: 100%; /*Width of Carousel Viewer itself*/ height: 359px; /*Height should enough to fit largest content's height*/ ; }
.stepcarousel .belt { position: absolute; /*leave this value alone*/ left:0; top: 0; }
.stepcarousel .panel { float: left; /*leave this value alone*/ overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/ width: 910px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */ position:relative; }
/*COMMENTS
---------------------------------------------*/

#colLeft h2.comments { padding-bottom:20px; background:url(images/bk_separattor_horiz.jpg) 0 100% repeat-x; }
#colLeft ul.commentlist { list-style-type:none; background:url(images/bk_separattor_horiz.jpg) 0 100% repeat-x; padding-bottom:20px; margin-bottom:15px; }
#colLeft ul.commentlist li { margin-top:15px; }
#colLeft ul.commentlist li .text { position:relative; padding:12px; background:#fff; border:1px solid #D1D1D1; }
#colLeft ul.commentlist li .text .topLeft { position:absolute; top:-1px; left:-1px; width:12px; height:12px; background:url(images/bk_comment_top_left.jpg) 0 0 no-repeat; }
#colLeft ul.commentlist li .text .topRight { position:absolute; top:-1px; right:-1px; width:12px; height:12px; background:url(images/bk_comment_top_right.jpg) 0 0 no-repeat; }
#colLeft ul.commentlist li .text .bottomRight { position:absolute; bottom:-1px; right:-1px; width:12px; height:12px; background:url(images/bk_comment_bottom_right.jpg) 0 0 no-repeat; }
#colLeft ul.commentlist li .text .bottomLeft { position:absolute; bottom:-1px; left:-1px; width:12px; height:12px; background:url(images/bk_comment_bottom_left.jpg) 0 0 no-repeat; }
#colLeft ul.commentlist li .text .bubble { position:absolute; top:-9px; left:16px; width:16px; height:10px; background:url(images/bk_bubble.png) 0 0 no-repeat; }
#colLeft ul.commentlist .commentmetadata span { font-size:12px; }
#colLeft ul.commentlist li .avatar { border:5px solid #FFF; padding:1px; background:#fff; float:left; margin-right:5px; margin-bottom:5px; }
#colLeft ul.commentlist li em { font-size:12px; padding-top:5px; }
#colLeft ul.commentlist li ul.children { padding-left:35px; }
#colLeft ul.commentlist li .reply { font-size:12px; }
#colLeft h2.postComment { background:url(images/ico_arrow_post.png) 3px 50% no-repeat; padding-left:28px; }
/* FORMS
-------------------------------------------*/


#searchform input { border:none; background:#000; padding:6px 4px 7px; color:#999; width:165px; float:left; }
#searchform input#searchsubmit { width:72px; height:30px; border:none; background:url(images/but_search.jpg) 0 0 no-repeat; cursor:pointer; padding:0 0 0 4px; text-align:left; color:#ccc; font-size:11px; }
/* post comment */

#commentform p { margin:0; }
#commentform label { display:block; padding:5px 0 2px; }
#commentform input, #commentform textarea { border:1px solid #fff; border-top:1px solid #ddd; border-left:1px solid #ddd; padding:7px; font-family:Arial, Helvetica, sans-serif; width:300px; font-size:12px; }
#commentform textarea { width:600px; }
#commentform input#submit { border:none; width:80px; height:34px; margin-top:15px; background:url(images/but_send.png) 0 0 no-repeat; color:#fff; }
/* contact */

#contact label { display:block; padding:8px 0 2px; }
#contact input, #contact textarea { border:1px solid #fff; border-top:1px solid #ddd; border-left:1px solid #ddd; padding:5px; font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#666; width:300px; }
#contact textarea { width:500px; }
#contact input.submit { border:none; width:80px; height:34px; margin-top:20px; background:url(images/but_send.png) 0 0 no-repeat; color:#FFF; }
.errormsg, .successmsg { background:#FEF4F1; border:1px solid #F7A68A; color:#DA4310; padding:10px; }
.successmsg { background:#F5FAF1; border:1px solid #C2E1AA; color:#8FA943; }
/* CLEARING
---------------------------------------------------*/
.clearfix:after { content: "."; display:block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

.clear { clear: both; }
.noclear { clear: none; }
a.featured-image-frame { display:block; height:337px; overflow:hidden; }