body {

        background-image: url("img/sfondo1.png");

        background-size: cover;

        background-attachment: fixed;

        background-position: center;

    }

    

    footer {

        padding: 1% 0% 1% 0%;

    }

    

    footer div {

        text-align: center;

    }

    

    footer H1 {

        font-size: calc(1em + 1vw);

        color: rgb(255, 255, 255);

    }

    /* unvisited link */

    

    div a:link {

        color: gold;

        text-decoration: none;

    }

    /* visited link */

    

    div a:visited {

        color: gold;

        text-decoration: none;

    }

    /* mouse over link */

    

    div a:hover {

        color: rgb(255, 0, 204);

        font-weight: bold;

        text-decoration: none;

    }

    /* selected link */

    

    div a:active {

        color: gold;

        text-decoration: none;

    }

    

    nav a {

        vertical-align: middle;

        /*border: 4px solid saddlebrown;*/

    }

    /* unvisited link */

    

    nav a:link {

        color: rgb(255, 255, 255);

        text-decoration: none;

    }

    /* visited link */

    

    nav a:visited {

        color: rgb(255, 255, 255);

        text-decoration: none;

    }

    /* mouse over link */

    

    nav a:hover {

        color: rgb(255, 0, 204);

        font-weight: bold;

        text-decoration: none;

    }

    /* selected link */

    

    nav a:active {

        color: rgb(255, 0, 204);

        text-decoration: none;

    }

    

    .logoinbarra {

        color: blue;

        background-color: transparent;

        height: 100px;

    }

    

    @supports (display: grid) {

        .barranavigazione {

            display: grid;

            grid-template-columns: 25% 25% 25% 25%;

            justify-content: center;

            width: 100%;

            height: 100px;

            background-color: burlywood;

        }

    }

    

    @supports (display: grid) {

        .logo {

            display: grid;

            grid-template-columns: 1fr;

            height: 50%;

            background: rgba(0, 0, 0, 0.1);

            padding-top: 18%;

            padding-left: 10%;

            padding-right: 10%;

            padding-bottom: 10%;

            align-items: center;

            justify-items: center;

        }

    }

    

    @supports (display: grid) {

        .motto {

            display: grid;

            grid-template-columns: auto-fill;

            font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

            font-size: calc(1.4em + 1.5vw);

            border-width: 10px;

            color: gold;

            width: 100%;

            margin: 20px auto;

            text-align: center;

            padding: 1%;

            align-self: center;

        }

    }

    

    @supports (display: grid) {

        .Griglia1Cella {

            display: grid;

            padding-left: 5%;

            padding-right: 5%;

            padding-top: 10%;

            padding-bottom: 10%;

        }

    }

    

    @media screen and (min-width: 720px) {

        @supports (display: grid) {

            .Griglia2CelleFotoADestra {

                display: grid;

                grid-template-columns: 40% 60%;

                font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

                font-size: calc(1.2em + 0.5vw);

                background-color: black;

                color: gold;

                text-align: center;

                padding-left: 5%;

                padding-right: 5%;

                padding-top: 10%;

                padding-bottom: 2%;

            }

        }

        @supports (display: grid) {

            .Griglia2CelleFotoASinistra {

                display: grid;

                grid-template-columns: 60% 40%;

                font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

                font-size: calc(1.2em + 0.5vw);

                background-color: black;

                color: gold;

                text-align: center;

                padding-left: 5%;

                padding-right: 5%;

                padding-top: 2%;

                padding-bottom: 2%;

            }

        }

        @supports (display: grid) {

            .Griglia3Celle {

                display: grid;

                grid-template-columns: 1fr 1fr 1fr;

                font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

                font-size: calc(1.2em + 0.5vw);

                color: gold;

                text-align: center;

                grid-gap: 3%;

                padding-left: 5%;

                padding-right: 5%;

                padding-top: 2%;

                padding-bottom: 2%;

            }

        }

        .card {

            background-color: rgba(0, 0, 0, 0);

            border: 0;

            /*border: 5px solid rgb(59, 34, 151);*/

        }

        .card img {

            align-self: center;

            border: 0;

        }

        .card p {

            margin: 0%;

        }

        .card h4 {

            font-weight: bold;

            margin: 0%;

        }

    
        .bordosuperiore{
            margin-top: 100px;
        }
    }

    

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

        @supports (display: grid) {

            .Griglia2CelleFotoADestra {

                display: grid;

                grid-template-columns: 1fr 1fr;

                font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

                font-size: calc(1.2em + 0.5vw);

                background-color: black;

                color: gold;

                text-align: center;

                padding-left: 15%;

                padding-right: 15%;

                padding-top: 10%;

                padding-bottom: 2%;

            }

        }

        @supports (display: grid) {

            .Griglia2CelleFotoASinistra {

                display: grid;

                grid-template-columns: 1fr 1fr;

                font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

                font-size: calc(1.2em + 1vw);

                background-color: black;

                color: gold;

                text-align: center;

                padding-left: 15%;

                padding-right: 15%;

                padding-top: 2%;

                padding-bottom: 2%;

            }

        }

        @supports (display: grid) {

            .Griglia3Celle {

                display: grid;

                grid-template-columns: 1fr;

                font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

                font-size: calc(1.2em + 1vw);

                color: gold;

                text-align: center;

                padding-left: 15%;

                padding-right: 15%;

                padding-top: 2%;

                padding-bottom: 2%;

            }

        }

        .card {

            background-color: rgba(0, 0, 0, 0);

            /*border: 4px solid aqua;*/

            margin-top: 4%;

            border: 0;

        }

        .card img {

            align-self: center;

            border: 0;
            
            margin-top: 50px;

        }

        .card p {

            margin: 0%;

        }

        .card h4 {

            font-weight: bold;

            font-size: calc(1.2em + 0.7vw);

            margin: 0%;

        }

        .bordosuperiore{
            margin-top: 100px;
        }
    
    }

    

    .spazioorizzontale {

        height: 70%;

        width: 70%;

        color: rgba(0, 0, 0, 0);

        font-size: 200px;

    }

    

    .paragrafosottotitolo {

        text-align: center;

        font-size: calc(1.5em + 0.8vw);

        font-family: 'Trebuchet MS', 'Gill Sans', 'Gill Sans MT', Calibri, sans-serif;

        color: gold;

        margin: 0%;

    }

    

    .immaginegrafico {

        background-image: url("/img/chart.jpg");

        background-size: cover;

        opacity: 1;

    }

    

    .immaginelogometatrader {

        background-image: url("/img/MetatraderLogo.jpg");

        background-size: cover;

        opacity: 1;

    }

    

    .sfondo_nero_opacita_03 {

        background-color: rgba(0, 0, 0, 0.3);

    }

    

    .sfondo_nero_opacita_04 {

        background-color: rgba(0, 0, 0, 0.4);

    }

    

    .sfondo_nero_opacita_1 {

        background-color: rgba(33, 37, 41, 1);

    }

    

    .fade-in-image {

        animation: fadeIn 5s;

    }

    

    @keyframes fadeIn {

        0% {

            opacity: 0;

        }

        100% {

            opacity: 1;

        }

    }