/*! 2-col mobile first */
/*! variables n mixins disappear in CSS file */
/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
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-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/*! Correct overflow displayed oddly in IE 9 */
svg:not(:root) {
  overflow: hidden; }

ol, ul, li {
  list-style: none; }
ul.bullets {
list-style: disc;
}

address, caption, cite, code, dfn, th, var {
  font-style: normal;
  font-weight: normal; }


/* PW edit tab */

#editpage {
	position: fixed;
	font: bold 1em/1.5em "Helvetica Neue";
	top: 36%;
	left: 0;
	padding: .5em;
	background: #900;
	color: #fff;
	display: block;
	font-weight: bold;
}
	#editpage:hover {
		background: #000;
		color: #fff;
	}

/*==============*/
#homehack a {
  /*clicking logo takes you home*/
  display: block;
  position: absolute;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 74%;
  height: 130px;
  background: transparent; }

::-moz-selection {
  color: #fff;
  background: #000; }

::selection {
  color: #fff;
  background: #000; }

img, a img {
  border: 0;
  text-decoration: none; }

img {
  max-width: 100%; }

.adbook  img {
  max-width: 640px; }


.ctr { text-align: center; }
.rt { text-align: right; }
.left { text-align: left; }

.sans { font-family: 'Roboto', Arial, sans-serif; }


.clearfix {
  content: "";
  display: table;
  clear: both; }

#text { clear: both; }

#general ul {
margin: 1.5em 2.5em;
}
#general #main ul.bullets li {
list-style: disc;
margin: .35em 0;
}
#general h2 {
font-size: 1.3;
margin: 9px 0 .7em;
}
#general p {
padding: 0;
}
  @media screen and (max-width: 679px) {
    #main img, #text img, #aside img  {
      float: none;
      display: block;
      margin: 0 auto }
#aside img {
margin: .5em auto;
}
.adbook  img {
  max-width: 100%; }


 .menu {
  display: none !important;
  }
}

a {
  text-decoration: none;
  font-weight: 700;
  color: #900; }
  a:visited {
    color: #900; }
  a:hover {
    color: #000; }
  a:active {
    color: #900;
    background: transparent;
    padding: 0 3px 1px 3px; }

#banner a {
  color: #f6e2cc; }
  #banner a:hover {
    color: #fff; }
  #banner a:active {
    color: #f6e2cc; }

.flt {
  float: left;
  margin-right: 1em; }

.flrt {
  float: right;
  margin-left: 1em; }

.ctr {
  text-align: center; }

.rnd {
	-moz-border-radius: .5em;
	-webkit-border-radius: .5em;
	-ms-border-radius: .5em;
	border-radius: .5em;
}

/* HYPHENATION */
#text p {
    -webkit-hyphens: auto;
    -webkit-hyphenate-limit-before: 3;
    -webkit-hyphenate-limit-after: 3;
    -webkit-hyphenate-limit-chars: 6 3 3;
    -webkit-hyphenate-limit-lines: 2;
    -webkit-hyphenate-limit-last: always;
    -webkit-hyphenate-limit-zone: 8%;

    -moz-hyphens: auto;
    -moz-hyphenate-limit-chars: 6 3 3;
    -moz-hyphenate-limit-lines: 2;
    -moz-hyphenate-limit-last: always;
    -moz-hyphenate-limit-zone: 8%;

    -ms-hyphens: auto;
    -ms-hyphenate-limit-chars: 6 3 3;
    -ms-hyphenate-limit-lines: 2;
    -ms-hyphenate-limit-last: always;
    -ms-hyphenate-limit-zone: 8%;

    hyphens: auto;
    hyphenate-limit-chars: 6 3 3;
    hyphenate-limit-lines: 2;
    hyphenate-limit-last: always;
    hyphenate-limit-zone: 8%;
}
/* ===================== */


.gototop, #vitalinfo p.gototop {
  clear: both;
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, arial, sans-serif;
margin: 1em auto 3em;
padding-left: 0;
  text-align: center; }

.searchterm {
background-color: #ffea59;
color: #900;
font-size: 1.175em;
}


/* 404 page button */

#four04 button#search_submit,
 #search button#search_submit,
 #interview  button#search_submit
 {
  	font:  .9em/1.8 'helvetica neue', arial, sans-serif;
  	color	: #fff;
  	background: #4f3f33;
	letter-spacing: .025em;
	margin-top: .2em;
	padding: .3px .75em 2px;
 	text-shadow: none;
 	border: 1px solid #413429;
 	-webkit-border-radius : .5em;
	-moz-border-radius : .5em;
	border-radius : .5em;
}
#four04 input[type="text"] {
background: #fff;
padding: 4px 1em 7px .5em;
width: 12em;
margin: 0 .35em 0;
border: 1px solid #e6d9cb;
-webkit-border-radius : .35em;
-moz-border-radius : .35em;
-ms-border-radius : .35em;
border-radius: .35em;
font: .9em/.5 "Courier New", Courier, mono;
}

#four04 form {
margin: 1em auto 1.5em 20%;
}
#search form {
float: right;
}
#search form {
display: block;
float: right;
margin-bottom: 1em;
}
#search #main .search li {
margin: .6em 0 .6em 3em;
padding-right: 4em;
border-bottom: 1px solid #fff2e3;
}
#search #main .search li:last-child {
border: none;
padding-bottom: 2em;
}

/* ================ */

@media screen and (max-width: 500px) {
#four04 form {
margin-left: 5%;
}
}

@media screen and (max-width: 599px) {
  .gototop a {
    color: #fff; }
}
em {
  font-style: italic; }

hr {
  margin: .5em 0 2em;
  line-height: 1px;
  border-top: 0;
  border-bottom: 2px dotted #a38267; }

.credit {
  font: .9em/1.5em 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif;
  text-indent: 0; }
#text p.episode {
width: 50%;
margin-top: 2.5em;
padding-top: .5em;
border-top: 1px solid #a09283;
font-weight: 700;
color: #1d2fa5;
}
.noindent { text-indent: 0;}

/* #vitalinfo  */ blockquote {
font-style: normal;
font-size: 1em;
border: 0;
margin: 0 3em 1em 1em;
}
/*
blockquote > p {
	font-style: italic;
}
*/
.bd {
  font-weight: 700; }

.top2em {
  margin-top: 2em; }

.smallink {
font-size: .725em;
padding-left: .35em; }

button,
a.btn,
a.btn:visited,
a.button,
a.button:visited,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  position: relative;
  top: 0;
  left: 0;
  vertical-align: middle;
  margin: 0;
  padding: 7px 15px; }

#wrap, #main, #text, #aside {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

#aside, #interview #aside {
  clear: both;
  display: block;
  width: 70%;
  margin: 1em auto; }

body {
  font: 1.23rem/1.45  'Alegreya', georgia, times, 'times new roman', serif; }

  @media screen and (max-width: 599px) {
    body {
      background: #614a38; }
   }

  @media screen and (min-width: 600px) {
    body {
      background: #f2e6d8; /* old browsers n short page content*/
      background-image: -moz-linear-gradient(top, #614a38 0%, #f2e6d8 80%, #f2e6d8 99%);
      /*FF3.6+ */
      background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #614a38), color-stop(80%, #f2e6d8), color-stop(99%, #f2e6d8));
      /*Chrome,Safari4+ */
      background-image: -webkit-linear-gradient(top, #614a38 0%, #f2e6d8 80%, #f2e6d8 99%);
      /*Chrome10+,Safari5.1+ */
      background-image: -o-linear-gradient(top, #614a38 0%, #f2e6d8 80%, #f2e6d8 99%);
      /*Opera 11.10+ */
      background-image: -ms-linear-gradient(top, #614a38 0%, #f2e6d8 80%, #f2e6d8 99%);
      /*IE10+ */
      background-image: linear-gradient(to bottom, #614a38 0%, #f2e6d8 80%, #f2e6d8 99%);
      /*W3C */
       background-repeat: no-repeat; }

.adbook  img {
  max-width: 100%; }
#one-col-text #main {
padding: 30px 24% 0 48px;
}
#one-col-text #main ul.menu {
margin-left: 0;
padding: 30px 0 0;
width: 135% !important;
}

       }


  @media screen and (min-width: 1300px) {
    body {
      font-size: 1.23rem; } }

#wrap {
  width: 95%;
  margin: 0 auto; }
  @media screen and (min-width: 680px) {
    #wrap {
      width: 42.5em; }
  #homehack a {
  height: 80px;
}
   }
   @media screen and (min-width: 768px) {
    #wrap {
      width: 46em; } }

  @media screen and (min-width: 960px) {
    #wrap {
      width: 60em; }

#general #wrap {width: 50em;}
      }
  @media screen and (min-width: 1300px) {
    #wrap {
      width: 74em; } }

/* BANNER */

#banner {
  height: 300px;
  margin: 0;
  padding: 0;
/*
      background: transparent url(/site/assets/art/methee-pageheads.svg) no-repeat 50%
30px;
background-size: 16em;
 */
background: transparent url(/site/assets/art/methee-logo-2022_trans-bgd.svg) no-repeat 50% 6px;
background-size: 16em;
}

#banner p {
  font:  1em/1.5 'Roboto', "Lucida Grande", Lucida, Arial, sans-serif;
color: #fff;
  text-align: center;
  padding: 237px 0 0;
 }

  @media screen and (min-width: 680px) {
    #banner {
      height: 250px;
/* background: transparent url(/site/assets/art/methee-pageheads.svg) no-repeat 24px 18px; */
background: transparent url(/site/assets/art/methee-logo-2022_trans-bgd.svg) no-repeat 6px 6px;
background-size: 16em;
      }

  #banner p {
  float: right;
  font-size: .84em;
  text-align: right;
  color: #fff;
  padding: 0;
  margin: 22px 18px 0 0; } }

 @media screen and (min-width: 960px) {
    #banner {
/*
background: transparent url(/site/assets/art/methee-pageheads.svg) no-repeat 24px
18px;
 */
background: transparent url(/site/assets/art/methee-logo-2022_trans-bgd.svg) no-repeat 6px 6px;
background-size: 16em;
}

  #banner p {
   font-size: 1em;
   margin: 15px 25px 0 0; } }

/*! end MQ */


#main, #text {
  padding: 1em 1.5em 0; }

#main {
  width: 100%;
  background: #f1e2cd;
  padding-bottom: 2em;
  border: 1px solid #bba690;
  -webkit-border-radius: 1em 1em 0 0;
  -moz-border-radius: 1em 1em 0 0;
  -ms-border-radius: 1em 1em 0 0;
  border-radius: 1em 1em 0 0;
  -moz-box-shadow: 1px 1px 2px rgba(97, 74, 56, 0.5);
  -webkit-box-shadow: 1px 1px 2px rgba(97, 74, 56, 0.5);
  box-shadow: 1px 1px 0.4em rgba(97, 74, 56, 0.5); }
  @media screen and (min-width: 680px) {
    #main {
      width: 98%;
/*       min-height: 50em; */
      margin: 0 auto;
      padding-bottom: 0; } }

#text {
  margin: 0;
  padding: 0; }
  @media screen and (min-width: 680px) {
    #text {
      width: 69%;
      float: left;
      padding-bottom: 2em; } }
  @media screen and (min-width: 960px) {
    #text {
      width: 58%; } }

/* VARIANTS FOR ONE-COL PAGES */


#directions #main {
  padding-top: 0; }

/* INTERVIEW LANDING PAGE */

#interview #text ul {
	margin-top: -3em;
/*	margin-bottom: 3.5em;*/
}

#interview h1.frontpage {
	float: left;
	font-size: 2.5em;
	margin: 0 0 1.4em;
}
#interview #search_form {
	float: right;
	margin: 1.3em 0 2em 0;
}

#interview #text img {
float: left;
margin-right: 1em;
margin-top: .45em;
}
#interview #text img.rt {
float: right;
margin-left: 1em;
}

/* Friends page (program book) */

.mainwrap {
max-width: 75%;
}
#four04 #main .mainwrap ul li {
  font: 1.23rem/1.45  'Alegreya', georgia, times, 'times new roman', serif;
padding-bottom: .6em;}

#four04 #main .mainwrap p {
font-size: 1.23rem;
margin: 0;
padding-right: 0;
text-align: center;
}

.mainwrap h2, .mainwrap h3 {
font-size: 1.6em;
text-align: center;
margin: 0 0 .75em;
}
.mainwrap h3 {
margin: 1em 0 .75em;
font-size: 1.333em;
padding-top: 1em;
border-top: 3px dotted #897665;
}

@media screen and (max-width:599px) {
#four04 #aside, #four04 #main {
float: none;
position: absolute;
top: 15em;
min-height: 70em;
margin-bottom: 3em;
}
#four04 #aside {
position: absolute;
top: 118em;
}
.mainwrap {
max-width: 100%;
}
#four04 #main .mainwrap ul li {
text-align: center;
}
div.multicol {
 -webkit-column-count: 1;
 -webkit-column-gap: 1em;
 -moz-column-count: 1;
 -moz-column-gap: 1em;
 column-count: 1;
 column-gap: 1em;
}
}
@media screen and (min-width: 660px) {

div.multicol {
 -webkit-column-count: 2;
 -webkit-column-gap: 1em;
 -moz-column-count: 2;
 -moz-column-gap: 1em;
 column-count: 2;
 column-gap: 1em;
 margin-bottom: 2em;
}
}
@media screen and (min-width: 1000px) {

div.multicol {
 -webkit-column-count: 3;
 -webkit-column-gap: 1em;
 -moz-column-count: 3;
 -moz-column-gap: 1em;
 column-count: 3;
 column-gap: 1em;
 margin-bottom: 2em;
}
}
/* ==================== */


/*Performers page*/

/* See MQs for column settings */

#performers #main h1 {
font: 700 1.85em/1.2   'Alegreya', georgia, times, "times new roman", serif;
text-align: center;
margin: 0 auto .6em;
color: #461100;
}
#performers  #main .xlead {
margin-top: .75em;
padding: .25em 0 0; }

#performers #main em {
font-style: normal;
font-size: 1.5em;
font-weight: bold;
color: #800;
padding-right: 1px;
}


#performers #main .multi li,  #performers #main .multi li.nourl {
/* main text - a links here affect the nav links so be careful  */
color: #000;
padding-left: 0;
font: 1em/1.25   'Alegreya', georgia, times, "times new roman", serif;
margin: 0 0 .5em 0;
}
#performers #main .multi a {
font-weight: normal;
color: #000;
text-decoration: none;
background: transparent;
padding: 0;
}
#performers #main :target {
	background: #fff5e4;
}
#performers li.nourl {
	cursor: default;
}
#performers #main a:hover {
color: #c00;
text-decoration: none;
}
#performers #main a:active {
color: #000;
text-decoration: none;
}
#performers #artistnav {
margin: 0 0 2em;
text-align:center;
font: 12px/20px  verdana, arial, helvetica, sans-serif;
}
#performers #main #artistnav a {
display: inline-block;
font: 12px/18px  verdana, arial, helvetica, sans-serif;
padding: 2px 8px;
/* background: #fff5e4; */
border-right: 1px solid #039;
}
#performers #main #artistnav a:hover {
/* background: #614a38; */
color: #fff;
text-decoration: none;
}
#A,#B,#C,#D,#E,#F,#G,#H,#I,#J,#K,#L,#M,#N,#O,#P,#Q,#R,#S,#T,#U,#V,#W,#X,#Y,#Z {
margin-top: 9px;
padding-top: 9px;
border-top: 1px solid #b3a55c;
}

/* -------------------------*/




@media screen and (max-width: 599px) {

#banner {
background: transparent url(/site/assets/art/methee-logo-2022_trans-bgd.svg) no-repeat 50% 6px;
background-size: 16em;
height: 356px;
}


#interview #text img.rt {
float: none;
margin: 1em auto;
}
}

#text img.nofloat, #interview #text img.nofloat {
	float: none;
	display: block;
	margin: 0 0 1em;
}
#interview #text h2 {
	font-size: 1.6em;
	border-top: 2px dotted #5b493a;
	padding-top: 1.18em;
	color: #54442a;
}
#interview #text.archive h2 {
font-size: 1.25em;
padding-top: .65em;
}
#interview #text ul li:first-child h2 {
	margin-top: -1em;
	border: none;
}
#interview  span.date {
	font-size: .75em;
	font-weight: 400;
	padding-left: .15em;
}
#interview #text h4 {
font-size: 1.3em;
line-height: 1.33;
color: #59482c;
	margin: 0 0 .75em;
	padding: 0;
	border: none;
}
#interview #text ul li, #interview h2 {
line-height: 1;
margin: 0 0 .75em;
}
#interview #text p {
font-size: 110%;
line-height: 1.5;
}
#interview p.more {
font: normal .925em/1.2 'Roboto', Arial, sans-serif;
text-align: right;
margin-top: -.6em;
}
#interview #text div.pagination {
font: normal .785em/1.5 'Roboto', Arial, sans-serif;
clear: both;
margin: 2em auto 0;
padding: 3.5em 0 1em;
}

/* Ryan's pagination styles for module markup */
.MarkupPagerNav {
        clear: both;
        margin: 1em 0;
}
.MarkupPagerNav li {
	display: inline;
	list-style: none;
	margin: 0;
}
.MarkupPagerNav li a,
.MarkupPagerNav li.MarkupPagerNavSeparator {
	font-size: .9em;
	display: block;
	float: left;
	padding: 7px 10px;
	color: #fff;
	background: #700;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	-ms-border-radius
	border-radius: 1em;
	margin-right: 8px;
letter-spacing: .075em;
	text-transform: uppercase;
}

.MarkupPagerNav li.MarkupPagerNavOn a,
.MarkupPagerNav li a:hover {
	color: #fff;
	background: #000;
	text-decoration: none;
}
.MarkupPagerNav li a:active {
background: #700;
}
.MarkupPagerNav li.MarkupPagerNavSeparator {
	display: inline;
	color: #777;
	background: #700;
	padding-left: 3px;
	padding-right: 3px;
}

/* ============ */

#interview p.prevnext {
	margin-top: 1.5em;
	text-align: center;
}
#interview dd img, #interview p img { /*default img floats right*/
	float: right;
	margin-left: 1em;
}
#interview dd.imgleft img, #interview p.imgleft img {	/*img will flush left*/
float: left;
	margin-right: 1em;
}
#interview #aside li.current a {
	color: #000;
}


/* ================ */

@media screen and (max-width: 680px) {

#vitalinfo #text h2, #directions #text h2 {
	color: #000;
	margin: 2em 0 .5em;
	float: none;
}
#interview #text img {
     float: none;
      display: block;
      margin: 0 auto .75em; }
}
/*! end MQ */

@media screen and (min-width: 420px) and (max-width:679px) {
div.multi {
 -webkit-column-count: 2;
 -webkit-column-gap: 2.5em;
 -moz-column-count: 2;
 -moz-column-gap: 2.5em;
 column-count: 2;
 column-gap: 2.5em;
 margin-bottom: 2em;
 }
}

@media screen and (min-width: 680px) {

div.multi {
 -webkit-column-count: 3;
 -webkit-column-gap: 2.5em;
 -moz-column-count: 3;
 -moz-column-gap: 2.5em;
 column-count: 3;
 column-gap: 2.5em;
 margin-bottom: 2em;
}

  #vitalinfo #main, #directions #main {
    padding: 1em 2em 0 2em; }

  #vitalinfo #text, #directions #text {
    width: 96%; }

  #vitalinfo h2, #directions h2 {
    float: left;
    width: 28%;
    margin-top: 1.4em;
    margin-left: -34px;
    padding: .5em .5em .5em 1em;
    font-family: 'Roboto', arial, sans-serif;
    font-size: 1.15em;
    color: #fff !important;
    letter-spacing: .05em;
    text-transform: uppercase;
    background: #614a38;
    -webkit-border-radius: 0 .75em .75em 0;
    -moz-border-radius: 0 .75em .75em 0;
    -ms-border-radius: 0 .75em .75em 0;
    border-radius: 0 .75em .75em 0;
    }
 #vitalinfo h2 + p, #directions h2 + p {
 margin-top: 2.3em;
 }
  #vitalinfo p, #vitalinfo ul, #vitalinfo blockquote, #directions p {
    padding-left: 33%; }
    }
/*! end MQ */


@media screen and (min-width: 960px) {
  #vitalinfo p, #vitalinfo h2, #vitalinfo ul,
  #directions h2, #directions p {
    font-size: 1.23rem; }

div.multi {
 -webkit-column-count: 4;
 -webkit-column-gap: 2.5em;
 -moz-column-count: 4;
 -moz-column-gap: 2.5em;
 column-count: 4;
 column-gap: 2.5em;
 margin-bottom: 2em;
 }

     }

@media screen and (min-width: 1300px) {
  #vitalinfo #text, #directions #text {
    width: 82%; } }


  @media screen and (min-width: 680px) {
    #aside, #interview #aside {
      clear: none;
      width: 27%;
      float: right;
      margin: 10% -1.5em 5em; }

   #interview #aside { margin-top: 0; }

      #aside ul {
      float: right;
      width: 100%;
      margin: 0 0 3em;
      background: #f7efe7;
    -webkit-border-radius: 1em 0 0 1em;
    -moz-border-radius: 1em 0 0 1em;
    -ms-border-radius: 1em 0 0 1em;
      border-radius: 1em 0 0 1em; }
      }
/*! end MQ */

#aside li {
font:  .9em/1.4 'Roboto', Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  letter-spacing: .015em;
}

#aside li a {
  display: block;
  font-weight: 400;
  padding: .5em .5em .5em 1em;
  color: #0d0070;
  border-bottom: 1px solid #7a6553; }

#aside li a:visited {
  color: #0d0070; }

#aside li a:hover, #aside li a.active {
  color: #fff;
  background: #482e1e; }

#aside li a:active {
  color: #0d0070;
  border-bottom: 1px solid #aaa;
  background: #e2d4c6;  }

#aside li.first.current a, #aside li.current a  {
  color: #fff;
  font-weight: 500;
  background: #482e1e;
  padding: .5em .5em;
  -webkit-border-radius: .75em 0 0 ;
  -moz-border-radius:0;
  border-radius: .75em 0 0 0; }

#aside li.current a  {
   padding-left: 1em;
  -webkit-border-radius: 0;
  -moz-border-radius:0;
  border-radius:0; }

#aside li.last.current a  {
  -webkit-border-radius: 0 0 0 .75em ;
  -moz-border-radius: 0 0 0 .75em;
  border-radius:  0 0 0 .75em; }

#aside li.last a {
  border: none;
  padding-bottom: 10px; }

#aside li.first a:hover {
  -webkit-border-top-left-radius: .75em;
  -moz-border-radius-topleft: .75em;
  border-top-left-radius: .75em; }

#aside li.last a:hover {
  -webkit-border-bottom-left-radius: .75em;
  -moz-border-radius-bottomleft: .75em;
  border-bottom-left-radius: .75em; }

#interview #aside ul {
  margin: 1em auto;
  background-color: #f7efe7;
/*   border-radius: 0; */
  padding-bottom: 0; }

#interview #aside li {
  font-family:   'Roboto', Arial, sans-serif;
  font-size: .925em;
  text-align: center;
  padding: 0; }
  #interview #aside li:first-child {
    padding-top: 4px; }
  #interview #aside li:last-child {
    padding-bottom: 4px; }

#interview #aside li a {
  display: block;
  padding: .5em .5em .5em 1.5em;
  font-weight: 700;
  text-align: left;
  color: #900;
  border-bottom: 1px solid #c4b8a7; }
  #interview #aside li a:hover {
    background: transparent;
    color: #000; }

#interview #aside li:last-child a {
    border: 0; }

#interview #aside .bd li a {
  font-weight: 700; }
}
/*! end MQ */

@media screen and (min-width: 680px) {

  #interview #aside {
    float: right;
    background: rgba(255, 255, 255, 0.3);
    padding: 0 1em .5em 1.5em;
    -webkit-border-radius: .75em 0 0 .75em;
    -moz-border-radius: .75em 0 0 .75em;
    -ms-border-radius: .75em 0 0 .75em;
    border-radius: .75em 0 0 .75em;
    box-shadow: 0px 2px 0.145em rgba(70, 56, 44, 0.5); }

  #interview #aside ul {
    background-color: transparent; }

  #interview #aside li a {
    text-align: left; }

  #interview #aside li.last a {
    border: none; }
    }
/*! end MQ */

  @media screen and (max-width: 680px) {
#interview #aside li a { text-align: center; }
#aside ul {
background: #f7efe7;
margin: 2em auto; }
}
  @media screen and (max-width:400px) {
  #comments {
	height: auto;
	 }
}

/*! end MQ */

body#friend #main {
max-width: 760px !important;
}

dl {
  margin: 1em 0;
  }

dt {
  font-size: 110%;
  font-weight: 700;
  margin-top: 2em; }

dd {
  font-size: 110%;
  margin-top: .5em;
  margin-left: 0; }

#friend dl {
margin-bottom: 2em;
}
dl.twocol dt {
margin-top: .5em;
clear:left;
float: left;
text-align: right;
width: 44%;
}
dl.twocol dd {
float: left;
padding-left: 1em;
}
.clr { clear:both; }

#interview input[type="text"], #comments input[type="text"] {
  padding: 4px 0;
  width: 14em;
  margin-right: .5em;
  font-family: "Courier New", Courier, mono; }

#comments textarea {
  width: 20.5em;
  height: auto;
  font-family: "Courier New", Courier, mono; }

#comments label {
  padding-bottom: 2px; }

 #comments button {
  padding: .5em 1em;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  text-shadow: none;
  background: #eee; }

#comments li, #comments p {
  margin-left: 1em;
  width: 95%; }

/*comments styling*/
#comments {
 height: auto;
 background: #fff9ee;
  margin-top: 2em;
  margin-bottom: 1.5em;
  padding: 1em;
  -webkit-border-radius: 0.65em;
  -moz-border-radius: 0.65em;
  -ms-border-radius: 0.65em;
  border-radius: 0.65em; }

#interview #text #comments ul {
  margin-top: 0; }

#comments label {
  padding-right: .5em;
  font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
  font-size: .85em; }

#comments input[type="text"] {
  width: 18em;
  font-family: "Courier New", Courier, mono; }

#CommentForm h3 {
  border-top: none;
  font-size: 1.2em;
  margin: 0 0 1.5em 0;
  color: #090860; }

#CommentForm .success {
  background: #d5c8b6; }

#interview #text #comments ul li {
  margin-top: 0; }

.CommentList p {
  font-family: "Lucida Grande", Lucida, Verdana, sans-serif; }

#CommentForm p {
  margin-left: 1em; }

.CommentText p {
  font-size: .94em;
  color: #390005; }

p.CommentHeader {
  font-size: .825em;
  color: #1c1d7d;
  border-bottom: 1px dotted #390005; }

p.CommentForm_submit {
  text-align: center; }

h1, h2, h3, h4, h5, h6 {
  font: 700 110%/1.2  'Alegreya', Georgia, "Times New Roman", Times, serif;
  color: #6d5745; }

h1 {
  font-size: 2em;
  font-weight: 800;
  line-height: 1.1;
  color: #6d5745;
  margin: .7em 0 .5em 0; }

h2 {
font-size: 1.35em;
margin:  0 0 .35em;
}

  @media screen and (min-width: 680px) {
    h1 {
      font-size: 2.3em;
      line-height: 1.15;
      margin-top: 0;
       }
    #interview h1 > p.byline {
    	margin-top: -1em;
    	 }
	p.drop::first-letter {
		float: left;
		display: inline;
		width: auto;
		margin: 0 0 0 -5px;
		padding: 0 1px 0 0;
		font: 700 5.55em/.72em  'Alegreya', Helvetica, Arial, Verdana, sans-serif;	 /*  Firefox places the baseline diff than other browsers */
		color: #cab6a4;
		}
       }
  @media screen and (min-width: 35em) {
  #friend dl {
margin: 1em 0 2em;
}
dl.twocol dt {
margin-top: .5em;
clear:left;
float: left;
width: 30%;
}
dl.twocol dd {
float: left;
padding-left: 1em;
}
 }

   @media screen and (min-width: 960px) {
   h1 {
      font-size: 2.45em; }
    #comments {
 height: auto;
}

#friend p {
max-width: 85%;
}

       }
/*! end MQ */


p.byline {
  font-size: 1.13em;
  color: #6d5745;
  margin-top: 0;
 }

#text > p.byline { margin: 0 0 2em; }
 }

p, ul, ol, li, dl {
  font: 1.23rem/1.45  'Alegreya', georgia, times, 'times new roman', serif;
  color: #390005;
  margin: 0 0 1em 0; }

#main p, #text p {
 margin: 0 0 1em 0
}

 #history #text  p.byline + p::first-letter, span.dropcap {
  float: left;
  display: inline;
  width: auto;
  margin: 0 0 0 -5px;
  padding: 0 1px 0 0;
  font:  7.33em/.72em  'Alegreya', georgia, times, 'times new roman', serif;
  color: #cab6a4; }

#main ul.menu {
  position: static;
  display: block;
  margin: 3em auto;
  background: transparent;
  padding: 0;
  border: none; }

.menu li {
  display: block;
  text-align: center;
  width: 75%;
  float: none;
  margin: 0 auto;
  background: #e2d4c6;
  /* border-bottom: 1px solid #f9e9d7; */ }

.menu li a {
font:  1em/1.4 'Roboto', "Lucida Grande", Lucida, Arial, Helvetica, Verdana, sans-serif;
  display: block;
  padding: .4em 0;
  border-bottom: 1px solid #f1e2cd;
  color: #0d0070;
  text-shadow: none; }

.menu li.first {
  margin: 0 auto; }

.menu li a:hover {
  background: #310004;
  color: #fff; }

.menu li.current > a,
.menu li.current > a:hover,
.menu li.current.hover > a {
  background: #310004;
  color: #fff; }

/**********  ACCORDION for popdown nav **********/

div.accordion {
  width: 70%;
  height: auto;
  color: #fff;
  font-weight: 700;
  margin: .5em auto;
  padding: 3px 0;
  overflow: auto;
  -webkit-border-radius: .5em;
  -moz-border-radius: .5em;
  border-radius: .5em; }

.accordion-control {
  color: #fff;
  display: block;
  font-weight: 700; }

.accordion-panel {
  display: none;
width: 65.2%;
  position: absolute;
  z-index: 1000;
  padding-bottom: .25em;
  background: #fff;
  -webkit-border-radius: .5em;
  -moz-border-radius: .5em;
  border-radius: .5em;
  -webkit-border-top-left-radius: 0;
  -webkit-border-top-right-radius: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0; }


button.accordion-control {
	font: 400 1em/1.44 'helvetica neue', arial, sans-serif;
width: 100%;
margin: 0 auto;
	background: #900;
text-shadow: none;
letter-spacing: .105em;
-webkit-border-radius : .5em;
-moz-border-radius : .5em;
border-radius : .5em;
border: none;
padding: .225em 0;
}
button:hover {
	border: none;
background: #c00;
}
button:active {
	border: none;
background: #900;
}
button:focus {
	border: none;
}

.accordion-panel ul {
  margin: 0;
  padding: 0; }

.accordion-panel ul li:first-child {
  padding: 2px 0 0 0; }

.accordion-panel ul li:last-child {
  border: 0; }

.accordion li {
  padding: .3em 0;
  margin: 0;
  font: .875em/2 'helvetica neue', arial, sans-serif;
  text-align: center;
  list-style-type: none;
  border-bottom: 1px solid #6d5745; }

#banner .accordion li a {
  font-weight: normal;
  color: #000;
  display: block; }

#banner .accordion li a:hover {
font-weight: bold;
  color: #c00;
  background: #fff; }

#banner .accordion li a:active {
  color: #000; }


@media screen and (min-width: 680px) {
  .accordion-control, .accordion-panel {
    display: none; }
}

  /*The navbar picks up a lot of code from kickstarter menus. Clean it out or harmonize it*/
  .menu {
    background: transparent;
    border: none;
    position: absolute;
    /* bottom: 1px; */ }

  #main ul.menu {
    border: none;
    width: 100%;
    background: transparent;
    clear: both;
    margin: 2em 0 0; }

ul.menu li {
    display: inline-block;
    width: auto;
    float: left;
	margin: 0 .25em;
    background: #f6f3ef;
    border: 1px solid #ccbeae;
    border-width: 1px 1px 0;
    -webkit-border-radius: .75em .75em 0 0;
    -moz-border-radius: .75em .75em 0 0;
    -ms-border-radius: .75em .75em 0 0;
    border-radius: .75em .75em 0 0; }

  ul.menu li a {
    font: 400 0.85em/1.3 'Roboto', arial, sans-serif;
    padding: .35em 1.33em .2em;
    color: #4f3832;
    text-shadow: none;
    text-align: center;
    -webkit-border-radius: .75em .75em 0 0;
    -moz-border-radius: .75em .75em 0 0;
    -ms-border-radius: .75em .75em 0 0;
    border-radius: .75em .75em 0 0; }

  .menu li a:hover,
  .menu li.hover > a {
    /*highlight top link when popped down*/
    background: #310004;
    color: #fff; }

  .menu li a:active {
    background: #f6f3ef;
    color: #4f3832; }

  .menu li a:active,
  .menu li.hover > a:active {
    color: #000; }

  .menu li.current > a,
  .menu li.current > a:hover,
  .menu li.current.hover > a {
    background: #310004;
    color: #fff;
    -webkit-border-radius: .75em .75em 0 0;
    -moz-border-radius: .75em .75em 0 0;
    -ms-border-radius: .75em .75em 0 0;
    border-radius: .75em .75em 0 0; }

  .menu li.first {
    margin-left: 2%;
    margin-right: .25em;
    }

 #aside li.last a {
   border: 0;
   }


@media screen and (min-width: 680px) and (max-width: 959px) {
   ul.menu li {
    	margin: 0 .125em;  }
	ul.menu li a {
    padding: .35em 1em .2em;
	}
	#comments {
height: auto;
}
}

@media screen and (min-width: 680px) {

  #interview #text div.pagination {
	font: normal .825em/1.5 Arial, sans-serif;
	width: 80%;
}
  .xld {
    margin-top: 2.75em; }

/* stupid hacks for 404 page bec I cant see whats screwing up the navbar */

#four04 h1 {
font-size: 2em;
font-weight: 400;
font-style: italic;
margin: .5em 0 1em;
color: #0f1eaf;
}

#four04  #main p {
padding-right: 20%;
}
#four04  #main p.menuhack {
padding-bottom: 13em;
}
#four04 #aside {
      width: 20%;
      margin-right: .7em;
      margin-top: 1em;
}
#four04 #aside li:last-child a {
border-bottom: 0;
}

@media screen and (min-width: 960px) {
  #directions ul.menu,
  #vitalinfo ul.menu
   {
    bottom: 27px; }

  .menu li a {
    font-weight: 400;
    font-size: 1em; }

 .menu li.first {
    margin-left: 5%; }

   #aside, #interview #aside {
      width: 30%; }
      }


/*# sourceMappingURL=twoColMobileFirst2015.css.map */
