@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .tblfoodata { background-color: #fff !important; }

    #TBLDISPLY-TAB { display: block !important; }
    #TBLDISPLY-FULL { display: none !important; }
    /* Force table to not be like tables anymore */
    table.tblfoodata, .tblfoodata thead, .tblfoodata tbody, .tblfoodata th, .tblfoodata td, .tblfoodata tr, .tblfoodata tfoot { display: block; }

    /* Hide table headers (but not display: none;, for accessibility) */
    .tblfoodata thead tr { position: absolute; top: -9999px; left: -9999px; }

    .tblfoodata tbody td.footblrows { padding-right: 5px; font-weight: normal; font-size: 11px; color: #000000; font-family: Verdana; height: 25px; line-height: 25px; }
    .tblfoodata tr { border: 1px solid #ccc; }

    .tblfoodata td { /* Behave  like a "row" */ border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 50%; }
    .tblfoodata td.fultd { border: none; border-bottom: 1px solid #eee; position: static; padding: 2px 0 !important; min-height: 30px; line-height: normal; margin:0 5px; }

    .tblfoodata td:before { /* Now like a table header */ position: absolute; /* Top/left values mimic padding */ top: 0px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; border-right: 1px solid #eee; color: #006272; font-weight: bold; font-family: arial; }

    /*
                                        		Label the data
                                 		*/
    .tblfoodata tbody td:nth-of-type(1):before { content: "Currency"; }
    .tblfoodata tbody td:nth-of-type(2):before { content: "Code"; }
    .tblfoodata tbody td:nth-of-type(3):before { content: "Price"; }
    .tblfoodata tbody td:nth-of-type(4):before { content: "BID"; }
    .tblfoodata tbody td:nth-of-type(5):before { content: "Offer"; }
    .tblfoodata tbody td:nth-of-type(6):before { content: "Change On Day"; }
    .tblfoodata tbody td:nth-of-type(7):before { content: "Percentage Change"; }
    .tblfoodata tbody td:nth-of-type(8):before { content: "Last Trade"; }
    .tblfoodata tbody td:nth-of-type(9):before { content: "Daily Volume"; }
    .tblfoodata tbody td:nth-of-type(10):before { content: "Day High"; }
    .tblfoodata tbody td:nth-of-type(11):before { content: "Day Low"; }
    .tblfoodata tbody td:nth-of-type(12):before { content: "52 Week High"; }
    .tblfoodata tbody td:nth-of-type(13):before { content: "52 Week Low"; }
    .tblfoodata tbody td:nth-of-type(14):before { content: "Opening Price"; }
    .tblfoodata tbody td:nth-of-type(15):before { content: "Previous Closing"; }

}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    body { padding: 0; margin: 0; width: 320px; }
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    /*body { width: 495px; }*/
    .period-sec.pdatasec { min-height: 190px; margin: 15px 0 0; }
}
@media only screen and (max-width: 992px) {
    /*.main-wrapper .container { width: 1100px !important; }*/
    .cmndata-table > thead > tr > th { font-size: 13px; line-height: 17px; vertical-align: middle;padding: 9px;}
    .period-sec { margin:0;float: left;position: relative;}
    .dwnload-icn {position: absolute;top: 2px; right:0;position: absolute;}
    .announcemnt-wrap .main-head { display: block; font-size: 30px; line-height: 38px;margin: 0 0 20px 0;}
}
@media only screen and (max-width: 767px) {
    #contenttbl { width: 100%;}
    .value-th { min-width: 130px; }
    .market-data p { font-size: 12px; line-height: 20px;  }
    .main-wrapper { margin: 30px 0; }
    .top-menu li {margin: 0 10px 10px 0;}
    .market-data { padding: 5px 20px 5px 5px;  }

    .announcemnt-wrap { display: block; margin: 30px 0; padding: 0; }
    .announcemnt-wrap .expnd a { display: inline-block; margin: 20px 0;}
    .announcementpop { width: 400px; margin-left: -200px; }
    
}
@media only screen and (max-width: 479px) {
   #TdButton{padding:7px 0;}
    body { width: 100%; }
   .MenuLink {  font-size: 12px; line-height: 16px; padding: 7px;  }
   .footable > tfoot .pagination > ul > li > a {padding: 2px 7px !important;height: 26px; }

   .announcemnt-wrap .main-head { display: block; font-size: 21px; line-height: 27px;  }
   .announcemnttable > tbody > tr > .icons .view-icon { position: absolute; top: -3px; right: 0px;  width: 40px; height: 40px; }
   .announcemnttable > tbody > tr > .icons .download-icon::after { top: 10px;  }
   .announcemnttable > tbody > tr > .icons .download-icon { position: absolute; top: 0px; left: 0px; width: 40px; height: 40px; }
   .announcemnttable > tbody > tr > .icons { min-width: 80px; }
   .announcemnttable > tbody > tr > td:nth-child(odd) { font-size: 12px;padding: 15px 8px 8px; line-height: 19px;  }
   .announcemnttable > tbody > tr > .icons .download-icon::after { top: 10px;  }
   .announcemnttable { overflow: auto; min-width: 400px; border-spacing: 0; }
   .announcementpop { width: 320px; margin-left: -160px; }
   
   .MenuLink, .active-menu { font-size: 11px !important; padding: 6px 16px !important; }
}