@media screen and (min-width: 1600px) {
    body {
        font-size: 25px;
        font-family: Arial,sans-serif;
        text-align: left;
        background: white;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        background-image:    url(playerbackground.png);
        background-size:     cover;
        background-repeat:   no-repeat;
        background-position: center center;
        background-color:    #FFFFFF;
        z-index: -1;
    }
    .bcontent {
        position:    absolute;
        left:        386px;
        top:         332px;
        color:       #FFFFFF;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
        line-height: normal;
    }
    #qrconfig {
        position: fixed;
        top:      calc(400px/1);
        left:     calc(100px/1);
        width:    calc(200px/1);
        height:   calc(200px/1);
    }
    #qrconfigimg {
        width:    200px;
        height:   200px;
    }
}

@media screen and (min-width: 1300px) and (max-width: 1600px) {
    body {
        font-size: 20px;
        font-family: Arial,sans-serif;
        text-align: left;
        background: white;
        margin: 0;
        padding: 0;
        width: calc( 1918px/1.41 );
        height: calc( 1078px/1.41 );
        background-image:    url(playerbackground.png);
        background-size:     cover;
        background-repeat:   no-repeat;
        background-position: center center;
        background-color:    #FFFFFF;
        z-index: -1;
    }
    .bcontent {
        position:    absolute;
        left:        calc(386px/1.41);
        top:         calc(332px/1.41);
        color:       #FFFFFF;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
        line-height: normal;
    }
    #qrconfig {
        position: fixed;
        top:      calc(400px/1.41);
        left:     calc(100px/1.41);
        width:    calc(200px/1.41);
        height:   calc(200px/1.41);
    }
    #qrconfigimg {
        width:    calc(200px/1.41);
        height:   calc(200px/1.41);
    }
}

@media screen and (min-width: 1000px) and (max-width: 1300px) {
    body {
        font-size:           25px;
        font-family:         Arial,sans-serif;
        text-align:          left;
        margin:              0;
        padding:             0;
        width:               100%;
        height:              100%;
        background-image:    url(playerbackground.png);
        background-size:     cover;
        background-repeat:   no-repeat;
        background-position: center center;
    }
    #page {
        width:  100%;
        height: 100%;
    }
    .bcontent {
        position:    absolute;
        top:         37%;
        color:       #FFFFFF;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
        line-height: normal;
        width:       100%;
    }
    #one {
        left:     20%;
        position: relative;
        width:    60%;
    }
    #qrconfig {
        position: fixed;
        top:      350px;
        left:     440px;
        width:    200px;
        height:   200px;
    }
    #qrconfigimg {
        width:    200px;
        height:   200px;
    }
}

@media screen and (min-width: 700px) and (max-width: 950px) {
    body {
        font-size: 13px;
        font-family: Arial,sans-serif;
        text-align: left;
        background: white;
        margin: 0;
        padding: 0;
        width: calc( 1918px/2.3 );
        height: calc( 1078px/2.3 );
        background-image:    url(playerbackground.png);
        background-size:     cover;
        background-repeat:   no-repeat;
        background-position: center center;
        background-color:    #FFFFFF;
        z-index: -1;
    }
    .bcontent {
        position:    absolute;
        left:        calc(386px/2.3);
        top:         calc(332px/2.3);
        color:       #FFFFFF;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
        line-height: normal;
    }
    #qrconfig {
        position: fixed;
        top:      calc(400px/2.3);
        left:     calc(100px/2.3);
        width:    calc(200px/2.3);
        height:   calc(200px/2.3);
    }
    #qrconfigimg {
        width:    calc(200px/2.3);
        height:   calc(200px/2.3);
    }
}