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


/*#region ==========================================================================
     Vertical Structure 
========================================================================== */

.z-tabs.vertical > ul { float: left; border-width: 1px 0 1px 1px; min-width: 200px; width: 25%; }
.z-tabs.vertical > ul > li > a { border-width: 0 0 1px 0; }
.z-tabs.vertical > ul > li.z-last > a { border-bottom-width: 0; }
.z-tabs.vertical > ul > li.z-active > a { border-right-width: 0; z-index: 10; }
.z-tabs.vertical > ul > li.z-active.z-first > a { border-bottom-width: 1px; }

/*#endregion*/




/*#region ==========================================================================
     Vertical Positioning
========================================================================== */

/*top-left*/
.z-tabs.vertical.top-left > ul{  margin-left:0;  margin-right: -1px;}
.z-tabs.vertical.top-right > ul{ margin-right:0;   margin-left: -1px;}

.ie7 body .z-tabs.vertical.top-left > ul{    margin-right: 0;}
.ie7 body .z-tabs.vertical.top-right > ul{    margin-left: 0;}
.ie7 body .z-tabs.vertical.top-left > ul > li, 
.ie7 body .z-tabs.vertical.top-left > ul > li > .z-link,
.ie7 body .z-tabs.vertical.top-left > ul { z-index: 10 !important; }
.ie7 body .z-tabs.vertical.top-left > ul > li.z-active > a { border-right: 1px solid #fff !important; }

/*top-right*/
.z-tabs.vertical.top-right > ul{float: right;border-width: 1px 1px 1px 0;}

.ie7 body .z-tabs.vertical.top-right > ul > li.z-active  > a{ border-right-width: 0 !important; border-left: 1px solid #fff !important; left:-1px; }
.ie7 body .z-tabs.vertical.top-right > ul > li, 
.ie7 body .z-tabs.vertical.top-right > ul { z-index: 10 !important; }
.ie7 body .z-tabs.vertical.top-right > .z-container { }



/*#endregion*/




/*#region ==========================================================================
     Vertical Rounded Cornors
========================================================================== */

    /*top-left*/
    .z-tabs.vertical.z-rounded > .z-container
    {
        -webkit-border-radius: 0 6px 6px 0;
        -moz-border-radius: 0 6px 6px 0;
        border-radius: 0 6px 6px 0;
    }

    .z-tabs.vertical.z-rounded > ul
    {
        -webkit-border-radius: 6px 0 0 6px;
        -moz-border-radius: 6px 0 0 6px;
        border-radius: 6px 0 0 6px;
    }

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

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

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

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

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

    .z-tabs.vertical.z-rounded.top-right > .z-container
    {
        -webkit-border-radius: 6px 0 0 6px;
        -moz-border-radius: 6px 0 0 6px;
        border-radius: 6px 0 0 6px;
    }

/*#endregion*/




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

.z-tabs.vertical.z-shadows > ul,
.z-tabs.vertical.z-shadows > .z-container
{ 
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.125);
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.125);
    box-shadow:  0 1px 6px rgba(0, 0, 0, 0.125);
} 
.z-tabs.vertical.z-shadows > ul > li > a
{ 
    -webkit-box-shadow: 0 1px 3px -3px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 3px -3px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 3px -3px rgba(0, 0, 0, 0.15); 
}

/*#endregion*/