/*  
Name: Adam Stewart 2013
Theme Name: Adam Stewart 2013
Version: 1.0
Author: Adam Stewart
Author URI: http://www.adamstewartdesigns.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, 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;
}

img,
object {
     max-width: 100%;
}

blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; 
}
  
/* Style
----------------------------------------------------------------------------------------------- */

body {
	margin: 0;
	padding: 0;
	color:#646464;
	background-color:#fff;
	font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
	font-size:16px;
	width:100%;
	height:100%;
}

html {
	width:100%;
	height:100%;
	
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
.clearfix {
	display: inline-block;
}
html[xmlns] .clearfix {
	display: block;
}
* html .clearfix {
	height: 1%;
}

.clear {
	clear:both;
}
h1, h2, h3, h4, h5, h6{
	padding:0;
	margin:0;
}
h1 {
	
}
h2 {
	
}
h3 {
	
	
}

h4 {
	
}
p {
	margin: 0;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 10px;
	padding-left: 0;
	line-height: 1.4em;
}

img {
	margin:0;
	padding:0;
}
a {
	color:#6D6E70;
	text-decoration:none;
}
a:hover {
	text-decoration:none;
}
::selection {
background:#27AAE1;
color:#fff;
}

::-moz-selection {
background:#27AAE1;
color:#fff;
}

::-webkit-selection {
background:#27AAE1;
color:#fff;
}

/* Tables */
table {
  background: white;
  margin-bottom: 1.25em;
  border: solid 1px #dddddd; 
}
  table thead,
  table tfoot {
    background: whitesmoke;
    font-weight: bold; 
}
    table thead tr th,
    table thead tr td,
    table tfoot tr th,
    table tfoot tr td {
      padding: 0.5em 0.625em 0.625em;
      font-size: 0.875em;
      color: #222222;
      text-align: left; 
}
  table tr th,
  table tr td {
    padding: 0.5625em 0.625em;
    font-size: 0.875em;
    color: #222222; 
}
  table tr.even, table tr.alt, table tr:nth-of-type(even) {
    background: #f9f9f9; }
  table thead tr th,
  table tfoot tr th,
  table tbody tr td,
  table tr td,
  table tfoot tr td {
    display: table-cell;
    line-height: 1.125em; 
}

/* We use this to get basic styling on all basic form elements */
input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea {
  background-color: white;
  font-family: inherit;
  border: 1px solid #cccccc;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.75);
  display: block;
  font-size: 0.875em;
  margin: 0 0 1em 0;
  padding: 0.5em;
  height: 2.3125em;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  transition: all 0.15s linear; 
}
  input[type="text"]:focus,
  input[type="password"]:focus,
  input[type="date"]:focus,
  input[type="datetime"]:focus,
  input[type="datetime-local"]:focus,
  input[type="month"]:focus,
  input[type="week"]:focus,
  input[type="email"]:focus,
  input[type="number"]:focus,
  input[type="search"]:focus,
  input[type="tel"]:focus,
  input[type="time"]:focus,
  input[type="url"]:focus,
  textarea:focus {
    background: #fafafa;
    border-color: #999999;
    outline: none;
}
  input[type="text"][disabled],
  input[type="password"][disabled],
  input[type="date"][disabled],
  input[type="datetime"][disabled],
  input[type="datetime-local"][disabled],
  input[type="month"][disabled],
  input[type="week"][disabled],
  input[type="email"][disabled],
  input[type="number"][disabled],
  input[type="search"][disabled],
  input[type="tel"][disabled],
  input[type="time"][disabled],
  input[type="url"][disabled],
  textarea[disabled] {
    background-color: #dddddd; 
}


/* Structure
----------------------------------------------------------------------------------------------- */

header{
	position:fixed;
	top:-70px;
	height:50px;
	border-bottom:1px solid #eaeaea;
	background: #FFF;
	width:100%;
	z-index:2000;
}
.logo{
	background:url(images/as-logo.svg) no-repeat top left;
	background-size:contain;
	width:100px;
	height:30px;
	float:left;
	text-indent:-9999px;
	margin:9px 0 0 20px;
}
nav ul li{
	display:inline-block;
	text-transform:uppercase;
	margin:0 10px 0 0;
	font-size:1.125em;
}
nav ul li:last-child{
	margin:0;
}
nav ul li.current_page_item{
	border-bottom:2px solid #f3c33e;
}
nav.main-nav ul{
	float:right;
	padding:16px 20px 0 0;
	
}
nav.main-nav ul li{
	font-weight:600;
}
section{
	min-height:400px;
	width:100%;
	padding:130px 6% 0 6%;
	position:relative;
	overflow:hidden;
}

footer{
	background:#d9ae49;
	width:100%;
	height:50px;
	z-index:1200;
	position:relative;
}
footer h1{
	font-size:1em;
	color:#8d7130;
	text-transform:uppercase;
	text-align:center;
	float:left;
	font-weight:300;
	z-index:2;
}
footer h1 span{
	background:#fff;
	display:inline-block;
	height:50px;
	padding:20px;
}
.copyright{
	float:left;
	font-size:0.850em;
	padding:23px 0 0 20px;
	color:#646464;
	position:relative;
	z-index:6;
}
.share{
	float:right;
	width:150px;
	padding:10px 0 0 0;
	
}

.top{
	float:right;
	font-size:0.850em;
	color:#fff;
	font-weight:600;
	position:relative;
	z-index:6;
	z-index:1200;
	position:relative;
	text-transform:uppercase;
}
.top a{
	color:#fff;
	height:50px;
	padding:22px 18px 20px 20px;
	display:block;
	margin: 0;
	background:#8d7130;
	-moz-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-ms-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-o-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
}
.top a:hover{
	background:#646464;
	
}
#ascrail2000{
	z-index:1000 !important;
}

/* Mobile
----------------------------------------------------------------------------------------------- */


.home-image{
	display:none;
	background:url(images/adam-stewart-birmingham-developer-2015.jpg) no-repeat #000;
	background-size:cover;
	width:100%;
	height:350px;
	opacity:1 !important;
}
.mobile-more{
	border:1px solid #fff;
	padding:10px;
	width:100%;
	text-transform:uppercase;
	color:#fff;
	margin:20px 0 30px 0;
	text-align:center;
	cursor:pointer;
	font-weight:400;
	display:none;
}
.view-less{
	display:none;
}
.mobile-button{
	position:absolute;
	top: 15px;
	right: 10px;
	width: 53px;
	display:none;
}
.show-menu{
	background:url(images/menu.svg) no-repeat right;
	background-size:contain;
	text-indent:-99999px;
	height:100%;
	cursor:pointer;
	width: 33px;
	height: 20px;
	float:right;
	margin:0 5px 0 0;
}
.close-menu{
	display:none;
	cursor:pointer;
	text-transform:uppercase;
	font-weight:600;
	font-size:0.850em;
	padding:5px 0 0 0;
	float:right;
}
nav.mobile-nav{
	border-bottom:1px solid #eaeaea;
	background: #FFF;
	position:fixed;
	top:-250px;
	z-index:2000;
	padding:10px;
	text-align:center;
	width:100%;
}
nav.mobile-nav li{
	display:inline-block;
	padding:5px;
}

/* Home
----------------------------------------------------------------------------------------------- */

#home{
	height:100%;
	width:100%;
	min-height:600px;
	padding:0;
	background: #000;
}
.home-inner{
	background:url(images/adam-stewart-birmingham-developer-2015.jpg) #000 no-repeat;
	background-attachment:fixed;
	background-size:cover;
	position: fixed;
	top: 0;
	height: 100%;
	width: 100%;
	padding:0 6% 0 6%;

}
.home-logo{
	background:url(images/as-logo.svg) no-repeat top left;
	background-size:contain;
	width:100px;
	height:65px;
	text-indent:-9999px;
	position:fixed;
	z-index:200;
	top:20px;
	left:6%;
}
nav.home-nav{
	position:fixed;
	z-index:200;
	top:40px;
	right:6%;
}
nav.home-nav ul{
	padding:0 0 5px 0;
	border-bottom:3px solid #f3c33e;
	width:452px;
	text-align:center;
}
nav.home-nav ul li{
font-size:1.425em;
font-weight:400;
}
nav.home-nav a{
	color: #fff;
}
nav a{
	-moz-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-ms-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-o-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);  
	transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
}
nav a:hover{
	color:#f3c33e;
}
#home h1{
	font-size:4.250em;
	color: #fff;
	text-transform:lowercase;
	font-weight:normal;
	letter-spacing:-2px;
	position:fixed;
	z-index:200;
	top:190px;
	right:6%;
}
#home h2{
	font-weight:300;
	font-size:1.625em;
	position:fixed;
	right:6%;
	width:580px;
	text-align:right;
	top:260px;
	z-index:200;
	
}
#home h2 span{
	display:inline;
	padding:1px 0 2px 0;
	line-height:1.4em;
	color: #999;
	background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
	box-shadow: 10px 0 0 rgba(0, 0, 0, 0.8), -10px 0 0 rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 10px 0 0 rgba(0, 0, 0, 0.8), -10px 0 0 rgba(0, 0, 0, 0.8);
	-webkit-box-shadow: 10px 0 0 rgba(0, 0, 0, 0.8), -10px 0 0 rgba(0, 0, 0, 0.8);
	-o-box-shadow: 10px 0 0 rgba(0, 0, 0, 0.8), -10px 0 0 rgba(0, 0, 0, 0.8);
}

#home h2 a{
	font-weight:400;
	color:#fff;
	-moz-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-ms-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-o-transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);  
	transition:color 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
}
#home h2 a:hover{
	color:#f3c33e;
}
#home h2 span.checkin{
	background:none !important;
	box-shadow:none !important;
}
#home h2 span.checkin span{
	background:none;
	box-shadow:none;
}
#home h2 .artist{
	font-weight:400;
	cursor: help;
	color:#fff;
	background:none !important;
	box-shadow:none !important;
}

.home-bottom{
	background:url(images/black-fade.png) repeat-x bottom;
	height:150px;
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
	z-index:50;
	cursor:pointer;
}
.home-bottom a{
	display:block;
}
.more{
	margin:auto;
	text-align:center;
	background:url(images/arrow-down-white.svg) no-repeat center bottom;
	background-size:contain;
	text-indent:-9999px;
	display:block;
	height:60px;
	width:60px;
	margin-top:55px;
	z-index:100;
	border-radius:60px;
	border:3px solid #fff;
	-moz-transition:all 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:all 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-ms-transition:all 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-o-transition:all 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	transition:all 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
}
.home-bottom:hover .more{
	margin-top:65px;
}

/* About
----------------------------------------------------------------------------------------------- */

#about{
	width:100%;
	background:#f3c33e;
	min-height:400px;
	padding:0;
	position:relative;
	z-index:500;
	
}
#about .content{
	padding:130px 4.4% 40px 4.4%;
	border-left:20px solid #d9ae49;
	border-right:20px solid #d9ae49;
}
#about h1{
	text-transform:lowercase;
	font-weight:normal;
	font-size:2.250em;
	margin:0 0 20px 0;
	padding: 0;
}

#about h1:after{
content: " ";
border-bottom: 3px solid #fff;
display: block;
height: 20px;
width: 80px;
margin: 0;
}

.column{
	width:60%;
	float:left;
	font-weight:300;
}
.column a{
	font-weight:400;
	color: #555;
}
#about aside{
	float:right;
	width:25%;
	padding:0 20px;
	margin:10px 0 0 0;
}
#about aside h2{
	font-weight:normal;
	font-size:1.375em;
	margin:0 0 20px 0;
	color:#5b491f;
	text-transform:lowercase;
}
/*
.rundown li{
	margin:0;
	color:#fff;
}

.rundown li:before{
	content:"■";
	color:#f3c33e;
	font-size:1.5em;
	margin:0 10px 0 0;
}
*/
.rundown{
	
	
}
.rundown li{
	padding:8px;
	color:#5b491f;
	background-color:#d9ae49;
	margin:0 15% 7px 0;
	
}
.rundown li:nth-child(even){
	margin:0 0 7px 0;
}
.caroufredsel_wrapper{
	position:relative !important;
	width:100% !important;
	background:#fff;
}
.quote-prev{
	position:absolute;
	z-index:1000;
	top:42%;
	left:20px;
	height:70px;
	width:70px;
	background:url(images/arrow-left-circle.svg) no-repeat center bottom;
	background-size:contain;
	text-indent:-9999px;
	cursor:pointer;
	-moz-transition:left 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:left 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-ms-transition:left 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-o-transition:left 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	transition:left 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
.quote-next{
	position:absolute;
	z-index:1000;
	top:42%;
	right:20px;
	height:70px;
	width:70px;
	background:url(images/arrow-right-circle.svg) no-repeat center bottom;
	background-size:contain;
	text-indent:-9999px;
	cursor:pointer;
	-moz-transition:right 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:right 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-ms-transition:right 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-o-transition:right 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	transition:right 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
}
.quote-next:hover{
	right:10px;
}
.quote-prev:hover{
	left:10px;
}
.quotes{
	width:100%;
	position:relative;
	overflow:hidden;
	
}
.quotes ul{
	background:#fff;
	width:100% !important;
	text-align:center !important;
	-moz-transition:height 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:height 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-ms-transition:height 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-o-transition:height 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	transition:height 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	position:relative !important;
	left:0 !important;
	overflow: hidden;
}
.quotes li{
	width:100%;
	position:relative !important;
	margin:0 !important;
	padding:50px 18%;
	float:left;
}
.quotes blockquote{
	color:#efc050;
	font-style:italic;
	font-weight:400;
	font-size:1.425em;
	line-height:1.3em;
}
.quotes h2{
	color:#999999;
	font-weight:bold;
	text-transform:uppercase;
	font-size:1.125em;
	margin:30px 0 0 0;
}
.company{
	display:block;
	font-size:0.850em;
}

/* Skills
----------------------------------------------------------------------------------------------- */

#skills{
	width:100%;
	background:#646464;
	border-left:20px solid #555;
	border-right:20px solid #555;
	padding:130px 4.4% 70px 4.4%;
	color:#fff;
	position:relative;
	z-index:500;
}

#skills h1{
	text-transform:lowercase;
	font-weight:normal;
	font-size:2.250em;
	margin:0 0 20px 0;
	padding: 0;
}

#skills h1:after{
content: " ";
border-bottom: 3px solid #efc050;
display: block;
height: 20px;
width: 80px;
margin: 0;
}


.comment{
	color:#333;
	font-weight:400;
	line-height:1.5em;
}
.comment span{
	color:#333;
	font-size:2em;
	font-weight:bold;
	
	
}
.comment span.first{
	padding:0 10px 10px 0;
}
.comment span.last{
	padding:0 0 10px 10px;
}
.skills {
	text-align: left;
	margin: 40px 0 30px 0;
}
.skills li {
	list-style: none;
	display:inline-block;
	color:#fff;
	width:47%;
	margin:0 5% 0 0;
}
.skills li:nth-child(even){
	margin:0;
}
.skills .bar {
	margin-bottom: 13px;
	background-color: #e4e4e4;
	background-color: #ebebeb;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52) inset;
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52) inset;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52) inset;
	-o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52) inset;
}
.skills li span {
	height: 15px;
	width: 0px;
	display: block;
	background-color: #efc050;
	
	position: relative;
}
.skills li span strong {
	position: absolute;
	right: -18px;
	top: -33px;
	padding: 7px 8px;
	background-color: #333;
	color: #fff;
	font-size: 0.725em;
	display: block;
	opacity:0;
}
.skills li span strong:after {
	border-color: #333 transparent;
	border-style: solid;
	border-width: 5px 5px 0;
	bottom: -5px;
	content: "";
	display: block;
	left: 12px;
	position: absolute;
	width: 0;
}

.linkedin-button{
	color:#fff;
	padding:10px;
	border:1px solid #fff;
	position:absolute;
	top:145px;
	right:5%;
	text-transform:uppercase;
}
/*
.skills-container{
	width:50%;
	padding:0 0 20px 0;
}
.skill{
	width:124px;
	height:124px;
	float:left;
	margin:0 40px 40px 0;
	border:4px solid #f3c33e;
	border-radius:100px;
	background:#646464;
	text-align:center;
	position:relative;
}
.skill h2{
	width:120px;
	height:120px;
	background:#646464;
	border-radius:100px;
	z-index:200;
	font-size:0.725em;
	left:-3px;
	top:-3px;
	position:relative;
}
.skill h2 span{
	position: absolute;
	display:block;
	width: 100%;
	top: 46%;
	font-size:1.5em;
	font-weight:300;
	color:#fff;
}

.skill:hover .skill-pie{
	-moz-transform: scale(1.07);
-webkit-transform: scale(1.07);
-o-transform: scale(1.07);
transform: scale(1.07);
-ms-transform: scale(1.07);
filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=2, M12=-0, M21=0, M22=2);
	
}
.skill-pie{
	height:138px;
	width:138px;
	top:-12px;
	right:-11px;
	position:absolute;
	-moz-transition:all 0.25s ease-out;
	-webkit-transition:all 0.25s ease-out;
	-ms-transition:all 0.25s ease-out;
	-o-transition:all 0.25s ease-out;
	transition:all 0.25s ease-out;
	text-indent:-99999px;
}
.quarter{
	background:url(images/quarter.svg) no-repeat;
	background-size:cover;
}

.half{
	background:url(images/half.svg) no-repeat;
	background-size:cover;
}
.three-quarters{
	background:url(images/three-quarters.svg) no-repeat;
	background-size:cover;
}
.full{
	background:url(images/full.svg) no-repeat;
	background-size:cover;
}



/* Instagram
----------------------------------------------------------------------------------------------- */

#instagram{
	width:100%;
	height:155px;
	background:#333;
	position:relative;
	z-index:500;
}

#instagram iframe{
	width: 100%;
}

 
/* Portfolio
----------------------------------------------------------------------------------------------- */

#portfolio{
	width:100%;
	background:#fff;
	min-height:600px;
	position:relative;
	z-index:500;
}
#portfolio > h1{
	text-transform:lowercase;
	font-weight:normal;
	font-size:2.250em;
	margin:0 0 20px 0;
	color:#f3c33e;
}
#portfolio > h1:after{
content: " ";
border-bottom: 3px solid #646464;
display: block;
height: 20px;
width: 80px;
margin: 0;
}

.portfolio-container{
	width:105%;
	padding:30px 0 30px 0;
}
.portfolio{
	width:28%;
	margin:0 5% 5% 0;
	float:left;
	height:280px;
	position:relative;
	background-repeat:no-repeat;
	background-size:cover;
	opacity:0;
}
.project-info{
	width:100%;
	height:100%;
	padding:20px;
	background-image:url(images/trans-grey-80.png);
	-moz-transition:background-image 0.25s ease-in-out;
	-webkit-transition:background-image 0.25s ease-in-out;
	-ms-transition:background-image 0.25s ease-in-out;
	-o-transition:background-image 0.25s ease-in-out;
	transition:background-image 0.25s ease-in-out;
}
.hover{
	background-image:url(images/trans-grey-40.png);
}
.portfolio h1{
	font-size:1.250em;
	margin:0 0 10px 0;
	color:#fff;
}
.portfolio ul{

}
.portfolio ul li{
	display:inline-block;
	padding:5px;
	font-size:0.725em;
	margin:0 5px 8px 0;
	background-color:#d9ae49;
}
.portfolio a{
	padding:8px;
	text-align:center;
	color:#fff;
	font-weight:600;
	text-transform:uppercase;
	font-size:0.925em;
	border:1px solid #fff;
	display:block;
	position:absolute;
	bottom:20px;
}

/* Connect
----------------------------------------------------------------------------------------------- */

#connect{
	width:100%;
	background:#f3c33e;
	min-height:300px;
	padding:0;
	position:relative;
	z-index:500;

}
#connect h1{
	text-transform: uppercase;
	color:#FFF;
	font-weight:normal;
	font-size:2em;
	padding:50px 6% 10px 6%;
	text-align:center;
	border-left:20px solid #d9ae49;
	border-right:20px solid #d9ae49;
	z-index:1200;
	position:relative;
}
#connect p{
	text-align:center;
	color:#fff;
	font-size:1.250em;
	font-weight:300;
}
#twitter{
	width:100%;
	padding:40px 0 40px 0;
	background:#FFF;
	background: url(images/twitter-bkg.png) no-repeat top center #fff;
	text-align:center;
}
#twitter h1{
	background:url(images/twitter-bird.svg) no-repeat;
	background-size:contain;
	width:50px;
	height:50px;
	margin:auto;
	margin-top:30px;
	text-indent:-99999px;
	border:none;
	padding:0;
}
.tweet{
	width:700px;
	margin:auto;
	min-height:150px;
	text-align:center;
	padding:20px 0 20px 0;
	font-size:1.375em;
	line-height:1.3em;

}
.date{
	font-size:0.725em;
	padding:10px 0 0 0;
	font-weight:700;
}
.connect-links{
	width:100%;
	text-align:center;
	padding:10px 0 50px 0;
	border-left:20px solid #d9ae49;
	border-right:20px solid #d9ae49;
	z-index:1200;
	position:relative;
}
.connect-links li{
	display:inline-block;
	width:70px;
	height:70px;
	margin:0 10px 0 10px;
	border-radius:60px;
	border:3px solid #fff;
	-moz-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-webkit-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-ms-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	-o-transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	transition:background-color 0.25s cubic-bezier(0.215, 0.610, 0.355, 1.000); 
	
}
.connect-links li a{
	display:block;
	width:100%;
	height:100%;
	text-indent:-99999px;
}
.connect-links li:hover{
	background-color:#fff;
}
li.twitter{
	background:url(images/twitter-white.svg) no-repeat;
	background-size:contain;
}
li.twitter:hover{
	background-image:url(images/twitter-yellow.svg);
	background-size:contain;
}
li.linkedin{
	background:url(images/linkedin-white.svg) no-repeat;
	background-size:contain;
}
li.linkedin:hover{
	background-image:url(images/linkedin-yellow.svg);
	background-size:contain;
}
li.lastfm{
	background:url(images/lastfm-white.svg) no-repeat;
	background-size:contain;
}
li.lastfm:hover{
	background-image:url(images/lastfm-yellow.svg);
	background-size:contain;
}
li.foursquare{
	background:url(images/foursquare-white.svg) no-repeat;
	background-size:contain;
}
li.foursquare:hover{
	background-image:url(images/foursquare-yellow.svg);
	background-size:contain;
}
li.instagram{
	background:url(images/instagram-white.svg) no-repeat;
	background-size:contain;
}
li.instagram:hover{
	background-image:url(images/instagram-yellow.svg);
	background-size:contain;
}
li.klout{
	background:url(images/klout-white.svg) no-repeat;
	background-size:contain;
}
li.klout:hover{
	background-image:url(images/klout-yellow.svg);
	background-size:contain;
}

/* Responsive
----------------------------------------------------------------------------------------------- */

@media screen and (min-width:1300px) {


	
}

@media screen and (min-width:1500px) {


.portfolio{
	width:20%;
}



}
@media screen and (min-width:1800px) {


	
}
@media screen and (min-width:2000px) {
	

	
}
@media screen and (max-width:1100px) {


}
@media screen and (max-width:1024px) {

#home{
	background-size:100%;
	height:auto;	
}
.home-inner{
	height: 600px;
}
#about aside {
width: 35%;

}
.home-logo {
	position:absolute;
}
nav.home-nav {
position: absolute;
}
#home h1{
	top:190px;
	right:0;
	padding:0 6% 0 6%;
	text-align:right;
	width:100%;
	opacity:1 !important;
	position:absolute;
}
#home h2{
	position:relative;
	right:auto;
	float:right;
}
#skills {
padding: 80px 4.4% 80px 4.4%;
}
#about .content {
padding: 80px 4.4% 40px 4.4%;
}
#skills {
padding: 80px 4.4% 80px 4.4%;
}
#portfolio {
padding: 80px 4.4% 80px 4.4%;
}
.portfolio{
	opacity:1;
}

}

@media screen (orientation:landscape) {

.portfolio{
	opacity:0;
}
#home{
	height:100%;
}

}

/* TABLETS */
@media screen and (max-width:950px) {
.portfolio{
	opacity:1;
}
.portfolio{
	width:45%;
}

}
@media screen and (max-width:850px) {

header{
	top:0 !important;
}
#home{
	height:auto;
	padding:0;
	background:none;
	min-height:200px;

}
.home-inner{
	position: relative;
	background: none;
	padding: 0;
	height: auto;
}
.home-logo, #home nav, .home-bottom{
	display:none;
}

.home-image{
	display:block;
}

.linkedin-button{
	top:87px;
}

#home h1{
	top:90px;
	right:0;
	padding:0 6% 0 6%;
	text-align:right;
	width:100%;
	opacity:1 !important;
	font-size:4em;
	position:absolute;
}
#home h2{
	position:relative;
	top:auto;
	right:auto;
	padding:40px 6% 40px 6%;
	text-align:center;
	width:100%;
	opacity:1 !important;
	border-top: 2px solid #eaeaea;
	
}
#home h2 span{
	color: #646464;
	background:none;
	box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
-o-box-shadow:none;
	line-height:1.3em;
}
#home h2 span a{
	color: #555;
}
#home h2 .artist{
	color: #555;
}

.quote-prev{
	left:10px;
}
.quote-next{
	right:10px;
}
.quotes li {
padding: 50px 10%;
}




}
@media screen and (max-width:780px) and (orientation:portrait) {
	


}

/* NEXUS 7 */
@media screen and (max-width:768px) {


}

@media screen and (max-width:720px) {

#home h1{
	font-size:3.5em
}
.column{
	float:none;
	width:100%;
	font-size:1.125em;
}
#about aside {
width: 100%;
float:none;
padding:40px 0 0 0;

}

.rundown li {
margin: 0 5% 7px 0;
width:47%;
display: inline-block;
}
.quote-prev, .quote-next{
	width:50px;
	height:50px;
}

.quotes blockquote {
font-size: 1.125em;
}
.quotes li {
padding: 50px 65px;
}
.quotes h2 {
	font-size:0.925em;
}
.tweet {
width: 100%;
padding:20px 50px 20px 50px;
font-size: 1.250em;
}
}

@media screen and (max-width:650px) {
	
.home-image{
	height:250px;
	background-position:-80px 0;

}
#home h2{
	font-size: 1.250em;
}

.connect-links li {
display: inline-block;
width: 60px;
height: 60px;
border:2px solid #fff;
	
}
.share{
	display:none;
}
#ascrail2000 {
	width:10px !important;
}
#ascrail2000 > div{
	width:10px !important;
}
#about .content, #skills, #connect h1, .connect-links{
	border-left-width:10px;
	border-right-width:10px;
}
.quote-prev{
	left:0;
}
.quote-next{
	right:0;
}


.comment {
	font-size:0.925em;
	line-height:1.8em;
}
.tweet {
width: 100%;
padding:20px;
font-size: 1.125em;
}
#connect h1 {
font-size: 1.5em;
}


}
/* MOBILES */
@media screen and (max-width:550px) {
	
header nav{
	display:none;
}
.quotes li {
padding: 50px;
}
.quotes blockquote {
font-size: 0.925em;
}
.portfolio-container{
	width:100%;
}
.portfolio{
	width:100%;
	margin:0 0 30px 0;
}
.mobile-button{
	display:block;
}
}


@media screen and (max-width:500px) {
	
nav.mobile-nav li{
	display:block;
	padding:10px;
}
.home-image{
	height:250px;
	background-position:-50px 40px;

}
#home h1{
	font-size:2em;
}
#home h2 {

padding: 40px 20px 40px 20px;
}
#about h1, #portfolio h1 {
font-size: 2em;
}
.mobile-about{
	display:none;
}
.mobile-more{
	display:block;
}
.rundown li {
margin: 0 0 7px 0;
width:100%;
display: block;
}
#skills h1 {
font-size: 2em;
}
.endskills {
font-size: 2.5em;
}
.skills li {
display: block;
width: 100%;
margin: 0;
}
.skills li p{
	width:70%;
	font-size: 0.850em;
}
.linkedin-button{
	top:auto;
	position: relative;
	width:100%;
	text-align:center;
	display:block;
	margin:30px 4.4% 0 4.4%;
}
.connect-links li{
	margin: 0 5px 0 5px;
	width:40px;
	height:40px;
}
.tweet {
width: 100%;
padding:20px;
font-size: 1em;
}
.copyright {
padding: 12px 0 0 20px;
width: 160px;
}
footer h1 span {
padding: 18px 10px;
}	
}
/* IPHONES */
@media screen and (max-width:400px) {

.home-image{
	background-position:0 45px;

}	

	
}

/* IPHONES */
@media screen and (max-width:320px) {

.home-image {
background-position: -40px 45px;
}

.connect-links li{
	margin: 0 2px 0 2px;
	
}

}

/* Images
----------------------------------------------------------------------------------------------- */
p img {
	padding: 0;
	max-width: 100%;
	margin:0;
}
/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
}
img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
}
.alignright {
	float: right;
}
.alignleft {
	float: left;
}
.post_image{
	float:left;
	margin: 0 10px 10px 0;
	padding:0;
}
#tour-buttons img.active{
	display: inline-block;
	margin-top: -13px !important;
}
#tour-buttons img.not-active{
	display:none;
}

/* Lists
----------------------------------------------------------------------------------------------- */
.entry ol {
 padding: 0 0 0 35px;
 margin: 0;
}
.entry ol li {
	margin: 0;
	padding: 0;
}
.postmetadata ul, .postmetadata li {
	display: inline;
	list-style-type: none;
	list-style-image: none;
}

.entry ul {
	padding: 0 0 0 25px;
}
.entry li {
	margin: 2px 0 0 0px;
	list-style-position:outside;
	padding-left:10px;
}
#sidebar ul, #sidebar ul ol {
	margin: 0;
	padding: 0;
}


/* Tags & Classes
----------------------------------------------------------------------------------------------- */
acronym, abbr, span.caps {
	cursor: help;
}
acronym, abbr {
	border-bottom: 1px dashed #999;
}

.center {
	text-align: center;
}

.screen-reader-text {
	position: absolute;
	left: -1000em;
}
hr {
	display: none;
}
a img {
	border: none;
	margin:0;
	padding:0;
}



/* Captions
----------------------------------------------------------------------------------------------- */
.aligncenter, div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.wp-caption {
	border: 1px solid #ddd;
	text-align: center;
	background-color: #f3f3f3;
	padding-top: 4px;
	margin: 10px;
}
.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}
.wp-caption p.wp-caption-text {
	font-size: 0.8em;
	line-height: 17px;
	padding: 7px;
	margin: 0;
}

.fixed{
	position:fixed !important;
}