body {
font:normal 100% "franklin-gothic-urw";
margin: 0 auto;
padding: 0;
font-size:16px;
background-color:rgba(150, 150, 150, 1);
height:auto;
margin-bottom:3em;
}
/* a wrapper div and contents div */
div.main {
width:100%;
background-color:white;
margin-top:0em;
padding:0;
padding-bottom:15em;
line-height:1.32em;
font-weight:300;
margin-bottom:.3em;
letter-spacing:.022em;
}
div.content {
width:82%;
clear:both;
margin: 0 auto;
padding-top:1em;
background-color:white;
}


/* basics and reset */
a {
color:#000000;
text-decoration:none;
}
.content a {
color:#2D33E8;
}
.content.projecttiles a, .linklabel a {
color:#000000;
}
ul, ol {
list-style:none;
margin-left:0;
padding-left:0;
}
ul {
padding:0;
}
img {
width:100%;
}
img {
width:100%;
max-width:100%;
height:auto;
}

/* typography */
.bodytext.noindent {
margin-top:.8em;
}
.italic {
font-style:italic;
}
.bold {
font-weight:500;
}
.smallcaps {
font-size:.9em;
}
.link {
color:#2D33E8;
font-weight:500;
}
p {
margin:0;
width:100%;
text-indent:1em;
font-size:1.45em;
line-height:1.39em;
letter-spacing:.68px;
}

.TUBitalic {
font-family: franklin-gothic-urw,sans-serif;
font-weight: 200;
font-style: italic;
}

/* left alignment */
p.noindent {
text-indent:0em;
}
.afterfloat {
clear:both;
}
.timeline.afterfloat {
margin-top:5em;
}


/* plain bullets text list */
.list {
font-size:1.45em;
list-style:disc;
margin-top:-.1em;
margin-bottom:0em;
font-weight:200;
}


/* headline for top-level pages, appears as first item below navbar. does not appear on project pages. doea appear on 'merch' page */
.slogan {
width:100%;
margin-bottom:1em;
margin-top:0em;
text-indent:0em;
font-size:2.1em;
font-weight:100;
line-height:1.2em;
}


/* navbar (includes logo) */


ul.navlist {
width:82%;
margin: 0 auto;
margin-top:1em;
}
div.navlinks {
float:right;
margin-top:1.9em;
}
#navlink1 {
margin-left:0;
}
ul.navlist li {
display:inline-block;
font-size:1.02em;
margin-left:4em;
padding:0;
margin-top:0em;
}
.youarehere {
font-weight: 600;
}


/* GL mark and logo text */
.svgmepic {
width:.9em;
float:left;
margin-top:.5em;
}
.svgmepic img {
width:100%;
}
#gletzdesign {
float:right;
font-weight:500;
font-size:.5em;
letter-spacing:.25px;
color:#5b5b5b;
margin-top:1.3em;
}
ul.navlist li.navlogo {
float:left;
width:4.095em;
font-size:2.62em;
padding:0;
margin-left:0em;
margin-top:0;
margin-bottom:.5em;
vertical-align:middle;
}

/* inline ULs (horizontal lists) "secondary" does not occur in any of the 'top-level' pages*/
.secondary.header {
margin-top:4em;
}
.secondary.header + p {
text-indent:1em;
clear:both;
}
.secondary.header li:first-child {
height:1.25em;
min-height:1.25em;
font-size:1.02em;
font-weight:500;
margin-bottom:.4em;
padding:.25em;
padding-bottom:.35em;
padding-left:.5em;
border-radius: 4.5px;
}

/* timeline is the main horizontal list style on background.html, life.html, and about.html. there are five timelines: .timelineOlderWork, .timelineNewerWork, .timelineHealth, .timelineArt, .timelineAbout */

.timeline li {
font-size:.87em;
display:inline-block;
height:10.5em;
margin-right:.025em;
margin-bottom:.25em;
line-height:1.3em;
width:16%;  
border-radius: 5px;
padding-left:.5em;
overflow:hidden;
}
.timeline li:first-child {
color:white;
border-radius: 7px;
float:left;
margin-right:.5em;
}


.timelineHealth li:first-child, .timelineArt li:first-child, .timelineOlderWork li:first-child, .timelineNewerWork li:first-child  {
padding:.5em;
height:9.5em;
width:7%;
}
.timelineOlderWork li:first-child {
background-image: linear-gradient(-45deg, rgba(67, 97, 135, 0.7), rgba(67, 97, 135, 1));
}
.timelineArt li:first-child {
background-image: linear-gradient(-45deg, rgba(128, 118, 172, 0.7), rgba(128, 118, 172, 1));
}
.timelineHealth li:first-child {
background-image: linear-gradient(-45deg, rgba(92, 183, 99, 0.7), rgba(92, 183, 99, 1));
}
.timelineNewerWork li:first-child {
background-image: linear-gradient(-45deg, rgba(128, 118, 172, 0.7), rgba(128, 118, 172, 1));
}


.timelineOlderWork li {
background-image: linear-gradient(-45deg, rgba(68, 151, 255, 0.7), rgba(68, 151, 255, 1));
}
.timelineNewerWork li {
background-image: linear-gradient(-45deg, rgba(255, 210, 0, 0.7), rgba(255, 210, 0, 1));
}
.timelineArt li {
background-image: linear-gradient(-45deg, rgba(162, 142, 255, 0.7), rgba(162, 142, 255, 1));
margin-top:0em;
}






.timeline.casestudy li:first-child {
margin-right:1em;
}
.timelineAbout li p:first-child {
text-indent:0em;
}
/* 'outcome' for most pages */
.timeline.last li:first-child {
background-color:rgba(255, 158, 0, 1);
}

/* text labels for horizontal 'timeline' list items */
div.projtextdiv {
width:53%;
margin-left:-.5em;
overflow:hidden;
color:white;
height:10em;
padding:.4em;
padding-left:.7em;
background: rgba(0, 0, 0, .4)
}


/* this is the javascript lightbox  */
.fancybox-caption {
text-align:left;
padding-left:15%;
padding-right:10%;
font-size:2.9em;
}




#hiatus {
float:left;
border:none;
background:none;
}

#hiatus li {
display:inline-block;
background:none;
vertical-align:middle;
}
#hiatus li span {
display:inline-block;
background:none;
font-weight:500;
font-size:1.31em;
color:#2C9400;
line-height:1.2em;
padding:0;
}