You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

256 lines
4.1 KiB
CSS

2 years ago
@font-face {
font-family: Fluxisch;
src: url(fonts/FLuxisch_ElseWeb_font/FluxischElse-Regular.woff);
}
@font-face {
font-family: Fluxisch_bold;
src: url(fonts/FLuxisch_ElseWeb_font/FluxischElse-Bold.woff);
}
@font-face {
font-family: Junicode;
src: url(fonts/Junicode.ttf);
}
@font-face {
font-family: syne-italic;
src: url(fonts/Syne-Italic.otf);
}
body{
/* background-color: red; */
background-color: #eeecf0;
margin: 0;
overflow: auto;
}
.container {
display: flex;
overflow: hidden;
height: 100vh;
position: relative;
backface-visibility: hidden;
will-change: overflow;
}
.info {
overflow: auto;
height: auto;
width: 50%;
height: 100%;
margin: 0;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.pictures{
overflow: auto;
height: auto;
width: 50%;
height: 100%;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.vertical_line {
border-left: 2.5px solid red;
height: 100%;
}
.horizontal_line{
border-bottom: 2.5px solid red;
width: 100%;
margin-left: 0;
margin-top: 0.5vh;
margin-bottom: 0.5vh;
}
.info::-webkit-scrollbar {
display: none;
}
img {
width: 100%;
}
h1 {
margin: 0;
margin-left: 1.5vw;
margin-top: 3vh;
margin-bottom: 3vh;
font-family: syne-italic;
font-size: 5vw;
line-height: 5.5vw;
color: #2e1d69;
}
h2 {
font-size: 1.5vw;
margin: 0;
margin-left: 1vw;
margin-top: 0;
text-decoration: underline;
font-family: Fluxisch;
line-height: 25pt;
color: #2e1d69;
}
p{
text-indent: 2em;
font-family: Fluxisch;
font-size: 1.5vw;
margin-left: 1vw;
margin-right: 2vw;
line-height: 2.7vh;
color: #2e1d69;
}
/* @media print{
h1 {
font-size: 25pt;
margin: 0;
margin-top: 0;
font-family: syne-italic;
line-height: 25pt;
color: #2e1d69;
}
h2 {
font-size: 25pt;
margin: 0;
margin-top: 0;
font-family: Fluxisch;
line-height: 25pt;
color: #2e1d69;
}
p{
text-indent: 2em;
font-family: Fluxisch;
font-size: 10pt;
margin-right: 2vw;
line-height: 10.5pt;
color: #2e1d69;
}
.container {
display: flex;
overflow: hidden;
height: 100vh;
position: relative;
backface-visibility: hidden;
will-change: overflow;
}
.info {
overflow: auto;
height: auto;
position: sticky;
width: 70%;
height: 100%;
margin: 0;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.pictures{
overflow: auto;
height: auto;
width: 30%;
margin: 0.5vh;
margin-top: 0;
height: 100%;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
border-left: none;
}
}
@page {
size: A5;
margin-top: 5mm;
margin-bottom: 5mm;
margin-left: 10mm;
margin-right: 5mm;
} */
@media screen and (max-width: 1000px) {
.container{
display: initial;
}
.info {
display: block;
height: auto;
width: 100%;
}
.pictures{
display: block;
height: auto;
width: 100%;
}
.vertical_line {
border-top: 2.5px solid red;
border-left: 0;
margin-top: 1.5vh;
margin-bottom: 1.5vh;
}
.horizontal_line{
margin-top: 1.5vh;
margin-bottom: 1.5vh;
}
img {
margin-top: 1.5vh;
}
h1 {
margin: 0;
margin-left: 5vw;
margin-top: 3vh;
margin-bottom: 3vh;
font-family: syne-italic;
font-size: 12.5vw;
line-height: 13.5vw;
color: #2e1d69;
}
h2 {
font-size: 4vw;
margin: 0;
margin-left: 5vw;
margin-top: 0;
text-decoration: underline;
font-family: Fluxisch;
line-height: 25pt;
color: #2e1d69;
}
p{
text-indent: 2em;
font-family: Fluxisch;
font-size: 4vw;
margin-left: 4.5vw;
margin-right: 4.5vw;
line-height: 4.4vw;
color: #2e1d69;
}
}