/* NameHero modifications */
/* Use to add to, or overwrite styles, in style.css */
/* style.css is used on all public pages (not logged in). DOES NOT include login and register pages. */
a.blue-bg {
    color: inherit;
    text-decoration: underline;
}

a.blue-bg:hover {
    color: #1368E7;
 }

.row--superhero-support {
    justify-content: center
}

.row.feature--homepage {
    margin-bottom: 40px;
}

h1.banner__title.homepage {
    font-size: 50px
}

h2.section__title.homepage {
    font-size: 36px;
}

.desc-left-align {
    text-align: left;
}

.feature--content-left .feature__icon.align-center {
    margin: 0 0 24px 60px;
}

.feature__icon.icon-small > img {
    height: 110px !important;
}

.nh-split::after {
    content: "\a";
    white-space: pre;
}

.package .package__desc {
    flex-direction: column;
}

.cookie-bar {
    position: fixed;
    display: block;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 10px;
    border-radius: 0;
}

.cookie-bar__content {
    flex-direction: row;
    justify-content: center;
}

.cookie-bar__icon {
    margin-bottom: 0;
    height: 60px;
}

.cookie-bar__desc {
    margin: 0 25px;
}

.cookie-bar__action.btn.btn--block {
    width: auto;
    flex: 0 1 auto;
}

.cookie-bar__action.btn.btn--block:hover {
    padding: 0 16px;
}

@media only screen and (max-width: 480px) {
    .cookie-bar__content {
        flex-direction: column;
    }

    .cookie-bar__icon {
        display: none;
    }

    .cookie-bar__desc {
        font-size: 11px;
        margin: 0 5px 5px;
    }

    .cookie-bar__action {
        font-size: 12px;
        height: 30px;
    }
}

.package .package__promotion {
    top: 8px;
}

@media only screen and (min-width: 1232px) {
    .package .package__promotion {
        top: -16px;
    }
}

.section--webhosting .partners-logo {
    margin-bottom: 0;
}

#review-grid {
    display: flex;
    flex-wrap: wrap;
}

#review-grid > div {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: center;
    width: 100%;
}

#review-grid > div > div {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 112px;
    margin-bottom: 40px;
}

#review-grid > div > div.tp-widget {
}

#review-grid .partner-widget {
    min-width: 220px;
    max-width: 250px;
    width: 100%;
    padding: 0 10px;
}

#review-grid .partner-widget img {
    height: 34px;
    /*  filter: brightness(0) saturate(100%); */
}

#review-grid .partner-widget div:nth-of-type(2) {
    display: flex;
    align-items: center;
    height: 44px;
}

#review-grid .partner-widget div {
    margin-bottom: 8px;
}

#review-grid .partner-widget div:last-of-type {
    margin-bottom: 0;
}

#review-grid p.ratings {
    font-size: 20px;
    margin: 0;
}

#review-grid p.ratings.star {
    font-size: 30px;
}

#review-grid p.ratings .fas.orange {
    color: #FF7800;
}

#review-grid p.ratings .fas.white {
    color: #FFFFFF;
}

#review-grid p.ratings .fas.yellow {
    color: #FFBD0A;
}

#review-grid p.ratings .fas.green {
    color: #00B67A;
}

#review-grid p.ratings .fa-stack {
    width: 2em;
}

#review-grid p.ratings .fa-stack.star {
    width: 1.2em;
    height: 36px;
    line-height: 36px;
}

#review-grid p.meta {
    font-size: 14px;
    color: #191919;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 0;
}

#review-grid p.meta span {
    font-weight: 800;
}

.tp-widget {
    position: relative;
}

.tp-widget > a,
.tp-widget > span {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 100;
}

@media only screen and (min-width: 768px) {
    #review-grid {
        margin-bottom: 20px;
    }

    #review-grid > div {
        flex-wrap: nowrap;
        flex-direction: row;
    }

    #review-grid .partner-widget img {
        filter: none;
    }
}

@media only screen and (min-width: 1012px) {
    #review-grid {
        flex-wrap: nowrap;
    }

    #review-grid > div {
        justify-content: flex-end;
    }

    #review-grid > div > div {
        max-width: 220px;
        justify-content: flex-end;
    }

    #review-grid p.ratings .fa-stack.star {
        width: 1.1em;
    }

    #review-grid p.ratings {
        font-size: 18px;
    }

    #review-grid p.ratings.star {
        font-size: 28px;
    }

    #review-grid .partner-widget img {
        height: 31px;
    }

    #review-grid .partner-widget div:nth-of-type(2) {
        height: 40px;
    }
}

@media only screen and (min-width: 1232px) {
    #review-grid {
        margin-bottom: 40px;
    }

    #review-grid > div {
        justify-content: flex-end;
    }

    #review-grid > div > div {
        max-width: 280px;
        justify-content: flex-end;
    }

    #review-grid p.ratings .fa-stack.star {
        width: 1.2em;
    }

    #review-grid p.ratings {
        font-size: 20px;
    }

    #review-grid p.ratings.star {
        font-size: 30px;
    }

    #review-grid .partner-widget {
        padding: 0 0 0 0;
    }

    #review-grid .partner-widget img {
        height: 34px;
    }

    #review-grid .partner-widget div:nth-of-type(2) {
        height: 44px;
    }
}

.ha-custom {
    display: flex;
    align-items: center;
    justify-content: center;
}

.ha-custom.m-top {
    margin-top: 45px;
}

.ha-custom.m-bottom {
    margin-bottom: 25px;
}

.ha-custom > div {
    padding: 0 10px;
}

.ha-custom > div img {
    width: 120px;
}

.ha-custom > div:first-of-type img {
    width: 140px;
}

.ha-custom > div.bng img {
    width: 300px;
}

.section {
    padding: 70px 0;
}

.section.section--webhosting {
    padding-top: 40px;
}

.section.section--succeed {
    margin-bottom: -251px;
    padding-bottom: 335px;
}

.section + .section--dark + .section {
    padding-top: 70px;
}

.section + .section--dark + .section.ai-builder {
    padding: 140px 0;
}

.section + .section--dark {
    padding-top: 70px;
}

.section + .section--graphic-top {
    padding-top: 250px;
}

.section--nest + .section--graphic-top {
    margin-top: 120px;
}

@media (max-width: 512px) {
    .section--nest + .section--graphic-top {
        margin-top: -50px;
    }
}

.review-wrapper {
    padding: 32px;
    background: #FFFFFF;
    border-radius: 6px;
}

.review-wrapper .section__title {
    color: #000000 !important;
    font-size: 28px !important;
}


#review-grid {
    margin-bottom: 0;
}

.banner.overlap-box {
    margin-bottom: -180px;
    padding-bottom: 240px;
}

@media (max-width: 1011px) {
    .banner.overlap-box {
        margin-bottom: -300px;
        padding-bottom: 209px;
    }

    #review-grid .partner-widget {
        padding: 0;
    }
}

@media (min-width: 1012px) {
    .review-wrapper .review-row > div {
        margin-bottom: 0 !important;
    }

    .partner-widget-last {
        margin-right: -24px;
    }
}

.banner.overlap + .section .section__title {
    margin-bottom: 32px;
}

#trustpilot-grid .trustpilot-widget {
    height: inherit;
}

#trustpilot-grid .trustpilot-widget.has-shadow {
    padding: 10px 0;
    margin-bottom: 20px;
}

@media (max-width: 411px) {
    #trustpilot-grid .trustpilot-widget.has-shadow > iframe {
        height: 235px !important;
    }
}

.banner.overlap + .section.trustpilot .section__title {
    margin-bottom: 0;
}

.trustpilot .review-wrapper {
    padding: 10px 32px 0;
}

.nav__link--dark {
    color: #112240 !important;
}


.title-packages {
    margin-bottom: 80px;
}


.banner__illustrations--reseller .banner__illustration-left,
.banner__illustrations--reseller .banner__illustration-right {
    bottom: -84px;
}

.banner--left .banner__content,
.banner--left .banner__title,
.banner--left .banner__desc {
    align-items: start;
    text-align: start;
}

.list-orange {
    margin-top: 24px;;
}

.list-orange li {
    position: relative;
    padding-left: 24px;
}

.list-orange li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 8px;
    width: 8px;
    background: #FF7800;
    border-radius: 50px;
}

.section__title--underline span {
    border-bottom: 3px solid #FF7800;
}

.section--faq:not(.section--dark) .top__title {
    color: #144FC4 !important;
}

.section--faq:not(.section--dark) .list-group__item .collapse-icon:before,
.section--faq:not(.section--dark) .list-group__item .collapse-icon:after {
    background-color: #144FC4 !important;
}

.section--faq:not(.section--dark) p {
    color: #4D5977 !important;
}

.svg-mod #logo-new {
    display: none;
}

li.nh-dropdown > p {
    margin: 0;
    cursor: pointer;
}

li.nh-dropdown > div {
    display: block;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    border-radius: 8px;
    position: absolute;
    z-index: 1000;
    width: max-content;
    padding: 5px;
    margin: 0;
    text-align: left;
    background-color: #E2E7F1;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .15);
    top: 60px;
}

.nav__item.nh-subitem {
    min-height: 36px;
}

.site-navbar .navbar__nav .nav__link.nh-sublink {
    font-size: 16px;
    color: #000000;
    padding: 0 8px;
    min-height: auto;
    transition: color .2s;
}

.site-navbar .navbar__nav .nav__link.nh-sublink:hover,
li.nh-dropdown:hover .nav__link {
    color: #FF7800;
}

/* ---------------------------------------------------------------------------
   AI Agents mega menu.

   Rides on .nh-dropdown for show/hide and for the mobile collapse, so only the
   panel's own layout lives here. The right-edge clamp matters: the item sits
   second from the end of the nav, and a left-anchored panel this wide runs off
   screen at 1100px.
   --------------------------------------------------------------------------- */
/* The nav list is the positioning context. The exact left offset is set per
   menu by the placement script at the end of header.tpl, which lines each
   panel up with its own trigger and clamps it inside the viewport. The value
   here is only the pre-script fallback. */
.site-navbar .navbar__main .navbar__nav {
    position: relative;
}

li.nh-dropdown.nh-mega > div {
    left: 0;
    right: auto;
    top: 54px;
    transition: opacity .3s, visibility .3s;
    width: 720px;
    max-width: calc(100vw - 32px);
    padding: 26px 0 0;
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.nh-mega__panel {
    position: relative;
    display: flex;
    gap: 20px;
    padding: 20px;
    width: 100%;
    border: 1px solid rgba(16, 24, 40, .08);
    border-radius: 10px;
    background-color: #FFFFFF;
    box-shadow: 0 12px 32px rgba(16, 24, 40, .14);
}

/* The pointer. --nh-caret is set per menu by the placement script, so it aims
   at whichever nav item opened the panel rather than at a fixed spot. */
.nh-mega__panel::before {
    content: "";
    position: absolute;
    top: -7px;
    left: var(--nh-caret, 50%);
    width: 13px;
    height: 13px;
    margin-left: -7px;
    border-top: 1px solid rgba(16, 24, 40, .08);
    border-left: 1px solid rgba(16, 24, 40, .08);
    border-radius: 3px 0 0 0;
    background-color: #FFFFFF;
    transform: rotate(45deg);
}

.nh-mega__feature {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 0 0 240px;
    padding: 24px 22px;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    /* Starts on the vivid brand blue rather than the deep one. The old
       #0D3C9F to #040D70 pair is correct brand navy but at this size it just
       reads black. */
    background: linear-gradient(145deg, #144FC4 0%, #0D3C9F 52%, #030B7B 100%);
    box-shadow: 0 6px 18px rgba(20, 79, 196, .28);
    transition: box-shadow .25s, transform .25s;
}

/* Light thrown from the top right, so the panel has some depth instead of
   being a flat rectangle of colour. Sits under the text via z-index. */
.nh-mega__feature::before {
    content: "";
    position: absolute;
    top: -46px;
    right: -46px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .22) 0%, rgba(255, 255, 255, 0) 68%);
    pointer-events: none;
}

/* The NameHero orange, kept to a thin edge along the bottom. Enough to tie
   the card to the brand without competing with the blue. */
.nh-mega__feature::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background: linear-gradient(90deg, #FF7800 0%, #FFBD0A 100%);
}

.nh-mega__feature:hover {
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(20, 79, 196, .38);
}

.nh-mega__feature-title,
.nh-mega__feature-desc,
.nh-mega__feature-cta {
    position: relative;
    z-index: 1;
}

.nh-mega__feature-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.2px;
    text-wrap: balance;
    color: #FFFFFF;
}

.nh-mega__feature-desc {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.45;
    color: rgba(255, 255, 255, .78);
}

.nh-mega__feature-cta {
    /* Full width of the card, so it reads as the card's button rather than a
       pill floating next to the copy. */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 16px;
    padding: 10px 14px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: #FFFFFF;
    background-color: #FF7800;
    transition: background-color .2s;
}

.nh-mega__feature:hover .nh-mega__feature-cta {
    background-color: #FF9433;
    color: #FFFFFF;
}

.nh-mega__feature-cta .fa-external-link-alt {
    font-size: 11px;
    transition: transform .2s;
}

.nh-mega__feature:hover .nh-mega__feature-cta .fa-external-link-alt {
    transform: translate(2px, -2px);
}

.nh-mega__grid {
    display: grid;
    flex: 1 1 auto;
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.nh-mega__item {
    display: flex;
    min-height: 0;
    min-width: 0;
}

.site-navbar .navbar__nav .nh-mega__link {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    min-height: auto;
    transition: background-color .2s, border-color .2s;
}

.site-navbar .navbar__nav .nh-mega__link:hover {
    background-color: #F3F5FA;
    border-color: #144FC4;
    text-decoration: none;
}

.nh-mega__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    height: 28px;
    margin-top: 1px;
}

.nh-mega__icon img {
    max-width: 28px;
    max-height: 28px;
    object-fit: contain;
}

.nh-mega__text {
    display: block;
    min-width: 0;
    overflow: hidden;
}

.nh-mega__name {
    display: block;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
    color: #101828;
    white-space: nowrap;
}

.nh-mega__link:hover .nh-mega__name {
    color: #FF7800;
}

.nh-mega__desc {
    display: block;
    margin-top: 1px;
    font-size: 12.5px;
    line-height: 1.4;
    color: #667085;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Font Awesome glyphs stand in for a logo on the Hosting and VPS menus, which
   have no per-product artwork the way the apps and the games do. */
.nh-mega__icon i {
    font-size: 17px;
    color: #144FC4;
}

.nh-mega__link:hover .nh-mega__icon i {
    color: #FF7800;
}

/* VPS has three items. Two columns would leave a hole, so it runs as one
   column and the panel shrinks to match. */
/* Nine games, and a game's name is the whole label: the art already says what
   it is, so no taglines and three tighter columns. */
/* VPS holds three items. In two columns that leaves an empty cell, which is
   the white space; one column fills cleanly and the panel narrows to suit. */
li.nh-dropdown.nh-mega--narrow > div {
    width: 570px;
}

.nh-mega--narrow .nh-mega__grid {
    grid-template-columns: minmax(0, 1fr);
}

li.nh-dropdown.nh-mega--games > div {
    width: 880px;
}

/* The artwork is a wordmark: it already says "Minecraft", so a text label
   beside it repeats itself, and boxing nine differently-shaped logos in little
   dark chips is what made this menu look messy. Each game becomes one tile of
   art instead, three across, and the name stays for screen readers only. */
.nh-mega--games .nh-mega__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.nh-mega--games .nh-mega__link {
    flex-direction: column;
    gap: 0;
    padding: 0;
    border-radius: 8px;
    overflow: hidden;
    background: #0E1526;
}

.nh-mega--games .nh-mega__link:hover {
    background: #0E1526;
    border-color: #FF7800;
}

.nh-mega--games .nh-mega__icon {
    display: block;
    flex: none;
    width: 100%;
    height: auto;
    margin: 0;
    aspect-ratio: 522 / 250;
}

.nh-mega--games .nh-mega__icon img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    transition: transform .25s;
}

.nh-mega--games .nh-mega__link:hover .nh-mega__icon img {
    transform: scale(1.04);
}

/* The art carries the name, so the text is for assistive tech only. */
.nh-mega--games .nh-mega__text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* Below the nav breakpoint the panel is an inline accordion, so the feature
   card and the two-up grid both collapse to a single stacked column. */
@media (max-width: 1011px) {
    li.nh-dropdown.nh-mega > div,
    li.nh-dropdown.nh-mega--narrow > div,
    li.nh-dropdown.nh-mega--games > div {
        left: auto;
        right: auto;
        top: auto;
        width: auto;
        max-width: none;
        padding: 0;
        background: none;
        box-shadow: none;
        border: none;
    }

    .nh-mega__panel {
        display: block;
        max-width: none;
        padding: 0;
        border: none;
        border-radius: 0;
        background: none;
        box-shadow: none;
    }

    .nh-mega__panel::before {
        display: none;
    }

    .nh-mega__feature {
        display: none;
    }

    .nh-mega__grid {
        grid-template-columns: 1fr;
    }

    .nh-mega--games .nh-mega__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .site-navbar .navbar__nav .nh-mega__link {
        padding: 7px 8px;
    }

    .nh-mega__desc {
        display: none;
    }
}

li.nh-dropdown:hover > div {
    transition: .3s;
    opacity: 1;
    visibility: visible;
}

@media (max-width: 1011px) {
    .site-navbar .navbar__main .navbar__nav .nav__item.nh-dropdown > div {
        display: none;
    }

    .site-navbar .navbar__main.is-open {
        height: 85vh;
    }

    li.nh-dropdown > div {
        position: relative;
        opacity: 1;
        visibility: visible;
        top: auto;
        border: none;
        background: none;
        border-radius: 0;
        padding: 0;
    }
}

@media (max-width: 751px) {
    .banner--homepage {
        padding-bottom: 0;
    }

    .site-navbar .navbar__main.is-open {
        height: 75vh;
    }
}

@media (max-width: 375px) {
    .site-navbar.menu-is-open .navbar__top ul li a {
        font-size: 15px;
    }

    .site-navbar .navbar__top a {
        font-size: 15px;
    }

    .site-navbar .navbar__top a .svg-icon {
        margin-right: 4px;
    }
}

.footer__bottom.footer--horizontal {
    padding-top: 80px;
    line-height: 1.5;
}

.row.nh-footer-bottom,
.footer__bottom > .container > .row > div {
    align-items: baseline;
}

/* Add margin to bottom of primary page desc if needed */
.banner__desc.mb-24 {
    margin-bottom: 24px;
}

/* Reset element order causing bad spacing */
@media (max-width: 513px) {
    .section--graphic-right div[class^=col-]:nth-child(1) {
        order: revert;
    }

    .section--graphic-right div[class^=col-]:nth-child(1):not(.nh-order-rv) {
        order: 2;
    }
}

/* Fix icon and content alignment */
@media (max-width: 751px) {
    .feature--bordered .feature__icon.margin-zero {
        margin-top: 0;
    }

    .m-t-2x.margin-zero {
        margin-top: 0 !important;
    }
}

.nh-section-subtitle {
    padding: 0;
    text-align: center;
    margin: 0 0 24px;
}

/* Add right margin to checkbox on related form */
.block--supportticketsubmit-two label input[type='checkbox'] {
    margin-right: 8px;
}

.package .package__discount--start {
    color: #B5B9C9;
}

/* Override font size and asterisk for pricing notice */
.package .package__price--price,
.package .package__price--standard {
    font-size: 38px;
    line-height: 24px;
    position: relative;
}

/* Override font size */
h4.package__name {
    font-size: 24px;
}


.banner.banner--superhero {
    margin-bottom: -160px;
    padding-bottom: 300px;
}

.dark-gradient {
    background: linear-gradient(90deg, #0D3C9F 0%, #040D70 100%);
}

.feature.dark-gradient:hover .feature__desc,
.dark-gradient .feature__title,
.dark-gradient .feature__desc {
    color: #FFFFFF;
}

.feature--bordered .feature__icon.allow-overflow {
    overflow: visible;
}

h4.nh-secondary {
    color: #FF6D00;
    font-size: 30px;
    font-weight: 800;
    margin-bottom: 14px;
    height: 56px;
}

.banner--flex {
    display: flex;
    flex-wrap: wrap;
}

.banner--flex > div {
    flex: 0 0 50%;
    max-width: 50%;
}

.banner__quote {
    padding: 10px 5px 0;
}

.banner__quote > div {
    display: flex;
    flex-direction: column;
    position: relative;
    border: 1px solid #E1E2E5;
    border-radius: 18px;
    height: 100%;
    padding: 30px 15px 10px;
}

.banner__quote svg {
    width: 28px;
    height: 28px;
}

.banner__quote .quote-header {
    color: #FF6D00;
    font-size: 30px;
    font-weight: 800;
    text-align: center;
}

.banner__quote .quote-body {
    color: #FFFFFF;
    font-size: 18px;
    text-align: center;
    padding: 0 30px;
}

.banner__quote .quote-author:before {
    content: "";
    height: 2px;
    background-color: #FF6D00;
    display: block;
    width: 60px;
    margin: 10px auto;
}

.banner__quote .quote-author {
    color: #FFFFFF;
    font-size: 18px;
    text-align: center;
    margin-top: auto;
}

.banner__quote .top-quote {
    position: absolute;
    top: -15px;
    left: 25px;
    padding: 0 10px;
    background: linear-gradient(90deg, #082285 0%, #072184 100%);
}

.banner__quote .bottom-quote {
    position: absolute;
    bottom: -25px;
    right: 25px;
    padding: 0 10px;
    background: linear-gradient(90deg, #06177A 0%, #06167A 100%);
}

.banner__quote .top-ellipse {
    position: absolute;
    top: 0;
    right: 15px;
}

.top-ellipse > i {
    font-size: 12px;
    padding-left: 6px;
    color: #FF6D00;
}

.nh-scroller {
    display: flex;
    align-items: center;
    justify-content: center;
}

.nh-scroller > div:first-of-type {
    padding-right: 30px;
}

.nh-scroller > div:last-of-type {
    padding-left: 30px;
}

.nh-scroller > div.arrow svg {
    width: 30px;
    cursor: pointer;
}

.nh-scroller > div.content {
    width: calc(100% - 120px);
    max-width: 1080px;
}

.nh-scroller-wrapper {
    position: relative;
    overflow: hidden;
}

.nh-scroller-content {
    display: flex;
}

.nh-scroller-content > div {
    max-width: 360px;
    height: 210px;
    text-align: center;
}

.nh-scroller-content > div > div {
    padding: 0 10px;
    height: inherit;
}

.nh-scroller-content > div:first-of-type {
    margin-left: 0;
}

.nh-scroller-content > div:last-of-type {
    margin-right: 0;
}

.nh-scroller .nh-scroller-content {
    max-width: 3600px;
    padding: 30px 0;
}

.nh-scroller .testimonial--horizontal a,
.nh-scroller .video--horizontal a {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 32px 32px 10px;
    background: #FFFFFF;
    border-radius: 4px;
    transition: 0.3s ease;
    height: 100%;
}

.nh-scroller .testimonial--horizonta {
    margin-top: 15px;
}

.nh-scroller .testimonial--horizontal a {
    padding: 18px 32px 10px;
    text-align: left;
}

.nh-scroller .testimonials__content {
    margin-bottom: 0;
    color: #536080;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
}

.nh-scroller .testimonials__action > * {
    height: auto;
}

.nh-scroller .video--horizontal a > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.nh-scroller .video--horizontal a > div > div {
    width: 66px;
    height: 66px;
    border-radius: 50%;
    margin-bottom: 16px;
    position: relative;
    transition: background 0.3s;
    background: #FF6D00;
}

.nh-scroller .video--horizontal a:hover {
    transform: translate3d(0, -8px, 0);
}

.nh-scroller .video--horizontal a:hover > div > div {
    background: #0D3C9F;
}

.nh-scroller .video--horizontal img {
    height: 18px;
    width: 14px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.nh-scroller .video--horizontal p {
    color: #040D70;
}

.review-graphic {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 0;
    margin-bottom: 15px;
}

.section__actions.nh-reviews {
    margin-top: 40px;
}

.review-stars {
    margin-left: 50px;
}

.review-desc {
    width: 300px;
    border: 1px solid #E1E2E5;
    border-radius: 8px;
    position: relative;
    display: flex;
    justify-content: center;
    height: 125px;
    align-items: flex-end;
    margin-right: 50px;
}

.review-desc:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 30px;
    right: auto;
    top: auto;
    bottom: -40px;
    border: 20px solid;
    border-color: #E1E2E5 transparent transparent #E1E2E5;
}

.review-desc:after {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 32px;
    right: auto;
    top: auto;
    bottom: -35px;
    border: 18px solid;
    border-color: #FFFFFF transparent transparent #FFFFFF;
}

.review-desc p {
    padding-bottom: 20px;
    margin: 0;
}

.review-desc p span {
    color: #FF6D00;
    padding: 0 10px;
    position: absolute;
    left: 50%;
    top: -5px;
    background: #FFFFFF;
    font-size: 100px;
    font-weight: 500;
    transform: translateX(-50%);
}

.nh-section__graphic-top {
    max-width: 1048px;
    margin: -130px auto auto;
}

.nh-section__desc {
    text-align: center;
    margin-top: 40px;
}

.section--video .video__container.nh-migrate {
    width: auto;
    height: auto;
    background: none;
}

.list-group.nh-migrate .list-group__item {
    align-items: center;
}

.list-group.nh-migrate .list-group__item {
    padding-top: 0;
    padding-bottom: 0;
}

.list-group.nh-migrate .list-group__item .list-group--content p {
    font-size: 18px;
    text-align: left;
}

.section--video .video__container.nh-migrate > a > div {
    display: flex;
    align-items: flex-end;
    padding: 20px;
    border-radius: 6px;
    background-color: #0C227C;
}

.section--video .video__container.nh-migrate > a > div p {
    font-size: 28px;
    font-weight: 800;
    text-align: center;
    padding: 0 20px 30px;
    color: #495575;
    margin: 160px 0 0;
}

.section--video .video__container.nh-migrate .video__button {
    width: 96px;
    height: 96px;
    top: 25%;
    background: #FF7800;
}

.section--video .video__container.nh-migrate .video__inner:hover .video__button {
    background: rgba(0, 0, 0, 0.64);
}

.nh__section__tp-banner {
    display: flex;
    align-items: center;
    max-width: 1048px;
    color: #FFFFFF;
    background-color: #0EC382;
    margin: 0 auto;
}

.tp-banner-badge,
.tp-banner-link {
    display: flex;
    flex: 0 0 250px;
    justify-content: center;
}

.tp-banner-review {
    flex: 1 0 calc(100% - 500px);
    padding: 0 40px;
    border-left: 2px solid #FFFFFF;
}

.tp-banner-review p {
    font-size: 18px;
    margin: 0;
}

.btn--outline.btn--white {
    color: #FFFFFF;
    border-color: #FFFFFF
}

.btn--outline.btn--white:hover {
    color: #FFFFFF;
    background: 0 0;
    border-color: #FFFFFF
}

.btn--outline.btn--white.drop-enabled,
.btn--outline.btn--white.is-active,
.btn--outline.btn--white:active,
.btn--outline.btn--white:focus {
    color: #FFFFFF;
    background: 0 0;
    border-color: #FFFFFF
}

.btn--white span:after {
    content: url(../../img/arrow-right-white.svg)
}

.m-w-400 {
    max-width: 400px;
}

.m-w-490 {
    max-width: 490px;
}

.m-w-80p {
    max-width: 80%;
}

p.support-msg {
    margin-top: -32px;
    font-size: 15px;
    font-weight: 700;
}

p.nh-ent-link {
    font-size: 20px;
    font-weight: 800;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 80px;
}

.blog-img {
    display: flex;
    align-items: center;
    overflow: hidden;
}

.blog-content {
    display: flex;
    flex-direction: column;
}

.blog-content > a:first-of-type {
    flex: 0 0 94px;
}

.blog-content > a:last-of-type {
    flex: 0 0 36px;
}

.blog-content > p {
    flex: 1 1 auto;
}

.nh-enterprise-ty {
    margin-top: -150px;
}

.feature--data.feature--nhdata .feature__list li {
    font-size: 14px;
    line-height: 1.8;
    list-style: circle;
    margin-bottom: 4px;
}

.feature--web-hosting,
.feature--reseller-hosting {
    margin-top: 56px;
}

.feature--reviews .feature__icon.hth {
    width: 125px;
}

span.nh-desktop-icon,
span.nh-desktop-icon-t {
    display: inherit;
}

span.nh-mobile-icon,
span.nh-mobile-icon-t {
    display: none;
}

/********* Styles for Enterprise page form *********/
#nh-ent input::placeholder,
#nh-ent textarea::placeholder,
#nh-ent select::placeholder {
    font-size: 15px;
}

.form-request select.form-control.form-control--basic {
    opacity: initial;
    font-size: 15px;
    height: 48px;
    border: 1px solid #E0E4ED;
    border-radius: 6px;
    padding-top: 0;
    padding-bottom: 0;
    appearance: none;
    -webkit-appearance: none;
    background-image: url(../../img/arrow-drop.svg);
    background-position-y: 50%;
    background-position-x: calc(100% - 11px);
    background-repeat: no-repeat;
    padding-right: 24px;
    cursor: pointer;
}

.form-request select.form-control.form-control--basic:not(.visited) {
    color: #536080;
    opacity: 60%;
}

.form-request select.form-control.form-control--basic option {
    color: inherit;
}

.form-request select.form-control.form-control--basic:hover {
    background-image: url(../../img/arrow-drop.svg);
    background-position-y: 50%;
    background-position-x: calc(100% - 11px);
    background-repeat: no-repeat;
    border-color: #536080;
}

.form-request select.form-control.form-control--basic:active,
.form-request select.form-control.form-control--basic:focus {
    border-color: #144FC4;
    outline: 0;
}

@media (max-width: 592px) {
    .form-request {
        width: 100%;
        padding: 20px;
        overflow-x: hidden;
    }
}
/********* End Styles for Enterprise page form *********/

/* For 2 column feature matrix */
.js-plan-two {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
}

@media (max-width: 1247px) {
    .nh-scroller > div.content {
        max-width: 720px;
    }
}

@media (max-width: 1011px) {
    .nh-scroller > div.content {
        max-width: 360px;
    }
}

@media (max-width: 1011px) {
    .banner__quote {
        max-height: 300px;
        margin: auto 0;
    }

    h4.nh-secondary {
        height: 84px;
    }

    .tp-banner-badge, .tp-banner-link {
        flex: 0 0 180px;
    }

    .tp-banner-badge svg {
        width: 180px;
        height: 90px;
    }

    .tp-banner-review {
        padding: 0 20px;
        flex: 1 0 calc(100% - 360px);
    }

    .tp-banner-review svg {
        width: 20px;
        height: 20px;
    }

    .tp-banner-review p {
        font-size: 14px;
    }

    .tp-banner-link .btn--lg {
        font-size: 16px;
    }


    .row.nh-migrate {
        flex-wrap: nowrap;
        flex-direction: column;
        align-items: center;
    }

    .row.nh-migrate > div.col-md-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .row.nh-migrate .section__graphic {
        margin-left: auto;
        margin-right: auto;
        max-width: inherit;
    }

    .section--video .video__container.nh-migrate {
        margin-top: 0;
    }

    .section--video .video__container.nh-migrate .video__inner {
        padding: 0;
        top: auto;
    }

    .row.nh-migrate .section__title-left {
        text-align: center;
    }

    .row.nh-migrate .section__desc.text-left {
        text-align: center !important;
        margin-top: 10px;
    }
}

@media (max-width: 751px) {
    h4.nh-secondary {
        height: auto;
    }

    .nh-section__graphic-top {
        margin: -60px auto auto;
    }

    .section.section--sides .row.nh-migrate .section__content {
        order: inherit;
        margin-top: 0;
        padding: 0 24px;
    }

    .section--video .video__container.nh-migrate {
        margin-top: 0;
    }

    .section.section--sides .row.nh-migrate .section__graphic {
        max-width: 90%;
        margin-top: 40px;
    }

    .list-group.nh-migrate .list-group__item .list-group--content p {
        font-size: inherit;
    }

    .section--video .video__container.nh-migrate .video__button {
        width: 72px;
        height: 72px;
    }

    .section--video .video__container.nh-migrate .video__button img {
        width: 24px;
    }

    .section--video .video__container.nh-migrate > a > div p {
        font-size: 18px;
        padding: 0 10px;
        margin-top: 100px;
    }
}

@media (max-width: 592px) {
    .banner--flex {
        flex-direction: column;
        align-items: center;
    }

    .banner--flex > div {
        max-width: 90%;
    }

    .nh-section__graphic-top {
        margin: -20px auto auto;
    }

    .nh__section__tp-banner {
        width: 90%;
        max-width: 240px;
        flex-direction: column;
        padding: 0 20px 20px 20px;
    }

    .nh__section__tp-banner > div {
        flex-basis: content;
    }

    .tp-banner-review {
        border: none;
        border-top: 2px solid #FFFFFF;
        padding: 30px 0;
    }

    span.nh-desktop-icon {
        display: none;
    }

    span.nh-mobile-icon {
        display: inherit;
    }
}

@media (max-width: 480px) {
    .section--video .video__container.nh-migrate .video__button {
        width: 64px;
        height: 64px;
    }

    .section--video .video__container.nh-migrate .video__button img {
        width: 24px;
    }

    .section--video .video__container.nh-migrate > a > div p {
        font-size: 16px;
        padding: 0 10px;
        margin-top: 80px;
    }

    .review-graphic {
        flex-direction: column;
    }

    .review-desc {
        width: 90%;
        max-width: 300px;
        margin: 0;
    }

    .review-desc p {
        font-size: 14px;
    }

    .review-desc p span {
        font-size: 80px;
    }

    .review-stars {
        margin: 50px 0 0;
    }

    .review-stars svg {
        width: 40px;
        height: 40px;
    }

    .nh-scroller .testimonial--horizontal a {
        padding: 5px 10px 5px;
    }

    .nh-scroller-wrapper .testimonials__head .testimonials__auth {
        font-size: 16px;
    }

    .nh-scroller-wrapper .testimonials__verified img {
        margin-left: -10px;
    }
}

@media (max-width: 360px) {
    .section--video .video__container.nh-migrate .video__inner {
        width: 95%;
    }

    .section--video .video__container.nh-migrate .video__button {
        width: 56px;
        height: 56px;
    }

    .section--video .video__container.nh-migrate .video__button img {
        width: 20px;
    }

    .section--video .video__container.nh-migrate > a > div p {
        font-size: 14px;
        padding: 0 10px;
        margin-top: 60px;
    }

    .nh-scroller > div.arrow svg {
        width: 20px;
        cursor: pointer;
    }

    .nh-scroller > div:first-of-type {
        padding-right: 20px;
    }

    .nh-scroller > div:last-of-type {
        padding-left: 20px;
    }

    .nh-scroller > div.content {
        width: calc(100% - 80px);
    }

    .nh-scroller .nh-scroller-content {
        width: 3600px;
        padding: 0;
    }

    .nh-scroller-content > div {
        width: 208px;
        height: 120px;
        text-align: center;
    }
}

@media (max-width: 330px) {
    span.nh-desktop-icon-t {
        display: none;
    }

    span.nh-mobile-icon-t {
        display: inherit;
    }
}

@media (max-width: 320px) {
    .section--video .video__container.nh-migrate .video__inner {
        width: 100%;
    }

    .section--video .video__container.nh-migrate .video__button {
        width: 48px;
        height: 48px;
        top: 28%;
    }

    .section--video .video__container.nh-migrate .video__button img {
        width: 18px;
    }
}

.business-email-platform {
    padding: 35px;
}

.business-email-platform > div {
    display: flex;
    align-items: center;
}

.business-email-platform img {
    width: 185px;
    padding: 0 25px;
}

.business-email-platform svg {
    width: 210px;
}

.flex-vps-platform svg {
    height: 180px;
}

.flex-vps-platform .section__title {
    margin-top: 16px;
    color: #144FC4 !important;
    font-weight: 800;
}

.flex-vps-platform .bullet-title {
    margin: 0 auto;
}

img.flex-alma-linux {
    padding: 16px 5px;
}

@media only screen and (min-width: 560px) {
    img.flex-alma-linux {
        padding: 48px 5px;
    }
}

@media only screen and (min-width: 751px) {
    img.flex-alma-linux {
        padding: 22px 5px;
    }
}

@media only screen and (min-width: 1012px) {
    img.flex-alma-linux {
        padding: 34px 5px;
    }
}

@media only screen and (min-width: 1232px) {
    img.flex-alma-linux {
        padding: 48px 5px;
    }
}

/* Override nav css for screen width */
@media (max-width: 768px) {
    .nav--tabs.nav--packages {
        width: 100%;
        flex-direction: column;
        border-radius: 5px;
    }

    .nav--tabs.nav--packages .nav__item .nav__link {
        max-width: 100%;
        border-radius: 5px;
        justify-content: center;
    }
}

@media (max-width: 751px) {
    .footer__nav.nav {
        width: 100%;
    }
}
/* End */

/* Override icon width for TrustPilot on review page */
.feature--reviews .feature__icon.tp-icon {
    width: 225px;
}

/* Game icon template grid */
.section.nh-game-additional {
    padding-top: 10px;
}
.game-wrapper {
    margin: 0 auto;
}

.game-auto-grid > * {
    max-width: 25rem;
}

.game-auto-grid > * + * {
    margin-top: 1rem;
}

@supports (display: grid) {
    .game-auto-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(15rem, 25rem));
        grid-gap: 1rem;
        place-items: center;
    }

    .game-auto-grid > * {
        max-width: unset;
    }

    .game-auto-grid > * + * {
        margin-top: unset;
    }

    @media (max-width: 520px) {
        .game-auto-grid {
            grid-template-columns: repeat(1, minmax(15rem, 25rem));
        }
    }
}
/* End game icon template grid */

/* Page styles for best-gaming-server */
.nh-background {
    background-image: linear-gradient(to right, #FFF, #E1E6F0);
    box-shadow: 0 2px 10px rgba(0, 67, 115, 0.2);
    border-radius: 4px;
    border-collapse: collapse;
    padding: 20px 50px;
}
.nh-background h2 {
    text-align: center;
    font-size: 48px;
    font-weight: 900;
    color: #030B7B;
}
.nh-grid-tbl1 {
    display: grid;
    grid-template-columns: 270px repeat(5, 1fr);
    justify-items: center;
    align-items: center;
    color: #595959;
}
.nh-grid-tbl1 > div {
    display: contents;
    margin: 0;
    padding: 0;
}
.nh-grid-tbl1 > div > dt {
    background: #0D3C9F;
    color: #FFF;
    width: 100%;
    font-weight: 800;
    font-size: 24px;
    text-align: center;
    margin: 0;
    padding: 12px 0;
}
.nh-grid-tbl1 > div > dd {
    height: 100%;
    align-content: center;
    text-align: center;
    margin: 0;
    padding: 12px 0;
    width: 100%;
    border-bottom: 1px solid rgb(89, 89, 89, 0.1);
}
.nh-grid-tbl1 > div > dd:nth-child(1) p {
    text-align: left;
    font-size: 20px;
    font-weight: 900;
    color: #030B7B;
    padding-left: 10px;
}
.nh-grid-tbl1 p {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.25;
    margin: 0;
}
.nh-grid-tbl1 svg {
    height: 24px;
}
.nh-grid-tbl1 p img {
    width: 24px;
}
.nh-grid-tbl1 p.nh-b {
    font-weight: 800;
}
.nh-gaming-section a {
    color: rgba(255, 255, 255, 0.7);
}
.nh-gaming-section a:hover {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
}
.nh-gaming-h2 {
    margin-bottom: 40px;
    font-size: 26px;
}
.nh-gaming-box {
    padding: 50px;
    text-align: left;
}
.nh-gaming-box > div {
    max-width: 900px;
    margin: 28px auto;
}
.nh-gaming-box div.toc {
    box-sizing: border-box;
    transition: all .5s ease-in-out;
    background-color: #fafafa;
    border: 1px solid #dfdfdf;
    padding: 30px;
    margin: 20px auto;
}
.nh-gaming-box h2 {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.5;
    padding: 0;
    margin: 0 0 12px;
}
.nh-gaming-box p,
.nh-gaming-box li {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    margin: 0;
    padding: 0;
}
.nh-gaming-box > div > p {
    margin-bottom: 1rem;
}
.nh-gaming-box ul.list {
    list-style: inherit;
}
.nh-gaming-box ul.list li {
    margin-left: 30px;
}
.nh-gaming-box ul.list.toc li {
    margin-bottom: 6px;
}
.nh-gaming-box ul.list.m-b li:last-of-type {
    margin-bottom: 1rem;
}
.nh-gaming-box ul.components li {
    margin-bottom: 8px;
}
.nh-gaming-box ul.components li:last-of-type {
    margin-bottom: 0;
}
.nh-gaming-box li span {
    font-weight: 800;
}
@media (max-width: 751px) {
    .nh-grid-tbl1 {
        display: none;
    }
}
@media (max-width: 1231px) {
    .nh-grid-tbl1 {
        grid-template-columns: 240px repeat(5, 1fr);
    }
    .nh-background h2 {
        font-size: 32px;
        line-height: 32px;
        margin-bottom: 20px;
    }
    .nh-grid-tbl1 > div > dt {
        font-size: 18px;
    }
    .nh-grid-tbl1 svg {
        height: 18px;
    }
    .nh-grid-tbl1 p {
        font-size: 14px;
    }
    .nh-grid-tbl1 > div > dd:nth-child(1) p {
        font-size: 16px;
    }
    .nh-grid-tbl1 p img {
        width: 18px;
    }
}

@media (max-width: 1011px) {
    .container.nh-gaming-grid {
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }
    .nh-background {
        padding: 20px;
    }
    .nh-grid-tbl1 {
        grid-template-columns: 220px repeat(5, 1fr);
    }
}

@media (max-width: 831px) {
    .nh-grid-tbl1 {
        grid-template-columns: 180px repeat(5, 1fr);
    }
    .nh-background h2 {
        font-size: 28px;
        line-height: 28px;
        margin-bottom: 18px;
    }
    .nh-grid-tbl1 > div > dt {
        font-size: 16px;
    }
    .nh-grid-tbl1 svg {
        height: 16px;
    }
    .nh-grid-tbl1 p {
        font-size: 13px;
    }
    .nh-grid-tbl1 > div > dd:nth-child(1) p {
        font-size: 14px;
    }
    .nh-grid-tbl1 p img {
        width: 16px;
    }
}

@media (max-width: 751px) {
    .nh-gaming-box {
        padding: 16px;
    }
    .nh-gaming-box h2 {
        font-size: 20px;
    }
    .nh-gaming-box p,
    .nh-gaming-box li {
        font-size: 16px;
        line-height: 24px;
    }
}

.nh-grid-tbl-mobile {
    display: none;
    grid-template-columns: 1fr 2fr;
    place-items: center;
    color: #595959;
}
.nh-grid-tbl-mobile > div {
    display: contents;
    margin: 0;
    padding: 0;
}
.nh-grid-tbl-mobile > div.tbl-mobile-header dt {
    grid-column: 1 / -1;
}
.nh-grid-tbl-mobile > div > dt {
    background: #0D3C9F;
    color: #FFF;
    width: 100%;
    font-weight: 800;
    font-size: 24px;
    text-align: center;
    padding: 12px 0;
    margin: 20px 0 0;
}
.nh-grid-tbl-mobile > div:first-of-type > dt {
    margin: 0;
}
.nh-grid-tbl-mobile > div > dd {
    height: 100%;
    align-content: center;
    text-align: center;
    margin: 0;
    padding: 12px 0;
    width: 100%;
    border-bottom: 1px solid rgb(89, 89, 89, 0.1);
}
.nh-grid-tbl-mobile > div > dd:nth-child(1) p {
    text-align: left;
    font-size: 14px;
    font-weight: 900;
    color: #030B7B;
    padding-left: 10px;
}
.nh-grid-tbl-mobile p {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.25;
    margin: 0;
}
.nh-grid-tbl-mobile svg {
    height: 24px;
}
.nh-grid-tbl-mobile p img {
    width: 24px;
}
.nh-grid-tbl-mobile p.nh-b {
    font-weight: 800;
}
@media (max-width: 751px) {
    .nh-grid-tbl-mobile {
        display: grid;
    }
}
@media (max-width: 500px) {
    .nh-grid-tbl-mobile {
        grid-template-columns: 2fr 1fr;
    }
}
/* End page styles for best-gaming-server */

div.flip-img svg {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

.trustpilot-widget.trustpilot-reviews {
    display: flex;
    align-self: center;
}