﻿ .windows8 {
    position: absolute;
    width: 130px;
    height: 130px;
    left: 50%;
    top: 150px;
    margin-left: -65px;
}

    .windows8 .wBall {
        position: absolute;
        width: 100px;
        height: 100px;
        opacity: 0;
        -moz-transform: rotate(225deg);
        -moz-animation: orbit 7.15s infinite;
        -webkit-transform: rotate(225deg);
        -webkit-animation: orbit 7.15s infinite;
        -o-transform: rotate(225deg);
        -o-animation: orbit 7.15s infinite;
        -ms-transform: rotate(225deg);
        -ms-animation: orbit 7.15s infinite;
        transform: rotate(225deg);
        animation: orbit 7.15s infinite;
    }

        .windows8 .wBall .wInnerBall {
            position: absolute;
            width: 11px;
            height: 11px;
            background:#b200ff;
            /*background:#fff;*/
            left: 0px;
            top: 0px;
            -moz-border-radius: 11px;
            -webkit-border-radius: 11px;
            -o-border-radius: 11px;
            -ms-border-radius: 11px;
            border-radius: 11px;
        }

    .windows8 #wBall_1 {
        -moz-animation-delay: 1.56s;
        -webkit-animation-delay: 1.56s;
        -o-animation-delay: 1.56s;
        -ms-animation-delay: 1.56s;
        animation-delay: 1.56s;
    }

    .windows8 #wBall_2 {
        -moz-animation-delay: 0.31s;
        -webkit-animation-delay: 0.31s;
        -o-animation-delay: 0.31s;
        -ms-animation-delay: 0.31s;
        animation-delay: 0.31s;
    }

    .windows8 #wBall_3 {
        -moz-animation-delay: 0.62s;
        -webkit-animation-delay: 0.62s;
        -o-animation-delay: 0.62s;
        -ms-animation-delay: 0.62s;
        animation-delay: 0.62s;
    }

    .windows8 #wBall_4 {
        -moz-animation-delay: 0.94s;
        -webkit-animation-delay: 0.94s;
        -o-animation-delay: 0.94s;
        -ms-animation-delay: 0.94s;
        animation-delay: 0.94s;
    }

    .windows8 #wBall_5 {
        -moz-animation-delay: 1.25s;
        -webkit-animation-delay: 1.25s;
        -o-animation-delay: 1.25s;
        -ms-animation-delay: 1.25s;
        animation-delay: 1.25s;
    }

@-moz-keyframes orbit {
    0% {
        opacity: 1;
        z-index: 99;
        -moz-transform: rotate(180deg);
        -moz-animation-timing-function: ease-out;
    }

    7% {
        opacity: 1;
        -moz-transform: rotate(300deg);
        -moz-animation-timing-function: linear;
        -moz-origin: 0%;
    }

    30% {
        opacity: 1;
        -moz-transform: rotate(410deg);
        -moz-animation-timing-function: ease-in-out;
        -moz-origin: 7%;
    }

    39% {
        opacity: 1;
        -moz-transform: rotate(645deg);
        -moz-animation-timing-function: linear;
        -moz-origin: 30%;
    }

    70% {
        opacity: 1;
        -moz-transform: rotate(770deg);
        -moz-animation-timing-function: ease-out;
        -moz-origin: 39%;
    }

    75% {
        opacity: 1;
        -moz-transform: rotate(900deg);
        -moz-animation-timing-function: ease-out;
        -moz-origin: 70%;
    }

    76% {
        opacity: 0;
        -moz-transform: rotate(900deg);
    }

    100% {
        opacity: 0;
        -moz-transform: rotate(900deg);
    }
}

@-webkit-keyframes orbit {
    0% {
        opacity: 1;
        z-index: 99;
        -webkit-transform: rotate(180deg);
        -webkit-animation-timing-function: ease-out;
    }

    7% {
        opacity: 1;
        -webkit-transform: rotate(300deg);
        -webkit-animation-timing-function: linear;
        -webkit-origin: 0%;
    }

    30% {
        opacity: 1;
        -webkit-transform: rotate(410deg);
        -webkit-animation-timing-function: ease-in-out;
        -webkit-origin: 7%;
    }

    39% {
        opacity: 1;
        -webkit-transform: rotate(645deg);
        -webkit-animation-timing-function: linear;
        -webkit-origin: 30%;
    }

    70% {
        opacity: 1;
        -webkit-transform: rotate(770deg);
        -webkit-animation-timing-function: ease-out;
        -webkit-origin: 39%;
    }

    75% {
        opacity: 1;
        -webkit-transform: rotate(900deg);
        -webkit-animation-timing-function: ease-out;
        -webkit-origin: 70%;
    }

    76% {
        opacity: 0;
        -webkit-transform: rotate(900deg);
    }

    100% {
        opacity: 0;
        -webkit-transform: rotate(900deg);
    }
}

@-ms-keyframes orbit {
    0% {
        opacity: 1;
        z-index: 99;
        -ms-transform: rotate(180deg);
        -ms-animation-timing-function: ease-out;
    }

    7% {
        opacity: 1;
        -ms-transform: rotate(300deg);
        -ms-animation-timing-function: linear;
        -ms-origin: 0%;
    }

    30% {
        opacity: 1;
        -ms-transform: rotate(410deg);
        -ms-animation-timing-function: ease-in-out;
        -ms-origin: 7%;
    }

    39% {
        opacity: 1;
        -ms-transform: rotate(645deg);
        -ms-animation-timing-function: linear;
        -ms-origin: 30%;
    }

    70% {
        opacity: 1;
        -ms-transform: rotate(770deg);
        -ms-animation-timing-function: ease-out;
        -ms-origin: 39%;
    }

    75% {
        opacity: 1;
        -ms-transform: rotate(900deg);
        -ms-animation-timing-function: ease-out;
        -ms-origin: 70%;
    }

    76% {
        opacity: 0;
        -ms-transform: rotate(900deg);
    }

    100% {
        opacity: 0;
        -ms-transform: rotate(900deg);
    }
}

@keyframes orbit {
    0% {
        opacity: 1;
        z-index: 99;
        transform: rotate(180deg);
        animation-timing-function: ease-out;
    }

    7% {
        opacity: 1;
        transform: rotate(300deg);
        animation-timing-function: linear;
        origin: 0%;
    }

    30% {
        opacity: 1;
        transform: rotate(410deg);
        animation-timing-function: ease-in-out;
        origin: 7%;
    }

    39% {
        opacity: 1;
        transform: rotate(645deg);
        animation-timing-function: linear;
        origin: 30%;
    }

    70% {
        opacity: 1;
        transform: rotate(770deg);
        animation-timing-function: ease-out;
        origin: 39%;
    }

    75% {
        opacity: 1;
        transform: rotate(900deg);
        animation-timing-function: ease-out;
        origin: 70%;
    }

    76% {
        opacity: 0;
        transform: rotate(900deg);
    }

    100% {
        opacity: 0;
        transform: rotate(900deg);
    }
}



/************* New Styles for RMQuery ****************/

.querytable{
    border:1px solid #999;
}
.queryheading {
    background: #f6700e;
}
    .queryheading h3 {
        color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    padding: 4px 5px;
    text-align: center;
    }

.querytable table th {
    background: #3f61a7;
    color: #ffffff;
    padding:7px !important;
    border-radius:0;
}
.querytable table td {
    padding:7px;
}

@media only screen and (min-width:100px) and (max-width:360px) {

    /* Force table to not be like tables anymore */
    .bankingdata, .bankingdata thead, .bankingdata tbody, .bankingdata td, .bankingdata tr {
        display: block;
        width: 100%;
    }

        .bankingdata th {
            display: none;
        }


        /* Hide table headers (but not display: none;, for accessibility) */
        .bankingdata thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

        .bankingdata tr {
            border: 1px solid #0067ac;
            margin-bottom: 15px;
        }

        .bankingdata td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #0067ac;
            position: relative;
            padding-left: 70% !important;
            width: 100%;
            text-align: left;
        }

            .bankingdata td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 10px;
                left: 6px;
                width: 45%;
                padding-right: 20px;
                white-space: nowrap;
                font-weight: bold;
                font-size: 100%;
            }

    .bankdashboardtables {
        border: none;
    }

    .bankingdata tr td:nth-last-child(1) {
        border-bottom: none;
    }



    /************************** RMFolio Mapping Report as on date **************************/

    .bankingdata .bd:nth-of-type(1):before {
        content: "Scheme";
    }

    .bankingdata .bd:nth-of-type(2):before {
        content: "Folio";
    }

    .bankingdata .bd:nth-of-type(3):before {
        content: "PAN";
    }

    .bankingdata .bd:nth-of-type(4):before {
        content: "InvestorName";
    }

    .bankingdata .bd:nth-of-type(5):before {
        content: "RMCode";
    }

    .bankingdata .bd:nth-of-type(6):before {
        content: "RMName";
    }

    .bankingdata .bd:nth-of-type(7):before {
        content: "EffectiveDate";
    }

    .bankingdata .bd{
        background: #e4ecf5;
        color: #001ca8;
        width: 100%;
        word-wrap: break-word;
        min-height: 45px;
    }
}

@media only screen and (min-width:361px) and (max-width:480px) {

    /* Force table to not be like tables anymore */
    .bankingdata, .bankingdata thead, .bankingdata tbody, .bankingdata td, .bankingdata tr {
        display: block;
        width: 100%;
    }

        .bankingdata th {
            display: none;
        }


        /* Hide table headers (but not display: none;, for accessibility) */
        .bankingdata thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

        .bankingdata tr {
            border: 1px solid #0067ac;
            margin-bottom: 15px;
        }

        .bankingdata td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #0067ac;
            position: relative;
            padding-left: 60% !important;
            width: 100%;
            text-align: left;
        }

            .bankingdata td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 10px;
                left: 6px;
                width: 45%;
                padding-right: 20px;
                white-space: nowrap;
                font-weight: bold;
                font-size: 100%;
            }

    .bankdashboardtables {
        border: none;
    }

    .bankingdata tr td:nth-last-child(1) {
        border-bottom: none;
    }


    /************************** RMFolio Mapping Report as on date **************************/

    .bankingdata .bd:nth-of-type(1):before {
        content: "Scheme";
    }

    .bankingdata .bd:nth-of-type(2):before {
        content: "Folio";
    }

    .bankingdata .bd:nth-of-type(3):before {
        content: "PAN";
    }

    .bankingdata .bd:nth-of-type(4):before {
        content: "InvestorName";
    }

    .bankingdata .bd:nth-of-type(5):before {
        content: "RMCode";
    }

    .bankingdata .bd:nth-of-type(6):before {
        content: "RMName";
    }

    .bankingdata .bd:nth-of-type(7):before {
        content: "EffectiveDate";
    }

    .bankingdata .bd{
        background: #e4ecf5;
        color: #001ca8;
        width: 100%;
        word-wrap: break-word;
        min-height: 45px;
    }
}

@media only screen and (min-width:481px) and (max-width:640px) {

    /* Force table to not be like tables anymore */
    .bankingdata, .bankingdata thead, .bankingdata tbody, .bankingdata td, .bankingdata tr {
        display: block;
        width: 100%;
    }

        .bankingdata th {
            display: none;
        }


        /* Hide table headers (but not display: none;, for accessibility) */
        .bankingdata thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

        .bankingdata tr {
            border: 1px solid #0067ac;
            margin-bottom: 15px;
        }

        .bankingdata td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #0067ac;
            position: relative;
            padding-left: 60% !important;
            width: 100%;
            text-align: left;
        }

            .bankingdata td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 10px;
                left: 6px;
                width: 45%;
                padding-right: 20px;
                white-space: nowrap;
                font-weight: bold;
                font-size: 100%;
            }

    .bankdashboardtables {
        border: none;
    }

    .bankingdata tr td:nth-last-child(1) {
        border-bottom: none;
    }


    /************************** RMFolio Mapping Report as on date **************************/

    .bankingdata .bd:nth-of-type(1):before {
        content: "Scheme";
    }

    .bankingdata .bd:nth-of-type(2):before {
        content: "Folio";
    }

    .bankingdata .bd:nth-of-type(3):before {
        content: "PAN";
    }

    .bankingdata .bd:nth-of-type(4):before {
        content: "InvestorName";
    }

    .bankingdata .bd:nth-of-type(5):before {
        content: "RMCode";
    }

    .bankingdata .bd:nth-of-type(6):before {
        content: "RMName";
    }

    .bankingdata .bd:nth-of-type(7):before {
        content: "EffectiveDate";
    }

    .bankingdata .bd{
        background: #e4ecf5;
        color: #001ca8;
        width: 100%;
        word-wrap: break-word;
        min-height: 45px;
    }
}

@media only screen and (min-width:641px) and (max-width:768px) {

    /* Force table to not be like tables anymore */
    .bankingdata, .bankingdata thead, .bankingdata tbody, .bankingdata td, .bankingdata tr {
        display: block;
        width: 100%;
    }

        .bankingdata th {
            display: none;
        }


        /* Hide table headers (but not display: none;, for accessibility) */
        .bankingdata thead tr {
            position: absolute;
            top: -9999px;
            left: -9999px;
        }

        .bankingdata tr {
            border: 1px solid #0067ac;
            margin-bottom: 15px;
        }

        .bankingdata td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #0067ac;
            position: relative;
            padding-left: 60% !important;
            width: 100%;
            text-align: left;
        }

            .bankingdata td:before {
                /* Now like a table header */
                position: absolute;
                /* Top/left values mimic padding */
                top: 10px;
                left: 6px;
                width: 45%;
                padding-right: 20px;
                white-space: nowrap;
                font-weight: bold;
                font-size: 100%;
            }

    .bankdashboardtables, .nctdashboard, .nctdashboard1 {
        border: none;
    }

    .bankingdata tr td:nth-last-child(1) {
        border-bottom: none;
    }

    /************************** RMFolio Mapping Report as on date **************************/

    .bankingdata .bd:nth-of-type(1):before {
        content: "Scheme";
    }

    .bankingdata .bd:nth-of-type(2):before {
        content: "Folio";
    }

    .bankingdata .bd:nth-of-type(3):before {
        content: "PAN";
    }

    .bankingdata .bd:nth-of-type(4):before {
        content: "InvestorName";
    }

    .bankingdata .bd:nth-of-type(5):before {
        content: "RMCode";
    }

    .bankingdata .bd:nth-of-type(6):before {
        content: "RMName";
    }

    .bankingdata .bd:nth-of-type(7):before {
        content: "EffectiveDate";
    }

    .bankingdata .bd{
        background: #e4ecf5;
        color: #001ca8;
        width: 100%;
        word-wrap: break-word;
        min-height: 45px;
    }
}

@media only screen and (min-width:769px) and (max-width:1024px) {
}
