/*
Theme Name: Kettles Yard Theme
Theme URI: http://www.kettlesyardonline.co.uk/
Description: The 2012 theme for Kettles Yard.
Author: By Association Only
Author URI: http://byassociationonly.com
Version: 1.0

License: Use only for http://www.kettlesyardonline.co.uk/

Credits: Paul Irish http://html5boilerplate.com/
		Richard Clark http://html5doctor.com/html-5-reset-stylesheet/
*/
			
/* =============================================================================
   HTML5 reset
   ========================================================================== */
@import '/wp-content/themes/kettlesyard/css/html5reset-1.6.1.css';


/* =============================================================================
   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; }


/* =============================================================================
   Definitions - For reference only
   ========================================================================== */
	
	
	/*
	Grey:					#aeb2b3 	 818382	(body text)
	Sky blue:    			#F0F5F6 		(body background)	
	
	c : pink:   			#fe2a5d			(module borders, section & navigation)
	g : green:  			#02e1ab		
	l : purple:  			#dc5aee		
	p : cyan:  				#00d0ea		
	y : yellow:  			#fec214
	my: mustard yellow		#c0b214		
	
	*/


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

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

body { margin: 0; font-size: 1em; line-height: 1.4; -webkit-tap-highlight-color: rgb(255,255,158); background: #5a5a5a; }

body, button, input, select, textarea { font-family: Times, 'Times New Roman', Georgia, serif; color: #818382; }
 
        ::selection 	 	{ background: rgb(255,255,158); text-shadow: none; }
   ::-moz-selection 	    { background: rgb(255,255,158); text-shadow: none; }
     img::selection 		{ background: transparent; }
img::-moz-selection	    	{ background: transparent; }
		 
/* =============================================================================
   Links
   ========================================================================== */
   
a, a:visited, section.middle a { color: #818382; border-bottom: 1px solid #818382; text-decoration: none; 
		/* fade in colours on hover */
		-ms-transition: color .25s linear .05s, border .25s linear .05s;
	   -moz-transition: color .25s linear .05s, border .25s linear .05s;
	-webkit-transition: color .25s linear .05s, border .25s linear .05s;
		    transition: color .25s linear .05s, border .25s linear .05s; 
		    outline: none;      
	     
}

a:hover { color: #818382; border-bottom: 1px solid #818382;
	    
	    -ms-transition: color .25s linear .05s, border .25s linear .05s;
	   -moz-transition: color .25s linear .05s, border .25s linear .05s;
	-webkit-transition: color .25s linear .05s, border .25s linear .05s;
        	transition: color .25s linear .05s, border .25s linear .05s; 
        
}
        	
a:focus { outline: none; }

/* custom link colours for each category */
section.middle a:hover, section.middle div.new-comment form input.post:hover {
		-ms-transition: color .25s linear .05s, border .25s linear .05s;
	   -moz-transition: color .25s linear .05s, border .25s linear .05s;
	-webkit-transition: color .25s linear .05s, border .25s linear .05s;
	    	transition: color .25s linear .05s, border .25s linear .05s; 
}

section.middle.behindthescenes a:hover, section.middle.behindthescenes div.new-comment form input.post:hover { color: #fe2a5d; border-bottom: 1px solid #fe2a5d; }
section.middle.artistsprojects a:hover, section.middle.artistsprojects div.new-comment form input.post:hover, section.middle.audio-artistsprojects a:hover, section.middle.audio-artistsprojects div.new-comment form input.post:hover { color: #02e1ab; border-bottom: 1px solid #02e1ab; }
section.middle.thebuildingproject a:hover, section.middle.thebuildingproject div.new-comment form input.post:hover { color: #dc5aee; border-bottom: 1px solid #dc5aee; }
section.middle.newsbites a:hover, section.middle.newsbites div.new-comment form input.post:hover { color: #00d0ea; border-bottom: 1px solid #00d0ea; }
section.middle.offsite a:hover, section.middle.offsite div.new-comment form input.post:hover { color: #fec214; border-bottom: 1px solid #fec214; }
section.middle.contact a:hover, section.middle.contact div.new-comment form input.post:hover { color: #c0b214; border-bottom: 1px solid #c0b214; }

section.middle.behindthescenes h1 a, section.middle.behindthescenes h1 a:hover {
	color: #fe2a5d;
	border: none;
}
section.middle.artistsprojects h1 a, section.middle.artistsprojects h1 a:hover, section.middle.audio-artistsprojects h1 a, section.middle.audio-artistsprojects h1 a:hover  {
	color: #02e1ab;
	border: none;
}
section.middle.thebuildingproject h1 a, section.middle.thebuildingproject h1 a:hover {
	color: #dc5aee;
	border: none;
}
section.middle.newsbites h1 a, section.middle.newsbites h1 a:hover {
	color: #00d0ea;
	border: none;
}
section.middle.offsite h1 a, section.middle.offsite h1 a:hover {
	color: #fec214;
	border: none;
}
section.middle.contact h1 a, section.middle.contact h1 a:hover {
	color: #c0b214;
	border: none;
}

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

a.top {
	display: block;
	right: 56px;
	bottom: 29px;
	position: absolute;
	background: url(/wp-content/themes/kettlesyard/img/top-arrow.png) no-repeat 0% -10%;
	height: 13px;
	color: #aeb2b2;
	padding-left: 15px;
	border: none;
	font-size: .83em;
	font-weight: bold;
}

a.top:hover {
	background-position: bottom left;
}

div.nextprev {
	float: left;
	margin-left: 18px;
}

div.nextprev a, div.nextprev a:visited {
	border: none;
	font-weight: bold;
	font-size: 13px;
	color: #aeb2b2;
}

div.nextprev a:hover {
	color: #818382;
	border: none !important;
}

.a-options {
	margin: 15px 0 0 0;
	width: 100%;
	min-height: 20px;
	overflow: hidden;
}

.a-options a.comments {
	border-bottom: none;
	font-size: 13px;
	color: #adb1b2;
	margin-left: 9px;
}

	.a-options a.comments:first-child {
		margin-right: 11px;
	}

.a-options a.comments:hover {
	border-bottom: none !important;
}

.custom-facebook-button a {
	border-bottom: none !important;
}

div.audio-artistsprojects p a {
	display: inline;
	border-bottom: 1px solid #818382;
}

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

@font-face {
    font-family: 'KingsCaslonDisplayTypoItalic';
    src: url('/wp-content/themes/kettlesyard/type/kingscaslondisplay_typo_it-webfont.eot');
    src: url('/wp-content/themes/kettlesyard/type/kingscaslondisplay_typo_it-webfont.eot#iefix') format('embedded-opentype'),
         url('/wp-content/themes/kettlesyard/type/kingscaslondisplay_typo_it-webfont.woff') format('woff'),
         url('/wp-content/themes/kettlesyard/type/kingscaslondisplay_typo_it-webfont.ttf') format('truetype'),
         url('/wp-content/themes/kettlesyard/type/kingscaslondisplay_typo_it-webfont.svg#KingsCaslonDisplayTypoItalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

nav ul, 
div.sidebar footer p, 
div#newsletter-wrap p, 
div#wpcf7-f147-t1-o1 form input, 
div#wpcf7-f373-p117-o1 form input,
footer footer.footnote p, 
a.top, 
section.middle h1, 
.module h1,
.pseudo-button, 
aside h2,
div.nextprev a,
.a-options,
div.new-comment form label,
div.new-comment form input.post,
footer.comment-list h3,
p.classification,
#timeleft {
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
}

div.sidebar footer p:first-child, .custom-facebook-button a, .custom-tweet-button a {
	font-family: 'KingsCaslonDisplayTypoItalic', Times, Times New Roman, Georgia, serif;
}

p {
	font-size: .87em;
	line-height: 1.30em;
	margin: 0 8px 12px 8px;
	color: #818382;
}

header h1 {
	font-family: "Myriad Pro", Myriad, Arial sans-serif;
	float: left;
	margin-left: 20px;
	margin-top: 21px;
	font-size: 1.75em;
	color: #D6D8D7;
	font-weight: normal;
	text-transform: uppercase;
	font-style: italic;
	letter-spacing: .15em;
}

section.middle h1, .module h1 {
	font-size: .81em;
	margin: 15px 8px 12px 8px;
}

section.middle h1 span, .module h1 span, footer.comment-list h3 span {
	font-weight: normal;
}

 div.new-comment form input, div.new-comment form textarea, footer.comment-list p {
 	font-style: italic;
 }

aside h2 {
	font-size: .81em;
	color: #aeb2b2;
	margin-bottom: 15px;
	margin-left: 18px;
}

div.new-comment form label {
	font-size: .81em;
	font-weight: bold;
	color: #8e9091;
}

footer.comments footer.comment-list section h3 {
	font-size: .81em;
	color: #8e9091;
	margin-bottom: 15px;
}

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

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

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height */
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; }

/* main nav */
nav {
	margin-bottom: 40px;
}

nav ul li a, nav ul li.menu-item a {
	border-bottom: none;
	border-top: 2px solid #757575;
	line-height: 1.63em;
	display: block;
	font-size: 1.375em;
	font-weight: bold;
}

nav ul.fixed li a, nav ul.fixed li a:hover {
	border-bottom: 2px solid #757575;
}

nav ul li a:hover {
	border-bottom: none;
}


	nav ul {
		border-bottom: 2px solid #757575;
	}
	
	nav.home ul {
		border-bottom: none;
	}

		nav ul li a.c, nav ul li.menu-item-74 a {
			color: #fe2a5d;
		}
		nav ul li a.g, nav ul li.menu-item-76 a {
			color: #02e1ab;
		}
		nav ul li a.l, nav ul li.menu-item-77 a {
			color: #dc5aee;
		}
		nav ul li a.p, nav ul li.menu-item-78 a {
			color: #00d0ea;
		}
		nav ul li a.y, nav ul li.menu-item-75 a {
			color: #fec214;
		}
		nav ul li a.my, nav ul li.menu-item-79 a {
			color: #c0b214;
		}
		
			nav ul li a.c:hover, 
			nav ul li a.c.selected,
			nav ul li#current a.c {
				border-top: 2px solid #fe2a5d;
			}
			nav ul li a.g:hover, 
			nav ul li a.g.selected,
			nav ul li#current a.g {
				border-top: 2px solid #02e1ab;
			}
			nav ul li a.l:hover, 
			nav ul li a.l.selected,
			nav ul li#current a.l {
				border-top: 2px solid #dc5aee;
			}
			nav ul li a.p:hover, 
			nav ul li a.p.selected,
			nav ul li#current a.p {
				border-top: 2px solid #00d0ea;
			}
			nav ul li a.y:hover, 
			nav ul li a.y.selected,
			nav ul li#current a.y {
				border-top: 2px solid #fec214;
			}
			nav ul li a.my:hover, 
			nav ul li a.my.selected,
			nav ul li#current a.my {
				border-top: 2px solid #c0b214;
			}
/* /main nav */

div#tweet ul {
	list-style-type: none;
	padding: 0;
	font-size: .87em;
	color: #818382;
}

	div#tweet ul li {
		border-top: 1px solid #F0F6F6;
		padding-top: 20px;
		margin-bottom: 20px;
		padding: 20px 8px 0 8px;
		word-wrap: break-word;
	}
	
	div#tweet ul li:first-child {
		border-top: none;
		padding-top: 0;
	}

/* =============================================================================
   Embedded content - Images/Video/Audio/Flash
   ========================================================================== */

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

img.logo {
	width: 217px;
	height: 33px;
	float: left;
	margin: 20px 0 0 20px;
}

img.lottery {
	width: 101px;
	height: 55px;
	margin-left: 35px;
	margin-top: 30px;
}

img.ac {
	width: 154px;
	height: 36px;
	display: block;
	margin-top: 30px;
	margin-left: 35px;
}

img.uc {
	width: 149px;
	height: 30px;
	display: block;
	margin-left: 35px;
	margin-top: 30px;
}

a img.uc, a img.ac, a img.lottery {
	border: none !important;
	display: block;
	position: relative;
}

article img {
	max-width: 100%;
	height: auto;
}

/* audio player */

.audio-wrapper {
	position: relative; 
	display: block; 
	float: left; 
	width: 208px;
	margin-bottom: 15px;
	height: 125px;
	overflow: hidden;
}

.player {
	display: block;
	width: 208px;
	height: 100%;
	margin: 0;
	top: 0;
	left: 0;
	position: absolute;
}

.player:hover {
	background: rgba(78, 234, 196, .75);
}

#playtoggle {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	width: 100%;
	height: 100%;
	background: url(/wp-content/themes/kettlesyard/img/player.png) no-repeat -20px -12px;
	cursor: pointer;
}

#playtoggle.playing {
	background-position: -223px -161px;
}

#timeleft {
	display: none;
}

#gutter {
	position: absolute;
	bottom: 19px;
	z-index: 11;
	width: 175px;
	left: 16px;
	right: 0px;
	height: 6px;
	padding: 2px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	background: #546374;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#242f3b), to(#516070));
	background: -moz-linear-gradient(top, #242f3b, #516070);
	background: linear-gradient(top, #242f3b, #516070);
	-webkit-box-shadow: 0 1px 4px rgba(20, 30, 40, .75) inset, 0 1px 0 rgba(176, 187, 198, .5);
	-moz-box-shadow: 0 1px 4px rgba(20, 30, 40, .75) inset, 0 1px 0 rgba(176, 187, 198, .5);
	-o-box-shadow: 0 1px 4px rgba(20, 30, 40, .75) inset, 0 1px 0 rgba(176, 187, 198, .5);
	box-shadow: 0 1px 4px rgba(20, 30, 40, .75) inset, 0 1px 0 rgba(176, 187, 198, .5);
}

#wrapper #gutter {
	right: 0px;
}

#loading {
	background: #fff;
	background: #939eaa;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eaeef1), to(#c7cfd8));
	background: -moz-linear-gradient(top, #eaeef1, #c7cfd8);
	background: linear-gradient(top, #eaeef1, #c7cfd8);
	-webkit-box-shadow: 0 1px 0 #fff inset, 0 1px 0 #141e28;
	-moz-box-shadow: 0 1px 0 #fff inset, 0 1px 0 #141e28;
	-o-box-shadow: 0 1px 0 #fff inset, 0 1px 0 #141e28;
	box-shadow: 0 1px 0 #fff inset, 0 1px 0 #141e28;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	display: block;
	float: left;
	min-width: 6px;
	height: 6px;
}

#handle {
	position: absolute;
	top: -5px;
	left: 0;
	width: 20px;
	height: 20px;
	margin-left: -10px;
	background: url(/wp-content/themes/kettlesyard/img/player.png) no-repeat -1px -1px;
	cursor: pointer;
}

/* /audio player */


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

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

label { cursor: pointer; }

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

button, input { line-height: normal; }

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

button[disabled], input[disabled] { cursor: default; }

/* Consistent box sizing and appearance */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
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, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/* Remove inner padding and border in FF3/4 */
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; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid {}

input:focus, textarea:focus {
	outline: none;
}

/* Hand cursor on clickable input elements */
label, input[type=button], input[type=submit], button { cursor: pointer; }

/* form buttons now look the same in all browsers - no ie padding */
button {  width: auto; overflow: visible; }

/* Subscribe form */
div#newsletter-wrap {
	margin-bottom: 3px;
	float: left;
	position: relative;
}
div#newsletter-wrap p:first-child {
	font-size: .83em;
	font-weight: bold;
	color: #aeb2b2;
	margin-left: 0;
	margin-bottom: 14px;
}

div#newsletter-wrap p {
	margin-left: 0;
}

form#subscribe input, div#wpcf7-f147-t1-o1 form input, div#wpcf7-f373-p117-o1 form input { 
	font-size: .83em;
	color: #aeb2b2;
	background: #6a6a6a;
	padding: 12px 15px;
	border: none;
	margin-left: 0 !important;
	margin-bottom: 3px;
	width: 185px;
	text-rendering: optimizeLegibility; 
	-webkit-font-smoothing: antialiased;
}

div#wpcf7-f373-p117-o1 form {
	margin-left: -8px;
}

div#wpcf7-f373-p117-o1 form input {
	background: #F0F2F1;
	width: 179px;
}


div#wpcf7-f147-t1-o1 input.wpcf7-submit, div#wpcf7-f373-p117-o1 input.wpcf7-submit {
	background:none;
	font-weight: bold;
	padding: 0;
	padding-top: 3px;
	width: auto;
	float: right;
	color: #7D7D7D !important;
	font-size: .9em;
	font-style: normal;
}

	div#wpcf7-f373-p117-o1 input.wpcf7-submit {
		padding-left: 8px;
	}

div.wpcf7-validation-errors {
	display: none !important;
}

div.wpcf7-mail-sent-ok {
	bottom: 0px !important;
	position: absolute;
	left: 83px;
	width: 198px;
	font-size: .75em;
	color: #02e1ab;
	border: none !important;
}

span.wpcf7-not-valid-tip {
	right: 0 !important;
	position: absolute;
	color: #FE2A5D;
	width: 153px !important;
	text-align: right;
	border: none !important;
	background: none !important;
}

div#wpcf7-f373-p117-o1 span.your-name span.wpcf7-not-valid-tip  {
	width: 194px !important;
	top: 0px !important;
}

/* comment form */
div.new-comment {
	float: left;
	width: 100%;
}
div.new-comment form input, div.new-comment form textarea {
	border: none;
	background: #efeff0;
	font-size: 14px;
	margin-left: 15px;
	width: 85%;
	color: #818382;
	text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;
}
		
div.new-comment form fieldset {
	padding: 15px 17px;
	background: #efeff0;
	margin-bottom: 15px;
}		

div.new-comment form span {
	display: block;
	border-bottom: 1px solid #d2d2d3;
	padding-bottom: 10px;
	margin-bottom: 8px;
}			

div.new-comment form textarea {
	width: 100%;
	margin-left: 0;
	height: 75px;
}

div.new-comment form input.post {
	background:none;
	font-weight: bold;
	padding: 0;
	margin: 0;
	width: auto;
	color: #adb1b2;
	font-size: 13px;
	font-style: normal;
}

section.middle div.new-comment form input.post:hover {
	border-bottom: none !important;
}



/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe { margin: 0.2em 0; background: #fffaab; color: black; padding: 0.2em 0; }  


/* ==|== primary styles =====================================================
   Author: By Association Only
   ========================================================================== */

header {
	width: 100%;
	float: left;
	height: 52px;
	margin-bottom: 20px;
}

div#wrapper {
	float: left; 
	width: 100%;
	height: 100%;
}

div.sidebar {
	margin-left: 22px;
	margin-bottom: 20px;
	float: left;
	width: 215px;
	min-height: 410px;
}

	div.sidebar footer {
		border-top: 2px solid #757575;
		border-bottom: 2px solid #757575;
		padding-top: 9px;
		font-size: .87em;
		background: transparent;
		float: left;
		display: block;
		
	}
	
	div.sidebar footer p:first-child {
		line-height: 1.15em;
		margin-bottom: 42px;
		font-size: 1.66em;
		color: #818382;
	}

	div.sidebar footer p {
		color: #adb1b2;
		margin-left: 0;
		margin-right: 0;
	}

div#main {
	height: 100%;
}

footer {
	float: left;
	width: 100%;
	clear: both;	
	position: relative;
	
}

	footer header {
		min-height: 230px;
		float: left;
		width: 100%; 
		position: relative;
		margin-top: -160px;
	}
	
	#contact footer header {
		margin-top: 0;
	}
	
	footer footer.footnote {
		float: left;
		width: 100%;
		background: #8E9091;
		min-height: 58px;
		padding-top: 35px;
		position: relative;
	}
	
	footer footer.footnote p {
		color: #c9cdce;
		line-height: .15em;
		font-size: .83em;
		font-weight: bold;
		display: block;
	}
	
	p.classification {
		font-size: 1.375em;
		font-weight: bold;
		margin-bottom: 20px;
		border-top: 2px solid #757575;
		margin: 0;
		padding: 7px 0;
		width: 100%;
		float: left;
	}
		p.classification a {
			border-bottom: none;
			color: #B3B7B8;
		}
		
		div.viewing, div.copyright, a.district {
			width: 300px;
			position: absolute;
		}
		
		div.viewing {
			left: 25px;
			top: 38px;
		}
		
		div.copyright {
			left: 245px;
		}
		
			div.copyright a {
				color: #B0B1B3;
				border: none;
			}
			
			footer.footnote div.copyright p {
				line-height: normal;
				font-size: .7em;
				font-weight: normal;
				letter-spacing: .09em;
				color: #B0B1B3;
			}	
		
		 a.district {
		 	border: none;
		 	right: 0;
		 	width: 150px;
		 }
		
			

/* flickr slideshows */

#random {
	overflow: hidden;
	max-width: 100%;
	min-height:248px;
	background: url(/wp-content/themes/kettlesyard/img/loader.gif) no-repeat center center;
}

#cycle { margin: 0; width: 458px; height: 248px; background: url(/wp-content/themes/kettlesyard/img/loader.gif) no-repeat center center; }
#cycle li { position: relative; list-style: none; margin: 0; width: 458px; height: 248px; overflow: hidden; }

/* Flickr badge */
#flickr_badge_uber_wrapper {text-align:center; width:210px;}
#flickr_badge_wrapper {padding:0;}
.flickr_badge_image {margin:0;}
.flickr_badge_image img {border: none !important;}
#flickr_badge_uber_wrapper a:hover,
#flickr_badge_uber_wrapper a:link,
#flickr_badge_uber_wrapper a:active,
#flickr_badge_uber_wrapper a:visited {text-decoration:none !important; background:inherit !important;color:#3993ff;}
#flickr_badge_wrapper {}
#flickr_badge_source {padding:0 !important; font: 11px Arial, Helvetica, Sans serif !important; color:#666666 !important;}

/* internal pages */
section.middle {
	width: 500px;
	float: left;
	min-height: 200px;
}

aside {
	float: left;
	width: 249px;
	min-height: 200px;
	margin-top: -33px;
}
	
	aside .module {
		min-height: 126px;
	}
	
section.middle article {
	background: #fff;
	padding: 9px 11px 9px 11px;
	margin-bottom: 20px;
	margin-left: 18px;
	position: relative;
	min-height: 200px;
	float: left;
	/* remove these next two lines if problems with ipad viewport - You will still have to fix link problem though */
	width: 460px;
	word-wrap: break-word;
}

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

	section.middle.behindthescenes article { border-top: 2px solid #fe2a5d; }
	
	section.middle.artistsprojects article, section.middle.audio-artistsprojects article { border-top: 2px solid #02e1ab; }
	
	section.middle.thebuildingproject article { border-top: 2px solid #dc5aee;	}
	
	section.middle.newsbites article { border-top: 2px solid #00d0ea; }
	
	section.middle.offsite article { border-top: 2px solid #fec214;	}
	
	section.middle.contact article { border-top: 2px solid #c0b214;	}

section.middle.behindthescenes h1 { color: #fe2a5d; }
section.middle.artistsprojectsprojects h1, section.middle.audio-artistsprojectsprojects h1 { color: #02e1ab; }
section.middle.thebuildingproject h1 { color: #dc5aee; }
section.middle.newsbites h1 { color: #00d0ea; }
section.middle.offsite h1 { color: #fec214; }
section.middle.contact h1 { color: #c0b214; }

section.middle article p:last-child {
	margin-bottom: 25px;
}

/* Share button */
.share-button { 
	width:340px;
	height:23px;
	position:relative;
	float:right;
	margin-right: 9px;
	overflow: hidden;
}
			
		.share-button .pseudo-button {
			display:block;
			position:absolute;
			top:2px;
			right:0;
			text-align: right;
			z-index:1;
			width:100%;
			height:100%;
			-webkit-transition-duration:.2s;
			   -moz-transition-duration:.2s;
			     -o-transition-duration:.2s;
			        transition-duration:.2s;
			font-size: 13px;
			color: #adb1b2;
			cursor: pointer !important;
		}
		
		div.buttons {
			display: block;
			top: 23px;
			position:absolute;
			z-index:10;
			font-size: 14px;
			-webkit-transition-duration:.2s;
			   -moz-transition-duration:.2s;
			     -o-transition-duration:.2s;
			        transition-duration:.2s;	
		}
		
		.share-button:hover div.buttons { top:1px !important; font-size: 15px; }
			
		div.facebook, div.twitter, div.pinterest {
			position: absolute;
			width:50px; margin: 0 10px;
		}
			
		div.twitter {
			z-index: 200 !important;
			left: 80px;
		}
		
		div.pinterest {
			left: 180px;
			z-index: 250;
		}
		
	
			
/* comments area */			
footer.comments {
	width: 96%;
	margin: 15px 0 0 9px;
	min-height: 50px;
	overflow: hidden;
	float: left;
}	

footer.comments footer.comment-list {
	margin-top: 15px;
	margin-bottom: 15px;
	float: left;
}

footer.comments footer.comment-list section {
	background: #efeff0;
	margin-bottom: 1px;
	padding: 18px 17px 15px 17px;
}

footer.comments footer.comment-list section p {
	margin-left: 0px;
}

figure {
	position: relative;
	padding-bottom: 10px;
}
	figcaption {
		text-align: right;
		width: 468px;
		position: absolute;
		font-size: .95em;
	}

	figcaption p {
		color: #ADB1B2;
	}

/**** Infinite Scroll ****/

#infscr-loading {
  position: fixed;
  text-align: center;
  bottom: 30px;
  left: 42%;
  z-index: 100;
  background: white;
  background: hsla( 0, 0%, 100%, 0.9 );
  padding: 20px;
  color: #222;
  font-size: 15px;
  -webkit-border-radius: 10px;
     -moz-border-radius: 10px;
          border-radius: 10px;
}

/* IE FIX */
.lt-ie9 nav ul {
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
}



/* ==|== media queries ======================================================
   ========================================================================== */
     
     /* Disable iOS/WinMobile font size changes */
     @media screen and (max-width: 600px),
     screen and (max-device-width: 480px) {
     	html {
     		-ms-text-size-adjust: none;
     		-webkit-text-size-adjust: none;
     	}
     }
     
     
     
     
     /* iPad/tablet portrait size (devices and browsers) */
     @media only screen and (min-width: 641px) and (max-width: 990px) {
     
     	/* Max width = 618px */

     	/* internal pages */
     	aside {
     		margin-top: 25px;
     		margin-left: 239px;
     		width: 498px /* 376px*/ ;
     		clear: both;
     		
     	}  
     	
     		aside .module {
     			width: 209px /* 148px */; /* if reverting to old width see 'section.middle article' class */
     			float: left;
     		}
     		aside h2 {
     			display: block;
     			width: 100%;
     			clear: both;
     		}
     		
     		aside .module img {
     			max-width: 100%;
     		}
     		
     	section.middle  {
     		width: 376px;
     	}
     	
     	article {
     		width: 336px;
     	}
     	
     	     	
     	/* comment form */
     	div.new-comment form input, div.new-comment form textarea {
     		width: 80%;
     	}
     	
     	div.new-comment form textarea {
     		width: 100%;
     	}
     	
     	.module.large {
     		border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; display: none !important;
     	}
     	
     }
   
     @media screen and (max-width : 480px), screen and (max-width : 640px) {
     	
     	html, body {
     		padding: 10px;
     	}
     	
     	header#top h1, #newsletter-wrap, p.classification, div.sidebar footer {
     		display: none;
     	}
     	
     	div.sidebar {
     		float: left;
     		min-height: 170px;
     		margin-bottom: 0;
     	}
     	
     	div.viewing, div.copyright, a.district {
     		width: 100%;
     		position: relative;
     		float: left;
     		display: block;
     		left: 0;
     		top: 0;
     		margin: 10px 0;
     		padding: 0;
     	}
     	
     		a.district {
     			margin-left: 5px;
     			margin-bottom: 30px;
     		}
     	
     	img.logo {
     		margin-left: 0;
     		margin-top: 0;
     		display: block;
     		width: 100%;
     		height: auto !important;
     	}
     	
     	a.top {
     		right: 0px;
     	}
     	
     	div.sidebar, div#main {
     		float: left;
     		width: 100%;
     		margin-left: 0;
     	}
     	
     		nav ul li a, nav ul li.menu-item a {
     			border-bottom: none;
     			border-top: 2px solid #757575;
     			line-height: 1.63em;
     			display: block;
     			font-size: 1em;
     			font-weight: bold;
     		}
     	
     	section.middle {
     		width: 100%;
     		margin-left: 0;
     		overflow: hidden;
     	}
     	
     	section.middle article {
     		width: 95%;
     	}
     	
     	div.nextprev, aside h2/*, aside .module*/ { float: left; width: 100%; display: block;
			 margin-left: 0; }
     	
     	/* internal pages */
     	aside {
     		margin-top: 18px;
     		width: 100%;
     		overflow: hidden;
     	}
 		
 		section.middle article {
 			margin-left: 0;
 		}

     	article img {
     		max-width: 100%;
     	}
     	
     	img.lottery, img.ac, img.uc {
     		margin-left: 0px;
     	}
     	
     	/* comment form */
     	div.new-comment form input, div.new-comment form textarea {
     		width: 62%;
     	}
     	
     	div.new-comment form textarea {
     		width: 100%;
     		margin-left: -3px;
     	}
     	
     	.share-button { 
     		width: 120px;
     	}
     	
     	footer header {
     		min-height: 230px;
     		float: left;
     		width: 100%; 
     		position: relative;
     		margin-top: 0px;
     	}
     	
     	/* audio player */
     	
     	.audio-wrapper, .player {
     		width: 100%;
     	}
	
     	#playtoggle {
     		background: url(/wp-content/themes/kettlesyard/img/player.png) no-repeat 8px -20px;
     	}
     	
     	#playtoggle.playing {
     		background-position: -200px -161px;
     	}
     	
     	#gutter {
     		width: 90%;
       	}
     	     	
     	/* /audio player */
     	
     	a.flickr-img img {
     		width: 100%;
     	}
     	
     	div.greybox {
     		width: 100%;
     	}
     	
     	div#wpcf7-f373-p117-o1 form input {
     		width: 91.85%;
     	}
     	
     	span.wpcf7-not-valid-tip  {
     		width: 244px !important;
     	}
     	
     	div#wpcf7-f373-p117-o1 span.your-name span.wpcf7-not-valid-tip {
     		width: 311px !important;
     	}
		
		iframe {
			width: 100%;
			height: auto;
		}
     	
     	figcaption {
     		text-align: right;
     		width: 100%;
     		right: -7px;
     	}
     	
     }
     
     /* Mobile phones portrait only */
      @media screen and (max-width : 479px) { 
      	
      	section.middle article {
      		width: 92%;
      	}
      	
      	.share-button { 
      		float:left;
      		width: 200px;
      		margin-left: 9px;
      		margin-top: 19px;
      	}
      				
      			.share-button .pseudo-button {
      				left:0;
      				text-align: left;
      			}
      	
      	
      	
      }
   
   
   
   


/* ==|== non-semantic helper classes ========================================
   ========================================================================== */
   
/* 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; *line-height: 0; }
.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 =======================================================
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !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; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}


