@charset "UTF-8";

/* to start we need to hide somethings that will fade in after rearranged */

div.content { opacity: 0; transition: all 0.5s ease;}



.center { text-align: center; }
h2 { text-transform: lowercase; font-variant: small-caps; font-size: 1.4em; color: #666; }
h3 { text-transform: lowercase; font-variant: small-caps;color: #666 !important; margin: 0; font-style: normal !important;}
h4 {text-transform: lowercase; font-variant: small-caps;color: #666; margin: 20px 0; font-style: normal !important; font-size: 2em; }
body { margin: 0; padding:0; min-height: 100%;  }
body * { font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif; }
a, a:active, a:visited { color: #999; text-decoration: none;}
a { 	-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	-o-transition: opacity 200ms ease-in;
	-ms-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;}
a:hover { color: #999; opacity: .8;
	-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	-o-transition: opacity 200ms ease-in;
	-ms-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;

}
.oneeveryone a {
	position: relative;
	font-size: 1.5em;
	color: #333;
	-webkit-transition: opacity 300ms ease-out;
	-moz-transition: opacity 300ms ease-out;
	-o-transition: opacity 300ms ease-out;
	-ms-transition: opacity 300ms ease-out;
	transition: opacity 300ms ease-out;
	background-image: url(file:///Macintosh%20HD/Users/TEAL/Documents/A%20NEW%20SITE/images/projects/oneeveryone/austin/DSC_2507.jpg);
}
.oneeveryone a img { z-index: 5; 	-webkit-transition: opacity 300ms ease-out;
	-moz-transition: opacity 300ms ease-out;
	-o-transition: opacity 300ms ease-out;
	-ms-transition: opacity 300ms ease-out;
	transition: opacity 300ms ease-out;}
.oneeveryone a:hover img { opacity: .1;
	-webkit-transition: opacity 300ms ease-in;
	-moz-transition: opacity 300ms ease-in;
	-o-transition: opacity 300ms ease-in;
	-ms-transition: opacity 300ms ease-in;
	transition: opacity 300ms ease-in;
}
.oneeveryone a:hover .oneeveryone-caption { opacity: 1;}
.oneeveryone-caption { position: absolute; top:0; left:0; z-index:-1; width: 100%; height: 100%; text-align: center; line-height: 155px; }
li.active a, li.active span {color: #333 !important; }

header {  width: 225px; height: auto; padding: 0; margin: 15px auto;  border-bottom: 1px solid #CCC; font-variant: small-caps;	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
}
header h1 { width: 300px !important; height: inherit; display: block; font-size: 17px; line-height: 5px; margin: 0 0 10px 0;}
header span { font-size: 1em;}

header h1 a, header h1 a:hover { text-decoration: none; color: #111 !important; letter-spacing: .5px;	  }


p { margin: 0; white-space:normal; }

div.container {
	display:flex;
    vertical-align:top;
    min-height: 100%;
	width: 100%;
 }

nav {
	display: inline-block;
	height: 100%;
	vertical-align:top;
	background-color: white;
	width: 400px;
	margin-top: 40px;
	margin-left: 40px;
	min-width: 400px;
}

nav:not(.sticky) { 	opacity: 0;}

nav.sticky { position: fixed; top:0;left:0;}

div.content { 
display: flex;
padding-top: 20px;
position: relative;
flex-direction: column;
	padding-right:10px;
	padding-left: 10px; 
		    width: 800px;

}
div.content.projects, div.content.objects, div.content.press, div.content.prints, div.content.publicProjects {
	max-width: auto !important;
	padding-top:20px;
	padding-right: 10px;
	z-index: 10;
}

div.content.projects .subnav { }

div.content article p { 
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	font-size: 18px;
	color: #666;
	padding: 1em 0; }

div.content article.readings { align-items: flex-start; }
div.content article.readings p, div.content article.acknowledgements p, div.content article.credits p, .readings ul { font-size: 14px;padding-top:5px; padding-left: 5px;}
.readings ul { margin: 0; padding-left:20px;}
.readings ul li { line-height: 1.1em; }

div.content article.text-block.readings p { width: 100% !important; padding-top: 0;}
article.index { display: inline-flex; flex-wrap: wrap; justify-content: flex-start; }
	article.index a { margin: .5em; width: 30%;  overflow: hidden; height: 150px; 

-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	-o-transition: opacity 200ms ease-in;
	-ms-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;
}
article.index a.active { opacity: .6; 	-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	-o-transition: opacity 200ms ease-in;
	-ms-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;}
article.index a img {
	padding: 0;
	margin: 0;
	height: 160px;
	width: auto;
	position: relative;
	background-image: url(file:///Macintosh%20HD/Users/TEAL/Documents/A%20NEW%20SITE/images/projects/oneeveryone/factory_direct/Page_03_JF.jpg);
}
article.text-block p {  }


article.page  { width: 840px; font-size: 10px; line-height: 1.3em;}
article:not(.work-title, .link) { 
	display: inline-flex; align-items: flex-end; 
}

article.page p { font-size: 11px !important; line-height: 18px; }
article { 
	padding-bottom: 4em;
}


ul.anchors { list-style-type: none;}

article.text-box * { width: 100%;}

article {      flex-grow:2;
}
img { padding: 0 0;}

article.button-block { 
    position: relative;
    display: inline-block;
    width: 400px;
    padding: 0;
    height: 700px;

}
span.separator { font-size: .5em; margin: 0 5px;}
a.button {  vertical-align: bottom; font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif; text-align: center; font-variant: small-caps; padding: 60px; font-size: 24px; margin: auto; color: #666; display: block;	 }
a.button:hover { background: #666; text-decoration: none; color: #FFF;}
article.work-title.sticky { position: fixed; top: 0; display: none; z-index: 10; background: rgba(255,255,255,.95);}

article.work-title.sticky p {  }
.work-title div a {  font-size: 14px;}
.work-title div p { text-align :left; }
article.text-block.work-title {
	/*margin-top: auto;*/
}
div.subnav { padding: 2em 0;  position: relative; top: 0; display: inline-flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;}
div.subnav .clone { display: none;}
div.subnav.sticky {  padding: 2em 0; display: none; position: fixed; top: 0; z-index: 10; background: rgba(255,255,255,.95); padding-right: 10px;

}
div.subnav.sticky.shadow {box-shadow: 0 0 40px 30px rgba(255,255,255,.95); -webkit-box-shadow: 0 0 40px 30px rgba(255,255,255,.95); -moz-box-shadow: 0 0 40px 30px rgba(255,255,255,.95); }
div.subnav span { justify-content: space-between;}
a.button { padding: 10px; border: 1px solid #666; background: none; display: inline-block;}
.sticky-nav { display: none; }
.sticky div div.sticky-nav { display: block;  }
.sticky-nav .LeftMainColumn { text-align: left; padding: 0 20px; }

ul.list-buttons { 
list-style-type: none;
display: inline-flex;
flex-direction: column;

padding:0;
}

i { display: inline-block; width: 10px; content: " • "; font-size: 10px; }
i:after { padding-left: 3px;  content: " • ";}

ul.list-buttons li {

	display: inline-block;
	padding: 5px;
	white-space: normal;
	max-width: 300px;

}

article.text-block, article.related { 
    position: relative;
    display: inline-flex;
    align-items: flex-start;
    padding: 0 0 4em 0;
    overflow: hidden;
    flex-direction: column;
	width: 580px;
}

.text-block.readings, .credits, .caption { font-style: italic; }
.text-block.readings p, .credits p, .text-block.acknowledgements p { font-size: 12px;}
.text-block.readings h3 , .credits h3 .text-block.acknowledgements h3 { text-transform: lowercase !important; }
.text-block.readings { color: #666; }
.credits { padding-top: 0; text-align:left;}
.text-block.related h3 { flex-wrap: wrap; flex-grow: 2;color: #666;}
.text-block.related a { display: inline-flex; width: 100px; height: 100px; background: #ccc; line-height: 100px; padding: 0 25px; text-align: center; color: white; }
article.text-block.right { align-items: flex-end;}

article.statement { border-bottom: 2px solid #666; }
article.text-block.right { text-align:right; }
article.text-block p.right, article.text-block.right h3 { align-self:flex-end;}
article.text-block p.caption { padding-top:0; margin-top: 0; display: none;}
article.readings, article.related { border-top: 1px solid #ccc; font-style: italic;}

/*article.work-title { position: absolute; left: 0; bottom:0; }*/

div.spacer { width: 300px; display: inline-block; }
article.text-block * {  }
article.text-block p { 
	font-size: 18px;
    color: #999;
    vertical-align: bottom;
    padding: 0 60px 20px 0;
    line-height: 1.35em;
    /*text-indent: 2em;*/
     }
article.video { margin-top: 30px; }
article.text-block.indent p { margin-left: 15%;}
article.text-block.indent p.right { text-align: right; }
article.text-block p { 

/*margin-left: 15% !important;*/
    text-align: justify;
}

article.text-block.work-title p:last-child { 


}
     article.text-block p:last-child { 
/*     	border-bottom: 2px solid #999;
*/    display: block;
     }

article:not(.text-block):not(.index) img { padding: 0; width: 580px !important; height: auto !important; }
article.text-block img { }
article, iframe, img  { display: inline-block; vertical-align:top;}

iframe { width: 580px !important; height: 322px !important; }

article { position: relative; line-height: 1.4em; flex-wrap: wrap;}
article iframe { padding:0;}
.caption {
	color: #999;
	padding: 10px 0;
	opacity: 0;
	position: absolute;
	bottom: 61px;
	background: rgba(255,255,255,0.9);
	width: 580px;
	padding: 5px !important;
	font-size: .9em !important;
	-webkit-transition: opacity 200ms ease-in;
	-moz-transition: opacity 200ms ease-in;
	-o-transition: opacity 200ms ease-in;
	-ms-transition: opacity 200ms ease-in;
	transition: opacity 200ms ease-in;
	z-index:3;
}
.captioned { width: 580px;}
article.captioned:hover p.caption{ opacity: 1;
    -webkit-transition: opacity 200ms ease-in;
    -moz-transition: opacity 200ms ease-in;
    -o-transition: opacity 200ms ease-in;
    -ms-transition: opacity 200ms ease-in;
    transition: opacity 200ms ease-in;

}

.LeftMainColumn {
	list-style-type: none;
	display: inline-block;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	font-size: 15px;
	font-weight: normal;
	color: #333333;
	line-height: 18px;
	clip: rect(0px,0px,0px,0px);
	width: 128px;
	margin: 0px;
	padding: 0px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: 0;
	border-right-style: 0;
	border-bottom-style: 0;
	border-left-style: 0;
	font-variant: small-caps;
	vertical-align: top;
	text-align:right;
}

.subnav { padding: 1em 0; width: 740px; width: inherit; min-width: 540px !important;}

.subnav .LeftMainColumn { width: 100%; text-align:left; padding-top: 10px; display: inline-flex; justify-content: flex-start;  text-transform: lowercase;flex-wrap: wrap; font-weight: 800;}
 
.subnav.justify .LeftMainColumn { justify-content: space-between;}

.IndexMain {
	display: block;
	margin-bottom: 1.5em;
}
.RightMainColumn {
	list-style-type: none;	
	display: inline-block;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	font-size: 15px;
	color: #999;
	margin: 1px 0 0 0;
	padding: 0px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: 0;
	border-right-style: 0;
	border-bottom-style: 0;
	border-left-style: 0;
	clip: rect(0px,0px,0px,0px);
	font-style: italic;
	line-height: 16px;
	font-weight: 100;
	min-width: 240px;
}
.RightMainColumn a:link {
	color: #999;
	font-style: italic;
	font-weight: 100;
	font-variant: normal;
	text-decoration: none;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
}
.RightMainColumn a:hover {
	text-decoration: none;
	font-style: italic;
	font-weight: 100;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	color: #333 !important	;
}
.RightMainColumn a:visited {
	color: #999;
	font-style: italic;
	font-weight: 100;
	text-decoration: none;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
}
.RightMainColumn a:active {
	color: #242424;
	text-decoration: none;
	font-style: italic;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
}
.RightMainColumn.items { 
	margin: -94px 0 0 4px;
	overflow-y: scroll;
	max-height: calc(100vh - 90px);					
}
.RightMainColumn.items.objects { padding-top: 18px; }
.RightMainColumn.items.public { padding-top: 54px; }
.RightMainColumn.items.performances { padding-top: 96px; }
.RightMainColumn.items.scripts { padding-top: 115px; }
.RightMainColumn.items.publications { padding-top: 134px; }
.RightMainColumn.items.press { padding-top: 153px; }
.RightMainColumn.items.video { padding-top: 36px;}
.items li a.active { color: #333; }

.LeftMainColumn a:link {
	text-decoration: none;
	color: #333333;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
}
.LeftMainColumn a:hover {
	text-decoration: underline;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	color: #333333;
}
.LeftMainColumn a:visited {
	color: #333333;
	text-decoration: none;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	font-weight: 00;
}
.LeftMainColumn a:active {
	color: #333333;
	text-decoration: none;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
}

.MainArea {
	font-size: 12px;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	line-height: 17pt;
	color: #000000;
	width: 740px;
}
.dates {
	font-size: .7em;
	color: #999;
	font-style: italic;
}
.SelectedProject {
	font-size: 11px;
	color: #666;
	font-style: italic;
}
.centermovie {
	text-align: center;
}
.project-title {
	font-size: 24px;
	font-family: Garamond, "Adobe Garamond Pro", "Hoefler Text", "Times New Roman", serif;
	font-style: italic;
	padding-right: 5px;
	flex-grow:2;
	width: 100%;

}

.project-dates { align-selft: flex-end; font-size: 11px; 
text-transform: uppercase;
font-weight: 400;
line-height: 24px;
flex-grow:2;
width: 100%;
}



.location, .venue { flex-grow: 2;width: 100% !important; margin-top: 5px;}
.object { border:0px; }
.MainAreaLarger {
	font-family: Garamond, "Times New Roman", serif;
	font-size: 15px;
	font-style: normal;
	line-height: 13px;
}


@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
	  nav.sticky { opacity: 0;}
	  nav { width: 95%; }
	  nav:not(.sticky) { opacity: 1;}
	  div.container { flex-wrap: wrap; }
	  ul.LeftMainColumn { width: 35%; }
	  div.content { margin: 0 auto;}
	  
	  article:not(.text-block):not(.index) img { width: 100% !important; }
	  article iframe { width: 100% !important;}

	  .LeftMainColumn { font-size: 30px; line-height: 36px;}
	  .RightMainColumn { font-size: 30px; line-height: 32px; }
	  .RightMainColumn.items { margin: -186px 0 0 4px; }
.RightMainColumn.items.objects { padding-top: 34px; }
.RightMainColumn.items.public { padding-top: 108px; }
.RightMainColumn.items.video { padding-top: 72px;}
	  header { width: 300px; }
	  header h1 { font-size: 22px; }
}

/*retina*/

@media screen 
  and (min-device-width: 569px) 
  and (max-device-width: 1200px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
	  nav.sticky { opacity: 0;}
	  nav { width: 95%; }
	  div.container { flex-wrap: wrap; }
	  ul.LeftMainColumn { width: 35%; }
	  
	  .LeftMainColumn { font-size: 30px; line-height: 36px;}
	  .RightMainColumn { font-size: 30px; line-height: 32px; }
	  .RightMainColumn.items { margin: -186px 0 0 4px; }
.RightMainColumn.items.objects { padding-top: 34px; }
.RightMainColumn.items.public { padding-top: 108px; }
.RightMainColumn.items.video { padding-top: 72px;}
	  header { width: 300px; }
	  header h1 { font-size: 22px; }
	  header h1, article.text-block p strong {font-weight: 600;}
}