.ss-card {
    display: flex;
    /* Allinea gli elementi all'interno della scheda in una riga */
    margin-top: 25px;
    /* Spazio sopra le schede */
    transition: all .3s ease;
    /* Transizione fluida per le modifiche */
    -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%);
    /* Ombra per la compatibilità con i browser WebKit */
    box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%);
    /* Ombra della scheda */
}

.ss-card:hover {
    border-color: rgba(2, 171, 245, 0.4);
    /* Colore del bordo quando si passa sopra */
    -webkit-box-shadow: 0 0 15px 0 rgba(2, 171, 245, 0.3);
    /* Ombra durante il passaggio del mouse */
    box-shadow: 0 0 15px 0 rgba(2, 171, 245, 0.3);
    /* Ombra durante il passaggio del mouse */
    outline: 0;
    /* Rimuove il contorno */
    cursor: pointer;
    /* Cambia il cursore quando si passa sopra */
}

.ss-card-left {
    background-color: #03243b;
    /* Colore di sfondo per la parte sinistra della scheda */
    padding: 20px;
    /* Padding interno della scheda */
    color: white;
    /* Colore del testo */
    font-weight: bold;
    /* Grassetto per il testo */
    font-size: 20px;
    /* Dimensione del font */
    display: grid;
    /* Utilizza il grid layout per allineare gli elementi */
    place-items: center;
    /* Centra gli elementi */
    text-align: center;
    /* Allinea il testo al centro */
    height: 100%;
    /* Altezza della scheda */
}

.ss-card-right {
    padding: 10px;
    /* Padding interno per la parte destra della scheda */
    padding-left: 20px;
    /* Padding a sinistra della parte destra */
    width: 100%;
    /* Larghezza della parte destra */
}

.ss-card-desc {
    color: #74757c;
    /* Colore del testo descrittivo */
    text-align: justify;
    /* Giustifica il testo */
}

.ss-card-cta {
    margin-bottom: 10px;
    /* Spazio sotto il pulsante di call to action */
}

.st-link .st-link__icon--arrow-small,
a .st-link__icon--arrow-small {
    width: 6px;
    /* Larghezza dell'icona della freccia */
    height: 15px;
    /* Altezza dell'icona della freccia */
}

@media only screen and (max-width: 600px) {
    .ss-card {
        display: grid;
        /* Imposta le schede in un layout a griglia per schermi più piccoli */
    }
}

.highlight {
    color: #3cb4e6;
    /* Colore celestino */
    font-weight: bold;
    /* Testo in grassetto */
    transition: color 0.3s ease;
    /* Transizione per l'effetto al passaggio del mouse */
}

.highlight:hover {
    text-decoration: underline;
    /* Sottolineatura al passaggio del mouse */
}

.ss-cards-wrap {
    display: flex;
    /* Imposta un contenitore Flex */
    flex-wrap: wrap;
    /* Permette di avvolgere le schede se necessario */
}

.ss-card {
    flex: 1;
    /* Fai in modo che tutte le schede occupino lo stesso spazio */
    min-width: 300px;
    /* Imposta una larghezza minima per ogni scheda */
    margin: 10px;
    /* Margine tra le schede */
}


.content {
    max-width: 1083px;
    margin: 0 auto;
}

.open-stdroid-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.colmn .grid-item {
    color: #022249;
    display: flex;
    align-items: center;
    flex-direction: row;
    padding: 5px;
}

.colmn.gray-items .grid-item-cell {
    border: 2px solid #c1c9d2;
}

.colmn.blue-items .grid-item-cell {
    border: 2px solid #022249;
}

.colmn.lightblue-items .grid-item-cell {
    border: 2px solid #3cb4e6;
}


.grid-item-cell {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-start;
    height: inherit;
}

.colmn-1.gray-items {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.grid-item-cell--text {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 100%;
    flex-direction: row;
    justify-content: flex-start;
    text-align: left;
}

.grid-item-cell--text span {
    display: flex;
}

.grid-item.grid-item--big-card {
    height: 140px;
}

.grid-item.grid-item--big-card>div {
    height: inherit;
}

.grid-item.grid-item--big-card span {
    font-size: 18px;
    font-family: LubalinGraphStd-Medium, Arial, Helvetica, sans-serif;
}

.colmn.lightblue-items .grid-item.grid-item--big-card span {
    font-size: 21px;
}

.colmn.lightblue-items .grid-item.grid-item--big-card .grid-item-cell--text {
    padding-left: 20px;
}

.grid-item.two-items-row {
    gap: 10px;
}

.grid-item.two-items-row .grid-item-cell {
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.grid-item.two-items-row .grid-item-cell .grid-item-cell--text {
    text-align: center;
    justify-content: center;
    padding: 0;
}

.grid-item.two-items-row .grid-item-cell .grid-item-cell--icon {
    width: auto;
    max-height: 75px;
}

.grid-item:not(.grid-item--big-card) .grid-item-cell {
    height: 100px;
    padding: 10px 5px;
}

.colmn.lightblue-items .grid-item-cell {
    justify-content: center;
}

a.grid-item-cell:hover {
    border: 2px solid #ffd200 !important;
    background: #ffd200 !important;
}

.grid-item.grid-item--big-card img {
    width: 100%;
    min-width: 70px;
    max-width: 100px;
}

.colmn.gray-items:nth-child(1) .grid-item:not(.grid-item--big-card) img {
    width: 100%;
    max-width: 90px;
    min-width: 50px;
}

.colmn.gray-items:nth-child(2) .grid-item:not(.grid-item--big-card) img {
    width: 100%;
    max-width: 40px;
    min-width: 45px;
    padding-bottom: 5px;
}

.colmn.lightblue-items img {
    width: 100%;
    max-width: 120px;
}

.grid-item-cell--text.dark-blue-color {
    padding: 20px;
}

.grid-item.two-items-row img {
    width: 55px;
}

.grid-item .grid-item-cell--text,
.grid-item-cell:hover .grid-item-cell--text span {
    color: #03234b !important;
}

.grid-item-cell--text span {
    font-size: 14px;
    text-shadow: 0 0 #03234b;
}

.colmn.blue-items .grid-item.grid-item--big-card .grid-item-cell {
    background: #02224970;
}

.colmn.lightblue-items .grid-item.grid-item--big-card .grid-item-cell {
    background: #3cb4e661;
}

@media (min-width: 641px) and (max-width: 1024px) {
    .open-stdroid-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .open-stdroid-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }
}

.ss-app-card-blocks {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
    justify-content: center;
    align-items: flex-start;
    gap: 20px;
}

.ss-app-card-block.small-12.medium-4.large-4.columns {
    float: none;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
}

.ss-app-card-block-img {
    display: flex;
    /* width: 100%; */
    align-items: center;
    justify-content: center;
    text-align: center;
}

.ss-app-card-block-img img {
    height: 100px;
    margin-bottom: 10px;
}

.ss-app-card-block-title {
    text-align: center;
    font-weight: bold;
    color: #03234b;
}

.ss-app-wrap {
    margin: 80px 0;
}

.ss-app-card-block--items {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    text-align: center;
    margin-top: 10px;
}

.grid-item.no-border-lines .grid-item-cell {
    border: 0;
}

img.st-overview-image-item {
    float: right;
    top: 0;
    position: relative;
    width: 220px;
    padding: 0 10px;
}

.colmn.lightblue-items  .grid-item.two-items-row {
    border: 2px solid #3cb4e6;
    padding: 0;
    margin: 5px 5px 10px;
}

.colmn.lightblue-items .grid-item.two-items-row  .grid-item-cell {
    border: 0;
    padding: 0;
}

.colmn.lightblue-items .grid-item.two-items-row:hover {
    background: #ffd200;
    border: 2px solid #ffd200;
}

.colmn.lightblue-items .grid-item.two-items-row .grid-item-cell span {
    color: #03234b;
}

.ss-card-link {
    float: right;
    margin: 10px;
}

@media (max-width: 640px) {
    .open-stdroid-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
    }
}