@charset "UTF-8";
/*
Theme Name: CaptureTech theme
Theme URI: n/a
Author: YBOP & Kornuiten.com
Author URI: https://youngbirdsofparadise.com/
Description: CaptureTech custom theme!
Version: 1.0.0
Text Domain: capturetech-theme
*/

/*
	Table of content
    1. GENERAL
      1.1 Headings
      1.2 Text
      1.3 Lists
        1.3.1 Arrow list
        1.3.2 Check list
        1.3.3 Step list
      1.4 Initials
      1.5 Buttons
      1.6 Colors
      1.7 Labels
      1.8 WP default styles
    2. HEADER
      2.1 Logo
      2.2 Nav wrapper
        2.2.1 Nav - See assets/css/nav.css
        2.2.2 Search
        2.2.3 WPML
        2.2.4 Hamburger
    3. MAIN
      3.1 Notification
      3.2 Breadcrumbs
      3.3 Sliders - See assets/css/sliders.css
      3.4 Grid - See assets/css/grid.css
      3.5 Content - See assets/css/content.css
      3.6 Headers - See assets/css/headers.css
      3.7 Forms - See assets/css/forms.css
    4. MODALS - See assets/css/modals.css
    5. FOOTER
      5.1 Goto top wrapper
      5.2 Footer (section)
        5.2.1 Top
          5.2.1.0 ISO
          5.2.1.1 Nav - See assets/css/nav.css
          5.2.1.2 Socials
          5.2.1.3 Logo
        5.2.2 Bottom
      5.3 WPML
    6. RESIZE
    7. FONT FACE
*/

/* 1. GENERAL */
:root {
  --grid-size-fw: 100%;
  --grid-size-xl: 160rem;
  --grid-size-lg: 130rem;
  --grid-size-md: 108rem;
  --grid-size-sm: 86rem;
  --grid-padding: 2rem;
  --color-black: black;
  --color-blue: #00baff;
  --color-darkblue: #1ea7e5;
  --color-red: #f03c5a;
  --color-darkred: #cc334d;
  --color-grey: #969696;
  --color-lightgrey: #f4f4f4;
}

* {
  box-sizing: border-box;
  outline: 0;
}

html,
body {
  margin: 0;
}

html {
  font-size: 62.5%;
}

body {
  font-family: "Roboto", sans-serif;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 1.7;
  color: var(--color-black);
  overflow-x: hidden;
}

/* 1.1 Headings */
h1,
h2,
h3,
h4 {
  margin: 0 0 1.5rem;
  font-family: "Mont";
  font-weight: 700;
}

h1 {
  font-size: 4.5rem;
  line-height: 1.1;
  color: var(--color-blue);
}

h2,
h3,
h4 {
  line-height: 1.2;
}

h2 {
  font-size: 3.6rem;
}

h3 {
  font-size: 3rem;
}

h4 {
  font-size: 2.6rem;
}

/* 1.2 Text */
p {
  margin: 0 0 3rem;
}

p.large {
  font-size: 2.1rem;
  line-height: 1.5;
}

p:empty {
  display: none;
}

p:last-child {
  margin: 0;
}

a {
  color: var(--color-black);
  text-decoration: underline;
  transition: 0.4s;
}

a:hover {
  color: var(--color-red);
}

.white a {
  color: white;
}

.light {
  font-weight: 300;
}

section:not(.footer) p a:not(.btn, .no-underline) {
  box-shadow: inset 0 0 0 0 var(--color-red);
  color: var(--color-red);
  margin: 0 -0.25rem;
  padding: 0 0.25rem;
  transition:
    color 0.4s ease-in-out,
    box-shadow 0.4s ease-in-out;
}

section:not(.footer) p a:not(.btn, .no-underline):hover {
  box-shadow: inset 30rem 0 0 0 var(--color-red);
  color: white;
}

/* 1.3 Lists */
main ul,
main ol {
  list-style-type: none;
  margin: 0 0 3rem;
  padding-left: 3rem;
}

main ul:last-child,
main ol:last-child {
  margin: 0;
}

main ol {
  counter-reset: counter;
}

main li {
  position: relative;
}

main ul:not(.arrow-list):not(.check-list) > li::before {
  content: "\f111";
  position: absolute;
  top: 0.8rem;
  left: -3rem;
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
  font-size: 0.9rem;
  color: var(--color-blue);
}

main ol > li {
  counter-increment: counter;
}

main ol > li::before {
  content: counter(counter) ". ";
  position: absolute;
  top: 0;
  left: -3rem;
  font-size: 1.8rem;
  color: var(--color-blue);
}

/* 1.3.1 Arrow list */
ul.arrow-list {
  padding-left: 0;
  column-count: 2;
  column-gap: 5rem;
}

ul.arrow-list li {
  margin-bottom: 1rem;
}

ul.arrow-list a {
  position: relative;
  padding-left: 3rem;
  font-family: "Mont";
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-black);
  text-decoration: none;
  transition: 0.2s;
}

ul.arrow-list a::before {
  content: "";
  position: absolute;
  top: 0.2rem;
  left: 0;
  width: 1.5rem;
  height: 1.2rem;
  background-image: url(assets/images/icon-arrow2-black.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

ul.arrow-list a:hover {
  color: var(--color-red);
}

ul.arrow-list a:hover::before {
  background-image: url(assets/images/icon-arrow2-red.svg);
}

/* 1.3.2 Check list */
ul.check-list {
  padding-left: 3rem;
}

ul.check-list li {
  position: relative;
  margin-bottom: 0.5rem;
}

ul.check-list li::before {
  content: "";
  position: absolute;
  top: 0.8rem;
  left: -3rem;
  width: 1.6rem;
  height: 1.6rem;
  background-image: url(assets/images/icon-checkmark-blue.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/* 1.3.3 Step list */
ol.step-list {
  padding-left: 7rem;
}

ol.step-list li::before {
  content: "Stap " counter(counter) ": ";
  position: absolute;
  top: 0;
  left: -7rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--color-blue);
}

/* 1.4 Initials */
section {
  padding: 0 var(--grid-padding);
}

figure {
  margin: 0;
  padding: 0;
}

.row-fw,
.row-xl,
.row-lg,
.row-md,
.row-sm {
  width: 100%;
  margin: 0 auto;
}

.row-xl {
  max-width: var(--grid-size-xl);
}

.row-lg {
  max-width: var(--grid-size-lg);
}

.row-md {
  max-width: var(--grid-size-md);
}

.row-sm {
  max-width: var(--grid-size-sm);
}

.pt-lg {
  padding-top: 12rem;
}

.pt-md {
  padding-top: 8rem;
}

.pt-sm {
  padding-top: 4rem;
}

.pt-none {
  padding-top: 0;
}

.pb-lg {
  padding-bottom: 12rem;
}

.pb-md {
  padding-bottom: 8rem;
}

.pb-sm {
  padding-bottom: 4rem;
}

.pb-none {
  padding-bottom: 0;
}

.no_margin {
  margin: 0;
}

picture img,
.add-border-radius {
  border-radius: 1.3rem;
}

/* 1.5 Buttons */
.btns-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.btn {
  display: inline-block;
  padding: 1.46rem 4.7rem 1.26rem;
  border: 0.1rem solid var(--color-red);
  border-radius: 5rem;
  background-color: var(--color-red);
  font-family: "Mont";
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
  text-align: center;
  color: white;
}

.btn.blue {
  border-color: var(--color-blue);
  background-color: var(--color-blue);
  color: white;
}

.btn.outline {
  background-color: transparent;
  color: var(--color-red);
}

.btn:hover {
  border-color: var(--color-darkred);
  background-color: var(--color-darkred);
  color: white;
}

.btn.blue:hover {
  border-color: var(--color-darkblue);
  background-color: var(--color-darkblue);
}

.btn.outline:hover {
  border-color: var(--color-red);
  background-color: var(--color-red);
  color: white;
}

.link {
  font-family: "Mont";
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-black);
}

.link:hover {
  color: var(--color-red);
}

/* 1.6 Colors */
.black {
  color: var(--color-black);
}

.white {
  color: white;
}

.blue {
  color: var(--color-blue);
}

/* 1.7 Labels */
.label {
  margin-bottom: 0.5rem;
  font-family: "Mont";
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.3;
  transition: 0.4s;
}

.label .cat:not(:first-child)::before {
  content: ", ";
}

/* 1.8 WP default styles */
.aligncenter {
  display: block;
  margin: 0 auto;
}

.wp-caption {
  width: 100% !important;
}

picture img {
  width: 100%;
  height: auto;
}

/* 2. HEADER */
header {
  position: sticky;
  z-index: 10;
  top: 0;
  width: 100%;
  padding: 0 var(--grid-padding);
  background-color: white;
}

header.scrolled {
  border-bottom: 0.1rem solid #eee;
}

header .container {
  height: 7rem;
  display: flex;
  transition: 0.4s;
}

/* 2.1 Logo */
header .logo {
  flex: 0 0 21rem;
  display: flex;
  align-items: center;
  transition: 0.4s;
}

header .logo a {
  display: flex;
}

header .logo img {
  width: 100%;
  height: auto;
}

/* 2.2 Nav wrapper */
header .nav-wrapper {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.25rem;
}

/* 2.2.1 Nav */
header nav {
  margin-right: 0.5rem;
}

header nav,
header .main-menu,
header .menu-main-menu-2-container,
header .menu-main-menu-2-en-container,
header ul.menu,
header ul.menu > li {
  height: 100%;
}

header ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

header ul.menu {
  display: flex;
  gap: 1.2rem;
}

header ul.menu > li {
  display: flex;
  align-items: center;
}

header ul.menu a {
  display: flex;
  align-items: center;
  font-family: "Mont";
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
}

header ul.menu li.menu-item-has-children {
  position: relative;
}

header ul.menu > li > a:hover {
  color: var(--color-black);
}

header ul.menu > li > a {
  padding: 1.1rem 2rem 0.9rem;
  border-radius: 5rem;
  background: white;
}

header ul.menu > li.current-menu-parent > a,
header ul.menu > li.current-menu-item > a,
header ul.menu > li > a:hover {
  box-shadow: 0 2px var(--color-red);
}

header ul.menu > li.current-menu-parent > a:before,
header ul.menu > li.current-menu-item > a:before {
  content: " ";
  display: block;
  width: 2rem;
  height: 1.6rem;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="16" fill="none"><path stroke="%236cc3c0" stroke-width="2" d="M17.417 4.627 7.6 14.412 1.417 8.246 4.7 4.973l2.96 2.95 6.531-6.511z"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  padding-right: 0.5rem;
}

header ul.menu > li.menu-btn > a {
  background-color: var(--color-red);
  font-size: 1.5rem;
  color: white !important;
}

header ul.menu > li.menu-btn.blue > a {
  background-color: var(--color-blue);
}

header ul.menu > li.menu-btn.current-menu-parent > a,
header ul.menu > li.menu-btn.current-menu-item > a,
header ul.menu > li.menu-btn > a:hover {
  box-shadow: none;
}

header ul.menu > li.menu-btn > a:hover {
  background-color: var(--color-darkred);
}

header ul.menu > li.menu-btn.blue > a:hover {
  background-color: var(--color-darkblue);
}

header ul.sub-menu {
  position: absolute;
  top: 6rem;
  left: -1.5rem;
  padding: 0.5rem;
  background-color: var(--color-black);
  display: none;
}

header ul.menu li.menu-item-has-children:hover ul.sub-menu {
  display: block;
}

header ul.sub-menu a {
  display: block;
  padding: 1.2rem 1.25rem 1rem;
  font-size: 1.5rem;
  font-weight: 600;
  color: white;
  white-space: nowrap;
  transition: 0.4s;
}

header ul.sub-menu a:hover {
  background-color: var(--color-blue);
}

/* 2.2.2 Search */
header .search {
  width: 4.8rem;
  height: 3.8rem;
  border-radius: 5rem;
  background-color: var(--color-lightgrey);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

header .search img {
  width: 2.2rem;
  height: 2rem;
  object-fit: contain;
  object-position: center;
}

/* 2.2.3 WPML */
.wpml-ls-legacy-dropdown {
  width: inherit;
  margin-top: 0.1rem;
}

.wpml-ls-legacy-dropdown a {
  padding: 0;
  border: 0;
  font-family: "Mont";
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-black);
}

.wpml-ls-legacy-dropdown .wpml-ls-current-language:hover > a,
.wpml-ls-legacy-dropdown a:focus,
.wpml-ls-legacy-dropdown a:hover {
  background: white;
  color: var(--color-black);
}

.wpml-ls-legacy-dropdown a.wpml-ls-item-toggle {
  padding: 0 1rem 0 0.5rem;
}

.wpml-ls-legacy-dropdown a.wpml-ls-item-toggle:after {
  top: 0.5rem;
  right: 0;
  color: #ddd;
}

.wpml-ls-legacy-dropdown .wpml-ls-sub-menu {
  border-top: 0;
}

.wpml-ls-legacy-dropdown .wpml-ls-sub-menu > li a {
  padding: 0.5rem;
  border-top: 0.1rem solid #ddd;
}

/* 2.2.4 Hamburger */
header .hamburger {
  position: fixed;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background-color: white;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  display: none;
}

header .hamburger img {
  width: 2rem;
  height: 1.4rem;
  object-fit: contain;
  object-position: center;
}

/* 3. MAIN */
/* 3.1 Notification */
.notification {
  background-color: var(--color-red);
}

.notification .container {
  padding: 1rem 0;
  font-size: 1.6rem;
  line-height: 1.3;
  color: white;
}

.notification a {
  color: white;
}

/* 3.2 Breadcrumbs */
.breadcrumbs-wrapper {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  min-height: 7rem;
  background-color: var(--color-lightgrey);
  display: flex;
  align-items: center;
  font-size: 1.3rem;
}

.breadcrumbs-wrapper a {
  text-decoration: none;
}

.breadcrumbs-wrapper a:hover,
.breadcrumbs-wrapper .breadcrumb_last {
  text-decoration: underline;
}

/* 3.3 Sliders - See assets/css/sliders.css */
/* 3.4 Grid - See assets/css/grid.css */
/* 3.5 Content - See assets/css/content.css */
/* 3.6 Headers - See assets/css/headers.css */
/* 3.7 Forms - See assets/css/forms.css */

/* 4. MODALS */
/* See assets/css/modals.css */

/* 5. FOOTER */
/* 5.1 Goto top wrapper */
.goto-top-wrapper {
  background: rgb(238, 238, 238);
  background: linear-gradient(90deg, rgba(244, 244, 244, 1) 50%, rgba(255, 255, 255, 1) 50%);
}

.goto-top-wrapper .row-146 {
  width: 100%;
  max-width: 146rem;
  height: 5rem;
  margin: 0 auto;
  padding: 0 var(--grid-padding);
  border-radius: 0 1.5rem 0 0;
  background-color: var(--color-lightgrey);
}

.goto-top-wrapper .container {
  display: flex;
  justify-content: flex-end;
}

.goto-top-wrapper .container > a {
  display: block;
  position: relative;
  bottom: -2.5rem;
}

.goto-top-wrapper .goto-top {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  background-color: var(--color-blue);
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0.1rem 0.1rem 1rem rgba(0, 0, 0, 0.16);
}

.goto-top-wrapper .goto-top img {
  width: 2rem;
  height: 2.2rem;
  object-fit: contain;
  object-position: center;
}

/* 5.2 Footer (section) */
.footer {
  background-color: var(--color-black);
  color: var(--color-grey);
}

.footer .container {
  padding-top: 10rem;
  padding-bottom: 5rem;
  display: flex;
  flex-direction: column;
  gap: 7rem;
}

.footer a {
  font-size: 1.6rem;
  line-height: 1.3;
  color: var(--color-grey);
  text-decoration: none;
}

.footer a:hover {
  color: white;
  text-decoration: underline;
}

.footer ul.menu {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.footer ul.menu li.header > a {
  font-family: "Mont";
  font-weight: 700;
  color: white;
}

.footer ul.sub-menu {
  display: none;
}

/* 5.2.1 Top */
.footer .top {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 2fr;
  grid-gap: 5rem;
}

.footer .top .col {
  position: relative;
}

.footer .top .col:last-child {
  text-align: center;
}

.footer .top .col:last-child a {
  display: block;
}

.footer .top .col:last-child .iso {
  display: none;
}

/* 5.2.1.0 ISO */
.footer .iso {
  position: absolute;
  bottom: 0;
  width: 100%;
  max-width: 18rem;
  height: auto;
}

.footer .iso img {
  width: 100%;
}

/* 5.2.1.1 Nav - See assets/css/nav.css */

/* 5.2.1.2 Socials */
.footer .top .socials {
  margin-top: 2rem;
  display: flex;
  gap: 0.5rem;
}

.footer .top .socials a {
  text-decoration: none;
}

.footer .top .socials i {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background-color: #292929;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  color: white;
  transition: 0.4s;
}

.footer .top .socials i:hover {
  background-color: var(--color-blue);
}

/* 5.2.1.3 Logo */
.footer .top .logo img {
  width: 100%;
  max-width: 25rem;
}

/* 5.2.2 Bottom */
.footer .bottom {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.footer .bottom .col:first-child {
  font-size: 1.4rem;
}

.footer .bottom .col:last-child {
  font-family: "Mont";
  font-size: 1.8rem;
  font-weight: 300;
  color: white;
  text-align: right;
}

/* 5.3 WPML */
.otgs-development-site-front-end {
  display: none;
}

/* 6. RESIZE */
@media (max-width: 1199px) {
  /* 2. HEADER */
  header {
    position: relative;
    top: inherit;
  }

  /* 2.2.1 Nav */
  header nav {
    display: none;
  }

  /* 2.2.2 Search */
  header .search {
    display: none;
  }

  /* 2.2.3 WPML */
  header .wpml {
    display: none;
  }

  /* 2.2.4 Hamburger */
  header .hamburger {
    display: flex;
  }
}

@media (max-width: 1024px) {
  /* 5. FOOTER */
  /* 5.2.1 Top */
  .footer .top {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .footer .top .col:first-child .iso {
    display: none;
  }

  .footer .top .col:nth-child(3) {
    order: 4;
  }

  .footer .top .col:nth-child(4) {
    order: 5;
  }

  .footer .top .col:last-child {
    order: 3;
    grid-row: span 2;
  }

  .footer .top .col:last-child .iso {
    display: block;
    right: 0;
  }
}

@media (max-width: 767px) {
  /* 1. GENERAL */
  body {
    font-size: 1.6rem;
  }

  /* 1.1 Headings */
  h1,
  h2 {
    font-size: 3rem;
  }

  h3 {
    font-size: 2.6rem;
  }

  h4 {
    font-size: 2.2rem;
  }

  /* 1.2 Text */
  p.large {
    font-size: 1.8rem;
    line-height: 1.7;
  }

  /* 1.3 Lists */
  main ul,
  main ol {
    padding-left: 2.5rem;
  }

  main ul:not(.arrow-list):not(.check-list) li::before {
    top: 0.6rem;
    left: -2.5rem;
  }

  main ol li::before {
    left: -2.5rem;
    font-size: 1.6rem;
  }

  /* 1.3.1 Arrow list */
  ul.arrow-list {
    column-count: 1;
  }

  ul.arrow-list a {
    font-size: 1.8rem;
  }

  ul.arrow-list a::before {
    top: 0.1rem;
  }

  /* 1.3.2 Check list */
  ul.check-list {
    padding-left: 2.5rem;
  }

  ul.check-list li::before {
    top: 0.6rem;
    left: -2.5rem;
  }

  /* 1.3.3 Step list */
  ol.step-list {
    padding-left: 6.5rem;
  }

  ol.step-list li::before {
    left: -6.5rem;
    font-size: 1.6rem;
  }

  /* 1.4 Initials */
  .pt-lg {
    padding-top: 9rem;
  }

  .pt-md {
    padding-top: 6rem;
  }

  .pb-lg {
    padding-bottom: 9rem;
  }

  .pb-md {
    padding-bottom: 6rem;
  }

  /* 1.5 Buttons */
  .btn {
    padding: 1.1rem 3rem 0.75rem;
    font-size: 1.5rem;
  }

  /* 3. MAIN */
  /* 3.2 Breadcrumbs */
  .breadcrumbs-wrapper {
    padding-top: 0;
    padding-bottom: 0;
    min-height: 2.5rem;
  }

  .breadcrumbs-wrapper #breadcrumbs {
    display: none;
  }

  /* 5. FOOTER */
  /* 5.1 Goto top wrapper */
  .goto-top-wrapper .row-146 {
    height: 4rem;
  }

  .goto-top-wrapper .container > a {
    bottom: -2rem;
  }

  .goto-top-wrapper .goto-top {
    width: 4rem;
    height: 4rem;
  }

  .goto-top-wrapper .goto-top img {
    width: 1.6rem;
    height: 1.7rem;
  }

  /* 5.2 Footer (section) */
  .footer .container {
    padding-top: 7rem;
    gap: 5rem;
  }

  /* 5.2.1 Top */
  .footer .top {
    grid-template-columns: 1fr 2fr;
  }

  .footer .top .col:nth-child(-n + 3) {
    display: none;
  }

  .footer .top .col:nth-child(4) {
    order: 1;
  }

  .footer .top .col:last-child {
    text-align: right;
    order: 2;
  }

  .footer .top .col:last-child img {
    max-height: 17.5rem;
  }

  /* 5.2.2 Bottom */
  .footer .bottom {
    grid-template-columns: 1fr;
    grid-gap: 5rem;
  }

  .footer .bottom .col:first-child {
    order: 2;
  }

  .footer .bottom .col:last-child {
    order: 1;
    text-align: left;
  }
}

/* 7. FONT FACE */
@font-face {
  font-family: "Mont";
  src: url("assets/fonts/mont/200/Mont-ExtraLight.eot");
  src:
    url("assets/fonts/mont/200/Mont-ExtraLight.eot?#iefix") format("embedded-opentype"),
    url("assets/fonts/mont/200/Mont-ExtraLight.woff2") format("woff2"),
    url("assets/fonts/mont/200/Mont-ExtraLight.woff") format("woff"),
    url("assets/fonts/mont/200/Mont-ExtraLight.ttf") format("truetype"),
    url("assets/fonts/mont/200/Mont-ExtraLight.svg#Mont-ExtraLight") format("svg");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Mont";
  src: url("assets/fonts/mont/700/Mont-Bold.eot");
  src:
    url("assets/fonts/mont/700/Mont-Bold.eot?#iefix") format("embedded-opentype"),
    url("assets/fonts/mont/700/Mont-Bold.woff2") format("woff2"),
    url("assets/fonts/mont/700/Mont-Bold.woff") format("woff"),
    url("assets/fonts/mont/700/Mont-Bold.ttf") format("truetype"),
    url("assets/fonts/mont/700/Mont-Bold.svg#Mont-Bold") format("svg");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}