/* Scss Document */
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap");
body {
  font-family: "Noto Sans", sans-serif;
  color: #14335B;
  position: relative; }

.section {
  padding: 0 5%; }

header {
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%; }
  header a {
    color: #14335B;
    font-weight: 700;
    text-decoration: none; }
  header .mobile-nav {
    width: 100%;
    position: relative; }
    header .mobile-nav hr {
      border: 1px solid #14335B;
      width: 90%;
      margin: 5px auto; }
    header .mobile-nav a {
      display: block;
      text-align: center; }
      header .mobile-nav a img {
        width: 25%;
        padding-top: 2%; }
    header .mobile-nav nav {
      width: 100%;
      display: flex;
      justify-content: space-around; }
      header .mobile-nav nav a {
        color: #14335B; }
  header .sticky {
    position: fixed;
    background-color: #14335B; }
    header .sticky a img {
      display: none; }
    header .sticky nav a {
      color: #fff; }
    header .sticky hr {
      margin: 8px auto; }
  header .desktop-nav {
    display: none;
    margin: 15px 0; }

.title-banner {
  background-color: #14335B;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: 21px;
  text-transform: uppercase;
  padding: 5% 0; }

a > button, .form__item--submit > button, #mCCForm > button {
  width: 180px;
  height: 40px;
  background-color: #14335B;
  color: #fff;
  border-radius: 20px;
  padding: 2% 2.5%;
  border: none;
  outline: none; }

a > button:hover, .form__item--submit > button:hover, #mCCForm > button:hover {
  font-weight: 700;
  box-shadow: inset -15px 0 0 0px #C6C6C6, inset -30px 0 0 0 #2AA3C1, inset 0px 0 0 0 #14335B; }

h3 {
  font-family: "Shippori Mincho", serif;
  font-size: 24px;
  line-height: 25px; }

.horizontal-line {
  border: 2px solid #14335B; }

.page-end-icon {
  padding: 50px 0;
  display: block;
  margin: 0 auto; }

.page-footer {
  position: relative; }
  .page-footer .sticky-footer-image {
    height: 50vh;
    background-image: url("../img/template-img/fixed-footer-image.jpg");
    background-attachment: scroll;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%; }
  .page-footer footer {
    padding: 5%;
    min-height: 50vh;
    width: 100%;
    color: #fff;
    background: #2aa3c1;
    background: -webkit-linear-gradient(#2aa3c1 0%, #a3a39c 20%, #14335b 85%);
    background: -o-linear-gradient(#2aa3c1 0%, #a3a39c 20%, #14335b 85%);
    background: linear-gradient(#2aa3c1 0%, #a3a39c 20%, #14335b 85%);
    display: flex;
    flex-direction: column; }
    .page-footer footer h5 {
      font-weight: 700;
      border-bottom: 2px solid #fff;
      text-transform: uppercase;
      width: fit-content;
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: -o-fit-content;
      padding-bottom: 10px;
      margin-bottom: 15px;
      font-size: 20px; }
    .page-footer footer span {
      margin: 0.6em 0; }
    .page-footer footer span > a {
      color: #fff;
      text-decoration: none; }
    .page-footer footer .footer-menu, .page-footer footer .footer-contact {
      margin: 20px auto; }
    .page-footer footer .footer-menu nav {
      display: flex;
      flex-direction: column; }
    .page-footer footer .footer-contact {
      color: #fff;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center; }
      .page-footer footer .footer-contact span > a {
        text-decoration: underline; }
    .page-footer footer img {
      width: 30vw;
      max-width: 170px;
      margin: 0 auto; }

#landing {
  height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  background-image: url("../img/landing-background-mobile.jpg");
  background-size: cover;
  background-position: center center; }
  #landing .landing-content h2 {
    font-family: "Shippori Mincho", serif;
    font-size: 32px;
    padding-left: 10%; }
    #landing .landing-content h2 span {
      color: #fff; }
  #landing .landing-banner {
    width: 100%;
    position: absolute;
    bottom: 0;
    color: #fff;
    background-color: #14335B;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 10vh; }
    #landing .landing-banner h4 {
      text-transform: uppercase;
      text-align: center;
      font-weight: 700; }

#diensten .diensten-intro {
  margin-bottom: 60px; }
  #diensten .diensten-intro .diensten-intro-content {
    margin-top: 75px; }
    #diensten .diensten-intro .diensten-intro-content h3 {
      font-size: 40px;
      font-weight: 700;
      font-family: "Shippori Mincho", serif; }
    #diensten .diensten-intro .diensten-intro-content .content p:nth-of-type(1) {
      font-weight: 700;
      font-size: 20px; }
    #diensten .diensten-intro .diensten-intro-content p:nth-of-type(1) {
      font-weight: 700; }
#diensten .diensten-loop {
  background-color: #FFF8DD; }
  #diensten .diensten-loop .dienst-block {
    padding: 50px 0; }
    #diensten .diensten-loop .dienst-block .dienst-content {
      padding: 25px 0;
      color: #14335B;
      display: flex;
      flex-direction: column;
      justify-content: space-around; }
      #diensten .diensten-loop .dienst-block .dienst-content .dienst-titles h4 {
        font-family: "Shippori Mincho", serif;
        font-size: 21px; }
#diensten .coming-soon-block img {
  -webkit-width: 100%;
  -moz-width: 100%;
  -o-width: 100%;
  width: 100%; }
#diensten .coming-soon-block .coming-soon-content {
  text-align: center;
  padding: 10%; }
  #diensten .coming-soon-block .coming-soon-content p {
    margin: 50px 0; }

#over-ons .over-ons-block {
  color: #fff;
  height: 90vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-image: url("../img/template-img/about-carefuze-landing-background.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  text-align: center; }
#over-ons .puzzle {
  padding: 5%;
  background-color: #FFF8DD; }
  #over-ons .puzzle h4 {
    color: #14335B;
    font-family: "Shippori Mincho", serif;
    opacity: 0;
    font-size: 27px;
    text-align: center; }
    #over-ons .puzzle h4 span {
      font-family: "Noto Sans", sans-serif;
      font-weight: 700; }

#contact .contact-content {
  min-height: 90vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-image: url("../img/template-img/contact-landing-background.jpg");
  background-size: cover;
  background-repeat: no-repeat; }
  #contact .contact-content h3 {
    padding: 25px 0; }
  #contact .contact-content form {
    width: 100%; }
    #contact .contact-content form .form__item--scf-website {
      display: none; }
    #contact .contact-content form .form__item > .form__item--label {
      display: none; }
    #contact .contact-content form #Inputfield_scf_mail > div {
      margin-top: 0; }
    #contact .contact-content form .form__item > input, #contact .contact-content form .form__item > textarea, #contact .contact-content form #_Inputfield_scf_mail_confirm {
      background-color: #14335B;
      background-color: rgba(20, 51, 91, 0.8);
      border-radius: 10px;
      color: #fff;
      border: none;
      height: 40px;
      margin: 10px 0;
      width: 100%;
      padding-left: 10px; }
    #contact .contact-content form .form__item > input::placeholder, #contact .contact-content form .form__item > textarea::placeholder, #contact .contact-content form #_Inputfield_scf_mail_confirm::placeholder {
      color: #fff; }
    #contact .contact-content form .form__item > textarea {
      height: 20vh; }
    #contact .contact-content form .form__item--submit {
      text-align: center;
      margin: 20px 0; }
    #contact .contact-content form #wrap_Inputfield_scf_mail > div:nth-of-type(1) {
      margin-top: 0 !important; }
    #contact .contact-content form #Inputfield_scf_message {
      font-family: "Noto Sans", sans-serif;
      max-width: 100%;
      min-width: 100%;
      max-height: 250px; }
    #contact .contact-content form .form--error--message, #contact .contact-content form .field--error--message {
      color: red;
      margin: 5px 0;
      font-weight: 700; }
  #contact .contact-content .form--success--message {
    color: green;
    font-weight: 700; }

.slide-from-left {
  animation-name: slide-from-left;
  animation-duration: 0.75s;
  animation-timing-function: ease-in; }

@keyframes slide-from-left {
  0% {
    transform: translateX(-75vw);
    opacity: 0; }
  100% {
    transform: translateX(0);
    opacity: 1; } }
.basic-landing {
  padding-top: 14vh; }
  .basic-landing h2 {
    font-family: "Shippori Mincho", serif; }
  .basic-landing .basic-landing-image {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    min-height: 170px; }
  .basic-landing .basic-landing-content h2 {
    text-align: center; }
  .basic-landing .basic-landing-content a {
    text-align: center;
    display: block;
    margin: 0 auto; }

#error-page a {
  color: #14335B;
  font-weight: 700;
  text-decoration: none;
  display: inline-block; }

#policy-content {
  padding: 50px 0; }

.service-nav {
  padding: 3.5% 5%;
  background-color: #14335B; }
  .service-nav a {
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 18px; }
  .service-nav .next, .service-nav .prev {
    margin: 20px 0;
    display: flex;
    align-items: center; }
  .service-nav .next a:nth-of-type(2) {
    padding-left: 50px; }
  .service-nav .prev a:nth-of-type(1) {
    padding-right: 50px; }

.about-body h2 {
  text-align: center;
  font-size: 32px;
  font-family: "Shippori Mincho", serif; }
.about-body .values-canvas {
  padding: 10vh 0; }
  .about-body .values-canvas .value-item-block, .about-body .values-canvas .value-content-block {
    border: 5px solid #14335B;
    border-radius: 20px; }
  .about-body .values-canvas button > svg {
    pointer-events: none; }
  .about-body .values-canvas button {
    background-color: #fff;
    padding: 0;
    border: none; }
  .about-body .values-canvas h3 {
    width: 100%;
    color: #fff;
    font-size: 0.85em;
    background-color: #14335B;
    text-align: center;
    text-transform: uppercase;
    font-family: "Noto Sans", sans-serif; }
  .about-body .values-canvas .value-item-block {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center; }
    .about-body .values-canvas .value-item-block svg {
      padding: 10%;
      width: 75%; }
      .about-body .values-canvas .value-item-block svg path, .about-body .values-canvas .value-item-block svg g {
        fill: #2AA3C1; }
    .about-body .values-canvas .value-item-block p {
      display: none; }
    .about-body .values-canvas .value-item-block h3 {
      border: 2px solid #14335B;
      border-radius: 0 0 10px 10px;
      -webkit-border-radius: 0 0 10px 10px;
      -moz-border-radius: 0 0 10px 10px;
      -o-border-radius: 0 0 10px 10px; }
  .about-body .values-canvas .value-item-block:hover {
    cursor: pointer;
    background: #14335b;
    background: -webkit-linear-gradient(bottom, #14335b 0%, #acacac 60%, #2aa3c1 100%);
    background: -o-linear-gradient(bottom, #14335b 0%, #acacac 60%, #2aa3c1 100%);
    background: linear-gradient(to top, #14335b 0%, #acacac 60%, #2aa3c1 100%); }
    .about-body .values-canvas .value-item-block:hover svg > path, .about-body .values-canvas .value-item-block:hover svg > g {
      fill: #fff; }
      .about-body .values-canvas .value-item-block:hover svg > path .st1, .about-body .values-canvas .value-item-block:hover svg > path .st0, .about-body .values-canvas .value-item-block:hover svg > g .st1, .about-body .values-canvas .value-item-block:hover svg > g .st0 {
        fill: #fff; }
  .about-body .values-canvas .value-item-block:focus, .about-body .values-canvas .active {
    cursor: pointer;
    background: #14335b;
    background: -webkit-linear-gradient(bottom, #14335b 0%, #acacac 40%, #2aa3c1 100%);
    background: -o-linear-gradient(bottom, #14335b 0%, #acacac 40%, #2aa3c1 100%);
    background: linear-gradient(to bottom, #14335b 0%, #acacac 40%, #2aa3c1 100%); }
    .about-body .values-canvas .value-item-block:focus svg > path, .about-body .values-canvas .value-item-block:focus svg > g, .about-body .values-canvas .active svg > path, .about-body .values-canvas .active svg > g {
      fill: #fff; }
      .about-body .values-canvas .value-item-block:focus svg > path .st1, .about-body .values-canvas .value-item-block:focus svg > path .st0, .about-body .values-canvas .value-item-block:focus svg > g .st1, .about-body .values-canvas .value-item-block:focus svg > g .st0, .about-body .values-canvas .active svg > path .st1, .about-body .values-canvas .active svg > path .st0, .about-body .values-canvas .active svg > g .st1, .about-body .values-canvas .active svg > g .st0 {
        fill: #fff; }
  .about-body .values-canvas .value-content-block {
    padding: 6%; }
    .about-body .values-canvas .value-content-block h3 {
      font-size: 1em;
      color: #14335B;
      font-weight: 700;
      background-color: #fff;
      border-bottom: 5px solid #14335B;
      padding-bottom: 5px;
      width: fit-content;
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: -o-fit-content;
      height: fit-content;
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: -o-fit-content; }
    .about-body .values-canvas .value-content-block button {
      cursor: pointer;
      width: 20%; }
.about-body hr:nth-of-type(2) {
  margin: 50px 0; }

#mCCForm {
  padding: 2% 5%;
  display: flex;
  align-items: center;
  justify-content: space-between; }
  #mCCForm button {
    width: 210px;
    height: 60px;
    padding: 0; }

@supports (display: grid) {
  /* Extra small devices (phones, 600px and down) */
  @media only screen and (max-width: 600px) {
    #landing {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: repeat(4, 1fr); }
      #landing .landing-content {
        grid-area: 2/1/4/8; }

    #diensten > .coming-soon-block {
      display: grid; }

    .about-body > .values-canvas {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      grid-template-rows: auto;
      grid-gap: 2%;
      grid-template-areas: 'content content' 'val-one val-two' 'val-three val-four' 'val-five val-six' 'val-seven .'; }
      .about-body > .values-canvas .value-item-block:nth-of-type(1) {
        grid-area: val-one; }
      .about-body > .values-canvas .value-item-block:nth-of-type(2) {
        grid-area: val-two; }
      .about-body > .values-canvas .value-item-block:nth-of-type(3) {
        grid-area: val-three; }
      .about-body > .values-canvas .value-item-block:nth-of-type(4) {
        grid-area: val-four; }
      .about-body > .values-canvas .value-item-block:nth-of-type(5) {
        grid-area: val-five; }
      .about-body > .values-canvas .value-item-block:nth-of-type(6) {
        grid-area: val-six; }
      .about-body > .values-canvas .value-item-block:nth-of-type(7) {
        grid-area: val-seven; }
      .about-body > .values-canvas .value-content-block {
        grid-area: content;
        display: grid;
        grid-template-columns: 2fr 1fr;
        grid-template-rows: auto;
        grid-template-areas: "title nav" "content-text content-text"; }
        .about-body > .values-canvas .value-content-block h3 {
          grid-area: title; }
        .about-body > .values-canvas .value-content-block p {
          grid-area: content-text; }
        .about-body > .values-canvas .value-content-block .val-nav {
          grid-area: nav;
          display: flex;
          justify-content: space-around; } }
  /* Small devices (portrait tablets and large phones, 600px and up) */
  @media only screen and (min-width: 600px) {
    header .desktop-nav {
      display: flex;
      justify-content: space-between;
      align-items: flex-end; }
    header .mobile-nav {
      display: none; } }
  /* Medium devices (landscape tablets, 768px and up) */
  @media only screen and (min-width: 768px) {
    header .desktop-nav {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: 50px; }
      header .desktop-nav a {
        grid-area: 1/1/1/2; }
      header .desktop-nav nav {
        grid-area: 1/9/1/13;
        display: flex;
        justify-content: space-between; }

    h3 {
      font-size: 45px;
      line-height: 46px; }

    .title-banner {
      padding: 2.5% 0;
      font-size: 32px; }

    .page-footer .sticky-footer-image {
      background-attachment: fixed; }
    .page-footer footer {
      background: #2aa3c1;
      background: -webkit-linear-gradient(top, #2aa3c1 0%, #a3a39c 54%, #14335b 100%);
      background: -o-linear-gradient(top, #2aa3c1 0%, #a3a39c 54%, #14335b 100%);
      background: linear-gradient(to bottom, #2aa3c1 0%, #a3a39c 54%, #14335b 100%);
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: auto; }
      .page-footer footer .footer-menu, .page-footer footer .footer-contact {
        margin: 20px 0; }
      .page-footer footer span {
        margin: 1em 0; }
      .page-footer footer .footer-menu {
        grid-area: 1/1/1/5; }
      .page-footer footer img {
        grid-area: 1/5/1/9;
        align-self: center;
        justify-self: center; }
      .page-footer footer .footer-contact {
        grid-area: 1/9/1/13;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        text-align: right; }

    #landing {
      background-image: url("../img/landing-background-1.jpg");
      display: grid;
      grid-gap: 10px;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: repeat(4, 1fr); }
      #landing .landing-content {
        grid-area: 2/1/3/7; }
        #landing .landing-content h2 {
          font-size: 40px; }
      #landing .landing-banner {
        display: grid;
        grid-gap: 10px;
        grid-template-columns: repeat(12, 1fr); }
        #landing .landing-banner a {
          grid-area: 1/1/1/7;
          justify-self: center; }
        #landing .landing-banner h4 {
          grid-area: 1/6/1/13;
          justify-self: center; }

    #diensten .diensten-intro {
      display: grid;
      grid-gap: 10px;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: auto; }
      #diensten .diensten-intro img {
        grid-area: 1/1/1/7; }
      #diensten .diensten-intro .diensten-intro-content {
        grid-area: 1/8/1/13;
        display: grid; }
        #diensten .diensten-intro .diensten-intro-content h3 {
          font-size: 45px; }
        #diensten .diensten-intro .diensten-intro-content p:nth-of-type(1) {
          align-self: flex-end;
          margin-bottom: 0; }
    #diensten .diensten-loop .dienst-block {
      display: grid;
      grid-gap: 10px;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: auto; }
      #diensten .diensten-loop .dienst-block .dienst-content .dienst-titles h4 {
        font-size: 27px; }
    #diensten .diensten-loop .dienst-block:nth-of-type(odd) img {
      grid-area: 1/8/1/13; }
    #diensten .diensten-loop .dienst-block:nth-of-type(odd) .dienst-content {
      padding: 100px 0;
      grid-area: 1/1/1/7; }
    #diensten .diensten-loop .dienst-block:nth-of-type(even) img {
      grid-area: 1/1/1/6; }
    #diensten .diensten-loop .dienst-block:nth-of-type(even) .dienst-content {
      padding: 100px 0;
      grid-area: 1/7/1/13; }
    #diensten .coming-soon-block {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: auto; }
      #diensten .coming-soon-block img {
        grid-area: 1/2/3/3; }
      #diensten .coming-soon-block .coming-soon-content {
        grid-area: 1/1/3/2;
        align-self: center;
        text-align: left; }

    #over-ons .over-ons-block {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: auto; }
      #over-ons .over-ons-block h3 {
        grid-area: 1/2/1/12;
        align-self: flex-end; }
      #over-ons .over-ons-block p {
        grid-area: 2/4/2/10; }
      #over-ons .over-ons-block a {
        grid-area: 3/2/3/12;
        justify-self: center;
        align-self: flex-start; }
    #over-ons .puzzle {
      display: grid;
      grid-gap: 10px;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: 1fr; }
      #over-ons .puzzle h4 {
        grid-area: 1/1/1/7;
        font-size: 45px;
        align-self: center;
        text-align: left; }
      #over-ons .puzzle #puzzle-animation {
        grid-area: 1/9/1/12; }

    #contact .contact-content {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: auto; }
      #contact .contact-content h3 {
        grid-area: 1/2/1/12;
        text-align: center; }
      #contact .contact-content form {
        grid-area: 2/4/2/10;
        align-self: flex-start;
        justify-self: center; }
      #contact .contact-content .form--success--message {
        grid-area: 2/4/2/10;
        text-align: center;
        align-self: flex-start; }

    .basic-landing {
      height: 100vh;
      overflow-y: hidden;
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: auto 80vh; }
      .basic-landing .title-banner {
        grid-area: 1/1/1/13; }
      .basic-landing .basic-landing-content {
        grid-area: 2/1/2/7;
        padding: 10%;
        display: grid; }
        .basic-landing .basic-landing-content h2 {
          text-align: left; }
        .basic-landing .basic-landing-content a {
          align-self: flex-start;
          justify-self: center; }
      .basic-landing .basic-landing-image {
        grid-area: 2/9/2/13; }

    .service-body {
      display: grid; }
      .service-body .service-block {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: auto;
        margin: 100px 0; }
      .service-body .service-block:nth-last-of-type(even) .service-block-text {
        grid-area: 1/8/1/13;
        align-self: center; }
      .service-body .service-block:nth-last-of-type(even) img {
        grid-area: 1/1/1/7; }
      .service-body .service-block:nth-last-of-type(odd) .service-block-text {
        grid-area: 2/1/2/7;
        align-self: center; }
      .service-body .service-block:nth-last-of-type(odd) img {
        grid-area: 2/8/2/13; }
      .service-body .page-end-icon {
        justify-self: center;
        margin: 50px 0; }

    .service-nav {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: 1fr; }
      .service-nav a {
        font-size: 21px; }
      .service-nav .next, .service-nav .prev {
        margin: 0; }
      .service-nav .next {
        grid-area: 1/6/1/13;
        justify-self: flex-end; }
      .service-nav .prev {
        grid-area: 1/1/1/7; }

    .about-body {
      padding: 100px 0;
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-template-rows: auto; }
      .about-body h2 {
        grid-area: 1/3/1/11; }
      .about-body .values-intro {
        grid-area: 2/4/2/10; }
      .about-body .horizontal-line:nth-last-of-type(1) {
        grid-area: 3/3/3/11;
        width: 100%; }
      .about-body .values-canvas {
        grid-area: 4/3/4/11;
        display: grid;
        grid-template-columns: repeat(8, minmax(0, 1fr));
        grid-template-rows: auto;
        grid-gap: 30px 0;
        grid-template-areas: 'val-one val-one . val-two val-two . val-three val-three' 'val-four val-four . content content content content content' 'val-five val-five . val-six val-six . val-seven val-seven'; }
        .about-body .values-canvas h3 {
          font-size: 1.3em; }
        .about-body .values-canvas .value-item-block:nth-of-type(1) {
          grid-area: val-one; }
        .about-body .values-canvas .value-item-block:nth-of-type(2) {
          grid-area: val-two; }
        .about-body .values-canvas .value-item-block:nth-of-type(3) {
          grid-area: val-three; }
        .about-body .values-canvas .value-item-block:nth-of-type(4) {
          grid-area: val-four; }
        .about-body .values-canvas .value-item-block:nth-of-type(5) {
          grid-area: val-five; }
        .about-body .values-canvas .value-item-block:nth-of-type(6) {
          grid-area: val-six; }
        .about-body .values-canvas .value-item-block:nth-of-type(7) {
          grid-area: val-seven; }
        .about-body .values-canvas .value-content-block {
          grid-area: content;
          display: grid;
          grid-template-columns: 2fr 1fr;
          grid-template-rows: auto;
          grid-template-areas: "title nav" "content-text content-text"; }
          .about-body .values-canvas .value-content-block h3 {
            font-size: 1.5em; }
          .about-body .values-canvas .value-content-block h3 {
            grid-area: title; }
          .about-body .values-canvas .value-content-block p {
            grid-area: content-text; }
          .about-body .values-canvas .value-content-block .val-nav {
            grid-area: nav;
            display: flex;
            justify-content: space-around; }
      .about-body .horizontal-line:nth-last-of-type(2) {
        grid-area: 5/3/5/11;
        width: 100%; }
      .about-body .page-end-icon {
        grid-area: 6/6/6/8; } }
  /* Large devices (laptops/desktops, 992px and up) */
  @media only screen and (min-width: 992px) {
    #landing .landing-content h2 {
      font-size: 60px; } }
  /* Extra large devices (large laptops and desktops, 1200px and up) */ }