noscript { position: fixed; background-color: black; text-align: center; width: 100%; z-index: 1; bottom: 0; } noscript p { margin-left: auto; margin-right: auto; color: white; font-size: 0.7em; padding: 10px 0px; } footer { padding-top: 20px; text-align: center; width: 100%; background-color: var(--footer-background-color); } footer .footer { width: auto; box-sizing: border-box; padding: 32px 32px 32px 32px; line-height: 21px; font-size: 14px; flex-wrap: wrap; display: flex; text-align: right; margin-left: 80px; margin-right: 80px; margin-bottom: 32px } footer .logo { width: 30.33%; text-align: left; } footer .logo h4 { font-family: "Lato", sans-serif; text-align: left; font-weight: 900; line-height: 0.9em; font-size: 25px; color: rgb(36, 41, 47) } footer .logo a { font-weight: 900; color: var(--footer-logo-h2-color); } .footer .list { display: block; padding-left: 24px; line-height: 21px; margin-bottom: 8px; word-break: break-word; text-align: left; } .footer .list h4 { font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace; font-weight: 600; color: var(--display-link-title-color); margin-block-end: 16px; margin-bottom: 16px; } .footer .list ul { list-style: none; color: var(--display-link-elements-color); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; } .footer .list li { margin-bottom: 16px; line-height: 1.25; } .footer .list li a, .subfooter li a { color: var(--display-link-elements-color); transition: color 0.4s ease, text-decoration 0.4s; cursor: pointer; } .footer .list li a:hover { text-decoration: underline; color: var(--display-link-elements-hover-color); } .subfooter { background-color: var(--footer-socials-container-background-color); line-height: 21px; display: flex; justify-content: space-between; padding: 22px 80px; flex-direction: row-reverse; } .subfooter ul { display: flex; line-height: 12px; align-items: center; } .subfooter ul li { box-sizing: border-box; color: var(--footer-socials-li-color); display: list-item; font-size: 12px; margin-right: 16px; text-align: left; line-height: 18px; } :root { --text: black; --line: #0b79ed; --line-active: #0b79ed; } .pen-animation { display: inline-flex; position: relative; text-decoration: none; color: inherit; } .pen-animation svg { width: 120px; height: 50px; position: absolute; opacity: 0; left: 56%; bottom: 0; transform: translate(-50%, 15px) translateZ(0); fill: none; stroke: var(--stroke, var(--line)); stroke-linecap: round; stroke-width: 2px; stroke-dasharray: var(--offset, 69px) 278px; stroke-dashoffset: 361px; transition: stroke 0.9s ease var(--stroke-delay, 0s), stroke-dasharray 0.9s, opacity 0.5s; } .pen-animation svg:hover { opacity: 1; transition: stroke 0.25s ease var(--stroke-delay, 0s), stroke-dasharray 0.35s, opacity 0s; } .pen-animation:hover { --stroke: var(--line-active); --stroke-delay: 0.1s; --offset: 180px; } .twitter-follow-button { margin-top: 5px; } .subfooter .icon svg { width: 20px; cursor: pointer; transition-duration: 0.6s; transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1); fill: #949da5; } .subfooter .icon svg:hover { fill: #005FD6; } @media only screen and (min-width: 1012px) { footer .footer .list { width: 16.66%; } } @media only screen and (max-width: 1012px) { footer .footer { margin: 0; margin: 0; padding: 32px 40px; } footer .footer .list { width: 24.66%; } footer .footer .list .col-1 { padding-right: 16px; padding-left: 0; } footer .footer .logo { width: 100%; margin-bottom: 32px; padding-left: 24px; } footer .subfooter { display: block; } } @media only screen and (max-width: 616px) { footer .footer .list { width: 49.66%; } .col-3 { padding-right: 16px; padding-left: 0; } } @media only screen and (max-width: 811px) { footer .subfooter { display: block; padding: 24px 60px; } footer .subfooter ul { margin-top: 15px; } footer .subfooter .text { display: block; } footer .subfooter li { margin-bottom: 10px; } } @media only screen and (max-width: 425px) { footer .footer { padding: 32px 0px; } footer .subfooter { padding: 24px 24px; } }