/*this is only for development purpose. do not include*/
#ls-canvas {
    overflow: visible;
}
/*this is only for development purpose. do not include*/

.h3 {
    float:left
}

.sub-tab-nav {
    background-color: #555555;
    clear:both;
    margin:0 0 1em 0;
}

.sub-tab-nav a {
    color: #FFFFFF !important;
}

.sub-tab-nav a:hover {
    text-decoration: none;
}

#tab-nav {
    clear: both;
}

#tab-nav.sub-tab-nav {
    float: left;
    position: relative;
    width: 1000px;
    height: 40px;
    z-index: 10;
}

#tab-nav.sub-tab-nav ul {
    float: left;
}

.sub-tab-nav ul{
    margin: 0;
    width:auto;
    font-size: 0.96em;
}

.sub-tab-nav li.active {
    font-weight: 600;
    border-bottom: 3px solid #dd0000;
    transition:border-bottom .2s;
    -moz-transition:border-bottom .2s;
}

/*.sub-tab-nav li:first-child {
    padding-left:2.2em;
}*/

.sub-tab-nav li {
    background-color: #555555;
    float: left;
    padding: 0.7em 1em 0.8em;
    position: relative;
    background-image:none;
    transition:border-bottom .2s;
    -moz-transition:border-bottom .2s;
}

.sub-tab-nav li:hover,
.sub-tab-nav li:hover span {
    background-color: #707070;
    border-bottom: 3px solid #00bbcc;
    transition: background-color 0.4s;
}

.sub-tab-nav li:hover span {
    border-bottom: 0;
}

/*.sub-tab-nav li a:hover, .sub-tab-nav li a {
    text-decoration:none;
    background-color: #555555;
    color:#FFF !important;
}*/

.sub-tab-anchor li {
    float: left;
    background-image:none;
}

.sub-tab-anchor li::before {
    content: " | ";
    margin: 0 1em;
}

.sub-tab-anchor li:first-child:before {
    content: "";
    margin: 0.25em;
}

.sub-tab-sub-menu {
    float: left;
    padding: 0.2em 0.1em;
    margin: 0 0.8em;
    position: relative;
    text-align: right;
    width: 12%;
    cursor: pointer;
    color: #FFF;
    white-space: nowrap;
    font-size: 0.96em;
}

.sub-tab-sub-menu li:hover,
.sub-tab-sub-menu li:hover span {
    border-bottom: 0;
}

.sub-tab-sub-menu button {
    margin: auto;
    outline: none;
}

.sub-tab-sub-menu p {
    display: block;
    float: left;
    text-align: left;
    margin: 0.5em 0 0 0.4em;
    width: 30%;
}

.sub-tab-sub-menu button .material-icons {
    font-size: 1em;
}

.sub-tab-sub-menu i.material-icons {
    padding: 0.1em 0;
    margin: 0.15em 0 0;
    float: left;
}

.sub-tab-sub-menu ul {
    height: 0;
    width: 0 !important;
    position: absolute;
    overflow: hidden;
    left: -1.02em;
    top: 107%;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-timing-function: ease;
    opacity: 0;
}

@media all and (-ms-high-contrast:none), (-ms-high-contrast:active) {
    .sub-tab-sub-menu ul {
        top: 108%;
        left: -1.13em;
    }
    *::-ms-backdrop .sub-tab-sub-menu ul {
        top: 108%;
        left: -1.13em;
    }
}

.sub-tab-sub-menu ul.show {
    width: auto !important;
    height: auto;
    opacity: 1;
    transition-timing-function: ease;
    transition-delay: 0s;
    transition-duration: 0.1s;
}

.sub-tab-sub-menu ul li {
    margin: 0;
    padding:0;
    text-align: left;
    width: 229px;
}

.sub-tab-sub-menu ul li:first-child {
    padding-left: 0;
}

.sub-tab-sub-menu ul li a {
    display: block;
    padding: 0.6em 1.5em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media only screen and ( max-width: 1280px ) {
    #tab-nav.sub-tab-nav {
        width: 100%;
    }
}

@media only screen and (max-width: 980px) {
    .sub-tab-nav li {
        padding: 1.1em 1em;
    }

    .sub-tab-sub-menu p {
        margin: 0.9em 0 0 0.4em;
    }
}

@media all and (-ms-high-contrast:none) and (-ms-high-contrast:active), only screen and (max-width: 980px) {
    .sub-tab-nav li {
        padding: 1.2em 1em;
    }
    
    .sub-tab-sub-menu ul {
        top: 110%;
    }
    
    *::-ms-backdrop .sub-tab-sub-menu ul {
        top: 110%;
    }
}