@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root{
    --color-background:#2B2B2B;
    --color-background-2:#1B1B1B;
    --color-white:#FFFFFF;
    --color-dark:#000000;
    --color-muted:#d1d3d5;
    --color-green-water:#019176;
    --color-orange:#EF8F52;
    --color-yellow:#C19300;
}

body, html {
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Impedisce lo scorrimento laterale */
}

body {
    font-family: 'Montserrat', sans-serif;
    background-color: var(--color-background);
    color:var(--color-white);
    line-height: 1.8; 
    overflow-x: hidden;
}

a{
    text-decoration: none;
    color:var(--color-dark);
}

footer{
    background-color:var(--color-orange)!important;
    color: var(--color-dark)!important;
    font-weight: 600;
}

h1,h2,h3,h4,h5,h6{
    color:var(--color-orange)!important;
    text-transform:uppercase ;
}

.btn-particular {
    color: var(--color-white);
    text-decoration: none;
    font-size: 25px;
    border: none;
    background: none;
    
}

.btn-particular::before {
    margin-left: auto;
}

.btn-particular::after, .btn-particular::before {
    content: '';
    width: 0%;
    height: 2px;
    background: var(--color-white);
    display: block;
    transition: 0.5s;
}

.btn-particular:hover::after, .btn-particular:hover::before {
    width: 100%;
}


.active{
    font-weight: 700;
    text-decoration: underline;
}



/* Media Queries per la responsività */
@media (max-width: 768px) {
   
}



/* Versione per schermi desktop (1440px) */
@media (min-width: 1281px) {
 
    .img-logo{
        width: 80px;
        height: 80px;
    }

}
/* Versione per MacBook Air (1280px x 832px) */
@media (max-width: 1280px) {
    .container{
        padding-left:5%;
        padding-right:5%;
    }
    .img-logo{
        width: 70px;
        height: 70px;
    }
}

/* Versione per tablet (744px x 1133px) */
@media (max-width: 744px) {
    .img-logo{
        width: 50px;
        height: 50px;
    }
}

/* Versione per smartphone (390px x 844px) */
@media (max-width: 390px) {

    .img-logo{
        width: 30px;
        height: 30px;
    }
}