/* FOUR POINT OH JANUARY 2025 */
div.music .image-column.last {padding-right: 10px;}
.shows-top {margin: 50px 0 50px;}
.shows-background.upcoming {background-image: url('/music/images/graphic-upcoming-show.gif');background-size: 100%; padding: 50px 10px 130px; text-align: center; background-repeat: no-repeat;}
.shows-background.upcoming a {text-decoration: underline;}
.shows-holder {margin: 0 auto;}
.shows-bottom {margin: 20px 0 0;}
.shows-background.past {background-image: url('/music/images/graphic-past-shows.gif');background-size: 57%; padding: 150px 10px 150px; background-repeat: no-repeat;background-attachment: fixed; background-position: center;}
.shows-background.past h3 {text-align: center;}
.shows-background.past p {padding-left: 60px; text-align: left; }
.shows-background.upcoming {text-transform: uppercase;}
.streaming-section {text-align: center; margin-top: 80px;}
.streaming-section.top {margin-top: 0px;}
.streaming-section h3 {text-transform: uppercase;}
.streaming-icon {padding:0 20px;}
.streaming-icon.no-grid {padding: 0 130px 20px;}
.streaming-icon-group {margin-top: 0;}
.albums .cell {padding-right: 10px;}
.poetry-holder {margin: 50px 0 0; font-size: 14px; color: #b0b0b0; border-right: 3px solid #b0b0b0; }
.poem-holder {border-bottom: 1px solid #b0b0b0; padding-bottom: 20px;}
.poem-title {margin: 40px 0 15px; text-transform: uppercase}
.poster-img {margin-top:10px;}
.highlight-title {z-index: 800; position: absolute; font-size: 40px; font-weight: 600; color: #fff; padding: 0 25px; top: 0;}
a:hover .highlight-title {color: #1779ba; border-bottom: 4px solid;}
.home-highlight.first-banner {padding-top:32%; margin-top:10px;}
.loading-window.highlight {padding-top:32%;}
a:hover .banner.home-highlight {background-image: url('images/banner-fade-bluehover.jpg');}
.highlight-holder {margin: 50px 0 150px;}
.page-tracker {position: fixed; bottom: 0; left: 0; padding: 4px 40px 6px; background: #2e2e2e; z-index: 900; color: #979797;}
.page-tracker a {color: #979797;}
.page-tracker a:hover {color: #1779ba; text-decoration: underline;}
.shows-background.past .cv-date {width: 7%;}
.shows-background.past .cv-info {width: 75%;}

/* THREE POINT OH MAY 2024 */
img.studio-sale.below {width:100%;}
.video-title.extra.below {margin-top: 60px;}
img.studio-sale {width: 75%; margin: 20px auto 0; display: block;}
a.sale-button {background: #1779ba; color: #fff; text-align: center; padding-top: 10px; font-size: 12px; text-transform: uppercase; display: block; width: 225px; margin: 20px auto; height: 40px;}
.video-title.extra {margin-bottom: 0px;}
.video-title {margin-bottom: 30px;}
a:hover.sale-button {color: #515151;}
a:active.sale-button {color: #dddddd;}
/* TWO POINT OH JUNE 2020 */
a .image-title {color: #1468a0; text-decoration: underline; display: none; position: absolute; top: 0; width: 100%; background-color: white; text-align: center; font-size: 14px; padding: 3px 0 5px;}
.image-holder:hover .image-title, .second-banner:hover .image-title, .image-title.activate {display: block;}
.image-holder {cursor: pointer;}
.loading-window {display:none; position: absolute; top: 0; left: 0; width: 100%; background-image: url('images/loading-white.gif'); background-repeat: no-repeat; background-size: 30%; background-position-x: center; background-position-y: center;}
.loading-window.activate {display:block;}
.banner .loading-window {background-size: 15%;}
.banner .image-title {width: 50%; right:0; }
.return-home-block {width: 150px; height: 40px; display: block; margin: 10px 0;}
.return-home-block.homepage {width: 180px;}
.got-it-block {cursor:pointer; width: 150px; margin: 20px auto; height:40px; }
.got-it-block:hover {color: #1468a0;}
.work-title, .video-title {margin-bottom: 10px; background-color: #222; font-weight: 500; letter-spacing: .8px; text-transform: uppercase;}
.work-title {font-size: 16px;  padding: 3px 0 5px 15px;}
.video-title {font-size:12px; text-align: center;  padding: 3px 0 5px;}
.work-info {font-size:14px; border: 1px solid #8a8a8a; color: #b0b0b0; padding: 10px 20px;}
.work-holder {margin-bottom: 20px; width:100%; position: relative;}
.video-holder {margin-bottom: 20px;}
.gif-holder {width: 75%; margin: 0 auto;}
.work-column {padding-right: 10px;}
.work-column.last-cell {padding-right:0;}
.work-paragraph {color: #b0b0b0; font-size:14px; margin-top:20px;}
a.return-home-block.activate, a.mailing-list-block.activate, .got-it-block.activate {color: #1468a0; text-decoration: underline; background-color: #fff; -webkit-transition: all 700ms ease-in; -ms-transition: all 700ms ease-in; transition: all 700ms ease-in;}
.wifi-blanket {display:none; position: fixed; width: 100%; height: 100%; background-color:#00b7ff; opacity: 0.3; top:0; left:0;}
.wifi-pop {display:none; font-size: 14px; text-align: center; padding: 90px 50px 50px; position: fixed; width: 50%; max-width: 530px; background-color: #000; border: 1px solid #8a8a8a; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; top: 20%; margin: 0 auto; left: 0; right: 0;}
.wifi-pop .main-text {text-transform: uppercase; font-size: 20px;}
.wifi-x-out {width: 30px; height: 30px; position: absolute; top:15px; left:15px; cursor: pointer; background-image: url('/images/x-icon.png'); background-repeat: no-repeat; background-size: cover; }
.wifi-pop hr {margin: 10px auto; background-color: #8a8a8a; height: 1px; border: 0;}
.wifi-pop .remember {font-style: italic; }
.hello-logo.activate {color: #1468a0; -webkit-transition: all 700ms ease-in; -ms-transition: all 700ms ease-in; transition: all 700ms ease-in;}
.mobile-show {display: none;}

/* NEW WEB BUILD MAY 2020 */
#page-container {max-width: 1040px; margin:0 auto;}
.header {position: relative; height: 70px; width:100%; max-width: 1040px;}
.hello-logo, .new-menu, .main-blocks, .menu-item {display:inline-block;}
.hello-logo {color: #fff; width: 160px; font-size: 40px; font-weight: bold; padding-left: 50px; background-image: url('images/moving-ast.gif'); background-repeat: no-repeat; background-position: top 8px left 9px; background-size:  24.3%; }
.social-block, .mailing-list-block {width: 150px; height: 40px; display: block;}
.top-block {background-image: url('images/top-arrow.png'); background-repeat: no-repeat; background-size: 60%; background-position: center; height: 40px; width: 80px; background-color: #515151; color: #fff; margin: 10px 10px 0 0;}
.copyright-info {font-size: 11px; padding: 20px 5px 0 5px; border: 1px solid #8a8a8a; height: 40px; margin: 10px 10px 0 0; color: #b0b0b0;}
.top-block, .copyright-info {display: block; float: left;}
.social-block {background: #fff;}
.mailing-list-block, .return-home-block, .got-it-block {background: #515151; color: #fff; text-align: center; padding-top: 10px; font-size: 12px; text-transform: uppercase;}
.mailing-list-block {margin-left: 10px;}
.main-blocks, .social-block, .mailing-list-block {float: right;}
.main-blocks {width: 310px; padding-top:8px;}
.custom-footer .main-blocks {padding: 10px 0;}
.social-block {text-align: center;}
.social-item {width:25%; display: inline-block; padding: 8px;}
.new-menu {font-size: 14px; width: 50%; height: 40px; background-image: url('images/menu-fade.jpg'); background-position: bottom; background-repeat: no-repeat; background-size: 100%;}
.menu-item {height: 40px; padding: 8px 20px 0 15px; border-right: 5px solid #121212;}
.menu-item.last {border-right: 0;}
.menu-item a {color: #fff;}

.more-section {border: 1px solid #fff; font-size:13px; line-height: 15px; padding:20px 15px 7px 15px;}
.hello-logo.more {margin-top:20px; width:300px; background-position: top 4px left 5px; background-size: 9.6%; font-size: 28px; padding-left: 37px;}
.hello-logo.more.long {width: 450px; background-size: 6.7%;}
.hello-logo.more.invert {background-image: url('images/moving-ast-invert.gif');}
.more-section ul {list-style-type: none; margin-left:0;}
.cv-date {width: 10%; display: inline-block; vertical-align: top;}
.cv-info {display: inline-block; width:85%;}
.cv-title, #mc_embed_signup label {letter-spacing: 1.5px; font-size: 14px; margin-bottom: 4px;}
#mc_embed_signup label {color:#fff; text-transform: uppercase; margin-top: -7px;}
#mc_embed_signup {margin-top: 7px;}
.more-column.right-padding {padding-right: 10px;}
.more-main-column {padding: 0 10px;}

.banner {position: relative; background-image: url('images/banner-fade.jpg');background-repeat: repeat-y; background-size: 110%; background-position: left bottom;}
.banner img {width:100%; position: absolute;}
.second-banner, .third-banner {margin-top: 85px;}
.first-banner, .third-banner {padding-top: 20.5%;}
.first-banner img {top:0;}
.second-banner {padding-top: 58%;}
.third-banner img, .second-banner img  {top: 10px;}
.image-holder {margin-bottom: 10px; width:100%; position: relative;}
.image-holder img, .work-holder img {position: absolute; top:0; left:0; width:100%;}
.image-column {padding-right:10px;}
.image-column.last {padding-right:0;}
.forMobile {display:none;}
.section-title {margin: 10px 0 10px; background-color: #222; padding: 3px 0 5px 15px; font-size: 12px; font-weight: 500; letter-spacing: .8px; text-transform: uppercase;}

/* Add a black background color to the top navigation */
.topnav {background-color: #202020;}

/* Style the links inside the navigation bar */
.topnav a {float: left;display: block;color: #f2f2f2;text-align: center;padding: 24px 36px;text-decoration: none;font-size: 17px;}

/* Change the color of links on hover */
.topnav a:hover {background-color: #000;color: white;}
.topnav a:hover.logo {}
.topnav a:hover.item2 {height:87px;}
.topnav a:hover.item3 {height:87px;}
.topnav a:hover.item4 {height:87px;}
.topnav a:hover.item5 {height:87px;}
.topnav a:hover.icon {background-color: transparent;}

/* Add an active class to highlight the current page */
.active {}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {display: none;}

@media screen and (max-width: 1040px) {
.shows-background.past .cv-date {width: 8%;}
.shows-background.past {background-size: 70%;}
#page-container {padding: 0 15px;}
.new-menu {width:45%;}
.menu-item {padding: 8px 15px 0 12px;}
.shows-background.past p {padding-left: 40px;}
}

@media screen and (max-width: 950px) {
.shows-background.past .cv-date {width: 10%;}
.hide-medium {display: none;}
.menu-item.second-last {border-right: 0;}
.new-menu {width:40%;}
}
@media screen and (max-width: 880px) {
.new-menu {width:40%;}
.social-block, .mailing-list-block {width: 130px;}
}
@media screen and (max-width: 820px) {
.shows-background.past {background-size: 80%;}

.left-padding-mobile {padding-left: 20px;}
.second-banner {padding-top: 54.5%;}
#page-container {padding: 0;}
.menu-item {padding: 8px 20px 0 15px;}
.new-menu {display:block; width: 70%; margin-top: -12px;}
.header {height: 99px;}
.social-block, .mailing-list-block {width: 150px;}
}
@media screen and (max-width: 740px) {
.shows-background.past {background-size: 90%;}
.wifi-pop {width:70%;}
.second-banner {padding-top: 55%;}
.custom-footer .mailing-list-block {display:none;}
.custom-footer .main-blocks {width: 160px;}
}
@media screen and (max-width:650px) {
.page-tracker {display: none;}
.highlight-title {font-size:34px;}
.home-highlight.first-banner {padding-top:48%;}
.loading-window.highlight {padding-top:48%;}
.second-banner {padding-top: 55.5%;}
.forMobile {display: block;}
.forDesktop {display: none;}
.first-banner, .third-banner {padding-top: 33.2%;}
.hide-small {display:none;}
.social-block, .mailing-list-block {width: 130px;}
.main-blocks {width: 270px; margin-right:0;}
.custom-footer .main-blocks {width: 130px;}
.copyright-info {width: 180px; text-align: center; line-height: 13px; padding-top: 8px;}
}
@media screen and (max-width:639px) {
.shows-background.upcoming {padding: 50px 10px 60px;}
.shows-background.past {padding: 20px 10px 60px;}
.shows-background.past {background-size: 100%;}
.streaming-icon, .streaming-icon.no-grid {padding:0 100px;}
.streaming-icon-group {margin-top:40px;}

img.studio-sale {width: 100%;}
.mobile-show {display: none;}
.work-column.last-cell {padding-left: 20px;}
.work-column, .work-column.last-cell {padding-right: 20px;}
.work-column.last-cell {margin-top:20px;}
.banner .loading-window {background-size: 30%;}
.banner .image-title {width: 100%;}
.more-column.right-padding {padding-right: 0px;}
.last-mobile {padding-right: 0;}
div.music .image-column.last, div.music .image-column.last-mobile {padding-right: 10px;}
}

/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 600px) {
  .topnav {padding-left:0; height:auto;}
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {float: right;display: block; width: 100px;}
  .topnav a:hover.item2, .topnav a:hover.item3, .topnav a:hover.item4, .topnav a:hover.item5 {height:74px;}
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
  .topnav.responsive {position: fixed;}
  .topnav.responsive a.icon {position: absolute;right: 0;top: 0;}
  .topnav.responsive a {float: none;display: block;text-align: left;}
}

@media screen and (max-width: 470px) {
.shows-background.past .cv-date {width: 15%;}
.highlight-title {font-size:28px;}
.streaming-icon, .streaming-icon.no-grid {padding:0 80px;}
.shows-background.past {background-size: 110%;}
.wifi-pop {width: 85%; padding-top:70px;}
.wifi-pop .main-text {font-size:17px;}
.copyright-info {clear:both;}
.second-banner {padding-top: 56.5%;}
.main-blocks {width: 120px;}
.mailing-list-block {display:none;}
.new-menu {width: 90%;}
}