CodePen

HTML

            
              
<!DOCTYPE html>

<!--[if lt IE 7 ]> <html class="ie ie6 no-js" lang="en-US"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie ie7 no-js" lang="en-US"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie ie8 no-js" lang="en-US"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie ie9 no-js" lang="en-US"> <![endif]-->
<!--[if gt IE 9]><!--><html class="no-js" lang="en-US"><!--<![endif]-->
<!-- the "no-js" class is for Modernizr. -->

<head id="www-sitename-com" data-template-set="html5-reset-wordpress-theme" profile="http://gmpg.org/xfn/11">

	<meta charset="UTF-8">
	
	<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	
	
	<title>
		     Sample Page - A.M Araujo	</title>
	
	<meta name="title" content="  Sample Page - A.M Araujo">
	<meta name="description" content="Illustradora">
	
	<meta name="google-site-verification" content="">
	<!-- Speaking of Google, don't forget to set your site up: http://google.com/webmasters -->
	
	<meta name="author" content="Your Name Here">
	<meta name="Copyright" content="Copyright Your Name Here 2011. All Rights Reserved.">

	<!-- Dublin Core Metadata : http://dublincore.org/ -->
	<meta name="DC.title" content="Project Name">
	<meta name="DC.subject" content="What you're about.">
	<meta name="DC.creator" content="Who made this site.">
	
	<!--  Mobile Viewport meta tag
	j.mp/mobileviewport & davidbcalhoun.com/2010/viewport-metatag 
	device-width : Occupy full width of the screen in its current orientation
	initial-scale = 1.0 retains dimensions instead of zooming out if page height > device height
	maximum-scale = 1.0 retains dimensions instead of zooming in if page width < device width -->
	<!-- Uncomment to use; use thoughtfully!
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
	-->
	
	<link rel="shortcut icon" href="http://localhost:8888/andrea/wp-content/themes/reset/_/img/favicon.ico">
	<!-- This is the traditional favicon.
		 - size: 16x16 or 32x32
		 - transparency is OK
		 - see wikipedia for info on browser support: http://mky.be/favicon/ -->
		 
	<link rel="apple-touch-icon" href="http://localhost:8888/andrea/wp-content/themes/reset/_/img/apple-touch-icon.png">
	<!-- The is the icon for iOS's Web Clip.
		 - size: 57x57 for older iPhones, 72x72 for iPads, 114x114 for iPhone4's retina display (IMHO, just go ahead and use the biggest one)
		 - To prevent iOS from applying its styles to the icon name it thusly: apple-touch-icon-precomposed.png
		 - Transparency is not recommended (iOS will put a black BG behind the icon) -->
	
	<!-- CSS: screen, mobile & print are all in the same file -->
	<link rel="stylesheet" href="http://localhost:8888/andrea/wp-content/themes/reset/style.css">
	
	<!-- all our JS is at the bottom of the page, except for Modernizr. -->
	<script src="http://localhost:8888/andrea/wp-content/themes/reset/_/js/modernizr-1.7.min.js"></script>
	
	<link rel="pingback" href="http://localhost:8888/andrea/xmlrpc.php" />

	
	<meta name='robots' content='noindex,nofollow' />
<link rel="alternate" type="application/rss+xml" title="A.M Araujo &raquo; Feed" href="http://localhost:8888/andrea/feed/" />
<link rel="alternate" type="application/rss+xml" title="A.M Araujo &raquo; Comments Feed" href="http://localhost:8888/andrea/comments/feed/" />
<link rel="alternate" type="application/rss+xml" title="A.M Araujo &raquo; Sample Page Comments Feed" href="http://localhost:8888/andrea/sample-page/feed/" />
<link rel='stylesheet' id='admin-bar-css'  href='http://localhost:8888/andrea/wp-includes/css/admin-bar.min.css?ver=3.5.1' type='text/css' media='all' />
<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js?ver=3.5.1'></script>
<script type='text/javascript' src='http://localhost:8888/andrea/wp-includes/js/comment-reply.min.js?ver=3.5.1'></script>
<link rel='next' title='Home' href='http://localhost:8888/andrea/' />
<link rel='canonical' href='http://localhost:8888/andrea/sample-page/' />
	<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>
<style type="text/css" media="print">#wpadminbar { display:none; }</style>
<style type="text/css" media="screen">
	html { margin-top: 28px !important; }
	* html body { margin-top: 28px !important; }
</style>
	
</head>

<body class="page page-id-2 page-template-default logged-in admin-bar no-customize-support">
	
	<div id="page-wrap"><!-- not needed? up to you: http://camendesign.com/code/developpeurs_sans_frontieres -->

		<header id="header">
			<h1><a href="http://localhost:8888/andrea/">A.M Araujo -  <span class="description">Illustradora</span></a></h1>
			
		</header>
		
		<div class="menu"><ul><li class="page_item page-item-4"><a href="http://localhost:8888/andrea/">Home</a></li><li class="page_item page-item-2 current_page_item"><a href="http://localhost:8888/andrea/sample-page/">Sample Page</a></li></ul></div>

    <!--wrapping the content and comments using #block-->
  <div id="block">				
		<article class="post" id="post-2">

			<h2>Sample Page</h2>

			<footer class="meta">
	<i>Posted on:</i> <time datetime="2013-03-25T17:00:55+00:00" pubdate class="updated">February 7th, 2013</time>
	<span class="byline author vcard">
		<i>by</i> <span class="fn">admin</span>
	</span>
	<a href="http://localhost:8888/andrea/sample-page/#respond" class="comments-link"  title="Comment on Sample Page">No Comments</a></footer>
			<div class="entry">

				<p>This is an example page. It&#8217;s different from a blog post because it will stay in one place and will show up in your site navigation (in most themes). Most people start with an About page that introduces them to potential site visitors. It might say something like this:</p>
<blockquote><p>Hi there! I&#8217;m a bike messenger by day, aspiring actor by night, and this is my blog. I live in Los Angeles, have a great dog named Jack, and I like pi&#241;a coladas. (And gettin&#8217; caught in the rain.)</p></blockquote>
<p>&#8230;or something like this:</p>
<blockquote><p>The XYZ Doohickey Company was founded in 1971, and has been providing quality doohickeys to the public ever since. Located in Gotham City, XYZ employs over 2,000 people and does all kinds of awesome things for the Gotham community.</p></blockquote>
<p>As a new WordPress user, you should go to <a href="http://localhost:8888/andrea/wp-admin/">your dashboard</a> to delete this page and create new pages for your content. Have fun!</p>

				
			</div>

			<p><a class="post-edit-link" href="http://localhost:8888/andrea/wp-admin/post.php?post=2&amp;action=edit" title="Edit Page">Edit this entry.</a></p>
		</article>
		
		

			<!-- If comments are open, but there are no comments. -->

	 	


<div id="respond">

	<h2>Leave a Reply</h2>

	<div class="cancel-comment-reply">
		<a rel="nofollow" id="cancel-comment-reply-link" href="/andrea/sample-page/#respond" style="display:none;">Click here to cancel reply.</a>	</div>

	
	<form action="http://localhost:8888/andrea/wp-comments-post.php" method="post" id="commentform">

		
			<p>Logged in as <a href="http://localhost:8888/andrea/wp-admin/profile.php">admin</a>. <a href="http://localhost:8888/andrea/wp-login.php?action=logout&amp;redirect_to=http%3A%2F%2Flocalhost%3A8888%2Fandrea%2Fsample-page%2F&amp;_wpnonce=c2c84a42a2" title="Log out of this account">Log out &raquo;</a></p>

		
		<!--<p>You can use these tags: <code>&lt;a href=&quot;&quot; title=&quot;&quot;&gt; &lt;abbr title=&quot;&quot;&gt; &lt;acronym title=&quot;&quot;&gt; &lt;b&gt; &lt;blockquote cite=&quot;&quot;&gt; &lt;cite&gt; &lt;code&gt; &lt;del datetime=&quot;&quot;&gt; &lt;em&gt; &lt;i&gt; &lt;q cite=&quot;&quot;&gt; &lt;strike&gt; &lt;strong&gt; </code></p>-->

		<div>
			<textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea>
		</div>

		<div>
			<input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
			<input type='hidden' name='comment_post_ID' value='2' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
		</div>
		
		<input type="hidden" id="_wp_unfiltered_html_comment_disabled" name="_wp_unfiltered_html_comment_disabled" value="fece3f37cd" /><script>(function(){if(window===window.parent){document.getElementById('_wp_unfiltered_html_comment_disabled').name='_wp_unfiltered_html_comment';}})();</script>

	</form>

		
</div>

</div><!-- end block-->


		
<div id="sidebar">

    <div id="search-2" class="widget widget_search"><form action="http://localhost:8888/andrea" id="searchform" method="get">
    <div>
        <label for="s" class="screen-reader-text">Search for:</label>
        <input type="search" id="s" name="s" value="" />
        
        <input type="submit" value="Search" id="searchsubmit" />
    </div>
</form></div>		<div id="recent-posts-2" class="widget widget_recent_entries">		<h2>Recent Posts</h2>		<ul>
					<li>
				<a href="http://localhost:8888/andrea/hello-world/" title="Hello world!">Hello world!</a>
						</li>
				</ul>
		</div><div id="recent-comments-2" class="widget widget_recent_comments"><h2>Recent Comments</h2><ul id="recentcomments"><li class="recentcomments"><a href='http://wordpress.org/' rel='external nofollow' class='url'>Mr WordPress</a> on <a href="http://localhost:8888/andrea/hello-world/#comment-1">Hello world!</a></li></ul></div><div id="archives-2" class="widget widget_archive"><h2>Archives</h2>		<ul>
			<li><a href='http://localhost:8888/andrea/2013/02/' title='February 2013'>February 2013</a></li>
		</ul>
</div><div id="categories-2" class="widget widget_categories"><h2>Categories</h2>		<ul>
	<li class="cat-item cat-item-1"><a href="http://localhost:8888/andrea/category/uncategorized/" title="View all posts filed under Uncategorized">Uncategorized</a>
</li>
		</ul>
</div><div id="meta-2" class="widget widget_meta"><h2>Meta</h2>			<ul>
			<li><a href="http://localhost:8888/andrea/wp-admin/">Site Admin</a></li>			<li><a href="http://localhost:8888/andrea/wp-login.php?action=logout&#038;_wpnonce=c2c84a42a2">Log out</a></li>
			<li><a href="http://localhost:8888/andrea/feed/" title="Syndicate this site using RSS 2.0">Entries <abbr title="Really Simple Syndication">RSS</abbr></a></li>
			<li><a href="http://localhost:8888/andrea/comments/feed/" title="The latest comments to all posts in RSS">Comments <abbr title="Really Simple Syndication">RSS</abbr></a></li>
			<li><a href="http://wordpress.org/" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">WordPress.org</a></li>
						</ul>
</div>
</div>
		
		

	</div><!--end page-wrap-->
	
	<footer id="footer" class="source-org vcard copyright website-info">
			
			<p>&copy;2013 A. M. Araujo - Ilustradora. All Rights Reserved. Webdesign: <a href="#">QuartoEstudio.com</a></p>
	</footer>
	

	<script type='text/javascript' src='http://localhost:8888/andrea/wp-includes/js/admin-bar.min.js?ver=3.5.1'></script>
	<script type="text/javascript">
		(function() {
			var request, b = document.body, c = 'className', cs = 'customize-support', rcs = new RegExp('(^|\\s+)(no-)?'+cs+'(\\s+|$)');

			request = true;

			b[c] = b[c].replace( rcs, ' ' );
			b[c] += ( window.postMessage && request ? ' ' : ' no-' ) + cs;
		}());
	</script>
			<div id="wpadminbar" class="nojq nojs" role="navigation">
			<a class="screen-reader-shortcut" href="#wp-toolbar" tabindex="1">Skip to toolbar</a>
			<div class="quicklinks" id="wp-toolbar" role="navigation" aria-label="Top navigation toolbar." tabindex="0">
				<ul id="wp-admin-bar-root-default" class="ab-top-menu">
		<li id="wp-admin-bar-wp-logo" class="menupop"><a class="ab-item"  aria-haspopup="true" href="http://localhost:8888/andrea/wp-admin/about.php" title="About WordPress"><span class="ab-icon"></span></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-wp-logo-default" class="ab-submenu">
		<li id="wp-admin-bar-about"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/about.php">About WordPress</a>		</li></ul><ul id="wp-admin-bar-wp-logo-external" class="ab-sub-secondary ab-submenu">
		<li id="wp-admin-bar-wporg"><a class="ab-item"  href="http://wordpress.org/">WordPress.org</a>		</li>
		<li id="wp-admin-bar-documentation"><a class="ab-item"  href="http://codex.wordpress.org/">Documentation</a>		</li>
		<li id="wp-admin-bar-support-forums"><a class="ab-item"  href="http://wordpress.org/support/">Support Forums</a>		</li>
		<li id="wp-admin-bar-feedback"><a class="ab-item"  href="http://wordpress.org/support/forum/requests-and-feedback">Feedback</a>		</li></ul></div>		</li>
		<li id="wp-admin-bar-site-name" class="menupop"><a class="ab-item"  aria-haspopup="true" href="http://localhost:8888/andrea/wp-admin/">A.M Araujo</a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-site-name-default" class="ab-submenu">
		<li id="wp-admin-bar-dashboard"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/">Dashboard</a>		</li></ul><ul id="wp-admin-bar-appearance" class="ab-submenu">
		<li id="wp-admin-bar-themes"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/themes.php">Themes</a>		</li>
		<li id="wp-admin-bar-customize" class="hide-if-no-customize"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/customize.php?url=http%3A%2F%2Flocalhost%3A8888%2Fandrea%2Fsample-page%2F">Customize</a>		</li>
		<li id="wp-admin-bar-widgets"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/widgets.php">Widgets</a>		</li>
		<li id="wp-admin-bar-menus"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/nav-menus.php">Menus</a>		</li></ul></div>		</li>
		<li id="wp-admin-bar-comments"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/edit-comments.php" title="0 comments awaiting moderation"><span class="ab-icon"></span><span id="ab-awaiting-mod" class="ab-label awaiting-mod pending-count count-0">0</span></a>		</li>
		<li id="wp-admin-bar-new-content" class="menupop"><a class="ab-item"  aria-haspopup="true" href="http://localhost:8888/andrea/wp-admin/post-new.php" title="Add New"><span class="ab-icon"></span><span class="ab-label">New</span></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-new-content-default" class="ab-submenu">
		<li id="wp-admin-bar-new-post"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/post-new.php">Post</a>		</li>
		<li id="wp-admin-bar-new-media"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/media-new.php">Media</a>		</li>
		<li id="wp-admin-bar-new-page"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/post-new.php?post_type=page">Page</a>		</li>
		<li id="wp-admin-bar-new-user"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/user-new.php">User</a>		</li></ul></div>		</li>
		<li id="wp-admin-bar-edit"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/post.php?post=2&#038;action=edit">Edit Page</a>		</li></ul><ul id="wp-admin-bar-top-secondary" class="ab-top-secondary ab-top-menu">
		<li id="wp-admin-bar-search" class="admin-bar-search"><div class="ab-item ab-empty-item" tabindex="-1"><form action="http://localhost:8888/andrea/" method="get" id="adminbarsearch"><input class="adminbar-input" name="s" id="adminbar-search" type="text" value="" maxlength="150" /><input type="submit" class="adminbar-button" value="Search"/></form></div>		</li>
		<li id="wp-admin-bar-my-account" class="menupop with-avatar"><a class="ab-item"  aria-haspopup="true" href="http://localhost:8888/andrea/wp-admin/profile.php" title="My Account">Howdy, admin<img alt='' src='http://1.gravatar.com/avatar/91d4abfec3e2c2509e3620c90de2d123?s=16&amp;d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D16&amp;r=G' class='avatar avatar-16 photo' height='16' width='16' /></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-user-actions" class="ab-submenu">
		<li id="wp-admin-bar-user-info"><a class="ab-item" tabindex="-1" href="http://localhost:8888/andrea/wp-admin/profile.php"><img alt='' src='http://1.gravatar.com/avatar/91d4abfec3e2c2509e3620c90de2d123?s=64&amp;d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D64&amp;r=G' class='avatar avatar-64 photo' height='64' width='64' /><span class='display-name'>admin</span></a>		</li>
		<li id="wp-admin-bar-edit-profile"><a class="ab-item"  href="http://localhost:8888/andrea/wp-admin/profile.php">Edit My Profile</a>		</li>
		<li id="wp-admin-bar-logout"><a class="ab-item"  href="http://localhost:8888/andrea/wp-login.php?action=logout&#038;_wpnonce=c2c84a42a2">Log Out</a>		</li></ul></div>		</li></ul>			</div>
			<a class="screen-reader-shortcut" href="http://localhost:8888/andrea/wp-login.php?action=logout&#038;_wpnonce=c2c84a42a2">Log Out</a>
		</div>

		

<!-- here comes the javascript -->

<!-- jQuery is called via the Wordpress-friendly way via functions.php -->

<!-- this is where we put our custom functions -->
<script src="http://localhost:8888/andrea/wp-content/themes/reset/_/js/functions.js"></script>

<!-- Asynchronous google analytics; this is the official snippet.
	 Replace UA-XXXXXX-XX with your site's ID and uncomment to enable.
	 
<script>

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXXX-XX']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
-->

</body>

</html>

            
          
!
via HTML Inspector

CSS

            
              /*   
Theme Name: Andrea 
Theme URI: http://quartoestudio.com
Description: Exclusive theme for Andrea M. Araujo
Author: Evandro Pastor
Author URI: http://quartoestudio.com
Version: 1
*/

/*
	HTML5 Reset Wordpress Theme :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	
	Eric Meyer					:: http://ericmeyer.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
	
	Special thanks: The Wordpress theme owes its start to an empty theme authored 
		by Chris Coyier & Jeff Starr: http://digwp.com
	
-------------------------------------------------------------------------------*/

/* Let's default this puppy out
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers. 
   There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  



/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* new Linux- and Windows-friendly sans-serif font stack: http://mky.be/fontstack */
body {font: 13px Helmet, Freesans, sans-serif;}

/* using local fonts? make sure to read up on Paul Irish's 
	Bulletproof @font-face syntax: http://mky.be/font-face/bulletproof/ */

/* we like off-black for text */
body, select, input, textarea {color: #333;}

a {color: #03f;}
a:hover {color: #69f;}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}



/* And here begins the Wordpress fun.
-------------------------------------------------------------------------------*/

/*#page-wrap {width: 960px; margin: 20px auto;}*/

.post {}

.entry-content {}
.entry-content a {}
.entry-content a:hover {}

#meta {}
.postmetadata {}

#sidebar {}

.navgation {}
.next-posts {}
.prev-posts {}

#searchform {}
#s {}
#searchsubmt {}
	
ol.commentlist {list-style: none;}
ol.commentlist li {}
ol.commentlist li.alt {}
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment {border-bottom: 1px dotted #666; padding: 10px;}
ol.commentlist li.comment div.comment-author {}
ol.commentlist li.comment div.vcard {}
ol.commentlist li.comment div.vcard cite.fn {font-style: normal;}
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar {float:right; margin: 0 0 10px 10px;}
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta {font-size: 10px;}
ol.commentlist li.comment div.comment-meta a {color: #ccc;}
ol.commentlist li.comment p {}
ol.commentlist li.comment ul {}
ol.commentlist li.comment div.reply {font-size: 11px;}
ol.commentlist li.comment div.reply a {font-weight: bold;}
ol.commentlist li.comment ul.children {list-style: none; margin: 10px 0 0;}
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {border-left: 5px solid #555; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-3 {border-left: 5px solid #999; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-4 {border-left: 5px solid #bbb; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-5 {}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even {background: #fff;}
ol.commentlist li.odd {background: #f6f6f6;}
ol.commentlist li.parent {border-left: 5px solid #111;}
ol.commentlist li.thread-alt {}
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}



/* Meus Estilos
-------------------------------------------------------------------------------*/


/* gerais */
#page-wrap{
	background:#fff;
}

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

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

#page-wrap{
	margin-top:0;
	width: 1024px;	
	margin: auto;
	position: relative;
	font-family:georgia,serif;

}



/* home */
.home header a{
	text-indent:-9999999px;
	overflow:hidden;
	display:block;
	background:  url('img/logo-250x71.png') no-repeat;
	width:250px;
	height:71px;
	position:absolute;
	top:100px;
	
}


.home #page-wrap{
background: #fff url('img/andrea-esquilo-bg-767x594.jpg') top right no-repeat;
min-height:594px;
}

.home #content{
	position:relative;
	top:326px;
	width:520px;
	color:#616161;
	
}

.home blockquote{
	font-size:19px;
	font-style:italic;
	font-family: georgia, serif;
	width:520px;

}
.home blockquote p{
		line-height:1.5em;
		letter-spacing:-.06em;

}

.home blockquote p:first-letter{
	font-size:2em;
}

.home  blockquote footer{
	font-size: .8em;
	margin-right:0;
	margin-top:25px;
	color:#000;
}


/* menu */
.home .menu ul{
	position:relative;
	top:200px;
}

.menu{background:gray;}

 .menu ul{
	list-style:none;
}

.menu ul li{
	display:inline;
	margin-right:12px;
	letter-spacing:-.08em;
}




/* o resto */

#page-wrap{
	margin-top:25px;
}

header a{
	background: url('img/logo-150x43.png') no-repeat;
	display:block;
	width:150px;
	height:43px;
	overflow:hidden;
	text-indent:-9999999px;
}


div.menu{
	padding:15px 0;
	width:100%;
}


.post h2{
	font-size:3em;
}

.meta{
	padding:15px 0;
}


<!--- problematic code--->
#block{
	width:300px;
	float:left;
	background:orange;
}


#sidebar{
	float:right;
	width:250px;
	background:red;
}
<!---end problematic code-->




/* footer */
.website-info {
border-top: 1px solid #969696;
background: #e8e8e8;
height: 80px;
line-height: 80px;
width: 1024px;
margin: auto;
padding: 10 0px;
margin-bottom: 25px;

}

.website-info p {
	float: right;
	margin-right: 30px;
	font-size: 12px;
	letter-spacing: .08em;
	font-style: italic;
	font-family: georgia, serif;
	

}

footer#footer{
	clear:both;
}



/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
	
		
}

@media all and (orientation: portrait) {
	
}

@media all and (orientation: landscape) {
	
}

            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................