/* function tabs */

.functiontabs ul li {
    list-style-type: square;
}

.functiontabstitle {
    margin: 0 auto;
    margin-top: -4%;
}

.functiontabs .functiontabstitle .tabtitle {
    padding: 20px 10px 20px 10px;
    cursor: pointer;
    background-color: #000;
    border-left: 1px solid #E14B00;
    border-top: 1px solid #E14B00;
    border-bottom: 1px solid #E14B00;
    color: #fff;
    font-size: 30px;
    line-height: 36px;
    text-align: center;
    vertical-align: middle;
    width: 400px;
    display: table-cell;
}

.functiontabs .functiontabstitle .tabtitle:hover {
    box-shadow: 0 -20px 70px -20px rgb(255, 85, 0);
    background-image: url("../images/tab_bg.png");
    background-repeat: no-repeat;
    background-position-y: -20px;
}

.functiontabstitle div:first-child {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

.functiontabstitle div:last-child {
    border-right: 1px solid #E14B00;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

.functiontabstitle #tabtitle3 {
    border-right: 0px solid #E14B00;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.functiontabstitle #tabtitle4 {
    border-right: 1px solid #E14B00;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

#audiodac .functiontabstitle #tabtitleaudio3 {
    border-right: 0px solid #E14B00;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

#audiodac .functiontabstitle #tabtitleaudio4 {
    border-right: 1px solid #E14B00;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

/* Audio tab css*/

#audiodac {
    margin-bottom: 4%;
    margin-top: 2%;
}

#audiodac .title {
    color: #ff6400;
    font-size: 36px;
    font-size: 46px;
}

#audiodac .conbox1 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 24%;
}

#audiodac .conbox2 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 70%;
}

#audiodac #funtabsaudio3 .conbox1 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 40%;
}

#audiodac #funtabsaudio3 .conbox2 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 54%;
}

/* UI tab css*/

.pertable .functiontabs .functiontabstitle .tabtitle {
    padding: 10px 10px 10px 10px;
    cursor: pointer;
    background-color: #000;
    border-left: 1px solid #E14B00;
    border-top: 1px solid #E14B00;
    border-bottom: 1px solid #E14B00;
    color: #fff;
    font-size: 30px;
    line-height: 36px;
    text-align: center;
    vertical-align: middle;
    width: 400px;
    display: table-cell;
}

.pertable .functiontabstitle #tabtitle4 {
    border-right: 0px solid #E14B00;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.pertable .functiontabstitle #tabtitle5 {
    border-right: 1px solid #E14B00;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

.pertable {
    background-image: url("../images/tabsbg.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    margin-bottom: 4%;
}

.pertable .st1 {
    margin-top: 0%;
    margin-bottom: 6%;
}

.functiontabs .funtabs .martop {
    padding-top: 2%;
}

.functiontabs #funtabsPer1 {
    position: relative;
    margin-bottom: 4%;
}

.functiontabs #funtabsPer1 .text {
    position: absolute;
    top: 70%;
    left: 50%;
    width: 30%;
}

.functiontabs #funtabsPer3 .conbox1 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 55%;
}

.functiontabs #funtabsPer3 .conbox2 {
    display: inline-block;
    position: relative;
    width: 40%;
    margin-left: 2%;
    
}

.functiontabs #funtabsPer3 .t1 {
    float: left;
    font-size: 60px;
    line-height: 80px;
}

.functiontabs #funtabsPer3 .t2 {
    float: right;
    color: #fff;
    padding-top: 20px;
}

.functiontabs .conbox1 {
    position: relative;
    padding-top: 4%;
    display: inline-block;
    vertical-align: top;
    width: 30%;
}

.functiontabs .conbox2 {
    display: inline-block;
    position: relative;
    width: 66%;
    padding-top: 4%;
    margin-left: 2%;
}

.functiontabs #funtabsPer2 .conbox1 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 60%;
}

.functiontabs #funtabsPer2 .conbox2 {
    display: inline-block;
    position: relative;
    width: 35%;
    margin-left: 2%;
}

.functiontabs .title {
    color: #fff;
    font-size: 1.6em;
}

.functiontabs #funtabs1 .conbox1 {
    position: relative;
    display: inline-block;
    width: 50%;
}

.functiontabs #funtabs1 .conbox2 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 47%;
}

.functiontabs #funtabs1 .suborangetitle {
    font-size: 26px;
}

#funtabs2, #funtabs3, #funtabs4, #funtabs5 {
    display: none;
}

@media screen and (max-width: 1366px) {
    .functiontabs #funtabsPer3 .conbox1 {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 45%;
    }
    .functiontabs #funtabsPer3 .conbox2 {
        display: inline-block;
        position: relative;
        width: 50%;
        margin-left: 2%;
    }
    #audiodac .title {
        font-size: 26px;
        font-size: 36px;
    }
    .functiontabs #funtabs1 .conbox1 {
        position: relative;
        display: inline-block;
        width: 100%;
    }
    .functiontabs #funtabs1 .conbox2 {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 100%;
    }
}

@media screen and (max-width: 960px) {
    /* function tabs */
    .functiontabs #funtabsPer3 .conbox1 {
        width: 100%;
    }
    .functiontabs #funtabsPer3 .conbox2 {
        width: 100%;
    }
    .functiontabs #funtabsPer2 .conbox1 {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 100%;
    }
    .functiontabs #funtabsPer2 .conbox2 {
        display: inline-block;
        position: relative;
        width: 100%;
        margin-left: 0%;
    }
    .functiontabs #funtabsPer1 .text {
        position: static;
        width: 100%;
    }
    .functiontabstitle div:first-child {
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
    }
    .functiontabstitle div:last-child {
        border-right: 1px solid #E14B00;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }
    .functiontabs .conbox1 {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 100%;
    }
    .functiontabs .conbox2 {
        display: inline-block;
        position: relative;
        width: 100%;
        margin-left: 0%;
    }
    .functiontabstitle #tabtitle3 {
        border-right: 1px solid #E14B00;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }
    .functiontabs .functiontabstitle .tabtitle {
        width: 500px;
        border: 2px solid #E14B00;
        border-radius: 6px;
        display: block;
    }
    .pertable .functiontabs .functiontabstitle .tabtitle {
        width: 100%;
        display: block;
        border: 2px solid #E14B00;
        border-radius: 6px;
    }
    .pertable .functiontabstitle #tabtitle4 {
        border-right: 1px solid #E14B00;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }
    .pertable .st1 {
        margin-top: 0%;
        margin-bottom: 10%;
    }
    #audiodac .functiontabstitle #tabtitleaudio3 {
        border-right: 1px solid #E14B00;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }
    #audiodac .title {
        font-size: 20px;
        font-size: 30px;
    }
    #audiodac .conbox1 {
        width: 100%;
    }
    #audiodac .conbox2 {
        width: 100%;
    }
    #audiodac #funtabsaudio3 .conbox1 {
        width: 100%;
    }
    #audiodac #funtabsaudio3 .conbox2 {
        width: 100%;
    }
}

@media screen and (max-width: 640px) {
    .functiontabs #funtabsPer3 .t1 {
        font-size: 30px;
        line-height: 40px;
    }
    .functiontabs .functiontabstitle .tabtitle {
        width: 94%;
    }
    .pertable .functiontabs .functiontabstitle .tabtitle {
        width: 94%;
        
    }
}