/*-----------------------------------------------------------------
collapse section
--------------------------- --------------------------------------*/
.collapse {
    width:auto;
    padding:5px 5px 5px 5px;
    font-size:10px;
    color:#333333;
    background:#999999;
    overflow:hidden;
    clear:both;
}


/*-----------------------------------------------------------------
carousel section - mainGallery.inc
--------------------------- --------------------------------------*/
.mainCarousel{
    margin-bottom:10px;
    width:996px;
    border:1px dotted #3399cc;
    background:#99ccff url("../images/gallery_bg.png") repeat-x bottom;
    overflow:hidden;
}

.stepCarousel{
    margin-top:10px;
    margin-left:20px;
    width:484px;
    height:202px;
    padding-top:10px;
    padding-bottom:10px;
    padding-left:20px;
    padding-right:20px;
    border-top:2px solid #557799;
    border-left:2px solid #557799;
    border-bottom:2px solid #5599cc;
    border-right:2px solid #5599cc;
    /*background:url('../images/carousel_bg.png') repeat-x top;*/
    position:relative;
    overflow:hidden;
    float:left;
}

.mainCarousel1{
    margin-bottom:10px;
    width:996px;
    background:url('../images/gall_mainLayer0_transparency.png') no-repeat;
    overflow:hidden;
}
.mainCrs1LeftFr{
    width:26px;
    height:222px;
    background:url('../images/gall_mainLayer1.png') no-repeat;
    float:left;
}
.mainCrs1RightFr{
    width:426px;
    height:222px;
    /*background:url('../images/gall_mainLayer2.png') no-repeat;*/
    float:right;
}

.mainCrs1RightFr .mainRightFrLeft{
    width:42px;
    height:222px;
    background:url('../images/gall_mainLayer2Left.png') no-repeat;
    float:left;
}
.mainCrs1RightFr .mainRightFrRight{
    width:24px;
    height:222px;
    background:url('../images/gall_mainLayer2Right.png') no-repeat;
    float:left;
}
.mainCrs1RightFr .mainRightFrCenter{
    width:360px;
    height:222px;
    background:url('../images/gall_mainLayer2Center.png') repeat-x;
    float:left;
}
.mainRightFrCenter .topStory{
    margin-top:15px;
    width:360px;
    height:180px;
    border-bottom:1px solid #99ccff;
    font-size:10px;
    text-align:justify;
    color:#ffffff;
    position:relative;
    overflow:hidden;
}
.topStory .contentdiv{
    width:358px;
    visibility:hidden;
    position:absolute;
}

.topStory .contentdiv a.linkTo{
    text-decoration:underline;
    color:#ffffff;
}
.topStory .contentdiv a:hover.linkTo{
    text-decoration:none;
    color:#666666;
}

.topStory b.topic{
    font-size:16px;
    font-family:arial,sans-serif;
    color:#99ccff;
}

.mainRightFrCenter #selectid{
    margin-top:3px;
    width:358px;
    height:10px;
}
.mainRightFrCenter #selectid a.toc{
    margin-left:1px;
    margin-right:2px;
    width:32.8px;
    height:5px;
    background:#99ccff;
    position:relative;
    display:inline-block;
    float:left;
}
.mainRightFrCenter #selectid a.selected{
    background:#66cccc;
    position:relative;
    float:left;
}
.mainRightFrCenter #selectid a:hover{
    background:#333333;
    position:relative;
    float:left;
}

.stepCarousel1{
    margin-top:6px;
    margin-left:26px;
    width:484px;
    height:208px;
    border-top:1px solid #99ccff;
    border-bottom:1px solid #99ccff;
    /*background:url('../images/carousel_bg1.png') repeat-y top left;*/
    background:url('../images/carousel_bg1_transparency.png') repeat-y;
    position:relative;
    overflow:hidden;
    float:left;
}
.stepCarousel1 .show3{
    top:0px;
    left:0px;
    position:absolute;
}

.stepCarousel1 .thumb1{
    margin-top:3px;
    margin-left:6px;
    width:160px;
    overflow:hidden;
    float:left;
}
.stepCarousel1 .thumb1 .newGame{
    margin-top:4px;
    margin-left:8px;
    position:absolute;
}

.stepCarousel .show3{
    top:0px;
    left:0px;
    position:absolute;
}

.stepCarousel .thumb1{
    margin-top:10px;
    margin-left:18px;
    width:170px;
    overflow:hidden;
    float:left;
}
.stepCarousel .thumb1 .newGame{
    margin-top:4px;
    margin-left:8px;
    position:absolute;
}

.prevThumb1{
    width:11px;
    height:221px;
    background:url('../images/galPrev.gif') no-repeat;
    cursor:pointer;
}

.nextThumb1{
    width:11px;
    height:221px;
    background:url('../images/galNext.gif') no-repeat;
    cursor:pointer;
}

.prevThumb0{
    width:15px;
    height:27px;
    background:url('../images/gPrev1Off.png') no-repeat;
    cursor:pointer;
}
.prevThumb0:hover{
    width:15px;
    height:27px;
    background:url('../images/gPrev1On.gif') no-repeat;
    cursor:pointer;
}

.nextThumb0{
    width:15px;
    height:27px;
    background:url('../images/gNext1Off.png') no-repeat;
    cursor:pointer;
}
.nextThumb0:hover{
    width:15px;
    height:27px;
    background:url('../images/gNext1On.gif') no-repeat;
    cursor:pointer;
}

IMG.gameSplash{
    border:1px solid black;
}
IMG.gameSplash:hover{
    border:1px solid #99ccff;
}



A.newGame{
    top:0px;
    left:0px;
    width:151px;
    height:58px;
    background:url('../images/boxNew.gif') no-repeat right;
    position:absolute;
}

.noticeBox{
    width:386px;
    height:230px;
    padding:10px;
    padding-right:30px;
    font-size:11px;
    text-align:justify;
    color:#333333;
    line-height:22px;
    background:#99ccff url("../images/gallery_bg.png") repeat-x bottom;
    float:right;
}








/*-----------------------------------------------------------------
games.php - containers
-----------------------------------------------------------------*/
.leftContainer{
    margin-top:2px;
    margin-left:4px;
    /*width:547px;*/
    width:560px;
    float:left;
}
.rightContainer{
    /*width:388px;*/
    width:376px;
    float:right;
}

.builtContainer{
    width:376px;
    padding:5px;
    position:relative;
    float:right;
}


/*-----------------------------------------------------------------
games.php - buttons
-----------------------------------------------------------------*/
input.allbt{
    width:36px;
    height:18px;
    font-size:9px;
    font-family:arial,sans-serif;
    text-transform:uppercase;
    text-align:center;
    letter-spacing:0px;
    color:#99ccff;
    background:url("../images/ic_bt.png") no-repeat;
}
input.allbt:hover{
    color:#ffffff;
    background:url("../images/ic_btOn.png") no-repeat;
}

/*-----------------------------------------------------------------
games.php - update items
-----------------------------------------------------------------*/
.gameSubject{
    width:auto;
    height:34px;
    padding-top:3px;
    padding-left:10px;
    font-size:12px;
    font-weight:bold;
    font-family:arial,sans-serif;
    color:#999999;
    line-height:16px;
    background:url("../images/bgMost.gif") repeat-x bottom;
    position:relative;
    display:block;
}
.gameSubject span{
    right:10px;
    position:absolute;
    float:right;
}

.latest{
    margin-bottom:8px;
    /*width:545px;*/
    width:560px;
    padding-bottom:6px;
    border:1px solid #444444;
    background:#555555 url("../images/box_bg.png") repeat-x top;
    float:left;
}

.box{
    margin-left:8px;
    /*width:535px;*/
    width:550px;
    height:110px;
    position:relative;
    display:block;
    float:left;
}

.latestLeft{
    /*width:133px;*/
    width:155px;
    height:110px;
    position:relative;
    overflow:hidden;
    display:inline;
    float:left;
}
A .latestLeft{
    background:url("../images/boxOff_layer3.png") no-repeat;
}
A:hover .latestLeft{
    background:url("../images/boxOn_layer3.png") no-repeat;
}

.latestLeft .latestLeftInside{
    /*width:103px;*/
    width:125px;
    height:110px;
    position:relative;
    overflow:hidden;
    display:inline;
    float:right;
}
A .latestLeft .latestLeftInside{
    /*background:url("../images/boxOff_layer0.png") repeat-x;*/
    background:url("../images/boxOff_layer1.png") repeat-x;
}
A:hover .latestLeft .latestLeftInside{
    /*background:url("../images/boxOn_layer0.png") repeat-x;*/
    background:url("../images/boxOn_layer1.png") repeat-x;
}

.latestLeft .ic_mobile{
    margin-top:10px;
    margin-left:10px;
    width:15px;
    height:15px;
    position:relative;
    background:url("../images/ic_mobile.gif") no-repeat;
    float:left;
}
.latestLeft .ic_online{
    margin-top:10px;
    margin-left:10px;
    width:15px;
    height:15px;
    position:relative;
    background:url("../images/ic_online.gif") no-repeat;
    float:left;
}

.latestLeft .update{
    width:514px;
    position:relative;
    float:left;
}
A .latestLeft .update{
}
A:hover .latestLeft .update{
}
A .latestLeft .latestLeftInside .thumb{
    margin-top:18px;
    margin-bottom:6px;
    width:120px;
    padding:1px;
    background:#666666;
    float:right;
    z-index:-1;
}
A:hover .latestLeft .latestLeftInside .thumb{
    background:#99ccff;
}

.latestCenter{
    /*width:385px;*/
    width:380px;
    height:110px;
    position:relative;
    overflow:hidden;
    display:inline;
    float:left;
}
A .latestCenter{
    background:url("../images/boxOff_layer1.png") repeat-x;
}
A:hover .latestCenter{
    background:url("../images/boxOn_layer1.png") repeat-x;
}
.latestCenter .contentBox{
    margin-left:10px;
    /*width:375px;*/
    width:355px;
    height:90px;
    padding-top:10px;
    font-size:10px;
    font-family:arial,sans-serif;
    line-height:14px;
    position:relative;
    float:left;
}
.latestCenter .bottomPart{
    margin-top:0px;
    width:25px;
    height:14px;
    float:left;
}
A .latestCenter .bottomPart{
    background:url("../images/boxOff_layer4.png") no-repeat top right;
}
A:hover .latestCenter .bottomPart{
    background:url("../images/boxOn_layer4.png") no-repeat top right;
}
.latestCenter span.download{
    bottom:16px;
    right:0px;
    width:83px;
    height:14px;
    padding-left:7px;
    font-size:9px;
    line-height:13px;
    position:absolute;
}
a .latestCenter span.download{
    color:#336699;
    background:url("../images/bt90Off.png") no-repeat;
}
a:hover .latestCenter span.download{
    color:#666666;
    background:url("../images/bt90On.png") no-repeat;
}
.latestCenter span.play{
    bottom:16px;
    right:0px;
    width:73px;
    height:14px;
    padding-left:7px;
    font-size:9px;
    line-height:13px;
    position:absolute;
}
a .latestCenter span.play{
    color:#336699;
    background:url("../images/bt80Off.png") no-repeat;
}
a:hover .latestCenter span.play{
    color:#666666;
    background:url("../images/bt80On.png") no-repeat;
}
.contentBox .datetime{
    width:auto;
    height:13px;
    color:#777777;
    position:relative;
    overflow:hidden;
    float:left;
}

.contentBox .gameTitle{
    width:320px;
    padding-top:4px;
    padding-bottom:4px;
    font-size:12px;
    font-weight:bold;
    position:relative;
    overflow:hidden;
}
.contentBox .newGame{
    margin-top:2px;
    margin-left:4px;
    position:absolute;
}
.contentBox .remark{
    padding-top:2px;
    font-size:10px;
    font-family:verdana,sans-serif;
    line-height:16px;
    position:relative;
    overflow:hidden;
}
.contentBox .remark .plus{
    padding-left:18px;
    padding-bottom:6px;
    line-height:12px;
    background:url("../images/ic_plus.gif") no-repeat;
}

.latestRight{
    width:6px;
    height:104px;
    position:relative;
    overflow:hidden;
    display:inline;
    float:left;
}
A .latestRight{
    background:url("../images/boxOff_layer2.png") no-repeat right;
}
A:hover .latestRight{
    background:url("../images/boxOn_layer2.png") no-repeat right;
}

.more{
    margin-top:4px;
    height:9px;
    width:36px;
    font-size:9px;
    line-height:10px;
    float:right;
}
A .more{
    color:#666666;
}
A:hover .more{
    color:#99ccff;
    background:url("../images/ic_more.gif") no-repeat;
}

.boxNewGame{
    width:142px;
    height:30px;
    padding-top:8px;
    padding-left:10px;
    position:absolute;
}
a .boxNewGame{
    background:url("../images/new_bgOff.png") no-repeat;
}
a:hover .boxNewGame{
    background:url("../images/new_bgOn.png") no-repeat;
}



.theMost{
    margin-top:2px;
    /*width:382px;*/
    width:370px;
    border:1px solid #444444;
    background:transparent url("../images/most_bg.png") repeat-x bottom;
    position:relative;
    float:left;
}

.theMost .mg{
    width:auto;
    background:none;
    position:relative;
}

.theMost .mg .mgBox{
    margin-left:2px;
    margin-right:2px;
    margin-bottom:2px;
    width:auto;
    height:40px;
    border-bottom:1px solid #444444;
    border-right:1px solid #555555;
    border-top:1px solid #888888;
    border-left:1px solid #777777;
    background:url("../images/bgMostBox.gif") repeat-x;
    position:relative;
    overflow:hidden;
}

.theMost .mg .mgBox .mgInside{
    padding-left:0px;
    padding-right:10px;
    padding-top:0px;
    padding-bottom:4px;
    float:left;
}
.theMost .mg A .mgBox .mgInside .mgIndex{
    margin-right:10px;
    padding-left:3px;
    width:22px;
    height:70px;
    font-size:12px;
    font-weight:bold;
    color:#aaaaaa;
    background:#888888;
    position:relative;
    float:left;
}
.theMost .mg A:hover .mgBox .mgInside .mgIndex{
    color:#333333;
    background:#99ccff;
}
.theMost .mg .mgBox .mgInside IMG{
    margin-top:4px;
    border:2px solid #333333;
    position:relative;
    float:left;
}
.theMost .mg .mgBox .mgInside .textBox{
    padding-left:8px;
    padding-right:8px;
    font-size:10px;
    color:#999999;
    line-height:11px;
    position:relative;
    float:left;
}
.theMost .mg .mgBox .mgInside .small{
    font-size:10px;
    font-family:arial,sans-serif;
    color:#888888;
    line-height:11px;
    position:relative;
}
.theMost .mg .mgBox .mgInside .textBox B{
    font-size:14px;
    font-family:arial,sans-serif;
    color:#cccccc;
    line-height:24px;
    position:relative;
}






.Qbox{
    margin-left:8px;
    width:550px;
    height:110px;
    position:relative;
    display:block;
    float:left;
}

.ql_Left{
    width:28px;
    height:110px;
    background:url("../images/boxQ_layer3.png") no-repeat;
    position:relative;
    overflow:hidden;
    display:inline;
    float:left;
}

.ql_Left .ic_mobile{
    margin-top:10px;
    margin-left:10px;
    width:15px;
    height:15px;
    position:relative;
    background:url("../images/ic_mobile.gif") no-repeat;
    float:left;
}
.ql_Left .ic_online{
    margin-top:10px;
    margin-left:10px;
    width:15px;
    height:15px;
    position:relative;
    background:url("../images/ic_online.gif") no-repeat;
    float:left;
}

.ql_Center{
    width:506px;
    height:110px;
    background:url("../images/boxQ_layer1.png") repeat-x;
    position:relative;
    overflow:hidden;
    display:inline;
    float:left;
}

.ql_Right{
    width:6px;
    height:104px;
    background:url("../images/boxQ_layer2.png") no-repeat right;
    position:relative;
    overflow:hidden;
    display:inline;
    float:left;
}


.quickMessage{
    margin-top:8px;
    margin-left:10px;
    font-size:9px;
    text-align:left;
    position:absolute;
    float:left;
}

.ql_Center .ql_Box{
    margin-top:15px;
    margin-right:10px;
    height:70px;
    /*background:url('../images/quickBox.png') no-repeat center center;*/
    overflow:hidden;
    display:inline;
    float:right;
}
.ql_Box .bgL{
    width:6px;
    height:70px;
    background:url('../images/quickBoxLeft.png') no-repeat left;
    float:left;
}
.ql_Box .bgM{
    width:120px;
    height:70px;
    padding:6px 1px 6px 1px;
    background:url('../images/quickBox_bg.png') repeat-x;
    float:left;
}
.ql_Box .bgR{
    width:6px;
    height:70px;
    background:url('../images/quickBoxRight.png') no-repeat right;
    float:left;
}
.ql_Box:hover .bgL{
    width:6px;
    height:70px;
    background:url('../images/quickBoxLeftOn.png') no-repeat left;
    float:left;
}
.ql_Box:hover .bgM{
    width:120px;
    height:70px;
    background:url('../images/quickBox_bgOn.png') repeat-x;
    float:left;
}
.ql_Box:hover .bgR{
    width:6px;
    height:70px;
    background:url('../images/quickBoxRightOn.png') no-repeat right;
    float:left;
}
.ql_Box .bgM .newGame{
    margin-top:4px;
    margin-left:-116px;
    position:absolute;
}

.ql_Box .bgM span{
    margin-top:36px;
    margin-left:-22px;
    width:20px;
    height:20px;
    padding-left:7px;
    font-size:9px;
    line-height:13px;
    position:absolute;
}
.ql_Box .bgM span.download{
    color:#336699;
    background:url("../images/ic_down.png") no-repeat;
}
.ql_Box .bgM span.play{
    color:#336699;
    background:url("../images/ic_play.png") no-repeat;
}