/*
Theme Name: The Junction
Theme URI: http://www.webdesign-buero-berlin.de
Description: Theme for www.thejunction.de Blog
Author: Julia Braeunig
*/

* {
margin: 0;
padding: 0;
}


body {
background: #fff url(images/bg_content.jpg) repeat top left;
font-family: Courier New, Courier, serif;
font-size: 10pt;
line-height: 14pt;
color: #777;
z-index: 1;
width: 100%;
height: 100%;
}

p {
margin-bottom: 10px;
}

.separator {
display: block;
background: url(images/separator.gif) repeat-x top left;
height: 6px;
margin: 30px 0;
}

#bg-left {
position: absolute;
top: 0px;
left: 0px;
background: url(images/bg_seite.png) repeat-y top left;
width: 401px;
display: block;
float:left;
height: 100%;
z-index: -1 !important;
}

#bg-right {
position: absolute;
top: 0px;
right: 0px;
background: url(images/bg_seiterechts.png) repeat-y top right;
width: 401px;
display: block;
height: 100%;
float:left;
z-index: -1;
}

#contentwrapper {
width: 100%;
height: 100%;
position: relative;
float: left;
display: block;
}

#wrapper {
width: 1300px;
margin: 0 auto;
}

#column-left {
float: left;
width: 200px;
margin-right: 50px;
z-index: 100 !important;
}

#column-right {
float: left;
width: 1050px;
z-index: 100 !important;
}

a:link, a:visited {
text-decoration: none;
color: #222;
font-weight: bold;
}

a:hover, a:active {
text-decoration: none;
color: #777;
font-weight: bold;
}

.column a:hover, .column a:active, .column-both a:hover, .column-both a:active {
text-decoration: none;
color: #fff !important;
font-weight: bold;
background: #0ed8c3;
}

.column a:hover img, a img:hover {
background: transparent !important;
}

ul {
list-style: none;
margin: 0;
}


/* /////////////////// sidebar ///////////////////// */

#tags {
float: left;
width: 200px;
margin-top: 106px;
}

.tagcloud {
text-align: center;
width: 200px;
}

.tagcloud a {
font-weight: normal;
}

.tagcloud a:hover {
color: #0ed8c3 !important;
}

#suche {
float: left;
width: 200px;
margin-top: 50px;
}

#facebook {
float: left;
width: 200px;
margin: 50px 0;
}

.facebookwrap {
margin: 10px 0;
height: 40px;
float:left;
display: block;
width: 400px;
}

#s {
border: 1px solid #cecece;
padding: 2px 3px;
font-family: Courier New, Courier, serif;
color: #777;
width: 165px;
float: left;
margin-right: 3px;
height: 15px;
}

.ngg-gallery-thumbnail img {
width: 100px !important;
height: 75px;
}

#searchsubmit {
float: left;
width: 21px;
border: 0px;
height:21px;
background: url(images/suchbutton.png) no-repeat top left;
}

#searchsubmit:hover {
background-position: 0 -21px;
}

.commentlink {
color: #222 !important;
}

.logo {
margin-left: -80px;
z-index: 100 !important;
margin-top: 120px;
}

h3 {
color: #0ed8c3;
font-size: 14pt;
line-height: 17pt;
margin-bottom: 10px;
font-weight: normal;
text-transform: uppercase;
}

.icon {
width: 32px;
height 32px;
float: left;
margin: 3px;
}

.icon:hover {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
filter: alpha(opacity=70);
opacity: 0.70;
}

/* /////////////////// content ///////////////////// */

#slideshow {
width: 1048px;
height: 280px;
display: block;
float:left;
border: 1px solid #cecece;
margin-top: 20px;
position: relative;
}

.slide-item {
width: 315px;
height: 233px;
padding: 9px;
border: 1px solid #cecece;
margin: 10px 0 10px 11px;
float: left;
position: relative;
}

.slide-item img {
width: 315px;
height: 233px;
}

.slide-titel {
position: absolute;
width: 313px;
bottom: 0px;
left: 0px;
background: #666;
color: #fff;
padding: 10px;
display: block;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: alpha(opacity=80);
opacity: 0.80;
}

.slide-titel a {
color: #fff !important;
}

.slide-titel a:hover {
color: #ccc !important;
}

.slidewrapper {

width: 1048px !important;
height: 280px !important;
}

.prev {
position: absolute;
top: 110px;
left: -24px;
background: url(images/button_prev.png) no-repeat top left;
width:44px;
height:43px;
display: block;
z-index: 10;
}

.prev:hover,.next:hover {
background-position: 0 -43px;
cursor: hand;
}

.next {
position: absolute;
top: 110px;
right: -24px;
background: url(images/button_next.png) no-repeat top left;
width:44px;
height:43px;
display: block;
z-index: 10;
}

#content {
width: 1048px;
float:left;
border: 1px solid #cecece;
padding: 15px 0;
overflow: hidden;
}

.column {
margin: 0 30px 0 15px;
float: left;
width: 217px;
overflow: hidden;
}

.column-both {
margin: 0 15px;
float: left;
width: 1018px;
}


.column-last {
margin: 0 15px 0 15px;
float: left;
width: 220px;
}

h2 {
font-size: 14pt;
line-height: 17pt;
margin-bottom: 10px;
color: #777;
}

h2 a {
font-size: 14pt;
line-height: 17pt;
margin-bottom: 10px;
color: #777 !important;
display: block;
}

h2 a:hover {
background: #0ed8c3;
color: #fff !important;
padding: 0 3px;
}

ul.menu {
display: inline;
float: left;
list-style: none;
margin: 30px 0 1px 0;
width: 1070px;
}

ul.menu li {
float: left;
margin-right: 19px;
}

ul.menu li a {
font-weight: normal;
color: #fff;
text-transform: uppercase;
background: #777;
padding: 5px 13px;
display: block;
width: 218px;
}

blockquote {
margin: 10px 20px;
font-style: italic;
}

.category-dekompostierer ul.menu li a, .category-zwiegespraech ul.menu li a, .category-netz ul.menu li a, .category-rummelplatz ul.menu li a, ul.menu li.active_category {
font-weight: normal;
color: #fff;
text-transform: uppercase;
background: #cecece;
padding: 5px 13px;
display: block;
width: 218px;
}

ul.menu li.cat-item-1956 a, .category-impulse ul.menu li.cat-item-1956 a, .category-magazine ul.menu li.cat-item-1956 a, .category-quick ul.menu li.cat-item-1956 a {
width: 235px;
}

ul.menu li a:hover, ul.menu li.current-cat a {
background: #0ed8c3;
}

#footer {
display: block;
width: 1050px;
margin: 30px 0;
float: left;
border-top: 5px solid #777;
}

#footer a {
color: #777;
}

#footer a:hover {
color: #222;
}

#footer-content {
margin-top: 1px;
border-top: 1px solid #777;
text-align: right;
padding-top: 10px;
}

.postmeta {
width: 237px;
float: left;
margin-top: 30px;
font-size: 8pt;
line-height: 10pt;
color:#a4a4a4;
text-transform: uppercase;
}

a.readmore {
color: #0ED8C3 !important;
}

.post-text, .post-text2 {
width: 555px;
float: left;
margin-right: 50px;
}


.post-text img {
padding: 10px;
border: 1px solid #ccc;
max-width: 533px;
height: auto;
margin-bottom: 10px;
float:left;
}

.post-text2 img {
padding: 10px;
border: 1px solid #ccc;
width: 533px;
height: auto;
margin-bottom: 10px;
float:left;
}

.post-bild {
width: 400px;
float: left;
}

.column-both .postmeta {
width: 400px;
clear: left;
}

.column-both .postmeta-text {
width: 320px;
}

.datum {
float: left;
width: 43px;
height: 43px;
margin-right: 10px;
margin-bottom: 15px;
color: #fff;
text-align: center;
background: url(images/datum_bg.png) no-repeat top left;
}

.datum-tag {
font-size: 14pt;
line-height: 13pt;
margin-top: 6px;
}

.datum-monat {
line-height: 8pt;
}

.postmeta-text {
float: left;
margin-top: 7px;
width: 180px;
}

.postmeta-text a {
color: #777;
}

.postmeta-text a.senf {
color: #222 !important;
display:block;
}

ul.related_post {
list-style: none;
}

ul.related_post li {
border-bottom: 1px solid #ccc;
}

ul.related_post li a {
padding: 4px 8px;
display: block;
color: #777 !important;
}

ul.related_post li a:hover {
color: #fff !important;
background: #0ed8c3;
}

.comments {
clear: left;
display: block;
margin-top: 50px;
float: left;
width: 400px;
font-style: italic;
font-size: 9pt;
line-height: 14pt;
}

.comments input {
padding: 2px 4px;
height: 25px;
border:1px solid #E0DCD3;
font-family: Courier New, Courier, serif;
font-size: 10pt;
line-height: 14pt;
color: #777;
width: 280px;
margin-bottom: 10px;
}

.comments textarea {
padding: 2px 4px;
height: 162px;
border:1px solid #E0DCD3;
font-family: Courier New, Courier, serif;
font-size: 10pt;
line-height: 14pt;
color: #777;
width: 380px;
margin-bottom: 10px;
}

.kommentar-feld {
margin-top: 30px;
}

.facebook {
display: block;
margin: 0 0 50px 0;
}

.comment-avatar {
float: left;
margin-right: 15px;
}

.comment-text {
float: left;
width:350px;
}

.commentwrap {
float: left;
margin-bottom: 30px;
width: 400px;
}

/* /////////////////// pagination ///////////////////// */

#pagination {
display: block;
margin: 30px 0 0 0;
float: left;
width: 1050px;
}

.pagebar {
display: inline-block;
height: 24px;
border: none;
font-size: 8pt;
}

.pagebar a, .pageList .this-page {
height: 24px;
width: 24px;
display: inline-block;
color: #fff !important;
text-decoration: none;
line-height: 24px;
text-align: center;
padding: 0 !important;
background: url(images/pages.png) no-repeat top left;
}

.pagebar a:visited {
height: 24px;
width: 24px;
display: inline-block;
color: #fff;
text-align: center;
text-decoration: none;
background: url(images/pages.png) no-repeat top left;
}

.pagebar .this-page {
height: 24px;
line-height: 24px;
width: 24px;
display: inline-block;
color: #fff;
text-align: center;
text-decoration: none;
background: url(images/pages.png) no-repeat 0 -24px;
}

.pagebar a:hover{
background: url(images/pages.png) no-repeat 0 -24px;
}

.pagebar .inactive {
height: 24px;
width: 24px;
line-height: 24px;
display: inline-block;
color: #fff;
text-align: center;
text-decoration: none;
background: url(images/pages.png) no-repeat top left;
}