/* CSS Dokument */ @import url('/assets/css/nav.css'); @import url('/assets/css/justified.css'); @import url('/assets/css/lightcase.css'); @import url('/assets/css/form.css'); /* @import url('/assets/css/slick.css'); @import url('/assets/css/slick-theme.css'); @import url('/assets/css/lightcase.css'); @import url('/assets/css/form.css'); */ @font-face { font-family: 'Mukta'; font-style: normal; font-weight: 300; font-display: swap; src: url(/assets/fonts/Mukta-300.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Mukta'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/Mukta-600.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Trirong'; font-style: normal; font-weight: 300; font-display: swap; src: url(/assets/fonts/Trirong-300.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Trirong'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/Trirong-600.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } * { margin: 0; padding: 0; box-sizing: border-box!important; outline: none; } html { color: #333333; font-family: 'Mukta', sans-serif; font-size: 16px; font-weight: 300; } h1 { color: #dbb771; font-family: 'Trirong', serif; font-size: 2.125rem; font-weight: 300; text-transform: uppercase; } h2 { font-size: 1.375rem; margin: 0 0 1.5rem; font-weight: 600; text-transform: uppercase; } h2:after { } h3 { font-family: 'Trirong', serif; font-size: 1.5rem; font-weight: 600; margin: 0 0 2rem; } h4 { font-size: 1.25rem; font-weight: 600; margin: 0 0 1rem; } a { color: #780d0d; font-size: 1.25rem; text-decoration: none; } img { display: block; max-width: 100%; } p { font-size: 1.25rem; margin: 0 0 1rem; } strong, b { font-weight: 600; } ul { font-size: 1.25rem; list-style: none; margin: 0 0 1rem; } video { background: #000000; display: block; max-width: 100%; } /* GRUNDAUFBAU */ .content { margin: 0 auto; max-width: 1280px; width: 96%; } .flex { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: start; width: 100%; } .flx-start { align-items: flex-start; } .flx-end { justify-content: end; } .flx-strech { align-items: stretch; } .flx-center { justify-content: center; align-items: center; } .flx-between { justify-content: space-between; } .flx-a-between { align-content: space-between; } .flx-evenly { justify-content: space-evenly; } .flx-reverse { flex-direction: row-reverse; } .full { width: 100%; } .half { width: 50%; } .threequarter { width: 75%; } .twothird { width: 66.666%; } .third { width: 33.333%; } .quarter { width: 25%; } .fifth { width: 20%; } .tenth { width: 10%; } .space { padding: 1.5rem; } .halfspace { padding: 0.75rem; } .center { text-align: center; } .small { font-size: 0.875rem; } header { background: url('/data/site/bg-gray.jpg'); } header .logo { margin: 0 auto; height: 8rem; } nav { background: url('/data/site/bg-red.jpg'); } main img { border: 5px solid rgba(219,183,113,0.5)!important; } section { padding: 2rem 0; } #info, #intro, #news, #team, #member, #block { background: #fffaf2; } #teaser, #contact, #outro { background: #dbb771; } #intro ul, #news ul, #equipment ul { list-style: none; margin: 0 0 1.5rem; } #outro ul { list-style: none; margin: 0 0 1.5rem; column-count: 3; } #intro ul li, #outro ul li, #equipment ul li, #news ul li { margin: 0 0 0 1.5rem; } #intro ul li:before, #outro ul li:before, #news ul li:before, #equipment ul li:before { content: '▪'; color: #780d0d; display: inline-block; font-size: 1rem; margin: 0 0.5rem 0 -0.875rem; } #team img { border: 5px solid rgba(219,183,113,0.5); } footer { background: url('/data/site/bg-red.jpg'); padding: 2rem 0 1rem; } footer h5 { color: #f7f7f7; font-size: 1rem; margin: 0 0 1rem; text-transform: uppercase; } footer p, footer a { color: #f7f7f7; font-size: 1rem; } footer a:hover { color: #dbb771; } footer img { filter: invert(100%) sepia(0%) saturate(1%) hue-rotate(137deg) brightness(107%) contrast(94%); width: 2rem; } footer img:hover { filter: invert(76%) sepia(7%) saturate(2134%) hue-rotate(1deg) brightness(100%) contrast(84%); } .latest > div, .news > div > div { height: 100%; } .latest .entry { height: 100%; } .latest .entry img { border: 5px solid rgba(255,255,255,0.5)!important; margin: 0 auto 1rem; width: 100%; } .latest .entry h3 { text-align: center; } .news .entry { background: #dbb771; margin: 0 0 2rem; } .news .entry a { font-weight: 600; } .news .entry img { border: 5px solid rgba(255,255,255,0.5)!important; width: 100%; } .studio .entry { background: #dbb771; margin: 0 0 2rem; } .equipment .entry { background: #dbb771; margin: 0 0 2rem; } .equipment .entry img { border: 5px solid rgba(255,255,255,0.5)!important; width: 100%; } .team .entry img { border: 5px solid rgba(255,255,255,0.5); margin: 0 auto 1rem; width: 100%; } .gallery span { display: block; } .gallery a { } .member .entry { background: #dbb771; margin: 0 0 2rem; } .member .entry h3 { text-align: center; } .back span { margin: 0 0 0.25rem 0.5rem; padding: 0.25rem; } .back img { display: inline-block; width: 1.125rem; } @media screen and (max-width: 1366px) { } @media screen and (max-width: 1279px) { } @media screen and (max-width: 1080px) { h1 { font-size: 1.5rem; } .full .sixth { width: 33.333%; } .full .fifth { width: 25%; } .full .tenth { width: 20%; } .full .ninetenth { width: 80%; } .ninetenth .fifth { width: 33.333%; } .quarter { width: 33.333%; } .threequarter { width: 66.666%; } } @media screen and (max-width: 980px) { .half { width: 100%; } .threequarter { width: 100%; } .twothird { width: 100%; } .threequarter .third, .third { width: 100%; } .quarter { width: 100%; } .full .fifth, .fifth { width: 50%; } .gallery .half { width: 25%; } .prio1 { order: 1; } .prio2 { order: 2; } .prio3 { order: 3; } } @media screen and (max-width: 760px) { .sixth { width: 33.333%; } .full .ninetenth, .ninetenth { width: 100%; } .full .tenth, .tenth { width: 100%; } #outro ul { list-style: none; margin: 0 0 1.5rem; column-count: 1; } } @media screen and (max-width: 520px) { .fifth { width: 100%; } .full .sixth, .sixth { width: 100%; } .full .fifth, .fifth { width: 100%; } .gallery .half { width: 50%; } }