/** Seitenlayout */
html{ height: 100%;  margin: 0; padding: 0; }
body { height: 100%; min-height: 100%;  margin: 0; padding: 0;}
#page, .mm-page {  position:relative; height:auto !important; height:100%; min-height: 100%;  }
#page-wrap { position:relative; height:auto !important; height:100%; min-height: 100%;  margin-bottom: -140px; }
#page-wrap:after { content: "";  display: block; }

header { padding: 5px 0 0 0; margin: 0; width: 100%; transition: all 0.6s ease; background: #cc2222;  box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); }
header.sticky { position: fixed; z-index: 100; }
header.sticky .hidesticky { display: none; transition: all 0.4s  }
header.sticky #logo { max-height: 24px; margin-top: 0px; transition: all 0.6s  }
header.sticky #subhead { padding-bottom: 0; }

footer, #page-wrap:after { height: 140px;  }
footer { background: #cc2222; display: block; padding: 0; position: relative; color: #ffffff; font-size: 12px; border-top: 1px solid #ccc; clear:both; }
footer a { color: #fff; font-weight: 400; }
footer a:hover { text-shadow: 2px 2px 5px #000000; color: #ffffff; }

#subhead { transition: all 0.6s; }
#logo { margin-top: 60px; max-height: 44px; width: auto; height: auto;  max-width: 100%; vertical-align: middle; }
#claim { width: auto; height: auto; max-width: 100%; vertical-align: middle;}

main { padding-top: 10px; padding-bottom: 20px; clear: both; display: block; }
main.scrolled { padding-top: 120px; }

#cloud { line-height: 1.3em; padding: 10px; }
#cloud a { font-family: "Source Serif Pro", Serif; font-weight: 400; letter-spacing: 1px; color: #ffffff; transition: text-shadow 0.8s; transition: color 0.6s;  display: inline-block; }
#cloud a.anim {  text-shadow: 1px 2px 3px rgba(254,254,254,0.4); color: #530d0d;  }
#cloud a:hover { text-shadow: 2px 2px 5px #000000; color: #ffffff; }

/** Menü oben */
nav { border-top: 4px solid #84D0F0; background: #ffffff; overflow: visible;  }
nav ul.nav { padding: 0; list-style: none; display: inline-block; margin: 0; overflow: visible;  -webkit-backface-visibility: hidden;  position: relative;  z-index: 10; }
nav ul.nav li { background: none; list-style: none; padding: 0; margin: 0 25px 0 0; *display: inline; display: inline-block; position: relative; }
nav ul.nav>li:after { content: ''; display: block; margin: auto; height: 2px; width: 0px; background: transparent; transition: width .5s ease, background-color .5s ease; }
nav ul.nav>li:hover:after { width: 100%; background: #cc2222; }
nav ul.nav li a { display: block; padding: 5px; min-width: 71px; text-align: center; font-weight: 200; font-size: 16px; color: #000000;  }
nav ul.nav li:hover { background: #f0f0f0; }
nav ul.nav>li:last-child { margin-right: 0; }
nav ul.nav>li:first-child { margin-left: 0; }
nav ul.nav li.active>a { background: #f5f5f5; color: #cc2222;  }
nav ul.nav li.current>a { color: #cc2222; }
nav ul.nav>li.active:after { width: 100%; background: #f0f0f0; }

/** unterebenen **/
nav ul.nav li ul { width: 220px; w\idth: 220px; margin: 2px 0; padding: 5px 0; text-align:left; position: absolute; z-index: 999; left: -999em; display: none;  height: auto; -moz-box-shadow: 2px 2px 5px rgba(0,0,0,.4); -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,.4); box-shadow:  2px 2px 5px rgba(0,0,0,.4); background: #ffffff; }
nav ul.nav li:hover ul { left: auto;  display: block; }
nav ul.nav li ul li { margin: 0; padding: 0px; display:block; height: auto !important; overflow: visible; }
nav ul.nav li ul li a { text-transform: none; border-radius: 0; font-size: 14px; padding: 5px 10px 5px 20px; margin: 0; display: block; height: auto; line-height: 1.2em; text-align: left; width: 218px; w\idth: 218px; background: none; border: none; }

/* 2 unterebene */
nav ul.nav li:hover ul li.parent>a { background-position: 95% 10px; background-repeat: no-repeat; }
nav ul.nav li:hover ul li ul { left: -999em; border-radius: 5px;  }
nav ul.nav li ul li:hover ul { left: 218px; margin-top: -32px; }

footer ul.nav { margin: 0; padding: 0; list-style: none; }
footer ul.nav li { padding: 0 0 5px 0; margin: 0;  display: block; }

.searchdrop  {  -moz-box-shadow: 2px 2px 5px rgba(0,0,0,.4); -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,.4); box-shadow:  2px 2px 5px rgba(0,0,0,.4); background: #ffffff; }
.autocomplete-suggestion { padding: 5px 10px; cursor: pointer; }
.autocomplete-suggestion:hover { background-color: #f0f0f0; }
.autocomplete-suggestion strong, .highlight { color: #000000; font-weight: 600; }

#scrolltotop { position: absolute; bottom: 0; cursor: pointer; width: 64px; height: 26px; left: 50%; margin-left: -32px; }
#cr { clear: both; display: inline-block;  width: auto;  float: left; opacity: 0.4 }
#content ul { list-style: none; margin: 0 0 10px 0; padding: 0; }
#content ul>li { list-style: none; padding: 3px 0; background: none; margin-left: 25px; }
#content ul>li:before  { font-family: "feenders"; color: #cc2222; font-style: normal; font-weight: normal; position: absolute; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none;  line-height: 1.4em;  margin-left: -25px; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;  content: '\e852';  }

#right .moduletable { overflow: hidden; clear: both; margin-bottom: 15px; }
#right h3 { margin-top: 0; color: #cc2222; }

.readmore { display: block; margin: 0 0 0 15px; }
.readmore:before { font-family: "feenders"; color: #84D0F0; font-style: normal; font-weight: normal; position: absolute; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none;  line-height: 1.4em;  margin-left: -15px; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;  content: '\e84c';  }
.back { display: block; margin: 0 0 0 15px; }
.back:before { font-family: "feenders"; color: #84D0F0; font-style: normal; font-weight: normal; position: absolute; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none;  line-height: 1.4em;  margin-left: -15px; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;  content: '\e84b';  }
.buybutton { display: block; font-size: 1.1em; font-weight: 600; color: #cc2222; margin: 5px 0; }
.well { background: #EBF6FC; padding: 1em!important;  overflow: hidden; clear: both; margin-bottom: 15px;  border-radius: 3px; }
.bg-light { background: #F0F0EA; }


.icons a { font-size: 28px; color: #666; display: inline-block; margin: 5px 10px 5px 0; }
.hl-box { background: #84D0F0; padding: 4px; margin-top: -4px; }

ul.breadcrumb { list-style: none; margin: 10px 0; padding: 0; color: #666666; font-size: 13px; }
ul.breadcrumb li { list-style: none; background: none; display: inline-block; padding: 0 0 0 15px; margin: 0; line-height: 1em; }
ul.breadcrumb li:before { font-family: "feenders"; color: #333333; font-style: normal; font-weight: normal; position: absolute; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none;  line-height: 1em;  margin-left: -15px; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;  content: '\e852';  }
ul.breadcrumb li a { color: #666666; }
ul.breadcrumb li a:hover { color: #333333; }

.pagination { margin: 10px 0; padding: 10px 0; text-align: center; display: block; }
.pagination ul { width: auto; padding:0; margin: 10px 0;  text-align: center; }
.pagination ul li { display: inline-block; *display: inline; margin:0 5px!important;  }
.pagination li:before { content: ""!important; display: none!important;}
.pagination a {  color: #222222; display: block; border: 1px solid #d5d5d5; border-radius: 3px; padding: 5px 10px; margin: 0; text-decoration: none;  }
.pagination a:hover, .pagination a:focus { text-decoration: none; background:#281d1d; color:#fff;  text-shadow: none; }
.pagination li:hover a { color: #cc2222; background: #d5d5d5;  }
.pagination li.currentpage>a { background: #cc2222; color: #ffffff; }

#navicons img { width: 24px; height: 24px; margin: 5px 0 0 15px; vertical-align: middle; }
nav div.custom { display: inline-block; float: right; }
.page-header h2 {  margin-top: 0; margin-bottom: 1.5rem }
.headline {  display: block; clear: both; margin: 0 0 2px 0; }

.infoblock { margin-bottom: 10px; }
#teaser img { max-height: 240px; }
.icon-active { color: #cc2222; }

.img_caption { margin: 0px 15px 10px 15px; font-size: 12px; color: #666666; }
.close { float: right; margin: 0 0 10px 10px; cursor: pointer; color: #000000; }
a.cart { color: #888888; font-weight: 400; }
a.cart .active { color: #cc2222; }
a.cart:hover, a.cart:hover .active { color: #333333; }
.col-cloud { position: relative; display: inline-block;  width: 33.33333333%;  }

table.layout { border: none; border-collapse: collapse; }
table.layout td { vertical-align: top; }
table.layout td.left { padding: 0 10px 0 0; }
table.layout td.right { padding: 0 0 0 10px; }
.item-list td.left { width: 33%; }
.item-list td.right { width: 66%; }
.item-list .img-cover { max-height: 240px; }

#mobileDetect { display: none; }
a.mobilenav, a.mobilenav:hover, a.mobilenav:active { font-size: 20px; height: 36px; line-height: 36px; font-weight: 600; color: #333;  }

#system-message {  margin-bottom: 10px; }
.alert {  background: #cc2222; color: #ffffff; padding: 10px; border-radius: 3px; }
.alert h4 {  display: none; }
.alert a {  color: #cccccc;  }
.alert a:hover {  color: #ffffff;  text-shadow: 2px 2px 5px #000000;  }

#fimages {
    text-align: right;
}

.letterbox {  display: block;  text-align: center; margin-bottom: 15px; padding-bottom: 10px;}
.letterbox a { display: inline-block; padding: 5px 10px; color: #cc2222; }
.lead { padding: 10px 4px 5px 10px; margin-bottom: 10px;  border-bottom: 4px solid #84D0F0; }

#fimages  img {
    vertical-align: baseline;
    display: inline-block;
    width: auto;
    max-height: 64px;
    margin-left: 15px;
}

#similar .img-cover {
	width: 120px;
	height: auto;
}

@media (max-width: 1200px) {
    nav ul.nav li { margin-right: 10px; }
    #navicons img { margin-left: 5px; }
}
@media (max-width: 992px) {
    nav ul.nav li a { min-width: 0; }
}
@media (max-width: 765px) {
    nav div.custom { display: inline-block!important; }
    nav ul.nav li a { letter-spacing: 0; }
    #mobileDetect { display: block; }
    #navicons img { margin-left: 5px; }
    #page-wrap { margin-bottom: -200px; }
    #fimages { float: left; }
    footer, #page-wrap:after { height: 200px;  }
    footer ul.nav {  }
    footer ul.nav li { padding: 0 15px 5px 0; margin: 0;  display: inline-block; }

}
@media (max-width: 600px) {
}
@media (min-width: 1200px) {
}
@media screen {
}

