/*----------------------------------------------- * Desktop: > 1280px -----------------------------------------------*/ @media only screen and (min-width : 1280px) { body {font-size: 17px;} .ContainerLayer {width: 600px;} .ContainerLayer .LogoSofortUeberweisung {padding-top: 1.35em;} .ContainerLayer .LogoPayPal {padding-top: 1.85em;} #ContainerLayerLink, #ContainerLayerLinkBg {height: 4.75em;} #ContainerLayerLink .LinkClose {margin-top:2em;} .Wrap {padding: 0 15px; width: 1280px;} input[type="radio"], input[type="checkbox"] {width: 1.25em; height: 1.25em;} h1 {width: 96%} #Search {top: 290px; right: 30px;} #Search #SearchButton {top: 6px; right: 3px;} #Search #SearchButton input[type="image"] {width: 43px;} #Header {height: 205px;} #Header #Logo .Freecall {font-size: 110%;} #Header .LanguageSelection {height: 27px;} #Header .LanguageSelection p a {height:18px; background-size: auto 36px; font-size:93.75%;} #Header #Metanav {top: 75px;} #Header #Metanav p {font-size: 81.260%;} #Header #Warenkorb {width: 400px; height: 130px;} #Header #Navigation {top: 134px; height: 69px;} #Header #Navigation ul {height: 100%; width:calc(100% - 16px);} #Header #Navigation ul li {height: 100%; padding:9px 0 0 0;} #Header #Navigation ul li a {font-size:102%; line-height:3.575; -webkit-box-shadow: 0px 0px 9px -3px rgba(0,0,0,.9); box-shadow: 0px 0px 9px -3px rgba(0,0,0,.9);} #MainHome {background-size:100% 545px;} #MainHome .Wrap #Header {height: 202px;} #MainHome .Wrap #Header #Navigation {height: 67px;} #MainHome .Wrap #Search {top: 243px; right: 30px;} #MainHome .Wrap #Search #SearchButton {top: 4px; right: 5px;} #MainHome .Wrap #ContainerClaim {height: 290px;} #MainHome .Wrap #ContainerClaim #Claim img {width: 740px;} #MainHome .Wrap #ContainerDelivery {width: 250px; height: 240px; top: 310px;} #MainHome .Wrap #Content {background-size: 13px auto; background-position: 100% 30px;} #Main {background-size: auto 423px;} #Content {background-size: 13px auto; background-position: 100% 170px;} #Content #BgImg {width: 13px; height: 34px; right: 0;} #Content h1.TitelWk {background-size: 70px auto;} #Content .ContainerKonfig .ProduktFormular .Field {height: 53px;} #Content .ContainerKonfig .ProduktFormular .Field .Button input {height: 53px;} #Content .ContainerProdukt .ProduktDaten .ContainerButton input {height: 53px;} #Content .ContainerProdukt .PosFix {bottom: 0.75em;} #Content .ContainerProduktOrder .ProduktDaten .ContainerButton input {height: 42px;} #Content #ContainerButtonOrder a img, #Content #ContainerButtonOrder input {height: 65px;} .ProduktDetails {background-position: left 7px;} .ProduktDetails .ProduktDetailsNav ul li {padding-top: 0.35em; background-size: auto 39px;} .ProduktDetails .ProduktDetailsNav ul li div {width: 6px; background-size: auto 39px;} #Sidebar .SidebarDelivery {height: 260px;} .Footer p {font-size: 80%;} .Footer .Zertifizierung div img {height: 70px;} } /*----------------------------------------------- * Tablet Portrait: 668px - 1010px -----------------------------------------------*/ @media screen and (min-width : 668px) and (max-width : 1010px) and (orientation: portrait) { body {font-size: 11px; width: 100%;} .ContainerLayer {width: 450px;} .Wrap {padding: 0 4px 0 4px; width: 768px; overflow: hidden;} input[type="radio"], input[type="checkbox"] {width: 1.25em; height: 1.25em;} h1 {width: 96%; font-size: 160%; margin-top: 1.25em;} #Search {top: 168px; right: 20px;} #Search #SearchButton {top: 3px; right: 3px;} #Search #SearchButton input[type="image"] {width: 26px;} #Header {height: 120px;} #Header #Logo {top: 2px; width: 29.6%;} #Header #Logo .Freecall {font-size: 100%;} #Header .LanguageSelection {top: 16px; left: 31%; height: 27px;} #Header .LanguageSelection p a {margin-left: 1em; height:12px; background-size: auto 24px; font-size:105%;} #Header #Metanav {top: 44px; left: 32%;} #Header #Metanav p {font-size: 90%;} #Header #Warenkorb {width: 242px; height: 80px;} #Header #Navigation {top: 79px; height: 42px;} #Header #Navigation ul {width: calc(100% - 9px);} #Header #Navigation ul li {padding-top: 5px;} #Header #Navigation ul li a {font-size:103%; line-height: 3.4; -webkit-box-shadow: 0px 0px 7px -3px rgba(0,0,0,.9); box-shadow: 0px 0px 7px -3px rgba(0,0,0,.9);} #MainHome {background-size: 100% 324px;} #MainHome .Wrap #Header {height: 120px;} #MainHome .Wrap #Header #Navigation {height: 41px;} #MainHome .Wrap #Search {top: 139px; right: 13px;} #MainHome .Wrap #ContainerClaim {height: 172px;} #MainHome .Wrap #ContainerClaim #Claim img {width: 440px;} #MainHome .Wrap #ContainerClaim #Claim h1, #MainHome .Wrap #ContainerClaim #Claim .h1 {font-size: 190%;} #MainHome .Wrap #ContainerClaim #Claim h3, #MainHome .Wrap #ContainerClaim #Claim .h3 {font-size: 100%;} #MainHome .Wrap #ContainerClaim #Claim h2, #MainHome .Wrap #ContainerClaim #Claim .h2 {margin-top: 0.75em; font-size: 120%;} #MainHome .Wrap #ContainerDelivery {width: 160px; height: 160px; top: 180px;} #MainHome .Wrap #Content {background-size: 13px auto; background-position: 100% 30px;} #MainHome .Wrap #Content h1 {font-size: 125%;} #Main {background-size:auto 250px;} #Content {padding-top: 2.65em; background-size: 12px auto; background-position: 100% 85px;} #Content #BgImg {width: 12px; height: 20px; right: 0;} #Content h1.TitelWk {margin-top: 0.9em; padding-top: 0.4em; background-size: 42px auto;} #Content .ContainerKonfig .ProduktFormular .Label {line-height: 2.5;} #Content .ContainerKonfig .ProduktFormular .Field {height: 33px;} #Content .ContainerKonfig .ProduktFormular .Field .Button input {height: 36px;} #Content .ContainerProdukt .ProduktDaten .ContainerButton input {height: 36px;} #Content .ContainerProdukt .PosFix {bottom: 0.75em;} #Content .ContainerProdukt .ProduktDaten h3 {font-size: 130%;} #Content .ContainerProduktOrder .ProduktDaten .ContainerButton input {height: 27px;} #Content #ContainerButtonOrder a img, #Content #ContainerButtonOrder input {height: 40px;} #Content .ContainerProdukt a.MehrInfo, #Content .ContainerProdukt a.MehrInfoAktiv {font-size: 90%; padding-left: 1.55em; bottom: 2.45em;} .ProduktDetails {background-position: left -6px;} .ProduktDetails .ProduktDetailsNav ul li {padding-top: 0.35em; background-size: auto 26px;} .ProduktDetails .ProduktDetailsNav ul li div {width: 4px; background-size: auto 26px;} .ProduktDetails .ProduktDetailsText {font-size: 100%;} .ContainerGrey p.LabelRadio, .ContainerGrey p.LabelCheckbox {padding-top: 0.55em; padding-left: 0.5em;} #Content .ContainerGrey .LogoZahlung {padding-top: 0.25em;} #Sidebar {margin-top: 10.1em;} #Sidebar div h2 {font-size: 125%;} #Sidebar .SidebarDelivery {width: 90%; height: 200px;} #Sidebar .Freecall {background-size: 78% auto;} .Footer p {font-size: 80%;} .Footer .Zertifizierung div img {height: 45px;} } /*----------------------------------------------- * Phone: max 736px + iPhone6+/plump Landscape -----------------------------------------------*/ @media only screen and (max-width: 736px) { body {font-size: 13px !important;} a:hover, #Header #Warenkorb a.Link:hover .TextLink {color: #FFAE00;} #Dim {display: none;} #BottomGrey {display: none;} h1 {font-size: 150%; width: 95%;} .Fliesstext {padding-right: 0;} #LayerContainer {width: 90%; max-width: 90%; min-height: 100px; padding-bottom: 4em;} #ContainerLayerBg {-moz-opacity:0.70; opacity:0.70; filter:Alpha(opacity:70);} .ContainerLayer {width: 90%;} #ContainerLayerLink, #ContainerLayerLinkBg {height: 5.5em;} #ContainerLayerLink .LinkClose {margin-right: 3%;} #ContainerLayerLink .LinkButton {width: 80%; margin:1.25em 0 1rem 2.75%;} #Main {background-image: none;} .Wrap {width: 100%; max-width: 736px; padding: 0; overflow: hidden;} #MobileTransBg {display: none; position: fixed; width: 100%; height: 100%; overflow: hidden; z-index: 199; background: url("../img/m_bg_trans.png") repeat left top;} .MobileLink {display: block;} .MobileClose {display: block; position: absolute; top: 0; right: 0; width: 100%; height: 40px; z-index: 201; text-align: right; background: #2B2B2B; border-bottom: 1px solid #626262;} .MobileClose a {display: inline-block; padding: 1em 1em 1em 1em; font-size: 90%; color: #FFAE00; text-decoration: none; background-image: none !important;} #Search {display: none;} #SearchMobile {display: none; text-align: left; position: fixed; width: 100%; height: 160px; top: 0; right: 0; z-index: 200; background: #2B2B2B; -webkit-box-shadow: 0px 2px 56px -15px rgba(0,0,0,0.95); -moz-box-shadow: 0px 2px 56px -15px rgba(0,0,0,0.95); box-shadow: 0px 2px 56px -15px rgba(0,0,0,0.95);} #SearchMobile .Container {display: table; margin: 0 auto; margin-top: 35px; padding: 0; overflow: hidden; width: 100%; height: 125px; background: #2B2B2B url(../img/bg_search_home.png) 2% center no-repeat; background-size: auto 50%;} #SearchMobile #SearchFieldMobile {margin: 0px auto; padding: 0; overflow: hidden; display: table-cell; vertical-align: middle; padding: 0; margin: 0 auto; height: 125px; text-align: left;} #SearchMobile #SearchFieldMobile input {margin: 0 0 0 18%; width: 78%; padding: 0.75em 0 0.75em 0.75em; color: #000; background-color: #dadada; font-family:'Open Sans', sans-serif; font-size:110%; border: 0; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-box-shadow: inset -10px 62px 38px -62px rgba(204,204,204,1); -moz-box-shadow: inset -10px 62px 38px -62px rgba(204,204,204,1); box-shadow: inset -10px 62px 38px -62px rgba(204,204,204,1);} #SearchMobile #SearchFieldMobile input:focus {color:#000000;} #SearchMobile #SearchButtonMobile {position: absolute; top: 50.5%; right: 5%; overflow:hidden; width: 35px; height: 35px; z-index: 1;} #SearchMobile #SearchButtonMobile input[type="image"] {width: 2.5em;} #MobileButtonSearch {display: block; position: absolute; top: 8px; right: 68px; width: 50px; height: 50px; z-index: 200;} #MobileButtonSearch a {display: block; width: 100%; height: 100%; background: #e2e2e2 url("../img/m_button_search.png") no-repeat center center; background-size: 26px auto; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} #MobileButtonSearch a span {display: none;} #Header {position: fixed; height: auto; min-height: 100px; z-index: 199; overflow: visible; background: url("../img/m_bg_header.gif") repeat-x left top;} #Header #Logo {top: 3px; left: 3px; width: 60%; height:65px;} #Header #Logo .StandardLogo {display: none;} #Header #Logo .MobileLogo {display: block;} #Header #Logo img {width: 190px;} #Header #Logo .Freecall {color: #bfbfbf; font-size: 12px !important; top: 30px; left: 65px;} #Header #Logo .Freecall span, #Header #Logo .Freecall span a {color: #ffb700;} #Header .LanguageSelection {display: none;} #Header #Warenkorb {display: none; position: fixed; top: 0; right: 0; padding: 0; width: 100%; background: #2B2B2B; z-index: 200; height: 180px; -webkit-box-shadow: 0px 2px 56px -15px rgba(0,0,0,0.95); -moz-box-shadow: 0px 2px 56px -15px rgba(0,0,0,0.95); box-shadow: 0px 2px 56px -15px rgba(0,0,0,0.95);} #Header #Warenkorb h3 {display: none;} #Header #Warenkorb p {padding: 55px 1.2em 0 1.2em; font-size: 115%; color: #fff;} #Header #Warenkorb p span.Item {color: #fff;} #Header #Warenkorb .MobileLink {display: block; position: absolute; bottom: 8.5%; right: 11%; color: #fff; text-align: right;} #Header #MobileButtonWarenkorb {display: block; position: absolute; right: 8px; top: 8px; width: 50px; height: 50px; z-index: 100;} #Header #MobileButtonWarenkorb a {display: block; width: 100%; height: 100%; color: #990600; text-align: center; background: #ffffff url("../img/m_button_wk.png") no-repeat center center; background-size: 27px auto; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} #Header #MobileButtonWarenkorb a #DynAnzCartMobile {display: block !important; width: 22px; height: 22px; position: absolute; right: -1px; bottom: -1px; font-size: 85%; font-weight: 700; line-height: 2.25; z-index: 101;} #Header #Warenkorb a.Link .TextLink {margin-top: 15px;} #Header #Navigation {display: none;} #Header #Metanav {display: none;} #Header #MobileButtonNavigation {display: block; position: absolute; top: 8px; right: 128px; width: 50px; height: 50px; z-index: 100;} #Header #MobileButtonNavigation a {display: block; width: 100%; height: 100%; background: #ffb700 url("../img/m_button_nav.png") no-repeat center center; background-size: 23px auto; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} #Header #MobileButtonNavigation a span {display: none;} #Header #MobileNavigation {display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1000;} #Header #MobileNavigation .MobileClose {position: fixed; border-bottom: 0;} #Header #MobileNavigation .LanguageSelection {position: fixed; display: block; left: 0; top: 0; z-index: 202; height: 30px} #Header #MobileNavigation .LanguageSelection p a {margin: 10px 0 0 15px; padding-left: 30px; height: 20px; background-size: auto 39px;} #Header #MobileNavigation .LanguageSelection p a span {display: none;} #Header #MobileNavigation ul {position: absolute; top: 40px; left: 0; margin: 0; width: 100%; height: 100%; background: #ffb700; overflow: auto; -webkit-overflow-scrolling: touch;} #Header #MobileNavigation ul li {border-bottom: 1px solid #fff;} #Header #MobileNavigation ul li a {display: block; padding: 1em; color: #000; text-decoration: none; background: #ffb700 url("../img/icon_arrow2.png") no-repeat scroll 94% center; background-size: 9px auto; font-weight: 400; font-size: 110%;} #Header #MobileNavigation ul li.MetaNav a {padding: 1em; color: #000; background-color: #f0f0f0;} #Header #MobileNavigation ul li.EndList {border-bottom: none; background-color: #f0f0f0; height: 100px;} #MainHome {background-image: none;} #MainHome .Wrap #ContainerDelivery {top: 70px; right: -10px; width: 27%; height: 160px;} #MainHome .Wrap #ContainerClaim {height: auto; margin-top: 68px; padding-left: 1.2em; padding-bottom: 3em; background: url("../img/m_bg_claim.jpg"); background-size: cover;} #MainHome .Wrap #ContainerClaim #Claim {width: 90%; font-size: 2vw;} #MainHome .Wrap #ContainerClaim #Claim img {width: 101%;} #MainHome .Wrap #ContainerClaim #Claim h1, #MainHome .Wrap #ContainerClaim #Claim .h1 {width: 80%;} #MainHome .Wrap #ContainerClaim #Claim h2, #MainHome .Wrap #ContainerClaim #Claim .h2 {font-size: 120%; width: 80%;} #MainHome .Wrap #ContainerClaim #Claim h3, #MainHome .Wrap #ContainerClaim #Claim .h3 {font-size: 100%;} #MainHome .Wrap #ContainerClaim #Claim h3 span, #MainHome .Wrap #ContainerClaim #Claim .h3 span {display: inline;} #MainHome .Wrap #ContainerClaim #Claim h4, #MainHome .Wrap #ContainerClaim #Claim .h4 {line-height: 1.3;} #MainHome .Wrap #Content {width: 100%; margin: 0; padding: 1.2em; background-image: none;} #MainHome .Wrap #Content .Container {width: 50%; height: auto; padding-bottom: 0.5em; margin: 0 0 1% 0;} #MainHome .Wrap #Content .Container a {width: 100%; height: 100%; font-size: 160%; line-height: 1.35;} #MainHome .Wrap #Content .Container a span {padding-top: 5%; height: 25%; display: block; position: absolute; bottom: 0.15em; left: 0; font-size: 85%;} #MainHome .Wrap #Content .Container a:hover span{bottom: 0em; left: 0.15em;} #MainHome .Wrap #Content .Fliesstext {display: none;} #Content {width: 100%; padding: 5em 0 2em 0; margin: 0; background-image: none;} #Content h1, #Content .h1, #Content h2, #Content .h2, #Content h3, #Content .h3, #Content p, #Content p.Top, #Content #paypal-button-container {margin-left: 3%; margin-right: 3%;} #Content h1.TitelWk {min-height: 2em; background-size: 45px auto;} #Content .Img {padding:1.75em 3% 1.75em 3%;} #Content #BgImg {display: none;} #Content .ContainerKonfig, #Content .ContainerProdukt, #Content .ContainerProduktOrder {-webkit-border-radius: 0;-moz-border-radius: 0; border-radius: 0;} #Content .ContainerProdukt .ProduktImg, #Content .ContainerKonfig .ProduktImg, #Content .ContainerProduktOrder .ProduktImg {margin-top: 0; margin-left: 1.25em; margin-bottom: 2em;} #Content .ContainerKonfig .ProduktFormular {width: 95%;} #Content .ContainerKonfig .ProduktImg p, #Content .ContainerProdukt .ProduktImg p {font-size: 90%; position: absolute; top: -12px; left: 31%; font-size: 125%; z-index: 1;} #Content .ContainerProdukt .ProduktDaten {margin-bottom: 2.5em;} #Content .ContainerProdukt .ProduktDaten .ContainerMenge {width: 90%;} #Content .ContainerProdukt a.MehrInfo, #Content .ContainerProdukt a.MehrInfoAktiv {font-size: 90%; bottom: 2.25em;} #Content .ContainerProduktOrder .ProduktDaten .ContainerButton input {height: 30px; margin-top: 0.25em;} #Content #ContainerButtonOrder a img, #Content #ContainerButtonOrder input {height: 45px;} #Content #ContainerButtonOrder a.ButtonBack {margin-left: 0.75em;} #Content #ContainerButtonOrder a.ButtonOrder {margin-right: 0.75em;} .ProduktDetails {margin-top: 1em; padding-top: 1em; background-image: none; height: auto;} .ProduktDetails .ProduktDetailsNav {display: none;} .ProduktDetails .MobileLink {float: left; margin: 1.4em 0 0 0.75em; text-transform: uppercase; font-weight: bold; } .ProduktDetails .ContainerDetails {display: block !important; padding-bottom: 1em;} .ProduktDetails .ProduktDetailsText {clear: both; padding-top: 1.25em; width: 100%; float: none; font-size: 12px;} .ProduktDetails .ProduktDetailsText p {margin-left: 0 !important;} #Content .ContainerGrey {padding-left: 0;} #Content .ContainerGrey p.FieldText {width: 55%;} #Sidebar, #MainHome .Wrap #Sidebar {float: none; width: 100%; margin: 0; padding: 0.25em 0 0 1.2em; overflow: hidden; border-top: 1px solid #dddddd;} #MainHome .Wrap #Sidebar div {display: block; padding-right: 1.2em; margin-bottom: 0.5em;} #MainHome .Wrap #Sidebar .Pro {height: auto; margin-bottom: 10px;} #MainHome .Wrap #Sidebar .Pro ul li span {position: static; margin-top: 0.5em;} #Sidebar div {display: none; margin-bottom: 0; padding-bottom: 2em;} #Sidebar .Freecall {display: block; height: auto; padding-top: 10px; padding-right: 50px !important; background-size: auto 100%;} #Sidebar .Banner {display: block !important; width: 100.5%; height: auto;} #Content .ContainerMeldung, #Content .ContainerMeldungError {margin-left: 3%; margin-right: 3%; padding-left: 2.5em; padding-right: 1em;} .Footer {padding:0 1.25em 0 1.25em;} .Footer .Herstellung {display: none;} .Footer .Freecall {display: none;} .Footer .Zertifizierung {display: none;} .Footer p.FooterNavBlock {display: none;} .Footer p.FooterLink {display: none;} .Footer p.Adresse {font-size: 12px; width: 85%; line-height: 1.5;} .Footer div.gPlusShare {margin: 1em 0 1em 0 !important; float: right;} } /*----------------------------------------------- * Phone: max 570px -----------------------------------------------*/ @media only screen and (max-width: 570px) { #ContainerLayerLink, #ContainerLayerLinkBg {height: 8.5em;} #ContainerLayerLink .LinkClose {display: inline-block; float: none; margin: 0.75em auto 1em auto; font-size: 100%;} #ContainerLayerLink .LinkButton {float: none; margin: 0 auto 1rem auto; width: 95%; font-size: 95%;} #MainHome .Wrap #Content .Container a {font-size: 120%;} #MainHome .Wrap #ContainerDelivery {width: 30%;} #MainHome .Wrap #ContainerClaim {padding-bottom: 2em;} #MainHome .Wrap #ContainerClaim #Claim {width: 90%; font-size: 100%;} #MainHome .Wrap #ContainerClaim #Claim h1, #MainHome .Wrap #ContainerClaim #Claim .h1 {font-size: 180%;} #MainHome .Wrap #ContainerClaim #Claim h2, #MainHome .Wrap #ContainerClaim #Claim .h2 {width: 90%;} #MainHome .Wrap #ContainerClaim #Claim h3 span, #MainHome .Wrap #ContainerClaim #Claim .h3 span {display: inline;} #Content .ContainerKonfig .ProduktImg {float: none; width: 23%;} #Content .ContainerKonfig .ProduktFormular {float: none; margin: 1.5em 0.5em 0 1.25em;} #Content .ContainerProdukt .ProduktDaten {} #Content .ContainerProdukt .ProduktDaten h3 {} #Content .ContainerProdukt a.MehrInfo, #Content .ContainerProdukt a.MehrInfoAktiv {font-size: 80%; bottom: 2.5em;} #Content .ContainerGrey p.Label {float: none; width: 90%;} #Content .ContainerGrey div.Field {float: none; width: 90%; margin-left: 3%;} #Content .ContainerGrey p.LabelRadio, #Content .ContainerGrey p.LabelCheckbox {width: 80%;} #Content .ContainerGrey p.LabelLogoZahlung {width:auto;} #Content .ContainerGrey p.LinkInfo a {font-size: 90%;} #Content #ContainerSumme .Versand {display: inline-block; width: 80%;} #Content #ContainerSumme .Versand span {white-space: nowrap;} } /*----------------------------------------------- * Phone: max 479px -----------------------------------------------*/ @media screen and (max-width: 479px) { body {width: 100%; font-size: 13px;} .Wrap {max-width: 479px; width: 100%; overflow: hidden;} #Header #Logo img {width: 165px;} #Header #Logo .Freecall {font-size: 12px !important; top: 25px; left: 56px;} #Content {} #Content h3.TitelKonfig {font-size: 100%;} #Content h3.TitelKonfig span {margin-left: 0.25em;} #Content .ContainerKonfig .ProduktImg, #Content .ContainerProdukt .ProduktImg, #Content .ContainerProduktOrder .ProduktImg {float: none; width: 55%; margin: 1em auto 0 auto !important;} #Content .ContainerKonfig .ProduktImg {height: auto; min-height: 13.5em;} #Content .ContainerKonfig .ProduktImg p {position: static;} #Content .ContainerKonfig .ProduktFormular {margin-left: 1em;} #Content .ContainerKonfig .ProduktFormular .Label {float: none; width: 99%; height: auto; line-height: 1.75;} #Content .ContainerKonfig .ProduktFormular .Label span {display: inline-block;} #Content .ContainerKonfig .ProduktFormular .Field {float: none; width: 99%; height: auto; padding-bottom: 0.5em;} #Content .ContainerKonfig .ProduktFormular .Field .Preis {float: none;} #Content .ContainerKonfig .ProduktFormular .Field .Button {text-align: center;} #Content .ContainerKonfig .ProduktFormular .Field .Button input {margin-top: 1em; height: 58px;} #Content .ContainerProdukt {padding-bottom: 3.5em;} #Content .ContainerProdukt .ProduktDaten {float: none; margin: 1.5em 1em 0 1em; width: 93%;} #Content .ContainerProdukt .ProduktDaten h2 {text-align: center; margin: 2.25em 0.75em 0 0;} #Content .ContainerProdukt .ProduktDaten h3 {text-align: center; margin-bottom: 1.25em; font-size: 140%;} #Content .ContainerProdukt .PosFix {position: static; width: 100%; left: 1em;} #Content .ContainerProdukt .ProduktDaten .ContainerMenge, #Content .ContainerProdukt .ProduktDaten .ContainerPreis {width: 90%; float: none; overflow: hidden; margin-top: 0.25em;} #Content .ContainerProdukt .ProduktDaten .ContainerButton {float: none; text-align: center; margin: 0; padding-bottom: 1em; border-bottom: 1px solid #fff;} #Content .ContainerProdukt .ProduktDaten .ContainerButton input {margin-top: 1em; height: 58px;} #Content .ContainerProdukt a.MehrInfo, #Content .ContainerProdukt a.MehrInfoAktiv {bottom: 1.5em; font-size: 100%;} #Content .ContainerProduktOrder .ProduktDaten {float: none; margin: 1.5em 1em 0 1em; width: 93%;} #Content .ContainerProduktOrder .ProduktDaten h3 {text-align: center; margin-bottom: 1.25em; font-size: 121.429%;} #Content #ContainerButtonOrder {text-align: center;} .ProduktDetails {margin-top: 1em;} .ProduktDetails .ProduktDetailsText {font-size: 12px;} #Content .ContainerGrey p.LinkKorrektur {float: none; text-align: right; margin-bottom: 2em; font-size: 80%;} #Content .ContainerGrey p.LabelText {float: none; width: auto; padding-bottom: 0;} #Content .ContainerGrey p.FieldText {float: none; width: auto;} #Sidebar .Freecall {background-size: 85% auto;} } /*----------------------------------------------- * Phone: max 375px -----------------------------------------------*/ @media screen and (max-width: 375px) { .ContainerLayer {width: 90%; background-size: 1.95em auto; background-position: 0.8em 0.85em; padding: 0.5em 3.5em 2em 3.75em; font-size: 90%;} .ContainerLayer .LogoZahlung {clear: both; margin-top: -1.25em; margin-bottom: 0.75em; padding-left: 0;} #SearchMobile #SearchButtonMobile {top: 52%;} #Header #Logo {top: 2px;} #Header #Logo img {width: 145px;} #Header #Logo .Freecall {top: 23px; left: 49px; font-size: 12px !important; line-height: 1.25;} #Header #Logo .Freecall span {display: block;} #Header #Warenkorb .MobileLink {right: 13%;} #Header #Warenkorb p {font-size: 100%;} #Header .LanguageSelection p a {padding-left: 30px; margin-right: 2px;} #SearchMobile #SearchButtonMobile {width: 28px;} #SearchMobile #SearchButtonMobile input[type="image"] {width: 2em; margin: 2px 0 0 0;} #SearchMobile .Container {background-size: auto 33%;} #MainHome .Wrap #ContainerDelivery {right: -5px; height: 120px} #MainHome .Wrap #ContainerClaim #Claim h1, #MainHome .Wrap #ContainerClaim #Claim .h1 {font-size: 6vw; line-height: 1.3555;} #MainHome .Wrap #Content .Container {width: 100%; font-size: 125%;} #MainHome .Wrap #Content .Container a span {padding-top: 5.5%;} #MainHome .Wrap #ContainerDelivery {} #MainHome .Wrap #ContainerOekotex {left: 6em; bottom: 0% !important;} #MainHome .Wrap #ContainerQuality {left: 11.5em; bottom: 0% !important;} /* #Content {padding-top: 26%;} */ #Content .ContainerKonfig .ProduktImg {min-height: 11em;} #Content .ContainerProduktOrder .ProduktDaten .ContainerButton input {height: 28px;} #Content #ContainerButtonOrder a img, #Content #ContainerButtonOrder input {height: 43px;} #Content #ContainerSumme .Versand {width: 100%;} #Content #ContainerSumme .Versand span {white-space:normal !important;} #Content .ContainerGrey p.LinkInfo {margin-bottom: 1em; float: none;} #Content .ContainerGrey .LogoZahlung {clear: both; margin: -0.5em 0 1.25em 2em;} .FooterBottom p.Adresse {width: 80%;} .FileNotFound {font-size:140%;} .ErrorTopic {font-size:230%;} } /*----------------------------------------------- * Phone: max 339px -----------------------------------------------*/ @media screen and (max-width: 339px) { #Header #Logo {top: 4px;} #Header #Logo img {width: 122px;} #Header #Logo .Freecall {top: 20px; left: 42px; font-size: 70% !important; line-height: 1.25;} #Header #Logo .Freecall span {display: block;} .FileNotFound {font-size:140%;} .ErrorTopic {font-size:230%;} } /*----------------------------------------------- * Phone: max 315px -----------------------------------------------*/ @media screen and (max-width: 315px) { body {font-size: 11px !important;} #Header #Logo {width: 40px;} #Header #Logo img {width: 130px;} #Header #Logo .Freecall {display: none;} #SearchMobile .Container {background-size: auto 25%;} .ErrorTopic {font-size:270%;} .FileNotFound {font-size:165%;} }