header.navbar-header {float: none}
header.navbar-header .fa-user {
	color: #fff;
	font-size: 18px;
}
.navbar-collapse {
	padding:0;
	width: 100%
}
nav.menu ul {float: none}
nav.menu ul>li {
	display: block;
	text-align: left;
}
.navbar-toggle {
	border: none;
	margin-bottom: 3px
}
.navbar-default .navbar-toggle .icon-bar {background-color: #fff}
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {background-color: transparent}
#lika-header {
	background-color: #8cc713;
}
#lika-header .container {
	height: 70px;
}
#lika-header .noheight {height: 1px}
#lika-header hr {margin: 0}
#lika-header .logo {
	float: left;
	display: table;
	height: 100%;
}
#lika-header .logo h1 {
	margin: 0;
	display: table-cell;
	vertical-align: middle;
}
#lika-header .logo a {
	color: #fff;
	font: 900 30px Arial, sans-serif;
}
#lika-header .user-area {
	float: right;
	display: table;
	color: #646464;
    padding: 0 15px;
}
#lika-header .user-area.site {height: 100%}
#lika-header .user-area form,
#lika-header .user-area.logged .user-info {
	display: table-cell;
	vertical-align: middle;
}
#lika-header .user-area .user-info,
#lika-header .user-area.logged form {
	display: none;
}
#lika-header .user-area form div {
	float: right;
	margin-left: 3px;
}
.user-area input[type="text"],
.user-area input[type="password"] {
	padding: 2px 5px;
	vertical-align: middle;
}
.user-area .btn-submit {
 	position: relative;
 	cursor: pointer;
 	width: 24px;
 	min-height: 1px;
 	margin-top: 1px;
}
.user-area .btn-submit:before {
	content: '';
 	position: absolute;
 	top: 0;
 	left: 0;
 	display: block;
 	width: 23px;
 	height: 23px;
 	background-color: #c5c3c3;
 	border-radius: 3px;
 	transition: background-color .3s;
 	-webkit-transition: background-color .3s;
 	-moz-transition: background-color .3s;
}
.user-area .btn-submit:hover:before {
	background-color: #fff;
}
.user-area .btn-submit:after {
 	content: '';
 	position: absolute;
 	top: 50%;
 	left: 50%;
 	margin-left: -5px;
 	margin-top: 5px;
 	border-top: 6px solid transparent;
 	border-left: 10px solid #fff;
 	border-bottom: 6px solid transparent;
 	transition: border-color .3s;
 	-webkit-transition: border-color .3s;
 	-moz-transition: border-color .3s;
}
.user-area .btn-submit:hover:after {
	border-left-color: #8cc713
}
.user-area .remember {
	padding: 2px 0;
}
.user-info li>a.dropdown-toggle {
    color: #fff;
}
.nav>li>a:focus, .nav>li>a:hover,
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
    background-color: transparent
}
.dropdown-menu {width: 100%}
.dropdown-menu.sxs {
    right: 0;
    left: auto
}
.dropdown-menu>li>a {
    padding: 3px 10px;
}
.dropdown-menu>li>a .fa-power-off {
    margin-right: 5px;
    color: #FF2021
}
.user-area .user-info li a {color: #337ab7}
.user-area .user-info li i {
	color: #5A9D3C;
}
.user-area .user-info li a:focus,
.user-area .user-info li a:hover {
	background-color: transparent;
}
.user-area .user-info li i {
	color: #5A9D3C;
	/*font-size: 22px;*/
}
.user-area .user-info .my-avatar {
	border-radius: 50%;
	width: 35px;
	height: 35px;
	margin-top: 4px;
    border: 1px solid #ededed;
}
.user-area .user-info .fa.fa-graduation-cap{
	margin-right:0px;
}
.user-area .user-info .user a.dropdown-toggle {
	padding: 7px 10px 3px 10px;
	overflow: hidden;
        color: #fff;
}
.user-area .user .list-child {overflow: hidden}
.user-area .user .profile {padding: 5px 10px 0 10px}
.user-area .user .profile .pull-left {
	position: relative;
}
.user-area .user .profile .pic img {
    position: relative;
    width: 90px;
    height: 90px;
    overflow: hidden;
}
.user-area .user .profile .upload {
    background: rgba(0, 0, 0, .5);
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 12px;
    display: none;
}
.user-area .user .profile .upload i {
	margin-right: 5px;
	color: #fff;
}
.user-area .user .profile .pic:hover ~ .upload {
    display: block;
}
.user-area .user .profile .fr {
	text-align: center;
	float: left;
	padding-left: 10px;
}
.user-area .user .profile .title {
	font-weight: 600;
	display: block;
	color: #5a9d3c;
}
.user-area .user .profile .action-icon {
	width: 100%;
	display: inline-block;
	text-align: left;
}
.user-area .user .profile .action-icon a {margin-right: 5px}
.user-area .user .profile .action-icon i {
	color: #777;
	font-size: 15px;
}
.user-area .user .list-child h5 {
	font-size: 15px;
    padding: 0 10px;
    text-align: center;
    margin: 5px 0;
}
.user-area .user .list-child ul {
	margin: 0;
	padding: 0 10px;
}
.user-area .user .list-child ul li {
    margin-bottom: 4px;
    border-bottom: 1px dashed #f5f5f5;
}
.user-area .user .list-child .thumb-avatar {
	vertical-align: middle;
	height: 23px;
	width: 23px;
	margin-right: 5px;
}
.user-area .user .logout a {padding: 3px 10px}
.user-area .user .logout a i {
	margin-right: 10px;
	color: #c11b29;
	font-weight: 900;
}
.user-area .user-info .dropdown-menu {
	left: initial;
	right: 0;
	width: 270px;
}
.user-area .user-info .user hr {margin: 7px 0}

.top-menu {
	text-align: center;
	background-color: #8cc713
}
.top-menu ul {
	display: table;
	margin: 0 auto;
}
.top-menu li {
	display: table-cell;
	margin-left: 0!important;
}
.top-menu .navbar-nav>li>a {
	border-radius: 0!important;
	border-right: 1px solid #dadada;
	text-transform: uppercase;
	color: #fff;
	font-size: 14px;
	padding: 7px 15px;
}
.top-menu .navbar-nav>li>a:hover {
	background-color: transparent;
        color: #fff;
}
.top-menu li:last-child a {
	border-right: none;
}
.banner img {
	width: 100%;
}
.main-menu {
	background: url(../images/bg_banner.png) repeat;
	position: relative;
	text-align: center;
}
.main-menu:after {
	content: '';
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background-color: rgba(62,71,73,.9);
	z-index: 2;
}
.main-menu ul {
	position: relative;
	z-index: 9;
	display: table;
	margin: 0 auto
}
.main-menu li {
	padding: 10px 8px;	
}
.main-menu li.fixed-logo img {
	width: 0;
	height: 0;
	transition: all .3s;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
}
.main-menu li>a {
	transition: all .3s;
	font: 400 24px 'Trebuchet MS', Verdana, sans-serif;
	border-right: 1px solid #dadada;
	border-radius: 0;
	padding: 0 15px; 
	line-height: 1;
	text-shadow: none;
}
.main-menu li.fixed-logo a,
.main-menu li:last-child a {
	border-right: none;
}
.main-menu li.textcolor_1>a {color: #54ff00}
.main-menu li.textcolor_1>a:hover {color: #54ff00!important}
.main-menu li.textcolor_2>a {color: #fbbcf9}
.main-menu li.textcolor_2>a:hover {color: #fbbcf9!important}
.main-menu li.textcolor_3>a {color: #00fcff}
.main-menu li.textcolor_3>a:hover {color: #00fcff!important}
.main-menu li.textcolor_4>a {color: #ffc000}
.main-menu li.textcolor_4>a:hover {color: #ffc000!important}
.main-menu li.textcolor_5>a {color: #faebd7}
.main-menu li.textcolor_5>a:hover {color: #faebd7!important}
.main-menu li.textcolor_6>a {color: #eefd05}
.main-menu li.textcolor_6>a:hover {color: #eefd05!important}
.main-menu li.textcolor_7>a {color: #ffff00}
.main-menu li.textcolor_7>a:hover {color: #ffff00!important}
.main-menu li.textcolor_8>a {color: #fff}
.main-menu li.textcolor_8>a:hover {color: #fff!important}
.main-menu li>ul {
	display: none;
	position: absolute;
}
#lika-header .main-menu li>ul>li {padding: 0}
#lika-header .main-menu li>ul>li>a {
	border-right: none;
	padding: 8px;
	font-size: 18px!important;
}

.fixed .main-menu {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	transition: all .3s;
	animation: opa .6s;
	-webkit-animation: opa .6s;
}
.fixed .main-menu:before {
	content: '';
	position: absolute;
	height: 3px;
	width: 100%;
	display: block;
	bottom: -3px;
	left: 0;
	background-color: #ffb72a;
	z-index: 99;
	transition: .3s;
	animation: wid 3s;
	-webkit-animation: wid 3s;
}
#toggle-menu .main-menu li {
    padding: 8px 0;
    position: relative;
}
#toggle-menu .main-menu li:before,
#toggle-menu .main-menu li:after {
    content: '';
    position: absolute;
    display: block;
    width: 0;
    bottom: 0;
    height: 2px;
	transition: width .3s;
	-webkit-transition: width .3s;
	-moz-transition: width .3s;
}
#toggle-menu .main-menu li:before {
    right: 50%;
}
#toggle-menu .main-menu li:after {
    left: 50%;
}
#toggle-menu .main-menu li:hover:before,
#toggle-menu .main-menu li:hover:after,
#toggle-menu .main-menu li.active:before,
#toggle-menu .main-menu li.active:after {
	width: 39%;
    width: calc(50% - 15px);
    width: -webkit-calc(50% - 15px);
    width: -moz-calc(50% - 15px);
    width: -o-calc(50% - 15px);
}
#toggle-menu .main-menu li.textcolor_1.active:before,
#toggle-menu .main-menu li.textcolor_1.active:after,
#toggle-menu .main-menu li.textcolor_1:hover:before,
#toggle-menu .main-menu li.textcolor_1:hover:after {
	background-color: #54ff00
}
#toggle-menu .main-menu li.textcolor_2.active:before,
#toggle-menu .main-menu li.textcolor_2.active:after,
#toggle-menu .main-menu li.textcolor_2:hover:before,
#toggle-menu .main-menu li.textcolor_2:hover:after {
	background-color: #fbbcf9
}
#toggle-menu .main-menu li.textcolor_3.active:before,
#toggle-menu .main-menu li.textcolor_3.active:after,
#toggle-menu .main-menu li.textcolor_3:hover:before,
#toggle-menu .main-menu li.textcolor_3:hover:after {
	background-color: #00fcff
}
#toggle-menu .main-menu li.textcolor_4.active:before,
#toggle-menu .main-menu li.textcolor_4.active:after,
#toggle-menu .main-menu li.textcolor_4:hover:before,
#toggle-menu .main-menu li.textcolor_4:hover:after {
	background-color: #ffc000
}
#toggle-menu .main-menu li.textcolor_5.active:before,
#toggle-menu .main-menu li.textcolor_5.active:after,
#toggle-menu .main-menu li.textcolor_5:hover:before,
#toggle-menu .main-menu li.textcolor_5:hover:after {
	background-color: #faebd7
}
#toggle-menu .main-menu li.textcolor_6.active:before,
#toggle-menu .main-menu li.textcolor_6.active:after,
#toggle-menu .main-menu li.textcolor_6:hover:before,
#toggle-menu .main-menu li.textcolor_6:hover:after {
	background-color: #eefd05
}
#toggle-menu .main-menu li.textcolor_7.active:before,
#toggle-menu .main-menu li.textcolor_7.active:after,
#toggle-menu .main-menu li.textcolor_7:hover:before,
#toggle-menu .main-menu li.textcolor_7:hover:after {
	background-color: #ffff00
}
.fixed #toggle-menu .main-menu li.textcolor_1.active>a,
.fixed #toggle-menu .main-menu li.textcolor_1:hover>a {
	color: #54ff00
}
.fixed #toggle-menu .main-menu li.textcolor_2.active>a,
.fixed #toggle-menu .main-menu li.textcolor_2:hover>a {
	color: #fbbcf9
}
.fixed #toggle-menu .main-menu li.textcolor_3.active>a,
.fixed #toggle-menu .main-menu li.textcolor_3:hover>a {
	color: #00fcff
}
.fixed #toggle-menu .main-menu li.textcolor_4.active>a,
.fixed #toggle-menu .main-menu li.textcolor_4:hover>a {
	color: #ffc000
}
.fixed #toggle-menu .main-menu li.textcolor_5.active>a,
.fixed #toggle-menu .main-menu li.textcolor_5:hover>a {
	color: #faebd7
}
.fixed #toggle-menu .main-menu li.textcolor_6.active>a,
.fixed #toggle-menu .main-menu li.textcolor_6:hover>a {
	color: #eefd05
}
.fixed #toggle-menu .main-menu li.textcolor_7.active>a,
.fixed #toggle-menu .main-menu li.textcolor_7:hover>a {
	color: #ffff00
}
.fixed #toggle-menu .main-menu li.active:before,
.fixed #toggle-menu .main-menu li.active:after,
.fixed #toggle-menu .main-menu li:before,
.fixed #toggle-menu .main-menu li:after {
	background-color: transparent;
	width: 0;
}
#toggle-menu .main-menu li>a{
	font-size: 21px
}
@-webkit-keyframes opa {
	from {opacity: 0}
	to {opacity: 1}
}

@keyframes opa {
	from {opacity: 0}
	to {opacity: 1}
}
@-webkit-keyframes wid {
	from {width: 0}
	to {width: 100%}
}

@keyframes wid {
	from {width: 0}
	to {width: 100%}
}
.fixed .main-menu .container {width: auto}
.fixed .main-menu ul {float: left}
.fixed .main-menu li {
	padding: 10px 0;
	display: inline-block;
	float: none;
}
.fixed .main-menu li.fixed-logo img {
	width: 80px;
	height: auto
}
#lika-header.fixed .main-menu li>a {
	color: #fff;
	font-size: 16px;
	border: none;
	text-transform: uppercase;
}
.fixed .main-menu li>ul {
	display: none;
}

.list-grade {
	padding: 30px 0;
}
.list-grade .grade {
	position: relative;
	padding: 30px 15px;
}
.grade .grade-name {
	position: absolute;
	content: '';
	top: -5px;
	left: -5px;
	border-radius: 50%;
        z-index: 9;
}
.grade:hover .grade-name {
	-webkit-animation: rotate 1s;
	animation: rotate 1s;
}
@keyframes rotate {
	from {transform: rotate(0deg)}
	to {transform: rotate(360deg)}
}
.grade .grade-name img {
	width: 100px;
	height: 100px;
}
.grade .inner {
	background-color: #fff;
	overflow: hidden;
	border-radius: 7px;
	padding: 0 25px 15px 25px;
	box-shadow: none;
	transition: box-shadow .3s;
        padding-bottom: 35px;
	position: relative;
	z-index: 1;
}
.grade .inner.medium {
        height: 273px;
}
.grade:hover .inner {
	box-shadow: 0 4px 7px 2px #797979;
	-webkit-box-shadow: 0 4px 7px 2px #797979;
	-moz-box-shadow: 0 4px 7px 2px #797979;
}
.grade .inner h4 {
	font-size: 30px;
	text-align: center;
	margin: 8px 0 25px;
}
.grade .inner .subject {
	line-height: 1.6
}
.grade .inner .subject label {
	color: #3e4749;
	float: left;
}
.grade .inner .subject a {
	float: right;
        color: #0289d7
}
.grade .inner .go-class {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	display: block;
	text-align: center;
	color: #fff;
	padding: 7px 0;
	font-weight: 600;
	font-size: 16px
}
.grade-1 .inner {
	border: 2px solid #ec5c00;
}
.grade-1 .inner h4 {
	color: #ec5c00;
}
.grade-1 .inner .go-class {
	background-color: #ec5c00;
	background-image: -webkit-linear-gradient(#f88a00, #e95500, #f88d00);
	background-image: -moz-linear-gradient(#f88a00, #e95500, #f88d00);
	background-image: -o-linear-gradient(#f88a00, #e95500, #f88d00);
	background-image: linear-gradient(#f88a00, #e95500, #f88d00);
}
.grade-2 .inner {
	border: 2px solid #02afd5;
}
.grade-2 .inner h4 {
	color: #02afd5;
}
.grade-2 .inner .go-class {
	background-color: #02afd5;
	background-image: -webkit-linear-gradient(#00d9de, #04a7d1, #00ccde);
	background-image: -moz-linear-gradient(#00d9de, #04a7d1, #00ccde);
	background-image: -o-linear-gradient(#00d9de, #04a7d1, #00ccde);
	background-image: linear-gradient(#00d9de, #04a7d1, #00ccde);
}
.grade-3 .inner {
	border: 2px solid #97d302;
}
.grade-3 .inner h4 {
	color: #97d302;
}
.grade-3 .inner .go-class {
	background-color: #97d302;
	background-image: -webkit-linear-gradient(#a3de00, #7dcf00, #a3de00);
	background-image: -moz-linear-gradient(#a3de00, #7dcf00, #a3de00);
	background-image: -o-linear-gradient(#a3de00, #7dcf00, #a3de00);
	background-image: linear-gradient(#a3de00, #7dcf00, #a3de00);
}
.grade-4 .inner {
	border: 2px solid #ec0e60;
}
.grade-4 .inner h4 {
	color: #ec0e60;
}
.grade-4 .inner .go-class {
	background-color: #ec0e60;
	background-image: -webkit-linear-gradient(#ff4f7c, #e9065e, #fd5fa1);
	background-image: -moz-linear-gradient(#ff4f7c, #e9065e, #fd5fa1);
	background-image: -o-linear-gradient(#ff4f7c, #e9065e, #fd5fa1);
	background-image: linear-gradient(#ff4f7c, #e9065e, #fd5fa1);
}
.grade-5 .inner {
	border: 2px solid #c80cfe;
}
.grade-5 .inner h4 {
	color: #c80cfe;
}
.grade-5 .inner .go-class {
	background-color: #c80cfe;
	background-image: -webkit-linear-gradient(#d441fb, #a720e3, #d93fff);
	background-image: -moz-linear-gradient(#d441fb, #a720e3, #d93fff);
	background-image: -o-linear-gradient(#d441fb, #a720e3, #d93fff);
	background-image: linear-gradient(#d441fb, #a720e3, #d93fff);
}
.grade-6 .inner {
	border: 2px solid #0498ff;
}
.grade-6 .inner h4 {
	color: #0498ff;
}
.grade-6 .inner .go-class {
	background-color: #0498ff;
	background-image: -webkit-linear-gradient(#28a9fc, #1481e7, #34acfd);
	background-image: -moz-linear-gradient(#28a9fc, #1481e7, #34acfd);
	background-image: -o-linear-gradient(#28a9fc, #1481e7, #34acfd);
	background-image: linear-gradient(#28a9fc, #1481e7, #34acfd);
}		
.main-menu.menu .navbar-nav li.active a span{
	border-bottom: 6px solid #f5e761;
} 
#lk-menu .menu .container{
	height: auto;
}
#lk-menu .top-menu li>a {
	padding: 5px 15px;
}
#lk-menu .main-menu li {
    padding: 8px 8px;
}
#lk-menu .main-menu li>a{
	font-size: 21px;
	background: none;
}
#lk-menu .main-menu li>a small {
  display: block;
  font-size: 12px;
  color: #fff;
  margin-top: 8px;
}
/*FIX MENU*/
#lk-menu .menu .container{
	height: auto;
}
#lk-menu .top-menu li>a {
	padding: 5px 15px;
}
#lk-menu .main-menu li {
    padding: 8px 0;
    position: relative;
}
#lk-menu .main-menu li:before,
#lk-menu .main-menu li:after {
    content: '';
    position: absolute;
    display: block;
    width: 0;
    bottom: 0;
    height: 2px;
	transition: width .3s;
	-webkit-transition: width .3s;
	-moz-transition: width .3s;
}
#lk-menu .main-menu li:before {
    right: 50%;
}
#lk-menu .main-menu li:after {
    left: 50%;
}
#lk-menu .main-menu li:hover:before,
#lk-menu .main-menu li:hover:after,
#lk-menu .main-menu li.active:before,
#lk-menu .main-menu li.active:after {
    width: 39%;
    width: calc(50% - 15px);
    width: -webkit-calc(50% - 15px);
    width: -moz-calc(50% - 15px);
    width: -o-calc(50% - 15px);
}
#lk-menu .main-menu li.textcolor_1:hover:before,
#lk-menu .main-menu li.textcolor_1:hover:after {
	background-color: #54ff00
}
#lk-menu .main-menu li.textcolor_2:hover:before,
#lk-menu .main-menu li.textcolor_2:hover:after {
	background-color: #fbbcf9
}
#lk-menu .main-menu li.textcolor_3:hover:before,
#lk-menu .main-menu li.textcolor_3:hover:after {
	background-color: #00fcff
}
#lk-menu .main-menu li.textcolor_4:hover:before,
#lk-menu .main-menu li.textcolor_4:hover:after {
	background-color: #ffc000
}
#lk-menu .main-menu li.textcolor_5:hover:before,
#lk-menu .main-menu li.textcolor_5:hover:after {
	background-color: #faebd7
}
#lk-menu .main-menu li.textcolor_6:hover:before,
#lk-menu .main-menu li.textcolor_6:hover:after {
	background-color: #eefd05
}
#lk-menu .main-menu li.textcolor_7:hover:before,
#lk-menu .main-menu li.textcolor_7:hover:after {
	background-color: #ffff00
}
#lk-menu .main-menu li.textcolor_8:hover:before,
#lk-menu .main-menu li.textcolor_8:hover:after {
	background-color: #fff
}
#lk-menu .main-menu li>a{
	font-size: 21px
}