/*================================================
==================================================
    STANDARD BEGINN
==================================================
================================================*/

/*************************
    HTML BODY
*************************/
@font-face {
    font-family: 'delicious';
    src: url('../layout/font/delicious-webfont.eot');
    src: url('../layout/font/delicious-webfont.eot?#iefix') format('embedded-opentype'),
         url('../layout/font/delicious-webfont.woff') format('woff'),
         url('../layout/font/delicious-webfont.ttf') format('truetype'),
         url('../layout/font/delicious-webfont.svg#DeliciousRoman') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'liberaheavy';
    src: url('../layout/font/libera-heavy-webfont.eot');
    src: url('../layout/font/libera-heavy-webfont.eot?#iefix') format('embedded-opentype'),
         url('../layout/font/libera-heavy-webfont.woff') format('woff'),
         url('../layout/font/libera-heavy-webfont.ttf') format('truetype'),
         url('../layout/font/libera-heavy-webfont.svg#LiberaheavyLiberaheavy') format('svg');
    font-weight: normal;
    font-style: normal;

}

html {
  background-color: #f8f5ed;
  margin:0px;
  padding:0px;
}


body {
  margin:0px;
  padding:0px;
  color:#606060;
  /*font-family: Trebuchet MS, sans-serif;*/
  font-size: 14px;
  text-transform: normal;
  background-color:#f8f5ed;
  font-family:delicious, Arial;
}

/*************************
    Überschriften
*************************/
h1 {
  /*color:#505050;*/
  color:#000000;
  font-size:22px;
  margin:10px 0 10px 0;
  clear:both;
  font-family:liberaheavy, Arial;
}
h2 {
  color:#505050;
  font-size:20px;
  margin:10px 0 10px 0;
  clear:both;
}
h3 {
  /*color:#505050;*/
  color:#786f61;
  font-size:18px;
  margin:10px 0 10px 0;
  clear:both;
  font-family:liberaheavy, Arial;
}
h4 {
  color:#505050;
  font-size:16px;
  margin:10px 0 10px 0;
  clear:both;
}
h5 {
  color:#505050;
  font-size:14px;
  margin:10px 0 10px 0;
  clear:both;
}
h6 {
  color:#505050;
  font-size:12px;
  margin:10px 0 10px 0;
  clear:both;
}

/*************************
    Links
*************************/
a, a:visited {
  color:#87816d;
}
a:hover {
  color:#000000;    
}

/*************************
    Listen
*************************/
ul, ol {
  list-style-position: inside;
  margin-left:15px;
}
ul{
  list-style-type:none;
  list-style-image:url(../layout/list-img.png);
}
ol {
  list-style-type:decimal;
}

/*************************
    Tabellen
*************************/
table {
    background-color: #EFEFEF;
    border-collapse: collapse;
    border-spacing: 0;
    color: #424242;
}
table tr.odd {
    background-color: #EFEFEF;
}
table tr.even {
    background-color: #DFDFDF;
}
table tr:hover {
    background-color: #F0B600;
    color:#ffffff !important;
}
table tr td {
    /*border: 1px solid #FFFFFF;*/
    padding: 5px;
    text-align: left;
}
table tr th {
    /*border: 1px solid #FFFFFF;*/
    background-color: #424242;
    color:#CCCCCC;
    font-size: 16px;
    padding: 5px;
}
table tr td p, table tr th p {
    margin: 0 !important;
    padding: 0 !important;
}  

/*************************
    Kontaktform
*************************/
div#kontakt{
}

div#kontakt fieldset{
  border:0px;
}

div#kontakt div.row{
  margin-bottom:10px;
}

div#kontakt div.row .left{
  float:left;
  margin-right:50px;
}

div#kontakt div.row .right{
  float:left;
}

div#kontakt input,
div#kontakt select,
div#kontakt textarea{
  width: 151px;
  padding:4px;
  margin:0;
  
  background-color:#F8F5ED;
  border:1px solid darkGray;
  
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

div#kontakt input:focus,
div#kontakt select:focus,
div#kontakt textarea:focus{
  background-color:white;
}

div#kontakt input.required,
div#kontakt select.required,
div#kontakt textarea.required{
  background-color:#DCD7C6;
}
div#kontakt input.required:focus,
div#kontakt select.required:focus,
div#kontakt textarea.required:focus{
  background-color:white;
}

div#kontakt div.row .left label, div#kontakt div.row .right label, div#kontakt div.row .textarea label{
  width:85px;
  display:block;
  float:left;
}

div#kontakt div.row label.longLabel{
  width:260px;
}

div#kontakt div.row .left input, div#kontakt div.row .right input{
  float:left;
}

div#kontakt div.row textarea{
  width:447px;
  height:150px;
}

div#kontakt div.row .newsletter{
  margin-left:85px;
}

div#kontakt div.row .submit{
  margin-left:85px;
}

div#kontakt div.row .submit input{
  background:-moz-linear-gradient(center top , #FFFFFF, #F4F4F4) repeat scroll 0 0 transparent;
  border:1px solid #DCDCDC;
  -moz-border-radius:3px;
  -moz-border-radius:3px;
  /*color:#5785B3;*/
  color:#87816D;
  line-height:30px;
  height:30px;
  padding:0 10px;
}

div#kontakt div.row .submit input.button{
  float:left;
  margin-right:20px;
}

div#kontakt input[type="radio"],
div#kontakt input[type="checkbox"]{
  width:auto;
}

div#formErrorMsg{
  background:none repeat scroll 0 0 #DB8080;
  border:1px solid #C60E00;
  color:#FFFFFF;
  padding:10px 10px;
  margin-bottom:10px;
}

div#formErrorMsg p{
  padding:0px;
  margin:0px;
}

div#formErrorMsg ul{
  padding:0px;
  margin:0px;
}

div#formErrorMsg ul li{
  background:none;
  list-style:disc inside none;
  color:#ffffff;
  font-size:100%;
  text-transform:none;
}

div#kontakt div.row label.error{
  color:#C60E00;
}

/*************************
    RANDOM
*************************/

a img {
  border:none;
}

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}


/*================================================
==================================================
    STANDARD END
==================================================
================================================*/

#mainMenuBar{
  font-size:19px;
}

ul.multicolumnContainer{
  list-style-image:none;
}

.csc-textpic p.bodytext{
  font-size:14px;
}
.csc-textpic p.bodytext a{
  text-decoration:underline;
}
.multicolumnContainer h1{
  font-size:1.2em;
  text-transform:uppercase;
  border-bottom:2px solid #f0b600;
  padding:10px 6px;
  margin:2px 0;
  color:#afa99b;
  font-family:delicious, Arial;
}
.multicolumnContainer p.bodytext,
.multicolumnContainer ul,
.multicolumnContainer ol{
  font-size:14px;
}

.center{
  /*width:60em;*/
  width:960px;
  margin:0 auto;
}

.logo{
  float:left;
}
#bg{
  padding-bottom:50px;
  background-color:#F8F5ED;
}
#header{
  border-bottom:1px solid white;
  background-color:#dcd7c6;
  height:147px;
}
#header .center{
  background:url(../layout/header-image.png) 488px 0 no-repeat #DCD7C6;
  height:147px;
}
#footerWrapper{
  width:100%;
  height:50px;
  background-color:black;
  position:fixed;
  bottom:0;
}

#content{
  
}
#footerWrapper #footer{
  /*width:60em;*/
  width:960px;
  height:50px;
  margin:14px auto 6px auto;
}


/* PRODUKT SLIDER */

.prodHolder{
  margin-top:15px;
  text-align:center;
  background:url(../layout/holz_brett.png) bottom center no-repeat transparent;
}

.prodHolder ul{
  padding:0;
  margin:0px auto;
  display:inline-block;
  list-style-image:none;
}

.prodHolder li.img{
  float:left;
  width:190px;
  height:300px;
  position:relative;
}

.prodHolder li.img img{
  width:180px;
  height:270px;
  margin: 0 auto;
}

.prodHolder li.img .productContent{
  display:none;
  width:200px;
  position:absolute;
  top:0;
  left:150px;
  padding:14px;
  background-color:#3E3D3B;
  background-color:rgba(0, 0, 0, .75);
  
  box-shadow:2px 2px 5px #333333;
  
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  
  text-shadow: 2px 2px 0px #000;
}
.prodHolder li.img .productContent h1{
  color:#ff6600;
  margin: 0 0 10px 0;
}
.prodHolder li.img .productContent p{
  color:white;
}
.prodHolder li.img .productContent a{
  color:#ff6600;
}
.prodHolder li.img .productContent a:hover{
  color:white;
  text-decoration:underline;
}
.prodHolder li.img .productContent .imgArrow{
  /*display:none;
  background-color:rgba(0, 0, 0, .75);*/
  
  background:url(../layout/imgArrow_01.png) -10px center no-repeat transparent;
  
  width:20px;
  height:20px;
  
  position:absolute;
  top:25px;
  left:-10px;
}

.center {
	position: relative;
	}

#josefs_logo {
	position: absolute;
	right: 0;
	bottom: 14px;
	}

/* tt_news */

.news-list-container { margin:0px 0px 10px 0px; border-width:0px 0px 0px 0px; border-style:solid; border-color:#ffffff;}
.news-list-container .right {float:right;}
.news-list-container .left {float:left; width:620px;}
.news-list-container .news-list-item {margin:0px 0px 15px 0px;}

.news-latest-item .news-latest-date.right {float:right; margin:0px 0px 0px 5px; font-family:delicious, Arial;}

.news-single-item {}
.news-single-item .left {float:left;}
.news-single-item .right {float:right;}
.news-single-item .news-content .left{width:610px;}
.news-single-item .news-single-img a { display:block; margin:0px 0px 10px 0px;}