body{
    background-color: #F2F2F2;
}
.navText{
    font-family: Microsoft JhengHei;
    font-weight: bold;
}
.offcanvasTitle{
    font-family: Microsoft JhengHei;
    font-weight: bold;
    color: #FFF !important;
    font-size: 1.25rem;
    line-height: 3em;                       
}
.offcanvasText{
    font-family: Microsoft JhengHei;
    font-weight: normal;
    color: #FFF !important;
    font-size: 1rem;            
}
.tabTitle{
    font-family: Microsoft JhengHei;
    font-weight: bold;
    color: #023E73 !important;
    font-size: 1.5rem;
}
.tabText{
    font-family: Microsoft JhengHei;
    font-weight: bold;
    color: #023E73 !important;
    font-size: 1.2rem;
}
.tabSMTitle{
    font-family: Microsoft JhengHei;
    font-weight: bold;
    color: #414242 !important;
    font-size: 1.15rem;
}
.valueText{
    font-family: Microsoft JhengHei;
    font-weight: bold;
    color: #023E73 !important;
    font-size: 1rem;
}
.rangeBG{
    background-color: #FFFFFF !important;
    border: #707070 !important;        
    border-radius: 25px;            
}            
.ticks {
    display: flex;
    justify-content: space-between;
    padding: 0px 10px;
}

.tick {
    position: relative;
    display: flex;
    justify-content: center;
    margin-top: -15px;            
}
table {
    text-align: center;
}
.blue-btn{
    background-color: #005BAB;
    color: #fff;
    font-weight: bold;                
    border: none;
    border-radius: 5px; 
    font-size: 1rem;
}
.blue-btn:hover{
    background-color: #009EB8;
    color: #F8F9FA;
    font-weight: bold;                
    border: none;
    border-radius: 5px; 
    font-size: 1rem;
}
.dateSelect{
    font-size: 1rem;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}
input[type="range"].ps0 {
    -webkit-appearance: none;
    height: 30pt;
    width: 95%;
    overflow: hidden;
    cursor: pointer;
    outline: none;
    background: white;
}
input[type="range"].ps0::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    height: 0.75rem;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    background: -moz-linear-gradient(left,  #a9d979 0%, #a9d979 2%, #f2ca52 6%, #f28972 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #a9d979 0%,#a9d979 2%,#f2ca52 6%,#f28972 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #a9d979 0%,#a9d979 2%,#f2ca52 6%,#f28972 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
input[type="range"].ps0::-webkit-slider-thumb {
    -webkit-appearance: none;
    position: relative;
    height: 1.5rem;
    width: 10px;
    border-radius: 5px;
    border: 1px solid gray;
    margin-top: -5px;
    background-color: #FFFFFF;
}
input[type="range"].ps1 {
    -webkit-appearance: none;
    height: 30pt;
    width: 95%;
    overflow: hidden;
    cursor: pointer;
    outline: none;
    background: white;
}
input[type="range"].ps1::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    height: 0.75rem;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    background: -moz-linear-gradient(45deg,  rgba(145,145,145,1) 0%, rgba(145,145,145,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg,  rgba(145,145,145,1) 0%, rgba(145,145,145,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg,  rgba(145,145,145,1) 0%, rgba(145,145,145,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
input[type="range"].ps1::-webkit-slider-thumb {
    -webkit-appearance: none;
    position: relative;
    height: 1.5rem;
    width: 10px;
    border-radius: 5px;
    border: 1px solid gray;
    margin-top: -5px;
    background-color: #FFFFFF;
}
input[type="range"].ps2 {
    -webkit-appearance: none;
    height: 30pt;
    width: 95%;
    overflow: hidden;
    cursor: pointer;
    outline: none;
    background: white;
}
input[type="range"].ps2::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    height: 0.75rem;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    background: -moz-linear-gradient(left,  #f28972 0%, #f28972 25%, #f2ca52 25.5%, #a9d979 26%, #a9d979 74.5%, #f2ca52 75, #f28972 75.5%, #f28972 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #f28972 0%, #f28972 25%, #f2ca52 25.5%, #a9d979 26%, #a9d979 74.5%,#f2ca52 75%, #f28972 75.5%,#f28972 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #f28972 0%, #f28972 25%, #f2ca52 25.5%,#a9d979 26%, #a9d979 74.5%,#f2ca52 75%, #f28972 75.5%,#f28972 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
input[type="range"].ps2::-webkit-slider-thumb {
    -webkit-appearance: none;
    position: relative;
    height: 1.5rem;
    width: 10px;
    border-radius: 5px;
    border: 1px solid gray;
    margin-top: -5px;
    background-color: #FFFFFF;
}
input[type="range"].ps3 {
    -webkit-appearance: none;
    height: 30pt;
    width: 95%;
    overflow: hidden;
    cursor: pointer;
    outline: none;
    background: white;
}
input[type="range"].ps3::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    height: 0.75rem;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    background: -moz-linear-gradient(45deg,  rgba(169,217,121,1) 0%, rgba(169,217,121,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg,  rgba(169,217,121,1) 0%, rgba(169,217,121,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg,  rgba(169,217,121,1) 0%, rgba(169,217,121,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
input[type="range"].ps3::-webkit-slider-thumb {
    -webkit-appearance: none;
    position: relative;
    height: 1.5rem;
    width: 10px;
    border-radius: 5px;
    border: 1px solid gray;
    margin-top: -5px;
    background-color: #FFFFFF;
}
input[type="range"].ps4 {
    -webkit-appearance: none;
    height: 30pt;
    width: 95%;
    overflow: hidden;
    cursor: pointer;
    outline: none;
    background: white;
}
input[type="range"].ps4::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    height: 0.75rem;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    background: -moz-linear-gradient(left,  #f28972 0%, #f28972 32%, #f2ca52 32.5%, #a9d979 33%, #a9d979 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #f28972 0%, #f28972 32%, #f2ca52 32.5%, #a9d979 33%, #a9d979 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #f28972 0%, #f28972 32%, #f2ca52 32.5%, #a9d979 33%, #a9d979 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
input[type="range"].ps4::-webkit-slider-thumb {
    -webkit-appearance: none;
    position: relative;
    height: 1.5rem;
    width: 10px;
    border-radius: 5px;
    border: 1px solid gray;
    margin-top: -5px;
    background-color: #FFFFFF;
}
input[type="range"].ps5 {
    -webkit-appearance: none;
    height: 30pt;
    width: 95%;
    overflow: hidden;
    cursor: pointer;
    outline: none;
    background: white;
}
input[type="range"].ps5::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    height: 0.75rem;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    background: -moz-linear-gradient(left,  #a9d979 0%, #a9d979 2%, #f2ca52 6%, #f28972 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #a9d979 0%,#a9d979 2%,#f2ca52 6%,#f28972 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #a9d979 0%,#a9d979 2%,#f2ca52 6%,#f28972 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
input[type="range"].ps5::-webkit-slider-thumb {
    -webkit-appearance: none;
    position: relative;
    height: 1.5rem;
    width: 10px;
    border-radius: 5px;
    border: 1px solid gray;
    margin-top: -5px;
    background-color: #FFFFFF;
}

/* Text Layout Design */
@media only screen and (max-width: 768px) {
    #br01 {
        display: none;
    }
}

/* Hide images on mobile devices */
@media screen and (max-width: 768px) {
    .slick-slide img.hide-on-mobile {
        display: none;
    }
}