/**************************************************
*    TABLE OF CONTENTS
***************************************************
*
*    1. UNIVERSAL ELEMENTS/CLASSES
*    2. UNIVERSAL COMPONENTS
*        a. NAV
*        c. EVENTS
*    3. PAGES
*        a. HOME
*        b. FAQ
*        c. SPECIAL EVENTS
*        d. EXPERIENCE
*		     e. MUSIC
*        f. GALLERY
*        g. 404
*    4. RESPONSIVE
*        a. MOBILE - SMALL
*
**************************************************/


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

/****************************************************************************************************
*****************************************************************************************************
*	1. UNIVERSAL ELEMENTS/CLASSES
*****************************************************************************************************
****************************************************************************************************/

    .desktop {
        display: none !important;
    }
	.mobile {
		display: block;
	}

    .content-area {
		margin-top: 75px;
    }

	.home-hero {
		/* height: calc(50vh - 75px); */
	}

    p,
    .cal-table .cal-title {
        font-size: 20px;
    }

    .header-bg {
        background-size: 200vw !important;
        background-position: center !important;
    }

	.cal-table .cal-desc {
		font-size: 16px;
	}



/****************************************************************************************************
*****************************************************************************************************
*	2. UNIVERSAL COMPONENTS
*****************************************************************************************************
****************************************************************************************************/

/****************************************************************************************************
*	2a. NAV
****************************************************************************************************/

    /* Full Screen NavBar */
	nav.navbar {
		opacity: 1;
	}
    .navbar-header {
        float: none;
    }
    .navbar-brand {
        height: 40px;
    }
    .navbar-inverse .navbar-toggle {
        border-color: transparent;
        padding-top: 15px;
    }
    .navbar-toggle .icon-bar {
        width: 34px;
        height: 3px;
        margin-bottom: 8px;
    }
    .navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
        background-color: transparent;
    }
    .navbar-toggle {
        z-index: 99;
        display: block;
    }

	div#navbarCollapse.collapse {
		display: none;
	}
	div#navbarCollapse.collapse.in {
		display: block;
	}
    div#navbarCollapse {
		position: fixed;
		z-index: 2;
		top: 0;
		left: 0;
		margin-left: 0;
		margin-right: 0;
    	width: 100%;
		background: rgba(44,62,80,0.9);
		-webkit-transition: 350ms ease all;
		-moz-transition: 350ms ease all;
		transition: 350ms ease all;
    }

    div#navbarCollapse ul {
		margin-left: 0;
		margin-right: 0;
		height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: center;
    }

    div#navbarCollapse ul li {
/*         display: block; */
    }

    div#navbarCollapse ul li a {
		padding: 20px;
		font-size: 20px;
        box-shadow: none;
    }

    div#navbarCollapse ul a.navbar-brand.mobile {
        display: none;
    }
    /* End Full Screen NavBar */



    /****************************************************************************************************
    *	2c. EVENTS
    ****************************************************************************************************/

    .cal-table,
    .cal-table th,
    .cal-table td {
        max-width: calc(100vw - 30px);
    }

    .cal-table>tbody {
        display: flex;
        flex-wrap: wrap;
    }

	.cal-table>tbody>tr {
		padding-bottom: 4rem;
	}

	.cal-table>tbody>tr>td {
		padding-top: 0;
	}

	.cal-table>tbody .cal-logo,
	.cal-table>tbody .cal-content {
		max-width: none;
	}

    .cal-table>tbody .cal-logo {
        display: block;
		border-bottom: none;
		padding-right: 0;
    }

    .cal-table>tbody .cal-logo img {
        width: 100%;
    }

	.cal-table>tbody .cal-content {
		padding-bottom: 4rem;
	}

	.cal-table>tbody .cal-content tbody>tr:first-child {
		display: block;
	}

	.cal-table>tbody .cal-content .cal-title,
	.cal-table>tbody .cal-content .cal-ticket {
        display: block;
        text-align: left;
	}



/****************************************************************************************************
*****************************************************************************************************
*	3. PAGES
*****************************************************************************************************
****************************************************************************************************/

/****************************************************************************************************
*	3a. PAGE - Home
****************************************************************************************************/

/**************************************************
*	Home - Newsletter
**************************************************/

    #mc_embed_signup_scroll {
        flex-wrap: wrap;
    }

    #mc_embed_signup_scroll .mc-field-group{
        margin: 0 auto 1.5rem auto;
        max-width: none;
    }

    #mc_embed_signup_scroll .clear {
        width: 100%;
        text-align: center;
    }

/****************************************************************************************************
*	3b. PAGE - FAQ
****************************************************************************************************/

    .faq-single h4 {
        font-size: 24px;
    }

    .faq-single .vc_toggle_content p {
        font-size: 18px;
    }



/****************************************************************************************************
*	3d. PAGE - Experience
****************************************************************************************************/

    .experience-row {
        flex-wrap: wrap;
    }

    .experience-box {
        width: 100% !important;
    }

    .experience-box .vc_column-inner {
        padding: 24px !important;
    }



/****************************************************************************************************
*	3e. PAGE - MUSIC
****************************************************************************************************/

	.box-wrapper .middle {
		top: 50%;
	}


/****************************************************************************************************
*	3f. PAGE - GALLERY
****************************************************************************************************/

	.vc_gitem-animated-block {
	    height: calc(100vw - 60px);
	}

  .vc_gitem-animated-block .vc_gitem-zone-b {
      opacity: 1 !important;
      top: auto !important;
      bottom: 0 !important;
      transform: none !important;
      background: none !important;
  }

  .vc_gitem-animated-block .vc_gitem-zone-b .vc_separator {
      display: none;
  }

  .vc_gitem-animated-block .vc_gitem-zone-b .vc_gitem_row {
      top: auto !important;
      bottom: 0 !important;
  }

  .vc_gitem-animated-block .vc_gitem-zone-b .vc_gitem-col {
      background: rgba(0,0,0,0.7);
  }

  .vc_gitem-animated-block .vc_gitem-zone-b .vc_gitem-col .vc_gitem-post-data-source-post_title{
      margin-bottom: 0;
  }

  /* Lightbox */
  .pp_pic_holder {
      left: 4vw !important;
      width: 94vw !important;
  }

  .pp_pic_holder .pp_content,
  .pp_pic_holder .pp_content .pp_hoverContainer,
  .pp_pic_holder .pp_content #fullResImage,
  .pp_pic_holder .pp_content .pp_details {
      width: calc(94vw - 34px) !important;
      height: auto !important;
  }

  .pp_pic_holder .pp_content .pp_hoverContainer {
      height: 75% !important;
  }

  .pp_pic_holder .ppt,
  .pp_pic_holder .pp_content .pp_expand,
  .pp_pic_holder .pp_content .pp_gallery {
      display: none !important;
  }

  .pp_pic_holder .pp_content .pp_details {
      transform: translateY(-114%);
      width: 82vw !important;
      padding-left: 2vw;
  }

	.gallery-video {
		width: 100%;
		padding-bottom: 16px;
	}

  .gallery-item {
    width: 100%;
    margin-right: 0;
  }


  /****************************************************************************************************
  *	3g. PAGE - 404
  ****************************************************************************************************/

  .error404 .video-container .page-content .text-container h1 {
    margin-bottom: 16px;
  }

  .error404 .video-container .page-content .text-container .page-text {
    font-size: 16px;
  }

} /* END max-width: 767px */





/****************************************************************************************************
*****************************************************************************************************
*    4. RESPONSIVE
*****************************************************************************************************
****************************************************************************************************/

/****************************************************************************************************
*    4a. MOBILE - SMALL
****************************************************************************************************/

@media all and (max-width: 479px) {
    .navbar-brand.mobile img {
        width: 216px;
        padding-top: 4px;
    }

    .cal-table .hide-col {
        display: none;
    }
}
