@charset 'UTF-8';
@font-face
{
    font-family: 'LigatureSymbols';
    src: url('fonts/LigatureSymbols-2.11.eot?#iefix') format('embedded-opentype'),
         url('fonts/LigatureSymbols-2.11.woff') format('woff'),
         url('fonts/LigatureSymbols-2.11.ttf') format('truetype'),
         url('fonts/LigatureSymbols-2.11.svg#LigatureSymbols') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*********************************************************************************/
/* Basic                                                                         */
/*********************************************************************************/



	*
	{
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}

	body
	{

		background-size: 100%;
	} 

		body:before
		{
			content: '';
			position: fixed;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			z-index: -1;
			/*background: url('images/bg.png');
			 background-size: cover; */
		}

		body:after
		{
			content: '';
			position: fixed;
			left: 0;
			top: 0;
			width: 100%;
			background: url('images/overlay.png');
			z-index: -1;
		}
	
	body, input, textarea, checkbox
	{
		font-family: 'Source Sans Pro', sans-serif;
		font-weight: 305;
		color: #191919;
	}
	
	strong, b
	{
		font-weight: 400;
		color: #363636;
	}

	h1, h2, h3, h4,h5, h6
	{
		font-weight: 400;
		color: #363636;
	}
	
	blockquote
	{
		border-left: solid 0.5em #ddd;
		padding: 1em 0 1em 2em;
		font-style: italic;
	}
	
	em, i
	{
		font-style: italic;
	}
	
	hr
	{
		border: 0;
		border-top: solid 1px #ddd;
		padding: 1.5em 0 0 0;
		margin: 1.75em 0 0 0;
	}
	
	sub
	{
		position: relative;
		top: 0.5em;
		font-size: 0.8em;
	}
	
	sup
	{
		position: relative;
		top: -0.5em;
		font-size: 0.8em;
	}
	
	table
	{
		width: 100%;
	}
	
	table.style1
	{
		width: 100%;
	}
	
		table.style1 tbody tr:nth-child(2n+2)
		{
			background: #f4f4f4;
		}
		
		table.style1 td
		{
			padding: 0.5em 1em 0.5em 1em;
		}
		
		table.style1 th
		{
			text-align: left;
			font-weight: 400;
			padding: 0.5em 1em 0.5em 1em;
		}
	
		table.style1 thead
		{
			background: #222222;
			color: #fff;
		}
		
		table.style1 tfoot
		{
			background: #eee;
		}
		
		table.style1 tbody
		{
		}

/*FORM*/
	form
	{
	}

		form input.button, form input.text, form select,	form textarea, form option
		{
			border: 0;
			background: #f0f0f0;
			padding: 0.65em;
			width: 100%;
			resize: none;
		}	
		
		form textarea
		{
			height: 15em;
		}
		
		form input:focus, form select:focus, form textarea:focus
		{
			background: #f5f5f5;
		}

		form ::-webkit-input-placeholder
		{
			color: #999;
		}

		form :-moz-placeholder
		{
			color: #999;
		}

		form ::-moz-placeholder
		{
			color: #999;
		}

		form :-ms-input-placeholder
		{
			color: #999;
		}
				
		.checkbox
		{
			font-size: 14pt;
			line-height: 1.75em;
			color: #999;
		}

	br.clear
	{
		clear: both;
	}
	
	p, ul, ol, dl, table, blockquote, form
	{
		margin-bottom: 2em;
	}
	
	section, article
	{
		margin-bottom: 3em;
	}
	
	section > :last-child,	article > :last-child
	{
		margin-bottom: 0;
	}

	section:last-child, article:last-child
	{
		margin-bottom: 0;
	}

	.image
	{
		display: inline-block;
	}
	
		.image img
		{
			display: block;
			width: 100%;
		}

	.image-full
	{
		display: block;
		width: 100%;
		margin: 0 0 2em 0;
	}
	
	.image-left
	{
		float: left;
		margin: 0 2em 2em 0;
	}
	
	.image-centered
	{
		display: block;
		margin: 0 0 2em 0;
	}

		.image-centered img
		{
			margin: 0 auto;
			width: auto;
		}
		
	.button
	{
		display: inline-block;
		background-color: #222222;
		color: #999;
		border: 0;
		cursor: pointer;
		outline: 0;
		-moz-transition: background-color .25s ease-in-out;
		-webkit-transition: background-color .25s ease-in-out;
		-o-transition: background-color .25s ease-in-out;
		-ms-transition: background-color .25s ease-in-out;
		transition: background-color .25s ease-in-out;
	}

		.button:hover
		{
			background-color: #333333;
			color: #fff;
		}
		
		.button:active
		{
			background-color: #444444;
			color: #fff;
		}
	
		.button-alt
		{
			background-color: #777777;
		}

			.button-alt:hover
			{
				background-color: #888888;
			}
			
			.button-alt:active
			{
				background-color: #999999;
			}
	
	ul.style1
	{
		list-style: disc;
		padding-left: 1em;
	}
	
		ul.style1 li
		{
			padding-left: 0.5em;
		}
	
	ul.links
	{
	}
	
		ul.links li
		{
			display: inline-block;
		}

			ul.links li:before
			{
				display: inline;
				content: '\2022';
				opacity: 0.5;
			}
		
			ul.links li:first-child:before
			{
				display: none;
			}
		
	ol.style1
	{
		list-style: decimal;
		padding-left: 1.25em;
	}

		ol.style1 li
		{
			padding-left: 0.25em;
		}

	.byline
	{
		display: block;
		color: #5C5C5C;
	}
	
	.icon
	{
		text-decoration: none;
	}

		.icon:before
		{
			text-decoration: none;
			padding-right: 0.25em;
			font-family: 'LigatureSymbols';
			-webkit-text-rendering: optimizeLegibility;
			-moz-text-rendering: optimizeLegibility;
			-ms-text-rendering: optimizeLegibility;
			-o-text-rendering: optimizeLegibility;
			text-rendering: optimizeLegibility;
			-webkit-font-smoothing: antialiased;
			-moz-font-smoothing: antialiased;
			-ms-font-smoothing: antialiased;
			-o-font-smoothing: antialiased;
			font-smoothing: antialiased;
			-webkit-font-feature-settings: "liga" 1, "dlig" 1;
			-moz-font-feature-settings: "liga=1, dlig=1";
			-ms-font-feature-settings: "liga" 1, "dlig" 1;
			-o-font-feature-settings: "liga" 1, "dlig" 1;
			font-feature-settings: "liga" 1, "dlig" 1;
		}
		
/*********************************************************************************/
/* Icons                                                                         */
/*********************************************************************************/

	/*
		http://kudakurage.com/ligature_symbols/
	
		Then simply add the CSS for it in this format:
		
		.icon-(name):before		{ content: '(unicode)'; }
	*/
	
	.icon-home:before			{ content: '\E072';	}
	.icon-user:before			{ content: '\E137'; }
	.icon-services:before		{ content: '\E055'; }
	.icon-testimonials:before 	{ content: '\E10b'; }
	.icon-mail:before			{ content: '\E08a'; }
	.icon-gallery:before		{ content: '\E074'; }

	
	.icon-facebook:before		{ content: '\E047'; }
	.icon-linkedin:before		{ content: '\E083'; }
	.icon-twitter:before		{ content: '\E12f'; }
	.icon-skype:before			{ content: '\E11b';	}
	
	.icon-share:before			{ content: '\E11f';	}
	
	.icon-right:before			{ content: '\E112'; }
	.icon-up:before				{ content: '\E135'; }
	.icon-upload:before			{ content: '\E136';	}
		
/*********************************************************************************/
/* Nav                                                                           */
/*********************************************************************************/
	
	#nav
	{
	}
	
		#nav a
		{
			position: relative;
			display: inline-block;
			color: #fff;
			width: 1em;
			height: 1em;
			line-height: 0.9em;
		}

			#nav a.icon:before
			{
				padding-right: 0;
			}
		
/*********************************************************************************/
/* Panels                                                                        */
/*********************************************************************************/

	#main
	{
		position: relative;
		overflow: hidden;
	}

	.panel
	{
		position: relative;
	}

	/* Me */
	
		#me
		{
		}
		
			#me .pic
			{
				position: relative;
				display: block;
			}

				/*
					The pseudo element below applies a noise pattern to the "me" image. It's
					meant to help mask blurriness, but you can remove it if you don't like it.
				*/
			
				#me .pic:before
				{
					content: '';
					position: absolute;
					top: 0;
					left: 0;
					background: url('images/overlay.png');
					width: 100%;
					height: 100%;
					z-index: 1;
				}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

	#footer
	{
		color: #ccc;
		color: rgba(255,255,255,0.45);
	}
	
		#footer a
		{
			color: #ddd;
			color: rgba(255,255,255,0.65);
			-moz-transition: color .25s ease-in-out;
			-webkit-transition: color .25s ease-in-out;
			-o-transition: color .25s ease-in-out;
			-ms-transition: color .25s ease-in-out;
			transition: color .25s ease-in-out;
		}
		
		#footer a:hover
		{
			color: rgba(255,255,255,1.0);
		}