You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
tdf-webseite/tdf3/styles-0.1.css

314 lines
4.7 KiB

@font-face {
font-family: 'TitilliumWeb-Regular';
src: url('font/TitilliumWeb-Regular.ttf');
}
@font-face {
font-family: 'TitilliumWeb-Bold';
src: url('font/TitilliumWeb-Bold.ttf');
}
body {
background: #2D95AB;
padding: 0;
margin: 0;
}
.background {
background-image: url("image/neon-scene.png");
background-repeat: no-repeat;
background-position: center top;
background-attachment: fixed;
padding-top: 20px;
margin: 0;
}
#map {
background-image: url("image/map.png");
}
.banner {
vertical-align: middle;
position: absolute;
top: 20px;
left: 0;
bottom: 0;
margin: 0;
padding: 0;
width: 100%;
height: auto;
}
#banner-1 {
mix-blend-mode: screen;
}
#banner-2 {
mix-blend-mode: hard-light;
}
#banner-3 {
mix-blend-mode: normal;
}
.box {
background: #024361;
margin-bottom: 2em;
padding: 1em 2em 0.7em 1em;
border-style: solid;
border-color: #8FDD75;
border-width: 2px;
box-shadow: 0px 0px 10px 0px rgba(0, 255, 255, 0.5),
inset 0px 0px 10px 0px rgba(0, 255, 255, 0.5);
background-blend-mode: soft-light;
background-size: auto 100%;
background-repeat: no-repeat;
background-position: right;
background-blend-mode: luminosity;
text-shadow: 0px 0px 5px #012E42,
0px 0px 10px #012E42,
0px 0px 15px #012E42,
0px 0px 20px #012E42,
0px 0px 25px #012E42,
0px 0px 30px #012E42;
}
#participate {
background-image: url("image/participate.png");
}
#content {
max-width: 1000px;
margin: 0 auto;
padding: 0 75px;
}
#event {
background-image: url("image/network.png");
}
#assemblies {
background-image: url("image/assemblies.png");
}
#sponsor {
background-image: url("image/sponsor.png");
}
#ctt {
background-image: url("image/pesthoenchen.png");
}
#costs {
background-image: url("image/costs.png");
background-position: bottom;
background-size: 100% auto;
}
.banner-box {
position: relative;
height: 400px;
}
.right-align {
text-align: right;
}
p,
h2, h3, li {
color: #ffff00;
}
a {
color: #ffffaa;
}
p,
a,
li {
font-family: "TitilliumWeb-Regular";
font-size: 1.2em;
}
li {
font-size: "TitilliumWeb-Regular";
font-size: 1.0em;
}
ul {
list-style-type: none;
padding-left: 0;
}
ul li {
padding-left: 20px;
margin-top: 0px;
margin-bottom: 0px;
position: relative;
}
ul li:before {
content: "";
width: 8px;
height: 8px;
background-color: #ffffaa;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
h2 {
font-family: "TitilliumWeb-Bold";
text-transform: uppercase;
font-size: 3em;
margin-top: 0em;
margin-block-end: 0em;
}
b {
font-family: "TitilliumWeb-Bold";
}
h3,
.big {
font-family: "TitilliumWeb-Bold";
font-size: 1.5em;
margin-top: 0;
margin-bottom: 0;
}
.label {
margin-bottom: 0;
}
.label-sub {
margin-top: 0;
}
.flex {
height: 200px;
display: flex;
margin-bottom: 1em;
}
.box-sub {
display: flex;
flex: 33.33%;
padding: 10%;
background: #352040;
padding: 1em 2em 0.7em;
background-blend-mode: soft-light;
background-repeat: no-repeat;
background-blend-mode: normal;
}
#sponsor-pagina {
margin-right: 20px;
margin-top: 35px;
max-width: 100px;
max-height: 150px;
background-image: url("image/pagina_logo.png");
}
#sponsor-daasi {
margin-top: 50px;
max-width: 100px;
max-height: 150px;
background-image: url("image/daasi_logo.png");
}
#sponsor-tuebingen {
margin-top: 35px;
max-width: 100px;
max-height: 150px;
background-image: url("image/tuebingen_logo.png");
}
#sponsor-no-budget {
margin-right: 20px;
margin-top: 50px;
max-width: 300px;
max-height: 150px;
background-image: url("image/no_budget_logo.svg");
}
#veranstalter-ctt {
width: 150px;
height: 150px;
background-image: url("image/CCTLogo.webp");
background-size: auto 100%;
}
#veranstalter-shedhalle {
margin-top: 2em;
height: 136px;
width: 38px;
background-image: url("image/shedhalle_logo.png");
}
#veranstalter-kims {
margin-top: 2em;
width: 150px;
height: 150px;
background-image: url("image/kims_logo.png");
}
.verlinkung {
display: block;
height: 100%;
width: 100%;
text-decoration: none;
}
.button-container {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
.button {
display: inline-block;
padding: 20px 40px;
font-size: 24px;
font-weight: bold;
text-decoration: none;
color: #000;
background-color: #ffff00;
border: none;
cursor: pointer;
transition: background-color 0.3s ease;
border-radius: 0;
margin: 0 auto;
text-shadow: none;
}
#languages {
position: fixed;
top: 19px;
right: 10%;
transform: translateY(-50%);
background-color: #084462;
padding: 10px;
padding-bottom: 3px;
z-index: 9999;
}
.image-bar {
display: flex;
width: 100%;
justify-content: space-around;
align-items: center;
background-color: #f0f0f0;
padding: 10px;
}
.image-bar img {
max-height: 100px;
margin: 0 10px;
}