/* CSS Document */

#subsectionbg_news
{
width:975px;
height:25px;
background-image:url(/public/images/_herohub/_subsection/news_bg.jpg);
}

#subsectionbg_video
{
width:975px;
height:25px;
background-image:url(/public/images/_herohub/_subsection/video_bg.jpg);
}

#subsectionbg_story
{
width:975px;
height:25px;
background-image:url(/public/images/_herohub/_subsection/story_bg.jpg);
}

#subsectionbg_quest
{
width:975px;
height:25px;
background-image:url(/public/images/_herohub/_subsection/quest_bg.jpg);
}

#subsectionbg_funstuff
{
width:975px;
height:25px;
background-image:url(/public/images/_herohub/_subsection/funstuff_bg.jpg);
}
/*subsectionbuttons*/
#subsection_news
{
width:70px;
height:25px;
float:left;
}

#subsection_funstuff
{
width:110px;
height:25px;
float:left;
}

#subsection_videos
{
width:80px;
height:25px;
float:left;
}

#subsection_story
{
width:110px;
height:25px;
float:left;
}

#subsection_quest
{
width:90px;
height:25px;
float:left;
}

#subsection_lumipad
{
width:125px;
height:25px;
float:left;
}

#subsection_remain
{
width:390px;
height:25px;
float:left;
/* background-image:url(/public/images/_herohub/_subsection/remaining.png); */
}


/*sidesection*/
#middlebg
{
width:975px;
height:auto;
float:left;
background-image:url(/public/images/_herohub/_commonbottom/middlebg.jpg);
}

.middlebg
{
width:975px;
height:auto;
float:left;
background-image:url(/public/images/_herohub/_commonbottom/middlebg.jpg);
}

#middlebg01
{
width:975px;
height:auto;
float:left;
background-image:url(/public/images/_herohub/_lumipad/bg.jpg);
}

.middlebg01
{
width:975px;
height:auto;
float:left;
background-image:url(/public/images/_herohub/_lumipad/bg.jpg);
}

#middlebg02
{
width:975px;
height:auto;
float:left;
background-color:#B5D2E1;
}

.middlebg02
{
width:975px;
height:auto;
float:left;
background-color:#B5D2E1;
}

#middlebg03
{
width:975px;
height:auto;
float:left;
background-image:url(/public/images/_parents/_subsection/newbg_01.jpg);
}

.middlebg03
{
width:975px;
height:auto;
float:left;
background-image:url(/public/images/_parents/_subsection/newbg_01.jpg);
}

#middle
{
width:878px;
height:auto;
float:left;
margin-left:47px;
background-color:#FFFFFF;
}

.middle
{
width:878px;
height:auto;
float:left;
margin-left:47px;
background-color:#FFFFFF;
}

#middle01
{
width:878px;
height:40px;
float:left;
margin-left:47px;
background-color:#FFFFFF;
}

.middle01
{
width:878px;
height:40px;
float:left;
margin-left:47px;
background-color:#FFFFFF;
}

#middle02
{
width:878px;
height:auto;
float:left;
margin-left:47px;
background-image:url(/public/images/_herohub/_quest/greyishimage.jpg);
}

.middle02
{
width:878px;
height:auto;
float:left;
margin-left:47px;
background-image:url(/public/images/_herohub/_quest/greyishimage.jpg);
}

#middle03
{
width:878px;
height:20px;
float:left;
margin-left:47px;
background-color:#FFFFFF;
}

.middle03
{
width:878px;
height:20px;
float:left;
margin-left:47px;
background-color:#FFFFFF;
}

#rightside
{
width:50px;
height:auto;
float:left;
background-color:#C9DEEA;
}



/*newssection*/

#orangetitle
{
width:800px;
height:auto;
float:left;
margin-left:32px;
margin-top:52px;
}

#titledate
{
width:800px;
height:auto;
float:left;
margin-left:40px;
margin-top:5px;
}

#picturebg
{
width:253px;
height:253px;
float:left;
margin-left:40px;
margin-top:25px;
background-image:url(/public/images/_herohub/_news/picturebg.jpg);
}

#topictitle
{
width:550px;
height:auto;
float:left;
margin-left:28px;
margin-top:100px;
}

#topicdata
{
width:550px;
height:110px;
float:left;
margin-left:28px;
margin-top:10px;
}

#topicfotter
{
width:550px;
height:auto;
float:left;
margin-left:28px;
margin-top:10px;
}

#topicdivider
{
width:878px;
height:2px;
float:left;
margin-top:25px;
background-image:url(/public/images/_herohub/_news/line.jpg);
}


/*funstuffsection*/

#funstufftitle
{
width:400px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:52px;
text-align:center;
}

#datarow
{
width:800px;
height:150px;
float:left;
margin-left:32px;
margin-top:25px;
}

#data01
{
width:172px;
height:149px;
float:left;
margin-left:0px;
background-image:url(/public/images/_herohub/_funstuff/databg.jpg);
}

#data02
{
width:172px;
height:149px;
float:left;
margin-left:35px;
background-image:url(/public/images/_herohub/_funstuff/databg.jpg);
}

#dataimage
{
width:156px;
height:112px;
float:left;
margin-left:8px;
margin-top:6px;
}

#datatext
{
width:156px;
height:auto;
float:left;
margin-left:8px;
margin-top:7px;
text-align:center;
}

/*musicsection*/

#thelatest
{
width:300px;
height:auto;
float:left;
margin-left:25px;
margin-top:10px;
margin-bottom:15px;
}

#downloadhere
{
width:200px;
height:auto;
float:right;
margin-right:15px;
margin-top:10px;
}

#musicdatarow
{
width:800px;
height:auto;
float:left;
margin-left:0px;
margin-top:0px;
}

#musicdatarowblue
{
width:878px;
height:30px;
float:left;
background-color:#E4EFF6;
}

.musicdatarowblue
{
width:878px;
height:30px;
float:left;
background-color:#E4EFF6;
}

#musicdatarowwhite
{
width:878px;
height:30px;
float:left;
background-color:#ffffff;
}

#musicdatarowblue01
{
width:600px;
height:auto;
float:left;
margin-left:25px;
margin-top:5px;
vertical-align:middle;
}

.musicdatarowblue01
{
width:600px;
height:auto;
float:left;
margin-left:25px;
margin-top:5px;
vertical-align:middle;
}

#musicdatarowblue02
{
width:156px;
height:auto;
float:right;
margin-right:56px;
margin-top:5px;
vertical-align:middle;
}

.musicdatarowblue02
{
width:156px;
height:auto;
float:right;
margin-right:56px;
margin-top:5px;
vertical-align:middle;
}

/*musicsection*/
#videodatarow
{
width:800px;
height:auto;
float:left;
margin-left:78px;
margin-top:60px;
}

#videodata01
{
width:314px;
height:218px;
float:left;
margin-left:0px;
background-image:url(/public/images/_herohub/_video/databg.jpg);
}

#videodata02
{
width:314px;
height:218px;
float:left;
margin-left:95px;
background-image:url(/public/images/_herohub/_video/databg.jpg);
}

#videodataimage
{
width:295px;
height:167px;
float:left;
margin-left:8px;
margin-top:6px;
}

#videodatatext
{
width:295px;
height:auto;
float:left;
margin-left:8px;
margin-top:7px;
text-align:center;
}

/*storysection*/

#backstorytitle
{
width:800px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:52px;
text-align:left;
}

#chardetail
{
width:445px;
height:auto;
margin-left:23px;
margin-top:23px;
text-align:left;
}

.chardetail
{
width:445px;
height:auto;
margin-left:23px;
margin-top:23px;
text-align:left;
}

#questtitle
{
width:800px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:10px;
text-align:center;
}

#questmainimg
{
width:840px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:10px;
text-align:center;
}

#questmainimgtxt
{
width:840px;
height:113px;
margin-left:auto;
margin-right:auto;
background-image:url(/public/images/_yaheroquest/txtbg.jpg);
}

#questmainimgtxtarea
{
width:800px;
height:80px;
float:left;
margin-left:20px;
margin-top:10px;
text-align:left;
}


/*lumipadsection*/

#lumipadtitle
{
width:600px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:40px;
text-align:center;
}

#lumipadtitlespace
{
width:600px;
height:40px;
margin-left:auto;
margin-right:auto;
}

#lumipadimage
{
width:878px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:40px;
}

#arrows
{
width:94px;
height:auto;
float:left;
}

#arrowstext
{
width:690px;
height:auto;
float:left;
text-align:center;
margin-top:35px;
}

#annanimage
{
width:265px;
height:auto;
float:left;
}

#annantxt
{
width:530px;
height:auto;
float:left;
margin-top:20px;
margin-left:20px;
}

#annandiv
{
width:auto;
height:auto;
float:left;
margin-top:10px;
}

#mapimage
{
width:220px;
height:auto;
float:left;
margin-top:3px;
}

#maptxt
{
width:350px;
height:auto;
float:left;
margin-top:30px;
margin-left:10px;
}

#mapimage01
{
width:285px;
height:auto;
float:right;
margin-top:32px;
}

#mapimage02
{
width:878px;
height:auto;
float:left;
}

#yahero_bg01
{
width:975px;
height:414px;
float:left;
background-image:url(/public/images/_herohub/_lumipad01/yaherobg.jpg);
}

#yahero_whitepatch
{
width:885px;
height:90px;
margin-left:auto;
margin-right:auto;
background-image:url(/public/images/_herohub/_lumipad01/whitebg.png);
}

#yahero_whitepatchtext
{
width:820px;
height:auto;
margin-left:auto;
margin-right:auto;
}


#yahero_imageslot03
{
width:208px;
height:auto;
margin-left:56px;
margin-top:10px;
float:left;
}

.yahero_imageslot03
{
width:208px;
height:auto;
margin-left:56px;
margin-top:10px;
float:left;
}

#yahero_imageslot04
{
width:208px;
height:auto;
margin-left:9px;
margin-top:10px;
float:left;
}

.yahero_imageslot04
{
width:208px;
height:auto;
margin-left:9px;
margin-top:10px;
float:left;
}

#yahero_imageslot01
{
width:208px;
height:196px;
margin-left:56px;
float:left;
background-color:#FFFFFF;
}


.yahero_imageslot01
{
width:208px;
height:196px;
margin-left:56px;
float:left;
background-color:#FFFFFF;
}

#yahero_imageslot02
{
width:208px;
height:196px;
margin-left:9px;
float:left;
background-color:#FFFFFF;
}

.yahero_imageslot02
{
width:208px;
height:196px;
margin-left:9px;
float:left;
background-color:#FFFFFF;
}

#yahero_imageslot_image
{
width:208px;
height:auto;
float:left;
}

.yahero_imageslot_image
{
width:208px;
height:auto;
float:left;
}

#yahero__imageslot_text
{
width:170px;
height:auto;
margin-left:auto;
margin-right:auto;
text-align:center;
margin-top:10px;
}

#yahero_lumipadbtn
{
width:auto;
height:auto;
margin-left:56px;
margin-top:10px;
float:left;
}

#yahero_btnpatch
{
width:620px;
height:64px;
margin-top:10px;
float:left;
background-image:url(/public/images/_herohub/_lumipad01/patch.png);
}

#yahero_btnpatchtext
{
width:620px;
height:auto;
margin-top:23px;
float:left;
}

#yahero_btncurve
{
width:13px;
height:64px;
margin-top:10px;
float:left;
}

/*quest 01*/

#quest01title
{
width:600px;
height:auto;
margin-top:21px;
margin-left:24px;
float:left;
}

#quest01titletext
{
width:800px;
height:auto;
margin-top:21px;
margin-left:24px;
float:left;
}

#quest01back
{
width:200px;
height:auto;
margin-top:21px;
margin-left:24px;
float:left;
text-align:right;
}

#quest01text
{
width:800px;
height:auto;
margin-top:21px;
margin-left:24px;
float:left;
}

#quest01mainimg
{
width:858px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:10px;
}

#quest01btnimage01
{
width:184px;
height:151px;
margin-left:20px;
margin-top:10px;
float:left;
}

#quest01btnimage02
{
width:184px;
height:151px;
margin-left:32px;
margin-top:10px;
float:left;
}

/*quest 02*/

#quest02stuckimg
{
width:153px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:30px;
}

#quest02stuckimgtext
{
width:700px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:10px;
text-align:center;
}

#quest02text01
{
width:700px;
height:auto;
margin-left:31px;
margin-top:20px;
}

#quest02curve01
{
width:452px;
height:314px;
margin-left:31px;
margin-top:20px;
float:left;
background-image:url(/public/images/_herohub/_quest/curve01.png);
}

#quest02text02
{
width:360px;
height:auto;
margin-left:20px;
margin-top:20px;
float:left;
}

#quest02text03
{
width:350px;
height:auto;
margin-left:20px;
margin-top:10px;
float:left;
line-height:22px;
}

#quest02curve02
{
width:821px;
height:212px;
margin-left:31px;
margin-top:20px;
float:left;
background-image:url(/public/images/_herohub/_quest/curve02.png);
}

#quest02text04
{
width:350px;
height:auto;
margin-left:31px;
margin-top:20px;
float:left;
line-height:22px;
}

#quest02text05
{
width:820px;
height:auto;
margin-left:31px;
margin-top:10px;
float:left;
line-height:22px;
}

#quest02text06
{
width:300px;
height:auto;
margin-left:0px;
margin-top:0px;
float:left;
}

#quest02text07
{
width:300px;
height:auto;
margin-left:0px;
margin-top:10px;
float:left;
line-height:22px;
}

#quest02curve03
{
width:442px;
height:227px;
margin-left:31px;
margin-top:20px;
float:left;
background-image:url(/public/images/_herohub/_quest/curve03.png);
}

/*quest 03*/

#quest03img
{
width:289px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:30px;
}

#quest03curve01
{
width:266px;
height:175px;
margin-left:150px;
margin-top:40px;
float:left;
background-image:url(/public/images/_herohub/_quest/curve04.png);
}

#quest03curve02
{
width:266px;
height:175px;
margin-right:150px;
margin-top:40px;
float:right;
background-image:url(/public/images/_herohub/_quest/curve04.png);
}

#quest03curvetxt
{
width:150px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:15px;
text-align:center;
}

/*quest 04*/

#quest04img
{
width:272px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:30px;
}

#quest04attention
{
width:500px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:50px;
text-align:center;
}

#quest04curve01
{
width:266px;
height:175px;
margin-left:180px;
margin-top:10px;
float:left;
background-image:url(/public/images/_herohub/_quest/curve_04_01.png);
}

#quest04curveimg01
{
width:253px;
height:142px;
margin-left:7px;
margin-top:7px;
float:left;
}


#quest04curve02
{
width:203px;
height:175px;
margin-left:35px;
margin-top:10px;
float:left;
background-image:url(/public/images/_herohub/_quest/curve_04_02.png);
}

#quest04curveimg02
{
width:190px;
height:142px;
margin-left:7px;
margin-top:7px;
float:left;
}


#quest04curve03
{
width:505px;
height:175px;
margin-left:180px;
margin-top:20px;
float:left;
background-image:url(/public/images/_herohub/_quest/curve_04_03.png);
}

#quest04curveimg03
{
width:489px;
height:148px;
margin-left:7px;
margin-top:7px;
float:left;
}

#quest04curvetxt
{
width:150px;
height:auto;
margin-left:auto;
margin-right:auto;
margin-top:4px;
text-align:center;
}

#backtotop
{
width:120px;
height:20px;
margin-left:725px;
margin-top:4px;
float:left;
}

#herohub_cozek_bg01
{
width:499px;
height:343px;
margin-left:0px;
margin-top:0px;
float:left;
background-image:url(/public/images/_herohub/_story/char01bg.jpg);
}

#herohub_cozek_bg02
{
width:499px;
height:339px;
margin-left:0px;
margin-top:0px;
float:left;
background-image:url(/public/images/_herohub/_story/char02bg.jpg);
}

#herohub_cozek_bg03
{
width:499px;
height:339px;
margin-left:0px;
margin-top:0px;
float:left;
background-image:url(/public/images/_herohub/_story/char03bg.jpg);
}

#herohub_cozek_bg04
{
width:499px;
height:339px;
margin-left:0px;
margin-top:0px;
float:left;
background-image:url(/public/images/_herohub/_story/char04bg.jpg);
}

#herohub_cozek_bg05
{
width:499px;
height:346px;
margin-left:0px;
margin-top:0px;
float:left;
background-image:url(/public/images/_herohub/_story/char05bg.jpg);
}