/* ––––––––––––––––––––––––––––––––––––––––––– FADE -- */

.fade_container {
position: fixed;
margin 0px;
padding: 0px;
display: flex;
align-items: center;
justify-content: center;
z-index: 10000000000000;
top: 0;
left: 0;
right: 0;
background: rgba(255,255,255,1);
opacity: 1;
transition: opacity 0.3s;
height: 100%;
width: 100%;
}

.fade_spinner {
      width: 30px;
      height: 30px;
      border: 2px solid rgba(0,0,0,0.2); /* Серый цвет */
      border-top: 2px solid rgba(0,0,0,0.6); /* Синий цвет верхнего сектора */
      border-radius: 50%; /* Круглая форма */
      animation: spin 1s linear infinite; /* Анимация вращения */
    }

    /* Анимация */
    @keyframes spin {
      0% {
        transform: rotate(0deg);
      }
      100% {
        transform: rotate(360deg);
      }
    }

/* ––––––––––––––––––––––––––––––––––––––––––– FONTS -- */

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-Italic.woff2') format('woff2'),
        url('/fonts/TTCommons-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-ExtraBoldItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-BlackItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-ExtraLightItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-ExtraLightItalic.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-LightItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-DemiBold.woff2') format('woff2'),
        url('/fonts/TTCommons-DemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-Black.woff2') format('woff2'),
        url('/fonts/TTCommons-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-Bold.woff2') format('woff2'),
        url('/fonts/TTCommons-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-ExtraBold.woff2') format('woff2'),
        url('/fonts/TTCommons-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-BoldItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-DemiBoldItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-DemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-ExtraLight.woff2') format('woff2'),
        url('/fonts/TTCommons-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-MediumItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-Medium.woff2') format('woff2'),
        url('/fonts/TTCommons-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-Light.woff2') format('woff2'),
        url('/fonts/TTCommons-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-Thin.woff2') format('woff2'),
        url('/fonts/TTCommons-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-Regular.woff2') format('woff2'),
        url('/fonts/TTCommons-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'Poppins';
    src: url('/fonts/TTCommons-ThinItalic.woff2') format('woff2'),
        url('/fonts/TTCommons-ThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}





@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Mono Trl';
    src: url('/fonts/TATOMonoTrl-BoldIt.woff2') format('woff2'),
        url('/fonts/TATOMonoTrl-BoldIt.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Mono Trl';
    src: url('/fonts/TATOMonoTrl-Bold.woff2') format('woff2'),
        url('/fonts/TATOMonoTrl-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Mono Trl';
    src: url('/fonts/TATOMonoTrl-It.woff2') format('woff2'),
        url('/fonts/TATOMonoTrl-It.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO XBd Outline Trl';
    src: url('/fonts/TATO-XBdOutline.woff2') format('woff2'),
        url('/fonts/TATO-XBdOutline.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-BoldIt.woff2') format('woff2'),
        url('/fonts/TATOTrl-BoldIt.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TT Atnms Mn Trl Vr It';
    src: url('/fonts/TTAtnmsMnTrlVrIt.woff2') format('woff2'),
        url('/fonts/TTAtnmsMnTrlVrIt.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO XBd Outline Trl';
    src: url('/fonts/TATO-XBdOutlineIt.woff2') format('woff2'),
        url('/fonts/TATO-XBdOutlineIt.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TT Atnms Mn Trl Vr Rmn';
    src: url('/fonts/TTAtnmsMnTrlVrRmn.woff2') format('woff2'),
        url('/fonts/TTAtnmsMnTrlVrRmn.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Mono Trl';
    src: url('/fonts/TATOMonoTrl-Medium.woff2') format('woff2'),
        url('/fonts/TATOMonoTrl-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Mono Trl';
    src: url('/fonts/TATOMonoTrl-MediumIt.woff2') format('woff2'),
        url('/fonts/TATOMonoTrl-MediumIt.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Mono Trl';
    src: url('/fonts/TATOMonoTrl-Regular.woff2') format('woff2'),
        url('/fonts/TATOMonoTrl-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-DemiBoldIt.woff2') format('woff2'),
        url('/fonts/TATOTrl-DemiBoldIt.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-Bold.woff2') format('woff2'),
        url('/fonts/TATOTrl-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-LightIt.woff2') format('woff2'),
        url('/fonts/TATOTrl-LightIt.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-DemiBold.woff2') format('woff2'),
        url('/fonts/TATOTrl-DemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-Light.woff2') format('woff2'),
        url('/fonts/TATOTrl-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-ExtraBold.woff2') format('woff2'),
        url('/fonts/TATOTrl-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trial Variable';
    src: url('/fonts/TATOTrialVariable.woff2') format('woff2'),
        url('/fonts/TATOTrialVariable.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-Medium.woff2') format('woff2'),
        url('/fonts/TATOTrl-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-It.woff2') format('woff2'),
        url('/fonts/TATOTrl-It.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-MediumIt.woff2') format('woff2'),
        url('/fonts/TATOTrl-MediumIt.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-ExtraLightIt.woff2') format('woff2'),
        url('/fonts/TATOTrl-ExtraLightIt.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-ExtraLight.woff2') format('woff2'),
        url('/fonts/TATOTrl-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-Regular.woff2') format('woff2'),
        url('/fonts/TATOTrl-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
-webkit-font-smoothing: none;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: subpixel-antialiased;

    font-family: 'TATO Trl';
    src: url('/fonts/TATOTrl-ExtraBoldIt.woff2') format('woff2'),
        url('/fonts/TATOTrl-ExtraBoldIt.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}











/* ––––––––––––––––––––––––––––––––––––––––––– DOCUMENT -- */

body, html {
height: 100%;
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
margin: 0px;
padding: 0px;
position: relative;
top: 0px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-smoothing: antialiased;
scroll-behavior: smooth;
}

body {
  touch-action: pan-x pan-y;
}

/* ––––––––––––––––––––––––––––––––––––––––––– HEADER -- */

.header_container {
height: 70px;
width: 100%;
position: fixed;
top: 0px;
right: 0;
left: 0;
margin: 0px auto;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: rgba(255,255,255,1);
z-index: 10;
display: block;
transition: all 0.3s;
border-bottom: 1px solid rgba(0,0,0,0);
}
.header {
box-sizing: border-box;
-webkit-box-sizing: border-box;
height: 70px;
width: 100%;
margin: 0px auto;
right: 0;
left: 0;
max-width: 1340px;
/* background: black; */
display: flex;
align-items: center;
justify-content: space-between;
padding: 0px 30px;
}

.logo_container {
display: flex;
align-items: center;
}
.logo {
width: 240px;
height: auto;
display: inline-flex;
}
.logo:hover {
cursor: pointer;
}
.logo_link {
display: flex;
align-items: center;
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.logo_tagline {
font-size: 9px;
line-height: 12.5px;
width: 140px;
text-align: left;
margin: 0px 0px 0px 10px;
padding: 0px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: 620;
position: relative;
display: inline-flex;
text-transform: uppercase;
color: rgba(0,0,0,0.3);
font-smooth: always;
-webkit-font-smoothing: antialiased;
letter-spacing: 2px;
}

.menu_container {
display: flex;
gap: 20px;
opacity: 1;
top: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
transition: opacity 0.3s;
}

.menu_item, a.menu_item, a:visited.menu_item {
text-decoration: none;
color: rgba(0,0,0,1);
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: 500;
font-size: 18px;
opacity: 0.4;
transition: opacity 0.3s;
}
.menu_item:hover, a.menu_item:hover {
cursor: pointer;
opacity: 1;
transition: opacity 0.3s;
}
.menu_icon {
display: none;
}


.menu_item.active {
opacity: 1;
text-decoration: underline;
}


@media all and (max-width: 768px) {

.logo_tagline {
display: none;
}

.menu_container {
display: none;
opacity: 0;
position: fixed;
height: 100%;
width: 100%;
padding: 30px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: rgba(255,255,255,1);
z-index: 10;
top: 70px;
left: 0px;
}
.menu_item, a.menu_item {
font-size: 28px;
display: block;
text-align: left;
margin: 0px 0px 10px 0px;
}

.menu_icon {
display: flex;
width: 16px;
height: auto;
padding: 0px;
margin: 0px;
}
.menu_icon:hover {
cursor: pointer;
}

}


/* ====== BUY DROPDOWN ====== */

.buy_item {
  position: relative;
}

/* Ссылки внутри dropdown */
.buy_dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  display: flex;
  flex-direction: column;
  background: white;
  border: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
  padding: 10px 15px;
  border-radius: 8px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: all 0.25s ease;
  /* min-width: 180px; */
  z-index: 20;
  width: fit-content;
}

.dropdown_link {
  font-size: 16px;
  color: rgba(0,0,0,0.8);
  text-decoration: none;
  padding: 5px 0;
  transition: color 0.2s;
  width: fit-content;
  text-wrap: nowrap;
}

.dropdown_link:hover {
  color: black;
}

/* Наведение на Buy (только desktop) */
@media (min-width: 769px) {
  .buy_item:hover .buy_dropdown {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }
}

/* ====== MOBILE STYLE ====== */
/* ====== MOBILE STYLE ====== */
@media (max-width: 768px) {
  .buy_dropdown {
    position: static;
    border: none;
    box-shadow: none;
    padding: 0;
    margin-top: 5px;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transform: none;
    transition: max-height 0.3s ease, opacity 0.3s ease;
    pointer-events: none; /* добавь это */
  }

  .buy_item.open .buy_dropdown {
    opacity: 1;
    max-height: 300px;
    pointer-events: auto; /* и это! */
  }

  .dropdown_link {
    font-size: 22px;
    margin-left: 10px;
  }
}


/* ––––––––––––––––––––––––––––––––––––––––––– MAIN HERO -- */

.hero {
display: flex;
align-items: center;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: calc(100% - 20px);
max-width: 1300px;
left: 0;
right: 0;
margin: 70px auto 0px auto;
/* top: 70px; */
position: relative;
border-radius: 18px;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(174, 156, 134, 0.8)), url('/media/images/hv1.jpg');
background-position: center;
background-size: cover;
height: 100%;
max-height: 600px;
padding: 0px;
}
.hero_info_container {
display: block;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 50%;
padding: 0px 0px 0px 50px;
}
.hero_title {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
display: block;
color: rgba(0,0,0,1);
/* font-family: 'TATO Trl', Arial, Helvetica, Sans-Serif; */
font-family: 'Michroma', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 50px;
line-height: 60px;
text-transform: uppercase;
color: rgba(255,255,255,1);
text-align: left;
margin: 0px 0px 20px 0px;
}
.hero_subtitle {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
display: block;
color: rgba(0,0,0,1);
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
line-height: 25px;
color: rgba(255,255,255,1);
text-align: left;
margin: 0px 0px 30px 0px;
}
a.hero_button, a:visited.hero_button {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
height: 50px;
border-radius: 8px;
border: 1px solid rgba(255,255,255,0.4);
color: rgba(255,255,255,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
}
.button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
a.hero_button:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}


.hero_video_container {
display: flex;
align-items: center;
padding: 20px 50px 20px 20px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 50%;
}
.hero_video {
height: 320px;
width: 100%;
position: relative;
display: flex;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)), url('/media/images/video_thumb.jpg');
-webkit-box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4); 
box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4);
border: 1px solid rgba(255,255,255,0.1);
border-radius: 18px;
align-items: center;
justify-content: center;
background-position: center;
background-size: cover;
transition: transform 0.3s;
transform: scale(1);
}
.hero_video:hover {
transition: transform 0.3s;
transform: scale(1.01);
}
.video_circle {
height: 80px;
width: 80px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: rgba(255,255,255,0.8);
backdrop-filter: blur(30px);
-webkit-box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4); 
box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4);
display: flex;
align-items: center;
justify-content: center;
border-radius: 40px;
transition: transform 0.3s;
transform: scale(1);
}
.video_play {
margin-right: -5px;
}

.video_circle:hover {
cursor: pointer;
transition: transform 0.3s;
transform: scale(1.05);
}

@media all and (max-width: 768px) {

.hero {
display: block;
height: auto;
}
.hero_info_container {
width: 100%;
padding: 30px;
}
.hero_video_container {
width: 100%;
padding: 0px 30px 30px 30px;
}
.hero_button {
width: 100%;
}
.hero_video {
left: 0;
right: 0;
margin: 0px auto;
width: 100%;
height: 220px;
}
.hero_title {
font-size: 32px;
line-height: 47px;
margin: 0px 0px 10px 0px;
}
.hero_subtitle {
margin: 0px 0px 20px 0px;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– ABOUT US -- */

/* 
.about_us_container {
display: flex;
align-items: top;
position: relative;
box-sizing: border-box;
-webkit-box-sizing: border-box;
margin: 0px;
padding: 0px;
width: 100%;
height: 530px;
}
 */

.about_us_container {
display: flex;
    align-items: top;
    position: relative;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin: 0px 0px 40px 0px;
    padding: 0px;
    width: 100%;
    height: auto;
}


/* 
.about_us_info {
display: block;
padding: 0px 340px 0px 0px;
text-align: left;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: calc(100% - 120px);
max-width: 1280px;
z-index: 3;
left: 0;
right: 0;
margin: 0px auto;
}
 */
 
.about_us_info {
    display: block;
    padding: 0px 400px 0px 0px;
    text-align: left;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: calc(100% - 120px);
    max-width: 1280px;
    z-index: 3;
    left: 0;
    right: 0;
    margin: 0px auto;
}

.about_us_title {
font-size: 32px;
color: rgba(0,0,0,1);
text-align: left;
margin: 60px 0px 30px 0px;
/* font-family: 'TATO Trl', Arial, Helvetica, Sans-Serif; */
font-family: 'Michroma', Arial, Helvetica, Sans-Serif;
font-weight: 300;
box-sizing: border-box;
-webkit-box-sizing: border-box;
text-transform: uppercase;
}
.about_us_big_text {
font-size: 32px;
line-height: 35.5px;
color: rgba(0,0,0,1);
text-align: left;
margin: 0px 0px 20px 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: 400;
}
.about_us_small_text {
font-size: 20px;
line-height: 26.5px;
color: rgba(0,0,0,0.4);
text-align: left;
margin: 0px 0px 30px 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: 400;
}
a.about_us_button, a:visited.about_us_button {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
height: 50px;
border-radius: 8px;
border: 1px solid rgba(0,0,0,0.4);
color: rgba(0,0,0,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
}
/* 
.button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
 */
a.about_us_button:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}



.about_us_image {
display: block;
position: absolute;
right: 0px;
width: auto;
height: 500px;
z-index: 2;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}

@media all and (max-width: 768px) {

.about_us_container {
display: block;
}

.about_us_info {
padding: 0px 30px 0px 30px;
width: 100%;
position: relative;
display: block;
z-index: 2;
}
.about_us_title {
margin: 30px 0px 20px 0px;
font-size: 28px;
}
.about_us_image {
position: relative;
margin-top: -10px;
z-index: 1;
float: right;
height: 400px;
}

.about_us_big_text {
font-size: 28px;
line-height: 32px;
}

a.about_us_button, a:visited.about_us_button {
width: 100%;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– CTA BANNER -- */

.banner_container {
width: calc(100% - 120px);
max-width: 1280px;
left: 0;
right: 0;
margin: 0px auto 0px auto;
box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 0px 50px 0px 0px;
background: linear-gradient(to right, rgba(52, 49, 47, 1), rgba(112, 104, 95, 1));
height: 160px;
border-radius: 18px;
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
}

.banner_info_container {
height: 100%;
position: relative;
padding: 0px;
margin: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
display: flex;
align-items: center;
}

.banner_image {
left: 0px;
position: relative;
height: 100%;
display: block;
margin: 0px;
padding: 0px;
border-radius: 18px 0px 0px 18px;
border-right: 1px solid rgba(255,255,255,0.1);
background: url('/media/images/video_thumb.jpg');
width: 280px;
background-position: center;
background-size: cover;
}
.banner_text {
font-size: 32px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: 400;
color: rgba(255,255,255,1);
text-align: left;
margin: 0px 0px 0px 50px;
}
.banner_icon {
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
position: relative;
display: block;
}

a.banner_link {
transform: scale(1);
transition: transform 0.3s;
}
a.banner_link:hover {
cursor: pointer;
transform: scale(1.1);
transition: transform 0.3s;
}

@media all and (max-width: 768px) {

.banner_container {
width: calc(100% - 60px);
padding: 0px 30px 0px 0px;
margin: 0px auto 0px auto;
left: 0px;
right: 0;
position: relative;
max-width: 100%;
height: 70px;
display: block;
clear: both;
}

.banner_link {
position: absolute;
top: 20px;
right: 20px;
}

.banner_image {
display: none;
}

.banner_text {
font-size: 18px;
margin: 0px 0px 0px 30px;
}

svg.banner_icon {
height: 30px;
width: 30px;
}

.banner_image {
width: 100px;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– BUY/SELL BANNERS -- */

.tiles_container {
width: 100%;
max-width: 1400px;
position: relative;
left: 0;
right: 0;
margin: 60px auto 0px auto;
box-sizing: border-box;
-webkit-box-sizing: border-box;
display: flex;
gap: 60px;
padding: 0px 60px;
}



.tile_outside {
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
display: block;
padding: 0px;
margin: 0px;
border-radius: 12px 12px 0px 8px;
border: 1px solid #cccccc;
z-index: 1;
}
.tile_outside:before {
content: "";
display: block;
padding-top: 60%;
}
.tile_corner {
height: 60px;
width: calc(100% - 240px);
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
right: -1px;
bottom: -1px;
border-radius: 12px 0px 0px 0px;
border-left: 1px solid #cccccc;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
z-index: 2;
}
.tile_radius_left, .tile_radius_left_under {
height: 20px;
width: 20px;
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
right: calc(100% - 242px);
bottom: -1px;

}
.tile_radius_top, .tile_radius_top_under {
height: 20px;
width: 20px;
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
right: -1px;
bottom: 58px;
}


.tile_radius_left {
border-radius: 0px 0px 12px 0px;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
z-index: 3;
}
.tile_radius_left_under {
border-radius: 0px 0px 0px 0px;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
z-index: 2;
}
.tile_radius_top {
border-radius: 0px 0px 12px 0px;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
z-index: 3;
}
.tile_radius_top_under {
border-radius: 0px 0px 0px 0px;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
z-index: 2;
}





a.banners_button, a:visited.banners_button {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
height: 49px;
border-radius: 8px;
background: rgba(173,144,114,1);
color: rgba(255,255,255,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
left: 10px;
bottom: 10px;
width: 220px;
}
.button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
a.banners_button:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}

.tile_image_container {
display: flex;
align-items: center;
justify-content: center;
padding: 0px;
left: 0;
right: 0;
margin: 0px auto 0px auto;
box-sizing: border-box;
-webkit-box-sizing: border-box;
height: 100%;
position: absolute;
top: 0px;
}

.tile_image {
width: auto;
margin-bottom: 50px;
}
.image_buy {
height: 60%;
}
.image_sell {
height: 40%;
}

.banner_info {
position: absolute;
display: block;
right: calc(100% - 360px);
bottom: 20px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 0px;
margin: 0px;
color: rgba(0,0,0,1);
text-align: left;
text-transform: uppercase;
/* font-family: 'TATO Trl', Arial, Helvetica, Sans-Serif; */
font-family: 'Michroma', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 12px;
}


@media all and (max-width: 768px) {

.tiles_container {
display: block;
margin: 30px auto 0px auto;
padding: 0px 30px;
}
.tile_outside {
margin-bottom: 30px;
}

.banner_info {
display: none;
}

a.banners_button, a:visited.banners_button {
width: 246px;
}
.tile_corner {
width: calc(100% - 265px);
}
.tile_radius_left, .tile_radius_left_under {
right: calc(100% - 267px);
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– CONTACT -- */

.contact_section {
width: calc(100% - 20px);
max-width: 1300px;
left: 0;
right: 0;
margin: 60px auto 0px auto;
padding: 0px;
border-radius: 18px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
overflow: hidden;
height: 600px;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), rgba(174, 156, 134, 0.4)), url('/media/images/map.jpg');
background-size: cover;
background-position: center;
display: flex;
align-items: center;
}
.form_container {
width: 500px;
height: calc(100% - 100px);
border-radius: 18px;
-webkit-box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4); 
box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4);
margin-left: 50px;
background: rgba(255,255,255,1);
padding: 20px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.pin_container {
width: calc(100% - 530px);
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}

.contact_pin {

}

.address {
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
line-height: 35.5px;
font-size: 26px;
color: rgba(0,0,0,1);
margin: 0px 0px 10px 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.form_list {
font-size: 20px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
color: rgba(0,0,0,0.4);
margin: 0px 0px 0px 15px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
line-height: 26.5px;
}

.form_list a, .form_list a:visited {
color: rgba(0,0,0,0.4);
text-decoration: none;
}

.form_list li::marker {
color: rgba(0,0,0,1);
}

.form_list_title {
color: rgba(0,0,0,1);
font-weight: 500;
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.message {
text-align: center;
margin-top: 15px;
color: green;
display: none;
}

#contactForm {
margin: 10px 0px 0px 0px;
display: blocl;
position: relative;
height: 336px;
}
#contactForm input[type="text"], #contactForm input[type="email"], #contactForm input[type="tel"], #contactForm textarea {
display: block;
border-top: none;
border-right: none;
border-left: none;
border-bottom: 1px solid rgba(0,0,0,0.1);
padding: 10px 0px 10px 0px;
margin: 0px 0px 10px 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 100%;
-webkit-appearance: none;
font-size: 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
color: rgba(0,0,0,1);
}

#contactForm input[type="text"]::placeholder, #contactForm input[type="email"]::placeholder, #contactForm input[type="tel"]::placeholder, #contactForm textarea::placeholder {
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
color: rgba(0,0,0,0.4);
font-size: 16px;
}

#contactForm label {
font-size: 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
color: rgba(0,0,0,1);
display: block;
}



#contactForm button {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
bottom: 20px;
height: 50px;
border-radius: 8px;
background: rgba(0,0,0,1);
color: rgba(255,255,255,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
border: none;
}
.button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
#contactForm button:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}

#contactForm label.checkbox-container {
display: flex;
align-items: center;
margin-top: 10px;
}
#contactForm .checkbox-container input {
margin: 4px 10px 0px 0px;
appearance: none;
width: 30px;
height: 30px;
border: none;
background: rgba(0,0,0,0.1);
border-radius: 8px;
position: relative;
cursor: pointer;
flex-shrink: 0;
}
.checkbox-container input:checked {
background-color: rgba(0,0,0,0.1);
}
.checkbox-container input:checked::after {
content: url('/media/icons/form_check.svg');
font-size: 16px;
/* color: white; */
position: relative;
left: 0px;
top: 6px;
}

.terms_conditions {
color: rgba(0,0,0,0.4);
line-height: 15px;
font-size: 14px;
}
.terms_link {
color: rgba(0,0,0,0.4);
text-decoration: underline;
}
.terms_link:hover {
cursor: pointer;
color: rgba(0,0,0,0.4);
text-decoration: none;
}

textarea {
  resize: none;
}
.contact_section_mobile {
display: none;
}

@media all and (max-width: 768px) {

#contactForm {
height: 347px;
margin-top: 20px;
}

.contact_section {
border-radius: 0px;
height: auto;
margin: 30px auto 0px auto;
width: 100%;
}
.form_container {
padding: 30px;
}
.contact_section .pin_container {
display: none;
}

.pin_container {
width: 100%;
}

.contact_section .form_container {
width: 100%;
height: 100%;
border-radius: 0px;
border-top: 1px solid rgba(0,0,0,0.1);
margin: 0px auto 0px auto;
padding: 30px 30px 0px 30px;
}

.contact_section_mobile {
width: calc(100% - 20px);
max-width: 1300px;
left: 0;
right: 0;
margin: 10px auto 0px auto;
padding: 0px;
border-radius: 18px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
overflow: hidden;
height: 250px;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), rgba(174, 156, 134, 0.4)), url('/media/images/map.jpg');
background-size: cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
}

#contactForm input, #contactForm textarea {
border-radius: 0px;
}

#contactForm button {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
bottom: 20px;
height: 50px;
border-radius: 8px;
background: rgba(0,0,0,1);
color: rgba(255,255,255,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
border: none;
width: 100%;
}

.address {
font-size: 24px;
line-height: 32px;
margin-bottom: 20px;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– FOOTER -- */

.footer {
display: block;
justify-content: center;
padding: 30px;
margin: 10px auto 0px auto;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: rgba(0,0,0,0.1);
border-radius: 18px;
left: 0;
right: 0;
width: calc(100% - 20px);
max-width: 1300px;
text-align: center;
bottom: 0px;
}
.footer_logo {
opacity: 0.4;
height: 20px;
width: auto;
margin: 30px auto 60px auto;
left: 0;
right: 0;
display: block;
position: relative;
}
.footer_separator {
background: rgba(0,0,0,0.1);
height: 1px;
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
display: block;
}
.footer_items {
display: inline-flex;
gap: 10px;
width: auto;
left: 0;
right: 0;
margin: 30px auto 0px auto;
}
a.footer_item, a:visited.footer_item {
font-size: 16px;
color: rgba(0,0,0,0.2);
margin: 0px;
padding: 0px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
text-decoration: none;
}
a.footer_item:hover {
text-decoration: underline;
cursor: pointer;
}

.footer_spacer {
display: block;
position: relative;
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
height: 10px;
width: 100%;
}

@media all and (max-width: 768px) {

.footer {
padding: 30px 30px 100px 30px;
}

.footer_logo {
height: 15px;
margin: 0px auto 30px auto;
}

.footer_items {
margin: 20px auto 0px auto;
flex-wrap: wrap;
justify-content: center;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– SKOOP TABLE -- */

table {
    width: calc(100% - 120px);
    border-collapse: collapse;
    font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
	font-weight: normal;
	font-size: 20px;
	max-width: 900px;
	display: block;
	left: 0;
	right: 0;
	margin: 60px auto 0px auto;
	padding: 0px 20px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	
	border-spacing: 0;
/*   border-collapse: separate; */
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,0.1);
  
  height: 500px;
  table-layout: fixed;
}





thead {
    display: block;
    width: 100%;
}

tbody {
    display: block;
    width: 100%;
    height: 440px;
    overflow-y: auto;
}


tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

th, td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}


table, th, td {
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

tr:last-of-type td {
border-bottom: none;
}

tr th, tr td {
    padding: 10px 20px;
    text-align: left;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

tr th:nth-of-type(1), tr td:nth-of-type(1) {
    width: 15%;
    padding-left: 0px;
}
tr th:nth-of-type(2), tr td:nth-of-type(2) {
    width: 60%;
}
tr th:nth-of-type(3), tr td:nth-of-type(3) {
    width: 10%;
}
tr th:nth-of-type(4), tr td:nth-of-type(4) {
    width: 15%;
    text-align: right;
    padding-right: 0px;
}

thead tr th {
height: 60px;
font-weight: normal;
color: rgba(0,0,0,0.4);
}

table button {
    padding: 5px 10px;
    margin: 5px;
    cursor: pointer;
}

/* Модальное окно */
.modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
}

.modal-content {
    background-color: white;
    margin: 15% auto;
    padding: 20px;
    width: 50%;
    border-radius: 10px;
}

.close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 30px;
    cursor: pointer;
}
#modal {
overflow: scroll;
}


#modal::-webkit-scrollbar {
display: none;
}

#search-input {
box-sizing: border-box;
-webkit-box-sizing: border-box;
border-radius: 8px;
max-width: 100%;
border: 1px solid rgba(0,0,0,0.2);
padding: 5px;
}


.sell_btn {
box-sizing: border-box;
-webkit-box-sizing: border-box;
color: rgba(173,144,114,1);
border: 1px solid rgba(173,144,114,0.4);
padding: 5px 15px;
border-radius: 8px;
font-size: 16px;
text-align: center;
background: none;
transition: transform 0.3s;
transform: scale(1);
}
.sell_btn:hover {
cursor: pointer;
transition: transform 0.3s;
transform: scale(1.05);
}


@media all and (max-width: 768px) {

table {
    width: calc(100% - 20px);
	font-size: 16px;
	max-width: 100%;
	margin: 10px auto 0px auto;
	padding: 0px 20px;
    border-radius: 18px;  
    height: 500px;
}

tr th:nth-of-type(1), tr td:nth-of-type(1) {
    width: 20%;
    padding-left: 0px;
    display: none;
}
tr th:nth-of-type(2), tr td:nth-of-type(2) {
    width: 55%;
    padding-left: 0px;
}
tr th:nth-of-type(3), tr td:nth-of-type(3) {
    width: 15%;
    padding-left: 0px;
}
tr th:nth-of-type(4), tr td:nth-of-type(4) {
    width: 30%;
    text-align: right;
    padding-right: 0px;
    padding-left: 0px;
}

tr th, tr td {
line-height: 26px;
}

.sell_btn {
padding: 5px 10px;
font-size: 12px;
}
tr {
max-width: 100%;
width: 100%;
}
#search-input {
width: 75px;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– SKOOP TABLE BUTTON -- */

.cta_banner {
width: 100%;
max-width: 900px;
height: 100px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
border-radius: 18px;
background: linear-gradient(to bottom, rgba(173, 144, 114, 1), rgba(133, 111, 88, 1));
position: relative;
margin: 60px auto 10px auto;
left: 0;
right: 0;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0px 35px;
}
.cta_banner_text {
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 32px;
color: rgba(255,255,255,1);
}
.cta_banner_icon {
transition: transform 0.3s;
transform: scale(1);
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.cta_banner_icon:hover {
cursor: pointer;
transition: transform 0.3s;
transform: scale(1.05);
}

@media all and (max-width: 768px) {

.cta_banner {
width: calc(100% - 20px);
height: 70px;
padding: 0px 20px;
margin: 10px auto -20px auto;
}

.cta_banner_text {
font-size: 18px;
}

.cta_banner_icon {
height: 30px;
width: 30px;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– SELL HERO -- */

.sell_hero {
display: flex;
align-items: center;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: calc(100% - 20px);
max-width: 1300px;
left: 0;
right: 0;
margin: 70px auto 0px auto;
/* top: 70px; */
position: relative;
border-radius: 18px;
background-image: url('/media/images/blur.jpg');
background-position: center;
background-size: cover;
height: 100%;
max-height: 450px;
padding: 0px;
z-index: 1;
}

.sell_hero_underlay {
position: absolute;
border-radius: 18px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
height: 100%;
width: 100%;
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.4), rgba(174, 156, 134, 0.8));
backdrop-filter: blur(30px);
z-index: 2;
top: 0px;
}

.sell_hero_info_container {
display: block;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 50%;
padding: 0px 0px 0px 50px;
z-index: 3;
}
.sell_hero_title {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
display: block;
color: rgba(0,0,0,1);
/* font-family: 'TATO Trl', Arial, Helvetica, Sans-Serif; */
font-family: 'Michroma', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 32px;
line-height: 60px;
text-transform: uppercase;
color: rgba(0,0,0,1);
text-align: left;
margin: 0px 0px 20px 0px;
}
.sell_hero_subtitle {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
display: block;
color: rgba(0,0,0,0.4);
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
line-height: 25px;
text-align: left;
margin: 0px 0px 30px 0px;
}
.sell_hero_button {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
height: 50px;
border-radius: 8px;
border: none;
background: rgba(255,255,255,1);
color: rgba(0,0,0,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
}
.sell_button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
.sell_hero_button:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}


.sell_hero_video_container {
display: flex;
align-items: center;
padding: 20px 50px 20px 20px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 50%;
z-index: 3;
}
.sell_hero_video {
height: 320px;
width: 100%;
position: relative;
display: flex;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)), url('/media/images/video_thumb.jpg');
-webkit-box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4); 
box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4);
border: 1px solid rgba(255,255,255,0.1);
border-radius: 18px;
align-items: center;
justify-content: center;
background-position: center;
background-size: cover;
transition: transform 0.3s;
transform: scale(1);
}
.sell_hero_video:hover {
transition: transform 0.3s;
transform: scale(1.01);
}
.sell_video_circle {
height: 80px;
width: 80px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: rgba(255,255,255,0.8);
backdrop-filter: blur(30px);
-webkit-box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4); 
box-shadow: 0px 2px 20px 0px rgba(0,0,0,0.4);
display: flex;
align-items: center;
justify-content: center;
border-radius: 40px;
transition: transform 0.3s;
transform: scale(1);
}
.sell_video_play {
margin-right: -5px;
}

.sell_video_circle:hover {
cursor: pointer;
transition: transform 0.3s;
transform: scale(1.05);
}

@media all and (max-width: 768px) {

.sell_hero {
display: block;
height: auto;
max-height: 100%;
}
.sell_hero_info_container {
width: 100%;
padding: 30px;
position: relative;
}
.sell_hero_video_container {
width: 100%;
padding: 0px 30px 30px 30px;
position: relative;
}
.sell_hero_button {
width: 100%;
}
.sell_hero_video {
left: 0;
right: 0;
margin: 0px auto;
width: 100%;
height: 220px;
}
.sell_hero_title {
font-size: 28px;
line-height: 47px;
margin: 0px 0px 10px 0px;
}
.sell_hero_subtitle {
margin: 0px 0px 20px 0px;
}

}

/* ––––––––––––––––––––––––––––––––––––––––––– BUY HERO -- */

.buy_img {
    position: relative;
    display: block;
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

/* ––––––––––––––––––––––––––––––––––––––––––– PRODUCT GRID -- */

#product-container {
position: relative;
box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 60px;
margin: 0px;
display: flex;
flex-wrap: wrap;
gap: 20px;
}

#product-container .product {
box-sizing: border-box;
-webkit-box-sizing: border-box;
border: 1px solid #e5e5e5;
/* width: 25%; */
width: 23.5%;
padding: 10px;
border-radius: 12px ;
position: relative;
z-index: 1;
}
#product-container .product:last-of-type {
/* max-width: calc(25% - 15px); */
max-width: calc(23.5% - 15px);
}

#product-container .product img {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
display: block;
width: 100%;
}

#product-container .product .buy-btn {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid rgba(173, 144, 114, 0.4);
    color: rgba(173, 144, 114, 1);
    font-size: 16px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: calc(100% - 80px);
    position: absolute;
    background: none;
    font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    transition: all 0.3s;
    z-index: 5;
    transform: scale(1);
    bottom: 10px;
}



#product-container .product .buy-btn:hover {
border: 1px solid rgba(173,144,114,0.4);
color: rgba(255,255,255,1);
background: rgba(173,144,114,1);
transition: all 0.3s;
cursor: pointer;

transform: scale(1.05);

}



#product-container .product_name {
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 18px;
text-align: left;
/* margin: 20px 10px 20px 10px; */
margin: 20px 10px 60px 10px;
}

#product-container .brand_name {
color: rgba(0,0,0,0.4);
display: none;
}

.product_corner {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;

border-top: 1px solid #e5e5e5;
border-left: 1px solid #e5e5e5;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
border-radius: 12px 0px 12px 0px;

position: absolute;
height: 60px;
width: 60px;
bottom: -1px;
right: -1px;

z-index: 2;
}
.product_corner_bottom {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;

border-top: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;

height: 20px;
width: 20px;

bottom: -1px;
right: 58px;
z-index: 3;

position: absolute;
}
.product_corner_top {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;

border-top: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;

height: 20px;
width: 20px;

right: -1px;
bottom: 58px;
z-index: 3;

position: absolute;
}

.product_corner_bottom_top {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;

border-top: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5;
border-radius: 0px 0px 12px 0px;

height: 20px;
width: 20px;

bottom: -1px;
right: 58px;
z-index: 4;

position: absolute;
}
.product_corner_top_top {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;

border-top: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-right: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5;
border-radius: 0px 0px 12px 0px;

height: 20px;
width: 20px;

right: -1px;
bottom: 58px;
z-index: 4;

position: absolute;
}


#pagination {
display: flex;
position: relative;
left: 0;
right: 0;
margin: 0px auto 60px auto;
justify-content: center;
align-items: center;
}
#prev-page {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;
border: 1px solid rgba(0,0,0,0.1);
border-radius: 12px;
padding: 16px;
height: 60px;
width: 60px;
display: flex;
align-items: center;
justify-content: center;
transform: scale(1);
transition: transform 0.3s;
}
#page-number {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;
height: 60px;
width: 60px;
display: flex;
align-items: center;
justify-content: center;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 22px;
}
#next-page {
background: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;
border: 1px solid rgba(0,0,0,0.1);
border-radius: 12px;
height: 60px;
width: 60px;
display: flex;
align-items: center;
justify-content: center;
transform: scale(1);
transition: transform 0.3s;
}

#prev-page:hover, #next-page:hover {
cursor: pointer;
transform: scale(1.05);
transition: transform 0.3s;
}




@media all and (max-width: 768px) {

#product-container {
display: block;
padding: 10px;
gap: 10px;
width: 100%;
}

#product-container .product {
width: calc(100%);
padding: 10px;
z-index: 1;
display: inline-block;
margin-bottom: 10px;
}

#product-container .product:nth-of-type(even) {
width: calc(100%);
padding: 10px;
z-index: 1;
display: inline-block;
float: right;
}

#product-container .product:last-of-type {
max-width: calc(100%);
}

#pagination {
width: 100%;
top: 10px;
margin: 0px auto 0px auto;
}



}


/* ––––––––––––––––––––––––––––––––––––––––––– BUY FORM -- */

#orderFormOverlay {
display: flex;
box-sizing: border-box;
-webkit-box-sizing: border-box;
margin: 0px auto 0px auto;
padding: 0px;
background: rgba(0,0,0,0.8);
z-index: 10000000000;
height: 100%;
width: 100%;
align-items: center;
justify-content: center;
position: fixed;
top: 0px;
transition: opacity 0.3s;
opacity: 0;
}
#orderForm {
display: block;
position: relative;
width: 100%;
max-width: 560px;
height: 100%;
max-height: 600px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
margin: 0px auto 0px auto;
padding: 0px;
background: rgba(255,255,255,1);
overflow-y: hidden;
border-radius: 18px;
}
.close_buy {
position: absolute;
right: 20px;
margin: 0px;
padding: 0px;
transition: transform 0.3s;
transform: scale(1);
}
.close_buy:hover {
cursor: pointer;
transition: transform 0.3s;
transform: scale(1.05);
}

#orderFormDetails {
position: absolute;
height: calc(100% - 100px);
overflow-y: scroll;
width: 100%;
bottom: 0px;
}

#orderFormDetails::-webkit-scrollbar {
display: none;
}

.buy_form_header {
position: absolute;
display: flex;
align-items: center;
border-bottom: 1px solid rgba(0,0,0,0.1);
width: 100%;
height: 100px;
z-index: 10000;
background: rgba(255,255,255,1);
}

#orderForm h2 {
/* font-family: 'TATO Trl', Arial, Helvetica, Sans-Serif; */
font-family: 'Michroma', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 28px;
text-transform: uppercase;
position: absolute;
left: 20px;
}

#orderFormDetails {
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 16px;
padding: 30px;
top: 100px;
box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
#orderFormDetails h3 {
font-weight: 600;
}
#orderFormDetails img {
    max-height: 200px;
    width: auto;
    height: 100%;
    max-width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    margin: 0px auto 20px auto;
    padding: 0px;
    left: 0;
    right: 0;
    display: flex;
    position: relative;
}

#productName {
font-size: 22px;
font-weight: 500;
margin: 10px auto 10px auto;
display: block;
text-align: center;
left: 0;
right 0;
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
#productPrice {
font-size: 16px;
font-weight: normal;
margin: 0px 0px 0px 0px;
color: rgba(0,0,0,0.6);
/* display: block; */
display: none;
text-align: center;
left: 0;
right 0;
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.buy_form_separator {
height: 1px;
width: 100%;
position: relative;
display: block;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: rgba(0,0,0,0.1);
padding: 0px;
margin: 20px auto 20px auto;
left: 0;
right: 0;
}

#orderFormDetails input[type="text"], #orderFormDetails input[type="tel"], #orderFormDetails input[type="email"] {
background: none;
border: 1px solid rgba(0,0,0,0.1);
box-sizing: border-box;
-webkit-box-sizing: border-box;
display: block;
width: 100%;
max-width: 500px;
border-radius: 12px;
padding: 16px;
margin: 0px 0px 10px 0px;
font-size: 16px;
color: rgba(0,0,0,1);
}

#orderFormDetails input[type="text"]::placeholder, #orderFormDetails input[type="tel"]::placeholder, #orderFormDetails input[type="email"]::placeholder {
font-size: 16px;
color: rgba(0,0,0,0.4);
}


#orderFormDetails label.checkbox-container {
display: flex;
align-items: center;
margin-top: 10px;
}
#orderFormDetails .checkbox-container input {
margin: 4px 10px 0px 0px;
appearance: none;
width: 30px;
height: 30px;
border: none;
background: rgba(0,0,0,0.1);
border-radius: 8px;
position: relative;
cursor: pointer;
flex-shrink: 0;
}
.checkbox-container input:checked {
background-color: rgba(0,0,0,0.1);
}
.checkbox-container input:checked::after {
content: url('/media/icons/form_check.svg');
font-size: 16px;
/* color: white; */
position: relative;
left: 0px;
top: 6px;
}

.terms_conditions {
color: rgba(0,0,0,0.4);
line-height: 15px;
font-size: 14px;
}
.terms_link {
color: rgba(0,0,0,0.4);
text-decoration: underline;
}
.terms_link:hover {
cursor: pointer;
color: rgba(0,0,0,0.4);
text-decoration: none;
}

#orderFormDetails button {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
bottom: 20px;
height: 50px;
border-radius: 8px;
background: rgba(0,0,0,1);
color: rgba(255,255,255,1);
display: flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
border: none;
width: 100%;
    margin: 20px auto 0px auto;
    top: 0px;
}
.button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
#orderFormDetails button:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}


@media all and (max-width: 768px) {

#orderForm {
max-height: 100%;
border-radius: 0px;
}

#orderForm h2 {
font-size: 22px;
}

}







/* ––––––––––––––––––––––––––––––––––––––––––– COOKIES -- */


.floating_cookies {
height: auto;
max-width: 300px;
background: rgba(0, 0, 0, 0.1);
backdrop-filter: blur(60px);
-webkit-backdrop-filter: blur(60px);
box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 10px;
margin: 0px;
display: block;
position: fixed;
left: 30px;
bottom: 30px;
border-radius: 12px;
transition: opacity 0.3s;
opacity: 1;
z-index: 100000;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
transition: opacity 0.3s;
}

.cookies_title {
font-size: 14px;
color: rgba(255,255,255,0.8);
margin: 0px;
font-weight: 600;
}
.cookies_subtitle {
font-size: 10px;
color: rgba(255,255,255,0.4);
margin: 0px;
}
.cookies_button {
text-decoration: underline;
font-size: 10px;
color: rgba(255,255,255,0.4);
margin: 0px;
}
.cookies_ok, .cookies_not_ok {
display: inline-flex;
height: 15px;
width: calc(50% - 5px);
background: rgba(255, 255, 255, 0.1);
color: rgba(255, 255, 255, 1);
border-radius: 6px;
align-items: center;
justify-content: center;
padding: 3px 0px;
margin: 7px 0px 0px 0px;
font-size: 12px;
opacity: 1;
transition: opacity 0.3s;
}
.cookies_ok:hover, .cookies_not_ok:hover {
cursor: pointer;
opacity: 0.6;
transition: opacity 0.3s;
}
.cookies_not_ok {
float: right;
}

@media (max-width: 768px) {

.cookies_title {
display: none;
}
.cookies_subtitle {
font-size: 9px;
margin: 0px;
max-width: 280px;
}
.cookies_button {
text-decoration: underline;
font-size: 9px;
color: rgba(255, 255, 255, 0.4);
margin: 0px;
}
.cookies_ok {
border-radius: 6px;
padding: 2px 0px;
margin: 0px;
font-size: 10px;
width: 50px;
position: absolute;
right: 6px;
bottom: 8px;
}
.cookies_not_ok {
border-radius: 6px;
padding: 2px 0px;
margin: 0px;
font-size: 10px;
width: 50px;
position: absolute;
right: 60px;
bottom: 8px;
}
.floating_cookies {
max-width: 100%;
padding: 5px;
margin: 0px;
left: 0;
bottom: 0;
border-radius: 0px;
width: 100%;
}
}


/* ––––––––––––––––––––––––––––––––––––––––––– FLOATING CONTACTS -- */

.floating_button {
position: fixed;
z-index: 100000;
display: block;
right: 30px;
bottom: 30px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
margin: 0px;
padding: 0px;
overflow: hidden;
height: 50px;
width: 200px;
border-radius: 18px;
color: rgba(255,255,255,1);
background: rgba(0,0,0,0.3);
backdrop-filter: blur(60px);
-webkit-backdrop-filter: blur(60px);
transition: all 0.3s;
opacity: 1;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
}

.float-button {
display: flex;
    border: none;
    text-decoration: none;
    height: 50px;
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    width: 100%;
    border-radius: 0px;
    justify-content: center;
    color: rgba(255, 255, 255, 1);
    opacity: 1;
transition: opacity 0.3s;
}

.floating_button_trigger {
display: block;
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    text-align: center;
    height: 35px;
    font-size: 16px;
/*     font-weight: 300; */
    transition: all 0.3s;
    opacity: 1;
}
.floating_button_trigger:hover {
cursor: pointer;
}

.floating-contacts {
display: block;
    border: none;
    text-decoration: none;
    /* height: 50px; */
    align-items: center;
    /* border-bottom: 1px solid rgba(255, 255, 255, 0.1); */
    width: 100%;
    border-radius: 0px;
    justify-content: center;
    position: absolute;
    bottom: 50px;
}

.float-button.phone {
border-bottom: none;
}

.floating_open {
/* height: 203px; */
height: 153px;
transition: all 0.3s;
}

.floating_open .floating_button_trigger {
opacity: 0.4;
transition: all 0.3s;
}

.floating_phone_icon {
height: 12px;
width: auto;
position: relative;
left: 0;
right: 0;
margin: 0px 3px -1px 0px;
}

.floating_whatsapp {
height: 12px;
width: auto;
margin-right: 8px;
}
.floating_email {
height: 12px;
width: auto;
margin-right: 8px;
}
.floating_phone {
height: 12px;
width: auto;
margin-right: 8px;
}


.float-button:hover {
cursor: pointer;
opacity: 0.6;
transition: opacity 0.3s;
}

@media (max-width: 768px) {

.floating_button {
left: 0;
right: 0;
margin: auto;
opacity: 0;
}

}




/* ––––––––––––––––––––––––––––––––––––––––––– SIGNATURE -- */
.signature {
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
margin: 10px auto 0px auto;
left: 0;
right: 0;
display: block;
position: relative;
box-sizing: borrder-box;
-webkit-box-sizing: borrder-box;
padding: 0px;
color: rgba(0,0,0,0.2);
font-size: 16px;
}
a.signature_link, a:visited.signature_link {
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
color: rgba(0,0,0,0.2);
}
a.signature_link:hover {
cursor: pointer;
text-decoration: none;
}





/* ––––––––––––––––––––––––––––––––––––––––––– ORDER PLACED -- */


.order_placed {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background: rgba(0,0,0,0.8);
z-index: 1000000;
display: flex;
top: 0px;
position: fixed;
align-items: center;
justify-content: center;
display: none;
opacity: 0;
transition: opacity 0.3s;
}

.order_placed_inside {
background: rgba(255,255,255,1);
border-radius: 18px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: calc(100% - 60px);
max-width: 220px;
height: 100px;
display: flex;
align-items: center;
justify-content: center;
padding: 30px;
}

.order_placed_text {
color: rgba(0,0,0,1);
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-align: center;
padding: 0px;
margin: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}






.form_container .message {
    text-align: center;
    margin-top: 15px;
    color: white;
    display: none;
    width: 100%;
    background: #15B377;
    color: rgba(255,255,255,1);
    padding: 10px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-radius: 8px;
    transition: opacity 0.3s;
    opacity: 0;
    font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    font-size: 18px;
    margin-top: -70px;
    height: 50px;
    z-index: 10000000;
    position: relative;
    padding-top: 14px;
}


.status-message {
background: #15B377;
position: relative;
box-sizing: border-box;
-webkit-box-sizing: border-box;
border-radius: 18px;
color: rgba(255,255,255,1);
font-size: 20px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
text-align: center;
height: 60px;
padding-top: 17px;
max-width: 900px;
width: calc(100% - 20px);
left: 0;
right: 0;
margin: 40px auto -50px auto;
}

@media (max-width: 768px) {
.status-message {
margin: 10px auto 0px auto;
}

.form_container .message {
transform: scale(1.05);
}


}











/* ––––––––––––––––––––––––––––––––––––––––––– VIDEO MODAL -- */
.video_modal {
display: none;
height: 100%;
width: 100%;
margin: 0px auto 0px auto;
padding: 0px;
position: fixed;
top: 0px;
background: rgba(0,0,0,0.8);
z-index: 10000000000;
align-items: center;
justify-content: center;
opacity: 0;
transition: opacity 0.3s;
}
.video_container {
max-width: 622px;
max-height: 350px;
/* 
height: 100%;
width: calc(100% - 20px);
 */
width: 622px;
height: 350px;
background: rgba(255,255,255,1);
border-radius: 18px;
position: relative;
overflow: hidden;
}
.video_container iframe {
width: 622px;
height: 350px;
}
.video_embed {
width: 100%;
height: 350px;
}


@media (max-width: 768px) {
.video_container {
width: 370px;
height: 208px;
}
.video_container iframe {
width: 370px;
height: 208px;
}
}








/* ––––––––––––––––––––––––––––––––––––––––––– TEAM -- */

.team_container {

}

.team_main {
display: flex;
width: 100%;
gap: 60px;
max-width: 1340px;
left: 0;
right: 0;
margin: 50px auto 0px auto;
padding: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.team_main_image_container {
max-width: 500px;
max-height: 500px;
width: 50%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 30px;
display: inline-flex;
border-radius: 18px;
overflow: hidden;
}
.team_main_image_container:after {
content: "";
display: block;
padding-bottom: 100%;
}

.team_main_image {
/* background-image: url('/media/images/team_ceo.jpg'); */
background-image: url('/media/images/andrew_2.jpg');
height: 100%;
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
background-position: center;
/* background-size: cover; */
background-size: 110%;
border-radius: 18px;
overflow: hidden;
}




.team_main_info_container {
display: flex;
align-items: center;
width: 50%;
padding: 0px 10px 0px 0px;
}

.team_main_info_container_inside {

}

.main_name {
display: block;
width: 100%;

/* font-family: 'TATO Trl', Arial, Helvetica, Sans-Serif; */
font-family: 'Michroma', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 32px;
text-transform: uppercase;

color: rgba(0,0,0,1);
margin: 0px 0px 10px 0px;

}

.team_main_info_container_inside .team_position {
margin-bottom: 20px;
}


.main_quote {
display: block;
width: 100%;

font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 32px;

color: rgba(0,0,0,1);
margin: 0px 0px 20px 0px;

}
.main_desc {
display: block;
width: 100%;

font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;

color: rgba(0,0,0,0.4);
margin: 0px 0px 20px 0px;

}








.team_main_info_container a.main_link.team_link, .team_main_info_container  a:visited.main_link.team_link {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
height: 50px;
border-radius: 8px;
border: 1px solid rgba(0,0,0,0.4);
color: rgba(0,0,0,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
margin-top: 20px;
}
.team_main_info_container a.main_link.team_link .button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
.team_main_info_container a.main_link.team_link:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}


.team_secondary_container {
display: block;
box-sizing: border-box;
-webkit-box-sizing: border-box;
gap: 60px;
max-width: 1340px;
left: 0;
right: 0;
margin: 30px auto 0px auto;
position: relative;
}

.team_member {
display: inline-block;
width: calc(33% - 60px);
box-sizing: border-box;
-webkit-box-sizing: border-box;
margin: 30px;
position: relative;
}
.team_image {
border-radius: 12px;
width: 100%;
display: block;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.team_name {
display: block;
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;

font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 32px;
color: rgba(0,0,0,1);
margin: 10px 0px 0px 0px;

}
.team_position {
display: block;
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;

font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
color: rgba(0,0,0,0.4);
margin: 0px;

}
.team_secondary_container .team_link {
position: absolute;
right: 0px;
bottom: 5px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
padding: 10px;
border-radius: 8px;
border: 1px solid rgba(0,0,0,0.4);
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;

transition: transform 0.3s;
transform: scale(1);
}

.team_secondary_container .team_link:hover {
cursor: pointer;
transition: transform 0.3s;
transform: scale(1.05);
}

.team_secondary_container .team_link svg {
margin-left: 0px;
}

.sell_button_circle_arrow {

}

.team_main_image_mobile {
display: none;
}

@media (max-width: 768px) {

.team_main {
display: block;
width: 100%;
}
.team_main_image_container {
max-width: 100%;
width: 100%;
height: 100%;
display: none;
}

.team_main_image_mobile {
display: block;
        width: calc(100% - 60px);
        position: relative;
        /* padding: 30px; */
        border-radius: 18px !important;
        box-sizing: border-box;
        overflow: hidden;
        overflow-clip-margin: initial;
        left: 0;
        right: 0;
        margin: 60px auto 0px auto;
}

.team_main_info_container {
display: block;
width: 100%;
padding: 30px 30px 0px 30px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.team_main_info_container a.main_link.team_link, .team_main_info_container a:visited.main_link.team_link {
width: 100%;
}

.team_secondary_container {
margin: 30px auto 0px auto;
}

.team_member {
width: 100%;
margin: 0px;
padding: 30px;
}
.team_member:last-of-type {
width: 100%;
margin: 0px 0px 30px 0px;
}

.team_secondary_container .team_link {
float: right;
margin-top: -55px;
right: initial;
bottom: initial;
position: relative;
}


}









/* ––––––––––––––––––––––––––––––––––––––––––– SELL FORM -- */


#modal {
background: rgba(0,0,0,0.8);
z-index: 10000000;
display: none;
position: fixed;
width: 100%;
height: 100%;
top: 0px;
box-sizing; border-box;
-webkit-box-sizing: border-box;
align-items: center;
justify-content: center;
}

.modal-content {
max-width: 500px;
max-height: 600px;
height: 100%;
width: 100%;
display: block;
position: fixed;
overflow-y: hidden;
box-sizing: border-box;
-webkit-box-sizing: border-box;
border-radius: 18px;
padding: 0px;
}

.modal-content h2 {
/* font-family: 'TATO Trl', Arial, Helvetica, Sans-Serif; */
font-family: 'Michroma', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 28px;
text-transform: uppercase;
position: absolute;
left: 20px;
}

#product-form {
position: relative;
overflow-y: scroll;
display: block;
height: 100%;
top: 100px;
padding: 0px 30px 30px 30px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 16px;
}

#product-form::-webkit-scrollbar {
display: none;
}

#product-form img {
    height: 100px;
    width: auto;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    position: relative;
    display: block;
}

.delete-photo {
    position: absolute;
    top: 8px;
    right: 8px;
    border-radius: 14px;
    border: none;
    width: 20px;
    height: 20px;
    font-size: 14px;
    padding-bottom: 2px;
    background: #D03838;
    color: rgba(255, 255, 255, 1);
}

.photo-preview {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 20px;
}

.photo-container {
    position: relative;
}

#product-form h3 {
font-weight: 600;
}





#product-form label.checkbox-container {
display: flex;
align-items: center;
margin-top: 10px;
}
#product-form .checkbox-container input {
margin: 4px 10px 0px 0px;
appearance: none;
width: 30px;
height: 30px;
border: none;
background: rgba(0,0,0,0.1);
border-radius: 8px;
position: relative;
cursor: pointer;
flex-shrink: 0;
}
.checkbox-container input:checked {
background-color: rgba(0,0,0,0.1);
}
.checkbox-container input:checked::after {
content: url('/media/icons/form_check.svg');
font-size: 16px;
/* color: white; */
position: relative;
left: 0px;
top: 6px;
}

.terms_conditions {
color: rgba(0,0,0,0.4);
line-height: 15px;
font-size: 14px;
}
.terms_link {
color: rgba(0,0,0,0.4);
text-decoration: underline;
}
.terms_link:hover {
cursor: pointer;
color: rgba(0,0,0,0.4);
text-decoration: none;
}


#product-form input[type="text"], #product-form input[type="tel"], #product-form input[type="email"] {
background: none;
border: 1px solid rgba(0,0,0,0.1);
box-sizing: border-box;
-webkit-box-sizing: border-box;
display: block;
width: 100%;
max-width: 500px;
border-radius: 12px;
padding: 16px;
margin: 0px 0px 10px 0px;
font-size: 16px;
color: rgba(0,0,0,1);
}

#product-form input[type="text"]::placeholder, #product-form input[type="tel"]::placeholder, #product-form input[type="email"]::placeholder {
font-size: 16px;
color: rgba(0,0,0,0.4);
}


.remove_product {
width: 100%;
height: 50px;
display: flex;
box-sizing: border-box;
-webkit-box-sizing: border-box;
align-items: center;
justify-content: center;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 14px;
background: none;
border: 1px solid rgba(208, 56, 56, 0.4);
color: rgba(208, 56, 56, 1);
border-radius: 12px;
padding: 0px;
transform: scale(1);
transition: transform 0.3s;
margin: 20px 0px 0px 0px;
}
.add_product {
width: 100%;
height: 50px;
display: flex;
box-sizing: border-box;
-webkit-box-sizing: border-box;
align-items: center;
justify-content: center;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 14px;
background: none;
border: 1px solid rgba(0, 0, 0, 0.4);
color: rgba(0, 0, 0, 1);
border-radius: 12px;
transform: scale(1);
transition: transform 0.3s;
margin: 20px 0px 0px 0px;
}
.remove_product:hover, .add_product:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}


.quantity_label {
font-size: 20px;
display: block;
width: 100%;
margin: 20px 0px 10px 0px;
padding-top: 20px;
border-top: 1px solid rgba(0,0,0,0.1);
}

.state_label {
font-size: 20px;
display: block;
width: 100%;
margin: 20px 0px 10px 0px;
padding-top: 20px;
border-top: 1px solid rgba(0,0,0,0.1);
}

.upload_photos_label {
font-size: 20px;
display: block;
width: 100%;
margin: 20px 0px 10px 0px;
padding-top: 20px;
border-top: 1px solid rgba(0,0,0,0.1);
}


#product-form input[type="file"] {
margin-bottom: 10px;
}


select {
padding: 5px;
border-radius: 8px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
border: 1px solid rgba(0, 0, 0, 0.1);
appearance: none;
-webkit-appearance: none;
text-align: center;
padding-left: 10px;
}

.less {
padding: 5px;
    border-radius: 8px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    margin-right: 10px;
}
.more {
padding: 5px;
    border-radius: 8px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 10px;
}
.quantity_number {
height: 30px;
width: 80px;
text-align: center;
box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding-left: 15px;
}



#product-form #submit-form {
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: relative;
bottom: 20px;
height: 50px;
border-radius: 8px;
background: rgba(0,0,0,1);
color: rgba(255,255,255,1);
display: inline-flex;
align-items: center;
justify-content: space-between;
padding: 0px 16px;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 20px;
text-decoration: none;
transform: scale(1);
transition: transform 0.3s;
border: none;
margin-bottom: 110px;
margin-top: 15px;
width: 100%;
}
.button_circle_arrow {
margin: 0px 0px 0px 100px;
padding: 0px;
}
#product-form #submit-form:hover {
cursor: pointer;
transform: scale(1.02);
transition: transform 0.3s;
}

.quantity_container {
display: flex;
align-items: center;
}



.upload_photos_original {
display: none;
}
.upload_photos_decal {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    height: 30px;
    padding: 5px 12px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: rgba(0, 0, 0, 1);
    text-align: center;
    font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    font-size: 16px;
    top: 3px;
    border-radius: 8px;
    position: relative;
}
.upload_photos_decal:hover {
cursor: pointer;
}



@media all and (max-width: 768px) {

.modal-content {
max-width: 100%;
max-height: 100%;
height: 100%;
width: 100%;
display: block;
position: fixed;
overflow-y: hidden;
box-sizing: border-box;
-webkit-box-sizing: border-box;
border-radius: 0px;
padding: 0px;
}

}







/* ––––––––––––––––––––––––––––––––––––––––––– DOCS -- */

.docs {
box-sizing: border-box;
-webkit-box-sizing: border-box;
width: calc(100% - 60px);
max-width: 1340px;
left: 0;
right: 0;
margin: 100px auto 0px auto;
font-family: 'Poppins', Arial, Helvetica, Sans-Serif;
font-weight: normal;
font-size: 16px;
}
.docs h1 {
font-weight: 600;
}
.docs h2 {
font-weight: 600;
}
.docs a, .docs a:visited {
color: rgba(0,0,0,1);
}