@import "variables";
/*********************************************************/
/*
*              CSS INDEX
1 NAVIGATION
2 TOP HEADER
3 BREADCRUMBS
4 ** SECTIONS **
 4.1 SECTION LABEL
 4.2 CARDS (BIG - MEDIUM - SMALL - ICONS)
 4.3 DIVIDER WITH CTA
 4.4 DIVIDER WITH LINE
 4.5 DIVIDER WITH TEXT
 4.6 HEADER WITH TEXT
 4.7 NUMBERS
 4.8 LAST FROM SOCIAL
 4.9 RELATED SERVICES
5 FOOTER
6 ** COMPONENTS **
 6.1 CAROUSEL
 6.2 ACCORDIOn
 6.3 TABBED PANEL
 7 TABLES
 8 BULLET LIST
 9 IMAGE GALLERY GRID
 10 SOCIAL ICONS
 11 ATTACHMENTS
 12 PAGINATION
 13 VIDEO
 14 COOKIE BANNER


**********************************************************/
/*********************************************************/
/*
*              1 MAIN NAVIGATION
*
**********************************************************/
/* MOBILE NAVIGATION */
/*********************/
/*********************/
/*********************/
/*********************************************************/
/*
*            2 TOP HEADER
*
**********************************************************/
/* REX */
/*********************************************************/
/*
*               3 BREADCRUMBS
*
**********************************************************/
/*********************************************************/
/*
*             SEARCH
*
**********************************************************/
/*********************************************************/
/*
*              4.1 SECTION LABEL
*
**********************************************************/
/* Medium devices (tablets, 768px and up) */
/*********************************************************/
/*
*              4.2 CARDS
*
**********************************************************/
/*********** CARD BIG ***********/
/******* CARD MEDIUM **********/
/******* CARD SMALL **********/
/******** CARD ICONS *************/
/*********************************************************/
/*
*                4.3 DIVIDER WITH CTA
*
**********************************************************/
/*********************************************************/
/*
*                4.4 DIVIDER WITH LINE
*
**********************************************************/
/*********************************************************/
/*
*                4.5 DIVIDER WITH TEXT
*
**********************************************************/
/*********************************************************/
/*
*                4.6 HEADER WITH TEXT
*
**********************************************************/
/*********************************************************/
/*
*              4.7 SECTION NUMBERS
*
**********************************************************/
/*********************************************************/
/*
*              4.8 LAST FROM SOCIAL
*
**********************************************************/
/*********************************************************/
/*
*              4.9 RELATED SERVICES
*
**********************************************************/
/*********************************************************/
/*
*              5 FOOTER 
*
**********************************************************/
/* REX */
/*********************************************************/
/*
*              6.1 CAROUSEL
*
**********************************************************/
/* vIDEO */
/*********************************************************/
/*
*              6.2 ACCORDION
*
**********************************************************/
/* FILTERS */
/* FAQ */
/* AR */
/*********************************************************/
/*
*              6.3 TABBED PANEL
*
**********************************************************/
/*********************************************************/
/*
*              7 TABLES
*
**********************************************************/
/*********************************************************/
/*
*              8 BULLET LIST
*
**********************************************************/
/*********************************************************/
/*
*               9 IMAGE GALLERY GRID
*
**********************************************************/
/*********************************************************/
/*
*               10 SOCIAL ICONS
*
**********************************************************/
/*********************************************************/
/*
*               11 ATTACHMENTS
*
**********************************************************/
/*********************************************************/
/*
*               12 PAGINATION
*
**********************************************************/
/*********************************************************/
/*
*               13 VIDEO
*
**********************************************************/
/* ASPECT RATIO */
/*********************************************************/
/*
*               14 COOKIE BANNER
*
**********************************************************/
#main__navigation {
    background: rgba(247, 247, 247, 1) 0% 0% no-repeat padding-box;

    ul {
        padding: 0;
        margin: 0;

        li {
            display: inline-block;
            list-style-type: none;
            position: relative;

            a {
                font-weight: 700;
                margin-right: 1rem;
                padding-top: 1rem;
                padding-bottom: 0.75rem;
                display: block;
                border-bottom: 4px solid transparent;
                transition: all 0.2s ease-in-out;
                white-space: nowrap;
                text-decoration: none;
                color: rgba(0, 89, 147, 1);

                img {
                    width: 12px;
                    margin-left: .5rem;
                }

                &:hover {
                    border-bottom: 0.25rem solid $tertiary-color;
                }
            }

            a.current {
                border-bottom: 0.25rem solid $tertiary-color;
            }

            &:hover {
                ul {
                    display: block;
                }
            }

            ul {
                position: absolute;
                display: none;
                padding: 1rem 1.5rem;
                background: #fff;
                box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
            }
        }
    }

    .mobile {
        img {
            width: 22px;
            display: inline-block;
            margin: 0 .5rem 0 0;
        }

        li {
            a {
                display: inline-block;
            }
        }
    }
}

.sidenav {
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 10000;
    font-weight: 700;
    top: 0;
    left: -1000px;
    opacity: 0;
    background-color: #fff;
    overflow-x: hidden;
    padding: 5rem 1.5rem 0 0;
    transition: 0.5s;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
    border: 1px solid rgba(205, 205, 205, 1);

    ul {
        padding-left: 1.5rem;

        li {
            list-style-type: none;
            line-height: 2rem;
            position: relative;
            border-bottom: 1px solid rgba(0, 133, 196, 0.4);

            ul {
                li {
                    &:hover {
                        border-bottom: 1px solid transparent;
                    }
                }

                height: 0;
                overflow: hidden;
                transition: all 0.3s ease-in-out;
                position: static;
            }

            a {
                text-decoration: none;
                color: rgba(0, 89, 147, 1);
                border-bottom: 4px solid transparent;
                padding: 0.2rem 0;
                display: block;

                a {
                    &:hover {
                        border-bottom: 4px solid $tertiary-color;
                    }
                }

                img {
                    filter: none;
                }
            }
        }
    }

    .closebtn {
        position: absolute;
        top: 20px;
        right: 20px;
    }

    img {
        width: 15px;
        filter: invert(19%) sepia(85%) saturate(2229%) hue-rotate(185deg) brightness(94%) contrast(102%);
    }
}

.sidenav__open {
    left: 0;
    opacity: 1;
}

.sidenav__submenu__open {
    height: auto !important;
}

.sidenav__icon__rotate {
    transform: rotate(180deg);
}

.trigger__mobile {
    img {
        width: 15px;
        filter: invert(90%) sepia(100%) saturate(0%) hue-rotate(93deg) brightness(102%) contrast(108%);
    }
}

#top__header {
    .btn__action__thin {
        img {
            width: 24px;
        }
    }

    select {
        padding: 0.8rem;
        width: auto !important;
        border: 0 !important;
        margin-right: 1rem;
        appearance: auto;
        background: none;
    }

    a.btn {
        margin-left: -5px;
    }

    a[href="https://www.mite.gov.it/"] {
        font-weight: 400;
        text-decoration: none;
        color: rgba(0, 89, 147, 1);
    }
}

.logo__mte {
    max-width: 32px;
    float: left;
}

.breadcrumbs {
    padding: 0;
    margin-left: 0;
    color: #fff;

    li {
        list-style-type: none;
        display: inline-block;

        span {
            list-style-type: none;
            display: inline-block;
        }

        a {
            color: #fff;
            font-weight: 400;
            text-decoration: none;

            &:hover {
                text-decoration: underline;
            }
        }
    }
}

.search__tool__text {
    font: 400 1rem/1.5rem Montserrat;
    letter-spacing: 0px;
    color: rgba(0, 89, 147, 1);
}

.search__tool__icon {
    background: rgba(0, 133, 196, 1);
    padding: 0.7rem 0.8rem 0 0.8rem;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: inline-block;
    cursor: pointer;

    img {
        width: 100%;
    }
}

.section__label__img__container {
    width: 48px;
    height: 48px;
    background: rgba(0, 133, 196, 1) 0% 0% no-repeat padding-box;
    border-radius: 50%;
    padding: 13px;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 1rem;
}

.section__label {
    img {
        width: 100%;
        height: auto;
    }
}

.section__label__title {
    font: 400 2rem/3rem Montserrat;
    color: rgba(0, 89, 147, 1);
}

.cards__item {
    display: none;
}

.cards {
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
    border: 1px solid rgba(205, 205, 205, 1);
    margin-bottom: 1.5rem;
    position: relative;

    p {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

.cards__figure {
    position: relative;
}

.cards__old__post {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(0, 89, 147, 1);
    color: #fff;
    font-size: .875rem;
    font-weight: 700;
    text-align: center;
    padding: .7rem 0;
}

.cards__container {
    padding: 1.5rem;
    background: #fff;
}

.cards__date__extend {
    position: absolute;
    padding: .625rem;
    top: 1rem;
    left: 1rem;
    background: rgba(255, 255, 255, 0.8);

    span {
        display: block;
        text-align: center;
    }

    .cards__day {
        font-weight: 700;
        color: rgba(0, 89, 147, 1);
        font-size: 1.5rem;
        border-bottom: 1px solid rgba(0, 89, 147, 1);
    }

    .cards__month {
        color: rgba(0, 89, 147, 1);
        font-size: .75rem;
        line-height: 1.5rem;
    }
}

.cards__label {
    font: 700 .875rem/1.125rem Montserrat;
    letter-spacing: 1.4px;
    color: rgba(255, 255, 255, 1);
    background: rgba(0, 133, 196, 1) 0% 0% no-repeat padding-box;
    display: inline-block;
    padding: 0.2rem .4rem;
    margin-bottom: 1rem;
}

.cards__icon {
    margin-right: 0.313rem;
}

.cards__info {
    border-top: 1px solid rgba(32, 121, 212, 0.2);
    padding-top: 1.25rem;

    img {
        max-width: 15px;
        vertical-align: baseline;
    }
}

.list__horizontal__cards {
    font: 700 1.5rem/2rem Montserrat;
    color: rgba(0, 89, 147, 1);
}

.card__big {
    h3 {
        color: rgba(0, 89, 147, 1);
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

.card__img__big {
    width: 100%;
    height: 368px;
    object-fit: cover;
}

.card__medium {
    h4 {
        color: rgba(0, 89, 147, 1) !important;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    p {
        min-height: 4.5rem;
        overflow: hidden;
    }
}

.card__img__medium {
    width: 100%;
    height: 280px;
    object-fit: cover;
}

.card__medium__icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    background: $tertiary-color;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__small {
    h4 {
        color: rgba(0, 89, 147, 1);
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

.card__img__small {
    width: 100%;
    height: 230px;
    object-fit: cover;
}

.card__icon__pdf {
    background: $tertiary-color url(#{$img-path}/img/file-pdf-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__youtube {
    background: $tertiary-color url(#{$img-path}/img/youtube-brands.svg) no-repeat center center;
    background-size: 30px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__question {
    background: $tertiary-color url(#{$img-path}/img/circle-question-solid.svg) no-repeat center center;
    background-size: 30px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__document {
    background: $tertiary-color url(#{$img-path}/img/file-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__users {
    background: $tertiary-color url(#{$img-path}/img/user-group-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__list {
    background: $tertiary-color url(#{$img-path}/img/list-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__pin {
    background: $tertiary-color url(#{$img-path}/img/location-dot-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__n1 {
    background: $tertiary-color url(#{$img-path}/img/file-binary-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__submit {
    background: $tertiary-color url(#{$img-path}/img/file-import-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__euro {
    background: $tertiary-color url(#{$img-path}/img/euro-sign.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__download {
    background: $tertiary-color url(#{$img-path}/img/diagram-next-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__category {
    background: $tertiary-color url(#{$img-path}/img/diagram-cells-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__exclamation {
    background: $tertiary-color url(#{$img-path}/img/exclamation.svg) no-repeat center center;
    background-size: 9px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__grid {
    background: $tertiary-color url(#{$img-path}/img/grid-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.card__icon__mail {
    background: $tertiary-color url(#{$img-path}/img/envelope-solid.svg) no-repeat center center;
    background-size: 22px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 1.2rem 1rem 1rem 1rem;
    display: inline-block;
    text-align: center;
    margin: 1.5rem 1.5rem 0 1.5rem;
}

.diveder__cta {
    margin-bottom: 3.125rem;
}

.divider__line__horizontal {
    padding-bottom: 5rem;
    padding-top: 5rem;
}

.section__divider__container {
    background-size: cover;
    background-position: center center;

    h1 {
        color: #fff;
    }

    h4 {
        color: #fff;
    }

    p {
        color: #fff;
        font-size: 1.5rem;
    }

    .cards {
        p {
            color: inherit;
            font-size: inherit;
        }
    }

    .cards__date {
        color: inherit;
    }

    span {
        color: #fff;
    }

    .border__bottom {
        color: #fff;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .section__label__title {
        color: #fff;
    }

    .divider__cta {
        a {
            &:before {
                border-bottom: 1px solid rgba(255, 255, 255, 0.2);
                z-index: 0;
            }
        }
    }
}

.section__shadow {
    span {
        color: #fff;
    }
}

.section__header__container {
    background-size: cover;
    background-position: center center;

    h1 {
        color: #fff;
    }

    h4 {
        color: #fff;
    }

    p {
        color: #fff;
    }
}

.numbers__icon {
    background: $tertiary-color;
    display: inline-block;
    width: 80px;
    height: 80px;
    padding: 1rem 0;
    text-align: center;
    border-radius: 50%;

    img {
        width: 35px;
    }
}

#section__numbers {
    .numbers__count {
        display: block;
        font: normal normal normal 40px/48px Montserrat;
        letter-spacing: 0px;
        color: $primary-color;
    }

    h4 {
        color: rgba(0, 89, 147, 1);
    }
}

#section__last__social {
    background: rgba(239, 239, 239, 1);

    .cards {
        img {
            height: 460px;
            width: 100%;
            object-fit: cover;
            object-position: center center;
        }
    }
}

#related__services {
    h4 {
        color: rgba(0, 89, 147, 1);
    }

    img {
        border-radius: 50%;
        object-fit: cover;
        width: 62px;
        height: 62px;
    }
}

.logo__footer {
    max-width: 300px !important;
    margin-top: 2rem;
}

footer {
    background: rgba(51, 51, 51, 1) 0% 0% no-repeat padding-box;
    padding-top: 5rem;

    ul {
        padding: 0;
        margin: 1.5rem 0 0 0;

        li {
            list-style-type: none;
            margin-bottom: 0.7rem;

            a {
                color: #fff;
                font-weight: 400;
                text-decoration: none;

                &:hover {
                    color: #fff;
                    text-decoration: underline;
                }
            }
        }
    }

    span {
        font-weight: 700;
        letter-spacing: 1.14px;
        color: #FFFFFF;
    }
}

.horizontal__footer__navigation {
    ul {
        margin: 0;

        li {
            display: inline-block;
            margin-right: 1.5rem;
            margin-bottom: 0;

            a {
                font-weight: 700;
            }
        }
    }
}

.main__carousel {
    .carousel-item {
        min-height: 600px;
        color: rgb(255, 255, 255);
        background-size: cover;
        background-position: center center;

        p {
            font-size: 1.5rem;
        }
    }

    h2 {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        color: #fff;
    }

    .carousel__shadow {
        background: transparent linear-gradient(73deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.1) 100%) 0% 0% no-repeat padding-box;
        min-height: 600px;
        width: 100%;
        padding-top: 8rem;
    }

    .carousel-control-next {
        width: 5%;
    }

    .carousel-control-prev {
        width: 5%;
    }

    .carousel-indicators {
        bottom: 50px;
        display: inherit;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;

        [data-bs-target] {
            width: 20px;
            height: 20px;
            padding: 0;
            background-color: #fff;
            border: 0;
            border-top: 10px solid transparent;
            border-bottom: 10px solid transparent;
            opacity: .5;
            transition: opacity .6s ease;
            border-radius: 50%;
        }

        [data-bs-target].active {
            opacity: 1;
        }
    }
}

#video__carousel {
    .carousel-control-prev {
        left: -10%;
        width: auto;
        filter: invert(11%) sepia(130%) saturate(644%) hue-rotate(120deg) brightness(55%) contrast(149%);
    }

    .carousel-control-next {
        right: -10%;
        width: auto;
        filter: invert(11%) sepia(130%) saturate(644%) hue-rotate(120deg) brightness(55%) contrast(149%);
    }
}

.filter__accordion {
    .accordion-button {
        &:not(.collapsed) {
            color: $primary-color;
            background-color: transparent;
            box-shadow: none;
            padding-left: 0;
        }

        font: 700 1.125rem/1.375rem Montserrat;
        letter-spacing: 0px;
        color: $primary-color;
        padding-left: 0;

        &::after {
            filter: invert(58%) sepia(8%) saturate(3734%) hue-rotate(68deg) brightness(160%) contrast(71%);
        }
    }
}

.accordion-body {
    padding-left: 0;
    padding-left: 0;
}

.faq__accordion {
    .accordion-button {
        display: inherit;
        padding: 1.5rem 1.25rem 1.5rem 0;

        &::after {
            position: absolute;
            top: 44%;
            right: 30px;
            filter: invert(82%) sepia(31%) saturate(4492%) hue-rotate(338deg) brightness(101%) contrast(101%);
        }

        h3 {
            color: rgba(0, 89, 147, 1);
            font-weight: 400;
        }

        p {
            font-size: 1.5rem;
            line-height: 1.8rem;
            color: #000;
        }

        &:not(.collapsed) {
            background-color: transparent;
            box-shadow: none;
            padding-left: 0;
        }
    }
}

.ar__accordion {
    .accordion-button {
        &:not(.collapsed) {
            color: #000;
            background-color: transparent;
            box-shadow: none;
            padding-left: 0;
        }

        padding-left: 0;

        &::after {
            position: absolute;
            top: 36%;
            right: 30px;
            filter: invert(82%) sepia(31%) saturate(4492%) hue-rotate(338deg) brightness(101%) contrast(101%);
        }
    }
}

.nav-tabs {
    border-bottom: none;

    .nav-link.active {
        border: 0;
        border-bottom: 4px solid $tertiary-color;
    }
}

.nav.nav-tabs.nav-fill {
    .nav-item {
        border-bottom: 1px solid rgba(32, 121, 212, 0.2);
    }
}

.table>:not(:last-child)>:last-child>* {
    border-bottom: 0.5px solid rgba(32, 121, 212, 0.2);
    vertical-align: top;
}

.table>:not(caption)>*>* {
    padding: 1rem .5rem;
    border-bottom: 0.5px solid rgba(32, 121, 212, 0.2);
    vertical-align: middle;
}

.list__bullet__rt {
    padding: 2rem 0 2rem 0;

    li {
        font-weight: 700;
        text-decoration: underline;
        padding-left: 2rem;
        margin: 1rem 0;
        position: relative;
        list-style-type: none;

        a {
            color: $primary-color;
        }

        &:before {
            position: absolute;
            content: url(#{$img-path}/img/chevrons-right.svg);
            display: block;
            left: 0;
            top: 0;
            width: 16px;
            height: 16px;
            background: $tertiary-color;
            border-radius: 50%;
        }
    }
}

.images__container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(366px, 1fr));
    grid-gap: 1rem;
    align-items: stretch;
    text-align: center;

    img {
        max-width: 100%;
    }
}

.social__icons {
    li {
        list-style-type: none;
        text-align: center;
    }

    img {
        width: 24px;
    }
}

.social__icons__green {
    img {
        filter: invert(55%) sepia(95%) saturate(319%) hue-rotate(66deg) brightness(94%) contrast(87%);
    }
}

.list__cards {
    a {
        text-decoration: none;
        color: inherit;
    }
}

.pagination__results {
    padding: 0;
    margin: 0;
    display: flex;

    li {
        display: inline-block;
        list-style-type: none;
        border-bottom: 2px solid rgba(205, 205, 205, 1);

        a {
            text-decoration: none;
            font-weight: 700;
            color: rgba(0, 89, 147, 1);
            padding: .5rem;
        }

        &:hover {
            border-bottom: 2px solid $tertiary-color;
        }
    }

    li.active {
        border-bottom: 2px solid $tertiary-color;
    }
}

.vid {
    height: 400px;
    width: 100%;
    position: relative;
    background-position: center center;
    background-size: cover;

    &:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        transition: opacity 0.2s;
        background: linear-gradient(150deg, #000, transparent 70%);
        opacity: 0.9;
    }

    &:after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        transition: opacity 0.2s;
        background-repeat: no-repeat;
        background-position: center center;
        opacity: 0.5;
        background-size: 2em;
    }

    &:hover {
        &:after {
            opacity: 0.8;
        }

        &:before {
            opacity: 0.85;
        }
    }
}

.vimeo {
    &:after {
        background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20150%20150%22%3E%3Cpath%20d%3D%22M150%20135c0%208.28-6.72%2015-15%2015H15c-8.28%200-15-6.72-15-15V15C0%206.72%206.72%200%2015%200h120c8.28%200%2015%206.72%2015%2015v120%22%20fill%3D%22%2353bded%22%2F%3E%3Cpath%20d%3D%22M126.22%2049.8c-.5%2010.56-7.85%2025-22.1%2043.35-14.75%2019.15-27.22%2028.72-37.42%2028.72-6.32%200-11.66-5.82-16.03-17.5L41.92%2072.3c-3.24-11.66-6.72-17.5-10.44-17.5-.82%200-3.65%201.7-8.5%205.1l-5.1-6.56c5.34-4.7%2010.62-9.4%2015.8-14.1%207.14-6.17%2012.5-9.4%2016.07-9.74%208.44-.8%2013.63%204.96%2015.58%2017.3%202.1%2013.32%203.56%2021.6%204.38%2024.84%202.45%2011.05%205.13%2016.57%208.05%2016.57%202.27%200%205.68-3.57%2010.22-10.74%204.54-7.16%206.97-12.6%207.3-16.36.65-6.2-1.78-9.3-7.3-9.3-2.6%200-5.27.6-8.02%201.78%205.33-17.45%2015.5-25.92%2030.53-25.44%2011.14.33%2016.4%207.55%2015.75%2021.67%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E');
    }
}

.htmlvid {
    &:after {
        background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23E34F26%22%20d%3D%22M71%20460L30%200h451l-41%20460-185%2052%22%2F%3E%3Cpath%20fill%3D%22%23EF652A%22%20d%3D%22M256%20472l149-41%2035-394H256%22%2F%3E%3Cpath%20fill%3D%22%23EBEBEB%22%20d%3D%22M256%20208h-75l-5-58h80V94H114l1%2015%2014%20156h127zm0%20147h-1l-63-17-4-45h-56l7%2089%20116%2032h1z%22%2F%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M255%20208v57h70l-7%2073-63%2017v59l116-32%201-10%2013-149%202-15h-16zm0-114v56h137l1-12%203-29%201-15z%22%2F%3E%3C%2Fsvg%3E');
    }
}

.iframevid {
    &:after {
        background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20159.00691%20111.60904%22%3E%3Cpath%20d%3D%22M36.2%20111c-25-1.3-29.6-4-34-18.6C.3%2086.7%200%2080%200%2057.4%200%2019%202.3%209.7%2013.6%204c11.5-5.6%20120-5.6%20131.4%200%206%203%2010%208.7%2011.8%2017.2%202%209.8%203%2042.2%201.5%2057.5-2%2020.4-7%2028.5-19.2%2030.8-7.6%201.5-82%202.4-102.8%201.3zM85%2065.3c11.3-6%2020.4-11%2020.3-11L84%2043%2063%2032v22c0%2012%20.4%2022%20.8%2022%20.3%200%2010-5%2021.2-10.8z%22%20fill%3D%22%23db2823%22%2F%3E%3Cpath%20d%3D%22M63.2%2032c-.4.3-.2%201-.3%201.3v28.5c0%204.6%200%209.2.5%2013.8%200%20.4.3.7.6.5%206.3-3%2012.3-6%2018.4-9.3%207.5-4%2015-7.8%2022.2-12%20.3%200%201-.4.6-.8-12.8-7-25.7-13.5-38.6-20.2-1-.6-2.2-1.3-3.4-1.7z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E');
        background-size: 7rem;
    }
}

.youtube {
    &:after {
        background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20159.00691%20111.60904%22%3E%3Cpath%20d%3D%22M36.2%20111c-25-1.3-29.6-4-34-18.6C.3%2086.7%200%2080%200%2057.4%200%2019%202.3%209.7%2013.6%204c11.5-5.6%20120-5.6%20131.4%200%206%203%2010%208.7%2011.8%2017.2%202%209.8%203%2042.2%201.5%2057.5-2%2020.4-7%2028.5-19.2%2030.8-7.6%201.5-82%202.4-102.8%201.3zM85%2065.3c11.3-6%2020.4-11%2020.3-11L84%2043%2063%2032v22c0%2012%20.4%2022%20.8%2022%20.3%200%2010-5%2021.2-10.8z%22%20fill%3D%22%23db2823%22%2F%3E%3Cpath%20d%3D%22M63.2%2032c-.4.3-.2%201-.3%201.3v28.5c0%204.6%200%209.2.5%2013.8%200%20.4.3.7.6.5%206.3-3%2012.3-6%2018.4-9.3%207.5-4%2015-7.8%2022.2-12%20.3%200%201-.4.6-.8-12.8-7-25.7-13.5-38.6-20.2-1-.6-2.2-1.3-3.4-1.7z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E');
        background-size: 7rem;
    }
}

.video__wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;

    iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

#cookie__banner {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #fff;
    font-size: .875rem;
    box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.16);
}

@media screen and (min-width:992px) {
    .sidenav {
        display: none;
    }
}

@media screen and (max-width:992px) {
    a[href="https://www.mite.gov.it/"] {
        font-size: 0.625rem;
    }

    #top__header {
        select {
            margin-right: 0;
        }
    }

    .card__img__small {
        height: 238px;
    }

    .divider__line__horizontal {
        padding-bottom: 2.5rem;
        padding-top: 2.5rem;
    }

    footer {
        span {
            padding: .5rem 0;
        }
    }

    .logo__footer {
        display: table;
    }

    .horizontal__footer__navigation {
        ul {
            li {
                display: block;
                padding: .5rem 0;
            }
        }
    }

    .nav.nav-tabs.nav-fill {
        display: block;

        h6 {
            margin: 0;
        }

        .nav-item {
            border-bottom: 1px solid rgba(32, 121, 212, 0.2);
        }
    }
}

@media (min-width: 768px) and (max-width:1024px) {
    .section__label__title {
        font: 400 1.25rem/2rem Montserrat;
    }

    .section__label__img__container {
        vertical-align: middle;
    }
}

@media screen and (max-width: 767px) {
    .section__label__title {
        font: 400 1.5rem/2.5rem Montserrat;
    }

    .section__label__img__container {
        vertical-align: middle;
    }
}

@media screen and (max-width:767px) {
    .faq__accordion {
        .accordion-button {
            &::after {
                right: -4px;
            }
        }
    }
}