/**************************************************************************
*	 Zozo Tabs: Clean
*
*    1 Clean Structure
*    2. Vertical Positioning 
*    3. Vertical Rounded Cornors
*    4. Vertical Shadows
*    5. Vertical Mobile
*    
*   Most of the time you shouldn't delete/edit section 1 (structure).
*   You can delete/edit rounded, shadows and mobile section if you need.
* 
**************************************************************************/

/*#region ==========================================================================
    Clean structure
========================================================================== */

.z-tabs.clean.horizontal > ul > li.z-active
{
    top: 0;
    margin-top: 0;
    padding-top: 0;
    margin-bottom: 0;
    padding-bottom: 0;   
}

.z-tabs.clean > ul > li.z-active > a {
    font-weight: bold;
}

.z-tabs.clean.white.z-bordered > ul > li.z-active > a {
    color:inherit;
}

.z-tabs.clean > .z-container
{
    border-width: 0;
    background: none;
}

.z-tabs.clean.horizontal > .z-container > .z-content > .z-content-inner
{
    padding: 24px 0;
}

/*top*/
.z-tabs.clean.horizontal.top > ul > li > a
{
    border-bottom-width: 1px;
}


/*bottom*/
.z-tabs.clean.horizontal.bottom > ul > li > a
{
    border-top-width: 1px;
}
/*#endregion*/




/*#region ==========================================================================
    Shadows
========================================================================== */

.z-tabs.clean.z-shadows > ul > li.z-active > a {
    -webkit-box-shadow: inset 0px 0px 1.143em 0px rgba(0, 0, 0, 0.13);
    -moz-box-shadow: inset 0px 0px 1.143em 0px rgba(0, 0, 0, 0.13);
    box-shadow: inset 0px 0px 1.143em 0px rgba(0, 0, 0, 0.13);
    background: #F3F3F3;
}

.z-tabs.clean.z-shadows.black2 > ul > li.z-active > a {
    -webkit-box-shadow: inset 0px 0px 14px 0px rgba(0, 0, 0, 0.35);
    -moz-box-shadow: inset 0px 0px 14px 0px rgba(0, 0, 0, 0.35);
    box-shadow: inset 0px 0px 14px 0px rgba(0, 0, 0, 0.35);
    background: #242424;
}

.z-tabs.clean.vertical.z-shadows > ul,
.z-tabs.clean.z-shadows > .z-container {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
/*#endregion*/




/*#region ==========================================================================
    Rounded
========================================================================== */

.z-tabs.clean.z-rounded.top > ul > li.z-first > a,
.z-tabs.clean.z-rounded.bottom > ul > li.z-first > a
{
    -webkit-border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
}

.z-tabs.clean.top.z-rounded > ul > li.z-last > a,
.z-tabs.clean.bottom.z-rounded > ul > li.z-last > a
{
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}

.z-tabs.clean.horizontal.top.z-rounded > ul > li.z-last-row.z-first-col > a
{
    -webkit-border-radius: 0 0 0 5px;
    -moz-border-radius: 0 0 0 5px;
    border-radius: 0 0 0 5px;
}

.z-tabs.clean.responsive.horizontal.top.z-rounded > ul > li.z-last-row.z-last-col > a
{
    -webkit-border-radius: 0 0 5px 0;
    -moz-border-radius: 0 0 5px 0;
    border-radius: 0 0 5px 0;
}


/*#endregion*/




/*#region ==========================================================================
    vertical
========================================================================== */


/*vertical*/
.z-tabs.clean.vertical > ul.z-tabs-desktop
{
    border-width: 1px 1px 1px 1px;
}


.z-tabs.clean.vertical > ul > li.z-active
{
    z-index: 7;
}

.z-tabs.clean.vertical > .z-container > .z-content > .z-content-inner
{
    padding: 0 2em;
}

/*vertical rounded*/
.z-tabs.clean.vertical.z-rounded > ul.z-tabs-desktop
{
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.z-tabs.clean.vertical.mobile.z-rounded > ul.z-tabs-desktop
{
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.z-tabs.clean.vertical.z-rounded > ul.z-tabs-desktop > li.z-first,
.z-tabs.clean.vertical.z-rounded > ul.z-tabs-desktop > li.z-first > a
{
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

.z-tabs.clean.vertical.z-rounded > ul.z-tabs-desktop > li.z-last,
.z-tabs.clean.vertical.z-rounded > ul.z-tabs-desktop > li.z-last > a
{
    -webkit-border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}



/*#endregion*/




/*#region ==========================================================================
    Responsive
========================================================================== */

.z-tabs.horizontal.clean.responsive.top > ul > li > a
{
    border-bottom-width: 0;
}
.z-tabs.clean.responsive.horizontal.bottom > ul > li > a
{
    border-top-width: 0;
}

.z-tabs.clean.responsive.horizontal.bottom > ul > li.z-first-row > a
{
    border-top-width: 1px;
}


/*
.z-tabs.horizontal.clean.responsive.bottom > ul > li > a
{
    border-top-width: 0;
}*/

.z-tabs.clean.responsive.horizontal.bottom > ul > li.z-first-row > a,
.z-tabs.clean.responsive.horizontal.top > ul > li.z-last-row > a,
.z-tabs.clean.responsive.horizontal.bottom > ul > li.z-last-row > a
{
    border-bottom-width: 1px;
}

.z-tabs.horizontal.clean.responsive.z-rounded.top > ul > li.z-first > a
{
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-left-radius: 0;
}

.z-tabs.clean.responsive.horizontal.z-rounded.top > ul > li.z-last > a
{
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}

/*
.z-tabs.clean.top.responsive > .z-container
{
    border-top-width: 1px;
}

.z-tabs.clean.bottom.responsive > .z-container
{
    border-bottom-width: 1px;
}*/


/*#endregion*/




/*#region ==========================================================================
    mobile
========================================================================== */
.z-tabs.clean.white.mobile > ul > li.z-active > a
{
    -webkit-box-shadow: inset 0px 0px 12px 0px rgba(0, 0, 0, 0.13);
    -moz-box-shadow: inset 0px 0px 12px 0px rgba(0, 0, 0, 0.13);
    box-shadow: inset 0px 0px 12px 0px rgba(0, 0, 0, 0.13);
    background: #F3F3F3;
}


.z-tabs.clean.horizontal.mobile.top > ul > li,
.z-tabs.clean.horizontal.mobile.bottom > ul > li
{
    border-bottom-width: 0;
}

/*#endregion*/