@charset "UTF-8";

@font-face {
    font-family: 'quicksandlight';
    src: url('../font/quicksand-light-webfont.eot');
    src: url('../font/quicksand-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/quicksand-light-webfont.woff') format('woff'),
         url('../font/quicksand-light-webfont.ttf') format('truetype'),
         url('../font/quicksand-light-webfont.svg#quicksandlight') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'quicksandbold';
    src: url('../font/quicksand-bold-webfont.eot');
    src: url('../font/quicksand-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/quicksand-bold-webfont.woff') format('woff'),
         url('../font/quicksand-bold-webfont.ttf') format('truetype'),
         url('../font/quicksand-bold-webfont.svg#quicksandbold') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'quicksandregular';
    src: url('../font/quicksand-regular-webfont.eot');
    src: url('../font/quicksand-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/quicksand-regular-webfont.woff') format('woff'),
         url('../font/quicksand-regular-webfont.ttf') format('truetype'),
         url('../font/quicksand-regular-webfont.svg#quicksandregular') format('svg');
    font-weight: normal;
    font-style: normal;}

img, object, embed, video {
	max-width: 100%;
	border:none;}
	
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;}

body {
	background: black;
	color: white;
	margin: 0 auto;
	font-family:"quicksandregular", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: .8rem;
	font-weight: lighter;
	text-emphasis: none;
	line-height: 1.3rem;}

p {
	margin-top: 0px;}

em {
	color: rgb(0,166,81);
	font-style:normal;}
	
h1 {
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem;
	margin-top: 0px;
	font-style: normal;
	font-variant: normal;
	font-weight: 100;}
	
h2 {
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem;
	margin-bottom: 5px;
	font-style: normal;
	font-variant: normal;
	font-weight: 100;}
	
a {
	color: rgb(255,242,0);
	text-decoration: none;}

a:hover {
	text-decoration: underline;}
	
::-moz-selection {
       background-color: red;
       color: white;}

::selection {
       background-color: red;
       color: white;}

#topRule {
	background: rgb(0,166,81);
	height: 5px;
	width: 100%;
	margin-bottom: 70px;}
	
#bottomRule {
	background: rgb(0,166,81);
	width: 100%;
	margin-top: 100px;
	margin-bottom: 0px;
	clear: both;}

#logo {
	background-image: url('../assets/URB-logo.png');
	background-size: 187px;
	background-repeat: no-repeat;}
	
#logoBottom {
	background-image: url('../assets/URB-logo.png');
	background-size: 79px;
	background-repeat: no-repeat;}

.large {
	width: 187px;
	height: 212px;
	margin: 0 auto;
	margin-bottom: 50px;}
	
.small {
	width: 79px;
	height: 89px;
	margin: 0 auto;
	margin-bottom: 40px;
	margin-top: 20px;}
	
#mainLinks {
	clear: both;
	margin: 0 1%;
	padding-bottom: 6px;
	border-bottom: #333 1px solid;
	width: 98%;}

#mainLine {
	border-bottom: 1px solid;
	border-bottom-color: #666;
	float: right;}
	
ul {
	margin: 0px;
	padding: 0px;}
	
ul.mainMenu {
	margin: 0px;
	padding: 0px;
	text-align:center;}

li.menu {
	display: inline;
	height: 14px;
	margin: 0px 8px;}
	
li.music {
	list-style-type: none;}

a.band {
	height: 14px;
	width: 51px;
	background-image: url('../assets/link-bandSM.png');
	text-indent: -9999px;
	display: inline-block;}
	
a.dates {
	height: 14px;
	width: 31px;
	background-image: url('../assets/link-datesSM.png');
	text-indent: -9999px;
	display: inline-block;}
	
a.multi {
	height: 14px;
	width: 63px;
	background-image: url('../assets/link-multiSM.png');
	text-indent: -9999px;
	display: inline-block;}
	
a.booking {
	height: 14px;
	width: 44px;
	background-image: url('../assets/link-bookingSM.png');
	text-indent: -9999px;
	display: inline-block;}
	
a#bandWhite {
	background-position: 0px 0px;}
a#bandYellow, a#bandWhite:hover, a#bandWhite:active, a#bandGray:hover, a#bandGray:active {
	background-position: 0px -19px;}
a#bandGray {
	background-position: 0px -38px;}

a#datesWhite {
	background-position: 0px 0px;}
a#datesYellow, a#datesWhite:hover, a#datesWhite:active, a#datesGray:hover, a#datesGray:active {
	background-position: 0px -19px;}
a#datesGray {
	background-position: 0px -38px;}

a#multiWhite {
	background-position: 0px 0px;}
a#multiYellow, a#multiWhite:hover, a#multiWhite:active, a#multiGray:hover, a#multiGray:active {
	background-position: 0px -19px;}
a#multiGray {
	background-position: 0px -38px;}

a#bookingWhite {
	background-position: 0px 0px;}
a#bookingYellow, a#bookingWhite:hover, a#bookingWhite:active, a#bookingGray:hover, a#bookingGray:active {
	background-position: 0px -19px;}
a#bookingGray {
	background-position: 0px -38px;}

#socialLinks {
	margin: 40px auto 100px auto;
	width: 171px;}

li.icons {
	display: inline;
	margin: 0px 7px;}

a.social {
	height: 43px;
	width: 43px;
	background-image: url('../assets/social.png');
	text-indent: -9999px;
	display: inline-block;}
	
a#twitter {
	background-position: 0px 0px;}
a#facebook {
	background-position: -57px 0px;}
a#itunes {
	background-position: -114px 0px;}
a#twitter:hover, a#twitter:active {
	background-position: 0px -50px;}
a#facebook:hover, a#facebook:active {
	background-position: -57px -50px;}
a#itunes:hover, a#itunes:active {
	background-position: -114px -50px;}
	
.content {
	margin: 70px 1% 0px 1%;
	padding-bottom: 120px;
	width: 98%;
	height: inherit;
	clear:both;}
	
.contentMusic {
	margin: 0 1% 0 1%;
	display: table;
	padding-top: 60px;
	width: 98%;
	height: inherit;}
	
.contentMusicRight {
	margin: 0px 1% 0px 1%;
	display: table;
	padding-top: 60px;
	height: inherit;
	width: 98%;}
	
#columnLeft {
	margin: 0 1% 0 1%;
	width: 98%;}
	
#columnRight {
	margin: 0 1% 0 1%;
	width: 98%;}
	
#island-waves_pop_up { 
    background-color: rgb(40,40,40);
	color: white;
    display: none; 
    padding: 25px 15px 15px 15px;
    width: 576px;
    min-height: 180px;}
	
.wavesPhoto {
	float: left;
	margin: 0px 10px 5px 0px;}

#photos_pop_up { 
    background-color: rgb(40,40,40);
	color: white;
    display: none; 
    padding: 25px 15px 15px 15px;
    width: 530px;
    min-height: 180px;}

.photoThumbs {
	float: left;
	margin: 10px;
	width: 150px;
	height: 130px;}

#booking-rates_pop_up { 
    background-color: rgb(40,40,40);
	color: white;
    display: none; 
    padding: 25px 15px 15px 15px;
    width: 540px;
    min-height: 180px;}
	
figure {
	margin: 0px;
	padding: 0px;}

figcaption {
	font-size: 0.7rem;
	color: rgb(0,166,81);
	padding: 0px;
	margin: 0px 0px 0px 0px;}
	
.b-close {
    cursor:pointer;
	color: rgb(0,166,81);
    position:absolute;
    right:10px;
    top:5px;
	display: block;
	z-index: 100;
	font-size:2rem;}
	
.b-close:hover {
	text-decoration:none;}
	
table.rates {
	column-width: 30%;
	width: 500px;
	line-height: 1rem;
	column-gap: 25px;
	text-align: center;
	margin-bottom: 30px;}
	
th {
	margin-bottom: 12px;
	font-weight: bold;}
	
tr.even {
	background-color: #efefef;}
	
tr:hover {
	background-color: rgb(255,242,0);
	color: black;}
	
.humanMvmnt {
	background-image: url('../assets/2017_logo_refresh.svg');
	background-size: 200px;
	width: 200px;
	height:auto;
	margin-right: 40px;
	background-repeat: no-repeat;
	float: right;}
	
.footerRight {
	margin-left: 1%;
	padding-top: 12px;
	padding-bottom: 10px;
	text-align:center;
	color: black;
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem; }

.footerLeft {
	margin-left: 1%;
	padding-top: 12px;
	color: black;
	text-align:center;
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem; }
	
a.top {
	color: black;}

a.top:hover {
	color: rgb(255,242,0);
	text-decoration: none;}

a.footer {
	color: black;}

a.footer:hover {
	color: rgb(255,242,0);
	text-decoration: none;}
	
/* Prevents slides from flashing */
#slides {
 	display:none;}

#slides .slidesjs-navigation {
  margin-top:5px;}

a.slidesjs-next,
a.slidesjs-previous,
a.slidesjs-play,
a.slidesjs-stop {
  background-image: url(../assets/btns-next-prev.png);
  background-repeat: no-repeat;
  display:block;
  width:12px;
  height:18px;
  overflow: hidden;
  text-indent: -9999px;
  float: left;
  margin-right:5px;}

a.slidesjs-next {
  margin-right:10px;
  background-position: -12px 0;}

a:hover.slidesjs-next {
  background-position: -12px -18px;}

a.slidesjs-previous {
  background-position: 0 0;}

a:hover.slidesjs-previous {
  background-position: 0 -18px;}

a.slidesjs-play {
  width:15px;
  background-position: -25px 0;}

a:hover.slidesjs-play {
  background-position: -25px -18px;}

a.slidesjs-stop {
  width:18px;
  background-position: -41px 0;}

a:hover.slidesjs-stop {
  background-position: -41px -18px;}

.slidesjs-pagination {
  margin: 7px 0 0;
  float: right;
  list-style: none;}

.slidesjs-pagination li {
  float: left;
  margin: 0 1px;}

.slidesjs-pagination li a {
  display: block;
  width: 13px;
  height: 0;
  padding-top: 13px;
  background-image: url(../assets/pagination.png);
  background-position: 0 0;
  float: left;
  overflow: hidden;}

.slidesjs-pagination li a.active,
.slidesjs-pagination li a:hover.active {
  background-position: 0 -13px}

.slidesjs-pagination li a:hover {
  background-position: 0 -26px}

#slides a:link,
#slides a:visited {
  color: #333}

#slides a:hover,
#slides a:active {
  color: #9e2020}

.navbar {
  overflow: hidden}
  
ol { padding: 0px; margin: 0px; list-style: decimal-leading-zero inside; color: #ccc; width: 80%; border-top: none; font-size: 0.9em; }
      ol li { position: relative; margin: 0px; padding: 9px 2px 5px; }
      ol li a { display: inline; text-indent: -3.3ex; padding: 0px 0px 0px 20px; }
      li.playing { color: rgb(0,166,81); }
      li.playing a { color: rgb(0,166,81); }
	  li.playing a:visited { color: white; }
      li.playing:before { content: '♪'; width: 14px; height: 14px; padding: 3px; line-height: 14px; margin: 0px; position: absolute; top: 9px; color: rgb(0,166,81); font-size: 13px; }
      
      

      @media screen and (max-device-width: 480px) {
        #wrapper { position: relative; left: -3%; }
        #shortcuts { display: none; }
      }

/* Tablet Layout: 487px to 849px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 641px) {

.content {
	margin: 70px 2% 0px 2%;
	display: table;
	padding-bottom: 120px;
	width: 96%;
	height: inherit;
	clear:both;}
	
.contentMusic {
	margin: 0 1% 0 2%;
	display: table;
	padding-top: 60px;
	width: 57%;
	height: inherit;
	float:left;}
	
.contentMusicRight {
	margin: 0px 2% 0px 1%;
	display: table;
	padding-top: 60px;
	height: inherit;
	width: 37%;
	float: right;}
	
#columnLeft {
	margin: 0 1% 0 2%;
	width: 47%;
	float: left;}
	
#columnRight {
	margin: 0 2% 0 1%;
	width: 47%;
	float: right;}
	
.footerRight {
	margin-right: 40px;
	padding-top: 12px;
	float: right;
	color: black;
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem; }

.footerLeft {
	margin-left: 40px;
	padding-top: 12px;
	float: left;
	color: black;
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem; }
#bottomRule {
	background: rgb(0,166,81);
	height: 45px;
	width: 100%;
	margin-top: 100px;
	margin-bottom: 0px;
	clear: both;}
	
#mainLinks {
	clear: both;
	margin: 0 auto;
	padding-bottom: 6px;
	border-bottom: #333 1px solid;
	width: 484px;}
	
li.menu {
	display: inline;
	height: 21px;
	margin: 0px 25px;}
	
a.band {
	height: 21px;
	width: 76px;
	background-image: url('../assets/link-band.png');
	text-indent: -9999px;
	display: inline-block;}
	
a.dates {
	height: 21px;
	width: 47px;
	background-image: url('../assets/link-dates.png');
	text-indent: -9999px;
	display: inline-block;}
	
a.multi {
	height: 21px;
	width: 95px;
	background-image: url('../assets/link-multi.png');
	text-indent: -9999px;
	display: inline-block;}
	
a.booking {
	height: 21px;
	width: 66px;
	background-image: url('../assets/link-booking.png');
	text-indent: -9999px;
	display: inline-block;}
	
a#bandWhite {
	background-position: 0px 0px;}
a#bandYellow, a#bandWhite:hover, a#bandWhite:active, a#bandGray:hover, a#bandGray:active {
	background-position: 0px -28px;}
a#bandGray {
	background-position: 0px -57px;}

a#datesWhite {
	background-position: 0px 0px;}
a#datesYellow, a#datesWhite:hover, a#datesWhite:active, a#datesGray:hover, a#datesGray:active {
	background-position: 0px -28px;}
a#datesGray {
	background-position: 0px -57px;}

a#multiWhite {
	background-position: 0px 0px;}
a#multiYellow, a#multiWhite:hover, a#multiWhite:active, a#multiGray:hover, a#multiGray:active {
	background-position: 0px -28px;}
a#multiGray {
	background-position: 0px -57px;}

a#bookingWhite {
	background-position: 0px 0px;}
a#bookingYellow, a#bookingWhite:hover, a#bookingWhite:active, a#bookingGray:hover, a#bookingGray:active {
	background-position: 0px -28px;}
a#bookingGray {
	background-position: 0px -57px;}
	
ol { padding: 0px; margin: 0px; list-style: decimal-leading-zero inside; color: #ccc; width: 400px; border-top: none; font-size: 0.9em; }
      ol li { position: relative; margin: 0px; padding: 9px 2px 5px; }
      ol li a { display: inline; text-indent: -3.3ex; padding: 0px 0px 0px 20px; }
      li.playing { color: rgb(0,166,81); }
      li.playing a { color: rgb(0,166,81); }
	  li.playing a:visited { color: white; }
      li.playing:before { content: '♪'; width: 14px; height: 14px; padding: 3px; line-height: 14px; margin: 0px; position: absolute; top: 9px; color: rgb(0,166,81); font-size: 13px; }
	  
#socialLinks {
	margin: 146px auto 271px auto;
	width: 171px;}
	
.large {
	width: 187px;
	height: 212px;
	margin: 0 auto;
	margin-bottom: 107px;}
	
.small {
	width: 79px;
	height: 89px;
	margin: 0 auto;
	margin-bottom: 100px;
	margin-top: 50px;}
	
#topRule {
	background: rgb(0,166,81);
	height: 5px;
	width: 100%;
	margin-bottom: 140px;}

}

/* Desktop Layout: 850px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 1050px) {
	
.content {
	margin: 70px 4% 0px 4%;
	display: table;
	padding-bottom: 120px;
	width: 92%;
	height: inherit;
	clear:both;}
	
.contentMusic {
	margin: 0 2% 0 4%;
	display: table;
	padding-top: 60px;
	width: 54%;
	height: inherit;
	float:left;}
	
.contentMusicRight {
	margin: 0px 4% 0px 2%;
	display: table;
	padding-top: 60px;
	height: inherit;
	width: 34%;
	float: right;}
	
#columnLeft {
	margin: 0 2% 0 4%;
	width: 44%;
	float: left;}
	
#columnRight {
	margin: 0 4% 0 2%;
	width: 44%;
	float: right;}
.footerRight {
	margin-right: 40px;
	padding-top: 12px;
	float: right;
	color: black;
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem; }

.footerLeft {
	margin-left: 40px;
	padding-top: 12px;
	float: left;
	color: black;
	font-family: "quicksandbold", "TW Cen MT", "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1rem; }
}