.tab .nav-tabs {

    border-bottom:0 none;

}

.tab .nav-tabs li a{

    position: relative;

    padding: 15px;

    color: #fc3;

    font-size: 17px;

    z-index: 1;

}

.tab .nav-tabs li a:hover{

    background:transparent;

    border:1px solid transparent;

}

.tab .nav-tabs li a:before{

    content: "";

    width:100%;

    height:100%;

    position:absolute;

    bottom: 8px;

    left:-2px;

    background: #777;

    

    border: 1px solid #d3d3d3;

    border-bottom: 0px none;

    border-radius: 10px 10px 0 2px;

    transform-origin: left center 0;

    transform: perspective(4px) rotateX(2deg);

    z-index:-30;

}

.tab .nav-tabs li{

    margin-right: 15px;

}

.tab .nav-tabs li.active a:before{

    background: #fc3;

}

.tab .nav-tabs li.active a,

.tab .nav-tabs li.active a:focus,

.tab .nav-tabs li.active a:hover{

    border:1px solid transparent;

    background:transparent;

    color: #333;

    font-weight:700;

    z-index: 2;

}

.tab-content .tab-pane{

    border-bottom-left-radius:15px;

    border-bottom-right-radius:15px;

    border: 1px solid #408080;

    padding: 20px;

    background:#EFF8F8;

    line-height: 22px;

}

.tab-content .tab-pane h4{

    margin-top: 0;

    font-weight:700;

    font-size: 20px;

}

@media only screen and (max-width: 767px) {

    .tab .nav-tabs li a{

        padding: 15px 10px;

        font-size: 14px;

    }

    .tab .nav-tabs li a:before{

        bottom: 6px;

    }

}

@media only screen and (max-width: 480px) {

    .tab .nav-tabs li{

        width:100%;

        margin-bottom: 5px;

    }

    .tab .nav-tabs li a:before{

        bottom: 0;

        transform: none;

        border-bottom: 1px solid #d3d3d3;

    }

}