@charset "UTF-8";
/* CSS Document */

body,
h1,
h2,
h3,
h4,
h5,
p {
   font-family: 'Be Vietnam Pro', sans-serif;
}
.logo-nav{
    max-width: 250px;
    min-width: 250px;
}
.loghi{
    max-width: 300px;
    min-width: 250px;
}
.navbar-light .navbar-nav .nav-link {
    font-family: 'Be Vietnam Pro', sans-serif;
    color: #000;
    font-size: calc(16px + (20 - 16) * ((100vw - 300px) / (1920 - 300)));
    padding: 0.2rem 1.5rem;
    margin-right: 3rem;
    font-weight: 500;
    background-color: #fff;
    border-radius: 50px;
}

.txt-gradient{
    color: #DD1005;
}
.listino-nav {
    font-family: 'Be Vietnam Pro', sans-serif;
    color: #fff;
    font-size: calc(16px + (24 - 16) * ((100vw - 300px) / (1920 - 300)));
    padding: 0.4rem 2rem;
    font-weight: 600;
    background: #DD1005;
    border-radius: 50px;
    transition-duration: 0.6s;
}
.listino-nav:hover {
    color: #fff;
    font-size: calc(16px + (24 - 16) * ((100vw - 300px) / (1920 - 300)));
    padding: 0.4rem 2rem;
    font-weight: 600;
    background: #DD1005;
    border-radius: 50px;
    box-shadow: 8px 8px 15px #161616;
    transition-duration: 0.6s;
}

.bg-light {
    background-color: transparent!important;
    padding-top: 2rem;
    margin-left: 1rem;
    margin-right: 1rem;
    padding-bottom: 4px;
}

.back-head{
    background-image: url(../img/head-grafer.jpg);
    background-size: cover;
    background-position: center;
    height: 100vh;
}
.sfondo-nav{
    background-image: url(../img/sfondo-nav.svg);
    background-size: auto;
    background-position: right top;
    background-repeat: no-repeat;
    height: 100vh;
}
.sfondo-nav-pag{
    background-image: url(../img/sfondo-nav-pag.svg);
    background-size: auto;
    background-position: right top;
    background-repeat: no-repeat;
    height: 25vh;
}
.sf-estintore{
    background-image: url(../img/sf-estintore.jpg);
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
    height: auto;
}
.sf-casco{
    background-image: url(../img/sf-casco.jpg);
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
    height: auto;
}


/*------testochegira------*/
.marquee {
  margin: 0 auto;
  white-space: nowrap;
  overflow: hidden;

}
.titologira{
    font-size: calc(50px + (80 - 50) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 800;
    text-transform: uppercase;
    color: #DD1005;
    margin-top: 6rem;
}
.marquee span {
  display: inline-block;
  padding-left: 100%;
  animation: marquee 40s linear infinite;
}

.marquee2 span {
  animation-delay: 0.1s;
}

@keyframes marquee {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-100%, 0);
  }
}
/*------finetestochegira--------*/



.box-1txt{
    padding-top: 8rem;
    padding-bottom: 8rem;
}
.h1-bold{
    font-size: calc(50px + (80 - 50) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 800;
}
.title-h1{
    font-size: calc(24px + (30 - 24) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 700;
}
.txt{
    font-size: calc(16px + (22 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 400;
}
.txt-prod{
    padding-top: 3rem;
    font-size: calc(22px + (34 - 22) * ((100vw - 300px) / (1920 - 300)));
    line-height: calc(20px + (36 - 20) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 800;
}
.box-prod{
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 4rem;
}
.sf-1-svg{
    background-image: url(../img/sfondi/1.svg);
    background-size: auto;
    background-position: right;
    background-repeat: no-repeat;
}
.box-2txt{
    padding-top: 8rem;
    padding-bottom: 8rem;
    padding-left: 4rem;
    padding-right: 4rem;
}
.img-sponsor{
    padding: 0;
}
.sp-img-segnaletica{
    padding-bottom: 2rem;
}
.white{
    color: #FBFBFB;
}
.back-call{
    background-color: #DD1005;
}
.txt-call{
    font-size: calc(16px + (28 - 16) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 400;
    color: #fff;
    text-align:  center;
    padding-top: 2rem;
    padding-bottom: 1.8rem;
}
.btn-call{
    color: #000;
    padding: 0.2rem 1.5rem;
    font-weight: 500;
    background-color: #fff;
    border-radius: 50px;
}
.txt-sponsor{
    font-size: calc(24px + (38 - 24) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 400;
    color: #fff;
    text-align:  right;
    padding-top: 4rem;
    padding-right: 2rem;
    padding-bottom: 1.8rem;
}
.box-foot{
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.box-1txt-antincendi{
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.dim-copertina{
    max-width: 200px;
    min-width: 150px;
    box-shadow: 4px 4px 10px #747474;
    margin-bottom: 2rem;
}
.tit-foot{
    font-size: calc(18px + (24 - 18) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 800;
}
.txt-foot{
    font-size: calc(12px + (18 - 12) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 400;
}
hr{
    margin-top: 1.5rem;
    margin-bottom: 2rem;
}

a{  color: #151515;
    text-decoration: none;
}
a:hover {
    color: #C3C3C3;
}

@media only screen and (max-width: 1400px) {
}

@media only screen and (max-width: 700px) {

    .back-head{
    background-image: url(../img/head-grafer.jpg);
    background-size: cover;
    background-position: center;
    height: 100vh;
}
.sp-nav-mobile{
    padding-top: 2rem;
}
.box-logo-foot{
    padding-top: 6rem;
    padding-bottom: 6rem;
}
.btn-nav-mobile{
    color: #000;
    font-size: calc(20px + (20 - 20) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 500;
    background-color: #fff;
    border-radius: 50px;
    padding: 0.2rem 1.5rem;
    }
    .listino-nav-mobile {
    color: #fff;
    font-size: calc(26px + (28 - 26) * ((100vw - 300px) / (1920 - 300)));
    padding: 0.4rem 2rem;
    font-weight: 600;
    background: #DD1005;
    border-radius: 50px;
    transition-duration: 0.6s;
}
.sf-1-svg{
    background-image: url(../img/sfondi/1-mob.svg);
    background-size: auto;
    background-position: bottom;
    background-repeat: no-repeat;
}
.loghi {
    max-width: 200px;
    min-width: 200px;
    padding-bottom: 3rem;
}
.box-1txt {
    padding-top: 4rem;
    padding-bottom: 8rem;
}
.box-2txt {
    padding-top: 4rem;
    padding-bottom: 4rem;
    padding-left: 2rem;
    padding-right: 2rem;
}
.sf-estintore {
    background-image: url(../img/sf-estintore.jpg);
    background-size: cover;
    background-position: left ;
    background-repeat: no-repeat;
    height: auto;
}
.box-foot {
    padding-top: 3rem;
    padding-bottom: 3rem;
    padding-left: 2rem;
    padding-right: 2rem;
}

.sf-casco{
    background-image: url(../img/sf-casco.jpg);
    background-size: cover;
    background-position: center left;
    background-repeat: no-repeat;
    height: auto;
}
.txt-sponsor{
    font-size: calc(24px + (38 - 24) * ((100vw - 300px) / (1920 - 300)));
    font-weight: 400;
    color: #fff;
    text-align:  center;
    padding-top: 1rem;
    padding-right: 0rem;
    padding-bottom: 1rem;
}
}