/* General Style */


@font-face { font-family: 'Montserrat'; src: url('Montserrat-Regular.ttf'); }

html, body, div, span, applet, object, iframe, #main, #main left, #main article, #main right,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, section,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        font: inherit;
        vertical-align: baseline; }

body {  background-color:#cec3b4; background-image:url(images/bg_body2.jpg); font-size:100%; margin:0; padding:0; font-family:Montserrat,Verdana,Helvetica; }


h1 {    font-size:17px; line-height:18px; letter-spacing:1px;
        font-weight:800; color:#d2cbc2; margin:0; padding:1.2em 0.2em 0 0.5em; text-shadow: 2px 2px #675d3e;}

h2 {    font-size:22px; line-height:26px; letter-spacing:1px;
        font-weight:100; color:#7f2122; padding:14px 12px 0 10px; text-align:left; }

/* Adressfeld */
h3 {    font-size:14px; line-height:20px; font-weight:100; color:#ffffff; padding:10px; text-align:left; }

/* Zwischenüberschrift */
h4 {    font-size:24px; line-height:28px; font-weight:800; color:#5a84ab; padding:1em 0em 0em 1.0em; text-align:left; }

/* Bildunterschrift */
h5 {    font-size:0.8em; line-height:1.2em; font-weight:500;
        color:#1f467b; padding:0.5em 1.0em 0em 1.2em; text-align:left; }

p {     font-size:13px; line-height:20px; font-weight:100; color:#3c2714; padding:8px 12px 0 10px; text-align:left; }
.klein {     font-size:12px;  }

.verkauf   {   margin:0; padding:0 12px 0em 5px; }

#legende p {     font-size:0.8em; line-height:1.3em; font-weight:100; color:#3c2714; text-align:left; }

h3 a {  color:#ffffff; }
h3 a:hover { color:#3c2714; }

#ztext  { font-weight:800; margin-bottom:-1em; }

#unsichtbar { display:none; }
#unsichtbar p { display:none; font-weight:800; margin-bottom:-1em; }

table { border-collapse: collapse; margin:0.8em; }

td {    font-size:11px; line-height:15px; font-weight:100;
        color:#3c2714; padding:0.4em; text-align:left; vertical-align:top; border: 1px solid #ffffff; }

th {    font-size:11px; line-height:15px; font-weight:100;
        color:#802220; padding:0.4em; text-align:left; vertical-align:top; border: 1px solid #ffffff; }

tr:nth-child(odd)  { background-color: #ede9e3; }
tr:nth-child(even) { background-color: #e1ddd8; }

.r {    text-align:right; }



iframe { width:725px; height:450px; padding:0.2em; max-width:100%; }

a      { text-decoration: none; }

/* On Top Bar */
#menubar { display:block; background:#771e1c; border-bottom: 5px solid #948a76; }
#menubar ul { display:block; width:2em; padding:0.9em; }
#menubar ul li { display:inline; }
#menubar ul li a.menubutton { display:none; }

/* HamburgerButton */

label.hamburg  { display: block; background: #555; width: 75px; height: 50px; position: relative;
               margin-left: auto; margin-right: auto; border-radius: 4px; }
input#hamburg  { display:none; }
.line          { position: absolute; left:10px; height: 4px; width: 55px; background: #fff; border-radius: 2px;
               display: block; transition: 0.5s; transform-origin: center; }
.line:nth-child(1) { top: 12px; }
.line:nth-child(2) { top: 24px; }
.line:nth-child(3) { top: 36px; }
#hamburg:checked + .hamburg .line:nth-child(1)    { transform: translateY(12px) rotate(-45deg); }
#hamburg:checked + .hamburg .line:nth-child(2)    { opacity:0; }
#hamburg:checked + .hamburg .line:nth-child(3)    { transform: translateY(-12px) rotate(45deg); }

/* Header */
header { display:none; background:#771e1c; }

header img { display:inline; max-width:980px; background-color:#1c4c80; }

#titelbild1 { display: block; width: 100%; height: auto; margin:0 0 0.8em 0; padding:0; border: 1px solid #6a6351; box-shadow: 5px 5px 7px #837e61; }
#titelbild2 { display: block; width: 100%; height: auto; margin:0 0 0.8em 0; padding:0; border: 1px solid #6a6351; box-shadow: 5px 5px 7px #837e61; }

/* Navigation */
nav {  background:#f6f4f1; border: 1px solid #7f2122; margin:0.8em 0 0 0; box-shadow: 5px 5px 7px #837e61; }
nav ul { display:block; }
nav ul li { list-style-type: none; border-bottom: 1px solid #7f2122; width:100%; display:block; }
nav ul li a { font-weight:500; font-size:13px; letter-spacing:1px; line-height:20px;
        text-align:left; display:block; color:#7f2122; padding:12px 0 10px 12px;
        transition:background 0.2s; -webkit-transition:background 0.2s; { color:#ff0000; font-weight:bold; } }
nav ul li:last-child { border-bottom:0px; }
nav ul li a:hover {  background:#7f2122; color:#ffffff; }
nav ul li a:active { background:#7f2122; }

/* Content Area */
#main { display:block; width:100%; max-width:1350px; margin:0 auto; }

#main left { display:inline-block; width:19%; margin:0.8em 0.8em 0 0; vertical-align:top; }

#main left section { background-image: linear-gradient(45deg, #6a6351 20%, #88816f 60%);
        border: 1px solid #2a2413; box-shadow: 5px 5px 7px #837e61; }

#main article { display:inline-block; width:56%; vertical-align: top; margin:0.8em 0 0 0; text-align:center; }

#main article text { display:inline-block; width:100%; background:#d7d4cc; min-height:614px;
        text-align:center; border: 1px solid #7e7867; box-shadow: 5px 5px 7px #837e61; }

#main article text img { text-align:center; width:99%; height:auto; }

#main article verkauf { display:inline-block; width:100%; background:#d7d4cc;
        margin:0 0 1em 0; padding-bottom:0.9em; text-align:left; border: 1px solid #7e7867; box-shadow: 5px 5px 7px #837e61; }

#main article li { list-style-type:square; font-size:13px; line-height:20px;
        font-weight:100; color:#3c2714; margin-left:4em; padding:0em; text-align:left; }

#main article section { display:inline-block; vertical-align:top; background:#6a6351; border: 1px solid #2a2413; margin:0.8em 0.1em 0 0; width:31.5%; height:auto; }
#main article section img { text-align:center; width:100%; height:auto; }
#main article section p { font-size:13px; color:#ffffff; text-align:left; padding: 0 0 5px 5px; }

#main article a { font-weight:500; color:#554a1d; }
#main article a:hover { color:#8e886f; }

#bildgr { display: block; width: 300px; height: auto; padding:0em 0em 0.1em 0em; }
#bildgross { display:inline-block; width: 96%; margin:0.2em; padding:0; vertical-align:top; text-align:left; }
#bildmittelgross { display:inline-block; width: 49%; margin:0 0 0.7em 1em; padding:0; vertical-align:top; text-align:left; }
#legende { display:inline-block; width:46%; margin:0em 0 0.7em 0.7em; padding:0; vertical-align:top; text-align:left; }

#main right      { display:inline-block; width:20%; vertical-align:top; }

#main right section { background:#6a6351; border: 1px solid #2a2413; margin:0.8em 0 0 0.8em; padding: 0; box-shadow: 5px 5px 7px #837e61; }
#main right section img { text-align:center; width:100%; height:auto; }
#main right section p { font-size:13px; color:#ffffff; text-align:left; padding: 4px 0 4px 6px; }
#main right section a { color:#ffffff; }

.thumb { width: 75px; height: auto; margin:0; padding:0; border: 1px solid #64522c; }
.zoom { width:100%; height:auto; margin:0; padding:0; max-width:100%; border: 1px solid #64522c; }

.startbild { width:100%; height:auto; margin:0; padding:0; border: 1px solid #64522c; }
.verk_bild { max-width:100%; height:auto; }
.bild { max-width:100%; height:auto; }

/*  SECTIONS  */
.section { clear: both; padding: 0px; margin: 0px; }

/*  COLUMN SETUP  */
.col {  display: block; float:left; margin: 2% 0% 0% 2%; }
.col p {  padding-left:0; }
.col h2 {  padding-left:0; }
.col img {  border: 1px solid #64522c; }
/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF EIGHT  */
.span_8_of_8 { width: 100%; }
.span_7_of_8 { width: 87.3%; }
.span_6_of_8 { width: 74.6%; }
.span_5_of_8 { width: 60%; }
.span_4_of_8 { width: 48%; }
.span_3_of_8 { width: 36%; }
.span_2_of_8 { width: 23.8%; }
.span_1_of_8 { width: 10.25%; }

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
        .col {  margin: 1% 0 1% 0%; }
        .span_1_of_8, .span_2_of_8, .span_3_of_8, .span_4_of_8, .span_5_of_8, .span_6_of_8, .span_7_of_8, .span_8_of_8 { width: 100%; }
}





/* Footer */
footer { display:block; background:#771e1c; text-align:center; border-top: 5px solid #948a76; margin:0.8em 0 0 0; }
footer ul { display:block; width:100%; max-width:1300px; text-align:left; margin:0px auto; }
footer ul li { display:inline; padding:0em 0.625em 0em 0.625em; }
footer ul li a { font-weight:500; font-size:0.8em; line-height:2.8em; color:#dcd3c5; }
footer ul li a:hover { color:#ffffff; }

/* Mobile Style */
@media screen and (max-width:800px) {
        body {
                font-size:90%;
        }
}
@media screen and (max-width:600px) {
        #main left, #main article, #main right {
                width:100%;  height:auto;
                display:block;
                margin:8px auto;
        }
}
@media screen and (min-width:550px) {
        nav {  display:block !important; }


}
@media screen and (max-width:550px) {
        body { font-size:86%; }
        #menubar ul li a.menubutton {
                display:block;
        }
        .hamb { width:40px; height:20px; }
        nav {
                display:none;
                height:auto;
        }
        #titelbild2 {
                display:none;
                height:auto;
        }
        #titelbild2, #ztext, #ZOOMIMG, #bildkl {
                display:none;
                height:auto;
        }

        header {
                display:block; !important;
        }
        #unsichtbar {
                display:block; !important;
        }
        nav ul li {
                display:block;
                margin:0.3em 0em 0.3em 0em;
        }
}

@media only screen and (min-width: 768px) {

    .menubutton { display:none; }
}