.tabs {
	overflow: hidden;
	width: 100%;
	list-style: none;
	background: #c0c7cc;
}

.tabs li {
	float: left;
	width: 23.33%;
}
.tabs li:nth-of-type(2) {
	width: 30%;
}

.tabs a {
	display: block;
	width: 100%;
	text-align: center;
	height: 60px;
	line-height: 60px;
	text-decoration: none;
	background: #c0c7cc;
	color: #fff;
	position: relative;
}

.tabs a:hover, .tabs a:focus, .tabs .current {
	background: #0066b3
}

.tabs a .iconfont { position: absolute; top: 20px; right: 20px; opacity: 0 }
.tabs a:focus .iconfont, .tabs .current .iconfont {
	opacity: 1
}


.profile-tabs.tabs { background: #aab5bc }
.profile-tabs.tabs li { display: inline-block; float: none; width: auto; margin: 0 -2px; padding: 0 }
.profile-tabs.tabs a { display: inline-block; width: auto; padding: 0 15px; height: 60px; line-height: 60px; text-decoration: none; background: transparent }
.profile-tabs.tabs a:hover, .profile-tabs.tabs a:focus, .profile-tabs.tabs .current { background: #f8f8f8; color: #0066b3 }


.community-tabs.tabs li, .community-tabs.tabs li:nth-of-type(2) { width: auto }
.community-tabs.tabs a { display: inline-block; width: auto; padding-left: 20px; padding-right: 40px }
.community-tabs.tabs a .iconfont { right: 10px }

@media ( min-width:1000px ) and ( max-width:1259px ) {
.tabs li, .tabs li:nth-of-type(2) { width: auto }
.tabs a { display: inline-block; width: auto; padding-left: 20px; padding-right: 50px }
.tabs a .iconfont { right: 15px }

.profile-tabs.tabs a { padding: 0 10px }

.community-tabs.tabs li, .community-tabs.tabs li:nth-of-type(2) { width: 50% }
.community-tabs.tabs a { display: block; width: 100%; padding-left: 0; padding-right: 0 }

}	
	
@media ( min-width:801px ) and ( max-width:999px ) {	
.tabs li, .tabs li:nth-of-type(2) { width: auto }
.tabs a { display: inline-block; width: auto; padding-left: 15px; padding-right: 15px }
.tabs a .iconfont { display: none }

.community-tabs.tabs li, .community-tabs.tabs li:nth-of-type(2) { width: 50% }
.community-tabs.tabs a { display: block; width: 100%; padding-left: 0; padding-right: 0 }
.community-tabs.tabs a .iconfont { display: inline-block }

}

@media ( max-width:800px ) {	
.tabs li, .tabs li:nth-of-type(2) { width: 25% }
.tabs a { display: block; width: 100%; line-height: 14px; padding-left: 0; padding-right: 0 }
.tabs a h5 { display: block; width: 100%; position: absolute; left: 0; top:50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%) }

.tabs a .iconfont { display: none }

.profile-tabs.tabs li { display: block; float: left; width: 50%; margin: 0 }
.profile-tabs.tabs a { display: block; width: 100%; padding: 0; height: 40px; line-height: 14px }
.profile-tabs.tabs a span { display: block; width: 100%; position: absolute; left: 0; top:50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%) }

}