@charset "UTF-8";

/*************************************************************************
*   Header START
**************************************************************************/
header #header {
	z-index: 1500; *zoom:1; clear:both; margin:0px auto; table-layout:fixed; /*background: url("images/img_sample.jpg") repeat center center;*/
	position:fixed; top: 0px;
	width: 100%; height:80px;
	
	-webkit-transition: background 0.35s linear, height 0.35s ease-in;
	transition: background 0.35s linear, height 0.35s ease-in;
	/*background: url("../images/img_sample.jpg") repeat center center;*/
	/*
	transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	*/
	background-color:#111;
	background-color:rgba(0,0,0, 0.3);
	border-bottom: 1px solid rgba(0,0,0, 0.3);
}
.no_header_line header #header { border: none !important; } /* header with bg on body */

header #header.open {
	position:absolute !important;
	background-color:#000;
	background-color:rgba(10,10,10, 1) !important;
	height: 100% !important;
} 
header #header.open #nav {
	position: fixed;
	/* Permalink - use to edit and share this gradient0.90.90.90.9: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.7+0,0.8+100 */
	background: -moz-linear-gradient(top,  rgba(45,45,45, 1) 0%, rgba(19,19,19, 0.9) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(45,45,45, 1)), color-stop(100%,rgba(19,19,19, 0.9))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(45,45,45, 1) 0%,rgba(19,19,19, 0.9) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(45,45,45, 1) 0%,rgba(19,19,19, 0.9) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(45,45,45, 1) 0%,rgba(19,19,19, 0.9) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(45,45,45, 1) 0%,rgba(19,19,19, 0.9) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#cc000000',GradientType=0 ); /* IE6-9 */
}

header #header #profile,
header #header #nav_mobile {
	display: none;
	visibility: hidden;
}
header #header.open #profile,
header #header.open #nav_mobile {
	display: block;
	visibility: visible;
}

/*************************************************************************
	NAV (GENERAL NAVI BAR)
	nav (#nav_round|#nav_bar) #nav_box (#nav|#nav_link) .menu (.hsub|.sub)
*************************************************************************/
/* opacity:0.9; -khtml-opacity:0.9; -moz-opacity:0.9; filter: alpha(opacity=90); */
 
#nav {
	Z-INDEX:500; clear:both; margin:0px auto; background:transparent;
	width: 100%;
	height: 80px;
}

#nav > #nav_frame {
	display:inline-block; clear:both; margin:0px auto; table-layout:fixed;
	width: 100%;
}
#sample_bg_test_not_used {
	/* Permalink - use to edit and share this gradient0.90.90.90.9: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.7+0,0.8+100 */
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.9) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.9)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#cc000000',GradientType=0 ); /* IE6-9 */
}
#nav > #nav_frame > #nav_bg > ul#nav_logo,
#nav > #nav_frame > #nav_bg > ul#nav_menu {
	z-index: 1000;
}
/*************************************************************************
/* Effect - transition
*************************************************************************/
#nav > #nav_frame > #nav_bg > ul#nav_logo li.menu > a.link > img,
#nav > #nav_frame > #nav_bg > ul li.menu > a.link,
#nav > #nav_frame > #nav_bg > ul li.menu > .subs > li.menu a.link,
#nav > #nav_frame > #nav_bg > ul li.menu > .subs > li.menu a.link .badge,
#nav > #nav_frame > #nav_bg > ul input.search { 
	-webkit-transition:250ms ease-in-out !important; -moz-transition:250ms ease-out !important; -ms-transition:250ms ease-in-out !important; -o-transition:250ms ease-in !important; transition:250ms ease-in-out !important; 
}
#nav_frame > #nav_bg > ul#nav_menu > li.menu:hover > .subs {
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}


/*************************************************************************
/* Structure
*************************************************************************/
#nav_bg { clear:both; margin:0px auto; display:table; width: 100%; }
#nav_frame > #nav_bg { clear:both; margin:0px auto; display:table; table-layout:fixed; white-space:nowrap; }
#nav_frame > #nav_bg > ul { display:table; margin:0px auto; width:auto; *height:100%; float:left; *float:left; list-style:none; padding:0px; }
#nav_frame > #nav_bg > ul li.menu { display:table-cell; width:auto; position:relative; float:left; *float:left; list-style:none; padding:0px; }

#nav_frame > #nav_bg > ul#nav_menu,
#nav_frame > #nav_bg > ul#nav_button { float:right; *float:right; }


/*************************************************************************
	Hights
*************************************************************************/
#nav_frame > #nav_bg > ul#nav_logo li.menu img { vertical-align: middle; }
#nav_frame > #nav_bg > ul > li.menu > a.link { height:80px; max-height:80px; line-height: 80px; vertical-align: middle; }
#nav_frame > #nav_bg > ul#nav_button > li.menu a.link .button { height:32px !important; max-height:32px !important; line-height: 32px; } /* padding:9px 0px 9px 0px; - line 140 */


/*************************************************************************
	style
*************************************************************************/
#nav_frame > #nav_bg > ul > li.menu > a.link {
	display:table-cell; position:relative; white-space:nowrap; vertical-align:middle; outline: 0 none;
	font-size:12px; letter-spacing:-0.2px; text-decoration:none; font-weight:500; text-align:center;
	padding-left:15px; padding-right:15px; padding-top:1px;
}
#nav_frame > #nav_bg > ul > li.menu > a.link.icon {
	padding-left:10px; padding-right:10px;
}
#nav_frame > #nav_bg > ul > li.subs_down > a.link:after { content: "\f107"; display: inline-block; padding-left:7px; }

#nav_frame > #nav_bg > ul#nav_menu > li.menu > a.link.icon {
	font-size: 14px !important;
}
#nav_frame > #nav_bg > ul#nav_menu > li.menu > a.link.icon .badge {
	font-size: 9px !important;
	opacity: 1 !important;
	margin-top: -15px;
	margin-left: -5px;
}

#nav_frame > #nav_bg > ul > li.menu a.link .button {
	display:inline-block; position:relative; white-space:nowrap; vertical-align:middle; outline: 0 none;
	
	font-size:12px; letter-spacing:-0.2px; text-decoration:none; font-weight:600; text-align:center;
	padding-left:7px; padding-right:7px; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;
}


/*************************************************************************
	Color
*************************************************************************/
#nav_frame > #nav_bg > ul > li.menu > a.link { color:#fff; opacity: 0.7; }
#nav_frame > #nav_bg > ul > li.menu > a.active,
#nav_frame > #nav_bg > ul > li.menu > a.link:hover,
#nav_frame > #nav_bg > ul > li.menu > ul.subs:hover + a.link { color:#fff !important; opacity: 0.99 !important; }

#nav_frame > #nav_bg > ul#nav_logo a.link { color: #fff; font-size: 22px; font-weight: 600; letter-spacing: -1px; }



/* logo */
#nav_frame > #nav_bg > ul#nav_logo a.link { padding-left:0px !important; }

#nav_frame > #nav_bg > ul#nav_logo a.link,
#nav_frame > #nav_bg > ul#nav_logo a.link > img { opacity: 1 !important; }
#nav_frame > #nav_bg > ul#nav_logo a.link:hover > img,
#nav_frame > #nav_bg > ul#nav_menu > li.menu > a.link:hover > img { opacity:0.8 !important; -khtml-opacity:0.8; -moz-opacity:0.8; filter: alpha(opacity=80); }



#nav_frame > #nav_bg > ul#nav_menu > li.menu {
 display: none;
}
#nav_frame > #nav_bg > ul#nav_menu > li.menu.search,
#nav_frame > #nav_bg > ul#nav_menu > li.menu.profile {
 display: table-cell;
}











/*************************************************************************
	MENU - Sub
*************************************************************************/
#nav ul#nav_menu > li.menu:hover > .subs { /* sub menu animation */
	position: absolute; left: 0;
	
	width: 250px !important; 
	-webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1);
}
#nav ul#nav_menu > li.menu > .subs {
	z-index:1000;
	position: absolute; left: 0px;
	width: 250px !important; 
	
	display:table;
	
	-webkit-border-radius:7px; border-radius:7px; -moz-border-radius:7px;
	
	box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.30) !important; -webkit-box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.30) !important; -moz-box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.30) !important;
	
	-webkit-transform: scaleY(0); -moz-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0);
	-webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; transform-origin: 0 0;
	-webkit-transition: -webkit-transform 0.2s linear; -moz-transition: -moz-transform 0.2s linear; -ms-transition: -ms-transform 0.2s linear; -o-transition: -o-transform 0.2s linear; transition: transform 0.2s linear;
}

#nav ul#nav_menu > li.menu.right:hover > .subs { /* sub menu animation */
	position: absolute; right: 0 !important; left: auto;
}
#nav ul#nav_menu > li.menu.right > .subs {
	z-index:1000;
	position: absolute; right: 0px !important; left: auto;
}

/* position */
#nav_frame > #nav_bg > ul#nav_menu > li.menu > .subs { top:80px; }
#header.header_mobile #nav > #nav_frame > #nav_bg > ul > li.menu > .subs { top:60px !important; }


#nav ul#nav_menu > li.menu > .subs > li.first_sli { 
	border-top-left-radius:7px !important; -webkit-border-top-left-radius:7px !important; -moz-border-top-left-radius:7px !important;  border-top-right-radius:7px !important; -webkit-border-top-right-radius:7px !important; -moz-border-top-right-radius:7px !important; 
	border-bottom-left-radius:0px !important; -webkit-border-bottom-left-radius:0px !important; -moz-border-bottom-left-radius:0px !important;  border-bottom-right-radius:0px !important; -webkit-border-bottom-right-radius:0px !important; -moz-border-bottom-right-radius:0px !important; 
}
#nav ul#nav_menu > li.menu > .subs > li.last_sli { border-bottom-width:0px !important;
	border-bottom-left-radius:7px !important; -webkit-border-bottom-left-radius:7px !important; -moz-border-bottom-left-radius:7px !important;  border-bottom-right-radius:7px !important; -webkit-border-bottom-right-radius:7px !important; -moz-border-bottom-right-radius:7px !important;  
	border-top-left-radius:0px !important; -webkit-border-top-left-radius:0px !important; -moz-border-top-left-radius:0px !important;  border-top-right-radius:0px !important; -webkit-border-top-right-radius:0px !important; -moz-border-top-right-radius:0px !important; 
}

#nav ul#nav_menu > li.menu > ul.subs > li:nth-child(2) {
	 border-top: 0px !important;	 
}
#nav ul#nav_menu > li.menu > ul.subs > li:last-child {
	 border-bottom: 0px !important;	 
}


/* Sub Link (Li and A) */
#nav ul#nav_menu > li.menu > .subs > li.menu { display:table-cell; width:100% !important; height:100%; position:relative; float:left; *float:left; list-style:none; padding:0px; } 
#nav ul#nav_menu > li.menu > .subs > li.menu a.link { 
	display:block; position:relative; white-space:nowrap; vertical-align:middle; outline: 0 none;
	font-size:13px; letter-spacing:-0.2px; text-decoration:none; font-weight:600; text-align:left;
    padding:8px 12px 9px 12px; width:100%; 
}
#nav ul#nav_menu > li.menu > .subs > li.menu a.link:after {
	content: "\f105";
	display: inline-block;
	position: absolute;
	top: 8px;
	right: 10px;
}
#nav ul#nav_menu > li.menu > .subs > li.menu a > .badge { margin-right:10px; }
#nav ul#nav_menu > li.menu > .subs > li.menu > img.arrow_right { position:absolute; width:19px; height:19px; top:8px; right:10px; opacity:0.5; -khtml-opacity:0.5; -moz-opacity:0.5; filter: alpha(opacity=50); }
#nav ul#nav_menu > li.menu > .subs > li.menu:hover > img.arrow_right { opacity:1; -khtml-opacity:1; -moz-opacity:1; filter: alpha(opacity=100); }

#nav ul#nav_menu > li.menu > .subs > .subs-arrow { display: block; text-align: left; width: 100%; position: absolute; top: 0; left: 0; z-index: -1; }

#nav ul#nav_menu > li.menu.right > .subs > .subs-arrow { display: block; text-align: right; width: 100%; position: absolute; top: 0; left: auto; right: 0 !important; z-index: -1; }
 
 

/** Sub **/
#nav ul#nav_menu > li.menu > .subs {
	border:1px solid #111; border-width: 0 1px 1px;
	background-color:#353535; 
	background: -webkit-gradient(linear, left top, left bottom, from(#353535), to(#212121));
	background: -webkit-linear-gradient(top, #353535, #212121);
	background: -moz-linear-gradient(top, #353535, #212121);
	background: -ms-linear-gradient(top, #353535, #212121);
	background: -o-linear-gradient(top, #353535, #212121);
	background: linear-gradient(top, #353535, #212121); /* W3C */
}
#nav ul#nav_menu > li.menu > ul.subs > li.menu { border-top:1px solid #414141; border-bottom:1px solid #151515; border-style:solid; border-width:1px 0px 1px 0px; }

#nav ul#nav_menu > li.menu > .subs > li.menu > a.link { color:#a1a1a1; text-shadow:rgba(0, 0, 0, 0.5) 0px 1px 1px; }
#nav ul#nav_menu > li.menu > .subs > li.menu > a.link:hover {  color:#0089de !important; } /* pink = #DE2685 */
#nav ul#nav_menu > li.menu > .subs > li.menu > a.highlight { color:#0089de !important; } /* yellow #F3D173 */
#nav ul#nav_menu > li.menu > .subs > li.menu > a.highlight > .badge,
#nav ul#nav_menu > li.menu > .subs > li.menu > a.link:hover > .badge { background:#0089de; }

#nav ul#nav_menu > li.menu > .subs > .subs-arrow .subs-arrow-border { border-color:#353535 !important; display: block; width: 0;  height: 0; position: absolute; border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-bottom: 8px solid; top: -7px; left: 0; margin-left:15px; }

#nav ul#nav_menu > li.menu.right > .subs > .subs-arrow .subs-arrow-border { border-color:#353535 !important; display: block; width: 0;  height: 0; position: absolute; border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-bottom: 8px solid; top: -7px; left: auto;
	right: 0 !important; margin-right:15px; }
 
 
 
 
/* @media */
@media all and (max-width: 1023px) { /* smaller than iPAD landscapes */
	/** { -webkit-text-size-adjust:none; } /* font size - not change */
	header #header {
		height:60px !important; 
		background-color:#111;
		background-color:rgba(0,0,0, 0.8) !important;
		border-bottom: 1px solid rgba(0,0,0, 0.8) !important;
	}
	
	#nav { height:60px !important;  width:100%; text-align: center; z-index: 2000;}
	#nav > #nav_frame > #nav_bg {
		width: 100%;
	}

	#nav > #nav_frame > #nav_bg > ul#nav_logo a.link {
		padding-left: 20px !important;
		font-size: 16px !important;
	}
	#nav > #nav_frame > #nav_bg > ul#nav_menu .search a.link {
		padding-right: 20px !important;
	}
	#nav > #nav_frame > #nav_bg > ul > li.menu > a.link { height:60px !important; max-height:60px !important;  line-height: 60px !important; }
	
	#logo_image {
		height: 30px;
	}
}
@media all and (min-width: 1024px) { /* Desktop */
	#nav > #nav_frame > #nav_bg {
		width: 980px;
	}
	#logo_image {
		height: 35px;
	}
}






 
 /*************************************************************************
 *      Mobile Profile START
 **************************************************************************/
header #header #profile {
	clear: both;
	opacity:0;
	padding: 70px 20px 30px 20px;
		
		border-top:1px solid #212121;
	border-bottom:1px solid #212121;
	-moz-box-shadow: inset 0 -50px 50px rgba(0, 0, 0, .7);
	-webkit-box-shadow: inset 0 -50px 50px rgba(0, 0, 0, .7);
	box-shadow: inset 0 -50px 50px rgba(0, 0, 0, .7);
	-webkit-transition: 350ms ease-in-out; -moz-transition: 350ms ease-in-out; -o-transition: 350ms ease-in-out; transition: 350ms ease-in-out;
}
header #header #profile.open {
	opacity:1;
	padding-top: 80px;
}
header #header #profile .nickname { color:#c1c1c1; text-shadow:rgba(0, 0, 0, 0.5) 0px 1px 1px; font-size: 14px; }
header #header #profile a { color:#b1b1b1; text-shadow:rgba(0, 0, 0, 0.5) 0px 1px 1px; font-size: 12px; }
 
 
 /*************************************************************************
 *      Mobile Nav START
 **************************************************************************/
#nav_mobile {
	clear: both;
	opacity:0;
	padding-top: 0px;
	padding-bottom: 10px;
	-webkit-transition: 350ms ease-in-out; -moz-transition: 350ms ease-in-out; -o-transition: 350ms ease-in-out; transition: 350ms ease-in-out;
}
#nav_mobile.open {
	opacity:1;
}
#nav_mobile li { overflow:hidden; width:100%; }
#nav_mobile li a { 
	display:block; white-space:nowrap; vertical-align: middle;
	opacity:0;
	height: 48px; line-height: 48px; 
	padding-left: 30px;
	
 	border-bottom:1px solid rgb(31, 31, 31); 
 	
 	color:#fff; opacity: 0.7;
 	font-size:20px; font-weight: 200; text-decoration:none;
 	font-family: 'Myriad Set Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
	
	-webkit-transition: 350ms ease-in-out; -moz-transition: 350ms ease-in-out; -o-transition: 350ms ease-in-out; transition: 350ms ease-in-out;
 }
#nav_mobile li a:hover { color:#fff !important; opacity: 0.99 !important; }
 
 
#nav_mobile li a>.arrow:before {
    display: inline;
    float: right;
    width: 25px; height: auto;
    margin-right: 10px;
    color:#fff; opacity: 0.7; font-size: 17px; font-weight: 100; text-shadow: none; text-align: center;
    font-family: FontAwesome;
    content: "\f104";
    -webkit-transition: 350ms ease-in-out; -moz-transition: 350ms ease-in-out; -o-transition: 350ms ease-in-out; transition: 350ms ease-in-out;
 }
#nav_mobile li a>.arrow.active:before {
	color:#fff;
    
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
 }

#nav_mobile li ul.subs {
    display: none;
    list-style: none;
    clear: both;
}
#nav_mobile li ul.subs .subs-arrow { display: none !important; }
 
#nav_mobile li.active>ul.subs {
    display: block;
 }
#nav_mobile li ul.subs>li {
    padding: 0px 0px 0px 30px;
    margin-top: 1px;
}
/* Sub-menu link */
#nav_mobile li ul.subs>li>a { 
	display: block; white-space:nowrap; height: 48px; line-height: 48px; vertical-align: middle; font-size:16px; font-weight: normal; border-bottom:1px solid rgb(21, 21, 21);
 	color: #999;
 	font-family: 'Myriad Set Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
	font-weight: 200;
}
#nav_mobile li.active>a,
#nav_mobile li ul.subs>li.active a,
#nav_mobile li ul.subs>li a:hover,
#nav_mobile li ul.subs>li:hover>a {
    color: #f1f1f1 !important;
}
#nav_mobile li a .badge {
	background: #111;
	font-size: 9px !important;
	 margin-top: 13px;
	 margin-right: 20px;
	 -webkit-transition: 350ms ease-in-out; -moz-transition: 350ms ease-in-out; -o-transition: 350ms ease-in-out; transition: 350ms ease-in-out;
}

#nav_mobile li.active>a .badge,
#nav_mobile li ul.subs>li.active a .badge,
#nav_mobile li ul.subs>li a:hover .badge,
#nav_mobile li ul.subs>li:hover>a .badge {
	background: #333;	
}
/*************************************************************************
*      Mobile Nav END
**************************************************************************/







/*************************************************************************
*      SNB START
**************************************************************************/
 #snb { Z-INDEX:100; position:relative; width:100%; overflow:hidden; clear:both; display:block; visibility:visible; border:0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
 #snb .snb_title {  }

 #snb ul { overflow:hidden; width:100%; }
 #snb ul li { overflow:hidden; }
 #snb ul li a { display:block; white-space:nowrap; font-size:12px; font-weight:bold; text-decoration:none; padding:8px 12px 9px 12px; width:100%;  position:relative; }

 #snb ul li a > .badge { margin-right:10px; }

 #snb ul.primary li a:after {
	content: "\f105"; /* \f105 , f054 */
	display: inline-block;
	position: absolute;
	top: 8px;
	right: 10px;
 }
 #snb ul.primary li.active a:after {
	content: "\f105";
 }
 #snb ul.secondary li a:after {
	content: "\f105";
	display: inline-block;
	position: absolute;
	top: 8px;
	right: 10px;
 }


 /*** COLOR - white ***********************************************************/
 #container.white #snb ul li { border-top:1px solid #FFFFFF; border-bottom:1px solid #E1E1E1; }
 #container.white #snb ul li a { color:#606060; text-shadow:0px 1px 0px #fff; }
 #container.white #snb .primary li a:hover { color:#0089de; } /* red #AB2B4A */
 #container.white #snb .secondary li a:hover { color:#AB2B4A; }
 #container.white #snb ul .active a { color:#0089de; }
 
 /*** COLOR - black ***********************************************************/
 #container.black #snb ul li { border-top:1px solid #292929; border-bottom:1px solid #000; }
 #container.black #snb ul li a { color:#797979; text-shadow:0px 1px 0px #000; }
 #container.black #snb .primary li a:hover { color:#0089de; } /* red #AB2B4A */
 #container.black #snb .secondary li a:hover { color:#AB2B4A; }
 #container.black #snb ul .active a { color:#0089de; }
 
 /*************************************************************************
 *      SNB END
 **************************************************************************/
 
 

/*************************************************************************
*   Nav-Slide Bar START
**************************************************************************/
#nav-sidebar {
    z-index: 1900; position: absolute;
    top: 0px; left: -225px; right: auto;
    width: 300px; height:100%;
    
    -webkit-transition: -webkit-transform 300ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
    -moz-transition: -moz-transform 300ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
    -o-transition: -o-transform 300ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
    transition: transform 300ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
    -webkit-transform: translate3d(-300px, 0, 0);
 }
 #nav-sidebar #nav { position:relative; width:100%; overflow:hidden; clear:both; *zoom:1; display:block; visibility:visible; border:0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding:0px; }

 #nav-sidebar #nav li { overflow:hidden; width:100%; }
 #nav-sidebar #nav li a { display:block; white-space:nowrap; height: 48px; line-height: 48px; vertical-align: middle; font-size:20px; font-weight: normal;
 	text-decoration:none; border-bottom:1px solid rgb(31, 31, 31); 
 	color: #a1a1a1;
 	font-family: 'Myriad Set Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
	font-weight: 200;
	padding-left: 30px;
	-webkit-transition: 250ms ease-out; -moz-transition: 250ms ease-out; -o-transition: 250ms ease-out; transition: 250ms ease-out;
 }
 #nav-sidebar #nav li a:hover { color:#FFFFFF; }
 
 #nav-sidebar #nav li a>.arrow:before {
    display: inline;
    float: right;
    height: auto;
    width: 25px;
    color:#999;
    font-size: 17px;
    font-family: FontAwesome;
    content: "\f104";
    font-weight: 100;
    text-shadow: none;
    text-align: center;
    -webkit-transition: all 0.12s ease;
    transition: all 0.12s ease;
 }
 #nav-sidebar #nav li a>.arrow.active:before {
	 color:#fff;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
 }
 
 #nav-sidebar #nav li ul.subs {
    display: none;
    list-style: none;
    clear: both;
}
 #nav-sidebar #nav li ul.subs .subs-arrow { display: none !important; }
 
 #nav-sidebar #nav li.active>ul.subs {
    display: block;
 }
 #nav-sidebar #nav li ul.subs>li {
    padding: 0px 0px 0px 30px;
    margin-top: 1px;
}
/* Sub-menu link */
 #nav-sidebar #nav li ul.subs>li>a { display: block; white-space:nowrap; height: 48px; line-height: 48px; vertical-align: middle; font-size:16px; font-weight: normal; border-bottom:1px solid rgb(21, 21, 21);
 	color: #999;
 	font-family: 'Myriad Set Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
 font-weight: 200;
}
 #nav-sidebar #nav li.active>a,
 #nav-sidebar #nav li ul.subs>li.active a,
 #nav-sidebar #nav li ul.subs>li a:hover,
 #nav-sidebar #nav li ul.subs>li:hover>a {
    color: #f1f1f1 !important;
} 
/*************************************************************************
*   Nav-Slide Bar END
**************************************************************************/