/*
    Width

    large: > 1000px
    medium: 800px - 1000px
    small: 600px - 800px
    v-small: 390px - 600px



    Height

    large: > 650px
    small: > 650px
*/

body.responsive { width: 100%; height: 100%; padding: 0; margin: 0; background: #fff; color: #333333; font: 8pt Verdana, Tahoma, Arial, sans-serif; }

/* Header (title and toolbar) */
.respHeader { width: auto; background-color: #F4F5F9; text-align: left; font-size: 11px; border-bottom:1px solid #868B91; }
.respHeaderBanner { padding: 0px; }
.respHeaderLogo { vertical-align: middle; }
.respHeaderTitle { font-weight: bold; font-family: tahoma; color: #6D6D6E; vertical-align: middle; }
.respTitleLink { float: right; }
    .respTitleLink a, .respTitleLink a:visited { font-size: larger; color: #AB0534; font-weight: bold; }
        .respTitleLink a:hover { color: #AB0534; text-decoration: none; font-weight: bold; }

#lowResMenu { display: none; position: absolute; left: 0; right: 0; top: 76px; height: 100%; z-index: 9999; background-color: #333333; text-align: left; }
    #lowResMenu > ul { list-style-type: none; padding: 0; margin: 0; }

    #lowResMenu .smallMenuTitle { background-color: #CCCCCC; color: #444444; border-bottom: 1px solid #AB0534; font: bold 16px Segoe UI; text-indent: 5px; padding: 3px; }
        #lowResMenu .smallMenuTitle.noChildren { border-top: 1px solid #FFFFFF; border-bottom-color: #FFFFFF; cursor: pointer; }
            #lowResMenu .smallMenuTitle.noChildren:hover { background-color: #AB0534; color: #FFFFFF; }
    /*#lowResMenu .dropdownContent ul { list-style-type: none; padding: 0 0 0 14px; color: #FFFFFF; }
        #lowResMenu .dropdownContent ul li { padding: 4px; cursor: pointer; }
            #lowResMenu .dropdownContent ul li:hover { background-color: #AB0534; color: #FFF; }
    #lowResMenu .dropdownContent a { color:white; }
        #lowResMenu .dropdownContent a img { vertical-align: middle; margin-right: 7px; }*/

    #lowResMenu > ul > li { padding-bottom: 10px; }
.respHeaderMenu { height: 24px; width: 100%; border-top: 1px solid #868B91; }
    .respHeaderMenu > #lowResButton { height: 100%; text-align: right; }
        .respHeaderMenu > #lowResButton > span { display: inline-block; height: 100%; vertical-align: middle; }
        .respHeaderMenu > #lowResButton > img { vertical-align: middle; max-height: 24px; padding: 6px 10px; cursor: pointer; }
            .respHeaderMenu > #lowResButton > img.on { background-color: #AB0534; }
            .respHeaderMenu > #lowResButton > img:hover { background-color: #AB0534; }

/* Main area (everything under the header) */
.respMain { width: 100%; }

/* Sidebar */
.respSidebar { position: relative; overflow: visible; }
.respSidebarBorder { background-color: #E9EDF1; }
.respSidebarCollapse { background-color: red; padding: 0; cursor: pointer; background-repeat: no-repeat; background-position: center; background-color: transparent; border:none; }

.respSidebarCorner { position: absolute; left: 0; right: 0; bottom: 0; border-top: 1px solid #868B91; border-bottom: 1px solid #868B91; margin-bottom: 22px; background-color: #F4F5F9; }
.respSidebarCornerMenu { display: block; width: 100%; min-width: 100px; font-family: Verdana; font-size: 11px; }
.respSidebarCornerSpacer { position: absolute; bottom: 0; left: 0; right: 0; height: 22px; background-color: #D5D7DA; }
.cornerMenuItem { min-width: 100px!important; }

.cornerMenuItem_Home { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: 0 0; width: 32px; height: 32px; }
.cornerMenuItem_Mail { background-image: url('sprite.png'); background-repeat: no-repeat; background-color: transparent; background-position: -100px -63px; width: 32px; height: 32px; }
.cornerMenuItem_Calendar { background-image: url('sprite.png'); background-repeat: no-repeat; background-color: transparent; background-position: -34px -63px; width: 32px; height: 32px; }
.cornerMenuItem_Pharmacy { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: 0 -32px; width: 32px; height: 28px; }
.cornerMenuItem_HUI { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: 0 -60px; width: 32px; height: 32px; }


/* Content area */
.respContent { width: auto; height: 100%; margin: 0 auto; text-align: left; }
.respContentDisplay { width: auto; }
.respContentPanel { width: auto; background-color: white; height:1000px; }

.respContentTitle { height: auto; line-height: 30px; position: relative; }
    /*.respContentTitle input { position: absolute; width: 90%; top: 0; left: 0; right: 0; bottom: 0; cursor: pointer; }
        .respContentTitle input:hover { border: 1px solid gray; }
        .respContentTitle input:active { border: 1px solid darkslategray; }*/

/*.collapseButton { background-image: url('../App_Themes/Sma/images/DownArrow.png'); background-repeat: no-repeat; background-position: center right 5px; background-color: transparent; border: none; position: absolute; width: 100%; top: 0; left: 0; right: 0; bottom: 0; cursor: pointer; }*/
.collapseButton { position: absolute; width: 100%; top: 0; left: 0; right: 0; bottom: 0; cursor: pointer; }
    .collapseButton::after { content: ''; border: 10px solid transparent; border-top-color: #666; position: absolute; right: 0; margin: 10px; }
    /*.collapseButton:hover { border: 1px solid gray; }*/
        .collapseButton:hover::after { border-top-color: #AB0435; }
    .collapseButton:active { border: 1px solid #034E63; }

.respContentTitle .collapseButton { top: 2px; }

/*.chatButton { position: absolute; width: 100%; top: 0; left: 0; right: 0; bottom: 0; cursor: pointer; border: 1px solid transparent; }
    .chatButton:hover { border-color: lightblue; }*/

/*.sidebarTitle.chatReady { cursor: pointer; background-color: #F5F5F5; border-bottom: 1px solid #AB0534; }*/
.sidebarTitle img, .sidebarTitle strong { vertical-align: middle; }
.respSubtitleRight strong { padding-right: 10px!important; }
.respSubtitleLeft { text-align: left; }

.respSmallSizeLink { height: 32px; display: table-cell; text-align: center; vertical-align: middle; cursor: pointer; }
.respHoverBorder { border-color: #F2CA58!important; }
.respCheckedBorder { border-color: #C2762B!important; }

.chatAlert { text-align: left; cursor: pointer; font-size: 11px; color: black; }
    .chatAlert:hover { background:url('../App_Themes/Office2010Silver/Web/mItemHBack.png') repeat-x scroll left top #FCF9DF; }
.chatText { vertical-align: middle; padding: 2px 0; margin: 4px 0 4px -4px; line-height: 14px; display: inline-block!important; margin: 0 0 0 -4px; }
.chatTextStatus { font-style:italic; }
    .chatTextStatus.chatDisabled::after { content: '(Unavailable)'; }
    .chatTextStatus.chatEnabled::after { content: 'Available'; font-weight: bold; }

.respMenuItemChat.initialSetting { display: none; }
    /*.chatAlert strong { line-height: 20px; color: #333; }*/
.chatImg { vertical-align: middle; margin-left: 8px; }
.chatSpan { vertical-align: middle; margin-left: 1px; }

.collapsible { }
    .collapsible.collapsed { margin-bottom: 0; }
    /*.collapsible.expanded { margin-bottom: 15px; }*/

.surveyPopContentDiv {
    width: 100%;
    height: 100%;
    position: relative;
}

.SurveyPopQuestions {
    position: absolute;
    overflow-y: auto;
    top: 0;
    bottom: 30px;
    left: 0;
    right: 0;
}

.surveyPopButtons {
    position: absolute;
    text-align: center;
    left: 0;
    right: 0;
    bottom: 0;
}

.surveyPopQuestionButtons {
    position: absolute;
    right: 0;
    bottom: 0;
}

.surveyQuestionText {
    display: inline-block;
    padding-bottom: 5px;
}

.surveyQuestionResponse {
    margin-bottom: 10px;
}

.respRoundPanel { width: 45%; margin: 0 auto; }


.authentication iframe {
    max-width: 620px;
    height: 410px;
    width: 100%;
}

/* Width or Height */
@media (min-width:1000px), (min-height:650px) {
    .respContentTitle { text-align: center; }
}

@media (max-width:1000px), (max-height:650px) {
    .respContentTitle { text-align: left; padding-left: 10px; }
    .collapsible.expanded { margin-bottom: 15px; }
    .respSmallMailNav.collapsible.expanded { margin-bottom: 0; }
}

@media (min-width:1000px) {
    /*.longtext { display: initial; }*/
}

@media (max-width:1000px) {
    .longtext { display: none; }
    .respRoundPanel { width: 55%; margin: 0 auto; }
}


/* Width */
@media (min-width:800px) and (min-height:650px) {
    .respSmallSizeWideRow { display: table; width:100%; }
    .respSmallSizeMedRow { display: table-row; }
    .respSmallSizeLink { width: 100%; display: block; text-align: left; padding-left: 40px; height: 26px; }

    .respSmallSizeButton { width: auto; height: 100%; text-align: left; border-style: none; }

}

@media (max-width:800px) {
    .respSmallSizeLink { display: table-cell; }
}

@media (min-width:600px) and (max-width:800px), (max-height:650px) {
    .respSmallSizeWideRow { display: table-row; }
    .respSmallSizeMedRow { display: table-cell; }
    .respSmallSizeLink { width: 25%; }
}

@media (max-width:600px) {
    .respSmallSizeWideRow { display: table; width: 100%; }
    .respSmallSizeMedRow { display: table-row; }
    .respSmallSizeLink { width: 50%; }
    .respRoundPanel { width: 100%; margin: 0; }
}


/* Height */
/*@media (min-height: 650px) {
    .cornerMenuItem_Home { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: 0 0; width: 32px; height: 32px; }
    .cornerMenuItem_Mail { background-image: url('sprite.png'); background-repeat: no-repeat; background-color: transparent; background-position: -100px -63px; width: 32px; height: 32px; }
    .cornerMenuItem_Calendar { background-image: url('sprite.png'); background-repeat: no-repeat; background-color: transparent; background-position: -34px -63px; width: 32px; height: 32px; }
    .cornerMenuItem_Pharmacy { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: 0 -32px; width: 28px; height: 28px; }
    .cornerMenuItem_HUI { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: 0 -60px; width: 32px; height: 32px; }
}

@media (max-height: 650px) {
    .cornerMenuItem_Home { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: -34px -11px; width: 18px; height: 18px; }
    .cornerMenuItem_Mail { background-image: url('sprite.png'); background-repeat: no-repeat; background-color: transparent; background-position: -135px -96px; width: 16px; height: 16px; }
    .cornerMenuItem_Calendar { background-image: url('sprite.png'); background-repeat: no-repeat; background-color: transparent; background-position: -154px -119px; width: 16px; height: 16px; }
    .cornerMenuItem_Pharmacy { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: -35px -40px; width: 18px; height: 18px; }
    .cornerMenuItem_HUI { background-image: url('../App_Themes/Sma/images/sprites/SmaSprite.png'); background-color: transparent; background-position: -35px -70px; width: 18px; height: 18px; }
}*/

.respLargeMailNav { display: none; }
.respSmallMailNav { width: 100%; height: auto; }

/* Width and Height */
@media (min-width: 800px) and (min-height:650px) {

    .respHeaderLogo { width: auto; }
    .respHeaderTitle { font-size: x-large; }
    .respTitleLink a { font-size:larger; }

    .respContent { overflow: auto; }
    .respHeaderMenu > #lowResButton { display: none; }

    body.responsive { overflow: hidden; }

    .respSidebar { float: left; width: 25%; max-width: 260px; min-width: 125px; height: 100%; border-right: 1px solid #868B91; }
    .respSidebarBorder { float: left; width: 6px; height: 100%; border-right: 1px solid #868B91; }
    .respSidebarCollapse { width: 6px; height: 30px; background-image: url('../App_Themes/Sma/images/SmallLeftArrow.png'); }

    .respContentTitle { font-size: 14px; }
        .respContentTitle .collapseButton { display: none; }

    .chatAlert { padding-bottom: 7px; border-bottom: 1px solid #999; }
        .chatAlert:hover { background: url('../App_Themes/Office2010Silver/Web/mItemHBack.png') repeat-x scroll left top #FCF9DF; }
}

@media (min-width: 800px) and (min-height:650px) {
    .sidebarTitle { font: 12px verdana; text-align: left; line-height: 24px; padding-left: 10px; }
}

@media (max-width: 800px), (max-height:650px) {

    .respHeaderLogo { width: 62px; }
    .respHeaderTitle { font-size: x-small; }
    .respTitleLink a { font-size: x-small; }
    .respTitleLink { margin: 2px; }

    .respHeaderMenu { height: 30px; }

    #fullSizeMenu { display: none; }

    .respSubtitleRight { position: absolute; top: 0; bottom: 0; right: 22px; }

    .respContent { overflow: visible; }

    body.responsive { overflow: auto; }

    .respSidebar {float: none; width:100%; max-width:none; min-width:50px; height:auto; border-right:none; }
    .respSidebarBorder { display: none; float: none; width: 100%; height: 6px; border-right: none; border-bottom: 1px solid #868B91; }
    .respSidebarCollapse { display: none; }
    .respSidebarCorner { position: static; background-color: transparent; border-top-style: none; border-bottom-style: none; margin-bottom: 0; }
    .respSidebarCornerSpacer { display: none; }
    .respMenuItemHidden { display: none; }

    .respSmallMailNav { padding: 4px 0; }
    .respSmallSizeMailLinks { width: 95%; display: table; margin: 10px auto; }

    .respSmallSizeButton { width: 100%; height: 100%; font-size: 12px!important; font-weight: bold!important; min-width: 100px; text-align: center; border-color: #CCC!important; }
    .respSmallSizeLinkSpacer { width: 1px; background-color: #CCC; }


    .respContentTitle { font-family: Segoe; background-color: #F5F5F5; color: #666666; font-size: 18px; border-top: 1px solid #999; border-bottom: 1px solid #AB0534; }
        .respContentTitle strong { padding-right: 30px; }
        .respContentTitle .collapseButton { display: inherit; }

    .chatAlert { margin-bottom: 15px; border-bottom: 1px solid #999; }
    .chatButton { background-color: #F5F5F5; padding: 2px 10px; }
        .chatButton:hover { background-color: #FCF9DF!important; }
}

@media (max-width:390px) {
    .tinyTrim { display: none; }
    .respSmallSizeButton { font-size: 10px!important; }
    .clinImg { display: none; }
    .respSubtitleRight { font-size:14px; }
}