/* base variables */

:root {
  --color-bg1: snow;
  --color-bg2: crimson;
  --color-bg3: white;
  --color-text1:#333;
  --color-text2: black;
  --color-text3: firebrick;
  --color-highlight:crimson;
  --body-bg: ;
  --font-body: serif;
  --font-heading: 'DM Serif Display', sans-serif;
  --font-link: 'DM Serif Display', sans-serif;
}

/* base styles */

/* latin-ext */
@font-face {
  font-family: 'DM Serif Display';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/dmserifdisplay/v15/-nFnOHM81r4j6k0gjAW3mujVU2B2G_5x0vrx52jJ3Q.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Serif Display';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/dmserifdisplay/v15/-nFnOHM81r4j6k0gjAW3mujVU2B2G_Bx0vrx52g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Shrikhand';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/shrikhand/v15/a8IbNovtLWfR7T7bMJwrDYKR8Ttcte1q.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Shrikhand';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/shrikhand/v15/a8IbNovtLWfR7T7bMJwrA4KR8TtctQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 200 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/oswald/v53/TK3iWkUHHAIjg752Fz8Gl-1PK62t.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 200 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/oswald/v53/TK3iWkUHHAIjg752GT8Gl-1PKw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Texturina';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/texturina/v28/c4mi1nxpEtL3pXiAulR5k6d41qC3WXv8.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Texturina';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/texturina/v28/c4mi1nxpEtL3pXiAulR5nad41qC3WQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body { background: var(--color-bg1); background-attachment: fixed; background-repeat: no-repeat; background-image:var(--body-bg); background-size: cover; color:var(--color-text1); font-family:var(--font-body); font-size:20px; line-height: 1.5; padding:30px }

h1, h2, h3, h4, h5, h6 { color:var(--color-text3); font-family:var(--font-heading); }
h1 { font-size:28px; }
h2 { font-size:24px; }
h3 { font-size: 20px; }
h4,h5,h6 { font-size:16px }
small { font-style: italic; }
a { border-bottom:2px solid transparent; color:var(--color-highlight);  font-family:var(--font-link); transition:all .12s; }
  a:hover { border-bottom:0 solid; }

.btn { background:var(--color-highlight); border-radius:6px; color:var(--color-text2); display:inline-block; padding:.75em; text-align:center; text-decoration:none; text-transform:uppercase; }
	.btn.primary {}
	.btn.secondary { background: none; border:1px solid var(--color-bg2); }

#header { align-items:center; display:flex; flex-flow:row wrap; justify-content:flex-end; padding:0 0 2em; }
	#header .logo { border:0; display:inline-block; flex:3; margin:.25em; width:60px; }
    #header .logo svg { fill:var(--color-text2); height: 4em; width:auto; }
	#header .btn { flex:1; margin:.25em; }

#footer { background: var(--color-bg3); margin:2em 0 0; padding:2em; }
  #footer section { align-items:center; display:flex; flex-flow:row nowrap; justify-content:center; }
  #footer a { color:var(--color-highlight); font-weight: bold; text-decoration:none; }
	#footer article { text-align: center; }
  #footer img { display:inline-block; height:auto; margin:0 0 1em; width:100px; }
	#footer nav { margin:0 0 2em; width: 20% }
    #footer nav ul { list-style:none; margin:0; padding:0; }
    #footer nav li { margin:0 0 .5em; padding:0; }
	#footer footer { text-align:center; }
  #footer .affiliate, #footer .social { margin:0 0 2em; }
    #footer .affiliate p, #footer .social p { margin:0; }
  #footer .affiliate { width:20%; }
  #footer .social { width:60%; }
    #footer .social img { width:60px; }
  #footer .copyright { padding:2em 0 0; }

main { margin:0 auto 4em; max-width:40em; }

.handbill { color:var(--color-text3); text-align:center; }
	.handbill h1 { text-align: center; text-transform: uppercase; }
    .nextshow { display: none; }
	.handbill ul, .handbill ol { margin:0; padding:0; list-style: none; }
	.handbill ul { align-items:flex-start; display:flex; flex-flow:row nowrap; justify-content:center;  }
		.handbill ul li { display:inline-block; margin:1em; }
  .showname { display:block; height:auto; margin:3em auto; width:100%; max-width:500px; }
  .address { font-size:24px; text-transform: uppercase; }
  .showtimes { font-size:32px; text-transform: uppercase; }
    .showtimes span { font-size:24px; display: block; text-transform: lowercase; }
  .tickets { font-size:24px; margin:0 auto; padding:2em 0; }
    .tickets::before, .tickets::after { border-top:1px solid var(--color-text1); content:' '; display:block; height:2em; margin:0 auto; width:50%; }
    .tickets::after {border-bottom:1px solid var(--color-text1); content:' ';  border-top:0; }
    .tickets .prices li { background:url('/images/shows/2024/star.png') right center no-repeat; background-size: contain; margin:0 0 0 1em; padding:0 2em 0 0; }
      .tickets .prices li:last-child { background:none; padding: 0; }
	.blurb { background:var(--color-bg2); color:var(--color-bg1); border:9px var(--color-bg1) double; margin:2em auto; padding:1em 2em; text-align:left; max-width:40em; }

.comingsoon { margin:4em auto; text-align: center; }
  .comingsoon .btn { margin:1em 0; }

/* screen sizes */

@media (max-width:600px) {
  #header .btn { flex:0; margin:.1em; padding:.5em; }
  #footer { padding:2em 0; }
    #footer section { display: block; }
    #footer nav, #footer .affiliate, #footer .social { width:auto; }
  .handbill ul { display:block; }
    .handbill ul li { margin:1em 0; }
  .tickets .prices { background:url('/images/shows/2024/star.png') left center no-repeat; background-image:url('/images/shows/2024/star.png'),url('/images/shows/2024/star.png'); background-position: left center, right center; background-repeat: no-repeat; background-size:60px; padding:0 60px; }
    .tickets .prices li { display: block; background:none; margin:0 0 0.5em; padding:0 }
  .blurb { padding:.25em 1em; }
}


/* show styles */

.anything-goes-2024 {
  --color-bg1: black;
  --color-bg2: #b89a5b;
  --color-text1:#cfb787;
  --color-text2: white;
  --color-highlight:#dc146c;
  --body-bg: url(/images/shows/2024/corner-top.png), url(/images/shows/2024/corner-right.png), url(/images/shows/2024/corner-bottom.png), url(/images/shows/2024/corner-left.png);
}
/* body { background-position:top 10px left 10px, top 10px right 10px, bottom 10px right 10px, bottom 10px left 10px; background-repeat: no-repeat; background-size:65px; } */

.kinky-boots-2025 {
  --color-bg1: white;
  --color-bg2: #821517;
  --color-text1:#821517;
  --color-text2: #DF1E27;
  --color-text3: #821517;
  --color-highlight:#DF1E27;
  --body-bg: ;
  --font-body: 'Oswald', sans-serif;
  --font-heading: 'Oswald', sans-serif;
  --font-link: 'Oswald', sans-serif;
}
.kinky-boots-2025 a { border-bottom:1px solid; text-decoration: none; }
  .kinky-boots-2025 a:hover { border-bottom:2px solid; }
/*.kinky-boots-2025 li, .kinky-boots-2025 .comingsoon, .kinky-boots-2025 .handbill { text-shadow: 0 1px 2px black; }
.kinky-boots-2025 .comingsoon { color: var(--color-text2); }
/*.kinky-boots-2025 .handbill { background-image: url(/images/shows/2025/kinky-boots.gold.png); background-clip: text; }*/
.kinky-boots-2025 .tickets::before  { border-top: 2px solid; }
.kinky-boots-2025 .tickets::after { border-bottom: 2px solid; }
.kinky-boots-2025 #footer { background: #eee; margin-left: -30px; margin-right: -30px; }
.kinky-boots-2025 .showtimes { font-size: 36px; }
.kinky-boots-2025 .showtimes, .btn { font-weight:bold; }
  .kinky-boots-2025 .showtimes span { font-weight:normal; text-transform: uppercase; }
.kinky-boots-2025 .tickets .prices li { background: none; }
.kinky-boots-2025 .btn.primary { color: white; }

.beauty-beast-2026 {
  --color-bg1: #000d4a;
  --color-bg2: #821517;
  --color-bg3: transparent;
  --color-text1:#bfa35f;
  --color-text2: #bfa35f;
  --color-text3: #bfa35f;
  --color-highlight:#fff;
  --body-bg: url(/images/shows/2026/top-left.png), url(/images/shows/2026/top-right.png);
  --font-body: 'Texturina', sans-serif;
  --font-heading: 'Texturina', sans-serif;
  --font-link: 'Texturina', sans-serif;
  background-position:top 10px left 10px, top 10px right 10px, bottom 10px right 10px, bottom 10px left 10px; 
  background-repeat: no-repeat; 
  background-size:200px;
}
.beauty-beast-2026 .showname {}
.beauty-beast-2026 .showtimes { font-size: 36px; }
  .beauty-beast-2026 .showtimes, .btn { font-weight:bold; }
    .beauty-beast-2026 .showtimes span { font-weight:normal; text-transform: uppercase; }
/*.beauty-beast-2026 a { border-bottom:1px solid; text-decoration: none; }
  .beauty-beast-2026 a:hover { border-bottom:2px solid; }
.beauty-beast-2026 #footer { background: #eee; margin-left: -30px; margin-right: -30px; }
.beauty-beast-2026 .tickets .prices li { background: none; }
.beauty-beast-2026 .btn.primary { color: white; }*/
