/* Historic Mexican and Mexican American Journalism Project - a UAL digital collection
 * This CSS authored by Ginger Bidwell, last modified 4/19/2011
 * Textured backgrounds created with images by Caleb Kimbrough from Lost and Taken: http://lostandtaken.com
 * Meyer reset http://meyerweb.com/eric/tools/css/reset/
 * Less Framework 4 by Joni Korpi http://lessframework.com
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
/*table, caption, tbody, tfoot, thead, tr, th, td*/ {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}


/*	Resets
	------	*/

html, .main, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, t.main, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
}
article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
  display: block;
}
a img { border: 0; }


/* Additional resets from Boilerplate */
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
ins { background-color: #ff9; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
input, select { vertical-align: middle; }

body { font:13px/1.231 sans-serif; *font-size:small; } 
select, input, textarea, button { font:99% sans-serif; }
pre, code, kbd, samp { font-family: monospace, sans-serif; }

html { overflow-y: scroll; }
a:hover, a:active { outline: none; }
ul, ol { margin-left: 2em; }
ol { list-style-type: decimal; }
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
small { font-size: 85%; }
strong, th { font-weight: bold; }
td { vertical-align: top; }

sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; }
textarea { overflow: auto; }
.ie6 legend, .ie7 legend { margin-left: -7px; } 
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid {  }
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }


/* helpful classes from boilerplate */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.visible { visibility: visible; }
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/*		Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

html {
  max-width: 2000px;
}

body {
  line-height: 1.5em;
  font-size: 1em;
  font-family: Verdana, sans-serif;
  background: url(cardboard-dark.png);
  text-shadow: 1px 1px 1px rgb(223, 172, 125);
}
a {
  text-decoration: none;
  border-bottom: 1px solid;
  color: rgb(64, 50, 39);
}
a:hover {
  color: #120e0b;
  border-bottom: 0;
}
a.external {
}
a.pdf {
}
a.ual {
}
p {
  margin: 1em 0;
}
::-moz-selection{
  background: rgb(202, 165, 143);
  color:#fff;
  text-shadow: none;
}
::selection {
  background: rgb(202, 165, 143);
  color: #fff; text-shadow: none;
}
ul {
  list-style-type: disc;
  margin-left: 2em;
}
ol {
  list-style-type: decimal;
  margin-left: 2em;
}
h1, h2, h3, h4, h5, h6 {
  font-family: Amaranth, sans-serif;
  line-height: 1.2em;
}
h1 {
  font-size: 2.5em;
  padding: 0.6em 48px;
  background: url(cardboard-lighter.png);
  width: 896px;
  margin: 0 auto;
  -moz-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
  -webkit-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
  box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
}
h1 a {
  border-bottom: 0;
  color: #453226;
}
h2 {
  font-size: 2.25em;
  margin: 0.5em 0;
}
h3 {
  font-size: 1.5em;
  margin: 1.2em 0 0.5em 0;
}
h4 {
  font-size: 1.2em;
  margin: 1em 0;
}
h5 {
  font-size: 1.1em;
  margin: 1em 0;
}
h6 {
  font-size: 1em;
  font-style: italic;
  margin: 1em 0;
}
dt {
  font-size: 1.2em;
  margin: 1em 0 0.5em 0;
}
dd {
  margin: 0 0.5em;
}
textarea {
  width: 100%;
}
input, textarea {
  border: 1px solid rgb(158, 124, 97);
  color: rgb(18, 14, 11);
}
:required {
  border-color: rgb(117, 92, 72);
}
input:focus, textarea:focus {
  border: 1px solid rgb(33, 26, 20);
}
button {
  padding: 3px 5px;
  background: url(cardboard-lightest.png);
  color: rgb(64, 50, 39);
  border: 1px solid rgb(180, 131, 99);
}
button:hover {
  cursor: pointer;
  background: url(cardboard-lighter.png);
  border: 1px solid rgb(142, 102, 77);
  color: rgb(0, 0, 0);
}
header div a {
  width: 992px;
  margin: 0 auto;
  display: block;
  border-bottom: none;
}
.banners .ua {
  background: #003366;
  padding-top: 10px;
  height: 42px;
}
.banners .library {
  background: #CC0033;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: rgba(255, 255, 255, 0.8);
  border-color: rgb(255, 255, 255);
  padding-top: 5px;
  padding-bottom: 2px;
}
.main{
  padding: 24px 48px;
  width: 896px;
  -webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
  margin: 0 auto;
  -moz-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
  -webkit-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
  box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
  border-color: rgba(87, 42, 39, 0.8);
  border-color: rgb(87, 42, 39);
  background: url(tile-test.png);
  color: rgb(18, 14, 11);
}
footer {
  width: 896px;
  font-size: 75%;
  text-align: center;
  margin: 0 auto;
  padding: 1em 48px 48px 48px;
  -moz-box-shadow: 2px 5px 2px rgba(33, 26, 20, 0.8), inset 0px 5px 2px rgba(33, 26, 20, 0.8);
  -webkit-box-shadow: 2px 5px 2px rgba(33, 26, 20, 0.8), inset 0px 5px 2px rgba(33, 26, 20, 0.8);
  box-shadow: 2px 5px 2px rgba(33, 26, 20, 0.8), inset 0px 5px 2px rgba(33, 26, 20, 0.8);
  text-shadow: none;
  background: url(cardboard.png);
}
div.content {
  float: left;
  width: 436px;
} 
aside{
  float: right;
  width: 388px;
  margin: 0 24px;
}

nav {
  width: 1000px;
  padding: 0px 24px;
  margin: 0 auto;
  line-height: 1.5em;
  font-size: 1.4em;
  text-shadow: none;  
  background: url(banner-right.png) no-repeat right, url(banner-left.png) no-repeat left;
}
nav ul {
  width: 896px;
  margin: 0 auto;
  padding: 0 48px;
  -moz-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8), -3px 0px 3px rgba(33, 26, 20, 0.8);
  -webkit-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8), -3px 0px 3px rgba(33, 26, 20, 0.8);
  box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8), -3px 0px 3px rgba(33, 26, 20, 0.8);
  background: url(cardboard-super-dark.png);
}
nav li {
  display: inline;
}
nav a {
  border-bottom: none;
  padding: 0.25em 0.4em;
  color: rgb(232, 189, 146);
  /* candy */
  -webkit-transition: all 300ms cubic-bezier(0.650, 0.405, 0.690, 0.875); 
  -moz-transition: all 300ms cubic-bezier(0.650, 0.405, 0.690, 0.875);
  -o-transition: all 300ms cubic-bezier(0.650, 0.405, 0.690, 0.875);
  transition: all 300ms cubic-bezier(0.650, 0.405, 0.690, 0.875);
}
nav a.active {
  color: #FFF3E8;
}
nav a:hover {
  color: #FFF3E8;
}

#home .nav-home a,
#browse .nav-browse a,
#time .nav-time a,
#about .nav-about a,
#contact .nav-contact a {
  color: #FFF3E8;
}

/* home and search 
section#search {
  float: right;
  width: 388px;
}*/
.options {
  font-size: 0.89em;
  padding: 1em;
}
.options label {
  display: block;
  margin: 0.5em 1em;
}
.options select {
  margin-left: 0.25em;
}
label, .label {
  font-weight: bold;
}
input {
  padding: 3px 4px;
}
.search .keywords input {
  width: 85%;
}
.search form {
  position: relative;
}
a.advanced {
  line-height: 36px;
  margin-left: 24px;
}

/*resources*/
.contact input { 
  display: block; 
}


/* timeline */
.timeline-container {
  position: relative;
  padding: 0.5em 0em 0em 0.5em;
}



/* image scrollboxes */
/*aside.sample-image {
  margin-top: 3em;
}*/
.main img {
  width: 100%;
  height: auto;
}
.image-inner {
  float: left;
}
.item-link {
  font-size: 0.8em;
  position: relative;
  float: left;
}
.item-link a {
  text-shadow: none;
}
.item-link a span {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  background-color: rgba(229, 197, 185, 0.8);
  background-color: rgb(229, 197, 185);
  border-bottom: 5px solid rgb(135, 106, 83);
  /* candy */
  -webkit-transition: all 500ms cubic-bezier(0.650, 0.405, 0.690, 0.875);
  -moz-transition: all 500ms cubic-bezier(0.650, 0.405, 0.690, 0.875);
  -o-transition: all 500ms cubic-bezier(0.650, 0.405, 0.690, 0.875);
  transition: all 500ms cubic-bezier(0.650, 0.405, 0.690, 0.875);
}
.item-link a:hover span {
  background-color: rgb(229, 197, 185);
  background-color: rgba(229, 197, 185, 1);
}
.object-metadata {
  clear: left;
}
.object-metadata p {
  font-size: 0.8em;
  margin: 0.5em 0;
  padding-left: 2px;
}
.sample-image {
  width: 388px;
}
.scrollable {
  position:relative;
  overflow:hidden;
  width: 326px;
  height: 326px;
  float: left;
  padding-top: 12px;
  background: url(cardboard.png);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: inset 0 0 5px rgba(33, 26, 20, 0.7);
  -webkit-box-shadow: inset 0 0 5px rgba(33, 26, 20, 0.7);
  box-shadow: inset 0 0 5px rgba(33, 26, 20, 0.7);
}
.scrollable .scroll-images {
  /* increase the size with more images */
  width:200em;
  position:absolute;
}
.scroll-images .image-inner {
  float:left;
  width: 252px;
  margin: 0 12px;
}

a.browse {
  width: 20px;
  border: 0;
  float:left;
  margin-top: 68px;
  padding: 4px;
  background-repeat: no-repeat;
  background-position: center center;
}
a.next {
  background-image: url(arrow-right.png);
}
a.prev {
  background-image: url(arrow-left.png);
}
a.next:hover {
  background-image: url(arrow-right-lt.png);
}
a.prev:hover {
  background-image: url(arrow-left-lt.png);
}
a.disabled,
a.disabled:hover {
  background: none;
}


/* degradation and modernizr classes */
.ie6 .first { 
  display: block;
}
.ie6 .timeline * { 
  display: none;
}
.ie6 nav {
  width: 100%;
  text-align: center;
}

.no-textshadow button {
  font-weight: bold;
}
.no-js .scrollable .image-inner { 
  display: none;
}
.no-js .scrollable .first { 
  display: block;
}
.ie6 a.browse, .ie6 .image-inner  {
  display: none;
}
.ie6 .scrollable {
  background: none;
}


/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  body {
    font-size: 0.89em;
  }
  header div a {
    width: 712px;
  }
  p {
    font-size: 1.1em;
  }
  .options {
    font-size: 1em;
  }
  .main, h1, nav, footer {
    width: 712px;
    margin: 0 auto;
  }
  div.content {
    width: 344px;
  }
  nav {
    background: url(cardboard-super-dark.png);
    padding: 0 48px;
    font-size: 1.2em;
    -moz-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8), -3px 0px 3px rgba(33, 26, 20, 0.8);
    -webkit-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8), -3px 0px 3px rgba(33, 26, 20, 0.8);
    box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8), -3px 0px 3px rgba(33, 26, 20, 0.8);
  }
  nav ul {
    width: auto;
    padding: 0;
    background: none;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
  }
  .sample-image {
    width: 252px;
    margin: 0 24px;
    }
  .scroll-images .image-inner { width: 160px; }
  .scrollable { width: 252px; height: 252px; }
   .item-link a span {
    display: none;
    }
   aside {
   float: left;
   } 

 /*
 .scrollable {
   width: 150px;
   height: 150px;
   }
   .item-link {
     width: 80px;
     height:80px;
     margin-bottom: 6px;
    }
   
    * /
}



/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 767px) {
  body {
    font-size: 0.89em;
  }
  header div a {
    width: auto;
}
  .banners a {
    padding-left: 34px;
}
  .banners .ua {
    height: auto;
}
  
  .banners .ua img {
    width: 252px;
}
.banners .library img {
 width: 160px;
}
  .main, h1, nav, footer {
    width: 320px;
    margin-right: 34px;
    margin-left: 34px;
    margin: 0 auto;
  }
  h1 {
    font-size: 1.2em;
    
}
h2 {
  font-size: 1.1em;
}
h3 {
  font-size: 1em;
}

  div.content {
    width: 252px;
  }
  section#search {
    width: 252px;
  }
  nav {
  margin: 0 auto;
  width: 320px;
  padding: 6px 48px;
    background: url(cardboard-super-dark.png);
    font-size: 1em;
    -moz-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
    -webkit-box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
    box-shadow: 5px 5px 5px rgba(33, 26, 20, 0.8);
  }
  nav ul {
  width:auto;
    background: none;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    margin: 0;
    padding: 0;
    
  }



 /* body {
    font-size: smaller;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: 1.2em;
  }
  .main,
  section {
    width: 252px;
    margin: 0 auto;
  }
  nav {
    font-size: inherit;
    position: relative;
    clear: both;
  }
  .sample-image {
    display: none;
  }
  .timeline {
    display: none;
  }

  section.overview div.content, .main, section, footer {
    width: auto;
  }
  nav {
    bottom: 0;
  }
  a.help {
    position: absolute:
      bottom: 0;
  }*/
}



/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

@media only screen and (min-width: 480px) and (max-width: 767px) {



}
