﻿/* MODAL */
.modal {
    font-family: Poppins, sans-serif;
}

.modal__overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 12;
}

.modal__container {
    background-color: #fff;    
    max-width: 1170px;
    max-height: 100vh;
    border-radius: 10px;
    overflow-y: auto;
    box-sizing: border-box;
}

.modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f1f1f1;
    padding: 2px 10px 2px 20px;
    border-bottom: 1px solid #ddd;
}

.modal__title {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600;
    font-size: 1.25rem;
    line-height: 1.25;
    color: #000;
    box-sizing: border-box;
    margin-right: 20px;
}

.modal__close {
    background: transparent;
    border: 0;
    color: #000;
}
    .modal__close:hover {
        color: #FFF;
        background-color: #222;
        text-decoration: none;
    }

.modal__header .modal__close:before {
    content: "\2715";
}

.modal__content {    
    line-height: 1.5;
    color: rgba(0,0,0,.8);
    padding: 20px;
}
.modal__content_flex {
    display: flex;
    gap: 20px;
}

.modal__footer {
    text-align: right;
    background-color: #f1f1f1;
    padding: 20px;
    border-top: 1px solid #ddd;
}

/**************************\
  Demo Animation Style
\**************************/
@keyframes mmfadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes mmfadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes mmslideIn {
    from {
        transform: translateY(15%);
    }

    to {
        transform: translateY(0);
    }
}

@keyframes mmslideOut {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-10%);
    }
}

.micromodal-slide {
    display: none;
}

    .micromodal-slide.is-open {
        display: block;
    }

    .micromodal-slide[aria-hidden="false"] .modal__overlay {
        animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    }

    .micromodal-slide[aria-hidden="false"] .modal__container {
        animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
    }

    .micromodal-slide[aria-hidden="true"] .modal__overlay {
        animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
    }

    .micromodal-slide[aria-hidden="true"] .modal__container {
        animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
    }

    .micromodal-slide .modal__container,
    .micromodal-slide .modal__overlay {
        will-change: transform;
    }

        .micromodal-slide .modal__container .btn,
        .micromodal-slide .modal__container .modal__btn-primary {
            -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
            -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
            box-shadow: inset 0px 1px 0px 0px #ffffff;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
            background: -moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
            background: -webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
            background: -o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
            background: -ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
            background: linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
            background-color: #ffffff;
            -moz-border-radius: 6px;
            -webkit-border-radius: 6px;
            border-radius: 6px;
            border: 1px solid #d4d4d4;
            display: inline-block;
            cursor: pointer;
            color: #666666;
            font-family: Arial;
            font-size: 15px;
            font-weight: bold;
            padding: 6px 24px;
            text-decoration: none;
            text-shadow: 0px 1px 0px #ffffff;
        }
            .micromodal-slide .modal__container .btn:hover,
            .micromodal-slide .modal__container .modal__btn-primary:hover {
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
                background: -moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
                background: -webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
                background: -o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
                background: -ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
                background: linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
                background-color: #f6f6f6;
            }    
/* MODAL END */
.generatorBoxHolder {
    max-width: 1170px;
    margin: auto;
}
.genItems {
    position: relative;
    display: flex;
    margin: auto;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
}
.generatorBoxItem {
    flex: 1 1 0px;
    min-width: 320px;
    /* width: 100%; */
    display: block;
    text-overflow: ellipsis;
    color: #FFF;
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 10px;    
}

.generatorBoxName {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #666;
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 10px;
    padding: 25px 20px;
    display: block;
    background-color: #FFF;
    font-size: 30px;
    font-weight: bold;
    border: 1px solid #DDD;
    white-space: nowrap;
    line-height: 45px;
    cursor: pointer;
}

.highlightBoxItem {
    flex: 1 1 0px;
    min-width: 320px;
    display: block;
    text-overflow: ellipsis;
    color: #fff;
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 10px;    
}
.highlightBoxName {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #666;
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 10px;
    padding: 25px 20px;
    display: block;
    background-color: #fff;
    font-size: 40px;
    font-weight: 700;
    border: 1px solid #ddd;
    white-space: nowrap;
    line-height: 135px;
}
.highlightControls {
    flex: 1;
    border-radius: 10px;
    border: 1px solid #ddd;
    padding: 10px;
}
.highlightControlsInner {
    
    flex: 1;
    /*overflow: hidden;
    height: 186px;
    position: absolute;
    background-color: #f5f8fa;*/
}
    /*.highlightControlsInner:hover {
        
        height: auto;
    }*/

.genHeadFloater {
    position: sticky;
    position: -webkit-sticky;
    top: 0px;
    background-color: #f5f8fa;
    border: 1px solid #ddd;
    border-radius: 10px;
    margin-bottom: 14px;
    padding: 10px;
    display: none;
}
.genTabs {
    border-radius: 10px;      
    margin-top: 10px;    
    gap: 10px;
    display: flex;    
    flex-wrap: wrap;
    opacity: .95;
}
.genHighlight {
    border-radius: 10px;    
    gap: 10px;
    display: flex;
    flex-wrap: wrap;
    opacity: .95;
}

.genTab {    
    background-color: #efefef;
    border-radius: 7px;
    padding: 10px 20px;
    box-shadow: 0 2px rgb(0 0 0 / 20%);
    font-weight: bold;
    cursor: pointer;
}
.genTabSelected {
    border: 1px solid #333;
}
.genTabTitle {
    margin-left: 10px;
}

/*TOGGLE*/

.toggle {
    align-items: center;
    border-radius: 100px;
    display: flex;
    font-weight: 700;
    margin-bottom: 16px;
}

    .toggle:last-of-type {
        margin: 0;
    }

.toggle__input {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

    .toggle__input:not([disabled]):active + .toggle-track, .toggle__input:not([disabled]):focus + .toggle-track {
        border: 1px solid transparent;
        box-shadow: 0px 0px 0px 2px #121943;
    }

    .toggle__input:disabled + .toggle-track {
        cursor: not-allowed;
        opacity: 0.7;
    }

.toggle-track {
    background: #e5efe9;
    border: 1px solid #AAA;
    border-radius: 100px;
    cursor: pointer;
    display: flex;
    height: 30px;
    margin-right: 12px;
    position: relative;
    width: 60px;
}

.toggle-indicator {
    align-items: center;
    background: #121943;
    border-radius: 24px;
    bottom: 2px;
    display: flex;
    height: 24px;
    justify-content: center;
    left: 2px;
    outline: solid 2px transparent;
    position: absolute;
    transition: 0.25s;
    width: 24px;
}

.checkMark {
    fill: #fff;
    height: 20px;
    width: 20px;
    opacity: 0;
    transition: opacity 0.25s ease-in-out;
}

.toggle__input:checked + .toggle-track .toggle-indicator {
    background: #121943;
    transform: translateX(30px);
}

    .toggle__input:checked + .toggle-track .toggle-indicator .checkMark {
        opacity: 1;
        transition: opacity 0.25s ease-in-out;
    }

@media screen and (-ms-high-contrast: active) {
    .toggle-track {
        border-radius: 0;
    }
}

/*END TOGGLE*/


.buyButton {
    background-color: #f7cb3d;
    border-radius: 7px;
    padding: 10px 20px;
    box-shadow: 0 2px rgb(0 0 0 / 20%);
    font-weight: bold;
    cursor: pointer;
    display: inline-block;
    white-space: nowrap;
    flex-grow: 9999;
}
.buyButton i {
    margin-right: 10px;
}
.buyDomainDiv {
    border-radius: 6px;
    border: 1px solid #85b000;
    background-color: #85b000;
    color: #FFF !important;
    padding: 3px 10px;
    display: flex;
    cursor: pointer;    
    flex: 1 1 150px;
}
    .buyDomainDiv i {
        flex: 0 0 18px;
        margin-right: 10px;
        padding-top: 3px;
    }

.domName {
    flex: 1;
    display: block;
    text-align: left;
}
.domPrice {
    flex: 1;
    text-align: right;
    padding-left: 10px;
}
.highlightRightHeader {
    padding-bottom: 10px;
    gap: 10px;
    flex-wrap: wrap;
}
.highlightToggleDiv {
    background-color: #efefef;
    border-radius: 7px;
    display: flex;
    padding: 5px 14px 4px 10px;
    box-shadow: 0 2px rgb(0 0 0 / 20%);
    white-space: nowrap;
    flex-grow: 9999;
}
#searchHead {
    overflow: hidden;
    transition: height 500ms;
}

/*Opentip*/
.opentip-container,
.opentip-container * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.opentip-container {
    position: absolute;
    max-width: 300px;
    z-index: 200002 !important;
    -webkit-transition: -webkit-transform 1s ease-in-out;
    -moz-transition: -moz-transform 1s ease-in-out;
    -o-transition: -o-transform 1s ease-in-out;
    -ms-transition: -ms-transform 1s ease-in-out;
    transition: transform 1s ease-in-out;
    pointer-events: none;
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    -o-transform: translateX(0) translateY(0);
    -ms-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
}

    .opentip-container.ot-fixed.ot-hidden.stem-top.stem-center,
    .opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-center,
    .opentip-container.ot-fixed.ot-hiding.stem-top.stem-center {
        -webkit-transform: translateY(-5px);
        -moz-transform: translateY(-5px);
        -o-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px);
    }

    .opentip-container.ot-fixed.ot-hidden.stem-top.stem-right,
    .opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-right,
    .opentip-container.ot-fixed.ot-hiding.stem-top.stem-right {
        -webkit-transform: translateY(-5px) translateX(5px);
        -moz-transform: translateY(-5px) translateX(5px);
        -o-transform: translateY(-5px) translateX(5px);
        -ms-transform: translateY(-5px) translateX(5px);
        transform: translateY(-5px) translateX(5px);
    }

    .opentip-container.ot-fixed.ot-hidden.stem-middle.stem-right,
    .opentip-container.ot-fixed.ot-going-to-show.stem-middle.stem-right,
    .opentip-container.ot-fixed.ot-hiding.stem-middle.stem-right {
        -webkit-transform: translateX(5px);
        -moz-transform: translateX(5px);
        -o-transform: translateX(5px);
        -ms-transform: translateX(5px);
        transform: translateX(5px);
    }

    .opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-right,
    .opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-right,
    .opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-right {
        -webkit-transform: translateY(5px) translateX(5px);
        -moz-transform: translateY(5px) translateX(5px);
        -o-transform: translateY(5px) translateX(5px);
        -ms-transform: translateY(5px) translateX(5px);
        transform: translateY(5px) translateX(5px);
    }

    .opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-center,
    .opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-center,
    .opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-center {
        -webkit-transform: translateY(5px);
        -moz-transform: translateY(5px);
        -o-transform: translateY(5px);
        -ms-transform: translateY(5px);
        transform: translateY(5px);
    }

    .opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-left,
    .opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-left,
    .opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-left {
        -webkit-transform: translateY(5px) translateX(-5px);
        -moz-transform: translateY(5px) translateX(-5px);
        -o-transform: translateY(5px) translateX(-5px);
        -ms-transform: translateY(5px) translateX(-5px);
        transform: translateY(5px) translateX(-5px);
    }

    .opentip-container.ot-fixed.ot-hidden.stem-middle.stem-left,
    .opentip-container.ot-fixed.ot-going-to-show.stem-middle.stem-left,
    .opentip-container.ot-fixed.ot-hiding.stem-middle.stem-left {
        -webkit-transform: translateX(-5px);
        -moz-transform: translateX(-5px);
        -o-transform: translateX(-5px);
        -ms-transform: translateX(-5px);
        transform: translateX(-5px);
    }

    .opentip-container.ot-fixed.ot-hidden.stem-top.stem-left,
    .opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-left,
    .opentip-container.ot-fixed.ot-hiding.stem-top.stem-left {
        -webkit-transform: translateY(-5px) translateX(-5px);
        -moz-transform: translateY(-5px) translateX(-5px);
        -o-transform: translateY(-5px) translateX(-5px);
        -ms-transform: translateY(-5px) translateX(-5px);
        transform: translateY(-5px) translateX(-5px);
    }

    .opentip-container.ot-fixed .opentip {
        pointer-events: auto;
    }

    .opentip-container.ot-hidden {
        display: none;
    }

    .opentip-container .opentip {
        position: relative;
        font-size: 13px;
        line-height: 120%;
        /*padding: 9px 14px;*/
        color: #4f4b47;
        text-shadow: -1px -1px 0px rgba(255,255,255,0.2);
    }

        .opentip-container .opentip .header {
            margin: 0;
            padding: 0;
        }

        .opentip-container .opentip .ot-close {
            pointer-events: auto;
            display: block;
            position: absolute;
            top: -12px;
            left: 60px;
            color: rgba(0,0,0,0.5);
            background: rgba(0,0,0,0);
            text-decoration: none;
            top: -15px !important;
            width: 22px !important;
            height: 22px !important;
        }

            .opentip-container .opentip .ot-close span {
                display: none;
            }

        .opentip-container .opentip .ot-loading-indicator {
            display: none;
        }

    .opentip-container.ot-loading .ot-loading-indicator {
        width: 30px;
        height: 30px;
        font-size: 30px;
        line-height: 30px;
        font-weight: bold;
        display: block;
    }

        .opentip-container.ot-loading .ot-loading-indicator span {
            display: block;
            -webkit-animation: otloading 2s linear infinite;
            -moz-animation: otloading 2s linear infinite;
            -o-animation: otloading 2s linear infinite;
            -ms-animation: otloading 2s linear infinite;
            animation: otloading 2s linear infinite;
            text-align: center;
        }

    .opentip-container.style-dark .opentip,
    .opentip-container.style-alert .opentip {
        color: #f8f8f8;
        /*text-shadow: 1px 1px 0px rgba(0,0,0,0.2);*/
    }

    .opentip-container.style-glass .opentip {
        padding: 15px 25px;
        color: #317cc5;
    }

    .opentip-container.ot-hide-effect-fade {
        -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        -moz-transition: -moz-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        -o-transition: -o-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        -ms-transition: -ms-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        transition: transform 0.5s ease-in-out, opacity 1s ease-in-out;
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }

        .opentip-container.ot-hide-effect-fade.ot-hiding {
            opacity: 0;
            filter: alpha(opacity=0);
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        }

    .opentip-container.ot-show-effect-appear.ot-going-to-show,
    .opentip-container.ot-show-effect-appear.ot-showing {
        -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        -moz-transition: -moz-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        -o-transition: -o-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        -ms-transition: -ms-transform 0.5s ease-in-out, opacity 1s ease-in-out;
        transition: transform 0.5s ease-in-out, opacity 1s ease-in-out;
    }

    .opentip-container.ot-show-effect-appear.ot-going-to-show {
        opacity: 0;
        filter: alpha(opacity=0);
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }

    .opentip-container.ot-show-effect-appear.ot-showing {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }

    .opentip-container.ot-show-effect-appear.ot-visible {
        opacity: 1;
        -ms-filter: none;
        filter: none;
    }

@-moz-keyframes otloading {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes otloading {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes otloading {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-ms-keyframes otloading {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes otloading {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.STP_TutHeader {
    padding: 9px 14px 0px 14px;
}

    .STP_TutHeader span {
        color: #222;
        font-size: 13px;
        text-transform: uppercase;
        padding-top: 3px;
        font-style: italic;
        float: right;
    }

.STP_TutTitle {
    padding: 3px 0px 13px 0px;
    font-size: 21px;
    color: #222E3F;
    font-weight: bold;
}

.STP_TutTitleStart {
    padding: 3px 0px 13px 0px;
    font-size: 31px;
    color: #222E3F;
    font-weight: bold;
}

#STP_Tut1 {
    display: flex;
}

.STP_TutBodyIntro {
    border-radius: 3px;
    padding: 8px 4px 4px 0px;
    background-color: #FFF;
    margin: 8px;
    text-align: center;
    width: 200px;
    flex: 1;
    font-size: 40px;
    color: #222E3F;
    font-weight: bold;
    line-height: 40px;
}

.STP_TutBody {
    border-radius: 3px;
    padding: 12px 10px 13px 10px;
    font-size: 16px;
    line-height: 18px;
    color: #222E3F;
    background-color: #FFF;
    margin: 8px;
    text-align: center;
}

.STP_TutAction {
    padding: 0px 0px 5px 0px;
    font-size: 16px;
    color: #222E3F;
}

.STP_TutLogo {
    background-image: url('data:image/png;base64,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');
    width: 175px;
    height: 32px;
    display: inline-block;
    flex: 1;
}

.STP_TutMGLogo {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGEAAABQCAYAAAAJIBurAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAt+wAALfsB/IdK5wAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDkvMjQvMjE71jSQAAAFFElEQVR4nO2d64tVVRTAf6NjL7PXIXoZUrOJMmdTUGSEFEXSA3toWmEPmx4z+iWIoH+jPvl+oVmiCTN+CBMCsyTIog4qRZspwcqY2UVjmhp1+7Du7h5lmpl77nnse9q/j3PPWWtxf9xz9jp37todw13dW4CpQF9k4p8IFIJV+hpgJTDUMdzVfQI4B/ga2Apsjkz8XZkFVhmrdBfwDPAkcANwtGO4q7t21nGngR3AisjEewqusbJYpe8F+oDHgCnJl0aTkOQT5COzLTLxyRxrrCRW6anAQqAXmP0fhw2PJ8ExCKwHNkQmPpJRjZXFKj0DeAFYAswY5/AJS3AcQ+4bKyMT709XYnWxSs9GLjkLgQsmeFrTEpLsBpYD/ZGJ/04Zo+2xSk8BHgeWAvekCDHUigTHIWANsqoaajFW22CVvgp4DuhBVjmpQ2Uh4d9gwNvA6sjEBzKK6R1W6VuBV4CngEsyCDmSpQRHDRgAlkcm3pVx7FKwSgPMA5YBD2QcPhcJSb5AlrjvRiYeyTFPLlilL0Maq5eBWTmlyV2C40dgI7AuMrEpIF9LWKVnAi8hAi7POV1hEhyngPeQbnxvgXknhFX6fmSJ+SgwuaC0hUtI8jGwAtgemfhUSTVglZ6GPMfpBW4roYRSJTgGgXXAxiK78fqDtB5kmTm9qLyj4IUERyHduFV6DnLJmQ+cl1eeJvBKQpIPkG58IItu3Cp9LrAAefPntBovY7yV4DiIdOObIhPbZk+uf3GyBLnsXJ9taZnhvQTHMI1u/OB4B1ulb0dutIuAaTnX1iptI8HxF7ATWeKe0Y1bpTuBR5A3f24JtaWl7SQk2Y8scfcBDyLN1U2lVpSOtpZQFUYmlV1BAIIEDwgSPCBI8IAgwQOCBA8IEsqnFiSUT2eQUD5Bgg8ECR4QJHhAkOABQYIHBAkeECR4QJDgAUGCBwQJHhAkeECQ4AFBggcECR4QJHhAkOABQYIHBAkeECR4QJBQPuG/LTwgfNHvAUGCDwQJHhAkeECQ4AFBggdMAl4DTpRdyP+Uk8AbHbVaDav0zcCryEgx3398XQWOA9uANyMTf9VRqzV+QWuVnk5jDMF1pZRXbQ4DG4D1kYkPuz+eIcFhlT4fGUnQC9xZUIFV5lMak5aPn/3iqBKS1Gc8L0VmPHfmUWFF+RPoRwYyfjjWgeNKcFilb0RGURYxF66d+RnYBKyJTPzNRE6YsASHVToCnkUmJM5stsIKEwOrgC2RiX9t5sSmJTis0pORgX3LgPtSBakG7yMDsnZGJk4VILWEJFbpO5CpWouY+KDuduY34B1kVNyXrQbLRIKjPrK+Bxlbf21mgf3hW2AtMjTxaFZBM5XgsEpfiIy57KOcMZdZsweZrbQjMvHprIPnIiGJVXouct+YR3s9q/oD2I5MGduXZ6LcJTis0rOQ5m8xcGkhSdNxBOlq10Ym/r6IhIVJcFilr6CxxG1l34Gs+QzpardGJv69yMSFS3DUd+CYj3Tjd5dShAw27EcuObtLqqE8CUms0nchMhZQzNTeIWAz0tUeKiDfmHghwVGfX/0i8DxwdQ4pDgCrka1nfskhfiq8kuCwSl8MPI3cyG/JIOQuGl2td5sweSkhiVX6YWSJ+1CTp47QGID+eeaFZYj3Ehz1DYV6kU/IRWMcOkijq/2hiNpapW0kOKzSVyIiFgMa2cfyGPARsr4fyKOrzZO2k+Co7wDyFvAE8Hpk4lUll5SafwB+EKeHHGamAQAAAABJRU5ErkJggg==');
    width: 97px;
    height: 80px;
    display: inline-block;
    float: left;
    margin: 20px 20px 20px 20px;
}

.STP_TutNext {
    background-color: #F9C643;
    border: 1px solid #efb41c;
    padding: 8px 3px;
    color: #222E3F;
    text-align: center;
    margin: 15px 0px 0px 0px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 8px;
}

.STP_TutIndDiv {
    padding: 15px 0px 0px 0px;
    text-align: left;
}

.STP_TutStatusBlock {
    padding: 0px 5px;
}

.STP_TutInd {
    display: inline-block;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    background-size: 28px 28px;
}

.STP_TutIndText {
    display: inline-block;
    vertical-align: top;
    margin: 6px 0px 0px 10px;
    text-align: left;
    font-size: 14px;
}

.STP_TutHover {
    padding: 10px 0px 0px 0px;
    font-weight: bold;
}

.STP_TutFocused {
    box-shadow: 0px 0px 0px 99999px rgba(0, 0, 0, 0.3);
    z-index: 500;
}

.logoModalContent {
    display: flex;
    flex-wrap: wrap;
}
.logoModalLogo {
    flex: 1;
    border-radius: 10px;
    display: block;
    text-overflow: ellipsis;
    color: #fff;
    text-align: center;
    margin-bottom: 20px;
    min-width: 300px;
}
.logoModalLogoName {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #666;
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 10px;
    padding: 25px 20px;
    display: block;
    background-color: #fff;
    font-size: 40px;
    font-weight: 700;
    border: 1px solid #ddd;
    white-space: nowrap;
    line-height: 135px;
}
.logoModalDescription {
    flex: 1;
    padding: 0px 15px 15px 20px;
    font-size: 15px;
    min-width: 300px;
}
.logoModalCheck {
    font-size: 25px;
    color: #8BC34A;
    margin-right: 10px;
    vertical-align: middle;
    font-size: 15px;
}
.logoPriceDiv {
    
}
.regularPrice {
    font-size: 30px;
    text-decoration: line-through;
    font-weight: bold;
    color: #666;
}
.nowOnly {
    font-weight: bold;
    color: #979797;
}
.salePrice {
    font-size: 30px;
}
.buyBtn {
    box-shadow: inset 0px 1px 0px 0px #fff6af;
    background: linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
    background-color: #ffec64;
    border-radius: 6px;
    border: 1px solid #ffaa22;
    display: inline-block;
    cursor: pointer;
    color: #333333 !important;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    padding: 5px 24px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #ffee66;
}

    .buyBtn:hover {
        background: linear-gradient(to bottom, #ffab23 5%, #ffec64 100%);
        background-color: #ffab23;
    }

    .buyBtn:active {
        position: relative;
        top: 1px;
    }
    .buyBtn:disabled,
    .buyBtn[disabled] {
        border: 1px solid #999999;
        background: #cccccc;
        color: #666666 !important;
        box-shadow: none;
        text-shadow: none;
        cursor: unset;    
    }

.logoBottomPart {
    display: flex;
}
.sale50Off {
    margin-right: 30px;
    margin-top: 9px;
}
.logoBottomPartLeft {
    flex: 1;
    text-align: right;
}
.logoBottomPartRight {
    flex: 1;
}
.logoModelDescTitle {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 18px;
}
.paymentDiv {    
    display: none;
}
.emailInputTitle {
    font-size: 15px;    
    margin-bottom: 18px;
}
.indicator-progress {
    display: none
}

[data-indicator=on] > .indicator-progress {
    display: inline-block
}

[data-indicator=on] > .indicator-label {
    display: none
}
.spinner-border, .spinner-grow {
    display: inline-block;
    width: var(--bs-spinner-width);
    height: var(--bs-spinner-height);
    vertical-align: var(--bs-spinner-vertical-align);
    border-radius: 50%;
    animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name)
}

@keyframes spinner-border {
    to {
        transform: rotate(360deg)
    }
}

.spinner-border {
    --bs-spinner-width: 2rem;
    --bs-spinner-height: 2rem;
    --bs-spinner-vertical-align: -0.125em;
    --bs-spinner-border-width: 0.185em;
    --bs-spinner-animation-speed: 0.65s;
    --bs-spinner-animation-name: spinner-border;
    border: var(--bs-spinner-border-width) solid currentcolor;
    border-right-color: transparent
}

.spinner-border-sm {
    --bs-spinner-width: 1rem;
    --bs-spinner-height: 1rem;
    --bs-spinner-border-width: 0.145em
}

@keyframes spinner-grow {
    0% {
        transform: scale(0)
    }

    50% {
        opacity: 1;
        transform: none
    }
}

.spinner-grow {
    --bs-spinner-width: 2rem;
    --bs-spinner-height: 2rem;
    --bs-spinner-vertical-align: -0.125em;
    --bs-spinner-animation-speed: 0.65s;
    --bs-spinner-animation-name: spinner-grow;
    background-color: currentcolor;
    opacity: 0
}

.spinner-grow-sm {
    --bs-spinner-width: 1rem;
    --bs-spinner-height: 1rem
}

@media (prefers-reduced-motion:reduce) {
    .spinner-border, .spinner-grow {
        --bs-spinner-animation-speed: 1.3s
    }
}
.align-middle {
    vertical-align: middle !important
}
.ms-2 {
    margin-left: .5rem !important
}
.emailValidatorText {
    color: #FF0000;
    display: none;
}
[type=button], [type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover {
    color: #fff;
    background-color: #4fc953;
    text-decoration: none;
}
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
    border: 0;
    border-radius: 0.25em;
    background: initial;
    background-color: #4fc953;
    color: #fff;
    font-size: 1em;
}
div:where(.swal2-container) .swal2-html-container {
    font-size: 1em;
}
div:where(.swal2-container) h2:where(.swal2-title) {    
    font-size: 1.2em;    
}
@media screen and (max-width: 580px) {
    .genHeadFloater {
        position: unset;
    }
}
@media screen and (min-width: 580px) {
    .paymentDiv {
        min-width: 500px;        
    }
}
@media screen and (max-width: 674px) {
    .highlightControls {
        flex-basis: 100%;
    }
}
.logoModalLeftPanel {
    flex: 1;
    min-width: 300px;
}
.logoIcon {
    margin-right: 20px;
}
.popupDomainDetails {
    display: none;
    position: absolute;
    width: 100%;
    background-color: #f5f8fa;
    border: 1px solid #888;
    border-radius: 10px;
    margin-top: -2px;
    z-index: 200;    
    left: 0px;    
    box-shadow: 0px 13px 11px 3px rgba(0,0,0,0.3);
}
.generatorBoxOpen {
    border: 1px solid #888;    
    box-shadow: 0px 0px 11px 3px rgba(0,0,0,0.3);
}
.highlightDomainsDiv {
    gap: 8px;
    flex-wrap: wrap;
    font-size: 15px;
    padding: 10px;
    list-style-type: none;
    margin-bottom: 8px;
}
.socialDiv {
    padding: 0px 10px 10px 10px;
}
.highlightBuyDomain {
    font-family: Arial;
    font-size: 25px;
    padding: 12px 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    font-weight: 400;
    color: rgb(46, 64, 83);
    /*background: linear-gradient(to bottom, #ffffff 0%, #ddd 100%);*/
    display: flex;
    background-color: #e6eef3;
}
.highlightBuyDomainFavorite {
    flex: 0 0 30px;
    font-size: 25px;
    display: inline-block;
    opacity: 0.2;
    cursor: pointer;
}
.favoriteAdded {
    opacity: 1;
}
.highlightBuyDomainTitle {
    flex: 1 1;
}
.highlightBuyDomainClose {
    flex: 0 0 30px;
    font-size: 18px;
    display: inline-block;
    opacity: 0.2;
    padding: 7px 0px 0px 0px;
    cursor: pointer;
}

.whiteSpaceNoWrap {
    white-space: nowrap;
}

.searchSocialBtn {
    -moz-box-shadow: inset 0px 1px 0px 0px #fff6af;
    -webkit-box-shadow: inset 0px 1px 0px 0px #fff6af;
    box-shadow: inset 0px 1px 0px 0px #fff6af;
    background-color: #ffec64;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px solid #ffbb54;
    display: inline-block;
    cursor: pointer;
    color: #444;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    padding: 13px 24px 12px 24px;
    text-decoration: none;
    width: 100%;
}

    .searchSocialBtn:hover {
        background-color: #FAE54C;
    }

    .searchSocialBtn:active {
    }

    .searchSocialBtn span {
        white-space: normal;
    }

@media screen and (max-width: 545px) {
    .socialBoxOuter {
        width: 50%;
    }
}
.socialRow {
    width: 100%;
}

.socialBoxHolder {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.socialBoxBtnHolder {
    width: 100%;
    text-align: center;
}

.socialBoxItem {
    min-width: 90px;
}

.socialBoxOuter,
.generatorBoxOuter {
    padding-left: 0px;
}

.socialBox {
    background-color: #FFF;
    text-align: center;
    color: #888;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 6px;
    padding: 5px;
    display: block;
    border: 1px solid #e2e2e2;
}

    .socialBox:hover {
        color: inherit;
    }

    .socialBox i {
        font-size: 29px;
        margin: 5px 0px 6px 0px;
        display: inline-block;
    }

.socialBoxFree {
    background-color: #85B000;
    color: #FFF !important;
}

.socialBoxTaken {
    background-color: #FF0033;
    color: #FFF !important;
}

.socialBoxLoading {
    background-color: #B6CCDA;
    color: #FFF !important;
}

.socialBoxOther {
    background-color: #F8DE1A;
    color: #666 !important;
}

    .socialBoxFree:hover,
    .socialBoxTaken:hover,
    .socialBoxOther:hover {
        color: #EEE !important;
    }

    .socialBoxOther:hover {
        color: #888 !important;
    }

.socialBoxName {
    display: block;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.socialBoxHolder {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

.socialBoxItem {
    min-width: 89px;
}

@media screen and (max-width: 545px) {
    .socialBoxHolder {
        justify-content: center;
    }

    .socialBoxOuter {
        width: auto;
    }

    .socialBoxItem {
        min-width: 87px;
    }
}

.searchSocial {
    display: inline-block;
    width: 100%;
}
.DTMainTextBox {
    
}
#checkDomainNamesLine {
    margin-top: 10px;
}
.checkDomainNamesLine {
    border-bottom: 1px dashed #ccc;
    margin-bottom: 22px;
    display: flex;
    justify-content: left;
}
    .checkDomainNamesLine span {
        font-size: 12px;
        margin-bottom: -12px;
        background-color: #f5f8fa;
        padding: 0px 7px 3px 0px;
        border-radius: 12px;
        cursor: pointer;
        flex: 0 0;
        text-align: center;
        color: #212c37;
        white-space: nowrap;
    }
    .checkDomainNamesLine i {
        padding-left: 3px;
        font-size: 14px;
    }
    .checkDomainNamesLine.open i:before {
        content: "\f0d8";
    }

    .checkDomainNamesLine.open {
        margin-bottom: 14px;
    }

.domainCheckDiv {
    display: none;
    padding-bottom: 10px;
}
.generatorOptions {    
    display: none;
}
.generatorOptionsInner {
    display: flex;
    margin-bottom: 20px;
    gap: 10px;
    flex-wrap: wrap;
}
/* Generator style TABS */
.generatorStyleContainer {
    display: flex;
}
.genOptionHead {
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
}

.genTabs {
    display: flex;
    /* background-color: #fff; */
    /* box-shadow: 0 0 1px 0 rgba(24,94,224,.15), 0 6px 12px 0 rgba(24,94,224,.15); */
    padding: 4px;
    border-radius: 20px;
    gap: 0px;
    border: 1px solid #aaa;
    margin: 0px;
    background-color: #e5efe9;
    height: 36px;
}

    .genTabs * {
        z-index: 2;
    }

input[type=radio] {
    display: none;
}

.tab {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 26px;
    width: 70px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 99px;
    cursor: pointer;
    transition: color .15s ease-in;
}

input[type=radio]:checked + label {
    color: var(--primary-color);
}

    input[type=radio]:checked + label > .notification {
        background-color: var(--primary-color);
        color: #fff;
    }

input[id=radio-prefix]:checked ~ .glider {
    transform: translateX(0);
}

input[id=radio-any]:checked ~ .glider {
    transform: translateX(100%);
}

input[id=radio-postfix]:checked ~ .glider {
    transform: translateX(200%);
}

.glider {
    position: absolute;
    display: flex;
    height: 27px;
    width: 70px;
    background-color: #b9d1c4;
    z-index: 1;
    border-radius: 99px;
    transition: .25s ease-out;
}

@media (max-width: 700px) {
    .genTabs {
        transform: scale(0.9);
    }
}
/* Generator style TABS */

.genOptionRight {
    margin-left: auto;
}
.mainDomainDivPopup {
    flex: 1;    
}
.tldNamePopup {
    color: #FFF;
    font-size: 20px;
    line-height: 40px;
}
.DomainImagePopup {
    background-color: #B6CCDA;
    color: #FFF;
    text-align: center;
    padding: 0px 12px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#otherDomainResultsDivPopup {
    padding: 10px;
    padding-top: 0px;
    text-align: left;
}
#otherDomainResultsDivPopup .OtherDomainLi,
#otherDomainResultsDivPopup .OtherDomainHighlight {
    height: 32px;
    float: left;
    /*padding: 0px 10px 0px 0px;
    margin-bottom: 10px;*/
    flex: 1 1;
    min-width: 87px;
}
.OtherDomainPopupMain {
    flex: 1;
    height: 40px;
    position: relative;
}
    .OtherDomainPopupMain #OtherDomainTitle {
        font-size: 20px;
        height: 40px;
    }

    .OtherDomainPopupMain .OtherDomainLiMenu,
    .OtherDomainPopupMain .OtherDomainLiMenuTaken {
        margin-top: 37px;
        min-width: 100%;
    }
.quickSearchDiv {
    font-family: "Poppins",Sans-serif;
    /*display: flex;
    justify-content: center;
    flex-wrap: wrap;*/
    text-align: center;
    padding-top: 35px;
}
.quickSearchItemsHolder {
    display: flex;
    gap: 12px;
    justify-content: center;
    max-width: 950px;
    flex-wrap: wrap;
}
.randomSearchBtnHolder {
    flex: 0 0 100%;
    display: flex;
    justify-content: center;
    max-width: 950px;
}
.quickSearchItem {
    border: 1px solid #666;
    border-radius: 20px;
    padding: 7px 20px 6px;
    cursor: pointer;
    white-space: nowrap;
}
    .quickSearchItem:hover {
        box-shadow: 0px 1px 0px 0px #fff6af;
        background: linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
        background-color: #ffec64;
    }
    .quickSearchItem i {
    }
    .quickSearchItem span {
        font-size: 19px;
        display: inline-block;
        padding-left: 10px;
    }
.quickSearchItemRandom {
    border: 1px solid #666;
    border-radius: 20px;
    padding: 7px 25px 6px 25px;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0px 1px 0px 0px #fff6af;
    background: linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
    background-color: #ffec64;
}
    .quickSearchItemRandom i {
        font-size: 18px;
    }
    .quickSearchItemRandom span {
        font-size: 23px;
        font-weight: bold;
        display: inline-block;
        padding-left: 10px;
        color: #444;
    }

.tryPopularSearchTitle {
    color: #3d4e60;
    font-family: "Poppins",Sans-serif;
    font-size: 20px;
    font-weight: 200;
    padding: 25px 0px;
}
.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.randomBtn {
    border: 1px solid #666;
    border-radius: 6px;
    padding: 4px 20px 4px 20px;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0px 1px 0px 0px #fff6af;
    background: linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
    background-color: #ffec64;
}

    .randomBtn i {
        font-size: 16px;
    }

    .randomBtn span {
        font-size: 17px;
        font-weight: bold;
        display: inline-block;
        padding-left: 10px;
        color: #444;
    }