@-ms-viewport{ width: auto!important; }
@media screen and (max-device-width: 500px) {

    #Footer .recentAndPopular  .yui3-u-1-3 {
        /*border: 1px solid red;*/
            padding: 0 5px;
            width: 100%;
    }

    #Footer .recentAndPopular .title {
        font-weight: bold;
        font-size: 2.5em;
        padding-bottom: 20px;
        text-align:left;
    }

    #Footer .recentAndPopular {
        text-align: center;
        padding: 45px;
    }

    .mobileFriendly {
        position: relative !important;
        left: 5% !important;
        top: 0 !important;
        width: 90% !important;
        height: auto !important;
        background-size: 100% !important;
        padding-bottom: 100px !important;
    }

    .mobileFriendlyPageContainer {
        width: 100% !important;
    }

    .mobileFriendlyDisappear {
        display: none !important;
    }

    .mobileFriendlyAppear {
        display: inherit !important;
    }

    .mobileFriendlyAppearAsBlock {
        display: block !important;
    }

    .mobileFriendlyWelcomeMessage {
        text-align: right !important;
        padding-right: 50px !important;
        vertical-align: top !important;
    }

    .mobileDisplayHeader {
        display: block;
        font-size: 32px;
        padding: 0px 10px;
    }

    .desktopDisplayHeader {
        display: none;
    }
    .currentPointsLabel {
        display: inline;
    }


    .logoTD {
        padding-left: 50px !important;
    }

    .mobileLogo {
        width: 200px !important;
        margin-top: 20px;
    }

    .mobileHeaderLeft {
        width: 50%;
        float: left;
        text-align: left;
        color: #2777AA;
        font-weight: bold;
    }

    .mobileHeaderRight {
        width: 50%;
        float: right;
        text-align: right;
        color: #2777AA;
        font-weight: bold;
    }

    .mobileHeaderRight .points {
        color: #ee7d02;
        font-weight: bold;
    }

    .mobileFriendlyWelcomeBanner {
        background-size: 1462px 404px !important;
        height: 404px !important;
        left: 0 !important;
        width: 100% !important;
        overflow: hidden !important;
    }

    .loginbutton {
        width: 400px !important;    
        height: 45px;
    }

    .divbigbutton {
        width: 96% !important;
        margin-top: 10px;
        margin-bottom: 15px;
        margin-right: 15px;
        clear: both;
        height: 50px!important;
    }
    
    .accountlink {
        margin-bottom: 45px;
        margin-left: 25px;
        margin-top: 15px;
    }

    .accountlink {
        font-weight: bold;
        font-size: 45px;

    }

    .accountlinkbox {
        padding-bottom: 30px;
        padding-top: 15px;
    }

    #PrimaryNav .navigation {
        border-bottom: 0 !important;
    }

    #PrimaryNav .navigation li > a {
        font-size: 32px !important;
        padding: 20px !important;
    }

    /*#Footer .recentAndPopular > div {
        width: 100% !important;
    }*/

    #Footer .recentAndPopular a {
        font-size: 2.15em!important;
        display: inline!important;
        text-decoration: none;
        color: #8A9098;
    }

    #Footer .recentAndPopular .links {
        line-height: 3em !important;
        text-align: left;
    }

    #Footer .bottomlinks {
        font-size: 24px !important;
    }

    #Footer .bottomlinks a {
        font-size: 24px !important;
    }

    #Footer .copywrite {
        font-size: 16px !important;
    }

    /*#Footer .title {
        font-size: 36px !important;
    }*/

    #header .welcomeMessage .welcomeBack {
        font-size: 48px !important;
    }

    #header .welcomeMessage .currentPoints {
        font-size: 48px !important;
    }

    #header .welcomeMessage .points {
        font-size: 48px !important;
    }

    #header .catalogSearch {
        text-align: center;
    }

    #header a {
        font-size: 32px;
    }
    #frmCatalogSearchMobileTextBox {
        font-size: 36px !important;
        width: 90% !important;
        margin: 50px 0px !important;
    }

    #frmCatalogSearchMobileSearchButton {
        background: url("../images/search_25x25.png") no-repeat!important;
        height: 55px !important;
        width: 55px !important;
        background-color: #2777AA!important;
        background-size: 50px 50px !important;
        background-position: initial!important;
        margin: 50px 0px !important;
    }

    .headerBox {
        /*border: 1px solid;*/
        width: 90%;
        font-size: 2em!important;
        width: 85%;
        display: inline-block!important;
        margin-top: 10px;
    }

    .logouHeaderText {
        font-size: 32px!important;
        font-weight: bold !important;
        color: black !important;
    }

    .headerLogo {
        float: left;
        width: 7em;
        height: 4em;
    }

    .mobileheaderNotUser {
        text-align: right;
    }

    .headerLougout {
        /*border: 1px blue;*/
        float: right;
        margin-top: 10px;
            
    }
    
    .logoutIcon {
        background: url("../images/logout_30.png") no-repeat;
        background-size: 40px 30px !important;
        width: 50px;
        height: 45px;
        display: inline-block;
        position: relative;
        top: 20px;
        margin-left: 10px;
    }
    
    .headerSeparator {
        border: 1px solid #8e8e8e;
        clear: both;
        margin: 15px 8px;
    }

    .hamburger {
        font-size: 100px !important;
        text-decoration: none !important;
        float: left !important;
        margin-left: 20px !important;
        width: 100px;
    }

    .sidr {
        width: 70% !important;
    }
    .hamburgerli {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
        line-height: 4.8em!important;
    }

    .hamburgerli > a > span {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .hamburgerli > a {
        font-size: 48px !important;
    }

    .hamburgerli > div > ul > li > a > span {
        font-size: 36px !important;
        padding-left: 100px !important;
        padding-top: 13px !important;
        padding-bottom: 13px !important;
    }

    /*mobileFriendlyAppear not necessary for these as they both use Display*/
    .mobileTable {
        display: table !important;
    }

    .mobileTable > tbody > tr > td {
        font-size: 36px !important;
    }

    .mobileTable > tbody > tr > td > a {
        font-size: 36px !important;
    }

    .mobileTable > tbody > tr > td > font > b {
        font-size: 36px !important;
    }

    .remainingQuestionsCell {
        PADDING-LEFT: 30px !important;
        padding-right: 50px !important; 
        padding-bottom: 45px !important;
    } 

    .ListTable > tbody > tr > td > b {
        font-size: 36px !important;
    }

    #content .ListTableColumnHeader {
        font-size: 45px !important;
    }

    #content .BoldContentFont {
        font-size: 36px !important;
    }

    #content .BoldContentFontGreen {
        font-size: 36px !important;
    }

    #content .ContentFont {
        font-size: 36px !important;
    }

    #content .HighlightedRow {
        font-size: 40px !important;
    }

    #content .ContentLink {
        font-size: 40px !important;
        font-weight: bold;
        padding-left: 8px;
    }

    #content .ListTableSubHeader {
        font-size: 36px !important;
        padding-bottom: 12px!important;
        padding-top: 12px!important;
        padding-right: 5px!important;
    }

    #content .contentContainer {
        width: 100% !important;
        padding: 0 !important;
    }

    #content .Points {
        font-size: 27px;    
    }

    #content {
        /*font-size: 2em;*/
    }

    #rightnav {
        display: none !important;
    }

    #Button {
        height: 42px;
    }

    #Button:hover > a {
        height: 100% !important;
        line-height: inherit;
    }

    #Button > a {
        height: 100% !important;
        line-height: inherit;
    }

    #Button > a > font {
        height: 100% !important;
        font-size: 36px !important;
    }

    .TextInput {
        font-size: 36px !important;
    }

    .mobileFriendlyNoBackground {
        background: none !important;
    }

    .mobileFriendlyBigFont {
        font-size: 36px !important;
    }

    .mobileFriendlyReallyBigFont {
        font-size: 48px !important;
    }

    #Logon .BoxHeader {
        font-size: 36px !important;
    }

    #Logon .FormField {
        font-size: 24px !important;
    }

    #Logon .Logon {
        line-height: normal !important;
    }

    #Logon .white {
        padding-top: 30px !important;
    }

    #Logon .white a {
        font-size: 24px !important;
    }

    #Logon .BoxContent {
        padding-bottom: 15px !important;
        padding-top: 30px !important;
        padding-right: 60px !important;
        padding-left: 60px !important;
    }

    #clientContent {
        font-size: 36px !important;
    }
    .MsoNormalTable {
        width :610pt !important;
    }

    /*We can't predict or stipulate CMS-controlled content, so just blow up everything*/
    #clientContent * {
        font-size: 36px !important;
    }

    #content .pagingLinkSel {
        font-size: 48px !important;
        width: auto !important;
        height: auto !important;
        line-height: normal !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    #content .pagingLink {
        font-size: 48px !important;
        width: auto !important;
        height: auto !important;
        line-height: normal !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    #content .itemsPerPage {
        font-size: 48px !important;
    }

    #content .itemsPerPage > span {
        font-size: 48px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    #content .itemsPerPage > a {
        font-size: 48px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .editAccountInfoTD {
        width: 100% !important;
        vertical-align: top !important;
        padding-bottom: 40px !important;
    }

    .editAccountInfoTextBox {
        width: 100% !important;
    }

    .mobileRadio {
        height: 36px !important;
        width: 36px !important;
        margin-right: 36px;
    }

    .mobileCheckbox {
        height: 36px !important;
        width: 36px !important;
        margin-right: 36px;
    }

    .mobileText {
        margin-left: 60px;
    }

    .mobilRowGap {
        height: 20px;    
    }

    #content .ListTableBG
    {
        padding-top: 15px!important;
        padding-bottom: 15px!important;
    }

    .mobileQuizTD {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    #Logon .FormField {
        padding-right: 20px !important;
    }

    ol li {
        /*padding-left: 50px;*/
    }
    #clientContent {
        padding-left: 30px;
        padding-right: 30px;
    }
    ol {
        padding-left: 40px;
        padding-right: 20px;
    }

    .footlink {
        /*border: 1px solid;*/
        display: inline;
    }

    .linkseparator {
        font-size: 2em!important;
        padding: 0px 6px 0px 6px!important;
    }
    
    .mobileoverlay {
        display: block;
    }

    #overlay{position:absolute;position:fixed;top:0;left:0;bottom:0;
             right:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.45);z-index:999998;display:none}

}