@import url(https://fonts.googleapis.com/css?family=Montserrat:400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&amp;subset=vietnamese);
#headermenu {
	margin: 0; /* all lists */
	padding: 0;
}

#headermenu ul {
	margin: 0; /* all lists */
	padding: 0;
}

#headermenu li {
	margin: 0; /* all list items */
	padding: 0;
	display: block;
	cursor: pointer;
	float:left;
	position:relative;
	font-family:Montserrat, sans-serif;
}

#headermenu li ul {
	width: 270px;
	position: absolute; /* second-level lists */
	z-index: 99;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	height: auto;
}

#headermenu li ul ul {
	margin: -20px 0 0 220px; /* third-and-above-level lists */
}

#headermenu li li {
	padding: 0 ;
	margin: 0;
	width: 270px;
}

#headermenu ul a {
	width: 250px;
}

#headermenu li:hover ul ul, #headermenu li:hover ul ul ul,
#headermenu li.ihover ul ul,
#headermenu li.ihover ul ul ul {
	left: -999em;
}

/* This "unhides" the sub-menus (left: -999em is what hides them) */
#headermenu li:hover ul, #headermenu li li:hover ul, #headermenu li li li:hover ul,
#headermenu li.ihover ul,
#headermenu li li.ihover ul,
#headermenu li li li.ihover ul{
	left: auto;
	/*
	-webkit-transition: left 0.5s ease;
  -moz-transition: left 0.5s ease;
  -ms-transition: left 0.5s ease;
  -o-transition: left 0.5s ease;
  transition: left 0.5s ease;
  */
}

/* STYLING THE MENU
-----------------------------------*/
/* 1st level */
#headermenu li a {
	margin: 0;
	display: block;
	font-weight: normal;
	line-height: normal;
	text-decoration: none;
}

#headermenu li.ihover, #headermenu li.active
{
/*	background-color: #22629F;*/
}
#headermenu li a:hover, #headermenu li.active a, #headermenu li.ihover a
{	color: #FFF; 
background-color:#055999;
background-color:#e14d45;
/*
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  */
}

/* 2nd level */
#headermenu li.active ul a, #headermenu ul li.active ul a
{	/*reset*/color: #FFF;}

#headermenu ul {
	border: 1px solid #b0cfd0;
	border-top: 0;
	/*background: #055999;*/
	text-align:left;
}

#headermenu ul li {
	border: none;
	border-top: 1px solid #b0cfd0;
	background:transparent;
}

#headermenu ul a {
	border-right: 0;
	border-left: 0;
	margin: 0;
	padding: 10px 10px;
	font-weight: normal;
	line-height: normal;
}

#headermenu ul a{color:#FFF;}
#headermenu ul a:hover{color:#FFF; }

#headermenu ul li.active, #headermenu ul li.ihover
{	background-color: #f4f4f4;}

#headermenu ul li.active a, #headermenu ul li.ihover a
{	color: #ffc02a}

/*3rd level*/
#headermenu ul li.active ul a, #headermenu ul li.ihover ul a
{	/*reset*/
	color: #FFF;
}

#headermenu ul ul li.active, #headermenu ul ul li.ihover
{	background-color: #f4f4f4;}

#headermenu ul ul li.active a, #headermenu ul ul li.ihover a
{	color: #22629F;}

/*----------*/
.btn-navbar:not(.collapsed){padding:7px 2px 7px 10px;}
.btn-navbar.collapsed .icon-bar:nth-child(2) {
    /*width: 12px;*/
}

.btn-navbar:not(.collapsed) .icon-bar:nth-child(1) {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    background-color:red;
    margin: 0 0 8px 0;
    width:21px;
}

.btn-navbar:not(.collapsed) .icon-bar:nth-child(2) {
    width: 0px;
}

.btn-navbar:not(.collapsed) .icon-bar:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    background-color:red;
    xmargin: 0 0 5px 0;
    width:21px;
}
