.colonna-1-di-2 {
    width: 100%;
    @include make-sm-column(12);
    @include make-md-column(6);
}
.colonna-1-di-3 {
    width: 100%;
    @include make-sm-column(4);
}
.colonna-2-di-3 {
    width: 100%;
    @include make-sm-column(8);
}
.colonna-1-di-4 {
    width: 100%;
    @include make-sm-column(6);
    @include make-md-column(3);
}
.colonna-1-di-5 {
    width: 20%;
    float: left;
}
.colonna-1-di-6 {
    width: 100%;
    @include make-md-column(2);
    @include make-sm-column(4);
}

.sfondo-chiaro {
    background: $gray-bg;

    a {
        border-color: $link-color;

        &:focus,
        &:hover {
            border-color: $link-hover-color;
        }
    }

    .news-collection .newsWrapper {
        background-color: #fff;
    }
}

.sfondo-scuro {
    background: $tile-fascia-scura;
    color: #fff;

    a {
        color: #fff;
        border-color: #fff;
        border-bottom: 1px solid;

        &:focus,
        &:hover {
            color: #ddd;
            border-color: #ddd;
        }
    }

    .tileTitle {
        &,
        .title-content {
            color: #fff;
        }
    }

    .news-collection .newsWrapper {
        background-color: #fff;
    }
}

// tiles management
.tilesWrapper {
    margin: 0;

    .actionsTiles {
        background: $gray-bg;
        padding: 20px;
        text-align: center;

        a.plone-btn {
            @extend .btn-info;
            text-transform: uppercase;
            font-weight: $semibold;
        }

        .available-tiles {
            .list-group {
                justify-content: center;
                font-size: 0.9em;

                .list-group-item {
                    @extend .btn-default;
                    width: 24%;
                }

                .tileTitle {
                    font-size: 1.3em;
                }
            }
        }
    }
}

.pat-tiles-management.right-column {
    .actionsTiles {
        .available-tiles {
            .list-group-item {
                width: 100%;
            }
        }
    }
}

.tileTitle {
    font-size: 1.6em;
}

.senza-titolo {
    .tileTitle {
        display: none;
    }
}

.tilesList {
    .tileWrapper {
        position: relative;

        &:not([class*='colonna']) {
            clear: both;
            width: 100%;
        }

        &[class*='colonna'] {
            padding: 1rem 2rem;
            clear: none;
        }
    }
}
