@font-face {
   font-family: "Inter";
   font-style: normal;
   font-weight: 400;
   src: url("../../fonts/inter/Inter-Regular.woff2?v=3.19") format("woff2"), url("../../fonts/inter/Inter-Regular.woff?v=3.19") format("woff");
}
@font-face {
   font-family: "Inter";
   font-style: normal;
   font-weight: 500;
   src: url("../../fonts/inter/Inter-Medium.woff2?v=3.19") format("woff2"), url("../../fonts/inter/Inter-Medium.woff?v=3.19") format("woff");
}
@font-face {
   font-family: "Inter";
   font-style: normal;
   font-weight: 600;
   src: url("../../fonts/inter/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("../../fonts/inter/Inter-SemiBold.woff?v=3.19") format("woff");
}
:root {
   --family: "Inter";
   --family-welcome: "Inter";
   --width: 500px;
   --padding: 15px;
   --primary: #BC3748;
   --grey: #4A4A4A;
   --light-grey: #646464;
   --text-color: #484848;
   --text-font: 22px;
   --header-1-font-size: 36px;
   --header-2-font-size: 32px;
   --header-4-font-size: 24px;
   --text-4-font-size: 18px;
}

@media (max-width: 557px) {
   :root {
      --header-1-font-size: 32px;
      --header-2-font-size: 26px;
      --header-4-font-size: 20px;
   }
}
* {
   margin: 0;
   padding: 0;
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
   font-family: "Inter";
   font-weight: 400;
   line-height: normal;
   font-style: normal;
}

a {
   text-decoration: none;
}

button {
   background: transparent;
   border: none;
   padding: 0;
}
button:hover {
   cursor: pointer;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
   margin: 0;
}

ul, ol {
   margin: 0;
   padding: 0;
   list-style: none;
}

.main-container {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: center;
       -ms-flex-pack: center;
           justify-content: center;
   min-height: 100vh;
}
.main-container__element {
   margin-top: 140px;
   margin-bottom: 50px;
   max-width: calc(var(--padding) + var(--padding) + var(--width));
   padding: var(--padding);
}
@media (max-width: 556px) {
   .main-container__element {
      margin-top: 60px;
   }
}

.content__logo {
   height: 80px;
   text-align: center;
}
.content__logo-img {
   height: 100%;
}
.content__desc {
   margin-top: 22px;
   text-align: center;
   color: var(--text-color);
   font-family: var(--family-welcome);
   font-weight: 400;
   font-size: 18px;
   line-height: 21.78px;
}
@media (max-width: 557px) {
   .content__desc {
      font-size: 17px;
      line-height: 19.6px;
   }
}
.content__desc b {
   color: var(--primary);
   font-weight: 600;
   font-family: inherit;
}
.content__link {
   font-family: var(--family-welcome);
   font-weight: 500;
   font-size: 24px;
   margin: 22px auto 0;
   color: white;
   max-width: 380px;
   width: 100%;
   background-color: var(--primary);
   border-radius: 50px;
   height: 80px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: center;
       -ms-flex-pack: center;
           justify-content: center;
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
}
.content__navigate {
   margin-top: 16px;
}

.navigate {
   text-align: center;
}
.navigate__link {
   font-family: var(--family-welcome);
   font-weight: 400;
   font-size: 15px;
   display: inline-block;
   line-height: 21px;
   color: var(--grey);
   margin: 0 10px;
}

.close-page {
   position: fixed;
   top: 28px;
   right: 28px;
}
@media (max-width: 557px) {
   .close-page {
      display: none;
      visibility: hidden;
      opacity: 0;
   }
}
.close-page__img {
   display: block;
   width: 36px;
   height: 36px;
}

.wrap-container {
   max-width: 1000px;
   padding: 0 20px;
   width: 100%;
   margin: 0 auto;
}
@media (max-width: 575px) {
   .wrap-container {
      padding: 0 15px;
   }
}

.main-content {
   margin: 50px 0;
}

.privacy,
.imprint,
.terms {
   color: var(--light-grey);
   font-size: var(--text-4-font-size);
}
.privacy .btn__back,
.imprint .btn__back,
.terms .btn__back {
   background-color: #cacaca;
   color: #222222;
   border-radius: 7px;
   padding: 10px 30px;
   display: inline-block;
   font-size: 22px;
   font-weight: 500;
   margin-bottom: 30px;
   opacity: 0.8;
}
.privacy h1,
.imprint h1,
.terms h1 {
   font-size: var(--header-1-font-size);
   font-weight: 600;
   margin-bottom: 22px;
}
.privacy h2,
.imprint h2,
.terms h2 {
   font-size: var(--header-2-font-size);
   margin-top: 30px;
   margin-bottom: 22px;
   font-weight: 600;
}
.privacy h3,
.imprint h3,
.terms h3 {
   font-size: var(--header-4-font-size);
   font-weight: 600;
}
.privacy h1, .privacy h2, .privacy h3,
.imprint h1,
.imprint h2,
.imprint h3,
.terms h1,
.terms h2,
.terms h3 {
   color: #242424;
}
.privacy h3, .privacy p, .privacy ul, .privacy ol,
.imprint h3,
.imprint p,
.imprint ul,
.imprint ol,
.terms h3,
.terms p,
.terms ul,
.terms ol {
   margin-bottom: 15px;
}
.privacy p, .privacy li, .privacy a,
.imprint p,
.imprint li,
.imprint a,
.terms p,
.terms li,
.terms a {
   font-weight: 400;
}
.privacy a,
.imprint a,
.terms a {
   word-break: break-all;
}
.privacy ul > li,
.imprint ul > li,
.terms ul > li {
   margin-left: 16px;
}
.privacy ul.dotted > li,
.imprint ul.dotted > li,
.terms ul.dotted > li {
   margin-left: 16px;
   padding-left: 22px;
   position: relative;
}
.privacy ul.dotted > li::before,
.imprint ul.dotted > li::before,
.terms ul.dotted > li::before {
   content: "";
   height: 0.65rem;
   width: 0.65rem;
   background-color: var(--grey);
   border-radius: 50%;
   position: absolute;
   top: calc(50% - 1px);
   left: 0;
   -webkit-transform: translateY(-50%);
           transform: translateY(-50%);
}
.privacy a,
.imprint a,
.terms a {
   color: var(--primary);
}
