@import url('reset.css');
@import url('base.css');
@import url('header.css');
@import url('footer.css');
@import url('navigation.css');
@import url('maincontent.css');
@import url('components.css');
@import url('checkout.css');


#header {width: 100%; height: 150px;}
#header #mini-search {float:right; height: 28px; margin-right:10px; margin-top:-20px;}
#header #mini-search input.FieldSearch {position: relative; top:-9px; width:188px; height: 19px; padding:3px 5px 3px 5px; margin-right: -3px; -webkit-box-shadow: inset 1px 1px 5px 2px #999999; box-shadow: inset 1px 1px 5px 2px #999999;  border: none; color: #656561; }
#header #mini-search input.button {height: 26px;}

#maincont .box33 {float: left; width: 30%; margin-right: 2%; padding:0 1%; margin-bottom:10px;}
#maincont .box33.last {margin-right:0}

#maincont .box33, #maincont .box50 {-webkit-box-shadow: 0px 0px 3px 2px #bbbbbb; box-shadow: 0px 0px 5px 2px #bbbbbb; }
#maincont .box33 h1, #maincont .box33 h2, #maincont .box33 h3, #maincont .box33 h4, #maincont .box33 h5, #maincont .box33 h6 {margin-top:15px; font-size: 15px; line-height: 20px; color: #035E53;}
#maincont .box33 p, #maincont .box50 p { font-size: 12px; line-height: 17px; }
#maincont .box33 h1.wfw, #maincont .box33 h2.wfw, #maincont .box33 h3.wfw, #maincont .box33 h4.wfw, #maincont .box33 h5.wfw, #maincont .box33 h6.wfw {font-size: 15px; line-height: 20px;}

#maincont #content #teaser,
#maincont #content #teaser img {width:100%;}

#maincont #content #teaser {height: 214px; margin-bottom:20px;margin-top:10px;}

#maincont #plugnav {position: absolute; float: left; padding: 20px 0 0 0 ; background: url(../img/layout/ga-border.png) no-repeat;  font-size: 13px; line-height: 20px; z-index: 1000;}

#footer #footer1 {display:inline-block;margin-top: 20px;padding: 10px 1%; background: #E2E2E2; font-size: 11px; line-height: 18px; color: #6B6C6B;}
#footer #footer1 .f1box {float: left; width: 32%; margin-right: 1%;}
#footer #footer1 .f1box.last {margin-right: 0;}

#footer #footer1 .f1ue {display: block; font-size: 12px; margin: 0 0 5px 0; font-family: osbold, sans-serif;}
#footer #footer1 .f1box ul {margin: 0; font-size: 11px;}
#footer #footer1 .f1box ul li {display: block; margin: 0 0 4px 0; padding: 0 0 0 10px; background: url('/img/layout/fli.gif') 0 8px no-repeat;}

#footer #footer2 {display:inline-block; margin:-2px 0; padding: 10px 1%; background: #C4C5C5; font-size: 11px; line-height: 18px; color: #6B6C6B;}
#footer #footer2 .f2box {float: left; width: 49%; margin-right:1%;}
#footer #footer2 .f2box.last {margin-right: 0;}
#footer #footer2 p {font-size: 11px;font-size: 11px;}

#maincont article table.incontent {background:#EEE;margin:10px 0;font-size:13px;}
#maincont article table.incontent tr td {;border-bottom:1px solid #DDD; padding: 5px;}
#maincont article table.incontent tr:last-child td {border-bottom:none;}
#maincont article table.incontent tr td p {margin:0;}

#maincont form.contact table.incontent,
#maincont table.incontent.newsletter,
#maincont table.incontent.gewinnspiel,
#maincont table.incontent.newsletter {background:initial;} 
#maincont table.incontent.newsletter input[type="submit"] {margin-bottom:10px;}
#maincont table.incontent.newsletter .tablelabel {text-align:left;}
#maincont form.contact table.incontent tbody tr td,
#maincont table.incontent.newsletter tbody tr td,
#maincont table.incontent.gewinnspiel tbody tr td {border-bottom:none;}
#maincont form.contact table.incontent tbody tr td {padding:4px 8px 4px 0;margin: 0 5px 5px 0;}
#maincont form.contact table.incontent tbody tr td input,
#maincont form.contact table.incontent tbody tr td textarea {margin-right:4px;}
#maincont form.contact table.incontent tbody tr td .tablelabel {text-align:left;padding-left:0}

#maincont form.contact table.incontent tbody tr td:first-child {width:160px}
#maincont form.contact table.incontent tbody tr td input[type="text"] {width:150px;border:1px solid #888;padding:3px 6px;}
#maincont form.contact table.incontent tbody tr td textarea {width:250px;border:1px solid #888;padding:3px 6px;}
#maincont form.contact table.incontent tbody tr td input[type="submit"] {margin:10px 0;}

#maincont table.gewinnspiel tbody tr td input[type="text"] {padding:2px 4px;margin-right:5px;}

img.mobile, #video.mobile {display:none;}
img.desktop, article.desktop, #video.desktop {display:block;}

img.mobile-cart-button {display:none}

#fancybox-wrap {z-index:99999!important;}

form.zoom_searchform {font-size:13px;}


/* DESKTOP ONLY */

@media (min-width: 1024px) {

#pagemargins {width: 980px;}

#pagemargins.ohrstoepsel #mainnav {height:630px;}

#mainnav {float:left; position: relative; width: 200px; margin-left:10px; padding: 0; background: #035D51;}
#mainnav nav {background:#035C47}
#maincont {width: 100%; margin: 10px 0;}
#maincont.nrcol #content {float: right; width:750px; margin-right:10px;}
#maincont.nrcol #content, #maincont.rcol #content {min-height:1300px}
#maincont #plugselect {width:735px; height:17px; padding:8px 5px 12px 10px;}

#maincont #plugnav { top: 204px;}

#header {background: url('/img/layout/header-1024.png') no-repeat #134B4B;}

.w1024 {display: inline !important;}
.w768 {display: none !important;}

}
/* DESKTOP + TABLET  */

@media (min-width: 768px) {

#maincont #content #teaser .teasercont { position: relative; top: -160px; width: 400px; margin: 0 0 0 0px; -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3); box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.3); }
#maincont #content #teaser .teasercont h1 { width: 370px; margin: 0; background: url('/img/layout/ul-teaser.png') transparent repeat; padding: 10px 5px 7px 25px; }
#maincont #content #teaser .teasercont p { width: 370px; padding: 0px 5px 10px 25px; background: url('/img/layout/ul-teaser.png') transparent repeat; font-size: 15px; line-height: 18px; }

#header.desktop {display:block;}
#header.mobile {display:none;}
nav#menu #canvasmenu {display:none;}
div#header-sticky-wrapper {display:none}
}

/* TABLET ONLY */

@media (min-width: 768px) and (max-width: 1023px) {

#pagemargins {width: 768px;}

#header {background: url('/img/layout/header-768.png') no-repeat #134B4B;}
#header #mini-search { margin-top:20px;}
#header #mini-search input.FieldSearch {width:95px;}
#mainnav {padding:0;}
#mainnav nav {padding:0 10px;background:#035C47}

#maincont #plugselect {width:100%;padding: 5px 0;margin:10px 0;}
#maincont #plugselect a:first-child {padding-left:5px;}
#maincont #plugselect a:last-child {padding-right:5px;}

#maincont #plugnav { top: 241px;}

#maincont #content {padding:0 15px;}
.w1024 {display: none !important;}

.finder #maincont.rcol #content .box50 { width: 235px!important;}
div_plugselector_button {display:none;}
}

/* SMARTPHONE ONLY */

@media (max-width: 767px) {

body {background:none;overflow-x:hidden;}
h1 br, h2 br, h3 br, h4 br {display: none;}

h1.greenbox, h2.greenbox, h3.greenbox, h4.greenbox, h5.greenbox, h6.greenbox {background:#035C47;}

#pagemargins.ohrstoepsel #header.mobile {height:60px;}
#pagemargins.ohrstoepsel #header.mobile #topbar a.mobilemenu {padding-top:5px;}
.w1024 {display: none !important;}
img.mobile, #video.mobile {display:block!important;}
img.desktop, article.desktop, #video.desktop {display:none!important;}
#pagemargins {width:100%;}
/*#maincont {margin-top:100px;}*/
#maincont #content, #maincont #right {padding: 0 4%; }
#mainnav {display:none;}
#mainnav nav {padding:0 10px;}
#mainnav .ue {padding:0px 10px 20px 10px!important}
#mainnav .ue br {display:none;}
#mainnav nav #navextra span {padding-left:37px;line-height:20px;background:#035D51}
#mainnav nav #navextra ul {margin-left:10px;margin-top:10px;}
#mainnav nav #navextra ul li {margin-bottom:5px;}
#mainnav nav #navextra ul li a img {float:left;}
#mainnav nav #navextra ul li a br {display:none;}
#mainnav nav #navextra span.l2 {font-size:11px;}

#maincont #plugselect {display:none;}

#header {width: 100%; height:100px; background:#035C47;}
#header.desktop {display:none;}
#header.mobile {display:block;position:fixed;top:0;box-shadow:0 0 3px #000;z-index:99999}
#header.mobile #topbar {padding: 10px 4%;width:92%;}
#header.mobile #topbar a.mobilemenu {display:block;width:15%; padding-top:3px; float:left;}
#header.mobile #topbar a.mobilelogo {display:block;width:70%; float:left; text-align:center;}
#header.mobile #topbar a.mobilelogo img {width: 100px;}
#header.mobile #topbar a.mobilecart {display:block;width:15%; padding-top:3px;text-align:right; float:left;}
#header.mobile #topbar a i {font-size:26px; color:#FFF;}
#header.mobile #mobilesearch {position:relative; width: 88%; padding:0 4%; margin-top:40px;text-align:center;}
#header.mobile #mobilesearch input.FieldSearch {width:100%;padding: 0 2%; height:24px; border:1px solid #444; -webkit-box-shadow: inset 1px 1px 3px 1px #888; box-shadow: inset 1px 1px 3px 1px #888;}
#header.mobile #mobilesearch input.button {height:24px;position:absolute;right:0;margin-top:-25px;}

#footer #footer1, #footer #footer2 {padding:10px 15px;}
#footer #footer2 .f2box, #footer #footer1 .f1box {width: 100%; margin-right:0; margin-bottom: 15px;}

#maincont #content #teaser {width:100%;height:initial;}
#maincont #content .teasercont h1 {margin-top:20px;}

#maincont #content #teaser.details {width:100%; height:initial;}
#maincont #content #teaser.details .teaserdetails {width:98%;padding:1% 1% 2% 1%;height:initial;top:0;margin: 20px 0;clear:both}
#maincont #content #teaser.details .teaserdetails,
#maincont #content #teaser.details .teaserdetails h1,
#maincont #content #teaser.details .teaserdetails ul {background:#F0F0F0}

#maincont .box33 {width: 48%; margin:0;padding:0;margin-right:2%;margin-bottom:15px;min-height:220px;}
#maincont .box33.last {margin-right:2%}
#maincont .box33, #maincont .box50  {margin-bottom:15px;}
#maincont .box33 > *,
#maincont .box50 > * {padding: 0 15px;}
#maincont .box33 img.alignright, #maincont .box50 img.alignright {max-height:60px;float:left;padding-right:5px;}
.clear {clear:initial}

#maincont #right #boxz {display:none;}
div#canvasmenu {background:#035D51}
div#canvasmenu div#gp {margin-top:-152px; margin-left:134px}
nav#menu #mainnav {display:block;padding:0;}
#mainnav #nav1, nav#menu #mainnav #nav2, nav#menu #mainnav #nav3 {display:block;}
#mainnav #nav1 ul, #mainnav #nav2 ul, #mainnav #nav3 ul {position:inherit;top:0;}

#mainnav nav {background:#035D51;padding:0;} 
#mainnav nav span {background:url('/img/layout/mainnavue1024.png') repeat-x #074334;width: 100%;display: block;line-height: 40px;padding-left: 10px;}
#mainnav nav ul li a {font-family:osreg, sans-Serif;font-size:14px;}
#mainnav #nav1 ul li img {padding-right:5px;}
#mainnav .ue {float: none; position: relative; display: block !important; height: 17px; margin: 0; padding: 10px 10px 10px 10px; background:url('/img/layout/mainnavue1024.png') repeat-x #074334;}
#mainnav .ue.finder {background:url('/img/buttons/finder.png') no-repeat transparent; width:210px; height: 84px; padding: 0 0 10px 0;}
#mainnav .ue.finder a {display:block;padding:23px 60px 0px 25px;line-height:20px;}

div#div_plugselector_result {margin-top:20px;}
.finder #maincont.rcol #content .box50 {width:48%;margin:1%}
.finder #maincont.rcol #content .box50 > * {padding:0}

img.fullwidth {max-width:100%}

div#porto {display:block;float:left;width:100%;background:#EEE;margin:20px 0;padding:10px 0;}
#maincont #portobox {width:100%; margin-left:10px;}
#maincont #portobox .pb-countryselect {text-align:left;margin:5px 0;}
#maincont #portobox .pb-1 {text-align:left;}

/** Components **/

div#social {height:35px;padding-left:10px;background:#035D51;}
#socialfixed {display: none;}

#maincont #waswen .plugnavcol {width:initial;}
#maincont .tablelabel {text-align:left;padding:0;}

img.mobile-cart-button {display:block;position:fixed;right:0;bottom:50px;width:50px;cursor:pointer}

#maincont #right #boxwk .boxwkform, #maincont #content #boxwk .boxwkform {float:left;width:98%}
#maincont #right #boxwk.follow {display:none;}

#right input.cart-button { margin:10px 0;float:right}

div#div_plugselector_button {position: fixed;background: #035C47; width: 100%; height: 20px; left:0; bottom: 0;margin-left:-4%; padding:10px 2%; text-align:center; color:#FFF;box-shadow:0 0 5px #555; cursor:pointer;z-index:99999}
div#div_plugselector_button.search span.search { display:block;}
div#div_plugselector_button.update span.update { display:block;}

div#div_plugselector_result {display:none}

}

@media (min-width: 600px) and (max-width: 768px) {
h2.break {float:left;}
}

@media (max-width: 600px) {
#maincont .box33 {width:100%;min-height:initial;margin-right:0;}

}
/* SMARTPHONE SMALL ONLY */

@media (min-width: 481px) and (max-width: 768px) {
#maincont #content #teaser {overflow:hidden;}
#maincont #content #teaser img {float:right;width:initial;margin-bottom:10px;}
}
@media (max-width: 480px) {

#maincont .box33 {width: 100%; margin:0;padding:0;margin-bottom:15px;}

#maincont #imgbox { width:100%;}
#maincont #imgbox img.bigimg { width:96%;margin:2%}
#maincont #imgbox img.smallimg {width:28%;margin:2%}

#maincont form.contact table.incontent {width:100%}
#maincont form.contact table.incontent tbody tr {margin-top:5px;}
#maincont form.contact table.incontent tbody tr td {display:block;text-align:left;width:100%;padding:2px 0;}
#maincont form.contact table.incontent tbody tr td input[type="text"],
#maincont form.contact table.incontent tbody tr td textarea {width:90%; padding:4px 2%; margin-right:3px;}

.imagemap.navigator {display:none;}
.finder #maincont.rcol #content .box50 {width:98%;margin:1%}
a.facebook-button img {width:100%;}

#maincont div.entry p img {width:100%;height:initial;}
#maincont div.entry p img.wp-image-33 {width:initial;}

#maincont article table.incontent.kapseln tr td {padding:5px 2px;font-size:12px;}
#maincont article table.incontent.kapseln tr:first-child td {font-size:10px;}
#maincont article table.incontent.kapseln tr td img {width:45px}

/* #maincont div.entry p img, #maincont div.entry p a img, #maincont div.entry p img.alignright {width:100%!important;height:initial!important;} */
}

@media (max-width: 545px) {
.imagemap img, .imagemap map {width:100%;}
}


@media (max-width: 420px) {
#maincont #portobox .pb-1 {width:100%}
}