.menu-one ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-one li {
    border-right: 1px dotted black;
    line-height: 50px;
}

.menu-one li:last-child {
    border: none;
}

.menu-one a {
    color: black;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-one .active a,
.menu-one a:hover{
	font-weight: bold;
}




.menu-two ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid black;
    border-top: 1px solid black;
}

.menu-two li {
    line-height: 50px;
}

.menu-two li:last-child {
    border: none;
}

.menu-two a {
    color: black;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-two .active a,
.menu-two a:hover{
	font-weight: bold;
}




.menu-three {
    background-color: green;
}

.menu-three ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-three li {
    line-height: 50px;
}

.menu-three a {
    color: white;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-three .active a,
.menu-three a:hover{
	background: rgba(255, 255, 255, 0.25);
}




.menu-four {
    background-color: orange;
}

.menu-four ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-four li {
    line-height: 50px;
    margin: 2px 0 0 2px;
}

.menu-four a {
    color: white;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-four .active a,
.menu-four a:hover{
	background: white;
    color: black;
}





.menu-five ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
    border-bottom: 4px solid gray;
}

.menu-five li {
    line-height: 35px;
    margin: 2px 0 0 2px;
}

.menu-five a {
    background-color: black;
    color: gray;
    border-radius: 10px 10px 0 0;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-five .active a,
.menu-five a:hover {
	background: gray;
    color: white;
}





.menu-six ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-six li {
    line-height: 35px;
    margin: 0 5px;
}

.menu-six a {
    background-color: red;
    color: white;
    border-radius: 20px;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-six .active a,
.menu-six a:hover {
	background: orange;
}





.menu-seven ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-seven li {
    line-height: 80px;
    margin: 0 5px;
    width: 80px;
    height: 80px;
}

.menu-seven a {
    background-color: red;
    color: white;
    border-radius: 40px;
    text-decoration: none;
    padding: 0;
    text-align: center;
    display: block;
}

.menu-seven .active a,
.menu-seven a:hover {
	background: orange;
}






.menu-eight {
    background: linear-gradient(#00c900, #009900);
    border-radius: 8px;
}

.menu-eight ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-eight li {
    line-height: 50px;
}

.menu-eight a {
    color: white;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-eight .active a,
.menu-eight a:hover {
	background: rgba(255, 255, 255, 0.25);
}






.menu-nine {
    background-color: red;
	background: linear-gradient(to bottom, red 0%, #f26d5a 40%, red 60%);
	border-radius: 8px;
	overflow: hidden;
    border-radius: 8px;
}

.menu-nine ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.menu-nine li {
    line-height: 50px;
}

.menu-nine a {
    color: white;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0 20px;
    display: block;
}

.menu-nine .active a,
.menu-nine a:hover {
	background: rgba(255, 255, 255, 0.25);
}







.menu-ten ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.menu-ten li {
	height: 50px;
	line-height: 50px;
	border-right: 1px dotted black;
}
.menu-ten li:last-child {
	border: none;
}
.menu-ten a {
	color: black;
    text-decoration: none;
	padding: 0 20px 0 50px;
}

.menu-ten .active a,
.menu-ten a:hover {
	font-weight: bold;
}

.menu-ten li:nth-child(1) {
	background: url(../img/icon_home.png) no-repeat 20px center;
}

.menu-ten li:nth-child(2) {
	background: url(../img/icon_articles.png) no-repeat 20px center;
}

.menu-ten li:nth-child(3) {
	background: url(../img/icon_about.png) no-repeat 20px center;
}

.menu-ten li:nth-child(4) {
	background: url(../img/icon_contact.png) no-repeat 20px center;
}






.menu-eleven ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.menu-eleven li {
	height: 50px;
	line-height: 50px;
	border-right: 1px dotted black;
}
.menu-eleven li:last-child {
	border: none;
}
.menu-eleven a {
    
	color: black;
    text-decoration: none;
	padding: 0 20px 0 50px;
    text-indent: -5000px;
}

.menu-eleven .active a,
.menu-eleven a:hover{
	font-weight: bold;
}

.menu-eleven li:nth-child(1) a {
    background: url('../img/icon_home.png') no-repeat 20px center;
}

.menu-eleven li:nth-child(2) a {
    background: url('../img/icon_articles.png') no-repeat 20px center;
}

.menu-eleven li:nth-child(3) a {
    background: url('../img/icon_about.png') no-repeat 20px center;
}

.menu-eleven li:nth-child(4) a {
    background: url('../img/icon_contact.png') no-repeat 20px center;
}