* { margin: 0; padding: 0; } body { *font: x-small; *font-size: small; font: 13px "Trebuchet MS", "ＭＳ Ｐゴシック", Helvetica, Garuda, sans-serif; } a { color: #330000; text-decoration: none; } a:hover { color: #C2A334 } a.underline { text-decoration: underline } a.framed img { background: #FFF; border: 1px solid #EEEECC; padding: 1px; } a.framed:hover img { border: 1px solid #705B35 } img.framed { border: 1px solid #EEEECC; padding: 1px; } em { color: #570026; font-style: normal; } table { border-collapse: collapse } th, td { vertical-align: top } img { border: none; } .clear { clear: both } .left { float: left } .right { float: right } div#overDiv { position: absolute; visibility: hidden; z-index: 1000; } /* -------------------- repeat --------------------- */ .shadow { -moz-box-shadow: #ccc 0px 1px 5px; -webkit-box-shadow: #ccc 0px 1px 5px; box-shadow: #ccc 0px 1px 5px; } .radius6 { -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -khtml-border-radius: 6px; border-radius: 6px; } .radius10 { -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; } hr{clear:both;} div.title_of_page h1 { /*border-bottom: 3px solid #B7ADA4; font-size: 18px; color: #CA0C38; font-weight: bold; padding: 3px 0px; text-shadow: #DEDEDE 1px 1px 0px;*/ color: #333; font-size: 24px; margin-bottom: 10px; } div.title_of_page_pro h1{ border-bottom: 3px solid #B7ADA4; font-size: 17px; color: #CA0C38; font-weight: bold; padding:0 0 3px; text-shadow: #DEDEDE 1px 1px 0px;} div.title_of_page h1#main{ border-bottom: 3px solid #B7ADA4; font-size: 17px; color: #CA0C38; font-weight: bold; padding:0 0 3px; text-shadow: #DEDEDE 1px 1px 0px;} /* h1{ border-bottom: 3px solid #B7ADA4; font-size: 17px; color: #CA0C38; font-weight: bold; padding:0 0 3px; text-shadow: #DEDEDE 1px 1px 0px;} h1{color:#990000;} */ div#global_wrapper { width: 100%; z-index: 1; background-color: #E6E6E6; } div#masthead_wrapper { background-color: #B7ADA4; height: 43px; width: 100%; z-index: 15; background: url(/resources/images/background/top_bg.png) repeat-x; box-shadow: 0px 1px 4px #aaa; -moz-box-shadow: 0px 1px 4px #aaa; -webkit-box-shadow: 0px 1px 4px #aaa; } div#masthead { height: 35px; margin: 0px auto; position: relative; width: 960px; z-index: 15; zoom:1; } div#masthead:after { clear:both; content:"."; display:block; height:0; visibility:hidden; } /* -------------------- user count --------------------- */ #user_count { float: left; width: 500px; } #user_count p { color: #333; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; line-height: 35px; } #user_count p span.cnt_1 { font-size: 12px; text-shadow: #dedede 1px 1px 0px; } #user_count p span.cnt_2 { color: #ca0c38; font-weight: bold; text-shadow: #dedede 1px 1px 0px; } /* -------------------- Skype alert --------------------- */ div.skype_alert { border:1px solid #ccc; font-family: 'lucida grande',tahoma,verdana,arial,'Hiragino Kaku Gothic Pro',Meiryo,'MS PGothic',sans-serif; padding:1px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; width:708px; margin: 0 0 10px 0; } div.skype_alert h2 { background: url(../images/4rd/BG/Skype_logo.png) right top no-repeat; font-size: 20px; -moz-border-radius:3px 3px 0px 0px; -webkit-border-radius:3px 3px 0px 0px; border-radius:3px 3px 0px 0px; width:698px; margin: 0 auto; text-shadow: #F9F8F5 -1px 1px 1px; color: #5A4A42; background-color: #eae7e0; padding:5px; line-height: 1.2; } div.skype_alert p { margin: 3px 0px 3px 5px; font-size:15px; color: #5A4A42; } div.skype_alert p.ifp { font-size:12px; color:#ca0c38; clear: left; } div.confBtn { margin: 10px 0px 10px 110px; text-align:center; height:40px; } div.confBtn a.skype_alert_btn { display: block; width: 150px; height: 30px; font-family: 'lucida grande',tahoma,verdana,arial,'Hiragino Kaku Gothic Pro',Meiryo,'MS PGothic',sans-serif; font-size: 14px; text-align: center; line-height: 34px; text-decoration: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px; -khtml-border-radius: 50px; border-radius: 50px; font-weight: bold; float:left; margin: 0 10px 0 0; } /* tangerine */ a.tangerine { background: #F48E10; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E7A50F', endColorstr='#EC6D0B'); background: -webkit-gradient(linear, left top, left bottom, from(#E7A50F), to(#EC6D0B)); background: -moz-linear-gradient(top, #E7A50F, #EC6D0B); color: #904108; text-shadow: 0px 1px 0px #E9C14D; -webkit-box-shadow: inset 0px 1px 0 #CB5D0B; -moz-box-shadow: inset 0px 1px 0 #CB5D0B; -o-box-shadow: inset 0px 1px 0 #CB5D0B; -khtml-box-shadow: inset 0px 1px 0 #CB5D0B; box-shadow: inset 0px 1px 0 #CB5D0B; } a.tangerine:hover { background: #871A4D; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F4AA11', endColorstr='#EC6D0B'); background: -webkit-gradient(linear, left top, left bottom, from(#F4AA11), to(#EC6D0B)); background: -moz-linear-gradient(top, #F4AA11, #EC6D0B); color: #904108; } a.tangerine:active { color: #904108; background: #F48910; -webkit-box-shadow: inset 0px 2px 3px #432304, inset 0px 1px 0 #CB5D0B; -moz-box-shadow: inset 0px 2px 3px #432304, inset 0px 1px 0 #CB5D0B; -o-box-shadow: inset 0px 2px 3px #432304, inset 0px 1px 0 #CB5D0B; -khtml-box-shadow: inset 0px 2px 3px #432304, inset 0px 1px 0 #CB5D0B; box-shadow: inset 0px 2px 3px #432304, inset 0px 1px 0 #CB5D0B; } /* Ocean */ a.ocean { background: #4AD4EE; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4AD4EE', endColorstr='#278FAC'); background: -webkit-gradient(linear, left top, left bottom, from(#4AD4EE), to(#278FAC)); background: -moz-linear-gradient(top, #4AD4EE, #278FAC); color: #125267; text-shadow: 0px 1px 0px #60ACC1; -webkit-box-shadow: inset 0px 1px 0 #197A9D; -moz-box-shadow: inset 0px 1px 0 #197A9D; -o-box-shadow: inset 0px 1px 0 #197A9D; -khtml-box-shadow: inset 0px 1px 0 #197A9D; box-shadow: inset 0px 1px 0 #197A9D; } a.ocean:hover { color: #125267; background: #3BB7D2; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5ADDF5', endColorstr='#218DB0'); background: -webkit-gradient(linear, left top, left bottom, from(#5ADDF5), to(#218DB0)); background: -moz-linear-gradient(top, #5ADDF5, #218DB0); } a.ocean:active { color: #125267; background: #33A4BC; -webkit-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; -moz-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; -o-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; -khtml-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; } /* Light */ a.light { background: #F5F5F5; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#ECECEC'); background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#ECECEC)); background: -moz-linear-gradient(top, #FFFFFF, #ECECEC); color: #858585; text-shadow: 0px 1px 0px #fff; -webkit-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; border: 1px solid #ccc; } a.light:hover { background: #fff; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#F7F7F7'); background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#F7F7F7)); background: -moz-linear-gradient(top, #FFFFFF, #F7F7F7); color: #717171; } a.light:active { background: #eee; color: #717171; -webkit-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; } /* -------------------- Suggest --------------------- */ div.sugg { position:absolute; top:0; right: 50px; background: url(../images/4rd/BG/BG_topareaBtn.png) right top no-repeat; width:103px; height:37px; } div.sugg:hover { background: url(../images/4rd/BG/BG_topareaBtn.png) right bottom no-repeat; cursor: pointer; } div.sugg p a { color: #fff; text-shadow: #5c5651 1px 1px 0px; display: block; height: 37px; line-height: 36px; text-align: center; } div.sugg a:hover { text-decoration: none } /* -------------------- Login Button --------------------- */ #login_btn { background: url(../images/4rd/BG/BG_login.png) left top no-repeat; float: right; height: 37px; margin: 0px 60px 0 0; text-align: center; width: 100px; } #login_btnIn { background: url(../images/4rd/BG/BG_login.png) left top no-repeat; float: right; height: 37px; margin: 0px 60px 0 0; text-align: center; width: 100px; } #login_btnOut { background: url(../images/4rd/BG/BG_login.png) left top no-repeat; float: right; height: 37px; margin: 0px 153px 0px 0px; text-align: center; width: 100px; } #login_btnIn:hover, #login_btnOut:hover, #login_btn:hover { background: url(../images/4rd/BG/BG_login.png) left bottom no-repeat; cursor: pointer; } #login_btnIn p a, #login_btnOut p a, #login_btn p a { color: #fff; text-shadow: #5c5651 1px 1px 0px; display: block; height: 37px; line-height: 37px; } #login_btnIn p a:hover, #login_btnOut p a:hover { text-decoration: none } /* -------------------- language --------------------- */ #switch_language { background: url(../images/4rd/BG/BG_topareaBtn.png) left top no-repeat; float: right; height: 37px; text-align: center; width: 120px; z-index: 500; } #switch_language:hover { background: url(../images/4rd/BG/BG_topareaBtn.png) left bottom no-repeat; cursor: pointer; height: 37px; } * html #switch_language { overflow: hidden; } /* -------------------- navigation / dropdown--------------------- */ .menu ul li { height: 35px; position: relative; text-align: center; width: 120px; z-index: 500; } .menu ul li a { display: block; height: 35px; line-height: 35px; text-decoration: none; } .menu ul li table { border: none; border-collapse: collapse; font-size: 12px; left: 0; padding: 0; position: absolute; top: 0; } .menu ul li ul { height: 0; overflow: hidden; position: absolute; visibility: hidden; width: 120px; } .menu ul li ul li.up { background-color: #E2DDD4; border: 1px solid #ccc; left: -1px; position: relative; z-index: 500; } .menu ul li ul li.up:hover { background-color: #c7c3bd; cursor: pointer; } .menu ul li ul li { height: 35px; margin-bottom: 0; width: 120px; } .menu ul li a:hover { position: relative } .menu ul li:hover ul, .menu ul li a:hover ul { height: auto; overflow: visible; visibility: visible; z-index: 500; } *+html .menu ul li ul { height: 0; left: 0px; overflow: hidden; position: absolute; visibility: hidden; width: 120px; } #main_upgrade { /*background-color:#fff;*/ margin: 0px auto; padding: 0 0 40px 0; position: relative; width: 980px; z-index: 1; zoom: 1; } #main_upgrade:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } /*----------------------------------------------new-----------------*/ header { width: 100%; height: 74px; position: relative; background-color: white; border-top: 2px solid #443322; border-bottom: 1px solid #DDD; box-shadow: 0px 0px 5px rgba(0, 0, 0, .3); } .header_wrap { width: 980px; padding: 0 20px 0; margin: 0 auto; } header div#logo { position: absolute; top: 16px; } header div#logo a img { border: none; } header div#logo a:hover img { opacity: 0.8; filter: alpha(opacity=80); } header nav.left { float: left; margin-left: 165px; } header nav.left a.toolbar_item { display: inline-block; border-left: 1px solid #CCBDAA; padding: 34px 0 0 10px; margin-right: 10px; color: #5C3433; text-decoration: none; font-weight: bold; font-size: 15px; } header nav.left a:hover { color: #966D44; } header nav.left a:active { color: #6B4926; } header nav.left .search_list_wrap { position: absolute; z-index: 2; margin: 0 auto; padding-top: 10px; } header nav.left .search_list { padding: 6px 0 5px 0; text-align: left; background-color: #fff; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; font-size: 14px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.35); border: 1px solid #826C55\9; /*IE8*/ z-index: 2; } header nav.left .search_list li { } header nav.left .search_list li a { color: #E0564B; display: block; padding: 5px 15px 5px 15px; } header nav.left .search_list li a:hover { color: #FFF; background-color: #826C55; } header nav.right { font-size: 15px; right: 0; } header nav.right a#inquiry, header nav.right a#login { padding: 6px 10px; margin: 25px 0px 0px 10px; font-weight: bold; width: 80px; text-align: center; } header nav.right a#inquiry:active, header nav.right a#login:active { width: 82px; } header nav.right a#inquiry img { vertical-align: text-bottom; width: 17px; height: 17px; padding-bottom: 2px; } header nav.right a.toolbar_item { display: inline-block; border-right: 1px solid #CCBDAA; padding: 34px 10px 0 20px; color: #E0564B; text-decoration: none; font-weight: bold; } header nav.right a.toolbar_item:hover { color: #F87F6E; } header nav.right a img { vertical-align: text-bottom; width: 17px; height: 17px; padding-bottom: 2px; } header nav.right a#logout { padding: 6px 10px; margin: 25px 0px 0px 10px; width: 93px; text-align: center; } header nav.right a#logout:active { width: 95px; } header nav.right .language_select_list_wrap { position: absolute; z-index: 2; width: 125px; padding-top: 10px; } header nav.right .language_select_list { padding: 6px 0 5px 0; text-align: left; background-color: #fff; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; font-size: 14px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.35); border: 1px solid #826C55\9; /*IE8*/ z-index: 2; } header nav.right .language_select_list li img { width: 16px; height: 11px; margin-right: 5px; vertical-align: middle; } header nav.right .language_select_list li a { display: block; color: #5C3433; padding: 5px 10px 5px 15px; } header nav.right .language_select_list li a:hover { color: #FFF; background-color: #826C55; } /*------------------new end-------------------*/ /* -------------------- navigation top --------------------- */ div#main_left { float: left; /*width: 210px;*/ width: 230px; } div#main_content { background-color:#fff; float: right; /*width: 720px;*/ z-index:1; width: 698px; border: 1px solid #CCC; padding: 20px 15px; margin-top: 5px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } div#main_content div.inner { z-index:1;} div#main_content div.middle, div#yield { width: 100%; zoom: 1; z-index:1; } div#main_content div.middle:after, div#yield:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } div#main_content div.middle { /*margin: 0 0 30px;*/ } div#main_content div.bottom { border-top: 2px solid #B7ADA4; height: 60px; margin-top: 10px; } div#main_content div.bottom a { background-color: #B7ADA4; color: white; float: right; font-size: 12px; font-weight: bold; margin: 0 20px 0 0; padding: 8px; } div#main_content div.middle_blue { width: 720px } div#main_content div.bottom_blue { height: 30px; width: 720px; } div#main_content div.bottom_blue a { color: #FFF; font-size: 12px; font-weight: bold; padding: 10px 10px 0px 0px; } div.title_of_page { /*margin: 10px 0 10px 0;*/ width: 720px; } div.title_of_page_pro { height: 30px; margin: 5px 0 0 0; width: 720px; } /* -------------------- register / button --------------------- */ #register { /* -moz-box-shadow: rgba(0,0,0, 0.3) 0px 0px 5px; -webkit-box-shadow: rgba(0,0,0, 0.3) 0px 0px 5px; box-shadow: rgba(0,0,0, 0.3) 0px 0px 5px; */ background-color: #91837D; height: 43px; width: 208px; border:1px solid #6b605c; border-bottom:1px solid #4a4442; margin: 3px 0px 10px; } #register div.bord { border-top:1px solid #a59b97; border-bottom:1px solid #837671; width: 100%; height: 41px; } #register:hover { background-color: #6f645f; cursor: pointer; } #register p.ja { color: #fff; font-size: 140%; line-height: 1.8; position: relative; text-align: center; text-shadow: #666 0px 1px 0px; top: 6px; } #register p.en { color: #fff; font-family: tahoma, 'Myriad Pro', sans-serif; font-size: 170%; line-height: 1.3; position: relative; text-align: center; text-shadow: #666 0px 1px 0px; top: 6px; } #register p span { /* border-bottom: 1px solid #958E86; */ border-top: none; display: block; padding: 0 10px; } #register a:hover { text-decoration: none } .button { -moz-border-radius: 2px; -moz-box-shadow: 0 1px 1px #e3e2cc; -webkit-border-radius: 2px; -webkit-box-shadow: 0 1px 1px #e3e2cc; border: 1px solid #ccc; border-radius: 2px; border-top: 1px solid #ccc; box-shadow: 0 1px 1px #e3e2cc; } div#main_left_inner { font-size: 18px; width: 230px; /*position: absolute;*/ text-align: center; /*padding-top: 15px;*/ color: #4D4D4D; } div#login_info { float: right; position: relative; top: 14px; width: 720px; z-index: 10; } div#login_info_pro { height: 24px; margin: 0px auto; width: 940px; padding-top:1px; } div#login_info p { color: #666; text-align: right; } div#login_info_pro p { color: #666; text-align: right; } div#login_info img { vertical-align: middle } div#login_info a { text-decoration: underline } div.newTopics { margin: 0 0 20px; background-color: white; } div.newTopics li { background: url(../images/4rd/bullet_cup_14x12.png) 7px 11px no-repeat; border-bottom: 1px solid #dedede; border-top: 1px solid #FFF7EA; font-size: 12px; line-height: 1.3; padding: 10px 9px; text-indent: 17px; } div.newTopics li span { color: #666; font-size: 11px; } div.newTopics h2 { -moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; background-color: #EAE7E0; border-radius: 2px 2px 0 0; font-size: 14px; padding: 15px 0px 10px; text-align: center; text-shadow: #fff 1px 1px 0px; } div.newTopics h2 span { color: #666; display: block; font-size: 80%; } .rBox2px { border: solid 1px #ccc; } div.btnLine { background-color: #EAE7E0; height: 30px; margin: 0px; padding: 5px 3px; width: 202px; } div.btnLine p a { -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #efefef; background: -webkit-gradient(linear, left top, left 25, from(#dadada), color-stop(6%, #efefef), to(#dadada)); background: -moz-linear-gradient(top, #dadada, #efefef 2px, #dadada 25px); border: 1px solid #999; border-radius: 5px; box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; color: #336699; display: block; font-size: 12px; height: 18px; margin: 0px auto; padding: 5px 10px 3px; text-align: center; text-shadow: #fff 1px 1px 0px; width: 60px; } p.btnLine a { -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #efefef; background: -webkit-gradient(linear, left top, left 25, from(#dadada), color-stop(6%, #efefef), to(#dadada)); background: -moz-linear-gradient(top, #dadada, #efefef 2px, #dadada 25px); border: 1px solid #999; border-radius: 5px; box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; color: #336699; font-size: 12px; height: 18px; margin: 0px auto; padding: 7px 10px 0px; text-align: center; text-shadow: #fff 1px 1px 0px; width: 60px; } p.btnLine a { left: 380px; position: absolute; top: 10px; } p.btnLine a:hover, p.btnLine a:focus { background: -webkit-gradient(linear, left top, left 25, from(#fff), color-stop(6%, #eee), to(#fff)); background: -moz-linear-gradient(top, #fff, #eee 2px, #fff 25px); cursor: pointer; text-decoration: none; } div.btnLine p a:hover, div.btnLine p a:focus { background: -webkit-gradient(linear, left top, left 25, from(#fff), color-stop(6%, #eee), to(#fff)); background: -moz-linear-gradient(top, #fff, #eee 2px, #fff 25px); cursor: pointer; text-decoration: none; } p.mypage { left: -2px; position: absolute; top: 180px; } /* -------------------- onlineTutors --------------------- */ div.onlinbox { background: #E0E0E0; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E9E9E9', endColorstr='#D7D7D7'); background: -webkit-gradient(linear, left top, left bottom, from(#E9E9E9), to(#D7D7D7)); background: -moz-linear-gradient(top, #E9E9E9, #D7D7D7); -webkit-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -moz-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -o-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -khtml-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; float: left; height: 54px; margin: 0px 5px 20px 0px; padding: 2px; width: 132px; } div.onlinbox div.online_pro_pic{ } div.onlinbox div.online_pro_pic:hover{ } div.onlinbox li.fern div.online_pro_pic:hover{ border:none } li.onlinbox p.guide{ font-size:12px; padding: 3px 0; font-weight:normal; font-family: 'lucida grande',tahoma,verdana,arial,'Hiragino Kaku Gothic Pro',Meiryo,'MS PGothic',sans-serif; color: #300; } li.onlinbox p.guide span{ float: right; text-decoration:underline; font-size:11px; font-weight:normal; font-family: 'lucida grande',tahoma,verdana,arial,'Hiragino Kaku Gothic Pro',Meiryo,'MS PGothic',sans-serif; } div.onlinbox div.online_pro_pic img.tutor{ float: left; width:50px; height:50px; background-color: #fff; -khtml-border-top-left-radius: 6px; -khtml-border-bottom-left-radius: 6px; -o-border-top-left-radius: 6px; -o-border-bottom-left-radius: 6px; -webkit-border-top-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; -moz-border-radius-topleft: 6px; -moz-border-radius-bottomleft: 6px; border-top-left-radius: 6px; border-bottom-left-radius: 6px; border: 2px solid #fff; box-shadow: 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; } div.onlinbox div.online_pro_pic img.tutor:hover{ border:2px solid #9e998f; } div.onlinbox ul.box { float: right; } div.onlinbox ul.box li { list-style: none; margin: 0; } div.onlinbox ul.box li.fern a { } div.onlinbox ul.box li a { display: block; width: 76px; height: 26px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 9px; line-height: 26px; text-decoration: none; -webkit-border-radius: 0px; -o-border-radius: 0px; -moz-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px; font-weight: bold; overflow: hidden; } div.onlinbox ul.box li:first-child a { -khtml-border-top-right-radius: 6px; -o-border-top-right-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-radius-topright: 6px; border-top-right-radius: 6px; } div.onlinbox ul.box li:last-child a { -khtml-border-bottom-right-radius: 6px; -o-border-bottom-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; -moz-border-radius-bottomright: 6px; border-bottom-right-radius: 6px; border: none; } /*---COLOR SCHEMES---*/ /* Light */ div.onlinbox li.light a { background: #F5F5F5; text-align: center; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EAE7E0', endColorstr='#9e9a94'); background: -webkit-gradient(linear, left top, left bottom, from(#EAE7E0), to(#9e9a94)); background: -moz-linear-gradient(top, #EAE7E0, #9e9a94); color: #333; text-shadow: 0px 1px 0px #fff; -webkit-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; } div.onlinbox li.light a:hover { background: #fff; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#F7F7F7'); background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#F7F7F7)); background: -moz-linear-gradient(top, #FFFFFF, #F7F7F7); color: #717171; } div.onlinbox li.light a:active { background: #eee; color: #717171; -webkit-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; } div.onlinbox li.light a { border-bottom: 1px solid #D9D9D9; } /* Ocean */ div.onlinbox li.fern a { background: #4AD4EE; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4AD4EE', endColorstr='#278FAC'); background: -webkit-gradient(linear, left top, left bottom, from(#4AD4EE), to(#278FAC)); background: -moz-linear-gradient(top, #4AD4EE, #278FAC); color: #fff; text-shadow: 0px 1px 0px #60ACC1; -webkit-box-shadow: inset 0px 1px 0 #197A9D; -moz-box-shadow: inset 0px 1px 0 #197A9D; -o-box-shadow: inset 0px 1px 0 #197A9D; -khtml-box-shadow: inset 0px 1px 0 #197A9D; box-shadow: inset 0px 1px 0 #197A9D; text-indent: 7px; } div.onlinbox li.fern span.icon { position: relative; top:-22px; left:50px; } div.onlinbox li.fern a:hover { color: #fff; background: #3BB7D2; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5ADDF5', endColorstr='#50c1e6'); background: -webkit-gradient(linear, left top, left bottom, from(#5ADDF5), to(#50c1e6)); background: -moz-linear-gradient(top, #5ADDF5, #50c1e6); } div.onlinbox li.fern a:active { color: #125267; background: #33A4BC; -webkit-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; -moz-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; -o-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; -khtml-box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; box-shadow: inset 0px 2px 3px #333E4E, inset 0px 1px 0 #93E6F6; } /* end renewal change css */ /* banner */ div.fblink { margin: 0; position: relative; top:-3px; left:0; } div.fbBox { border: 1px solid #3B5998; height: 24px; margin: 5px 0px 0px; padding: 3px; width: 212px; } /* For modern browsers */ div.fbBox:before, div.fbBox:after { content:""; display:table; } div.fbBox:after { clear:both; } /* For IE 6/7 (trigger hasLayout) */ div.fbBox { zoom:1; } div#topmenu { position: absolute; top: 0px; left: 220px; width: 700px; color: #C7B07B; font-size: 14px; font-weight: bold; text-align: left; } div#topmenu div.inner { padding: 5px; } div#topmenu div.inner img { vertical-align: middle; } div#topmenu a { color: #705B35; } /* Old main */ div#main_t { float: left; width: 1000px; height: 20px; background: url("/images/css/bkg_main_t.gif") top no-repeat; } div#main_b { float: left; width: 1000px; height: 40px; background: url("/images/css/bkg_main_b.gif") top no-repeat; } div#main { float: left; width: 1000px; background: url("/images/css/bkg_main.gif") repeat-y; position: relative; } div.banner_app{ margin:5px 0 0 0; border: 1px solid #ccc; width:220px; height:35px; } div.banner_special{ margin:5px 0 0 0; border: 1px solid #ccc; width:220px; height:55px; } /* ---------------------------------------------------- * Third Design * ---------------------------------------------------- */ /* new main */ div.title_of_page_blue div{ position: absolute; width: 680px; min-height: 70px; left: 210px; background: url("/images/pagetitle_blue.gif") no-repeat; } div.title_of_page_blue h1 { padding: 26px 0px 10px 80px; color: #330000; font-size: 16px; text-shadow:#ffffff 1px 1px 0px; } div#top_menu { position: absolute; top: 8px; left: 220px; width: 760px; color: #C7B07B; font-size: 14px; font-weight: bold; text-align: left; } div#top_menu div.inner { padding: 0px; } div#top_menu div.inner img { vertical-align: middle; } div#top_menu a { color: #705B35; } div#top_menu img { padding:2px 5px 2px 3px; } div#top_menu img:hover { border-radius:14px; -moz-border-radius:14px; -webkit-border-radius:14px; box-shadow: 0px 0px 6px #686658; -moz-box-shadow: 0px 0px 4px #686658; /*#dcd7bc; */ -webkit-box-shadow: 0px 0px 6px #686658; } /* --- End of Third Design ----------------------------- */ div#main div#full { float: left; padding: 20px 40px;} div#main_l { float: left; width: 220px; } div#main_l_inner { padding: 20px 0px 20px 30px; } div#main_banner { z-index: 20; width: 970px; height: 240px; position: absolute; top: 30px; left: 5px; } div.navigation { width: 680px; padding: 0 0 10px 0; } div.navigation a { color: #0077E6; text-decoration: underline; } div#content { float: right; width: 740px; margin-right: 30px;} div#content div.inner { float: left; padding: 0px; } div#content div.top { width: 740px; height: 70px; float: left; background: url("/images/bkg_content_top.gif") top left no-repeat; } div#content div.middle { width: 740px; float: left; background: url(/images/bkg_content_mid.gif) top left repeat-y; min-height: 300px; } div#content div.bottom { width: 740px; float: left; height: 30px; background: #FFF url("/images/bkg_content_bot.gif") bottom left no-repeat; } div#content div.bottom a {float: right; font-weight: bold; font-size: 12px; color: #FFF; padding: 10px 10px 0px 0px;} div#content div.top_blue { width: 740px; height: 70px; float: left; background: url("/images/bkg_content_top_blue.gif") top left no-repeat; } div#content div.middle_blue { width: 740px; float: left; background: url("/images/bkg_content_mid_blue.gif") top left repeat-y; min-height: 300px; } div#content div.bottom_blue { width: 740px; float: left; height: 30px; background: #FFF url("/images/bkg_content_bot_blue.gif") bottom left no-repeat; } div#content div.bottom_blue a {float: right; font-weight: bold; font-size: 12px; color: #FFF; padding: 10px 10px 0px 0px;} /* div#yield { padding: 0px 0px 20px 30px; float: left; width: 100%; } */ div#main_cnt { padding-left:660px; margin-top:10px; } div#main_cnt .cnt_1 { color:#333333; font-size:14px; font-weight:bold; } div#main_cnt .cnt_2 { color:#993300; font-size:14px; font-weight:bold; } div#main_cnt .cnt_3 { color:#333333; font-size:12px; } div.page_title { position: absolute; top: 0px; height: 70px; width: 680px; left: 210px; } div.page_title div{ width: 680px; min-height: 70px; left: 210px; background: url("/images/pagetitle.gif") no-repeat; } div.page_title h1 { padding: 27px 0px 10px 80px; color: #330000; font-size: 16px; } div.page_title_blue div{ width: 680px; min-height: 70px; left: 210px; background: url("/images/pagetitle_blue.gif") no-repeat; } div.page_title_blue h1 { padding: 27px 0px 10px 80px; color: #330000; font-size: 16px; } div.no_background { background: none; } div.sub_title { font-size: 14px; font-weight: bold; clear: both; margin: 25px 0px 15px 0; width: 680px; } div.sub_title img { margin-right: 10px; vertical-align: middle;} div.loader { padding: 10px; float:left; } /* FLASH */ div.flash { width: 680px; padding: 15px; /*float: left;*/ } div.flash p { padding-left: 80px; line-height: 20px; } div.flash p.notice { color: green; background: url(/images/icons/traffic/traffic_light_green.gif) no-repeat; } div.flash p.warning { color: #FFA500; background: url(/images/icons/traffic/traffic_light_yellow.gif) no-repeat; } div.flash p.error { color: #8B0000; background: url(/images/icons/traffic/traffic_light_red.gif) no-repeat; } div.flash p a { text-decoration: underline; } /* SERVICE & REQUESTS */ div.calendar_row { float: left; width: 100%; } div.calendar_row2 { float: left; } div.calendar_row div.date_holder { float: left; width: 200px; } div.calendar_row div.calendar { float: left; width: 50px; padding: 0px; } div.calendar_row2 div.date_holder { float: left; width: 200px; } div.calendar_row2 div.calendar { float: left; width: 50px; padding: 0px; } div.spost {margin:-10px 0 0 0; } div.second { width:250px; } /* PROFILE */ div.prof { padding: 0px; width: 720px;} /* div.prof .col_b { width: 340px; line-height: 20px; padding: 0px 15px; float: right; } div.prof .col_b table { width:340px; } */ div.prof .prof_top { width: 100%; float: left; line-height: 25px;} div.prof .prof_top a:hover { text-decoration: underline; } div.prof .specs { width: 100%; float: left; font-size: 11px; } div.prof .specs td, div.prof .specs th { padding: 2px 0px; border: none; font-weight: inherit; text-align: inherit; } div.prof .specs a { color: #0077E6; } div.prof .specs a:hover { text-decoration: underline; } div.prof div.left { width:320px; padding:0 10px; overflow: hidden; } div.prof div.right { width:340px; line-height: 19px;} div.prof table { width:100%; } div.prof div.right th, div.prof div.right td { border:1px solid #D6D4AA; padding:10px; text-align:left; } div.prof div.right th { width:100px; background-color:#FBF7D7; font-weight:normal; } div.prof div.left th, div.prof div.left td { padding: 1px 5px; } div.prof .images_link { width: 95px; text-align: center; line-height:15px; } div.prof .images_link a { text-decoration:underline; font-size:11px; } div.voice { padding: 10px 0 0; } div.outline_prof { width: 718px; border: 1px solid #ccc; margin: 0 0 40px ; } div.outline_prof table { border: 1px solid #fff; } div.outline_prof p.info { text-indent: 140px; } div.outline_prof span.imgfile { padding: 5px; border-color: #ccc; display: block; } div.outline_prof ul.prof { float: left; margin: 0px 0px 5px; width: 550px; } div.outline_prof ul.prof li span { display: -moz-inline-box; display: inline-block; /display: inline; /zoom: 1; width:130px; font-weight: normal; } div.outline_prof ul.prof li strong { font-family:'Courier New',Courier,monospace; font-size:15px; font-weight: normal; } div.outline_prof ul.prof li { border-bottom: 1px solid #EAE7E0; padding: 10px; } div.outline_prof th { background-color: #EAE7E0; border-bottom: 1px solid #fff; border-top: 1px solid #fff; padding: 10px; width: 120px; text-align: left; font-weight: normal; } div.outline_prof td { border-bottom: 1px solid #EAE7E0; border-top: 0; padding: 10px; } div.outline_prof td span.option { padding: 0 10px; } div.outline_prof td.list th { background: none; border-bottom: 1px solid #fff; border-top: 1px solid #fff; padding: 10px; width: 100px; text-align: left; font-weight: normal; } div.outline_prof tr#private_setting th { background: none; border-bottom: 1px solid #fff; border-top: 1px solid #fff; padding: 10px; width: 220px; text-align: left; font-weight: normal; } div.outline_prof tr#private_setting table.option { width:100%; } div.outline_prof tr#private_setting table.option th { background-color: #EAE7E0; border-bottom: 1px solid #fff; border-top: 1px solid #fff; padding: 10px; width: 120px; text-align: left; font-weight: normal; } div.outline_prof tr#private_setting table.option td { border-bottom: 1px solid #EAE7E0; border-top: 0; padding: 10px; } /* TABS */ div.tabs { } div.tabs div.tab { } /* PROFILE HORIZONTAL */ div.ov_rec { background: url('/images/overlay_recommended.gif') no-repeat; width: 60px; height: 60px; position: absolute; top: -5px; left: -20px; } div.ov_new { background: url('/images/overlay_new.gif') no-repeat; width: 45px; height: 45px; position: absolute; top: 6px; left: 1px; } /* New seals */ div.medal { width: 35px; height: 69px; position: absolute; top: 3px; left: -15px; z-index:1007;} div.overlay_highly_recommended { background: url('/images/seal_highly_recommended.png') no-repeat; } div.overlay_premium { background: url('/images/seal_premium.png') no-repeat; width: 35px; height: 59px; position: absolute; top: -2px; left: -15px; z-index:10; } div.overlay_top_ranking { background: url('/images/seal_top_ranking.png') no-repeat; } /* div.overlay_highly_recommended { background: url('/images/seal_highly_recommended.png') no-repeat; width: 35px; height: 59px; position: absolute; top: -3px; left: -15px; } div.overlay_premium { background: url('/images/seal_premium.png') no-repeat; width: 35px; height: 59px; position: absolute; top: -3px; left: -15px; } div.overlay_top_ranking { background: url('/images/seal_top_ranking.png') no-repeat; width: 35px; height: 59px; position: absolute; top: -3px; left: -15px; } */ div.overlay_new { background: url('/images/seal_new.png') no-repeat; width: 45px; height: 45px; position: absolute; top: 6px; left: 1px; } div.available_time { font-family: Courier New,sans-serif; font-size: 11px; color: #000; } div.profiles div.line { border-bottom: 1px dashed #DEDEA4; } div.profiles div.links div { float: right; } div.profiles div.links div.regist { margin-top:6px; margin-left:10px; } div.profiles div.links div.trial { background: url('/images/overlay_trial.gif') no-repeat; height:30px; width:80px; text-align:center; padding-top:6px;} /*div.profiles { margin-bottom: 20px; float: left;}*/ div.profiles div.item { position: relative; line-height: 18px; border-bottom: 1px solid #efefef; min-height:122px; } div.profiles div.item:hover { background-color:#fffbf0; } div.profiles div.item_inner { padding: 8px 0px 7px 0; } div.item h3 a { font-size: 18px; } div.item h3 a:hover { color:#3196e1; text-decoration:underline; } div.profiles div.item div.links { position: absolute; top: -10px; right: 0px; padding: 5px;} div.profiles div.item div.links_media { position: absolute; top: 2px; right: 0px; padding: 5px;width: 120px;} div.profiles div.item div.crud { position: absolute; top: 0px; right: 0px; padding: 5px;} div.profiles div.narrow { width: 340px; min-height:75px; } div.profiles div.item div.segment { padding-right: 10px; float: left;} div.profiles div.item div.segment h3.title { word-wrap: break-word; width:400px; margin-bottom:15px; } div.profiles div.item div.segment div.title { word-wrap: break-word; width:400px; height:20px; font-size: 14px; color:#000000; font-weight:bold; } div.profiles div.item div.small { width: 110px; } div.profiles div.item div.smaller { width: 135px; } div.profiles div.item div.medium { width: 400px; } div.profiles div.item div.large { width: 530px;} div.profiles div.item div.full { width: 680px;} div.profiles div.item div.specs { font-size: 10px; color: #797979; } div.profiles div.item div.catch { font-weight: bold; font-size: 12px; } div.profiles div.item div.description { font-size: 12px; padding: 3px 0px 5px 0px; } div.profiles div.item div.name { padding-top: 5px; font-weight: bold; } div.profiles span.small {font-size:10px;} a.reserve { text-align: center; display: block; width: 110px; height: 24px; line-height: 24px; font-size: 11px; color: #FFF; background: url('/images/icons/reserve.gif') no-repeat top; } a.reserve:hover { background: url('/images/icons/reserve.gif') no-repeat bottom; } div.service_item h3 {line-height: 20px; } div.profiles div.o { /* background: #F5F5E2; */ background: #DEDEA4; } div.profiles div.e { } div.profiles div.links a { display: block; padding: 1px 3px; font-size: 10px; color: #FFF;} div.profiles div a.framed_round { display: block; padding: 0; color: #FFF; width:100px; height:100px; border:2px solid #cecece; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; } div.profiles div a.framed_round:hover { border:2px solid #3196e1; } div.profiles div a.framed_round img { padding: 0px; border:0; } /* NO USE ANY MORE */ div.profiles div.a div.links a { background: #E67399; /* dark pink */ } div.profiles div.b div.links a { background: #797979; /* charcoal blue */} div.profiles div.c div.links a { background: #BFBF4D; /* moss green */} div.profiles div.d div.links a { background: #F2A640; /* orange */} div.profiles div.a div.links a:hover { background: #DD4274; /* v dark pink */ } div.profiles div.b div.links a:hover { background: #494949; /* v charcoal blue */} div.profiles div.c div.links a:hover { background: #969636; /* v moss green */} div.profiles div.d div.links a:hover { background: #FF6600; /* v orange */} div.profiles div.a a.framed img { padding: 2px; border:2px solid #E67399; } div.profiles div.b a.framed img { padding: 2px; border:2px solid #797979; } div.profiles div.c a.framed img { padding: 2px; border:2px solid #BFBF4D; } div.profiles div.d a.framed img { padding: 2px; border:2px solid #F2A640; } /* PRO PROFILE BOX */ /*div.podcasts div.item .segment { padding: 10px 0 5px; }*/ /*div.podcasts div.item .small { vertical-align: middle;width: 195px; }*/ /*div.podcasts div.item .large { width: 500px; }*/ div.profiles div.item .segment h3.title { word-wrap: break-word; width:400px; } /* PRO PROFILE BOX */ div.profiles dl { float:left; width: 148px; height:200px; margin:3px; padding:7px; border:1px solid #CCCCCC; } div.profiles dt { text-align:center; height:144px; } div.profiles .name { overflow: hidden; } div.profiles dt div.pic { position:relative; margin:0 17px; height:110px; } div.profiles dt div.pic div.ov_new { top: 0; left: 5px; } div.profiles dt div.pic div.ov_rec { top: -18px; left: -34px; } div.profiles dt div.rating { margin:0 27px; } div.profiles dd { line-height: 150%; padding:5px 0 0; overflow: hidden; height:53px; } /* SEVICE PROFILE BOX */ div.services dt { height:124px; } div.services dd { height:73px; } div.pickup dl { background: #FFF8E7; } div.coupon { padding-right: 10px; float: left;} div.coupon div.in { width: 300px; position: relative; border: 1px dashed #969636; padding: 10px; float: left;height: 178px;overflow: hidden; } div.coupon h3 { font-family: Verdana,sans-serif; font-size: 40px; line-height: 50px; } div.coupon div.crud { position: absolute; top: 0px; right: 0px; padding: 5px;} h2.col_title { font-size: 18px; display: block; float: left; position: relative; border-bottom: 2px solid #DEDEA4; padding-bottom: 5px; margin-bottom: 10px;} h2.col_title span { position: absolute; bottom: 0px; right: 0px; padding: 1px;} h2.col_title span.col_title_s { position: relative; padding:0 0 0 10px; font-size:12px;} h2.col_title span a { display: block; text-align: right; width: 80px; font-size: 10px; padding-top: 2px;} h2.col_title img { margin-right: 5px;} div.notifications { float: left; } div.notifications ul { padding-left: 20px; } div.notifications li { line-height: 20px; list-style-image: url(/images/icons/cup.gif); } .today { background-color: #F2F5A9; } /* PROFILE obsolete */ div.profile { line-height: 18px; padding: 0px 15px; } div.profile span.subtext { padding: 7px 0px; font-size: 10px; } div.profile td{ padding: 5px; } div.profile_links { line-height: 23px; } div.profile_links a { text-decoration: none; } /* PROFILE service pickup */ div.pickup { background: #FFF8E7; width:700px; } div.pickup div.sponsored { float:right; font-size:11px; margin:5px 5px 1px 0; width:680px; text-align:right; padding:0 20px 0 0; } /* RATING */ div.rating { height: 20px; width: 100px; background: url(/images/css/rating_gray.gif) left no-repeat; } div.rating span { display: block; height: 20px; background: url(/images/css/rating.gif) left no-repeat; } /* BUTTONS */ /* http://www.sohtanaka.com/web-design/liquid-color-adjustable-css-buttons/
Anchor Text
*/ .btn { float: left; /* clear: both; */ background: url(/images/css/btn_left.png) no-repeat; padding: 0 0 0 10px; margin: 5px 5px; } .btn a{ float: left; height: 40px; background: url(/images/css/btn_stretch.png) repeat-x left top; line-height: 40px; padding: 0 10px; color: #fff; font-size: 1em; text-decoration: none; } .btn span { background: url(/images/css/btn_right.png) no-repeat; float: left; width: 10px; height: 40px; } .btn_register { background-color: #ADCE28; } .btn_edit { background-color: #ADCE28; } .btn_back { background-color: #ADCE28; } .btn_new { background-color: #ADCE28; } .btn_destroy { background-color: #666; } .btn_dangerous { background-color: red; } .btn_learnmore { background-color: orange; } /* All of button arrange by bluesky.sora@gmail.com started at 2010/06/18 ~ */ /* Choice button class by thinking about how can make Simplest code */ /* Normal input button */ .btn_box { text-align:center; } /* 1 */ .btn_box input { height:40px; padding:0 15px; } .btn_default { height:40px; padding:0 15px; } /* 2 */ .btn_form_submit { height:40px; padding:0 15px; } /* 3 */ /* button button which made by div and span tag */ .btn_box_in_div { margin-left:230px; /* two button to middle */ } .btn_box_in_div .btn_href { float: left; background: url(/images/css/btn_left.png) no-repeat; padding: 0 0 0 10px; margin: 5px 5px; background-color:#ADCE28; /* button color deep green */ } .btn_box_in_div .btn_href_grey { float: left; background: url(/images/css/btn_left.png) no-repeat; padding: 0 0 0 10px; margin: 5px 5px; } .btn_box_in_div .btn_href:hover, .btn_box_in_div .btn_href_grey:hover { background-color:#3a62c7; /* button color deep green */ } .btn_box_in_div .btn_href a, .btn_box_in_div .btn_href_grey a { float: left; height: 40px; background: url(/images/css/btn_stretch.png) repeat-x left top; line-height: 40px; padding: 0 10px; color: #fff; font-size: 1em; text-decoration: none; } .btn_box_in_div .btn_href span, .btn_box_in_div .btn_href_grey span { background: url(/images/css/btn_right.png) no-repeat; float: left; width: 10px; height: 40px; } /* Google imageless button CSS */ .goog-inline-block { display:inline-block; position:relative; } .goog-imageless-button { cursor:pointer; background:none repeat scroll 0 0 #E3E3E3; /* button bottom bg color */ border-color:#BBBBBB; /* button top and bottom line color */ border-style:solid; border-width:1px 0; color:#222222; cursor:default; font-family:Arial,sans-serif; line-height:0; list-style:none outside none; margin:2px; outline:medium none; padding:0; text-decoration:none; vertical-align:middle; } .goog-imageless-button:hover { border-color:#666666; /* button top and bottom line color */ } .goog-imageless-button-outer-box { border-color:#BBBBBB; /* button left and right line color */ border-style:solid; border-width:0 1px; left:-1px; margin-right:-2px; } .goog-imageless-button-outer-box:hover { border-color:#666666; /* button top and bottom line color */ } .goog-imageless-button-top-shadow { background:none repeat scroll 0 0 #F9F9F9; /* button top bg color */ border-bottom:3px solid #EEEEEE; /* button center bg color */ line-height:9px; /* pos center bg */ margin-bottom:-12px; /* pos center bg */ } .goog-imageless-button-content { color:#222222; font-size:16px; /* font size: default 16 */ /*font-weight:bold; /* for multibyte string */ padding:1px 8px; line-height:1.5em; padding:0 4px; text-align:center; } .goog-imageless-button-content a { cursor:default; color:#666666; } .goog-imageless-button-content a:hover { color:#333333; } /* Link for AJAX */ .active_link { } .active_link a { font-size:larger; color:#03F; font-family:Arial,sans-serif; text-decoration:underline; } .active_link a:hover { color:#00F; } /* PAGINATOR */ .paginator { width:100%; text-align:center; margin:10px 0; padding:1px 0; color: #999; font-size: 12px; float:left; clear:both; } .paginator a{ color: #333; background:#FFFFDD; border:solid 1px #D7E366; padding:2px 6px; text-decoration: none; } .paginator a:hover{ color:#FFF; background:#D7E366; } .paginator .currentPage{ padding:2px 6px; font-weight:bold; color:#999; } /* Mail */ table.msg_detail h1 { font-size: 18px; width: 90%; border: 2px solid #666; padding: 10px; margin-bottom: 10px; } table.msg_detail h2 { font-size: 14px; } table.msg_detail h3 { font-size: 12px; } table.msg_detail a { color: #0077E6; text-decoration: underline; } /* FOOTER SECTION */ div#t_footer { background: #705B35; width: 100%; float: left; } div#t_footer div.left { float: left; padding: 20px 0px 10px 20px; color: #FFF; } div#t_footer div.left a { color: #FFF; } div#t_footer div.right { float: right; padding: 10px;} div#b_footer { float: left; padding: 5px 0px; color: #666; } div#b_footer_globalsign { float: left; padding: 5px 0px 5px 50px; } div#add_memo { padding-bottom: 10px; } div.memo { width: 90%; line-height: 18px; padding: 8px 0px; border-top: 1px dashed #AAA; } div.memo span { color: #888; font-size: 10px; } div.prof_list { } div.prof_list h2 { padding: 5px; margin: 20px 0px; padding-left: 20px; border-left: 10px solid #ADCE28; font-size: 14px; } div.prof_list h2 span a { font-size: 10px; float: right; font-weight: normal; padding-left: 20px; background: url(/images/arrow_s.gif) no-repeat scroll left center; } div.sample_image { margin: 2px; float: left; padding: 2px; text-align: center; } div.sample_image input { margin: 3px; } .help_icon { padding: 0 5px; } .help_box { background-color: #FFF; border: 3px solid #ABBBDC;} .help_box td { padding: 10px;} .help_font { font-size: 12px; color: #333; } .profile_appeal { padding: 0 0 30px 0; } .rate{ display:block; text-indent:-999em; width:30px; height: 30px; } .rate-good { background:transparent url(/images/icons/feedback.gif) no-repeat left top;} .rate-usual { background:transparent url(/images/icons/feedback.gif) no-repeat center top;} .rate-bad { background:transparent url(/images/icons/feedback.gif) no-repeat right top; } .rate_small{ display:block; text-indent:-999em; width:25px; height: 25px; } .rate-good_small { background:transparent url(/images/icons/feedback_small.gif) no-repeat left top;} .rate-usual_small { background:transparent url(/images/icons/feedback_small.gif) no-repeat center top;} .rate-bad_small { background:transparent url(/images/icons/feedback_small.gif) no-repeat right top; } div.top_cats { float:left; padding:0 20px 20px; width:900px; } div.top_cats h2 { width:900px; } div.top_cats ul { float:left; list-style-type: none; } div.top_cats li { float:left; height:10px; padding:5px 0; width:300px; } div.top_cats li a { color:#5D5D5D; } ul.services div.item { float: none; padding:5px 0; } ul.services div.item span.segment { float: none; } ul.services div.item span.small { width: 120px; } ul.services div.item span.medium { width: 400px; } ul.services div.item span.large { width: 530px;} .avoid_btn { width:460px; float: left; } .onoffline { /* background:url(../images/barShadowHorizon.png) 0px 10px no-repeat; */ float:right; margin-top:20px; /* padding-left:40px;*/ /*padding-right:35px;*/ min-height:200px; } .onoffline .status { background:url(/images/onoffline.png) no-repeat; width:204px; height:58px; } .onoffline .status_on { background:url(/images/onoffline.png) 0px -58px no-repeat; } .onoffline .status_text { text-align:right; width:200px; margin-bottom:10px; } .onoffline .onoff_btn { width: 206px; height: 51px; display: block; margin-right: 10px; margin-top:10px; } .onoffline .onoff_btn_en { background:url(/images/en/onlineBtn.png) no-repeat; } .onoffline .onoff_btn_ja { background:url(/images/ja/onlineBtn.png) no-repeat; } .onoffline .onoff_btn_zh { background:url(/images/zh/onlineBtn.png) no-repeat; } .onoffline .onoff_btn_zh-tw { background:url(/images/zh-tw/onlineBtn.png) no-repeat; } .onoffline .onoff_btn_on { background-position: 0px 0px; } .onoffline .onoff_btn_off { background-position: 0px -51px; } .onoffline .onoff_btn_chat { background-position: 0px -102px; } /* --- Online pro & chat button --- */ .online_pro_title { padding:5px 0 7px 4px; } .online_pro { background:#ffffff; height:54px; width:200px; padding:6px; border:1px solid #bebebe; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; box-shadow: 0px 0px 7px #999; -moz-box-shadow: 0px 3px 7px #999; -webkit-box-shadow: 0px 0px 7px #999; float:left; margin-right:13px; margin-bottom:15px; } .online_pro_pic { float:left; } .online_pro_name { } .online_pro_tools { margin-top:3px; /* text-align:center;*/ } .online_pro_tools a { text-decoration:underline; } .online_pro_chat_btn { text-align:center; border:1px solid #bebebe; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; color:#ffffff; margin:5px 5px 5px 60px; width:100px; display:block; } .online_pro_chat_btn:hover { } .chat_btn_blue { background:#4863a8; } .chat_btn_blue:hover { background:#132b69; } .chat_btn_red { background:#a63c3c; } .chat_btn_grey { background:#b0b0b0; } .cafetalk_is { color:#333; width:520px; font-weight:bold; } .cafetalk_is h2 { font-size:24px; margin-bottom:10px; } .cafetalk_is p { font-size:16px; line-height:26px; } .cafetalk_is span { color:#ee8620; font-weight:bold; text-decoration:underline; } .about_cost { width:482px; margin-top:6px; padding:5px 15px; border:4px solid #e99643; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; margin-bottom:15px; color:#333; background:#fff3e7; } .about_cost p { font-size:14px; line-height:22px; text-shadow:#ffffff 1px 1px 0px; } .about_cost span { font-weight:bold; } .online_pros_iframe { width:520px; } .online_pros_iframe h2 { margin-bottom:10px; } /* MOD 12 may 2011 */ h2.newline { border: 1px solid #CCC; color: #4C3D3F; font-size: 130%; height: 32px; margin: 0px 0px 15px; line-height: 32px; } h2.newline span { background-color:#6F645F; padding: 6px 10px; } /* ------------------------------------------------------- * Multimedia/list * --------------------------------------------------------*/ div.standard_new span.nota { border: 1px dashed #CCC; display: block; font-size: 90%; padding: 7px; position: absolute; right: 0px; top: 60px; width: 450px; } div#outline_media_list li { padding:7px 0; border-bottom:1px solid #ccc; } div#outline_media_list div.item { border-top: 1px solid #eee; margin: 0px 0px 10px; padding: 25px 0px 10px; } div#outline_media_list div.item td.small { width:160px; } div#outline_media_list div.item td.large { width:560px; } div#outline_media_list div.item td.crud { text-align: right; width:50px; } div#outline_media_list div.item td h3.title { padding:10px 0 5px; border-bottom:1px solid #ccc; width:100%; } div#outline_media_list div.item td p.line { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background-color: #DAD4CF; margin: 1px 0px 5px; padding: 3px 8px 4px; } div#outline_media_list div.item td p.price b { font-size: 130%; font-family: "Trebuchet MS" sans-serif; } div#outline_media_list div.item td p.cat { border-bottom: 1px dashed #CCC; margin: 3px 0px 5px; padding: 0px 0px 2px; } div#outline_media_list div.item td p.description { line-height: 1.4; margin: 6px 0px; } div#outline_media_list div.item td p.line img { position:relative; top:3px; } div#outline_media_list div.item td p.line span { padding: 0 3px; } div#outline_media_list div.item td b { color:#990000; } div#outline_media_list div.item div.links div.regist { position: absolute; top: -7px; right:0; } div#outline_media_list p.back { background-color: #26637c; padding: 2px 5px; margin: 15px 0 10px; width: 180px; } div#outline_media_list p.back a { color: white; font-weight: bold; font-size: 14px; padding: 0 0 0 10px; display: block; line-height: 33px; } div#outline_media_list p.back a img { position: relative; top:7px; left: 0; } div#outline_media_list p.back:hover { background-color: #338aae; } /* ------------------------------------------------------- * Store USER * --------------------------------------------------------*/ div#outline_store div.item { border-top: 1px solid #eee; margin: 0px 0px 10px; padding: 25px 0px 10px; position: relative; clear: both; } div#outline_store div.item:before, div#outline_store div.item:after { content:""; display:table; } div#outline_store div.item:after { clear:both; } div#outline_store div.item { zoom:1; } div#outline_store div.item:hover { background-color: #fffcee; } div#outline_store div.item div.rightBox { width:555px; float: right; } div#outline_store div.item ul.leftBox { width:143px; float: left; } div#outline_store div.item div.rightBox h3 { padding: 0 20px 10px; } div#outline_store div.item p.description { line-height: 1.4; padding: 10px 20px 15px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; background-color: #eeebdb; width: 500px; } div#outline_store div.item span.cat { border-bottom: 1px dashed #CCC; padding: 6px 0; margin: 0 0 15px; display: block; } div#outline_store div.item li img { padding: 3px; border: 1px solid #ccc; display: block; margin: 0 auto; } div#outline_store div.item li span { padding: 5px 0; display: block; border-top: 1px dashed #ccc; font-size: 65%; color: #333; } div#outline_store div.item li.price { color:#990000; font-size: 130%; font-family: "Trebuchet MS" sans-serif; text-align: center; padding: 5px 0 0; } div#outline_store div.links_media { position: absolute; top: 5px; right: 5px; } div#outline_search img { border:none; text-decoration:none; } div#outline_search ul, div#outline_search li { list-style-type:none; } div#outline_search textarea { resize:vertical; } div.Tabline li { float:left; margin-right:20px; } /* BASE */ div#outline_search { } div#outline_search fieldset{ border: none; clear:both; margin:0 0 20px 0; } /* SEARCH SCRIPT*/ div#outline_search fieldset.mediascript li{ display:inline; font-size:90%; padding:0 40px 0 0; } /* SEARCH PRICE*/ div#outline_search fieldset.mediaprice { margin:0; } div#outline_search fieldset.mediaprice ul{ width:550px; } div#outline_search fieldset.mediaprice li{ float: left; margin: 10px 0 5px 15px; width: 140px; } /* multimedia LIST of tutor */ div#outline_search div.box_medialist{ margin:0 0 15px; zoom:1; } div#outline_search div.box_medialist:after{ clear:both; content:"."; display:block; height:0; visibility:hidden; } div#outline_search div.medialist{ background:url(/images/media/ja/BG_list.jpg) repeat-x 0 0 #f2ead0; height:202px; margin:0 0 25px 0; padding:13px; position:relative; } div#outline_search div.wbase{ background-color:#fff; height:180px; padding:13px 10px 10px; } div#outline_search div.medialist h3.titleMedia{ font-size:150%; padding:30px 0 0 0; width:420px; } div#outline_search div.medialist p.points{ color:#660000; font-size:105%; font-weight:bold; margin:0 0 10px 0; } div#outline_search div.medialist p.Mediadesc{ font-size:90%; width:420px; } div#outline_search div.mediacategory{ background:url(/images/media/ja/title_list.png) 0 0 no-repeat; left:-2px; height:45px; position:absolute; top:-2px; width:303px; } div#outline_search div.mediacategory p{ color:#fff; padding:13px 15px 15px 20px; } div#outline_search div.medialist p.media{ float:right; height:160px; width:160px; } div#outline_search div.medialist p.button_more{ clear:right; float:right; font-size:85%; margin:8px 15px 0 0; width:90px; } div#outline_search div.medialist p.button_more span{ background:url(/images/media/ja/arrow_arp.jpg) bottom right no-repeat; display:block; height: 30px; position: relative; top: -22px; } /* MEDIA LIST BOX */ div.medialistBox { -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; background-color:#fff; border:1px solid #ccc; padding:8px 0; width: 172px; float:left; margin: 0px 5px 10px 0; text-align: center; height: 210px; overflow: hidden; } div.medialistBox:hover { background-color: #FFFBF0; } div.medialistBox p.media { margin: 0 auto 5px; height: 128px; } div.medialistBox h3.titleMedia { font-size:90%; line-height: 1.2; min-height: 30px; padding: 0 3px; } div.medialistBox p.mcategory { color:#675a38; font-size:85%; padding: 5px 0; } div.medialistBox p.points { background-color: #DAD4CF; color:#990000; margin:3px 0; padding:3px 0; font-weight: bold; font-family: "Trebuchet MS" sans-serif; } /* Advanced */ div#outline_search div.mediaprof { margin:0 0 55px; zoom:1; } div#outline_search div.mediaprof:after { clear:both; content:"."; display:block; height:0; visibility:hidden; } div#outline_search div.descttor { margin:0 0 55px; zoom:1; } div#outline_search div.descttor:after { clear:both; content:"."; display:block; height:0; visibility:hidden; } div#outline_search div.boxLeft { float:left; width: 460px; } div#outline_search div.sortBox { margin: 10px 10px 10px 20px; height:20px; } div#outline_search div.sortBox p.grid { float:left; width:100px; } div#outline_search div.boxRight { float:right; width: 230px; } div#outline_search div.mediaBox p { border: 1px solid #CCC; padding: 15px; text-align: center; margin: 10px 0px; } div#outline_search div.boxLeft p.descript { margin:10px 0 15px 0; color:#333; } div#outline_search div.pointsMed { background-image: url(/images/store/cart.png); background-position: 15px 20px; background-repeat: no-repeat; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; background-color: #F4F3EF; margin: 2px 0px 15px; padding: 20px 20px 15px; } div#outline_search div.boxRight p.back { background-color: #26637c; padding: 2px 5px; margin: 15px 0 10px; } div#outline_search div.boxRight p.back a { color: white; font-weight: bold; font-size: 14px; padding: 0 0 0 10px; display: block; line-height: 33px; } div#outline_search div.boxRight p.back a img { position: relative; top:7px; left: 0; } div#outline_search div.boxRight p.back:hover { background-color: #338aae; } div#outline_search div.pointsMed div.priceBox { margin: 5px 0 10px 60px; } div#outline_search div.pointsMed p.price { text-align: center; color:#990000; font-weight: bold; font-size: 120%; font-family: "Trebuchet MS" sans-serif; } div#outline_search div.pointsMed p.count { text-align: center; border-top: 1px dashed #666; padding: 5px 0; font-size: 90%; } div#outline_search div.boxRight div.datasheet { -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; border:1px solid #ccc; margin:0 0 0; padding:10px 5px; } div#outline_search div.datasheet ul { margin: 5px 10px 25px; } div#outline_search div.datasheet li span { margin:0 5px 0 0; font-weight:bold; } div#outline_search div.datasheet li { border-bottom:1px solid #ccc; line-height:2.2; font-size:95%; } div#outline_search div.downloadlink a { display: block; width: 200px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; text-align: center; line-height: 34px; text-decoration: none; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; font-weight: bold; } div.notice_bubble p.title_notice{ font-size: 18px; color: #666; font-weight: bold; padding: 3px 0px; text-shadow: #DEDEDE 1px 1px 0px; } div#outline_search div.downloadBox p.button a:hover, a:active { border: none; } /* Light */ a.light, input.light, ul.light li a, th.light { background: #F5F5F5; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#ECECEC'); background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#ECECEC)); background: -moz-linear-gradient(top, #FFFFFF, #ECECEC); color: #858585; text-shadow: 0px 1px 0px #fff; -webkit-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 1px 0 #fff, 0px 1px 0 #B5B5B5; } a.light:hover, input.light:hover, ul.light li a:hover { background: #fff; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#F7F7F7'); background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#F7F7F7)); background: -moz-linear-gradient(top, #FFFFFF, #F7F7F7); color: #717171; } a.light:active, input.light:active, ul.light li a:active { background: #eee; color: #717171; -webkit-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 2px 3px #aaa, 0px 1px 0 #B5B5B5; } div#outline_search div.datasheet div.downloadBox p.filename { -moz-border-radius:6px; -webkit-border-radius:6px; background-color:#fff; border-radius:6px; font-size:85%; margin:10px auto 0; padding:3px; text-align:center; } div#outline_search div.datasheet div.downloadBox p.filename span { display:block; } div#outline_search div.descttor div.specTutor { float:left; } div#outline_search div.descttor div.specTutor p.texss { font-size:85%; } div#outline_search div.descttor p.tutorname { font-size:150%; } div#outline_search div.descttor div.tutorImgS { float:left; margin:0 8px 10px 0; width:110px; } div#outline_search div.descttor p.tutorImgS img { background-color:#fff; border:2px solid #87970f; padding:2px; } div#outline_search div.descttor div.boxLeft p.descript { clear:left; font-size:90%; } div#outline_search div.descttor p.buttonMore { } div#outline_search div.descttor div.timeSchedule { -moz-border-radius:10px; -webkit-border-radius:10px; background-color:#f7f4e7; border:1px solid #ede6ca; border-radius:10px; font-size:80%; padding:5px 0 0; } div#outline_search div.descttor div.avtime { text-align:center; padding:10px; } div#outline_search div.timeSchedule p.titleimg { text-align:center; } /* Reviewer */ div#outline_search div.reviewer { margin:0 0 55px; zoom:1; } div#outline_search div.reviewer:after { clear:both; content:"."; display:block; height:0; visibility:hidden; } /* CONTENTS SEARCH */ div#outline_search fieldset.language ul{ float:left; margin:0 0 3px 0; width:280px; } div#outline_search fieldset.language li{ float:left; font-size:90%; width:160px; } /* CONTENTS DETAIL */ div#outline_search div.det_contents{ zoom:1; } div#outline_search div.det_contents:after{ clear:both; content:"."; display:block; height:0; visibility:hidden; } div#outline_search div.det_contents p.date{ background:url(/images/contents/ja/BG_data_top.jpg) 0 0 no-repeat; color:#3f3213; float:right; font-size:95%; font-weight:bold; height:44px; padding: 2px 0 0; text-align:center; width:115px; } div#outline_search div.det_contents p.date span{ color:#3f3213; display:block; font-size:70%; position:relative; top:2px; } div#outline_search div.det_contents h2.title_contents{ color: #423D13; font-size: 150%; font-weight:bold; padding: 5px 0px 10px 0; margin-bottom:10px; border-bottom:1px solid #efefef; } div#outline_search div.det_contents h2.title_contents span img{ vertical-align:middle; } div#outline_search div.det_contents div.detailBox{ margin:0 0 10px 0; zoom:1; } div#outline_search div.det_contents div.detailBox:after{ clear:both; content:"."; display:block; height:0; visibility:hidden; } div#outline_search div.det_contents div.detailBox p{ clear:both; color:#60442a; font-size:100%; /*line-height:1.4;*/ line-height:180%; } div#outline_search div.det_contents div.detailBox img{ display:block; } div#outline_search div.det_contents div.noteBox{ background:url(/images/contents/ja/BG_notebox.jpg) 0 0 no-repeat; height: 49px; margin: 0; padding: 20px; width: 640px; } div#outline_search div.det_contents div.noteBox span { padding:0 3px; position:relative; top:3px; } div#outline_search div.det_contents div.noteBox p.category{ color:#91173c; float:left; font-size:95%; font-weight:bold; } div#outline_search div.det_contents div.noteBox p.name{ color:#fff; float:left; font-size:95%; font-weight:bold; } div#outline_search div.det_contents div.noteBox p.name a{ color:#fff; } div#outline_search div.det_contents div.noteBox p.name a:hover{ color:#300; } div#outline_search div.det_contents div.noteBox p.tag{ color:#423d13; float:left; font-size:95%; font-weight:bold; position:relative; top:4px; } div#outline_search div.det_contents div.noteBox p.tag a{ color:#584c36; } div#outline_search div.det_contents div.noteBox p.tag a:hover{ color:#fff; } div#outline_search div.goodBox{ -moz-border-radius:6px; -webkit-border-radius:6px; background-color:#f2ead0; border-radius:6px; border:1px solid #e8e0b7; margin:0 0 10px 0; padding:7px; text-align:center; width:200px; } div#outline_search div.goodBox p{ font-size:80%; } div#outline_search div.goodBox p span{ color:#82725e; font-size: 200%; font-weight:bold; letter-spacing: -1px; line-height: 1; padding:0 0 0 5px; position: relative; top: 8px; } div#outline_search div.goodBox p img{ vertical-align:middle; } /* Medal page description */ div#outline_medalbox { font-family:Meiryo, Helvetica, sans-serif, Verdana; float:left; line-height:1.7; margin:10px 0 20px 0; width:680px; } div#outline_medalbox div.leftmedalBox { float:left; width:454px; } div#outline_medalbox div.leftmedalBox p { color:#67522b; font-size:100%; margin:15px 0 0 0; padding:0; } div#outline_medalbox div.leftmedalBox p.txt { color:#67522b; font-size:100%; margin:0; padding:15px; } div#outline_medalbox p.titlemed_box { color:#67522b; font-size:190%; font-weight:bold; margin:0; } div#outline_medalbox p.titlemed_box img { position:relative; top:-2px; vertical-align:middle; } div#outline_medalbox div.leftmedalBox h2 { color:#870707; font-size:140%; } div#outline_medalbox div.rightsideBox { float:right; position:relative; width:204px; } div#outline_medalbox div.rightsideBox p.med { position:absolute; top:-14px; right:10px; } div#outline_medalbox div.sideboxR { background-color:#f2ead0; margin:220px 0 0 0; padding:0 0 15px 0; } div#outline_medalbox div.sideboxR p { color:#333; font-size:90%; line-height: 1.4; margin:0.5em 0; padding:0 5px; text-align:center; } div#outline_medalbox div.sideboxR h4 { color:#67522b; font-size:140%; line-height:1.2; margin:0.5em 0; text-align:center; } div#outline_medalbox div.sideboxR h4 span { color:#b17c1f; display:block; font-size:85%; font-weight:normal; text-align:center; } div#outline_medalbox div.sideboxR ul { margin:15px; padding:0; } div#outline_medalbox div.sideboxR li { color:#67522b; font-size:100%; list-style-type:none; line-height:1.4; margin:0 0 5px 0; padding:0; } /* Medal Box Page */ div#outline_medalbox div#rankingbox { background:url(/images/medals/ja/lanking.gif) center top no-repeat; height:100px; text-align:center; width:457px; } div#outline_medalbox div#rankingbox p.rank { color:#fff; font-size:300%; padding:15px 0 0 0; margin:0; } div#outline_medalbox div#rankingbox p.rank span { color:#fff; font-size:40%; } div#outline_medalbox div#rankingbox p.ranktotal{ position:relative; top:-10px; left:70px; } div#outline_medalD ul.medalbox { padding:0; margin:25px 0 0 0; } div#outline_medalbox ul.medalbox li.medalbox { float:left; list-style-type:none; width:90px; } /*** Related services ***/ div.box_inline { position:relative; width:710px; padding-bottom:20px; } div.box_inline .back_btn, div.box_inline .next_btn { height:30px; position:absolute; text-align:center; top:83px; width:20px; } div.box_inline .back_btn { left:-1px; } div.box_inline .next_btn { right: -1px; } div.box_inline .box_content { clear:both; margin:0 15px; } div.box_inline .back_btn a, div.box_inline .next_btn a { padding:15px 2px 15px 5px; font-size: 12px; display:block; } div.box_inline .back_btn a { border-radius: 26px 0 0 26px; -moz-border-radius: 26px 0 0 26px; -webkit-border-radius: 26px 0 0 26px; } div.box_inline .next_btn a { border-radius: 0 26px 26px 0; -moz-border-radius: 0 26px 26px 0; -webkit-border-radius: 0 26px 26px 0; } /*IE6,IE7,IE8*/ div.box_inline .back_btn a, div.box_inline .next_btn a { background-color/*\**/: #F4F4F4 \9} div.box_inline .back_btn a:hover, div.box_inline .next_btn a:hover { background-color/*\**/: #AAA \9} span.totalpage { float:right; font-size:13px; font-weight:normal; padding-right:20px; } /* lesson page */ div#outline_lesson { float:left; width:680px; } div#outline_lesson p { margin:0; padding:0; } div#outline_lesson div.BGlesson_head { height:81px; } div#outline_lesson div.BGlesson_foot { height:81px; } div#outline_lesson div.lessoncontents { background:url(../images/campaign/lesson/BG_side.jpg) top left repeat-y; overflow:hidden; padding: 25px 25px 25px 30px; width:610px; zoom:1; } div#outline_lesson div.lessoncontents:after{ clear:both; content:"."; display:block; height:0; visibility:hidden; } div#outline_lesson div.lessoncontents div.fotoBox{ float:left; width:130px; } div#outline_lesson div.lessoncontents div.fotoBox p img{ background-color:#fff; border:1px solid #d7d0bb; padding:7px; vertical-align:top; } div#outline_lesson div.lessoncontents div.rightBox{ display:inline; float:left; overflow:hidden; width:470px; } div#outline_lesson div.lessoncontents div.rightBox div.box_in_button{ margin: 10px 0px 40px; padding:0; text-align:left; } div#outline_lesson div.lessoncontents h2.title{ color:#3f2d1a; font-size:200%; font-weight:bold; line-height:1.2; margin:0; padding:0; } div#outline_lesson div.lessoncontents h2.title span.movie{ -moz-border-radius:6px; -webkit-border-radius:6px; border:4px solid #d7d0bb; border-radius:6px; background:url(../images/campaign/lesson/icon_movie.jpg) center top no-repeat #f2ead0; color:#3f2d1a; display:block; float:right; font-size:9px; font-weight:bold; height:60px; margin:0 0 0 8px; text-align:center; width:60px; } div#outline_lesson div.lessoncontents h2.title span.movie:hover{ border:4px solid #996666; } div#outline_lesson div.lessoncontents h2.title span.testi{ position:relative; top:45px; } div#outline_lesson div.lessoncontents h2.title span.subt{ color:#6c622c; display:block; font-size:14px; font-weight:normal; line-height:1.4; margin:5px 0 0 ; width: 380px; } div#outline_lesson div.lessoncontents ul.priceBox{ -moz-border-radius:6px; -webkit-border-radius:6px; border:1px solid #803689; border-radius:6px; background:url(../images/campaign/lesson/icon_price.jpg) 10px 10px no-repeat #9b4864; color:#fff; margin: 20px 0 25px; padding:10px; width: 340px; } div#outline_lesson div.lessoncontents ul.priceBox li.line{ background:url(../images/campaign/lesson/line_red.jpg) bottom left no-repeat; font-size:14px; font-weight:bold; margin:0 0 0 45px; padding: 7px 0px 15px; width: 310px; } div#outline_lesson div.lessoncontents ul.priceBox li.noline{ font-size:14px; font-weight:bold; margin:0 0 0 45px; padding: 7px 0px 0px; width: 330px; } div#outline_lesson div.lessoncontents ul.cdescrip li{ background:url(../images/campaign/lesson/line_mar.jpg) bottom left repeat-x; color:#3f2d1a; margin:0; padding:10px 0 15px 0; width: 600px; } div#outline_lesson div.lessoncontents ul.cdescrip dt{ font-size:14px; font-weight:bold; } div#outline_lesson div.lessoncontents ul.cdescrip dt img{ vertical-align:middle; } div#outline_lesson div.lessoncontents ul.cdescrip dt.iline{ display:inline; } div#outline_lesson div.lessoncontents ul.cdescrip dt span{ margin:0 0 0 10px; } div#outline_lesson div.lessoncontents ul.cdescrip dd{ font-size: 14px; line-height: 1.6; margin:0 0 0 48px; } div#outline_lesson div.lessoncontents ul.cdescrip dd.iline{ display:inline; margin:0; } div#outline_lesson div.lessoncontents ul.cdescrip dd.nomarg{ margin:10px 0 0 5px; } /* user registration */ div#outline_Useregister div.notebox{-webkit-border-radius: 6px;-moz-border-radius: 6px;background:url(/images/registration/bg.png) 0 0 #f8f2de;border-radius: 6px;font: 14px 'Century Gothic', 'Lucida Grande', Calibri, Helvetica, Arial, Meiryo, 'MS PGothic', sans-serif;padding:8px;position:relative;height:230px;width:660px;} div#outline_Useregister p.title{color:#663300;font-size:20px;text-align:center;margin:30px 0 0 0;} div#outline_Useregister p.title span img{vertical-align:top;} div#outline_Useregister p.message{background-color: #F9F8F4;border: 1px dashed #CCC;color: #666;float: left;height: 90px;line-height: 1.6;margin: 30px 0px 0px 185px;padding: 15px 10px;width: 420px;} div#outline_Useregister p.img_mail{position:absolute;top:83px;left:-1px;width:180px;} div#outline_Useregister p.c_left{left: 640px;position: absolute;top: 15px;width: 20px;} div#outline_Useregister p.c_right{left: 15px;position: absolute;top: 15px;width: 20px;} /* ------------------------------------------------------- * temporary * --------------------------------------------------------*/ p.temporary { color:#990000; border:2px solid #990000; padding:8px; font-size:15px; text-align:center; margin:0 0 15px 0; background-color:#FFFFCC; line-height:1.4; font-weight:bold; width:680px; } p.temporary span{ display:block; font-size:13px; padding:5px; } p.temporary span a{ text-decoration:underline; } /* CONTENTS LIST */ div.contentslist { padding: 20px 0 0 0; float: left; } ul.contentslist { clear: both } ul.contentslist li.contentsline { border-bottom: 2px dotted #e9e6d1; margin: 20px 0; zoom: 1; } ul.contentslist li.contentsline:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } ul.contentslist li.contentsline p.icon { float: left; width: 50px; } ul.contentslist li.contentsline p.date { float: right; font-size: 95%; padding: 10px; text-align: center; width: 100px; } ul.contentslist li.contentsline dl { float: left; width: 460px; } ul.contentslist li.contentsline dt { margin:5px 0; } ul.contentslist li.contentsline dt a { color: #423D13; font-size: 125%; letter-spacing: -0.1em; word-spacing: 2px; } ul.contentslist li.contentsline dt a:hover { color: #906c34 } ul.contentslist li.contentsline dd.category { color: #91173c; float: left; font-size: 90%; padding: 0 3px 0 0; } ul.contentslist li.contentsline dd.category span { color: #B17C1F; font-size: 90%; font-weight: bold; position: relative; top: -4px; } ul.contentslist li.contentsline dd.name a { color: #b17c1f; font-size: 90%; font-weight: bold; position: relative; top: -2px; } ul.contentslist li.contentsline dd.name a:hover { color: #6a5227 } /* ------------------------------------------------------- * temporary notice * --------------------------------------------------------*/ div.banner_Gnotice_earthquake { margin: 10px 0px 10px 5px; } div.banner_Gnotice_earthquake p a { cursor:pointer; } /* ------------------------------------------------------- * user/reqs/new * --------------------------------------------------------*/ div.photo{ width:132px; height:110px; line-height:132px; } div.profile_left{ float:left; width:132px; } div.profile_right { float:right; width:540px; } div.profile_right table { width:540px; } /* ------------------------------------------------------- * tutor timeline talk * --------------------------------------------------------*/ div.talk_area{ width:460px; height:50px; } div.talk_area textarea#comment_body{ width:95%; height:39px !important; } /* ------------------------------------------------------- * Previous and next message. * --------------------------------------------------------*/ .message_np_links { float: right; margin: 5px 0 0 ; } .message_np_links a { } .MS_tabs { height: 35px; background: #E0E0E0; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E9E9E9', endColorstr='#D7D7D7'); background: -webkit-gradient(linear, left top, left bottom, from(#E9E9E9), to(#D7D7D7)); background: -moz-linear-gradient(top, #E9E9E9, #D7D7D7); padding: 5px; -webkit-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -moz-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -o-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -khtml-box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; box-shadow: inset 0px 2px 2px #B2B3B5, 0px 1px 0 #fff; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; margin-bottom: 20px; margin-left: 0; } .MS_tabs li { list-style: none; margin-left: 0; display: inline-block; float: left; } .MS_tabs li a { display: inline-block; float: left; width: 100px; height: 35px; font-size: 14px; text-align: center; line-height: 34px; text-decoration: none; -webkit-border-radius: 0px; -o-border-radius: 0px; -moz-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px; font-weight: bold; } .MS_tabs li:first-child a { -khtml-border-top-left-radius: 8px; -khtml-border-bottom-left-radius: 8px; -o-border-top-left-radius: 8px; -o-border-bottom-left-radius: 8px; -webkit-border-top-left-radius: 8px; -webkit-border-bottom-left-radius: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; border-top-left-radius: 8px; border-bottom-left-radius: 8px; } .MS_tabs li:last-child a { -khtml-border-top-right-radius: 8px; -khtml-border-bottom-right-radius: 8px; -o-border-top-right-radius: 8px; -o-border-bottom-right-radius: 8px; -webkit-border-top-right-radius: 8px; -webkit-border-bottom-right-radius: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px; } /* Dark */ ul.dark li a { background: #425063; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bfbbb4', endColorstr='#716b5a'); background: -webkit-gradient(linear, left top, left bottom, from(#bfbbb4), to(#716b5a)); background: -moz-linear-gradient(top, #bfbbb4, #716b5a); color: #fff; text-shadow: 0px 1px 0px #56677F; -webkit-box-shadow: inset 0px 1px 0 #727061, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 1px 0 #727061, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 1px 0 #727061, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 1px 0 #727061, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 1px 0 #727061, 0px 1px 0 #B5B5B5; } ul.dark li a:hover { background: #4A5B71; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#576A84', endColorstr='#3A4A5E'); background: -webkit-gradient(linear, left top, left bottom, from(#576A84), to(#3A4A5E)); background: -moz-linear-gradient(top, #576A84, #3A4A5E); color: #fff; } ul.dark li a:active { background: #3E4E62; color: #fff; -webkit-box-shadow: inset 0px 1px 0 #5C6F8B, 0px 1px 0 #B5B5B5; -moz-box-shadow: inset 0px 1px 0 #5C6F8B, 0px 1px 0 #B5B5B5; -o-box-shadow: inset 0px 1px 0 #5C6F8B, 0px 1px 0 #B5B5B5; -khtml-box-shadow: inset 0px 2px 3px #333E4E, 0px 1px 0 #B5B5B5; box-shadow: inset 0px 1px 0 #5C6F8B, 0px 1px 0 #B5B5B5; } ul.MS_tabs li.dark a { border-right: 1px solid #55524d;} p.movielink_guide { border: 1px dashed #605454; background-color: #f4f4e1; padding: 5px; text-align: center; font-weight: bold; font-size: 16px; width:640px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; }