/*start vertical*/
.vertical-tab-container{
   display: flex;	
	}
ul.vertical-tab {
    margin-left: 0 !important;
    list-style: none;
    display: block;
}
ul.vertical-tab li {
    margin: 0 10px 10px 0;
    display: block;
}

@media only screen and (min-width: 770px) {
	.tabs.tab-content >div {
		flex-basis: 80%;
	}
	ul.vertical-tab {
		flex-basis: 20%;
		border-bottom: none;
	}
}

@media only screen and (max-width: 769px) {
	ul.vertical-tab {
        border-bottom: 1px solid #d5d5d5;
        padding-bottom: 10px;
	    overflow-x: scroll;
	    display: flex;
	}
	ul.vertical-tab li {
	    white-space: nowrap;
	    display: inline-flex;
		text-align: center;
	}
	.tabs.tab-content {
	    width: 90%;
	    margin: auto;
	}
 .tabs.wp-block-columns {
	    display: contents;
	}
}
	
/*strat horizontal*/
.horizontal-tab-container{
   display: block;	
	}
ul.horizontal-tab {
    border-bottom: 1px solid #d5d5d5;
    padding-bottom: 10px;
    overflow-x: scroll;
    margin-left: 0 !important;
    list-style: none;
    display: flex;
}
ul.horizontal-tab li {
    margin: 0 10px 0 0;
    white-space: nowrap;
    display: inline-flex;
}
@media only screen and (max-width: 600px) {
  ul.horizontal-tab li {
	text-align: center;
}
}	

/*text and background color*/
#main ul.vertical-tab li a, #main ul.horizontal-tab li a {
    text-transform: uppercase;
}
ul.vertical-tab li, ul.horizontal-tab li {
    background: #f0f0f0;
    font-size: 1em !important;
    padding: 5px 1em;
}
#main ul.vertical-tab li.active, #main ul.horizontal-tab li.active {
    background: var(--bb-primary-color);
}
#main ul.vertical-tab li.active a, #main ul.horizontal-tab li.active a {
    color: white;
}
/*scroll bar for mobile or horizontal tabs*/
ul.vertical-tab::-webkit-scrollbar, ul.horizontal-tab::-webkit-scrollbar{
   height:4px;
}
ul.vertical-tab::-webkit-scrollbar-track, ul.horizontal-tab::-webkit-scrollbar-track {
    display: none;
}
ul.vertical-tab::-webkit-scrollbar-thumb, ul.horizontal-tab::-webkit-scrollbar-thumb {
     background: var(--bb-primary-color) !important;
}
ul.vertical-tab, ul.horizontal-tab {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}