@charset "utf-8";
/* CSS Document */
#instruction_container
{
    position: absolute;
    top: 530px;
    left: 20px;
    width: 900px;
    font-size: 10pt;
    color: #333333;
    text-align: center;
    line-height: 1.5em;
}

#supply_chain
{
    position: absolute;
    top: 380px;
    left: 80px;
}

.frame
{
    display:block;
    /*overflow:hidden;*/
    position: absolute;
    top: 0px;
    width: 185px;
    height: 140px;
    background-image:url("../assets/frame.png");
    background-position: 0px 0px;
    background-position-x: 0px;
    background-repeat:no-repeat;
}
.frame.final
{
    background-image:url("../assets/frame_final.png");
}
.frame.selected
{
    background-position: -185px 0px;
    background-position-x: -185px;
}

#frame1 { left:-35px }
#frame2 { left:135px }
#frame3 { left:305px }
#frame4 { left:475px }
#frame5 { left:645px }

.framedImage
{
    position: absolute;
    top:7px;
    left: 24px;
    width: 135px;
    height: 120px;
    background-position: 0px 0px;
    background-position-x: 0px;
    background-repeat:no-repeat;
}
.framedImage.selected
{
    background-position: 0px -121px;
}

#framedImage1 { background-image:url("../assets/image01.jpg"); }
#framedImage2 { background-image:url("../assets/image02.jpg"); }
#framedImage3 { background-image:url("../assets/image03.jpg"); }
#framedImage4 { background-image:url("../assets/image04.jpg"); }
#framedImage5 { background-image:url("../assets/image05.jpg"); }

.framedImageTitle
{
    position: absolute;
    top: 130px;
    width: 100%;
    font-size: 10pt;
    color: #698637;/*#333333;*/
    text-align: center;
    line-height: 1.5em;
}
.framedImageTitle.selected
{
    color: #E46F29;
}

.hitBtn
{
    position: absolute;
    top:4px;
    left:22px;
    cursor: pointer;
}

.tickLabel
{
    font-size: 10.5pt;
}
.map
{
    margin:auto;
    position:absolute;
    width:681px;
    height:390px;
    top:10px;
    left:100px;
}
.map_image
{
    width:681px;
    height:390px;
}