﻿*, body, html { margin: 0; border: 0; padding: 0; }
body { background: #ffffff; text-align: center; }

/* Global classes */
.ui-reset { margin: 0; padding: 0; border: 0; }
.ui-align { float: left; display: inline; }
.ui-block { display: inline-block; }
.ui-listclear { list-style: none; }
.ui-breakline { width: 100%; clear: left; float: left; display: inline; }
.ui-clear { clear: left; }
.ui-clickable { cursor: pointer; }

/* Main Screen  */
#wrapper { width: 1010px; text-align: left; margin: 0 auto 0 auto; display: block; background: #ffffff url('image/versaozero-bg.jpg') no-repeat; min-height: 850px; height: auto !important; height: 850px; }

/* Header Components */
#header { width: 100%; height: 230px; text-align: left; }
#header #left { width: 340px; height: 200px; margin: 30px 0 0 90px; }
#header #left #site-logo { width: 330px; height: 80px; background-image: url('image/versaozero-logo.gif'); background-repeat: no-repeat; }
#header #left #site-logo #versaozero-clickable { width: 330px; height: 80px; }
#header #left #site-description { width: 300px; margin: 15px 0 0 30px; }
#header #right { width: 470px;  min-height: 215px; height: auto !important; height: 215px; margin: 15px 0 0 0px; border-left: 1px solid #e7e7e7; }
#header #right #highlight { width: 450px; height: 215px; margin: 0 0 0 20px; overflow: hidden; }
#header #right #highlight img { border: 4px solid #e6f3ec; }

/* Central Components */
#main { width: 1010px; margin: 20px 0 0 0; }
#main #middle-container { width: 550px; min-height: 500px; height: auto !important; height: 500px; margin: 0 0 0 90px; }
#main #middle-container #middle-header { position: relative; width: 550px; height: 32px; margin: 0; background: #ffffff url('image/versaozero-green-bar-bg.jpg') repeat-x; }
#main #middle-container #middle-header #middle-header-title { width: 475px; height: 32px; line-height: 32px; margin: 0 0 0 25px; }
#main #middle-container #fullbanner { width: 487px; height: 60px; border: 1px solid #d7d7d7; margin: 0 0 0 30px; }
#main #middle-container #fullbanner #fullbanner-content { width: 468px; height: 60px; }
#main #middle-container #fullbanner #fullbanner-label { width: 19px; height: 60px; }

/* Sidebar Components */
#main #right-container { width: 280px; overflow: hidden; }
#main #right-container #right-content { width: 260px; margin: 0 0 0 20px; }
#main #right-container #right-content #side-categories { width: 260px; }
#main #right-container #right-content #side-categories li { width: 125px; height: 20px;	float: left; display: inline; margin-right: 5px; line-height: 20px; font-weight: bold; }
#main #right-container #right-content #form-search { width: 250px; margin: 4px; }

#main #right-container #right-content #wp-calendar { width: 260px; padding: 0; border-collapse: separate; }
#main #right-container #right-content #wp-calendar tr { width: 260px; height: 14px; }
#main #right-container #right-content #wp-calendar caption { color: #b7d13c; font-weight: bold; }
#main #right-container #right-content #wp-calendar thead { color: #b7d13c; background-color: #f7f7f5; text-align: center; }
#main #right-container #right-content #wp-calendar thead th { border: 1px solid #e7e7e5; }
#main #right-container #right-content #wp-calendar tbody { background-color: #f7f7f5; border: 1px solid #e7e7e5; text-align: center; }
#main #right-container #right-content #wp-calendar tbody td { border: 1px solid #e7e7e5; }
#main #right-container #right-content #wp-calendar tfoot #prev { text-align: left; }
#main #right-container #right-content #wp-calendar tfoot #next { text-align: right; }

/* Common Sidebar Components */
.side-content { width: 260px; float: left; clear: left; display: block; }
.side-content .form-input { width: 200px; height: 20px; display: inline; float: left; line-height: 14px; padding: 4px 0 0 10px; border-top: 1px solid #858585; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; border-left: 1px solid #858585; }
/* Opera */ @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) { head~body .side-content  .form-input { padding-top: 2px; } }
.underline-spacer { width: 260px; height: 10px; float: left; clear: left; display: block; margin: 2px 0; background: url('image/versaozero-bar-bg.jpg') repeat-x; font-size: 1px; }
.twitter-message-spacer { width: 260px; height: 1px; float: left; clear: left; display: block; margin: 2px 0; background: url('image/versaozero-bar-bg.jpg') repeat-x; font-size: 1px; }
.side-spacer { width: 260px; height: 10px; float: left; clear: left; display: block; margin: 20px 0 0 0; font-size: 1px; }

/* Footer Components */
#footer-wrapper { width: 100%; text-align: center; }
#footer-tabs { width: 530px; height: 18px; margin: 0 auto 0 auto; background-image: url('image/footer-line.png'); background-repeat: repeat-x; overflow: hidden ;text-align: left; }
#footer-tabs .tab { width: 79px; height: 18px; background-image: url('image/versaozero-footer-tab.gif'); background-repeat: no-repeat; text-align: center; }
#footer { width: 100%; height: 74px; background-color: #189cda; text-align: center; }
#footer #copyright-wrapper { width: 530px; margin: 0 auto; }
#footer #copyright-logo { width: 43px; height: 28px; margin: 27px 0 0 20px; background-image: url('image/versaozero-logo-small.gif'); background-repeat: no-repeat; }
#footer #copyright-logo #versaozero-clickable { width: 43px; height: 28px; }
#footer #copyright-description { width: 440px; margin: 20px 0 0 20px; border-left: 1px solid #65b5d6; text-align: left; padding: 5px 0 5px 5px; }

.gallery-container { width: 100%; float: left; display: inline; clear: left; }
.gallery-container  .jcarousel-clip-horizontal { width:  265px; height: 75px; }
.gallery-container  .jcarousel-clip-vertical { width:  75px; height: 245px; }
.gallery-controls { float: left; display: block; width: 270px; margin-top: 5px; font-size: 11px; text-align: center; }
.gallery-controls-command { width: 80px; margin: 0 7px 0 3px; }
.gallery-controls-previous { float: left; margin-left: 10px; }
.gallery-controls-all { margin: 0 auto 0 auto; }
.gallery-controls-next { float: right; margin-right: 10px; }

.gallery { list-style: none; margin: 0; 	padding: 0; }
.gallery li { margin: 10px 0 0 10px; padding: 0; float: left; display: inline; position: relative; width: 76px; height: 59px; }
.gallery img { border: solid 1px #c0bfbf; padding: 2px; }
.gallery span { display: none; } 
.gallery span.info { background: url(image/comlimao-form-bg-button-info.png) no-repeat; }
.gallery a { text-decoration: none; }
.gallery a:hover{ background: transparent; }
.gallery a:hover span { width: 51px; height: 18px; display: block; position: absolute; top: 22px; left: 15px; cursor: pointer;}

/* Post Components */
.post { width: 465px; margin: 0 0 0 90px; position: relative; }
.post .post-date { width: 68px; height: 50px; background-image: url('image/versaozero-post-date.gif'); text-align: center; margin: 0 0 0 -90px; position: absolute; top: 0; left: 0; }
.post .post-title { width: 465px; margin: 0; }
.post .post-subtitle, .post .post-body, .post .post-functions, .post .post-tags { width: 460px; margin: 10px 0 0 0; }

.post .post-body { overflow: hidden; }
.post .post-body .post-gallery ul { list-style: none; }
.post .post-body .post-gallery ul li { width: 70px; height: 53px; display: inline; overflow: hidden; padding: 0; margin: 2px; }
.post .post-body .post-gallery ul li a { }
.post .post-body .post-gallery ul li a:hover { border: none; }
.post .post-body .post-gallery ul li a img { margin: 0; padding: 0; border: 2px solid #f5f5f5; }
.post .post-body .post-gallery ul li a:hover img { border: 2px solid #189cda; }

.post .post-functions { width: 460px; height: 32px; background: url('image/post-functions-bg.gif') repeat-x; }
.post .post-functions .post-rating { width: 200px; height: 20px; line-height: 20px; margin: 5px 0 0 0; padding: 0; overflow: hidden; }
.post .post-functions .post-sharing { width: 245px; height: 20px; line-height: 20px; margin: 5px 0 0 0; }

.icons-sharing { display: inline; }
.icons-sharing li { list-style: none; float:left; width:20px; height:20px; display:block; background:transparent; overflow:hidden; background-image: url('image/icon-sharing.gif'); background-repeat: no-repeat; }
.icons-sharing li a, .icons-sharing li a:hover, .icons-sharing li a:active, .icons-sharing li a:visited, .icons-sharing li a:link { display: block; float: left; width:20px; height:20px; text-decoration: none; } 
.icons-sharing li.icon-twitter { background-position: 0 0; }
.icons-sharing li.icon-delicious { background-position: -20px 0; }
.icons-sharing li.icon-technorati { background-position: -40px 0; }
.icons-sharing li.icon-digg { background-position: -60px 0; }
.post-spacer { float: left; clear: left; display: inline; width: 300px; height: 20px; }

.post-dotted-spacer { width: 490px; height: 22px; float: left; clear: left; display: inline; margin: 20px 0 0 19px; background-image: url(  'image/comlimao-bg-spacer.gif' ); background-repeat: repeat-x; font-size: 1px; }

.post-comment { width: 465px; margin-left: 90px; }
.post-comment .form-label { height: 22px; line-height: 22px; }
.post-comment .form-input { height: 18px; line-height: 16px; padding: 2px 0 0 2px; font-size: 12px; }
.post-comment .form-textarea { height: 148px; line-height: 16px; padding: 2px 0 0 2px; font-size: 12px; } 
.post-comment .form-border { border-top: 1px solid #858585; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; border-left: 1px solid #858585; } 

.post-comment .observation , .post-comment .title { display: block; }

.post-comment .comment { width: 465px; margin: 18px 0 0 0; }
.post-comment .comment .author { width: 465px; }
.post-comment .comment .content { width: 455px; margin: 10px 0 0 0; padding: 10px 0 10px 8px; border-left: 1px solid #d3d3d3; word-wrap: break-word; }

.more { width: 490px; margin-left: 9px; }
.more .head { margin-left: 10px; }
.more .media  { width: 490px; margin: 0; padding: 0; }
.more .media .item { float: left; display: inline; width: 106px; margin: 10px 0 0 10px; padding: 0; text-align: center; }
.more .media .item img { border: solid 1px #c0bfbf; padding: 2px; margin: 0 auto 0 auto; }
.more .post  { margin: 0; padding: 0; }
.more .post .item { margin: 10px 0 0 10px; padding: 0; float: left; display: inline; }
.more .post .item .date { margin-top: 10px; width: 38px; height: 49px; background-image: url('image/post-date.png'); text-align: center; }
.more .post .item .description { margin: 0 0 0 6px; width: 420px; padding: 0; float: left; display: inline; border-lefT: 1px solid #d3d3d3; padding: 10px 0 10px 6px; }

#paging { width: 465px; height: 55px; text-align: center; }
