@charset "UTF-8";
@import url("http://fast.fonts.com/t/1.css?apiType=css&projectid=b51d77bf-ea48-4579-9c99-d1deec15c3e6");
@import url("fonts.css");
/* CSS Document */

/* turquoise: #71cde4 */
body {font-family:"Avenir LT W01 35 Light", helvetica, arial; color:#757575; background-color:#f7f7f7; padding:8px 0px 0px 0px; font-size:12px;}
a:link, a:visited{color:#757575; text-decoration:none;} 
a:hover {color:#71cde4;}

img { border:0px; }

.caption {font-size:12px;line-height:140%;}
.captionSmall {font-size:11px;line-height:140%;}
.obl {font-family:"AvenirLTW01-45BookObliq";}
.caps {text-transform:uppercase;}

.clear {clear:both;}
.padded {padding-top:20px;}
.linedivide {margin-top:10px; padding-bottom:10px; border-top:1px solid #ccc;}

h1 {font-family:"Avenir LT W01 65 Medium"; text-transform:uppercase; font-weight:normal; line-height:1.4em; margin:0; padding:0;}
h2 {margin:0; padding:0;}

#container{width:950px; margin:0px auto 20px auto;}

/*global styles for layout */

#topnav{height:45px; font-size:12px; }
#topnav .leftnav {color:#DEDEDE;}
#topnav .leftnav a:link, #topnav a:visited{color:#71cde4; text-decoration:none; background-image:url(../graphics/eastend/backarrow.gif); background-repeat:no-repeat; padding-left:15px; padding-right:5px; background-position:left center; }
.leftnav {float:left; width:330px;}
#topnav .leftnav a.loginOut{background-image:none; padding-left:5px; padding-right:5px;}
.rightnav {float:left; padding-left:390px;width:220px;text-align:right; margin-right:10px;}
.rightnav img{padding-right:2px;}
.rightnav .social {padding-top:1px;float:left;}
.rightnav input{display:inline; width:115px;}


#logo {font-family:"Avenir LT W01 95 Black"; font-size:41px; color:#71cde4; text-transform:uppercase; float:left;line-height:41px;width:590px;}
#logo a{font-family:"Avenir LT W01 95 Black"; font-size:41px; color:#71cde4; text-transform:uppercase; text-decoration:none; }
#mainnav{float:right; padding-right:10px; font-size:13px; height:41px;line-height:59px; vertical-align:bottom;}
#mainnav ul{list-style-type:none;margin:0; padding:0;}
#mainnav li{display:inline;margin:0; padding:0 0 0 15px; }
#mainnav li a:link, #mainnav li a:visited{text-decoration:none; color:#757575;}
#mainnav li a:hover {color:#71cde4;}

#maincontent {padding-top:50px; clear:both;}

#subnav {width:110px; float:left; font-size:13px;}
.listhead {font-family:"Avenir LT W01 65 Medium"; padding-bottom:5px;}
#subnav ul{list-style-type:none;margin:0; padding:0px 0 20px 0;}
#subnav ul li{list-style-type:none; margin:0; padding:0 0 8px 0;}

#subnav a:link, #subnav a:visited{color:#757575; text-decoration:none;} 
#subnav a:hover, #subnav #facetBox a:hover {color:#71cde4;}

#subnav #facetBox{ padding-right:20px; line-height:1em;}
#subnav #facetBox a:link, #subnav #facetBox a:visited{color:#565656; text-decoration:none; font-family:"AvenirLTW01-65MediumObl"; font-size:11px;} 
#subnav #facetBox ul li{padding:0px 0px 12px 0px;}

#subnav a.selected, #subnav #facetBox a.selected{color:#71cde4;}

/*artist browser template styles */

.ab_col{width:110px; padding-left:10px; padding-right:40px;float:left; font-size:11px;}
.ab_col ul{list-style-type:none;margin:0; padding:0 0 15px 0;}
.ab_col ul li{list-style-type:none; padding:0 0 8px 0; margin:0;}
.ab_col img{padding:5px 0;}
.ab_col a:link, .ab_col a:visited, .ab_feature a:link, .ab_feature a:visited{text-decoration:none; color:#757575;}
.ab_col a:hover, .ab_feature a:hover{color:#71cde4;}

#rightcol_featured{width:350px; float:right;}
.ab_feature {background-color:#fff;padding-bottom:10px; margin-bottom:20px;}
.ab_feature p{margin:10px;}
.ab_feature_img {text-align:center; overflow:hidden; width: 350px; height:280px;}


/*artist detail template style */

#ad_portrait {width:240px; float:left; margin-right:25px;}
#ad_portrait img {padding-top:10px;}
#ad_portrait .portraitCaption { padding: 2px 0px 5px 0px; font-size:10px;}
#ad_content {float:left;}
#ad_maincontent {width:570px; padding-bottom:10px; float:left;}
#ad_maincontentCol1{width:200px; height:300px; float:left; position:relative;}
#ad_maincontentCol2{width:370px; height:300px; float:left;}
.bio{font-size:12px; line-height:130%; padding-right:10px;}
.ad_thumbs{width:370px; height:300px; position:relative;}
.ad_thumbs img{padding-bottom:10px;}
.ad_thumbs .col {width:185px; float:left; text-align:right;}
.ad_thumbs .col div{position:relative;}
.ad_slideshowLink{float:right; padding:2px;opacity:.8;}
.ad_slideshowLink:hover{opacity:1.0;}

.ad_gmap {width:355px; float:right;}

.ad_col{width:100px; height: 225px; position: relative; padding-left:0px; margin-right:20px; float:left; font-size:11px;}
.ad_col ul{list-style-type:none;margin:0; padding:0 0 15px 0;}
.ad_col ul li{list-style-type:none; padding:0 0 8px 0; margin:0;}
.ad_col img{padding:5px 0;}
.ad_col a:link, .ab_col a:visited, .ab_feature a:link, .ab_feature a:visited{color:#757575;}
.ad_col a:hover, .ab_feature a:hover{color:#71cde4;}

#ad_comments_list{
	float:left;
	width:440px;
	margin-right:40px;
}
#ad_comments_form{
	float:left;
	width:355px;
	margin:0px;
	padding:0px;
}
.ad_comments_form_bg, .ad_comments_list_bg {
	background-color:#FFFFFF;
	padding:17px 20px 20px 20px;
}
.creator{
	font-size:14px;
	line-height:140%;
}

# --- entity comments
#ad_comments_list #numComments{
	float:right;
	font-size:11px;
	font-weight:normal;
	text-transform: none;
	width:100px;
}
#ad_comments_list .commentImage{
	clear:left;
	float:left;
	padding:5px 8px 5px 0px;
}
#ad_comments_list .comment{
	margin: 0px;
	font-size:12px;
	line-height: 1.3em;
}
#ad_comments_list .byLine{
	padding: 4px 0px 20px 0px;
	font-size:11px;
	font-style:italic;
	clear:left;
	text-align:right;
}
# --- entity comments form
#ad_comments_form input {
	font-size:11px;
	font-weight: normal;
	padding: 0px 2px 0px 2px;
	margin: 0px;
	border: 1px solid #DEDEDE;
	width:305px;
}
#ad_comments_form input[type="text"] {
	font-size:11px;
	font-weight: normal;
	padding: 2px 2px 2px 2px;
	margin: 0px;
	border: 1px solid #DEDEDE;
	width:305px;
	outline-style:none;
	outline-width:0px;
}
#ad_comments_form input[type="file"] {
	font-size:11px;
	font-weight: normal;
	padding: 2px 2px 2px 2px;
	margin: 0px;
	border: 1px solid #DEDEDE;
}
#ad_comments_form textarea {
	font-size:11px;
	font-weight: normal;
	padding: 0px 2px 0px 2px;
	margin: 0px;
	border: 1px solid #DEDEDE;
	width:305px;
	font-family: Helvetica, sans-serif;
}
#ad_comments_form input[type="textarea"] {
	font-size:11px;
	font-weight: normal;
	padding: 2px 2px 2px 2px;
	margin: 0px;
	border: 1px solid #DEDEDE;
	width:305px;
	outline-style:none;
	outline-width:0px;
	font-family: Helvetica, sans-serif;
}
#ad_comments_form form a{
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
	padding: 10px 0px 0px 0px;
}
#ad_comments_form form a:hover{
	color: #71cde4;
	text-decoration:none;
}



/* artwork detail styles */
#art_content {float:left; width: 828px;}
#art_title {clear:both; margin-bottom:15px;color:#545454; width:585px; font-size:13px;border-bottom:1px solid #e3e3e3; padding-right:247px;}
#art_artist {height:50px; clear:both;}
#art_detail {width:580px; float:left; margin-right:40px;}
#imgPlaceholderDetail { background-color:#EDEDED; padding-top:175px; padding-bottom:175px; color:#999; font-size:16px; text-align:center; margin-bottom:2px;}
#art_detail_info{width:200px;margin-left:0px;float:left;line-height:150%;}
.art_related_list{width:200px; height:155px; position:relative; margin:0px 0px 15px 0px; padding:0px;}

/* exhibition detail styles */
#ex_content {float:left; width: 828px;}
#ex_title {height:50px; clear:both;}
#ex_content #ex_grid .ad_thumbs{ height:525px;}
#ex_content #ex_grid .ad_thumbs .col {width:185px; float:left; text-align:left;}
#ex_content #ex_grid{ float:left; width:555px; margin-right:35px;}
#ex_content #ex_img{ float:left; margin-right:45px;}
#ex_detail_info{width:238px; float:left; line-height:150%; margin:0px;}
div#ex_description{width:238px; height:200px; position:relative; margin-bottom:15px;}
div#ex_description p{margin:0px; padding:0px 0px 10px 0px;}
div.ex_related_list{width:238px; height:145px; position:relative; margin:0px 0px 15px 0px; padding:0px;}

/*chronology styles  - there are more styles defined in the plugin stylesheet */
#chron_content {float:left; width:830px;}
#chron_thumb {width:520px; float:left;}
#chron_thumbScroll {width:520px; height:550px; position:relative;}
#chron_thumb #chron_thumbScroll .col {width:250px; padding-right:10px; float:left; font-size:12px;font-family:"Avenir LT W01 65 Medium";}
#chron_thumb #chron_thumbScroll img {padding-bottom:10px;}
#chron_info {width:270px; float:right; font-size:12px;}
.chronoLists {width:270px; height:227px; position:relative;}
#chron_info ul {list-style-type:none; margin:0; padding:10px 0 10px 0;}
#chron_info ul li{list-style-type:none; margin:0 0 10px 0; padding:0;}

#chron_info ul li a:link, .ab_col a:visited{text-decoration:none; color:#757575;}
#chron_info ul li a:hover{color:#71cde4;}

/* related list links */
.art_related_list a:link, .art_related_list a:visited, .ad_col a:link, .ad_col a:visited, .ex_related_list a:link, .ex_related_list a:visited{
	border-bottom: 1px solid #cecece;
}
.art_related_list a:hover, .ad_col a:hover, .ex_related_list a:hover{
	border-bottom: 1px solid #71cde4;
}

/* hp content */
#hpTextContainer {
	width:275px; 
	float:left;
}
#hpTextHeader{
	font-size:24px;
	color:#71cde4;
	line-height:1.3em;
	padding-right:25px;
	padding-bottom:20px;
}
#hpText{
	padding-right:40px;
	line-height:1.5em;
	font-size:18px;
	color:#aaaaaa;
}
#hpFeatured{
	float:right;
	width:670px;
}
#hpFeaturedImg{
	width:670px;
	height:475px;
	overflow:hidden;
	background-color:#EDEDED;
}
#hpFeaturedScrollCaption {
	padding-top: 10px;
	text-align: left;
	color: #666666;
	font-size: 12px;
	font-style: italic;
}
#hpFeaturedScrollCaption a{
	text-decoration: none;
	color: #666666;
}

.imagePlaceholderThumb{
	background-color:#EDEDED; color:#999; padding-top:50px; height:70px; width:120px; font-size:10px;
}

/* scrolling div styles */

/* Replace the last selector for the type of element you have in
   your scroller. If you have div's use #makeMeScrollable div.scrollableArea div,
   if you have links use #makeMeScrollable div.scrollableArea a and so on. */
.ad_col div.scrollableArea div, #ad_maincontentCol1 div.scrollableArea div, .ad_thumbs div.scrollableArea div, #chron_thumbScroll div.scrollableArea div, .chronoLists div.scrollableArea div, #ex_description div.scrollableArea div, .ex_related_list div.scrollableArea div, .art_related_list  div.scrollableArea div
{
	position: relative;
	margin: 0;
	padding: 0;
	/* If you don't want the images in the scroller to be selectable, try the following
	   block of code. It's just a nice feature that prevent the images from
	   accidentally becoming selected/inverted when the user interacts with the scroller. */
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}

span.videoIconRelatedGrid{
	position:absolute;
	background-image:url(../graphics/eastend/videoPlay.png);
	background-repeat:no-repeat;
	background-position:center center;
	z-index: 10;
}
span.ad_imgPlaceholderDetail{
	position:absolute;
	background-color:#EDEDED;
	color:#999;
	font-size:12px;
	text-align:center;
	z-index: 10;
}

.videoIconResults{
	background-image:url(../graphics/eastend/videoPlay.png);
	background-repeat:no-repeat;
	background-position:center center;
	position:absolute;
	z-index: 10;
	width:130px;
	height:130px;
}
.videoIconResultsFull{
	background-image:url(../graphics/eastend/videoPlay.png);
	background-repeat:no-repeat;
	background-position:center center;
	position:absolute;
	z-index: 10;
}

/* Participate */
#participateRightCol{
	float:right;
	width:580px;
	padding-left:20px;
}
.participateImg{
	text-align:center;
	padding-bottom:5px;
	width:580px;
}
