/* 
##  dreikelvin CSS Framework 4
##  
##  Author & Copyright: Robert Jung 2009
##  URL: http://design.dreikelvin.de/
##  
##  CSS for "VisualSpicer_v1"
##
##
*/
/* ## XHTML basis elements ############################ start # */

body, html { margin:0; padding:0; height:100%; }

br { clear:both; }

.hidden { display:none; }

div, section, article, footer, header, nav { margin:0; padding:0; float:none; width:100%; position:relative; display:block; }

a:active, a:focus { outline:none; }

a img { border:none; }

object { margin:0; padding:0; }

/* ## HTML basis elements ############################ end ### */

/* ## main elements ################################## start # */

#main { float:left; padding-top:75px; clear: both; width:1104px; overflow: hidden; }

#main-home { }

header { height:104px; width:100%; }

#intro { display:block; position: absolute; width: 789px; padding-top: 36px; padding-left:20px; left:271px; }

header h2, header p { margin:0; padding:0; }

header h3 { margin-top:7px; }

#index, #index a { text-indent:-99999px; height:100%; width:291px; float:left; margin:0; padding:0; }

#sidebar { width:261px; float:left; top:-30px; }

#content { width:819px; float:left; overflow: hidden; }

.thumbs { padding: 5px 0 20px 6px; width:814px !important; }

#content h2.pagetitle { margin-top:15px; }

#content-home { padding-top:79px; width:1080px; float:left; }

#sidebar h4, article.comments #respond h3 { width: 241px; padding: 5px 0 10px 0; margin:0; text-indent:22px; }

article.comments #respond h3 { padding-bottom:11px; margin-bottom:11px; text-indent:10px; width:237px; }

#content-home article .item h4 { padding-top:6px; padding-bottom:12px; text-indent:10px; width:523px; }

#content h2 { margin-top:0; padding: 0 20px 10px 20px; }

#sidebar article p { margin: 0; padding: 7px 20px 25px 20px; }

ul.info { width:auto; margin:-15px 20px 0 20px; padding:0; list-style-type: none; }

ul.info li { padding:0; margin: 0; line-height:32px; }

article.archives ul { list-style-type: none; padding:20px 0 0 0; margin: -17px 20px 20px 20px; }

article.archives ul li { margin:0; padding:0; }

article.archives ul li a:link, article.archives ul li a:active, article.archives ul li a:visited { display:block; float: left; height:46px; width:218px; display:block; overflow: hidden; position: relative; line-height:47px; margin: 0 0 10px 0; }

article.archives ul li a:link img, article.archives ul li a:active img, article.archives ul li a:visited img { filter:alpha(opacity=50); opacity: 0.5; -moz-opacity:0.5; margin-right:30px; vertical-align: top; }

article.archives ul li a:hover img { filter:alpha(opacity=100); opacity: 1; -moz-opacity:1; }

#content article { width:790px; margin:0; padding: 20px 20px 20px 17px; float:left; display:block; }

#content-home article { margin:0; padding: 0 20px 20px 20px; display:block; clear: both; }

#content-home article .item { width:540px; float: left; padding-bottom:30px; }

#content article h3 { margin:0 0 13px 0; padding:0; }

#content-home article h3 { margin:0; padding: 0 0 10px 0; }

#content article h4 { margin: 0; padding: 0 0 4px 0; }

#content-home article h4 { margin: 0; padding: 0; }

#content-home article .item h5 { margin:0; padding:10px 0 17px 0; }

#content article p, #content-home article p { margin:0; padding:0 0 20px 0; }

#content article small.meta { position: absolute; top: 27px; right:12px; padding-right: 30px; padding-bottom:5px; }

#content-home article small.meta { margin: 10px 0; float:left; width: auto; padding-right: 30px; padding-bottom:5px; }

article .col-a { float:left; width:512px; padding-right:20px; }

#content-home article .col-a { width:767px; padding-right:20px; margin-top:50px; }

#content-home article .col-a h4 { padding-bottom: 10px; }

article .col-a, article .col-b { margin-top:20px; }

#content-home article .col-b { margin-top:50px; margin-bottom:30px; }

#content-home article .col-b h4 { padding-bottom: 10px; }

article .col-b, #respond { float:left; width:230px; padding-left:20px; }

article .col-b { padding-top:0; }

article .col-b p { padding: 5px 0; }

#content article.comments { overflow: visible !important; min-height: 600px; }

#respond { position: absolute; top:20px; right:8px; }

#respond p { margin:0 0 -25px 0 !important; padding:0; }

#content article.comments ol.commentlist { width:500px; list-style-type: none; margin:-20px 0 0 0; padding:0; }

.says, .comment-edit-link { display:none; }

#content article.comments ol.commentlist li { padding: 20px 0; }

#content article.comments ol.commentlist li div.comment-author { float:left; width:auto; }

#content article.comments ol.commentlist li div.comment-author img { display:none; }

#content article.comments ol.commentlist li div.comment-meta { display:inline; margin-right:5px; }

#content article.comments ol.commentlist li div.comment-meta:before { content:" | "; margin-left:5px; color:#aaa; }

#content article.comments ol.commentlist li div.comment-meta:after { content:" | "; margin-left:5px; color:#aaa; }

#content article.comments ol.commentlist li p { margin:0; padding:10px 0 0 0; }

h3#comments { width:500px; }

#content article.catlist h3 { margin-bottom: 0; padding-bottom:15px; width: 100%; }

#content article.thumbnail { padding:0; width:258px; /*height:278px;*/ float:left; margin:15px 0 0 13px;}

#content article.thumbnail img { margin-bottom:10px; width:256px; height:192px; float:left; }

#content article.catlist { padding-right:0; width:810px; }

#slider { margin: 0 auto; position: relative; }

.scroll { height: 100px; width:250px; overflow: auto; position: relative; /* fix for IE to respect overflow */ }

.scrollContainer div.panel { padding: 0; height: auto; width: 250px; /* change to 560px if not using JS to remove rh.scroll */ }


/* ## main elements ################################### end ### */

/* ## navigation ###################################### start # */

nav { position: absolute; top:104px; left:261px; height:55px; width:819px; padding-bottom: 5px; position: absolute; z-index: 1; overflow: hidden; }

nav h3, nav h3 a { float:right; width:271px; margin:0 4px 0 0; padding:0; text-align: center; line-height: 55px; }

nav strong { text-indent:-999999px; height:50px; width:450px; float:right; display: block; clear: both; }

nav.nav-b { left:0; width:1080px; height:100px; }

/* ## navigation ###################################### end ### */


/* ## footer ########################################## start # */

footer { clear: both; width:100%; position: relative; }

footer #bottomindex { width:245px; height:106px; position: absolute; left:0; top:0; text-indent: -999999px; }

footer .inner { width:799px; left:281px; padding:46px 0 30px 0; }

footer .inner div p { margin-top:0; padding:0 0 10px 0; }

footer .inner div h4 { padding: 0 0 0 0; }

footer .inner ul { list-style-type: none; margin:0; padding:20px 0 10px 0; }

footer .inner ul li { display:inline; }

/* ## footer ########################################## end ### */


/* ## forms ########################################### start # */

fieldset { padding: 0 20px 10px 20px; margin:0; border:none; }

fieldset p { margin:0; padding:0 !important; }

fieldset .input-text, fieldset select, fieldset textarea, #author, #email, #url, #comment { padding:3px; width:212px; }

fieldset label { display:block; padding: 5px 0; }

#respond label { display:block; margin:0; padding:2px 0; }

#fieldset-contact { margin-top:-20px; }

#fieldset-contact input { margin-bottom:5px; }

/* ## forms ########################################### end ### */


/* ## Buttons ######################################## start # */

.button-send, .button-video, .button-details, #submit, .button-project { text-indent:-999999px; height:25px; margin:0; padding:0; font-size:1px; color:#fff; display:block; border:none; }

.button-send { width:104px; margin-top:7px; }

.button-video { width:190px; height: 35px; }

.button-details { width:127px; }

.button-project { width:211px; height: 35px; }

#submit { width:101px; margin-top:5px; }

.button-send:hover, .button-video:hover, .button-details:hover, #submit:hover { cursor: pointer; }

a.arrow { padding-left:23px; height: 19px; float:left; }

a.right { padding-right:23px; float:right; height: 19px; }

/* ## Buttons ######################################## end ### */

/* ## CSS ADDED BY TARAS ######################################## start ### */

.postCommentTtl { margin: 10px 0 5px 0; }

.iconsWrap { display: block; margin-top: 10px; padding-bottom: 15px; }
.iconsWrap a { display: block; width: 26px; height: 26px; margin-right: 5px; float: left; }
.iconsWrap a:hover { background-position: 0 100%; }

.iconFacebook { background: url(../img/btn_facebook.gif); text-decoration: none; }
.iconVimeo { background: url(../img/btn_vimeo.gif); text-decoration: none; }
.iconYouTube { background: url(../img/btn_youtube.gif); text-decoration: none; }
.iconFlickr { background: url(../img/btn_flickr.gif); text-decoration: none; }
.iconTwitter { background: url(../img/btn_twitter.gif); text-decoration: none; }
.iconRSS { background: url(../img/btn_rss.gif); text-decoration: none; }

.hideLable { visibility: hidden; }

.copyright { margin-top: 18px; }

.video16x9Outline { border: 1px solid #262626; width: 512px; height: 288px; }
.video4x3Outline { border: 1px solid #262626; width: 512px; height: 384px; }

.workImageOutline { border: 1px solid #262626; width:800px; }

.projectSectionTitle { font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 18pt; margin-bottom: 15px; }