/**********new- Main **********/

.container {
  width: clamp(320px, 90vw, 1678px);
    margin-inline: auto;
    max-width: 100%;  
}


/********** Header **********/

#header .container {
    width: clamp(320px,90vw,1678px);
    margin-inline:auto;
    max-width: 100%;
}

#header .content--area {
    display: flex;
    align-items: center
}

#header .content--area .logo {
    display: block;
    margin-right: 64px;
    line-height: 0
}

#header .content--area .logo img {
    width: 100%;
    max-width: 181px
}

@media(max-width: 1468px) {
    #header .content--area .logo img {
        max-width:150px
    }
}

#header .content--area nav {
    display: flex;
    align-items: center;
    width: 100%
}

@media(max-width: 1468px) {
    #header .content--area nav {
        width:auto;
        margin-left: auto
    }
}

#header .content--area nav a {
    display: block;
    color: #0a0000;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
}
#header .content--area nav a:hover {
    text-decoration: none;
}

#header .content--area nav>ul {
    display: flex;
    width: 100%
}

#header .content--area nav>ul li {
    position: relative;
    padding: 0 10px
}

#header .content--area nav>ul li>a {
    padding: 32px 16px
}

/*#header .content--area nav>ul li.offer {
    padding-right: 32px
}

#header .content--area nav>ul li.offer::before {
    content: "";
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    font-size: 22px;
    color: #c3c3c3;
    font-family: "icomoon" !important;
    position: absolute;
    z-index: 0
}

#header .content--area nav>ul li.offer:after {
    content: "";
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: #ebebeb;
    position: absolute
}*/

#header .content--area nav>ul li.offer a {
    position: relative;
    padding-left: 37px
}

#header .content--area nav>ul li ul {
    display: none;
    border: #ebebeb solid 1px
}

#header .content--area nav>ul li:hover ul {
    display: block;
    position: absolute;
    top: 87px;
    left: 0;
    min-width: 200px;
    background: #fff;
    border-radius: 9px;
    box-shadow: 0px 10px 15px -3px rgba(0,0,0,.1);
    z-index: 5
}

@media(max-width: 1700px) {
    #header .content--area nav>ul li:hover ul {
        top:70px
    }
}

#header .content--area nav>ul li:hover ul li {
    border-bottom: #ebebeb solid 1px
}

#header .content--area nav>ul li:hover ul li a {
    padding: 18px
}

@media(max-width: 1700px) {
    #header .content--area nav>ul li:hover ul li a {
        padding:13px 18px
    }
}

#header .content--area nav>ul li:hover ul li:hover a {
    color: #2442d3
}

#header .content--area nav>ul li.has-submenu>a {
    position: relative
}

#header .content--area nav>ul li.has-submenu>a:after {
    content: "";
    top: 50%;
    right: 3px;
    font-size: 4px;
    transform: translateY(-50%);
    font-family: "icomoon" !important;
    position: absolute;
    z-index: 0
}

#header .content--area nav > ul li:last-child::after {
    content: "";
    top: 0;
    /*right: 0;*/
    width: 1px;
    height: 100%;
    background: #ebebeb;
    position: absolute;
    right: -45%;
}
#header .content--area nav .button-secondary::before {
    content: "";
    /*top: 50%;
    left: 0;
    transform: translateY(-50%);*/
    width: 22px;
    height: 22px;
    font-size: 22px;
    color: #c3c3c3;
    font-family: "icomoon" !important;
    position: absolute;
    z-index: 0;
    left: 85%;
}

@media(max-width: 1700px) {
    #header .content--area .logo {
        margin-right:50px
    }

    #header .content--area nav ul a {
        font-size: 15px
    }

    #header .content--area nav ul li {
        padding: 0
    }

    #header .content--area nav ul li>a {
        padding: 24px 16px
    }

    #header .content--area nav ul li.offer {
        padding-left: 0
    }

    #header .content--area nav ul li.offer a {
        padding-left: 0
    }

    #header .content--area nav ul li.offer::before {
        display: none
    }

    #header .content--area nav ul ul li a {
        padding: 14px
    }

    #header .content--area nav > ul li:last-child::after {
        display: none;
    }
#header .content--area nav .button-secondary::before {
        display: none;
    }
}

@media(max-width: 1468px) {
    #header {
        padding:16px 0
    }

    #header .content--area nav ul {
        display: none
    }

    #header .content--area nav .button-secondary {
        display: none
    }
}

.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    font-size: 26px;
    cursor: pointer;
    color: #2d2d2d;
    margin: 5px 0 0 16px
}

@media(max-width: 1468px) {
    .mobile-menu-toggle {
        display:block
    }
}

.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    max-width: 360px;
    height: 100vh;
    background: #4f6bb1;
    z-index: 9999;
    transition: right .4s ease;
    padding: 20px;
    overflow-y: auto
}

.mobile-menu .has-submenu>a {
    position: relative
}

.mobile-menu .has-submenu>a::after {
    content: "";
    top: 50.8%;
    right: 5px;
    transform: translateY(-50%);
    font-size: 5px;
    color: #fff;
    font-weight: 400;
    font-family: "icomoon" !important;
    position: absolute
}

.mobile-menu .mobile-menu-toggle {
    display: none
}

.mobile-menu .button-secondary {
    margin-top: 16px
}

.mobile-menu.active {
    right: 0
}

.mobile-menu .close-button {
    display: flex;
    justify-content: flex-end;
    font-size: 24px;
    color: #fff;
    text-decoration: none;
    margin-bottom: 20px
}

.mobile-menu-content nav ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.mobile-menu-content nav ul li {
    border-bottom: 1px solid hsla(0,0%,100%,.1)
}

.mobile-menu-content nav ul li a {
    display: flex;
    justify-content: space-between;
    padding: 14px 10px;
    color: #fff;
    text-decoration: none;
    font-size: 16px
}

.mobile-menu-content nav ul li ul {
    display: none;
    padding-left: 15px;
    background: hsla(0,0%,100%,.03)
}

.mobile-menu-content nav ul li.open>a {
    color: #00f0ff
}

.mobile-menu-content nav ul li ul li a {
    font-size: 14px;
    padding: 12px 10px;
    color: #cfd8dc
}

.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    font-size: 26px;
    cursor: pointer;
    color: #000
}

@media screen and (max-width: 1468px) {
    .mobile-menu-toggle {
        display:block
    }
}

/********** Footer **********/

.footer {
    width: 100%;
    padding: clamp(60px,8vw,139px) 0 !important;
    background: url('/templates/lyrahosting2/images/footer-bg.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover
}
.footer .container {
    width: clamp(320px,90vw,1678px);
    margin-inline:auto;
    max-width: 100%;
}
.footer .footer-header {
    display: flex;
    justify-content: space-between;
    gap: 32px
}

@media screen and (max-width: 1280px) {
    .footer .footer-header {
        flex-direction:column;
        gap: 0
    }
}

.footer .footer-header h3 {
    padding-right: clamp(24px,3vw,120px);
    color: #fff;
    max-width: 880px;
    border-right: 1px solid rgba(235,235,235,.1647058824);
    padding-bottom: clamp(28px,4vw,120px);
    font-size: clamp(3rem, 4vw, 7.5rem);
    font-style: normal;
    font-weight: 500;
    line-height: 125%;
    margin: 0;
}

.footer .footer-header .footer-header-cta {
    max-width: 582px;
    padding-bottom: clamp(28px,8vw,120px)
}

@media screen and (max-width: 1200px) {
    .footer .footer-header .footer-header-cta {
        max-width:100%
    }
}

.footer .footer-header .footer-header-cta span {
    display: inline-block;
    padding: 7.5px 21px 6px 21px;
    margin-bottom: 19px;
    border-radius: 100px;
    color: #fff;
    border: 1px solid #4e86ef;
    background: linear-gradient(90deg, rgba(16, 31, 109, 0.37) 0%, rgba(115, 115, 115, 0) 100%);
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 110%
}

.footer .footer-header .footer-header-cta p {
    margin-bottom: clamp(24px,4vw,60px);
    color: #fff;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 180%
}

.footer .footer-header .footer-header-cta .cta {
    display: flex;
    align-items: center;
    gap: 20px
}

@media screen and (max-width: 991px) {
    .footer .footer-header .footer-header-cta .cta {
        flex-direction:column;
        align-items: flex-start
    }

    .footer .footer-header .footer-header-cta .cta button {
        width: 100%
    }
}

.footer .footer-header .footer-header-cta .cta button {
    padding-top: 0;
    padding-bottom: 0;
    min-height: 73px
}

.footer .content-area {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid rgba(235,235,235,.1647058824);
    text-align: left
}

@media screen and (max-width: 1280px) {
    .footer .content-area {
        flex-wrap:wrap
    }
}

.footer .content-area .main-links {
    padding-top: clamp(40px,3vw,95px);
    padding-right: clamp(20px,4vw,95px);
    max-width: 228px;
    border-right: 1px solid rgba(235,235,235,.1647058824)
}

.footer .content-area .main-links ul li {
    margin-bottom: 20px
}

.footer .content-area .main-links ul li a {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 125%
}

.footer .content-area .main-links ul li a span {
    color: #fff
}

.footer .content-area .main-links ul li a i {
    font-size: 20px;
    color: #fff;
    opacity: .4
}

.footer .content-area .main-links ul li a:hover span,.footer .content-area .main-links ul li a.active span {
    text-decoration-line: underline
}

.footer .content-area .main-links ul li a:hover i,.footer .content-area .main-links ul li a.active i {
    opacity: 1
}

.footer .content-area .logo-area {
    padding: clamp(40px,3vw,95px) clamp(20px,4vw,78px);
    border-right: 1px solid rgba(235,235,235,.1647058824);
    max-width: 442px
}

@media screen and (max-width: 1280px) {
    .footer .content-area .logo-area {
        flex-wrap:wrap;
        border: none
    }
}

.footer .content-area .logo-area .logo {
    display: inline-block;
    max-width: 180px;
    margin-bottom: clamp(16px,2vw,32px)
}

.footer .content-area .logo-area .logo img {
    width: 100%
}

.footer .content-area .logo-area p {
    margin-bottom: clamp(20px,3vw,46px);
    font-size: clamp(14px,1.2vw,16px);
    color: #fff;
    font-style: normal;
    font-weight: 400;
    line-height: 180%
}

.footer .content-area .logo-area .social-icons {
    display: flex;
    align-items: center;
    gap: 11px
}

.footer .content-area .logo-area .social-icons li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 39px;
    color: #fff;
    font-size: 16px;
    background: rgba(192,203,255,.1)
}

.footer .content-area .logo-area .social-icons li a:hover {
    background: #657be8
}

.footer .content-area .other-links {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: clamp(40px,3vw,95px) 0 0 clamp(20px,4vw,78px);
    width: 100%
}

@media screen and (max-width: 1280px) {
    .footer .content-area .other-links {
        flex-wrap:wrap;
        gap: 32px
    }
}

.footer .content-area .other-links .link-list {
    min-width: 170px
}

.footer .content-area .other-links .link-list h6 {
    margin-bottom: 24px;
    color: #fff;
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 125%
}

.footer .content-area .other-links .link-list ul li a {
    color: #9ea5c4;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 249%
}

.footer .content-area .other-links .link-list ul li a:hover {
    color: #2442d3
}

.footer .copyright {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding-top: 50px;
    border-top: 1px solid rgba(235,235,235,.1647058824);
    margin: 0 !important;
}

@media screen and (max-width: 1280px) {
    .footer .copyright {
        padding-top:26px;
        flex-direction: column
    }
}

.footer .copyright img {
    max-width: 495px;
    flex-shrink: 1
}

@media screen and (max-width: 1600px) {
    .footer .copyright img {
        max-width:380px
    }
}

.footer .copyright .copyright-text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px
}

@media screen and (max-width: 1200px) {
    .footer .copyright .copyright-text {
        align-items:flex-start;
        flex-direction: column;
        gap: 16px
    }
}

.footer .copyright .copyright-text p {
    color: #d2d9ff;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 128%;
    opacity: .5;
    margin: 0;
}

.footer .copyright .copyright-text p a {
    color: #d2d9ff
}

.footer .copyright .copyright-text ul {
    display: flex;
    gap: 28px;
    line-height: normal
}

@media screen and (max-width: 640px) {
    .footer .copyright .copyright-text ul {
        flex-direction:column
    }
}

.footer .copyright .copyright-text ul li {
    line-height: normal;
    font-size: 14px
}

.footer .copyright .copyright-text ul li a {
    display: inline-block;
    padding: 0 28px 0 0;
    color: #d2d9ff;
    opacity: .5;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 128%;
    position: relative
}

.footer .copyright .copyright-text ul li a:after {
    content: "|";
    top: 0;
    right: 0;
    opacity: .5;
    color: #d2d9ff;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 128%;
    position: absolute
}

.footer .copyright .copyright-text ul li a:hover {
    opacity: 1
}

.footer .copyright .copyright-text ul li:last-child a {
    padding: 0
}

.footer .copyright .copyright-text ul li:last-child a:after {
    display: none
}

/* ------ Navbar ------ */

header.header .search {
    border: 1px solid #0c1436;
    color: #0c1436;
}
header.header .search .btn {
    color: #0c1436;
}
header.header .search .btn:hover {
    color: #fff;
}
header.header .search .form-control::placeholder {
    color: #0c1436;
}
header.header .toolbar .nav-link {
    border: 1px solid #0c1436;
    color: #0c1436;
}
header.header .toolbar .nav-link:hover {
    color: #2442d3;
}
header.header .navbar a.pr-4,  header.header .navbar a.dropdown-toggle {
    /*color: #fff;*/
    font-size: 16px;
}
header.header .dropdown-item.active, header.header .dropdown-item:active {
    background-color: #2442d3;
    color: #fff;
}
.badge-info {
    color: #fff;
    background-color: #0c1436;
}

/* ------ Breadcrumb ------ */

.master-breadcrumb {
    background: linear-gradient(231deg, #D5DCFF -0.57%, #F6F8FD 55.12%);
    background: #F6F8FD;
}
.master-breadcrumb .container {
    width: clamp(320px,90vw,1678px);
    margin-inline:auto;
    max-width: 100%;
}
.breadcrumb {
    background: #F6F8FD;
}

/********** Body **********/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none
}
ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-family: "Poppins", sans-serif;
}
body {
    height: 100%;
    min-height: 100%;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    /*font-size: 1.6rem;*/
    font-family: "Poppins",sans-serif;
    color: #383838;
    position: relative;
    background-color: #fff;
    -ms-touch-action: pan-y;
    overflow-x: hidden;
    outline: none
}
a {
    color: #2442d3;
    text-decoration: none;
    font-size: inherit;
    line-height: 160%;
    font-family: "Poppins",sans-serif
}
a:hover {
    color: #2442d3;
}
p {
    font-size: clamp(14px,1.2vw,16px);
    font-weight: 400;
    line-height: 150%;
    padding: 0;
}

/********** Buttons **********/

.button-secondary,.button-white,.button-border-white {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    justify-content: center;
    border-radius: 100px;
    text-align: center;
    flex-shrink: 0;
    border: none;
    outline: none;
    cursor: pointer
}
.button-secondary img,.button-white img,.button-border-white img {
    height: 20px
}
.button-secondary {
    background: #0c1436;
    color: #fff
}
.button-secondary:hover {
    background: rgb(25.9090909091,43.1818181818,116.5909090909)
}
.button-white {
    background: #fff;
    color: #010101
}
.button-border-white {
    border: #fff 1px solid;
    color: #fff;
    background: rgba(0,0,0,0)
}
.button-xl {
    padding: clamp(1.6rem,2vw,2.3rem) clamp(3.2rem,3vw,7.7rem);
    font-size: clamp(1rem, 1vw, 1.25rem);
    font-style: normal;
    font-weight: 600;
    line-height: 110%
}
.button-sm {
    padding: clamp(0.625rem, 2vw, 0.8125rem) clamp(1rem, 3vw, 1.6875rem);
    font-size: clamp(0.875rem, 1vw, 1rem);
    font-style: normal;
    font-weight: 600;
    line-height: 110%
}

.btn-primary, .btn-warning {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    justify-content: center;
    border-radius: 100px !important;
    text-align: center;
    flex-shrink: 0;
    border: none;
    outline: none;
    cursor: pointer;
    font-size: clamp(0.875rem, 1vw, 1rem);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    background: #2442d3;
    color: #fff;
    box-shadow: none !important;
}
.btn-primary:hover, .btn-warning:hover {
    color: #fff;
    background: rgb(95.6821862348,118.3340080972,227.8178137652);
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
    color: #fff;
    background: rgb(95.6821862348,118.3340080972,227.8178137652);
    border: none;
}
.btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, .show>.btn-warning.dropdown-toggle {
    color: #fff;
    background: rgb(95.6821862348,118.3340080972,227.8178137652);
    border: none;
}
.btn-success {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    justify-content: center;
    border-radius: 100px !important;
    text-align: center;
    flex-shrink: 0;
    border: none;
    outline: none;
    cursor: pointer;
    font-size: clamp(0.875rem, 1vw, 1rem);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    background: #0c1436;
    color: #fff;
    box-shadow: none !important;
}
.btn-success:hover, .btn-success:focus {
    background: rgb(25.9090909091,43.1818181818,116.5909090909);
}
.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show>.btn-success.dropdown-toggle {
    color: #fff;
    background: rgb(25.9090909091,43.1818181818,116.5909090909);
    border: none;
}
.btn-success.disabled, .btn-success:disabled {
    color: #fff;
    background-color: #0c1436;
    border: none;
}

.btn-outline-primary {
    color: #0c1436;
    border-color: #0c1436;
    border-radius: 50px;
    box-shadow: none !important;
}
.btn-outline-primary:hover, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: #0c1436;
    border-color: #0c1436;
    box-shadow: none !important;
}
.btn-default:hover {
    color: #fff;
    background-color: #0c1436;
    border-color: #0c1436;
}
.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open>.dropdown-toggle.btn-default.focus {
    color: #fff;
    background-color: #0c1436;
    border-color: #0c1436;
    box-shadow: none !important;
}

/********** Home Domain Search **********/

.home-domain-search {
    background: radial-gradient(296.04% 118.07% at 100% 75.5%, #010207 16.66%, #112BAC 35.62%, #4A5799 50.1%, #192E9A 74.58%, #000 87.29%);
}
.home-domain-search h2 {
    color: #fff;
    font-family: "Poppins", sans-serif;
    font-size: clamp(2.4rem, 4vw, 5.5rem); /* reduced max */
    font-weight: 500;
    line-height: 115%;
    margin-top: clamp(20px, 2vw, 30px) !important;
    margin-bottom: clamp(20px, 2vw, 30px) !important;
    text-align: center;
}
.home-domain-search h2 span {
    color: #8994c9;
}
.home-domain-search a.btn-link {
    color: #fff;
}
.home-domain-search a.btn-link:hover {
    color: #8994c9;
}

/********** Homepage **********/

section#main-body {
    padding: 70px 0;
}
.primary-bg-color {
    background: #F6F8FD;
}
.home-domain-search .input-group-wrapper .btn {
    border-radius: 50px !important;
}
.action-icon-btns a {
    padding: 30px 0;
}
.card-accent-teal, .card-accent-pomegranate, .card-accent-sun-flower, .card-accent-asbestos, .card-accent-green {
    border: 1px solid #B9BEF4;
}
.card-accent-midnight-blue {
    border: 1px solid #B9BEF4;
}
.action-icon-btns a .ico-container i {
    color: #2442d3;
}

/*new-edits*/

.action-icon-btns a {
   
    border-radius: 0px !important;
}

/*header*/

header.header .main-navbar-wrapper .navbar-collapse {
    padding: 1.5rem 0rem !important;
}

/* Section Headings */

.browse-products,
.how-can-we-help,
.your-account {
    color: #0a0000;
    font-family: "Poppins", sans-serif;
    font-size: clamp(2.4rem, 4vw, 5.5rem); /* reduced max */
    font-weight: 500;
    line-height: 115%;
    margin-top: clamp(20px, 2vw, 30px) !important;
    margin-bottom: clamp(20px, 2vw, 30px) !important;
    text-align: center;
}

.browse-products span,
.how-can-we-help span,
.your-account span {
    color: #9295a7;
}

/* Card Button */
.card-columns.home a {
    display: flex;
    padding: clamp(12px, 1.2vw, 15px) clamp(18px, 2vw, 24px);
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    background: #2442D3;
    color: #FFF;
    text-align: center;
    font-family: Poppins;
    font-size: clamp(14px, 1vw, 18px);
    font-weight: 600;
    line-height: 110%;
    border: none;
    margin-top: clamp(30px, 4vw, 60px);
}

/* Card Text */
.card-columns.home p {
    color: #8A8B8C;
    text-align: center;
    font-family: Poppins;
    /*font-size: clamp(14px, 1vw, 16px);*/
    font-weight: 400;
    line-height: 180%;
}

/* Card Heading */
.card-columns.home h3 {
    color: #000;
    text-align: center;
    font-family: Poppins;
    font-size: clamp(20px, 1.5vw + 1rem, 24px);
    font-weight: 500;
    line-height: 118%;
}

/* Card */
.card-body {
    border: 1px solid #B9BEF4;
    padding: clamp(20px, 3vw, 40px);
}

@media (min-width: 991px) {
    .card-columns.home {
      display: flex;
      gap: 1rem;
    }

    .card-columns.home .card {
      flex: 1;
      display: flex;
    }

    .card-columns.home .card-body {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }
}

/* Tablet */
@media (max-width: 1024px) {
    .card-columns.home h3 {
        font-size: 26px;
    }
}

/* Mobile */
@media (max-width: 768px) {

    .home-domain-search h2,
    .browse-products,
    .how-can-we-help,
    .your-account {
        font-size: clamp(2rem, 6vw, 3.2rem);
    }

    .card-columns.home a {
        width: 100%;
        margin-top: 30px;
    }

    .card-columns.home p {
        font-size: 14px;
        line-height: 170%;
    }

    .card-columns.home h3 {
        font-size: 22px;
    }
}

/* Small Mobile */
@media (max-width: 480px) {
    .card-body {
        padding: 20px;
    }
}

/********** Register page **********/

#registration .field-icon i {
    color: #0c1436;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
    color: #fff;
    background-color: #0c1436;
    border-color: #0c1436;
}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success:hover, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success:active {
    color: #fff;
    background-color: #0c1436;
    border-color: #0c1436;
}

/********** Login page **********/

.login-form .card {
    border-radius: 20px;
}
.login-form .input-group-text, .login-form .btn-default {
    color: #0c1436;
}

/********** Lost Password Reset page **********/

form[action="/password/reset"] .input-group-text {
    color: #0c1436;
}

/********** Change Password page **********/

.using-password-strength .btn-default {
    border-radius: 20px;
}

/********** Hosting page **********/

.sidebar .list-group-item.active, .sidebar .list-group-item.active:focus, .sidebar .list-group-item.active:hover {
    background-color: #2442d3;
    border-color: #2442d3;
}
.cart-sidebar .list-group {
    font-size: 15px;
}
#order-standard_cart .products .product header {
    background: linear-gradient(90deg, rgba(160, 174, 242, 0.37) 0%, rgba(255, 255, 255, 0) 100%) !important;
}
#order-standard_cart .products .product header span {
    font-size: 1.4em !important;
    font-weight: 600;
}
#order-standard_cart .product .product-desc p#product1-description {
    font-size: 14px;
}
#order-standard_cart .products .product div.product-pricing span.price,
#order-standard_cart .products .product div.product-pricing small, 
#order-standard_cart .products .product div.product-pricing .small {
    font-size: 14px;
    font-weight: 600;
}

/********** Choose a Domain page **********/

#order-standard_cart .domain-selection-options .option {
    padding: 12px 20px !important;
    background-color: #fff !important;
}
#order-standard_cart label {
    font-weight: 400 !important;
    font-size: 16px !important;
}
.icheckbox_square-blue, .iradio_square-blue {
    background: none !important;
}
.icheckbox_square-blue::before, .iradio_square-blue::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 0;
    width: 20px;
    height: 20px;
    background-image: url("/templates/lyrahosting2/images/tick-circle.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/********** Transfer Domain page **********/

.list-group-item.active {
    background-color: #0c1436;
    border-color: #0c1436;
}
.list-group-item-action:focus, .list-group-item-action:hover {
    color: #fff;
    background-color: #0c1436;
    opacity: .8;
}
.card-header {
    background: linear-gradient(90deg, rgba(160, 174, 242, 0.37) 0%, rgba(255, 255, 255, 0) 100%);
}
.card-footer {
    background: linear-gradient(90deg, rgba(160, 174, 242, 0.37) 0%, rgba(255, 255, 255, 0) 100%);
}

/********** Register Domain page **********/

.text-warning, .text-primary {
    color: #2442d3 !important;
}
.domain-checker-container {
    background: radial-gradient(296.04% 118.07% at 100% 75.5%, #010207 16.66%, #112BAC 35.62%, #4A5799 50.1%, #192E9A 74.58%, #000 87.29%) !important;
}
.btn.btn-primary.domain-check-availability {
    border-radius: .3rem !important;
}
.domain-pricing .tld-pricing-header div:nth-child(odd) {
    border-color: #2442d3 !important;
}
.domain-promo-box .fa-server:before {
    color: #0c1436;
}
.domain-promo-box .fa-globe:before {
    color: #0c1436;
}

/********** Domain Pricing page **********/

.badge-secondary {
    color: #fff;
    background-color: #0c1436;
}
a.badge-secondary:focus, a.badge-secondary:hover {
    color: #fff;
    background-color: #4854F6;
}
.domain-pricing .tld-filters .badge-secondary {
    border-radius: 20px;
    padding: 10px 12px;
}

/********** Cart page **********/

#order-standard_cart .view-cart-items-header { 
    background-color: #2442d3 !important;
    color: #fff;
}
#order-standard_cart .view-cart-items {
    border-bottom: 2px solid #2442d3 !important;
}
#order-standard_cart .order-summary {
    background-color: #2442d3 !important;
    border-bottom: 3px solid #2442d3 !important;
    color: #000;
}
#order-standard_cart .summary-container {
    background-color: #fff !important;
}
.view-cart-tabs .tab-content .form-group.prepend-icon  .field-icon .fa-ticket-alt {
    color: #0c1436 !important;
}

/********** knowledgebase page **********/

.kb-search .btn-primary {
    border-radius: .3rem !important;
}
 
/********** Clientarea page **********/

.tiles .tile i {
    color: #2442d3;
}
.tiles .tile:hover i {
    color: #2442d3;
}
.client-home-cards .card .input-group-btn.input-group-append .btn.btn-success  {
    border-radius: .25rem !important;
}
.client-home-cards .card-header .card-title .bg-color-gold, 
.client-home-cards .card-header .card-title .bg-color-blue, 
.client-home-cards .card-header .card-title .bg-color-asbestos {
    background: #0c1436;
    color: #fff;
    padding: 5px 10px;
    font-size: 14px;
    border-radius: 20px;
}
.client-home-cards .card-header .btn:hover {
    background: rgb(25.9090909091, 43.1818181818, 116.5909090909);
}
.client-home-cards .card-header .card-title .fa-cube, 
.client-home-cards .card-header .card-title .fa-comments,
.client-home-cards .card-header .card-title .fa-globe,
.client-home-cards .card-header .card-title .fa-newspaper {
    color: #2442d3;
}
.card-sidebar .card-header .card-title .fa-user,
.card-sidebar .card-header .card-title .fa-folder,
.card-sidebar .card-header .card-title .fa-bookmark {
    color: #2442d3;
}
.client-home-cards .card-header .card-title .btn-default.active.focus, .client-home-cards .card-header .card-title .btn-default:active:focus, 
.client-home-cards .card-header .card-title .btn-default:active:hover,
.client-home-cards .card-header .card-title .btn-default.active, .client-home-cards .card-header .card-title .btn-default:active {
    color: #fff;
    background: #0c1436;
    box-shadow: none;
}
.bg-color-blue, .bg-color-green, .bg-color-red, .bg-color-gold, .card-accent-gold, .card-accent-blue, .card-accent-emerald {
    border-top: 3px solid #2442d3;
}

/* ------ Product Addons page ------ */
#noAddons.alert-warning {
    color: #fff;
    background-color: #2442d3;
    border-color: #2442d3;
}
/*#noAddons ~ p .btn-default {
    background: #2442d3;
    transition: all .3s ease-in-out;
    color: #fff;
    animation: gradientMove 2s linear infinite;
    text-decoration: none;
    border-color: transparent;
    border-radius: 20px;
    box-shadow: none !important;
}
#noAddons ~ p .btn-default:hover {
    background: rgb(95.6821862348, 118.3340080972, 227.8178137652);
}*/

/********** Submit Tickets page **********/

.alert-info {
    color: #fff;
    background-color: rgb(25.9090909091,43.1818181818,116.5909090909);
    border-color: #0c1436;
}

/********** Network Status page **********/

.alert-success {
    color: #fff;
    background-color: rgb(25.9090909091,43.1818181818,116.5909090909);
    border-color: #0c1436;
}

/********** Configure page **********/

#order-standard_cart #frmConfigureProduct .secondary-cart-body .product-info {
    background-color: #fff;
}
#order-standard_cart #frmConfigureProduct .secondary-cart-sidebar .summary-container {
    background-color: #fff;
}
#order-standard_cart .summary-container {
    font-size: 14px !important;
}
#order-standard_cart #frmConfigureProduct .secondary-cart-body .alert-warning.info-text-sm {
    font-size: 14px;
}
.alert-warning {
    color: #fff;
    background-color: #0c1436;
    border-color: #0c1436;
}
.alert-warning .alert-link {
    color: hsla(0,0%,100%,.8);
}

/********** Manage Services page **********/

.dataTables_wrapper table.table-list thead th.sorting_asc, .dataTables_wrapper table.table-list thead th.sorting_desc {
    background: linear-gradient(90deg, rgba(160, 174, 242, 0.37) 0%, rgba(255, 255, 255, 0) 100%);
}

/********** Account Details page **********/

form[action="?action=details"] .form-group.text-center .btn-default {
    border-radius: 20px;
}

/********** User Management page **********/

.label-info {
    background-color: rgb(25.9090909091, 43.1818181818, 116.5909090909);
}
.btn-danger.disabled, .btn-danger:disabled {
    color: #fff;
    background-color: #0c1436;
    border-color: #0c1436;
}

/********** Email History page **********/

.btn-info {
    color:  #fff;
    background-color: #0c1436;
    border-color: #0c1436;
}
.btn-info.focus, .btn-info:focus, .btn-info:hover {
    color: #fff;
    background-color: rgb(25.9090909091, 43.1818181818, 116.5909090909);
    border-color: #0c1436;
    box-shadow: none !important;
}
.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show>.btn-info.dropdown-toggle {
    color: #fff;
    background-color: rgb(25.9090909091, 43.1818181818, 116.5909090909);
    border-color: #0c1436;
    box-shadow: none !important;
}
.page-item.active .page-link, .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    color: #fff;
    background-color: rgb(25.9090909091, 43.1818181818, 116.5909090909);
    border-color: #0c1436;
}