/*
 * Tab & Accordion Style
 */

.tab-container{
    display:flex;
    flex-direction:column;
    margin-bottom: 25px;
    -webkit-box-shadow: 0 0 10px #ccc;
    box-shadow: 0 0 10px #ccc;
    border-radius: 0px;
    height:620px;
    position:relative;
}
.tab-content, .panel-collapse{
    background-image:url('../../images/bg-curriculum.png');
    background-repeat:no-repeat;
    background-position:right bottom;
    background-size:60%;
}
.tab-container .fix{
    text-align:center;
    padding:15px;
}

.course-curriculum .tab-container {
    height:710px;
}
.course-faq .tab-container {
    height:370px;
}
.course-faq .tab-content, .course-faq .panel-collapse {
    background-image:url('../../images/bg-faq.png');
    background-size:40%;
}

.nav-tabs, .tab-container .fix, .panel-heading{
    background: #e1e1e1;
}
.nav.nav-tabs{
    margin: 0;
    flex-flow: row;
    align-items:left;
}
.nav.nav-tabs li::before {
    display: none;
}
.nav-tabs li, .panel-heading{
    width: 100%;
    border-radius: 0px;
    margin-top: 1px;
    margin-bottom: 0;
    margin-left: 1px;
    margin-right: 0;
}
.nav-tabs li a, .panel-heading a{
    width:100%;
    height: 100%;
    display: block;
    font-size: 16px;
    font-weight:bold;
    color: #333;
    text-decoration:none;
}
.nav-tabs li a{
    padding:15px 10px 10px 10px;
    border-style: solid;
    border-color:transparent;
    border-width:10px 0 0 0;
}
.panel-heading a{
}
.nav-tabs li a:hover, .nav-tabs li a.active, .nav-tabs li a.show{
    background:#ffffff;
    border-color:#3a7afb;
}

.tab-container .nav-tabs button{ margin: 20px; }


.tab-content, .panel-collapse{
    padding:15px 20px;
    position:relative;
}
.tab-content, .vertical-tabs .nav-tabs{
    overflow: initial;
    overflow-y: scroll;
    overflow-x: hidden;
    height:100%;
}

/* verticle Tabs */
.vertical-tabs.tab-container{
    flex-direction:row;
}
.vertical-tabs .nav-tabs, .vertical-tabs .tab-content, .vertical-tabs .fix{
    flex:0 0 50%; width: 50%;
}
.vertical-tabs .nav.nav-tabs{
    padding: 20px 0 20px 0;
    flex-flow: column;
    align-items:center;
}
.vertical-tabs .nav-tabs li a, .panel-heading a{
    padding: 10px 10px 10px 15px;
    border-width:0 0 0 10px;
}
.vertical-tabs .fix{
    position:absolute;
    bottom:0;
}
#course-faq .vertical-tabs .nav-tabs{
    height:calc(100% - 70px);
}



/* Mobile View */
.panel-group{
    width:100%;
}
.panel-collapse{    
    background-size:25%;
}
.panel-heading{
    margin:1px;
}
.panel-heading a{
    border:none;
    padding:10px 30px 10px 15px; 
    position:relative; 
}
.panel-title:not(.collapsed){
    background:#3a7afb;
    color:#ffffff;
}
.panel-title:after {
    content: '\002D';
    position: absolute;
    right: 15px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 10px;
    height: 10px;
    line-height: 0;
}
.panel-title.collapsed:after {
    content: '\002B';
}


@media (max-width:991px) {
    .tab-container{ height:auto !important; }
    .vertical-tabs.tab-container{ flex-direction:column; }
    .vertical-tabs .fix{ position:relative; width: 100%; padding:40px 15px; background:transparent; }
}