/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Render the `main` element consistently in IE. */ main { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type=button], [type=reset], [type=submit] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type=checkbox], [type=radio] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type=search] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type=search]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } @font-face { font-family: RobotoSlab-Regular; src: url("/fonts/RobotoSlab-Regular.ttf") format("opentype"); } @font-face { font-family: RobotoSlab-Medium; src: url("/fonts/RobotoSlab-Regular.ttf") format("opentype"); } @font-face { font-family: RobotoSlab-Bold; src: url("/fonts/RobotoSlab-Bold.ttf") format("opentype"); } @font-face { font-family: RobotoSlab-Black; src: url("/fonts/RobotoSlab-Black.ttf") format("opentype"); } @font-face { font-family: AtomicAge-Regular; src: url("/fonts/AtomicAge-Regular.ttf") format("opentype"); } @font-face { font-family: Montserrat-Regular; src: url("/fonts/Montserrat-Regular.ttf") format("opentype"); } @font-face { font-family: Montserrat-Light; src: url("/fonts/Montserrat-Light.ttf") format("opentype"); } @font-face { font-family: Montserrat-Italic; src: url("/fonts/Montserrat-Italic.ttf") format("opentype"); } @font-face { font-family: Montserrat-Bold; src: url("/fonts/Montserrat-Bold.ttf") format("opentype"); } @font-face { font-family: Montserrat-SemiBold; src: url("/fonts/Montserrat-SemiBold.ttf") format("opentype"); } @font-face { font-family: Orbitron-Regular; src: url("/fonts/Orbitron-Regular.ttf") format(); } h1, h2, h3, h4, h5, h6 { font-family: AtomicAge-Regular; letter-spacing: 2px; } h1 { font-size: 2rem; } @media screen and (min-width: 600px) { h1 { font-size: 3rem; } } h2 { font-size: 1.75rem; } @media screen and (min-width: 600px) { h2 { font-size: 2.5rem; } } h3 { font-size: 1.5rem; } @media screen and (min-width: 600px) { h3 { font-size: 2rem; } } h4 { font-size: 1.25rem; } @media screen and (min-width: 600px) { h4 { font-size: 1.5rem; } } h5 { font-size: 1rem; } @media screen and (min-width: 600px) { h5 { font-size: 1.25rem; } } h6 { font-size: 1rem; } @media screen and (min-width: 600px) { h6 { font-size: 1em; } } p, a, li, span { font-family: RobotoSlab-Regular; letter-spacing: 1px; } strong { font-family: Montserrat-Bold; } em { font-family: Montserrat-Italic; } u { font-family: Montserrat-SemiBold; } cite, q, small { font-family: Orbitron-Regular; } s { font-family: Montserrat-SemiBold; } h1, h2, h3, h4, h5, h6, p, a, span, time { color: #FBFCFF; } .secondary.layout--v1 { display: block; position: relative; padding: 0.5rem 0.5rem; background-color: #d7b94c; } .secondary.layout--v1 #root { display: flex; flex-direction: column; } @media (min-width: 800px) { .secondary.layout--v1 #root { display: grid; grid-template-columns: 25% 75%; grid-template-rows: 1fr; margin: 0 auto; padding: 1rem 1rem; } } .secondary.layout--v1 #root { gap: 1rem; position: relative; width: 100%; height: 100%; min-height: 100vh; max-width: 1200px; background-color: #1F2421; box-shadow: 0 0 5px 10px rgba(29, 31, 32, 0.45); } .secondary.layout--v1 #root main { padding: 1rem 1rem; } .secondary.layout--v1.menu-open, .secondary.layout--v1.photo-open { overflow: hidden; } .secondary.layout--v1.photo-open .overlay { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #171A21; opacity: 0.9; } header { display: block; position: sticky; overflow: auto; width: 100%; height: 50px; top: 0; padding-bottom: 1rem; background-color: #1F2421; } @media (min-width: 600px) { header { height: 500px; } } header.open { overflow: visible; } header.open .top h1 { display: none; } header nav.main { display: block; position: relative; } @media (min-width: 600px) { header nav.main { display: flex; flex-direction: column; gap: 2rem; } } header nav.main .top { display: flex; } header nav.main .top h1 { margin: 0; } header nav.main .top h1 a { display: block; position: relative; top: 1rem; left: 1rem; font-size: 1.5rem; text-decoration: none; color: #1d1f20; background-color: #d7b94c; border: 2px solid #d7b94c; padding: 2px 2px; } header nav.main .top h1 a:hover { color: #d7b94c; background-color: unset; } header nav.main .top .icon.icon-menu { display: block; position: absolute; top: 1rem; right: 1rem; width: 35px; height: 35px; z-index: 999; transition: right 100ms ease; } @media screen and (min-width: 600px) { header nav.main .top .icon.icon-menu { display: none; } } header nav.main .top .icon.icon-menu:before { content: ""; display: block; background-image: url("/icons/menu-grid.svg"); background-size: 100%; position: absolute; width: 35px; height: 35px; } header nav.main .top .icon.icon-menu:hover { cursor: pointer; } header nav.main .top .icon.icon-menu.open { right: 325px; } header nav.main .top .icon.icon-menu.open:before { background-image: url("/icons/menu-close.svg"); } header nav.main menu { position: absolute; right: 0; top: 0; width: 0; background-color: #d7b94c; overflow: hidden; padding: 0; margin: 0; transition: width 100ms ease; } @media (min-width: 600px) { header nav.main menu { position: relative; top: unset; right: unset; width: 100%; transition: unset; background-color: unset; } } header nav.main menu.open { width: 300px; box-shadow: 0 0 5px 10px rgba(29, 31, 32, 0.45); } header nav.main menu li { padding: 1rem 2rem; } header nav.main menu li a { display: block; color: #FBFCFF; text-decoration: none; } header nav.main menu li a:hover { text-decoration: underline; } .posts .list ul { list-style: none; padding: 0; } .posts .list ul li { padding: 1rem 0; } .posts .list ul li a { color: #FBFCFF; text-decoration: none; display: block; } .posts .list ul li a .post-title { margin: 0; } .photos { display: block; } .photos .albums { display: flex; flex-direction: column; width: 100%; } @media (min-width: 800px) { .photos .albums { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; } } .photos .albums { gap: 1rem; list-style: none; padding: 0; } .photos .albums .album { display: block; width: 100%; } .photos .albums .album a { display: block; position: relative; color: white; text-decoration: none; overflow: hidden; } .photos .albums .album a img { display: block; width: 100%; height: auto; } .photos .albums .album a .title, .photos .albums .album a .date, .photos .albums .album a .overlay { position: absolute; visibility: visible; margin: 0; } .photos .albums .album a .title, .photos .albums .album a .date, .photos .albums .album a .category { z-index: 2; } .photos .albums .album a .title { top: 1rem; left: 1rem; } .photos .albums .album a .date { bottom: 1rem; left: 1rem; font-weight: bold; } .photos .albums .album a .overlay { width: 100%; height: auto; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.333); z-index: 1; } .photos .albums .album a:hover .title, .photos .albums .album a:hover .date, .photos .albums .album a:hover .category, .photos .albums .album a:hover .overlay { visibility: hidden; } .photos .albums .album a:hover img { transform: scale(1.01); transition: transform 100ms ease-in-out; } .photos img { width: 100%; } #album .title { margin: 0; } #album .meta { border-bottom: 5px solid #a6a695; } #album .photos { display: flex; flex-direction: column; width: 100%; } @media (min-width: 800px) { #album .photos { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; } } #album .photos { gap: 1rem; list-style: none; padding: 0; } #album .photos .photo { width: 100%; overflow: hidden; } #album .photos .photo img { transition: transform 100ms ease-in-out; } #album .photos .photo:hover { cursor: pointer; } #album .photos .photo:hover img { transform: scale(1.01); transition: transform 100ms ease-in-out; } #open-image { display: none; position: absolute; top: 50%; left: 0; transform: translateY(-50%); z-index: 999; } #open-image .close { cursor: pointer; font-size: 2rem; position: absolute; right: 0; top: 0; } #open-image img { width: 100%; height: auto; } #open-image #details { display: block; height: auto; padding: 1rem 1rem; background-color: #a6a695; } #open-image #details p { margin: 0; } #open-image #details #caption { font-size: 1.5rem; padding-bottom: 1rem; } #open-image #details #location, #open-image #details #date, #open-image #details #equipment { font-size: 1.25rem; } #open-image.open { display: block; } .posts { display: block; } .posts h2, .posts h3 { position: relative; margin: 0; width: fit-content; } .posts h2:after, .posts h3:after { content: ""; display: block; width: 75px; height: 5px; background-color: #a6a695; } .posts .list { padding-top: 1rem; border-top: 5px solid #d7b94c; } .posts .list .post a .title { padding: 0.5rem 0; } .posts .list .post a:hover { text-decoration: underline; text-decoration-color: #a6a695; } .post { display: block; } .post .title { margin: 0.5rem 0; } .post .meta { padding-bottom: 1rem; border-bottom: 5px solid #a6a695; } .post .meta .admin-actions { padding-bottom: 1rem; } .post .meta .published { font-size: 1.125rem; } .post .meta .category { font-size: 1.125rem; } .post .text p { font-size: 1.25rem; line-height: 1.5; } /*# sourceMappingURL=main.css.map */