@media (max-width: 768px) {

    .main-top-bg {
        background-size: 207%, 1100px;
        margin-bottom: -3.4%;
        background-position: center top, center 80%;
    }
}
    @media (min-width: 768px) {
            .main-top-bg {
        background-size: 1540px, 1100px;
        margin-bottom: -25px;
        background-position: center top, center 60%;
    }
    }
@media (min-width: 992px) {
        .main-top-bg {
        background-size: auto, 120%;
        margin-bottom: -40px;
        background-position: center top, center 90%;
       
    } 
}

body{
    background: #d0c3b0;
    position:relative;
}

.logo-responsive {
    max-width: 100%;
    max-height: 20%;
    margin-bottom: -50px;
}

.paper-bg {
    padding: 0;
    margin: 0 auto;
    z-index: 2;
    background: url(../Images/background/krf-paper-mid.png) center top repeat-y;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    -webkit-background-size: 100%;
    background-size: 100%;
    max-width:960px;
}
.paper-top-bg {
    background: url(../Images/background/krf-paper-top.png) center bottom no-repeat;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    -webkit-background-size: 100%;
    background-size: 100%;
    height: 90px;
    max-width:960px;
    margin:0 auto;
}
.paper-bottom-bg {
    background: url(../Images/background/krf-paper-bot.png) center top no-repeat;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    -webkit-background-size: 100%;
    background-size: 100%;
    height: 90px;
    max-width:960px;
    margin:0 auto;
}

.paper-bg-transparent {
    padding: 0px;
    margin: 0 auto;
    z-index: 2;
    background: radial-gradient(ellipse at center, #f0e6d8 30%, rgba(240,230,216,0) 80%); /* W3C */
}
    .main-panel-container {
        width: 93%;
        height: 92%;
        top: 0;
        left: 0;
        right: 0;
        margin: 1.5% auto 0 auto;
        padding-top: 1.3%;
        padding-left: 2.1%;
        padding-right: 1.4%;
    }

@media only screen and (min-width: 992px) {
    .main-panel-container {
        width: 82%;
        height: 92%;
        top: 0;
        left: 0;
        right: 0;
        margin: 1.5% auto 0 auto;
        padding-top: 1.3%;
        padding-left: 2.1%;
        padding-right: 1.4%;
    }
}

.video-container {
    width: 82%;
    height: 94%;
    margin: 0 auto;
}


.main-top-bg {
    vertical-align: bottom;
    background-image: url(../Images/background/krf-top-bg.jpg), url('../Images/background/krf-map.png');
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center 70%;
}

.strategy-guide-banners-bg {
    background: url(../Images/strategy-guide/krf_sguide_adframe_bg_990x370.png) center top no-repeat;
    -moz-background-size: 90%;
    -o-background-size: 90%;
    -webkit-background-size: 90%;
    background-size: 90%;
    max-width: 990px;
    padding-top:6%;
    margin:-6% auto 0 auto;
    position:relative;
    z-index:2;
}

.footer-post{
    height:540px;
    margin-top:-540px;
    width:100%;
    overflow:hidden;
    background:url(../Images/background/krf-footer-bg-tile-x.png) center bottom repeat-x;
    z-index:-2;
}

.footer-post img.dragon {
    right: -340px;
   
}.footer-post img.mage {
    left: -350px;
   
}