@charset "UTF-8"; /* Fonts */ @font-face { font-family: "Burbank Small Medium"; src: url("/assets/fonts/event/Burbank-Small-Medium.woff2") format("woff2"), url("/assets/fonts/event/Burbank-Small-Medium.woff") format("woff"), url("/assets/fonts/event/Burbank-Small-Medium.ttf") format("truetype"); } :root { --primary: #9b161a; --secondary: #c7c7c7; --dark: #c7c7c7; --muted: #131512; --gray: #c7c7c7; --white: #131512; --black: #131512; --background: #c1f3ff; --gray-100: #131512; --gray-200: #131512; --gray-400: #e6faff; --gray-500: #e6faff; --gray-600: #e6faff; --gray-700: #e6faff; --gray-800: #e6faff; --gray-900: #e6faff; } #frontpage .posts .card, #userpage .posts .card, #search .posts .card { border-color: #a7e5fb; } body { font-family: 'Burbank Small Medium', sans-serif; background-color: var(--background) !important; background-image: url('/i/event/pattern.png') !important; overflow-x: hidden; } * { border-color: var(--primary); } .border { border-color: var(--primary) !important; } .form-control { background: transparent; border-color: var(--primary) !important; } .btn { background: var(--primary) !important; border-color: var(--primary) !important; border-width: 2px; color: #fff !important; } .btn .fas { color: #fff !important; } .form-control:disabled, .form-control[readonly] { background: transparent; border-color: var(--primary) !important; } .btn-success { border-color: #38A169 !important; } .btn-danger { border-color: #E53E3E !important; } #frontpage .pseudo-submit-form.card .card-body .form-control { border-color: transparent !important; } .btn-lg { border-color: transparent !important; } pre { color: #CFCFCF; } .transparent { background: None !important; } #frontpage .post-title a:visited { color: #7a7a7a !important; } .post-title a, h1.post-title { font-family: 'Burbank Small Medium', cursive; font-size: 1.25rem; } .arrow-up::before, .arrow-down::before { content: '\f7dc'; width: 20px; } .arrow-down::before { display: inline-block; transform: rotate(180deg); } .arrow-up.active::before, .arrow-down.active::before { content: '\f7db'; } .comment { background-color: var(--gray-600); } .comment-actions .btn { background-color: transparent !important; color: var(--gray-200) !important; } .comment-actions .fas { color: var(--gray-200) !important; } .comment-actions .btn::after{ background: none !important; } #thread .card { padding: 0.5rem; } body { cursor: url(/assets/images/event/cursor.png?v=1), auto !important; } textarea, input[type=textbox], input[type=search] { cursor: url(/assets/images/event/text.png?v=1), auto !important; } .btn, input[type=button], button, a, img { cursor: url(/assets/images/event/pointer.png?v=1), auto !important; } .fa-moon-over-sun:before{content:"\f74a"} /* lights */ .navbar::after, .lights::after { content: ""; position: absolute; top: 0; left: 0; height: 57px; width: 100%; background: url('/i/event/lights.png?v=1'); animation: lights 1s infinite steps(2); pointer-events: none; } @keyframes lights { 0% { /*Two zeros, not one !!*/ /*[0] is equivalent to [0 50%] and will create a different animation */ background-position: 0 0; } 100% { background-position: 0 -138px; } } /* snowcaps */ .btn, .snow-cap { position: relative; } .btn::after, .snow-cap::after { content: ''; pointer-events: none; background: url("/i/event/snowcap.png?v=1") repeat-x; background-size: contain; position: absolute; bottom: -18px; left: 0; right: 0; height: 23px; border: none; border-radius: 9999px; } /* snow effect */ body { background-color: #1f1f1f; background-blend-mode: soft-light; } .color { width: 20%; height: 100%; float: left } .color p { position: relative; z-index: 1231231; text-align: center; line-height: 90vh; } .color:nth-child(1){ background-color: #F5624D; } .color:nth-child(2){ background-color: #CC231E; } .color:nth-child(3){ background-color: #34A65F; } .color:nth-child(4){ background-color: #0F8A5F; } .color:nth-child(5){ background-color: #235E6F; } #snow { height: 100%; color: #FFF; display: block; } /* candy cane */ .candy-cane { height: 125px; width: 125px; position: fixed; right: 0; bottom: -9px; transform: rotate(15deg); transition: 200ms ease-out; background-image: url("data:image/svg+xml,%3Csvg version='1.1' class='candy-cane' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 100' enable-background='new 0 0 100 100' xml:space='preserve'%3E%3Cg%3E%3Cpath fill='%23FFFFFF' d='M63.7,97.7c-3.7,0-6.8-3-6.8-6.8V27.1c0-0.3,0-0.6,0.1-0.9c0,0,0,0,0,0c0,0,0.2-2.8-1.2-4.3 c-1.3-1.4-3.9-2.4-5.8-2.4c-2.8,0-4.8,1.3-6,2.5c-1.6,1.8-1.5,4.9-1.5,4.9c0.4,3.7-2.4,7.1-6.1,7.4c-3.7,0.4-7.1-2.4-7.4-6.1 c-0.1-0.9-0.7-9.1,4.9-15.4c2.6-2.9,7.5-6.3,16-6.3c8.7,0,13.5,3.5,16.1,6.4c4.8,5.5,4.6,12.4,4.5,14.5v63.5 C70.5,94.7,67.4,97.7,63.7,97.7z'%3E%3C/path%3E%3C/g%3E%3Cg%3E%3Cpath fill='%239B161A' d='M29,28.2c0.1,1.1,0.5,2.1,1.1,3L54.6,7c-1.4-0.2-3-0.4-4.7-0.4c-2.5,0-4.6,0.3-6.5,0.8L29.6,21 C28.7,24.7,28.9,27.7,29,28.2z'%3E%3C/path%3E%3Cpolygon fill='%239B161A' points='56.9,75.9 70.5,62.5 70.5,51.9 56.9,65.3 '%3E%3C/polygon%3E%3Cpath fill='%239B161A' d='M56.9,90.9c0,2.4,1.2,4.5,3.1,5.7l10.5-10.4V75.6L56.9,89.1V90.9z'%3E%3C/path%3E%3Cpolygon fill='%239B161A' points='56.9,52.2 70.5,38.7 70.5,28.1 56.9,41.5 '%3E%3C/polygon%3E%3Cpath fill='%239B161A' d='M55.8,21.9c1.4,1.6,1.2,4.3,1.2,4.3c0,0,0,0,0,0c0,0.3-0.1,0.6-0.1,0.9v1.3l11.7-11.6 c-0.6-1.3-1.5-2.6-2.6-3.9c-0.6-0.7-1.3-1.4-2.2-2.1l-9.9,9.8C54.7,21,55.3,21.3,55.8,21.9z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: contain; } .candy-cane:hover { transform: translateY(4px) rotate(17deg); } .candy-cane::before { content: ''; width: 4px; height: 80%; background-color: rgba(255,255,255,0.7); display: block; position: absolute; right: 39px; bottom: 0; border-radius: 9999px; } /*sign */ #sign { position: fixed; bottom: -0.75rem; left: 1.5rem; transform: rotate(-3deg); pointer-events: none; } /* Need to account for small screens */ @media screen and (min-height: 800px) { #sign { z-index: 999999; } } #sign > img { width: 156px; } #sign > ul { position: absolute; top: 0px; left: 20px; list-style: none; display: flex; gap: 4px; } #sign > ul li { display: flex; align-items: center; justify-content: center; color: #FFFFFF; font-size: 28px; font-weight: bold; transform: rotate(6deg); } #sign > ul li:nth-child(1) { transform: rotate(-4deg); } .sign.snow-cap::after { top: -6px; left: 2px; width: 97%; height: 17px; } /* awards */ /* gingerbread */ .fall-snowflake { color: #fff; font-size: 1em; font-family: Serif; text-shadow: 0 0 1px #000; pointer-events: none; } @-webkit-keyframes fall-snowflakes-fall { 0% { top: -20% } 100% { top: 100% } } @-webkit-keyframes fall-snowflakes-shake { 0% { -webkit-transform: translateX(0px); transform: translateX(0px) } 50% { -webkit-transform: translateX(80px); transform: translateX(80px) } 100% { -webkit-transform: translateX(0px) rotate(360deg); transform: translateX(0px) rotate(360deg); } } @keyframes fall-snowflakes-fall { 0% { top: -20% } 100% { top: 100% } } @keyframes fall-snowflakes-shake { 0% { transform: translateX(0px) } 50% { transform: translateX(80px) } 100% { transform: translateX(0px) rotate(360deg); } } .fall-snowflake { position: fixed; top: -20%; z-index: 9999; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: default; -webkit-animation-name: fall-snowflakes-fall, fall-snowflakes-shake; -webkit-animation-duration: 10s, 4s; -webkit-animation-timing-function: linear, ease-in-out; -webkit-animation-iteration-count: infinite, infinite; -webkit-animation-play-state: running, running; animation-name: fall-snowflakes-fall, fall-snowflakes-shake; animation-duration: 10s, 4s; animation-timing-function: linear, ease-in-out; animation-iteration-count: infinite, infinite; animation-play-state: running, running } .fall-snowflake:nth-of-type(0) { left: 1%; -webkit-animation-delay: 0s, 0s; animation-delay: 0s, 0s } .fall-snowflake:nth-of-type(1) { left: 10%; -webkit-animation-delay: 1s, 1s; animation-delay: 1s, 1s } .fall-snowflake:nth-of-type(2) { left: 20%; -webkit-animation-delay: 6s, .5s; animation-delay: 6s, .5s } .fall-snowflake:nth-of-type(3) { left: 30%; -webkit-animation-delay: 4s, 2s; animation-delay: 4s, 2s } .fall-snowflake:nth-of-type(4) { left: 40%; -webkit-animation-delay: 2s, 2s; animation-delay: 2s, 2s } .fall-snowflake:nth-of-type(5) { left: 50%; -webkit-animation-delay: 8s, 3s; animation-delay: 8s, 3s } .fall-snowflake:nth-of-type(6) { left: 60%; -webkit-animation-delay: 6s, 2s; animation-delay: 6s, 2s } .fall-snowflake:nth-of-type(7) { left: 70%; -webkit-animation-delay: 2.5s, 1s; animation-delay: 2.5s, 1s } .fall-snowflake:nth-of-type(8) { left: 80%; -webkit-animation-delay: 1s, 0s; animation-delay: 1s, 0s } .fall-snowflake:nth-of-type(9) { left: 90%; -webkit-animation-delay: 3s, 1.5s; animation delay: 3s, 1.5s } .fall-snowflake:nth-of-type(10) { left: 100%; -webkit-animation-delay: 3s, 2s; animation-delay: 3s, 2s } .fall-snowflake:nth-of-type(11) { left: 5%; -webkit-animation-delay: 1s, 4s; animation-delay: 1s, 4s } .fall-snowflake:nth-of-type(12) { left: 15%; -webkit-animation-delay: 1s, 1.5s; animation-delay: 1s, 1.5s } .fall-snowflake:nth-of-type(13) { left: 25%; -webkit-animation-delay: 6s, 2.5s; animation-delay: 6s, 2.5s } .fall-snowflake:nth-of-type(14) { left: 35%; -webkit-animation-delay: 4s, 1s; animation-delay: 4s, 1s } .fall-snowflake:nth-of-type(15) { left: 45%; -webkit-animation-delay: 2s, 4s; animation-delay: 2s, 4s } .fall-snowflake:nth-of-type(16) { left: 55%; -webkit-animation-delay: 8s, 3s; animation-delay: 8s, 3s } .fall-snowflake:nth-of-type(17) { left: 65%; -webkit-animation-delay: 6s, 3s; animation-delay: 6s, 3s } .fall-snowflake:nth-of-type(18) { left: 75%; -webkit-animation-delay: 2.5s, 4s; animation-delay: 2.5s, 4s } .fall-snowflake:nth-of-type(19) { left: 85%; -webkit-animation-delay: 2s, 0s; animation-delay: 2s, 0s } .fall-snowflake:nth-of-type(20) { left: 95%; -webkit-animation-delay: 3s, 1.5s; animation delay: 3s, 1.5s } .animate-spin { animation: spin 5600ms linear infinite; } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /* */