





    <div class="root responsivegrid">


<div class="aem-Grid aem-Grid--12 aem-Grid--default--12 ">
    
    <div class="embed aem-GridColumn aem-GridColumn--default--12">





<style type="text/css">@font-face {font-family:Montserrat;font-style:normal;font-weight:400;src:url(/cf-fonts/v/montserrat/5.0.16/cyrillic-ext/wght/normal.woff2);unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:400;src:url(/cf-fonts/v/montserrat/5.0.16/latin-ext/wght/normal.woff2);unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:400;src:url(/cf-fonts/v/montserrat/5.0.16/vietnamese/wght/normal.woff2);unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:400;src:url(/cf-fonts/v/montserrat/5.0.16/latin/wght/normal.woff2);unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:400;src:url(/cf-fonts/v/montserrat/5.0.16/cyrillic/wght/normal.woff2);unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:700;src:url(/cf-fonts/v/montserrat/5.0.16/latin-ext/wght/normal.woff2);unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:700;src:url(/cf-fonts/v/montserrat/5.0.16/latin/wght/normal.woff2);unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:700;src:url(/cf-fonts/v/montserrat/5.0.16/vietnamese/wght/normal.woff2);unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:700;src:url(/cf-fonts/v/montserrat/5.0.16/cyrillic/wght/normal.woff2);unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:700;src:url(/cf-fonts/v/montserrat/5.0.16/cyrillic-ext/wght/normal.woff2);unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:900;src:url(/cf-fonts/v/montserrat/5.0.16/latin-ext/wght/normal.woff2);unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:900;src:url(/cf-fonts/v/montserrat/5.0.16/cyrillic/wght/normal.woff2);unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:900;src:url(/cf-fonts/v/montserrat/5.0.16/cyrillic-ext/wght/normal.woff2);unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:900;src:url(/cf-fonts/v/montserrat/5.0.16/vietnamese/wght/normal.woff2);unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;font-display:swap;}@font-face {font-family:Montserrat;font-style:normal;font-weight:900;src:url(/cf-fonts/v/montserrat/5.0.16/latin/wght/normal.woff2);unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;font-display:swap;}</style>

<style>
.fixedAd {
    position: fixed;
    z-index: 1000;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2) !important;
}

.bannerAdOuterContainer {
    display: flex;
    justify-content: center;
    flex-direction: row;
    vertical-align: middle;
    align-items: center;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background-color: #1F2044;
    color: #FFF;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.bannerAdInnerContainer {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width: 100%;
    padding: 10px 5px;
}

.message {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.secondLine {
    display: none;
}

.messageTitle {
    display: block;
    margin: 0;
    text-align: center;
    align-items: center;
    word-wrap: break-word;
    color: #FFF !important;
    text-decoration: none !important;
    transition: ease-in-out 1s;
    font-weight: 700;
    font-size: 17px;
    line-height: 24px;
    font-family: 'Montserrat';
}

.highlight {
    background: #FF9144;
    color: #FFF;
    padding: 5px 0;
}


.ctaContainer {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cta {
    display: inline-block;
    background-color: #FFCF00;
    border-right: 1px solid #1F2044;
    border-bottom: 1px solid #1F2044;
    text-decoration: none;
    width: 113px;
    height: 36px;
    margin-left: 10px;
    text-align: center;
    text-decoration: none;
    opacity: initial;
    border: 0;
    transition: all .25s ease-in-out;
}

.cta:hover {
    color: #161616;
    box-shadow: 0px 2px 4px -1px rgb(0 0 0 / 20%), 0px 4px 5px 0px rgb(0 0 0 / 14%), 0px 1px 10px 0px rgb(0 0 0 / 12%);
}

.cta>a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-family: 'Montserrat';
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    color: #1f2044;
    transition: all .25s ease-in-out;

}

.cta:hover>a {
    color: #161616;
}

.hSm {
    display: none;
}

.hMed {
    display: block;
}

@media (min-width: 700px) {
    .bannerAdOuterContainer {
        width: 100%;
        height: 90px;
    }
    
    .bannerAdInnerContainer {
        flex-direction: column;
        padding: 10px 20px;
    }

    .secondLine {
        display: block;
    }

    .messageTitle {
        display: flex;
        font-size: 20px;
    }
    .cta {
        height: 34px;
        width: 135px;
        margin: 7px 0 0 0;
    }
    .cta>a {
        font-size: 16px;
    }
    
    .hSm {
        display: block;
    }

    .hMed {
        display: none;
    }
}

@media (min-width: 992px) {


    .messageTitle {
        font-size: 20px;
    }

    .cta {
        height: 34px;
        width: 135px;
        margin: 7px 0 0 30px;
    }
    .cta>a {
        font-size: 18px;
    }

    .hMed {
        display: none;
    }
}

@media (min-width: 1200px) {
    .bannerAdInnerContainer {
        flex-direction: row;
    }

    .message {
        display: flex;
        flex-direction: row;
    }

    .messageTitle {
        font-size: 36px;
        line-height: 42px;
    }

    .cta {
        height: 36px;
        width: 135px;
        margin: 0 0 0 30px;
    }
    .cta>a {
        font-size: 14px;
    }
}
</style>
<div class="bannerAdOuterContainer fixedAd">
    <div class="bannerAdInnerContainer">
        <div class="message">
            <div class="messageTitle">Save up to&nbsp;<span class="highlight">&nbsp;70% off.&nbsp;</span>&nbsp;<span><span class="Footer70OffHG">Start your website today!</span></span></div>
        </div>
        <div class="ctaContainer"><button class="cta"><a href="https://www.hostgator.com/web-hosting?channelid=P99C46098237S1N0B2A20D320E0000V100" data-element-location="sticky-footer" data-element-type="cta" data-element-label="seventy-off-sticky-footer">Start Saving</a></button></div>
    </div>
</div>
</div>

    
</div>
</div>








    





    
    




<script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'8c558bef2adbafb6',t:'MTcyNjcwNjY1OS4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>



<p>Please note that we're always working to improve our builder. We suggest that you watch this video, although it may look slightly different from your current editing experience.</p>

<div style="text-align: center;"><iframe height="315" src="https://www.youtube.com/embed/QTp42BajVKg?list=PLl8gcdjf_J_nU_myHJISdolfx7HSDqKEu&amp;wmode=opaque" width="560"></iframe></div>

<p>Visit the&nbsp;<a href="https://www.hostgator.com/help/article/website-builder-basic-style-tools" target="_self">Website Builder Basic Style Tools</a>&nbsp;article to see the alternative and updated instructions for customizing your website design with colors and fonts.</p>

Website Builder - How to Customize Your Website Design with Colors and Fonts