﻿/* RWD CASCADING STYLE SHEET */
/* HEALTH INVENTOR */
/* 2016 04 14 CREATED BY RTISTECH */
/* CSS RULES: MOBILE DEVICE FIRST */

/* Clear Styles */
.clear{ content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix:after, .clearfix:before{ clear: both; content: '\0020'; display: block; visibility: hidden; width: 0; height: 0;}

/* HTML & BODY */
html, body, form {
    width: 100%;
    padding: 0;
    margin: 0;
    -ms-text-size-adjust: none;
    text-size-adjust: none;
}

body {
    /* Background Color */
    background-color: #FFFFFF;

    /* Background Image */
    /* background: url(../images/Default/Background.png) repeat-y #FFF; */
    /* background-size: 100%; */

    /* Default Font Family */
    /* Check CN.CSS */

    /* Drfault Font Attributes */
    font-size: 16px;
    font-weight: 300; /* Now we love slim characters */
    -webkit-font-smoothing: antialiased;

    /* Default Font Color */
    color: #333333;

    /* Default Line Height */
    line-height: 2.0em;
    letter-spacing: 0em;

}

/* Outtermost Wrapper */
.wrapper { overflow: hidden; }

/* label */
label {
    font-weight: 300!important;
}

/* Multimedia Style */
.video embed, .video object, .video iframe { width: 100%; height: auto; }

/* Horizontal Line Styles */
hr { border-top: 1px solid #dddddd; margin-top: 15px; margin-bottom: 15px; }

/* Default Image Style */
img { max-width: 100%; height: auto; width: auto\9; /* for ie8 */ }

/* Default Html Link Style */
a { text-decoration: none; outline: 0; color: #333333; }
a.btn:focus{ outline: 0; }
a:hover { text-decoration: none; color: #4472C4; outline: 0; }
a:focus { text-decoration: none; color: #4472C4; outline: 0; }

/* Default Header Text Style */
h1 {font-size: 55px;}
h2 {font-size: 45px;}
h3 {font-size: 30px;}
h4 {font-size: 25px;}
h5 {font-size: 20px;}

h1,h2,h3,h4,h5,h6 {
    color: #231F20;
    font-weight: 100; /* Now we love slim characters */
    text-transform: uppercase;
}

/* Default Paragraph Style */
p { margin: 0;}

/* << RCRM Styles >> */

/* Category Menu Control*/
#TopCatBottom { visibility: visible }
@media only screen and (min-width: 768px) {
    #TopCatBottom { display: none; }
}
#TopCatTop { visibility: visible }
@media only screen and (max-width: 768px) {
    #TopCatTop { display: none; }
}

/* Header bottom space for Top Navigator */
.HeaderPushDown { height: 50px; }

@media only screen and (min-width: 768px) and (max-width: 991px) { 
    .HeaderPushDown { height: 50px; }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) { 
    .HeaderPushDown { height: 50px; }
}
@media only screen and (min-width: 1200px) { 
    .HeaderPushDown { height: 50px; }
}

.NavWrap {
    border-bottom-color: #CCC;
    border-bottom-style: solid;
}
/* Footer Lead Space */
.FooterLeadSpace { height: 0; }

/* Bottom Space */
.BottomSpace { height: 8px;}

/* Page Title Text */
.PageTitle {
    font-size: 1.4em; font-weight: 100; color: #231F20;
}

/* Title */
.TopicTitle {
    font-size: 1.4em; font-weight: 100; color: #333333;
}

/* Paragraph Font Size base on default font size */
.p1  { font-size: 1.2em; font-weight: 300;}
.p2  { font-size: 1.4em; font-weight: 300;}
.p3  { font-size: 1.6em; font-weight: 200;}
.p4  { font-size: 1.8em; font-weight: 200;}
.p5  { font-size: 2.0em; font-weight: 100;}
.p6  { font-size: 2.2em; font-weight: 100;}
.p7  { font-size: 2.4em; font-weight: 100;}
.p8  { font-size: 2.6em; font-weight: 100;}
.p9  { font-size: 2.8em; font-weight: 100;}
.p10 { font-size: 3.0em; font-weight: 100;}

/* Text justification also for Chinese characters */
.justfy {
    text-align: justify;
    -ms-text-justify: inter-ideograph;
    text-justify: inter-ideograph;
}

/* Narrow screen do not justify text */
.varJustify { text-align: left; text-justify: none; }
@media only screen and (min-width: 768px) {
    .varjustify {
        text-align: justify;
        -ms-text-justify: inter-ideograph;
        text-justify: inter-ideograph;
    }}

/* Text alignments */
.center{text-align: center; margin: 0 auto;}
.left {text-align: left; margin: 0 auto;}
.right {text-align: right; margin: 0 auto;}

/* Narrow screen align left */
.varRight {text-align: left}
@media only screen and (min-width: 768px) { .varRight {text-align: right} }

/* Bold Text */
.bold { font-weight: bold;}

/* Color Code */
.white       { color: #FFFFFF; }
.silver      { color: #CCCCCC; }
.lightgray   { color: #A0A0A0; }
.gray        { color: #808080; }
.darkgray    { color: #0C0C0C; }
.red         { color: #FF4040; }
.msred       { color: #E81123; }
.lightred    { color: #FF8080; }
.darkred     { color: #FF1010; }
.orange      { color: #FF7F00; }
.appleOrange { color: #F46C0E; }
.yellow      { color: #D6AC3C; }
.lightgold   { color: #DFAE2E; }
.gold        { color: #A17345; }
.lightblue   { color: #66CCFF; }
.blue        { color: #83A0D8; }
.darkblue    { color: #4472C4; }
.purple      { color: #b200ff; }
.green       { color: #3EB991; }
.RTISGreen   { color: #52A480; }
.black       { color: #000000; }

/* Textbox font color for second language */
.textBox { opacity: 0.95; }
.textBoxEn { opacity: 0.95; color: #83A0D8!important; }

.txtUserID {
    background: url(../images/default/UserIDLeft.png) no-repeat center left #FFFFFF!important;
    background-size: 18px!important;
}

.txtPassword {
    background: url(../images/default/PwdLeft.png) no-repeat center left #FFFFFF!important;
    background-size: 18px!important;
}

.TextOverFlowHidden {
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    width: 100%;
}

/* << Bootstrap Tooltip >> */
.tooltip-inner { background-color: #FFF; color: #333; min-width: 120px; padding:8px; border: solid 1px #CCC; }
.tooltip.top .tooltip-arrow { border-top-color: #FFF; }
.tooltip.right .tooltip-arrow { border-right-color: #FFF; }
.tooltip.bottom .tooltip-arrow { border-bottom-color: #FFF; }
.tooltip.left .tooltip-arrow { border-left-color: #FFF; }

/* << Custom Telerik Controls Styles >> */
.rbSelected.rbButton.RadButton_Bootstrap, .rbToggled.rbButton.RadButton_Bootstrap, .rbSelected.rbButton.RadButton_Bootstrap 
.rbSplitPart { 
    box-shadow: none!important;
    background-color: #F8F8F8!important;
}

.RadDataPager_Bootstrap .rdpNumPart a.rdpCurrentPage {
    background-color: #E0E0E0!important;
    border: 1px solid #CCC!important;
    color: #333!important;
}

.RadGrid_Bootstrap .rgPagerCell .rgNumPart a.rgCurrentPage {
    background-color: #E0E0E0!important;
    border: 1px solid #CCC!important;
    color: #333!important;
}

.RadGrid_Bootstrap .rgPagerCell p{
    background: #FFFFFF!important;
}

.RadGrid .rgPagerCell .rgNumPart a, .RadGrid .rgPagerCell .rgPagerButton, .RadGrid .rgPagerCell .rgActionButton {
    padding: 3px!important;
}

.RadGrid_Bootstrap .rgPagerCell .rgNumPart a, .RadGrid_Bootstrap .rgPagerCell .rgActionButton {
    width: 1.30em!important;
}

/* Telerik Button Border Color */
span.rbSkinnedButton.RadButton_Bootstrap, span.rbLinkButton.RadButton_Bootstrap, span.rbVerticalButton.RadButton_Bootstrap, span.rbDisabled.RadButton.RadButton_Bootstrap, span.rbDisabled.RadButton.RadButton_Bootstrap:hover, span.rbDisabled.RadButton.RadButton_Bootstrap:active, span.rbDisabled.RadButton.RadButton_Bootstrap:focus {
    border-color: #cccccc!important;
}

.RadGrid_Bootstrap .rgAltRow > td {
    background-color: #FFFFFF !important;
}

.RadGrid_Bootstrap .rgHeader, .RadGrid_Bootstrap th.rgResizeCol, .RadGrid_Bootstrap .rgHeaderWrapper {
    background-color: #FFFFFF
}

.RadGrid_Bootstrap .rgHeader, .RadGrid_Bootstrap .rgCommandRow {
    background-color: #FFFFFF
}

.RadGrid .rgHeader, .RadGrid th.rgResizeCol {
    padding-top: 10px;
}

.RadGrid_Bootstrap .rgRow > td, .RadGrid_Bootstrap .rgAltRow > td {
    border-width: 1px;
    border-color: #F0F0F0;
}

.RadGrid_Bootstrap .rgHeader, .RadGrid_Bootstrap th.rgResizeCol, .RadGrid_Bootstrap .rgHeaderWrapper, .RadGrid_Bootstrap .rgMultiHeaderRow th.rgHeader, .RadGrid_Bootstrap .rgMultiHeaderRow th.rgResizeCol {
    border-top: 1px solid #F0F0F0;
    border-right: 1px solid #F0F0F0;
    border-left: 1px solid #F0F0F0;
    border-bottom: 1px solid #F0F0F0;
}

.RadGrid .rgRow > td, .RadGrid .rgAltRow > td, .RadGrid .rgEditRow > td, .RadGrid .rgFooter > td {
    vertical-align: middle;
    max-width: 0!important;
}

.RadGrid_Bootstrap .rgMasterTable .rgSelectedCell, .RadGrid_Bootstrap .rgSelectedRow td, .RadGrid_Bootstrap td.rgEditRow .rgSelectedRow, .RadGrid_Bootstrap .rgSelectedRow td.rgSorted {
    color: #333!important;
    border-color: #DDDDDD;
    background: #F0F5FB!important;
}

.RadGrid_Bootstrap .rgFooterWrapper, .RadGrid_Bootstrap .rgFooter {
    background-color: transparent!important;
}

.RadGrid_Bootstrap .rgPagerCell {
    background-color: transparent!important;
}

/* Telerik RadButton -> Radio Button*/
span.RadButton_Bootstrap .rbPrimaryIcon, span.RadButton_Bootstrap .rbSecondaryIcon { top: 12px!important; }

.rbText {
    padding-top: 2px!important;
}

.RadButton .rbToggleRadio::before {
    content: ""!important;
}

.RadButton .rbToggleRadioChecked::before {
    content: ""!important;
}

span.RadButton_Bootstrap .rbDecorated {
    font-family: "Microsoft YaHei", "Droid Sans Fallback", Arial, Helvetica, sans-serif!important;
}

.RadUpload .ruButton .ruBrowse {
    font-family: "Microsoft YaHei", "Droid Sans Fallback", Arial, Helvetica, sans-serif!important;
}