/*----- Global reset ---------------------------------------------------------------*/		
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, 
form, fieldset, input, textarea, label, p, blockquote, th, td 						{ margin:0;padding:0; }

table 																				{ border-collapse:collapse;border-spacing:0; }
fieldset, img 																		{ border:0; }
address, caption, cite, code, dfn, em, strong, th, var 								{ font-style:normal;font-weight:normal; }
strong 																				{ font-weight:bold; }
ol, ul 																				{ list-style:none; }
caption, th 																		{ text-align:left; }
h1, h2, h3, h4, h5, h6 																{ font-size:100%;font-weight:normal; }
q:before, q:after 																	{ content:''; }
abbr, acronym 																		{ border:0; }



/*----- Clearfix ------------------------------------------------------------------*/		
.clearfix:after, .section:after, .fixed:after, .row:after							{ content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;	}
.clearfix, .section, .fixed, .row													{ display: inline-block; 	}
html[xmlns] .clearfix, html[xmlns] .section, html[xmlns] .fixed, html[xmlns] .row	{ display: block; 			}
* html .clearfix, * html .section, * html .fixed, * html .row						{ height: 1%; 				}
* 							 														{ outline: none; 			}
  

  
/*----- Typography ----------------------------------------------------------------*/		

	h1, h1 span																		{ font-size:22px;line-height:28px; }
	h2, h2 span																		{ font-size:18px;line-height:26px; }
	h3, h3 span																		{ font-size:16px;line-height:24px; }
	h4, h4 span																		{ font-size:14px;line-height:22px; }
	h5, h5 span																		{ font-size:12px;line-height:20px; }
	h6, h6 span																		{ font-size:10px;line-height:18px; }
	
	blockquote, blockquote p														{ font-size:24px;line-height:26px; } 

	h1 span, h2 span, h3 span, h4 span, h5 span, h6 span							{ color:#9ba8b1; }
	
	h1, h1 span, h2, h2 span, h3,h3 span, h4, h4 span, h5, h5 span, 
	h6, h6 span, blockquote, blockquote p, blockquote span, #header .nav  			{ font-family: 'Signika', sans-serif; } 

	h1, h1 span, h2, h2 span, h3,h3 span, h4, h4 span, h5, h5 span, 
	h6, h6 span																		{ margin-bottom:20px; }
	
	
	body, p, span, div 																{ font-family: 'Signika', sans-serif;font-size:14px;line-height:20px;color:#9ba8b1; } 
	p 																				{ margin-bottom:15px; }
	
	a 																				{ color:#9ba8b1;text-decoration:none; }
	a:link 																			{  }
	a:visited 																		{  }
	a:hover 																		{ text-decoration:none; }
	a:active 																		{  } 
	
	html 																			{ height:100%;background:url("images/background.jpg") no-repeat center top; }
	
	/*----- General --------------------------------------------------------------*/
	
	.last 																			{ margin-right:0 !important; }
	
	.m-left-30 																		{ margin-left:30px !important; }
	.m-right-30 																	{ margin-right:30px !important; }
	.m-top-30 																		{ margin-top:30px !important; }
	.m-bot-30 																		{ margin-bottom:30px !important; }
	
	/*----- Layout ---------------------------------------------------------------*/
	
	#layout-wrapper 																{ width:420px;height:570px;margin:140px auto 20px auto;position:relative;border-radius:10px;-webkit-border-radius:10px; }
	#layout 																		{ position:absolute;bottom:0;left:0;width:420px;height:570px;overflow:hidden;border-radius:10px;-webkit-border-radius:10px;box-shadow:0 2px 3px 0 rgba(0,0,0,0.5);background:#F9F9F9 url("images/back-navigation.png") no-repeat left bottom; }
	
	#pages 																			{ border-left:1px solid #fff;border-right:1px solid #fff;border-top:1px solid #fff;-webkit-border-radius:10px; }
	#pages > .size-small 															{ width:420px;height:520px; }
	#pages > .size-large 															{ width:960px;height:630px; }
	
	#pages > div 																	{ display:none; }
	#pages > div.active 															{ display:block; } 
	
	/*----- Navigation -----------------------------------------------------------*/
	
	#navigation 																	{ display:block;height:42px;background:url("images/back-navigation.png") no-repeat right bottom; }
	#navigation ul 																	{ height:42px;width:380px;margin:auto;text-align:center;background:url("images/back-navigation.png") no-repeat center bottom; }
	#navigation ul li 																{ height:30px;display:inline-block;margin-right:5px; } 
	#navigation ul a 																{ line-height:30px;padding:4px 7px;display:block;color:#9ba8b1;font-size:16px;font-weight:600; }
	#navigation ul a.active 														{ color:#5f707c; }
	#navigation 																	{ position:absolute;bottom:0;left:0;width:100%;  }
	
	#navigation ul a:link 															{  }
	#navigation ul a:visited 														{  }
	#navigation ul a:hover 															{ color:#5f707c; }
	#navigation ul a:active 														{  }
	
	/*----- About Page -----------------------------------------------------------*/
	
	.me-image 																		{ display:block;border-top-left-radius:10px;border-top-right-radius:10px;-webkit-border-top-right-radius:10px;-webkit-border-top-left-radius:10px; }
	.user-name 																		{ font-size:50px;margin-bottom:6px;color:#4a5b6d;font-weight:600;margin-top:15px;margin-left:28px; }
	.user-name span 																{ font-size:50px;color:#4a5b6d;font-weight:300; } 
	.user-subtitle 																	{ margin-left:30px;margin-bottom:15px; }
	 
	/*----- Resume Page ----------------------------------------------------------*/ 
	 
	#page-resume .skills 															{ margin-top:0px;width:400px; }
	#page-resume .skills li 														{ margin-bottom:4px;height:20px; }
	#page-resume .skills div 														{ float:left; }
	#page-resume .skill 															{ width:115px; }
	 
	#page-resume .rating 															{  }
	#page-resume .rating span 														{ background:#2d2d2d;width:11px;height:11px;float:left;margin-right:4px;display:block;float:left;margin-top:4px;border-radius:11px; }
	#page-resume .rating span.grey 													{ background:#c1c8cc; } 
	 
	.resume-wrapper 																{ padding:25px 40px 0 40px; }
	.resume-wrapper .left 															{ float:left;margin-right:80px;width:400px; }
	.resume-wrapper .right 															{ float:left;width:400px; }
	
	.resume-wrapper h3 																{ font-size: 18px;font-weight: 300 !important;line-height: 20px;margin-bottom: 0;color:#4a5b6d; }
	.resume-wrapper p 																{ margin-bottom: 30px;margin-top: 5px; }
	
	.strong-title 																	{ font-size: 24px;font-weight: 700 !important;line-height: 30px;margin-bottom: 8px;color:#4a5b6d; }
	.skills-title 																	{ margin-top:50px; }
	
	.info 																			{ margin-top:50px; }
	.info a 																		{ font-style:italic;font-size:16px;display:block;color:#4a5b6d; }
	
	.user-name.resume 																{ margin-left:0;margin-bottom:9px; }
	.user-subtitle.resume 															{ margin-left:2px;margin-bottom:50px;color:#9BA8B1; }
	
	/*----- Contact Page ---------------------------------------------------------*/ 
	 
	#contact-form 																	{ margin-top:10px;position:relative; }
	#contact-form input 															{ line-height:34px;display:block;height:34px;border:1px solid #e5e5e5;border-radius:34px;width:356px;margin-bottom:11px;padding-left:10px;color:#9ba8b1;font-size:14px;font-family: 'Signika', sans-serif; }
	#contact-form textarea 															{ width:356px;height:115px;display:block;border-radius:10px;border:1px solid #e5e5e5;font-family: 'Signika', sans-serif;color:#9ba8b1;font-size:14px;padding:10px 0 0 10px; }  
	  
	.wrapper-contact 																{ padding:25px 25px 0 25px; }

	.info.contact 																	{ border-bottom:1px solid #dae4eb;border-top:1px solid #dae4eb;margin:17px -25px;padding:17px 0 17px 25px; }
	.user-name.contact 																{ margin-left:0; }
	.user-subtitle.contact 															{ margin-left:2px; }
	
	.frm-state.error 																{ color:red; }
	.frm-state 																		{ position:absolute;bottom:-25px;font-size:13px;color:green;display:block;width:280px;text-align:center;font-style:italic;line-height:30px;font-family: 'Signika', sans-serif; }
	.frm-state-wrapper 																{ height:30px; }
	
	.button 																		{ display:block;line-height:31px;height:31px;text-align:center;border-radius:20px;color:#fff;text-shadow:0 1px #272c31;background:#373e46;padding:0 35px;margin-top:25px; }
	.button.contact 																{ float:right; }
	
	/*----- Work Page -----------------------------------------------------------*/

	#work-portfolio 																{ margin-top:10px;width: 920px; }
	#work-portfolio li 																{ position:relative;width:212px;height:215px;float:left;background:#fff;margin-right:12px;text-align:center;border-bottom:2px solid #e5e5e5;border-top:1px solid #e8f9eb;margin-bottom:12px; }
	#work-portfolio p 																{ line-height:16px;margin-top:5px; }
	#work-portfolio span 															{ display:none; }
	
	#work-portfolio li div 															{ width:212px;height:160px;background:url('images/back-overlay.png');position:absolute;top:0;left:0;display:block;display:none; }
	#work-portfolio div a 															{ display:block;width:212px;height:160px; }  
	
	#work-portfolio li:hover div 													{ display:block; }
	
	#top-section .left 																{ float:left; }
	#top-section .right 															{ float:right; }
	
	.work-wrapper 																	{ padding:30px 37px 0 37px;position:relative; }
	
	.work-nav li 																	{ float:left;margin-right:7px; }
	.work-nav a 																	{ font-size:14px; }
	.work-nav  																		{ margin-top:25px; }
	
	.work-nav a:link 																{  }
	.work-nav a:visited 															{  }
	.work-nav a:hover 																{ color:#677884; }
	.work-nav a:active 																{  }
	
	.work-nav a.active 																{ color:#677884; }
	
	.paging 																		{ position:absolute;top:593px;left:37px;height:20px; }
	.paging li 																		{ display:block;float:left;height:20px;width:20px;line-height:20px;text-align:center;color:#fff;font-size:14px;font-weight:bold;margin-right:2px; }
	.paging a 																		{ display:block;height:20px;width:20px; }
	.paging a.active 																{ background:#fff;border-radius:2px;color:#bcc8cf; }
	
	.paging a:link 																	{  }
	.paging a:visited 																{  }
	.paging a:hover 																{ background:#fff;border-radius:2px;color:#bcc8cf; }
	.paging a:active 																{  }
	
	.user-name.work 																{ margin-left:0; }
	.user-subtitle.work 															{ margin-left:2px; }
	
	/*----- Social Section -------------------------------------------------------*/
	 
	#social 																		{ text-align:center;height:37px;width:220px;margin:0 auto 0 auto;padding-bottom:50px; } 
	#social li 																		{ display:inline-block;margin-right:7px;width:37px;height:37px; float:left; } 
	#social a 																		{ display:block;width:37px;height:37px; } 
	
	#social .dribbble 																{ background:url('images/back-social.png') no-repeat 0 0; }
	#social .facebook 																{ background:url('images/back-social.png') no-repeat -37px 0; }
	#social .twitter 																{ background:url('images/back-social.png') no-repeat -74px 0; } 
	#social .in 																	{ background:url('images/back-social.png') no-repeat -111px 0; }
	#social .vimeo 																	{ background:url('images/back-social.png') no-repeat -148px 0; } 
	
	#social .dribbble:link 															{  }
	#social .dribbble:visited 														{  }
	#social .dribbble:hover 														{ background-position: 0 -37px; }
	#social .dribbble:active 														{  }
	
	#social .facebook:link 															{  }
	#social .facebook:visited 														{  }
	#social .facebook:hover 														{ background-position: -37px -37px; }
	#social .facebook:active 														{  }
	
	#social .twitter:link 															{  }
	#social .twitter:visited 														{  }
	#social .twitter:hover 															{ background-position: -74px -37px; }
	#social .twitter:active 														{  }
	
	#social .in:link 																{  }
	#social .in:visited 															{  }
	#social .in:hover 																{ background-position: -111px -37px; }
	#social .in:active 																{  }
	
	#social .vimeo:link 															{  }
	#social .vimeo:visited 															{  }
	#social .vimeo:hover 															{ background-position: -148px -37px; }
	#social .vimeo:active 															{  }