navigation menu 04# >> css

<style type="text/css">
.style1 { /* első cella */
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #FFBDB3;
                -webkit-transition: .5s ease-in;
                -moz-transition: .5s ease-in;
                -o-transition: .5s ease-in;
}

.style1:hover {
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #FFBDB3;
                box-shadow:inset 125px 0px 0px #ffffff;
}

.style2 { /* második cella */
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #292957;
                -webkit-transition: .5s ease-in;
                -moz-transition: .5s ease-in;
                -o-transition: .5s ease-in;
}

.style2:hover {
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #292957;
                box-shadow:inset 125px 0px 0px #ffffff;
}

.style3 { /* harmadik cella */
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #F3C9BF;
                -webkit-transition: .5s ease-in;
                -moz-transition: .5s ease-in;
                -o-transition: .5s ease-in;
}

.style3:hover {
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #F3C9BF;
                box-shadow:inset 125px 0px 0px #ffffff;
}

.style4 { /* negyedik cella */
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #E8D4CA;
                -webkit-transition: .5s ease-in;
                -moz-transition: .5s ease-in;
                -o-transition: .5s ease-in;
}

.style4:hover {
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #E8D4CA;
                box-shadow:inset 125px 0px 0px #ffffff;
}

.style5 { /* ötödik cella */
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #E0DAD5;
                -webkit-transition: .5s ease-in;
                -moz-transition: .5s ease-in;
                -o-transition: .5s ease-in;
}

.style5:hover {
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #E0DAD5;
                box-shadow:inset 125px 0px 0px #ffffff;
}

.style6 { /* utolsó cella */
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #E4E1DE;
                -webkit-transition: .5s ease-in;
                -moz-transition: .5s ease-in;
                -o-transition: .5s ease-in;
}

.style6:hover {
                text-align: center;
                color: #FFFFFF;
                font-family: Arial;
                font-size: small;
                border: 4px double #FFFFFF;
                background-color: #E4E1DE;
                box-shadow:inset 125px 0px 0px #ffffff;
}

/* hivatkozások */

menulink a:link, menulinks a:visited {
color: #FFFFFF;
font-family: century gothic;
text-decoration: none;
text-transform: uppercase;
font-weight: solid;
font-size: 13px;
text-shadow: 2px 0px 0px #ffffff;
letter-spacing: 2px;}

menulink a:hover, menulinks a:active {
color: #292957;
font-family: century gothic;
text-decoration: none;
text-transform: uppercase;
font-weight: solid;
font-size: 13px;
letter-spacing: 2px;
text-shadow: 2px 0px 0px #292957;}</style>