Element Styles I like

by freedawirl

HTML

<div class="note">
			<div class="title">Note</div>
			<p>Animation should almost always be <strong>user controlled</strong> or <strong>very short in duration</strong>. Images that continually animate can cause the rest of the page to be more difficult, or for users with very high levels of distractibility, totally inaccessible.</p>
			
			<p><a href="/standards/wcag/checklist#sc2.2.2">WCAG 2.0 Success Criterion 2.2.2 (Level A)</a> requires that automatically moving, blinking, or scrolling content that lasts longer than 5 seconds can be paused, stopped, or hidden by the user.</p>
		</div>

CSS

.note {
	background-color: #F1F5F7;
	border:1px solid #CCCCCC;
}

.important, .tip, .note, .example {
	padding:4px 1.5em 0px 1.5em;
	margin:1em auto 1em auto;
	width:85%;
	border-radius: 4px;
}

.important .title, .tip .title, .note .title, .example .title {
	padding:3px 0 15px 35px;
	display:block;
	font-size:1.25em;
	font-family: 'Kameron',Georgia,Times,serif;
}