/* ---------------- TABS ----------------  */ 
.tabs
{
    margin: 1px;
    display: block;
	width: -webkit-fill-available;
    height: 100%;
}

.tabs .tabs_head,
.tabs .tabs_body
{
    overflow-x: auto;
    display: flex;
	width: 100%;
    height: 100%;
}


.tabs, 
.tabs .tabs_head, 
.tabs .tabs_body, 
.tabs .tabs_head [tab_link],
.tabs .tabs_body [tab]
{
    background-color: #f3f3f3;
    position: relative;
}

.tabs .tabs_head
{
    white-space: nowrap;
    margin-bottom: -1px;            /* ===  !!!  ===  ( Must Be Same )  Edit this values to adjust ( border thickness ) */
}
.tabs .tabs_head [tab_link],
.tabs .tabs_body [tab]
{
    border: 1px solid #ced4da;    /* ===  !!!  ===  ( Must Be Same )  Edit this values to adjust ( border thickness ) */
}
.tabs .tabs_head [tab_link]
{
    display: inline-block;
    color: #f58144;
    cursor: pointer;
    align-items: center;
    font-size: 16px;
    font-weight: bold;
    padding: 15px 30px;
    border-bottom: 0px;
}
.tabs .tabs_head [tab_link]:not(:first-child)
{
    border-left: 0px;
}
.tabs .tabs_body [tab]
{
    display: none;
    min-width: fit-content;
    width: -webkit-fill-available;
    padding: 15px 30px;
}



.tabs .tabs_head .tab_active
{
    z-index: 1;
}
.tabs .tabs_head .tab_active,
.tabs .tabs_body .tab_active
{
    display: inline-block;
    background-color: #ffffff;
}








/* 
.tabs-icon 
{
	width: 20px;
	height: 20px;
	margin-right: 10px;
}


.nav-icon-left 
{
	width: 32px;
	height: 32px;
	vertical-align: middle;
	margin-right: 36px;
}

.nav-icon-right 
{
	width: 32px;
	height: 32px;
	vertical-align: middle;
	margin-left: 36px;
} */







/* ---------------- TABS ----------------  */