mirror of
https://git.bolliret.ch/pcs/pcs-website
synced 2026-01-18 17:11:37 +01:00
839 lines
No EOL
19 KiB
CSS
839 lines
No EOL
19 KiB
CSS
|
|
@font-face {
|
|
font-family: "Roboto-Black";
|
|
src: url(/static/webfonts/Roboto-Black.woff2)format("woff2"),url(/static/webfonts/Roboto-Black.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Roboto-BlackItalic";
|
|
src: url(/static/webfonts/Roboto-BlackItalic.woff2)format("woff2"),url(/static/webfonts/Roboto-BlackItalic.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Roboto-Bold";
|
|
src: url(/static/webfonts/Roboto-Bold.woff2)format("woff2"),url(/static/webfonts/Roboto-Bold.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Roboto-BoldItalic";
|
|
src: url(/static/webfonts/Roboto-BoldItalic.woff2)format("woff2"),url(/static/webfonts/Roboto-BoldItalic.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family:"Roboto-Italic";
|
|
src:url(/static/webfonts/Roboto-Italic.woff2)format("woff2"),url(/static/webfonts/Roboto-Italic.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family:"Roboto-Light";
|
|
src:url(/static/webfonts/Roboto-Light.woff2)format("woff2"),url(/static/webfonts/Roboto-Light.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family:"Roboto-LightItalic";
|
|
src:url(/static/webfonts/Roboto-LightItalic.woff2)format("woff2"),url(/static/webfonts/Roboto-LightItalic.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family:"Roboto-Medium";
|
|
src:url(/static/webfonts/Roboto-Medium.woff2)format("woff2"),url(/static/webfonts/Roboto-Medium.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family:"Roboto-MediumItalic";
|
|
src:url(/static/webfonts/Roboto-MediumItalic.woff2)format("woff2"),url(/static/webfonts/Roboto-MediumItalic.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Roboto-Regular";
|
|
src: url(/static/webfonts/Roboto-Regular.woff2)format("woff2"),url(/static/webfonts/Roboto-Regular.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family:"Roboto-Thin";
|
|
src:url(/static/webfonts/Roboto-Thin.woff2)format("woff2"),url(/static/webfonts/Roboto-Thin.woff)format("woff")
|
|
}
|
|
|
|
@font-face {
|
|
font-family:"Roboto-ThinItalic";
|
|
src:url(/static/webfonts/Roboto-ThinItalic.woff2)format("woff2"),url(/static/webfonts/Roboto-ThinItalic.woff)format("woff")
|
|
}
|
|
|
|
html{
|
|
margin: 0px;
|
|
}
|
|
|
|
body {
|
|
font-family: "Roboto-Regular","Arial",sans-serif;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
background: #f4f4f4;
|
|
}
|
|
|
|
a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
header {
|
|
width: 100%;
|
|
height: 200px;
|
|
background-image: linear-gradient(to bottom, rgba(0.13, 0.13, 0.13, 0.80), rgba(0.13, 0.13, .13, 0.00)), url(/images/header-bg.jpg);
|
|
background-blend-mode: multiply;
|
|
background-size: 100%;
|
|
background-position: 0 47%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
nav{
|
|
padding: 12px 0;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.left_header{
|
|
font-family: "Roboto-Black","Arial Bold",sans-serif;
|
|
font-size: 24px;
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 0 0 0 28px;
|
|
}
|
|
|
|
.left_header ul.nav{
|
|
padding: 0;
|
|
}
|
|
|
|
.left_header a{
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.left_header img.header-logo{
|
|
width: 43px;
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.right_header{
|
|
font-family: "Roboto-Medium","Arial",sans-serif;
|
|
font-size: 18px;
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.left_header .nav, .right_header .nav {
|
|
display: flex;
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0 20px;
|
|
align-items: center;
|
|
}
|
|
|
|
.navbar-nav{
|
|
color: #f00;
|
|
}
|
|
|
|
.right_header .nav li {
|
|
margin: 0 20px;
|
|
}
|
|
|
|
nav input[type='checkbox'], nav label {
|
|
display: none;
|
|
}
|
|
|
|
.right_header a{
|
|
color: #fff;
|
|
}
|
|
|
|
header .button a {
|
|
padding: 0.5rem 1rem;
|
|
background-color: #2563eb;
|
|
color: #fff;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
div.page{
|
|
position: relative;
|
|
top: 150px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
width: 1100px;
|
|
max-width:100%;
|
|
background: #fff;
|
|
text-align: center;
|
|
color: #2563eb;
|
|
padding: 0;
|
|
font-family: "Roboto-Thin","Arial",sans-serif;
|
|
font-size:20px;
|
|
line-height: 1em;
|
|
margin: -230px 0 0 0;
|
|
}
|
|
|
|
div.page.home{
|
|
font-size:36px;
|
|
}
|
|
|
|
div.page h1 {
|
|
font-family: "Roboto-Black","Arial Bold",sans-serif;
|
|
font-size:60px;
|
|
margin: 20px 0 0 0;
|
|
padding: 22px 0 1em 0;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
}
|
|
|
|
div.page h2 {
|
|
font-family: "Roboto-Thin","Arial",sans-serif;
|
|
font-size:60px;
|
|
margin: 0px;
|
|
padding: 0;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
|
|
}
|
|
|
|
div.page h3 {
|
|
font-family: "Roboto-Thin","Arial",sans-serif;
|
|
font-size:40px;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
}
|
|
|
|
div.page strong {
|
|
font-family: "Roboto-Regular","Arial",sans-serif;
|
|
color: #1e3a8a;
|
|
}
|
|
|
|
div.page div.threecolumn{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 80px 50px 30px 50px;
|
|
|
|
}
|
|
|
|
div.page div.threecolumn div{
|
|
display: flex;
|
|
align-items: center;
|
|
width: 300px;
|
|
line-height: 50px;
|
|
font-size:30px;
|
|
}
|
|
|
|
.page table {
|
|
border: none;
|
|
align-items: start;
|
|
padding:0 50px 50px 50px;
|
|
}
|
|
.page tbody {
|
|
text-align: left;
|
|
align-items: start;
|
|
}
|
|
.page p, .page td {
|
|
text-align: left;
|
|
}
|
|
.page p {
|
|
padding: 0 50px;
|
|
}
|
|
.page td {
|
|
padding: 10px;
|
|
}
|
|
.page td {
|
|
vertical-align: top;
|
|
align-items: start;
|
|
}
|
|
.page tr{
|
|
text-align: left;
|
|
align-items: start;
|
|
}
|
|
.page tr:nth-child(odd) td{
|
|
background: #f4f4f4;
|
|
}
|
|
.page tr:nth-child(even) td{
|
|
background: #fff;
|
|
}
|
|
|
|
div.inner_footer{
|
|
z-index: -1;
|
|
position: relative;
|
|
top: 150px;
|
|
left: 0;
|
|
height: 200px;
|
|
width: 100%;
|
|
background: #2563eb;
|
|
color: #fff;
|
|
font-family: "Roboto-Thin","Arial",sans-serif;
|
|
font-size:18px;
|
|
line-height: 27px;
|
|
margin: -50px 0 0 0;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: end;
|
|
}
|
|
|
|
div.inner_footer a{
|
|
color: #fff;
|
|
}
|
|
|
|
div.left_footer, div.middle_footer, div.right_footer {
|
|
display: flex;
|
|
align-items: end;
|
|
padding: 28px;
|
|
}
|
|
|
|
|
|
|
|
|
|
.termine *, .vorstand *{
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
|
|
.termine ul, .vorstand ul {
|
|
list-style: none;
|
|
padding: 0 0 50px 50px;
|
|
margin: 0;
|
|
text-align: left;
|
|
width: 1100px;
|
|
}
|
|
|
|
.termine li, .vorstand li {
|
|
display: flex;
|
|
}
|
|
|
|
|
|
.termine ul > li, .vorstand ul > li {
|
|
font-family: "Roboto-Light","Arial",sans-serif;
|
|
width: 1000px;
|
|
max-width: 1140px;
|
|
}
|
|
|
|
.termine .inner_page > ul > li, .vorstand .inner_page > ul > li {
|
|
padding: 10px;
|
|
}
|
|
|
|
.termine ul > li > div, .vorstand ul > li > div {
|
|
font-size: 20px;
|
|
}
|
|
|
|
.termine ul > li > div {
|
|
width: 470px;
|
|
|
|
}
|
|
.vorstand ul > li > div {
|
|
width: 200px;
|
|
}
|
|
|
|
|
|
.termine .inner_page > ul > li:nth-child(odd), .vorstand .inner_page > ul > li:nth-child(odd) {
|
|
background: #f4f4f4;
|
|
}
|
|
|
|
.termine .inner_page > ul > li:nth-child(even), .vorstand .inner_page > ul > li:nth-child(even) {
|
|
background: #fff;
|
|
}
|
|
|
|
.termine ul > li > ul, .vorstand ul > li > ul {
|
|
display: flex;
|
|
padding: 0;
|
|
margin: 0;
|
|
width: auto;
|
|
}
|
|
|
|
|
|
.termine ul > li > ul > li, .vorstand ul > li > ul > li {
|
|
margin-right: 0;
|
|
}
|
|
|
|
.termine ul > li > ul > li {
|
|
width: 155px;
|
|
}
|
|
.vorstand ul > li > ul > li {
|
|
width: 400px;
|
|
}
|
|
|
|
.termine ul > li > ul > li:nth-child(1) {
|
|
width: 240px;
|
|
}
|
|
.vorstand ul > li > ul > li:nth-child(1) {
|
|
width: 400px;
|
|
}
|
|
|
|
.termine ul > li > ul > li:nth-child(2) {
|
|
width: 55px;
|
|
}
|
|
.termine ul > li > ul > li:nth-child(2) > div{
|
|
margin-left: auto;
|
|
margin-right: 0;
|
|
text-align: right;
|
|
}
|
|
.vorstand ul > li > ul > li:nth-child(2) {
|
|
width: 400px;
|
|
}
|
|
|
|
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div {
|
|
font-size: 20px;
|
|
font-weight: normal;
|
|
width: auto;
|
|
}
|
|
|
|
|
|
.stamp{
|
|
position:relative;
|
|
-webkit-animation-name: pulse;
|
|
animation-name: pulse;
|
|
animation-delay:0.5s;
|
|
-webkit-animation-delay:0.5s;
|
|
-webkit-animation-duration: 0.5s;
|
|
animation-duration: 0.5s;
|
|
opacity: 0;
|
|
-webkit-animation-fill-mode:forwards;
|
|
animation-fill-mode:forwards;
|
|
}
|
|
|
|
@-webkit-keyframes pulse{
|
|
0%{
|
|
opacity: 0;
|
|
}
|
|
10%{
|
|
opacity:.50;
|
|
transform-origin: 50% 50%;
|
|
transform: rotate(14deg) scale(5);
|
|
transition: all .3s cubic-bezier(0.6, 0.04, 0.98, 0.335);
|
|
}
|
|
100%{
|
|
opacity:1;
|
|
transform: rotate(0deg) scale(1);
|
|
}
|
|
}
|
|
|
|
|
|
@media (min-width: 1025px) and (max-width: 1100px) {
|
|
|
|
.termine ul, .vorstand ul {
|
|
padding: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
|
|
width: calc(1100vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li, .vorstand ul > li {
|
|
width: calc(1000vw * 0.091);
|
|
max-width: calc(1140vw * 0.091);
|
|
}
|
|
|
|
.termine .inner_page > ul > li, .vorstand .inner_page > ul > li {
|
|
padding: calc(10vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li > div, .vorstand ul > li > div{
|
|
font-size: calc(20vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li > div {
|
|
width: calc(470vw * 0.091);
|
|
}
|
|
|
|
.vorstand ul > li > div {
|
|
width: calc(200vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li > ul > li {
|
|
width: calc(155vw * 0.091);
|
|
}
|
|
|
|
.vorstand ul > li > ul > li {
|
|
width: calc(400vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li > ul > li:nth-child(1){
|
|
width: calc(240vw * 0.091);
|
|
}
|
|
|
|
.vorstand ul > li > ul > li:nth-child(1){
|
|
width: calc(400vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li > ul > li:nth-child(2){
|
|
width: calc(55vw * 0.091);
|
|
}
|
|
|
|
.vorstand ul > li > ul > li:nth-child(2){
|
|
width: calc(400vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div{
|
|
font-size: calc(20vw * 0.091);
|
|
}
|
|
|
|
}
|
|
|
|
|
|
@media (min-width:769px) and (max-width:1024px) {
|
|
|
|
.termine ul, .vorstand ul {
|
|
display: table;
|
|
border-collapse: collapse;
|
|
padding: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
|
|
margin: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
|
|
width: calc(1000vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li, .vorstand ul > li{
|
|
display: table-row;
|
|
margin: 0;
|
|
}
|
|
|
|
|
|
.termine ul > li > div, .vorstand ul > li > div{
|
|
width: calc(900vw * 0.091);
|
|
max-width: calc(900vw * 0.091);
|
|
text-align: left;
|
|
padding: calc(15vw * 0.091) calc(10vw * 0.091);
|
|
margin: 0;
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
font-family: "Roboto-Regular","Arial",sans-serif;
|
|
}
|
|
|
|
.termine ul > li > ul, .vorstand ul > li > ul {
|
|
display: table-row;
|
|
}
|
|
|
|
.termine ul > li > ul > div, .vorstand ul > li > ul > div {
|
|
font-weight: normal;
|
|
padding: 0;
|
|
margin: 0;
|
|
text-align: left;
|
|
}
|
|
|
|
.termine ul > li > ul > li, .vorstand ul > li > ul > li {
|
|
display: table-cell;
|
|
}
|
|
|
|
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div {
|
|
font-family: "Roboto-Light","Arial",sans-serif;
|
|
padding: 0 0 calc(10vw * 0.091) calc(10vw * 0.091);
|
|
}
|
|
|
|
.termine ul > li > ul > li:nth-child(1) { width: calc(350vw * 0.091); }
|
|
.termine ul > li > ul > li:nth-child(2) { width: calc(100vw * 0.091); }
|
|
.termine ul > li > ul > li:nth-child(3) { width: calc(450vw * 0.091); }
|
|
|
|
.vorstand ul > li > ul > li:nth-child(1) { width: calc(550vw * 0.091); }
|
|
.vorstand ul > li > ul > li:nth-child(2) { width: calc(350vw * 0.091); }
|
|
|
|
.termine ul > li > ul > li:nth-child(1) > div{ width: calc(340vw * 0.091); }
|
|
.termine ul > li > ul > li:nth-child(2) > div{ width: calc(90vw * 0.091); }
|
|
.termine ul > li > ul > li:nth-child(3) > div{ width: calc(440vw * 0.091); }
|
|
|
|
.vorstand ul > li > ul > li:nth-child(1) > div{ width: calc(540vw * 0.091); }
|
|
.vorstand ul > li > ul > li:nth-child(2) > div{ width: calc(340vw * 0.091); }
|
|
|
|
|
|
.termine ul > li > div, .termine ul > li > ul > li > div, .vorstand ul > li > div, .vorstand ul > li > ul > li > div {
|
|
font-size: 2.5vw;
|
|
}
|
|
}
|
|
|
|
|
|
@media (min-width: 769px) and (max-width: 1100px) {
|
|
header {
|
|
height: calc(200vw * 0.091);
|
|
}
|
|
|
|
header .left_header{
|
|
font-size: calc(24vw * 0.091);
|
|
}
|
|
header .left_header img.header-logo{
|
|
width: calc(43vw * 0.091);
|
|
margin-right: calc(12vw * 0.091);
|
|
}
|
|
header .right_header{
|
|
font-size: calc(18vw * 0.091);
|
|
}
|
|
header .right_header .nav {
|
|
padding: 0 calc(20vw * 0.091);
|
|
}
|
|
header .right_header .nav li {
|
|
margin: 0 calc(20vw * 0.091);
|
|
}
|
|
div.page{
|
|
top: calc(150vw * 0.091);
|
|
width: calc(1100vw * 0.091); /* That's actually 100% I know */
|
|
font-size:calc(20vw * 0.091);
|
|
margin: calc(-230vw * 0.091) 0 0 0;
|
|
}
|
|
div.page.home{
|
|
font-size:calc(36vw * 0.091);
|
|
}
|
|
|
|
div.page h1 {
|
|
font-size:calc(60vw * 0.091);
|
|
margin: calc(20vw * 0.091) 0 0 0;
|
|
padding: calc(22vw * 0.091) 0 1em 0;
|
|
width: 100%;
|
|
}
|
|
div.page h2 {
|
|
font-size:calc(60vw * 0.091);
|
|
}
|
|
div.page h3 {
|
|
font-size:calc(40vw * 0.091);
|
|
}
|
|
div.page div.threecolumn{
|
|
padding: calc(80vw * 0.091) calc(50vw * 0.091) calc(30vw * 0.091) calc(50vw * 0.091);
|
|
}
|
|
div.page div.threecolumn div{
|
|
width: calc(300vw * 0.091);
|
|
line-height: calc(50vw * 0.091);
|
|
font-size: calc(30vw * 0.091);
|
|
}
|
|
div.page div.threecolumn img{
|
|
width: calc(300vw * 0.091);
|
|
}
|
|
.page table {
|
|
padding:0 calc(50vw * 0.091) calc(50vw * 0.091) calc(50vw * 0.091);
|
|
}
|
|
.page p, .page td {
|
|
text-align: left;
|
|
}
|
|
.page p {
|
|
padding: 0 calc(50vw * 0.091);
|
|
}
|
|
.page td {
|
|
padding: calc(10vw * 0.091);
|
|
}
|
|
div.inner_footer{
|
|
top: calc(150vw * 0.091);
|
|
height: calc(200vw * 0.091);
|
|
font-size: calc(18vw * 0.091);
|
|
line-height: calc(27vw * 0.091);
|
|
margin: calc(-50vw * 0.091)px 0 0 0;
|
|
}
|
|
div.left_footer, div.middle_footer, div.right_footer {
|
|
padding: calc(28vw * 0.091);
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
header {
|
|
height: auto;
|
|
background-position: 0 43.5%;
|
|
}
|
|
header .left_header{
|
|
font-size: calc(24px * 0.7);
|
|
}
|
|
header .left_header img.header-logo{
|
|
width: calc(43px * 0.7);
|
|
margin-right: calc(12px * 0.7);
|
|
}
|
|
header .right_header{
|
|
font-size: 18px;
|
|
}
|
|
header .right_header .nav {
|
|
padding: 0 calc(20px * 0.7);
|
|
}
|
|
header .right_header .nav li {
|
|
margin: 0 calc(20px * 0.7);
|
|
}
|
|
div.page{
|
|
top: 0;
|
|
width: 100%;
|
|
font-size:calc(20px * 0.7);
|
|
margin: 0;
|
|
}
|
|
div.page.home{
|
|
font-size:calc(36px * 0.7);
|
|
}
|
|
div.page h1 {
|
|
font-size:calc(60px * 0.7);
|
|
margin: 0;
|
|
padding: calc(22px * 0.7) 0 1em 0;
|
|
}
|
|
div.page h2 {
|
|
font-size:calc(60px * 0.7);
|
|
}
|
|
div.page h3 {
|
|
font-size:calc(40px * 0.7);
|
|
}
|
|
div.page div.threecolumn{
|
|
padding: calc(80px * 0.7) calc(50px * 0.7) calc(30px * 0.7) calc(50px * 0.7);
|
|
|
|
}
|
|
div.page div.threecolumn div{
|
|
width: 300px;
|
|
line-height: calc(50px * 0.7);
|
|
font-size: calc(30px * 0.7);
|
|
}
|
|
div.page div.threecolumn img{
|
|
width: 300px;
|
|
}
|
|
.page table {
|
|
padding:0 calc(50px * 0.7) calc(50px * 0.7) calc(50px * 0.7);
|
|
}
|
|
.page p, .page td {
|
|
text-align: left;
|
|
}
|
|
.page p {
|
|
padding: 0 calc(50px * 0.7);
|
|
}
|
|
.page td {
|
|
padding: calc(10px * 0.7);
|
|
}
|
|
div.inner_footer{
|
|
top: calc(150px * 0.7);
|
|
height: auto;
|
|
font-size: calc(18px * 0.7);
|
|
line-height: calc(27px * 0.7);
|
|
margin: 0;
|
|
}
|
|
div.left_footer, div.middle_footer, div.right_footer {
|
|
padding: calc(28px * 0.7);
|
|
}
|
|
|
|
|
|
nav {
|
|
justify-content: start;
|
|
flex-direction: column;
|
|
flex-wrap: wrap;
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
align-items: start;
|
|
}
|
|
.left_header .nav, .right_header .nav, nav ul {
|
|
display: block;
|
|
}
|
|
nav ul:last-child {
|
|
width: 100%;
|
|
flex-basis: 100%;
|
|
}
|
|
nav ul li {
|
|
margin-bottom: 0;
|
|
width: 100%;
|
|
text-align: right;
|
|
padding: 0em;
|
|
}
|
|
nav .left_header ul li {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
nav .right_header ul li {
|
|
padding: 0.5em;
|
|
}
|
|
nav label {
|
|
text-align: right;
|
|
display: block;
|
|
padding: 0.5em;
|
|
font-size: 20px;
|
|
align-self: self-start;
|
|
}
|
|
input[type='checkbox']:not(:checked)+ul {
|
|
display: none;
|
|
}
|
|
.threecolumn{
|
|
flex-direction: column;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.termine ul, .vorstand ul {
|
|
display: table;
|
|
border-collapse: collapse;
|
|
padding: 0 0 calc(50px * 0.7) calc(50px * 0.7);
|
|
margin: 0 0 calc(50px * 0.7) calc(50px* 0.7);
|
|
width: calc(1000px * 0.7);
|
|
}
|
|
|
|
.termine ul > li, .vorstand ul > li {
|
|
display: table-row;
|
|
margin: 0;
|
|
}
|
|
|
|
.termine ul > li > div, .vorstand ul > li > div{
|
|
width: 680px;
|
|
max-width: 700px;
|
|
text-align: left;
|
|
padding: calc(20px * 0.7) calc(10px * 0.7) calc(15px * 0.7) calc(10px * 0.7);
|
|
margin: 0;
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
font-family: "Roboto-Regular","Arial",sans-serif;
|
|
}
|
|
|
|
.termine ul > li > ul, .vorstand ul > li > ul {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
display: grid;
|
|
grid-gap: 0;
|
|
}
|
|
|
|
.termine ul > li > ul,{
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-template-rows: auto auto;
|
|
}
|
|
|
|
.vorstand ul > li > ul {
|
|
grid-template-columns: 1fr;
|
|
grid-template-rows: auto auto;
|
|
grid-gap: 0;
|
|
}
|
|
|
|
.termine ul > li > ul > div, .vorstand ul > li > ul > div{
|
|
font-weight: normal;
|
|
padding: 0;
|
|
margin: 0;
|
|
text-align: left;
|
|
}
|
|
|
|
.termine ul > li > ul > li, .vorstand ul > li > ul > li {
|
|
display: table-cell;
|
|
}
|
|
|
|
.termine ul > li > ul > li:nth-child(1) {
|
|
width: 270px;
|
|
grid-column: span 1;
|
|
}
|
|
.termine ul > li > ul > li:nth-child(2) {
|
|
width: 430px;
|
|
grid-column: span 1;
|
|
}
|
|
.termine ul > li > ul > li:nth-child(3) {
|
|
width: 700px;
|
|
grid-column: span 2;
|
|
}
|
|
|
|
.vorstand ul > li > ul > li:nth-child(1), .vorstand ul > li > ul > li:nth-child(2){
|
|
width: 700px;
|
|
grid-column: span 1;
|
|
}
|
|
|
|
|
|
.termine ul > li > ul > li > div, .vorstand ul > li > ul > li > div {
|
|
font-family: "Roboto-Light","Arial",sans-serif;
|
|
padding: calc(10px * 0.7) calc(10px * 0.7);
|
|
}
|
|
|
|
.termine ul > li > ul > li:nth-child(1) > div{ width: 250px; }
|
|
.termine ul > li > ul > li:nth-child(2) > div{
|
|
width: 410px;
|
|
margin-left: 0;
|
|
margin-right: auto;
|
|
text-align: left;
|
|
}
|
|
.termine ul > li > ul > li:nth-child(3) > div{
|
|
width: 680px;
|
|
padding: calc(10px * 0.7) calc(10px * 0.7) calc(20px * 0.7) calc(10px * 0.7);
|
|
}
|
|
|
|
.vorstand ul > li > ul > li:nth-child(1) > div, .vorstand ul > li > ul > li:nth-child(2) > div{ width: 680px; }
|
|
.vorstand ul > li > ul > li:nth-child(2) > div { padding: calc(10px * 0.7) calc(10px * 0.7) calc(20px * 0.7) calc(10px * 0.7); }
|
|
|
|
|
|
.termine ul > li > div, .termine ul > li > ul > li > div, .vorstand ul > li > div, .vorstand ul > li > ul > li > div {
|
|
font-size: 24px;
|
|
}
|
|
|
|
} |