
/*** General *****************/
body {
	overflow-y: scroll;
}
a {
	text-decoration:underline;
}

label{
	line-height: 55px;
	font-size: 16px;
	
	
}
p{
	font-size: 13px;
	line-height: 21px;
}


/*** .Nav Class ************************/
.navs{
	width: 1150px;
	margin:0;
	overflow:hidden;
	
}
.navs label{
	display: block;
	position: relative;
	padding: 5px 20px;
	height: 55px;
	cursor: pointer;
	z-index: 20;
	
	box-shadow: 0px 0px 0px 1px rgba(155,155,155,.5);
	-webkit-box-shadow: 0px 0px 0px 1px rgba(155,155,155,.5);
	-moz-box-shadow:0px 0px 0px 1px rgba(155,155,155,.5);
}
.navs label i{
	font-size:21px;
	padding:3px 10px 0 0;
}
.navs input:checked + label,
.navs input:checked + label:hover{
	box-shadow: 
		0px 0px 0px 1px rgba(155,155,155,.3), 
		0px 2px 2px rgba(0,0,0,.1);
	-webkit-box-shadow:
		0px 0px 0px 1px rgba(155,155,155,.3), 
		0px 2px 2px rgba(0,0,0,.1);
	-moz-box-shadow:
		0px 0px 0px 1px rgba(155,155,155,.3), 
		0px 2px 2px rgba(0,0,0,.1);
}
.navs label:hover:after,
.navs input:checked + label:hover:after{
	content: '';
	position: absolute;
	width: 24px;
	height: 24px;
	right: 13px;
	top: 20px;	
}
.navs input{
	display: none;
}

/*** .content Class *********************/
.content{
	margin-top: -1px;
	overflow: hidden; padding-bottom:50px;
	position: relative;
	z-index: 10;
}
.content p{
	padding: 2px 15px 5px 50px;
	margin-left:15px;

}



/*** For Change Animation Effects ****/
.navs input:checked ~ .content{       
	z-index:-1;
	
	-webkit-animation-name: slideLeft;
	-webkit-animation-duration: .7s;
	-webkit-animation-iteration-count: 1;
}



/**** Color And Background **********************/
a {
	color:#666666;
}

h4, p{
	color: #777777;
}
.navs label{ color:#333;
}
.navs label:hover,
.navs input:checked + label,
.navs input:checked + label:hover{ 
	color:#FFFFFF;
}
.content{ padding-top:20px;
	background:#ffffff
}
.content h6{
	color:#666666;
}


/* For Change Style */
.navs label{                       /*Light Color*/
	background-color:#ffffff;
}
.navs label:hover,
.navs input:checked + label,
.navs input:checked + label:hover{ /*Dark Color*/
	background: #dadada;
	color:#000
}
.navs{                             /*Dark Color*/
	border-color: #dadada;
}
.content p{                       /*Dark Color*/
	border-left-color:#21CBBB;
}
.content h6{                      /*Dark Color*/
	background-color:rgba(33, 203, 187, .1);
}
.navs label:hover:after,
.navs input:checked + label:hover:after{
	background: transparent url(../../images/arrow_down.png) no-repeat center center;
}
.navs input:checked + label:hover:after{
	background-image:url(../../images/arrow_up.png);
}
