diff options
author | Felix Boerner <ich@felix-boerner.de> | 2018-05-28 10:21:37 +0300 |
---|---|---|
committer | Felix Boerner <ich@felix-boerner.de> | 2018-05-28 10:21:37 +0300 |
commit | ef38c3fb668b67332cd3c332d22886bc31937ec7 (patch) | |
tree | 02d015fe131cfe5b8b9f95cae442bbeba35666ad | |
parent | ab1bb55518e91dacc6cc19e394f620f208255dd8 (diff) |
feat: recompile scss files
-rw-r--r-- | static/assets/css/split.css | 329 |
1 files changed, 185 insertions, 144 deletions
diff --git a/static/assets/css/split.css b/static/assets/css/split.css index 49d4965..c2d9a60 100644 --- a/static/assets/css/split.css +++ b/static/assets/css/split.css @@ -26,234 +26,275 @@ time, mark, audio, video { border: 0; font-size: 100%; font: inherit; - vertical-align: baseline; } + vertical-align: baseline; +} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { - display: block; } + display: block; +} body { - line-height: 1; } + line-height: 1; +} ol, ul { - list-style: none; } + list-style: none; +} blockquote, q { - quotes: none; } + quotes: none; +} blockquote:before, blockquote:after, q:before, q:after { - content: ''; - content: none; } + content: ""; + content: none; +} table { border-collapse: collapse; - border-spacing: 0; } + border-spacing: 0; +} * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; -moz-font-feature-settings: "liga" on; - margin: 0; } + margin: 0; +} img.alignright { - float: right; } - + float: right; +} img.alignleft { - float: left; } - + float: left; +} img.aligncenter { clear: both; display: block; margin-right: auto; - margin-left: auto; } + margin-left: auto; +} body { background-color: #FFFFFF; - border-style: none; } + border-style: none; +} body, p, a, a:hover { - color: #000000; } + color: #000000; +} a, a:hover { text-decoration: none; border: none; border-style: none; - box-shadow: none; } + box-shadow: none; +} /* -- Content -- */ -@-webkit-keyframes fadein { - from { - opacity: 0; } - to { - opacity: 1; } } @keyframes fadein { from { - opacity: 0; } + opacity: 0; + } to { - opacity: 1; } } - + opacity: 1; + } +} html { - background-color: #061C30; } + background-color: #061C30; +} body.page-template-page-fullsingle-split { background-color: #061C30; - font-family: 'Montserrat', sans-serif; + font-family: "Montserrat", sans-serif; font-weight: 400; font-size: 21px; line-height: 33px; letter-spacing: -0.2px; color: #848d96; - -webkit-animation: fadein 2s; - animation: fadein 2s; } - body.page-template-page-fullsingle-split p { - color: #848d96; } + animation: fadein 2s; +} +body.page-template-page-fullsingle-split p { + color: #848d96; +} .fs-split { width: 100vw; height: 100vh; - display: -webkit-box; - display: -ms-flexbox; - display: flex; } - @media (max-width: 800px) { - .fs-split { - height: auto; - -ms-flex-wrap: wrap; - flex-wrap: wrap; } } + display: flex; +} +@media (max-width: 800px) { + .fs-split { + height: auto; + flex-wrap: wrap; + } +} +.fs-split .split-image { + width: 50%; + height: 100vh; + background-size: cover; +} +@media (max-width: 800px) { .fs-split .split-image { - width: 50%; - height: 100vh; - background-size: cover; } - @media (max-width: 800px) { - .fs-split .split-image { - height: 80vh; - width: 100%; } } + height: 80vh; + width: 100%; + } +} +.fs-split .split-content { + width: 50%; + min-height: 100vh; + display: flex; + align-items: center; + justify-content: center; + overflow: auto; +} +@media (max-width: 800px) { .fs-split .split-content { - width: 50%; - min-height: 100vh; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - overflow: auto; } - @media (max-width: 800px) { - .fs-split .split-content { - width: 100%; - height: auto; } } - .fs-split .split-content .split-content-vertically-center { - padding: 80px; - max-width: 640px; - margin-top: auto; - margin-bottom: auto; } - @media (max-width: 1200px) { - .fs-split .split-content .split-content-vertically-center { - padding: 60px; } } - @media (max-width: 800px) { - .fs-split .split-content .split-content-vertically-center { - padding: 40px; } } + width: 100%; + height: auto; + } +} +.fs-split .split-content .split-content-vertically-center { + padding: 80px; + max-width: 640px; + margin-top: auto; + margin-bottom: auto; +} +@media (max-width: 1200px) { + .fs-split .split-content .split-content-vertically-center { + padding: 60px; + } +} +@media (max-width: 800px) { + .fs-split .split-content .split-content-vertically-center { + padding: 40px; + } +} .split-intro { font-weight: 600; font-size: 64px; line-height: 80px; - letter-spacing: -2px; } - .split-intro h1 { - font-weight: 400; - text-transform: uppercase; - font-size: 16px; - line-height: 16px; - margin-bottom: 40px; - letter-spacing: 0.4px; - color: #47bec7; } - .split-intro .tagline { - color: #CCCCCC; } + letter-spacing: -2px; +} +.split-intro h1 { + font-weight: 400; + text-transform: uppercase; + font-size: 16px; + line-height: 16px; + margin-bottom: 40px; + letter-spacing: 0.4px; + color: #47bec7; +} +.split-intro .tagline { + color: #CCCCCC; +} .split-bio { padding: 40px 0 40px 0; - font-family: 'Lora', serif; } - @media (max-width: 1200px) { - .split-bio { - padding: 30px 0; } } - @media (max-width: 800px) { - .split-bio { - padding: 20px 0; } } - .split-bio p { - color: #848d96; } - .split-bio a { - color: #848d96; - transition-duration: 0.5s; - border-bottom: 1px dotted #848d96; } - .split-bio a:hover { - color: #CA486d; - transition-duration: 0.1s; - border-bottom: 1px dotted #CA486d; } + font-family: "Lora", serif; +} +@media (max-width: 1200px) { + .split-bio { + padding: 30px 0; + } +} +@media (max-width: 800px) { + .split-bio { + padding: 20px 0; + } +} +.split-bio p { + color: #848d96; +} +.split-bio a { + color: #848d96; + transition-duration: 0.5s; + border-bottom: 1px dotted #848d96; +} +.split-bio a:hover { + color: #CA486d; + transition-duration: 0.1s; + border-bottom: 1px dotted #CA486d; +} .split-lists .split-list { width: 30%; display: inline-block; margin-bottom: 40px; - vertical-align: top; } - @media (max-width: 500px) { - .split-lists .split-list { - width: 90%; } } - .split-lists .split-list h3 { - font-weight: 400; - text-transform: uppercase; - font-size: 11px; - line-height: 11px; - margin-bottom: 31px; - color: #848d96; - letter-spacing: 2px; - opacity: 0.5; } - .split-lists .split-list ul li { - font-size: 16px; - line-height: 16px; - margin-bottom: 12px; } - .split-lists .split-list ul li a { - color: #848d96; - transition-duration: 0.5s; } - .split-lists .split-list ul li a:hover { - color: #CA486d; - transition-duration: 0.1s; } + vertical-align: top; +} +@media (max-width: 500px) { + .split-lists .split-list { + width: 90%; + } +} +.split-lists .split-list h3 { + font-weight: 400; + text-transform: uppercase; + font-size: 11px; + line-height: 11px; + margin-bottom: 31px; + color: #848d96; + letter-spacing: 2px; + opacity: 0.5; +} +.split-lists .split-list ul li { + font-size: 16px; + line-height: 16px; + margin-bottom: 12px; +} +.split-lists .split-list ul li a { + color: #848d96; + transition-duration: 0.5s; +} +.split-lists .split-list ul li a:hover { + color: #CA486d; + transition-duration: 0.1s; +} .split-credit { - opacity: 0.4; } - .split-credit p { - font-size: 12px; - line-height: 14px; } - .split-credit p a { - color: #848d96; } + opacity: 0.4; +} +.split-credit p { + font-size: 12px; + line-height: 14px; +} +.split-credit p a { + color: #848d96; +} .split-video { overflow: hidden; - position: relative; } + position: relative; +} .video-wrap { position: absolute; top: 50%; left: 50%; - -webkit-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); } + transform: translate(-50%, -50%); +} .video-container { position: relative; overflow: hidden; height: 56.25vw; - width: 100vw; } - @media (max-aspect-ratio: 16 / 9) { - .video-container { - height: 100vh; - width: 177.7777777778vh; } } + width: 100vw; +} +@media (max-aspect-ratio: 16/9) { + .video-container { + height: 100vh; + width: 177.7777777778vh; + } +} .video-container iframe, .video-container object, @@ -262,12 +303,12 @@ body.page-template-page-fullsingle-split { top: 0; left: 0; width: 100%; - height: 100%; } + height: 100%; +} video.video { - -o-object-fit: cover; - object-fit: cover; - -o-object-position: 50% 50%; - object-position: 50% 50%; + object-fit: cover; + object-position: 50% 50%; width: 100%; - height: 100%; } + height: 100%; +} |