/* Helpers and Reset */
/* http://meyerweb.com/eric/tools/css/reset/ *//* v1.0 | 20080212 */ 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, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;} body {line-height: 1;}ol, ul{list-style:none;} blockquote, q{quotes:none;} ins{text-decoration:none;} del{text-decoration:line-through;} table{border-collapse:collapse; border-spacing:0;}
.left{float:left;}
.right{float:right;}
.align-r{text-align:right;}
.align-l{text-align:left;}
.clr{clear:both;}
.line{border-bottom:#DDD 1px solid;}
.border-no{border:none !important;}
.margin-r{margin-right:20px;}
.margin-r-no{margin-right:0px !important;}
.pad-t{padding-top:20px;}
.pad-t-no{padding-top: 0px !important;}
.pad-l-no{padding-left:0px !important;}
.pad-r-no{padding-right:0px !important;}
a:active{outline:none;}
a span{display:none;}
::selection { background: #63B7BB; color: #fff; }
::-moz-selection { background: #63B7BB; color: #fff; }

/* Site Structure */
body{font-family:Arial, Sans-serif; font-size:15px; background:#FFF; color:#000;}
#wrapper{width:1000px; margin:60px auto 20px auto; /*overflow:hidden;*/}
	#wrapper.home{margin:0px auto;}

/* Header */
#header-bg{background:#040707;width:100%; height:90px;}
#header{width:950px; height:90px; margin:auto;}
	#logo a{float:left; width:330px;height:90px;background:url(../images/sprite.png); background-position:0px 0px; display:block; text-indent:-9999px !important;}
	
/* Footer */
#footer-bg{background:#040707; width:100%; height:280px;}
#footer{width:950px;margin:auto; height:210px; color:#FFF; padding-top:70px;}
	#footer h3{font-family: NeoSansRegular, Arial, Sans-serif; font-size:30px; font-weight:normal; margin:0px 0px 15px 0px; letter-spacing:-1px;}
	#footer .contact{width:270px; margin-right:90px;}
			
	#footer .featured{width:420px; height:90px;}
		.favicons li{width:16px; height:16px; float:left; display:block; background:url(../images/sprite.png); margin: 0px 5px 5px 5px;}
			.favicons li.last{width:150px;background:none;}
				.favicons li.last a{width:150px; color:#FFF; text-decoration:none; padding-left:10px; padding-top:3px;}
			.favicons.border li{border:#CCC solid 1px;}
			.favicons li a{display:block; width:16px; height:16px;}
			
			.favicons li.line25{background-position:0px -545px;}
			.favicons li.abuzeedo{background-position:-17px -545px;}
			.favicons li.css-awards{background-position:-34px -545px;}
			.favicons li.css-mania{background-position:-51px -545px;}
			.favicons li.design-inspiration{background-position:-68px -545px;}
			.favicons li.specky-boy{background-position:-85px -545px;}
			.favicons li.eyes-on-pixel{background-position:-102px -545px;}
			.favicons li.qindex{background-position:-119px -545px;}
			.favicons li.pixery{background-position:-136px -545px;}
			.favicons li.css-wow{background-position:-153px -545px;}
			.favicons li.cssnack{background-position:-170px -545px;}
			.favicons li.css-mayo{background-position:-187px -545px;}
			.favicons li.incrediblend{background-position:-204px -545px;}
			.favicons li.most-inspired{background-position:-221px -545px;}
			.favicons li.css-based{background-position:-238px -545px;}
			.favicons li.css-bahcesi{background-position:-255px -545px;}
			.favicons li.css-perk{background-position:-272px -545px;}
			.favicons li.css-faves{background-position:-289px -545px;}
			.favicons li.css-brigit{background-position:-306px -545px;}
			.favicons li.ekuzhan{background-position:-323px -545px;}
			.favicons li.css-gallery{background-position:-340px -545px;}
			.favicons li.inspire-css{background-position:-357px -545px;}
			.favicons li.siiimple{background-position:-374px -545px;}
			.favicons li.swd{background-position:-391px -545px;}
			.favicons li.css-smooth-operator{background-position:-408px -545px;}
			.favicons li.colorgorize{background-position:-425px -545px;}
			.favicons li.we-love-css{background-position:-442px -545px;}
			.favicons li.desey{background-position:-459px -545px;}
			.favicons li.css-line{background-position:-476px -545px;}
			.favicons li.wdl{background-position:-493px -545px;}
			.favicons li.folio-focus{background-position:-510px -545px;}
			.favicons li.underworld-magazines{background-position:-527px -545px;}
			.favicons li.css-design-awards{background-position:-544px -545px;}
			.favicons li.smashing-share{background-position:-561px -545px;}
			.favicons li.tech-blog{background-position:-578px -545px;}
			.favicons li.css-brat{background-position:-595px -545px;}
			.favicons li.graphic-design-junction{background-position:-612px -545px;}
			.favicons li.ember{background-position:-629px -545px;}
			.favicons li.web-geekly{background-position:-646px -545px;}
			.favicons li.onetrapixel{background-position:-663px -545px;}		
			.favicons li.design-deck{background-position:-680px -545px;}
			.favicons li.vandelay-design{background-position:-697px -545px;}
			.favicons li.two-experts-design{background-position:-714px -545px;}
			.favicons li.web-design-du-jour{background-position:-731px -545px;}
			.favicons li.underworld-magazines{background-position:-748px -545px;}
			.favicons li.Beautiful2{background-position:-765px -545px;}
			.favicons li.design-flexion{background-position:-782px -545px;}
			.favicons li.denzo-mag{background-position:-799px -545px;}
			.favicons li.web-appers{background-position:-816px -545px;}
			.favicons li.damn-digital{background-position:-833px -545px;}
			.favicons li.inspire-first{background-position:-850px -545px;}
			.favicons li.marked-lines{background-position:-867px -545px;}
			.favicons li.ninety-two-pixels{background-position:-884px -545px;}
			.favicons li.PSD-collector{background-position:-901px -545px;}
			
			.favicons li.com-limao{background-position:0px -562px;}
			.favicons li.art-spire{background-position:-17px -562px;}
			.favicons li.acris-design{background-position:-34px -562px;}
			.favicons li.ejunkie{background-position:-51px -562px;}
			.favicons li.six-revisions{background-position:-68px -562px;}
			.favicons li.design-on-stop{background-position:-85px -562px;}
			.favicons li.the-design-work{background-position:-102px -562px;}
			.favicons li.trip-wire-magazine{background-position:-119px -562px;}
			.favicons li.econsultancy{background-position:-136px -562px;}
			.favicons li.smashing-geeks{background-position:-153px -562px;}
			.favicons li.dj-designer-lab{background-position:-170px -562px;}
			.favicons li.css-gallery-pro{background-position:-187px -562px;}
			.favicons li.noupe{background-position:-204px -562px;}
			.favicons li.womtec{background-position:-221px -562px;}
			.favicons li.t3n-web-awards{background-position:-238px -562px;}
			.favicons li.ideal-logo-design-portfolio{background-position:-255px -562px;}
			.favicons li.omega-imagine{background-position:-272px -562px;}
			.favicons li.three-lancer{background-position:-289px -562px;}
			.favicons li.curiosando{background-position:-306px -562px;}
			.favicons li.das-web-design-blog{background-position:-323px -562px;}
			.favicons li.fishbecat{background-position:-340px -562px;}
	
	#footer  a.btn-resume{width:96px; height:130px; background:url(../images/sprite.png); background-position:-722px 0px;}
	#footer  a.btn-resume:hover{background-position:-825px 0px;}
	
	#footer ul.nav-footer{list-style:none; clear:both; padding-top:40px; color:#5d5d5d; height:20px;}
		#footer ul.nav-footer li{float:left; padding:0px 21px; border-right:#5d5d5d 1px solid;}
		#footer ul.nav-footer li a{color:#5d5d5d; text-decoration:none;}
	
/* Navigation */
#nav{float:right; height:90px; width:557px;}
	#nav ul{list-style:none;height:90px;}
		#nav ul li{display:inline;}
			#nav ul li a{float:left; background:url(../images/sprite.png); display:block;}
			
			#nav ul li a.about{width:110px; height:90px; background-position:-14px -91px;}
				#nav ul li a.about:hover, #nav ul li a.about.selected{background-position:-14px -182px;}
				
			#nav ul li a.portfolio{width:122px; height:90px; background-position:-124px -91px;}
				#nav ul li a.portfolio:hover, #nav ul li a.portfolio.selected{background-position:-124px -182px;}
				
			#nav ul li a.projects{width:117px; height:90px; background-position:-246px -91px;}
				#nav ul li a.projects:hover, #nav ul li a.projects.selected{background-position:-246px -182px;}	
				
			#nav ul li a.blog{width:79px; height:90px; background-position:-363px -91px;}
				#nav ul li a.blog:hover, #nav ul li a.blog.selected{background-position:-363px -182px;}	
				
			#nav ul li a.contact{width:127px; height:90px; background-position:-444px -91px;}
				#nav ul li a.contact:hover, #nav ul li a.contact.selected{background-position:-444px -182px;}			
					
/* Home page */
.home #content{width:950px; height:730px; position:relative; margin:0px auto; background:url(../images/sprite-home.png); background-position:0px -2px;}
#hover-coder{width:475px; height:730px; position:absolute; top:0px; left:0px;}
#hover-designer{width:475px; height:730px; position:absolute; top:0px; right:0px;}

#designer{width:475px; height:730px; position:absolute; top:0px; left:0px; z-index:10;}	
		#designer h2{width:250px; height:87px; margin-top:190px; background:url(../images/sprite-home.png); background-position:0px 173px; border:none !important; float:left;}
			#designer h2 span{display:none;}
		#designer p{width:250px;  float:left;}
		#designer .btn-big{margin:10px 0px 0px 85px; float:left; clear:both;}
		#designer strong{font-weight:normal !important;}
		
#coder{width:475px; height:730px; position:absolute; top:0px; right:0px; z-index:10;}	
		#coder h2{width:250px; height:87px; margin-top:190px; background:url(../images/sprite-home.png); background-position:-268px 173px; border:none !important;  float:right;}
			#coder h2 span{display:none;}
		#coder p{width:250px; float:right;}
		#coder .btn-big{margin:10px 85px 0px 0px; float:right; clear:both;}
		#coder strong{font-weight:normal !important;}

                
/* Content */
#container{display: none;}
#content{width:950px;margin:0px auto;}
#content h1{font-family: NeoSansRegular, Arial, Sans-serif; font-size:72px; font-weight:normal; letter-spacing:-5px;}
	#content .top-right{position:absolute; top:0px; right:0px;}
#content h4{font-size:25px; font-weight:normal;  border-bottom: #040707 1px solid; margin-bottom:10px; letter-spacing:-1px;}
#content h2{font-size:28px; font-weight:normal;  border-bottom: #040707 1px solid; margin-bottom:10px; letter-spacing:-1px;}
	#content h2 span{color:#afafaf; font-style:italic; float:right; font-size:15px; padding-top:8px; letter-spacing:normal;}
#content h3{font-size:18px; font-weight:normal;  padding:12px 0px;}

#content p{line-height:1.3em; padding:10px 0px;}
	#content p.highlight{font-size:20px; color:#979797; font-style:italic;}
	#content p.date{font-size:12px; color:#979797; font-style:italic;padding:0px; text-align:right; margin-top:-5px;}
	#content p a{font-style:normal; font-weight:normal;}
	
#content a, #content a:link{color:#63b7bb; text-decoration:none;font-style:italic; font-weight:bold;}
#content a:hover{text-decoration:underline;}
#content a:active{outline:none;}
	#content a.site{font-size:20px; font-weight:normal;}

#content ul.regular{list-style:disc;list-style-position:inside;padding:10px 0px;}
	#content ul.regular li{padding:8px 0px;}
	
#content .back-to-portfolio{margin:-35px 0px 0px 27px;}

/* Content Boxes */
.box{padding:40px 0px;}

.box.two-thirds-left .box-left{width:600px;float:left;}
.box.two-thirds-left .box-right{width:300px;float:right;}

.box.two-thirds-right .box-left{width:300px;float:left;}
.box.two-thirds-right .box-right{width:600px;float:right;}

.box.half .box-left{width:450px;float:left;}
.box.half .box-right{width:450px;float:right;}

/* Custom content */
.box.iam{background:url(../images/oracle.jpg); height:300px;}
	.box.iam .box-left{width:280px;}
	.box.iam .box-right{width:280px;}
	
.box.big-text{font-size:72px; color:#afafaf; font-style:italic; text-align:center; letter-spacing:-5px;}
	
/* Buttons */
.btn-big{background:url(../images/sprite.png); width:83px; height:83px; z-index:3; display:block; cursor:pointer;}
	.btn-big.left{background-position:-335px -5px;}
		.btn-big.left:hover{background-position:-424px -5px;}
	.btn-big.right{background-position:-514px -5px;}
		.btn-big.right:hover{background-position:-603px -5px;}
	.btn-big.force{background-position:-749px -139px;}
		.btn-big.force:hover{background-position:-838px -139px;}
.next{position:absolute; top:370px; width:83px; height:83px; z-index:10; right:50px;}
.previous{position:absolute; top:370px; width:83px; height:83px; z-index:10; left:50px;}
	
/* Circles list */
ul.circles{list-style:none;}
	.circles li{float:right; width:63px; height:63px; background:url(../images/sprite.png);margin-left:3px;}
		.circles li span{display:none;}
		.circles li a{width:100%; height:100%; display:block; }
		.circles li.java{background-position:0px -400px;}
		.circles li.html{background-position:-66px -400px;}
		.circles li.css{background-position:-132px -400px;}
		.circles li.php{background-position:-198px -400px;}
		.circles li.js{background-position:-264px -400px;}
		.circles li.linux{background-position:-330px -400px;}
		.circles li.mysql{background-position:-396px -400px;}
		.circles li.android{background-position:-462px -400px;}
		.circles li.user-interface{background-position:-528px -400px;}
		.circles li.uml{background-position:-594px -400px;}
                .circles li.seo{background-position:-660px -400px;}
                .circles li.social-media{background-position:-724px -400px;}
		
		.circles li.resume{background-position:-0px -472px;}
			.circles li.resume:hover{background-position:-66px -472px;}
		.circles li.twitter{background-position:-132px -472px;}
			.circles li.twitter:hover{background-position:-198px -472px;}
		.circles li.contact{background-position:-264px -472px;}
			.circles li.contact:hover{background-position:-330px -472px;}
		.circles li.blog{background-position:-396px -472px;}
			.circles li.blog:hover{background-position:-462px -472px;}
		/*.circles li.email{background-position:-528px -472px;}
			.circles li.email:hover{background-position:-594px -472px;}*/
		.circles li.dribbble{background-position:-528px -472px;}
			.circles li.dribbble:hover{background-position:-594px -472px;}
		.circles li.linked-in{background-position:-660px -472px;}
			.circles li.linked-in:hover{background-position:-726px -472px;}
		.circles li.facebook{background-position:-792px -472px;}
			.circles li.facebook:hover{background-position:-858px -472px;}
                .circles li.tumblr{background-position:-922px -472px;}
			.circles li.tumblr:hover{background-position:-987px -472px;}
			
	.circles.about{padding-top:15px;}
		.circles.about li{float:left;}
		
/* Bar Chart */
ul.bar{list-style:none; padding-top:20px;}
	ul.bar li{height:35px; color:#FFF; text-align:left; font-style:italic; font-size:12px; line-height:35px; padding:0px 20px;margin-bottom:1px;}
		ul.bar li.axis{background:url(../images/x-axis.png); height:50px;}
		
		ul.bar li.red{background:#bc0000;}
		ul.bar li.aqua{background:#63b7bb;}
		ul.bar li.yellow{background:#ffaf00;}
		ul.bar li.green{background:#8bbe00;}
		ul.bar li.orange{background:#ff9000;}
		ul.bar li.blue{background:#0096cd;}
		ul.bar li.pink{background:#eaad9d;}
		
		ul.bar li.one{width:60px;}
		ul.bar li.two{width:160px;}
		ul.bar li.three{width:260px;}
		ul.bar li.four{width:360px;}
		ul.bar li.five{width:460px;}
		ul.bar li.six{width:560px;}
			
/* Stats */
ul.stats{list-style:none; padding-top:20px;}
	ul.stats li{clear:both;height:34px;}
	ul.stats .number{float:right; font-style:italic; font-size:16px;}
	ul.stats .icon{background:url(../images/sprite.png); width:16px; height:16px; display:block; float:left; margin-right:15px;}
	ul.stats .page-views{background-position:-205px -377px;}
	ul.stats .alexa{background-position:-231px -377px;}
	ul.stats .pr{background-position:-257px -377px;}
	ul.stats .facebook{background-position:-283px -377px;}
	ul.stats .back-links{background-position:-309px -377px;}
	ul.stats .twitter{background-position:-335px -377px;}
	ul.stats .comments{background-position:-361px -377px;}
	
/* Articles */
ul.articles{list-style:none; padding-top:20px;}	
	ul.articles li{height:85px; padding:10px 0px;}
		ul.articles li .thumb{width:85px; height:85px; border:1px solid #C7C7C7;}
	
/* Portfolio Items */
ul.portfolio-items{list-style:none;}
	ul.portfolio-items li{width:296px; height:157px; float:left; margin-right:20px; margin-bottom:20px; border:1px solid #C7C7C7;}
		ul.portfolio-items li.thumb-big{width:458px; height:243px; overflow:hidden;}
	ul.portfolio-items li:hover{border:1px solid #63B7BB;}
		
/* Sitemap */
ul.sitemap{list-style:none; width:235px;}
	ul.sitemap li{padding:5px 0px;}
	ul.sitemap li.portfolio{padding-top:50px; border-bottom:#040707 solid 1px;}
ul.first{border-left:#040707 solid 1px; padding-left:20px;}
ul.main{width:200px !important;}

/* Tags */
a.tag{color:#fff !important; padding:5px 10px; background:#BBB; float:left; margin:5px 5px 0px 0px; font-weight:normal !important;}
	a:hover.tag{text-decoration:none !important; background:#CCC;}
		
/* Contact Form */
.contact-form{width:450px; position:relative; padding:30px 0px; border:1px solid #C7C7C7;}
	.contact-form .row{margin:6px 37px 6px 30px; clear:both;}
	.contact-form label{width:110px; display:block; float:left; height:40px; line-height:40px;}
	.contact-form .required{width:250px; height:30px; border: #c7c7c7 solid 1px;}
	.contact-form textarea{height:260px !important; padding:5px 10px 0px 10px;}
	.contact-form input, .contact-form textarea{font-family: Arial, sans-serif; color:#979797; font-style:italic; font-size:18px; padding:5px 10px 0px 10px;}
	.contact-form .submit{border:none; position:absolute; bottom:100px; left:30px; text-transform: capitalize; text-indent:-9999px;}
	.contact-form .email-status{font-style:italic; font-size:38px; padding:106px 50px 0px 50px; height:260px; text-align:center;}
		
/* Form Validation */
.validation-failed {border: 1px solid #bc0000 !important;}
.validation-advice {color:#bc0000; font-weight:bold; font-style:italic; font-size:12px;float:right; width:270px;padding:5px 0px 15px 0px;}
.fail{color:#bc0000;}
.success{color:#8bbe00;}

/* Slideshow */
#slideshow-container{position:relative;width:943px; height:500px; border: #c7c7c7 solid 1px;}
#slideshow img { width:943px; height:500px; display:block; position:absolute; top:0; left:0; z-index:1;}

a.toc { position:absolute; right:0; top:-40px; z-index:2; display:block; width:22px; height:22px; background: url(../images/sprite.png); background-position:0px -373px; text-indent:-9999px;}
a.toc.active { background: url(../images/sprite.png); background-position:-34px -373px; }
#slideshow #next { position:absolute; top:-40px; right:27px; z-index:2; display:block; width:22px; height:22px; background: url(../images/sprite.png); background-position:-138px -373px; text-indent:-9999px;}
#slideshow #previous { position:absolute; top:-40px; right:200px; z-index:2; display:block; width:22px; height:22px; background: url(../images/sprite.png); background-position:-69px -373px; text-indent:-9999px;}

/* Counter */
#counter{position:relative; background:url(../images/counter.png) top right no-repeat; width:160px; height:295px; padding-left:55px;}
	#counter div{position:absolute;}
	#counter .years{top:20px; left:110px; font-size:90px; color:#FFF;}
		#counter .years span{position:absolute; top:75px; left:-20px; font-size:40px;}
	#counter .days{top:165px; font-size:33px;}
	#counter .hours{top:200px; font-size:26px;}
	#counter .minutes{top:230px; font-size:19px;}
	#counter .seconds{top:255px; font-size:17px;}
	#counter .spent{top:275px; font-size:15px;}
	
/* ie6 message */
#ie{display:none;width:1000px;margin:60px auto 20px auto;}
	#ie ul{position:absolute; top:15px; left:50%; margin-left:210px; width:280px;}

/* CSS Awards */
#ecxthecssawards{top:0px;right:0px;z-index:10;position:absolute;}
#ecxthecssawards a{width:69px;height:105px;text-indent:-8000px;display:block;background:url(../images/award_day_white.png);}

/* Share Buttons */
.share{width:270px; height:30px; position:absolute; top:10px; left:50%; margin-left:210px; z-index:10;}
	.share .twitter{width:180px; position:absolute; right:0px;}
	.share .facebook{width:80px; position:absolute; left:0px;}
	
/* Font Embedding */
@font-face{
	font-family: 'NeoSansRegular';
	src: url('neosans-webfont.eot');
	src: local('?'), url('neosans-webfont.woff') format('woff'), url('neosans-webfont.ttf') format('truetype'), url('neosans-webfont.svg#webfontZEnS3thV') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* Shadow */
.shadow, #slideshow-container, ul.portfolio-items li, ul.articles li .thumb, .contact-form{
	box-shadow:5px 5px 5px #DDD;
    -moz-box-shadow:5px 5px 5px #DDD;
    -webkit-box-shadow:5px 5px 5px #DDD;
}

/* Shadow - green */
.shadow, ul.portfolio-items li:hover{
	box-shadow:5px 5px 5px #a9d5d7;
    -moz-box-shadow:5px 5px 5px #a9d5d7;
    -webkit-box-shadow:5px 5px 5px #a9d5d7;
}

.thumb-big-projects{width:458px; height:250px; overflow:hidden;}

.face {
    position: relative;
    margin: 30px auto;
    width:  1000px;
    height: 1000px;
    z-index: -5;
   
}


.left_eye {
     position: absolute;
    left: 305px;
    top:  261px;
    width:  300px;
    height: 400px;
    background: url(../images/eye.png) no-repeat;
    z-index: -10;
    
}

.right_eye {
    position: absolute;
    left: 468px;
    top:  260px;
    width:  300px;
    height: 400px;
    background: url(../images/eye.png) no-repeat;
    z-index: -10;
    
}