:root {
  	color-scheme: light dark;
}

a {
	text-decoration: none !important;
}

html {
        scroll-padding-top: 80px;
}

body {
	font-family: 'Roboto', sans-serif !important;
}

.fs-xs {
	font-size: .8rem;
}

.h2-ff {
	font-family: "Source Serif Pro", serif !important;
}

.primary-bg-color-hwn {
        background-color: var(--background-color) !important;
        color: var(--color) !important;
}

body img {
	max-width: 100%;
}

.btn-return-to-admin {
	z-index: 10000;
}

.grecaptcha-badge {
        z-index: 1000;
}

.logo-desktop {
        background: var(--background-image);
	width: 212px;
	height: 60px;
	background-repeat: no-repeat;
}

.logo-tablet {
        background: var(--background-image);
	width: 127px;
	height: 36px;
	background-repeat: no-repeat;
}

.logo-footer {
	background: var(--background-image);
	width: 127px;
	height: 36px;
	background-repeat: no-repeat;
}

header.header {
	background-color: var(--background-color);
}

/* START CUSTOM */




.hw-youtube-video {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; 
  height: 0;
  vertical-align: top;
}
.hw-youtube-video iframe {
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}







.card-shadow:hover {
        box-shadow: var(--box-shadow);
}

.red {
	color: #dc3545;
}

.purple {
	color: #ac18b4 !important;
}

.bg-purple {
	background-color: #ac18b4;
}

/* END CUSTOM */

/* BUTTONS START */

.button {

        cursor: pointer;
	border: none;
	font-weight: 400;
}

.button-xs {
        padding: 6px 12px;
}

.button-sm {
	padding: 10px 20px;
}

.button-lg {
	padding: 15px 25px;
}

/*
.button-red {
        background-color: var(--background-color);
        color: var(--color);
        text-decoration: var(--text-decoration);
}

.button-red:hover {
        background-color: var(--background-color);
        color: var(--color);
        text-decoration: var(--text-decoration);
}
*/

.button-red {
        background-color: #dc3545;
        color: var(--light);
	border: 1px solid transparent;
        text-decoration: none;
}

.button-red:hover {
        background-color: transparent;
        color: #dc3545;
	border: 1px solid #dc3545;
        text-decoration: none;
}

.button-black {
        background-color: var(--bs-gray-900);
        color: var(--light);
        border: 1px solid transparent;
        text-decoration: none;
}

.button-black:hover {
        background-color: transparent;
        color: var(--bs-gray-900);
        border: 1px solid var(--bs-gray-900);
        text-decoration: none;
}


/*
.button-black {
        background-color: var(--background-color);
        color: var(--color);
        text-decoration: var(--text-decoration);
}

.button-black:hover {
        background-color: var(--background-color);
        color: var(--color);
        text-decoration: var(--text-decoration);
}
*/

.button-purple {
        background-color: #ac18b4;
        color: var(--light);
	border: 1px solid transparent;
        text-decoration: none;
}

.button-purple:hover {
        background-color: transparent;
        color: #ac18b4;
	border: 1px solid #ac18b4;
        text-decoration: none;
}

/* BUTTONS END */

/* HEADERS START */

#header {
  	background-color: var(--background-color);
}

#header i {
        color: var(--color) !important;
        font-weight: var(--font-weight) !important;
}

header.header .navbar a, .navbar i {
        color: var(--color);
	font-weight: 600;
}

header.header .navbar a:hover, .navbar i:hover {
        color: var(--color);
}



.modal-hwn {
  background-color: #eee;
  width: 200px;
  height: 100px;
  border: 1px dotted black;
  overflow-y: scroll; /* Add the ability to scroll */
}

/* Hide scrollbar for Chrome, Safari and Opera */
.modal-hwn::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.modal-hwn {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

@media (min-width: 1200px) {
	.modal-xl {
    		max-width: 1140px !important;
	}
}

/* HEADERS END */

/* FOOTER START */

footer#footer {
	background: var(--background);
}

#homepage-email-list {
        background-color: var(--background-color);
}

#homepage-email-list p {
        color: var(--color);
        margin-top: 0;
        margin-bottom: 0;
}

#homepage-email-list a {
        color: var(--color);
        margin-top: 0;
        margin-bottom: 0;
        text-decoration: none;
}

#homepage-email-list a:hover {
        color: var(--color);
        text-decoration: none;
}

#homepage-email-list input {
        box-shadow: none;
	border: none;
}

#footer-menu-tablet-desktop {
	font-weight: 600;
}

#footer-menu-tablet-desktop a.nav-link {
	color: var(--color);
	opacity: .8;
	text-decoration: none;
	padding-left: 0;
	padding-right: 0;
}

#footer-menu-tablet-desktop a.nav-link:hover {
	color: var(--color) !important;
	opacity: 1 !important;
	text-decoration: underline !important;
}

#footer-menu-tablet-desktop span {
        color: var(--color) !important;
}

#footer-menu-mobile .accordion-item {
        border: 0 !important;
}

#footer-logo-language-social a {
	color: var(--color);
	box-shadow: none;
}

#footer-logo-language-social a:hover {
        color: var(--color);
}

#footer hr {
	color: var(--color);
        border-bottom: var(--border-bottom);
}

#footer-legal a {
	color: var(--color);
}

#footer-legal a:hover {
        color: var(--color);
	text-decoration: underline !important;
}

#footer-legal p {
	color: var(--color);
}

#si-wrapper .silc-btn {     
 	left:12px !important;   
	right: inherit !important;
	bottom: 15px !important;
}

#siWidget-chat {
	left: 12px !important;
	max-width: 100% !important;
	width: 360px !important;
}

/* FOOTER END */


/*  HOMEPAGE SEARCH BAR START */

#frmDomainHomepage .search {
        position: relative;
}

#frmDomainHomepage .search input {
        height: 60px;
        border: var(--border) !important;
        border-radius: 0;
	background-color: var(--background-color) !important;
}

#frmDomainHomepage .search input:focus {
        box-shadow: var(--box-shadow);
        border: var(--border) !important;
        border-radius: var(--border-radius) !important;
}

#frmDomainHomepage .search label {
        color: var(--color);
        opacity: var(--opacity);
}

#frmDomainHomepage .search input:focus::placeholder {
	color: var(--color);
}

#frmDomainHomepage .search input:focus::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: var(--color);
}

#frmDomainHomepage .search input:focus::-moz-placeholder { /* Firefox 19+ */
	color: var(--color);
}

#frmDomainHomepage .search input:focus:-ms-input-placeholder { /* IE 10+ */
	color: var(--color);
}

#frmDomainHomepage .search input:focus:-moz-placeholder { /* Firefox 18- */
	color: var(--color);
}

#frmDomainHomepage .search .fa-search {
        position: absolute;
        top: 20px;
        left: 16px;
}

#frmDomainHomepage .search button {
        position: absolute;
        top: 5px;
        right: 5px;
        height: 50px;
        min-width: 50px;
        background-color: var(--background-color);
	color: var(--color);
        border: var(--border);
        border-radius: 0;
        box-shadow: none;
	padding-left: 20px;
	padding-right: 20px;
}

#frmDomainHomepage .search button:hover {
        border: var(--border);
        background-color: var(--background-color);
	color: var(--color);
	opacity: var(--opacity);
}

/* HOMEPAGE SEARCH BAR END */

/* MENUS START */

.collapseMainMenuHeader {
        z-index: 10000;
        min-width: 100%;
}

.collapseMainMenuHeader .card {
	background-color: var(--background-color) !important;
	color: var(--color) !important;
}

.collapseMainMenuHeader a {
       	color: var(--color);
        text-decoration: none;
}

.collapseMainMenuHeader a:hover {
        color: var(--color);
        text-decoration: underline;
}

.offcanvas {
	background-color: var(--background-color) !important;
	color: var(--color) !important;
}

.btn-close {
	background: var(--background) !important;
	box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
	box-shadow: none !important;
	background-color: var(--background-color) !important;
	color: var(--color) !important;
}

.accordion-button.collapsed {
	box-shadow: none !important;
	background-color: var(--background-color) !important;
	color: var(--color) !important;
}

.accordion-body {
	background-color: var(--background-color) !important;
}

.accordion-item {
	background-color: var(--background-color) !important;
	border-bottom: var(--border-bottom) !important;
}

.accordion-button::after {
	background-image: var(--background-image) !important;
}

.btn-close, .btn-close:hover, .btn-close:active, .btn-close:focus {
	background: var(--background) !important;
	box-shadow: none !important;
	outline: none !important;
	opacity: 1 !important;
}

.accordion-body a {
        color: var(--color) !important;
        text-decoration: none;
}

.accordion-body a:hover, a:active, a:focus {
        color: var(--color) !important;
        text-decoration: underline;
}

.offcanvas a {
        color: var(--color) !important;
        text-decoration: none;
}

.offcanvas a:hover, a:active, a:focus {
        color: var(--color) !important;
        text-decoration: underline;
}

.offcanvas .card-body {
	background-color: var(--background-color) !important;
	color: var(--color) !important;
}

/* MENUS END */


/* BREADCRUMB START */

.master-breadcrumb a {
        color: var(--color) !important;
        text-decoration: none;
}

.master-breadcrumb a:hover, a:active, a:focus {
        color: var(--color) !important;
        text-decoration: underline;
}

.master-breadcrumb, .master-breadcrumb .breadcrumb {
        background-color: var(--background-color) !important;
}

/* BREADCRUNB END */


/* HOMEPAGE BANNER START */
@media only all and (min-width: 2475px) {
	#homepage-banner .min-height-hw {
		min-height: 800px;
	}
}

@media only all and (max-width: 992px) {
        .homepage-header-bg {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (min-width: 993px) {
        .homepage-header-bg {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

#homepage-banner .bg-red {
        background-image: var(--background-image) !important;
}

#homepage-banner .cover-image {
	background-image: var(--background-image) !important;
	margin: 0;
}

#homepage-banner .cover-image img {
        max-width: 100%;
}

#link-boxes a {
        color: var(--color);
	background-color: var(--background-color);
        text-decoration: none;
}

#link-boxes a:hover {
        color: var(--color);
        background-color: var(--background-color);
}

/* Hositng Section */
#homepage-hosting {
        color: var(--color);
}

@media only all and (max-width: 1919px) {
        .homepage-hosting-bg {
		color: var(--color);
                background: var(--background);
                display: flex;
        	-webkit-background-size: cover;
        	-moz-background-size: cover;
        	-o-background-size: cover;
        	background-size: cover;
        }
}

@media only all and (min-width: 1920px) {
	.homepage-hosting-bg {
		color: var(--color);
        	background: var(--background);
        	display: flex;
        	-webkit-background-size: cover;
        	-moz-background-size: cover;
        	-o-background-size: cover;
        	background-size: cover;
	}
}


.homepage-hosting-boxes-bg i {
        color: var(--color);
        font-size: 60px;
}

.homepage-hosting-boxes-bg {
        background: var(--background);
}

#homepage-hosting-benefits .card {
        color: var(--color);
        background-color: var(--background-color);
	border: var(--border);
}

#homepage-hosting-benefits .card-title {
        color: var(--color);
}

#homepage-hosting-benefits .card-text {
	color: var(--color);
}

#homepage-hosting-benefits i {
        font-size: 60px;
        color: var(--color);
}

#homepage-why-hotwire-networks {
        background-color: var(--background-color);
	color: var(--color);
}

#homepage-email-websites p {
	color: var(--color);
}

#homepage-email-websites h2 {
	color: var(--color);
}

#homepage-knowledgebase {
	color: var(--color);
        background: var(--background);
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
}

#homepage-knowledgebase a {
        color: var(--color);
        text-decoration: none;
}

#homepage-knowledgebase a:hover {
        color: var(--color);
        text-decoration: underline;
}

#homepage-knowledgebase input, input:active, input:focus {
	box-shadow: none;
	border: none;
}


/* HOMEPAGE BANNER END */


/* PAGE SUBMENU START */

#hw-page-submenu .nav-link {
        color: var(--color);
        opacity: var(--opacity);
        border-bottom: var(--border-bottom);
        font-weight: var(--font-weight);
	margin-top: 4px !important;
}

#hw-page-submenu .nav-link.active {
        color: (--color);
        border-bottom: var(--border-bottom);
}

#hw-page-submenu nav {
        background-color: var(--background-color);
        border-bottom: var(--border-bottom);
}

#hw-page-submenu .card .card-body {
	color: var(--color);
	background-color: var(--background-color);
}

#hw-page-submenu .card img {
	opacity: var(--opacity);
}

/* PAGE SUBMENU END */


/* PAGE TABMENU START */

#hw-page-nav-tabs {
        border-bottom: none !important;
}

#hw-page-nav-tabs .nav-tabs {
	border-bottom: none !important; 
}

#hw-page-nav-tabs .nav-link {
        color: var(--color);
	background-color: var(--background-color);
	border: var(--border);
        border-bottom: var(--border-bottom);
        border-top: var(--border-top);
	border-top-left-radius: 0;
	border-top-right-radius: 0;
        font-weight: 600;
}

#hw-page-nav-tabs .nav-link.active {
        color: var(--color);
        background-color: var(--background-color);
        border: var(--border);
        border-top: var(--border-top);
	border-bottom: var(--border-bottom);
}

#hw-page-nav-tabs .nav-link .hw-nav-top-border {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 4px;
        background: none;
}

#hw-page-nav-tabs .nav-link.active .hw-nav-top-border {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: var(--bs-danger);	
}

#hw-price-table th {
	border-top: none !important;
	padding-top: 3rem;
	padding-bottom: 1rem;
}

#nav-tabContent {
	margin-top: -1px;
	border-top: 2px solid var(--bs-gray-300);
}

/* PAGE TABMENU END */

#hw-price-table {
        color: var(--color);
}

#hw-price-table img {
	opacity: 1;
}

#hw-price-table i {
	color: var(--color);
}

/* WEBSITES START */

@media only all and (min-width: 993px) {
        #websites {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
		min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #websites {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #websites p {
                color: var(--color);
        }
}

/* WEBSITES END */


/* WEBSITES DESIGN START */

@media only all and (min-width: 993px) {
        #hw-websites-design {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
		min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-design {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-design p {
                color: var(--color);
        }
}

/* WEBSITES DESIGN END */


/* WEBSITES WORDPRESS START */

@media only all and (min-width: 993px) {
        #hw-websites-wordpress {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
		min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-wordpress {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-wordpress p {
                color: var(--color);
        }
}

/* WEBSITES WORDPRESS END */


/* WEBSITES MARKETGOO SEO TOOLS START */

@media only all and (min-width: 993px) {
        #hw-websites-seo {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
		min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-seo {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM OVERVIEW START */

@media only all and (min-width: 993px) {
        #hw-websites-custom {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
		min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM OVERVIEW END */


/* WEBSITES CUSTOM WORDPRESS START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-wordpress {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-wordpress {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-wordpress p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM WORDPRESS END */


/* WEBSITES CUSTOM WOOCOMMERCE START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-woocommerce {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-woocommerce {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-woocommerce p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM WOOCOMMERCE END */


/* WEBSITES CUSTOM SHOPIFY START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-shopify {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-shopify {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-shopify p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM SHOPIFY END */


/* WEBSITES CUSTOM ECOMMERCE START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-ecommerce {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-ecommerce {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-ecommerce p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM ECOMMERCE END */



/* WEBSITES CUSTOM CMS START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-cms {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-cms {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-cms p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM CMS END */


/* WEBSITES CUSTOM CMS START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-crm {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-crm {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-crm p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM CMS END */


/* WEBSITES CUSTOM SEO START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-seo {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-seo {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-seo p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM SEO END */



/* WEBSITES CUSTOM RESPONSIVE START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-responsive {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-responsive {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-responsive p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM RESPONSIVE END */



/* WEBSITES CUSTOM PORTFOLIO START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-portfolio {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-portfolio {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-portfolio p {
                color: var(--color);
        }
}

.portfolio-container {
	position: relative;
  	width: 100%;
}

.portfolio-image {
  	display: block;
  	width: 100%;
  	height: auto;
}

.portfolio-overlay {
  	position: absolute;
  	bottom: 0;
  	left: 100%;
  	right: 0;
  	background-color: #008CBA;
  	overflow: hidden;
  	width: 0;
  	height: 100%;
  	transition: .5s ease;
}

.portfolio-container:hover .portfolio-overlay {
  	width: 100%;
  	left: 0;
}

.portfolio-text {
  	color: var(--light);
  	position: absolute;
	text-align: center;
  	top: 50%;
  	left: 50%;
  	-webkit-transform: translate(-50%, -50%);
  	-ms-transform: translate(-50%, -50%);
  	transform: translate(-50%, -50%);
  	white-space: nowrap;
}

/* WEBSITES CUSTOM PORTFOLIO END */



/* WEBSITES CUSTOM QUOTE START */

@media only all and (min-width: 993px) {
        #hw-websites-custom-quote {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-websites-custom-quote {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}	

@media only all and (max-width: 992px) {
        #hw-websites-custom-quote p {
                color: var(--color);
        }
}

/* WEBSITES CUSTOM QUOTE END */


/* HOSTING PLANS BOXES START */

#hw-hosting-plans .hw-card {
	background-color: var(--background-color);
	border: var(--border);
}

#hw-hosting-plans .hw-card-header {
	background-color: var(--background-color);
	color: var(--color);
	border: var(--border);
}

#hw-hosting-plans .hw-card-header-featured {
	background-color: var(--background-color);
	color: var(--color);
	
}

#hw-hosting-plans .hw-card-body {
	background-color: var(--background-color);
}

#hw-hosting-plans .hw-card-body-featured {
	background-color: var(--background-color);
}

/* HOSTING PLANS BOXES END  */


/* HOSTING FEATURES ROW START */

#hw-hosting-features {
	background-color: var(--background-color);
}

/* HOSTING FEATURES ROW END */


/* HOSTING OVERVIEW START */

@media only all and (min-width: 993px) {
        #hw-hosting-overview {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-overview {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-overview p {
                color: var(--color);
        }
}

/* HOSTING OVERVIEW END */


/* SHARED HOSTING START */

@media only all and (min-width: 993px) {
        #hw-hosting-shared {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-shared {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-shared p {
                color: var(--color);
        }
}

/* SHARED HOSTING END */


/* WORDPRESS HOSTING START */

@media only all and (min-width: 993px) {
        #hw-hosting-wordpress {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-wordpress {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-wordpress p {
                color: var(--color);
        }
}

/* WORDPRESS HOSTING END */


/* ECOMMERCE HOSTING START */

@media only all and (min-width: 993px) {
        #hw-hosting-ecommerce {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-ecommerce {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-ecommerce p {
                color: var(--color);
        }
}

/* WORDPRESS ECOMMERCE END */

/* VPS HOSTING START */

@media only all and (min-width: 993px) {
        #hw-hosting-vps {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-vps {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-vps p {
                color: var(--color);
        }
}

/* VPS HOSTING END */

/* DEDICATED HOSTING START */

@media only all and (min-width: 993px) {
        #hw-hosting-dedicated {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-dedicated {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-dedicated p {
                color: var(--color);
        }
}

/* DEDICATED HOSTING END */



/* DEDICATED LINUX HOSTING START */

@media only all and (min-width: 993px) {
        #hw-hosting-dedicated-linux {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-dedicated-linux {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-dedicated-linux p {
                color: var(--color);
        }
}

/* DEDICATED LINUX HOSTING END */


/* DEDICATED LINUX HOSTING START */

@media only all and (min-width: 993px) {
        #hw-hosting-dedicated-windows {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-dedicated-windows {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-dedicated-windows p {
                color: var(--color);
        }
}

/* DEDICATED LINUX HOSTING END */


/* HOSTING ADDONS START */

@media only all and (min-width: 993px) {
        #hw-hosting-addons {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-addons {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-hosting-addons p {
                color: var(--color);
        }
}

/* HOSTING ADDONS END */



/* SUPPORT OVERVIEW START */

@media only all and (min-width: 993px) {
        #hw-support {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-support {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-support p {
                color: var(--color);
        }
}

/* SUPPORT OVERVIEW END */



/* ABOUT US START */

@media only all and (min-width: 993px) {
        #hw-about-us {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-about-us {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-about-us p {
                color: var(--color);
        }
}

/* ABOUT US END */



/* AFFILIATES PROGRAM US START */

@media only all and (min-width: 993px) {
        #hw-programs-affiliates {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 160px;
                padding-bottom: 160px;
                min-height: 600px;
        }
}

@media only all and (max-width: 992px) {
        #hw-programs-affiliates {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-programs-affiliates p {
                color: var(--color);
        }
}

/* AFFILIATES PROGRAM END */



/* HELP CENTER START */

@media only all and (min-width: 993px) {
        #hw-help-center {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
                padding-top: 40px;
                padding-bottom: 40px;
//                min-height: 400px;
        }
}

@media only all and (max-width: 992px) {
        #hw-help-center {
                color: var(--color);
                background: var(--background);
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
                margin-top: -20px;
        }
}

@media only all and (max-width: 992px) {
        #hw-help-center p {
                color: var(--color);
        }
}

/* HELP CENTER END */

#hw-knowledgebase a {
	color: var(--light);
	background-color: var(--bs-danger);
	text-decoration: none;
}

#hw-knowledgebase a:hover {
        color: var(--dark);
        background-color: var(--bs-gray-400);
}


/* HELP CENTER START */



/* HELP CENTER END */


/* SITEMAP START */

#hw-sitemap a {
	color: var(--color);
	opacity: .8;
	text-decoration: none;
}

#hw-sitemap a:hover {
	color: var(--red);
	text-decoration: underline !important;
}

/* SITEMAP END */


/* MODULES GARDEN OVERRIDES START */

.mg-wrapper .modal {
	z-index: 1055 !important;
}

/* MODULES GARDEN OVERRIDES END */



/* WHMCS OVERRIDES -- DO NOT EDIT BELOW THIS LINE */


#main-body .tiles {
	margin-left: 12px;
	margin-right: 12px;
}

.primary-content .btn-default {
    color: #333 !important;
    background-color: #fff !important;
    border-color: #ccc !important;
}

.primary-content .btn-default:hover {
    color: #333 !important;
    background-color: #e6e6e6 !important;
    border-color: #adadad !important;
}

.primary-content .btn-xs {
        padding: 1px 5px !important;
        font-size: 12px !important;
        line-height: 1.5 !important;
        border-radius: 3px !important;
}

.primary-content .bg-color-blue {
        background-color: #5bc0de !important;
        color: var(--light) !important;
}

.primary-content .bg-color-teal {
    background-color: #00aba9 !important;
        color: var(--light) !important;
}

.primary-content .bg-color-gold {
    background-color: #f0ad4e !important;
        color: var(--light) !important;
}

.primary-content .bg-color-asbestos {
        background-color: #7f8c8d !important;
        color: var(--light) !important;
}

/**
.primary-content .btn-success {
    color: #fff !important;
    background-color: #198754 !important;
    border-color: #198754 !important;
}

.primary-content .btn-success:hover {
    color: #fff !important;
    background-color: var(--red) !important;
    border-color: var(--red) !important;
}
**/

.card-accent-blue {
    border-top: 3px solid #5bc0de !important;
}

.card-accent-teal {
    border-top: 3px solid #00aba9 !important;
}

.card-accent-asbestos {
    border-top: 3px solid #7f8c8d !important;
}

.card-accent-emerald {
    border-top: 3px solid #2ecc71 !important;
}

.card-accent-gold {
    border-top: 3px solid #f0ad4e !important;
}

.primary-content select.form-control {
    padding: 0.375rem 2.25rem 0.375rem 0.75rem;
    -moz-padding-start: calc(0.75rem - 3px);
    font-weight: 400;
    line-height: 1.5;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.master-breadcrumb a.badge-secondary:focus, a.badge-secondary:hover {
    color: #fff !important;
    background-color: #545b62;
}

.master-breadcrumb a.badge-success:focus, a.badge-success:hover {
    color: #fff;
    background-color: #1e7e34;
}

.bootstrap-switch .bootstrap-switch-handle-on, 
.bootstrap-switch .bootstrap-switch-handle-off, 
.bootstrap-switch .bootstrap-switch-label {
    width: 38px !important;
}

#btnKnowledgebaseSearch, .btn-primary {
	background-color: #dc3545 !important;
    	border-color: #dc3545 !important;
}
