#body7 {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #ffffff;
    font-family: Arial, Calibri, Candara, Segoe, Segoe UI, Optima, sans-serif;
    font-size: calc(51vw/19.20);
    height: calc(1080vh/10.80);
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    text-align: left;
    visibility: hidden;
    width: calc(1920vw/19.20);
    z-index: -1;
}

#backgroundimage {
    position: fixed;
    height: 100%;
    width: 100%;
    opacity: 0.25;
    background-color: #ffffff;
    background-size:  cover;
    z-index: -1;
}

#page {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

#logodiv {
    display: flex;
    flex: 0 0 auto;
    height: calc(100vw/19.20);
    justify-content: flex-end;
    left: calc(0vw/19.20);
    max-height: calc(100vw/19.20);
    overflow: hidden;
    padding: calc(5vw/19.20) 0 calc(5vw/19.20) 0;
    width: 100%;
    z-index: 20;
}

#toplogoimg {
    max-height: calc(90vw/19.20);
    max-width: calc(360vw/19.20);
    margin: 0 calc(50vw/19.20) 0 calc(15vw/19.20);
    z-index: 20;
}

#infobar {
    display: none;
    position: absolute;
    top: calc(0vw/19.20);
    left: calc(0vw/19.20);
    width: calc(1920vw/19.20);
    height: calc(100vw/19.20);
}

#titlebar {
    flex-grow: 1;
}

#todaytime {
    border-left: calc(1vw/19.20) solid white;
    border-right: calc(1vw/19.20) solid white;
    height: calc(90vw/19.20);
    line-height: calc(90vw/19.20);
    /* margin: 0 calc(15vw/19.20) 0 calc(15vw/19.20); */
    margin: 0 0 0 calc(15vw/19.20);
    padding: 0 calc(15vw/19.20) 0 calc(15vw/19.20);
    text-align: justify;
    /* width:        calc(120vw/19.20);; */
}

#todaydate {
    border-left: calc(1vw/19.20) solid white;
    border-right: calc(1vw/19.20) solid white;
    height: calc(90vw/19.20);
    line-height: calc(90vw/19.20);
    margin: 0 0 0 0;
    padding: 0 calc(15vw/19.20) 0 calc(15vw/19.20);
    text-align: justify;
    /* width:        calc(120vw/19.20);; */
}

#weather {
    border-left: calc(1vw/19.20) solid white;
    border-right: calc(1vw/19.20) solid white;
    height: calc(90vw/19.20);
    left: calc(1328vw/19.20);
    padding: 0 calc(15vw/19.20) 0 calc(15vw/19.20);
    margin: 0 calc(15vw/19.20) 0 0;
    text-align: center;
    top: calc(-14vw/19.20);
    width: calc(120vw/19.20);
}

#weather_temp {
    position: relative;
    font-size: 62%;
    text-align: center;
    top: calc(-9vw/19.20);
    ;
}

#weather_img {
    width: calc(65vw/19.20);
    ;
}

#hours {
    color: #808080;
    background-color: #004400;
    text-align: center;
}

#hourstable {
    color: #002564;
    border: calc(3vw/19.20) blue solid;
}

h2 {
    color: white;
}

.q {
    background-color: transparent;
    text-align: center;
    z-index: 20;
}

#queuedata {
    color: #002564;
}

#qtitle {
    background-color: green;
    color: #F2F1F0;
    text-align: center;
    z-index: 30;
}

.qheader {
    color: #000000;
    z-index: 30;
}

.qheaderrow {
    text-align: center;
}

.image1 {}

#topnav {
    height: calc(100vw/19.20);
    display: none;
}

#hours {
    /*position: absolute; */
    top: calc(40vw/19.20);
    left: calc(37vw/19.20);
    font-size: calc(40vw/19.20);
    font-weight: 700;
    height: calc(82vw/19.20);
    line-height: calc(82vw/19.20);
    width: calc(375vw/19.20);
}

#hourstable {
    /* position: absolute; */
    font-size: calc(42vw/19.20);
    top: calc(120vw/19.20);
    left: calc(37vw/19.20);
    font-weight: 500;
    width: calc(375vw/19.20);
}

#jputdotwshort {
    padding-right: calc(25vw/19.20);
    font-weight: 700;
}

#progress {
    height: calc(90vw/19.20);
    margin: 0 calc(15vw/19.20) 0 calc(15vw/19.20);
    width: calc(90vw/19.20);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 500;
}

svg {
    transform: rotate(-90deg);
}

.item {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.item h2 {
    font-size: calc(20vw/19.20);
    position: absolute;
    line-height: calc(20vw/19.20);
    margin: 0;
    text-align: center;
    width: 100%;
    color: rgb(0, 37, 100);
}

.circle_animation {
    stroke-dashoffset: 188;
    stroke-dasharray: 188;
    /* this value is the pixel circumference of the circle */
    transition: all 1s ease-out;
}

#imagediv {
    height: calc(662vw/19.20);
    margin: 0 calc(50vw/19.20) 0 calc(15vw/19.20);
    width: calc(410vw/19.20);
    position: fixed;
    top: calc(234vw/19.20);
    left: calc(1484vw/19.20);
    z-index: 20;
}

.q {
    font-size: calc(90vw/19.20);
    font-weight: 700;
    height: calc(82vw/19.20);
    position: relative;
    width: calc(179vw/19.20);
}

#queuearea {
    margin-bottom: calc(10vh/10.80);
}

#queuedata {
    background-color: #ffffff;
    /* border: solid calc(2vw/19.20) #002664; */
    height: calc(750vw/19.20);
    /* left: calc(1495vw/19.20); */
    opacity: 0.7;
    top: calc(235vw/19.20);
    min-width: calc(360vw/19.20);
    z-index: 30;
    right: calc(10vw/19.20);
}

#qtitle {
    /* border-top: calc(2vw/19.20) grey solid;
    border-left: calc(1vw/19.20) grey solid;
    border-right: calc(2vw/19.20) grey solid; */
    font-size: calc(44vw/19.20);
    font-weight: 700;
    height: calc(77vw/19.20);
    /* left: calc(-1vw/19.20); */
    line-height: calc(77vw/19.20);
    /* position: absolute;
    top: calc(-2vw/19.20);
    width: calc(383vw/19.20); */
}

.qheader {
    font-size: calc(40vw/19.20);
    font-weight: 900;
    /* left: calc(-11vw/19.20);
    position: absolute;
    top: calc(83vw/19.20); */
    height: calc(42vh/10.80);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding-top: calc(9vh/10.80);
}

.qheaderrow {
    /* width: calc(192vw/19.20);
    position: absolute; */
    font-weight: 600;
    padding: 0 calc(60vw/19.20) 0 calc(30vw/19.20);
}

#qheaderbon {
    left: calc(192vw/19.20);
}

#themelogo {
    display: flex;
    align-items: center;
    width: 100%;
    flex-direction: column;
    max-height: calc(230vh/10.80);
    margin: 0 calc(10vw/19.20) calc(10vh/10.80) calc(10vw/19.20);
    z-index: 30;
}

#themelogoimg {
    height: 100%;
}

.qcontainer {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    width: calc(430vw/19.20);
    max-height: 100%;
    min-width: calc(430vw/19.20);
    margin-right: calc(20vw/19.20);
    z-index: 100;
}

#tickerbar {
    height: calc(60vh/10.80);
    margin-top: calc(8vh/10.80);
    text-align: center;
    width: 100%;
    z-index: 10;
}

#mainarea {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-grow: 1;
    margin-bottom: calc(0vh/10.80);
}

#mainpage {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: space-between;
}

corner_tl_lrg corner_tr_lrg corner_br_lrg corner_bl_lrg {}

corner_tl_sml corner_tr_sml corner_br_sml corner_bl_sml {}

#videoContainer {
    width:      calc(1440vw/19.20);;
    text-align: center;
}
.videoContainer {
    text-align: center;
}
.videoTemplate {
    visibility: hidden;
    display: none;
}
.myCanvas {
    background-color: #ffffff;
    position: fixed;
}
.playPause {
    display: none;
    font-size: 70%;
    position: absolute;
    bottom:   calc(100vh/10.80);
    text-align: center;
    width: 100%;
}
.mute {
    display: none;
    visibility: hidden;
    font-size: 90%;
}
.videoOwner {
    display: none;
    visibility: hidden;
}
.videoTitle {
    display: none;
}