/*
Theme Name: Pinfolio
Author: Push Themes
Author URI: http://themeforest.net/user/pushthemes
Description: Responsive portfolio theme for designers, artists, agencies and creatives.
Version: 1.0
Tags: responsive, grid, portfolio, fluid
*/

/* 
 * HTML5 ✰ Boilerplate
 *
 * What follows is the result of much research on cross-browser styling. 
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 *
 * Detailed information about this CSS: h5bp.com/css
 * 
 * ==|== normalize ==========================================================
 */


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Force vertical scrollbar in non-IE
 * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; font-size: 13px; line-height: 1.231; }

body, button, input, select, textarea { font-family: sans-serif; color: #222; }


/* =============================================================================
   Links
   ========================================================================== */

a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }


/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/e 
 */

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/*
 * Correct overflow not hidden in IE9 
 */

svg:not(:root) { overflow: hidden; }


/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }


/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/* 
 * 1. Correct color not inheriting in IE6/7/8/9 
 * 2. Correct alignment displayed oddly in IE6/7 
 */

legend { border: 0; *margin-left: -7px; padding: 0; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 * 2. Correct inner spacing displayed oddly in IE6/7
 */

button, input { line-height: normal; *overflow: visible; }

/*
 * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
 */

table button, table input { *overflow: auto; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 */

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/* 
 * Remove inner padding and border in FF3/4: h5bp.com/l 
 */

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/* 
 * 1. Remove default vertical scrollbar in IE6/7/8/9 
 * 2. Allow only vertical resizing
 */

textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* ==|== primary styles =====================================================
   Author: 
   ========================================================================== */

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0;}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,th,var {font-style:normal;font-weight:normal;}
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;}
article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {display:block;}


/*--------------------------------------------------------------------------------

    Load Fonts

--------------------------------------------------------------------------------*/


/* Ropa Sans */
@font-face {
    font-family: 'RopaSans';
    src: url('fonts/RopaSans-Regular-webfont.eot');
    src: url('fonts/RopaSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/RopaSans-Regular-webfont.woff') format('woff'),
         url('fonts/RopaSans-Regular-webfont.ttf') format('truetype'),
         url('fonts/RopaSans-Regular-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;    
}
@font-face {
    font-family: 'RopaSans';
    src: url('fonts/RopaSans-Italic-webfont.eot');
    src: url('fonts/RopaSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/RopaSans-Italic-webfont.woff') format('woff'),
         url('fonts/RopaSans-Italic-webfont.ttf') format('truetype'),
         url('fonts/RopaSans-Italic-webfont.svg') format('svg');
    font-weight: normal;
    font-style: italic; 
}

/* Junction */
@font-face {
    font-family: "Junction";
    src: url('fonts/Junction-webfont.eot');
    src: url('fonts/Junction-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Junction-webfont.woff') format('woff'),
         url('fonts/Junction-webfont.ttf') format('truetype'),
         url('fonts/Junction-webfont.svg#Junction') format('svg');
    font-weight: normal;
    font-style: normal;    
}

/* Open Sans */
@font-face {
    font-family: 'OpenSans';
    src: url('fonts/OpenSans-Regular-webfont.eot');
    src: url('fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Regular-webfont.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'OpenSans';
    src: url('fonts/OpenSans-Bold-webfont.eot');
    src: url('fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Bold-webfont.woff') format('woff'),
         url('fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Bold-webfont.svg#OpenSans') format('svg');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'OpenSans';
    src: url('fonts/OpenSans-Italic-webfont.eot');
    src: url('fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Italic-webfont.woff') format('woff'),
         url('fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Italic-webfont.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'OpenSans';
    src: url('fonts/OpenSans-BoldItalic-webfont.eot');
    src: url('fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
         url('fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-BoldItalic-webfont.svg#OpenSans') format('svg');
    font-weight: bold;
    font-style: italic;
}

/* Droid Serif */
@font-face {
    font-family: 'DroidSerif';
    src: url('fonts/DroidSerif-Regular-webfont.eot');
    src: url('fonts/DroidSerif-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSerif-Regular-webfont.woff') format('woff'),
         url('fonts/DroidSerif-Regular-webfont.ttf') format('truetype'),
         url('fonts/DroidSerif-Regular-webfont.svgDroidSerif') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DroidSerif';
    src: url('fonts/DroidSerif-Italic-webfont.eot');
    src: url('fonts/DroidSerif-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSerif-Italic-webfont.woff') format('woff'),
         url('fonts/DroidSerif-Italic-webfont.ttf') format('truetype'),
         url('fonts/DroidSerif-Italic-webfont.svgDroidSerif') format('svg');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'DroidSerif';
    src: url('fonts/DroidSerif-Bold-webfont.eot');
    src: url('fonts/DroidSerif-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSerif-Bold-webfont.woff') format('woff'),
         url('fonts/DroidSerif-Bold-webfont.ttf') format('truetype'),
         url('fonts/DroidSerif-Bold-webfont.svgDroidSerif') format('svg');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'DroidSerif';
    src: url('fonts/DroidSerif-BoldItalic-webfont.eot');
    src: url('fonts/DroidSerif-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSerif-BoldItalic-webfont.woff') format('woff'),
         url('fonts/DroidSerif-BoldItalic-webfont.ttf') format('truetype'),
         url('fonts/DroidSerif-BoldItalic-webfont.svgDroidSerif') format('svg');
    font-weight: bold;
    font-style: italic;
}

/* Ico Moon */
@font-face {
    font-family: 'IcoMoon';
    src: url('fonts/IcoMoon.eot');
    src: url('fonts/IcoMoon.eot?#iefix') format('embedded-opentype'),
        url('fonts/IcoMoon.svg#IcoMoon') format('svg'),
        url('fonts/IcoMoon.woff') format('woff'),
        url('fonts/IcoMoon.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


/*--------------------------------------------------------------------------------

    Defaults for preview
    From style.php

--------------------------------------------------------------------------------*/


body {
	color:#525252;
	font-size:14px;
	font-family:OpenSans;
	font-weight:normal;
	font-style:normal;
	background:#e0e0e0 url('images/fg_bg_med.png') repeat top left;
	}
.foot {
	background:#505050 url('images/fg_bg_dark.png') repeat top left;
	}
h1 {
	color:#525252;
	font-size:1.6em;
	font-family:RopaSans;
	font-weight:normal;
	font-style:normal;
	}
h2 {
	color:#525252;
	font-size:1.6em;
	font-family:RopaSans;
	font-weight:normal;
	font-style:normal;
	}
h3 {
	color:#525252;
	font-size:1.4em;
	font-family:RopaSans;
	font-weight:normal;
	font-style:normal;
	}
.itemhead a:link,.itemhead a:active,.itemhead a:visited, #access li {
	color:#4b8cf7;
	font-size:1.1em;
	font-family:DroidSerif;
	font-weight:normal;
	font-style:italic;
	vertical-align: middle;
	}
.itemhead {
	color:#9e9e9e;
	font-size:1em;
	font-family:OpenSans;
	font-weight:normal;
	font-style:normal;
	}
.itemhead .widget-title {
	color:#9e9e9e;
	font-size:1.14em;
	font-family:DroidSerif;
	font-weight:normal;
	font-style:italic;
	}
.foot {
	color:#9e9e9e;
	font-size:1em;
	font-family:OpenSans;
	font-weight:normal;
	font-style:normal;
	}
.foot .widget-title {
	color:#9e9e9e;
	font-size:1.14em;
	font-family:DroidSerif;
	font-weight:normal;
	font-style:italic;
	}
@media (max-width: 1600px) { .itemcolumns { width: 33.3%; } }@media (max-width: 814px) { .itemcolumns { width: 49.9%; } }@media (max-width: 614px) { .itemcolumns { width: 100%; } }.current-menu-item a:link,.current-menu-item a:active,.current-menu-item a:visited,.current_page_item a:link,.current_page_item a:active,.current_page_item a:visited {
	color: #4b8cf7;
	border-bottom: 2px solid;
	background-color: transparent;
	padding: 0;
	padding-bottom: 3px;
	-moz-border-radius:0px; 
	border-radius:0px;
	-webkit-border-radius:0px;
}
.current-menu-item { margin-bottom: .4em; }
.foot .current-menu-item a:link,.foot .current-menu-item a:active,.foot .current-menu-item a:visited,.foot .current_page_item a:link,.foot .current_page_item a:active,.foot .current_page_item a:visited {
	border-bottom: 2px solid;
}

#access { padding: 20px 0 0 0; clear: both; }
#access .sub-menu { display: inline; padding: 0; margin: 0 -10px 0 10px; }
#access ul { padding: 0; }
//#access li { text-transform: none; }.foot li { text-transform: none; }
#access li:after { content: "/"; color: #d1d1d1; padding-left: 9px; padding-right: 0px; }
#access li:last-child:after, .foot li:last-child:after { content: none; }
#access ul { margin-bottom: 1.5em; }
* + html #access li { margin-right: 10px }


.figinner {
		-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.2), 0 0 30px rgba(80, 80, 80, 0.1) inset;
		-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.2), 0 0 30px rgba(80, 80, 80, 0.1) inset;
		box-shadow:0 1px 4px rgba(0, 0, 0, 0.2), 0 0 30px rgba(80, 80, 80, 0.1) inset;
}
.figinner:before, .figinner:after {
		content:"";
		position:absolute; 
		z-index:-2;
}
.lifted, .liftednoshadow {
		-moz-border-radius:0px; 
		border-radius:0px;
		-webkit-border-radius:0px;
}
.lifted:before, .lifted:after { 
		bottom:15px;
		left:10px;
		width:50%;
		height:20%;
        max-height:100px;
		/* height:10%; */
		max-width:300px;
		-webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.4);   
		-moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.4);
		box-shadow:0 15px 10px rgba(0, 0, 0, 0.4);
		-webkit-transform:rotate(-3deg);    
		-moz-transform:rotate(-3deg);   
		-ms-transform:rotate(-3deg);   
		-o-transform:rotate(-3deg);
		transform:rotate(-3deg);
}
.lifted:after {
		right:10px; 
		left:auto;
		-webkit-transform:rotate(3deg);   
		-moz-transform:rotate(3deg);  
		-ms-transform:rotate(3deg);  
		-o-transform:rotate(3deg);
		transform:rotate(3deg);
}
	
	
	
	
	.itemnav .figinner { background-color: #f2f0f0; }.figinner { background-color: #ffffff; }.figinnertrans { width: 100%; margin: 0px 0px 0 0px; }
	.thebox { padding: 14px; /* content panel white border */ }
	.figinner { margin: 14px; /* content panel white gaps */ }a:link,a:active,a:visited,.posttype { color: #4b8cf7; }a:hover,.itemhead a:hover,.tags a:hover, .flex-control-nav li a:hover { color: #000000; }#logo a {
	background-color: #4b8cf7;
	-moz-border-radius:0px; 
	border-radius:0px;
	-webkit-border-radius:0px;
}#logo a:hover {
	text-decoration: none;
	background-color: #000000;
	-webkit-transition:		background-color 0.4s ease;
	-moz-transition:		background-color 0.4s ease;
	-ms-transition:			background-color 0.4s ease;
	-o-transition:			background-color 0.4s ease;
	transition:				background-color 0.4s ease;
}.tags a, .flex-control-nav li a { color: #f2f0f0; background-color:#4b8cf7; }.tags a:hover, .flex-control-nav li a:hover { color: #000000; }.tags a:before{ border-color:transparent #4b8cf7 transparent transparent; }.tags a:after{ background-color:#f2f0f0; }.flex-control-nav li a { background-color: #4b8cf7; }.flex-control-nav li a:hover {background-color: #000000; }.name, .name h1, .name h2  { background-color: #4b8cf7; color: #fff; }#nav-single .nav-previous a, #nav-single .nav-next a, #nav-below .nav-previous a, #nav-below .nav-next a, .flex-direction-nav .flex-next:hover, .flex-direction-nav .flex-prev:hover, .fancybox-next span:hover, .fancybox-prev span:hover { background-color: #4b8cf7; }.item { outline-color: #ffffff; }.entry-meta-container {
	margin: 0 -14px -14px -14px;
	background-color: #f2f0f0;
	box-shadow: 0 10px 7px -7px #dedcdc inset;
	-moz-box-shadow: 0 10px 7px -7px #dedcdc inset;
}.foot {
	box-shadow: 0 10px 7px -7px #323232 inset;
	-moz-box-shadow: 0 10px 7px -7px #323232 inset;
}.entry-meta-container .comment-author, .pingbackmarg, #respond, #comment-nav-below {
	padding-left: 14px;
	padding-right: 14px;
}.entry-meta-container footer.entry-meta {
	padding-left: 14px;
	padding-right: 14px;
	border-bottom: 1px solid #dedcdc;
	border-top: 1px solid #dedcdc;
}.allcomments {
	padding-right: 14px;
}.dimmed {
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #dedcdc;
	padding-right: 14px;
}.meta-comments {
	margin-top: -14px;
}.quickcomments .comment-meta {
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #dedcdc;
}.allcomments, #respond {
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #dedcdc;
}.comments, .entry-meta-container {
	color: #848484;
}.labelHighlight {
	color: #b6b6b6; /* input text color */
}input, textarea, select {
	background-color: #ffffff;
	color: #a2a2a2; /* input text color active */
	border: 1px solid #f0f0f0;
}.comments input, .comments textarea, .comments select {
	background-color: #ffffff;
	color: #848484;
	border: 1px solid #e8e6e6;
	padding: 6px;
}.foot input, .foot textarea, .foot select {
	background: #5f5f5f;
	border: 1px solid #6e6e6e;
}.foot select {
	background: #efefef;
	border: 1px solid #fefefe;
}.error { border: 1px solid #4b8cf7 }.item-large img {
	margin-bottom: 14px;
}#portfolio-info {
	border-right: 1px solid #e6e6e6;
}#submit, .button, input[type=submit] {
	color: white !important;
	border: 1px solid #3c7de8 !important;
	background-color: #4b8cf7;
	background-image: -moz-linear-gradient(top, #5596ff, #4182ed);
	background-image: -ms-linear-gradient(top, #5596ff, #4182ed);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5596ff), to(#4182ed));
	background-image: -webkit-linear-gradient(top, #5596ff, #4182ed);
	background-image: -o-linear-gradient(top, #5596ff, #4182ed);
	background-image: linear-gradient(top, #5596ff, #4182ed);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#5596ff, endColorstr=#4182ed, GradientType=0);
}#submit:hover,
#submit:focus,
#submit:active,
.button:hover,
.button:focus,
.button:active,
input[type=submit]:hover,
input[type=submit]:focus,
input[type=submit]:active {
	border: 1px solid #3273de;
	background-color: #4687f2;
	background-image: -moz-linear-gradient(top, #5596ff, #3778e3);
	background-image: -ms-linear-gradient(top, #5596ff, #3778e3);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5596ff), to(#3778e3));
	background-image: -webkit-linear-gradient(top, #5596ff, #3778e3);
	background-image: -o-linear-gradient(top, #5596ff,#3778e3);
	background-image: linear-gradient(top, #5596ff, #3778e3);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#5596ff, endColorstr=#3778e3, GradientType=0);
}[class^="format-"]:before, [class*=" format-"]:before {
	color: #4b8cf7;	
}[class^="icon-"]:before, [class*=" icon-"]:before {
	color: #4b8cf7;	
}.form-submit #submit {
	border: 1px solid #3c7de8 !important;
}select {
	border: 1px solid #d2d2d2 !important;
}


/*--------------------------------------------------------------------------------

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


p, em { margin-bottom: 1.3em; line-height: 1.7em; }
h1, h2, h3, h4, h5, h6 { margin-bottom: .7em; }
h1 { margin-bottom: .5em; }
h1 { margin-top: .2em; }
#portfolio-info h1 { margin-top: 0em; }
//.portthumb { margin-bottom: 1.5em; } /* removed when sorting gap under portfolio items */
.portinfo h1 { margin-bottom: .4em; }
.portinfo h2 { margin-bottom: .7em; }
.portinfo p { text-align: left; }
#portfolio-info h1, #portfolio-info-full h1 { margin-bottom: 0px; }
#portfolio-meta h3 { padding-bottom: .3em; margin-bottom: 0; }
#portfolio-meta ul { margin: 0 0 1.5em 0; padding: 0 0 0 1.5em; text-indent: -1.5em; }
#portfolio-meta li { line-height: 1.5em; }
.foot ul, .itemhead ul { margin: 0 0 1.5em 0; }
li { padding: 0 0 .5em 0; line-height: 1.5em; }
#access ul { padding: 0; margin-bottom: 1.3em; line-height: 2em; }
#access li { display: inline; padding-right: 7px; }
ul { margin-bottom: .7em; }
.itemhead .widget-title { padding: 0 0 0 0; margin-bottom: .2em; }

a:link,a:visited,a:hover,a:active,a:link { text-decoration: none; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -ms-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; }
#logo a { display: block; }
#logo a:hover { text-decoration: none; }
.current-menu-item li a:link,.current-menu-item li a:active,.current-menu-item li a:visited { border-bottom: none !important; }
#logo { float: left; margin: 0 20px 0 0; max-width: 100px; }

#page { margin: 0 auto; max-width: 960px; padding: 5px; }
.footinner { margin: 0 auto; max-width: 960px; padding-top: 20px; padding-bottom: 45px; }

.itemcolumns, .itemfull, .itemthumbs, .itemhead { float: left; width: 50%; }
.itemcolumns, .itemtitle { width: 33.33%; }
.itemfull { width: 100%; }
.itemfull, .itemhead { width: 100%; }
.itemnav { width: 20%; }
.itemhead { float: none; margin-top: 15px; margin-bottom: 25px; /* Gap under nav */ padding-bottom: 0px; }
.itemthumbs { width: 100%; margin: 0px; }
.item { display: block; position: relative; float: left; overflow: hidden; width: 20%; }
.figinner, .figinnertrans { display: block; position: relative; }
.figinnertrans { background-color: transparent; }
.foot { float: left; width: 100%; clear: both; position: relative; margin-top: 75px; }
#content img, #content embed, #content object, #content video { max-width:100% !important; height:auto !important; width: auto; }
.portindex { padding: 13px; }
#portfolio-info, #portfolio-info-full { margin: 0 12px 0 0; padding-right: 14px; float:left; width:75%; }
#portfolio-info-full { float:none; width:auto; padding-right: 0px; margin-right: 0px; border-right: none; }
#portfolio-meta { margin: 0 0 15px 0; padding: 0 0 0 0; float:right; width:21%; }
.gridthumbs { margin: 0 0 15px 0; padding: 0; }
.logospace { float: left; margin: 0; padding: 0; }
.authoravatar { float: left; margin-right: 10px; }
.featuredtext { font-size: 1.3em; }
#access { padding: 20px 0 0 0; clear: both; }
#access .sub-menu { display: inline; padding: 0; margin: 0 -10px 0 10px; }
.featured { margin-top: 30px; margin-bottom: 35px; padding: 0; }
.portinfo { margin-bottom: .3em; margin-top: 1.2em; }
.portinfo-box { margin-bottom: -1em; }
#portfolio-images iframe { margin-bottom: 14px; }

.slideshow-nogap .flexslider, .flexslidershow { margin-bottom: -15px; } /* Evens gallery bottom gap when set as featured */
#portfolio-info, #portfolio-info-full, #portfolio-meta { margin-bottom: 20px; margin-top: 10px; } /* Gap under post content on portfolio single */
#featured-content { margin-bottom: 26px; } /* Gap under featured content on portfolio single*/
#featured-content iframe { margin-bottom: -4px; }


/*--------------------------------------------------------------------------------

    Header & Footer
    
--------------------------------------------------------------------------------*/


#access { margin-bottom: 0px; }
#supplementary { padding: 0 0 0 0; margin: 0 0 -23px 0; /* removes padding added by widget-area. change with .itemhead */ overflow: hidden; }
.widget-area, .widget-area-footer { float: left; }
/* Two Footer Widget Areas */
#supplementary.two .widget-area { float: left; margin-right: 3.7%; width: 48.1%; }
#supplementary.two .widget-area + .widget-area { margin-right: 0; }
/* Three Footer Widget Areas */
#supplementary.three .widget-area { float: left; margin-right: 3.7%; width: 30.85%; }
#supplementary.three .widget-area-footer { width: 30.85%; }
#supplementary.two .widget-area-footer { width: 48.1%; }
.widget-area label { float: none; }
#supplementary.three .widget-area + .widget-area + .widget-area { margin-right: 0;   }
.foot #supplementary { padding-top: 5px; }
.mobileMenu { margin-bottom: 1.2em; }


/*--------------------------------------------------------------------------------

    Image Caption
    
--------------------------------------------------------------------------------*/


.wp-caption { position: relative; margin-bottom: 15px; float: left; }
.wp-caption-text{ font-style: italic; line-height: 1.4em; padding: 5px 10px 5px 10px; margin: 0 10px 10px 10px;  position: absolute; left: 0; bottom: 0px; background: rgba(0,0,0,.5); color: #ccc; }


/*--------------------------------------------------------------------------------

    Page & Post Navigation
    
--------------------------------------------------------------------------------*/


#comment-nav-below { float: left; padding-bottom: 10px; padding-top: 12px; margin: 0; }
#comment-nav-below .nav-previous, #comment-nav-below .nav-next { position: relative; text-align: center; margin: 0 0 0 0; display: inline; }
#comment-nav-below .nav-previous,
#comment-nav-below .nav-next { margin: 0 0 0 0; float: left; }
#comment-nav-below .nav-next a { width: 15px; height: 15px; background: url('images/left_s.png') no-repeat 0 0; display:inline-block; -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; background-color: #4b8cf7; margin-left: 10px; }
#comment-nav-below .nav-previous a { width: 15px;  height: 15px;  background: url('images/left_s.png') no-repeat 0 0;  display:inline-block; background-color: #4b8cf7; }
#comment-nav-below a:link, #comment-nav-below a:visited, #comment-nav-below a:hover, #comment-nav-below a:active { text-indent: -9999em; }
#comment-nav-below .nav-previous a:hover, #comment-nav-below .nav-next a:hover { background: url('images/left_s.png') no-repeat 0 -15px; }
#nav-single { float: right;  width: 30%;  text-align: right; }
.nav-single-top { padding: 5px 0 15px 0; margin: 0; }
.nav-single-bottom { padding: 0 0 0 0; margin: 0 0 -2px 0; }
#nav-below { margin-top: 10px; float: left; clear: both; width: 100%; }
#nav-single .nav-previous,
#nav-single .nav-next,
#nav-below .nav-previous,
#nav-below .nav-next { position: relative; text-align: center; margin: 0 0 0 0; display: inline; }
#nav-below .nav-previous, #nav-below .nav-next { margin: 0 0 0 0; float: left; }
#nav-below .nav-next { float: right; }
.assistive-text { display: none; }

#nav-single .nav-next a, #nav-below .nav-next a { width: 30px; height: 30px; background: url('images/nav_sprite@2x.png') no-repeat 0 -30px; background-size: 30px 120px; display:inline-block; -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; margin-left: 10px; }
#nav-single .nav-previous a, #nav-below .nav-previous a { width: 30px;  height: 30px;  background: url('images/nav_sprite@2x.png') no-repeat 0 -30px;  background-size: 30px 120px; display:inline-block;  background-color: #4b8cf7; }
#nav-single a:link, #nav-single a:visited, #nav-single a:hover, #nav-single a:active, #nav-below a:link, #nav-below a:link, #nav-below a:visited, #nav-below a:hover, #nav-below a:active, #nav-below a:link { text-indent: -9999em; *text-indent: 0; }
/* Target IE7 to prevent next/prev text showing on page/portfolio nav */
* + html #nav-single a:link, * + html #nav-single a:visited, * + html #nav-single a:hover, * + html #nav-single a:active, * + html #nav-below a:link, * + html #nav-below a:link, * + html #nav-below a:visited, * + html #nav-below a:hover, * + html #nav-below a:active, * + html #nav-below a:link { font-size: 0; }

#nav-single .nav-previous a:hover, #nav-single .nav-next a:hover, #nav-below .nav-previous a:hover, #nav-below .nav-next a:hover { background: url('images/nav_sprite@2x.png') no-repeat 0 -60px; background-size: 30px 120px; }
.navshare { float: left;  width: 70%;  padding-top: 5px; }
#nav-below a:link, #comment-nav-below a:link, #nav-single a:link { -webkit-transition: background 0.4s ease; -moz-transition: background 0.4s ease; -ms-transition:  background 0.4s ease; -o-transition: background 0.4s ease; transition: background 0.4s ease; } 

/*--------------------------------------------------------------------------------

    Tags & Post Footer
    http://cssglobe.com/post/9435/pure-css3-post-tags
    
--------------------------------------------------------------------------------*/


.tags { margin-top:0; margin-right:0; margin-bottom:0; left: -1px; *left:-6px; /* targets IE6 and 7 */ padding:0; position:relative; right: 10px; list-style:none; clear: both; }
.tags li, .tags a { float:left; height:16px; line-height:16px; position:relative; }
.tags a { margin-left:11px; padding:0 8px 0 8px; text-decoration:none; -moz-border-radius-bottomright:2px; -webkit-border-bottom-right-radius:2px; border-bottom-right-radius:2px; -moz-border-radius-topright:2px; -webkit-border-top-right-radius:2px; border-top-right-radius:2px; } 
.tags a:before{ content:""; float:left; position:absolute; top:0; left:-8px; width:0; height:0; border-style:solid; border-width:8px 8px 8px 0; }
.tags a:after{ content:""; position:absolute; top:6px; left:0; float:left; width:4px; height:4px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius: 2px; }
footer.entry-meta { padding-top: 10px; padding-bottom: 10px; clear: both; }
// Testing - might need to reinstate. gap above meta
//.entry-content { padding-bottom: 5px; }
//.entry-meta-inner { padding-top: 10px; }


/*--------------------------------------------------------------------------------

    Custom Characters
        
--------------------------------------------------------------------------------*/


blockquote { margin:0 0 10px 0; padding: 10px 0 10px 0; quotes:"\201C""\201D""\2018""\2019"; font-style: italic; }
blockquote:before { content:'“'; font-size:4em; line-height:.1em; margin-right:.25em; vertical-align:-.4em; }
blockquote p { display:inline; }
.format-status p { font-size: 1em; font-style: italic; margin: 0 0 10px 80px; padding: 10px 0 10px 0; quotes:"\201C""\201D""\2018""\2019"; }
.format-status p:before { content:'“'; font-size:4em; line-height:.1em; margin-right:.25em; vertical-align:-.4em; }

/* Post icons */
[class^="format-"]:before, [class*=" format-"]:before { font-family: 'IcoMoon'; font-style: normal; speak: none; float: right; position: relative; padding: 0 0 0 10px; font-size: 1.5em; }
.entry-meta .format-status:before { content: "\0036"; } /* lightbulb */
.entry-meta .format-image:before { content: "\0021"; } /* photo */
.entry-meta .format-video:before { content: "\002d"; } /* video */
.entry-meta .format-standard:before { content: "\0038"; } /* book */
.entry-meta .format-aside:before { content: "\0026"; } /* bookmark */
.entry-meta .format-quote:before { content: "\003a"; }  /* speech */
.entry-meta .format-link:before { content: "\0027"; } /* chain link */
.entry-meta .format-gallery:before { content: "\0022"; } /* double photo */

/* Icons */
[class^="icon-"]:before, [class*=" icon-"]:before { font-family: 'IcoMoon'; font-style: normal; speak: none; position: relative; padding: 0 8px 0 0; bottom: -1px; font-size: 1em; }

//.icon-arrow:before { content: "\0023"; } /*unused*/ 
//.icon-tick:before { content: "\0059"; } /*unused*/
//.icon-triangle:before { content: "\0025"; } /*unused*/
//.icon-stack:before { content: "\0026"; } /*unused*/
//.icon-right:before { content: "\002c"; } /*portfolio recent (>) */ 
.icon-link:before { content: "\0026"; } /*portfolio single, related skill icon (bookmark) */
.icon-client:before { content: "\0023"; } /*portfolio single, client icon (id badge) */
.icon-skill:before { content: "\0039"; } /*portfolio single, skill icon (star) */

.icon-facebook:before { content: "\0029"; }
.icon-instagram:before { content: "\002a"; }
.icon-twitter:before { content: "\002b"; }
.icon-youtube:before { content: "\002d"; }
.icon-vimeo:before { content: "\002e"; }
.icon-tumblr:before { content: "\0030"; }
.icon-googleplus:before { content: "\0028"; }
.icon-pinterest:before { content: "\0034"; }
.icon-soundcloud:before { content: "\0031"; }
.icon-linkedin:before { content: "\0032"; }
.icon-flickr:before { content: "\002f"; }
.icon-lastfm:before { content: "\0033"; }
.icon-feed:before { content: "\002c"; }

.social-big { font-size: 1.1em; }
.entry-meta span { line-height: 1.7em; }
//.icon-right:before { margin-right: -5px; } /*unused*/

.permalink { font-family: 'IcoMoon'; font-style: normal; speak: none; float: left; position: relative; padding: 0 5px 0 0; content: "\0027"; }

//.permalink { font-family: 'IcoMoon'; font-style: normal; speak: none; float: left; position: relative; padding: 0 5px 0 0; font-size: 1.2em; top: -2px; }

.widget_recent_entries .icon-status:before { content: "\0036"; }
.widget_recent_entries .icon-image:before { content: "\0021"; }
.widget_recent_entries .icon-video:before { content: "\002d"; }
.widget_recent_entries .icon-standard:before { content: "\0038"; }
.widget_recent_entries .icon-aside:before { content: "\0026"; }
.widget_recent_entries .icon-quote:before { content: "\003a"; }
.widget_recent_entries .icon-link:before { content: "\0027"; }
.widget_recent_entries .icon-gallery:before { content: "\0022"; }

.gridthumbs .name:before { font-family: 'IcoMoon'; font-style: normal; speak: none; position: absolute; font-size: 1.7em; content: "\0037"; top: 50%; left: 50%; margin-left: -13px; margin-top: -13px; }


/*--------------------------------------------------------------------------------

    Portfolio Thumb Contents
        
--------------------------------------------------------------------------------*/


.name a { display:inline; text-decoration: underline; position:relative; }
.name { display: none; position: absolute; left: 0px; top: 0px; text-decoration: none; width: 100%; height: 100%; text-align: left; }
.box .name { display: block; }


/*--------------------------------------------------------------------------------

    Portfolio Recent Widget
        
--------------------------------------------------------------------------------*/


.recent-item {
	clear:both;
	overflow:hidden;
	padding: 0 0 8px 0;
}
.recent-item p {
	margin: 0;
	padding: 0 0 0 72px;
	line-height: 1.8em;
	//font-size: 0.9em;
}
.recent-image img {
	float:left;
	margin-right:11px;
	margin-top: 4px;
	border: 3px solid #6e6e6e;
	text-decoration: none; -webkit-transition: border 0.4s ease; -moz-transition: border 0.4s ease; -ms-transition: border 0.4s ease; -o-transition: border 0.4s ease; transition: border 0.4s ease;
}
.recent-image a:hover img {
	border: 3px solid #4b8cf7;
}


/*--------------------------------------------------------------------------------

    Comments & Inputs
        
--------------------------------------------------------------------------------*/


.entry-meta-container { font-size: .85em; clear: both; overflow: hidden; /* removes gap under when no comments */ }
//.social { font-size: 1.2em; }
#respond:before, #respond:after { content: ""; display: table; }
#respond:after { clear: both; }
#respond { zoom: 1; }
.quickcomments .comment-author img { padding-top: 10px; padding-bottom: 10px; margin-right: 10px; }
.comment-author p, .pingbackmarg p { padding-top: 6px; padding-bottom: 10px; }
.commentlist .comment-author p { margin: 0 0 0 50px; }
.commentlistquick .comment-author p { margin: 0 0 0 40px; }
.commentlist .children .comment-author  { margin: 0 0 0 20px; }
.pingbackmarg p { margin: 0 0 0 0; }
.comments { clear: both; }
.comment { clear: both; margin: 0 0 0 0; padding: 0 0 0 0; }
.reply { text-align: right; padding: 10px 10px 12px 10px; }
.children { margin: 0 0 0 0; padding: 0 0 0 0; }
.comment-meta a:focus, .comment-meta a:active, .comment-meta a:hover { }
img.avatar { float: left; }
.avatarbig { padding-bottom: 20px; float: left; }
.comment-author, .pingbackmarg { overflow: hidden; }
.quickcomments .comment-author img { width: 40px; float: left; background-color: transparent; }
.allcomments { text-align: right; padding-top: 10px; padding-bottom: 12px; padding-left: 10px; }
.dimmed { display: block; text-align: right; padding-top: 10px; padding-bottom: 12px; padding-left: 10px; }
.comment-awaiting-moderation { line-height: 2em; }
#respond { margin-top: 0; margin-bottom: 0; }
.form-allowed-tags { display: none; }
#submit, .button, input[type=submit] { text-shadow: 0 1px rgba(0, 0, 0, 0.1); position: relative; display: inline-block; overflow: visible; margin: 0 0 0 1px; padding: 7px 12px; cursor: pointer; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-background-clip: padding; -moz-background-clip: padding; background-clip: padding; }
input[type=submit] { padding: 6px 12px; margin-left: 5px; }
#submit:hover, #submit:focus, #submit:active, .button:hover, .button:focus, .button:active, input[type=submit]:hover, input[type=submit]:focus, input[type=submit]:active { text-shadow: 0 1px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); }
.button:active, #submit:active, input[type=submit]:active { -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3); }
.large { padding: 10px 15px; font-size: 1.6em; line-height: 1.4em; }
.button { margin-bottom: 5px; margin-right: 10px; vertical-align: bottom; }
label { margin: 7px 0; clear: both; display: block; }
label span { position: absolute; padding: 5px; margin-left: 3px; }
input, textarea, select { position: relative; margin: 0 5px 5px 0; border-width: 1px; padding: 6px; font: inherit; }
textarea { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; *width: 97%; }
.foot input, .foot textarea, .foot select { padding: 6px; } /* Hack to remove Safari's extra padding. Remove if you don't care about pixel-perfection. */
@media screen and (-webkit-min-device-pixel-ratio:0) { .input input, .input textarea, .input select { padding: 4px; } }
.form-submit #submit { padding: 7px 28px; font-family: 'IcoMoon'; font-size: 1.1em; }
.protected-post-form input[type=submit] { padding: 6px 28px; font-family: 'IcoMoon'; font-size: 1em; }
.searchform input[type=submit], .icon-email { font-family: 'IcoMoon'; padding: 7px 14px !important; font-size: 1em; }
.comments textarea, .comments input { line-height: 1.4em; }
.searchform { margin-bottom: 1.7em; }


/*--------------------------------------------------------------------------------

    Media Queries
        
--------------------------------------------------------------------------------*/

/*
@media (max-width: 1600px) { .itemcolumns { width: 33.33%; } }
@media (max-width: 800px) { .itemcolumns { width: 49%; } }
@media (max-width: 600px) { .itemcolumns { width: 100%; } }
*/


@media (max-width: 1600px) {
    .itemfull { width: 100%; }
    .itemcolumns { width: 33.33%; }
}
@media (max-width: 1000px) {
    .itemhead { margin-top: 0; }
}
@media (max-width: 800px) {
	.itemcolumns { width: 49.9%; }
    .item { width: 25%; }
    #portfolio-meta {
        margin: 0 0 0 0;
        float:left;
        width:100%;
        padding: 0 0 0 0;
    }
    #portfolio-info {
        margin: 0 0 0 0;
        float:left;
        width:100%;
    }
    #supplementary.three .widget-area { width: 50%; margin-right: 0; padding: 0;  }
    #supplementary.three #first { width: 46.3%; margin-right: 3.7%; padding: 0;  }
    #supplementary.three .widget-area-footer { width: 100%; margin: 0; padding: 0; }

}
@media (max-width: 600px) { /* 3 accross */
	.itemcolumns { width: 100%; }
    .item { width: 33.33%; }
    .itemnav { width: 100%; }
    #supplementary.two .widget-area { width: 48.1%; margin-right: 3.7%; }
    #supplementary.two .widget-area-footer { width: 48.1%; margin-right: 3.7%; }
}
@media (max-width: 500px) {
    #supplementary.three .widget-area { width: 100%; margin: 0; padding: 0; }
    #supplementary.three .widget-area-footer { width: 100%; margin: 0; padding: 0; }
    #supplementary.three #first { width: 100%; margin: 0; padding: 0; }
    #supplementary.two .widget-area { width: 100%; margin: 0; padding: 0; }
    #supplementary.two .widget-area-footer { width: 100%; margin: 0; padding: 0; }  
}
@media (max-width: 400px) { /* 2 accross */
    .item { width: 50%; }   
}
/* Prevent one column on desktops */
@media (max-width: 440px) {
    #content { min-height:0; }
    .item { width:50%; max-width: 210px; }
}
/* iPhone in landscape mode */
@media only screen and (max-device-width: 480px) and (orientation:landscape) {
    /* Collections */
    #content { min-height:0; }
    .item { width:33.32%; }
    header > h1 .name { max-width: 200px; }
    #supplementary.three .widget-area { width: 50%; margin: 0; padding: 0; }
}
/* iPad */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:landscape) {
    body.mobile .item { max-width: 20%; }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:portrait) {
    body.mobile .item { max-width: 25%;}
}


/*--------------------------------------------------------------------------------

    non-semantic helper classes
    Please define your styles before this section.
        
--------------------------------------------------------------------------------*/


/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* Contain floats: h5bp.com/q */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/*--------------------------------------------------------------------------------

    Print styles.
    Inlined to avoid required HTTP connection: h5bp.com/r
        
--------------------------------------------------------------------------------*/

 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; main-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { main-break-inside: avoid; }
  img { max-width: 100% !important; }
  @main { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { main-break-after: avoid; }
}


/*--------------------------------------------------------------------------------

    New Portfolio
    New item ribbon
        
--------------------------------------------------------------------------------*/


.ribbon-wrapper {
    width: 100px;
    height: 100px;
    overflow: hidden;
    position: absolute;
    top: 0px;
    left: -2px;
}
.ribbon {
    font-size: 13px;
    text-shadow: rgba(0,0,0,0.5) 0px 1px 0px;
    text-align: center;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    position: relative;
    padding: 2px 0;
    left: -21px;
    top: 8px;
    width: 82px;
    background-color: #4b8cf7;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#4b8cf7), to(#2d6ed9)); 
	background-image: -webkit-linear-gradient(top, #4b8cf7, #2d6ed9); 
	background-image:    -moz-linear-gradient(top, #4b8cf7, #2d6ed9); 
	background-image:     -ms-linear-gradient(top, #4b8cf7, #2d6ed9); 
	background-image:      -o-linear-gradient(top, #4b8cf7, #2d6ed9); 
	color: #ffffff;
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}
.ribbon:before, .ribbon-red:after {
    content: "";
    border-top:   3px solid #00329d;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    position: absolute;
    bottom: -3px;
}
.ribbon:before {
    left: 0;
}
.ribbon:after {
    right: 0;
}


/*--------------------------------------------------------------------------------

    Testing Area
    Place code here before committing
        
--------------------------------------------------------------------------------*/


/* Forces Avatar images from Instagram to 40px (should get size from variable really) */
.comment-author img {
	width: 40px !important;
	height: 40px !important;
}

/* Forces Instagram images to full width */
.instagram-full {
	width: 960px !important;
	height: 960px !important;
}

/* Sets portfolio thumbs to no gaps */
.portthumb {
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
}

/* Not sure what this is  */
.right {
	float: right;
	display: block;
}

/* [DEV] Quick fix to highlight single blog page menu item. Not suitable for release. */
.single-post .menu-item-home a:link, .single-post .menu-item-home .current-menu-item a:active, .single-post .menu-item-home .current-menu-item a:visited {
	color: #4b8cf7;
	border-bottom: 2px solid;
	background-color: transparent;
	padding: 0;
	padding-bottom: 3px;
	-moz-border-radius:0px; 
	border-radius:0px;
	-webkit-border-radius:0px;
}
.single-post .menu-item-home { margin-bottom: .4em; }
.single-post .foot .menu-item-home a:link,.single-post .foot .menu-item-home a:active,.single-post .foot .menu-item-home a:visited {
	border-bottom: 2px solid;
}

.portfoliocolour-installation {
	//background-color: #739dc7;
}

.wp-video, video.wp-video-shortcode, .mejs-container, .mejs-overlay.load {
	width: 100% !important;
	height: 100% !important;
}
.mejs-container {
	padding-top: 56.25%;
}
.wp-video, video.wp-video-shortcode {
	max-width: 100% !important;
}
video.wp-video-shortcode {
	position: relative;
}
.mejs-mediaelement {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.mejs-controls {
	display: none;
}
.mejs-overlay-play {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: auto !important;
	height: auto !important;
}

/* [END DEV] */

/*--------------------------------------------------------------------------------

    End
        
--------------------------------------------------------------------------------*/
