/*
Theme Name: Social-Commerce.pl
Theme URI: 
Description: Social-Commerce.pl Theme
Version: 1.0
Author: WeAreMedia
Author URI: http://www.wearemedia.pl
*/
/*
    01. General
        01. Reset
        02. Tools
    04. Content Elements
        01. Post
    05. Widgets
    
    08. Colour Scheme
    09. Development
*/



/* ----- Reset ----- */
@import url('reset.css');


/* ----- Tools ----- */
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }





/* ----- Basic typography ----- */
body { font-size: 12px; line-height: 18px; font-weight: normal; font-family: "Trebuchet MS", Verdana, sans-serif; }
h1 { font-size: 24px; line-height: 36px; font-weight: bold; margin: 0 0 18px 0; }
h2 { font-size: 18px; font-weight: bold; margin: 0 0 18px 0; }
h3 { font-size: 14px; font-weight: bold; margin: 0 0 18px 0; }
h4 { font-size: 12px; font-weight: bold; }
p { margin: 0 0 18px 0; }
ul { margin: 0 0 18px 2em; list-style-type:disc; }
ol { margin: 0 0 18px 0; }
a { text-decoration: none; }


/* ----- Basic structure ----- */
#page { width: 944px; margin: 0 auto; }
#header { height: 158px; position: relative; }
#content { }
  #content #main { width: 707px; margin: 0 1px 0 0; float: left; display: inline;  }
  #content #sidebar { width: 235px; margin: -125px 1px 0 0; float: left; display: inline; }
#footer { overflow: hidden; margin: 0 0 18px 0; padding: 20px 0 0 0; }
  #footer div.widget { width: 235px; float: left; display: inline; margin: 0 1px 0 0; padding: 18px 0 0 0; }


/* ----- Navigation ----- */
#mainNav { background: #404040 url(./images/mainNav.png) repeat-x; width: 707px; height: 33px; position: absolute; left: 0; top: 0; }
  #mainNav ul { margin: 0; list-style-type: none; overflow: hidden; padding: 0 5px; }
    #mainNav ul li { float: left; display: inline; line-height: 33px; font-weight: bold; }
    #mainNav ul li.cat-item-9 a { font-style: italic; }
   

#toolsNav { width: 205px; padding: 0 15px; height: 125px; position: absolute; left: 0; top: 33px; }
  #toolsNav ul { margin: 0; list-style-type: none; overflow: hidden; width: 100%; line-height: 125px; }
    #toolsNav ul li { float: left; display: inline; margin: 0 15px 0 0; }
      #toolsNav ul li a { padding: 0 8px 0 0; }

/* ------ Forms ----- */
form {}
  form div.unit { margin: 0 0 9px 0; }
  form label { display: block; font-weight: bold; }
    form label span { font-weight: normal; }
  form input { width: 324px; height: 21px; border: none; background: url(./images/form_input.png) 0 0 no-repeat; }
  form input#submit { margin: 4px 0 0 0; width: auto; height: auto; background: none; }
  form textarea { width: 441px; height: 105px; border: none; background: url(./images/form_textarea.png) 0 0 no-repeat; }


#basicSearch { background: #404040 url(./images/mainNav.png) repeat-x; width: 220px; height: 27px; position: absolute; right: 1px; top: 0; padding: 6px 0 0 15px; }
  #basicSearch input { float: left; display: inline; }
    #basicSearch #s { width: 124px; padding: 0 5px 0 20px; height: 18px; padding-top: 3px; border: none; margin: 0 4px 0 0; background: url(./images/input_basicSearch.png) no-repeat; }
    #basicSearch #searchsubmit { width: auto; }


/* ==================================================================================================== */
/* =====>>> Content Elements <<<======================================================================= */
/* ==================================================================================================== */

/* ----->>> Post <<<----- */
.post { padding: 286px 0 0 0; position: relative; }
  .post a { text-decoration: underline; }
  .post h1 { margin: 0 0 0 118px; padding: 0 15px; }
  .post .photo { position: absolute; left: 0; top: 0; width: 707px; height: 270px; background: url(./images/imageholder_big.png) no-repeat; }
    .post .photo span { position: absolute; left: 0; top: 250px;  width: 707px; height: 20px; display: block; }
  .post .meta { margin: 0 0 0 118px; padding: 0 15px; color: #b1b3b4; }
    .post .meta em { color: #404040; font-style: normal; }
  .post .entry { margin: 0 0 0 118px; padding: 0 15px; }
  .post .taxonomy { padding: 0 133px; border-top: 1px solid #ececec; }
    .post .taxonomy .categories { margin: 0; }
    
  .post .socialBookmarking { margin: 0 118px; padding: 0 15px; overflow: hidden; }
    .post .socialBookmarking p { float: left; display: inline;  }
    .post .socialBookmarking ul { float: left; display: inline; margin-left: 1em; list-style-type: none; overflow: hidden; }
      .post .socialBookmarking ul li { float: left; display: inline; margin: 0 5px 0 0; }

.comments-template { }
  .comments-template #comments { margin-left: 118px; margin-right: 118px; padding: 0 15px; }
  .comments-template .commentlist { margin: 0 118px; padding: 0 15px; }
  .comments-template #respondBlock { background: #ececec; padding: 18px 133px; margin: 0 0 18px 0; }


body.archive .post, 
body.search .post,
body.blog .post 
{ padding: 0 15px 0 251px; margin-bottom: 36px; }
  body.archive .post h2, 
  body.search .post h2,
  body.blog .post h2   
  { margin-top: 18px; }
  body.archive .post .photo, 
  body.search .post .photo, 
  body.blog .post .photo 
  { width: 235px; height: 83px; background: none; }
  body.archive .post .meta, 
  body.search .post .meta,
  body.blog .post .meta   
  { margin: 0; padding: 0; }
  body.archive .post .more, 
  body.search .post .more,
  body.blog .post .more   
  { }
    body.archive .post .more a, 
	body.search .post .more a,
    body.blog .post .more a 	
	{ display: block; width: 92px; height: 21px; position: relative; }
      body.archive .post .more a span, 
	  body.search .post .more a span,
      body.blog .post .more a span   	  
	  { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(./images/button_secondary_medium_more.png) no-repeat; }
        body.archive .post .more a:hover span, 
		body.search .post .more a:hover span,
        body.blog .post .more a:hover span 
		{ background: url(./images/button_secondary_medium_more.png) 0 -21px no-repeat; }

.latestPosts .post { padding: 0 0 0 251px; margin-bottom: 36px; }
  .latestPosts .post h2 { margin-top: 18px; }
  .latestPosts .post .photo { width: 235px; height: 83px; background: none; }
  .latestPosts .post .meta { margin: 0; padding: 0; }
  .latestPosts .post .more { }
    .latestPosts .post .more a { display: block; width: 92px; height: 21px; position: relative; }
      .latestPosts .post .more a span { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(./images/button_secondary_medium_more.png) no-repeat; }
        .latestPosts .post .more a:hover span { background: url(./images/button_secondary_medium_more.png) 0 -21px no-repeat; }



.featuredPosts { }
  .featuredPosts .post { width: 707px; height: 250px; overflow: hidden; }
    .featuredPosts .post .nonPhoto { display: none; position: absolute; left: 236px; top: 0; z-index: 20; width: 205px; padding: 18px 15px 0 15px; height: 250px; overflow: hidden; background: #ffcc00; }
      .featuredPosts .post .nonPhoto h2 { font-weight: bold; }
      .featuredPosts .post .nonPhoto .more {}
      .featuredPosts .post .nonPhoto .more a { display: block; width: 92px; height: 21px; position: relative; }
        .featuredPosts .post .nonPhoto .more a span { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(./images/button_secondary_medium_more.png) no-repeat; }
        .featuredPosts .post .nonPhoto .more a:hover span { background: url(./images/button_secondary_medium_more.png) 0 -21px no-repeat; }
    .featuredPosts .post .photo { z-index: 10; }

.simpleSlider { width: 707px; height: 250px; padding: 0 0 20px 0; overflow: hidden; position: relative; background: url(./images/body.png) repeat-y; }
  .simpleSlider .controls { width: 30px; position: absolute; left: 471px; top: 0; z-index: 100; }
    .simpleSlider .controls a { display: block; width: 29px; height: 29px; line-height: 29px; margin: 0 0 1px 1px; text-align: center; background: #404040; color: #ffcc00; }
    .simpleSlider .controls a.activeSlide { width: 30px; margin-left: 0; background: #ffcc00; color: #404040; }



.categoryPosts { overflow: hidden; padding: 18px 0 0 0; margin: 0 0 18px 0; border: 1px solid #b1b3b4; border-width: 1px 0 0 0; }
  .categoryPosts .categoryPostsBlock { width: 353px; float: left; display: inline; }
  .categoryPosts h3 { font-size: 18px; font-weight: normal; margin: 0 0 18px 0; }


ul.linkCollection { margin-left: 0; list-style-type: none; }
  ul.linkCollection li { margin: 0 0 6px 0; }
    ul.linkCollection li a { background: url(./images/icon_small_arrow.png) 0px 2px no-repeat; padding: 0 0 0 20px; }
      ul.linkCollection li a:hover { background-color: #ffcc00; }

input.widgetLink { margin: 9px 0 18px 0; width: 314px; padding: 0 5px; height: 21px; border: 5px solid #ececec; background: url(./images/form_input.png) 0 0 no-repeat; }


.seeRecentPosts { padding: 0 0 0 251px; }
  .seeRecentPosts a { display: block; width: 132px; height: 21px; position: relative; }
    .seeRecentPosts a span { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(./images/button_secondary_medium_more_posts.png) no-repeat; }
    .seeRecentPosts a:hover span { background: url(./images/button_secondary_medium_more_posts.png) 0 -21px no-repeat; }

/* ==================================================================================================== */
/* =====>>> Widgets <<<================================================================================ */
/* ==================================================================================================== */
#sidebar ul { margin-left: 0; list-style-type: none; }
.widget h4.title { font-size: 18px; margin: 0 0 18px 0; }

ul.blogroll { margin-left: 0; list-style-type: none; }
  ul.blogroll li { margin: 0 0 6px 0; }
    ul.blogroll li a { background: url(./images/icon_small_arrow.png) 0px 2px no-repeat; padding: 0 0 0 20px; }
      ul.blogroll li a:hover { background-color: #ffcc00; }

#stayTuned { padding: 25px 10px 0 15px; height: 100px; }
  #stayTuned ul { margin: 0; overflow: hidden; }
    #stayTuned ul li { float: left; display: inline; margin: 0 5px 0 0; }
      #stayTuned ul li a { display: block; width: 30px; height: 30px; overflow: hidden; position: relative; }
        #stayTuned ul li a span { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
        #stayTuned ul li.facebook a span { background: url(./images/icons_staytuned.jpg) 0 0 no-repeat; }
        #stayTuned ul li.goldenline a span { background: url(./images/icons_staytuned.jpg) -35px 0 no-repeat; }
        #stayTuned ul li.flaker a span { background: url(./images/icons_staytuned.jpg) -70px 0 no-repeat; }
        #stayTuned ul li.youtube a span { background: url(./images/icons_staytuned.jpg) -105px 0 no-repeat; }
        #stayTuned ul li.slideshare a span { background: url(./images/icons_staytuned.jpg) -140px 0 no-repeat; }
        #stayTuned ul li.rss a span { background: url(./images/icons_staytuned.jpg) -175px 0 no-repeat; }

#text-3, #text-4, #text-8 { padding: 0 15px; }
#linkcat-2 { padding: 0 15px; }

/* ----- Copyrights ----- */
#text-5 { color: #b1b3b4; }
  #text-5 h4 { display: none; padding: 0 15px; }
    #text-5 .textwidget { padding: 0 15px; }

/* ----- Widget - Block ----- */
#text-6 { background: #ffcc00; }
  #text-6 h4 { padding: 0 15px; }
  #text-6 p.downloadWidget { padding: 0 15px; }
    #text-6 p.downloadWidget a { display: block; width: 205px; height: 153px; overflow: hidden; position: relative; }
      #text-6 p.downloadWidget a span { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(./images/downloadWidget.png) no-repeat; }


/* ----- RSS - Block ----- */
#text-7 {}
  #text-7 h4 { padding: 0 15px; }
    #text-7 .textwidget { padding: 0 15px; }
ul.feedCollection { margin: 0; list-style-type: none; }
  ul.feedCollection li { margin: 0 0 6px 0; }
    ul.feedCollection li a { background: url(./images/icon_small_rss.png) 0px 2px no-repeat; padding: 0 0 0 20px; }



/* ----- WP-Cumulus ----- */
#wp-cumulus { width: 205px !important; padding: 0 15px; }


/* ==================================================================================================== */
/* =====>>> Color Scheme <<<========================================================================== */
/* ==================================================================================================== */
body {  background: white url(./images/body.png) center top repeat-y; color: #404040; }
a { color: #404040; }
a:hover { background: #ffcc00; }

#header { background: url(./images/header.png) 471px 33px no-repeat; }
  #id { background: #ffcc00; width: 235px; height: 125px; position: absolute; left: 236px; top: 33px; }
  #id span { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(./images/logo.png) no-repeat; }

#mainNav ul li a { color: white; padding: 0 10px; }
  #mainNav ul li a:hover { color: #ffcc00; background-color: transparent; }

#toolsNav ul li a { color: #b1b3b4; background: url(./images/icon_small_toolsNavBullet.png) right 7px no-repeat; }
  #toolsNav ul li a:hover { background-color: #ffcc00; color: #404040; }

#content { background: white; }
 .post .photo span { background: url(./images/body.png) repeat-y; }


#footer { background: url(./images/footer.png) no-repeat; }



/* ==================================================================================================== */
/* =====>>> Development <<<============================================================================ */
/* ==================================================================================================== */
//#page { position: relative; }
//#devGrid { position: absolute; left: 0; top: 0; width: 100%; height: 10000px; z-index: 10000; background: url(./images/devGrid.png) repeat-y; }