body {
}
html {
    scroll-behavior: smooth;
}
@keyframes title {
    /*0% {*/
        /* Initial state: a subtle glow */
        /*filter: drop-shadow(2px 2px 8px #ff0);
    }*/

    50% {
        /* Stacked filters for the intense neon glow effect */
        filter: drop-shadow(0 0 3px #eee) drop-shadow(0 0 8px #ff0) drop-shadow(0 0 15px #ff0);
    }

    100% {
        /* Return to original or none */
        filter: drop-shadow(0 0 0 transparent);
    }
}

.title {
    /* Apply the animation to your <img> tag */
    animation: title 5s;
    vertical-align: top;
    /* Ensure the image doesn't get clipped by its container */
    /*padding: 20px;*/
}

/*@keyframes title {

    0% {
        text-shadow:0
    }
    50% {
        text-shadow: 0 0 3px #eee, 0 0 6px #eee, 0 0 8px #ff0, 0 0 10px #ff0, 0 0 12px #ff0, 0 0 15px #ff0, 0 0 17px #ff0;
    }
    100% {
        text-shadow:none;
    }
}*/

/*.title {
    text-shadow: 2px 2px 8px #ff0;
    animation-name: title;
    animation-duration: 5s;
    vertical-align: top;*/
    /*animation-iteration-count:infinite;*/
/*}*/

@keyframes fade {

    0% {
        opacity:0;
    }
   
    100% {
        opacity:1;
    }
}

.mediaImg {

    float:left;
    margin:20px;
    /*max-height:400px;*/
    max-width:290px;

}
.fade {
    height:200px; margin:30px;
    animation-name:fade;
    animation-duration:7s;
}


.tab {
    background-color: #000;
    color: #ffe;
    font-size: 30px;
    border: none;
    margin:10px 10px 0px 10px;  
    vertical-align:top;  
}
    
    .tab:hover, .tab:focus {
        text-shadow: 0 0 3px #eee, 0 0 6px #eee, 0 0 8px #0aa, 0 0 10px #0aa, 0 0 12px #0aa, 0 0 15px #0aa, 0 0 17px #0aa;
    }

a {
    color: #ffa;
    text-decoration-thickness: 1px;
}
    a:hover {
        color:#f00;
    }
td {
    width:333px;
    padding: 10px 20px 10px 20px;    
    border:none;
    word-wrap:break-word;  
}

tr {
    /*border-bottom:1px solid #555;
    background-color:#2f2f2f;*/
    border: 2px solid #a00;
    background-color: #211;
}
table {
    width:1000px;
    /*border:solid thin #555;*/
    border-collapse:collapse;    
}

table tr td:nth-child(1) {
   text-align:left;  
         
}
table tr td:nth-child(2) {
    text-align:center;     
}
table tr td:nth-child(3) {
    text-align:right;
}


#imgStage {
        position:relative;
        top:0px;
        width:1000px;
}
#divMembers {
        width:900px; 
        position:absolute;        
        top:210px; 
        left:50%; 
        margin-left:-450px;         
}
.describe {
    position: absolute;
    background-color:black;
    color:#ffc;
    width:1000px;
    bottom:0px;
    left: 50%;
    transform: translate(-50%);
    /*text-shadow: 0 0 3px #0ee, 0 0 6px #0ee, 0 0 8px #0aa;*/
    font-size:30px;
}
#divTitle, #divMenu, #imgArrow {
        position:fixed;        
}

.imgSM {

    width:50px;   
}
.imgSMsm {
    width: 35px;    
    margin-bottom:-5px;
}
#divEvents, #divMedia, #divContact {
    padding-top:100px;
    font-size:30px;
}
#btn1 {
    display:initial;
}
#bodyGigsM, #bodyPreviousGigsM {
    display: none;
}
#bodyGigs, #bodyPreviousGigs {
    display:block;
}

.divHeader {
    background-color:#a00;
    color:#ffc;
    width:1000px;
    margin:auto;    
}
.eventButton {
    background-color:transparent;
    border:none; 
    font-size:20px;
    color:#ffa;
}
    .eventButton:hover {
        color:#c00;
    }

.arrowOn {
    display: none;
}
.arrowOff {
    display: none;
}

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

    .tab {
        border-right: solid thin;
        font-size: 55px;
        margin: 15px 0px 0px 0px;
    }
    .arrowOn {
        display: initial;
    }
    #bodyGigs, #bodyPreviousGigs {
    display:none;
    }
    #bodyGigsM, #bodyPreviousGigsM {
        display:block;
    }
    
    #divTitle {
        position:absolute;        
    }
    #divMenu {
        position:absolute;        
    }
    .imgSM {
        width: 100px;
    margin-bottom:-20px;
    }
    .imgSMsm {
        width: 60px;
        margin-bottom: -10px;
    }
    .describe {
        font-size:50px;     
        position:relative;
    }
    #divEvents, #divMedia, #divContact {
    padding-top:50px;
    font-size:50px;
    }
    #btn1 {
    display:none;
    }
    /*table tr td:nth-child(1) {
        width:400px;
    }*/
    table tr td:nth-child(2) {
        text-align:left;     
    }
    td {
        width:500px;
    }
    .eventButton {
        font-size:35px;
    }
}