@charset "utf-8";
/**************************************************************************
*	@name		    Zozo UI Tabs
*	@descripton	    Create awesome tabbed content area
*	@version	    5.0
*   @requires       jQuery v1.7 or later
*	@copyright      Copyright (c) 2013 Zozo UI
*   @author         Zozo UI
*   @URL:           http://www.zozoui.com
*
*    1. Core (structure)
*    2. Sizes 
*    3. Video 
*    4. Icons
*    5. Helper classes
*    
*   Most of the time you shouldn't delete/edit section 1 (Core).
*   You can delete/edit sizes, video, icons support and Helper classes if you need.
* 
**************************************************************************/



/*#region ==========================================================================
    Core (structure)
========================================================================== */

.z-tabs *, .z-tabs:before, .z-tabs:before
{
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

.z-tabs,
.z-tabs > ul.z-tabs-nav,
.z-tabs > ul.z-tabs-nav > li,
.z-tabs > ul.z-tabs-nav > li > a.z-link
{
    
}


.z-tabs {
    margin: auto;
    padding: 0;
    clear: both;
    color: #333;
    font: 12px/1.7em "Helvetica Neue",Helvetica,Arial,sans-serif;  
    font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;  
}

.z-tabs > ul.z-tabs-nav {
	position: relative;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    list-style: none;
}

.z-tabs > ul.z-tabs-nav > li {
	background: #F9F9F9;
    background:#fff;
    position: relative;
    display: block;
    list-style-type: none;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

.z-tabs > ul.z-tabs-nav > li:hover {
	outline: 0 none;
    text-decoration: none;
}

.z-tabs > ul.z-tabs-nav > li.z-active,
.z-tabs > ul.z-tabs-nav > li.z-active:hover {
	background: #fff;
    font-weight: bold;
}

.z-tabs > ul.z-tabs-nav > li,
.z-tabs > ul.z-tabs-nav > li > a.z-link {
	cursor: pointer;
}

.z-tabs > ul.z-tabs-nav > li.z-active,
.z-tabs > ul.z-tabs-nav > li.z-active > a.z-link {
	cursor: default;
    font-weight: normal;
}

 .z-tabs > ul.z-tabs-nav > li > a.z-link {
	display: block;
    position: relative;
    outline: 0;
    color: #111;
    line-height: 18px;
    text-decoration: none;
    font-weight: inherit;
    font-size: 1.11em;
}
  
.z-tabs > ul.z-tabs-nav,
.z-tabs > ul.z-tabs-nav > li,
.z-tabs > .z-container {
	border-color: #CECECE;        
    border-style: solid;
}

.z-tabs > .z-container {
	padding: 0;
    margin: 0;
    border-width: 1px;
    background: #fff;
    position: relative;
    font-size: 1.2em;
    /*min-height: 100px;*/
}

.z-tabs > .z-container > .z-content {
	display: none;
    background: none;
}

.z-tabs > .z-container > .z-content > .z-content-inner {
	padding: 1.4em 2em;
    height: auto;
}

/*clear floats after each content*/
.z-tabs > .z-container > .z-content::after,
.z-tabs > .z-container > .z-content > .z-content-inner::after {
    content: ".";
	display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/*clear floats after each content For IE 6/7 */
.z-tabs > .z-container > .z-content,
.z-tabs > .z-container > .z-content > .z-content-inner {
	zoom: 1;
}

/* animation sliding effects */
.z-tabs.z-slide > .z-container {
	overflow: hidden;
}

.z-tabs.z-slide > .z-container > .z-content,
.z-tabs > .z-container.z-animating > .z-content {
	position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0;
    z-index: 7;
}

.z-tabs.z-slide > .z-container > .z-content.z-active {
	z-index: 8;
}

/*#endregion*/

/**/
.z-tabs.vertical.mini > ul.z-tabs-nav > li > a.z-link,
.z-tabs.vertical.small > ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.mini >  ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.small >  ul.z-tabs-nav > li > a.z-link  {font-weight: inherit;}

.z-tabs.vertical.mini > ul.z-tabs-nav > li.z-active > a.z-link,
.z-tabs.vertical.small > ul.z-tabs-nav > li.z-active > a.z-link,
.z-tabs.horizontal.mini >  ul.z-tabs-nav > li.z-active > a.z-link,
.z-tabs.horizontal.small >  ul.z-tabs-nav > li.z-active > a.z-link  {font-weight: bold;}
    

/* version 4.0 */
.z-tabs.vertical.mini > ul.z-tabs-nav > li > a.z-link   {height: 34px;line-height: 34px;margin:0 10px 0 0;font-size: 11px;}
.z-tabs.vertical.small > ul.z-tabs-nav > li > a.z-link  {height: 40px;line-height: 40px;margin:0 12px;font-size: 11px;}
.z-tabs.vertical.medium > ul.z-tabs-nav > li > a.z-link {height: 46px;line-height: 46px;margin:0 14px;font-size: 12px;}
.z-tabs.vertical.large > ul.z-tabs-nav > li > a.z-link  {height: 52px;line-height: 52px;margin:0 18px;font-size: 13px;}
.z-tabs.vertical.xlarge > ul.z-tabs-nav > li > a.z-link {height: 58px;line-height: 56px;margin:0 20px;font-size: 14px;}
.z-tabs.vertical.xxlarge > ul.z-tabs-nav > li > a.z-link{height: 62px;line-height: 60px;margin:0 22px 0 20px;font-size: 14px;}


.z-tabs.vertical.top-left > ul.z-tabs-nav > li > a.z-link {padding-left:20px;margin-left:0;}
.z-tabs.vertical.top-right > ul.z-tabs-nav > li > a.z-link {padding-right:20px;margin-right:0;}

.z-tabs.vertical.mini > ul.z-tabs-nav{min-width: 180px;width:25%;}
.z-tabs.vertical.small > ul.z-tabs-nav {min-width: 180px;width:25%;}
.z-tabs.vertical.medium > ul.z-tabs-nav {min-width: 200px;width:25%;}
.z-tabs.vertical.large > ul.z-tabs-nav {min-width: 220px;width:25%;}
.z-tabs.vertical.xlarge > ul.z-tabs-nav {min-width: 240px;width:25%;}
.z-tabs.vertical.xxlarge > ul.z-tabs-nav {min-width: 260px;width:25%;}

.z-tabs.horizontal.mini >  ul.z-tabs-nav > li > a.z-link    {font-size: 11px;padding: 7px 20px;}
.z-tabs.horizontal.small >  ul.z-tabs-nav > li > a.z-link   {font-size: 11px;padding: 10px 20px;}
.z-tabs.horizontal.medium >  ul.z-tabs-nav > li > a.z-link  {font-size: 12px;padding: 13px 24px;}
.z-tabs.horizontal.large >  ul.z-tabs-nav > li > a.z-link   {font-size: 13px;padding: 16px 28px;}
.z-tabs.horizontal.xlarge >  ul.z-tabs-nav > li > a.z-link  {font-size: 14px;padding: 19px 32px;/*padding:20px 40px 8px 20px*/}
.z-tabs.horizontal.xxlarge >  ul.z-tabs-nav > li > a.z-link {font-size: 14px;padding: 22px 36px;}

/**/
.z-tabs.horizontal.top-compact.mini >  ul.z-tabs-nav > li > a.z-link    {font-size: 11px;padding: 7px 10px;}
.z-tabs.horizontal.top-compact.small >  ul.z-tabs-nav > li > a.z-link   {font-size: 11px;padding: 10px 11px;}
.z-tabs.horizontal.top-compact.medium >  ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.top.responsive.medium >  ul.z-tabs-nav > li > a.z-link  {font-size: 12px;padding: 13px 12px;}
.z-tabs.horizontal.top-compact.large >  ul.z-tabs-nav > li > a.z-link   {font-size: 13px;padding: 16px 13px;}
.z-tabs.horizontal.top-compact.xlarge >  ul.z-tabs-nav > li > a.z-link  {font-size: 13px;padding: 19px 14px;}
.z-tabs.horizontal.top-compact.xxlarge >  ul.z-tabs-nav > li > a.z-link {font-size: 14px;padding: 22px 15px;}

/* version 5.0
.z-tabs.horizontal.top.responsive.mini >  ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.top.responsive.small >  ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.top.responsive.medium >  ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.top.responsive.large >  ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.top.responsive.xlarge >  ul.z-tabs-nav > li > a.z-link,
.z-tabs.horizontal.top.responsive.xxlarge >  ul.z-tabs-nav > li > a.z-link    {padding-left:8px;padding-right:8px;}*/

/* version 4.0 multiline
.z-tabs.horizontal.bottom-compact.mini >  ul.z-tabs-nav > li > a.z-link  {font-size: 11px;padding: 7px 0px;}
.z-tabs.horizontal.bottom-compact.small >  ul.z-tabs-nav > li > a.z-link   {font-size: 11px;padding: 10px 0px;}
.z-tabs.horizontal.bottom-compact.medium >  ul.z-tabs-nav > li > a.z-link  {font-size: 12px;padding: 13px 0px;}
.z-tabs.horizontal.bottom-compact.large >  ul.z-tabs-nav > li > a.z-link   {font-size: 13px;padding: 16px 0px;}
.z-tabs.horizontal.bottom-compact.xlarge >  ul.z-tabs-nav > li > a.z-link  {font-size: 13px;padding: 19px 0px;}
.z-tabs.horizontal.bottom-compact.xxlarge >  ul.z-tabs-nav > li > a.z-link {font-size: 14px;padding: 22px 0px;}
    */
/* version 4.0 multiline
.z-tabs.horizontal.mobile.mini > ul.z-tabs-nav > li > a.z-link   {height: 32px;line-height: 32px;margin:0 10px;font-size: 11px;padding-top:0;padding-bottom:0;}
.z-tabs.horizontal.mobile.small > ul.z-tabs-nav > li > a.z-link  {height: 38px;line-height: 38px;margin:0 12px;font-size: 11px;padding-top:0;padding-bottom:0;}
.z-tabs.horizontal.mobile.medium > ul.z-tabs-nav > li > a.z-link {height: 44px;line-height: 44px;margin:0 14px;font-size: 12px;padding-top:0;padding-bottom:0;}
.z-tabs.horizontal.mobile.large > ul.z-tabs-nav > li > a.z-link  {height: 50px;line-height: 50px;margin:0 18px;font-size: 13px;padding-top:0;padding-bottom:0;}
.z-tabs.horizontal.mobile.xlarge > ul.z-tabs-nav > li > a.z-link {height: 56px;line-height: 56px;margin:0 20px;font-size: 13px;padding-top:0;padding-bottom:0;}
.z-tabs.horizontal.mobile.xxlarge > ul.z-tabs-nav > li > a.z-link{height: 62px;line-height: 62px;margin:0 22px;font-size: 14px;padding-top:0;padding-bottom:0;}
    */


/*#endregion*/




/*#region ==========================================================================
    Video Support, Youtube, Vimeo, Iframe
========================================================================== */

.z-tabs .z-video
{
    position: relative;
    padding-bottom: 46.25%;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

    .z-tabs .z-video iframe,
    .z-tabs .z-video object,
    .z-tabs .z-video embed
    {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border:none;
        z-index: 50;
    }

/*#endregion*/




/*#region ==========================================================================
    Icons Support
========================================================================== */


/* Font Awesome */
.z-tabs > ul.z-tabs-nav > li > a.z-link i
{
    font-size: 16px;
    display: inline;
    width: auto;
    height: auto;
    line-height: normal;
}

.z-tabs > ul.z-tabs-nav > li > a.z-link > span.z-icon,
.z-tabs.z-multiline > ul.z-tabs-nav.z-tabs-desktop > li > a.z-link > span.z-icon,
.z-tabs.z-multiline > ul.z-tabs-nav.z-tabs-mobile > li > a.z-link > span > span.z-icon
{
    width: 20px;
    display: inline-block;
    font-size: inherit;
    font-weight: normal;
    text-transform: initial;
    text-align: left;
}

.z-tabs.vertical > ul.z-tabs-nav > li > a.z-link > span.z-icon,
.z-tabs.z-multiline.vertical > ul.z-tabs-nav.z-tabs-desktop > li > a.z-link > span.z-icon,
.z-tabs.z-multiline.vertical > ul.z-tabs-nav.z-tabs-mobile > li > a.z-link > span > span.z-icon {
    width: 24px;
}



/*#endregion*/




/*#region ==========================================================================
    Helper classes
========================================================================== */


    /*align tabs titles center*/
.z-tabs.center > ul.z-tabs-nav > li > a.z-link,
.z-tabs.center.mobile > ul.z-tabs-nav > li > a.z-link {
	text-align: center !important;
}

    /*align tabs titles right*/
.z-tabs.right > ul.z-tabs-nav > li > a.z-link,
.z-tabs.right.mobile > ul.z-tabs-nav > li > a.z-link {
	text-align: right !important;
}


    /*align tabs titles left*/
.z-tabs.left > ul.z-tabs-nav > li > a.z-link,
.z-tabs.left.mobile > ul.z-tabs-nav > li > a.z-link {
	text-align: left !important;
}

    /*z-nopadding on content*/
.z-tabs.vertical > .z-container > .z-content.z-nopadding > .z-content-inner,
.z-tabs.horizontal > .z-container > .z-content.z-nopadding > .z-content-inner {
	padding: 0;
}

/*Clear the float on any element*/
.clearfix
{
    *zoom: 1;
}

.clearfix:before,
.clearfix:after {
	display: table;
    content: "";
    line-height: 0;
}

.clearfix:after {
	clear: both;
}
/*#endregion*/