/**** Banner section and offer css start ***/
.sub-heading {
    font-size: 28px !important;
    color: #fff !important;
    text-shadow: 3px 3px .8rem #000 !important;
    float: left;
    width: 100%;
}

.domain-list {
    background-color: transparent;
    border: none;
}

.searchlinks {
    float: left;
}

.searchlinks a {
    color: #fff;
}

.blockquote-footer::before {
    content: "" !important;
}

.card-price-holder {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.footer-links a {
    color: #de3723;
}

.footer-links a:hover {
    color: #000;
    text-decoration: underline;
}

.offer-label-holder {
    display: flex;
    top: -16px;
    left: 16px;
}

.offer-label-txt {
    background-color: #74cccc;
    color: #fff;
    border-radius: 6px;
    padding: 2%;
}

.offer-label {
    background-color: #e3504f;
    color: #fff;
    border-radius: 6px;
    padding: 2%;
}

.offer-card1 {
    background: #DFF5FF !important;
}

.offer-card2 {
    background: #FFC374 !important;
}

.offer-card3 {
    background: #cdffc9 !important;
}

.offer-card4 {
    background: #fff !important;
}

.price-off-btn {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
    background: #0050df;
}


/*** Banner Section and  offer css end ***/



.home-card-details {
    /** padding: 15px; **/
    padding: 11px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: 700;
    line-height: 140%;
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.home-card-details a {
    color: inherit;
    display: block;
    text-decoration: none
}

.home-card-top {
    min-height: 80px;
    padding: 12px 0;
    line-height: 150%;
    border-top: 1px dashed #fff;
    font-size: 1.3em
}

.home-card-bottom {
    padding: 10px;
    border-bottom: 1px dashed #fff;
    font-size: 1.5em
}

.home-card-top {
    border-left: 1px dashed #fff;
    border-right: 1px dashed #fff;
    padding: 6px 6px 0;
}

.home-card-bottom {
    border-left: 1px dashed #fff;
    border-right: 1px dashed #fff;
}



.card-center-section:after {
    display: inline-block;
    content: "+";
    width: 16px;
    height: 16px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    background: #f01e83;
    border-radius: 50%;
    font-size: 16px;
    line-height: 17px;
    margin-left: 5px
}

.card-bottom-bg {
    background: #f06e02 !important
}



.card-blue-bg {
    padding: 6px 6px 0;
    background: #1f8bd4;
    position: relative
}



.home-main-bottom {
    padding: 0 6px 6px;
    background: #f01e83
}

.hpc_blue2 {
    background: #53a3ac
}

.hpc_red2 {
    background: #ef582b
}

.card-ribbon {
    position: absolute;
    left: -8px;
    top: -12px;
    width: 44px;
    height: 48px;
    background: url(https://www.hioxindia.com/images/ribbon_icon.png) center no-repeat
}

.home_page_combo_main {
    margin: 20px auto;
    padding: 20px;
    background: #f2f2f2;
    border: 2px solid #e7e7e7;
    border-radius: .3em;
    width: 80%
}

.home-card-top_main {
    padding: 10px;
    border-top-left-radius: .2em;
    border-top-right-radius: .2em;
    border-left: 1px dashed #fff;
    border-right: 1px dashed #fff;
    border-top: 1px dashed #fff;
    font-size: 2em
}

.home-card-details_main {
    float: left;
    padding: 15px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: 700;
    line-height: 140%;
    position: relative;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 14px !important
}




@media screen and (max-width: 650px) {

    .home-card-details {
        float: none;
        width: 100%
    }

    .home-card-top_main {
        font-size: 1em
    }

    .home-card-top {
        min-height: 0
    }

}



@media screen and (max-width: 780px) {


    .home-card-top_DT {
        min-height: 145px
    }

    .home-card-details {
        padding: 11px
    }

    .home-card-top {
        min-height: 100px
    }
}











@media screen and (max-width: 650px) {


    .home-card-top {
        min-height: auto
    }

    .home_content_bottom {
        padding: 0;
        margin: 0 auto
    }


}


.label-card {
    z-index: 100;
    background-image: linear-gradient(to right, #ffa900, #fdb832, #ffa900);
    border: 1px solid #f77825;
    color: #000;
    font-weight: lighter;
    font-family: initial !important;
    position: absolute
}

.label-card {
    top: 5px;
    right: 7px;
    padding: 4px 15px;
    font-size: .9rem !important
}

.label-card:after {
    content: "";
    width: 0;
    height: 0;
    top: 27px;
    position: absolute;
    display: inline-block
}






.card-dark-blue-bg {
    padding: 6px 6px 0;
    background: #1867ba;
    border-top-left-radius: .2em;
    border-top-right-radius: .2em;
    position: relative
}

.home_page_combo_green {
    padding: 0 6px 6px;
    background: #f06e02
}

.card-center-section_offer_mid {
    position: relative;
    top: 15px
}





@media screen and (max-width: 650px) {

    .label-card {
        top: -2px;
        right: 3px
    }


    .card-center-section_offer_mid {
        top: 3px
    }

    .home-card-details {
        width: 100%
    }



}


/**** Packages css start **/

.Packages-part {
    background: #fff;
    /* background: #0dcaf0; */
}

@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);



.price-table-wrapper {
    font-family: 'Lato', sans-serif;
    text-align: center;
    margin-top: 5px;
}

.price-table-wrapper h2,
.price-table-wrapper h3 {
    margin: 0px
}

.price-table-wrapper .featured-table {
    box-shadow: 0px 0px 19px -3px rgba(0, 0, 0, 0.5);
    border: 2px solid #e94266 !important;
}

.price-table-wrapper .pricing-table {
    display: inline-block;
    border: 1px solid #C8C8C8;
    border-radius: 10px;
    background: white;
    margin: 10px;
    /* min-width:300px; */
    min-width: 250px;


    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    vertical-align: top;
}

.price-table-wrapper .pricing-table__header {
    /* padding: 20px 10px; */
    padding: 10px 10px;
    border-radius: 9px 9px 0px 0px;
    /* font-size: 36px;  */
    font-size: 20px;
    color: #080009;
    background: #E0E0E0;
}

.price-table-wrapper .featured-table .pricing-table__header {
    background-color: #fbd3da;
}

.price-table-wrapper .pricing-table__price {
    color: #080009;
    padding: 20px 10px;
    margin: auto;
    font-size: 16px;
    font-weight: 500;
}

.price-table-wrapper .pricing-table__button {
    display: block;
    background: #e94266;
    text-decoration: none;
    /* padding: 20px; */
    padding: 10px;
    color: white;
    position: relative;
    overflow: hidden;
    font-size: 1.3em;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.price-table-wrapper .pricing-table__button:before {
    position: absolute;
    left: -20%;
    top: -30%;
    content: '';
    width: 80%;
    height: 300%;
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
    background: white;
    opacity: .2;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.price-table-wrapper .pricing-table__button:after {
    position: absolute;
    content: '>';
    top: 0;
    right: 0;
    font-size: 25px;
    padding: 15px;
    padding-right: 40px;
    color: white;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.price-table-wrapper .pricing-table__button:hover {
    background: black;
}

.price-table-wrapper .pricing-table__list {
    padding: 0px !important;
    color: #080009;
}

.price-table-wrapper ul {
    list-style: none;
    text-align: left;
}

.pricing-table__list {
    padding-top: 0px !important;
    margin-top: 0px;
}

.price-table-wrapper .ion-checkmark {
    opacity: 0.7;
    color: #008e4a;
    padding-right: 10px;
}

.price-table-wrapper .pricing-table__list li.section {
    background-color: #F2F2F2 !important;
}

.price-table-wrapper .pricing-table__list li {
    padding: 10px 15px;
    border-bottom: 1px solid #C8C8C8;
    font-size: 14px;
}

.price-table-wrapper .pricing-table__list li strong {
    /* font-size: 1.2em; */
    font-size: 14px;

}

.price-table-wrapper .pricing-table__list li:first-child {
    padding: 10px 15px 10px 15px;
}

.price-table-wrapper .pricing-table__list li:last-child {
    border: none;
}

.price-table-wrapper .pricing-table:hover {
    box-shadow: 0px 0px 19px -3px rgba(0, 0, 0, 0.36);
}

.price-table-wrapper .pricing-table:hover .pricing-table__button {
    padding-left: 0;
    padding-right: 35px;
}

.price-table-wrapper .pricing-table:hover .pricing-table__button:before {
    top: -80%;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    width: 100%;
}

.price-table-wrapper .pricing-table:hover .pricing-table__button:after {
    opacity: 1;
    padding-right: 15px;
}


.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 12px !important;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/**** Packages css End **/

/***** GET FREE SERVICES CSS START ***/
.feature-icon .fa {
    font-size: 73px !important;
    margin-right: 20px;
    display: inline-block;
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/***** GET FREE SERVICES CSS END ***/


/***** Why Should You Register start ***/
.Why-Should {
    /* background: #e3e6e6;
    border-top: 1px solid #bfa5a5; */
}

.service-card .fa {
    font-size: 38px !important;
    margin-bottom: 25px;
    display: inline-block;
    color: var(--primary);
}

.service-card h4 {
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.service-card {
    padding: 18px;
    margin-bottom: 25px;
    background: var(--chalk);
    transition: all linear .3s;
    -webkit-transition: all linear .3s;
    -moz-transition: all linear .3s;
    -ms-transition: all linear .3s;
    -o-transition: all linear .3s;
}

/*****  Why Should You Register End ***/




/*****  Feedback Section Start ***/
.feedback-title1 {
    /* font-weight: 600; */
    font-size: 35px;
    padding: 11px 0;
    text-align: center;
    border-top: 1px solid #bdacac;
}

.feedback-title1 .counter-color {
    color: red;
}

.feedback-title2 {
    /* padding-left: 35px; */
    color: #856666;
}


.img-wrapper {
    max-width: 100%;
    height: 65vw;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

img {
    max-width: 100%;
    max-height: 100%;
}

@media screen and (min-width: 576px) {
    .carousel-inner {
        display: flex;
    }
    .carousel-item {

        /* display: block;
        margin-right: 0;
        flex: 0 0 calc(100% / 2); */
    }

    .img-wrapper {
        height: 21vw;
    }
}

.carousel-inner {
    padding: 1em;
}

/* .card {
  font-size: 0.9em;
  background-color: #efe5e5;
  padding: 20px;
  border-radius: 8px;
  width: 35%;
  margin: auto;
} */

.card1 {
    background-color: #efe5e5;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 2%;
}

.carousel-control-prev,
.carousel-control-next {
    width: 6vh;
    height: 6vh;
    background-color: #e1e1e1;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.5;
}

.carousel-control-prev:hover,
.carousel-control-next:hover {
    opacity: 0.8;
}

.name-title {
    text-align: center;

}

.name-title2 {
    text-align: center;

}

.feedback-image img {
    display: block;
    margin-left: auto;
    margin-right: auto;

}

.feedback-bg1 {
    background: #0b356f;
}

.feedback-bg2 {
    background: #000e9c !important;
    /* background: #b3e5fc !important; */

}


/*****  Feedback Section End ***/


/*****  Features Includes Section Start ***/
.features1-section {
    background: #e3e6e6;
}

.feature-title1 {
    font-weight: 600;
    color: #001d23;
    margin: 0;
    text-transform: capitalize;
    font-size: 26px;
    padding-top: 20px;

}

.section-heading1 {
    text-align: center;
    margin-bottom: 20px;
}


.table-section {
    border: solid 1px grey;

}

.table>:not(caption)>*>* {
    padding: 0.8rem 0.5rem;
    /* background-color: var(--bs-table-bg); */
    background-color: #fff;

    border-bottom-width: 1px;
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}

.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}




/*****  Features Includes Section End ***/


/***** Free advice section Start ***/

.bg-lightblue {
    background: #fff;
}


.quote-title {
    color: #1a202c;
    font-family: Poppins, sans-serif;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0.5rem;
    margin-top: 0;
}

.quote-title2 {
    font-family: Poppins, sans-serif;
    font-weight: 600;
    color: #9c9b9b;
}

.card-circle {
    border-radius: 20px;
}

.ga-click-on-phone-number {
    font-size: 20px;
    font-weight: 600;
}

.ga-click-on-phone-number .fa {
    font-size: 20px !important;
    font-weight: 600;
}

.quote-btn {
    border-radius: 10px;
    padding: 12px 32px;
    border: none;
    font-size: 15px;
    font-weight: 700;
    background: #0050df;

}


.enquiry-form {
    background: #000e9c;
    padding: 25px;
}

.form-field1 {
    height: 44px;
}

.form-btn1 {
    border-radius: 20px;
    padding: 12px 32px;
    border: none;
    font-size: 15px;
    font-weight: 700;

}


/***** Free advice section End ***/


/***** Free domain name Section Start ***/
.free-domain {
    background-image: url(../images/bg/bg1.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 140px 0px 80px;

}

.domain-content {

    background: #fff;
    box-shadow: 1px 0px 6px 0px #131313bf;
    height: 105px;
    border-radius: 20px;
}

.free-domain h2 {
    font-size: 20px;
    font-weight: 800;
    text-transform: capitalize;
    padding: 10px;
}

.free-domain h2 a {
    color: #150a62;
}

.free-domain h3 {
    font-size: 15px;
    font-weight: 900;
    color: black;
    text-transform: capitalize;
    padding: 10px;
    margin-top: -32px;

}

/***** Free domain name Section End ***/

/***** Everything You Need Section Start ***/

.service-card h4 {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.Everything-section {
    /* padding-top:20px;
		padding-bottom:20px; */
}

.service-main {
    padding-left: 25px;
}


.card-list {
    width: 100%;
    /* margin: 34px; */
    margin-left: 92px;
    box-shadow: 0 1px 6px rgb(96 78 78 / 25%);
    background-color: #fffeff;
    border-radius: 8px;
}


.every-btn1 {
    border-radius: 10px;
    padding: 12px 32px;
    border: none;
    font-size: 15px;
    font-weight: 700;
}

/***** Everything You Need Section End ***/


/*****  4 Simple Steps Section css Start ***/


.section-title1 {
    font-size: 32px;
    font-weight: 900;
    letter-spacing: -1.2px;
    text-transform: uppercase;
}


.simple-steps {}

/*** List 1 Start **/
.s1-proccess-list {
    background: #fffcca;
    padding: 15px;
    /* padding-right: 20px; */
    border-radius: 20px;
    border-bottom: 4px solid #b9b9b9;
    width: 260px;
    margin-left: 5px;
}

.s1-proccess-1 h3 {
    background: #d5a74e;
    color: #fff;
    border-radius: 25px;
    text-align: center;
    width: 35px;
}

.s1-proccess-2 p {
    color: #000;
    font-size: 16px;
    font-weight: bold;
    text-wrap: nowrap;
}

/*** List 1 End **/

/*** List 2 Start **/
.s2-proccess-list {
    background: #c0edf580;
    padding: 25px;
    border-radius: 20px;
    border-bottom: 4px solid #b9b9b9;
    width: 260px;
    margin-left: 5px;
}

.s2-proccess-1 h3 {
    background: #81bcc6;
    color: #fff;
    border-radius: 25px;
    text-align: center;
    width: 35px;
}

.s2-proccess-2 p {
    color: #000;
    font-size: 16px;
    font-weight: bold;
    text-wrap: nowrap;
}

/*** List 2 End **/


/*** List 3 Start **/
.s3-proccess-list {
    background: #fbe5d9c2;
    padding: 25px;
    border-radius: 20px;
    border-bottom: 4px solid #b9b9b9;
    width: 260px;
    margin-left: 5px;
}

.s3-proccess-1 h3 {
    background: #ceaf9f;
    color: #fff;
    border-radius: 25px;
    text-align: center;
    width: 35px;
}

.s3-proccess-2 p {
    color: #000;
    font-size: 16px;
    font-weight: bold;
    text-wrap: nowrap;
}

/*** List 3 End **/

/*** List 3 Start **/
.s4-proccess-list {
    background: #61df0630;
    padding: 25px;
    border-radius: 20px;
    border-bottom: 4px solid #b9b9b9;
    width: 315px;
    margin-left: 5px;
}

.s4-proccess-1 h3 {
    background: #9abf80;
    color: #fff;
    border-radius: 25px;
    text-align: center;
    width: 35px;
}

.s4-proccess-2 p {
    color: #000;
    font-size: 16px;
    font-weight: bold;
    text-wrap: nowrap;
}

/*** List 3 End **/

/*** connect button css start ***/
.price-btn {
    margin-top: 28px;
    text-align: center;
}

.price-btn p {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 14px;
    letter-spacing: 0.2px;
}

.contactus-btn1 {
    border-radius: 25px;
}

/*** connect button css End ***/

/** Zoom Effect start **/

.zoom:hover {
    transform: scale(0.9);
}

/** Zoom Effect start **/

/*****  4 Simple Steps Section css End ***/


/*** FAQ CSS START ***/
.faq-section {
    /* background: #e3e6e6; */
    background: #0dcaf0;
}


@import url("https://fonts.googleapis.com/css?family=Lato:400,400i,700");

* {
    font-family: Lato, sans-serif;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}



h1 {
    margin-bottom: 20px;
}

.faq-main {
    background-color: white;
    color: black;
    border-radius: 20px;
    box-shadow: 0 5px 10px 0 rgb(0, 0, 0, 0.25);
    margin: 20px 0;
}

.question {
    font-size: 1.2rem;
    font-weight: 600;
    padding: 15px 80px 15px 20px;
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.question::after {
    content: "\002B";
    font-size: 2.2rem;
    position: absolute;
    right: 20px;
    transition: 0.2s;
}

.question.active::after {
    transform: rotate(45deg);
}

.answercont {
    max-height: 0;
    overflow: hidden;
    transition: 0.3s;
}

.answer {
    padding: 0 20px 20px;
    line-height: 1.5rem;
}

.question.active+.answercont {}

@media screen and (max-width: 790px) {
    html {
        font-size: 14px;
    }

    .wrapper {
        width: 80%;
    }
}




/*** FAQ CSS END ***/

/*** Manjunath ***/

.wizard,
.wizard .nav-tabs,
.wizard .nav-tabs .nav-item {
    position: relative;
    margin-right: 1%;
}

.wizard .nav-tabs:after {
    content: "";
    width: 80%;
    border-bottom: solid 2px #ccc;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    top: 38%;
    z-index: -1;
}

.wizard .nav-tabs .nav-item .nav-link {
    width: auto;
    height: 53px;
    margin-bottom: 6%;
    background: white;
    border: 2px solid #ccc;
    color: #ccc;
    border-radius: 9px;
}

.wizard .nav-tabs .nav-item .nav-link:hover {
    color: #333;
    border: 2px solid #333;
}

.wizard .nav-tabs .nav-item .nav-link.active {
    background: #6824d6;
    border: 2px solid #bc7e4d;
    color: #ffffff;
}

.wizard .nav-tabs .nav-item .nav-link.active h5 {
    color: #ffffff;
}

.wizard .nav-tabs .nav-item .nav-link:after {
    content: " ";
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    opacity: 0;
    margin: 0 auto;
    bottom: 0px;
    border: 5px solid transparent;
    border-bottom-color: #0dcaf0;
    transition: 0.1s ease-in-out;
}

.nav-tabs .nav-item .nav-link.active:after {
    content: " ";
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    opacity: 1;
    margin: 0 auto;
    bottom: -5px;
    border: 10px solid transparent;
    border-bottom-color: #b78900;
}

.wizard .nav-tabs .nav-item .nav-link svg {
    font-size: 25px;
}


.icon {
    display: flex;
    align-items: flex-start;
}

.icon svg {
    width: 2.188rem;
    margin-left: -0.188em;
}

.Packages-part h1 {
    font-size: 2.35rem;
    text-transform: capitalize;
    padding-bottom: 2rem;
    text-align: center;
}

@media screen and (min-width: 42.5rem) {
    .Packages-part h1 {
        /* font-size: 3rem; */
        font-size: 2.1rem;
        background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1418 125" fill="%23FFBB7B"><path d="M1412.29 72.17c-11.04-5.78-20.07-14.33-85.46-25.24-22.37-3.63-44.69-7.56-67.07-11.04-167.11-22.06-181.65-21.24-304.94-30.56C888.78 1.39 822.57 1.1 756.44 0c-46.63-.11-93.27 1.56-139.89 2.5C365.5 13.55 452.86 7.68 277.94 23.15 202.57 33.32 127.38 45.01 52.07 55.69c-11.23 2.41-22.63 4.17-33.71 7.22C6.1 66.33 5.64 66.19 3.89 67.79c-7.99 5.78-2.98 20.14 8.72 17.5 33.99-9.47 32.28-8.57 178.06-29.66 4.26 4.48 7.29 3.38 18.42 3.11 13.19-.32 26.38-.53 39.56-1.12 53.51-3.81 106.88-9.62 160.36-13.95 18.41-1.3 36.8-3.12 55.21-4.7 23.21-1.16 46.43-2.29 69.65-3.4 120.28-2.16 85.46-3.13 234.65-1.52 23.42.99 1.57-.18 125.72 6.9 96.61 8.88 200.92 27.94 295.42 46.12 40.87 7.91 116.67 23.2 156.31 36.78 3.81 1.05 8.28-.27 10.51-3.58 3.17-3.72 2.66-9.7-.78-13.13-3.25-3.12-8.14-3.44-12.18-5.08-17.89-5.85-44.19-12.09-63.67-16.56l26.16 3.28c23.02 3.13 46.28 3.92 69.34 6.75 10.8.96 25.43 1.81 34.34-4.39 2.26-1.54 4.86-2.75 6.21-5.27 2.76-4.59 1.13-11.06-3.59-13.68ZM925.4 23.77c37.64 1.4 153.99 10.85 196.64 14.94 45.95 5.51 91.89 11.03 137.76 17.19 24.25 4.77 74.13 11.21 101.72 18.14-11.87-1.15-23.77-1.97-35.65-3.06-133.46-15.9-266.8-33.02-400.47-47.21Z"></path></svg>');
        background-size: 17.5rem;
        background-repeat: no-repeat;
        background-position: 98% 3.375rem;
        padding-bottom: 3rem;
    }
}

section {
    /* display: grid; */
    /* place-items: center;
    padding: 1rem; */
}

section>span {

    /* display: inline-block;
    margin-bottom: 0.938em;
    text-transform: uppercase;
    letter-spacing: 0.12rem;
    font-size: 0.8rem;
    background: #ffbb7b;
    color: #5c0404;
    font-weight: bold;
    padding: 10px 30px;
    border-radius: 50px; */
}

.cards {
    margin-top: 11em;
    display: flex;
    gap: 3rem;
    flex-wrap: wrap;
    justify-content: center;
}

.card {
    /* width: 17.5rem; */
    cursor: pointer;
}

.card ul {
    margin: 0;
    padding: 11px;
    list-style: none;
    height: 100%;
    display: inline-flex;
    flex-direction: column;
    justify-content: end;
    gap: 0.5rem;
    background: #f1eaea;
}

.card ul li {
    border-bottom: 1px dashed #938585;
}

.card__outer {
    background: #ebecee;
    position: relative;
    height: 23.438rem;
    border-radius: 0.625rem;
    display: flex;
    align-items: flex-end;
    padding: 1.25rem;
    transition: 0.3s ease-in-out;
}

.card__outer a {
    display: flex;
    align-items: center;
    text-decoration: none;
    text-transform: capitalize;
    font-weight: bold;
}

.card__outer a svg {
    margin-left: 0.375em;
    width: 1.125rem;
}

.card__inner {
    background: #fff;
    position: absolute;
    bottom: 3.75rem;
    right: 1.25rem;
    width: 100%;
    border-radius: 0.625rem;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
}

.card__inner .title {
    text-transform: capitalize;
    font-weight: bold;
    font-size: 1rem;
    display: inline-block;
    margin-bottom: 0.938em;
    text-align: center;
}

.card__inner .price {
    position: relative;
    text-align: center;
}

.card__inner .price-del {
    position: relative;
    text-align: center;
    padding-top: 5%;
}

.card__inner .price-renew {
    position: relative;
    text-align: center;
    padding-top: 3%;
}

.card__inner .price--number {
    font-size: 2rem;
    font-weight: 600;
}

.card__inner .price-del--number {
    font-size: 1.5rem;
    font-weight: 600;
    text-decoration: line-through;
    color: #ff6b6b;
}

.card__inner .price-renew--number {
    font-size: 1.1rem;
    font-weight: 600;
    color: #c18282;
}

.card__inner .price--dolar {
    font-weight: 500;
}

.card.active .card__outer a {
    color: #fff;
}

.card:nth-child(1).active .card__inner svg {
    color: #6824d6;
}

.card:nth-child(1).active .card__outer {
    background: #6824d6;
    box-shadow: 5px 18px 13px rgba(104, 36, 214, 0.43);
}

.card:nth-child(2).active .card__inner svg {
    color: #fe3258;
}

.card:nth-child(2).active .card__outer {
    background: #fe3258;
    box-shadow: 5px 18px 13px rgba(254, 52, 89, 0.43);
}

.card:nth-child(3).active .card__inner svg {
    color: #4ccda7;
}

.card:nth-child(3).active .card__outer {
    background: #4ccda7;
    box-shadow: 5px 18px 13px rgba(76, 205, 166, 0.43);
}

.card--purple .card__inner svg,
.card--purple .card__inner .title,
.card--purple .card__outer a {
    color: #6824d6;
}

.card--red .card__outer {
    height: 25.313rem;
}

.card--red .card__inner svg,
.card--red .card__inner .title,
.card--red .card__outer a {
    color: #fe3258;
}

.card--green .card__inner svg,
.card--green .card__inner .title,
.card--green .card__outer a {
    color: #399f81;
}

.select {
    font-size: 1em;
    border: 1px solid #cbb2b2;
    margin-bottom: 5%;
    padding: 3%;
}


:root {
    --col-primary: #296eb3;
    --col-secondary: #003b81;
    --col-background: #e8e8e8;
    --col-light: #e8e8e8;
    --col-dark: #022f64;
    --col-free: #7dbaff;
    --col-bronze: #b85a24;
    --col-silver: #8a8a8a;
    --col-gold: #e2a922;
}


.price_table {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    align-items: start;
    column-gap: 2rem;
    row-gap: 2rem;
    /* max-width: 80em; */
}

.package {
    border-radius: 4px;
    background: white;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4);
    overflow: hidden;
    position: relative;
}

.package h2 {
    margin: 0;
    padding: 1rem;
    background: linear-gradient(90deg, #FFD700, #FFC107, #FF9800);
    font-size: 1.2em;
    text-align: center;
    font-weight: normal;
    color: white;
    position: relative;
}

.package h2::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0.4rem;
    left: 0;
    bottom: 0;
}

.package .price {
    padding: 1rem;
    background: linear-gradient(45deg, #000e9c 0%, #011592 100%);
    color: white;
    text-shadow: 0 4px 0 var(--col-dark);
}

.package p {
    padding: 1rem;
}

.package .price {
    font-size: 1.2em;
    font-weight: normal;
    text-align: center;
    box-shadow: inset 0 10px 4px -6px rgba(0, 0, 0, 0.1);
}

.package .big {
    display: inline;
    font-size: 2em;
    font-weight: 700;
}

.package ul {
    list-style: none;
    padding: 0 0 1rem 0;
    margin: 0;
    border-bottom: 1px solid var(--col-primary);
}

.package li {
    padding: 0.8em 1em;
    font-size: 0.9em;
}

.package li:nth-child(odd) {
    background: var(--col-light);
}

.package button {
    cursor: pointer;
    padding: 0.5em 1em;
    font-size: 1rem;
    display: block;


    margin: 1rem auto;
    border: none;
    border-radius: 5px;
    background: #000e9c;
    transition: all 0.2s;
}

.package button a {
    color: white;
}

.package button:hover,
.package button:focus {
    background: linear-gradient(0deg, var(--col-secondary) 0%, var(--col-dark) 100%);
    box-shadow: 0 0 0 4px white, 0 0 0 8px var(--col-primary);
    outline: 0;
}

.package .banner {
    background: linear-gradient(90deg, #33a530 0%, #4eee49 50%, #33a530 100%);
    transform: rotate(-45deg);
    position: absolute;
    z-index: 1;
    padding: 0.5rem 4rem;
    top: 2rem;
    left: -4rem;
    border: 2px solid #91ff69;
    box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.2);
}

.package_free h2::after {
    background: var(--col-free);
    background: linear-gradient(90deg, var(--col-free) 0%, white 50%, var(--col-free) 100%);
}

.package_bronze h2::after {
    background: linear-gradient(90deg, var(--col-bronze) 0%, white 50%, var(--col-bronze) 100%);
}

.package_silver h2::after {
    background: linear-gradient(90deg, var(--col-silver) 0%, white 50%, var(--col-silver) 100%);
}

.package_gold h2::after {
    background: linear-gradient(90deg, var(--col-gold) 0%, white 50%, var(--col-gold) 100%);
}


/** Manjunath **/
.hosting .card-header {
    padding: 0.5rem 1rem;
    margin-bottom: 0;
    background-color: #1f446e;
    border-bottom: 1px solid rgba(0, 0, 0, .125);
    color: #fff;
    font-weight: 700;
}

.hosting .card-header1 {
    padding: 0.5rem 1rem;
    margin-bottom: 0;
    background-color: #2c3e4c;
    border-bottom: 1px solid rgba(0, 0, 0, .125);
    color: #fff;
    font-weight: 700;
}

.hosting .card-body {
    flex: 1 1 auto;
    padding: 1rem 1rem;
    background: #58798a;
    color: #fff;
}

.hosting .card-body p a {
    color: #fff;
}


.hosting .badge {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    background: #6baf00;
}

.hosting .content {
    padding: 0.35em 0.65em;
    font-size: 1.2em;
    color: #fff;
}

.badge {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    background: #6baf00;
}

/** New CSS **/
.domain-list-header h2 {
    padding: 0.5rem 1rem;
    background-color: #1f446e;
    color: #fff;
    border-radius: 10px 0;
}

.domain-list-body {
    background-color: #a1bbb3;
    padding: 2%;
}

.card-body {
    flex: 1 1 auto;
    padding: 1rem 1rem;
    background: #58798a;
    background: #0dcaf0;
    color: #fff;
}

.domain-list-body1 {
    background-color: #d4ede5;
    padding: 2%;
}


.payment-option {
    background-color: #003b81;
    padding: 2%;
}

.payment-option h4 {
    color: #fff;
    text-decoration: underline;
}

.payment-option p {
    color: #fff;
    padding: 2% 3% 1%;
}

.payment-heading {
    background-color: #008e4a;
    padding: 2%;
    border-radius: 10px;
}

.payment-address {
    background-color: #1a202c;
    padding: 2%;
}

.payment-address h4 {
    color: #fff;
    text-decoration: underline;
}

.payment-address p {
    color: #fff;
    padding: 2% 3% 1%;
}


.account {
    padding-bottom: 2%;
}

label {
    padding-bottom: 1%;
    color: #645a5a;
}


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

input {
    padding: 10px;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
    transition: border-color 0.3s ease-in-out;
    outline: none;
    background-color: white;
}


button {
    background-color: #574c4a;
    color: #fff;
    padding: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease-in-out;
}
/* 
button:hover {
    background-color: #998882;
} */

form .mid-page {
    text-align: center;
    margin-top: 18px;
}

.nav-tabs .nav-link {
    /* background: #d1bcbc; */
    background: #838383;
    color: #fff;
    /* margin: 0 3%; */
}

/**** bg grey css start ***/
.bg-grey1 {
    background: #e3e6e6;
}

.bg-grey2 {
    /* background: #ece8e6; */
    background: #00097c;
}


/*** My Tickets css start ****/
.nav-tickets-main .ticket-links {
    margin: 0 3%;
}

.myticket-card {
    font-size: 0.9em;
    background-color: #477099;
    padding: 20px;
    border-radius: 8px;
    width: 35%;
    margin: auto;
}

.myticket-page-btn1 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
    background: #00ac6a;
}

.myticket-page-btn2 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
}

/*** My Tickets css End  ****/


/**** Register PAGE CSS START ***/

.reg-card {
    font-size: 0.9em;
    background-color: #477099;
    padding: 20px;
    border-radius: 8px;
    width: 35%;
    margin: auto;
}


.reg-page-btn1 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
    background: #00ac6a;
}

.reg-page-btn2 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
}

.reg-title1 {
    color: #fcfc7f;
    font-weight: bold;
}


.signup-btn1 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
    margin-top: 2px;
    background: #EA4335;
    width: fit-content;
}

.signup-btn2 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
    margin-top: 5px;
    background: #3b5998;
    width: fit-content;
}

/**** Register PAGE CSS End ***/

/**** Login PAGE CSS START ***/

.login-card {
    font-size: 0.9em;
    background-color: #477099;
    padding: 20px;
    border-radius: 8px;
    width: 35%;
    margin: auto;
}


.login-page-btn1 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
    background: #00ac6a;
}

.login-page-btn2 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
}

.login-title1 {
    color: #fcfc7f;
    font-weight: bold;
}

/**** Login PAGE CSS End ***/

/**** Forget Password PAGE CSS START ***/

.Forgot-card {
    font-size: 0.9em;
    background-color: #477099;
    padding: 20px;
    border-radius: 8px;
    width: 35%;
    margin: auto;
}


.Forgot-page-btn1 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
    background: #00ac6a;
}

.Forgot-page-btn2 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
}

.Forgot-title1 {
    color: #fcfc7f;
    font-weight: bold;
}

/**** Forget Password PAGE CSS End ***/


/*** Banner animation text css start ***/
#app {
    text-align: center;
    margin-top: 50px;
    font-size: 20px;
    height: 40px;
    font-weight: bold;
    overflow: hidden;
    background-image: linear-gradient(-225deg,
            #231557 0%,
            #f05523 29%,
            #ffbf00 67%,
            #fff800 100%);
    background-clip: border-box;
    text-fill-color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    animation: textclip 2s linear infinite;
}

@keyframes textclip {
    to {
        background-position: 200% center;
    }
}

/*** Banner animation text css End ***/



/*** Combo Offer buy button css start ***/
.buy-btn1 {
    padding: 5px 10px 5px 10px;
    border-radius: 25px;
}

/*** Combo Offer buy button css End ***/