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.

266 lines
4.3 KiB
CSS

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

body{
margin: 0;
display: block;
}
.page {
height: 297mm;
width: 210mm;
margin: 0 auto;
}
@page {
size: a4;
}
.card {
float: left;
width: calc(210mm / 2 - 10mm); /* Adjusted width to fit 2 cards per row with margins */
height: calc(297mm / 4 - 10mm); /* Adjusted height to fit 4 rows per page with margins */
/*border: 1mm solid salmon;*/
margin: 5mm;
box-sizing: border-box; /* Includes the border in the width and height calculation */
overflow: hidden;
}
.card.left-card {
padding-right: 10mm;
}
.card.right-card {
padding-left: 10mm;
}
/*game */
h1{
font-size: 12pt;
font-family: 'NotCourierSans Bold', Courier, monospace;
color: #c4007a;
font-weight: 600;
padding-left: 5mm;
padding-right: 5mm;
text-align: center;
padding-top: 50px;
overflow: hidden;
margin: 0mm;
margin-bottom: 5pt;
line-height: 14pt;
overflow-wrap: break-word;
}
/* thesis quotes */
h2{
font-family: 'Catamaran Bold', sans-serif;
font-weight: 1000;
font-size: 12pt;
color: #a6dbf0;
margin: 0mm;
margin-bottom: 5pt;
line-height: 14pt;
padding: 5mm 5mm 0mm 5mm;
}
/* alternative materials*/
h3 {
font-family: 'Catamaran Bold', sans-serif;
font-weight: 1000;
font-size: 12pt;
color: #E2C044;
margin: 0mm;
margin-bottom: 5pt;
line-height: 14pt;
padding: 5mm 5mm 0mm 5mm;
}
/* wiki*/
h4{
font-family: 'NotCourierSans Bold',Courier, sans-serif;
font-weight: 800;
font-size: 12pt;
color: #9594C4;
line-height:normal;
padding-left: 10mm;
margin: 1mm;
padding: 5mm 5mm 0mm 5mm;
}
.h4::after {
content: ":";
white-space: pre;
}
.a4::after {
content: "\A";
white-space: pre;
}
p{
margin: 0mm;
line-height: 10.5pt;
font-family: 'Catamaran Medium', sans-serif;
font-weight: 400;
font-size: 10pt;
color: #393E41;
padding: 0mm 5mm 0mm 5mm;
}
.tensteps{
font-family: 'Catamaran Bold', sans-serif;
font-weight: 800;
font-size: 12pt;
color: #B4D194;
line-height: 16pt;
padding-top: 50%;;
padding-left: 5mm;
text-align: center;
display: inline-block;
align-self: flex-end;
}
img {
width: 100%;;
height: 100%;
object-fit: cover;
float: left;
height: auto;
max-width: 100%;
}
.image_titles {
position: absolute;
width: 105mm;
text-align: center;
}
.game{
object-fit:cover;
}
@media print {
* {
box-sizing: border-box;
}
.body{
margin: 0;
-webkit-print-color-adjust: exact !important; /* Chrome, Safari 6 15.3, Edge */
color-adjust: exact !important; /* Firefox 48 96 */
print-color-adjust: exact !important;
}
@page{
size: a4 !important;
margin: 0;
color-adjust: exact;
-webkit-print-color-adjust: exact !important; /* Chrome, Safari 6 15.3, Edge */
color-adjust: exact !important; /* Firefox 48 96 */
print-color-adjust: exact !important;
}
.overflowing-element {
overflow: hidden;
}
nav{
display: none !important;
}
}
@media screen {
.page{
border: 1px solid #9594c4;
margin-bottom: 5px;
}
nav {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 50;
padding: 24px;
text-align: right;
position: fixed;
top: 0;
display: flex;
justify-content: flex-end;
}
nav button {
margin-left: 10px;
}
#textField {
margin-top: 100px;
position: absolute;
right: 0;
padding: 24px;
}
.btn {
background: white;
display: inline-block;
min-width: 50px;
height: 50px;
border-radius: 24px;
padding: 0 4px;
border: 1px solid currentColor;
color: #9594c4;
transition-duration: 0.7s;
cursor: pointer;
}
.btn:hover {
background-color: #9594c4;
}
}
#textbox {
position: absolute;
bottom: 0;
left: 0;
width: 100px;
height: 50px;
}