﻿@font-face {
    font-family: "yeezy";
    src: url("/hush/2018/fonts/yeezy_tstar-bold-webfont.ttf");
}

@media (min-width: 1024px) 
{
    h2
    {
        margin-bottom: 1.5em;
        }


    #header {
        width: 100%;
        height: 100vh;
        background-size: auto 100%;
        padding-top: 5.55555555vh;
        background-position: center center;
        background-repeat: no-repeat;
        background-image: url('/hush/2018/img/frame/web/cover_images.jpg');
    }

    .moveWave {
            height: 100vh;
            margin-top: -1.7vh;
    }

#menuBtn
{
    display:block;
    position: fixed;
    top: 10px;
    height: 2.5em;
    width: 2.5em;
    z-index: 99999;
    margin-left:2.5em;
    margin-top:2.5em;
    cursor:pointer;
    }
    
#menu
{
    display:block;
    position:fixed;
    height: 10vh;
    width: 100%;
    top:0px;
    z-index: 99999;
    font-weight: 700;
    background-image: url(/hush/2018/img/frame/menubg.png);
    }

#menu .row
{
    margin-top: 38px;
    padding-right: 0px;
    }

#menu .closeBtn
{
    margin-left:30px;
    font-size:2.2em;
    cursor:pointer;
    margin-top:-0.4em;
    }
    
#menu ul
{
    list-style-type: none;
    }

#menu li
{
    display: inline-block;
    float: left;
    margin-left: 25px;
    }
    
#menu li a
{
    color: #2f2e2e;
    }

#menu li a:hover
{
    color: #2f2e2e;
    text-decoration: none;
    }

#menu li a img
{
    height: 1.5em;
    }

#menu .bear 
{
    background-image: url(/hush/2018/img/frame/web/Bear.png);
    background-repeat:no-repeat;
    display:block;
    width:100%;
    height: 10vh;
    border: 0px solid red;
    background-size:  contain;
    background-position: 130%;
    transition: all 0.2s linear;
    }
    
#menu .bear:hover
{
    background-image: url(/hush/2018/img/frame/web/Bear.png);
    background-repeat:no-repeat;
    display:block;
    width:100%;
    height: 10vh;
    border: 0px solid red;
    background-size:  contain;
    background-position: 112%
    }

 
#playVideo 
{
    display:block;
    position:absolute;
    top: 50vh;
    right: 50vw;
    height: 6.66666666vh;
    width: 6.66666666vh;
    overflow:hidden;
    background-size: contain;
    border: 0px solid yellow;
    margin-left:auto;
    margin-right:auto;
    display:none;
    }
    
#playVideo img 
{
    width:100%;
    height:100%;
    }


#timeTable {
    background-color:#191233;
    background-repeat:no-repeat;
    background-position: bottom center;
     color: #ffffff;
    padding-top: 100px;
    padding-bottom: 50px;
    min-height: 600px;
    background-image: url('../img/frame/web/part3_wave_1.png');
    }

    .dateNum {
        color: #671ba1;
        font-family: yeezy;
        font-size: 12em;
        line-height:1em;
        margin-bottom: 20px;
    }

    .dateTxt {
        color: #671ba1;
        font-size: 2em;
        line-height:1em;
        text-decoration: underline;
        margin-bottom: 120px;
    }

#timeTable li
{
    list-style: none;    
    }


    
#otherActivities_loop li
{
    list-style: none;    
    }
    
#mainContent
{
    width: 100%;      
    background-color: #ffffff;
    background-size: 100% 100%;
    z-index: 999;
    }
    
.rellax
{
     
    }

#artistList {
    margin-left: auto;
    margin-right: auto;
    color: #191233;
    text-align:center;
    background-color: #e4e9ff;
    background-repeat:no-repeat;
    background-position: bottom center;
    background-image: url('../img/frame/web/part2_wave1.png');
    font-size: 4em;
    padding-bottom: 250px;
    -webkit-transition: background 1s ease-out;
    -moz-transition: background 1s ease-out;
    -o-transition: background 1s ease-out;
    transition: background 1s ease-out;
}   

.artistHover{
    -webkit-transition: background 1s ease-out;
    -moz-transition: background 1s ease-out;
    -o-transition: background 1s ease-out;
    transition: background 1s ease-out;
}   
  

#artistList h2
{
   color: #191233;
   margin-top:2em;
   margin-bottom:1em;
    }   
    
#artistList a
{
    color: #191233;
    transition: all 0.2s linear;
    line-height: 1.2em;    
    word-break:keep-all;
    }

#artistList a:hover
{
   color: white;
    text-decoration: none;
        -webkit-transition: background 1s ease-out;
    -moz-transition: background 1s ease-out;
    -o-transition: background 1s ease-out;
    transition: background 1s ease-out;
    }

#artistList .row
{
    padding-top:100px;
    font-weight:100;
    }

    .artistHtmlText {
         z-index: 100;
    }

    #artistBG {
        position: absolute;
        border: 0px solid red;
        width: 100%;
       
        text-align:center;
        z-index: 20;
       

    }
    #timeTable_date {
        background-color:#ff6e8d;
         background-repeat:no-repeat;
        background-position: top center;
        background-image: url('../img/frame/web/part2_wave2.png');
        padding-top: 150px;
        height: 600px;
        text-align:center;
    }

#otherActivities a
{
    color: White;
    font-size: 20px; 
    line-height: 20px;
    transition: all 0.2s linear;
    
    }

#otherActivities a:hover
{
    color: White;
    text-decoration: none;
    }
.hasVideo
{
    /* cursor:pointer;*/
    }


#otherActivities {
      width: 100%;
    background-color:#e0e3f4;
    background-repeat:no-repeat;
    background-position: top center;
    background-image: url('../img/frame/web/part3_wave_2.png');
}

.otherActTxt
{
    display:block;
    width: 100%;
    border: 0px solid red;
    text-align:center;
    padding: 10px;
    line-height: 1.5em;
    color: #000000;
    }
    
 .row .container 
 {
     padding:0px; margin:0px;
     }

.enhanceBG
{
    width: 100%; 
    height: 250px; 
    margin-top:40%; 
    font-size:20px; 
    line-height:20px;
    margin-top:-10px; 
    float:left;
    margin:1px;
    overflow:hidden;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition:all 0.3s ease;

}
.enhanceBG:hover {
     background-size: contain;
     background-repeat: no-repeat;
    -webkit-filter: brightness(80%)  blur(2px);
    -moz-filter: brightness(850%)  blur(2px);
    -o-filter: brightness(80%) blur(2px);
    -ms-filter: brightness(850%)  blur(2px);
    filter: brightness(80%)  blur(2px);
    transition:all 0.3s ease;
}

#timetableList
{
    padding-left:0px;
    }

#traffic
{
    color: White;
    line-height:1.8em;
    letter-spacing: 0.1em;
    background-color:#671ba1;
    background-repeat:no-repeat;
    background-position: top center;
    background-image: url('../img/frame/web/part4_wave_2.png');
    }

    #support {
         color: White;
    line-height:1.8em;
    letter-spacing: 0.1em;
    background-color:#e0e3f4;
    }

#youtube300
{
    padding-top:100px;
    padding-bottom: 150px;
    color: #1b1136;
    line-height:1.8em;
    letter-spacing: 0.1em;
    background-color:#d3f2ac;
    background-repeat:no-repeat;
    background-position: center center, bottom, center;
    background-image: url('../img/frame/web/300.png'), url(../img/frame/web/part4_wave_1.png);
    }

#youtube300 a
{
    color: #000000;
    transition: all 0.2s linear;
    }

#youtube300 a:hover
{
   color: #888888;
    text-decoration: none;
    }


.paddingTop
{
    padding-top: 155px;
    }

.paddingAndBorderBottom
{
    padding-top: 155px;
    padding-bottom: 155px;
    border-bottom: 1px solid #ffffff;   
    }
    
.borderBottom
{  
    padding-bottom: 185px;
    border-bottom: 1px solid #ffffff;   
    }

#map
{
       
    }
    
footer
{  
    padding-top:70px;
    padding-bottom:140px;
    color: White; 
    font-size: 0.8em; 
    font-weight:100;
    background-color: #191233;
    } 
    
footer a
{
    color: White;
    }

footer a:hover
{
    color: White;
    text-decoration: none;
    }
    
.slider {
	overflow-y: hidden;
	max-height: 500px; /* approximate max height */

	transition-property: all;
	transition-duration: .5s;
	transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}

.slider.closed {
	max-height: 0;
}


.element
{
    visibility:visible;
    opacity: 1;
    transition: opacity 0.25s linear;
}

.element.invisible
{
    visibility:hidden;
    opacity: 0;
    transition: visibility 0s 0.25s, opacity 0.25s linear;
}


.featherlight .featherlight-content {
    position: relative;
    text-align: left;
    vertical-align: middle;
    display: inline-block;
    overflow: auto;
    padding:  0px;
    border-bottom: 0px solid transparent;
    width: 110vh;
    max-width: 1073px;
    height: 585px;
    margin-left: 5%;
    margin-right: 5%;
    max-height: 95%;
    background: #fff;
    cursor: auto;
    white-space: normal;
    background-image: url(/hush/2018/img/frame/web/popboxbg.png);
    background-size: contain;
    background-position: center bottom;
    background-repeat:repeat-x;
    
}


    .backBtn {
        width: 12pt !important;
        cursor: pointer;
    }

    .nextBtn {
        width: 12pt  !important; 
        cursor: pointer;
    }


    
    .backBtn2 {
        width: 12pt !important;
        margin-top:100%;
        cursor: pointer;
    }

    .nextBtn2 {
        width: 12pt  !important; 
        margin-top:100%;
        cursor: pointer;
    }

}
