@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&display=swap");
html {
     font-family: "Roboto Condensed", sans-serif;
     scroll-behavior: smooth;
}

* {
     margin: 0;
     padding: 0;
     -webkit-box-sizing: border-box !important;
     -moz-box-sizing: border-box !important;
     box-sizing: border-box !important;
}

body {
     line-height: 1.6;
     overflow-x: hidden;
     font-size: 17px;
     background: #000;
}

.inner-body {
     overflow-x: hidden;
}

a {
     text-decoration: none;
     color: inherit;
}

li {
     list-style: none;
}

svg,
img {
     width: 100%;
}

.container {
     max-width: 1000px;
     margin: auto;
}

button {
     outline: none;
     font-family: "Roboto Condensed", sans-serif;
}

input {
     font-family: "Roboto Condensed", sans-serif;
     outline: none;
}

textarea {
     font-family: "Roboto Condensed", sans-serif;
     outline: none;
}

textarea::-webkit-input-placeholder {
     font-family: "Roboto Condensed", sans-serif;
}

textarea:-moz-placeholder {
     font-family: "Roboto Condensed", sans-serif;
}

textarea::-moz-placeholder {
     font-family: "Roboto Condensed", sans-serif;
}

textarea:-ms-input-placeholder {
     font-family: "Roboto Condensed", sans-serif;
}

textarea::-ms-input-placeholder {
     font-family: "Roboto Condensed", sans-serif;
}

textarea::placeholder {
     font-family: "Roboto Condensed", sans-serif;
}

a {
     color: inherit;
}

h1 {
     font-size: 30px;
     font-style: normal;
     font-weight: 700;
     line-height: normal;
     color: #fff;
}

h2 {
     font-weight: 700;
     line-height: 1;
     color: #191a1b;
     font-size: 48px;
}

.c-g {
     color: #4f4947;
}

.inner-body {
     overflow-x: hidden;
}

.btn-m {
     background: #000;
     padding: .8rem 2.2rem;
     font-size: 18px;
     color: #fff;
     border: 1px solid #fff;
     font-weight: 400;
     display: flex;
     align-items: center;
     cursor: pointer;
     margin: 0 auto;
     background: #fff;
     color: #000;
 }

.btn-m img {
     max-width: 15px;
     width: 0px;
     transition: width 0.3s ease;
}

.btn-m:hover img {
     margin-left: 10px;
     width: 15px;
}

.whatsapp {
     position: fixed;
     bottom: 30px;
     right: 30px;
     width: 50px;
     display: flex;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
     background: #fff;
     height: 50px;
}

.whatsapp img {
     max-width: 25px;
}

.bold {
     font-weight: 700;
}

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

section {
     padding: 4rem 1.5rem;
}

.bg-g {
     background: #f3f3f3;
}

.mt-20 {
     margin-top: 20px;
}

.mt-30 {
     margin-top: 30px;
}

.mt-10 {
     margin-top: 10px;
}

.g-30 {
     display: grid;
     grid-template-columns: 1fr;
     grid-gap: 30px;
}

.g-20 {
     display: grid;
     grid-template-columns: 1fr;
     grid-gap: 20px;
}

.g-10 {
     display: grid;
     grid-template-columns: 1fr;
     grid-gap: 10px;
}

.vacatures {
     display: grid;
     grid-template-columns: 1fr 1fr;
     grid-gap: 80px;
     align-items: flex-start;
}

.vacatures .vacature {
     color: #fff;
     display: grid;
     grid-template-columns: 1fr;
     grid-gap: 20px;
}

.vacatures .vacature ul {
     display: grid;
     grid-template-columns: 1fr;
     grid-gap: 10px;
}

.vacatures .vacature ul li {
     padding-left: 1rem;
     font-size: 14px;
     position: relative;
}

.vacatures .vacature ul li::before {
     content: "";
     position: absolute;
     top: 8px;
     left: 0;
     width: 4px;
     height: 4px;
     background: #fff;
     border-radius: 50%;
}

@media only screen and (max-width: 1300px) {
     h1 {
          font-size: 24px;
     }
     h2 {
          font-size: 32px;
     }
     h3 {
          font-size: 18px;
     }
     .f-xl {
          font-size: 24px;
     }
     .f-l {
          font-size: 20px;
     }
     .f-r {
          font-size: 16px;
     }
     body {
          font-size: 15px;
     }
}

@media only screen and (max-width: 970px) {
     .g-30 {
          grid-gap: 20px;
     }

     .vacatures {
          grid-template-columns: 1fr;
          grid-gap: 30px;
     }
}

@media only screen and (max-width: 650px) {
     .f-l {
          font-size: 16px;
     }

     p {
          font-size: 17px;
     }

     section {
          padding: 2rem 1rem;
     }
}