@import url("/css/clearfix.css");
/*------------------------------------------------------------------------
Version 1.0
Author:olivier bon <http://olivierbon.com>
Company: olivierbon.com
email:olivierbon@mac.com
------------------------------------------------------------------------*/
/* Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,li,ol,ul,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0 none;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;/*line-height:1;*/margin:0;padding:0;text-align:left;vertical-align:baseline;}

/* =Commons */
body{font:13px/19px "Helvetica Neue",Arial,Helvetica,sans-serif;color:rbg(99,99,99);color:rgba(0,0,0,.61);background:#eeeeee;/*border-top:7px solid #ccc*/;-webkit-text-size-adjust:none;-webkit-font-smoothing: antialiased;text-rendering: optimizeLegibility;-webkit-text-stroke: 1px transparent;}
img,fieldset{border:none;}
.left{float:left;}
.right{float:right;}
.status{font-weight:bold;}
.available{color:#85C441;}
/* =Typo */
a{color:#646464;text-decoration:underline;}
a:hover{color:#000;xtext-decoration:none;}
a:active{position:relative;top:1px;}
p{margin-bottom:15px;}
strong{font-weight:bold;}
em{font-style: italic;}
h1{font-size:38px;line-height:43px;margin-bottom:10px;letter-spacing:-2px;color:#ccc;font-weight:bold;}
	#home h1{font-size:64px;line-height:70px;margin-bottom:20px;color:#555;}/*font-size:84px;line-height:90px;margin-bottom:20px;*/
	h1 em{font-style:normal;color:#7CC2CB;}
h2{font-size:20px;line-height:26px;margin-bottom:20px;font-weight:normal;letter-spacing:-1px;}
h3{font-size:20px;letter-spacing:-1px;margin:0 0 16px 0;color:#333;font-weight:bold;}
h4{font-size:11px;font-weight:bold;text-transform:uppercase;color:#000;margin-bottom:11px;}
ul{list-style:none;}
ul li{list-style:none;}
code, pre {font-family: Monaco,Courier;color:#555;font-size:11px;}
pre{font-size:11px;color:#707070;padding:12px;margin:0 0 19px;background:#eee;border:none;overflow-x: auto;}
/* =Layout */
.section{width:960px;margin:0 auto;}
#header{background:#fff;padding:0 0 15px 0;margin-top:6px;border-top:1px solid #ddd;border-bottom:1px solid #ddd;}
 #home #header{padding:0 0 50px 0;}
#header #nav{margin:40px 0 30px;float:right;}
#header #nav li{float:left;display:inline;}
#header #nav li a{line-height:28px;margin-left:10px;display:block;text-decoration:none;text-transform:uppercase;font-size:10px;color:#777;background-color:#eee;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-o-transition-duration: .33s;-o-transition-property: color, background-color;-webkit-transition-duration: .33s;-webkit-transition-property: color, background;}
#header #nav li a strong{display:block;padding:0 20px;height:28px;}
#header #nav li a:hover{background-color:#646464;color:#fff;}
#header #nav li.active a,#header #nav li.active a:hover{background-color:#7CC2CB;color:#fff;}
#content {background:#fff;padding:20px 0;border-bottom:1px solid #ddd;}
	#home #content{background:transparent;border-bottom:none;padding-bottom:0;}
	#home #content ul{float:left;padding-bottom:20px;margin:10px 0 0 0;list-style:none;border-bottom:1px solid #ddd;}
	#home #content ul li{width:215px;float:left;padding:0 25px 0 0;}
#footer{padding-top:20px;}
#footer p{color:#aaa;font-weight:bold;font-size:11px;float:left;}
#footer #footnav{float:right;}
#footer #footnav li{float:left;display:inline;}
#footer #footnav li a{display:block;padding:6px 10px;font-size:12px;font-weight:bold;text-decoration:none;text-transform:capitalize;}
#footer #footnav li a:hover{text-decoration:underline;}
/* =About */
.aside{xwidth:215px;float:right;padding:0 25px 0 0;}
.aside li{line-height:22px;}
.aside li:before{content:"+ ";color:#ccc;}
.article{width:455px;padding:0 45px 0 0;float:left;}
/* =Work */
#projects{float:left;margin-top:15px;}
#projects li{float:left;width:960px;margin-bottom:30px;padding-bottom:30px;border-bottom:1px dotted #eee;}
.project-meta{float:left;width:220px;}
.project-meta h3{margin-top:0;}
.project-meta h4{font-size:11px;text-transform:uppercase;letter-spacing:0;color:#000;}
.project-meta .view-site{display:block;line-height:28px;width:105px;background-color:#7CC2CB;color:#fff;text-decoration:none;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.project-meta .view-site strong{font-weight:normal;display:block;padding:0 10px;height:28px;}
.project-main-shot{float:right;padding:1px;border:1px solid #eee;}
.project-side-shot{padding:1px;border:1px solid #eee;margin-top:30px;}
#charlie-browns .project-meta,
#setel .project-meta,
#mbm .project-meta{float:right;}
#setel .project-main-shot,
#charlie-browns .project-main-shot,
#mbm .project-main-shot{float:left;}

/* Dreebbble */
#dreebbble .primary{float:left;width:600px;}
#dreebbble .secondary{float:right;width:330px;padding:30px 0;}
#dreebbble .plugin_name{font-weight:bold;}
#dreebbble h1{font-size:84px;line-height:90px;margin:20px 0 0 0;letter-spacing:-2px;color:#ea4c89;font-weight:bold;}
	#dreebbble h1 em{font-style:normal;color:#434950;}
#dreebbble h2{font-size:20px;line-height:26px;color:#434950;margin-bottom:20px;font-weight:normal;letter-spacing:-1px;}
#dreebbble #content ul{margin-bottom:20px;}
#dreebbble #content pre{}
#dreebbble #content h4{font-size:14px;border-bottom:1px solid #ccc;margin-bottom:5px;}
#dreebbble #content p a:hover{color:#ea4c89;}
#dreebbble a.btn{padding:11px 15px;background:#ea4c89 url(/skin/btn_dreebbble-up.png) repeat-x 0 50%;color:#fff;font-size:18px;text-decoration:none;text-shadow:0 -1px 0 rgba(167,43,93, .9);-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;}
#dreebbble a.btn em{font-size:11px;}
#dreebbble a:hover.btn{color:#ffffff;background:#df3e7b url(/skin/btn_dreebbble-hover.png) repeat-x 0 50%;}