@charset "utf-8"; /* CSS Document */ body, p, ul, li, form, h1, h2, h3 { padding:0; margin:0; } body {font-family:"Tahoma"; font-size:13px; color: #6d6255; margin-top: 0px;font-weight:normal; margin-bottom: 0px; background: url(../images/bg.png) top center repeat-x #fff8c7;} ul, li {list-style:none} a {text-decoration:none} a:hover { text-decoration: underline} a img { border:0; } .clear-div {clear:both} .shadow { height:376px; top:-35px; position:absolute; z-index:0 } .shadow.left { left:-218px; background:url(../images/shadow_left.png) 0px 0px; z-index:0; width:218px; } .shadow.right { right:-218px; background:url(../images/shadow_right.png) 0px 0px; z-index:0; width:218px; } #wrapper { margin:0 auto; width:1003px; padding:0 0px; position:relative; height:auto; display:block; margin-bottom:20px } #header { width:1003px; height:171px ; background:url(../images/bg_head.gif) center top no-repeat; z-index:5} #header ul { width:1003px; height:133px ; } #header ul li.kapook_logo { float:left; display:inline-block; width:176px; height:90px ; margin:35px 5px 0 20px;} #header ul li.kapook_logo a img {} #header ul li.newyear_logo { float:left; display:inline-block; width:669px; height:114px ; margin:25px 0 0 0px; } #header ul li.newyear_logo a img {} .menu { width:1003px; height:96px ; display:block; background:url(../images/bg_menu.png) center top no-repeat ; } .menu ul { position:relative; height:59px ; margin:0 auto; padding-top:20px ; width:980px } .menu ul li { float:left; display:inline; width:auto; height:auto; } .menu ul li.menu1 { float:left; display:inline-block; width:147px; height:65px; z-index:999; position: absolute; background:url(../images/menu1_01.png) center top no-repeat; margin:0 0 0 12px; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu1 a { float:left; display:inline-block; width:147px; height:65px; } .menu ul li.menu1:hover { float:left; display:inline-block; width:147px; height:65px; background:url(../images/menu1_02.png) center top no-repeat; z-index:999; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu2 { float:left; display:inline-block; width:159px; height:64px; z-index:999; position: absolute; background:url(../images/menu2_01.png) center top no-repeat; margin:7px 0 0 10px; left:161px;-webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu2 a { float:left; display:inline-block; width:159px; height:64px; } .menu ul li.menu2:hover { float:left; display:inline-block; width:159px; height:64px; background:url(../images/menu2_02.png) center top no-repeat; z-index:999; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu3 { float:left; display:inline-block; width:163px; height:64px; z-index:999; position: absolute; background:url(../images/menu3_01.png) center top no-repeat; margin:0px 0 0 10px; left:334px;-webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu3 a { float:left; display:inline-block; width:163px; height:64px; } .menu ul li.menu3:hover { float:left; display:inline-block; width:163px; height:64px; background:url(../images/menu3_02.png) center top no-repeat; z-index:999; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu4 { float:left; display:inline-block; width:128px; height:62px; z-index:999; position: absolute; background:url(../images/menu4_01.png) center top no-repeat; margin:7px 0 0 10px; left:511px;-webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu4 a { float:left; display:inline-block; width:128px; height:62px; } .menu ul li.menu4:hover { float:left; display:inline-block; width:128px; height:62px; background:url(../images/menu4_02.png) center top no-repeat; z-index:999; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu5 { float:left; display:inline-block; width:129px; height:63px; z-index:999; position: absolute; background:url(../images/menu5_01.png) center top no-repeat; margin:0px 0 0 10px; left:653px; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu5 a { float:left; display:inline-block; width:129px; height:63px; } .menu ul li.menu5:hover { float:left; display:inline-block; width:129px; height:63px; background:url(../images/menu5_02.png) center top no-repeat; z-index:999; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu6 { float:left; display:inline-block; width:165px; height:63px; z-index:999; position: absolute; background:url(../images/menu6_01.png) center top no-repeat; margin:7px 0 0 10px; left:793px; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} .menu ul li.menu6 a { float:left; display:inline-block; width:165px; height:63px; } .menu ul li.menu6:hover { float:left; display:inline-block; width:165px; height:63px; background:url(../images/menu6_02.png) center top no-repeat; z-index:999; -webkit-transition: background 1s ease-in-out;-moz-transition: background 1s ease-in-out;-ms-transition: background 1s ease-in-out;-o-transition: background 1s ease-in-out;transition: background 1s ease-in-out;} #w_left { float: left; display:inline-block; width:435px; height:auto; } #title { width:435px; height:128px ; background:url(../images/bg_hgroup.png) center top no-repeat; } hgroup { width:420px; height:auto ; margin:0 auto; text-align:center ; display:block; padding-top:80px} hgroup h1, h2 { font-size:15px; font-weight:bold; float:inherit; display:inline; margin-right:8px; color:#782902; text-shadow:1px 1px 1px #fff;} #profile { float: left; display:inline-block; width:435px; height:auto; } #profile header { width:435px; height:103px; background:url(../images/profile_box_01.png) center top no-repeat;} #profile header h2 { float:left; font-size:12px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:right; margin:65px 0px 0 120px} #profile ul { width:435px; height:340px; margin:0 auto; display:block ; background:url(../images/profile_box_02.png) center top repeat-y;} #profile ul li { width:190px; height:155px; float:left; display:inline; text-align:center; margin:8px 0px 0 18px; position: relative; } #profile ul li a { color:#8b5a67; display:inline-block;} #profile ul li a strong { color:#ac9223} #profile ul li a img { width:178px; height:88px; margin:0 auto; display:block; -webkit-border-radius: 10px 10px 10px 10px; border-radius: 10px 10px 10px 10px;-webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); top:0; left:0; z-index:888; margin-bottom:15px ; border:2px #fff soild } #profile ul li a em { width:178px; margin:0 auto; display:block; position: absolute; bottom:53px; left:3px; z-index:999; background:url(../images/tile_01.png) center top repeat; text-decoration:none; font-style:normal; font-weight:bold; color:#FFFFFF; font-size:13px; padding:3px 3px; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #profile ul li a em strong { display:none} #profile ul li:hover a em { width:178px; margin:0 auto; display:block; position: absolute; bottom:53px; left:3px; z-index:999; background:url(../images/tile_01.png) center top repeat; text-decoration:none; font-style:normal; font-weight:bold; color:#FFFFFF; font-size:13px; padding:10px 3px} #profile ul li:hover a em strong { display:block; color:#FFFF00; font-size:13px; font-weight:bold; } #profile ul li a font { color:#FF3366; font-size:11px; font-weight:bold} #profile footer { width:435px; height:65px; background:url(../images/profile_box_03.png) center top no-repeat;} #wish { float: left; display:inline-block; width:435px; height:auto; } #wish header { width:435px; height:100px; background:url(../images/wish_box_01.png) center top no-repeat;} #wish header h2 { float:left; font-size:11px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:left; margin:60px 0px 0 120px} #wish ul { width:405px; height:520px; margin:0 auto; display:block ; background:url(../images/wish_box_02.png) center top repeat-y; padding:0 15px;} #wish ul li.thump1 { width:178px; height:148px; float:left; display:inline; text-align:center; margin:8px 1px 8px 11px;padding:4px; background-color:#fff; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #wish ul li.thump1:hover { width:178px; height:148px; float:left; display:inline; text-align:center; margin:8px 1px 8px 11px;padding:4px; background-color:#fef3ff; -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #wish ul li.thump1 a { color: #6d4d78; display:block; font-size:13px} #wish ul li.thump1 a strong { color:#b658c4} #wish ul li.thump1 a img { width:167px; height:98px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:2px #e579f3 solid ; padding:2px } #wish ul li.thump2 { width:116px; height:150px; float:left; display:inline; text-align:center; margin:8px 0px 8px 8px;padding:4px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #wish ul li.thump2:hover { width:116px; height:150px; float:left; display:inline; text-align:center; margin:8px 0px 8px 8px;padding:4px; background-color:#bd65c8;;-webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #wish ul li.thump2 a { color: #6d4d78; display:block; font-size:13px} #wish ul li.thump2:hover a { color: #fff; display:block; font-size:13px} #wish ul li.thump2 a strong { color:#b658c4} #wish ul li.thump2:hover a strong { color: #fffb94} #wish ul li.thump2 a img { width:106px; height:76px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:1px #bd65ca dotted ; padding:2px } #wish ul li.thump2:hover a img { width:106px; height:76px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:1px #fff dotted ; padding:2px } #wish footer { width:435px; height:23px; background:url(../images/wish_box_03.png) center top no-repeat;} #poem { float: left; display:inline-block; width:435px; height:auto; } #poem header { width:435px; height:116px; background:url(../images/poem_box_01.png) center top no-repeat;} #poem header a { float:left; font-size:14px; color:#655a62; text-shadow: none; font-weight:normal; display:block; text-align:left; margin:30px 0px 0 90px;}#wish ul { width:405px; height:590px; margin:0 auto; display:block ; background:url(../images/wish_box_02.png) center top repeat-y; padding:0 15px;} #poem .bg2 { width:435px; height:26px; background:url(../images/poem_box_011.png) center top no-repeat;} #poem ul { width:405px; height:auto; margin:0 auto; display:block ; background:url(../images/poem_box_02.png) center top repeat-y; padding:0 15px;} #poem ul li { width:350px; height:120px; float:left; display:inline; text-align:center; margin:8px 1px 8px 27px;border-bottom:3px dotted #9999FF;} #poem ul li a { color: #6d4d78; display:block; font-size:13px} #poem ul li a strong { color:#b658c4; font-size:16px; display:block; margin-bottom:5px ; padding:3px 6px; background-color: #f9f1ff; text-shadow:1px 1px 1px #fff } #poem ul li a em { color: #993366 ; font-size:13px; text-align:right; font-weight:bold; display:block} #poem footer { width:435px; height:72px; background:url(../images/poem_box_03.png) center top no-repeat;} #game { float: left; display:inline-block; width:435px; height:auto; } #game header { width:435px; height:102px; background:url(../images/game_box_01.png) center top no-repeat;} #game header h2 { float:left; font-size:11px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:left; margin:60px 0px 0 120px} #game ul { width:405px; height:auto; margin:0 auto; display:block ; background:url(../images/game_box_02.png) center top repeat-y; padding:0 15px;} #game ul li.thump1 { width:178px; height:231px; float:left; display:inline; text-align:center; margin:8px 1px 8px 11px;padding:4px; background-color:#fff; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #game ul li.thump1:hover { width:178px; height:231px; float:left; display:inline; text-align:center; margin:8px 1px 8px 11px;padding:4px; background-color:#c0eeec; -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #game ul li.thump1 a { color: #284345; display:block; font-size:13px} #game ul li.thump1 a strong { color:#1fbab4} #game ul li.thump1 a img { width:167px; height:167px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:2px #1fbab4 solid ; padding:2px } #game ul li.thump1:hover a img { width:167px; height:167px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:2px #fff solid ; padding:2px } #game ul li.thump2 { width:114px; height:200px; float:left; display:inline; text-align:center; margin:2px 0px 0 8px; padding:5px } #game ul li.thump2:hover { width:114px; height:200px; float:left; display:inline; text-align:center; margin:2px 0px 0 8px; background-color:#c0eeec ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #game ul li.thump2 a { color:#565f6d; font-size:13px } #game ul li.thump2 a strong { color:#02827d; font-size:13px; } #game ul li.thump2:hover {} #game ul li.thump2 a img { width:106px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #03cac3 dotted } #game ul li.thump2:hover a img { width:106px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #fff solid } #game footer { width:435px; height:70px; background:url(../images/game_box_03.png) center top no-repeat;} #travel { float: left; display:inline-block; width:435px; height:auto; } #travel header { width:435px; height:103px; background:url(../images/travel_box_01.png) center top no-repeat;} #travel header h2 { float:left; font-size:13px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:left; margin:63px 0px 0 120px} #travel ul { width:405px; height:auto; margin:0 auto; display:block ; background:url(../images/travel_box_02.png) center top repeat-y; padding:0 15px;} #travel ul li.thump1 { width:180px; height:175px; float:left; display:inline; text-align:center; margin:5px 2px 3px 9px;padding:4px;-webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #travel ul li.thump1:hover { width:180px; height:175px; float:left; display:inline; text-align:center; margin:5px 2px 3px 9px;padding:4px; background-color:#ecffac; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #travel ul li.thump1 a { color: #735534; display:block; font-size:13px} #travel ul li.thump1 a strong { color:#c9c900; font-size:13px} #travel ul li.thump1 a img { width:172px; height:127px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:2px #c9c900 solid ; padding:2px } #travel ul li.thump1:hover a img { width:172px; height:127px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:2px #fff solid ; padding:2px } #travel ul li.thump2 { width:115px; height:220px; float:left; display:inline; text-align:center; margin:5px 2px 8px 8px;padding:4px;-webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); background-color:#FFF; -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; } #travel ul li.thump2:hover { width:115px; height:220px; float:left; display:inline; text-align:center; margin:5px 2px 8px 8px;padding:4px; background-color:#ecffac; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; } #travel ul li.thump2 a { color: #735534; display:block; font-size:13px} #travel ul li.thump2 a strong { color:#c9c900} #travel ul li.thump2 a img { width:107px; height:140px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:2px #c9c900 solid ; padding:2px ; } #travel ul li.thump2:hover a img { width:107px; height:140px; margin:0 auto; display:block; z-index:888; margin-bottom:2px ; border:2px #fff solid ; padding:2px } #travel footer { width:435px; height:70px; background:url(../images/travel_box_03.png) center top no-repeat;} #clip { float: left; display:inline-block; width:435px; height:auto; } #clip header { width:435px; height:102px; background:url(../images/clip_box_01.png) center top no-repeat;} #clip header h2 { float:left; font-size:11px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:left; margin:60px 0px 0 120px} #clip ul { width:405px; height:auto; margin:0 auto; display:block ; background:url(../images/clip_box_02.png) center top repeat-y; padding:0 15px;} #clip ul li.thump1 { width:110px; height:202px; float:left; display:inline; text-align:center; margin:8px 2px 8px 11px;padding:4px; background-color:#fff; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; position:relative} #clip ul li.thump1:hover { width:110px; height:202px; float:left; display:inline; text-align:center; margin:8px 2px 8px 11px;padding:4px; background-color:#c7dfff; -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.2); -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #clip ul li.thump1 a { color: #284345; display:block; font-size:13px} #clip ul li.thump1 a strong { color:#0d6bd5} #clip ul li.thump1 a img { width:99px; height:118px; margin:0 auto; display:block; z-index:888; margin-bottom:8px ; border:2px #0d6bd5 solid ; padding:2px } #clip ul li.thump1:hover a img { width:99px; height:118px; margin:0 auto; display:block; z-index:888; margin-bottom:8px ; border:2px #fff solid ; padding:2px } #clip ul li.thump1 a img.playvdo1 { position:absolute; top:50px; left:43px ; width:30px; height:30px; border:none !important;} #clip ul li.thump2 { width:120px; height:164px; float:left; display:inline; text-align:center; margin:2px 0px 0 3px; padding:5px ; position:relative } #clip ul li.thump2:hover { width:120px; height:164px; float:left; display:inline; text-align:center; margin:2px 0px 0 3px; background-color:#c7dfff; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #clip ul li.thump2 a { color:#173557; font-size:13px } #clip ul li.thump2 a strong { color:#0d6bd5; font-size:13px; } #clip ul li.thump2:hover {} #clip ul li.thump2 a img { width:110px; height:83px; margin:0 auto; display:block; margin-bottom:4px ; padding:2px; border:2px #0d6bd5 dotted } #clip ul li.thump2:hover a img { width:110px; height:83px; margin:0 auto; display:block; margin-bottom:4px ; padding:2px; border:2px #fff solid } #clip ul li.thump2 a img.playvdo1 { position:absolute; top:35px; left:47px ; width:30px; height:30px; border:none !important;} #clip footer { width:435px; height:70px; background:url(../images/clip_box_03.png) center top no-repeat;} #w_right { float: left; display:inline-block; width:568px; height:auto; } #title2 { width:568px; height:275px ; background:url(../images/bg_title2_2016_2.png) center top no-repeat; } #title2 .share { width:568px; height:70px ; } #title2 hgroup { width:510px; height:auto ; margin:0 auto; text-align:center ; display:block; padding-top:60px} #title2 hgroup h2 { font-size:18px; font-weight:bold; display:block; color:#f96d4f; text-shadow:1px 1px 1px #fff; margin-bottom:10px} #title2 hgroup h3 { font-size:13px; font-weight:normal; display:block; color:#966432; text-shadow:1px 1px 1px #fff;} #title2 hgroup h3 a { color:#77b500} #banner { width:568px; height:125px ; background:url(../images/banner.png) center top no-repeat; } #banner a img { width:568px; height:125px ; } #article { float: left; display:inline-block; width:568px; height:auto; } #article header { width:568px; height:102px; background:url(../images/article_box_01.png) center top no-repeat;} #article header h2 { float:left; font-size:12px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:right; margin:63px 0px 0 126px;} #article ul { width:518px; height:auto; margin:0 auto; display:block ; background:url(../images/article_box_02.png) center top repeat-y;padding:0 25px} #article ul li.thump1 { width:116px; height:186px; float:left; display:inline; text-align:center; margin:8px 6px 8px 7px; position: relative; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius: 8px; border-radius: 8px ; } #article ul li.thump1 a span { color:#fff; font-size:13px; display:block; background-color:#00CC66; border-top:3px #d6d6d6 solid; position:absolute; bottom:0; left:0; height:65px; width:100%; -webkit-border-radius: 0 0 8px 8px; border-radius: 0 0 8px 8px; z-index:999; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #article ul li.thump1:hover a span { color:#fff; display:block; border-top:3px #d6d6d6 solid; position:absolute; bottom:0; left:0; height:75px; width:100%; -webkit-border-radius: 0 0 8px 8px; border-radius: 0 0 8px 8px; z-index:999; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #article ul li.thump1 a span strong { color: #FFFF00} #article ul li.thump1 a img { width:116px; height:123px; margin:0 auto; display:block; -webkit-border-radius: 8px 8px 0 0 ; border-radius: 8px 8px 0 0; z-index:888; margin-bottom:15px ; border:2px #fff soild } #article ul li.thump1 a span.color1 { background-color:#1b98be; } #article ul li.thump1:hover a span.color1 { background-color:#1b98be; } #article ul li.thump1 a span.color2 { background-color:#0069c2; } #article ul li.thump1:hover a span.color2 { background-color:#0069c2; } #article ul li.thump1 a span.color3 { background-color:#3052a3; } #article ul li.thump1:hover a span.color3 { background-color:#3052a3; } #article ul li.thump1 a span.color4 { background-color:#6a98dc; } #article ul li.thump1:hover a span.color4 { background-color:#6a98dc; } #article ul li.thump2 { width:114px; height:180px; float:left; display:inline; text-align:center; margin:2px 3px 0 2px; padding:5px } #article ul li.thump2:hover { width:114px; height:180px; float:left; display:inline; text-align:center; margin:2px 3px 0 2px; background-color:#f7f7f7 ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #article ul li.thump2 a { color:#565f6d; font-size:13px } #article ul li.thump2 a strong { color:#3e57ab; font-size:13px; } #article ul li.thump2:hover {} #article ul li.thump2 a img { width:106px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #6a98dc solid } #article ul li.thump2:hover a img { width:106px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #003ed0 solid } #article ul li.thump3 { width:156px; height:172px; float:left; display:inline; text-align:center; margin:2px 3px 0 2px; padding:5px; position:relative; } #article ul li.thump3:hover { width:156px; height:172px; float:left; display:inline; text-align:center; margin:2px 3px 0 2px; background-color:#f7f7f7 ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #article ul li.thump3 a { color:#565f6d; font-size:13px } #article ul li.thump3 a strong { color:#3e57ab; font-size:13px; } #article ul li.thump3:hover {} #article ul li.thump3 a img { width:145px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #6a98dc solid } #article ul li.thump3:hover a img { width:145px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #003ed0 solid } #article ul li.thump3 a em img { width:143px; height:106px; margin:0 auto; display:block; position: absolute; top:2px; left:4px; z-index:999; border:none !important;} #article footer { width:568px; height:65px; background:url(../images/article_box_03.png) center top no-repeat;} #horo { float: left; display:inline-block; width:568px; height:auto; } #horo header { width:568px; height:103px; background:url(../images/horo_box_01.png) center top no-repeat;} #horo header h2 { float:left; font-size:12px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:right; margin:63px 0px 0 126px;} #horo ul { width:543px; height:auto; margin:0 auto; display:block ; background:url(../images/horo_box_02.png) center top repeat-y; padding-left:25px} #horo ul li.thump1 { width:248px; height:180px; float:left; display:inline; text-align:center; margin:2px 0px 0 0px; padding:5px } #horo ul li.thump1:hover { width:248px; height:180px; float:left; display:inline; text-align:center; margin:2px 0px 0 0px; background-color:#fff2f7; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #horo ul li.thump1 a { color:#8b747c; font-size:14px } #horo ul li.thump1 a strong { color:#a34db7; font-size:14px; } #horo ul li.thump1:hover {} #horo ul li.thump1 a img { width:238px; height:126px; margin:0 auto; display:block; margin-bottom:5px ; padding:2px; border:2px #ff3690 solid ; -webkit-border-radius: 8px; border-radius: 8px; } #horo ul li.thump1:hover a img { width:238px; height:126px; margin:0 auto; display:block; margin-bottom:5px ; padding:2px; border:2px #d26cff solid; -webkit-border-radius: 8px; border-radius: 8px; } #horo ul li.thump2 { width:116px; height:180px; float:left; display:inline; text-align:center; margin:2px 5px 0 0px; padding:5px; } #horo ul li.thump2:hover { width:116px; height:180px; float:left; display:inline; text-align:center; margin:2px 5px 0 0px; background-color:#fff2f7; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #horo ul li.thump2 a { color:#8b747c; font-size:13px } #horo ul li.thump2 a strong { color:#a34db7; font-size:13px; } #horo ul li.thump2:hover {} #horo ul li.thump2 a img { width:106px; height:106px; margin:0 auto; display:block; margin-bottom:5px ; padding:2px; border:2px #ff3690 solid ; -webkit-border-radius: 8px; border-radius: 8px; } #horo ul li.thump2:hover a img { width:106px; height:106px; margin:0 auto; display:block; margin-bottom:5px ; padding:2px; border:2px #d26cff solid; -webkit-border-radius: 8px; border-radius: 8px; } #horo footer { width:568px; height:75px; background:url(../images/horo_box_03.png) center top no-repeat;} #gift { float: left; display:inline-block; width:568px; height:auto; } #gift header { width:568px; height:105px; background:url(../images/gift_box_01.png) center top no-repeat;} #gift header h2 { float:left; font-size:12px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:right; margin:63px 0px 0 126px;} #gift ul { width:543px; height:auto; margin:0 auto; display:block ; background:url(../images/gift_box_02.png) center top repeat-y; padding-left:25px} #gift ul li.thump1 { width:156px; height:160px; float:left; display:inline; text-align:center; margin:2px 0px 0 0px; padding:8px } #gift ul li.thump1:hover { width:156px; height:160px; float:left; display:inline; text-align:center; margin:2px 0px 0 0px; background-color:#ffffd6; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #gift ul li.thump1 a { color:#7d5732; font-size:13px } #gift ul li.thump1 a strong { color:#f27714; font-size:13px; } #gift ul li.thump1:hover {} #gift ul li.thump1 a img { width:148px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #f27714 solid } #gift ul li.thump1:hover a img { width:148px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #f27714 solid } #gift ul li.thump2 { width:116px; height:195px; float:left; display:inline; text-align:center; margin:8px 6px 8px 7px; position: relative; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius: 8px; border-radius: 8px ; } #gift ul li.thump2 a span { color:#fff; font-size:13px; display:block; background-color:#00CC66; border-top:3px #ffef80 solid; position:absolute; bottom:0; left:0; height:75px; width:100%; -webkit-border-radius: 0 0 8px 8px; border-radius: 0 0 8px 8px; z-index:999; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #gift ul li.thump2:hover a span { color:#fff; display:block; border-top:3px #ffef80 solid; position:absolute; bottom:0; left:0; height:85px; width:100%; -webkit-border-radius: 0 0 8px 8px; border-radius: 0 0 8px 8px; z-index:999; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out;} #gift ul li.thump2 a span strong { color: #FFFF00} #gift ul li.thump2 a img { width:116px; height:123px; margin:0 auto; display:block; -webkit-border-radius: 8px 8px 0 0 ; border-radius: 8px 8px 0 0; z-index:888; margin-bottom:15px ; border:2px #fff soild } #gift ul li.thump2 a span.color1 { background-color:#f27714; } #gift ul li.thump2 a span.color2 { background-color:#ba5300; } #gift ul li.thump3 { width:242px; height:145px; float:left; display:inline; text-align:center; margin:2px 0px 0 0px; padding:8px } #gift ul li.thump3:hover { width:242px; height:145px; float:left; display:inline; text-align:center; margin:2px 0px 0 0px; background-color:#ffffd6; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #gift ul li.thump3 a { color:#7d5732; font-size:13px } #gift ul li.thump3 a strong { color:#f27714; font-size:13px; } #gift ul li.thump3:hover {} #gift ul li.thump3 a img { width:234px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #f27714 solid } #gift ul li.thump3:hover a img { width:234px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #f27714 solid } #gift footer { width:568px; height:73px; background:url(../images/gift_box_03.png) center top no-repeat;} #info_share { float: left; display:inline-block; width:568px; height:auto; } #info_share header { width:568px; height:105px; background:url(../images/info_share_box_01.png) center top no-repeat;} #info_share header h2 { float:left; font-size:12px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:right; margin:63px 0px 0 126px;} #info_share ul { width:518px; height:auto; margin:0 auto; display:block ; background:url(../images/info_share_box_02.png) center top repeat-y;padding:0 25px} #info_share ul li { width:146px; height:146px; float:left; display:inline; text-align:center; margin:8px 4px 8px 17px; -webkit-border-radius: 8px; border-radius: 8px ;position: relative; } #info_share ul li a {} #info_share ul li a img { width:143px; height:143px; -webkit-border-radius: 8px; border-radius: 8px ; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); } #info_share ul li:hover a img { width:143px; height:143px; -webkit-border-radius: 8px; border-radius: 8px ; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); opacity:0.5;-webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #info_share ul li a em { width:143px; height:143px; margin:0 auto; display:block; position: absolute; top:0px; left:2px; z-index:999;} #info_share footer { width:568px; height:76px; background:url(../images/info_share_box_03.png) center top no-repeat;} #glitter_ecard { float: left; display:inline-block; width:568px; height:auto; } #glitter_ecard header { width:568px; height:126px; background:url(../images/glitter_ecard_box_01.png) center top no-repeat;} #glitter_ecard h2 { float:left; font-size:16px; color:#732aa1; text-shadow: none; font-weight:normal; display:block; text-align:left; margin:5px 0px 0 35px; background-color:#f9f1ff ; padding:5px 15px; width:465px;} #glitter_ecard h3 { float:left; font-size:16px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:left; margin:5px 0px 0 35px; background-color:#c491cb ; padding:5px 15px; width:465px;} #glitter_ecard ul { width:518px; height:auto; margin:0 auto; display:block ; background:url(../images/glitter_ecard_box_02.png) center top repeat-y;padding:0 25px} #glitter_ecard ul li { width:120px; height:auto; float:left; display:inline; text-align:center; margin:2px 2px 6px 6px; -webkit-border-radius: 8px; border-radius: 8px ;position: relative; line-height:105px; } #glitter_ecard ul li a {} #glitter_ecard ul li a img {padding:3px; border:none; display:block; margin:0 auto; line-height:105px;} #glitter_ecard footer { width:568px; height:77px; background:url(../images/glitter_ecard_box_03.png) center top no-repeat;} #photo { float: left; display:inline-block; width:568px; height:auto; } #photo header { width:568px; height:105px; background:url(../images/photo_box_01.png) center top no-repeat;} #photo header h2 { float:left; font-size:12px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:right; margin:63px 0px 0 126px;} #photo ul { width:518px; height:auto; margin:0 auto; display:block ; background:url(../images/photo_box_02.png) center top repeat-y;padding:0 25px} #photo ul li.thump1 { width:156px; height:166px; float:left; display:inline; text-align:center; margin:2px 4px 0 2px; padding:5px } #photo ul li.thump1:hover { width:156px; height:166px; float:left; display:inline; text-align:center; margin:2px 4px 0 2px; background-color:#ffdd55 ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #photo ul li.thump1 a { color:#744b23; font-size:13px } #photo ul li.thump1 a strong { color:#d96609; font-size:13px; } #photo ul li.thump1:hover {} #photo ul li.thump1 a img { width:148px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #ff7200 solid } #photo ul li.thump1:hover a img { width:148px; height:106px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #fff solid } #photo ul li.thump2 { width:114px; height:158px; float:left; display:inline; text-align:center; margin:2px 3px 0 2px; padding:5px } #photo ul li.thump2:hover { width:114px; height:158px; float:left; display:inline; text-align:center; margin:2px 3px 0 2px; background-color:#ffdd55 ; -webkit-transition: 0.15s ease-in-out;-moz-transition: 0.15s ease-in-out;-ms-transition:0.15s ease-in-out;-o-transition: 0.15s ease-in-out;transition:0.15s ease-in-out; } #photo ul li.thump2 a { color:#744b23; font-size:13px } #photo ul li.thump2 a strong { color:#d96609; font-size:13px; } #photo ul li.thump2:hover {} #photo ul li.thump2 a img { width:106px; height:80px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #ff7200 solid } #photo ul li.thump2:hover a img { width:106px; height:80px; margin:0 auto; display:block; margin-bottom:2px ; padding:2px; border:2px #fff solid } #photo footer { width:568px; height:65px; background:url(../images/photo_box_03.png) center top no-repeat;} #music { float: left; display:inline-block; width:568px; height:auto; } #music header { width:568px; height:105px; background:url(../images/music_box_01.png) center top no-repeat;} #music header h2 { float:left; font-size:12px; color:#fff; text-shadow: none; font-weight:normal; display:block; text-align:right; margin:63px 0px 0 126px;} #music ul { width:543px; height:auto; margin:0 auto; display:block ; background:url(../images/music_box_02.png) center top repeat-y; padding-left:25px} #music ul li { width:240px; display:inline; float:left; padding:5px 0px 5px 0px; margin:5px 0 5px 12px; border-bottom:dotted 2px #CC6600} #music ul li:hover { width:240px; display:inline; float:left; padding:5px 0px 5px 0px; margin:5px 0 5px 12px; border-bottom:dotted 2px #CC6600; background-color:#FFFF99} #music ul li a { width:240px; overflow:hidden } #music ul li a span strong { color:#745841; float:left; display:inline; font-size:13px ; margin-right:5px} #music ul li a span { color:#f27714; float:left; display:inline; font-size:13px;} #music ul li a img { width:22px; height:19px; float:left; display:inline; margin-right:5px;} #music footer { width:568px; height:73px; background:url(../images/music_box_03.png) center top no-repeat;} .share-group { width:380px; float:right; display:inline-block; margin-bottom:25px; margin-top:10px; height:40px;} .share-group span { font-family:Tahoma; font-size:18px; position:relative; margin:0 0 0px; color:#000; text-align:center; padding:4px 0; display:inline-block; float:left;background:#FFF; } .share-group a { text-align:center; font-weight:bold; font-size:15px; } .share-group .fb-share { width:230px; display:inline; float:left; margin:4px 3px 0 3px; } .share-group .fb-share a { display:block; padding:4px 0; background:#3b5998; color:#FFF; text-align:left;height:30px; -webkit-border-radius: 4px; border-radius: 4px; line-height:30px;} .share-group .fb-share a img { float:left; display:inline-block; margin:5px 5px 0 18px ;width:23px; height:auto ; line-height:40px;} .share-group .fb-share a:before { content:"Share"; font-size:18px; font-weight:normal; line-height:30px} .share-group .fb-share a span.boxCount { float:right; display:block; width:100px; line-height:23px; text-align:center ; margin-right:4px;} .share-group .tw-share { width:120px; display:inline; float:right; margin:4px 15px 0 3px; } .share-group .tw-share a { display:block; padding:4px 0; background:#00b6dd; color:#FFF; text-align:left;height:30px; -webkit-border-radius: 4px; border-radius: 4px; line-height:30px;} .share-group .tw-share a img { float:left; display:inline-block; margin:5px 5px 0 13px; width:23px; height:auto; line-height:40px;} .share-group .tw-share a:before { content:"Retweet"; font-size:18px; font-weight:normal} .share-group .fb-share a:hover:before { content:"แชร์ไปยังเฟซบุ๊ก"; font-size:15px; display:block; margin:0 auto; text-align:left; margin-left:5px; font-weight:bold; height:0px; line-height:30px} .share-group .tw-share a:hover:before { content:"รีทวีตสู่ทวิตเตอร์"; font-size:15px; display:block; margin:0 auto ; text-align:left; margin-left:8px;font-weight:bold; height:0px; line-height:30px} .share-group .fb-share a:hover img , .share-group .tw-share a:hover img { display:none} .social-share { width:240px; overflow:hidden; background:#FFF; float:left; display:inline-block; margin-top:10px; height:40px ; margin-bottom:10px; border-right:1px dashed #CCCCCC;} .social-share p { display:inline; float:left; text-align:center; font-weight:bold; font-size:15px; padding-bottom:2px; position:absolute ;line-height:30px; } .social-share p.num-view { width:185px; margin:5px 0 0; padding:5px 0; color:#999; font-size:40px; font-weight:bold; color:#cccccc;} .social-share p.num-view em { font-style:normal; font-size:13px; font-weight:normal; color:#666; position:relative; top:0px ; right:0px; margin-left:6px;}