
/**COLORI**/
:root {
  --color-light:#EDF2F7;
  --color-primary:black;
  --color-secondary:#E3051B;
}

body{
  background-color:var(--color-light);
}


/**FONT**/
:root {
  /* Font base */
  --font-base: 'IBM Plex Sans', sans-serif;

  /* Pesi principali */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
}


body *{
  font-family: var(--font-base);
  font-weight: var(--fw-regular);
  color: var(--color-primary);
  line-height: 1.2em;
  margin:0px;
}

body{
  margin:0px;
}

a{
  color: var(--color-secondary); 
}
a:hover{
    opacity:0.75;
}

p {
  font-size: 16px;
}
.large {
  font-size: 20px;
}

.small{
  font-size: 14px;
}

h1 {
  font-size: 36px;
}
h2, h3, h4 {
  font-size: 26px;
}
h3, h4 {
  font-weight: var(--fw-bold);
}
h5 {
  font-size: 24px;
  font-weight: var(--fw-semi-bold);
}
h6 {
  font-size: 20px;
  font-weight: var(--fw-bold);
}

.text-center{
  text-align:center;
}
ul{
  list-style-type:none;
  padding:0px;
  margin:0px;

  li{
    margin-bottom:2px;
  }
}

@media(max-width:767px){
  p {
    font-size: 14px; /*era 16*/
  }
  .large {
    font-size: 18px; /*era 20*/
  }

  .small{
    font-size: 14px; /*era 14*/
  }

  h1 {
    font-size: 26px; /*era 36*/
  }
  h2, h3, h4 {
    font-size: 20px; /*era 26*/
  }

  h5 {
    font-size: 18px; /*era 24*/
  }
  h6 {
    font-size: 16px; /*era 20*/
  }
}


/**LAYOUT GENERAL**/
main, header{
  max-width:1320px;
  margin:30px 60px;
  overflow:hidden;
}
@media(max-width:767px){
  main, header{
    margin:15px 30px;
  }
}
footer{
  background-color:white;
  width:100%;
  align-items:center;
  display:flex;
  flex-wrap:wrap;
  overflow:hidden;

  a{
    text-decoration:none;
  }

  div.first{
    width:100%;

    img{
      max-width:290px;
    }
    div:first-child{
      gap:15px;
      max-width:1320px;
      width: 100%;
      margin:30px 60px;

      div{
        gap:15px;
      }
    }
  }

  div.red-footer{
    background-color:var(--color-secondary);
    width:100%;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content: center;
  }

  div.second, div.third{
    width:100%;
    max-width:1320px;
    margin:30px 60px;
    display:flex;
    flex-direction: row;
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:30px;

    *{
      color:white;
    }
  }
  .col{
    display:flex;
    padding-top:15px;
    flex-direction: column;
    flex-basis: 26%;
    flex-grow:1;
    border-top:#ffffff69 solid 1px;
  }
}
div.third div{
  width:100%;
  padding-top:15px;
  border-top:#ffffff69 solid 1px;

  ul li{
    display: inline;
    margin-right:15px;
  }
}

@media(max-width:767px){
  footer {

    div.first, div.second{
      flex-direction:column;
      gap:30px;
    }
    .col{
      padding-bottom:0px;
    }
    div.first div:first-child{
      flex-direction:column;
      align-items: center;
      width: auto;
    }

  }
}

/**LAYOUT FLEX**/
.d-flex {
  display: flex;
}
.flex-wrap {
  flex-wrap: wrap;
}

/* direzione */
.flex-row {
  flex-direction: row;
}

.flex-column {
  flex-direction: column;
}

/* allineamento */
.justify-start {
  justify-content: flex-start;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.align-content-center {
  align-content: center;
}

.align-content-between {
  align-content: space-between;
}

.align-items-center{
  align-items: center;
}

/**ELEMENTI**/

.box-section, .red-section{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap:15px;
  width:100%;
}

.box-section a{
  background-color:white;
  display:flex;
  padding:30px;
  padding-bottom:50px;
  flex-direction: column;
  flex-basis: 26%;
  flex-grow:1;
  gap:10px;
  align-self: stretch;
  text-decoration:none!important;

  img{
    display:block;
    margin:auto;
    width:100%;
    max-width: 110px;
  }

  h3{
    text-align:center;
    margin-bottom:0px;
    margin-top:0px;
  }
}

.red-box{
  background-color:var(--color-secondary);
  padding:30px;
  padding-bottom:50px;
  display:flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-between;
  flex-basis: 40%;
  flex-grow:1;
  gap:10px;
  align-self: stretch;

  *{
    color:white;
  }
  img{
    display:block;
    width:100%;
    max-width: 110px;
  }
  .row{
    display:flex;
    flex-wrap: wrap; 
    flex-direction: row;
    gap:30px;

    img{
      display:block;
      width:auto;
      max-width: 110px;
    }
    .info{
      width:auto;
      display:flex;
      flex-direction: column;
      justify-content: center;
    }
  }
}
@media(max-width:1130px){
  .red-box{
    flex-basis: 100%;
  }
}

/**IFRAME**/
.traking-section, .arrivipartenze-section{
  display: flex;
  justify-content: center;
  flex-direction:column;
  align-items: center;
  align-content: center;
  width:100%;
  gap:30px;
  margin:15px 0px;
  padding:30px;
}

.traking-section{
  background-color:white;

  iframe{
    border: none;
  }
}
.arrivipartenze-section{
  /*stile copiato da originale*/
  iframe{
    width: 100%;
    overflow-x: scroll!important;
    border: none;
  }
  /*FINE stile copiato da originale*/
}