diff --git a/src/css/style.scss b/src/css/style.scss index effd9572a17d4d87fd373261226631d22a32bbc4..9a072b2075e009ffb95232a896f25ab91403f2f8 100644 --- a/src/css/style.scss +++ b/src/css/style.scss @@ -112,31 +112,6 @@ img { } -.fitko-termine { - text-align: center; - min-height: 500px; -} - -.fitko-termine-heading { - text-align: center; - height: 80px; -} - -.fitko-termine-before-button { - text-align: center; - min-height: 140px; - -} - - -.fitko-termine-after-button { - text-align: center; - min-height: 470px; - margin-top: 25px; - -} - - @media (min-width: 997px) { .navbar__items--right [class^="searchBox"] { position: right; @@ -153,16 +128,4 @@ img { margin-left: -60px; margin-right: 0px; } -} - -@media (max-width:444px) { - - .fitko-termine-after-button { - text-align: center; - display: inline-block; - height: 600px !important; - - } - -} - +} \ No newline at end of file diff --git a/src/css/termine.css b/src/css/termine.css new file mode 100644 index 0000000000000000000000000000000000000000..5875b63ad21f5635a8e121b97d1648c339c7c90e --- /dev/null +++ b/src/css/termine.css @@ -0,0 +1,54 @@ + +.fitko-termine { + text-align: center; + min-height: 500px; + } + + .fitko-termine-heading { + text-align: center; + height: 80px; + } + + .fitko-termine-before-button { + text-align: center; + min-height: 140px; + + } + + + .fitko-termine-after-button { + text-align: center; + min-height: 280px; + margin-top: 25px; + + } + + + @media screen and (max-width: 900px){ + .fitko-termine { + text-align: center; + min-height: 500px; + } + } + + @media screen and (max-width: 900px){ + + .fitko-termine-before-button { + + + height: 210px !important; + + } + + } + + @media screen and (max-width: 900px){ + + .fitko-termine-after-button { + + + height: 600px !important; + + } + + } \ No newline at end of file diff --git a/src/pages/termine.mdx b/src/pages/termine.mdx index e21739190678e9c63bb1cdfea5bda5c6712e54e1..c6c3f4267485c4dabb61a79b496d0d930ddc57c6 100644 --- a/src/pages/termine.mdx +++ b/src/pages/termine.mdx @@ -6,7 +6,7 @@ import MailToButtonTermine from '@components/MailToButtonTermine' import BannerTermine from '@components/BannerTermine' import CardTermine from '@components/CardTermine' import MailToButton from '@components/MailToButton' -import '../css/style.scss'; +import '../css/termine.css'; <header className="max-w-3xl mx-auto text-center pb-16"> <h1 className="h1 mb-4">Veranstaltungen</h1>