body {
    background: rgba(233,249,255,1);
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-family: "Roboto script=all rev=1", "Adobe Blank", "Roboto", "Helvetica", "Arial", sans-serif;
}

.center {
    text-align: center;
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-height: 90%;
    max-width: 100%;
}

.logocss {
    width: 100px !important;
    /*height: 50px !important;*/
    min-height: 50px;
    min-width: 100px;
    margin-top: -12px;
}

img {
    min-height: 300px;
    min-width: 300px ;
    height:auto;
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align:center;
}

.iframe {
    min-height: 560px;
    width: 100%;

    overflow: auto;
}

audio {
    position: absolute;
    width: 300px;
    height: 30px;
    
    right: auto;
    left: auto;
    margin-left: -100px;
}

.linkfloat {
    position: absolute;
    width: 300px;
    
    
    right: auto;
    left: auto;
    
    text-align:center;
}


/* When the width is between 600px and 900px OR above 1100px - change the appearance of <div> */
@media only screen and (max-width: 500px) and (min-width: 350px), (min-width: 600px) {
    .iframe {
        min-height: 750px;
        width: 100%;
        max-height: 500px;
        max-width: 500px;
        overflow: auto;
    }

}