opencoil-paracity/website/preshow/main.css
2020-10-15 12:42:54 +02:00

220 lines
3.8 KiB
CSS

body {
height: 100%;
width: 100%;
max-width: 100%;
max-height: 100%;
overflow: hidden;
margin: 0;
background: white;
}
a {
color: #d152b8;
}
#infolink {
color: white;
text-decoration: underline;
}
#inviteDiv {
position: absolute;
display: flex;
z-index: 200;
flex-direction: column;
justify-content: center;
align-items: center;
pointer-events: none;
white-space: pre;
word-wrap: break-word;
width: 100%;
}
#inviteDiv h1, h2 {
text-align: center;
font-family: monospace;
max-width: 100%;
margin: 0;
word-wrap: break-word;
text-shadow: 3px 3px 1px rgba(75, 75, 75, 1);
color: #d152b8;
}
#inviteDiv h1 {
font-size: 1vw;
padding-top: 5vh;
padding-left: 17vw;
}
#inviteDiv h2 {
font-size: 0.4vw;
padding-left: 24vw;
}
#invitetextDiv {
z-index: 300;
position: absolute;
display: flex;
justify-content: center;
align-items: center;
word-wrap: break-word;
height: 100%;
width: 100%;
max-height: 100%;
max-width: 100%;
}
#invitetextDiv p {
font-family: Arial;
font-weight: bold;
flex-grow: 1;
font-size: 1.2vw;
color: #d152b8;
text-align: center;
line-height: 2;
padding-top: 5vw;
padding-left: 2.5vw;
}
#backgroundDiv {
position: absolute;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
#backgroundDiv h3 {
font-family: monospace;
white-space: pre;
padding-top: 5vw;
font-size: 0.8vw;
color: lightgrey;
}
#infotext, #infotext_en {
visibility: hidden;
opacity:0;
overflow-x: hidden !important;
overflow-y: scroll !important;
position: absolute;
z-index: 400;
width: 80%;
height: 70%;
max-height: 100%;
max-width: 100%;
word-wrap: break-word;
background-color: #d152b8;
color: white;
margin: 12% 20% 20% 10%;
transition: opacity 1s;
}
#infobuttons {
display: flex;
flex-direction: row;
justify-content: space-between;
}
#closeButton {
height: min-content;
width: min-content;
font-family: Arial;
font-size:2vw;
font-weight:bold;
padding:1%;
cursor: pointer;
margin: 0;
}
#enButton {
position: relative;
height: min-content;
width: min-content;
margin: 0;
font-family: Arial;
font-size:2vw;
font-weight:bold;
color: white;
padding:1%;
text-align: right;
cursor: pointer;
}
#closeButtonbottom {
font-family: Arial;
font-size:2vw;
font-weight:bold;
text-align: center;
padding-bottom: 5vh;
margin: 0;
cursor: pointer;
}
#infotext p, #infotext_en p {
padding: 0% 10% 10% 10%;
font-family: Arial;
font-weight: bold;
font-size: 2.0vw;
}
@media only screen and (max-width: 768px) {
#inviteDiv h1 {
font-size: 1.5vw;
}
#inviteDiv h2 {
font-size: 0.8vw;
}
#invitetextDiv p {
padding-top: 7vh;
font-size: 3vw;
color: #d152b8;
}
#backgroundDiv h3 {
font-size: 1.8vw;
padding-top: 15vw;
padding-right: 2.5vw;
}
#infotext, #infotext_en {
visibility: hidden;
overflow-x: hidden !important;
overflow-y: scroll !important;
position: absolute;
z-index: 400;
width: 90%;
height: 70%;
max-height: 100%;
max-width: 100%;
word-wrap: break-word;
background-color: #d152b8;
color: white;
margin: 33% 5% 0% 5%;
}
#closeButton, #enButton {
font-family: Arial;
font-size:4vw;
font-weight:bold;
padding:3%;
}
#closeButtonbottom {
font-size:4vw;
font-weight:bold;
}
#infotext p, #infotext_en p {
padding: 20px;
font-family: Arial;
font-weight: bold;
font-size: 4vw;
margin: 0;
}
}