/* ===== RESET ===== */

*,
*::before,
*::after{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html{
  font-size:16px;
  scroll-behavior:smooth;
}

body{
  font-family:Arial, Helvetica, sans-serif;
  line-height:1.6;
  color:#222;
  background:#fff;
  overflow-x:hidden;
}

/* ===== IMAGES ===== */

img{
  max-width:100%;
  height:auto;
  display:block;
}

/* ===== CONTAINER SYSTEEM ===== */

.container{
  width:100%;
  max-width:1400px;
  margin:0 auto;
  padding-left:40px;
  padding-right:40px;
}

/* ===== SPACING SYSTEEM ===== */

.section{
  padding-top:32px;
  padding-bottom:32px;
}

/* ===== RESPONSIVE ===== */

@media (max-width:1100px){

  .container{
    padding-left:24px;
    padding-right:24px;
  }

  .section{
    padding-top:32px;
    padding-bottom:32px;
  }

}

@media (max-width:680px){

  .container{
    padding-left:16px;
    padding-right:16px;
  }

  .section{
    padding-top:24px;
    padding-bottom:24px;
  }

}