* { box-sizing:border-box; }

:root {
    --bg: #333;                   
    --red: red;
    --link: steelblue;
    --naviON: lightskyblue;
    --onblack: silver;
    --ongray: gainsboro;
    --cmsgoblue: #CFE7F5;
}

html { margin:0; background-color:white; font-family: "Trebuchet MS", verdana, arial, sans-serif; font-size:16px; color:white; background-color: var(--bg) ; }     

body { margin:0; line-height:1.5rem; color: black; background-color: var(--bg); letter-spacing: .3px;  }  
/*body { background-color: var(--cmsgoblue) }*/


/* ----------------------------------------------------------------------------- generals */

.bot { font-family:consolas; color:#999; text-align:center; font-size:14px; margin:30px auto; }


img, script { line-height:0; }
var { font-family: monospace; font-style: normal }
blockquote { margin-top:0; margin-bottom:0 }
h1,h2,h3,h4,h5,h6 { color:black; line-height:initial; font-weight:normal; margin:0; margin-bottom:0px; display:inline-block; }
h2 { margin-bottom: 20px }
h4 { font-weight: bold }
ol { margin:0; }
ul { display:block }
hr {  width: 100%; max-width: 100%; margin-top: 2rem; border: 0; border-top: 1px solid #000; } 
#div31 ul { margin:0 }
.bianka { font-family:Aldrich; }
span.function { padding:1rem; border:1px solid #ccc; background-color:ghostwhite }

.strike { text-decoration: line-through; }
.nowrap { white-space: nowrap }

video, img { max-width:100%; }
div.hr { display:block; clear:both; height: 1px; margin:30px 0 30px 0; background-color: var(--link) }
wd { font-family: wingdings }

.silo { display: none }

/*code-donkey autotx */
.va, .fi, .di { letter-spacing: 0 }

/* ----------------------------------------------------------------------------- elements */

.TAB { display:table; width:100%; }
.TR { display:table-row; width:100%; }
.TD, .TH { display:table-cell; vertical-align:top; }
.TD.left { text-align:left; }
.TD.center { text-align:center; }
.TD.right { text-align:right; }

p { white-space:pre-wrap; }

a          { color: var(--link); text-decoration: underline }
a:visited  { } 
a:hover    { text-decoration: underline; }
a[target=_blank]:after { font-family: webdings; display: inline-block; content: '2'; text-decoration:none; vertical-align:top; padding-left:3px }
/* a[target=_blank]:after { background: url('../../img/icon_popup_black.png') 11px 11px no-repeat; display: inline-block; vertical-align:top; padding-left:3px }  */
/* a[target=_blank]:after { content: '../../img/icon_popup_black.gif'; text-decoration:none; vertical-align:top; padding-left:33px }  */ 

a.naviON          { color: var(--naviON) }
a.naviON:visited  { color: var(--naviON) } 

.font-onblack, .font-onblack span, .font-onblack a { color: var(--onblack); text-decoration:none } 
.font-onblack a:visited     { }
.font-onblack a:hover       { text-decoration: underline; }

.font-ongray span, .font-ongray a  { color:var(--ongray); text-decoration:none }
.font-ongray a:visited      { }
.font-ongray a:hover        { text-decoration: underline; } 

.AF a, .AF a:link   { color:#43bf43;  }

a.cart_display { color:black }
a.cart_display:hover { color:#43bf43 }

a.button { background-color:#FFFF66; padding:5px 20px; border-radius:5px; border:1px solid #666 }

.navi_5 { padding:15px 0 }       
.navi_5  ul { display:inline; margin:0; padding:0;   }
.navi_5  li { display:inline-block; margin-right:15px; list-style-type:none;  }
.navi_5  li:last-child { margin-right:0 }
.navi_5  li a.navi { text-decoration:none; color:#999  }
.navi_5  a.navi:hover {  }
.navi_5  a.naviON:link { color:#666; text-decoration:none;  }

.navi-block { padding:10px 0; }
.navi-sub { border-top: 1px #ccc solid; padding-top:10px; margin-top:10px; }       
.navi-inline ul { display:inline; width:100%; text-align:left; margin:0; padding:0;   }
.navi-inline li { display:inline-block; margin-right:20px; list-style-type:none;  } 

.Categorytext, .Text { white-space:pre-wrap; } 
.Categorytext ul, .Text ul, .Categorytext ol, .Text ol { display:block; margin:0; white-space:pre-line; }
/* .Categorytext li, .Text li  { display:block; margin:0; white-space:pre-line; }  kills list-style */
.Categoryfoto { float:right; max-width: 150px } 

.cons { display:table; margin-bottom:30px; width:100%; }
.cons h2 { font-family: arial; font-weight:400 }
.cons_image { float:right; margin:20px 0 20px 40px; }
.content-frame { border: 2px solid lightskyblue; padding: 0 1rem 1rem 1rem; }

.radius { border-radius:3px; }


 
/* ----------------------------------------------------------------------------- layout */

.wide { width:100%;}
.wrap { padding:0 15px; margin:0 auto; max-width:1333px  }

#waitlayer { display:none; position:fixed; width:100%;height:100%; z-index:3; top:0; }

/* div 1 */

.wide.div1 { background-color: #666; padding-top:3px }
.wrap.div1 { }

.wrap.div1 .TAB { padding:10px 0; }
.wrap.div1 .TD.left { width: 0%; padding-left: 32px }              
.wrap.div1 .TD.center { text-align: left; padding-top: 3px; width: 80% }
.wrap.div1 .TD.right { width: 18%; max-width: 18%; }

.logo { padding: 0 30px; line-height: 0; width:222px; display:none }

.search {  }

#fsearch { }
#q { background-color: #d1d1d1; }
#searchbutton { display:inline;margin:0 0 0 5px;float:none;padding:3px 12px }

/* div 2 */

.wide.div2 { margin: 12px 0 }
.wrap.div2 { padding: 0 47px; }

.parentlinks { padding: 9px 0; margin:0; color: lightskyblue; }

/* div 3 */

.wide.div3 { margin-bottom: 50px; }
.wrap.div3 { }

.content-block { float:left; width: 82%;  padding: 30px; background-color: whitesmoke;}

.navigation-block { float: left; padding: 15px 0 30px 30px; width: 18%; max-width:18% }
.navigation-block ul { list-style-type: none; padding: 0; margin: 0; display:block; margin-bottom:10px; padding-bottom:10px; }
.navigation-block li { list-style-type: none; line-height: 1.1rem; margin-bottom:5px }
.navigation-block-headline { font-weight:bold; line-height:1rem; padding-bottom:7px; margin-bottom:5px; border-bottom: 1px solid #999; color: #999 }

/* div 4 */

.wide.div4 { margin-bottom: 50px; margin-top: 0; }
.wrap.div4 { padding: 0 20px 30px 45px; border-bottom:1px solid #333 }
.wrap.div4 .TD { vertical-align:baseline; }

.bc_bottom { font-size:.8rem }

a.cmsgo55 { /*background-color: #666;*/
line-height: 0;
max-height: 100%;
display: table;
margin: 0 auto;
padding: 1px;
}


/* ----------------------------------------------------------------------------- function cmsgo_text_table() */

div.cmsgo_text_table { display:table; }
div.cmsgo_text_table > div.TR {}
div.cmsgo_text_table > div.TR > div.TD { border:1px solid #ccc; padding:.5rem; }

table.htmlfile { display:table; width:100% ; font-size:.9rem; line-height:1.3rem; letter-spacing:0; border-collapse:collapse; background-color: white; }
table.htmlfile tr { display: table-row;  background-color: white; }
/*#?# table.htmlfile tr:nth-child(1) { background-color:#ccc; font-weight:bold; }*/
table.htmlfile tr > td { border:1px solid #ccc; padding:1px; width:auto; max-width:100%; }
table.htmlfile > colgroup { display:none; }
table.htmlfile > colgroup > cols { display:none; }
table.htmlfile tr:first-child { background-color: var(--cmsgoblue); }

table.csvfile { display:table; width:100% ; font-size:.9rem; line-height:1.3rem; letter-spacing:0; border-collapse:collapse  }
table.csvfile tr { display: table-row; }
/*#?# table.htmlfile tr:nth-child(1) { background-color:#ccc; font-weight:bold; }*/
table.csvfile tr > td { border:1px solid #ccc; padding:1px; width:auto; max-width:100% }
table.csvfile tr:first-child { background-color: var(--cmsgoblue); }

caption { caption-side:bottom }

/* neutralize quirk.css */ 
/* table {
  text-align: start;
  white-space: normal; 
  line-height: normal;

  
  font-size: initial;
  font-weight: initial;
  font-style: initial;
  font-variant: initial;
} */


/* ----------------------------------------------------------------------------- templates */

.TAB.t { width:auto; border-collapse:collapse }
.TAB.t > .TR { width:100%;}
.TAB.t > .TR > .TD { text-align:left; border:1px solid #ccc; padding:2px 8px }
.Preistafel > .TAB.t { width:100%; }
.Preistafel > .TAB.t > .TR > .TD:last-child{ font-weight:bold }

.TAB-frame { display:table; width:100%; }
.TR-frame { display:table-row; width:100%; }
.TD-frame-left { display:table-cell; width:264px; padding:0; padding-right:16px; vertical-align:top; }
.TD-frame-right { display:table-cell; padding:0; vertical-align:top; }

/* code-donkey */

code, code-php, code-htm, code-jas, code-css { margin:0px; white-space: break-spaces; }

/* 16.containertiles.php */

div.box { display:inline-block; width:213px; margin:0 8px 12px 0; padding:4px; vertical-align:top; }
div.box:nth-child(4n+0) { margin-right:0 }
div.box a:link { display:block; line-height:1.2rem; font-size:.9rem; font-weight:bold }
div.box img.Foto1 { display:block; width:100%; height:auto; margin-bottom:5px }

/* 102.kontakt_allforms.php */

#contactform { display:block; }
#contactconfirm { display:none; }

/* messageform textarea only like 32.strasbourg, html2 (etc) */

/* form fcmsgom for message */

.msg { margin-top: 22px; margin-bottom: 21px;}

/* -------------------------- css responsive ----------------------------------- */


/* @media only screen and (max-width:480px) {

div.wide { margin-top:0px;  }

body { font-size:20px; line-height:normal;  }
table,div { line-height:normal;  }
.parentlinks a:link {  font-size:90%; color:#666; text-decoration:none; white-space:normal }

.TR.div11     { display:block }
.TD.logo      { display:block; padding:10px 0px; }
.TD.warenkorb { display:block; padding:10px 0px;text-align:left }

div.cons { margin-bottom:40px; }
img.cons_image { display:block; max-width:100%; float:none; margin:0 0 15px 0; }

div.box { width:auto; max-width:100%; margin:0 0 30px 0; padding:0px; }

#berger { display:block; position:fixed; }
#flatscher { }
#close {  }

} */


/* sky-forms other elements */

.msgdiv { font-size:1rem;margin:1rem 0; }
.msg { } 
.red { color:red }

section.input-group { padding:6px 10px; background-color:white; border-style:solid; border-width:2px; border-color:#e5e5e5 }
section.input-group.red { background-color:#fff0f0; border-color:#ad3bc4 }

/* ----------------------------------------------------------------------------- screens */

/* show all pc-only & t-not, hide all m-only tags */

.pc-only {}
.t-not {}
.m-only { display:none; }

/* -------------------------------------------------------------------------- ----------------------------1024, 768, 969, 480, mobile breakpoints */                                                                               

@media only screen and (max-width:1024px) {                                     
    .t-not { display:none; }
    .m-only { display:block; max-width:100% }
}

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

    .pc-only { display:none; }
    .m-only { display:block; max-width:100% }

}