/* --- Font --- */

@font-face {
	font-family: 'ChunkFive';
	src: url('../font/Chunkfive.eot');
	src: local('ChunkFive Regular'), local('ChunkFive'), url('../font/Chunkfive.woff') format('woff'), url('../font/Chunkfive.svg#ChunkFive') format('svg'), url('../fonts/Chunkfive.otf') format('opentype');
	font-weight: normal;
    font-style: normal;
}

/* --- Universal --- */

body {
	font-family: 'ChunkFive', Helvetica, sans-serif;
	background-color: #212629;
}
/*::-moz-selection{ background:#212629; color:#fff; }
::selection { background:#212629; color:#fff; }*/ 

/* --- IE Bug Fix --- */

.ie h1, .ie h2, .ie h3, .ie #webdeveloper, .ie #zenorocha, .ie #tel, .ie #also, .ie #url, .ie #email, .ie footer, .ie nav ul li, .ie section ul li, .ie #social ul li  {
  filter: alpha(opacity=100) !important;
  opacity: 1 !important;  
}


/* --- Typography --- */

h1 {
	color: #fff;
	text-transform: lowercase;
	font-size: 60px;
	opacity: 0;
	margin-top: -20px;
}

h2 {
	color: #999;
	text-transform: lowercase;
	font-size: 45px;
	opacity: 0;
	margin-top: 40px;
}

h3 {
  color: #fff;
  font-size: 32px;
  margin-bottom: 8px;
  opacity: 0;
}

/* --- Header --- */

#recent {
  text-align: right;
}

header {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -150px 0 0 -185px;
	width: 330px;
	height: 116px;
}

#webdeveloper {
  margin-top: 20px;
  float: left;
  opacity: 0;
}

#zenorocha {
  margin-top: -20px;
  float: left;
  opacity: 0;
}


/* --- Address --- */

address {
	position:absolute;
	top: 0;
	right: 0;
	text-align: right;
	margin: 30px 20px 0 0;
	color: #ccc;
	font-style: normal;
}

#tel, #email, #also, #url {
	opacity: 0;
}

/* --- Blog --- */

#blog {
	position: absolute;
	top: 0;
	left: 50%;
	margin: 30px 0 0 -185px;
	text-align: center;
	color: #ccc;
	width: 330px;
	height: 116px;
}

#blog a {
	text-decoration: none;
}

.cinza-claro {
	color: #999;
}
	
/* --- Footer --- */

footer {
  position: absolute;
  bottom: 30px;
  left: 50%;
  width: 219px;
  height: 300px;
  margin: 0 0 0 -140px;
  opacity: 0;
  background-image:url("../img/zeno/zeno-html5.png");
}

/* --- Section --- */

section {
	position:absolute;
	bottom: 0;
	left: 0;
	margin: 0 0 30px 0px;
}

section ul {
  text-align: left;
  color: #999;
}

section ul li {
	opacity: 0;
	margin: 2px 0 0 20px;	
}

#aboutme {
	margin-left: 30px;
}

section a {
  color: #999;
  text-decoration: none;
}

section a:hover {
  color: #ccc;
}

/* --- Nav --- */

nav {
  position:absolute;
  bottom: 30px;
  right: 0;
}

nav h3 {
  margin-right: 30px;
}

nav ul {
	text-align: right;
}

nav ul li {
	opacity: 0;
	margin: 2px 20px 0 0;
	
}

nav a {
	color: #999;
	text-decoration: none;
}

nav a:hover {
	color: #ccc;
}

/* --- Aside --- */

#facebook { background-image:url("../img/social/facebook.png"); }
#twitter { background-image:url("../img/social/twitter.png"); }
#github { background-image:url("../img/social/github.png"); }

#social {
  position:absolute;
  top: 0;
  left: 0;
  margin: 30px 0 0 30px;
}

  #social ul {
    font-size: 16px; 
  }

    #social ul li { 
    	display:inline; 
    	float:left; 
    	background-repeat:no-repeat; 
		  opacity: 0;
    }

      #social ul li a {
        display:block;
        width:48px; 
        height:48px; 
        padding-right:10px; 
        position:relative; 
        text-decoration:none;
      }

        #social ul li a strong {
          font-weight:normal; 
        	position:absolute; 
        	left:20px; top:-1px; 
        	color:#fff;
        	padding:3px;
        	z-index:9999;
        	text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75);
        	background-color:rgba(0, 0, 0, 0.7);
        	-moz-border-radius:3px;
        	-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
        	-webkit-border-radius:3px;
        	-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
        	border-radius:3px;
        	box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
        	opacity: 0;
        	filter: alpha(opacity=0);
        }
