/* @font-face{ font-family: "subscriber"; src: url("/static/fonts/SUBSCRIBER-Regular.otf") format("opentype"); */ /* } */ body{ } #welcomepage{ background-color:#000000; } #gallery{ background-image: url(/assets/heartrain.gif), radial-gradient(circle, aliceblue, cornflowerblue, palevioletred, salmon); background-repeat: repeat-x,no-repeat; font-family: 'Courier New', Courier, monospace; margin-top: 10em; margin-bottom: 10em; background-size: 40em, auto; } #swiperpages{ background-image: radial-gradient(circle, aliceblue, cornflowerblue, palevioletred, salmon); } p{ text-align: center; font-family: Inter,sans-serif; font-size: 1.5em; position: absolute; left: 50%; width: 1680px; transform: translate(-50%, -50%); } #introquestion{ color: #b456ff; margin-top: 10.5em; width:1750px; } #description{ color: white; margin-top: 34.5em; text-align: left; width: 1750px; font-size: 1.4em; position: absolute; } #description_color{ color:#87b5e7; } #moredescription{ color:#000000; margin-top: 32.5em; text-align: left; } .infobox{ padding: 31px; text-align: left; justify-content: center; background-color: radial-gradient(circle, aliceblue, cornflowerblue, palevioletred, salmon); font-family: Inter,sans-serif; font-size: 1.1em; color: white; align-items: center; display: flex; background-color: #d095ee; position: absolute; top:-8em; } .infowrapper{ width: 1750px; position: absolute; align-items: center; justify-content: center; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index:-10; } .header{ width:100%; height: 10em; position:absolute; margin-bottom: 7em; top:9em; } .headerimage { position:absolute; text-align: center; justify-content: center; align-items: center; transform: translate(-50%, -50%); top: 50%; left: 50%; width:105em; filter:contrast(1.1); } .cooltext{ position: absolute; text-align: center; margin-left: 20em; margin-top: 3.3em; color: pink; font-family: "Brush Script MT", cursive; font-size: 2.5em; text-shadow: 2px 2px #ff0000; } .fiona{ width: 30%; position: absolute; z-index: -10; margin-top: 34em; filter: blur(6px); } .nyancat{ position: absolute; z-index: -10; margin-top: 1em; filter: blur(6px); left: 50%; top: 800%; } .babyoncat{ position: absolute; margin-top: 1em; filter: blur(6px); left: 75%; top: 500%; z-index: -10; } .confusedgirl{ position: absolute; z-index: -9; margin-top: 1em; filter: blur(6px); left: 30%; top: 1020%; } .doge{ position: absolute; z-index: -9; margin-top: 1em; filter: blur(6px); left: 30%; top: 600%; } .buttonback { align-items: center; background-color: #fee6e3; border: 2px solid #111; border-radius: 8px; box-sizing: border-box; color: #111; cursor: pointer; display: flex; font-family: Inter,sans-serif; font-size: 16px; height: 48px; justify-content: center; line-height: 24px; max-width: 100%; padding: 0 25px; position: absolute; text-align: center; text-decoration: none; user-select: none; -webkit-user-select: none; touch-action: manipulation; top: 1em; left: 1em; } .buttonback:after { background-color: #111; border-radius: 8px; content: ""; display: block; height: 48px; left: 0; width: 100%; position: absolute; top: -2px; transform: translate(8px, 8px); transition: transform .2s ease-out; z-index: -1; } .buttonback:hover:after { transform: translate(0, 0); } .buttonback:active { background-color: #ffdeda; outline: 0; } .buttonback:hover { outline: 0; } @media (min-width: 768px) { .buttonback { padding: 0 40px; } } .buttoncontainer { position: absolute; display: flex; align-items: center; justify-content: center; left: 50%; transform: translate(-50%, -50%); margin-top: 35em; width:1750px; background: linear-gradient(90deg, rgba(153,150,244,1) 0%, rgba(128,205,229,1) 50%, rgba(147,102,237,1) 100%); height:10em; } .gotobutton { align-items: center; background-color: blueviolet; border: 2px solid #111; border-radius: 8px; box-sizing: border-box; color: #111; cursor: pointer; display: flex; font-family: Inter,sans-serif; font-size: 16px; height: 48px; justify-content: center; line-height: 24px; min-width: 270px; max-width: 100%; padding: 0 25px; position: relative; left: auto; right: auto; text-align: center; text-decoration: none; user-select: none; -webkit-user-select: none; touch-action: manipulation; margin: 20px; } .gotobutton:after { background-color: #111; border-radius: 8px; content: ""; display: block; height: 48px; left: 0; width: 100%; position: absolute; top: -2px; transform: translate(8px, 8px); transition: transform .2s ease-out; z-index: -1; } .gotobutton:hover:after { transform: translate(0, 0); } .gotobutton:active { background-color: #ffdeda; outline: 0; } .gotobutton:hover { outline: 0; } @media (min-width: 768px) { .gotobutton { padding: 0 40px; } } .thesisbutton { align-items: center; background-color: blueviolet; border: 2px solid #111; border-radius: 8px; box-sizing: border-box; color: #111; cursor: pointer; display: flex; font-family: Inter,sans-serif; font-size: 16px; height: 48px; min-width: 270px; justify-content: center; line-height: 24px; max-width: 100%; padding: 0 25px; position: relative; text-align: center; text-decoration: none; user-select: none; -webkit-user-select: none; touch-action: manipulation; margin: 20px; } .thesisbutton:after { background-color: #111; border-radius: 8px; content: ""; display: block; height: 48px; left: 0; width: 100%; position: absolute; top: -2px; transform: translate(8px, 8px); transition: transform .2s ease-out; z-index: -1; } .thesisbutton:hover:after { transform: translate(0, 0); } .thesisbutton:active { background-color: #ffdeda; outline: 0; } .thesisbutton:hover { outline: 0; } @media (min-width: 768px) { .thesisbutton { padding: 0 40px; } } .buttoncontainerslides{ position: absolute; display: block; min-width: 100%; } a:-webkit-any-link { color: black; cursor: pointer; text-decoration: none; } .printbutton{ align-items: center; background-color: #fee6e3; border: 2px solid #111; border-radius: 8px; box-sizing: border-box; color: #111; cursor: pointer; display: flex; font-family: Inter,sans-serif; font-size: 16px; height: 48px; justify-content: center; line-height: 24px; max-width: 100%; padding: 0 25px; position: absolute; text-align: center; text-decoration: none; user-select: none; -webkit-user-select: none; touch-action: manipulation; top: 1em; right: 1em; } .printbutton:after { background-color: #111; border-radius: 8px; content: ""; display: block; height: 48px; left: 0; width: 100%; position: absolute; top: -2px; transform: translate(8px, 8px); transition: transform .2s ease-out; z-index: -1; } .printbutton:hover:after { transform: translate(0, 0); } .printbutton:active { background-color: #ffdeda; outline: 0; } .printbutton:hover { outline: 0; } @media (min-width: 768px) { .printbutton { padding: 0 40px; } } .grid{ display: grid; justify-content: space-between; grid-template-columns: auto auto auto auto auto; row-gap: 90px; align-items: center; justify-items: center; margin-left:2.5em; margin-right: 2.5em; margin-bottom: 8em; margin-top: 35em; } .overviewimage{ object-fit: contain; width: 250px; /* box-shadow: 0 40px 80px #834b8b; */ box-shadow: 0 40px 80px #a27cc5; background-image: url(/assets/glitter-stars.gif); height:250px; padding:10px; } swiper-container{ text-align: center; display: block; margin-left: auto; margin-right: auto; width: 50%; height: 90%; top: 5em; } swiper-slide{ text-align: center; } .sliderimage{ /* width: 100%; */ display: block; max-height: 95vH; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: contain; height: 100%; } .meme{ text-align: center; display: block; margin-left: auto; margin-right: auto; position: absolute; object-fit: contain; transform: translate(-50%, -50%); top: 50%; left: 50%; height: 100%; } .memecontainer{ text-align: center; display: block; margin-left: auto; margin-right: auto; width: 100%; height: 90%; top: 5em; position: relative; } .extracontent{ background: green; } .trigger > img{ filter:blur(10px); transition: filter 1s; } .trigger::after{ content: "Content Warning"; position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 4em; } .trigger:hover > img{ filter: blur(0px); } .trigger:hover:after{ opacity: 0; } .trigger:hover{ opacity: 1; transition: opacity 1s; } :root { --swiper-navigation-size: 60; --swiper-theme-color: rgb(0, 89, 255); --swiper-navigation-color: var(--swiper-theme-color); --swiper-pagination-color: var(--swiper-theme-color); } /* E-mail form */ #fcf-form { display:block; } .fcf-body { margin: 0; font-family: Inter,sans-serif; font-size: 16px; font-weight: 400; line-height: 1.5; color: #212529; text-align: left; padding: 30px; padding-bottom: 10px; max-width: 100%; position: relative; display: flex; align-items: center; justify-content: center; } .fcf-form-group { margin-bottom: 1rem; } .fcf-input-group { position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; align-items: stretch; width: 100%; } .fcf-form-control { display: block; width: 600px; height: calc(1.5em + 0.75rem + 2px); padding: 0.375rem 0.75rem; font-size: 1rem; font-weight: 400; line-height: 1.5; background-clip: padding-box; border: 1px solid #ced4da; outline: none; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; background-color: #fee6e3; border: 2px solid #111; border-radius: 8px; box-sizing: border-box; color: #111; } .fcf-form-control:focus { border: 1px solid #313131; } select.fcf-form-control[size], select.fcf-form-control[multiple] { height: auto; } textarea.fcf-form-control { font-family: -apple-system, Arial, sans-serif; height: auto; } label.fcf-label { display: inline-block; margin-bottom: 0.5rem; } .fcf-btn { align-items: center; background-color: #fee6e3; border: 2px solid #111; border-radius: 8px; box-sizing: border-box; color: #111; cursor: pointer; display: flex; font-family: Inter,sans-serif; font-size: 16px; height: 48px; justify-content: center; line-height: 24px; max-width: 100%; padding: 0 25px; position: relative; text-align: center; text-decoration: none; user-select: none; -webkit-user-select: none; touch-action: manipulation; width: 600px; } .fcf-btn:after { background-color: #111; border-radius: 8px; content: ""; display: block; height: 48px; left: 0; width: 100%; position: absolute; top: -2px; transform: translate(8px, 8px); transition: transform .2s ease-out; z-index: -1; } .fcf-btn:hover:after { transform: translate(0, 0); } .fcf-btn:active { background-color: #ffdeda; outline: 0; } .fcf-btn:hover { outline: 0; } @media (min-width: 768px) { .buttonback { padding: 0 40px; } } input[type="submit"].fcf-btn-block, input[type="reset"].fcf-btn-block, input[type="button"].fcf-btn-block { width: 100%; } /* airport infotext welcome page */ /* * { padding: 0; } */ /* .center { position: relative; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } */ /* .table { min-width: 100%; height: 150px; background-color: #000000; } .table .monitor-wrapper { background: #050321; min-width: 100%; height: 130px; box-shadow: 0px 2px 2px 2px rgba(0, 0, 0, 0.3); } .textwrapper { min-width: 100%; height: 100px; overflow: hidden; white-space: nowrap; box-shadow: inset 0px 5px 10px 2px rgba(0, 0, 0, 0.3); } .p { font-family: 'VT323', monospace; font-size: 100px; position: relative; display: inline-block; animation: move 20s infinite linear; color: #EBB55F; } @keyframes move { from { left: 800px; } to { left: -4800px; } } */