/* LISTA OFFERTE */
#offerte_container {
    display: grid; grid-template-columns: repeat(4,1fr); column-gap: 30px;
    row-gap: 30px; width:100%; margin:30px auto 0;
}
#offerte_container .offerta {
    width: 100%; height:auto; box-sizing: border-box; border-radius: 8px;
    transition: all 0.3s ease; padding: 0 0 82px; position: relative; cursor: pointer;
    background: #FFF; border: 1px solid #dfdfdf;
}
#offerte_container .offerta .immagine {
    width: 100%; height: 170px; margin: 0 0 15px; position:relative; border-radius: 8px 8px 0 0; overflow: hidden;
}
#offerte_container .offerta .immagine > img {
    width: 100%; height: 100%; object-fit: cover; border-radius: 8px 8px 0 0;
    transition: transform .3s linear;
}
#offerte_container .offerta:hover .immagine > img { transform: scale(1.1); }
#offerte_container .offerta .hover {
    display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1;
    transition: all 0.3s ease; background: #000; opacity: 0; border-radius: 8px 8px 0 0;
}
#offerte_container .offerta:hover .hover { opacity: 0.2; }
#offerte_container .offerta .titolo {
    display: block; font-weight: bold; font-size: 17px; line-height: 22px; text-transform: uppercase;
    color: #000; margin: 0 10px 15px; padding: 0; text-decoration: none;
}
#offerte_container .offerta .titolo:hover, #offerte_container .offerta .titolo:active,
#offerte_container .offerta .titolo:focus { text-decoration: none; }
#offerte_container .offerta .hotel {
    display: block; font-size: 11px; line-height: 15px; color: #000; font-weight: 500;
    margin: 0 10px 15px; background: #F6F6F6; position: relative; border-radius: 3px;
    box-sizing: border-box; padding: 14px 6px 14px 100px;
}
#offerte_container .offerta .hotel .nome_hotel {
    display: block; font-weight: 700; font-size: 13px; line-height: 110%; color: #000;
}
#offerte_container .offerta .hotel .nome_hotel i {
    color: #F59916; font-style: normal; font-weight: 600;
}
#offerte_container .offerta .hotel .citta_hotel {
    display: block; margin: 6px 0 0; font-size: 11px; line-height: 135%;
}
#offerte_container .offerta .hotel .citta_hotel svg { margin: 0 3px 1px 0; }
#offerte_container .offerta .hotel img {
    width: 90px; height: 100%; position: absolute; left: 0; top: 0; bottom: 0;
    z-index: 1; border-radius: 3px; object-fit: cover;
}
#offerte_container .offerta .hotel .etichetta {
    display: block; position: absolute; top: -9px; right: 20px; z-index: 1;
    font-style: normal; font-weight: 700; font-size: 10px;
    line-height: 12px; text-align: center; text-transform: uppercase;
    color: #000; background: #EAEAEA; border-radius: 3px; padding: 3px 5px 4px 5px; margin: 0 0 0 7px;
}
#offerte_container .offerta .servizi {
    display: block; font-size: 13px; line-height: 18px; color: #5E6D77; margin: 0 10px; padding: 0;
}
#offerte_container .offerta .servizi strong { display: block; font-weight: 700; color: #000; margin: 0 0 4px; }
#offerte_container .offerta .servizi strong svg { margin: 0 5px 0 1px; }
#offerte_container .offerta .servizi span {
    float: left; margin: 0 15px 2px 0; padding: 0 0 0 20px; background-repeat:no-repeat;
    background-size: 16px auto; background-position: 0 3px; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxNSAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE0LjE3NSAwLjAzNDg1MDJDMTEuNDE2NCAwLjk4NDkxOSA3Ljg5OTgzIDMuNTI1OCA0LjY1Njk5IDcuODc4NDRMMi43NDA3NiA1LjY0Njg4QzIuNDQ1OTUgNS4yOTMzNyAxLjg5ODQ2IDUuMjkzMzcgMS42MDM2NiA1LjY0Njg4TDAuMTkyODA3IDcuMzAzOThDLTAuMDgwOTQgNy42MzU0IC0wLjA1OTg4MjggOC4xMjE0OCAwLjIzNDkyMiA4LjQwODcxTDQuNTcyNzYgMTIuNzgzNEM0LjkzMDczIDEzLjEzNyA1LjUyMDM0IDEzLjA0ODYgNS43NzMwMyAxMi41ODQ2QzguMDg5MzUgOC4xODc3NyAxMC41NzQxIDQuOTE3NzYgMTQuNzg1NiAxLjE2MTY4QzE1LjI5MSAwLjY5NzY4OSAxNC44Mjc3IC0wLjE4NjA5NiAxNC4xNzUgMC4wMzQ4NTAyWiIgZmlsbD0iIzY2RTM4NSIvPgo8L3N2Zz4=");
}
#offerte_container .offerta .etichette { width: 1px; position: absolute; top: 10px; left: 10px; z-index: 2; }
#offerte_container .offerta .etichette span {
    display: inline-block; background: rgba(0,0,0,0.6); border-radius: 3px; margin: 0 0 5px; white-space: nowrap;
    font-weight: 600; font-size: 13px; line-height: 17px; color: #FFF; padding: 2px 10px 3px 10px;
}
#offerte_container .offerta .etichette .periodo svg { margin: 0 5px 3px 0; }
#offerte_container .offerta .etichette .target svg { margin: 0 4px 2px 0; }
#offerte_container .offerta .prezzo {
    background: #FFF; opacity: 0.9; border-radius: 3px; position: absolute; right: 10px; bottom: 10px; padding: 8px 8px 6px;
    z-index: 2; text-align: center; font-size: 10px; line-height: 14px; font-weight: 300; color: #000;
}
#offerte_container .offerta .prezzo strong { font-weight: 700; font-size: 20px; color: #FF5F00; }
#offerte_container .offerta .fondo {
    position: absolute; left: 0; right: 0; bottom: 0; z-index: 1;
}
#offerte_container .offerta .fondo .trattamento { display: block; }
#offerte_container .offerta .pulsante {
    display: block; padding: 9px 12px; background: rgb(227, 6, 19); text-align: center; font-size: 18px; transition: all 0.3s ease;
    line-height: 22px; color: #FFF; font-weight: 700; border-radius: 0 0 8px 8px; font-style: normal;
}
#offerte_container .offerta:hover .pulsante { background: rgb(158,4, 13); }
#offerte_container .offerta .pulsante svg { margin: 0 0 -1px 10px; }
#offerte_container .offerta .pulsante_prezzo {
    display: block; padding: 8px 30px 10px 15px; background: rgb(227, 6, 19); text-align: left; font-size: 12px;
    transition: all 0.3s ease; line-height: 150%; color: #FFF; font-weight: 700; border-radius: 0 0 8px 8px;
    font-style: normal; position:relative;
}
#offerte_container .offerta:hover .pulsante_prezzo { background: rgb(158,4,13); }
#offerte_container .offerta .pulsante_prezzo strong {
    font-size: 20px; line-height: 120%; color: #FFF; font-weight: 700;
}
#offerte_container .offerta .pulsante_prezzo svg {
    position: absolute; right: 20px; top: 50%; transform: translateY(-50%); z-index: 1;
}
#paginatore { width:100%; text-align:center; margin: 40px 0 0; color:#000; }
#paginatore span {
    display:inline-block; color:#FFF; border: 1px solid #e30613; background: #e30613;
    border-radius: 100%; font-size:16px; font-weight:700; line-height: 33px;
    box-sizing:border-box; width:35px; height:35px; margin:0 5px;
}
#paginatore a {
    display:inline-block; color:#000; border: 1px solid #000; transition: all 0.3s ease;
    border-radius: 100%; font-size:16px; font-weight:700; line-height: 33px;
    box-sizing:border-box; width:35px; height:35px; margin:0 5px; text-decoration: none;
}
#paginatore a:hover, #paginatore a:active,
#paginatore a:focus {
    background: rgba(0,0,0,0.1); border: 1px solid #000; text-decoration: none;
}
#paginatore span.freccia,
#paginatore a.freccia { border: none; border-radius: 0; background: none; }
#paginatore a.freccia:hover, #paginatore a.freccia:active,
#paginatore a.freccia:focus { background: none; border: none; }
#paginatore span.freccia svg,
#paginatore a.freccia svg { margin: 0; }
#paginatore a.freccia path { transition: all 0.3s ease; }
#paginatore a.freccia:hover path, #paginatore a.freccia:active path,
#paginatore a.freccia:focus path { stroke: rgb(158,4,13); }
@media screen and (max-width:1060px) {
    #offerte_container { grid-template-columns: repeat(3,1fr); }
}
@media screen and (max-width:767px) {
    #offerte_container { grid-template-columns: repeat(2,1fr); }
    #paginatore { width: auto; margin: 0 -20px 40px; }
    #paginatore span,
    #paginatore a { margin: 0 3px; }
}
@media screen and (max-width:550px) {
    #offerte_container { display: block; }
    #offerte_container .offerta { margin: 0 0 30px; }
    #offerte_container .offerta .immagine { height: 150px; }
}