Subcribe Email UI

www.hollabacktexlogspot.comas.b

by MAz Mawan

HTML

<div id="hbtsubcribe">
    <div class="hbtsubcribe-wrapper"><font face="verdana"><p><b>Isi Email dan Segera Konfirm di email anda , anda sudah dapatkan berbagai Artikel Menarik Gratis perharinya !!!!</b> </p></font> 
        <div class="formhsubcribe">
            <form action="http://feedburner.google.com/fb/a/mailverify?uri=MazMawan" class="formhsubcribe" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=MazMawan', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
                <input name="uri" type="hidden" value="MazMawan" />
                <input name="loc" type="hidden" value="en_US" />
                <input class="hbtsubcribe-EF" name="email" autocomplete="off" placeholder=" Ketik Email disini... " />
                <input class="hbtsubcribe-EB" title="" type="submit" value="Submit" />
            </form>
        </div>
    </div>
</div>

CSS

<style scoped="scoped" type="text/css"> #hbtsubcribe {
    width:280px;
    border:1px solid #aaa;
    border-radius:3px;
    padding: 0;
}
.hbtsubcribe-wrapper {
    background: #98cdca;
    color:#fff;
    font-size:14px;
    line-height:20px;
    text-align:inherit;
    text-transform:uppercase;
    padding:1px 20px 10px;
}
.formsubcribe {
    clear:both;
    display:block;
    margin:10px 0;
}
form.SUBSCRIBE-LTB-form {
    clear:both;
    display:block;
    width:auto;
    margin:10px 0 0;
}
.hbtsubcribe-EF {
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    background:#fff;
    border:1px solid #ccc;
    border-radius:4px;
    color:#444;
    width:68%;
    margin:0 0 15px;
    padding:10px 40px;
}
.hbtsubcribe-EB {
    background:#3A4146;
    border:1px solid #444749;
    box-shadow:0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 1px 0 transparent;
    color:#fff;
    cursor:pointer;
    font-family:verdana;
    font-weight:700;
    text-shadow:1px 1px 0 rgba(0, 0, 0, .4);
    text-transform:uppercase;
    width:100%;
    padding:10px;
}
.hbtsubcribe-EB:hover, .hbtsubcribe-EB:focus {
    background:#444749;
}
.hbtsubcribe-EB:active {
    -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.5) inset;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.5) inset;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.5) inset;
    outline:0;
}
iframe, object, embed, .yt-border iframe, .yt-border object, .yt-border embed, table {
    width:100%;
}
embed {
    border-radius:3px;
    -moz-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);
    background:#FFF;
    border:1px solid #ddd;
    box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);
    margin:0;
    padding:4px;
}
#footer-section {
    border-top:1px solid #98cdca;
    box-shadow:inset 0 4px 6px -3px #98cdca;
    font-family:cambria;
    font-size:14px;
    height:100px;
    text-align:center;
    width:100%;
    margin:10px -30px 5px;
    padding:0 30px;
}
</style>