/*********************************************************/

html, body {
    height: 100%;
    font-family: Lucida Grande, "Hiragino Kaku Gothic ProN",
        "\u30d2\u30e9\u30ae\u30ce\u89d2\u30b4 ProN W3", Meiryo,
        \u30e1\u30a4\u30ea\u30aa, sans-serif;
    font-size: 12px;
    line-height: 1.42857143;
    color: #333;
    background-color: #fff;
     -ms-overflow-style: scrollbar;
}

input:not([type]):focus:not([readonly]),
input[type=text]:focus:not([readonly]),
input[type=password]:focus:not([readonly]),
input[type=email]:focus:not([readonly]),
input[type=url]:focus:not([readonly]),
input[type=time]:focus:not([readonly]),
input[type=date]:focus:not([readonly]),
input[type=datetime]:focus:not([readonly]),
input[type=datetime-local]:focus:not([readonly]),
input[type=tel]:focus:not([readonly]),
input[type=number]:focus:not([readonly]),
input[type=search]:focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #26a69a !important;
    box-shadow: 0 1px 0 0 #26a69a !important;
    transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
}

input[type=text]::-ms-clear {
    display: none;
}

span[disabled] > span {
    color: #ccc;
    cursor: not-allowed;
}

input[disabled] {
    border: none;
    background: none;
    border: 1px solid #ccc;
    background-color: #eee !important;
}

.autocomplete > input[disabled] {
    border: 1px solid #ccc;
    background-color: #eee !important;
}

.autocomplete  input[disabled] {
    border: 1px solid #ccc;
    background-color: #eee !important;
}

.autocomplete-double  input[disabled] {
    border: 1px solid #ccc;
    background-color: #eee !important;
}

.autocomplete-button > input[disabled] {
    border: 1px solid #ccc;
    background-color: #eee !important;
}

.autocomplete input[disabled].disabled{
    border: none !important;
    background: none !important;
    border: 1px solid #ccc;
    background-color: #eee !important;
}

textarea[readonly]{
    border: 1px solid #ccc;
    background-color: #eee !important;
}

.autocomplete > button[disabled], .autocomplete-button > button[disabled]{
/**
  background-color: #dcdeba  !important;
    background-image: none;
    border: none;
    opacity: 1;
    top: 0;
*/
}

.select2-container--disabled.select2-container--focus span:focus, input[readonly]:focus{
    outline:none;
    webkit-box-shadow:none;
    box-shadow: none;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    border: 1px solid #ccc;
    background-color: #eee !important;
}

.select2-container--disabled .select2-selection--single > .select2-selection__arrow b{
    display: none;
}



.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus,
    .btn.active.focus, .btn-default-dot-benefit:focus, .btn-default-dot-benefit:active:focus
    {
    /** border-color: transparent; */
    outline: none !important;
}

.button-footer{
    /* position: fixed;
    bottom: 30px; */
}

.error {
    border: 1px solid #F44336 !important;
}

.tooltip-error>.tooltip-inner {
    background-color: #F44336;
    border-radius: 0px;
}

.tooltip-inner {
    width: auto;
}

.main-footer {
    background: #fff;
    color: #444;
    border-top: 1px solid #d2d6de;
    position: fixed;
    width: 100%;
    z-index: 10000;
    padding-left: 15px;
    bottom: 0px;
}

#wrap {
    margin: 0 auto;
    height: 100%;
    padding: 0 0 48px;
    margin-bottom: -48px;
}

#content {
    background-color: #FFF;
    margin-top: 100px;
    min-width: 1024px;
    min-height: 87%;
    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.32), 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 4px 0px rgba(0, 0, 0, 0.12);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.32), 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 4px 0px rgba(0, 0, 0, 0.12);
    margin-left: 15px;
    margin-right: 3px;
}

.panel {
    border-radius: 0px;
}

.panel-heading {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.benefit-form-control {
    border-radius: 0;
    outline: none;
    font-size: 1rem;
    padding: 0 5px;
    box-shadow: none;
    box-sizing: content-box;
    transition: all 0.3s;
    height: 23px;
    display: block;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    float: left;
}


.benefit-form-control:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px
        rgba(102, 175, 233, .6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px
        rgba(102, 175, 233, .6);
}

.benefit-form-control.input-md{
    width: 100%;
}

.benefit-form-control .error {
    border: 1px solid #F44336 !important;
}

#content .input-group>.benefit-form-control {
    height: 23px;
    width: 100%;
}

#content  .input-group-addon {
    border-radius: 0px;
    left: 12px;
    position: relative;
}

.form-horizontal .control-label {
    margin-bottom: -10px;
    text-align: right;
    font-weight: 600;
}

.form-horizontal .control-label-required {
    padding-top: 5px;
    margin-bottom: -10px;
    text-align: right;
    font-weight: 600;
}

.form-horizontal .control-label-required::after {
    /* content: "\2022"; */
    content: "\203B";
    color: red;
    font-weight: bold;
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2,
    .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3,
    .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5,
    .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
    .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8,
    .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9,
    .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11,
    .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12
    {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 0px;
    float: left;
    cursor: pointer;
}

.btn {
    border-radius: 0px;
    padding: 3px 12px;
}
/* -------- END Sticky footer styles ------------------ */
/*********************************************************/

/*                 Template Layout                       */

/*********************************************************/
::-webkit-scrollbar-thumb {
    border-radius: 1em;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #999;
}

::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 1em;
}

::-webkit-scrollbar-track:hover {
    background: rgba(110, 110, 110, 0.25);
}

#wrap:before, #top:before, .head:before, #footer:before, #wrap:after,
    #top:after, .head:after, #footer:after {
    display: table;
    content: " ";
}

#wrap:after, #top:after, .head:after, #footer:after {
    clear: both;
}

#wrap {
    background-color: #f8f8f8;
    padding-right: 10px;
}

#right {
    display: none;
}

.hidden{
  display: none;
}

@media ( min-width : 768px) {
    #left {
        position: relative;
        float: left;
        width: 100px;
    }
    #left #menu.affix {
        position: fixed;
        top: 0px;
        width: 100px;
        overflow-x: hidden;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }
    #left #menu.affix:hover {
        overflow-y: scroll;
    }
    #left #menu.affix>li:last-child>a:last-child {
        /*border-bottom: 1px solid rgba(0, 0, 0, 0.3);*/
        /*box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05), 0 1px 0 rgba(255, 255, 255, 0.05) inset;*/

    }
    body.padTop53 #left #menu.affix {
        top: 53px;
    }
    .side-right #left {
        float: right;
    }
    #content {

    }
    .side-right #content {
        margin-right: 100px;
        margin-left: 0;
    }
    #left {
        margin-bottom: -10px;
    }
}

@media ( min-width : 992px) {
    #left {
        width: 220px;
    }
    #left #menu.affix {
        width: 220px;
    }
    .mini-sidebar #left {
        width: 100px;
    }
    .mini-sidebar #left #menu.affix {
        width: 100px;
    }
    .side-right #content {
        margin-right: 220px;
    }
    .mini-sidebar #content {
        margin-left: 100px;
    }
    .mini-sidebar.side-right #content {
        margin-right: 100px;
        margin-left: 0;
    }
}

@media ( min-width : 768px) {
    .hide-sidebar #left, .hide-sidebar #right {
        display: none;
    }
    .hide-sidebar #content {
        width: 100% !important;
        margin: 0 !important;
    }
}

@media ( min-width : 1200px) {
    body.fixed #wrap, body.fixed #footer, body.fixed #top .navbar.navbar-fixed-top
        {
        max-width: 1170px;
        margin-right: auto;
        margin-left: auto;
    }
}

/* ================== END Template Layout ============== */

/* BEGIN TOP bar */
#top>.navbar .dropdown-menu>li>a:hover, #top>.navbar .dropdown-menu>li>a:focus
    {
    background-repeat: repeat-x;
    background-image: linear-gradient(to bottom, #EEECEC 0%, #E2E2E2 100%)
        !important;
}

#top>.nav>li>a:hover, #top>.nav>li>a:focus {
    text-decoration: none;
    background-color: transparent;
}

#top .navbar-header-title {
    color: #FFF;
    font-size: 22px;
    position: absolute;
    padding-top: 5px;
    padding-left: 5px;
}

#top .navbar {
    margin-bottom: 0;
    border: 1px solid #cccccc;
    background-color: #FF9900;
    min-height: 50px;
    min-width: 490px
}

#top .navbar-brand {
    padding: 3px;
    height: 42px;
}

#top .navbar-header {
    margin-left: 12px;
    float: left;
}

#top .topnav {
    margin: 10px 15px 10px auto;
}

#top .navbar-top-links li {
    display: inline-block;
}

#top .navbar-right {
    margin-right: 1px;
    float: right;
}

#top .navbar-right li a {
    padding: 0px;
}

#top .navbar-right .dropdown-logout {
    background-color: #FFCC66;
    min-width: 90px;
    text-align: center;
    line-height: 43px;
    color: #596E60;
    font-weight: 700;
}

#top .navbar-right .dropdown-user {
    padding-right: 40px;
}

#top .navbar-right .dropdown-user a {
    /*  bottom: 9px; */
    font-size: 16px;
}

#top .top-breadcrumb-menu {
    margin-top: 45px;
    z-index: 1030;
    right: 0;
    left: -19px;
    position: fixed;
    padding-left: 34px;
    padding-bottom: 2px;
    padding-top: 2px;
    /* box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.32), 0 1px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 4px 0px rgba(0, 0, 0, 0.12); */
    background-color: #eee;
    border-bottom: 1px solid #ccc;
}

@media ( min-width : 768px) {
    #top .topnav {
        float: right;
    }
}

/* END TOP bar */
/* BEGIN header.head bar */
#menu-toggle {
    float: right;
    margin-left: 15px;
}

/** END header.head bar */
/*********************************************************/

/*          Begin LEFT Styles                           */

/*********************************************************/
.user-media {
    display: none;
    color: #0029FF;
    border-right: 1px solid rgb(216, 215, 215);
    border-left: 1px solid rgb(216, 215, 215);
}

@media ( min-width : 768px) {
    .user-media {
        display: block;
    }
    .user-media .media-body {
        display: none;
    }
    .user-media .user-link {
        position: relative;
        display: block;
        margin-right: auto;
        margin-left: auto;
    }
    .user-media .user-link .user-img {
        margin: 10px auto;
    }
    .user-media .user-link .user-label {
        position: absolute;
        top: -6px;
        right: 6px;
    }
}

@media ( min-width : 992px) {
}

@media ( min-width : 768px) {
}

/* ============== END LEFT Styles ================= */
#menu {
    position: relative;
    overflow: hidden;
    border-right: 1px solid rgb(216, 215, 215);
    border-left: 1px solid rgb(216, 215, 215);
    background-color: #f8f8f8;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05);
}

#menu, #menu ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

@media ( min-width : 768px) {
    #menu.collapse {
        display: inherit !important;
    }
}

#menu>li {
    position: relative;
    display: block;
    margin: 0;
    border-width: 0;
    border-radius: 0;
}

#menu>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
    color: #1933EC;
    border-top: 1px solid rgb(216, 215, 215);
}

#menu>li>a:hover, #menu>li>a:focus {
    color: #fff;
    text-decoration: none;
    background-color: #428bca;
    outline: none;
}

#menu>li>a .label {
    float: right;
}

#menu>li.active>a {
    color: #fff;
    background-color: #428bca;
}

#menu>li.panel {
    background-color: transparent;
}

#menu li>a {
    text-decoration: none;
}

#menu ul {
    padding: 5px 0 5px 15px;
    border-top: 1px solid rgb(216, 215, 215);
    -webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, 0.05) inset;
    box-shadow: 0 1px 0px rgba(255, 255, 255, 0.05) inset;
}

#menu ul a {
    display: block;
    padding: 10px 0;
    font-size: 14px;
}

#menu>li.active>a {
    position: relative;
}

#menu>li.panel.active ul>li.active>a:after {
    position: absolute;
    right: 0;
    border-color: transparent #6e6e6e transparent transparent;
    border-style: solid;
    border-width: 10px;
    content: "";
}

.row {
    margin-right: 0px;
    margin-left: 0px;
    min-height: 23px;
}

.form-horizontal .row {
    margin-bottom: 2px;
}

.form-horizontal .select {
    height: 30px !important;
}

.panel-primary {
    border-color: #ccc;
}

.panel-primary>.panel-heading {
    background-color: #f0ad4e;
    color: #333;
    border-bottom: 2px solid #f0ad4e;
    padding: 5px 15px !important;
    height: 33px;
}

.panel-title {
    margin-top: 3px;
    margin-bottom: 0;
    font-size: 14px;
    color: white;
}

.col-md-1-btn {
    width: 28px;
    float: left;
    border-left: 1px solid #bbb8b8 !important;
    border-top: 1px solid #bbb8b8 !important;
    border-bottom: 1px solid #bbb8b8 !important;
}

.col-md-button {
    float: left;
    border-bottom: 1px solid #bbb8b8;
    border-top: 1px solid #bbb8b8;
    background: #bbb8b8;
}

.col-md-1-input>label {
    width: 25px;
    height: 30px;
    float: left;
    border-left: 1px solid #bbb8b8 !important;
    border-top: 1px solid #bbb8b8 !important;
    border-bottom: 1px solid #bbb8b8 !important;
    margin-bottom: 0px;
}

.border-left {
    border-left: 1px solid #bbb8b8 !important;
}

.border-left-transparent {
    border-left: transparent !important;
}

.border-right {
    border-right: 1px solid #bbb8b8 !important;
}

.border-right-transparent {
    border-right: transparent !important;
}

.border-bottom {
    border-bottom: 1px solid #bbb8b8 !important;
    margin-bottom: -1px;
}

.border-bottom-transparent {
    border-bottom: transparent !important;
}

.border-top {
    border-top: 1px solid #bbb8b8 !important;
}

.border-top-transparent {
    border-top: transparent !important;
}

.border-none {
    border-top: transparent !important;
    border-bottom: transparent !important;
    border-right: transparent !important;
    border-left: transparent !important;
}

.btn-default-dot-benefit {
    height: 29px;
    width: 30px;
    background-color: #ccc !important;
    background-image: radial-gradient(#808080 15%, transparent 16%),
        radial-gradient(#9d9d9d 15%, transparent 16%);
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    border-radius: 0px;
    border-bottom: 3px solid #777;
    border-right: 3px solid #777;
    float: right;
    position: absolute;
    right: -11px;
    top: 0;
}

.btn-default-tongue-benefit {
    height: 30px;
    width: 25px;
    background-color: #FFF;
    background-image: linear-gradient(#333 2px, transparent 2px),
        linear-gradient(90deg, #333 2px, transparent 2px),
        linear-gradient(rgba(255, 255, 255, .3) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .3) 1px, transparent 1px);
    background-size: 5px 5px, 5px 10px, 20px 20px, 20px 20px;
    background-position: -2px -2px, -2px -2px, -1px -1px, -1px -1px;
    border-radius: 0px;
    border-bottom: 3px solid #777;
    border-right: 3px solid #777;
    float: left;
}

.text-dot-2-benefit {
    width: 90.4%;
    float: left;
}

.text-dot-4-benefit {
    width: 95.4%;
    float: left;
}

.btn-default-benefit {
    height: 23px;
    width: 70px;
    border-radius: 0px;
    border-bottom: 3px solid #777;
    border-right: 3px solid #777;
    border-top: 0px;
    background-color: #ccc !important;
}

.btn-default-benefit:hover {
    background-color: #DDD !important;
}

.md-checkbox {
    position: relative;
    height: 17px;
}

/* checkbox css */
.md-checkbox.md-checkbox-inline {
    display: inline-block;
}

.form-inline .md-checkbox.md-checkbox-inline {
    margin-right: 20px;
    top: 3px;
}

.md-checkbox input[type=checkbox] {
    visibility: hidden;
    position: absolute;
}

.md-checkbox label {
    cursor: pointer;
    padding-left: 13px;
    padding-top: 0px !important;
    font-weight: 500;
    margin-bottom: 0px;
}

.md-checkbox label>span {
    display: block;
    position: absolute;
    left: 0;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.md-checkbox label>span.inc {
    background: #fff;
    left: 0px;
    top: -8px;
    height: 29px;
    width: 29px;
    opacity: 0;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
}

.md-checkbox label>.box {
    top: -1px;
    left: 0px;
    border: 1px solid #9FA4AB;
    height: 20px;
    width: 20px;
    z-index: 5;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.md-checkbox label>.check {
    top: -9px;
    left: 6px;
    width: 10px;
    height: 20px;
    border: 2px solid #26A69A;
    border-top: none;
    border-left: none;
    opacity: 0;
    z-index: 5;
}

.md-checkbox label>span.inc {
    -webkit-animation: growCircle 0.3s ease;
    -moz-animation: growCircle 0.3s ease;
    animation: growCircle 0.3s ease;
}

.md-checkbox label>span.text {
   position: absolute;
    top: 2px;
    left: 31px;
    z-index: 7;
}

.md-checkbox input[type=checkbox]:checked ~ label>.box {
    opacity: 0;
}

.md-checkbox input[type=checkbox]:checked ~ label>.check {
    opacity: 1;
    -webkit-transform: scale(1) rotate(45deg);
    -moz-transform: scale(1) rotate(45deg);
    transform: scale(1) rotate(45deg);
}

.md-checkbox input[type=checkbox]:disabled ~ label, .md-checkbox input[type=checkbox][disabled]
    ~ label {
    cursor: not-allowed;
    opacity: 0.7;
    filter: alpha(opacity = 70);
}

.md-checkbox input[type=checkbox]:disabled ~ label>.box, .md-checkbox input[type=checkbox][disabled]
    ~ label>.box {
    cursor: not-allowed;
    opacity: 0.7;
    filter: alpha(opacity = 70);
}

.md-checkbox input[type=checkbox]:disabled:checked ~ label>.check,
    .md-checkbox input[type=checkbox][disabled]:checked ~ label>.check {
    cursor: not-allowed;
    opacity: 0.7;
    filter: alpha(opacity = 70);
}

.md-checkbox.has-error label {
    color: #F3565D;
}

.md-checkbox.has-error label>.box {
    border-color: #f13e64;
}

.md-checkbox.has-error label>.check {
    border-color: #F3565D;
}

.md-checkbox.has-info label {
    color: #89C4F4;
}

.md-checkbox.has-info label>.box {
    border-color: #68caf1;
}

.md-checkbox.has-info label>.check {
    border-color: #89C4F4;
}

.md-checkbox.has-success label {
    color: #26A69A;
}

.md-checkbox.has-success label>.box {
    border-color: #219174;
}

.md-checkbox.has-success label>.check {
    border-color: #26A69A;
}

.md-checkbox.has-warning label {
    color: #ff5722;
}

.md-checkbox.has-warning label>.box {
    border-color: #ff1b09;
}

.md-checkbox.has-warning label>.check {
    border-color: #ff5722;
}

/* radio css */
.md-radio-list {
    margin: 2px 0;
}

.md-radio-list-group {
    margin: 2px 0;
}

.md-radio-list-group .md-radio{
    float: left;
    width: 40%;
}

.md-radio {
    position: relative;
    /* handling click events */
    /* when radio is checked */
}

.md-radio input[type=radio] {
    visibility: visible;
    position: absolute;
    z-index: -999;
}

.md-radio label {
    cursor: pointer;
    padding-left: 15px;
    margin-bottom: 0px;
    margin-top: 1px;
    font-weight: 500;
}

.md-radio label>span {
    display: block;
    position: absolute;
    left: 0;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.md-radio label>span.inc {
    background: #fff;
    left: -10px;
    top: -10px;
    height: 40px;
    width: 40px;
    opacity: 0;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
}

.md-radio label>.box {
    top: 6px;
    border: 2px solid #9FA4AB;
    height: 14px;
    width: 14px;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    z-index: 5;
}

.md-radio label>.check {
    top: 10px;
    left: 4px;
    width: 6px;
    height: 6px;
    background: #26A69A;
    opacity: 0;
    z-index: 6;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    transform: scale(0);
}

.md-radio label>span.inc {
    -webkit-animation: growCircleRadio 0.3s ease;
    -moz-animation: growCircleRadio 0.3s ease;
    animation: growCircleRadio 0.3s ease;
}

.md-radio label>span.text {
   position: absolute;
    top: 5px;
    left: 31px;
    z-index: 7;
}

.md-radio input[type=radio]:checked ~ label>.check {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1);
}

.md-radio input[type=radio]:disabled ~ label, .md-radio input[type=radio][disabled]
    ~ label {
    cursor: not-allowed;
    opacity: 0.7;
    filter: alpha(opacity = 70);
}

.md-radio input[type=radio]:disabled ~ label>.box, .md-radio input[type=radio][disabled]
    ~ label>.box {
    cursor: not-allowed;
    opacity: 0.7;
    filter: alpha(opacity = 70);
}

.md-radio input[type=radio]:disabled:checked ~ label>.check, .md-radio input[type=radio][disabled]:checked
    ~ label>.check {
    cursor: not-allowed;
    opacity: 0.7;
    filter: alpha(opacity = 70);
}

.md-radio.has-error label {
    color: #F3565D;
}

.md-radio.has-error label>.box {
    border-color: #f13e64;
}

.md-radio.has-error label>.check {
    background: #F3565D;
}

.md-radio.has-info label {
    color: #89C4F4;
}

.md-radio.has-info label>.box {
    border-color: #68caf1;
}

.md-radio.has-info label>.check {
    background: #89C4F4;
}

.md-radio.has-success label {
    color: #26A69A;
}

.md-radio.has-success label>.box {
    border-color: #219174;
}

.md-radio.has-success label>.check {
    background: #26A69A;
}

.md-radio.has-warning label {
    color: #ff5722;
}

.md-radio.has-warning label>.box {
    border-color: #ff1b09;
}

.md-radio.has-warning label>.check {
    background: #ff5722;
}

input[type="checkbox"] {
    border: 1px solid #ccc;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

table {
    width: 100%;
    border-collapse: collapse;
}

table tbody tr td{
    border: 1px solid #bbb8b8;
    height: 18px;
}

table > tbody > tr:nth-of-type(odd) {
    background-color: #eeeeee;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #eeeeee;
}

.table-condensed > tbody > tr:nth-of-type(odd) {
    background-color: #ffffff;
}

@media only screen and (min-width : 1920px) {

    .custom-col-10 {
        width: 58.4% !important;
    }
    .custom-col-3 {
        width: 93.2% !important;
    }
    .text-dot-2-benefit {
        width: 86% !important;
        float: left !important;
    }
    .text-dot-4-benefit {
        width: 95.3% !important;
        float: left !important;
    }
}

@media only screen and (min-width : 1750px) and (max-width : 1819px) {
    .small-scroll-x  .small-scroll-y {
        width: 100%;
    }
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 22%;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 22%;
    }
    .small-scroll-x thead th.col-add {
        width: 31%;
    }
    .small-scroll-x tbody td.col-code {
        width: 10%;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 22.3%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22.3%;
    }
    .small-scroll-x tbody td.col-add {
        width: 31%;
    }
}

@media only screen and (min-width : 1819px) and (max-width : 1920px) {
    .input-default-dot-benefit {
        width: 95%;
        float: left;
    }
    .input-default-tongue-benefit {
        width: 90.5%;
        float: left;
    }
    .custom-col-10 {
        width: 57.5%;
    }
    .col-md-7 {
        width: 57%;
    }
    .custom-col-3 {
        width: 90%;
    }
    .text-dot-2-benefit {
        width: 86%;
        float: left;
    }
    .text-dot-4-benefit {
        width: 93.1%;
        float: left;
    }
    .small-scroll-x  .small-scroll-y {
        width: 100%;
    }
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 22%;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 21.8%;
    }
    .small-scroll-x thead th.col-add {
        width: 32.1%;
    }
    .small-scroll-x tbody td.col-code {
        width: 10%;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 22.3%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22%;
    }
    .small-scroll-x tbody td.col-add {
        width: 32.6%;
    }
}

@media only screen and (min-width : 1650px) and (max-width : 1750px) {
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-add {
        width: 29% !important;
    }
    .small-scroll-x tbody td.col-code {
        width: 10% !important;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 22.5%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22.5%;
    }
    .small-scroll-x tbody td.col-add {
        width: 29%;
    }
}

@media only screen and (min-width : 1650px) and (max-width : 1750px) {
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-add {
        width: 29% !important;
    }
    .small-scroll-x tbody td.col-code {
        width: 10% !important;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 22.5%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22.5%;
    }
    .small-scroll-x tbody td.col-add {
        width: 29%;
    }
}

@media only screen and (min-width : 1500px) and (max-width : 1650px) {
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-add {
        width: 28.1% !important;
    }
    .small-scroll-x tbody td.col-code {
        width: 10% !important;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 22.6%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22.6%;
    }
    .small-scroll-x tbody td.col-add {
        width: 28.7%;
    }
}

@media only screen and (min-width : 1336px) and (max-width : 1500px) {
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-add {
        width: 25% !important;
    }
    .small-scroll-x tbody td.col-code {
        width: 10% !important;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 22.6%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22.6%;
    }
    .small-scroll-x tbody td.col-add {
        width: 25.6%;
    }
}

@media only screen and (min-width : 1024px) and (max-width : 1336px) {
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 15.3% !important;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 22.3% !important;
    }
    .small-scroll-x thead th.col-add {
        width: 30.4% !important;
    }
    .small-scroll-x tbody td.col-code {
        width: 10.2% !important;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 15.5%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22.5%;
    }
}

@media only screen and (min-width : 1025px) and (max-width : 1336px) {
    .input-default-dot-benefit {
        width: 91%;
        float: left;
    }
    .input-default-tongue-benefit {
        width: 90.5%;
        float: left;
    }
    .control-label-benefit {
        width: 96.6%;
    }
    .custom-col-10 {
        width: 57.4%;
    }
    .col-md-7 {
        width: 56.9%;
    }
    .custom-col-3 {
        width: 89%;
    }
    .text-dot-2-benefit {
        width: 85.2%;
        float: left;
    }
    .text-dot-4-benefit {
        width: 92.6%;
        float: left;
    }
}

@media screen and (max-width: 1024px) {
    .small-scroll-x  .small-scroll-y {
        width: 1600px;
    }
    .small-scroll-x thead th.col-code {
        width: 10% !important;
    }
    .small-scroll-x thead th.col-name-hiragana {
        width: 22%;
    }
    .small-scroll-x thead th.col-name-katakana {
        width: 22%;
    }
    .small-scroll-x thead th.col-add {
        width: 30%;
    }
    .small-scroll-x tbody td.col-code {
        width: 10%;
    }
    .small-scroll-x tbody td.col-name-hiragana {
        width: 22.3%;
    }
    .small-scroll-x tbody td.col-name-katakana {
        width: 22.3%;
    }
    .small-scroll-x tbody td.col-add {
        width: 30%;
    }

    .scrollableContainer table{
        width: 1600px !important;
    }
}

@media only screen and (min-width : 993px) and (max-width : 1024px) {
    .input-default-dot-benefit {
        width: 95%;
        float: left;
    }
    .input-default-tongue-benefit {
        width: 90.5%;
        float: left;
    }
    .custom-col-10 {
        width: 58.3%
    }
    .custom-col-3 {
        width: 94.5%
    }
    .text-dot-2-benefit {
        width: 85.5%;
        float: left;
    }
    .text-dot-4-benefit {
        width: 92.8%;
        float: left;
    }
}

@media only screen and (min-width : 768px) and (max-width : 992px) {
    .control-label-midle {
        width: 91.5%
    }
    .control-label-midle {
        width: 91.5%
    }
    .text-dot-2-benefit {
        width: 85.5%;
        float: left;
    }
    .text-dot-4-benefit {
        width: 92.8%;
        float: left;
    }
    .small-scroll-x  .small-scroll-y {
        width: 1600px;
    }
}

.panel.taa-panel {
    border-color: transparent;
}

.taa-panel-fix {
    position: relative;
    top: 60px;
}

.panel {
    border-radius: 0px !important;
}

.taa-box-shadow-panel {
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.32), 0 1px 5px 0
        rgba(0, 0, 0, 0.2), 0 2px 4px 0px rgba(0, 0, 0, 0.12);
}

.panel {
    margin-bottom: 0px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.panel.taa-panel .panel-heading {
    border-bottom: 4px solid #FF5502;
    height: 33px;
    padding: 5px 15px !important;
}

/** The Magic **/
.btn-breadcrumb .btn:not (:last-child ):after {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 10px solid white;
    position: absolute;
    top: 50%;
    margin-top: -13px;
    left: 100%;
    z-index: 3;
}

.btn-breadcrumb .btn:not (:last-child ):before {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 10px solid rgb(173, 173, 173);
    position: absolute;
    top: 50%;
    margin-top: -13px;
    margin-left: 1px;
    left: 100%;
    z-index: 3;
}

/** The Spacing **/
.btn-breadcrumb .btn {
    padding: 6px 12px 6px 24px;
}

.btn-breadcrumb .btn:first-child {
    padding: 6px 6px 6px 10px;
}

.btn-breadcrumb .btn:last-child {
    padding: 6px 18px 6px 24px;
}

/** Default button **/
.btn-breadcrumb .btn.btn-default:not (:last-child ):after {
    border-left: 10px solid #fff;
}

.btn-breadcrumb .btn.btn-default:not (:last-child ):before {
    border-left: 10px solid #4CAF50;
}

.btn-breadcrumb .btn.btn-default:hover:not (:last-child ):after {
    border-left: 10px solid #FFF;
}

.btn-breadcrumb .btn.btn-default:hover {
    /*  background-color: #A5D6A7 !important; */

}

.btn-breadcrumb .btn.btn-default:hover:not (:last-child ):before {
    border-left: 10px solid #adadad;
}

#top .top-breadcrumb-menu  .btn {
    border-radius: 0px;
    line-height: 12px;
}

#top .top-breadcrumb-menu .btn-default {
    color: #4CAF50;
    background-color: #fff;
    border-color: #4CAF50;
}

#top-button-menu{
    margin-top: 52px;
    position: fixed;
    width: 100%;
    padding-left: 15px;
    height: 46px;
    z-index: 1030;
    font-size:15px;
}

#top-button-menu div{
    height: 45px;
    margin-left: -1px;
    background-color: #DDDDDD;
    border: 1px solid #cccccc;
    padding: 5px;
    text-align: center;
    background-color: rgb(255,249,177);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
}

#top-button-menu div a:hover, #top-button-menu div a:focus {
    color: #777777;
    text-decoration: none;
    cursor: pointer;
}

#top-button-menu div a {
    display:block;
    width: 100%;
    height:100%;
    padding-top:10px;
    text-align:center;
    color: rgb(0,0,0);
}

#top-button-menu div:hover{
    color: #777777;
    text-decoration: none;
    background-color: #4CAF50;
    border: 1px solid #cccccc;
    background-image: linear-gradient(to bottom,rgb(253,211,92),rgb(253,211,92));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
}

#top-button-menu div a:hover{
    color: rgb(0,0,0);
    text-decoration: none;
}

.div-menu-disabled {
    pointer-events: none;
    background:linear-gradient(#f5deb3 80%,#f5deb3 20%,#f5deb3)!important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05) !important;
}

.modal-content {
    border-radius: 0;
}

.btn-pink {
  color: #fff;
  width:24px;
  height:24px;
  padding-left:0px !important;
  padding-top:1px !important;
  background-image: url("images/seeBtn.jpg");
}

.btn-edit2 {
  color: #fff;
  width:24px;
  height:24px;
  padding-left:0px !important;
  padding-top:1px !important;
  background-image: url("images/editBtn2.jpg");
}
.btn-edit2:hover {
  position:relative;
  top:1px;
  left:1px;
}

.btn-pink:hover {
  position:relative;
  top:1px;
  left:1px;
}

/* css for  table */
.table {
    margin-bottom: 0px;
}

.table>thead>tr>th {
    padding: 4px;
    padding-top: 7px;
    background-color: #aaa;
    color: #FFF;
    font-weight: 600;
}

.table>tbody>tr>td {
    padding: 1px;
    height: 18px;
}

/* css for _md-checkbox in table */

.table>thead>tr>th  .md-checkbox, .table>tbody>tr>td  .md-checkbox {
    height: 20px;
}

.table>thead>tr>th .md-checkbox label>.box {
    top: -9px;
    left: 5px;
    background-color: #FFF;
}

.table>tbody>tr>td .md-checkbox label>.box {
    top: -7px;
    left: 6px;
}

.table>thead>tr>th .md-checkbox label>span.inc, .table>tbody>tr>td .md-checkbox label>span.inc
    {
    top: -13px;
}

.table>thead>tr>th .md-checkbox label>.check {
    top: -12px;
    left: 10px;
}

/* css for _md-checkbox in table */

.table>tbody>tr>td .md-checkbox label>.check {
    top: -12px;
    left: 11px;
}

.table>tbody>tr>td .btn {
    height: 29px;
    width:29px;
    padding: 2px 15px;
}

/**BEGIN MODAL, DIALOG CSS*/

.modal-dialog .glyphicon{
    top: 3px;
}

.modal-dialog .modal-title{
    margin-top: 1px;
}

.modal-header .close {
    margin-top: 2px;
}

.modal-footer .btn-yes {
    color: #ccc;
    background-color: #337ab7;
    font-weight: 500;
}

.modal-footer .btn-no {
    color: #000;
    background-color: #eee;
    font-weight: 500;
}

.dialog-header-error {
    background: #337ab7;
    color: #FFF;
}

.dialog-header-confirm, .dialog-header-notify {
    background: #337ab7;
    color: #FFF;
}

.modal-header {
    padding: 5px;
    border-bottom: 1px solid #e5e5e5;
}

.modal-custom .modal-header {
    padding: 18px 15px 15px 15px;
}
.modal-header .text-danger {
    color: #FFF;
}

.modal-body.text-danger {
    color: #337ab7;
}

.modal-footer {
    padding: 10px;
    text-align: center;
    border-top: 1px solid #e5e5e5;
}

/**END MODAL, DIALOG CSS*/

.table-condensed tbody tr td {
    border: none;
}

/**BEGIN AUTOCOMPLTE CSS*/

.autocomplete .input-code {
    width: 80px;
}

.autocomplete button {
    height: 25px;
    width: 30px;
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    border-radius: 0px;
    float: left;
    top: 0;

/**
    background-color: #dcdeba !important;
    background-image: radial-gradient(#808080 15%, transparent 16%), radial-gradient(#9d9d9d 15%, transparent 16%);
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    border-radius: 0px;
    border: 1px solid #ccc;
    float: left;
    top: 0;
*/
}

.autocomplete button.address {
    background: none;
    width: 82px;
}

.autocomplete .input-name {
    /* width: 60%; */
    /* margin-left: 28px; */
}
/**END AUTOCOMPLTE CSS*/

/**BEGIN AUTOCOMPLTE-BUTTON CSS*/

.autocomplete-button{
    float: left;
    width: 100%;
}

.autocomplete-button .input-code{
    width: 20% !important;
}

.autocomplete-button .input-md{
    width: 45% !important;
}

.autocomplete-button .btn-default {
    height: 25px;
    width: 30px;
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    border-radius: 0px;
    float: left;
    top: 0;

/**
  height: 30px;
    width: 30px;
    background-color: #dcdeba !important;
    background-image: radial-gradient(#808080 15%, transparent 16%), radial-gradient(#9d9d9d 15%, transparent 16%);
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    border-radius: 0px;
    border: 1px solid #ccc;
    float: left;
    top: 0;
    margin-left: -1px;
*/
}

.autocomplete-button .button-action{
    float: left;
    width: 26%;
    padding-left: 25px;
}

.autocomplete-button .button-action button{
    padding: 4px 12px;
}

.autocomplete-button .input-name {
    width: 60% !important;
    margin-left: 28px;
}

/**END AUTOCOMPLTE-BUTTON CSS*/

.autocomplete .address01.input-name {
    margin-left: 50px;
    margin-bottom: 1px;
}

.autocomplete .address02.input-name {
    width: 65% !important;
    margin-left: 0px;
}

.autocomplete-double{
    height: 25px;
}

.autocomplete-double .wrapper {
    width: 48%;
    display: inline-block;
}

.autocomplete-double .wrapper .input-name {
    margin-left: 25px;
}

.autocomplete-double .input-code {
    width: 20% !important;
}

.autocomplete-double .autocomplete-col2 {
    width: 40%;
    display: inline-block;
}

.autocomplete-double .question {
    width: 2%;
    display: inline-block;
    position: relative;
    left: -8px;
    top: -9px;
}

.autocomplete-double button {
    height: 25px;
    width: 30px;
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    border-radius: 0px;
    float: left;
    top: 0;

/**
  height: 30px;
    width: 30px;
    background-color: #dcdeba !important;
    background-image: radial-gradient(#808080 15%, transparent 16%),
        radial-gradient(#9d9d9d 15%, transparent 16%);
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    border-radius: 0px;
    border: 1px solid #ccc;
    float: right;
    position: absolute;
    top: 0;
    margin-left: -5px;
*/
}

/**css for upload file*/
.uploadFile button {
    height: 25px;
    background-color: #f0ad4e !important;
    border-radius: 0px;
    border: 1px solid #ccc;
    float: right;
    position: absolute;
    top: 0;
    margin-left: -1px;
}

.uploadFile .input-fileName {
    width: 40% !important;
}

.daterange-from, .daterange-to {
    display: table-cell;
    vertical-align: middle;
    color: #555;
    text-decoration: none;
    border: 1px solid #aaa;
    padding: 0px !important;
}

.daterange-from  .input-daterange-from, .daterange-to .input-daterange-to
    {
    height: 30px;
    border: none;
    width: 100%;
    display: table-cell;
    vertical-align: middle;
    text-decoration: none;
    color: #555;
    text-align: center;
    min-width: 110px;
}

#reportrange .input-group-addon {
    top: -1px;
    left: 1px;
}

#daterange .symbol-middle {
    left: -1px;
    padding: 6px 0;
    background: #FFF;
    border-color: #FFF;
    min-width: 30px;
}

.input-daterange {
    padding-left: 2px !important;
}

.date-wrapper .date {
    float: left;
}

.date-wrapper .join {
    width: 3%;
    display: inline-block;
    margin-left: 22px;
    margin-right: 8px;
    float: left;
    line-height: 23px;
}

/*-------------scroll x + y-----------*/
.table {
    max-width: none;
}

.scroll-x table {
    position: relative;
}

/* .scroll-x thead:after {
    content: ' ';
    display: block;
    background-color: #aaa;
    width: 20px;
    height: 70px;
    position: absolute;
    right: 0;
    top: 1px;
} */

.scroll-x .table-bordered>thead>tr>th {
    border-bottom-width: 1px;
    height: 70px;
}

.scroll-x {
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
}

.scroll-x  .scroll-y {
    width: 2000px;
}

.scroll-x tbody.sroll-body {
    display: block;
    max-height: 500px;
    overflow-y: auto;
    width: 100%;
}

.scroll-x thead.fix-header tr:after, .scroll-x thead.sroll-body tr:after{
    content: ' ';
    display: block;
    visibility: hidden;
    clear: both;
}

.scroll-x thead.fix-header th {
    height: 30px;
    text-align: left;
}

.scroll-x tbody.sroll-body td {
    min-height: 18px;
    vertical-align: middle;
}

.scroll-x thead.fix-header th {
    float: left;
}

 .scroll-x .no-boundary {
    border: none;
}

/*-------------small table-----------*/
.small-scroll-x table {
    position: relative;
}

.small-scroll-x thead:after {
    content: ' ';
    display: block;
    background-color: #aaa;
    width: 23px;
    height: 29px;
    position: absolute;
    right: 0;
    top: 1px;
}

.small-scroll-x {
    overflow-x: auto;
    width: 100%;
}

.small-scroll-x .table-bordered>thead>tr>th {
    border-bottom-width: 1px;
}

.small-scroll-x {
    overflow-x: auto;
    width: 100%;
}

.small-scroll-x tbody {
    display: block;
    max-height: 500px;
    overflow-y: auto;
    width: 100%;
}

.small-scroll-x tr:after {
    content: ' ';
    display: block;
    visibility: hidden;
    clear: both;
}

.small-scroll-x thead th {
    height: 30px;
    text-align: left;
}

.small-scroll-x thead th {
    float: left;
}

.small-scroll-x tbody td {
    min-height: 35px;
}

.small-scroll-x thead th.col-no {
    width: 80px;
}

.small-scroll-x thead th.col-md-checkbox {
    width: 41px;
}

.small-scroll-x thead th.col-button {
    width: 120px;
}

.small-scroll-x tbody td.col-no {
    width: 80px;
    text-align: right;
}

.small-scroll-x tbody td.col-md-checkbox {
    width: 41px;
}

.small-scroll-x tbody td.col-button {
    width: 120px;
}

.common-radio-label {
    line-height: 30px;
}

/*-------------scrollable-table directive-----------*/

.fixed-table-inner td[class*="col-no"]{
    text-align: right;
}

.fixed-table-inner td {
    border-bottom: 1px solid #ccc;
    padding: 5px;
}

.fixed-table-inner td+td {
    border-left: 1px solid #ccc;
}

.fixed-table-inner th {
    padding: 0 5px;
}

.header-background {
    border-bottom: 1px solid #ccc;
}

/* above this is decorative, not part of the test */
.fixed-table-container {
    width: 100%;
/*  height: 560px;
    max-height: 560px; */
    margin: 10px auto;
    background-color: white;
    position: relative;
    padding-top: 30px;
    border-top: 1px solid #CCC;
    border-right: 1px solid #CCC;
}

.fixed-table-container-inner {
    overflow-x: hidden;
    overflow-y: auto;
    height: 100%;
    /* border-bottom: 1px solid #CCC; */
    max-height: 560px;
}

.header-background {
    background-color: #9d9d9d;
    height: 30px; /* height of header */
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}

.fixed-table-inner {
    background-color: white;
    width: 100%;
    overflow-x: auto;
    overflow-y: auto;
}

.fixed-table-inner .th-inner {
    position: absolute;
    top: 0;
    line-height: 30px; /* height of header */
    text-align: left;
    border-left: 1px solid #CCC;
    padding-left: 5px;
    margin-left: -5px;
    color: #FFF;
}

.fixed-table-inner th .th-inner .inc {
    top: 3px;
    height: 19px;
    width: 19px;
}

.fixed-table-inner th .th-inner .box, .fixed-table-inner th .th-inner .check
    {
    top: 2px;
}

.fixed-table-inner td .box, .fixed-table-inner td .check {
    top: -13px;
    left: 5px;
}

/*-------------scrollable-table directive-----------*/
.scrollableContainer .md-checkbox.box{
 padding-left: 3px;
 height: 35px
}
.li-menu-disabled {
    pointer-events: none;
    background-color: #eeeeee !important;
}

/*-------------css for loading-----------*/
.loader {
   /*  border: 10px solid #f3f3f3; */
    border-top: 10px solid #3498db;
    border-radius: 50%;
    width: 80px;
    height: 80px;
    animation: spin 1.2s linear infinite;
    text-align: center;
    position: absolute;
    z-index: 99999999;
    top: 40%;
    left: 45%;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.text-overflow, .text-overflow span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.popover {
    border-radius: 0px;
}

.popover-content{
    word-wrap: break-word;
}

/* -------------Base for label styling------------- */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  position: relative;
  padding-left: 1.95em;
  cursor: pointer;
  margin-top: 5px;
  margin-bottom: 0;
}

/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0px;
    width: 18px;
    height: 18px;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 0px;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
    content: '\2714';
    position: absolute;
    top: 2px;
    left: 2px;
    font-size: 16px;
    line-height: 0.8;
    color: #09ad7e;
    transition: all .2s;
}
/* checked mark aspect changes */
[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
[type="checkbox"]:disabled:checked + label:after {
  color: #999;
}
[type="checkbox"]:disabled + label {
  color: #aaa;
}
/* accessibility */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
  border: 1px solid #26a69a;
}

/* hover style just for information */
label:hover:before {
  border: 1px solid #26a69a !important;
}

.focus-radio{
    border: 2px solid green !important;
}

a:focus {
    outline: none !important;
}
select::-ms-expand {
    width: 10px;
    height: 10px;
    background-color: white;
    color: black;
    border: 0;
}

.top-breadcrumb-menu{
    min-width: 1280px;
}
.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -ms-animation: spin .7s infinite linear;
    -webkit-animation: spinw .7s infinite linear;
    -moz-animation: spinm .7s infinite linear;
    font-size: 18px;
}
@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}

@-webkit-keyframes spinw {
    from {/* -webkit-transform: rotate(0deg); */}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes spinm {
    from { -moz-transform: rotate(0deg);}
    to { -moz-transform: rotate(360deg);}
}
.div-hidden-calendar
{
  position: absolute;
  top: 40px;
  left: -999px;
  width: 98px;
  z-index: 999999
}
.inp-hidden-calendar
{
    height: 23px;
    width: 91px !important;
    margin-top: 8px;
}
.boldRed
{
    color: red;
    font-weight: bold;
}

}