@charset "UTF-8";
:root {
  --light: #f5f7fa;
  --dark: #123354;
  --gray: #e9ecf1;
  --bubble: #fff;
  --accent: var(--gray);
  --bg: var(--light);
  --text: var(--dark);
  --font: Inter, Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif, "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --font-display: "Space Grotesk",Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  --theme: #15a6f0;
  --ease: cubic-bezier(.19,1,.22,1);
}

* {
  box-sizing: border-box;
  -webkit-appearance: none;
  margin: 0;
  padding: 0;
}

body, html {
  scroll-behavior: smooth;
  font-kerning: normal;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  background-color: var(--bg);
  color: var(--text);
  font-size: 18px;
  letter-spacing: -0.02em;
  line-height: 1.5;
  margin: 0 auto;
  position: relative;
  font-kerning: normal;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  text-decoration: none;
  color: inherit;
  transition: all 200ms ease;
}

blockquote {
  opacity: 0.8;
  padding: 0.5em 0.5em;
  position: relative;
  quotes: "“" "”" "‘" "’";
  margin-top: 1rem;
  margin-bottom: 2rem;
  background-color: var(--bubble);
  position: relative;
  border-radius: 16px;
  box-shadow: 0 8px 24px 0 rgba(18, 51, 84, 0.125);
}

blockquote p {
  padding: 0 1rem !important;
  letter-spacing: -0.022em;
  width: 100%;
  font-weight: 500;
  margin: 1em 0;
}

@media screen and (max-width: 768px) {
  blockquote {
    padding: 0.5rem;
  }
}

code {
  max-width: 100%;
  overflow-x: auto;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-display);
  font-feature-settings: 'liga' 1, 'ss04' 1, 'case' 1;
}

h1, .h1 {
  font-size: 80px;
  letter-spacing: -0.036em;
  font-weight: 700;
  line-height: 1.1;
  margin: 0 0 0.5em 0;
}

h2, .h2 {
  font-size: 60px;
  letter-spacing: -0.034em;
  font-weight: 700;
  line-height: 1.1;
  margin: 0 0 0.5em 0;
}

h3, .h3 {
  font-size: 40px;
  letter-spacing: -0.028em;
  font-weight: 700;
  line-height: 1.1;
  margin: 0 0 0.5em 0;
}

h4, .h4 {
  font-size: 30px;
  letter-spacing: -0.028em;
  font-weight: 700;
  margin: 0 0 0.5em 0;
}

h5, .h5 {
  font-size: 24px;
  letter-spacing: 0.026em;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 0.5em 0;
}

h6, .h6 {
  font-size: 20px;
  letter-spacing: 0.08em;
  font-weight: 700;
  text-transform: uppercase;
  opacity: 0.5;
  margin: 0 0 0.5em 0;
}

@media screen and (max-width: 768px) {
  h1, .h1 {
    font-size: 60px;
    letter-spacing: -0.034em;
  }
  h2, .h2 {
    font-size: 40px;
    letter-spacing: -0.028em;
  }
  h3, .h3 {
    font-size: 30px;
    letter-spacing: -0.028em;
  }
  h4, .h4 {
    font-size: 24px;
    letter-spacing: -0.026em;
  }
  h5, .h5 {
    font-size: 20px;
    letter-spacing: 0.026em;
  }
  h6, .h6 {
    font-size: 18px;
    letter-spacing: 0.08em;
  }
}

video,
img {
  max-width: 100%;
  vertical-align: middle;
  height: auto;
  margin: 16px auto;
  padding: 0;
}

main {
  flex: 1;
}

ul {
  list-style: none;
  -webkit-padding-start: 0;
  -moz-padding-start: 0;
}

b, strong {
  font-weight: 700;
}

hr {
  border: none;
  display: block;
  background-color: rgba(18, 51, 84, 0.15);
  width: 50%;
  height: 1px;
  margin: 3em auto;
}

hr.full {
  width: 100% !important;
}

.shadow {
  box-shadow: 0 8px 24px 0 rgba(18, 51, 84, 0.125);
}

@media screen and (max-width: 768px) {
  .shadow {
    box-shadow: 0 4px 12px 0 rgba(18, 51, 84, 0.125);
  }
}

.rounded {
  border-radius: 16px;
}

table {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  margin: 1rem auto;
  background: transparent;
  border-style: hidden;
}

table:not(.ln-table) tr {
  background-color: var(--accent);
}

th {
  text-align: left;
  color: var(--light);
}

thead tr {
  background: var(--theme) !important;
}

td, th {
  padding: 0.5rem 1rem;
  border: 1px solid var(--bg);
}

aside h3 {
  position: relative;
  margin: 0 !important;
}

.blog_home.container {
  box-sizing: initial;
}

.container {
  max-width: 1280px;
  margin: 0 auto;
  overflow: hidden;
}

@media screen and (max-width: 1360px) {
  .container {
    max-width: 960px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 1024px) {
  .container {
    max-width: 702px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 768px) {
  .container {
    width: -webkit-calc(100% - 64px);
    width: -moz-calc(100% - 64px);
    width: -ms-calc(100% - 64px);
    width: -o-calc(100% - 64px);
    width: calc(100% - 64px);
    margin: 0 auto;
  }
  .blog_home.container {
    box-sizing: border-box;
    width: 100%;
    margin: 0 auto;
  }
}

@media screen and (max-width: 480px) {
  .container {
    width: -webkit-calc(100% - 32px);
    width: -moz-calc(100% - 32px);
    width: -ms-calc(100% - 32px);
    width: -o-calc(100% - 32px);
    width: calc(100% - 32px);
    margin: 0 auto;
  }
  .blog_home.container {
    width: 100%;
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
  }
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  display: block;
  float: left;
}

.col-1 {
  width: 8.33%;
}

.col-2 {
  width: 16.66%;
}

.col-3 {
  width: 25%;
}

.col-4 {
  width: 33.33%;
}

.col-5 {
  width: 41.66%;
}

.col-6 {
  width: 50%;
}

.col-7 {
  width: 58.33%;
}

.col-8 {
  width: 66.66%;
}

.col-9 {
  width: 75%;
}

.col-10 {
  width: 83.33%;
}

.col-11 {
  width: 91.66%;
}

.col-12 {
  width: 100%;
}

@media screen and (max-width: 1024px) {
  .col-3 {
    width: 50%;
  }
  .col-4 {
    width: 100%;
  }
  .col-7 {
    width: 100%;
  }
  .col-9 {
    width: 100%;
  }
  .col-10 {
    width: 100%;
  }
  .col-11 {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .col-3 {
    width: 100%;
  }
  .col-5 {
    width: 100%;
  }
  .col-6 {
    width: 100%;
  }
  .col-7 {
    width: 100%;
  }
  .col-8 {
    width: 100%;
  }
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.dark {
  color: #bde6fb;
  background-color: #1e2529;
}

.grey {
  color: var(--dark);
  background-color: var(--gray);
}

.white {
  color: var(--dark);
  background-color: #fff;
}

.font-400 {
  font-weight: 400;
}

.font-500 {
  font-weight: 500;
}

.font-600 {
  font-weight: 600;
}

.font-700 {
  font-weight: 700;
}

.no-decoration {
  text-decoration: none;
}

.row {
  overflow: hidden;
}

footer a {
  text-decoration: underline;
}

footer p {
  font-size: 20px;
  letter-spacing: -0.022em;
}

footer a.button {
  font-size: 20px;
  display: inline-block;
  margin: 0;
}

footer img {
  margin: 0;
}

.article {
  box-shadow: none;
  overflow: hidden;
  border-radius: 16px;
  background-color: var(--bubble);
  transition: box-shadow 250ms ease;
}

@media screen and (max-width: 480px) {
  .article {
    border-radius: 0;
  }
}

.article_date {
  font-size: 14px;
  font-weight: 700;
  font-family: var(--font-display);
  font-feature-settings: 'liga' 1, 'ss04' 1, 'case' 1;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.article_title {
  margin: 0.5rem 0 1rem 0;
  line-height: 1.1;
}

.article_excerpt {
  font-size: 16px;
  letter-spacing: -0.02em;
  transition: height 250ms ease, opacity 250ms ease;
}

.article_excerpt:not(.visible) {
  height: 0;
  opacity: 0;
}

.article_excerpt, .article_meta {
  transform-origin: bottom;
}

.article_meta {
  padding: 16px 24px;
  background-color: var(--bubble);
  color: var(--text);
  position: relative;
  z-index: 2;
  transition: margin-top 250ms ease;
}

.article_meta.center_y {
  padding: 0 24px 38px 24px;
  transform-origin: center;
  transition: transform 250ms ease;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media screen and (min-width: 42rem) {
  .article_meta.center_y {
    left: -3rem;
    padding: 0 0 0 38px;
  }
}

.article_thumb {
  display: grid;
  position: relative;
  z-index: 0;
  overflow: hidden;
  height: 20rem;
  background-size: cover;
  background-position: 50% 50%;
}

@media screen and (min-width: 42rem) {
  .article_thumb {
    height: 30rem;
  }
}

.article_thumb img {
  transition: transform 250ms ease, opacity 250ms ease;
}

.article_thumb::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  z-index: 1;
  background: #123354;
  opacity: 0;
  transition: opacity 250ms ease;
}

.article_showcase .article_thumb {
  height: 20rem;
}

.article_showcase .article_meta {
  padding-top: 28px;
}

.article:hover .article_thumb img {
  transform: scale(1.1);
}

.article:hover .article_thumb::after {
  transition: opacity 250ms ease;
  opacity: 0.125;
}

.article:hover .article_excerpt:not(.visible) {
  height: 64px;
  opacity: 1;
}

.article:hover .article_meta:not(.center_y) {
  margin-top: -64px;
}

@media screen and (min-width: 769px) {
  .article:hover .article_meta.center_y {
    transform: translateX(-3rem);
  }
}

.article:hover {
  box-shadow: 0 12px 36px rgba(18, 51, 84, 0.125);
}

.article:hover a {
  color: initial !important;
}

.article:hover:active {
  box-shadow: none;
  background-color: var(--gray);
}

.article:hover:active .article_meta {
  background-color: var(--gray);
}

.article_hidden {
  display: none;
}

.btn {
  min-width: 150px;
  font-size: 1rem;
  margin: 1rem 0 1.5rem;
  display: inline-block;
  padding: 7.5px 12.5px;
  background-color: var(--theme);
  background-image: linear-gradient(65deg, #029be9, #22c5fd);
  color: #fff;
  text-align: center;
  cursor: pointer;
  border-radius: 10px;
}

.transparent {
  padding: 25px;
}

.point {
  margin-right: 15px;
  color: var(--theme);
}

@media screen and (min-width: 769px) {
  .mobile {
    display: none;
  }
}

.video {
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
  margin: 1.5rem 0;
  border-radius: 10px;
  background-color: var(--bg);
  box-shadow: 0 1rem 4rem rgba(18, 51, 84, 0.125);
}

.video iframe {
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  position: absolute;
  transform: scale(1.03);
}

.learn-more {
  color: var(--theme);
  font-weight: 700;
  text-decoration: none;
  display: inline-block;
  margin-right: 32px;
}

.learn-more:hover {
  text-decoration: underline;
}

.learn-more.red {
  color: #fa4444;
  background-color: transparent;
}

.learn-more.flat {
  color: inherit;
  font-weight: 400;
}

.black .learn-more {
  color: #fff;
}

.learn-more::after {
  color: inherit;
  content: "\203a";
  font-style: normal;
  font-weight: inherit;
  padding-left: 8px;
  position: absolute;
  transition: padding 250ms ease;
}

.learn-more:hover::after, .learn-more:active::after, .learn-more:hover:active::after {
  padding-left: 16px;
}

a.button {
  border-radius: 10px;
  background-color: rgba(18, 51, 84, 0.075);
  border: none;
  color: var(--text);
  text-decoration: none;
  font-weight: 400;
  margin: 0 8px;
  line-height: 1.2em;
  padding: 12px 18px;
}

a.button:first-child {
  margin-left: 0;
}

a.button:last-child {
  margin-right: 0;
}

a.button:hover {
  background-color: rgba(18, 51, 84, 0.15);
  text-decoration: none;
}

a.button:active, a.button:hover:active {
  background-color: rgba(18, 51, 84, 0.2);
  text-decoration: none;
}

a.button.suggested {
  background-color: var(--theme);
  background-image: linear-gradient(65deg, #029be9, #22c5fd);
  color: #fff;
  font-weight: 700;
}

a.button.suggested:hover {
  background-color: #22c5fd;
  background-image: linear-gradient(65deg, #22c5fd, #22c5fd);
  color: #fff;
}

a.button.suggested:active, a.button.suggested:hover:active {
  background-color: #0d87c5;
  background-image: linear-gradient(65deg, #0d87c5, #0d87c5);
  color: #fff;
}

.dark a.button {
  background-color: rgba(189, 230, 251, 0.15);
  color: #bde6fb;
}

.dark a.button:hover {
  background-color: rgba(189, 230, 251, 0.2);
}

.dark a.button:active, .dark a.button:hover:active {
  background-color: rgba(189, 230, 251, 0.2);
}

.dark a.button.suggested {
  background-color: #bde6fb;
  background-image: linear-gradient(65deg, #bde6fb, #bde6fb);
  color: #1e2529;
}

.dark a.button.suggested:hover {
  background-color: #d2f3ff;
  background-image: linear-gradient(65deg, #d2f3ff, #d2f3ff);
  color: #1e2529;
}

.dark a.button.suggested:active, .dark a.button.suggested:hover:active {
  background-color: #8dd4f8;
  background-image: linear-gradient(65deg, #8dd4f8, #8dd4f8);
  color: #1e2529;
}

footer {
  padding: 64px 0;
  line-height: 2;
  font-size: 16px;
  letter-spacing: -0.02em;
  color: #48617c !important;
}

footer p {
  margin: 0;
}

footer .logo .icon {
  display: block;
  width: 55px;
  height: 48px;
  background-image: url("https://assets.zorincdn.com/zorin.com/images/footer/logo.svg");
  background-size: 55px 48px;
  background-repeat: no-repeat;
  background-position: center center;
  background-origin: content-box;
  font-size: 0;
  opacity: 0.45;
}

footer .logo .icon:hover {
  opacity: 1;
}

footer .logo .icon:active,
footer .logo .icon:active:hover {
  opacity: 0.45;
}

footer .logo-newsletter {
  padding-bottom: 64px;
}

footer .newsletter .copy {
  line-height: 1.5;
  padding-right: 16px;
}

footer .sitemap .footer-heading {
  font-family: var(--font-display);
  font-feature-settings: 'liga' 1, 'ss04' 1, 'case' 1;
  font-size: 20px;
  letter-spacing: 0.08em;
  font-weight: 700;
  text-transform: uppercase;
  opacity: 0.5;
  margin: 0 0 0.5em 0;
}

@media screen and (max-width: 1024px) {
  footer .logo-newsletter {
    padding-bottom: 32px;
  }
  footer .logo-newsletter .newsletter .copy {
    padding: 32px 0 8px 0;
  }
  footer .ireland-social {
    padding-bottom: 32px;
  }
  footer .sitemap .col-4 {
    margin-bottom: 32px;
  }
}

footer .social {
  padding-top: 16px;
}

footer .social .network {
  display: inline-block;
  width: 32px;
  height: 32px;
  margin-right: 16px;
  font-size: 0;
  opacity: 0.45;
}

footer .social .network:hover {
  opacity: 1;
}

footer .social .network:active,
footer .social .network:active:hover {
  opacity: 0.45;
}

footer .legal {
  padding: 64px 0 0 0;
  display: block;
  font-size: 12px;
  color: #7d90a2;
  letter-spacing: 0;
}

footer .legal .info {
  text-align: center;
}

footer .legal .info .copyright,
footer .legal .info .terms {
  display: block;
  float: none;
}

footer .legal .info .copyright {
  margin-right: 0;
}

footer .legal .info .terms a {
  margin: 0 16px;
  color: #7d90a2;
  font-weight: 400;
}

footer a:hover,
footer a:active,
footer a:hover:active,
footer .legal .info .terms a:hover,
footer .legal .info .terms a:active,
footer .legal .info .terms a:hover:active {
  color: var(--text);
}

nav {
  width: 100%;
  line-height: 72px;
  font-size: 18px;
  letter-spacing: -0.02em;
  border: none;
}

nav a.button,
nav button {
  padding: 14px 22px;
}

nav#main {
  position: absolute;
  top: 0px;
  z-index: 5;
  height: 72px;
  text-align: center;
}

nav#main .logotype {
  display: inline-block;
  float: left;
  left: 0;
  width: 42px;
  height: 36px;
  margin: 18px 4px 18px 0;
  background-image: url("https://assets.zorincdn.com/zorin.com/images/nav/logo.svg");
  background-size: 42px 36px;
  background-repeat: no-repeat;
  background-position: center center;
  background-origin: content-box;
}

nav#main .logotype span.sr-text {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
  clip-path: inset(0px 0px 99.9% 99.9%);
  overflow: hidden;
  height: 1px;
  width: 1px;
  padding: 0;
  border: 0;
  top: 50%;
}

ul.menu {
  display: inline-block;
  list-style: none;
  position: relative;
  margin: 0;
}

nav ul.menu li {
  font-size: 16px;
  letter-spacing: -0.02em;
  line-height: 72px;
  display: inline;
  float: left;
  margin: 0 16px;
}

nav#main ul.menu li {
  font-family: "Space Grotesk",Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-feature-settings: 'liga' 1, 'ss04' 1, 'case' 1;
  margin: 0 32px;
}

nav#main #main-menu {
  margin-left: auto;
  margin-right: auto;
  transform: translateX(-24px);
}

nav#main #login-menu {
  float: right;
  right: 0;
}

nav ul.menu li a {
  text-align: center;
  display: inline-block;
  text-decoration: none;
  line-height: 72px;
  font-weight: 400;
  box-shadow: none;
  color: rgba(18, 51, 84, 0.65);
}

nav ul.menu li a:hover {
  color: #123354;
}

nav#main ul.menu li a {
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

nav ul.menu li.current a {
  font-weight: 500;
  color: #123354;
}

nav#main ul.menu li.current a {
  font-weight: 700;
}

nav ul.menu li.new::before {
  font-size: 10px;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: #fa4444;
  border-radius: 999px;
  margin-left: 20px;
  transform: translateY(-20px);
  content: 'NEW';
  position: absolute;
  opacity: 0.75;
  height: 0;
}

nav#main .container {
  height: 72px;
}

nav#main .responsive {
  display: none;
  float: right;
}

nav#main .responsive a.button {
  display: inline-block;
}

nav#main .responsive.open a.button {
  background-color: rgba(18, 51, 84, 0.2);
}

nav#main a.button {
  line-height: 20px;
}

.dark nav#main .logotype {
  background-image: url("https://assets.zorincdn.com/zorin.com/images/nav/logo-dark.svg");
}

.black nav .logotype {
  background-image: url("https://assets.zorincdn.com/zorin.com/images/nav/logo-white.svg");
}

@media screen and (max-width: 768px) {
  nav#main .container {
    max-width: 100%;
    margin: 0 0 0 32px;
  }
  nav#main ul.menu {
    display: none;
  }
  nav#main #main-menu {
    transform: translateX(0);
  }
  nav#main ul.menu.open {
    display: inline-block;
    position: absolute;
    top: 72px;
    right: 0;
    width: 100%;
    background-color: #f5f7fa;
    box-shadow: 0 16px 16px rgba(18, 51, 84, 0.075);
    -webkit-animation: fadein 0.5s ease;
    moz-animation: fadein 0.5s ease;
    ms-animation: fadein 0.5s ease;
    o-animation: fadein 0.5s ease;
    animation: fadein 0.5s ease;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
  }
  nav#main ul.menu.open li {
    display: block;
    float: left;
    width: 100%;
    margin: 0;
  }
  nav#main ul.menu.open li a {
    padding: 0 32px;
    text-align: left;
    width: 100%;
    box-shadow: none;
  }
  nav#main ul.menu.open li.current a {
    font-weight: 700;
  }
  nav#main ul.menu li a:active,
nav#main ul.menu li.current a:active {
    background-color: rgba(18, 51, 84, 0.2);
  }
  nav ul.menu li.new::before {
    margin-left: 32px;
  }
  nav#main .responsive {
    display: inline-block;
  }
}

@media screen and (max-width: 480px) {
  nav#main .container {
    max-width: 100%;
    margin: 0 0 0 16px;
  }
  nav#main ul.menu.open li a {
    padding: 0 32px;
  }
  nav ul.menu li.new::before {
    margin-left: 16px;
  }
}

nav.scroll-hidden {
  opacity: 0;
  transition: none;
}

nav.secondary,
nav.tertiary {
  z-index: 4;
}

nav.secondary {
  line-height: 60px;
  padding: 8px 0;
}

nav.secondary .navbar {
  position: relative;
}

nav.secondary .overflow-fade {
  background: rgba(0, 0, 0, 0) linear-gradient(90deg, rgba(255, 255, 255, 0), white) repeat scroll 0% 0%;
  height: 60px;
  position: absolute;
  pointer-events: none;
  right: 0px;
  top: 0px;
  width: 16px;
  z-index: 2;
  opacity: 0;
}

nav.secondary .container {
  background-color: #fff;
  border-radius: 16px;
  height: 60px;
  line-height: 60px;
  padding: 0 8px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  overflow-x: auto;
  overflow-y: hidden;
  -ms-overflow-style: none;
  scrollbar-width: none;
  box-sizing: border-box;
}

nav.secondary .container::-webkit-scrollbar {
  display: none;
}

nav.secondary ul.menu {
  align-self: flex-end;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  white-space: nowrap;
}

nav.secondary ul.menu li {
  align-self: flex-end;
  float: none;
  display: inline-block;
}

nav.secondary ul.menu li,
nav.secondary ul.menu li a {
  font-size: 16px;
  letter-spacing: -0.02em;
  line-height: 60px;
  margin: 0;
}

nav.secondary ul.menu li a {
  margin: 0 16px;
}

nav.secondary ul.menu li a.button {
  font-size: 16px;
  letter-spacing: -0.02em;
  line-height: 16px;
  margin-top: 8px;
  margin-bottom: 8px;
}

nav.secondary ul.menu li:last-child a.button {
  margin-right: 0;
}

nav.secondary a.title,
nav.secondary a img {
  margin-left: 16px;
  margin-right: 16px;
  white-space: nowrap;
  text-decoration: none;
  font-weight: 700;
}

nav.secondary a img {
  width: 48px;
  height: 48px;
}

nav.secondary a img.logotype {
  width: auto;
  height: 14px;
}

@media screen and (max-width: 480px) {
  nav.secondary {
    padding: 0;
    background-color: #fff;
  }
  nav.secondary .overflow-fade {
    opacity: 1;
  }
  nav.secondary .container {
    border-radius: 0;
    padding: 0;
    background-color: transparent;
    width: 100%;
  }
  nav.secondary ul.menu li:last-child a.button {
    margin-right: 16px;
  }
}

.nav-placeholder {
  display: block;
  height: 72px;
}

.post {
  margin-top: 64px !important;
  margin-bottom: 64px !important;
}

.post p, .post h1, .post h2, .post h3, .post h4, .post h5, .post h6, .post blockquote, .post hr, .post pre {
  max-width: 620px;
  margin-left: auto;
  margin-right: auto;
}

.post ol, .post ul {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 1025px) {
  .post img:not(.icon) {
    max-width: 100%;
  }
}

.post hr {
  width: 25%;
}

.post pre {
  overflow-x: auto;
}

.post h1, .post .h1 {
  font-size: 60px;
  letter-spacing: -0.034em;
}

.post h2, .post .h2 {
  font-size: 40px;
  letter-spacing: -0.028em;
}

.post h3, .post .h3 {
  font-size: 30px;
  letter-spacing: -0.028em;
}

.post h4, .post .h4 {
  font-size: 24px;
  letter-spacing: -0.026em;
}

.post h5, .post .h5 {
  font-size: 20px;
  letter-spacing: 0.026em;
}

.post h6, .post .h6 {
  font-size: 18px;
  letter-spacing: 0.08em;
}

@media screen and (max-width: 768px) {
  .post h1, .post .h1 {
    font-size: 40px;
    letter-spacing: -0.028em;
  }
  .post h2, .post .h2 {
    font-size: 30px;
    letter-spacing: -0.028em;
  }
  .post h3, .post .h3 {
    font-size: 24px;
    letter-spacing: -0.026em;
  }
  .post h4, .post .h4 {
    font-size: 20px;
    letter-spacing: 0.026em;
  }
  .post h5, .post .h5 {
    font-size: 20px;
    letter-spacing: 0.026em;
  }
  .post h6, .post .h6 {
    font-size: 18px;
    letter-spacing: 0.08em;
  }
}

.post h2, .post .h2 {
  margin: 2em auto 0 auto;
  text-align: left;
}

.post h3, .post .h3 {
  margin: 1.5em auto 0 auto;
  text-align: left;
}

.post h4, .post h5, .post h6, .post .h4, .post .h5, .post .h6 {
  margin: 1em auto 0 auto;
  text-align: left;
}

.post p, .post li {
  font-size: 20px;
  letter-spacing: -0.022em;
  line-height: 1.65;
}

@media screen and (max-width: 768px) {
  .post p, .post li {
    font-size: 18px;
    letter-spacing: -0.02em;
  }
}

.post p {
  margin-top: 0.5em;
  margin-bottom: 1.5em;
}

.post blockquote p {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

.post_title {
  max-width: 768px !important;
  margin-bottom: 0;
  text-align: center;
  text-wrap: balance;
}

@media screen and (max-width: 1024px) {
  .post_title {
    max-width: 700px !important;
  }
}

@media screen and (max-width: 768px) {
  .post_title {
    max-width: 100% !important;
  }
}

.post_description {
  max-width: 768px !important;
  margin: 0.75em auto 2em auto !important;
  font-size: 26px !important;
  opacity: 0.7;
  line-height: 1.5 !important;
  text-align: center;
  text-wrap: balance;
}

@media screen and (max-width: 1024px) {
  .post_description {
    max-width: 700px !important;
  }
}

@media screen and (max-width: 768px) {
  .post_description {
    font-size: 24px !important;
    max-width: 100% !important;
  }
}

.posts {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  width: 100%;
  align-items: stretch;
}

.posts:not(.aside) {
  padding: 0 30px;
}

.post ul, .post ol {
  margin: 1.5em auto;
  padding: 0 1.25rem;
}

.post ul {
  list-style-type: disc;
}

.post_body figure {
  margin: 32px auto;
  max-width: 1024px;
}

.post_body figure img,
.post_body figure video {
  display: block;
  margin-top: 0;
  margin-bottom: 8px;
}

.post_body figure figcaption {
  opacity: 0.65;
}

.post_body figure figcaption p,
.post_body figure figcaption h4 {
  margin-top: 0;
  margin-bottom: 0;
  text-align: center;
}

.post_body figure figcaption p {
  font-weight: 600;
  font-size: 16px;
}

.post_body .footnotes li,
.post_body .footnotes p {
  font-size: 16px;
}

@media screen and (max-width: 768px) {
  .post_body .footnotes li,
.post_body .footnotes p {
    font-size: 14px;
  }
}

.post_inner a.button {
  margin-left: 0;
  display: inline-block;
}

.post_inner a:not(.button) {
  color: var(--theme);
  transition: all 0.3s;
  font-weight: 700;
}

.post_inner a:not(.button):not(.button):hover {
  opacity: 0.8;
  text-decoration: underline;
}

.post .icon {
  margin-top: 0;
  margin-bottom: 0;
}

.post_date {
  max-width: 768px !important;
  font-size: 17px !important;
  font-weight: 700;
  font-family: var(--font-display);
  font-feature-settings: 'liga' 1, 'ss04' 1, 'case' 1;
  text-transform: uppercase;
  letter-spacing: 0.04em !important;
  margin-top: 0 !important;
  margin-bottom: 1em !important;
  text-align: center;
}

@media screen and (max-width: 1024px) {
  .post_date {
    max-width: 700px !important;
  }
}

@media screen and (max-width: 768px) {
  .post_date {
    max-width: 100% !important;
  }
}

.post_copy {
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

.post_item {
  box-shadow: 0 0 3rem rgba(18, 51, 84, 0.17);
  margin: 1.25rem 0;
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
}

.post_item:hover {
  box-shadow: 0 0 5rem rgba(18, 51, 84, 0.255);
}

@media screen and (min-width: 667px) {
  .post_item {
    width: 47%;
  }
}

.post_item:hover .post_copy {
  opacity: 1;
}

.post_link {
  padding: 2.5px 0;
  font-size: 1.25em;
  margin: 2.5px 0;
  text-align: left;
}

.post_meta {
  overflow: hidden;
  opacity: 0.8;
  font-size: 0.84rem;
  font-weight: 500;
  display: inline-grid;
  grid-template-columns: auto 1fr;
  background-color: var(--light);
  padding: 0;
  align-items: center;
  border-radius: 0.3rem;
  color: var(--dark);
  text-transform: capitalize;
}

.post_meta a:hover {
  color: var(--theme);
  text-decoration: underline;
  opacity: 0.9;
}

.post_extra {
  display: flex;
  justify-content: flex-end;
}

.post_tag {
  font-size: 0.75rem !important;
  font-weight: 500;
  background: var(--theme);
  color: var(--light);
  padding: 0.25rem 0.67rem !important;
  text-transform: uppercase;
  display: inline-flex;
  border-radius: 5px;
}

.post_time {
  background: var(--theme);
  display: inline-grid;
  padding: 0.2rem 0.75rem;
  color: var(--light);
}

.post_thumbnail {
  border-radius: 16px;
  margin: 3em auto;
  display: block;
  max-width: 100% !important;
}

@media screen and (max-width: 1024px) {
  .post_thumbnail {
    max-width: 700px !important;
  }
}

@media screen and (max-width: 768px) {
  .post_thumbnail {
    max-width: 100% !important;
  }
}

.post_nav {
  padding: 64px 0;
  display: grid;
  margin: 0 auto;
  text-align: center;
  font-size: 24px;
}

.post_nav p {
  line-height: 1.5;
  margin: 0.25em 0;
  letter-spacing: -0.02em;
}

.post_content_end {
  border: none;
  display: block;
  height: 0;
  margin: 64px auto 0 auto;
}

.post figure.shadow-padding {
  padding-left: 24px;
  padding-right: 24px;
}

@media screen and (max-width: 768px) {
  .post figure.shadow-padding {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.post figure .rounded {
  border-radius: 10px;
}

.pager {
  display: grid;
  grid-template-columns: 2.5rem 1fr 2.5rem;
  margin: 32px auto 128px auto;
  max-width: 12.5rem;
}

.pager, .pager_item {
  justify-content: center;
  align-items: center;
}

.pager_item {
  height: 2.6rem;
  width: 2.6rem;
  display: inline-flex;
  margin-left: 8px;
  margin-right: 8px;
  background-color: rgba(18, 51, 84, 0.1);
  color: var(--light);
  border-radius: 50%;
  background-size: 50%;
  background-position: center;
  background-repeat: no-repeat;
}

.pager_item:hover {
  background-color: rgba(18, 51, 84, 0.2);
}

.pager_prev {
  background-image: url(https://blog.zorin.com/images/icons/previous.svg);
}

.pager_next {
  background-image: url(https://blog.zorin.com/images/icons/next.svg);
}

.pager_active {
  opacity: 0;
}

.pager span {
  text-align: center;
}

.excerpt {
  padding: 0 10px 1.5rem 10px;
  position: relative;
  z-index: 1;
}

.excerpt_meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  transform: translateY(-2.5rem);
  position: relative;
  z-index: 5;
}

.archive {
  max-width: 640px;
  margin-top: 32px !important;
  margin-bottom: 32px !important;
}

.archive_item {
  display: grid;
  padding: 2rem 0;
  transition: color 200ms ease;
}

.archive_item:hover {
  color: var(--theme);
}

.archive_date {
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.pale {
  opacity: 0.5;
}

.hidden {
  display: none;
}

.center {
  text-align: center;
  margin: 5px auto;
}

.left {
  text-align: left;
}

.link {
  display: inline-block;
  width: 2.5rem;
  margin: 0 0.25rem;
  padding: 0 0.25rem;
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
}

.link_owner:hover .link {
  opacity: 0.9;
}

.wrap, .wrap {
  padding: 0 32px;
  margin: 0 auto;
}

.pt-1 {
  padding-top: 1.5rem;
}

.pb-1 {
  padding-bottom: 1.5rem;
}

.mt-1 {
  margin-top: 1.5rem;
}

.mb-1 {
  margin-bottom: 1.5rem;
}

.pt-2 {
  padding-top: 3rem;
}

.pb-2 {
  padding-bottom: 3rem;
}

.mt-2 {
  margin-top: 3rem;
}

.mb-2 {
  margin-bottom: 3rem;
}

.grid-2, .grid-3, .grid-4, .grid-auto, .grid-reverse {
  display: grid;
  grid-template-columns: 1fr;
}

[class*='grid-'] {
  grid-gap: 3rem;
}

@media screen and (min-width: 42rem) {
  .grid-auto {
    grid-template-columns: 1fr 3fr;
  }
  .grid-reverse {
    grid-template-columns: 3fr 1fr;
  }
  .grid-2 {
    grid-template-columns: 1fr 1fr;
  }
  .grid-3 {
    grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr));
  }
  .grid-4 {
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  }
}

.mt {
  margin-top: 5rem;
}

.highlight {
  margin: 1.5rem 0 2.5rem;
  padding: 0 !important;
}

.highlight .highlight {
  margin: 0;
}

.highlight pre {
  padding: 1rem;
  background: var(--accent) !important;
  color: var(--text) !important;
  border-radius: 4px;
  max-width: 100%;
  overflow-x: auto;
}

.highlight table {
  display: grid;
  border-radius: 8px;
}

.highlight .lntd {
  width: 100%;
  border: none;
}

.highlight .lntd:first-child, .highlight .lntd:first-child pre {
  width: 2.5rem !important;
  padding-left: 0;
  padding-right: 0;
  color: #999 !important;
  background-color: #e8e8e8 !important;
  border-radius: 0.25rem 0 0 0.25rem;
}

.highlight .lntd:first-child pre {
  width: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.highlight .lntd:last-child {
  padding-left: 0;
}

.err {
  color: #a61717;
  background-color: #e3d2d2;
}

.hl {
  display: block;
  width: 100%;
  background-color: #ffffcc;
}

.ln {
  margin-right: 0.4rem;
  padding: 0 0.4em 0 0.4rem;
  color: #666;
}

.k, .kc, .kd, .kn, .kp, .kr, .kt, .nt {
  color: #6ab825;
  font-weight: 500;
}

.kn, .kp {
  font-weight: 400;
}

.nb, .no, .nv {
  color: #24909d;
}

.nc, .nf, .nn {
  color: #447fcf;
}

.s, .sa, .sb, .sc, .dl, .sd, .s2, .se, .sh, .si, .sx, .sr, .s1, .ss {
  color: #ed9d13;
}

.m, .mb, .mf, .mh, .mi, .il, .mo {
  color: #3677a9;
}

.ow {
  color: #6ab825;
  font-weight: 500;
}

.c, .ch, .cm, .c1 {
  color: #999;
  font-style: italic;
}

.cs {
  color: #e50808;
  background-color: #520000;
  font-weight: 500;
}

.cp, .cpf {
  color: #cd2828;
  font-weight: 500;
}

.gd, .gr {
  color: #d22323;
}

.ge {
  font-style: italic;
}

.gh, .gu, .nd, .na, .ne {
  color: #ffa500;
  font-weight: 500;
}

.gi {
  color: #589819;
}

.go {
  color: #ccc;
}

.gp {
  color: #aaa;
}

.gs {
  font-weight: 500;
}

.gt {
  color: #d22323;
}

.w {
  color: #666;
}

/*# sourceMappingURL=main.css.map */