html { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif; text-size-adjust: none; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; } * { box-sizing: border-box; } body { background: linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%, rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%, rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%, rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%), linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%, rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%, rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%, rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%, rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%), linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%), linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%, rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%, rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%, rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%, rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%), linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%, rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%, rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%, rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%), linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%, rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%, rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%, rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%), linear-gradient(90deg, #3b3b3b, #3b3b3b); margin: 0 !important; } a:link { color: inherit; text-decoration: none; } a:visited { color: inherit; text-decoration: none; } .rightButton { color: inherit; text-decoration: none; display: inline-block; padding: 4px 2px 4px 2px; background-image: linear-gradient(180deg, rgba(94, 5, 4, 0.8), #fd133d); background-repeat: no-repeat; background-size: 100% 0.1em; background-position: 0% 80%; transform: skewX(-4deg); cursor: pointer; transition: background-size 0.25s ease-in; } .rightButton:hover { color: #fcfcfa; background-size: 100% 100%; background-position: 0% 80%; } .right_un { color: inherit; text-decoration: none; display: inline-block; padding: 0 0 2px 0; background-image: linear-gradient(180deg, rgba(94, 5, 4, 0.3), #fd133d); background-repeat: no-repeat; background-size: 100% 0.1em; background-position: 0% 80%; transform: skewX(-4deg); cursor: pointer; transition: background-size 0.25s ease-in; } .right_un:hover { background-size: 100% 20%; background-position: 0% 80%; } .header_aligner { padding: 0 3rem 0 5rem; } @media (max-width: 1400px) { .header_aligner { padding: 0 1rem 0 3rem; } } @media (max-width: 1350px) { .header_aligner { padding: 0 1rem 0 1rem; } } .header { background: linear-gradient(90deg, rgba(65, 65, 65, 0.85), rgba(62, 62, 62, 0.85)); margin-top: 0; padding-top: 0px; width: 100%; position: fixed; z-index: 3; } .header ul { margin: 0; padding: 0; list-style: none; overflow: hidden; font-weight: bold; } .header li a { padding: 1em 2em 1em 0; color: #fcfcfa; display: block; text-decoration: none; } .header .logo { margin-top: 1em; margin-bottom: 1em; align-content: center; display: block; float: left; font-size: 20px; text-decoration: none; padding: 0; color: #fcfcfa; } /* Menu */ .header .menu { clear: both; max-height: 0; transition: max-height 0.2s ease-out; } .header .menu-icon { cursor: pointer; display: inline-block; float: right; padding: 2em 0 0 0; position: relative; user-select: none; } .header .menu-icon .navicon { background: #fcfcfa; display: block; height: 2px; position: relative; float: right; transition: background 0.2s ease-out; width: 18px; } .header .menu-icon .navicon:before, .header .menu-icon .navicon:after { background: #fcfcfa; content: ""; display: block; height: 100%; position: absolute; transition: all 0.2s ease-out; width: 100%; } .header .menu-icon .navicon:before { top: 5px; } .header .menu-icon .navicon:after { top: -5px; } .header .menu-btn { display: none; } .header .menu-btn:checked ~ .menu { max-height: 260px; } .header .menu-btn:checked ~ .menu-icon .navicon { background: transparent; } .header .menu-btn:checked ~ .menu-icon .navicon:before { transform: rotate(-45deg); } .header .menu-btn:checked ~ .menu-icon .navicon:after { transform: rotate(45deg); } .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { top: 0; } /* Wide Screen */ @media (min-width: 48em) { .header li { float: left; } .header .menu { clear: none; float: right; max-height: none; } .header .menu-icon { display: none; } } .main-wrapper { padding: 4rem 1rem 2rem 1rem; } .blog-card { display: flex; flex-direction: column; margin: auto; box-shadow: 0 3px 7px -1px rgba(0, 0, 0, 0.1); margin-bottom: 1.6%; background: #fcfcfa; line-height: 1.4; overflow: hidden; z-index: 0; } .blog-card a { color: inherit; } .blog-card a:hover { color: inherit; } .blog-card:hover .photo { transform: scale(1.3); } .blog-card .meta { position: relative; z-index: 0; height: 200px; } .blog-card .photo { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center; transition: transform 0.2s; } .blog-card .details, .blog-card .details ul { margin: auto; padding: 0; list-style: none; } .blog-card .details { position: absolute; top: 0; bottom: 0; left: -100%; margin: auto; transition: left 0.2s; background: rgba(0, 0, 0, 0.6); color: #fcfcfa; padding: 10px; width: 100%; font-size: 0.9rem; } .blog-card .details a { text-decoration: dotted underline; } .blog-card .details ul li { display: inline-block; } .blog-card .details .tags li { margin-right: 2px; } .blog-card .details .tags li:first-child { margin-left: -4px; } .blog-card .description { padding: 1rem; background: #fcfcfa; position: relative; z-index: 1; } .blog-card .description h1 { line-height: 1; margin: 0; font-size: 1.7rem; } .blog-card .description h2 { font-size: 1rem; font-weight: 300; text-transform: uppercase; color: #a2a2a2; margin-top: 5px; } .blog-card .description .read-more { text-align: right; } .blog-card .description .read-more a { display: inline-block; position: relative; } .blog-card p { position: relative; margin: 1rem 0 0; } .blog-card p:first-of-type { margin-top: 1.25rem; } .blog-card p:first-of-type:before { content: ""; position: absolute; height: 2px; background: linear-gradient(180deg, rgba(94, 5, 4, 0.8), #fd133d); width: 60px; top: -0.75rem; border-radius: 3px; } .blog-card:hover .details { left: 0%; } @media (min-width: 640px) { .blog-card { flex-direction: row; max-width: 80em; } .blog-card .meta { flex-basis: 51%; height: auto; } .blog-card .description { flex-basis: 49%; } .blog-card .description:before { transform: skewX(3deg); content: ""; background: #fcfcfa; width: 30px; position: absolute; left: -10px; top: 0; bottom: 0; z-index: -1; } .blog-card.alt { flex-direction: row-reverse; } .blog-card.alt .description:before { left: inherit; right: -10px; transform: skew(-3deg); } .blog-card.alt .details { padding-left: 25px; } } .splash-container { background: linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%, rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%, rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%, rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%), linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%, rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%, rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%, rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%, rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%), linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%), linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%, rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%, rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%, rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%, rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%), linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%, rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%, rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%, rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%), linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%, rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%, rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%, rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%), linear-gradient(90deg, #3b3b3b, #3b3b3b); z-index: -1; overflow: hidden; /* The following styles are required for the "scroll-over" effect */ width: 100%; height: 35%; top: 0; left: 0; position: fixed !important; } .splash { /* absolute center .splash within .splash-container */ width: 90%; height: 80%; position: absolute; margin: auto; top: 0; left: 0; bottom: 0; right: 0; text-align: center; line-height: 1.4; display: flex; align-items: center; justify-content: center; } /* This is the main heading that appears on the blue section */ .splash-head { color: #fcfcfa; background: linear-gradient(90deg, rgba(65, 65, 65, 0.85), rgba(62, 62, 62, 0.85)); line-height: 1.5em; } .splash-head h1 { line-height: 1.2; margin: 0; font-size: 1.7rem; } .splash-head h2 { font-size: 1rem; font-weight: 300; text-transform: uppercase; color: #a2a2a2; margin-top: 5px; } /* This is the subheading that appears on the blue section */ .splash-subhead { font-weight: normal; background: linear-gradient(90deg, rgba(65, 65, 65, 0.85), rgba(62, 62, 62, 0.85)); text-align: left; color: #fcfcfa; letter-spacing: 0.05em; padding: 10px; position: relative; margin: 1rem 0 0; } .content-wrapper { /* These styles are required for the "scroll-over" effect */ position: absolute; top: 35%; width: 100%; min-height: 12%; z-index: 2; background: #fcfcfa; } @media (max-width: 1200px) { .splash-container { background: linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%, rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%, rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%, rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%), linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%, rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%, rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%, rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%, rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%), linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%), linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%, rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%, rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%, rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%, rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%), linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%, rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%, rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%, rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%), linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%, rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%, rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%, rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%), linear-gradient(90deg, #3b3b3b, #3b3b3b); z-index: -1; overflow: hidden; /* The following styles are required for the "scroll-over" effect */ width: 100%; height: 50%; top: 0; left: 0; position: fixed !important; } .content-wrapper { /* These styles are required for the "scroll-over" effect */ position: absolute; top: 50%; width: 100%; min-height: 12%; z-index: 2; background: #fcfcfa; } } @media (max-width: 500px) { .splash-container { background: linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%, rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%, rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%, rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%), linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%, rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%, rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%, rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%, rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%), linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%), linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%, rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%, rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%, rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%, rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%), linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%, rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%, rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%, rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%), linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%, rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%, rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%, rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%), linear-gradient(90deg, #3b3b3b, #3b3b3b); z-index: -1; overflow: hidden; /* The following styles are required for the "scroll-over" effect */ width: 100%; height: 120%; top: 0; left: 0; position: fixed !important; } .content-wrapper { /* These styles are required for the "scroll-over" effect */ position: absolute; top: 120%; width: 100%; min-height: 12%; z-index: 2; background: #fcfcfa; } } .dataviz-content { position: relative; margin: auto; } .splash-bottom { position: absolute; background: linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%, rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%, rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%, rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%), linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%, rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%, rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%, rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%, rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%), linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%), linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%, rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%, rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%, rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%, rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%), linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%, rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%, rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%, rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%), linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%, rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%, rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%, rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%), linear-gradient(90deg, #3b3b3b, #3b3b3b); display: flex; align-items: center; justify-content: center; } .splash-bottom-content { margin: auto; color: #fcfcfa; background: linear-gradient(90deg, rgba(65, 65, 65, 0.85), rgba(62, 62, 62, 0.85)); } .plainpage { padding: 0 3rem 0 5rem; color: #fcfcfa; background: linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%, rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%, rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%, rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%), linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%, rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%, rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%, rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%, rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%), linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%), linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%, rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%, rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%, rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%, rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%), linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%, rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%, rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%, rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%), linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%, rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%, rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%, rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%), linear-gradient(90deg, #3b3b3b, #3b3b3b); z-index: -1; overflow: hidden; } .plainpage h1 { text-align: center; line-height: 1.2; margin: 0; font-size: 1.7rem; } .plainpage h2 { text-align: center; font-size: 1rem; font-weight: 300; text-transform: uppercase; color: #a2a2a2; margin-top: 5px; } @media (max-width: 1400px) { .plainpage { padding: 0 1rem 0 3rem; } } @media (max-width: 1350px) { .plainpage { padding: 0 1rem 0 1rem; } } .container { margin: 150px auto; color: black; background-color: #fcfcfa; padding: 0 20px 20px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.075); -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.075); -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.075); text-align: left; } .container h1 { text-align: center; line-height: 1.2; margin: 0; font-size: 1.7rem; } .container h2 { text-align: center; font-size: 1rem; font-weight: 300; text-transform: uppercase; color: #a2a2a2; margin-top: 5px; } .container-plain { margin: 150px auto; text-align: left; } .container-plain h1 { text-align: center; line-height: 1.2; margin: 0; font-size: 1.7rem; } .container-plain h2 { text-align: center; font-size: 1rem; font-weight: 300; text-transform: uppercase; color: #a2a2a2; margin-top: 5px; } .plain_article { color: black; padding: 1rem 1rem 1rem 1rem; background-color: #fcfcfa; } .imgplace { align-self: auto; width: 84vw; } .container:hover .avatar-flip { transform: rotateY(180deg); -webkit-transform: rotateY(180deg); } .container:hover .avatar-flip img:first-child { opacity: 0; } .container:hover .avatar-flip img:last-child { opacity: 1; } .avatar-flip { border-radius: 100px; overflow: hidden; height: 150px; width: 150px; position: relative; margin: auto; top: -60px; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; box-shadow: 0 0 0 13px #f0f0f0; -webkit-box-shadow: 0 0 0 13px #f0f0f0; -moz-box-shadow: 0 0 0 13px #f0f0f0; } .avatar-flip img { position: absolute; left: 0; top: 0; border-radius: 100px; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; } .avatar-flip img:first-child { z-index: 1; } .avatar-flip img:last-child { z-index: 0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); opacity: 0; } @media (max-width: 400px) { .container { width: 95vw; } } footer { text-align: center; color: #e2e2e2; } /*# sourceMappingURL=main.css.map */