 :root {
    --headerbox-bg: #F1F1F2;
    --headerbox-topline: #ff5d27;
    --headerbox-font: "Work Sans", sans-serif;
    --btn-bgcolor: #ff5d27;
    --btn-color: #ffffff;
}
#headerbox {
    background-color: var(--headerbox-bg);
    width: 100%;
    height: 80px;
    border-top: 4px solid var(--headerbox-topline);
    font-family: var(--headerbox-font);
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
    font-size:23px;
    position: relative;
        z-index: 1;
}
@media (max-width: 768px) {
    #headerbox {
        font-size:20px;
    }
}
#headerbox .col-sx, #headerbox .col-mid, #headerbox .col-dx {
    float:left;
    text-align: center;
}
#headerbox .col-sx, #headerbox .col-mid, #headerbox .col-dx {
    padding:10px 8px;
}
#headerbox .col-sx {
    width:16%;
}
#headerbox .col-mid {
    width:68%;
}
#headerbox .col-dx {
    width:16%;
    padding-top:16px;
}

#headerboxmob {
    background-color: var(--headerbox-bg);
    width: 100%;
    height: 80px;
    margin:0 auto;
    border-top: 4px solid var(--headerbox-topline);
    font-family: var(--headerbox-font);
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
    font-size:15px;
}

#headerboxmob .col-sx, #headerboxmob .col-mid, #headerboxmob .col-dx {
    padding:8px 6px;
}
#headerboxmob .col-sx {
    width:30%;
    margin-left: -20px;
}
#headerboxmob .col-mid p{
    line-height: 15px;
    font-size: 3.5vw; 
}
#headerboxmob .col-mid {
    width:54%;
    margin-left: -30px;
    text-align: left;
}
#headerboxmob .col-dx {
    width:auto;
    padding-top:20px;
}

#headerbox strong, #headerboxmob strong, #headerbox b, #headerboxmob b {
    font-weight: 800;
}

.headerbox-btn {
    width:75%;
    position: relative;
    display: inline-block;
    padding: 10px 8px 10px 28px;
    border: none;
    border-radius: 4px;
    background-color: var(--btn-bgcolor);
    color:  var(--btn-color)!important;
    text-transform: uppercase;
    font-size:  18px;
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
  }
#headerboxmob .headerbox-btn {
    width:100%;
    font-size:14px;    
}
  .headerbox-btn::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 16px;
    width: 10px;
    height: 10px;
    background-color: #ffffff;
    border-radius: 50%;
    animation: pulse 1s infinite alternate;
    transform: translate(-50%, -50%);
  }
  @keyframes pulse {
        0% {
          transform: translate(-50%, -50%) scale(1);
          opacity: 1;
        }
        100% {
          transform: translate(-50%, -50%) scale(1.5);
          opacity: 0;
        }
    }
#header-sticky .c-wrapper.c-wrapper--w1 {
    background-color:transparent;
}
.header.sticky.down-scroll {
    height: 140px!important;
}
#header.header #headerboxmob {
    margin: 0 -16px 0 -16px;
    width: 109%!important;
}
@media (max-width: 767px) {
    #header:has(#headerboxmob) ~ #supercontainer-1 {
        padding-top: 165px !important;
    }
    body:has(#profileSuperContainer) #header:has(#headerboxmob) {
        height: 125px !important;
    }
}
@media (max-width: 580px) {
    body:not(:has(#profileSuperContainer)) #header .c-wrapper.c-wrapper--w1 {
      background-color:#ffffff;
  }
}

#headerbox a, #headerbox a:active, #headerbox a:focus, #headerbox a:hover, #headerbox a:visited {
  width: inherit;
  display: inline-block;
}
  
#headerbox img {
    max-height: 60px;
}
#headerboxmob img {
    max-height: 64px;
}
#headerbanner-placeholder{
    width: 100%;
    max-width: 1078px;
    height: 80px;
    margin: 0 auto;
    background-color: #f7f7fb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0 auto;
    background-image: url(https://www.quattroruote.it/etc/designs/quattroruote/2019/img/qtr_logo_small_gray.svg);
}
.banner-container p{
    margin: 0;
    padding: 0;
}
.banner-container img{
    max-width: 100%;
}