/*
2d3d47 - steel grey/blue 100%
57646c - 80%
abb1b5 - 40%
00abbd - green
*/

@import url('https://fonts.googleapis.com/css?family=Abhaya+Libre');

@font-face {
   font-family: "Arial Black";
   src: url("/fonts/Arial Black.ttf");
}

#all {
	position: relative;/* for icons */
	width: 1280px;
	background: url(/graphics/bg/all.png) repeat-y;
	background-image: none;
}

#home #banner,
#home #navbar,
#home #footer {
	width: 1280px;
	background: #000;
}

#home #sidenav {
	height: 800px;
	background: url(/graphics/bg/sidenav.png);
	background: url(/graphics/bg/sidenav-white.png);/* 2014 */
}

#closed {
   width: 1280px;
   height: 800px;
   position: relative;
}

#home #closed p {
   color: #959595;
   text-transform: uppercase;
   font-family: "Arial Black", Arial, sans-serif;
   font-weight: bold;
   text-align: right;
   font-size: 260%;
   line-height: 0.8;
}

#home #closed .para1 {
   position: absolute;
   top: 160px;
   right: 0;
}

#home #closed .para2 {
   position: absolute;
   top: 340px;
   right: 0;
}

#home #closed .para3 {
   position: absolute;
   top: 470px;
   right: 0;
}

#home #closed p a:link,
#home #closed p a:visited {
   text-decoration: none;
   color: #000;
}

html #home #all #closed p a:hover span {
   color: #808080 !important;
   text-decoration: none;
}

#home #closed .title {
   font-size: 140%;
}

#navbar	{
	height: 40px;
	background: #000;
}

#footer {
	background: #000;
	padding-top: 10px;
}

#footer-1 a {
	margin-right: 10px;
}

#footer-2 a {
	margin-left: 10px;
}

.cricos {
	margin-left: 10px;
}

#navbar ul {
	list-style: none;
	width: 1280px;
}

#navbar li {
	float: left;
	height: 25px;
	margin: 0;
}

#navbar li {
	float: left;
	height: 40px;
	margin: 0;
}/* 2014 */

#navbar a {
	display: block;
	float: left;
	height: 25px;
	line-height: 25px;
	text-transform: uppercase;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	font-size: 80%;
	padding: 0 9px;
	margin: 0 9px;

}

#navbar a {
	display: block;
	float: left;
	height: 40px;
	line-height: 40px;
	text-transform: uppercase;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	font-size: 80%;
/*	padding: 0 9px;
	margin: 0 9px;*/
	padding: 0 17px 0 16px;
	margin: 0;
}/* 2014 */

#navbar .home a {
	margin-left: 260px;
}

#navbar a:link,
#navbar a:visited {
	color: #fff;
	text-decoration: none;
}

#navbar a:hover {
	text-decoration: none;
	color: #fff;
	background: #808080;
	border: 0;/* for ff & ie */
}

/* programs */
.prog {
   border-bottom: 1px solid #eee;
   margin-bottom: 40px;
}

.progpic {
   width: 490px;
   float: left;
}

.progtxt {
   width: 470px;
   float: right;
}

.prog::after {
   content: " ";
   display: block;
   clear: both;
   margin-bottom: 40px;
}

.progheaders p {
   font-weight: bold;
   font-size: 100%;
}

a.progbtn {
   background: #000;
   display: block;
   padding: 10px 0;
   width: 25%;
   color: #fff;
   text-align: center;
   transition: background 1s;
}

a.progbtn:hover {
   color: #fff;
   background: #808080;
   text-decoration: none;
}

a.bookshop {
   width: 60%;
   background: #2a770f;
}

.ppt {
	display: none !important;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
}/* "undefined" header in prettyphoto programs */

.buttons {
	width: 1030px;
	margin-left: 250px;
}

.pastyear2015 .buttons {
   margin-left: 0;
}

.probutton {
	width: 293px;
	float: left;
	margin-top: 30px;
	margin-left: 50px;
}

.rsvppage .probutton {
	width: 213px !important;
	float: left;
	margin-top: 10px;
	margin-left: 0;
}

.rsvppage .probutton a {
	width: 263px !important;
}

.rsvppage .probutton a:hover {
	color: #000 !important;
	text-decoration: none !important;
}


.foundations #all .probutton,
.gladwell #all .probutton,
.collection13 #all .probutton,
.conder #all .probutton {
	margin-top: 0;
	margin-left: 0;
	margin-bottom: 30px;
}

.free {
	padding-left: 10px;
}

.protitlediv a {
	height: 30px;
}

.probylinediv a {
	height: 30px;
}

.protitle a {
	padding: 10px 0 0 0 !important;
	font-size: 150% !important;
	line-height: 0.9;
	color: #000 !important;
}

.longtitle .protitle a {
   font-size: 140% !important;
}

.year2013 .protitle a {
	font-size: 100% !important;
}

.protitle a:hover,
.probyline a:hover {
	background: #fff !important;
	color: #808080 !important;
}

.probyline a {
	padding: 0 !important;
	font-size: 120% !important;
	line-height: 0.9;
	color: #000 !important;
}

.prodates {
	text-transform: uppercase;
	text-decoration: none;
	color: #808080;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	font-size: 100%;
	padding: 0;
	width: 273px;
}

.probutton p a {
	display: block;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	padding: 10px 0;
	width: 293px;
}

.foundations #all .probutton p a,
.gladwell #all .probutton p a,
.collection13 #all .probutton p a,
.conder #all .probutton p a {
	font-size: 150%;
	padding: 10px;
	width: 260px;
}

.foundations #all .probutton p a:link,
.foundations #all .probutton p a:visited,
.gladwell #all .probutton p a:link,
.gladwell #all .probutton p a:visited,
.collection13 #all .probutton p a:link,
.collection13 #all .probutton p a:visited,
.conder #all .probutton p a:link,
.conder #all .probutton p a:visited {
	color: #fff;
	text-decoration: none;
}

.foundations #all .probutton p a:hover,
.gladwell #all .probutton p a:hover,
.collection13 #all .probutton p a:hover,
.conder #all .probutton p a:hover {
	color: #000;
	background: #abb1b5;
	text-decoration: none;
}

.proimage {
	width: 293px;
	height: 293px;
}/* need dimensions to allow for rollover fade-in */

/* 2014 - new simple class */
.btn a:link,
.btn a:visited {
	display: block;
	height: 30px;
	line-height: 30px;
	color: #fff !important;
	background: #000;
	text-transform: uppercase;
	text-align: center;
	text-decoration: none;
	font-family: "Arial Black", arial, sans-serif;
	font-weight: bold;
}

.btn a:hover {
	color: #fff !important;
	background: #808080;
	text-decoration: none !important;
}


.probutton .probook a {
	background: #000;
}

.probutton p a:hover {
	background: #808080;
}

.probook {
	text-align: center;
	font-size: 90%;
	height: 20px;
	line-height: 20px;
}

.button {
	width: 293px;
	height: 330px;
	float: left;
	margin: 50px 0 0 50px;
	position: relative;
}

.button p a {
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	text-transform: uppercase;
	text-decoration: none;
	color: #000;
	background: #fff;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	padding: 10px 10px 10px 0;
	width: 293px;
	font-size: 105%;
	white-space: nowrap;
}

#education #edpage {
	margin-left: 250px;
}

#education .buttons {
	padding-top: 25px;
}

#education .buttons h2,
#education .buttons h3 {
   margin-left: 50px;
}

#education .button {
	width: 293px;
	height: 330px;
	margin: 0 0 50px 50px;
	background: #666;
}

#education .button p a {
	padding: 10px 0;
	width: 293px;
}

.button p a:hover {
	background: #fff;
	color: #808080;
}

#all .exhibit .bigger {
	font-size: 80%;
}

#exhibitions .button p a,
#programs .button p a {
	background: #2d3d47;
}

#exhibitions .button p a:hover,
#programs .button p a:hover {
	color: #000;
	background: #abb1b5;
}

#exhibitions .button p.dates,
#programs .button .date {
	background: #57646c;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
	padding: 10px;
}

#programs .button .date {
	
}

.col {
	width: 313px;
	margin-right: 30px;
	float: left;
}

.col-last {
	margin-right: 0;
}

/* twitter */
#twitter {
	width: 230px;
	height: 140px;
	position: absolute;
	bottom: 60px;
	left: 10px;
	z-index: 1000000;
	overflow: hidden;
}

/* top */
.top a {
	display: block;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	font-size: 105%;
	text-transform: uppercase;
	color: #fff;
	background: #000;
	padding: 10px;
	float: left;
	margin: 40px 0 40px 50px;
}

.top a:hover {
	color: #fff;
	background: #808080;
	text-decoration: none;
}


/** txt **/
#copy h3 {
	font-family:  Arial, sans-serif;
	font-weight: bold;
	font-size: 150%;
	text-transform: uppercase;
	color: #000;
	padding: 0;
}

.copy h3 {
	font-family:  Arial, sans-serif;
	font-weight: bold;
	font-size: 120%;
	text-transform: uppercase;
	color: #000;
	padding: 0;
	width: 260px;
}

#all #ed h2 {
	margin: 0 0 0 50px;
}


#all #ed h3.h2014 {
	font-size: 120%;
	margin: 0 0 0 50px;
	text-transform: uppercase;
	font-family:  Arial, sans-serif;
	font-weight: bold;
}

#copy h4 {
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 120%;
	text-transform: uppercase;
	color: #000;
	padding: 0;
}

#copy h4.smalltitle {
	font-size: 100%;
}

h5 {
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 100%;
	color: #000;
	padding: 0;
}

#copy p.dates {
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 100%;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #808080;
	padding: 0;
}

#giving p { width: 55%; }

/** education pages **/
#ed {
	margin-left: 250px;/* w 280 */
	padding-top: 25px;
}

.prettybox {
   background: #e9eeef;
   padding: 10px;
}

/* page links */
#copy a:link { color: #808080; }

a { font-weight: bold; }

/** ed links **/
#ed p a:link,
#ed p a:visited {
	color: #57646c;
}
	
	#ed p.artist,
	p.classtype,
	#ed p.title {
		font-family: Arial, sans-serif;
		font-weight: bold;
		font-size: 200%;
		text-transform: uppercase;
		margin-bottom: 0;
	}
	
	#ed p.artist,
	p.edpara {
		margin-left: 0;
		font-size: 90%;
	}
	
	.colour { color: #00abbd; }
	
	.black { color: #000 !important; }
	
	p.classtype {
		color: #00abbd;
		margin-bottom: 10px;
	}
	
	.edpic {
		background: #00abbd;
		margin: 10px 0;
		position: relative;
	}
	
	#ed .edpic { margin-left: 30px; }
	
	.edpic p {
		color: #fff;
		position: absolute;
		top: 30px;
		right: 30px;
		width: 293px;
		text-align: right;
		font-size: 120%;
		line-height: 1.3;
	}
	
	.settlement .edpic p {
		font-size: 110%;
		width: 310px;
	}
	
	.edpic a { color: #2d3d47 !important; }
	
	
	h2.classtype {
		text-transform: uppercase;
		font-size: 120%;
		margin-bottom: 10px;
		font-family:  Arial, sans-serif;
		font-weight: bold;
	}
	
	#ed h2.classtype { margin-left: 30px; }
	
	#ed p {
		margin-bottom: 10px;
		line-height: 1.2;
	}
	
	#education .textonly p {
		margin-bottom: 20px;
	}
	
	.infocol {
		width: 470px;
		float: left;
		margin: 20px 0 40px 40px;
		position: relative;
	}/* columns for each infobox */
	
	.contactcol {
		margin-right: 0;
	}/* columns for each infobox */
		
	.infocol p {
		font-size: 90%;
		margin: 0 10px;
	}
	
	.infobox {
		background: #00abbd;
		padding-bottom: 0;
		margin-bottom: 10px;
	}
	
	.facilitators .infocol {
		height: 90%;
	}
	
	.h40 {
		height: 40px;
	}
	
	.h200,
	.facilitators .h200 {
		height: 200px;
	}
	
	.h300 {
		height: 300px;
	}
	
	.h340 {
		height: 340px;
	}
			
		#ed .infobox p {
			color: #fff;
			font-size: 90%;
			padding-bottom: 10px;
			margin-bottom: 0;
		}
				
		.infobox h3 {
			font-family: Arial, sans-serif;
			font-weight: bold;
			font-size: 120%;
			text-transform: uppercase;
			color: #fff;
			background: #2d3d47;
			padding: 10px 0 10px 10px;
			margin: 0 0 10px 0;
		}
		
		.contactbox {
			background: #fff;
		}
				
		#ed .contactbox p {
			color: #000;
			font-size: 90%;
		}

#ed {
   
}

#ed .info,
.artwork .info {
	margin: 20px 0 40px 40px;
	width: 990px;
}

.resources .info {
	width: 45% !important;
}

.info {
	width: 293px;
	float: left;
	margin: 20px 0 40px 50px;
}

.drawinglife .info p {
	width: 990px !important;
}

#ed h2 {
	text-transform: uppercase;
	margin: 0 0 30px 50px;
}

#education h2 {
   font-size: 150%;
}

#education h3 {
   font-size: 120%;
}

.info h3 {
	margin: 0 0 10px 0;
	padding: 10px 0;
	font-family: Arial, sans-serif !important;
}

.grey {
	color: #57646c;
}

.pale {
	color: #939393;
}

#alert {
   width: 1000px;
   padding: 30px 60px;
   margin-left: 60px;
   font-weight: bold;
}
		
#ed .info p {
	font-size: 80%;
}

.drawinglife #ed .info p {
	width: 586px;
}

.drawinglife .info table {
	margin-top: 20px;
}

.info table,
table.list {
	font-size: 80%;
	width: 100%;
}

.info td,
table.list td {
	padding: 3px 10px 5px 0;
}

.list a.book {
   display: block;
   text-align: center;
   padding: 10px 0 0 0;
   width: 100px;
   height: 25px;
   float: left;
}

.list a.book:link,
.list a.book:visited {
   font-weight: bold;
   color: #fff;
   background: #000;
}

.list a.book:hover {
   font-weight: bold;
   color: #fff;
   background: #808080;
   text-decoration: none;
}

.list a.book:active {
   font-weight: bold;
   color: #fff;
   background: #000;
}

.list p.credits { font-size: 90%; }
		
.book {
	width: 100%;
	height: 30px;
}/* for IE */
			
.book a {
	display: block;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	font-size: 70%;
	text-transform: uppercase;
	color: #fff;
	background: #000;
	padding: 10px;
	float: left;
	margin: 10px 0 20px 0;
}

.book1 a {
	margin: 10px 0 10px 0;
}

.book2 a {
	margin: 0 0 20px 0;
}
		
		.pdfs a {
			display: block;
			font-family: "Arial Black", Arial, sans-serif;
			font-weight: bold;
			font-size: 90%;
			text-transform: uppercase;
			color: #fff;
			background: #000;
			width: 273px;
			padding: 10px;
			margin-left: 50px;
			float: left;
		}
		
		.book a.pdf {
			font-size: 100%;
		}
		
		.book a.pdf span.pdf {
			font-size: 90%;
			margin-left: 10px;
		}
		
		.donate a {
			display: block;
			font-family: "Arial Black", Arial, sans-serif;
			font-weight: bold;
			font-size: 90%;
			text-transform: uppercase;
			text-align: left;
			color: #fff;
			background: #000;
			padding: 10px;
			margin: 10px 0;
			float: left;
		}
		
		.donate a:hover {
			color: #fff;
			background: #808080;
			text-decoration: none;
		}
				
		.popup a {
			width: 240px;
		}
		
		.pdfs a {
			font-size: 90%;
		}
		
		a.nomargin {
			margin-right: 0;
		}
		
		#ed .book a:link,
		#ed .book a:visited,
		#ed .pdfs a:link,
		#ed .pdfs a:visited {
			color: #fff;
		}/* for IE */
		
		.book a:hover,
		.pdfs a:hover,
		#copy .pdfs a:hover {
			color: #fff;
			background: #808080;
			text-decoration: none;
		}/* for IE */
		
		a.soldout,
		.book a.soldout:hover {
			cursor: default;
			color: #fff;
			background: #000;
		}
		
		.pdfs a .filesize {
			font-size: 80%;
		}
		
		.book a .filesize {
			font-size: 80%;
		}
		
		.pdfs {
			width: 100%;
			height: 90px;
			margin-top: 40px;
		}/* for IE */
		
		#ed .pdfs {
		}
		
		.texta .book {
			margin-top: 50px;
		}
		
		#copy .pdfs a {
			width: 283px;
		}
		
		.join a {
			display: block;
			font-family: "Arial Black", Arial, sans-serif;
			font-weight: bold;
			font-size: 90%;
			text-transform: uppercase;
			color: #fff;
			background: #000;
			padding: 10px 0 10px 10px;
			width: 303px;
			margin-top: 30px;
		}
		
		.join a:link,
		.join a:visited {
			color: #fff;
		}/* for IE */
		
		.join a:hover {
			color: #fff;
			background: #808080;
			text-decoration: none;
		}/* for IE */
		
		p.cip-colour {
			color: #d71e58;
		}
 
.textonly {
	margin-left: 270px;
	position: relative;
	padding-top: 20px;
	padding-bottom: 10px;
}/* text only pages */

#programs .textonly {
   width: 980px;
}

.year2016 .textonly,
.pastyear2016 .textonly  {
   width: 530px;
}

.artwork .textonly {
   padding-left: 30px;
}

.pastprograms .textonly {
	margin-left: 0;
	clear: both;
}

.textonly ul.txt li {
	font-size: 80%;
	padding-left: 0;
	line-height: 1.5;
	list-style: none;
}

p.bookedout {
   text-transform: uppercase;
   outline: 1px solid #000;
   float: left;
   font-size: 90%;
   font-weight: bold;
   padding: 5px 20px;
   margin-top: 10px;
}

p.booked {
   text-transform: uppercase;
   outline: 1px solid #000;
   float: right;
   margin-right: 10%;
   font-size: 110%;
   font-weight: bold;
   padding: 5px 20px;
   margin-top: 10px;
}

.exhibit {
	margin-left: 270px;
	position: relative;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
}/* exhibitions, used for most sub-branches */

	.exhibit .copy {
		position: absolute;
		top: 0;
		left: 300px;
	}/* txt div */
	
	.exhibit h3 {
		margin-top: 10px;
	}
	
	.exhibit .dates {
		font-size: 80%;
		height: 80%;
	}

	.exhibit .text {
		font-size: 80%;
		height: 80%;
		width: 434px;/* mainly for ie */
		margin-top: 10px;
	}

.opendays {
	display: block;
	width: 11em;
	float: left;
}


#copy a.opening,
#venuehire a.opening {
   color: #fff;
   background: #000;
   display: block;
   font-size: 90%;
   padding: 10px;
   float: left;
}

#copy a.opening:link,
#copy a.opening:visited,
#venuehire a.opening:link,
#venuehire a.opening:visited {
   text-decoration: none;
}

#copy a.opening:hover,
#venuehire a.opening:hover {
   text-decoration: none;
   color: #fff;
   background: #808080;
}

#copy a.opening:active,
#venuehire a.opening:active {
   text-decoration: none;
   color: #fff;
   background: #000;
}

blockquote {
   font-size: 110%;
   padding: 20px 0;
   font-style: italic;
   font-family: 'Abhaya Libre', serif;
   color: #777;
}

blockquote::before {
   content: url(../images/2017/quotes.jpg);
   display: block;
   float: left;
   padding-right: 10px;
   margin-bottom: 20px;
}

.quoter {
   text-align: right;
   display: block;
   font-size: 80%;
   color: #777;
}

p.credits {
   padding-top: 10px;
   font-size: 70%;
}

.extitle {
   color: #777;
   font-size: 80%;
   text-align: right;
}

/* code it */
.col1 {
   width: 25%;
   float: left;
   box-sizing: border-box;
}

.col1 img { width: 100%; }

.col2 {
   width: 40%;
   float: left;
   box-sizing: border-box;
   padding: 0 20px 0 40px;
}

.col3 {
   width: 35%;
   float: left;
   box-sizing: border-box;
   padding: 0 20px 0 40px;
   border-left: 1px solid #ddd;
}

.bookbtn {
	padding: 5px 10px;
	text-align: center;
	font-size: 90%;
}

.bookbtn:link, .bookbtn:visited {
	color: #fff;
	text-decoration: none;
	background: #000;
}

.bookbtn:hover {
	text-decoration: none;
	background: #808080;
}

/** sidenav **/
#sidenav {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	width: 250px;/* was 260 */
}
	
	#sidenav a {
		display: block;
		padding: 0 0 0 10px;
		letter-spacing: -.1em;/* 2014 */
		letter-spacing: 0;
	}
	
	.educationnav a {
	  font-size: 150% !important;
	}
	
	#sidenav a:link,
	#sidenav a:visited {
		color: #000;
	}
		
	#sidenav div.linkstack {
		margin-top: 5px;
	}
	
	#sidenav span {
		line-height: 0.9;
	}
	
	#sidenav .sublink a {
		line-height: 0.5;
	}
	
	#sidenav .title {
		font-family: "Arial Black", Arial, sans-serif;
		font-weight: bold;
		font-size: 150%;
		height: 150%;
		letter-spacing: 0;
		text-transform: uppercase;
	}
	
	#sidenav .longtitle {
		font-size: 140%;
		height: 140%;
	}
	
	#sidenav .year .title {
		font-size: 120%;
		height: 120%;
	}
	
	#sidenav .sublink .title {
		font-size: 70%;
	}
	
	#sidenav .long {
		font-size: 70%;
		height: 70%;
	}
	
	#sidenav .byline {
		font-family: "Arial Black", Arial, sans-serif;
		font-weight: bold;
		font-size: 120%;
		height: 120%;
		letter-spacing: 0;
		text-transform: uppercase;
	}
	
	#sidenav .dates {
		font-family: "Arial Black", Arial, sans-serif;
		font-weight: bold;
		font-size: 100%;
		height: 100%;
		letter-spacing: 0;
		text-transform: uppercase;
		color: #808080;
	}

.sidebar a:link,
.sidebar a:visited {
	font-size: 70%;
	color: #57646c;
	color: #000;
	text-decoration: none;
}

.sidebar a:hover {
	text-decoration: underline;
}

.sponsors {
	position: absolute;
	bottom: 0;
	left: 1074px;
}

.sponsors p {
	width: 200px;
	font-size: 65%;
	color: #abb1b5;
	padding-bottom: 20px;
}

.supporters a {
   display: block;
   padding: 5px !important; 
   width: 120px;
   margin-left: 20px;
}

.supporters a:hover {
   outline: 1px solid #000;
}

/** buy button **/
.buy {
	height: 30px;
	float: left;
	margin-top: 10px;
}

.buy a {
	display: block;
	height: 30px;
	line-height: 30px;
	text-align: left;
	text-transform: uppercase;
	font-family: "Arial Black", Arial, sans-serif;
	font-weight: bold;
	font-size: 90%;
	letter-spacing: -0.1em;
	padding: 0 10px;
}

.buy a:link,
.buy a:visited {
	background: #50646d;
	text-decoration: none;
	color: #fff;
}

.buy a:hover {
	background: #2d3d47;
	text-decoration: none;
	color: #fff;
}

.buy a:active {
	background: #abb1b5;
	text-decoration: none;
	color: #fff;
}

/* --- gallerific --- */
/* 2013 img sizes - 680 x 700 */
div.content {
	display: none;
	float: right;
	width: 700px;
	height: 800px;
}

div.content a {
	text-decoration: none;
	padding-top: 10px;
	color: #fff;
	margin-top: 10px;
}

div.navigation {
	position: absolute;
	bottom: 20px;
	left: 270px;
}

div.navigation a { text-decoration: none; }

#artistlist {
	position: absolute;
	bottom: 60px;
	left: 50px;
}

p.artistlist {
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1;
}

div.content a:focus, 
div.content a:hover, 
div.content a:active {
	text-decoration: underline;
}

/* slideshow */
#home .slideshow {
   margin-top: 0;/* was -40 ... changed when "education" > "learning" */
}/* 2015/16 changes - clean up gap above slideshow */

.noslideshow {
   width: 1280px;
   height: 800px;
   background: url(/images/2018/transboundaries-bg.jpg) 0 0 no-repeat;
}

.noslideshow p {
   text-align: right;
   font-family: "Arial Black", Arial, sans-serif;
   font-weight: bold;
   font-size: 250%;
   color: #808080;
   text-transform: uppercase;
   padding-top: 40px;
   line-height: 0.9 !important;
}

.hitxt {
   color: #000;
}

.titlelink {
   font-size: 150%;
}

.noslideshow a:link,
.noslideshow a:visited {
   color: #000;
   text-decoration: none;
}

.noslideshow a:hover {
   color: #808080;
   text-decoration: none;
}

.noslideshow a:active {
   color: #000;
   text-decoration: none;
}


div.slideshow-container {
	position: relative;
	clear: both;
	height: 700px;
}

div.loader {
	position: absolute;
	top: 0;
	left: 0;
	background-image: url('loader.gif');
	background-repeat: no-repeat;
	background-position: center;
	width: 700px;
	height: 700px;
}

div.slideshow a.advance-link {
	display: block;
	width: 700px;
	height: 700px;
	text-align: center;
}

div.slideshow a.advance-link:hover, 
div.slideshow a.advance-link:active, 
div.slideshow a.advance-link:visited {
	text-decoration: none;
}

div.slideshow img {
	vertical-align: middle;
	float: left;
}

div.caption-container {
	position: relative;
	clear: both;
}

span.image-caption {
	display: block;
	position: absolute;
	width: 700px;
	top: 0;
	left: 0;
}

div.caption {
	font-size: 75%;
	color: #57646c;
	margin-top: 40px;
}

div.image-title {
	color: #2d3d47;
}

div.image-desc {
	
}

ul.thumbs {
	clear: both;
	width: 300px;
}

ul.thumbs li {
	float: left;
	margin: 2px 10px 10px 0;
	list-style: none;
}

a.thumb {
	padding: 2px;
	display: block;
}

ul.thumbs li.selected a.thumb {
	background: #000;
}

a.thumb:focus {
	outline: none;
}

ul.thumbs img {
	border: none;
	display: block;
}

/* img */
.gif {
	height: 293px;
	width: 293px;
	background: #fa87ca;
}

.gif img {
	margin: 39px;
}

.pia-pic { float: right; }

/*
#logo {
   position: absolute;
   right: 0;
   bottom: 0;
}
*/

#logotrineon {
	margin-bottom: 10px;
	margin-left: 20px;
}

#copy {
	float: left;
	width: 280px;
	margin-left: 270px;
	float: none;
	width: 280px;
	margin-left: 0;
	position: absolute;
	top: 0;
	left: 270px;
}

#collection #copy {
	width: 500px;
	margin-left: 50px;
	width: 500px;
	margin-left: 0;
	position: absolute;
	top: 0;
	left: 50px;

}

#iecopy {
	display: none;
}

#copy p {
	padding-top: 10px;
	font-size: 80%;
	line-height: 1.2;
}

.tight #copy p {
	font-size: 70%;
}

#copy p.tight-para + p {
	padding-top: 0;
}

#copy .dates {
	padding-top: 3px;
}

.fill10 {
	height: 10px;
}

.fill20 {
	height: 20px;
}

.fill30 {
	height: 30px;
}

.fill40 {
	height: 40px;
}

.fill80 {
	height: 80px;
}

.fill100 {
	height: 100px;
}

#ieonly {
	visibility: hidden;
}

.smaller {
	font-size: 90%;
}

.small {
	font-size: 80%;
}

.font100 {
	font-size: 100%;
}

.fs60 {
	font-size: 60% !important;
}

.fs70 {
	font-size: 70% !important;
}

.fs75 {
	font-size: 75% !important;
}

.fs80 {
	font-size: 80% !important;
}

.fs90 {
	font-size: 90% !important;
}


.fs100 {
	font-size: 100% !important;
}

.fs120 {
	font-size: 120% !important;
}

.fs140  {
	font-size: 140%;
}

.fs200  {
	font-size: 200%;
}

.days {
	padding-right: 10px;
}

.warning {
	color: maroon;
	font-weight: bold;
}

.divider {
	height: 1px;
	background: #ddd;
	margin: 0 0 40px 50px;
}

.codeit .divider {
	margin: 40px 0;
}

.hidden {
	visibility: hidden;
	display: none;
}

.floatleft {
   float: left;
}

.padd50 {
   width: 50px;
   height: 5px;
}

.soundcloudie {
   display: none;
}

.hr {
   border-bottom: 1px solid #000;
}

.fr {
   float: right;
   width: 45%;
}

.notice {
	border: 1px solid #abb1b5;
	margin: 10px 0 0 0;
	text-align: left;
	padding: 10px 10px 10px 10px;
}

.logos a {
   padding: 10px 15px;
   border: 1px solid #fff;
   display: inline-block;
}

.logos a.logo1 {
}

.logos a.logo2 {
}

.logos a.logo3 {
}


.logos a:hover {
   border: 1px solid #000;
}

/** current link **/
#home li.home a,
#exhibitions li.exhibitions a,
#programs li.programs a,
#education li.education a,
#collection li.collection a,
#visit li.visit a,
#venuehire li.venuehire a,
#vh li.venuehire a,
#giving li.giving a,
#contact li.contact a,
#publications li.publications a {
	color: #000;
	background: #fff;
}/* ... navbar */

#home li.home a:hover,
#exhibitions li.exhibitions a:hover,
#programs li.programs a:hover,
#education li.education a:hover,
#collection li.collection a:hover,
#visit li.visit a:hover,
#venuehire li.venuehire a:hover,
#giving li.giving a:hover,
#contact li.contact a:hover,
#publications li.publications a:hover {
	color: #808080;
	background: #fff;
}/* ... navbar */


/** current **/
.settlement a#settlement,
.masterclasses a#masterclasses,
.artwork a#artwork,
.idtours a#idtours,
.drawinglife a#drawinglife,
.designfutures a#designfutures,
.subscribe a#subscribe,
.contact a#contact,
.facilitators a#facilitators,
.programs a#now,
.general a#general,
.foundations a#foundations,
.year2013 a#year2013,
.collection13 a#collection13,
.madetolast a#madetolast,
.thompson a#thompson,
.conder a#conder,
.fragments a#fragments,
.traversing a#traversing,
.loans a#loans,
.wr a#wr,
.alum a#alum,
.explore a#explore,
.see-do a#see-do,
.education a#education,
.careerstudy a#careerstudy,
.resources a#resources,
.boyd a#boyd,
.wood a#wood,
.watch a#watch,
.year2014 a#year2014,
.experimenta a#experimenta,
.parking a#parking,
.eat-drink a#eat-drink,
.year2014 a#year2014,
.jerrems a#jerrems,
.agenda a#agenda,
.judithwright a#judithwright,
.pd a#pd,
.pnow a#pnow,
.listen a#listen,
.tutu a#tutu,
.garden a#garden,
.quarternary a#quarternary,
.tutu a#tutu,
.kentridge a#kentridge,
.blackbox a#blackbox,
.year2015 a#year2015,
.pastyear2015 a#pastyear2015,
.pastyear2015 a#year2015,
.year2016 a#year2016,
.text a#text,
.nineteen a#nineteen,
.dobell a#dobell,
.robb a#robb,
.frontier a#frontier,
.churchie a#churchie,
.watchlisten a#watchlisten,
.artworkbox a#artworkbox,
.pastyear2016 a#pastyear2016,
.pastyear2017 a#pastyear2017,
.pastyear2018 a#pastyear2018,
.year2017 a#year2017,
.year2018 a#year2018,
.glass a#glass,
.earth-fire a#earth-fire,
.less-than a#less-than,
.hearman a#hearman,
.programs a#programs,
.enews a#enews,
.churchie a#churchie,
.widening a#widening,
.portrayplay a#portrayplay,
.steel a#steel
 {
	color: #808080 !important;/* was d5d8da */
}/* ... sidenav */

#venuehire .maps {
   /*outline: 1px solid red;*/
	width: 640px;
	height: 600px;
}

#venuehire .textonly {
   /*outline: 1px solid black;*/
}

#vh h2 {
   font-size: 180%;
   text-transform: uppercase;
   margin-bottom: 10px;
}

#vh h3 {
   font-size: 130%;
   text-transform: uppercase;
   padding-top: 10px;
   margin-bottom: 10px;
}

#vh p {
   margin-bottom: 10px;
   font-size: 90%;
}

#vh table {
   width: 100%;
   font-size: 90%;
   margin-left: 0;
   border-collapse: collapse;
}

#vh table th {
   text-align: left;
   padding-left: 0;
}

#vh table tr:nth-child(even) {
   background: #fafafa;
}
/*
#vh table td:nth-child(even) {
   background: #f2f2f2;
}
*/
.asterisk {
   font-weight: bold;
}

#vh p.note {
   text-align: right;
   font-style: italic;
   padding-top: 0;
}

/* 
img 640px wide 
font = Arial Black
hovery + sign
*/
/*
2d3d47 - steel grey/blue
50646d - 80%
abb1b5 - 40%
00abbd - green
*/