/** Seite gesamt (Abmessungen, Aussenabstände etc.) */ body { padding: 0; } #page { overflow: hidden; } .nomenu #page { padding: 0; } /** Seitenaufteilung mit/ohne Menü für Tablets optimieren */ .menu .content { padding: 0; } .nomenu .content { padding: 0 0 5em 0; @media (max-width: (@maxsmalltablet)) { padding-bottom: 4em; } @media (max-width: (@maxsmallertablet)) { padding-bottom: 3.25em; } } .content.cf:before, .content.cf:after { clear: none; content: none; display: inline; } .menu .content > .main, .nomenu .content > .main, .onecolumn .content > .main { float: none; width: auto; padding: 0 3em 0 5em; @media (max-width: (@maxsmalltablet)) { padding: 0 2em 0 3em; } @media (max-width: (@maxsmallertablet)) { padding: 0 1em 0 2.5em; } /** Die 1px-Rahmen triggern, dass das erste Margin den Footer aufschiebt. Bei einem Wert von 0 ragt dieses Margin dann einfach aus dem Footer heraus... */ border-top: 1px solid @hintergrund; border-bottom: 1px solid @hintergrund; } .menu .content > .marginal, .nomenu .content > .marginal, .onecolumn .content > .marginal { position: static; width: 100%; } .menu .content > .marginal { margin: 3em 0 -994em -15em; padding: 2em 0 999em 0; } .nomenu .content > .marginal { margin: 3em 0 -994em 0; padding: 0 0 999em 0; background-color: transparent; } .onecolumn .content > .marginal { margin: 6.5em 0 -1001.175em 0; padding: 0 0 999em 0; background-color: transparent; } /** Seitenkopf positionieren */ #header { padding: 1em 3em 2em 5em; @media (max-width: (@maxsmalltablet)) { margin-left: -1.5em; padding: .5em 2em 2em 3em; } @media (max-width: (@maxsmallertablet)) { margin-left: -1.2em; padding: 1em 1em 2em 2.5em; } } /** Bereichsauswahl positionieren */ .menu #nav { position: static; border-right: .125em solid @hintergrund; margin-left: 20em; @media (max-width: (@maxsmalltablet)) { margin-left: 18.5em; } @media (max-width: (@maxsmallertablet)) { margin-left: 17.5em; #menu > li.about { display: inline-block; } } width: auto; } .nomenu #nav { position: absolute; top: 0; right: 0; /** Hier eigentlich nicht nötig, aber für Tablet-Style erforderrlich! */ width: 100%; } .menu #menu, .nomenu #menu, .onecolumn #menu { position: absolute; width: auto; top: -9em; right: 3em; @media (max-width: (@maxsmalltablet)) { top: -7.7em; right: 2em; } @media (max-width: (@maxsmallertablet)) { top: -6.5em; right: 1em; } } #menu > li.about { display: none; } #menu > li.m { @media (max-width: (@maxsmalltablet)) { padding: 0 0 0 3em; } @media (max-width: (@maxsmallertablet)) { padding: 0 0 0 2em; } } #menu > li.m > .m { @media (max-width: (@maxsmalltablet)) { font-size: 200%; /* 32px */ } @media (max-width: (@maxsmallertablet)) { font-size: 150%; /* 24px */ } } #menu > li.m > a.m:hover:before, #menu > li.m > a.m.selected:before, #menu > li.m > strong.m:before { @media (max-width: (@maxsmalltablet)) { content: '> '; margin-left: -.95em; } @media (max-width: (@maxsmallertablet)) { } } /** Footer positionieren */ .menu #footer { position: static; float: right; margin: 3em 0 -999em -15em; padding: 0 0 999em 0; width: 15em; background-color: @heller; } .nomenu #footer, .onecolumn #footer { padding: 0 3em 1.5em 5em; @media (max-width: (@maxsmalltablet)) { padding: 0 2em 1em 3em; } @media (max-width: (@maxsmallertablet)) { padding: 0 1em .75em 2.5em; } background-color: @heller; border-style: none; } /** Breadcrump positionieren */ .menu #breadcrumb, .nomenu #breadcrumb, .onecolumn #breadcrumb { left: 11.9em; right: 3em; @media (max-width: (@maxsmalltablet)) { font-size: 87.5%; /* 14px */ top: 7.2em; left: 9.8em; } @media (max-width: (@maxsmallertablet)) { top: 5.8em; left: 7em; } } /** Faux-Column-Hack für Marginalinhalte */ .nomenu .content > .marginal aside.m, .onecolumn .content > .marginal aside.m { margin: 3.5em 0 -999em 0; padding: 2em 3em 995em 5em; background-color: @heller; position: relative; top: -4.5em; @media (max-width: (@maxsmalltablet)) { padding-left: 3em; padding-right: 2em; } @media (max-width: (@maxsmallertablet)) { padding-left: 2.5em; padding-right: 1em; } } .menu .content > .marginal > aside.m { margin: 0 -12em 1em 20em; @media (max-width: (@maxsmalltablet)) { margin-left: 18.5em; margin-right: -13em; } @media (max-width: (@maxsmallertablet)) { margin-left: 17.5em; margin-right: -14em; } }