﻿@media only screen and (max-width: 350px) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -200px;
        top: 150px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 419px;
        overflow-y: scroll;
    }
}
@media only screen and (min-width : 360px) and (max-width: 450px) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -200px;
        top: 100px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 245px;
        overflow-y: scroll;
    }
}


@media only screen and (min-device-width : 360px) and (max-device-height : 740px) and (orientation : portrait) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -200px;
        top: 100px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 325px;
        overflow-y: scroll;
    }
}

@media only screen and (min-width : 460px) and (max-width: 549px) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -200px;
        top: 100px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 289px;
        overflow-y: scroll;
    }
}
@media only screen and (min-width : 550px) and (max-width: 799px) and (orientation : portrait) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: 50px;
        top: 230px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 290px;
        overflow-y: scroll;
    }
}

@media only screen and (min-width : 800px) and (max-width: 819px) {

    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -100px;
        top: 230px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 418px;
        overflow-y: scroll;
    }
}

@media only screen and (min-width : 820px) and (max-width: 850px) and (orientation : portrait) {

    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -100px;
        top: 230px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 394px;
        overflow-y: scroll;
    }
}

@media only screen and (min-width : 820px) and (max-width: 860px) and (orientation : landscape) {

    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -100px;
        top: 100px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 294px;
        overflow-y: scroll;
    }
}

@media only screen and (min-width : 900px) and (max-width: 950px) {

    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -50px;
        top: 230px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 314px;
        overflow-y: scroll;
    }
}

@media only screen and (min-device-width : 768px) and (max-device-height : 1024px) and (orientation : portrait) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: -100px;
        top: 230px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 320px;
        overflow-y: scroll;
    }
}

/*@media only screen and (min-device-width : 800px) and (max-width: 1200px) and (orientation : portrait) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: 250px;
        top: 230px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);*/
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        /*display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 200px;
        height: 425px;
        overflow-y: scroll;
    }
}*/

@media only screen and (min-width : 600px) and (max-width: 800px) and (orientation : landscape) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: 80px;
        top: 130px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 0px;
        height: 235px;
        overflow-y: scroll;
    }
}

@media only screen and (min-width : 700px) and (max-width: 750px) and (orientation : landscape) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: 80px;
        top: 130px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 0px;
        height: 335px;
        overflow-y: scroll;
    }
}

@media only screen and (min-width : 880px) and (max-width: 960px) and (orientation : landscape) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: 180px;
        top: 130px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);
        /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
        display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 0px;
        height: 290px;
        overflow-y: scroll;
    }
}

@media only screen and (min-device-width : 600px) and (max-device-height : 960px) and (orientation : portrait) {
        .PanelFloat {
            position: fixed;
            overflow: hidden;
            left: 50px;
            top: 230px !important;
            -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
            -ms-transition: all 0.5s ease-in-out;
            -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
            -webkit-box-shadow: 0 0 10px rgb(0,0,0);
            -moz-box-shadow: 0 0 10px rgb(0,0,0);
            /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
            display: none;
            z-index: 100;
            color: white;
            background-color: white;
            padding-left: 0px;
            padding-top: 0px;
            margin-left: 0px;
            height: 535px;
            overflow-y: scroll;
        }
    }

    /*@media only screen and (min-device-width : 600px) and (max-device-height : 700px) and (orientation : landscape) {
    .PanelFloat {
        position: fixed;
        overflow: hidden;
        left: 250px;
        top: 230px !important;
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
        -webkit-box-shadow: 0 0 10px rgb(0,0,0);
        -moz-box-shadow: 0 0 10px rgb(0,0,0);*/
    /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
    /*display: none;
        z-index: 100;
        color: white;
        background-color: white;
        padding-left: 0px;
        padding-top: 0px;
        margin-left: 100px;
        height: 375px;
        overflow-y: scroll;
    }
}*/

    /*@media only screen and (min-device-width : 700px) and (max-device-height : 960px) and (orientation : landscape) {
        .PanelFloat {
            position: fixed;
            overflow: hidden;
            left: -20px;
            top: 100px !important;
            -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
            -ms-transition: all 0.5s ease-in-out;
            -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
            -webkit-box-shadow: 0 0 10px rgb(0,0,0);
            -moz-box-shadow: 0 0 10px rgb(0,0,0);*/
            /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
            /*display: none;
            z-index: 100;
            color: white;
            background-color: white;
            padding-left: 0px;
            padding-top: 0px;
            margin-left: 100px;
            height: 290px;
            overflow-y: scroll;
        }
    }*/



    @media only screen and (min-width : 1000px) {
        .PanelFloat {
            position: fixed;
            overflow: hidden;
            left: 250px;
            top: 130px !important;
            -webkit-transition: all 0.5s ease-in-out;
            -moz-transition: all 0.5s ease-in-out;
            -ms-transition: all 0.5s ease-in-out;
            -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
            -webkit-box-shadow: 0 0 10px rgb(0,0,0);
            -moz-box-shadow: 0 0 10px rgb(0,0,0);
            /*  style='display: none;z-index: 100;color:white;background-color:white;padding-left: 0px;padding-top: 0px;margin-left:200px;height:513px;overflow-y: scroll;'  */
            display: none;
            z-index: 100;
            color: white;
            background-color: white;
            padding-left: 0px;
            padding-top: 0px;
            margin-left: 100px;
            height: 325px;
            overflow-y: scroll;
            font-size:13px;
        }
    }
