@charset "utf-8";
/* CSS Document */

/* menu navigation */

.menubar {
    background-image: url(menu/back.png);
    z-index: 1000;
    height: 80px;
    width: 100%;
    min-width: 1280px;
    max-width: 1600px;
    position: fixed;
	background-size: 100% 100%;
}

.menuitems{
    height : 100%;
}
.menuitems ul {
    list-style-type : none;
    height : 100%;
    text-align: center;
}
.menuitems li{
    position : relative;
    height: 100%;
    display : inline-block;
    padding: 0px;
    margin: 0px;
    margin-left: 5px;
    margin-right: 5px;
}

.menuitems a{
    z-index: 10;
    height : 100%;
    overflow: hidden;
    position: relative;
	padding : 3px;
	margin: 0px;
}
.menuitems a:active,
.menuitems a:focus,
.menuitems a:hover{
    outline : none;
}

.menuitems a::before{
    content: "";
    position: absolute;
    top : 100%;
    bottom : 0%;
    left : 0%;
    right : 0%;
    z-index: -1;
    background-color: rgba(255, 0, 81, 0.509);
    display:inline-block;
    transition-duration: 0.2s;
    transition-timing-function: ease-out;
}
/*.menuitems a:focus::before, 
.menuitems a:active::before, */
.menuitems a:hover::before
{
    top : 0%;
}

/* scroll spy */
.menuitems a.active{
    /*
    transition-duration: 0.2s;
    transition-timing-function: ease-out;
    border-bottom: 6px solid rgba(137,255,0,1.00);
    */
}

.menuitems a.active::before{
    content: "";
    position: absolute;
    top : 90%;
    bottom : 0%;
    left : 0%;
    right : 0%;
    z-index: -1;
    background-color: rgba(0,255,203,1.00);
    display:inline-block;
    transition-duration: 0.2s;
    transition-timing-function: ease-out;
}

/*.menuitems a:focus img, 
.menuitems a:active img,*/
.menuitems a:hover img
{
    transform : translateY(2px);
}

.menuitems img.menuimage{
	padding-top: 5px;
	height : 90%;
    position:relative;   
}

.menuitems img.centerimage{
    height : auto;
    display: block;
    position: relative;
/* anti .navilink */
    padding: 0;
    margin: 0;   
}