/* fixes for mobile browsers*/
@media screen and (max-width: 640px) {
    body {
        font-size: 0.9em !important;
    }
    .ui-btn {
        background-color: #e6e6e6 !important;
    }
    div.content_wrapper, div.inner_wrapper, div.m_wrapper {
        margin: 0px 10px;
        padding: 10px 0px !important;
        text-align: left !important;
        background-color: #f2f2f2 !important;
    }
    
    .navWrapper {
        width: 100% !important;
    }
    img.homeImg {
        width: 90vw !important;
        height: auto !important;
    }

    img.bannerImg {
        width: 100% !important;
        height: auto !important;
    }
    img .hotelMap {
        width: 100% !important;
        height: auto !important;
    }
    .flexLeft, .flexRight {
        flex: 1 100% !important;
        min-width: 100% !important;
        flex-wrap: nowrap;
    }
    .flexPad {
        padding-top:15px;
    }

    /* Telerik overrides */
    .RadGrid, .RadEditor {
        width: 98% !important;
    }
    .gridSearch, .gridSearchModal, .gridLocation {
        flex: 1 100% !important;
        min-width: 100% !important;
        flex-wrap: nowrap;
    }
    div.message, #radioOption {
        clear: both;
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        flex-flow: row wrap;
    }
    div.messageLeft, div.messageeRight, div.messageFloatLeft, div.messageFloatRight {
        flex: 1 100% !important;
        width: 100% !important;
        flex-wrap: nowrap;
    }
    div.messageeRight {
        padding-top:5px;
    }
    div.ui-input-text {
        width: 96% !important;
    }

    .formfield .ui-input-text input {
        width: 96% !important;
    }
    .subject textarea, .subject div.ui-input-text {
        width: 96% !important;
    }
    .radio .ui-radio .rfdRadioUnchecked, .radio .ui-radio .rfdRadioChecked {
        display: none !important;
    }
    .radio .ui-radio .rfdRadioUnchecked > label, .radio .ui-radio .rfdRadioChecked {
        display: none !important;
    }
    .radio .ui-radio > label {
        display: inline !important;
    }
    #radioAlign {
        display: inline-block;
    }
    .spacer {
        flex: 1 5% !important;
        max-width: 5%;
    }

    .leftCol {
        display:none !important;
    }
    .RightCol {
        flex: 1 93% !important;
        max-width: 93%;
        padding-left: 5px;
        font-size: 0.9em;
        text-align: left;
    }
    div.meeting .col1 {
        text-align: left;
    }
    div.meeting .colDate {
        width: 80%;
        float: left;
        padding-left: 10px;
    }
    .alert {
        position: -webkit-sticky;
    }
    /* re-doing the messgaing to be from <br /> subject in one column */    
    /* to or from name */
    div.messaging .col2, div.messagingBold .col2 {
        width: 65%;
        float: left;
        padding-left: 5px;
    }
    /* message date */
    div.messaging .col4, div.messagingBold .col4 {
        width: 25%;
        float: left;
        padding-left: 5px;
    }   

    .mHeader .col2 {
        width: 65%;
        float: left;
        padding-left: 5px;
    }
    .mHeader .col4 {
        width: 25%;
        float: left;
        padding-left: 5px;
    }
}