﻿/* Distributed by http://freehtml5templates.com */

/*** The All So Important RESET! ***/
html, body, div, span, h1, h2, h3, h4, h5, h6, p, ol, ul, li, form, label, legend, caption, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section, summary {
   margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
strong{
	font-size:17px;
	font-family: inherit;
	}
ol, ul {
	list-style: none;
}

img {text-align : center;
	max-width : 100%;
	height : auto;
	width : auto;
}

aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block}

/************************ Basics ************************/
html {
	width: 100%;
	height: 100%;
}

 body {
    font-family:"Helvetica Neue","Helvetica","Arial","Verdana","sans-serif";
		font-size: 15px;
		font-weight:normal;
	font-style:normal;
line-height: 1.75;
	background-color: #fff;
width: 100%;
	height: 100%;
	color:#777;
	}

body: before {
    font-family:"Helvetica Neue","Helvetica","Arial","Verdana","sans-serif";
	font-size: 15px;
	font-weight:normal;
	font-style:normal;
	background-color: #fff;
width: 100%;
	height: 100%;
	line-height:24px;
	color:#777;
}

p {
	margin-bottom: 7px;
}


@font-face {
  font-family: 'Abel-Regular';
  src: url('Abel-Regular.eot');
  src: url('Abel-Regular.eot?#iefix') format('embedded-opentype'),
       url('Abel-Regular.woff') format('woff'),
       url('Abel-Regular.ttf') format('truetype'),
       url('Abel-Regular.svg#Abel-Regular') format('svg');
}


h1 {
   font: 60px/68px 'Abel-Regular', Arial, sans-serif;
   letter-spacing: 5px;
}

h2 {
   font: 33px/52px 'Abel-Regular', Arial, sans-serif;
   letter-spacing: 0px;
    text-align:left;
	line-height: 42px;
    padding-bottom: 8px;
}


h3 {
   font: 33px/52px 'Abel-Regular', Arial, sans-serif;
   letter-spacing: 0;
   text-align:center;
}
h5 {
   font: 28px 'Abel-Regular', Arial, sans-serif;
   letter-spacing: 0;
   text-align:left;
   color:#09F;
}
h6 {
   font: 17px  Arial, Helvetica, sans-serif;
   font-weight:bold;
   letter-spacing: 0;
   line-height:18px;
   text-align:left;
   color:#424242;
   padding-top:10px;
}
h7 {
   font: 60px 'Abel-Regular', Arial, sans-serif;
   font-weight:bold;
   letter-spacing: 0;
   line-height:18px;
      color:#424242;
   text-align:center;
   padding-top:10px;
   margin:auto;
}

a, p
 a {
	text-decoration: none;
	color: #333;
}

a:hover { 
text-decoration: none;
color: #9acd32; }

.leftfloat {
   float: left;
   clear: both;
}


header {
	position: relative;
	background: #191919;
	max-width : 100%;
	height: 100px;
	line-height: 0px;
	display: block;
}

header#bottom { 
	 margin: 72px auto; 
}



footer {
	height: auto;
	clear: both;
	padding:5px;
	padding-top:14px;
	padding-bottom:10px;
	max-width : 100%;
	margin: 0 auto;
	background-color: #191919; 
	color: #fff;
}

/************************ Containers ************************/

#container {
	
	max-width : 100%;
	margin: 0 auto;
	background-color: transparent;
	
}

.container1 {
   width: 90%;
   margin: auto;
   margin-left: auto;
   margin-right: auto;
 
	background-color: transparent;
	
	position: relative;
}

.content1 {
	position: relative;
	float: left;
	max-width : 100%;
	margin-top: -10px;
	margin-bottom: 16px;
	margin-left: 26px;
	background: #333;
	border-top: 3px solid #fff;
}

#main {
	position: relative;
	float: left;
	width: 100%;
	margin-top: -12px;
	margin-bottom: 0px;
}



* {
  margin: 0;
  padding: 0;
}

/************************ Navigation Menu ************************/
nav {
	position: right;
   width: 100%;
	height: 40px;
	text-align:right;
	padding-top: 50px;
	
}

nav ul li {
	float: left;
	margin-left: 13%;
}

nav ul li a{
	font-size: 20px;
	font-family: 'Abel-Regular',Arial, Helvetica, sans-serif;
	color:#fff;
	text-transform:capitalize;
	line-height:normal;
	font-weight:normal;
	display:block;	/* IE6, IE7 line height fix */
	background-color:transparent;
	text-decoration:none;
	margin-top:3px;
	-moz-opacity: 0.66;
   -khtml-opacity: 0.66;
   opacity: 0.66;
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=66)";
   filter: progid:DXImageTransform.Microsoft.Alpha(opacity=66);
   filter:alpha(opacity=66);
}
nav li:last-child a {
	border-right: 0;
}

nav a#pull {
	display: none;
}
a.nav-active {
    color:#ccc;
}


nav ul li a.grn:hover{
	color:#9acd32;

}

.green {	color: #9acd32; }


.clearing {
	clear: both;
	display: inline;
	width: 100%;
	height: 0;
	overflow: hidden;
}



 #title {
   float: left;
	 width: 200px;
	 padding-top: 15px;
}
.sticky-navigation
{
    padding: 0px;
    background:#333;
	opacity:0.9;
    font-size: 13px;
    width: 100%;
    font-weight:lighter;
	text-align:center;
	font-family: 'Abel-Regular',Arial, Helvetica, sans-serif;
	position:fixed;
	top:0px;
	z-index:9999;
	display: none;
}
.sticky-navigation.stuck
{
    position: fixed;
    top: 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
}
.sticky-navigation ul
{
    border-style: solid;
    border-width: 1px 0px 1px 0px;
    border-color: #808080;
    padding: 8px;
    list-style-type: none;    
}
.sticky-navigation ul li
{
    display: inline;
    padding: 2%;
}
.sticky-navigation a
{
    padding: 5px;
    color: #FFF;
    text-decoration: none;
}
.sticky-navigation a:hover
{
    
	color:#9acd32;
}
/* ---------- gallery styles start here ----------------------- */


#content {
   float: left;
   width: 100%;
   margin-left: 40px;
   margin-right:-20px;
}
#content4 {
	width: 90%;
	max-width: 1500px;
	margin-left: auto;
	margin-right: auto;
	  margin:auto;
	 text-align:center;
	font-family: inherit;
}

.gallery a {
	text-decoration: none;
}

img {
	border: none;
}



/* sidebar and footer widget blocks */


.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
	margin:auto;
	position: absolute;
right: 0px;
width: 20em;
}
#aboutme{

	text-align:left;
	font-size:1em;
	text-align:left;
	line-height:2em;
	}
	.image {
    -webkit-animation:spin 55s linear infinite;
    -moz-animation:spin 55s linear infinite;
    anima
	tion:spin 55s linear infinite;
}
.infobox {width:80%; margin:auto; text-align:center;}

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

	.section { clear: both; padding: 35px 0px 35px 0px; margin: auto; text-align:center; vertical-align:middle; } 
	 .col { display: block;  margin: auto; text-align:center; }
	  .col:first-child { } 
	   .group:before, .group:after { content:""; display:table; } 
	   .group:after { clear:both; } 
	    .span_1_of_3 { width: 50%; margin: 0% 0 0% 0%; padding: 0%; float:left; } 
		.butt { width: 1100px; margin: auto; padding: 0%;  padding-top: 3%; }
		
		 .resume2 { width: 34%; margin: 0% 0 0% 0%; padding-left: 3%; padding-right: 0%; float:left;border-left:solid #d7d7d7 thin;color:#616161; }
		   
		.paper { width:1100px; background-color:
   #FFF; margin:auto; -webkit-box-shadow: 4px 7px 18px -3px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 7px 18px -3px rgba(0,0,0,0.75);
box-shadow: 4px 7px 18px -3px rgba(0,0,0,0.75);}
		 
		  .resume1 { width: 48%; margin: 0% 0 0% 0%; padding: 0%; float:left;padding-right: 4%;padding-left: 1%; color:#616161; text-align:left;}
		 
		  .span_2_of_3 { width: 50%; margin: 0% 0 0% 0%; padding: 0%; float:right; }  
		  .span_1_of_1 { width: 24%; margin: 0% 0 0% 0%; padding: 0%; float:left; }
	 .span_3_of_3 { width: 50%; margin: 0% 0 0% 0%; padding: 0%; float:left; }
	.span_1_of_2 { width: 74%; margin: 0% 0 0% 0%; padding: 0%; float:left;  }
	
		  #first1{
			  padding-top:2em;}  
			       
.icon {
background-image: url(images/icon/ic_action_email2.gif);
background-position: left center;
background-repeat: no-repeat;
line-height:30px;
padding-left: 35px; /* Or size of icon + spacing */
}
.icon2 {
background-image: url(images/icon/ic_action_call2.gif);
background-position: left center;
background-repeat: no-repeat;
    height: 40px;
    padding:5px;
	line-height:30px;
padding-left: 32px; /* Or size of icon + spacing */
}
		 	.job1{padding:10px; text-align:left; vertical-align:middle; margin:auto; padding-top:20%; width:80%; line-height:2em; height:auto;}

	.jobs{
	padding:10px; text-align:left; vertical-align:middle; margin:auto; padding-top:40%; width:80%; line-height:2em; height:auto;}
  
	@media only screen and (max-width: 1300px) { .col { margin: 1% 0 1% 0%; } .span_1_of_3 { width: 100%; }
	  
	  .span_1_of_2{
		  width:60%;
		  
	  }
	  
	    .span_1_of_1{
		  width:40%;
		  
	  }
		  .jobs{
			  padding:0px;
			  width:80%;
			  padding-top:30%;
			  } }
	 	@media only screen and (max-width: 1200px) { .col { margin: 1% 0 1% 0%; } .span_1_of_3 { width: 100%; }
	  .span_3_of_3 { width: 100%; }
	  
	  .span_1_of_2{
		  width:100%;
		  
	  }
	  
	    .span_1_of_1{
		  width:100%;
		  
	  }
		    .job1{
			  padding:0px;
			  width:70%;
			  padding-top:0px;
			}
			
			.jobs{
			  padding:0px;
			  width:70%;
			  padding-top:0px;
			  } }

	@media only screen and (max-width: 1230px), screen and (max-device-width: 1230px) {
			 .butt { width: 100%; margin: auto; padding: 0%;   }

 .paper { width:95%;}
		}
/*-------Media------*/
@media only screen and (max-width: 950px), screen and (max-device-width: 950px) {
	 .butt { width: 100%; margin: auto; padding: 0%;   }
 .resume2 { width: 100%; margin: 0% 0 0% 0%; padding: 0%;  float:left; border:none; }   .resume1 { width: 100%; margin: 0% 0 0% 0%; padding: 0%; float:left; }
 .paper { width:95%;}
	
	footer {
	height: auto;
	clear: both;
	padding:5px;
	padding-top:14px;
	padding-bottom:10px;
	max-width : 100%;
	margin: 0 auto;
	background-color: #191919; 
	color: #fff;
}
	
 .span_1_of_1 { width: 100%;}
	
	.span_1_of_2 { width: 100%;}
	 .col { margin: 1% 0 1% 0%; } .span_1_of_3 { width: 100%; }
		  .span_2_of_3 { width: 100%; }
		  .span_3_of_3 { width: 100%; }
		   #first1{
			  padding:0px;} 
	
	
		  .jobs{
			  padding:0px;
			  width:80%;
			  
			  }
		 
	 .job1{
			  padding:0px;
			  width:80%;
			  
			  }

nav a#pull {
	display: none;
}
.infobox {width:90%;margin:auto; text-align:center;}
}
@media only screen and (max-width: 570px), screen and (max-device-width: 570px) {
.infobox {width:100%;margin:auto; text-align:center;}
	
	.container1 {
   width: 100%;
   margin: auto;
   margin-left: auto;
   margin-right: auto;
	background-color: transparent;
	padding-top: 10px;
	position: relative;
}
	#title {
   float:none;
margin: auto;
   text-align:center;
padding-bottom: 5px;
	 padding-top: 0px;
}

	.clearfix {
width: 100%;
		
	margin:auto;
	position:inherit;


}
header {
	position: relative;
	background: #191919;
	margin:auto;
	text-align:center;
	width: 100%;
	height:auto;
	
}
nav ul li {
	float:left;
	margin-left: 0%;
}
	

	
  	nav li {
  	
		display: block;
		float: left;
		width: 100%;
  	}
  	nav li a {
		border-bottom: 1px solid #576979;
		
	}
  	nav a {
	  	text-align: left;
	  	width: 100%;
	  	text-indent: 25px;
  	}
	nav {
		height: auto;
		padding-top:0px;
		border-bottom: 0;
		width: 100%;
	}
	nav ul {
		width: 100%;
		display: none;
		height: auto;
		padding-top:30px;
		
	}
	nav a#pull {
		display: block !important; 
		background-color: #283744;
		width: 100%;
		line-height:30px;
	padding:0px;
		color:#FFF;
		text-indent: 0px;

		
	}
	nav a#pull:after {
		content:"";
		background: url('nav-icon.png') no-repeat !important; 
		width: 30px;
		height: 30px;
		display: inline-block;
		float:left;
		position:static;
		margin-left:5px;
		margin-right:5px;
		margin-top:5px;
		
	}
	h6 {
   font: 15px  Arial, Helvetica, sans-serif;
   font-weight:bold;
   letter-spacing: 0;
   line-height:18px;
   text-align:left;
   color:#424242;
   padding-top:10px;
}
h7 {
   font: 45px 'Abel-Regular', Arial, sans-serif;
   font-weight:bold;
   letter-spacing: 0;
   line-height:18px;
   color:#424242;
   text-align:center;
   padding-top:10px;
   margin:auto;
}
em{
	font-size:13px;}

}
