
@font-face { font-family: Klavika-Regular; src: url(https://www.alternate.nl/download/b2c_nl/pic/merken/amd/2026/CrimsonDesert/Klavika-Regular.ttf); }
@font-face { font-family:Klavika-Bold ; src: url(https://www.alternate.nl/download/b2c_nl/pic/merken/amd/2026/CrimsonDesert/); }
    #PortalPagina { width: 100%; font-family: 'Klavika-Regular', sans-serif; color: #fff; font-size: 14px; line-height: 20px; background-color: #000; }
    #PortalPagina img { width: 100%; }
    #PortalPagina h1 { font-size: 30px; }
    #PortalPagina h2 { font-size: 25px; line-height: 40px; }
    #PortalPagina p { font-size: 16px; line-height: 24px; }
    #PortalPagina a {color:#fff; text-decoration: none; font-family: 'Klavika-Regular'; font-size: 20px; }
    
#PortalPagina a:hover {text-decoration: underline;}

/* SECTION WRAPPER */
.section-wrapper { margin-left: auto; margin-right: auto; display: flex; width: 100%; flex-direction: column; justify-content: center; align-items: flex-start;}

/* MODULE HERO */
.section-content.ModuleHero {background-image: url('../images/253593750_LPModule_Hero.jpg');background-repeat: no-repeat;background-position: 50% 50%;background-size: cover;display: flex; justify-content: center; align-items: center;background-color: #000;}
.ModuleHero .section-wrapper {max-width: 1400px;}
.ModuleHero .section-wrapper .content-box {max-width: 700px;padding: 50px 50px 50px 100px;}
.ModuleHero-mobile-img {display: none;}
.ModuleHero-mobile-container {overflow: hidden;}

.iconen{width: 20% !important; }
#plus{width: 60% !important; }

/* MODULE TEXT */
.Module-Heading {font-family: "Klavika-Bold", sans-serif; color: #fff;font-size: 80px;line-height: 60px;text-transform: uppercase;margin-bottom: 20px;font-weight: normal;}
.Module-Heading span {background: linear-gradient(to right, rgb(246,111,25), rgb(242,20,33));-webkit-background-clip: text;-webkit-text-fill-color: transparent;padding-right: 24px;font-family: "Klavika-Condensed-Bold-Italic", sans-serif;}
.Module-Subhead {font-family: 'Klavika-Regular';font-size: 30px;line-height: 33px;margin-top: 0;}
.ModuleLogo {margin-top: 40px;margin-bottom: 40px;}

/* MODULE CHART */
.ModuleChart {width: 100%;background-color: #181818;margin-bottom: 40px;text-align: center;}
.ModuleChart td {border-right: 3px solid #000; padding:2%;}
.ModuleChart tr:first-child {background: linear-gradient(to right, rgb(246,111,25), rgb(242,20,33));}
.ModuleChart .chart-header {font-family: 'Klavika', sans-serif;font-size: 24px;line-height: 26px; padding: 20px;}
.ModuleChart .chart-body {font-size: 20px;line-height: 30px;padding: 20px;}

/* MODULE FOOTER */
.ModuleFooter {padding: 30px 100px 40px; background-color:black;}
.ModuleFooter .section-wrapper {max-width: 1200px;}

.footnotes {font-family: "Klavika-Regular";font-size: 12px;line-height: 15px;margin: 4px 0;}

#Producten {display: flex;flex-wrap: wrap;justify-content: center;padding: 70px 0  0;}
#Producten .card {width: 23%;margin: 7px;background: linear-gradient( 60deg, #f66e19 70%, #f21520 100%);border-radius: 20px;overflow: hidden;}
#Producten .card img {padding: 0 30px; box-shadow: inset 0 0 70px black;}
#Producten .card p {text-align: center;padding: 20px;margin: 0;background: linear-gradient(0deg, #0000007a, #ffffff00);font-weight: 800;font-size: 22px;}
#Producten .card p span { font-size: 17px; font-weight: 500; color: #4b4b4b; }
#Producten .card:hover { filter: brightness(0.9); }
    

/* RESPONSIVE */
@media (max-width: 1100px) {
  .Module-Heading { font-size: 6vw;line-height: 4.5vw;}
  .ModuleHero .content-box {max-width: 600px;}
  #Producten .card {
    width: 60%;
  }
}

@media (max-width: 767px) {
  .ModuleHero-mobile-img {display: block; object-fit: cover;height: 100%;object-position: 70% top;}
  .ModuleHero-mobile-container {height: 500px;}
  
  .section-content.ModuleHero {background: #000;padding: 0;}
  .ModuleHero .content-box {padding: 0;width: 100%;}

  .section-wrapper {padding: 0 30px;}

  .Module-Heading {font-size: 10.5vw;line-height: 8vw;margin-top: 0;}
  .ModuleLogo {margin-top: 10px; margin-bottom: 1px;}
  .ModuleFooter {padding-left: 0;padding-right: 0;}
  .ModuleChart .chart-header {font-size: 22px;line-height: 22px;}
  .ModuleChart .chart-body {font-size: 16px;line-height: 26px; padding: 5px;}
  
  #Producten .card {
    width: 40%; }
}