@import url(https://fast.fonts.net/lt/1.css?apiType=css&c=bb1e55c4-1a0c-4b59-97de-7f91b5bef6b8&fontids=1475496,1475508,1475520,1475532,1475544);

@font-face {
    font-family: "Avenir LT W01_35 Light1475496";
    src: url(../fonts/1475496/edefe737-dc78-4aa3-ad03-3c6f908330ed.eot?#iefix);
    src: url(../fonts/1475496/edefe737-dc78-4aa3-ad03-3c6f908330ed.eot?#iefix) format("eot"), url(../fonts/1475496/0078f486-8e52-42c0-ad81-3c8d3d43f48e.woff2) format("woff2"), url(../fonts/1475496/908c4810-64db-4b46-bb8e-823eb41f68c0.woff) format("woff"), url(../fonts/1475496/4577388c-510f-4366-addb-8b663bcc762a.ttf) format("truetype")
}

@font-face {
    font-family: "Avenir LT W01_45 Book1475508";
    src: url(../fonts/1475508/710789a0-1557-48a1-8cec-03d52d663d74.eot?#iefix);
    src: url(../fonts/1475508/710789a0-1557-48a1-8cec-03d52d663d74.eot?#iefix) format("eot"), url(../fonts/1475508/065a6b14-b2cc-446e-9428-271c570df0d9.woff2) format("woff2"), url(../fonts/1475508/65d75eb0-2601-4da5-a9a4-9ee67a470a59.woff) format("woff"), url(../fonts/1475508/c70e90bc-3c94-41dc-bf14-caa727c76301.ttf) format("truetype")
}

@font-face {
    font-family: "Avenir LT W01_55 Roman1475520";
    src: url(../fonts/1475520/57bf7902-79ee-4b31-a327-1bbf59a3d155.eot?#iefix);
    src: url(../fonts/1475520/57bf7902-79ee-4b31-a327-1bbf59a3d155.eot?#iefix) format("eot"), url(../fonts/1475520/b290e775-e0f9-4980-914b-a4c32a5e3e36.woff2) format("woff2"), url(../fonts/1475520/4b978f72-bb48-46c3-909a-2a8cd2f8819c.woff) format("woff"), url(../fonts/1475520/9bdf0737-f98c-477a-9365-ffc41b9d1285.ttf) format("truetype")
}

@font-face {
    font-family: "Avenir LT W01_65 Medium1475532";
    src: url(../fonts/1475532/e0542193-b2e6-4273-bc45-39d4dfd3c15b.eot?#iefix);
    src: url(../fonts/1475532/e0542193-b2e6-4273-bc45-39d4dfd3c15b.eot?#iefix) format("eot"), url(../fonts/1475532/17b90ef5-b63f-457b-a981-503bb7afe3c0.woff2) format("woff2"), url(../fonts/1475532/c9aeeabd-dd65-491d-b4be-3e0db9ae47a0.woff) format("woff"), url(../fonts/1475532/25f994de-d13f-4a5d-a82b-bf925a1e054d.ttf) format("truetype")
}

@font-face {
    font-family: "Avenir LT W01_85 Heavy1475544";
    src: url(../fonts/1475544/6af9989e-235b-4c75-8c08-a83bdaef3f66.eot?#iefix);
    src: url(../fonts/1475544/6af9989e-235b-4c75-8c08-a83bdaef3f66.eot?#iefix) format("eot"), url(../fonts/1475544/d513e15e-8f35-4129-ad05-481815e52625.woff2) format("woff2"), url(../fonts/1475544/61bd362e-7162-46bd-b67e-28f366c4afbe.woff) format("woff"), url(../fonts/1475544/ccd17c6b-e7ed-4b73-b0d2-76712a4ef46b.ttf) format("truetype")
}

* {
    margin: 0;
    padding: 0;
    font-family: "Avenir LT W01_45 Book1475508"
}

body, html {
    font-family: "Avenir LT W01_45 Book1475508" !important
}

a {
    color: #fe9901;
    text-decoration: none;
}

#font_color {
    color: #ffd03d;
}

a:hover {
    color: #ffc166;
    text-decoration: underline
}

.avenir {
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.fab {
    word-spacing: 40px;
    padding: 10px;
    font-size: 15px;
    width: 35px;
    text-align: center;
    text-decoration: none;
    color: orange;
    background-color: var(--bg-white);
    border-radius: 25px;
}

.fab:hover {
    word-spacing: 40px;
    padding: 10px;
    font-size: 15px;
    width: 35px;
    text-align: center;
    text-decoration: none;
    color: var(--text-white);
    background-color: var(--text-dull);
    border-radius: 25px;
}

.fa {
    color: orange;
    background-color: var(--bg-white);
    border-radius: 25px;
}

.fa:hover {
    color: var(--text-white);
    background-color: var(--text-dull);
    border-radius: 25px;
}

a.active, a:focus, a:hover, button.active, button:focus, button:hover {
    outline: 0;
}

button.btn:focus, input.form-control:focus {
    box-shadow: 0 0 0 .2rem rgba(254, 153, 1, .35);
    border-color: #E6BC6D;
}

body {
    background-color: #f2f2f2;
}

body.bg-grey {
    background-color: #f9f9f9 !important
}

nav.navbar.navbar-light {
    background-color: #E6BC6D;
    color: #fff
}

nav.navbar.navbar-transparent {
    color: var(--text-white);
}

nav.navbar a.navbar-brand img.img-logo {
    width: 85px;
}

.navbar-light .navbar-nav .nav-link {
    color: var(--text-white);
    font-size: 15px;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: var(--text-white);
    text-decoration: underline;
}

.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
    color: var(--text-white);
    font-family: "Avenir LT W01_65 Medium1475532";
}

nav.navbar .user-wrapper a#menu-dropdown {
    font-size: 14px;
    text-decoration: none;
    color: var(--text-black);
    position: relative;
    padding-right: 20px
}

nav.navbar .user-wrapper a#menu-dropdown::after {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/arrow_icon.svg) no-repeat center right;
    position: absolute;
    content: "";
    right: 0;
    top: 5px;
    width: 12px;
    height: 12px
}

nav.navbar .user-wrapper a#menu-dropdown img {
    margin-right: 5px;
    margin-top: -3px;
    opacity: .2;
}

nav.navbar .user-wrapper a#menu-dropdown:focus img, nav.navbar .user-wrapper a#menu-dropdown:hover img {
    opacity: .3;
}

.jumbotron {
    background: #fff url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds) no-repeat center center;
    border-radius: 0;
    position: relative;
    text-align: center;
}

.jumbotron.hero-image-2 {
    background: #fff url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/img_heroange.png) no-repeat center center;
    background-color: #E6BC6D;
    background-size: cover;
    border-radius: 0;
    position: relative;
    padding: 3rem 1rem 10rem 1rem;
}

.jumbotron.hero-image-2 h1 {
    color: var(--text-white);
    font-family: "Avenir LT W01_35 Light1475496";
}

.jumbotron h1 {
    color: var(--text-white);
    font-family: "Avenir LT W01_35 Light1475496";
}

.jumbotron h1 span {
    color: #fe9901;
    font-family: "Avenir LT W01_85 Heavy1475544";
}

.jumbotron p.lead {
    color: var(--text-white);
    font-family: "Avenir LT W01_35 Light1475496";
    font-weight: 200;
    margin: 0;
    padding: 1rem 0
}

.jumbotron p.lead strong {
    font-family: "Avenir LT W01_65 Medium1475532";
}

.input-group input.form-control {
    border: none;
    font-size: 16px;
    color: var(--text-black);
    font-family: "Avenir LT W01_35 Light1475496";
}

.input-group {
    max-width: 670px;
    margin: 0 auto;
    position: relative;
}

.get-started-now {
    position: absolute;
    left: -135px;
    bottom: -105px
}

.input-group input.form-control::placeholder {
    font-size: 16px;
    font-family: "Avenir LT W01_35 Light1475496";
}

.input-group-lg > .custom-select, .input-group-lg > .form-control {
    border-radius: 15rem;
    padding: .5rem 1.5rem;
    font-family: "Avenir LT W01_35 Light1475496";
}

.input-group-lg > .custom-select, .input-group-lg > .form-control:not(textarea) {
    height: calc(1.5em + 1.7rem + 2px)
}

.input-group .input-group-append button.btn {
    border-top-right-radius: 15rem !important;
    border-bottom-right-radius: 15rem !important;
    background-color: #fe9901;
    color: var(--text-white);
    font-size: 18px;
    font-family: "Avenir LT W01_65 Medium1475532";
    padding: .5rem 1.4rem;
}

.input-group .input-group-append button.btn:focus, .input-group .input-group-append button.btn:hover {
    background-color: var(--bg-orange-5);
}

footer {
    display: block;
    width: 100%;
    padding: 3rem 0;
    background: var(--bg-white);
}

footer img.logo-footer {
    margin-bottom: 1.6rem
}

footer small {
    font-size: 11px;
}

footer h4 {
    font-size: 12px;
    font-family: "Avenir LT W01_65 Medium1475532";
    color: #E6BC6D;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 1.5rem;
}

footer ul li {
    width: 100%;
}

footer ul li a {
    font-size: 16px;
    font-family: "Avenir LT W01_65 Medium1475532";
    color: var(--text-black);
}

footer ul li a:focus, footer ul li a:hover {
    color: #E6BC6D;
}

footer ul.social-media {
    display: inline-block;
    width: 100%;
    margin: 0 0 5px 0;
}

footer ul.social-media li {
    display: inline-block;
    width: auto;
    margin-right: 7px;
}

footer ul.social-media li a:focus, footer ul.social-media li a:hover {
    opacity: .7;
}

footer a.email {
    font-size: 13px;
    font-family: "Avenir LT W01_65 Medium1475532";
    color: var(--text-black);
}

footer .col-xl-3 {
    margin-bottom: 1rem;
}

.dropdown-menu {
    min-width: 8.5rem;
    margin-top: 10px;
    border: 0;
    border-radius: 2px;
    -webkit-box-shadow: 0 3px 17px 0 rgba(0, 0, 0, .15);
    -moz-box-shadow: 0 3px 17px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 3px 17px 0 rgba(0, 0, 0, .15);
}

.dropdown-item {
    font-size: 13px;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #E6BC6D;
}

.navbar-light .navbar-toggler {
    border-color: transparent;
    padding: .25rem 0;
}

.steps-wrapper {
    display: block;
    text-align: center;
    position: relative;
    border-bottom: 1px solid #f3f3f3;
}

.steps-wrapper ul {
    display: block;
    margin: 0;
    text-align: center;
}

.steps-wrapper ul li {
    width: auto;
    display: inline-block;
}

.steps-wrapper ul li a {
    display: inline-block;
    position: relative;
    z-index: 9999;
}

.steps-wrapper ul li a:focus, .steps-wrapper ul li a:hover {
    text-decoration: none;
}

.steps-wrapper ul li a.active span {
    background-color: var(--bg-black);
}

.steps-wrapper ul li a.completed span {
    background-color: #E6BC6D;
    padding: .65rem .8rem !important;
}

.steps-wrapper ul li a.active small, .steps-wrapper ul li a.completed small {
    color: var(--text-black);
}

.steps-wrapper ul li a span {
    border-radius: 50%;
    padding: 1rem;
    background-color: #eaeaea;
    color: var(--text-white);
    padding: .65rem 1rem;
    width: 100%;
    margin-bottom: 1rem;
}

.steps-wrapper ul li a small {
    text-transform: uppercase;
    font-size: 10px;
    color: #d5d5d5;
    letter-spacing: 1px;
    float: left;
    margin-top: 1.3rem;
    width: 100%;
    text-align: center;
    font-family: "Avenir LT W01_65 Medium1475532";
}

.content-wrapper.float-content {
    margin-top: -160px;
    z-index: 9999;
    display: block;
    position: relative;
}

.content-wrapper .container {
    background-color: var(--bg-white);
    z-index: 9999;
    display: block;
    -webkit-box-shadow: 1px 8px 55px 2px rgba(0, 0, 0, .04);
    -moz-box-shadow: 1px 8px 55px 2px rgba(0, 0, 0, .04);
    box-shadow: 1px 8px 55px 2px rgba(0, 0, 0, .04);
}

.reverse-asin-form {
    padding: 3rem 0;
    display: block;
    text-align: center;
}

.reverse-asin-form input.form-control {
    border-radius: 50px;
    border-width: 2px;
    font-family: "Avenir LT W01_35 Light1475496";
    font-size: #000;
    -webkit-box-shadow: 0 12px 55px 2px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 12px 55px 2px rgba(0, 0, 0, .1);
    box-shadow: 0 12px 55px 2px rgba(0, 0, 0, .1);
}

.reverse-asin-form input.form-control:focus {
    -webkit-box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3);
    -moz-box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3);
    box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3)
}

.reverse-asin-form input.form-control-lg {
    height: calc(1.5em + 1.6rem + 2px);
    padding: .5rem 1.5rem;
}

.reverse-asin-form a.icon-add {
    position: absolute;
    right: 26px;
    top: 11px;
}

.reverse-asin-form button.btn-warning {
    margin: 3rem 0 1rem 0;
}

.btn {
    border-radius: 35px;
}

.btn-group-lg > .btn, .btn-lg {
    padding: .6rem 2.5rem;
}

.btn-warning {
    color: var(--text-white);
    background-color: #E6BC6D;
    border-color: #E6BC6D;
    -webkit-box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3);
    -moz-box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3);
    box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3);
}

.btn-warning:focus, .btn-warning:hover {
    color: var(--text-white);
    background-color: var(--bg-orange-5);
    border-color: var(--color-orange-5);
    -webkit-box-shadow: 0 12px 55px 2px rgba(255, 186, 0, .3);
    -moz-box-shadow: 0 12px 55px 2px rgba(255, 186, 0, .3);
    box-shadow: 0 12px 55px 2px rgba(255, 186, 0, .3);
}

.cta-wrapper {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/img_cta_background.png) no-repeat center center;
    padding: 5rem 0;
    margin-top: 6rem;
    color: var(--text-white);
    text-align: center;
}

.cta-wrapper button {
    margin-bottom: 35px;
}

.cta-wrapper i {
    font-family: Merriweather, serif;
    font-size: 14px;
    font-weight: 200;
    opacity: .8;
    font-style: italic;
}

.media {
    background-color: var(--bg-white);
    border-radius: 6px;
    -webkit-box-shadow: 1px 8px 55px 2px rgba(0, 0, 0, .04);
    -moz-box-shadow: 1px 8px 55px 2px rgba(0, 0, 0, .04);
    box-shadow: 1px 8px 55px 2px rgba(0, 0, 0, .04);
    margin: 1rem 0;
    padding: 1rem;
    position: relative;
}

.media .media-body {
    font-size: 14px;
    padding: .4rem .2rem;
    color: #6d6d6d;
    font-family: "Avenir LT W01_35 Light1475496";
}

.media .media-body h5 {
    font-family: "Avenir LT W01_65 Medium1475532";
    color: var(--text-black);
    font-size: 16px;
}

.media a.close {
    position: absolute;
    right: 8px;
    top: 4px;
    opacity: .2
}

.media a.close:focus, .media a.close:hover {
    opacity: 1;
}

.reverse-asin-form h3 {
    font-size: 32px;
    margin-bottom: 12px;
}

.reverse-asin-form h5 {
    font-size: 18px;
    font-family: "Avenir LT W01_65 Medium1475532";
    color: #707070;
    line-height: 28px;
}

.reverse-asin-form .result-description {
    text-align: left;
}

.reverse-asin-form .result-description h5 {
    color: var(--text-black);
    font-size: 18px;
}

.reverse-asin-form .result-description p {
    font-size: 16px;
    color: #6d6d6d;
    font-family: "Avenir LT W01_35 Light1475496";
}

.reverse-asin-form h5 a {
    color: #E6BC6D;
}

.menu-options-wrapper {
    display: block;
    text-align: left;
}

.btn.btn-secondary {
    font-family: "Avenir LT W01_65 Medium1475532";
}

.btn-secondary {
    color: var(--text-white);
    background-color: var(--bg-orange-4);
    border-color: var(--color-orange-4);
    padding: .5rem 2rem;
    -webkit-box-shadow: 0 12px 55px 2px rgba(255, 186, 0, .3);
    -moz-box-shadow: 0 12px 55px 2px rgba(255, 186, 0, .3);
    box-shadow: 0 12px 55px 2px rgba(255, 186, 0, .3);
}

.btn-secondary.active, .btn-secondary:active, .btn-secondary:focus, .btn-secondary:hover {
    color: var(--text-white);
    background-color: #E6BC6D;
    border-color: #E6BC6D;
    -webkit-box-shadow: 0 12px 55px 2px rgba(255, 153, 0, .3);
    -moz-box-shadow: 0 12px 55px 2px rgba(255, 153, 0, .3);
    box-shadow: 0 12px 55px 2px rgba(255, 153, 0, .3);
}

.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show > .btn-secondary.dropdown-toggle {
    color: var(--text-white);
    background-color: #ff8100;
    border-color: #ff8100;
    outline: 0;
}

.menu-options-wrapper a.btn.btn-secondary {
    margin-bottom: 15px;
}

.menu-options-wrapper a.btn.btn-secondary img {
    margin-right: 6px;
    margin-top: -2px;
}

.menu-options-wrapper ul li {
    display: inline-block;
    padding: 10px 5px;
    color: #acacac;
    font-size: 14px;
}

.table thead th {
    vertical-align: top;
    border-bottom: 1px solid #ededed;
    border-top: 0 solid #ededed;
    font-size: 11px;
    font-family: "Avenir LT W01_65 Medium1475532";
    letter-spacing: 1px;
}

.table thead th.bg-yellow {
    background-color: #fbde90 !important;
}

.table tbody td.bg-yellow-light {
    background-color: #fffbef !important;
}

.table td {
    padding: .75rem;
    font-size: 14px;
    vertical-align: top;
    border-top: 1px solid #ededed;
    font-family: "Avenir LT W01_35 Light1475496";
    color: #5f5f5f;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, .02);
}

.page-link {
    margin-top: 20px;
    border-width: 0;
    color: var(--text-black);
    font-size: 14px;
}

.page-link:focus, .page-link:hover {
    background-color: transparent;
    outline: 0;
    color: #E6BC6D;
}

.page-item.active .page-link {
    z-index: 1;
    color: var(--text-white);
    background-color: #E6BC6D;
    border-color: #E6BC6D;
    border-radius: 35px;
}

.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .025) !important;
}

.pricing-wrapper {
    display: block;
    padding: 5rem 0 2rem 0;
}

.pricing-wrapper h1 {
    position: relative;
}

.pricing-wrapper p.tagline {
    font-size: 18px;
    font-family: "Avenir LT W01_65 Medium1475532";
    color: #707070;
}

.dot-img {
    position: absolute;
    left: 23%;
    top: -30px;
    z-index: -1;
}

.switching-plans-wrapper {
    width: 220px;
    background-color: var(--bg-white);
    -webkit-box-shadow: 1px 10px 55px 2px rgba(0, 0, 0, .08);
    -moz-box-shadow: 1px 10px 55px 2px rgba(0, 0, 0, .08);
    box-shadow: 1px 10px 55px 2px rgba(0, 0, 0, .08);
    border-radius: 35px;
    padding: 4px;
    margin: 2.4rem auto 5rem auto;
}

.switching-plans-wrapper ul {
    display: block;
    margin: 0;
    width: 100%;
    text-align: center;
}

.switching-plans-wrapper ul li {
    display: inline-block;
}

.switching-plans-wrapper ul li a {
    display: inline-block;
    padding: .6rem 1.4rem;
    font-size: 14px;
    color: #707070;
    border-radius: 35px;
}

.switching-plans-wrapper ul li a:focus, .switching-plans-wrapper ul li a:hover {
    text-decoration: none;
}

.switching-plans-wrapper ul li a.active {
    background-color: #E6BC6D;
    color: #fff
}

.card-body {
    padding: 2rem;
}

.card {
    border-radius: .5rem;
    border-width: 0;
}

.card .card-body h3 {
    font-size: 24px;
    font-family: "Avenir LT W01_35 Light1475496";
    margin-top: 1.6rem;
}

.card .card-body hr {
    border-color: #f1f1f1;
}

.card .card-body h1.pricing-card-title {
    color: var(--text-black);
    font-family: "Avenir LT W01_35 Light1475496";
    color: #E6BC6D;
}

.card .card-body p {
    font-size: 14px;
    font-family: "Avenir LT W01_35 Light1475496";
    line-height: 23px;
    margin: 2rem 0;
}

.card .card-body p strong {
    font-family: "Avenir LT W01_65 Medium1475532";
    letter-spacing: -.5px;
}

.plans-wrapper .card:first-child {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.plans-wrapper .card:last-child {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.plans-wrapper .card.card-popular {
    border: 1px solid #ffd89d;
    z-index: 9999;
    border-radius: .5rem;
    box-shadow: 0 1rem 3rem rgba(255, 153, 0, .14) !important;
}

.plans-wrapper .card.card-popular button {
    padding: .8rem 2.5rem;
}

.plans-wrapper .card.card-popular .popular-plan-ribbon {
    position: absolute;
    left: -2px;
    top: -1px;
}

.plans-wrapper .card.card-popular .card-body h1 {
    font-size: 2.8rem;
}

.btn-dark {
    color: var(--text-white);
    background-color: #5e5e5e;
    border-color: #5e5e5e;
}

.btn-dark:active, .btn-dark:focus, .btn-dark:hover {
    color: var(--text-white);
    background-color: #222;
    border-color: #222;
}

.table-plans-wrapper {
    background-color: var(--bg-white);
    padding: 4rem 0;
    margin-top: 1rem;
}

table.table.table-plan thead tr th {
    font-size: 22px;
    text-transform: none;
    font-family: "Avenir LT W01_35 Light1475496";
    letter-spacing: normal;
    border: none;
}

table.table.table-plan tbody tr td {
    font-size: 17px;
    text-transform: none;
    font-family: "Avenir LT W01_35 Light1475496";
    letter-spacing: normal;
    padding: 1.2rem .75rem;
    border: none;
}

.result-wrapper .media img.product-image {
    border-radius: 4px;
}

.reverse-asin-form img.reverse-asin-product-image {
    border-radius: 6px;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    background: 0 0;
    border-color: transparent;
}

.nav-tabs .nav-link {
    border: none;
    padding: 0 !important
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border-color: transparent
}

@media (max-width: 375px) {
    .zb-tshirt {
        display: none;
    }
}

@media (max-width: 425px) and (min-width: 376px) {
    .zb-tshirt {
        position: absolute;
        top: -90px;
        left: 75%;
        z-index: 1;
        width: 150px;
        height: 170px;
        transform: rotate(20deg);
    }
}

@media (max-width: 768px) and (min-width: 426px) {
    .zb-tshirt {
        position: absolute;
        top: -90px;
        left: 80%;
        z-index: 1;
        width: 200px;
        height: 210px;
        transform: rotate(20deg);
    }
}

@media (min-width: 768px) {
    .zb-tshirt {
        position: absolute;
        top: -80px;
        left: 80%;
        z-index: 1;
        width: 170px;
        height: 190px;
        transform: rotate(20deg);
    }
}

@media (min-width: 320px) {
    .desktop-tablet-view {
        display: none;
    }

    .mobile-view {
        display: block
    }

    .top-pos-mobile {
        position: relative;
        top: -650px;
        height: 0 !important
    }

    #bg {
        background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/bg_mobile.png) top center no-repeat;
        background-size: cover;
        max-width: auto;
        height: 60vh;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0
    }

    .H-align-homepage {
        height: 250px !important
    }

    .H-align-homepage1 {
        height: 300px !important;
        transition: .5s
    }

    .H-align-homepage0 {
        height: 200px !important;
        transition: .5s
    }

    .header-hompage {
        margin-top: 100px;
        text-align: center
    }

    .header-hompage h1 {
        font-size: 40px;
        transition: .5s
    }

    .header-hompage h2 {
        font-size: 40px;
        transition: .5s
    }

    .align-homepage dt {
        font-size: 26px;
        transition: .5s
    }

    .align-homepage p {
        font-size: 16px;
        transition: .5s
    }

    .imgs-homepage {
        height: 230px !important;
        transition: .5s
    }

    .align-homepage {
        text-align: center;
        transition: .5s
    }

    .homepage-carousel {
        position: relative;
        top: 330px
    }

    .top-navbar {
        width: 100%
    }

    #font-minimizer {
        font-size: 16px
    }

    .foot-content {
        text-align: center
    }

    #heading-title {
        font-size: 28px !important
    }

    .jumbotron {
        padding: 4rem 1rem 4rem 1rem
    }

    .get-started-now {
        display: none
    }

    footer img.logo-footer {
        width: 130px
    }

    .jumbotron p.lead {
        font-size: 15px
    }

    .btn-text-search {
        display: none
    }

    .btn-icon-search {
        display: block
    }

    footer .col-xl-3 {
        text-align: center
    }

    footer h4 {
        margin-top: 1rem
    }

    .jumbotron h1 {
        font-size: 45px
    }

    .navbar-light .navbar-nav .nav-link {
        padding-left: 0;
        padding-right: 0
    }

    .navbar-collapse {
        padding-top: .5rem;
        margin-top: .7rem
    }

    footer ul li {
        margin: 0 0
    }

    .steps-wrapper hr {
        width: 130px;
        border-color: #eaeaea;
        margin: 0 auto;
        z-index: 0;
        margin-top: -12px;
        position: absolute;
        margin-left: 30px
    }

    .steps-wrapper ul li {
        padding: 0 .5rem
    }

    .steps-wrapper {
        padding: 2.5rem 0 1.5rem 0
    }

    .steps-wrapper ul li a small {
        display: none
    }

    .steps-wrapper ul li a {
        width: auto
    }

    .jumbotron.hero-image-2 h1 {
        font-size: 35px
    }

    .menu-options-wrapper a.btn.btn-secondary {
        width: 100%;
        margin-right: 0
    }

    .reverse-asin-form h4 {
        text-align: center
    }

    .content-wrapper .container {
        border-radius: 0
    }

    .menu-options-wrapper ul {
        float: none;
        width: 100%;
        text-align: center;
        margin-top: 20px
    }

    .menu-options-wrapper {
        margin: 1rem 0
    }

    .reverse-asin-form .result-description h5 {
        margin-top: 15px
    }

    .reverse-asin-form.pd-option, .tab-pane.pd-option {
        padding: 2rem 0
    }

    .plans-wrapper .card.card-popular {
        margin-top: 0
    }

    .cta-wrapper h2 {
        line-height: 37px;
        margin-bottom: 30px;
        font-size: 1.6rem
    }

    .content-wrapper.m-bottom-5 {
        margin-bottom: 50px
    }

    .result-wrapper .media img.product-image {
        width: 80px !important
    }
}

@media (min-width: 480px) {
    .homepage-carousel {
        display: block !important;
    }

    .img-sizer {
        width: 89px !important;
        height: 89px !important;
    }

    section h1.how-it-works {
        font-size: 30px;
    }

    footer h3.orange {
        font-size: 35px;
    }

    .carousel-item p {
        font-size: 18px;
        font-style: italic;
    }

    footer .terms a {
        font-size: 11px;
    }

    .dark-column {
        border-radius: 5px 5px 0px 0px !important;
    }

    .desktop-tablet-view {
        display: block
    }

    .mobile-view {
        display: none
    }

    .top-pos-mobile {
        position: relative;
        top: -560px;
        height: 70px
    }

    .paddg-margn-mobile {
        margin-top: 50px;
        margin-bottom: 100px
    }

    .navbar {
        height: 65px !important
    }

    .H-align-homepage {
        height: 250px !important
    }

    .H-align-homepage1 {
        height: 300px !important;
        transition: .5s
    }

    .H-align-homepage0 {
        height: 200px !important;
        transition: .5s
    }

    .header-hompage {
        margin-left: 0;
        padding-top: 0;
        text-align: left;
        transition: .5s;
        text-align: center
    }

    .header-hompage h1 {
        font-size: 48px;
        width: 100%;
        transition: .5s;
        text-align: center
    }

    .header-hompage h2 {
        font-size: 48px;
        width: 100%;
        transition: .5s;
        text-align: center
    }

    .align-homepage dt {
        font-size: 48px;
        transition: .5s
    }

    .align-homepage p {
        font-size: 18px;
        line-height: 1.7;
        transition: .5s
    }

    .imgs-homepage {
        height: 350px !important;
        transition: .5s
    }

    .align-homepage {
        text-align: center;
        transition: .5s
    }

    .homepage-carousel {
        position: relative;
        top: 310px;
        transition: .5s
    }

    .top-navbar {
        width: 85%
    }

    #bg {
        width: 120%
    }

    .two-colmn h1 {
        padding-top: 0 !important;
        transition: .5s
    }

    .boxleft {
        background: var(--bg-white);
        padding: 20px;
        text-align: justify;
        border: 2px solid #f2f2f2;
        position: relative
    }

    .boxright {
        background: var(--bg-white);
        padding: 20px;
        text-align: justify;
        border: 2px solid #f2f2f2;
        position: relative;
        align-self: center
    }

    .boxleft:before {
        content: '';
        width: 25px !important;
        height: 25px !important;
        background: var(--bg-white);
        position: absolute;
        top: 30px;
        left: 101% !important;
        transform: translateX(-50%) rotate(45deg);
        border-top: 2px solid #f2f2f2;
        border-right: 2px solid #f2f2f2;
        z-index: 1
    }

    .boxright:before {
        content: '';
        width: 25px !important;
        height: 25px !important;
        background: var(--bg-white);
        position: absolute;
        top: 40px;
        left: -.9% !important;
        transform: translateX(-50%) rotate(45deg);
        border-bottom: 2px solid #f2f2f2;
        border-left: 2px solid #f2f2f2
    }

    .upper_content h1 {
        font-size: 25px !important;
        transition: .5s
    }

    section.content-how-we h6 {
        font-size: 16px !important;
        transition: .5s
    }

    .holder-how-we p {
        font-size: 17px !important;
        transition: .5s
    }

    section.content-how-we h4 {
        font-family: "Avenir LT W01_85 Heavy1475544";
        font-size: 30px !important;
        transition: .5s
    }

    .v-line:after {
        content: "";
        position: absolute;
        z-index: -1;
        top: -100px !important;
        left: 70% !important;
        border-left: 2px solid #f2f2f2;
        height: 260px
    }

    .v-line-end:after {
        content: "";
        position: absolute;
        z-index: -1;
        top: -40px;
        left: 70% !important;
        border-left: 2px solid #f2f2f2;
        height: 220px
    }

    .header-content h1 {
        font-size: 35px !important
    }

    #font-minimizer {
        font-size: 16px
    }

    .foot-content {
        text-align: center
    }

    #heading-title {
        font-size: 30px !important
    }

    .jumbotron {
        padding: 7rem 2rem 8rem 2rem
    }

    .get-started-now {
        display: none
    }

    footer img.logo-footer {
        width: 130px
    }

    .jumbotron p.lead {
        font-size: 16px
    }

    .btn-text-search {
        display: none
    }

    .btn-icon-search {
        display: block
    }

    footer .col-xl-3 {
        text-align: center
    }

    footer h4 {
        margin-top: 1rem
    }

    .jumbotron h1 {
        font-size: 50px
    }

    .navbar-light .navbar-nav .nav-link {
        padding-left: 0;
        padding-right: 0
    }

    .navbar-collapse {
        padding-top: .5rem;
        margin-top: .7rem
    }

    .steps-wrapper hr {
        width: 130px;
        border-color: #eaeaea;
        margin: 0 auto;
        z-index: 0;
        margin-top: -12px;
        position: absolute;
        margin-left: 30px
    }

    footer ul li {
        margin: 0 0
    }

    .steps-wrapper ul li {
        padding: 0 .5rem
    }

    .steps-wrapper {
        padding: 2.5rem 0 1.5rem 0
    }

    .steps-wrapper ul li a small {
        display: none
    }

    .steps-wrapper ul li a {
        width: auto
    }

    .jumbotron.hero-image-2 h1 {
        font-size: 40px
    }

    .menu-options-wrapper a.btn.btn-secondary {
        width: 100%;
        margin-right: 0
    }

    .reverse-asin-form h4 {
        text-align: center
    }

    .content-wrapper .container {
        border-radius: 0
    }

    .menu-options-wrapper ul {
        float: none;
        width: 100%;
        text-align: center;
        margin-top: 25px
    }

    .menu-options-wrapper {
        margin: 1rem 0
    }

    .reverse-asin-form .result-description h5 {
        margin-top: 15px
    }

    .reverse-asin-form.pd-option, .tab-pane.pd-option {
        padding: 2rem 1rem
    }

    .plans-wrapper .card.card-popular {
        margin-top: 0
    }

    .cta-wrapper h2 {
        line-height: 40px;
        margin-bottom: 30px;
        font-size: 1.8rem
    }

    .content-wrapper.m-bottom-5 {
        margin-bottom: 50px
    }

    .result-wrapper .media img.product-image {
        width: 80px !important
    }
}

@media (min-width: 768px) {
    .img-sizer {
        width: 89px !important;
        height: 89px !important;
    }

    footer h3.orange {
        font-size: 45px;
    }

    .carousel-item p {
        font-size: 22px;
        font-style: italic;
    }

    footer .terms a {
        font-size: 13px;
    }

    .dark-column {
        border-radius: 5px 5px 0px 0px !important;
    }

    .main-sub-right-col {
        border-radius: 0px 0px 5px 5px !important;
    }

    .desktop-tablet-view {
        display: block
    }

    .mobile-view {
        display: none
    }

    .top-pos-mobile {
        position: relative;
        top: -560px;
        height: 70px
    }

    .paddg-margn-mobile {
        margin-top: 50px;
        margin-bottom: 100px
    }

    #bg {
        background: url('https://axdebntfdp.cloudimg.io/v7/zonbase.com/optimize_images/bg_hero_new_opti.jpg') top center no-repeat;
        background-size: cover;
        max-width: auto;
        height: 60vh;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0
    }

    .navbar {
        height: 100px !important
    }

    .H-align-homepage {
        height: 250px !important;
        transition: .5s
    }

    .H-align-homepage1 {
        height: 300px !important;
        transition: .5s
    }

    .H-align-homepage0 {
        height: 200px !important;
        transition: .5s
    }

    .header-hompage {
        margin-left: 60px;
        padding-top: 0;
        text-align: left;
        transition: .5s
    }

    .header-hompage h1 {
        text-align: left;
        font-size: 60px;
        width: 100%;
        transition: .5s
    }

    .header-hompage h2 {
        text-align: left;
        font-size: 60px;
        width: 100%;
        transition: .5s
    }

    .align-homepage dt {
        font-size: 40px;
        transition: .5s
    }

    .align-homepage p {
        font-size: 18px;
        line-height: 1.7;
        transition: .5s
    }

    .align-homepage {
        text-align: left;
        transition: .5s
    }

    .imgs-homepage {
        height: 350px !important;
        transition: .5s
    }

    .homepage-carousel {
        position: relative;
        top: 250px;
        transition: .5s
    }

    .top-navbar {
        width: 100%
    }

    #bg {
        width: 100%
    }

    .two-colmn h1 {
        padding-top: 90px !important;
        transition: .5s
    }

    .boxleft:before {
        content: '';
        width: 30px;
        height: 30px;
        background: var(--bg-white);
        position: absolute;
        top: 30px;
        left: 100.3% !important;
        transform: translateX(-50%) rotate(45deg);
        border-top: 2px solid #f2f2f2;
        border-right: 2px solid #f2f2f2;
        z-index: 1
    }

    .boxright:before {
        content: '';
        width: 30px;
        height: 30px;
        background: var(--bg-white);
        position: absolute;
        top: 40px;
        left: -.5% !important;
        transform: translateX(-50%) rotate(45deg);
        border-bottom: 2px solid #f2f2f2;
        border-left: 2px solid #f2f2f2
    }

    section.content-how-we h6 {
        font-size: 20px !important;
        transition: .5s
    }

    .holder-how-we p {
        font-size: 20px !important;
        transition: .5s
    }

    section.content-how-we h4 {
        font-family: "Avenir LT W01_85 Heavy1475544";
        font-size: 40px !important;
        transition: .5s
    }

    .v-line:after {
        content: "";
        position: absolute;
        z-index: -1;
        top: -100px !important;
        left: 50% !important;
        border-left: 2px solid #f2f2f2;
        height: 260px
    }

    .v-line-end:after {
        content: "";
        position: absolute;
        z-index: -1;
        top: -40px;
        left: 50% !important;
        border-left: 2px solid #f2f2f2;
        height: 220px
    }

    .header-content h1 {
        font-size: 35px !important;
        transition: .5s
    }

    .upper_content h1 {
        font-size: 25px;
        transition: .5s
    }

    .foot-content {
        text-align: left
    }

    #heading-title {
        font-size: 30px !important
    }

    .jumbotron {
        padding: 5rem 10rem 6rem 10rem
    }

    .get-started-now {
        display: none
    }

    footer img.logo-footer {
        width: 120px
    }

    .jumbotron p.lead {
        font-size: 16px
    }

    .btn-text-search {
        display: block
    }

    .btn-icon-search {
        display: none
    }

    footer .col-xl-3 {
        text-align: left
    }

    footer h4 {
        margin-top: 0
    }

    .jumbotron h1 {
        font-size: 65px
    }

    .navbar-light .navbar-nav .nav-link {
        padding-left: 1.2rem;
        padding-right: 1.2rem
    }

    footer ul li {
        margin: .5rem 0
    }

    .navbar-collapse {
        border-top: 0 solid #f1f1f1;
        padding-top: 0;
        margin-top: 0
    }

    .steps-wrapper ul li {
        padding: 0 1.8rem
    }

    .steps-wrapper hr {
        width: 380px;
        border-color: #eaeaea;
        margin: 0 auto;
        z-index: 0;
        margin-top: -48px;
        position: absolute;
        margin-left: 50px
    }

    .steps-wrapper {
        padding: 2.5rem 1rem 1.5rem 1rem
    }

    .steps-wrapper ul li a small {
        display: block
    }

    .steps-wrapper ul li a {
        width: 120px
    }

    .jumbotron.hero-image-2 h1 {
        font-size: 50px
    }

    .menu-options-wrapper a.btn.btn-secondary {
        width: auto;
        margin-right: 12px
    }

    .reverse-asin-form h4 {
        text-align: left
    }

    .content-wrapper .container {
        border-radius: 6px
    }

    .menu-options-wrapper ul {
        float: right;
        width: auto;
        text-align: left;
        margin-top: 0
    }

    .menu-options-wrapper {
        margin: 2rem 0
    }

    .reverse-asin-form .result-description h5 {
        margin-top: 0
    }

    .reverse-asin-form.pd-option, .tab-pane.pd-option {
        padding: 2rem 1.5rem
    }

    .plans-wrapper .card.card-popular {
        margin-top: -10px
    }

    .cta-wrapper h2 {
        line-height: 50px;
        margin-bottom: 30px;
        font-size: 2rem
    }

    .content-wrapper.m-bottom-5 {
        margin-bottom: 90px
    }

    .result-wrapper .media img.product-image {
        width: 90px !important
    }
}

@media (min-width: 992px) {
    .img-sizer {
        width: 95px !important;
        height: 95px !important;
    }

    footer h3.orange {
        font-size: 45px;
    }

    .carousel-item p {
        font-size: 22px;
        font-style: italic;
    }

    footer .terms a {
        font-size: 13px;
    }

    .dark-column {
        border-radius: 5px 0px 0px 5px !important;
    }

    .white-column {
        border-radius: 0px 5px 5px 0px !important;
    }

    .mobile-view {
        display: none
    }

    .navbar {
        height: 65px !important
    }

    .H-align-homepage {
        height: 350px;
        transition: .5s
    }

    .H-align-homepage1 {
        height: 350px;
        transition: .5s
    }

    .H-align-homepage0 {
        height: 350px;
        transition: .5s
    }

    .header-hompage {
        margin-left: 40px;
        padding-top: 0;
        text-align: left;
        transition: .5s
    }

    .header-hompage h1 {
        font-size: 60px;
        width: 100%;
        transition: .5s
    }

    .header-hompage h2 {
        font-size: 60px;
        width: 100%;
        transition: .5s
    }

    .align-homepage dt {
        font-size: 40px;
        transition: .5s
    }

    .align-homepage p {
        font-size: 18px;
        line-height: 1.7;
        transition: .5s
    }

    .align-homepage {
        text-align: left;
        transition: .5s
    }

    .imgs-homepage {
        height: 350px !important;
        transition: .5s
    }

    #bg {
        width: 100%
    }

    .v-line:after {
        content: "";
        position: absolute;
        z-index: -1;
        top: -50px !important;
        left: 50% !important;
        border-left: 1px solid #d8d8d8;
        height: 260px
    }

    .v-line-end:after {
        content: "";
        position: absolute;
        z-index: -1;
        top: -40px;
        left: 50% !important;
        border-left: 1px solid #d8d8d8;
        height: 220px
    }

    .header-content h1 {
        font-family: "Avenir LT W01_85 Heavy1475544";
        font-size: 55px !important;
        color: #fff
    }

    .upper_content h1 {
        font-size: 35px !important;
        transition: .5s
    }

    #heading-title {
        font-size: 30px !important
    }

    .jumbotron {
        padding: 7rem 8rem 8rem 8rem
    }

    .get-started-now {
        display: block
    }

    footer img.logo-footer {
        width: 160px
    }

    .jumbotron p.lead {
        font-size: 17px
    }

    .btn-text-search {
        display: block
    }

    .btn-icon-search {
        display: none
    }

    footer .col-xl-3 {
        text-align: left
    }

    footer h4 {
        margin-top: 0
    }

    .jumbotron h1 {
        font-size: 65px
    }

    .navbar-light .navbar-nav .nav-link {
        padding-left: 1.2rem;
        padding-right: 1.2rem
    }

    footer ul li {
        margin: .5rem 0
    }

    .navbar-collapse {
        border-top: 0 solid #f1f1f1;
        padding-top: 0;
        margin-top: 0
    }

    .steps-wrapper ul li {
        padding: 0 2rem
    }

    .steps-wrapper hr {
        width: 380px;
        border-color: #eaeaea;
        margin: 0 auto;
        z-index: 0;
        margin-top: -48px;
        position: absolute;
        margin-left: 50px
    }

    .steps-wrapper {
        padding: 2.5rem 1rem 1.5rem 1rem
    }

    .steps-wrapper ul li a small {
        display: block
    }

    .steps-wrapper ul li a {
        width: 120px
    }

    .jumbotron.hero-image-2 h1 {
        font-size: 50px
    }

    .menu-options-wrapper a.btn.btn-secondary {
        width: auto;
        margin-right: 12px
    }

    .reverse-asin-form h4 {
        text-align: left
    }

    .content-wrapper .container {
        border-radius: 6px
    }

    .menu-options-wrapper ul {
        float: right;
        width: auto;
        text-align: left;
        margin-top: 0
    }

    .menu-options-wrapper {
        margin: 2rem 0
    }

    .reverse-asin-form .result-description h5 {
        margin-top: 0
    }

    .reverse-asin-form.pd-option, .tab-pane.pd-option {
        padding: 2rem 1.5rem
    }

    .plans-wrapper .card.card-popular {
        margin-top: -10px
    }

    .cta-wrapper h2 {
        line-height: 54px;
        margin-bottom: 40px;
        font-size: 2.2rem
    }

    .content-wrapper.m-bottom-5 {
        margin-bottom: 90px
    }

    .result-wrapper .media img.product-image {
        width: 100px !important
    }
}

@media (min-width: 1200px) {
    .img-sizer {
        width: 95px !important;
        height: 95px !important;
    }

    h1.how-it-works {
        font-size: 30px;
    }

    footer h3.orange {
        font-size: 45px;
    }

    .carousel-item p {
        font-size: 22px;
        font-style: italic;
    }

    footer .terms a {
        font-size: 13px;
    }

    .align-homepage {
        text-align: left
    }

    #font-minimizer {
        font-size: 20px
    }

    #heading-title {
        font-size: 58px !important
    }

    .jumbotron {
        padding: 7rem 15rem 8rem 15rem
    }

    .get-started-now {
        display: block
    }

    footer img.logo-footer {
        width: 160px
    }

    .jumbotron p.lead {
        font-size: 17px
    }

    .btn-text-search {
        display: block
    }

    .btn-icon-search {
        display: none
    }

    footer .col-xl-3 {
        text-align: left
    }

    footer h4 {
        margin-top: 0
    }

    .jumbotron h1 {
        font-size: 65px
    }

    .navbar-light .navbar-nav .nav-link {
        padding-left: 1.2rem;
        padding-right: 1.2rem
    }

    footer ul li {
        margin: .5rem 0
    }

    .navbar-collapse {
        border-top: 0 solid #f1f1f1;
        padding-top: 0;
        margin-top: 0
    }

    .steps-wrapper ul li {
        padding: 0 2rem
    }

    .steps-wrapper hr {
        width: 380px;
        border-color: #eaeaea;
        margin: 0 auto;
        z-index: 0;
        margin-top: -48px;
        position: absolute;
        margin-left: 50px
    }

    .steps-wrapper {
        padding: 2.5rem 1rem 1.5rem 1rem
    }

    .steps-wrapper ul li a small {
        display: block
    }

    .steps-wrapper ul li a {
        width: 120px
    }

    .jumbotron.hero-image-2 h1 {
        font-size: 50px
    }

    .menu-options-wrapper a.btn.btn-secondary {
        width: auto;
        margin-right: 12px
    }

    .reverse-asin-form h4 {
        text-align: left
    }

    .content-wrapper .container {
        border-radius: 6px
    }

    .menu-options-wrapper ul {
        float: right;
        width: auto;
        text-align: left;
        margin-top: 0
    }

    .menu-options-wrapper {
        margin: 2rem 0
    }

    .reverse-asin-form .result-description h5 {
        margin-top: 0
    }

    .reverse-asin-form.pd-option, .tab-pane.pd-option {
        padding: 2rem 1.5rem
    }

    .plans-wrapper .card.card-popular {
        margin-top: -10px
    }

    .cta-wrapper h2 {
        line-height: 54px;
        margin-bottom: 40px;
        font-size: 2.2rem
    }

    .result-wrapper .media .media-body {
        width: 200px
    }

    .content-wrapper.m-bottom-5 {
        margin-bottom: 90px
    }

    .result-wrapper .media img.product-image {
        width: 100px !important
    }
}

body, html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden
}

.logo {
    float: left;
    width: 180px;
    margin-top: 32px;
    margin-left: 40px
}

img1 {
    width: 100%;
    height: auto
}

.thumbnail {
    width: 300px;
    margin-left: auto;
    margin-right: auto
}

#bg-list-optimiz {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/bg_hero1.png) center right no-repeat;
    background-size: cover;
    width: auto;
    height: 60vh;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0
}

#heading-title {
    font-size: 58px
}

.zonbaselogo-style {
    width: 148px;
    margin-left: 30px
}

#btn_transparent1 {
    color: var(--text-white);
    background-color: rgba(255, 255, 255, 0);
    border: 1px solid;
    padding: 10px 65px 10px 65px;
    border-radius: 55px
}

#btn_transparent1:hover {
    color: var(--text-white);
    background-color: orange;
    border: 1px solid;
    padding: 10px 65px 10px 65px;
    border-radius: 55px
}

#btn_transparent {
    color: var(--text-white);
    background-color: rgba(255, 255, 255, 0);
    border: 2px solid;
    padding: 10px 35px;
    border-radius: 55px
}

#btn_transparent:hover {
    color: var(--text-white);
    background-color: orange;
    border-color: transparent;
    border-radius: 55px
}

#btn_text {
    color: var(--text-white);
    background-color: rgba(255, 255, 255, 0)
}

#btn_text:hover {
    color: orange;
    background-color: none
}

#btn_border_only {
    color: orange;
    border: 1px solid;
    padding: 10px 50px
}

#btn_orange {
    background-color: orange;
    color: var(--text-white);
    padding: 15px 40px;
    border-radius: 55px
}

#btn_orange:hover {
    background-color: orange;
    color: var(--text-white);
    padding: 15px 40px;
    border-radius: 55px;
    border: 1px solid
}

#btn_orange_sml {
    background-color: orange;
    color: var(--text-white);
    padding: 10px 40px;
    border-radius: 55px
}

#btn_orange_sml:hover {
    background-color: #ff8c00;
    color: var(--text-white);
    padding: 10px 40px;
    border-radius: 55px;
    border: 1px solid
}

.caption {
    margin-top: 100px
}

.bottom-left {
    position: absolute;
    bottom: 8px;
    left: 16px
}

.main_menu {
    float: left;
    margin-top: 53px;
    margin-left: 7px
}

.main_menu ul {
    list-style-type: none;
    position: absolute;
    padding: 1px;
    color: #ffff;
    text-decoration: none
}

.main_menu ul li {
    display: inline-block;
    margin: 0 2px
}

.main_menu ul li a {
    font-weight: 700;
    text-decoration: none;
    color: var(--text-white);
    padding: 5px 10px;
    letter-spacing: 2px
}

.main_menu ul li a:hover {
    font-weight: 700;
    text-decoration: none;
    color: #ffc166;
    padding: 5px 10px;
    letter-spacing: 2px
}

.login-Signup {
    margin-top: 52px
}

.login-Signup ul {
    list-style-type: none
}

.login-Signup ul li {
    display: inline-block
}

.login-Signup ul li a {
    margin-left: 40px
}

.signup {
    text-decoration: none;
    list-style-type: none;
    border: 1px solid;
    border-style: solid;
    padding: 10px 25px;
    font-size: 15px;
    border-radius: 25px;
    color: var(--text-white);
    font-weight: 700
}

.signup:hover {
    font-weight: 700;
    text-decoration: none;
    list-style-type: none;
    font-style: none;
    color: var(--text-white);
    background: orange
}

.login {
    margin-bottom: 20px;
    color: var(--text-white);
    font-weight: 700
}

.login:hover {
    font-weight: 700;
    text-decoration: none;
    color: #ffc166
}

.tryit {
    background-color: orange;
    font-weight: 1000;
    padding: 5px 25px;
    border: 1px solid;
    border-radius: 25px;
    color: #ffff;
    text-decoration: none
}

.tryit:hover {
    list-style-type: none;
    background-color: #333;
    font-weight: 1000;
    padding: 5px 25px;
    border: 1px solid;
    border-radius: 25px;
    color: #ffff;
    text-decoration: none
}

.TryitNow-btn {
    margin-top: 50;
    background-color: orange;
    font-weight: 1000;
    padding: 5px 25px;
    border: 1px solid;
    border-radius: 25px;
    color: #ffff;
    text-decoration: none
}

.TryitNow-btn:hover {
    margin-top: 50;
    list-style-type: none;
    background-color: #333;
    font-weight: 1000;
    padding: 5px 25px;
    border: 1px solid;
    border-radius: 25px;
    color: #ffff;
    text-decoration: none
}

.center_text {
    margin-bottom: 50px;
    text-decoration: none;
    position: absolute;
    top: 200px;
    left: 50px;
    text-align: left
}

.intro {
    width: 1100px;
    margin-left: auto;
    margin-right: auto
}

.main_container {
    margin-left: auto;
    margin-right: auto;
    width: 900px;
    color: #000
}

.images {
    float: none;
    width: 280px;
    margin: 50px;
    padding: 10px;
    margin-bottom: 20px
}

.mid-content {
    margin-top: 50px;
    padding: 76px;
    width: 419px;
    text-align: left
}

.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: 0;
    margin-left: 0
}

.col-md-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    /*max-width: 39%*/
}

.line {
    border-top: 1px solid #ddd;
    width: 100%;
    color: gray;
    height: 2px
}

.testimonial {
    padding: 50px
}

.checked {
    color: orange
}

.photo {
    width: 50px;
    border-radius: 25px
}

.testimonial_content {
    margin-right: 156px;
    padding: 0;
    float: left;
    margin-left: -77px
}

.cont {
    margin-top: 200px;
    padding: 10px;
    width: 1000px;
    margin-left: auto;
    margin-right: auto
}

.getstarted_btn {
    margin-top: 50px;
    float: right;
    list-style-type: none;
    color: orange;
    background-color: var(--bg-white);
    font-weight: 700;
    padding: 20px 35px;
    border: 1px solid;
    border-radius: 45px;
    text-decoration: none
}

.getstarted_btn:hover {
    margin-top: 50px;
    float: right;
    list-style-type: none;
    color: var(--text-white);
    background-color: #333;
    font-weight: 700;
    padding: 20px 35px;
    border: 1px solid;
    border-radius: 45px;
    text-decoration: none
}

.toprow-content {
    margin-top: 40px;
    float: left
}

.botrow-content {
    margin-top: 40px;
    margin-left: 40px;
    width: 300px
}

.hyperLink {
    color: #ffd03d
}

.hyperLink:hover {
    list-style-type: none;
    text-decoration: none;
    color: #fff
}

#footer {
    clear: both;
    background-color: var(--text-dull);
    color: var(--text-white);
    height: 200px
}

#footer2 {
    clear: both;
    background-color: #ff7d00;
    color: var(--text-white);
    height: 400px
}

.fab {
    word-spacing: 40px;
    padding: 10px;
    font-size: 15px;
    width: 35px;
    text-align: center;
    text-decoration: none;
    color: orange;
    background-color: var(--bg-white);
    border-radius: 25px
}

.fab:hover {
    word-spacing: 40px;
    padding: 10px;
    font-size: 15px;
    width: 35px;
    text-align: center;
    text-decoration: none;
    color: var(--text-white);
    background-color: var(--text-dull);
    border-radius: 25px
}

.no-gutters {
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0
}

.allrights {
    margin-top: 50px;
    margin-left: 30px;
    word-spacing: 5px
}

.dots-left::before {
    content: '';
    width: 115px;
    height: 115px;
    position: absolute;
    top: -50px;
    left: 74%;
    z-index: -1;
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/dot.svg)
}

.dots-right::before {
    content: '';
    width: 115px;
    height: 115px;
    position: absolute;
    top: -50px;
    left: 3%;
    z-index: -1;
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/dot.svg)
}

#background-orange {
    clear: both;
    background-color: #E6BC6D;
    color: var(--text-white);
    height: 500px
}

.logo2 {
    float: left;
    width: 137px;
    margin-top: 48px;
    margin-left: 56px
}

.midtext {
    font-size: 29px;
    margin-top: 98px;
    width: 420px;
    display: inline-block;
    text-align: center;
    color: #fff
}

.talkicon {
    float: left;
    width: 48px;
    padding: none;
    margin: none
}

.middle_boxes {
    margin-left: auto;
    margin-right: auto;
    width: 1100px;
    height: 30px
}

.box-left-contanier {
    float: left;
    width: 550px;
    height: 500px
}

.box-left {
    margin-left: auto;
    margin-right: auto;
    width: 500px;
    background-color: #ffe07a;
    color: var(--text-black);
    margin-top: 20px;
    height: 50px
}

.box-left-extnd {
    box-shadow: 1px 50px 50px #ddd;
    margin-top: 0;
    padding: none;
    margin-left: auto;
    margin-right: auto;
    width: 500px;
    background-color: var(--bg-white);
    color: var(--text-black);
    text-align: left;
    height: 250px
}

.box-left-head {
    font-weight: 700;
    margin: 10px;
    padding: 10px
}

.box-left-text {
    margin-left: 20px;
    padding: 15px
}

.box-right-contanier {
    float: right;
    width: 550px;
    height: 600px
}

.box-right {
    margin-left: auto;
    margin-right: auto;
    width: 500px;
    background-color: #ffe07a;
    color: var(--text-black);
    margin-top: 20px;
    text-align: left;
    height: 50px
}

.box-right-extnd {
    box-shadow: 1px 50px 50px #ddd;
    margin-left: auto;
    margin-right: auto;
    width: 500px;
    background-color: var(--bg-white);
    color: var(--text-black);
    text-align: left;
    height: 250px
}

.box-right-head {
    font-weight: 700;
    margin: 10px;
    padding: 10px
}

.box-right-text {
    margin-left: 20px;
    padding: 15px;
    width: 450px
}

.clearance {
    clear: both;
    background-color: #f2f2f2;
    height: 500px;
    display: solid;
    padding: 50px;
    margin-top: 500px
}

.clearance1 {
    clear: both;
    height: 400px;
    display: solid;
    padding: 50px;
    margin-top: 500px
}

.clearance2 {
    clear: both;
    background-color: #f2f2f2;
    display: solid;
    padding: 50px;
    margin-top: 300px
}

.toggle_button {
    background-color: var(--bg-white);
    width: 250px;
    height: 50px;
    border-radius: 25px;
    font-size: 14px;
    shape-margin: 1px 1px 1px grey
}

.toggle_button ul {
    list-style-type: none;
    text-decoration: none
}

.toggle_button ul li {
    display: inline-block
}

.toggle_button ul li a {
    background-color: var(--bg-white);
    padding: 10px 10px
}

#back_grey {
    background-color: #f9f9f9;
    padding: 0;
    margin: 0
}

#font_color {
    color: #ffd03d
}

#center_this {
    background-color: tan;
    padding-right: 200px;
    padding-left: 200px;
    padding-bottom: 50px
}

#image_size {
    width: 150px
}

#button_style {
    background-color: #696969;
    border-radius: 30px;
    color: #fff
}

#border_box {
    z-index: -1;
    background-color: var(--bg-white);
    margin: 0;
    margin-top: 40px;
    padding: 0;
    min-width: 280px;
    margin-bottom: 40px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px
}

#border_box1 {
    box-shadow: 1px 1px 10px orange;
    border: 1px solid;
    border-color: orange;
    margin: 0;
    padding: 0;
    background-color: var(--bg-white);
    min-width: 280px;
    display: block;
    border-radius: 4px
}

#padding_boxes {
    padding-right: 10%;
    padding-left: 10%;
    padding-bottom: 50px
}

#navbarSupportedContent ul li a {
    color: #fff
}

#navbarSupportedContent ul li a:hover {
    color: #ffc166;
}

#navbarSupportedContent ul {
    margin-left: auto;
    margin-right: auto;
    text-align: center
}

#navbarSupportedContent ul li {
    padding: 5px
}

#navbarSupportedContent ul li a {
    padding-left: 20px;
    padding-right: 20px
}

#background-oranges-sml {
    background-color: #E6BC6D;
    height: 130px;
    font-weight: 700
}

#oval_button {
    border: 1px solid;
    border-color: var(--text-white);
    border-radius: 25px;
    border-style: solid
}

#right_side_button {
    position: relative;
    bottom: 25px
}

#companylogotopleft {
    position: relative;
    left: 30px
}

.midtext1 {
    position: relative;
    left: 1px;
    font-size: 48px;
    margin-top: 98px;
    width: 800px;
    display: inline-block;
    text-align: left;
    color: var(--text-black);
    padding: none;
    clear: both
}

.container2 {
    width: 900px;
    margin-left: auto;
    margin-right: auto
}

.container3 {
    width: 150px;
    margin-left: 50px;
    margin-right: 20px
}

.overlap_text {
    position: absolute;
    left: 100px;
    top: 40px
}

.dot_img {
    width: 150px;
    float: left;
    padding: none;
    margin: none
}

.midtxt {
    clear: both;
    text-align: center;
    margin-top: 150px;
    font-size: 25px;
    height: 80px
}

.centerer {
    padding: none;
    margin: none;
    clear: both;
    height: 300px;
    clear: both
}

.btn-contanier {
    padding: 5px 10px;
    background-color: var(--bg-white);
    width: 330px;
    margin-left: auto;
    margin-right: auto;
    height: 55px;
    border-radius: 25px;
    box-shadow: 10px 10px 50px grey;
    border-bottom: 50px
}

.btn-left a {
    width: 150px;
    float: left;
    display: block;
    color: var(--text-black);
    list-style-type: none;
    padding: 10px 20px;
    border-radius: 20px;
    text-align: center;
    border-color: #000
}

.btn-left a:hover {
    list-style-type: none;
    text-decoration: none;
    background-color: grey
}

.btn-right a {
    list-style-type: none;
    text-decoration: none;
    float: right;
    color: var(--text-white);
    background-color: orange;
    width: 150px;
    text-align: center;
    padding: 10px 20px;
    border-radius: 20px
}

.btn-right a:hover {
    list-style-type: none;
    text-decoration: none;
    background-color: grey
}

.maintcontain {
    margin-top: 200px;
    width: 900px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 150px
}

.img-frnt-sml {
    margin-top: 30px;
    margin-bottom: 20px;
    width: 120px
}

.img-frnt-medium {
    width: 220px;
    padding-top: 20px;
    margin-top: -50px;
    margin-left: auto;
    margin-right: 20px
}

.left-cont {
    background-color: var(--bg-white);
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    height: 580px
}

.mid-cont {
    background-color: var(--bg-white);
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    height: 660px;
    margin-top: -40px;
    border-color: 2px orange;
    border: 1px solid;
    border-color: orange
}

.right-cont {
    background-color: var(--bg-white);
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    height: 580px
}

.pricetag {
    color: orange;
    font-weight: none;
    font-size: 42px
}

.sml-line {
    margin-bottom: 20px;
    margin-top: 10px;
    display: block;
    padding: .5px;
    background-color: #f2f2f2;
    width: 200px;
    margin-left: auto;
    margin-right: auto
}

.centerer-text {
    width: 250px;
    margin-left: auto;
    margin-right: auto
}

.StartNowbtn {
    list-style-type: none;
    background-color: #5e5e5e;
    font-weight: 1000;
    padding: 5px 25px;
    border: 1px solid;
    border-radius: 25px;
    color: #ffff;
    text-decoration: none;
    width: 200px;
    margin-left: auto;
    margin-right: auto
}

.StartNowbtn:hover {
    background-color: orange;
    font-weight: 1000;
    padding: 5px 25px;
    border: 1px solid;
    border-radius: 25px;
    color: #ffff;
    text-decoration: none
}

.img-frnt-tiny {
    width: 70px;
    float: left
}

.features {
    padding-right: 50px;
    height: 50px;
    width: 290px;
    display: block;
    padding: 10px 10px;
    clear: both;
    margin-bottom: -1px;
}

.features2 {
    margin-left: auto;
    margin-right: auto;
    height: 50px;
    width: 190px;
    display: block;
    padding: 10px 10px;
    text-align: center
}

.feature-bckgrnd {
    background-color: var(--bg-white);
    position: static;
    margin-top: 300px;
    height: 550px;
    margin-left: auto;
    margin-right: auto
}

.feature-container {
    padding-top: 50px;
    position: static;
    margin-top: 300px;
    width: 800px;
    height: 500px;
    margin-left: auto;
    margin-right: auto
}

.check {
    background-color: orange;
    height: 24px;
    width: 24px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    font-weight: 700;
    color: #fff
}

#check {
    padding-bottom: 0;
    margin-bottom: 0;
    background-color: orange;
    height: 24px;
    width: 24px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    font-weight: 700;
    color: #fff
}

.exis {
    background-color: #e0e0e0;
    height: 24px;
    width: 24px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    font-weight: 700;
    color: #fff
}

#exis {
    padding-bottom: 0;
    margin-bottom: 0;
    background-color: #e0e0e0;
    height: 24px;
    width: 24px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    font-weight: 700;
    color: #fff
}

.row-background {
    background-color: #f9f9f9
}

.footer-container {
    margin-top: -200px
}

.carousel-control-next-icon1:after {
    content: '>';
    font-size: 55px;
    color: orange
}

.carousel-control-prev-icon1:after {
    content: '<';
    font-size: 55px;
    color: orange
}

.image1 {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/il_cus01.jpg) left top no-repeat;
    width: 380px;
    height: 340px;
    position: relative
}

.image1:hover > .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--bg-black);
    opacity: .5;
    transition: .3s
}

.image2 {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/il_cus02.jpg) left top no-repeat;
    width: 380px;
    height: 340px;
    position: relative;
    border-radius: 60px
}

.image2:hover > .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--bg-black);
    opacity: .5;
    transition: .3s
}

.image3 {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/il_cus03.jpg) left top no-repeat;
    width: 380px;
    height: 340px;
    position: relative;
    transition: .3s
}

.image3:hover > .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--bg-black);
    opacity: .5;
    transition: .3s
}

.image4 {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/il_cus04.jpg) left top no-repeat;
    width: 380px;
    height: 299px;
    position: relative;
    transition: .3s
}

.image4:hover > .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--bg-black);
    opacity: .5;
    transition: .3s
}

.image5 {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/il_cus05.jpg) left top no-repeat;
    width: 380px;
    height: 300px;
    position: relative;
    transition: .3s
}

.image5:hover > .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--bg-black);
    opacity: .5;
    transition: .3s
}

.image6 {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/illustrations/il_cus06.jpg) left top no-repeat;
    width: 380px;
    height: 300px;
    position: relative;
    transition: .3s
}

.image6:hover > .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: var(--bg-black);
    opacity: .5;
    transition: .3s
}

.arrow-right {
    width: 0;
    height: 0;
    border-top: 50px solid rgba(0, 0, 0, .1);
    border-left: 100px solid var(--color-white);
    border-bottom: 50px solid transparent
}

#cover {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .8);
    z-index: 5;
    width: 100%;
    height: 100%;
    display: none
}

#pop-up-screen {
    width: 450px;
    height: 600px;
    position: fixed;
    top: calc(30% - 50px);
    left: calc(40% - 50px);
    z-index: 10;
    display: none;
    background: url(img/pop_up.jpg) no-repeat;
    background-size: 450px 600px;
    border: 5px solid #ccc;
    border-radius: 10px
}

#pop-up-screen:target, #pop-up-screen:target + #cover {
    display: block;
    opacity: 2
}

.select {
    display: block;
    width: 279px;
    height: 230px;
    padding: 10px;
    background: url(img/pop_up.jpg);
    box-shadow: 2px 2px 20px #d3d3d3
}

.cancel {
    display: block;
    position: absolute;
    top: -45px;
    right: -5px;
    background: rgb(245, 245, 245, 0);
    color: grey;
    height: 30px;
    width: 35px;
    font-size: 30px;
    text-decoration: none;
    text-align: center;
    font-weight: 700
}

.center-boxes {
    width: 1000px;
    margin-left: auto;
    margin-right: auto
}

.backgcolor {
    background-color: #f9f9f9;
    height: 1100px
}

.clearance-customer-page {
    clear: both;
    background-color: #f9f9f9;
    padding: 50px;
    margin-top: 783px
}

.clearance-customer-page1 {
    clear: both;
    background-color: #f9f9f9;
    padding: 50px;
    margin-top: 668px
}

#box1 {
    width: 279px;
    background-color: tan;
    box-shadow: 2px 2px 20px #d3d3d3;
    overflow: hidden;
    max-width: 279px;
    min-width: 300px;
    bottom: 0;
    display: block
}

.customer-think-box {
    width: 900px;
    height: 10px;
    margin-left: auto;
    margin-right: auto
}

.sml-circle-pic {
    margin-top: 30px;
    position: relative;
    left: 48%;
    width: 60px;
    height: 60px;
    border-radius: 100%;
    padding: none
}

.cnter-text {
    margin-left: auto;
    margin-right: auto;
    text-align: center
}

.mid-para {
    font-size: 26px;
    text-align: center;
    font-family: Georgia, "Times New Roman", Times, serif
}

.centerer01 {
    padding: none;
    margin: none;
    clear: both;
    height: 300px;
    clear: both
}

.overlap_text1 {
    position: absolute;
    left: 100px;
    top: 40px
}

.qoute-cntr {
    width: 100px;
    margin-left: auto;
    margin-right: auto
}

blockquote {
    border: none;
    font-family: Georgia, "Times New Roman", Times, serif;
    margin-bottom: -30px
}

blockquote h3 {
    clear: both;
    font-size: 31px
}

blockquote h3:before {
    content: open-quote;
    font-weight: 700;
    font-size: 150px;
    color: orange
}

.midtext01 {
    position: relative;
    left: 1px;
    font-size: 48px;
    margin-top: 98px;
    width: 800px;
    display: inline-block;
    text-align: left;
    color: var(--text-black);
    padding: none;
    clear: both
}

.container03 {
    width: 500px;
    margin-left: auto;
    margin-right: auto
}

.google-logo {
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/sml_google_logo.jpg);
    background-position: left;
    background-repeat: no-repeat
}

.facebook-logo {
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_facebook_logo.jpg);
    background-position: left;
    background-repeat: no-repeat
}

h4 span {
    align-content: center;
    letter-spacing: 1px;
    position: relative;
    bottom: -10px;
    font-size: 14px;
    background: var(--bg-white);
    padding: 3px 10px
}

h4 span:after, h4 span:before {
    background-color: #d3d3d3;
    content: "";
    display: inline-block;
    height: 1px;
    position: relative;
    vertical-align: middle;
    width: 10%
}

h4 span:before {
    right: 1.5em;
    margin-left: -40%
}

h4 span:after {
    left: 1.5em;
    margin-right: -40%
}

#background-orange-long {
    clear: both;
    background-color: #E6BC6D;
    color: var(--text-white);
    height: 600px
}

.container_login {
    border-radius: 20px;
    margin-top: 100px;
    width: 800px;
    height: 900px;
    margin-left: auto;
    margin-right: auto
}

.welcome-container {
    background-color: var(--bg-white);
    min-height: 600px;
    max-height: 600px;
    max-width: 450px;
    min-width: 350px;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px
}

#padding {
    margin-left: 10%;
    margin-right: 10%;
    padding-bottom: 50px
}

.midpic {
    filter: contrast(165%) brightness(70%);
    max-width: 100%;
    padding: none;
    margin: none;
    max-width: 450px;
    min-width: 350px;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    min-height: 600px
}

.login-google {
    display: block;
    padding: 10px 25px;
    border-radius: 5px;
    background-color: var(--bg-white);
    position: relative;
    right: 10px;
    height: 50px;
    box-shadow: 1px 1px 10px grey;
    width: 350px;
    margin-right: auto;
    margin-left: auto
}

.btn-login {
    color: var(--text-white);
    background-color: orange;
    width: 360px;
    margin-left: auto;
    margin-right: auto;
    height: 40px;
    margin-top: 15px;
    border-radius: 5px;
    border: none
}

.btn-login:hover {
    color: var(--text-white);
    background-color: #d3d3d3;
    width: 360px;
    margin-left: auto;
    margin-right: auto;
    height: 40px;
    margin-top: 15px;
    border-radius: 5px;
    border: none
}

.welcome {
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    font-size: 28px;
    margin-bottom: 20px;
    margin-top: 20px
}

.line1 {
    border-top: 1px solid #ddd;
    width: 90px;
    color: gray;
    height: 2px
}

.line2 {
    top: -21px;
    left: 275px;
    position: relative;
    border-top: 1px solid #ddd;
    width: 80px;
    color: gray;
    height: 2px
}

.or {
    position: relative;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    top: -13px;
    right: 5px;
    font-size: 12px;
    letter-spacing: 1px;
    color: #d3d3d3;
    font-weight: 700;
    letter-spacing: 2px
}

.herepass {
    width: 345px;
    padding: 7px 10px;
    margin: 10px;
    border: 2px;
    border-color: #d3d3d3;
    border-radius: 5px;
    border-style: solid
}

.here-email {
    width: 345px;
    padding: 7px 10px;
    margin: 10px;
    border: 2px;
    border-color: #d3d3d3;
    border-radius: 5px;
    border-style: solid
}

.align-text {
    position: relative;
    top: 25px
}

.forget-btn {
    color: orange;
    float: right;
    margin-right: 15px;
    list-style-type: none;
    text-decoration: none
}

.forget-btn1 {
    color: orange;
    float: right;
    margin-right: 15px;
    list-style-type: none;
    text-decoration: none
}

.forget-btn:hover {
    color: orange;
    float: right;
    margin-right: 15px
}

.dont-have {
    margin-top: 20px;
    text-align: center
}

.dont-have-sign-up {
    color: orange
}

.dont-have-sign-up:hover {
    color: orange
}

.smal_google_logo {
    width: 20px;
    padding: none;
    margin: none
}

.top-left-corner {
    position: relative;
    bottom: 34rem;
    right: -3rem;
    width: 100px
}

.float-text {
    position: relative;
    bottom: 160px;
    left: 55px;
    margin: none;
    padding: none;
    color: #fff
}

.Sign-Up {
    margin-top: 20px;
    background-color: var(--bg-white);
    width: 500px;
    height: 750px;
    color: var(--text-black);
    text-align: left;
    padding-top: 5px;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto
}

.line3 {
    border-top: 1px solid #ddd;
    width: 60px;
    color: gray;
    height: 2px
}

.line4 {
    top: -25px;
    left: 340px;
    position: relative;
    border-top: 1px solid #ddd;
    width: 60px;
    color: gray;
    height: 2px
}

.sign-up-contanier {
    width: 400px;
    margin-left: auto;
    margin-right: auto
}

.clearance3 {
    clear: both;
    display: solid;
    padding: 10px;
    margin-top: 500px
}

.messenger {
    color: #1e88e5;
    text-align: center
}

.btn-create {
    color: var(--text-white);
    background-color: orange;
    width: 350px;
    margin-left: 20px;
    margin-right: auto;
    height: 40px;
    margin-top: 15px;
    border-radius: 5px
}

#nova1 {
    background: linear-gradient(#E6BC6D, #E6BC6D) 0 0/100% 60% no-repeat
}

#crop {
    max-width: 700px;
    max-height: 550px;
    overflow: hidden
}

.icon-container {
    position: relative;
    text-align: center;
    color: #fff
}

.icon-dart {
    position: absolute;
    top: -40px;
    left: -100px
}

.icon-lens {
    position: absolute;
    top: 55%;
    left: -70px
}

.icon-clipboard {
    position: absolute;
    top: 20%;
    left: -110px;
    z-index: -1
}

.icon-rocket {
    position: absolute;
    top: -45px;
    right: -100px;
    z-index: -1
}

.icon-board {
    position: absolute;
    top: 45%;
    right: -55px
}

.icon-trophy {
    position: absolute;
    top: 20%;
    right: -100px
}

section.two-colmn {
    padding-top: 50px
}

section.two-colmn h1 {
    padding-top: 90px
}

section .header-content {
    position: relative;
    top: -400px;
    height: 90px
}

section .header-content h1 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 55px;
    color: #fff
}

section h5 {
    font-family: "Avenir LT W01_35 Light1475496";
    color: #fff
}

.avenr-bold {
    font-family: "Avenir LT W01_85 Heavy1475544"
}

section.upper_content h1 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 35px
}

section.upper_content p {
    font-family: "Avenir LT W01_35 Light1475496";
    font-size: 22px
}

section.upper_content h6 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 22px;
    color: #E6BC6D
}

section.three-colmn p {
    font-size: 15px
}

section.three-colmn h6 {
    font-family: "Avenir LT W01_85 Heavy1475544"
}

.two-colmn h1 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 55px
}

.two-colmn b {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 55px;
    color: #E6BC6D
}

.two-colmn h6 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 18px;
    color: #E6BC6D
}

section.content-how-we h4 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 40px
}

.holder-how-we {
    max-width: 1050px
}

.holder-how-we p {
    font-size: 20px
}

section.content-how-we h6 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 20px;
    color: #E6BC6D
}

.content-amazon-product h3 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 35px;
    color: #fff
}

.content-amazon-product h3 b {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 35px;
    color: #E6BC6D
}

section.content-amazon-product div.bg-amazon-product {
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/bg_amazon_product.jpg);
    background-size: cover
}

.v-line:after {
    content: "";
    position: absolute;
    z-index: -1;
    top: -50px;
    left: 50%;
    border-left: 2px solid #f2f2f2;
    height: 260px
}

.v-line-end:after {
    content: "";
    position: absolute;
    z-index: -1;
    top: -40px;
    left: 50%;
    border-left: 2px solid #f2f2f2;
    height: 170px
}

.boxleft {
    background: var(--bg-white);
    padding: 30px;
    text-align: justify;
    border: 2px solid #f2f2f2;
    position: relative
}

.boxright {
    background: var(--bg-white);
    padding: 30px;
    text-align: justify;
    border: 2px solid #f2f2f2
}

.boxleft:before {
    content: '';
    width: 30px;
    height: 30px;
    background: var(--bg-white);
    position: absolute;
    top: 30px;
    left: 100.3%;
    transform: translateX(-50%) rotate(45deg);
    border-top: 2px solid #f2f2f2;
    border-right: 2px solid #f2f2f2;
    z-index: 1
}

.boxright:before {
    content: '';
    width: 30px;
    height: 30px;
    background: var(--bg-white);
    position: absolute;
    top: 40px;
    left: -.5%;
    transform: translateX(-50%) rotate(45deg);
    border-bottom: 2px solid #f2f2f2;
    border-left: 2px solid #f2f2f2
}

.container-form label {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 16px
}

footer h2 {
    font-family: "Avenir LT W01_85 Heavy1475544";
    font-size: 40px
}

footer .content-ready-to p {
    font-family: "Avenir LT W01_35 Light1475496";
    font-size: 20px
}

footer a button {
    font-weight: bolder !important
}

#nav_container {
    background-color: #d3d3d3;
    height: 900px;
    width: 30%;
    float: left
}

#main_contanr {
    background-color: tan;
    height: 900px;
    width: 70%;
    float: right
}

#font_color {
    color: #ffd03d
}

.btn-white {
    background-color: var(--bg-white);
    color: #ff8c00
}

.btn-white:hover {
    background-color: #ff8c00;
    color: #fff
}

.header-hompage {
    color: #fff
}

.btn-black {
    background-color: #262626;
    color: var(--text-white);
    padding: 15px 35px 15px 35px !important;
    border-radius: 1px;
    border: 0 solid;
    border-radius: 25px !important
}

.btn-black:hover {
    background-color: orange;
    color: var(--text-white);
    padding: 15px 35px 15px 35px !important;
    border-radius: 1px;
    border: 0 solid
}

.hero1 {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/hero_zonbase.png) center right no-repeat;
    background-size: cover;
    max-width: auto;
    height: 513px;
    position: relative;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0
}

.bg-footer {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/bg_footer.png) center center no-repeat;
    background-size: cover;
    max-width: auto;
    min-height: 166px;
    position: relative;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0
}

.bg-circle {
    background: url('https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/object/object_leftside_circle.png') center right no-repeat;
    max-width: auto;
    max-height: auto;
    padding-top: 100px;
    padding-bottom: 100px;
    position: relative
}

.bg-gray-circle {
    background: url('https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/object/object_gray_circle_left.png') center left no-repeat;
    max-width: auto;
    max-height: auto;
    position: relative;
    background-color: #f8f8f8
}

.bg-gray-right {
    background: url('https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/object/object_gray_circle_right.png') center right no-repeat;
    max-width: auto;
    max-height: auto;
    position: relative;
    background-color: #f8f8f8
}

.bg-left-orange-circle {
    background: url('https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/object/object_left_orange_circle.png') center left no-repeat;
    max-width: auto;
    max-height: auto;
    position: relative
}

@media (max-width: 897px) and (min-width: 768px) {
    form.my-auto {
        width: 100%
    }

    form.my-auto a#btn_text, form.my-auto a#btn_transparent {
        display: inline-block
    }

    form.my-auto a#btn_transparent {
        width: 50%;
        padding: .375rem .75rem
    }

    form.my-auto a#btn_text {
        width: 40%
    }
}

a.text-B9B9B9 {
    color: #b9b9b9 !important
}

#bg-login {
    background-image: url('https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/backgrounds/bg_login.png');
    background-repeat: no-repeat;
    background-size: cover;
    max-width: auto;
    max-height: auto
}

.signup-step-item {
    text-decoration: none;
    cursor: default
}

.signup-step-item:hover {
    text-decoration: none
}

.signup-step-item.done {
    cursor: pointer
}

.form-group .error-text {
    display: none
}

.form-group.has-error .error-text {
    display: inline-block
}

.form-group.has-error .error-text, .form-group.has-error label {
    color: red
}

.form-group.has-error .form-control {
    border-color: red;
    margin-bottom: 0 !important;
    color: red
}

.dark-column {
    border-radius: 5px 0 0 5px;
    background-color: #262626;
    text-align: center;
    padding: 32px;
    z-index: 2;
    box-shadow: 0 14px 20px rgba(82, 112, 112, .0181108)
}

.dark-column img {
    margin-bottom: 16px
}

.dark-column p {
    color: #fff
}

.dark-column .orange-circle {
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_circle_sm.svg);
    background-repeat: no-repeat;
    padding: 8px;
    height: 10px !important;
    margin-top: 4px;
    margin-right: 12px;
    margin-left: 6px;
    position: relative
}

.dark-column .orange-circle::after {
    content: '';
    border-right: 1px solid var(--color-orange);
    padding: 16px;
    height: 17px !important;
    z-index: 1;
    position: absolute;
    right: 8px
}

.dark-column .orange-circle-bg {
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_circle_md.svg);
    background-repeat: no-repeat;
    padding: 8px;
    height: 27px !important;
    width: 27px !important;
    margin-top: 0;
    margin-right: 8px;
    position: relative
}

.dark-column .orange-circle-bg::after {
    content: '';
    border-right: 1px solid var(--color-orange);
    margin-top: 13px;
    padding: 18px;
    height: 18px !important;
    z-index: 0;
    position: absolute;
    right: 13px
}

.dark-column .orange-circle-bg-noline {
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_circle_md.svg);
    background-repeat: no-repeat;
    padding: 8px;
    height: 27px !important;
    width: 27px !important;
    margin-top: 0;
    margin-right: 8px;
    position: relative
}

.dark-column .orange-circle-noline {
    background-image: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_circle_sm.svg);
    background-repeat: no-repeat;
    padding: 8px;
    height: 10px !important;
    margin-top: 4px;
    margin-right: 12px;
    margin-left: 6px;
    position: relative
}

.dark-column h6 {
    color: var(--text-white);
    text-align: left
}

.dark-column h5 {
    color: var(--text-white);
    text-align: left;
    position: relative
}

.dark-column img {
    margin-right: 9px
}

.light-column {
    background-color: var(--bg-white);
    border-radius: 0 5px 5px 0;
    box-shadow: 0 14px 20px rgba(82, 112, 112, .0181108)
}

.light-column h1 {
    font-size: 25px;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.light-column h2 {
    font-size: 17px
}

.light-column h2 u {
    font-size: 17px;
    color: var(--text-orange);
    text-decoration: underline
}

.sub-left-col {
    background: var(--bg-white);
    border: 1px solid #ebd2ac;
    box-sizing: border-box;
    border-radius: 7px
}

.sub-left-col .sub-upper {
    background: #fffbf5;
    border-bottom: 1px solid #ebd2ac;
    border-radius: 7px 7px 0 0
}

.sub-left-col .sub-upper .d-flex span {
    padding-top: 23px
}

.sub-upper {
    padding: 24px 24px 0 24px
}

.sub-upper h4 {
    margin: 0;
    letter-spacing: 1px;
    font-size: 14px !important;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.sub-upper b {
    font-size: 14px;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.sub-upper p {
    font-size: 14px
}

.sub-upper p {
    font-size: 14px;
    margin-bottom: 8px
}

.sub-upper button {
    color: var(--text-white);
    width: 110px;
    height: 37px;
    background: #151515;
    border-radius: 2.16px;
    font-size: 14px;
    font-family: "Avenir LT W01_85 Heavy1475544" !important;
    border: 0;
    margin: 16px 0
}

.sub-upper .d-flex b {
    margin-top: -10px;
    height: 80px !important;
    font-size: 68.75px !important;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.sub-upper .d-flex p {
    font-size: 21.25px;
    padding-top: 6px;
    font-family: "Avenir LT W01_85 Heavy1475544" !important;
    padding-bottom: 8px
}

.sub-upper .d-flex span {
    padding-top: 13px;
    padding-left: 8px;
    text-align: left
}

.sub-upper .d-flex span b {
    font-size: 26.56px !important
}

.sub-lower {
    padding: 16px 16px 16px 16px
}

.sub-lower p {
    margin-bottom: 8px
}

.sub-lower p img {
    margin-bottom: 3px;
    margin-right: 3px
}

.sub-lower .btn-style-1 {
    margin: 12px 0;
    color: var(--text-white);
    width: 225px;
    height: 47px;
    background: var(--bg-orange);
    border-radius: 2.7px;
    border: 0;
    font-size: 20px;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.sub-left-col h3 {
    font-family: "Avenir LT W01_85 Heavy1475544" !important;
    font-weight: 700 !important;
    font-size: 15px;
    text-align: center;
    text-decoration-line: underline;
    color: #e02020
}

.sub-right-col {
    background: var(--bg-white);
    margin-bottom: 32px;
    box-shadow: 0 2px 11px rgba(0, 0, 0, .169089);
    border-radius: 0 0 7px 7px
}

.sub-right-col h5 {
    text-align: center;
    background-color: #151515;
    border-radius: 7px 7px 0 0;
    font-size: 11px;
    padding: 10px;
    margin-bottom: 0;
    letter-spacing: .55px;
    text-transform: uppercase
}

.sub-right-col .sub-upper img.icon-most-popular {
    position: absolute;
    left: -22px;
    top: 14px
}

.sub-right-col .sub-upper {
    background-color: var(--bg-orange);
    color: #fff
}

.sub-right-col h3 {
    font-family: "Avenir LT W01_85 Heavy1475544" !important;
    font-weight: 700 !important;
    font-size: 15px;
    text-align: center;
    text-decoration-line: underline;
    color: #e02020
}

.sub-right-col .sub-lower {
    border: 1px solid var(--color-orange);
    border-radius: 0 0 7px 7px
}

.switch-toggle p {
    margin-top: 2px;
    font-size: 16px
}

.step-indicator {
    border-radius: 14px
}

.step-indicator .loading-bar {
    border-radius: 14px 0 0 14px;
    color: var(--text-white);
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.step-indicator .loading-bar-full {
    border-radius: 14px 14px 14px 14px !important;
    color: var(--text-white);
    font-family: "Avenir LT W01_85 Heavy1475544" !important;
    background-image: linear-gradient(to right, var(--color-orange-2), var(--color-orange-3))
}

.georgia {
    font-family: Georgia, serif !important
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Avenir LT W01_45 Book1475508" !important
}

p {
    font-family: "Avenir LT W01_45 Book1475508" !important
}

.semibold {
    font-family: "Avenir LT W01_45 Book1475508" !important;
    font-style: normal;
    font-weight: 600
}

.bg-nav {
    background-color: var(--text-dark);
}

.normal {
    font-style: normal !important;
    text-decoration: none !important
}

u {
    text-decoration: none;
    border-bottom: 2px solid #fff
}

.text-B9B9B9 {
    color: #b9b9b9 !important
}

.text-b1b1b1 {
    color: #b1b1b1 !important
}

.uppercase {
    text-transform: uppercase
}

.bold {
    font-weight: 700 !important;
    font-family: "Avenir LT W01_55 Roman1475520"
}

.bolder {
    font-weight: 900 !important;
    font-family: "Avenir LT W01_55 Roman1475520"
}

.italic {
    font-style: italic
}

.fs-11 {
    font-size: 11px !important
}

.fs-12 {
    font-size: 12px !important
}

.fs-16 {
    font-size: 16px
}

.fs-17 {
    font-size: 17px !important
}

.fs-16-8 {
    font-size: 16.8px
}

.fs-18 {
    font-size: 18px !important
}

.fs-19-4 {
    font-size: 19.4px
}

.fs-20 {
    font-size: 20px
}

.fs-22 {
    font-size: 22px
}

.fs-14 {
    font-size: 14px
}

.fs-15 {
    font-size: 15px !important
}

.fs-24 {
    font-size: 24px
}

.fs-45 {
    font-size: 45px !important
}

.fs-48 {
    font-size: 48px !important
}

.fs-64 {
    font-size: 64px
}

.orange {
    color: #E6BC6D
}

.mt-8rem {
    margin-top: 9rem
}

.mt-15rem {
    margin-top: 15rem
}

.line-orange {
    border-bottom: 2px solid #E6BC6D;
    position: relative;
    top: -30px
}

.padding-35 {
    padding: 35px !important
}

.common-gradient {
    background: linear-gradient(346.19deg, var(--color-orange-3) 0, var(--color-orange-2) 99.78%);
    border-radius: 2.2px;
    border: none
}

.btn-homepage-format {
    border-radius: 35px !important;
    padding: 15px 47px 14px 47px !important;
    text-transform: uppercase;
    color: var(--text-white);
    background: linear-gradient(346.19deg, var(--color-orange-3) 0, var(--color-orange-2) 99.78%);
    border: none;
    box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3);
    font-weight: 700;
    font-size: 16.8px;
    letter-spacing: 1.47px !important
}

.btn-homepage-format:hover {
    border-radius: 35px !important;
    padding: 15px 47px 14px 47px;
    text-transform: uppercase;
    color: var(--text-white);
    background-color: #ff8c00
}

.socialmedia-btn a {
    padding-left: 20px
}

a.orange-hyperlink {
    color: #E6BC6D !important;
    text-decoration: underline
}

a.orange-hyperlink:hover {
    color: #ffb74b !important;
    text-decoration: underline
}

.btn-black {
    background-color: #262626;
    color: var(--text-white);
    padding: 15px 35px 15px 35px !important;
    border-radius: 1px !important;
    border: 0 solid #262626;
    border-radius: 50px 50px 50px 50px !important
}

.avatar {
    width: 128px;
    margin: 10px;
    border: 5px solid var(--color-white);
    border-radius: 500px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px
}

.shadow-orange {
    box-shadow: 0 12px 55px 2px rgba(254, 153, 1, .3)
}

.letterspace12 {
    letter-spacing: 1.2px !important
}

.letterspace147 {
    letter-spacing: 1.47px !important
}

.mt-6 {
    margin-top: 50px !important
}

.extra-bold {
    font-weight: 900 !important;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

label {
    font-size: 16px !important;
    margin-bottom: 3px;
    color: #000
}

.rounded-top-left {
    border-top-left-radius: 3px
}

.bg-FF9901 {
    background-color: var(--bg-orange)
}

.text-FF9901 {
    color: #ff9901
}

.underline {
    text-decoration: underline
}

.loading-bar {
    background-image: linear-gradient(to right, var(--color-orange-2), var(--color-orange-3))
}

.bg-EDEDED {
    background-color: #ededed
}

.bg-gradient {
    background-image: linear-gradient(to right, var(--color-orange-2), var(--color-orange-3));
    border: 0 !important
}

.border-EBD2AC {
    border: 1px solid #ebd2ac !important
}

.bg-FFFBF5 {
    background-color: #fffbf5 !important
}

.text-FF9900 {
    color: #E6BC6D !important
}

.text-FF0000 {
    color: red
}

.custom-select {
    background: 0 0 !important
}

.switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 30px;
    background-color: var(--bg-orange);
    border-radius: 20px;
    transition: all .3s
}

.switch::after {
    content: '';
    position: absolute;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: var(--bg-white);
    top: 3px;
    left: 2px;
    transition: all .3s;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .199055)
}

.checkbox:checked + .switch::after {
    left: 22px
}

.checkbox:checked + .switch {
    background-color: var(--bg-orange)
}

.checkbox {
    display: none
}

i.icon-check-gray-sm {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_check_gray_sm.svg) center center no-repeat;
    padding: 20px
}

i.icon-check-orange-sm {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_check_orange_sm.svg) center center no-repeat;
    padding: 20px
}

.check-list p {
    color: #bebebe;
    font-size: 12.6px;
    margin-bottom: 0;
    line-height: 22px
}

.column-F8F8F8 {
    background-color: #f8f8f8;
    border-radius: 3px
}

.column-F8F8F8 textarea {
    resize: none
}

.column-F8F8F87 textarea.form-control {
    border: 1px solid #d5d5d5 !important;
    border-radius: 3px !important
}

.column-F8F8F8 .form-control {
    border: 1px solid #d5d5d5 !important;
    border-radius: 3px !important
}

.column-F8F8F8 select.form-control {
    border: 1px solid #d5d5d5 !important;
    padding-left: 13px;
    font-size: 15px;
    line-height: 1;
    border: 0;
    border-radius: 3px !important;
    height: 40px !important;
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_select.svg) right no-repeat #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-position-x: 96%
}

.btn-orange-gradient {
    background: linear-gradient(90deg, var(--color-orange-2) 0, var(--color-orange-3) 100%) !important;
    box-shadow: 0 10px 25px rgba(250, 156, 25, .274694);
    border-radius: 3px;
    color: var(--text-white);
    border: 0 !important;
    font-size: 22px !important;
    letter-spacing: .19px !important;
    font-family: "Avenir LT W01_85 Heavy1475544" !important;
    width: 288px !important;
    height: 55px !important
}

.content-stp-3 label {
    font-size: 22px !important
}

.undrline {
    text-decoration: underline !important
}

.border-3 {
    border: 1px solid #d5d5d5;
    border-radius: 3px
}

.content-stp-3 .form-control {
    height: 40px;
    border: 1px solid #d5d5d5;
    border-radius: 3px
}

#signup-step1 .form-control {
    height: 40px;
    border: 1px solid #d5d5d5;
    border-radius: 3px
}

.needs-validation .form-control {
    height: 40px;
    border: 1px solid #d5d5d5;
    border-radius: 3px
}

.bg-lite-orange {
    background-color: #fffbf5;
    border: 1px solid #ebd2ac;
    border-radius: 3px;
    font-size: 16px
}

.bg-lite-orange p {
    font-size: 16px !important
}

.bg-lite-orange b {
    color: #E6BC6D;
    font-size: 16px !important
}

.border-bot-EBD2AC {
    border-bottom: 1px solid #ebd2ac
}

.bg-ornge {
    background-color: #fff9e7;
    border: 2px solid var(--color-orange);
    border-radius: 4px
}

.border-dash {
    background: var(--bg-white);
    border: 2px dashed var(--color-orange);
    box-sizing: border-box;
    border-radius: 3px
}

.bg-ornge-sm {
    background: #fff0c3;
    border-radius: 2px
}

.bg-ornge-sm label.custom-control-label {
    font-size: 15px !important;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.border-dash p {
    font-size: 14px
}

.border-dash p b {
    text-decoration: underline;
    color: #fa6400;
    font-size: 14px;
    font-family: "Avenir LT W01_85 Heavy1475544" !important
}

.agree-content label {
    font-size: 14px !important
}

.agree-content label a {
    color: #E6BC6D;
    text-decoration: underline;
    font-size: 14px !important
}

.btn-gradient-orgn {
    background: linear-gradient(90deg, var(--color-orange-2) 0, var(--color-orange-3) 100%);
    box-shadow: 0 10px 25px rgba(250, 156, 25, .274694);
    border-radius: 3px;
    font-family: Avenir Next LT Pro;
    font-style: normal;
    font-weight: 700;
    font-size: 22px;
    line-height: 26px;
    text-align: center;
    color: var(--text-white);
    border: 0;
    height: 55px
}

a.btn.btn-outline-light:hover {
    color: var(--text-black) !important;
    text-decoration: none !important
}

.card-image {
    height: 5%;
    width: 5%
}

.content-stp-3 select.form-control.custom-left {
    padding-left: 5rem;
    height: 44px !important;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none
}

select + i.icon-dropdown-left {
    position: absolute;
    margin-top: -33px;
    margin-left: 57px;
    background-color: transparent;
    padding-right: 5px
}

i.icon-dropdown-left {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_dropdown1.svg) no-repeat;
    width: 13px;
    height: 9px;
    display: inline-block
}

i.icon-flag-left {
    background: url(https://axdebntfdp.cloudimg.io/v7/zonbase.com/front-end/assets/img/icons/icon_flag_us.svg);
    width: 32px;
    height: 18px;
    display: inline-block;
    position: absolute;
    margin-top: -45px;
    margin-left: 0;
    background-color: transparent;
    padding-right: 5px
}

.bg-272727 {
    background-color: var(--bg-dark);
}

.fs-16 {
    font-size: 16px !important;
}

.ls-14 {
    letter-spacing: 1.4px;
}

.heavy {
    font-weight: 700;
}

.text-white {
    color: var(--text-white);
}

.link-style li {
    height: 30px;
    color: #B9B9B9;
}

.link-style li a {
    font-size: 15px;
    color: #B9B9B9;
}

.link-style li a:hover {
    color: #B9B9B9;
}

.border-top-3D3D3D {
    border-top: 1px solid #3D3D3D !important;
}

.heavy {
    font-family: "Avenir LT W01_85 Heavy1475544";
}

.ls-14 {
    letter-spacing: 1.4px;
}

.bg-black {
    background-color: var(--bg-black);
}