html, body {
              height: 100%;
              margin: 0;
            }
            h2{
              margin-bottom: 2rem;
              font-size: 3rem;
            }
            hr{
              margin: 4rem 0;
              border-top: 0.5rem solid yellow;
              opacity: 10;
            }
            body{
                font-family: 'Montserrat', sans-serif;
                font-family: 'Radio Canada', sans-serif;     
                overflow-x: hidden;   
                display: flex;
                flex-direction: column;    
                color: lightgray;   
                background-color: #5a53cc; 
            }
            body.gallery{
              height: auto;
              background-color: black;
            }
            body.default h2{
              color:aqua;          
            }
            body.default h3{
              color: #ff6666;    
              font-size: 3rem;

            }
            
            body.default strong{
              color: yellow;
              font-weight: normal;
            }

            .text-meta{
              color:lightgray;
              font-size: 1.3rem;
            }

            .main-content {
              flex: 1;
              font-size: 1.5rem;
            }

            .y-desktop{
              display: inline-block;
            }
            .y-mobile{
              display: none;
            }

            .jumbotron {
              color: white;
              padding-top: 48px;
              padding-bottom: 48px;
              margin-bottom: 30px;              
            }

            .jumbotron h1{
              font-size: 63px;              
            }

            .jumbotron a{
              text-decoration: none;              
            }

            body #overlay{
              display: none;
            }

            body.overlay #overlay{
                display:block;
                position: fixed;
                z-index: 10;
                top: 0px;
                left: 0px;
                width: 100vw;
                height: 100vh;
                background-color: black;
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
            }
            a{
              color:black;
            }
            header a{
              color:white;
            }

            a:hover{
              color: #ff6666;
            }

            .pagetitle{
              color: #ff6666;
            }

            .pagetitle a{
              color: #ff6666;
              font-size: 9rem;
            }

            .pagetitle a:hover{
              color: aqua;
            }

            .radio-offline{
              color:yellow!important;
              padding: 2rem 0;
              font-size: 4rem;
            }

            .y-cta{
              padding: 1rem 2rem;
              color:white;
              text-transform: uppercase;
              font-size: 2rem;
              text-decoration: none;
              background-color: #ffcc66;
              border-radius: 10px;
            }

            .y-cta:hover{
              color:white;
              text-decoration: none;
              background-color: #ff6666;
            }

            table{
              width:100%;
              margin-bottom: 3rem;
            }
            td{
              padding-top: 2rem;  
              padding-bottom: 2rem;              
              vertical-align: top;
            }

            td.fixdate{
              width: 20%;
              padding-left: 0px;
              padding-right: 20px;
              transition: padding 0.5s ease;
            }
            td.location{
              width: 50%;
            }
            td.category{
              width: 15%;
            }
            td.venue{
              width: 15%;
            }

            tr{
              border-bottom: solid 1px black;
            }

            tr:hover{
              background-color: #ff6666;
            }
            tr:nth-child(even):hover{
              background-color: #ffcc66;
            }


            tr,
            tr a{
              color: #ff6666;
            }
            tr:nth-child(even),
            tr:nth-child(even) a{
              color: #ffcc66;
            }
            tr:hover,
            tr:hover a{
              color: #ffcc66!important;
            }

            tr:nth-child(even):hover,
            tr:nth-child(even):hover a{
              color: #ff6666!important;
            }

            tr:nth-child(even) h3{
              color: #ffcc66!important;
            }
            tr:hover h3{
              color: #ffcc66!important;
            }
            tr:nth-child(even):hover h3{
              color: #ff6666!important;
            }

            

            tr:hover td.fixdate{
              padding-left: 20px;
              padding-right: 0px;
            }

            tr td.fixdate .date{
              font-weight: bold;
            }
            tr td.fixdate .day{
              font-size: 1.5rem;
              margin-right: 10px;
            }
            tr td.fixdate .month{
              font-size: 2rem;
              font-weight: normal;
              margin-right: 10px;
            }

            tr a:hover{
              color: black;
            }

            .close {
              position: absolute;
              right: 50px;
              top: 32px;
              width: 32px;
              height: 32px;
              opacity: 1;
            }
            .close:before, .close:after {
              position: absolute;
              left: 15px;
              content: ' ';
              height: 33px;
              width: 2px;
              background-color: #fff;
              transition: all .5s;
            }
            .close:before {
              transform: rotate(45deg);
            }
            .close:after {
              transform: rotate(-45deg);
            }

            .close:hover:before,
            .close:hover:after {
              width: 4px;
            }
            audio{
              width: 100%;
            }
            #pradio{
              position:fixed;
              bottom: 25px;
              right: 25px;
              border: 4px solid white;
              color:white;
              background-color: black;
              padding: 10px 20px;  
              z-index: 999;
            }
            #pradio.online,
            #pradio:hover{
              background-color: red;
              border: 4px solid white;
            }

            #pradio a{
              color:white;
              text-decoration: none;
            }

            #pradio a:hover{
              color:black;
              text-decoration: none;
            }

            #events{
              position:fixed;
              bottom: 25px;
              left: 25px;
              border: 4px solid white;
              color:white;
              background-color: black;
              padding: 20px;  
              z-index: 999;

            }

            #events_{
              border: 3px solid black;
              border-radius: 5px;
              overflow: hidden;
            }
            
            #scroll-text_ {
              /* animation properties */
              -moz-transform: translateX(100%);
              -webkit-transform: translateX(100%);
              transform: translateX(100%);
              
              -moz-animation: my-animation 15s linear infinite;
              -webkit-animation: my-animation 15s linear infinite;
              animation: my-animation 15s linear infinite;
            }

            footer{
              height: 5rem;
              margin-top: 5rem;
              padding-bottom: 5rem;
              font-size: 3rem;
              line-height: 0rem;
            }

            footer a{
              color:#ffcc66;
              text-decoration: none;
            }
            footer a:hover{
              color:#ff6666;
              text-decoration: underline;
            }


            .audio-thumb {
              position: relative;
              cursor: pointer;
            }

            .play-btn {
              display:none;
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translate(-50%, -50%);
              background: rgba(0,0,0,0.6);
              color: white;
              font-size: 24px;
              padding: 10px 14px;
              border-radius: 50%;
              pointer-events: none;
            }

            .stream-highlights{
              list-style: none;
              padding:0;
              margin:0;
            }
            .stream-highlights li{
              cursor: pointer;
              padding: 2px 5px;
              display: inline-block;

              border: solid 1px #ff6666;
              background-color: #ff6666;
            }


            @media only screen and (max-width:900px) {
              .play-btn {
                display:block;
              }
              .pagetitle a{
                font-size: 4rem;
              }
              .y-desktop{
                display: none;
              }
              .y-mobile{
                display: inline-block;
                font-size: 1rem;
                font-weight: normal;
              }

              .jumbotron h1{
                font-size: 36px;         
                margin-bottom: 0px;          
              }

              td.fixdate{
                width: 30%;
              }
              tr td.fixdate .day{
                font-size: 2rem;
              }
              tr td.fixdate .month{
                font-size: 1.5rem;
              }
              td.location{
                width: 70%;
              }
              td.category{
                display: none;
              }
              td.venue{
                display: none;
              }

              footer{
                font-size: 2rem;
              }

            }