#top-reviews {
    position: relative;
    z-index: 2;
    margin-top: -16px;
    display: flex;
    width: 90%;
    box-sizing: border-box;
    padding: 24px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    max-width: 734px;

    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.80);
    background: #FFF;
    box-shadow: 0px 20px 56px 0px rgba(0, 0, 0, 0.10);

    @media screen and (min-width: 876px) {
        gap: 32px;
        margin-top: -50px;
        padding: 32px;
        flex-direction: row;
        margin-bottom: 48px;
    }

    #top-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;

        @media screen and (min-width: 876px) {
            gap: 32px;
        }

        div:first-child {
            display: flex;
            padding: 11px 12px;
            align-items: center;
            gap: 4px;
            border-radius: 32px;
            background: #F4EFFF;
        }
    }
}

h2 {
    img.shield {
        position: absolute;
        right: -20px;
        top: 30px;

        @media screen and (min-width: 876px) {
            right: -100px;
            top: -24px;
            width: 80px;
            height: 84px;
        }
    }

    img.trophy {
        position: absolute;
        right: 8px;
        bottom: 0;
        width: 48px;
        height: 48px;

        @media screen and (min-width: 1200px) {
            right: -30px;
            width: 94px;
            height: 94px;
        }
    }
}

#softwares {
    display: grid;
    margin: 2rem 1rem;
    grid-template-columns: repeat(12, 1fr);
    justify-content: stretch;
    align-items: center;
    gap: 1rem;

    @media screen and (min-width: 1200px) {
        /* 6 while the Chrome tile is commented out awaiting store approval */
        grid-template-columns: repeat(6, 1fr);
        margin: 1rem;
    }

    a {
        padding: 40px;
        gap: 12px;
        flex: 1 0 0;

        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 152px;
        box-sizing: border-box;

        border-radius: 24px;
        background: #EFEDF5;

        text-decoration: none;

        color: #0A011A;

        img {
            display: block;
        }

        grid-column: span 6;

        @media screen and (min-width: 1200px) {
            grid-column: span 1;
        }

        @media screen and (min-width: 1440px) {
            font-size: 24px;
        }

        &:nth-child(1),
        &:nth-child(2),
        &:nth-child(3) {
            grid-column: span 4;

            @media screen and (min-width: 1200px) {
                grid-column: span 1;
            }
        }

        img {
            @media screen and (min-width: 1200px) {
                width: 56px;
                height: auto;
            }
        }

    }
}

#monthly-sub {
    color: white;

    #rocket {
        position: absolute;
        right: -16px;
        top: -17px;
        z-index: 3;
        width: 130px;
        height: 130px;
    }
}

.ribbon {
    position: absolute;
    background: url("../images/ribbon-vAtxrBU.svg");
    width: 103px;
    height: 49px;
    top: 20px;
    right: -8px;
    z-index: 4;
    color: white;
    font-weight: 700;
    box-sizing: border-box;

    padding: 0 8px 0 0;
    display: flex;
    justify-content: end;
    align-items: center;
}

#afraid-of-commitment {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;

    padding: 0 1rem;
}

#currencies {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 24px;
    justify-content: stretch;
    align-items: center;
    padding: 1rem;

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

    @media screen and (min-width: 1200px) {
        grid-template-columns: repeat(15, 1fr);
    }
}

#locations {
    box-sizing: border-box;

    @media screen and (min-width: 1200px) {
        padding: 80px 460px 80px 80px;

        h2,
        p {
            max-width: 900px;
        }
    }

    img {
        margin-top: -10px;
        border-top-left-radius: 32px;
        border-top-right-radius: 32px;
    }
}

img#voip-calls-lg {
    margin-top: -155px;
    align-self: end !important;
    width: auto;
}

img#free-entertainment-lg {
    margin-top: -85px;
    align-self: end !important;
    width: auto;
    position: relative;
    z-index: 1;
}

img#free-download-lg {
    align-self: end !important;
    justify-self: end !important;
    width: auto;
}

#free-download {
    &>div {
        display: flex;
        flex-direction: column;
        justify-content: stretch;
        align-items: start;
        gap: 24px;
    }
}

#why-stands-apart {
    justify-content: center;
    align-items: center;

    h2 {
        max-width: 700px;
    }
}

#bahamas-independence {
    padding-bottom: 180px;
}

#shredder {
    width: 158px;
    height: 180px;

    @media screen and (min-width: 1200px) {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 291px;
        height: 324px;
    }
}

#premium-treatment {
    &>div {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

#populations {
    &>div {
        p {
            justify-content: start;
            text-align: start;
        }
    }
}

#yearly-sub {
    overflow: visible !important;

    @media screen and (min-width: 1200px) {
        order: 1;
    }
}

#monthly-sub {
    overflow: visible !important;

    @media screen and (min-width: 1200px) {
        order: 2;
    }
}

#tri-yearly-sub {
    overflow: visible !important;

    @media screen and (min-width: 1200px) {
        order: 3;
    }
}

#weekly-sub {
    overflow: visible !important;

    @media screen and (min-width: 1200px) {
        order: 4;
    }
}

#cloud-servers {
    width: 204px;
    height: 242px;

    @media screen and (min-width: 1400px) {
        position: absolute;
        bottom: 0;
        right: -30px;
        width: 234px;
        height: 305px;
    }
}

#review-bar {
    img {
        width: 40px;
        height: 40px;
    }

    .author {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        margin-top: auto;
        gap: 1rem;

        color: #0A011A;
        font-weight: 600;
        font-size: 16px;
        line-height: normal;
    }

    #blur-background {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: linear-gradient(270deg, rgba(255, 255, 255, 0.70) 0%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0.70) 100%);
        backdrop-filter: blur(0px);
    }

    @media screen and (min-width: 1200px) {
        display: grid;
        gap: 32px;
        grid-template-columns: repeat(12, 1fr);

        img {
            width: 56px;
            height: 56px;
        }

        .author {
            font-size: 20px;
            line-height: 28px;
        }
    }
}



@media screen and (min-width: 1200px) {
    #free-download {
        flex-direction: row;

        &>div {
            gap: 32px;
        }
    }

    #iptv-unblocking {
        padding-bottom: 260px;
    }

    #premium-treatment {
        display: grid;
        grid-template-columns: 7fr 5fr;

        &>div {
            justify-content: start;
        }

        img {
            position: absolute;
            left: 0;
            bottom: 0;
            right: 0;
            margin: 0 auto -24px auto;
            width: auto;
            height: auto;
            max-width: 100%;
        }
    }

    #populations {
        grid-template-rows: repeat(11, 1fr);

        &>div {
            grid-column: span 3;
            padding: 40px;

            &:nth-child(1),
            &:nth-child(3) {
                grid-row: 2 / span 5;
            }

            &:nth-child(5),
            &:nth-child(7) {
                grid-row: 7 / span 5;
            }

            &:nth-child(2),
            &:nth-child(4) {
                grid-row: 1 / span 5;
            }

            &:nth-child(6),
            &:nth-child(8) {
                grid-row: 6 / span 5;
            }

            img {
                margin-bottom: 1rem;
                width: 48px;
                height: 48px;
            }
        }
    }

    #afraid-of-commitment {
        flex-direction: column;
        margin-top: -4rem;
        margin-right: -3rem;
        justify-content: start;

        img {
            width: 138px;
            height: 130px;

            transform: rotate(-0.3turn);
        }
    }

    #dedicated-ip {
        overflow: visible;
        padding: 40px;
    }

    #accepted-methods {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}