﻿#header{
    position:absolute;
    width:100%;
    height:40px;
    background-image:url("../images/header_bg.jpg");
    background-position:center;
    z-index:10;
}

#h_container{
    width:1000px;
    height:40px;
    margin-left:auto;
    margin-right:auto;
}

#bland_logo{
    margin-top:10px;
    margin-left:19px;
    float:left;
}

#bland_logo:hover{
    opacity:0.5;
}

#twitter_icon{
    float:right;
    margin-top:13px;
    margin-right:18px;
    opacity:0;
}

#facebook_icon{
    float:right;
    margin-top:10px;
    margin-right:19px;
    opacity:0;
}

.op{
    transition:opacity 0.2s;
    -moz-transition:opacity 0.2s;
    -webkit-transition:opacity 0.2s;
}

.op:hover{
    opacity:0.5;
}

#twitter_icon .op,#facebook_icon .op{
    transition:opacity 0.2s;
    -moz-transition:opacity 0.2s;
    -webkit-transition:opacity 0.2s;
}

#twitter_icon .op:hover,#facebook_icon .op:hover{
    opacity:0;
}


#menu_button{
    position:fixed;
    z-index:101;
    width:56px;
    height:56px;
    background-image:url("../images/menu_button.png");
    top:53px;
    right:50%;
    transform:translateX(-436px);
    -moz-transform:translateX(-436px);
    -webkit-transform:translateX(-436px);
    padding:0px;
    cursor:pointer;
}

#menu{
    position:fixed;
    z-index:100;
    width:254px;
    height:422px;
    top:28px;
    left:50%;
    transform:translateX(-481px);
    -moz-transform:translateX(-481px);
    -webkit-transform:translateX(-481px);
    background-image:url("../images/menu_bg.png");
    display:none;
    opacity:0;
}

#menu li{
    list-style:none;
    height:47px;
    cursor:pointer;
}

#menu ul{
    margin-top:85px;
    margin-left:22px;
    padding:0px;
}

#mb_top,#mb_story,#mb_character,#mb_gallery,#mb_special,#mb_download,#mb_spec{
    position:absolute;
    margin-left:10px;
}

#heart1,#heart2,#heart3,#heart4,#heart5,#heart6,#heart7{
    position:relative;
    opacity:0;
}

#menu_line{
    position:absolute;
    margin-left:10px;
    margin-top:28px;
    opacity:0;
}

#menu_off,#menu_on{
    position:absolute;
    left:50%;
    top:8px;
}

#menu_off{
    transform:translateX(-18px);
    -moz-transform:translateX(-18px);
    -webkit-transform:translateX(-18px);
}

#menu_on{
    opacity:0;
    transform:translateX(-15px);
    -moz-transform:translateX(-15px);
    -webkit-transform:translateX(-15px);
}

#menu_close{
    position:absolute;
    z-index:100;
    top:10px;
    right:10px;
    cursor:pointer;
}

#menu_ov{
    position:fixed;
    width:100%;
    height:100%;
    opacity:0;
    z-index:99;
    display:none;
}

#footer{
    position:absolute;
    width:100%;
    height:10px;
    background-image:url("../images/footer_bg.jpg");
    background-position:center;
    top:2130px;
    text-align:center;
    font-size:10px;
    color:#fff;
    padding:35px 0px;
}

#bgpattern_left,#bgpattern_right{
    position:absolute;
    width:462px;
    height:2130px;
    top:0px;
    background-image:url("../images/bg_pattern.png");
    z-index:0;
    opacity:0.5;
}

#clearfix{
    clear:both;
}

#bgpattern_left{
    left:0px;
}

#bgpattern_right{
    right:0px;
}

#topbutton{
    position:fixed;
    right:50%;
    transform:translateX(556px);
    -moz-transform:translateX(556px);
    -webkit-transform:translateX(556px);
    bottom:10px;
    z-index:100;
}

#menu_b{
    height:100%;
}

@media screen and ( max-width:479px ){

#menu_button{
    width:40px;
    height:40px;
    background-size:cover;
    top:1px;
    right:0px;
    transform:translateX(0px);
    -moz-transform:translateX(0px);
    -webkit-transform:translateX(0px);
}
#menu_off{
    transform:translateX(-18px) scale(0.6);
    -moz-transform:translateX(-18px) scale(0.6);
    -webkit-transform:translateX(-18px) scale(0.6);
    top:3px;
}
#menu_on{
    transform:translateX(-15px) scale(0.6);
    -moz-transform:translateX(-15px) scale(0.6);
    -webkit-transform:translateX(-15px) scale(0.6);
    top:2px;
}
#menu{
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
}
#bgpattern_left,#bgpattern_right{
    display:none;
}
#topbutton{
    right:0px;
    transform:translateX(0px);
    -moz-transform:translateX(0px);
    -webkit-transform:translateX(0px);
}


}
