/* 
 * styling
 * https://material.google.com/layout/metrics-keylines.html#metrics-keylines-keylines-spacing
 */

/* fonts. */

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dMIFdwYjGaAMFtZd_QA1ZeUFWaHg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Albert Sans';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/albertsans/v1/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* basics */

*, *::after, *::before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-outline: 0; -moz-outline: 0; outline: 0; margin: 0; padding: 0;}
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, a, img, strong, b, u, i, ul, li, form, label, table, tbody, tfoot, thead, tr, th, td, article, header, footer {border: 0; margin: 0; padding: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
html, body {min-height: 100%;}
html {background: #fafafa;}
body {color: #000; font-family: Albert Sans, sans-serif, Arial; font-size: 14px; min-width: 320px;}
img {height: auto; max-width: 100%; width: 100%;}
a {color: inherit; outline: none; text-decoration: none;}
ul {list-style-type: none;}
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: normal; text-align: left;}
td {border: 0; font-weight: normal; padding: 10px; text-align: left;}
button, input, textarea, select {color: inherit; font: inherit; margin: 0;}
input[type="file"] {display: block;}

.box-s {box-sizing: border-box;}
.center, .text-center {text-align: center;}
.tright, .text-right {text-align: right;}
.clear {clear: both;}
.cl-l {clear: left;}
.fl-l, .float-l {float: left;}
.fl-r, .float-r {float: right;}
.block {display: block;}
.inbl {display: inline-block;}
.none {display: none;}
.table {display: table;}
.tablerow {display: table-row;}
.table-cell {display: table-cell;}
.pointer {cursor: pointer;}
.ovhi {overflow: hidden;}
.vhid {visibility: hidden;}
.vtop {vertical-align: top;}
.bg-norep {background: no-repeat;}
.bg-center {background-position: center;}
.ellipsis {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.container {}
.transitie {transition: all 0.35s ease-out 0s;}
.italic {font-style: italic;}
.vertical-align-middle {align-items: center; display: flex;}

/* alerts */

.alert {border-radius: 4px; color: #000; font-size: 14px; line-height: 20px; min-height: 52px; padding: 16px;}
.alert-large {font-size: 16px; line-height: 24px; min-height: 72px; padding: 24px;}
.alert-medium {font-size: 16px; line-height: 24px; min-height: 56px;}
.alert-small {min-height: 36px; padding: 8px 16px;}
.alert-success {background-color: #dff0d8;}
.alert-info {/*background-color: #d9edf7;*/ background-color: #b1e0ec; background-color: #d9edf7;}
.alert-warning {background-color: #fcf8e3;}
.alert-danger {background-color: #f2dede;}
.alert-error {background-color: #F5B7AB;}

/* buttons */

.btn {-webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: #f0f0f0; background-image: none; border: 1px solid transparent; border-radius: 2px; cursor: pointer; display: inline-block; font-size: 14px; font-weight: 400; height: auto; line-height: 20px; margin: 0; min-height: 36px; padding: 7px 15px; text-align: center; text-transform: uppercase; vertical-align: middle; white-space: nowrap;}
.btn-small {font-size: 12px; letter-spacing: 1px; min-height: 28px; padding: 3px 11px;}
.btn-design-default {background-color: #fff; border-color: #eaeaea; color: #000;}
.btn-design-black, .btn-black {background-color: #000; color: #fff;} 
.btn-design-1 {background-color: #fff; border: 2px solid #000; color: #000; padding: 8px 15px;} 
.btn-small.btn-design-1 {padding: 3px 9px;}
.btn-design-2 {background-color: #c5aea0; color: #fff;}
.btn-design-2:hover {background-color: #fff; border: 2px solid #000; color: #000; padding: 8px 15px;}
.btn-dark {background: #3b454e; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2); color: #fff;}

/* forms */

.form-group {margin-bottom: 20px;}
.form-group label {display: inline-block; font-weight: 400; margin-bottom: 8px; max-width: 100%;}
.form-control {-webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #eaeaea; border-radius: 3px; display: block; font-size: 14px; height: 40px; line-height: 20px; padding: 9px 11px; width: 100%;}
textarea.form-control {height: auto; line-height: 24px; min-height: 40px; padding: 12px;}
select.form-control {background: transparent url('/img/arrow-down-black.svg') no-repeat right 10px center; cursor: pointer; padding: 0 32px 0 12px;}
.form-control[multiple] {background: none; height: auto;}
.form-control[disabled] {background-color: #f7f7f7; color: #c9c9c9;}
.form-control:focus {border: 1px solid #000;}
.help-block {color: #737373; display: block; margin: 10px 0;}
.form-control-static {margin-bottom: 0; min-height: 40px; padding-bottom: 8px; padding-top: 8px;}
.checkbox label, .radio label {margin-bottom: 0;}
.checkbox input[type=checkbox], .radio input[type=radio] {vertical-align: middle;}
.checkbox-design-1 label, .radio-design-1 label {font-size: 14px; line-height: 20px; margin-bottom: 0;}
.checkbox-design-1 input[type=checkbox], .radio-design-1 input[type=radio] {display: none;}
.checkbox-design-1 span::before {background-color: #fff; border: 1px solid #eaeaea; border-radius: 2px; content: ''; display: inline-block; height: 16px; margin-right: 8px; position: relative; top: 2px; vertical-align: top; width: 16px;}
.radio-design-1 span::before {background-color: #fff; border: 1px solid #eaeaea; border-radius: 50%; content: ''; display: inline-block; height: 16px; margin-right: 8px; position: relative; top: 2px; vertical-align: top; width: 16px;}
.checkbox-design-1 input[type=checkbox]:checked + span::before {background: #fff url('/img/checkbox-checked.svg') no-repeat center center / 16px auto; border: none;}
.radio-design-1 input[type=radio]:checked + span::before {background: #fff url('/img/radio-checked.svg') no-repeat center center / 16px auto; border: none;}

/* form validation */

.has-success label {color: #3c763d;}
.has-success .form-control {border-color: #3c763d;}
.has-warning label {color: #8a6d3b;}
.has-warning .form-control {border-color: #8a6d3b;}
/* .has-error label {color: #ef4e4e;} */
.has-error .form-control {border-color: #ef4e4e;}
.has-error .help-block {color: #ef4e4e;}
.color-red {color: #ef4e4e;}

/* grid */

.row {}
.col {float: left; min-height: 1px;}
.lg-1 {width: 8.3333%;}
.lg-2 {width: 16.6667%;}
.lg-3 {width: 25%;}
.lg-4 {width: 33.3333%;}
.lg-5 {width: 41.6667%;}
.lg-6 {width: 50%;}
.lg-7 {width: 58.3333%;}
.lg-8 {width: 66.6667%;}
.lg-9 {width: 75%;}
.lg-10 {width: 83.3333%;}
.lg-11 {width: 91.6667%;}
.lg-12 {width: 100%;}
.clearfix {clear: both; height: 0; margin: 0; padding: 0; width: 100%;}
.clearfix:after, .row:after, .checklist .item:after {clear: both; content: ''; display: table;}

.gutter-8px {margin: 0 -8px;}
.gutter-8px .col {padding: 0 8px;}

/* checkbox design 2 */

.checkbox-design-2 input[type=checkbox] {display: none;}
.checkbox-design-2 span::before {background-color: #f7f7f7; border: 1px solid #000; border-radius: 10px; box-sizing: border-box; content: ''; display: inline-block; height: 18px; margin: 0 10px 1px 0; transition: border 200ms cubic-bezier(0.23, 1, 0.32, 1) 0s; vertical-align: middle; width: 18px;}
.checkbox-design-2:hover span::before {border: 3px solid #000;}
.checkbox-design-2 input[type=checkbox]:checked + span::before {background: #ededed url('/img/checkbox.svg') no-repeat center center / cover; border: 3px solid #000;}
.checkbox-design-2 input[type=checkbox]:checked + span {color: rgba(0, 0, 0, 0.26);}

/* header */

.topbar {background: #f1ede8;}
.topbar-info {font-weight: 500; line-height: 20px; margin: 0 auto; max-width: 1032px; min-height: 40px; padding: 10px 24px; position: relative; text-align: center;}
.topbar a {text-decoration: underline;}
.cookie-text {font-weight: 500; line-height: 20px; margin: 0 auto; max-width: 764px; min-height: 40px; padding: 10px 128px 10px 24px; position: relative;}
.btn-accept-cookies {background: #fff; font-weight: 600; margin: -14px 0 0 0; position: absolute; right: 24px; top: 50%;}

header {background: #fff; box-shadow: 0 10px 20px rgb(0 0 0 / 10%); margin-bottom: 48px; padding: 24px;}
.header-container {margin: 0 auto; max-width: 1032px;}
header .logo {font-size: 18px; font-weight: 900;}

/* home */

.home-outside {padding: 0 24px;}
.home {background: #fff; border-radius: 8px; box-shadow: 0 10px 20px rgb(0 0 0 / 10%); margin: 48px auto; max-width: 1032px; padding-bottom: 48px;}
.article {}
.article .banner {margin-bottom: 52px; position: relative;}
.article .banner img {border-radius: 8px 8px 0 0;}
.unsplash-thankyou {bottom: 12px; color: #fff; font-weight: 600; padding: 0 16px; position: absolute; text-align: right; width: 100%;}
.unsplash-thankyou-icon {background: url('/img/Unsplash_Symbol_white.svg') no-repeat center center / 16px auto; display: inline-block; height: 16px; width: 16px;}
.article h1 {font-size: 32px; font-weight: 900; line-height: 40px; margin: 0 auto 24px; max-width: 800px; padding: 0 24px;}
.article h2 {font-size: 24px; font-weight: 800; line-height: 32px; margin: 0 auto 24px; max-width: 800px; padding: 0 24px;}
.article p {font-size: 16px; font-weight: 500; line-height: 24px; margin: 0 auto 24px; max-width: 800px; padding: 0 24px; white-space: pre-line;}
.article p.last {margin-bottom: 50px;}
.share-article {margin: 0 auto 24px; max-width: 800px; padding: 8px 24px;}
.share-article b {display: inline-block; line-height: 28px; margin-right: 8px; vertical-align: top;}
.btn-share {border-radius: 50%; box-shadow: 0 5px 2px -2px rgb(66 102 178 / 10%), 0 10px 5px -5px rgb(66 102 178 / 20%); display: inline-block; height: 28px; margin-right: 8px; width: 28px;}
.share-article .facebook {background: #111314 url('/img/facebook-white.svg') no-repeat center 2px / 22px auto;}
.share-article .twitter {background: #111314 url('/img/twitter-white.svg') no-repeat center center / 20px auto;}
.share-article .email {background: #111314 url('/img/email-white.svg') no-repeat 2px center / 22px auto;}
.ad {background-color: #ddd; color: #000; font-size: 14px; margin-bottom: 24px; padding: 24px 0; text-align: center;}
.ad img {margin: 0 auto; max-width: 720px;}
.home .version {font-size: 12px; font-weight: 800; margin: 0 auto; max-width: 800px; padding: 0 24px;}
.object-keys-padding {padding: 0 24px;}
.object-keys {background-color: #fcf8e3; border-radius: 8px; font-size: 15px; line-height: 24px; margin: 0 auto 24px; max-width: 800px; padding: 16px 24px;}
.object-keys h3 {font-size: 18px; margin-bottom: 12px;}
.object-keys .text {height: 88px; overflow: hidden;}
.key-item {border-top: 1px solid #ededed; padding: 16px 0;}
.key-name {background: #fafafa; border: 1px solid #ededed; border-radius: 4px; font-size: 14px; margin-right: 8px; overflow-wrap: break-word; padding: 4px 8px;}
.key-type {font-weight: 500;}
.key-description {padding-top: 12px; white-space: pre-line;}
.sub-items {padding-left: 48px;}
.btn-toon-keys {cursor: pointer; font-weight: 800;}
.object-keys.open .text {height: auto;}
.object-keys.open .btn-toon-keys {display: none;}
.download-voorbeeld {text-decoration: underline;}
.code-padding {padding: 0 24px;}
.code {background: rgb(232, 240, 254); border-radius: 8px; display: block; font-family: inherit; font-weight: 500; line-height: 20px; margin: 0 auto 24px; max-width: 800px; overflow-x: scroll; padding: 24px; -ms-overflow-style: none; /* Hide scrollbar IE and Edge. */ scrollbar-width: none; /* Hide scrollbar Firefox. */}
.code div {white-space: pre;}
.code::-webkit-scrollbar {display: none;} /* Hide scrollbar for Chrome, Safari and Opera. */

/* policy */

.policy-outside {padding: 0 24px;}
.policy {background: #fff; border-radius: 8px; box-shadow: 0 10px 20px rgb(0 0 0 / 10%); margin: 48px auto; max-width: 1032px; padding: 24px 48px;}
.policy h1 {font-size: 34px; font-weight: 500; line-height: 40px; padding: 32px 0;}
.policy h2 {font-size: 24px; font-weight: 500; line-height: 32px; padding: 8px 0 24px;}
.policy h3 {font-size: 16px; font-weight: 700; line-height: 24px;}
.policy p {font-size: 16px; line-height: 24px; padding-bottom: 24px;}
.policy ul {margin: 0 0 24px 20px;}
.policy li {font-size: 16px; line-height: 24px; list-style-type: initial;}
.policy .table {border: 1px solid #dfdfdf; display: block; margin-bottom: 24px;}
.policy .table .row {clear: both; min-height: 40px;}
.policy .row.grey {background-color: #dfdfdf;}
.policy .row.grey div {font-weight: 500;}
.policy .row div {float: left; font-size: 15px; font-weight: 400; line-height: 24px; padding: 8px; width: 20%; word-wrap: break-word;}
.policy .row div.large {width: 40%;}
.policy .browsers img {width: 32px;}
.policy a {color: #4da74d;}

/* 404 */

.notfound-outside {padding: 0 24px;}
.notfound {background: #fff; border-radius: 8px; box-shadow: 0 10px 20px rgb(0 0 0 / 10%); margin: 48px auto; max-width: 1032px; padding: 24px 48px; text-align: center;}
.notfound h1 {font-size: 34px; font-weight: 500; line-height: 40px; padding: 32px 0;}
.notfound p {font-size: 14px; line-height: 20px; padding: 16px 0;}

/* contact */

.contact-outside {padding: 0 24px;}
.contact {background: #fff; border-radius: 8px; box-shadow: 0 10px 20px rgb(0 0 0 / 10%); margin: 48px auto; max-width: 1032px; padding: 24px 48px 48px;}
.contact h1 {font-size: 34px; font-weight: 800; line-height: 48px; padding: 24px 0;}
.contact h2 {font-size: 20px; font-weight: 700; line-height: 28px;}
.contact p {font-size: 16px; font-weight: 500; line-height: 24px;}
.contact .col {padding: 10px 10px 10px 0;}
.contact a {text-decoration: underline;}

/* footer */

footer {background: #fff; padding: 32px 24px;}
footer .row {margin: 0 auto; max-width: 1032px;}
footer .links {font-size: 16px; font-weight: 500; line-height: 30px;}
footer .links a {display: inline-block; padding: 0 4px;}
footer .links a:hover {text-decoration: underline;}
.legal {padding: 6px 0; text-align: right;}
.legal i {background: url('/img/copyright-black.svg') no-repeat center center / 20px auto; color: transparent; display: inline-block; font-size: 20px; height: 24px; line-height: 24px; margin-right: 6px; width: 24px;}
.legal p {display: inline; font-size: 16px; line-height: 24px; vertical-align: top;}

/* various */










/*
 * https://material.io/design/layout/responsive-layout-grid.html#breakpoints
 * Large (desktop), 1440+, 12 columns.
 * See all above. 
 */

/* Medium (laptop), 1240-1439. */
@media screen and (max-width: 1439px) {
	
	
}

/* Small (tablet), 905-1239. */
@media screen and (max-width: 1239px) {
	
	
}

/* Small (tablet), 600-904, 8 columns. */
@media screen and (max-width: 904px) {
	
	/* grid */
	
	.md-1 {width: 12.5%;}
	.md-2 {width: 25%;}
	.md-3 {width: 37.5%;}
	.md-4 {width: 50%;}
	.md-5 {width: 62.5%;}
	.md-6 {width: 75%;}
	.md-7 {width: 87.5%;}
	.md-8 {width: 100%;}
	
	/* home */

	
	/* policy */
	
	.policy {padding: 24px;}
	.policy .table .row {min-height: 36px;}
	.policy .row div {font-size: 14px; line-height: 20px;}
	
	/* 404 */
	
	.notfound {padding: 24px;}
	
	/* contact */
	
	.contact {padding: 24px 24px 48px;}
	
	/* footer */
	
	.legal {text-align: left;}
}

/* Extra-small (phone), 0-599dp, 4 columns. */
@media screen and (max-width: 599px) {
	
	/* grid */
	
	.sm-1 {width: 25%;}
	.sm-2 {width: 50%;}
	.sm-3 {width: 75%;}
	.sm-4 {width: 100%;}

	/* header */
	
	.topbar-info {padding: 10px 16px;}
	.cookie-text {padding: 10px 128px 10px 16px;}
	.btn-accept-cookies {right: 16px;}
	header {padding: 24px 16px;}
	
	/* home */

	.home-outside {padding: 0 16px;}
	.article .banner {margin-bottom: 24px;}
	.article h1 {font-size: 28px; padding: 0 16px;}
	.article h2 {padding: 0 16px;}
	.article p {font-size: 15px; padding: 0 16px;}
	.share-article {padding: 8px 16px;}
	.object-keys-padding {padding: 0 16px;}
	.object-keys {padding: 16px;}
	.code-padding {padding: 0 16px;}
	.code {padding: 24px 16px;}

	/* policy */
	
	.policy-outside {padding: 0 16px;}
	.policy {padding: 24px 16px;}
	.policy h1 {font-size: 24px; line-height: 32px;}
	.policy h2 {font-size: 20px; line-height: 24px;}
	.policy .table .row {min-height: 60px;}
	.policy .row div {width: 50% !important;}
	.policy .row div.large {clear: left;}

	/* 404 */
	
	.notfound-outside {padding: 0 16px;}
	.notfound {padding: 24px 16px;}
	.notfound h1 {font-size: 24px; line-height: 32px; padding: 16px 0;}
	
	/* contact */
	
	.contact-outside {padding: 0 16px;}
	.contact {padding: 24px 16px 48px;}
	
	/* footer */
	
	footer {padding: 32px 16px;}
	
}