body { background-image: url(../zentral/hg.jpg); background-repeat: repeat-x; background-color: #fefff6; margin: 0px; padding: 0px; font: 12px Verdana, Arial; } body, table { font: 13px Verdana, Arial; line-height: 20px; } a:link {color: #008000;} a:visited {color: #008000;} img {border: none; max-width:100%;} table {padding: 0px; width:100%;} td {vertical-align: top;} h1 { font: 900 14px Verdana, Arial; line-height: 25px; } h2 {font: 900 13px Verdana, Arial; margin-top:25px;} h3 {font: 900 14px Verdana, Arial;} .right{ float:right; margin: 0 0 15px 15px;} .left { float:left; margin: 0 15px 15px 0;} .clear { clear:both;} #wrapper { margin: 20px auto; text-align: left; max-width: 960px; position: relative; padding: 0px; -webkit-box-shadow: #666 1px 0 37px; -moz-box-shadow: #666 1px 0 37px; box-shadow: #666 1px 0 37px; background-color:#fefff6;} #kopf { margin-top: 0px; padding:0; position:relative; background: #fcfef3; /* Old browsers */ background: -moz-linear-gradient(top, #fcfef3 0%, #a3b73c 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #fcfef3 0%,#a3b73c 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #fcfef3 0%,#a3b73c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfef3', endColorstr='#a3b73c',GradientType=0 ); /* IE6-9 */ } #picture img {position: absolute; bottom:0; max-width:207px; } #lieferung #picture img, #beratung #picture img { max-width:220px; } #probe #picture img {height:100%; max-width: auto;} #kontakt #picture img {bottom: -25px;} #agb #picture img {bottom: -34px; height: 175px; margin-left: 45px;} #links #picture img {bottom: -34px;} #login #picture img {height: 165px; } #impressum #picture img {height: 156px; } #logo { position: relative; margin-top: 20px; margin-left: 250px; text-align: center; z-index: 3; padding: 9px 10px 9px 0; } #logo .subline {margin-top: -8px; font: 900 13px Verdana, Arial;} #content { margin-left:250px; margin-right: 30px;} #container {float:left; width:100%;margin-top: 10px;} #status { margin-top: 9px; padding: 3px; background: #fcfef3; /* Old browsers */ background: -moz-linear-gradient(top, #fcfef3 0%, #a3b73c 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #fcfef3 0%,#a3b73c 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #fcfef3 0%,#a3b73c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfef3', endColorstr='#a3b73c',GradientType=0 ); /* IE6-9 */ ;} #inhalt { margin-top: -10px; } .beratung li { margin-left: 250px; list-style-type: none; } .nav-list a { text-decoration: none; color: black; margin-left: 20px; } .nav-list a:hover {font: 900 12px Verdana, Arial;} #fuss {text-align: center; margin-bottom: 30px;} .button a { padding: 10px; background-color: green; color: white; border-radius: 5px; text-decoration: none; } p.button {margin: 20px 20px 30px 0; line-height: 30px;} .tab-best { background-color: #d9e2aa; border-collapse: collapse; border: 1px solid black; } .tab-best td {border: 1px solid black;} th.tab-best {text-align: center;} .clear.end {margin-bottom:15px;} .jahre { margin-top:-13px; float:right;} h2.aktuelles { color:red;text-align:center; border:none !important;} #bestellung #content h2 {margin-bottom:0; border-bottom: 2px solid #869633;} #bestellung table.produkte { color:black; } #bestellung .produkte td { background-color: #d2daa8; border-bottom: 2px solid #ffffff; } #bestellung .produkte td td { border-bottom: none; } #bestellung .produkte td.price {padding-right:10px; text-align:right } #bestellung .produkte td.massen { text-align:center } #bestellung .produkte td.massen span {display:none;} #bestellung .produkte .zw-ueberschrift {vertical-align:bottom; background-color:#fefff6;} #bestellung .produkte .zw-ueberschrift > div {margin-top:30px; } #bestellung table.sonderangebote { color:red; width:100% } #bestellung .sonderangebote th { color:black; } #bestellung .sonderangebote td { color: rgb(150,75,0); } #bestellung .nachricht {width:100%; text-align:left;} #bestellung .nachricht td.label {width:90px; } #bestellung textarea {max-width:450px; width:100%;} #lieferung iframe { width: calc(100% + 200px); margin-left:-200px; height:550px; border:0 } .video { aspect-ratio: 16 / 9; width: 100%; } input[type=text], #kontakt textarea { width:100%; max-width:250px;} #probe table, #kontakt form table { line-height: 30px;} #kontakt #content img {width:70%;float:right; margin-left:20px; max-width:400px;} #kontakt .label { float:left; margin-right:10px; margin-top:0; font-weight:bold; width:200px;} #kontakt .wert {float:left; margin-top:0;margin-bottom:0;width:350px;margin-left:67px; } #kontakt #content .clear { margin-bottom:13px; } .submit {line-height:30px; } #bestellung-uebersicht .adresse, #letzte-bestellungen .adresse {float:left; width:50%;} #bestellung-uebersicht table.zusammenfassung { border-collapse: collapse; } #bestellung-uebersicht .zusammenfassung th {border-bottom: 1px solid black; } #start h1, #start h2 {text-align:center;} #start ul#themen {padding:0; margin-left:0; } #start #themen li {float:left; width:45%; margin:1%; padding:8px;list-style-type:none; text-align:center;-webkit-box-shadow: #666 1px 0 5px; -moz-box-shadow: #666 1px 0 5px; box-shadow: #666 1px 0 5px; background-color: #eaf1cb; } #start #themen li p {height:42px; margin:0;} #start .button a{display: inline-block;width: 200px; } div.privacy-msg p { border: 1px solid black; padding: 5px; text-align:center; -webkit-box-shadow: 0 10px 6px -6px #777; -moz-box-shadow: 0 10px 6px -6px #777; box-shadow: 0 10px 6px -6px #777; } #lieferung div.privacy-msg p { width:calc(100% - 200px); } .privacy-msg input { width: auto; } @media all and (max-width:1000px){ #wrapper { margin-top:-20px; } #logo {margin-left:0; } #picture img {display:none;} #kopf {height: 145px } } @media all and (min-width:767px) and (max-width:900px){ #bestellung table.produkte {margin-left:-160px;} #bestellung table.sonderangebote {margin-left:0px;} } @media all and (max-width:766px){ #logo {margin-left:0; } .jahre { margin-top: 62px; height: 73px; } #content { margin-left:30px; } #lieferung iframe, #lieferung div.privacy-msg p { width: 100%; margin-left:0px; } } @media all and (max-width:669px){ #bestellung table.produkte {border-spacing: 7px; } #bestellung .produkte tr {background-color:#d2daa8;} #bestellung .produkte th {display:none;} #bestellung .produkte td {display:block; border:none; background-color:transparent;} #bestellung .produkte td:nth-of-type(1) {float:left; width:30%; padding-bottom:10px;} #bestellung .produkte td:nth-of-type(2),#bestellung .produkte td:nth-of-type(3),#bestellung .produkte td:nth-of-type(4),#bestellung .produkte td:nth-of-type(5),#bestellung .produkte td:nth-of-type(6) { margin-left:35% } #bestellung .produkte td.price { padding-right:10px;} #bestellung .produkte td.price::after {content:" €"} #bestellung .produkte td.massen { margin-bottom: 10px; } #bestellung .produkte td.massen table {float: right; margin-right: 5px;} #bestellung .produkte td.massen span { display: inline; } #bestellung .produkte td.massen td {display:table; text-align:right} #bestellung .produkte td.zw-ueberschrift {display: table; width:100%;} #bestellung .produkte .zw-ueberschrift > div {margin-top:5px; } #bestellung .produkte h2 {margin-top: 35px;} } @media all and (max-width:590px){ #kopf { height: auto} #logo {padding-top:50px; } .jahre { height: 73px; display: block; position: fixed; top: 0px; left: 40%; margin: 0; } .logoSchrift {margin-top:20px;} } @media all and (max-width:500px){ #bestellung-uebersicht .zusammenfassung th, #letzte-bestellungen th {display:none;} #bestellung-uebersicht .zusammenfassung td, #letzte-bestellungen td {display:block;padding:0 5px;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(1), #letzte-bestellungen td:nth-of-type(1){ display:block; font-weight:bold;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(2)::before, #letzte-bestellungen td:nth-of-type(2)::before { content:"Lieferrhythmus: "; width:80px; white-space: no-wrap;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(3)::before, #letzte-bestellungen td:nth-of-type(3)::before { content:"Einzelpreis: ";width:80px;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(4)::before, #letzte-bestellungen td:nth-of-type(4)::before { content:"Anzahl: "; width:80px;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(5)::before, #letzte-bestellungen td:nth-of-type(5)::before { content:"Zw.-summe: "; width:80px;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(4), #letzte-bestellungen td:nth-of-type(4),#letzte-bestellungen td:nth-of-type(2){ text-align:right !important;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(2), #bestellung .zusammenfassung td:nth-of-type(3), #bestellung .zusammenfassung td:nth-of-type(4), #bestellung .zusammenfassung td:nth-of-type(5) { white-space: no-wrap;} #bestellung-uebersicht .zusammenfassung td:nth-of-type(5) { font-weight:bold; } .rg-betrag {border-top: 1px solid black; } #bestellung-uebersicht .adresse, #letzte-bestellungen .adresse {float:left; width:100%;} #letzte-bestellungen .tab-best {border:none; } } @media all and (max-width:450px){ #kontakt .label {margin-top: 25px;} #kontakt .wert {margin-left:0px; width:auto } #konto .einstellungen {width:100%;} }