/*$Id$*/

/*---- Font family variables starts ----*/



@font-face {
    font-family: 'zoho-puvi';
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.eot');
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.eot') format('embedded-opentype'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'zoho-puvi';
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Medium.eot');
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Medium.eot') format('embedded-opentype'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Medium.woff2') format('woff2'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'zoho-puvi';
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Semibold.eot');
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Semibold.eot') format('embedded-opentype'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Semibold.woff2') format('woff2'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Semibold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'zoho-puvi';
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Bold.eot');
    src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Bold.eot') format('embedded-opentype'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Bold.woff2') format('woff2'),url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

/*---- Font family variables end ----*/

*{
	margin:0;
	padding:0;
}
html,body{
	font: 14px/1.5 zoho-puvi,sans-serif,arial;
	height: 100%;
	display: flex;
	flex-grow: 1;
	color:#2e3653;
}
a{
	text-decoration: none;
	color:#2e3653;
}
.zl-ul-reset{
	list-style: none;
}
.zl-overflow-auto{
	overflow:auto;
} 
.zl-flex{
	display:flex;
}
.zl-fl-column{
	flex-direction: column;
}
.zl-fl-grow{
	flex-grow: 1;
}
.zl-mx-header{
	padding:18px 25px;
	box-shadow:0 2px 5px rgba(0, 0, 0, 0.08);
	position: sticky;
	top: 0;
	z-index: 1;
}
.zl-banner{
    height: 200px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}
.zl-mx-container{
	display: flex;	
	flex-grow:1;	
	overflow:hidden;
}
.zl-mx-nav{
	background: #fafafa;
	border-inline-end: 2px solid #f1f1f1;
	width:300px;
}
.zl-mx-nav .zl-expand-collapse{
	padding:15px 35px 0;
	cursor: pointer;
	user-select: none;
	font-size: 10px;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: .5px;
}
.zl-mx-nav .zl-expand-collapse:hover{
	text-decoration: underline;
}
.zl-mx-nav > ul{
	padding: 20px 25px;
}
.zl-mx-nav > ul ul{
	margin-inline-start:15px;
}
.zl-mx-nav > ul li a{
	display:block;
	padding-block:5px;
	margin-inline-start:-5px;
}
.zl-mx-nav > ul li.zl-mx-active > a{
	color:#09f;
}
.zl-mx-nav > ul li ul li:last-child{
	margin-bottom:10px;
}
.zl-mx-nav > ul li .zl-mx-chapter{
	padding:0 10px;
	margin-top:10px;
	display:block;
	position: relative;
	cursor: pointer;
}
.zl-mx-nav > ul li .zl-mx-chapter:before{
	content: "";
    width: 0;
    height: 0;
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    border-inline-start: 5px solid #627d8d;
    position: absolute;
    inset-inline-start: -5px;
    top: 7px;
    transition: all .2s ease;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    -ms-transition: all .2s ease;
}
.zl-mx-nav > ul li .zl-mx-chapter.zl-expand:before{
	transform: rotateZ(90deg);
}

.zl-content-container{
	flex-grow:1;	
	border:none;
}
.zl-hide{
    display:none;
}