/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on March 21, 2024 */ @font-face { font-family: 'hk_grotesklight'; src: url('font/hk/hkgrotesk-light-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-light-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_grotesklight_italic'; src: url('font/hk/hkgrotesk-lightitalic-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-lightitalic-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskregular'; src: url('font/hk/hkgrotesk-regular-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskitalic'; src: url('font/hk/hkgrotesk-italic-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-italic-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskmedium'; src: url('font/hk/hkgrotesk-medium-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-medium-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskmedium_italic'; src: url('font/hk/hkgrotesk-mediumitalic-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-mediumitalic-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_grotesksemibold'; src: url('font/hk/hkgrotesk-semibold-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-semibold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_grotesksemibold_italic'; src: url('font/hk/hkgrotesk-semibolditalic-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-semibolditalic-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskbold'; src: url('font/hk/hkgrotesk-bold-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-bold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskbold_italic'; src: url('font/hk/hkgrotesk-bolditalic-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-bolditalic-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskextrabold'; src: url('font/hk/hkgrotesk-extrabold-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-extrabold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hk_groteskblack'; src: url('font/hk/hkgrotesk-black-webfont.woff2') format('woff2'), url('font/hk/hkgrotesk-black-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @charset 'UTF-8'; /* CSS Document */ @-ms-viewport{ width: extend-to-zoom; zoom: 1.0;} * { box-sizing: border-box; } /***************** Farbdefinitionen **************/ :root { --FarbeSchwarzeWand: #464646; --FarbeNix: #777; --FarbeNix_HG: #eee; --FarbeVK: #AC8200; --FarbeVK_HG: #F4EEDA; --FarbeOW: #82AB0f; --FarbeOW_HG: #EBEFE5; --FarbeKB: #4A6DD3; --FarbeKB_HG: #E3E7F4; --FarbeJahrWahlHG: #bbb; --FarbeWoWann: #8C2E00; } html, body { margin:0px; padding:0px; color: #000; height:100%; width:100%; font-family: 'hk_groteskregular', sans-serif; font-size: 1rem; line-height: 1.5rem; -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: grayscale; } body { background-image:url(pic/Mauer.webp); background-repeat:repeat; background-color: var(--FarbeSchwarzeWand); } table { border-collapse:collapse; } td, td.rsTD { text-align:left; vertical-align:top; padding:0px; margin:0px; } td.rsTD { padding-right:0.75rem; } h1 { font-family: 'hk_groteskmedium', sans-serif; font-weight: normal; font-style: normal; font-size: 1.4rem; line-height: 1.8rem; margin: 20px 0px; } h2 { font-weight: normal; font-style: normal; font-size: 1.2rem; line-height: 1.5rem; margin: 10px 0px; } h3 { font-family: 'hk_grotesksemibold', sans-serif; font-weight: normal; font-style: normal; font-size: 1rem; line-height: 1.5rem; margin: 10px 0px 0px 0px; } b { font-family: 'hk_grotesksemibold', sans-serif; font-weight: normal; font-style: normal; } hr { height:0px; border:0px; border-top:1px solid black; margin: 20px 15px 20px 0px; clear: both; } i { font-family: Times, serif; } .klein { font-size: 0.75rem; } ul, ol { padding: 0; margin: 0; } li { padding: 0; margin: 0px 0px 0px 20px; } a:link, a:visited, a:hover, a:active, a:focus { color: #000; border:0px; border-bottom: 1px solid black; text-decoration: none; margin: 0px -0.25rem; padding: 0px 0.25rem; } a:hover, a:active, a:focus { background-color: #ddd; border-bottom: 1px solid transparent; } a.rsBildlink, a.rsBildlink:link, a.rsBildlink:active, a.rsBildlink:visited, a.rsBildlink:hover { text-decoration: none; border: none; background-color: transparent; } /********* Titel **********/ #HG_oben { z-index: 1; position: absolute; background-image: url('pic/Himmel.webp'); background-repeat: repeat-x; height:100%; width: 100%; } #seitentitel { text-transform: uppercase; font-family: 'hk_groteskmedium', sans-serif; font-size: 1.75rem; line-height: 2.5rem; width: 100%; height: 7.25rem; text-align: center; letter-spacing: calc((100vw - 1.125rem * 47) / 46); padding: 1rem 0px 0px 1vw; hyphens: none; } #seitentitel a:link, #seitentitel a:visited, #seitentitel a:hover, #seitentitel a:active, #seitentitel a:focus { color: white; border:0px; text-decoration: none; } #seitentitel a:hover, #seitentitel a:active, #seitentitel a:focus { color: #7D4226; background-color: transparent; } /* ------------- Hintergrund -------------- */ #content_absolute { z-index: 2; position: absolute; top: 5.25rem; min-height:calc(100vh - 5.25rem); } #content_verschieber { clear: both; float:left; height: 60vh; width: calc(15vw - 25px); max-width: 475px; } #content { z-index: 2; float:left; width: 70vw; max-width: 60rem; min-width: 50rem; background-color: var(--FarbeSchwarzeWand); min-height:calc(100vh - 5.25rem); } #menue { float: left; width: calc(10rem + 3vw); max-width: 13rem; padding-top: 4.5rem; } #inhalt { float: left; background-color: white; width: calc(100% - (11rem + 3vw)); margin: 1rem 0rem 3rem 0rem; padding: 0rem 1rem 2rem 1rem; } #linke_Mauer { z-index: 4; position: absolute; top: 15rem; left: 0px; background-image: url(pic/linke_Mauer.webp); background-repeat: repeat-y; background-position: right -1px top; min-height:calc(100% - 15rem); width: 15vw; max-width: 500px; } #zinne { z-index: 5; position: absolute; top: 3rem; left: 0px; background-image: url(pic/zinne.webp); background-repeat: no-repeat; background-position: right top; height: 20rem; width: 15vw; max-width: 500px; } /******************** Inhalt ******************/ .Bild60, .Bild40, .Bild20 { display: inline-block; width: calc(60% - 2rem); height: auto; margin: 1rem 0px 1rem 1rem; padding: 0px; border: 0px; border: none; text-decoration: none; vertical-align:top; } .Bild40 { width: calc(40% - 2rem); } .Bild20 { width: calc(20% - 2rem); } .Bild100 { width: 100%; margin: 1rem 0px 1rem 0px; } .Bild100_oben { width: 100%; margin: 1rem 0px 1rem 0px; padding: 0px 1vw; } .Text_100, .Text_80, .Text_60, .Text_40 { width: 100%; display: inline-block; margin: 0rem 0px 0rem 0rem; padding: 0px 1vw; vertical-align:top; } .Text_80 { width: 80%; width: calc(80% + 1rem); } .Text_60 { width: 60%; width: calc(60% + 1rem); } .Text_40 { width: calc(40% + 1rem); } /**************** Sponsoren *****************/ .Sponsor { float:left; width: 7.5rem; margin: 1.5rem; } .Balken { float:left; width: calc(100% + 2rem); margin: 2rem -2rem 0rem -1rem; height: 2rem; background-color: var(--FarbeSchwarzeWand); } /******************** Fuss ******************/ #Fuss { z-index: 1; position: absolute; right: 0px; bottom: 0.5rem; font-size: 0.75rem; line-height: 1rem; letter-spacing: 0.01rem; } .linkcontainer { display: inline-block; position: relative; right: 1rem; bottom: 0px; margin-left: 1rem; } .linkcontainer a:link, .linkcontainer a:visited, .linkcontainer a:active, .linkcontainer a:hover { color: white; } .linkcontainer a:hover { color: black; } /************** Bildergalerie **************/ .Galeriebereich { position:relative; display: inline-block; vertical-align:top; overflow: hidden; width: 100%; padding: 0px; margin: 0px; } #inhalt .Galerievorschau { width: calc(3vw + 2rem); } #inhalt a.Galerievorschau:link, #inhalt a.Galerievorschau:visited, #inhalt a.Galerievorschau:active, #inhalt a.Galerievorschau:hover { display: inline-block; margin: 0.75rem 0.75rem 0px 0px; text-decoration: none; background-color: #fff; border: none; } #inhalt a.Galerievorschau:hover { filter: brightness(1.1); } .bildzurueck, .bildweiter { position: absolute; top: 0; width: 50%; height: calc(100% - 0.5rem); padding:0px; margin: 0px; border: none; background-size: 4rem; background-repeat: no-repeat; background-position: left; cursor: pointer; } .bildzurueck { left: 0; background-image: url('pic/Pfeil_Links.png'); } .bildweiter { right: 0; background-image: url('pic/Pfeil_Rechts.png'); background-position: right; } .bildzurueck:hover { background-image: url('pic/Pfeil_Links_H.png'); } .bildweiter:hover { background-image: url('pic/Pfeil_Rechts_H.png'); } /************ Kontaktformular **************/ #Formular { margin: 1rem 0px; width: 100%; } #Formular div { width: 100%; } .input { width: 100%; height:20px; margin: 0px 0px 0.25rem 0px; } #Input1, #Input2, #Input3, #Input4, #Input5, #Input6, #Input7, #Input8 { display: block; } #Input7 { visibility: hidden; } .Mitteilungsarea { width:520px; width: 100%; height:100px; margin: 5px 0px 10px 0px; } #Absendebutton { margin: 1rem 0px 1rem 0px; } #Meldung { margin: 2rem 0px 1rem 0px; } #MeldungRot { color: red; } #MeldungGruen { color: green; } /******************** Suche ********************/ a.suchergebniss { display:block; width: 100%; border: 0px; } /***************** Veranstaltungen **************/ #VK_Kopf { border-bottom: 2px dashed var(--FarbeSchwarzeWand); margin: 1rem 0px 0px 0px; height: 10rem; } #VK_ScrollDiv { height:calc(100vh - 22rem); overflow-y: auto; margin: 0px -1rem -2rem 0px; padding-bottom: 5rem; background-color: white; } #VKTitel { text-align:right; text-transform: uppercase; font-family: 'hk_groteskmedium', sans-serif; letter-spacing: 0.15rem; font-size: 2.1rem; line-height: 2.25rem; margin: 2rem 0px 0.25rem 0px; color: var(--FarbeWoWann); color: var(--FarbeSchwarzeWand); } #VLegendenTab { display: flex; } .VLegende_VK, .VLegende_KB, .VLegende_OW { display: flex-box; width: 33.3333333%; min-height: 2.5rem; text-align: left; padding: 0.25rem 0.5rem; text-transform: uppercase; font-family: 'hk_grotesksemibold', sans-serif; letter-spacing: 0px; color: white; font-size: 0.75rem; line-height: 0.8rem; background-color: var(--FarbeVK); } .VLegende_KB{ background-color: var(--FarbeKB); } .VLegende_OW { background-color: var(--FarbeOW); } #siehe_auch { text-align: right; } .p_V_Datum_Nix, .p_V_Datum_VK, .p_V_Datum_KB, .p_V_Datum_OW { display: block; width:100%; padding: 0px 0.5rem 0px 0px; margin: 2rem 0px 0px 0px; text-align:right; text-transform: uppercase; font-family: 'hk_groteskmedium', sans-serif; letter-spacing: 0.1rem; font-size: 2rem; line-height: 2.25rem; color: var(--FarbeNix); } .p_V_Datum_VK { color: var(--FarbeVK); } .p_V_Datum_KB { color: var(--FarbeKB); } .p_V_Datum_OW { color: var(--FarbeOW); } a.V_Jahreswahl, a.V_Jahreswahl:link, a.V_Jahreswahl:visited, a.V_Jahreswahl:active, a.V_Jahreswahl:hover, a.V_Titel_Nix, a.V_Titel_Nix:link, a.V_Titel_Nix:visited, a.V_Titel_Nix:active, a.V_Titel_Nix:hover, a.V_Titel_VK, a.V_Titel_VK:link, a.V_Titel_VK:visited, a.V_Titel_VK:active, a.V_Titel_VK:hover, a.V_Titel_KB, a.V_Titel_KB:link, a.V_Titel_KB:visited, a.V_Titel_KB:active, a.V_Titel_KB:hover, a.V_Titel_OW, a.V_Titel_OW:link, a.V_Titel_OW:visited, a.V_Titel_OW:active, a.V_Titel_OW:hover, p.V_Titel_Nix, p.V_Titel_VK, p.V_Titel_KB, p.V_Titel_OW { background-color: var(--FarbeNix); display:block; width:100%; min-height: 2rem; margin: 0px 0px 0px 0px; padding: 0.25rem 0.25rem 0.2rem 2.5rem; border: none; color: white; text-transform: uppercase; font-family: 'hk_groteskmedium', sans-serif; text-decoration: none; font-size: 1rem; line-height:1.4rem; letter-spacing:0.005rem; background-image: url('pic/DreieckUnten.svg'); background-repeat: no-repeat; background-size: 1.5rem; background-position: 0.5rem 0.25rem; } a.V_Titel_VK, a.V_Titel_VK:link, a.V_Titel_VK:visited, a.V_Titel_VK:active, a.V_Titel_VK:hover, p.V_Titel_VK { background-color: var(--FarbeVK); } a.V_Titel_KB, a.V_Titel_KB:link, a.V_Titel_KB:visited, a.V_Titel_KB:active, a.V_Titel_KB:hover, p.V_Titel_KB { background-color: var(--FarbeKB); } a.V_Titel_OW, a.V_Titel_OW:link, a.V_Titel_OW:visited, a.V_Titel_OW:active, a.V_Titel_OW:hover, p.V_Titel_OW { background-color: var(--FarbeOW); } p.V_Titel_VK, p.V_Titel_KB, p.V_Titel_OW { background-image: none; padding-left: calc(1rem + 1px); } .div_V_Text_Nix_HG, .div_V_Text_VK_HG, .div_V_Text_KB_HG, .div_V_Text_OW_HG { background-color: var(--FarbeNix_HG); border-color: var(--FarbeNix); border-width: 0px 1px 1px 1px; border-style: solid; clear: both; display:block; width: 100%; border-top-color: transparent; padding: 0.75rem 0.75rem 0.75rem 1rem; margin: 0px 0px 0px 0px; } .div_V_Text_VK_HG { background-color: var(--FarbeVK_HG); border-color: var(--FarbeVK); } .div_V_Text_KB_HG { background-color: var(--FarbeKB_HG); border-color: var(--FarbeKB); } .div_V_Text_OW_HG { background-color: var(--FarbeOW_HG); border-color: var(--FarbeOW); } .V_Kurztext { width: 100%; padding: 0rem 0rem 0rem 0rem; margin: 0px 0px 0px 0px; } .V_Kurztext::after { content: ""; display: table; clear: both; } img.Bildchen { max-width: 40%; float: right; padding: 0px; margin: 0px 0px 0.75rem 0.75rem; } .V_text_auf_weiss { padding: 1.25rem 0px 1.25rem 0px; background-color: white; } .WoundWannDiv { font-family: 'hk_groteskbold', sans-serif; margin: 0.75rem 0rem; line-height:1.25rem; color: var(--FarbeWoWann); } a.V_Jahreswahl, a.V_Jahreswahl:link, a.V_Jahreswahl:visited, a.V_Jahreswahl:active, a.V_Jahreswahl:hover { display:inline-block; width: auto; min-height: auto; font-family: 'hk_groteskbold', sans-serif; margin: 0.5rem 0rem; padding: 0rem 0.5rem 0.2rem 2.5rem; line-height:1.25rem; color: white; background-color: var(--FarbeJahrWahlHG); background-position: 0.5rem 0rem; } a.V_Titel_Nix:hover, a.V_Titel_VK:hover, a.V_Titel_KB:hover, a.V_Titel_OW:hover, a.V_Jahreswahl:hover { background-color: var(--FarbeSchwarzeWand); background-image: url('pic/DreieckUntenHover.svg'); } /****************** Hinweise ********************/ #hinweis_auf_startseite_scroll { display: block; position: fixed; z-index: 3; left: 1rem; bottom: 5vh; width: 25rem; max-height: 40vh; min-width: 15rem; max-width: 80vw; padding: 0rem; overflow-y: auto; box-shadow: -1px 3px 4px 5px rgba(70, 70, 70, 0.75); } #hinweis_auf_startseite { background-image: url(pic/holz.webp); background-size: cover; border: 0.75rem solid rgba(100,0,0,0.15); border-bottom: none; } #hinweiskreuzcontainer { position: relative; } a#hinweiskreuz, a#hinweiskreuz:link, a#hinweiskreuz:visited, a#hinweiskreuz:active, a#hinweiskreuz:hover { float: right; background-image: url(pic/kreuz.svg); background-size: cover; height: 1.5rem; width: 1.5rem; padding: 0.5rem; margin: 0.5rem; text-decoration: none; border: none; } a#hinweiskreuz:hover { background-image: url(pic/kreuz_hover.svg); background-color: transparent; } .Hinweis { padding: 0.25rem 0.25rem 0.75rem 0.5rem; margin: 0px; border-bottom: 0.75rem solid rgba(100,0,0,0.15); font-family: 'hk_groteskmedium', sans-serif; line-height: 1.25rem; letter-spacing:0.005rem; } .Hinweis b { font-family: 'hk_groteskbold', sans-serif; } .Hinweis, .Hinweis a:link, .Hinweis a:visited, .Hinweis a:hover, .Hinweis a:active, .Hinweis a:focus { color: #2A1A10; } a.mehr, .Hinweis a.mehr:link, .Hinweis a.mehr:visited, .Hinweis a.mehr:hover, .Hinweis a.mehr:active, .Hinweis a.mehr:focus { display: block; padding: 0px 0rem 0px 0.25rem; width: 100%; white-space: nowrap; font-family: 'hk_groteskbold', sans-serif; color: var(--FarbeWoWann); border:none; } .Hinweis a.mehr:hover { color:white; background-color: transparent; } /************** Hamburger **************/ #a, a#hamburger, a#hamburger:link, a#hamburger:visited, a#hamburger:active, a#hamburger:hover, a#hamburgerU, a#hamburgerU:link, a#hamburgerU:visited, a#hamburgerU:active, a#hamburgerU:hover, a#ToTop, a#ToTop:link, a#ToTop:visited, a#ToTop:active, a#ToTop:hover { display: none; position: absolute; right: 0px; top: 4.75rem; margin: 0px; padding: 2rem 1rem 2rem 4rem; text-decoration: none; outline: none; border: 0px; background-color:red; background-color: transparent; } a#hamburger img, a#hamburgerU img, a#ToTop img { height: 20px; width: 24px; margin: 0px; padding: 0px; background-color:green; background-color: transparent; } a#hamburgerU, a#hamburgerU:link, a#hamburgerU:visited, a#hamburgerU:active, a#hamburgerU:hover { position: relative; float:right; top: 3rem; right: -1rem; padding: 2rem 1rem 2rem 2rem; } a#ToTop, a#ToTop:link, a#ToTop:visited, a#ToTop:active, a#ToTop:hover { position: relative; float:right; top: calc(3rem - 2px); right: -1rem; padding: 2rem 1rem 2rem 2rem; } a#ToTop img { height: 22px; } /******************** Menü ******************/ .menuezeile { height: auto; font-family: 'hk_groteskmedium', sans-serif; font-weight: normal; font-style:normal; font-size: 0.85rem; line-height: 1.05rem; letter-spacing: 0px; } a.nav, a.nav:link, a.nav:visited, a.nav:active, a.nav:hover, a.navX, a.navX:link, a.navX:visited, a.navX:active, a.navX:hover, a.navA, a.navA:link, a.navA:visited, a.navA:active, a.navA:hover, a.nav_U, a.nav_U:link, a.nav_U:visited, a.nav_U:active, a.nav_U:hover, a.nav_UX, a.nav_UX:link, a.nav_UX:visited, a.nav_UX:active, a.nav_UX:hover, a.nav_UA, a.nav_UA:link, a.nav_UA:visited, a.nav_UA:active, a.nav_UA:hover { display:block; text-decoration: none; border: none; color: black; padding: 0.3rem 0.4rem 0.2rem 0rem; color: #ccc; } a.nav_U, a.nav_U:link, a.nav_U:visited, a.nav_U:active, a.nav_U:hover, a.nav_UX, a.nav_UX:link, a.nav_UX:visited, a.nav_UX:active, a.nav_UX:hover, a.nav_UA, a.nav_UA:link, a.nav_UA:visited, a.nav_UA:active, a.nav_UA:hover { color: white; font-family: 'hk_groteskbold', sans-serif; } a.navX, a.navX:link, a.navX:visited, a.navX:active, a.nav_UX, a.nav_UX:link, a.nav_UX:visited, a.nav_UX:active { color: black; background-color: white; } a.nav:hover, a.nav:hover, a.navX:hover, a.nav_U:hover, a.nav_UX:hover, a.nav_UA:hover { color: white; background-color: gray; } @charset "UTF-8"; /* CSS Document */ @media screen and (max-width: 980px) { /********* Titel **********/ #seitentitel { padding-left: 2rem; text-align: left; letter-spacing: calc((150vw - 1.125rem * 47) / 46); } /********* Hintergrund **********/ #content_absolute { top: 7.25rem; min-height:calc(100vh - 7.25rem); } #content_verschieber { width: calc(10vw - 25px); } #content { width: calc(80vw + 3rem); min-width: 30rem; min-height:calc(100vh - 7.25rem); } #linke_Mauer { width: 10vw; } #zinne { width: 10vw; } /***************** Veranstaltungen **************/ #VK_ScrollDiv { height:calc(100vh - 23rem); } /***** Ende media screen 980 ******/ } @charset "UTF-8"; /* CSS Document */ @media screen and (max-width: 750px) { /******************** Inhalt ******************/ .Text_100, .Text_80, .Text_60, .Text_40, .Bild100, .Bild100_oben, .Bild60, .Bild40, .Bild20 { width: 100%; padding: 0px; margin: 1rem 0px 1rem 0rem; } .Bild40 { width: calc(40% + 5rem); } .Bild20 { width: calc(20% + 5rem); } /***************** Veranstaltungen **************/ .V_text_auf_weiss { padding: 0px 0.25rem 0px 0.5rem; } /***** Ende media screen 750 ******/ } @charset "UTF-8"; /* CSS Document */ @media screen and (max-width: 600px) { body { background-image: url('pic/Himmelphone.webp'); background-color: white; } #HG_oben { background-image: url('pic/PixNix.gif'); } /********* Titel **********/ #seitentitel { padding-left: 2rem; text-align: left; letter-spacing: calc((200vw - 1.05rem * 47) / 46); } /********* Hintergrund **********/ #content_absolute { top: 10rem; min-height:calc(100vh - 10rem); width: 100%; } #content_verschieber { width: 2rem; } #content { width: calc(100% - 2rem); min-height:calc(100vh - 10rem); min-width: auto; } #linke_Mauer, #zinne { width: 3.5rem; } #menue { max-width: 100%; width: 100%; display: none; } #inhalt { width: calc(100% - 3rem); margin: 2rem 0rem 3rem 2rem; padding: 0rem 1rem 2rem 1rem; } /***************** Veranstaltungen **************/ #VK_ScrollDiv { height: calc(100vh - 10rem); margin: 0px 0rem -2rem 0px; } /************** Hamburger **************/ #a, a#hamburger, a#hamburger:link, a#hamburger:visited, a#hamburger:active, a#hamburger:hover { display: block; } /******************** Menü ******************/ .menuezeile { font-family: 'hk_groteskmedium', sans-serif; font-size: 1.1rem; line-height: 1.3rem; letter-spacing: 0.05rem; border-bottom: 1px solid #aaa; padding: 0px; margin: 0px; width: calc(100% - 1rem); } a.nav, a.nav:link, a.nav:visited, a.nav:active, a.nav:hover, a.navX, a.navX:link, a.navX:visited, a.navX:active, a.navX:hover, a.navA, a.navA:link, a.navA:visited, a.navA:active, a.navA:hover, a.nav_U, a.nav_U:link, a.nav_U:visited, a.nav_U:active, a.nav_U:hover, a.nav_UX, a.nav_UX:link, a.nav_UX:visited, a.nav_UX:active, a.nav_UX:hover, a.nav_UA, a.nav_UA:link, a.nav_UA:visited, a.nav_UA:active, a.nav_UA:hover { margin-right: 0px; } /***** Ende media screen 600 ******/ } @charset "UTF-8"; /* CSS Document */ @media screen and (max-width: 450px) { /***************** Veranstaltungen **************/ #VKTitel { letter-spacing: 0.1vw; font-size: calc(8vw - 0.4rem); line-height: 2rem; } /***** Ende media screen 600 ******/ }