#theater-schedule {
	float:left;
	position:relative;
	padding:0 0 0 0;
	margin:0;
	width:100%;
	min-height:1132px;
}
#theater-schedule .ad-banner {
	position:relative;
	padding:5px 0;
	margin:0 0 20px;
	width:100%;
	height:60px;
	background:#c1272d;
	text-align:center;
}
#theater-schedule .ad-banner a {
	font:16px/18px Droid Serif;
	color:#fff;
	font-weight:bold;
	border-bottom:1px dotted #fff;
	text-shadow:0 -1px 0 rgba(0,0,0,.5);
}
#theater-schedule .ad-banner h4.huge {
	font:27px/34px Droid Serif;
	color:#fff;
	text-align:center;
	font-weight:bold;
	text-shadow:0 -1px 0 rgba(0,0,0,.5);
}
#theater-schedule .spacer {
	float:left;
	width:675px;
	height:20px;
}
#theater-schedule .concerts {
	position:relative;
	padding:0 0 0 0;
	margin:0 0 0 0;
	width:100%;
}
#theater-schedule .concerts .headline {
	position:relative;
	height:36px;
	font-size:15px;
	text-align:center;
	font-weight:bold;
}
#theater-schedule .concerts .event-listing {
	position:relative;
	padding:0 0 0 0;
	margin:0 0 0 0;
	width:100%;
}
#theater-schedule .concerts .event-listing li {
	margin:0 0 0 0;
	height:32px;
	font-family:Helvetica;
	font-size:14px;
	color:#282C35;
	line-height:32px;
	list-style:none;
	background:#f2f2f2;
	border-top:1px solid #b3b3b3;
  overflow:hidden;
}
#theater-schedule .concerts .event-listing li:hover {
	background:#ccc;
}
#theater-schedule .concerts .event-listing li .date {
	width:140px;
	text-align:right;
	font-weight:bold;
	text-transform:uppercase;
	position:relative;
	float:left;
}
#theater-schedule .concerts .event-listing .minidivi {
	position:relative;
	float:left;
	width:16px;
	text-align:center;
}
#theater-schedule .concerts .event-listing .title {
	text-align:left;
}	
#theater-schedule .musicals {
	float:right;
	position:relative;
	padding:0 0 0 0;
	margin:0 0 0 0;
	width:234px;
}
#theater-schedule .musicals .headline {
	position:relative;
	height:36px;
	font-size:15px;
	text-align:center;
	font-weight:bold;
}
#theater-schedule .musicals .event-listing li {
	margin:0 0 0 0;
	height:302px;
	font-family:Helvetica;
	font-size:14px;
	color:#282C35;
	line-height:32px;
	list-style:none;
	background:#f2f2f2;
	border-top:1px solid #b3b3b3;
}
#theater-schedule .musicals .event-listing li:hover {
	background:#ccc;
}
#theater-schedule .musicals .event-listing .thumbnail {
	position:relative;
	margin:18px 0 3px 18px;
	width:202px;
	height:202px;
	-moz-box-shadow:0 0 5px 0 #333;
	-webkit-box-shadow:0 0 5px 0 #333;
	box-shadow:0 0 5px 0 #333;
}
#theater-schedule .musicals .event-listing .date {
	position:relative;
	float:left;
	width:234px;
	height:21px;
	text-align:center;
	font-weight:bold;
	text-transform:uppercase;
	display:inline-block;
}
#theater-schedule .event-listing .date img {
    margin: 0 10px 0;
}
#theater-schedule .musicals .event-listing .title {
	margin:0;
	width:234px;
	text-align:center;
	font-weight:bold;
	line-height:18px;
}

.artists { 
	display: table; 
	width: 100%;
}

.artist {
	display:table-cell;
	height:100px;
	width:25%;
	text-align:center;
	padding:20px;
}
.artists .name {
	font-family: source-sans-pro;
	font-size: 18px;
	font-weight: 300;
	margin-bottom:15px;
	display:block;
}
.artist img {
	width:100%;
	max-width:250px;
    display: block;
}

.artist .showdate {
	background-color: #A0ADAD;
    display: block;
    font: italic 12px/18px Helvetica;
    text-shadow: none;
}
.event-location {
    font-size: 18px;
    font-weight: 100;
    display: block;
}
.section-titles h4 {
    font-size: 48px;
    margin:20px 0 0 0; 
    line-height:20px;
 }
 #form {
    margin-top:10px;
    text-align:center;
    display: block;
    margin: 0 auto; 
    max-width: 875px; 
    height: 75px; 
    text-align: center;
  }
  #format {
      display: inline-block;
  }
  #sortorder {
    display: block;
    float: left;
    position: relative;
    right: 25px;
  }
  .ui-buttonset .ui-button {
      margin-left: 0;
      margin-right: -0.3em;
    padding: 0 2px;
  }
  
  ui-state-active {
  }
  .stick {
      position:fixed;
      top:0;
  }
  #sorter-placeholder {
	  height: 0;
}
  #sorter {
    background-repeat: repeat;
    background-position: 100% 100% 90deg, #adbedb, #e6e6e6 repeat scroll 0 0 rgba(0, 0, 0, 0);
    background-color: rgba(0,0,0,1.00);
    background-attachment: scroll;
    border-bottom: 1px solid #b3b3b3;
    border-top: 1px solid #b3b3b3;
    /* height: 95px; */
    width: 100%;
    min-width: 320px;
    position: relative;
    top: 0;
    background-image: -webkit-linear-gradient(90deg,rgba(173,190,219,1.00) 0%,rgba(230,230,230,1.00) 100%);
    background-image: linear-gradient(0deg,rgba(173,190,219,1.00) 0%,rgba(230,230,230,1.00) 100%);
  }
  .sorter-attrib {
    display: block; 
    float: left; 
    position: relative; 
    width: 25%;
  }
  .sorter-attrib span {
    font-family: "source-sans-pro"; 
    letter-spacing: 0.9px; 
    font-size: 18px; 
    display: block; 
    height: 28px; 
    line-height: 28px;  
  }
  #startdate { width: 80px; display:inline-block; }
  #enddate { width: 80px; display:inline-block; }


  .divider{
    background: linear-gradient(90deg, #f2f2f2, #e6e6e6) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-bottom: 1px solid #b3b3b3;
    border-top: 1px solid #b3b3b3;
    font: bold 27px/45px Droid Serif;
    height: fit-content;
    /*margin-top: -38px;*/
    /*min-width: 875px;*/
    position: relative;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
    text-transform: uppercase;
    width: 100%;
  }
  .button {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none;
    border-color: #ccc #aaa #aaa #ccc;
    border-image: none;
    border-radius: 3px;
    border-right: 1px solid #aaa;
    border-style: solid;
    border-width: 1px;
    color: #444;
    cursor: pointer;
    display: inline-block;
    font-family: "HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 11px;
    font-weight: bold;
    line-height: normal;
    padding: 0;
    text-decoration: none;
    text-shadow: 0 1px rgba(255, 255, 255, 0.75);
  }
  .button:hover,
  button:hover,
  input[type="submit"]:hover,
  input[type="reset"]:hover,
  input[type="button"]:hover {
    color: #222;
    background: none;
    border: 1px solid #888;
    border-top: 1px solid #aaa;
    border-left: 1px solid #aaa;
  }
  
  /* buttons */
  
  .display-buttons {
      border: 1px solid #e6e6e6;
      border-radius: 3px;
      box-sizing: border-box;
      float: left;
      font-size: 0;
      height: 32px;
      overflow: hidden;
    width: 100px;
    margin: 0 25%;
  }
  .display-buttons .sprite-display {
    background-image: url(../../../assets/images/theatre-sprite-icons.png);
    display: inline-block;
    height: 32px;
    width: 32px;
  }
  .display-buttons .sprite-display.display-date {
      background-position: 95px 0;
  }
  .display-buttons .sprite-display.display-date:hover, .display-buttons .sprite-display.display-date.active {
      background-position: 95px -28px;
  }
  .display-buttons .sprite-display.display-name {
      background-position: -128px 0px;
  }
  .display-buttons .sprite-display.display-name:hover, .display-buttons .sprite-display.display-name.active {
      background-position: -128px -28px;
  }
  .display-buttons .sprite-display.display-enhanced {
      background-position: -64px 0;
  }
  .display-buttons .sprite-display.display-enhanced:hover, .display-buttons .sprite-display.display-enhanced.active {
      background-position: -64px -28px;
  }
  .display-buttons .sprite-display.display-detail {
      background-position: -90px -30px;
  }
  .display-buttons .sprite-display.display-detail:hover, .display-buttons .sprite-display.display-detail.active {
      background-position: -90px 0;
  }
  .display-buttons .sprite-display.display-calendar {
      background-position: -96px 0;
  }
  .display-buttons .sprite-display.display-calendar:hover, .display-buttons .sprite-display.display-calendar.active {
      background-position: -96px -28px;
  }
  .display-buttons .sprite-display + .sprite-display {
      border-left: 1px solid #e6e6e6;
  }
  .display-buttons .sprite-display:hover {
      opacity: 0.8;
  }
    
  #resultsContainer {
	    min-width:768px;
  }
  .selectricWrapper {
    cursor: pointer;
    display: inline-block;
    margin: 0 0 0 0;
    position: relative;
    width: 150px;
  }

  @media only screen and (min-width: 480px) and (max-width: 767px) {
      .section-titles h4 { font-size: 36px; }
      #sortorder { display: none; }
      #sort-name { display:none; }
      #startdate { width: 75px; display:inline-block; }
      #enddate { width: 75px; display:inline-block; }
      .sorter-attrib { width:50%; }
      #resultsContainer { width: 100%; min-width:320px; }
      #theater-schedule .event-listing .date img { display:none; }
      .sorter-attrib span { display: inline; }
      .sorter-attrib { padding-top:20px; }
      .selectricWrapper { width:120px; }
      #sort-eventtype span { position: relative; top: 0px; }
      #sorter .selectbox { -webkit-appearance: none; padding: 4px 8px; }
      .event-info-title { width: 90%; }
  }
	@media only screen and (max-width: 479px) {
      .section-titles h4 { font-size: 36px; }
      #sort-eventtype { }
      /*#sort-dates { display:none; }*/   
      #sorter { height: 145px; }
      #sortorder { display: none; }
      #sort-name { display:none; }
      .sorter-attrib { width:100%; min-width:320px; padding-top:20px; }
      #resultsContainer { width: 100%; min-width:320px; }
      #theater-schedule .event-listing .date img { display:none; }
      .sorter-attrib span { display: inline; }
      #sort-eventtype span { position: relative; top: 0px; }
      .event-info-title { width: 90%; }
  }
  
 
 /* /////////////////  Skeleton Mods  ////////////////////////////////// */
  
/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .container                                  { width: 100%; }
		    .container .columns,
        .container .column                          { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns                     { width: 100%; }
    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .container                                  { width: 100%; }
        .container .columns,
        .container .column                          { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns                     { width: 100%; }
    }


/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }


/* NEW STYLES FOR NEW SCHEDULE LAYOUT */

            * { box-sizing: border-box; }
            body{background-image: none; background-color: white; }
            p{margin: 0 0 10px; line-height: 145%;}
            #sorter {
                color: #fff;
                background-repeat: repeat;
                background-position: none;
                background-color: #005387;
                background-attachment: scroll;
                border-bottom: 1px solid #b3b3b3;
                border-top: 1px solid #b3b3b3;
                /* height: 95px; */
                width: 100%;
                min-width: 320px;
                position: relative;
                top: 0;
                background-image: linear-gradient(none);
                background-image: none;
            }
            .container{ max-width: 1440px; }
            .event-item {
                height: unset;
                margin: 20px auto;
                position: relative;
            }
            .artists{background-color: #F2F2F2;}
            .artists .event-item {
                margin: 10px auto;
                position: relative;
                float: left;
                width: 100%;
            }
            @media (min-width: 768px){
                .event-item {
                    height: 410px;
                }
                .artists .event-item {
                    margin: 20px auto;
                    width: 33%;
					height: fit-content;
                }
            }
            @media (min-width: 1240px){
                .artists .event-item {
                    width: 25%;
                }
            }

            .event-box {
                background: #fff;
                border: 1px solid #CECECE;
                box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
                width: 90%;
                margin: 0 auto;
                transition: all .4s;
            }
            @media (min-width: 768px){
                .event-box {
                    background: #fff;
                    border: 1px solid #CECECE;
                    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
                    width: 232px;
                    margin: 0 auto;
                    transition: all .4s;
                }
            }

            .event-thumb {
                height: 110px;
                width: 110px;
                text-align: center;
                position: relative;
                overflow: hidden;
                float: left;
                margin: 0 5px 0 0;
                z-index: 5;
            }
            .event-thumb img {
                width: 110px;
                zoom: 1;
                transition: all .7s;
            }
            @media (min-width: 768px){
                .event-box {
                    background: #fff;
                    border: 1px solid #CECECE;
                    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
                    width: 232px;
                    margin: 0 auto;
                    transition: all .4s;
                }
                .event-thumb {
                    height: 230px;
                    width: 230px;
                    text-align: center;
                    margin: 0 auto;
                    position: relative;
                    overflow: hidden;
                    float: none;
                }
                .event-thumb img {
                    width: 230px;
                    zoom: 1;
                    transition: all .7s;
                }
            }

            /* Blue Gate Music Hall Colors */
            .music-hall a, .music-hall .event-info-title, .music-hall {
                color: #49AAF9; }
            .event-item.music-hall .event-ticketlink, .event-item.music-hall .event-info-location-color {
                background-color: #49AAF9 !important; }
            .event-item.music-hall .event-info-title a {
                color: #49AAF9; }
            .event-item.music-hall .event-ticketlink, .event-item.music-hall .event-info-location-color {
                background-color: #49AAF9 !important; }
            
            /* Blue Gate PAC Colors */
            .bgpac a, .bgpac .event-info-title, .bgpac {
                color: #7A0000; }
            .event-item.bgpac .event-ticketlink, .event-item.bgpac .event-info-location-color {
                background-color: #7A0000 !important; }
            .event-item.bgpac .event-info-title a {
                color: #7A0000; }
            .event-item.bgpac .event-ticketlink, .event-item.bgpac .event-info-location-color {
                background-color: #7A0000 !important; }

              /* Tours Colors */
            .amish-tours a, .amish-tours .event-info-title, .amish-tours {
                color: #00B988; }
            .event-item.amish-tours .event-ticketlink, .event-item.amish-tours .event-info-location-color {
                background-color: #00B988 !important; }
            .event-item.amish-tours .event-info-title a {
                color: #00B988; }
            .event-item.amish-tours .event-ticketlink, .event-item.amish-tours .event-info-location-color {
                background-color: #00B988 !important; }

            /* MEC Colors - original #440000 */
            .michiana-events a, .michiana-events .event-info-title, .michiana-events {
                color: #43295c; } 
            .event-item.michiana-events .event-ticketlink, .event-item.michiana-events .event-info-location-color {
                background-color: #43295c !important; }
            .event-item.michiana-events .event-info-title a {
                color: #43295c; }
            .event-item.michiana-events .event-ticketlink, .event-item.michiana-events .event-info-location-color {
                background-color: #43295c !important; }

            /* Featured Product Colors */
            .featured-product a, .featured-product .event-info-title, .featured-product {
                color: #FF3D3D; }
            .event-item.featured-product .event-ticketlink, .event-item.featured-product .event-info-location-color {
                background-color: #FF3D3D !important; }
            .event-item.featured-product .event-info-title a {
                color: #FF3D3D; }
            .event-item.featured-product .event-ticketlink, .event-item.featured-product .event-info-location-color {
                background-color: #FF3D3D !important; }

            .event-item .event-ticketlink a {
                color: #fff;
                line-height: 2.2em;
                transition: all .3s;
                text-align: center;
            }

            .event-ticketlink {
                float: right;
                position: relative;
                display: block;
                padding: 0;
                height: 110px;
                width: 24px;
                margin: 0 auto;
            }
            @media screen and (min-width: 767px){
                .event-ticketlink {
                    float: none;
                    height: 44px;
                    width: 230px;
                    font-family: "Open Sans", Arial, Helvetica, sans-serif;
                    font-weight: 700;
                    font-size: 20px;
                    color: #fff;
                    text-align: center;
                    margin: 0 auto;
                }
            }
            
            .event-info {
                height: 110px;
                width: 100%;
                margin: none;
                padding: 5px;
                position: relative;
            }
            .event-info-date {
                font-weight: 600;
                font-size: 15px;
                color: #777777;
            }
            p.event-info-date {
                margin: 5px;
                min-width: 300px;
            }
            p.event-info-title {
                margin: 5px;
            }
            
            .event-info-title {
                font-weight: 600;
                font-size: 18px;
                line-height: 1;
                color: #15468E;
                min-width: 300px;
            }
            .event-info-location {
                position: relative;
                bottom: 0;
                font-weight: 600;
                font-size: 11px;
                color: #777777;
                text-transform: uppercase;
                width: 90%;
                transition: all .4s;
                min-width: 300px;
            }
                .blackfriday {
					display: none;
				}
                .blackfriday-mobile {
                    background-color: darkred;
                    text-align: center;
                    color: white;
                    line-height: normal;
                    font-weight: bold;
                    height: 100px;
                    position: relative;
                    margin: 5px -96px 0 0px;
                    writing-mode: tb;
                    float: right;
                    right: 75px;
                    display: block;
				}
                .joinwait {
					color: darkorange; 
					font-weight: bold; 
					height: 20px; 
					position: relative;
					margin-top: -20px !important;
				}

            .event-info-location-color {
                width: 14px;
                height: 14px;
                display: inline-block;
                vertical-align: text-bottom;
            }
                .tickets-button{
                    display: none;
                }

            @media screen and (min-width: 767px){
                .event-box:hover {
                    box-shadow: 0 8px 8px 7px rgba(0, 0, 0, 0.1);
                    margin-top: -2px;
					margin-bottom: 2px;
                }
                .event-box:hover .event-thumb img {
                    -ms-transform: scale(1.033);
                    transform: scale(1.033);
                }
                .event-info {
                    height: 136px;
                    width: 230px;
                    margin: 0 auto;
                    padding: 10px;
                    position: relative;
                }
                .event-info-location {
                    position: absolute;
                    bottom: 0;
                    font-weight: 600;
                    font-size: 11px;
                    color: #777777;
                    text-transform: uppercase;
                    width: 90%;
                    transition: all .4s;
                }
                .blackfriday {
					display: block;
					color: red; 
					font-weight: bold; 
					height: 20px; 
					position: relative;
					z-index: 5;
					margin-top: -20px !important;
				}
                .blackfriday-mobile {
					display: none;
				}
                .joinwait {
					display:none;
				}
                .event-info-title {
                    line-height: 1.2;
                    min-width: unset;
                }
                .tickets-button{
                    display: block;
                }
            }


/* Event Info Styles */

.event-detail-header {
     color: #393D3F;
     font-size: 1.953125rem;
     position: relative;
     padding-bottom: 15px;
 }
.event-detail-header:before {
    content: "";
    display: block;
    width: 170px;
    height: 5px;
    background: #005387;
    bottom: 5px;
    left: 0;
    position: absolute;
}
.description_wrapper {
    margin: 0 0 30px 0;
    clear: left;
}
.description_wrapper .event_description {
    position: relative;
}
.description_inner {}

.description_inner p, .description_inner .p {
    margin: 0 0 20px;
}
.show_weekday:before {
    height: 25px;
    width: 1px;
    background: #393D3F;
    content: "";
    position: absolute;
    top: 50%;
    left: 14px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.packageDetail {
    position: relative;
    font-family: "source-sans-pro", sans-serif;
    overflow: hidden;
    padding: 25px 15px 20px 15px;
    border: 5px solid #0093FF;
    border-radius: 5px;
}
.packageDetail .item {
    padding: 0 5px 15px 5px;
    margin: 0 0 20px 0;
    border-bottom: 1px solid #393D3F;
    width: 100%;
}
.packageDetail .item .label {
    font-size: 18px;
    color: #393D3F;
    margin: 0 0 4px 0;
    font-weight: bold;
}

input[type="checkbox"].toggle-checkbox {
    display: none;
}

.line-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 18;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
}

/* When checkbox is checked, remove line clamp */
.toggle-checkbox:checked + .line-clamp {
    -webkit-line-clamp: unset;
    display: block;
    overflow: visible;
}

.toggle-label {

    margin-top: 10px;
    color: #007bff;
    cursor: pointer;
    font-weight: bold;
    text-align: left;
    font-size: 1em;
    width: 100%;
}

/* Optionally switch label text */
.toggle-checkbox:checked + .line-clamp + .toggle-label::after {
    content: 'Less ←';
}

.toggle-checkbox:not(:checked) + .line-clamp + .toggle-label::after {
    content: 'More →';
}