Easy Business Builder

You are not signed in

Marketplace

Free and premium stock photos, royalty free images, website graphics, ebooks, PLR content, videos, articles, HTML snippets, and templates

Yellow Notepad

September, 13 2017 Jon Wallen Quotes

Click to view larger image

Info

Yellow notebook paper style quote block. All CSS (no images).

License: You may modify this and use it for personal use or give it away for free. You may not sell it or include it on paid member sites, and you may not bundle it with other products.

CSS Code:

<style>.notepaper {
position: relative;
margin: 80px auto;
padding: 29px 20px 20px 45px;
width: 280px;
line-height: 30px;
color: #6a5f49;
text-shadow: 0 1px 1px white;
background-color: #f2f6c1;
background-image: -webkit-radial-gradient(center, cover, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.1) 90%), -webkit-repeating-linear-gradient(top, transparent, transparent 29px, rgba(239, 207, 173, 0.7) 29px, rgba(239, 207, 173, 0.7) 30px);
background-image: -moz-radial-gradient(center, cover, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.1) 90%), -moz-repeating-linear-gradient(top, transparent, transparent 29px, rgba(239, 207, 173, 0.7) 29px, rgba(239, 207, 173, 0.7) 30px);
background-image: -o-radial-gradient(center, cover, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.1) 90%), -o-repeating-linear-gradient(top, transparent, transparent 29px, rgba(239, 207, 173, 0.7) 29px, rgba(239, 207, 173, 0.7) 30px);
border: 1px solid #c3baaa;
border-color: rgba(195, 186, 170, 0.9);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 5px #d8e071, 0 0 1px rgba(0, 0, 0, 0.1), 0 2px rgba(0, 0, 0, 0.02);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 5px #d8e071, 0 0 1px rgba(0, 0, 0, 0.1), 0 2px rgba(0, 0, 0, 0.02);
}
.notepaper:before, .notepaper:after {
content: '';
position: absolute;
top: 0;
bottom: 0;
}
.notepaper:before {
left: 28px;
width: 2px;
border: solid #efcfad;
border-color: rgba(239, 207, 173, 0.9);
border-width: 0 1px;
}
.notepaper:after {
z-index: -1;
left: 0;
right: 0;
background: rgba(242, 246, 193, 0.9);
border: 1px solid rgba(170, 157, 134, 0.7);
-webkit-transform: rotate(2deg);
-moz-transform: rotate(2deg);
-ms-transform: rotate(2deg);
-o-transform: rotate(2deg);
transform: rotate(2deg);
}
.quote {
font-family: Georgia, serif;
font-size: 14px;
}
.curly-quotes:before, .curly-quotes:after {
display: inline-block;
vertical-align: top;
height: 30px;
line-height: 48px;
font-size: 50px;
opacity: .2;
}
.curly-quotes:before {
content: '';
margin-right: 4px;
margin-left: -8px;
}
.curly-quotes:after {
content: '';
margin-left: 4px;
margin-right: -8px;
}
.quote-by {
display: block;
padding-right: 10px;
text-align: right;
font-size: 13px;
font-style: italic;
color: #84775c;
}
.lt-ie8 .notepaper {
padding: 15px 25px;
}
</style>

HTML Code:
You can use the buttons above and to the right to either download this in a zip file (with images and css) or copy it to your EBB Snippets library, but here is the HTML code if you'd prefer to copy and paste it somewhere.

More from Jon Wallen

Free Content

Choose an option below

Download Copy to Library

Tags

css html notepade quotes

About Jon Wallen

I worked from home as a freelance web developer for over 10 years before I became a full time mail carrier at my local post office, and part time co-owner of Easy Business Builder. I have experience in web application development, specializing in eCommerce and affiliate systems. I built a shopping cart system and sold it for several years, have worked on MLM websites, and various membership sites. I have over 20 years of experience developing websites. I am the primary developer for EBB and most everything you see here is my work. I started working on EBB with Todd Perry in 2014, and it's growing and evolving on a weekly basis.

Visit Jon Wallen's website

Jon Wallen recommends
these products and services