/*TABLE OF CONTENTS this file kept with comments and spacing for legibility, suggest CSS Compression for the live site, will save more than 10KB of file space and efficient processing GENERAL STYLES - adjusting the overall look of the page, including background, page borders, text style and stationary, consistent elements LOGIN SECTIONS - adjusts the form input boxes, submit buttons, labels and font style DROPDOWN MENU - style the pure HTML/CSS drop down menu HEADER AND CONTENT SECTIONS - very important elements, determinging page layout and container divs NAVIGATION SIDE BOX - appears in the left hand column, helps user navigate through different categories of site GAME BANNERS ON HOMEPAGE - style a list of game banners in a table-like layout without using tables SPOTLIGHT NEWS AND NOTICES ON HOME PAGE - News and Notices updates utilizing Spotlight and jQuery show/hide AD AND BANNER SPACE - style the sections devoted to ad space and banners THE FOOTER - style footer and links within the footer EVENT SLIDESHOW - style the slideshow on the home page and its relevant components NEW TO NEXON PAGE - style the New To Nexon page elements BILLING OPTIONS - Different methods of payment /************Styles from Old Table Layout *****/ tr, td ,th {font:11px verdana,arial;line-height:14px;color:#444444;} a:link {color:#666666; text-decoration:none;} a:visited {color:#666666; text-decoration:none;} a:hover {color:#0B53AD; text-decoration:underline;} .way01 {font:11px bold verdana; color:#4370C1; line-height:15px; letter-spacing:0px;} .way01 a:link {color:#4370C1; font-weight:bold; text-decoration:none; letter-spacing:0px;} .way01 a:visited {color:#4370C1; font-weight:bold; text-decoration:none; letter-spacing:0px;} .way01 a:hover {color:#4370C1; font-weight:bold; text-decoration:underline; letter-spacing:0px;} .tex_12px{font:12px verdana; color:#444444; line-height:15px; letter-spacing:0px;} .tex_12px a:link {color:#444444; text-decoration:none; letter-spacing:0px;} .tex_12px a:visited {color:#444444; text-decoration:none; letter-spacing:0px;} .tex_12px a:hover {color:#444444; text-decoration:underline; letter-spacing:0px;} /************GENERAL STYLES********************/ *{margin:0;padding:0;border:none;} body {font-family:Arial, Verdana, sans-serif;background:#F1EDE5;} h1 {background:url(http://nxcache.nexon.net/nx/global/top/nx_logo.gif) no-repeat;width:115px;height:30px;text-indent:-9999px;margin:12px 0 10px 47px;cursor:pointer;}/*updated 09-03-23, more space for logo per standards*/ h2{display:none;}/*reserve h2 for semantic meaning*/ a{outline:none;}/*prevent Firefox outline on links*/ ul{list-style:none;} #Wrapper{width:854px;padding-left:10px;position:relative;min-height:920px}/*wrap the entire page in a Wrapper, set to relative to allow for absolute positioned children*/ /************LOGIN SECTIONS********************/ /*Style the small login section at the very top of the page*/ .SmallLoginSection{position:absolute;right:0;top:-38px;} /*Style the small message box that welcomes users and provides edit/charge links*/ #WelcomeMessage{background:#d7ccb9;padding:0 5px;height:15px;text-align:center;font-size:11px;float:left;margin-right:15px;} #WelcomeMessage a{padding:0 5px;} #WelcomeMessage span{padding:0 5px;} #WelcomeMessage a:link, #WelcomeMessage a:visited, #WelcomeMessage a:active{color:#cc0000;text-decoration:none;} #WelcomeMessage a:hover{text-decoration:underline;} /*Style the Login column that houses the larger Login box*/ .LoginColumn{background:#5e88d8;width:198px;height:197px;float:left;} .LoginBox{background:url(http://nxcache.nexon.net/nx/global/login_box/login_background.gif) no-repeat;width:178px;height:185px;margin:0 auto;padding-top:30px;position:relative;/*push the contents of this box downward*/} /*style the Login buttons on the large login box*/ .join_window{background:url(http://nxcache.nexon.net/nx/global/login_box/background_join_community.gif) no-repeat;position:relative;text-indent:-9999px;width:163px;height:115px;margin:0 auto;} .login_window{background:url(http://nxcache.nexon.net/nx/global/login_box/background_login.gif) no-repeat;position:relative;width:163px;height:130px;margin:0 auto;} .login_window input{position:absolute;left:9px;width:84px;color:#999;font:11px Arial, Helvetica, sans-serif;padding:2px 3px;} .login_window input.input_username{top:13px;background:url(http://nxcache.nexon.net/nx/global/login_box/input_username.gif) no-repeat;} .login_window input.input_password{top:35px;background:url(http://nxcache.nexon.net/nx/global/login_box/input_password.gif) no-repeat;} .login_window input.button_login{background:url(http://nxcache.nexon.net/nx/global/login_box/button_login_mini.gif) no-repeat;width:55px;height:49px;cursor:pointer;border:none;text-indent:-9999px;color:#f0f0f0;position:absolute;top:9px;left:103px;padding-top:49px;} .login_window input.button_login:hover{background-position:100% 0;} .checkbox_remember_me{position:absolute;left:25px;bottom:-20px;font: bold 11px Arial, sans-serif;}/*position and style the Remember Me checkbox*/ .checkbox_remember_me img{margin-right:3px;vertical-align:middle;cursor:pointer;} .LoginBox p{font:bold 11px Arial, sans-serif;color:#003366;text-align:center;position:absolute;bottom:35px;left:35px;line-height:13px;} .LoginBox p a:link, .LoginBox p a:visited, .LoginBox p a:active{color:#1552ce;display:block;text-decoration:underline;} .LoginBox p a:hover{color:#e6ff14;} .LoginBox .login_window p{font:normal 11px Arial, sans-serif;color:#fff;bottom:6px;left:27px;line-height:12px;} .LoginBox .login_window p a{display:inline;} .LoginBox .login_window p strong a{color:#e6ff14;text-decoration:none;}/*edit 09-05-04, tweak style on Sign Up link*/ .LoginBox .login_window p strong a:hover{text-decoration:underline;}/*edit 09-05-04, tweak style on Sign Up link*/ .button_signup{background:url(http://nxcache.nexon.net/nx/global/login_box/button_signup_large.gif) no-repeat;display:block;width:152px;height:65px;text-indent:-9999px;position:absolute;top:45px;left:6px;} .button_signup:hover{background-position:100% 0;}/*hover state for button*/ .button_find_id{position:absolute;bottom:45px;margin-left:15px;} .button_find_pw{position:absolute;bottom:45px;right:15px;} .button_account_info{position:absolute;bottom:45px;margin-left:23px;} .button_logout{position:absolute;bottom:45px;right:22px;} /*Style the Welcome message when users are logged in*/ #LoginBoxWelcome{position:absolute; left:20px; top:35px; width:141px; height:100px; background:url(http://nxcache.nexon.net/nx/global/login_box/login_background_loggedin.gif) no-repeat;font:bold 12px Verdana, Arial, Helvetica, sans-serif;text-align:center;} /*style the Hello NexonUser and Welome message inside the LoginBox, only appears when user is logged in */ .hello{padding:8px 0 10px;position:absolute;left:6px;top:6px;width:129px;height:auto;background:#eee;} .welcome{padding:10px 0;position:absolute;left:6px;top:50px;width:129px;height:auto;font-size:10px;color:#ff9900;} /*When logged in, wrap the links inside a span with the class of "loggedin_text_buttons"*/ .loggedin_text_buttons{display:block;text-align:center;color:#333;font:bold 8px Verdana, Arial, sans-serif;padding-top:73px;text-transform:uppercase;} .loggedin_text_buttons a{padding:0 5px;} .loggedin_text_buttons a:link{color:#333;text-decoration:underline;} .loggedin_text_buttons a:visited{color:#333;text-decoration:underline;} .loggedin_text_buttons a:hover{color:#0b53ad;text-decoration:underline;} .loggedin_text_buttons a:active{color:#333;text-decoration:underline;} /*When logged out, wrap the links inside a span with the class of "loggedout_text_buttons"*/ .loggedout_text_buttons{display:block;text-align:center;color:#333;font:bold 8px Verdana, Arial, sans-serif;padding-top:5px;text-transform:uppercase;} .loggedout_text_buttons a{padding:0 5px;} .loggedout_text_buttons a:link{color:#333;text-decoration:underline;} .loggedout_text_buttons a:visited{color:#333;text-decoration:underline;} .loggedout_text_buttons a:hover{color:#0b53ad;text-decoration:underline;} .loggedout_text_buttons a:active{color:#333;text-decoration:underline;} /************DROP DOWN MENU**************/ /*Style the drop-down menu and define its dropdown behavior */ #MainMenu {background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/menu-bg.png) no-repeat;width:854px;height:51px;font-family:'Lucida Grande','Lucida Sans Unicode',Tahoma, sans-serif;font-size:13px; position:relative;/*allow the dropdown to sit on top of all other page elements*/ z-index:2147483647 ;/*by setting a high z-index*/ } #MainMenu li {float:left;list-style:none;padding:15px 0 13px 0;position:relative; } #MainMenu li ul {/*display the sub-menus as none, but upon hover, reveal them to the world*/ display: none;position:absolute;top:45px;border:4px solid #004464;background:#fff;-moz-border-radius:7px;-webkit-border-radius:7px;border-radius:7px;padding-top:4px; z-index:1000;/*always display the menu over any elements on the page*/ } #MainMenu li:hover ul, #MainMenu li.hover ul/*the 2nd declaration is to fix IE6 bug*/ {display: block;} #MainMenu li ul.games_dropdown {width:172px;left:3px;} #MainMenu li ul.community_dropdown {width:172px;left:20px;} #MainMenu li ul.news_dropdown {width:96px;left:25px;} #MainMenu li ul.support_dropdown {width:136px;left:24px;} #MainMenu li ul.charge_dropdown {width:136px;left:32px;} #MainMenu li ul li {margin:0;padding:0;clear:both} #MainMenu li ul li.last {padding-bottom:11px;} #MainMenu li ul li a{outline:none;color:#2c53ad;line-height:21px;padding:0 5px 2px 11px;width:150px;display:block;position:relative} #MainMenu li ul li a:hover{background:#ff9900;color:#fff;padding-left:5px;margin-left:6px;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;text-decoration:none} /*Adjust the widths of the links per it's respectiv dropdown*/ #MainMenu li ul.news_dropdown li a{width:74px} #MainMenu li ul.support_dropdown li a, #MainMenu li ul.charge_dropdown li a{width:114px} /*style the main links inside the Main Menu(Games, Community, Download, News, Support)*/ .games_button{/*style the Games button*/ background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/menu-games.png) no-repeat;width:68px;min-height:23px;text-indent:-9999px;display:block;margin-left:29px;} .community_button{/*style the Community button*/ background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/menu-community.png) no-repeat;width:117px;min-height:23px;text-indent:-9999px;display:block;margin-left:52px;} .downloads_button {/*style the Downloads button*/ background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/menu-downloads.png) no-repeat;width:119px;min-height:23px;text-indent:-9999px;display:block;margin-left:42px;} .news_button {/*style the News button*/ background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/menu-news.png) no-repeat;width:59px;min-height:23px;text-indent:-9999px;display:block;margin-left:44px;} .charge_button{/*style the Charge NX button*/ background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/menu-charge.png) no-repeat;width:109px;min-height:23px;text-indent:-9999px;display:block;margin-left:43px;} .support_button{/*style the Support button*/ background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/menu-support.png) no-repeat;width:89px;min-height:23px;text-indent:-9999px;display:block;margin-left:51px;} /*shift the background images to the left to reveal rollover state*/ .games_button:hover, .games_active, .community_button:hover, .community_active, .downloads_button:hover, .news_button:hover, .news_active,.charge_button:hover, .charge_active,.support_button:hover, .support_active{background-position:100% 0;} /*nub and other adjustements on drop-down menus*/ .dd-top {background:url(../global/dropdown_menu/dd-top.png) no-repeat 0 0;width:100%;height:6px;top:-13px;} #MainMenu li ul li.dd-forums{background:#f9f6ef;color:#666;border-bottom:dashed 1px #d7ccb9;width:100%;padding:2px 0 3px 12px ;width:160px;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;margin:-10px 0 10px;} .games_dropdown .dd-top{background-position:50px 0} .community_dropdown .dd-top{background-position:80px 0} .news_dropdown .dd-top{background-position:40px} .charge_dropdown .dd-top{background-position:55px 0} .support_dropdown .dd-top{background-position:60px 0} .new{background:url(../global/dropdown_menu/dd-new.png) no-repeat;width:23px;height:9px;position:absolute;margin-top:8px;margin-left:5px} #MainMenu li ul li a:hover .new{background-position:0 100%} /************HEADER AND CONTENT SECTIONS********************/ #IndexPageHeader{/*this houses the EventSlideshow, appears only on the home page*/ background:#5e88d8;width:854px;height:268px;float:left;} #MainContent {/*this houses the content of the site, existing pages, etc*/ background:#FFF;width:605px;float:right;padding:0 25px 50px 20px;margin-top:5px;/*on the home page, space a bit less from the header region*/ } #Shoutout{margin-left:-20px;} body.non_index #MainContent{margin-top:6px;padding-top:15px;height:auto;}/*on pages other than home, space a bit father from the header region*/ body.non_index #MainContent h2{border-bottom:solid 3px #ececec;width:610px;display:block;text-indent:-9999px;margin-top:5px;}/*style the titles of the Main Content area*/ /*define the breadcrumb navigation style that is inline with the MainContent title (example:Home>Support>FAQ)*/ .nav_breadcrumb{position:absolute;right:20px;top:10px;text-align:right;font:11px Verdana, Arial, sans-serif;color:#444;padding-top:10px;/*push down to align with header*/} .nav_breadcrumb a{color:#666;text-decoration:none;font-weight:bold;} .nav_breadcrumb a:hover{color:#0b53ad;text-decoration:underline;} #Spotlight{/*contains News and Notices section*/ background:#fff;clear:both; } /*style some images related to the layout of the page*/ .rounded_edge{position:absolute;top:319px;left:208px;}/*position an inverted edge graphic (not possible with JS) on the home page - updated 09-03-23, adjust position for revised phase 2*/ body.non_index .rounded_edge{position:absolute;top:51px;left:208px;}/*position an inverted edge graphic (not possible with JS) on pages other than the homepage - updated 09-03-23, adjust position for revised phase 2*/ /*.page_banner{float:right;margin-top:5px;clear:right;}position the page banner that goes on pages other than the homepage*/ /************ NAVIGATION SIDE BOX ********************/ /*Style the navigation box in the far left side of non-index pages*/ #SideNavigation{font-size:12px;font-weight:bold;width:194px;background:#fff;float:left;margin-top:10px;padding:5px;} #SideNavigation ul{background:#f6f6f6;width:186px;display:block;margin:0 auto;border-left:solid 4px #b1c5e8;border-right:solid 4px #b1c5e8;} #SideNavigation ul li{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_list_bg.gif);height:28px;padding-left:16px;padding-top:5px;}/*give each list item a background image (difficult to replicate with pure CSS)*/ #SideNavigation ul li.last_list_item{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_last_list_bg.gif);}/*if it is the last list item, give a different background (no bottom border graphic)*/ /*Style the links inside the navigation side box*/ #SideNavigation a:link, #SideNavigation a:visited, #SideNavigation a:active{color:#666;text-decoration:none;} #SideNavigation a:hover{color:#0b53ad;text-decoration:underline;} #SideNavigation a.current_page{/*when user is on the page, add this class to the corresponding element to indicate current page*/ color:#ff5a00;text-decoration:underline;} #SideNavigation h2{/*each box has a header, which we will be replacing with an image in the subsequent declaration*/ display:block;margin:0 auto;width:194px;height:37px;text-indent:-9999px;} /*define the individual navigation side box headers*/ .charge{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_charge.gif) no-repeat;}/*an h2 with a class of 'charge' will get the "Charge" image*/ .news{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_news.gif) no-repeat;}/*and so forth*/ .downloads{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_downloads.gif) no-repeat;} .etc{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_etc.gif) no-repeat;} .myaccount{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_myacconut.gif) no-repeat;} .new_to_nexon{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_new_to_nexon.gif) no-repeat;} .passport{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_passport.gif) no-repeat;} .signup{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_signup.gif) no-repeat;} .support{background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_support.gif) no-repeat;} .bottom_list{/*presentational div used to round the bottom edge of the list (cannot replicate with JS)*/ background:url(http://nxcache.nexon.net/nx/global/side_navigation/tab_bottom_list.gif) no-repeat;width:194px;height:6px;margin:0 auto;} /************ GAME BANNERS ON HOMEPAGE *******updated 09-03-23 for new graphics and games*/ #GameLinks{ width:627px;float:left;background:/*url(http://nxcache.nexon.net/nx/main_page/game_links/gamelink_bg.png) 399px bottom no-repeat*/#fff;padding-bottom:15px; } #GameLinks li{/*modify the section to look more like a table without, guess what, using a table!*/ list-style:none;float:left;margin-bottom:8px;margin-right:10px } #GameLinks li a{/*modify the section to look more like a table without, guess what, using a table!*/ display:block;width:145px;height:80px;text-indent:-9999px;} #GameLinks li a:hover{background-position:100% 0 !important;} /************ SPOTLIGHT NEWS AND NOTICES ON HOME PAGE ************updated 09-03-23 for adding game icons*/ /*Style the drop-down menu and define its dropdown behavior */ #NewsHeader{/*style the header of the news section*/ background:url(http://nxcache.nexon.net/nx/main_page/news_and_notices/news_header.gif) no-repeat;display:block;width:605px;height:24px;margin-bottom:10px;position:relative;} #SectionAll{/*style the All button inside the news header*/ background:url(http://nxcache.nexon.net/nx/main_page/news_and_notices/section_all.gif) no-repeat;width:70px;height:15px;display:block;text-indent:-9999px;position:absolute;left:165px;top:7px;} #SectionNotices{/*style the Notices button inside the news header*/ background:url(http://nxcache.nexon.net/nx/main_page/news_and_notices/section_notices.gif) no-repeat;width:70px;height:15px;display:block;text-indent:-9999px;position:absolute;left:248px;top:7px;} #SectionEvents{/*style the Events button inside the news header*/ background:url(http://nxcache.nexon.net/nx/main_page/news_and_notices/section_events.gif) no-repeat;width:67px;height:15px;display:block;text-indent:-9999px;position:absolute;left:328px;top:7px;} /*#SectionUpdates{/*style the Updates button inside the news header background:url(http://nxcache.nexon.net/nx/main_page/news_and_notices/section_updates.gif) no-repeat;width:64px;height:15px;display:block;text-indent:-9999px;position:absolute;left:405px;top:7px;}*/ #SectionPress{/*style the Press button inside the news header*/ background:url(http://nxcache.nexon.net/nx/main_page/news_and_notices/section_press.gif) no-repeat;width:64px;height:15px;display:block;text-indent:-9999px;position:absolute;left:405px;top:7px;} #SectionAll:hover, #SectionNotices:hover, #SectionEvents:hover, #SectionUpdates:hover, #SectionPress:hover{background-position:100% 0;}/*shift the image to the left to reveal rollover state*/ #SectionAll.active_section, #SectionNotices.active_section, #SectionEvents.active_section, #SectionUpdates.active_section, #SectionPress.active_section{background-position:100% 0;} .section_more{/*style the More button inside the news header*/font: 10px Verdana, sans-serif;position:absolute;right:10px;top:9px;} .section_more:link, .section_more:visited, .section_more:active{color:#666;text-decoration:underline;} .section_more:hover{color:#4570e0;text-decoration:underline;} #NewsSection{/*style the News section directly below the News header, this is an UL*/ width:605px;list-style:none;} #NewsSection li{/*style individual rows of the News section*/ display:block;float:left;border-bottom:solid 1px #e5e5e5;min-height:20px;margin-top:5px;} #NewsSection li span{/*use span tags to assemble the columns of information*/ display:block;float:left;color:#666;font:11px Arial, Verdana, Helvetica, sans-serif;text-align:left;} #NewsSection li span a:link, a:visited, a:active{/*style the links inside the rows (used for the subject line, if you click on it you reveal or collapse the text panel*/ text-decoration:none;color:#666;} #NewsSection li span a:hover{text-decoration:underline;color:#4570e0;} span.game_icon img{margin-top:-2px;}/*added game icons, adjust positioning in relation to category icon*/ body.non_index span.game_icon{margin-top:1px;}/*game icons for subpages*/ span.category{margin:0 8px;/*this span houses the category icon*/} body.non_index span.category{margin:0 8px 0 4px;}/*adjust category icons on subpages*/ span.category img{display:block;vertical-align:middle;/*align the icon to the middle of the row*/} span.subject{width:420px;/*make the subject column very wide*/} span.date{width:75px;} .expanded_text{/*style the text area of revealed text (shown after clicking its respective subject header)*/ font:11px Arial, Verdana, sans-serif;width:490px;height:100px;background:#f2f2f2;padding:15px 40px 0 50px;margin:20px 0 10px 8px;position:relative;} .expanded_text a{/*style the MORE link inside the expanded text area*/ position:absolute;top:90px;right:35px;font: 10px Verdana, sans-serif;color:#333;} .expanded_text a:link, .expanded_text a:visited, .expanded_text a:active{color:#333;text-decoration:underline;} .expanded_text a:hover{color:#4570e0;} #NewsSection li.no_border{border-bottom:none;}/*when a tab is expanded, remove the bottom gray border. when it is collapsed, remove this class to bring back the stroke*/ /************ AD AND BANNER SPACE ********************/ /*Style the sections devoted to ad space and banners*/ #AdColumn{float:left;clear:left;} #AdColumn img {display:block;padding:2px 5px 3px 5px;} #RightEventHeaderAdUnit{position:absolute;left:874px;top:0;} .top_a{margin-top:20px;}/*give the top ad in the Ad column a bit more space from the elements above it*/ .bottom_a{margin-top:5px} /************ THE FOOTER ********************/ /*Style the footer elements and links*/ #Footer{clear:both;font:11px Arial, Verdana, Helvetica, sans-serif;text-align:center;padding-top:30px;} #Footer a:link, #Footer a:visited, #Footer a:active{color:#666;text-decoration:none;} #Footer a:hover{color:#5e88d8;text-decoration:underline;} /*New Footer*/ #legal {height:32px;line-height:32px;text-align:left;padding-left:220px;color:#666;clear:both;font-size:12px} #legal a {color:#666;text-decoration:none;} #legal a:hover {text-decoration:underline;} #global-footer {background:url(http://nxcache.nexon.net/nx/global/footer_img/footer_bg01.gif) 0 0 repeat-x;min-width:912px;height:59px;padding-left:66px;text-align:left;clear:both} #global-footer a, #global-footer img{display:block;} /************ EVENT SLIDESHOW ********************/ /*Style the Event Slideshow and header section on the main page*/ #EventContentHeader{/*this contains the slideshow and the ad unit*/ background:#FFF;width:835px;padding:5px 0 5px 5px;position:relative;margin:0 auto;min-height: 250px;height: auto !important;height:250px;} #EventSlideshow{/*the div where the slideshow will appear. Declare absolute so the z-index can be lower than the dropdown menu that will rest on top of it*/ width:525px;float:left;position:absolute;z-index:1;list-style:none;display:none;} #EventHeaderAdUnit{/*the div where the a 300x250 ad will appear*/ width:300px;margin-left:530px;position:relative; } #NavigateSlideshow {/*style the navigation interface of the slideshow EDITED FOR NEAL 01-26-2010*/ font:bold 12px Arial, Verdana, Helvectica, sans-serif; position:absolute;z-index:2;top:225px;left:265px;background:url(http://nxcache.nexon.net/nx/main_page/slideshow_interface/buttons_background.png) no-repeat;display:block;width:245px; height:30px;padding-left:15px;padding-top:6px;display:none;} #NavigateSlideshow li{float: left;list-style: none} #NavigateSlideshow a{/*style the individual navigation buttons*/ margin-right:3px; text-decoration: none;text-align:center; color:#000;background:url(http://nxcache.nexon.net/nx/main_page/slideshow_interface/inactive_background.png) no-repeat;display:block;width:17px;height:17px;padding-top:1px;} #NavigateSlideshow a.activeSlide{/*added by jQuery, this class will highlight the current selected button corresponding to its slide*/ background:url(http://nxcache.nexon.net/nx/main_page/slideshow_interface/active_background.png) no-repeat;} #NavigateSlideshow a:focus {outline: none;} .previous_slide{/*style the previous button on the slideshow navigation interface*/ position:absolute;left:447px;top:231px;background:url(http://nxcache.nexon.net/nx/main_page/slideshow_interface/button_previous.png) no-repeat;display:block;width:17px;height:17px;text-indent:-9999px;z-index:3;} .next_slide{/*style the next button on the slideshow navigation interface*/ position:absolute;left:467px;top:231px;background:url(http://nxcache.nexon.net/nx/main_page/slideshow_interface/button_next.png) no-repeat;display:block;width:17px;height:17px;text-indent:-9999px;z-index:3;} .previous_slide:hover,.next_slide:hover{background-position:100% 0;} .slide_control{/*style the play/pause button on the slideshow navigation interface*/ position:absolute;left:487px;top:231px;background:url(http://nxcache.nexon.net/nx/main_page/slideshow_interface/button_controls.png) no-repeat;display:block;width:17px;height:17px;text-indent:-9999px;z-index:3;} /********** Career Page Styles ***/ .career_copy {color:#444444; font:11px Arial, Helvetica, sans-serif; padding: 10px 15px 35px 15px;} .career_page_title {color:#444444; font:12px Arial, Helvetica, sans-serif; padding:0px 30px 10px 15px;} .career_position_title {color:#444444; font:12px Arial, Helvetica, sans-serif; padding-left: 5px; text-decoration:none} .career_position_title a {color:#444444; text-decoration: none;} .career_position_title a:visited {color:#444444;} .career_position_title a:hover {text-decoration:underline; color:#FF6600} .career_content {width:602px; border:none; text-align:left; padding:0px; margin:20px 0px 0px 0px;} .career_content img {border:none;} .career_content ul {padding-left:50px; list-style-type:disc;} .career_content li {padding-bottom:2px;} .career_icon {width:10px; float:left; height:10px; background: url(http://nxcache.nexon.net/nx/sub_pages/etc/careers/career_icon_cross.gif) no-repeat; margin-top:2px;} .career_listing {margin:0 0 0 12px;} .career_post {padding-top:14px; margin:0 0 15px 15px;} #career_title {color:#444444; font:bold 15px Arial, Helvetica, sans-serif; padding:15px 15px 20px 15px;} #careers_all {text-align:right; width:123px; padding:15px 0 20px 0; vertical-align:top;} .career_benefit {color:#444444; font:12px Arial, Helvetica, sans-serif; padding:0 5px 0 15px;} .career_small_header {color:#444444; font:bold 12px Arial, Helvetica, sans-serif; padding:20px 5px 0px 15px; margin-bottom: 0px;} .career_copy1 {color:#444444; font:normal 11px Arial, Helvetica, sans-serif; padding:0 15px;} .career_copy2 {color:#666666; font:normal 11px Arial, Helvetica, sans-serif; padding:0 15px;} .career_footer {color:#444444; font:normal 11px Arial, Helvetica, sans-serif; padding:20px 15px;} .career_email {color:#FF6600; font:11px Arial, Helvetica, sans-serif; padding-left: 5px;} .career_email a {color:#FF6600; text-decoration:underline;} .career_email a:hover {text-decoration:underline; color:#4F7CD2;} .career_divider {height:2px; background:url('http://nxcache.nexon.net/nx/sub_pages/etc/careers/career_dot.gif') repeat-x; width:602px;} .floatRight{float:right;} .floatLeft{float:left;} .clear {clear:both;} /********** Support Styles *************/ .cs_text_field, .cs_text_area {font:12px verdana; background-color:#FFFFFF; border:1px solid #C3CDDC; color:#333333; padding:1px 0 0 3px;} /* CS Styles */ .cs_enter_keywords {font:bold 12px Arial, Helvetica, sans-serif; color: #000000; padding: 2px 0 5px 25px;} .cs_body_copy {font: 12px Arial, Helvetica, sans-serif; color: #525050; padding: 2px 0 2px 22px;} .cs_body_copy_black {font: 12px Arial, Helvetica, sans-serif; color: #000000; padding-left:22px;} .cs_body_copy_small {font: 11px Arial, Helvetica, sans-serif; color: #000000;} .cs_body_copy_black_bold {font:bold 12px Arial, Helvetica, sans-serif; color: #000000; padding-left:22px;} .cs_body_copy_black_bold1 {font:bold 12px Arial, Helvetica, sans-serif; color: #000000; padding-right:15px;} .cs_log_cn_taxt {font: 12px Arial, Helvetica, sans-serif; color: #000000; padding-left:15px;} .cs_question {font:bold 12px Arial, Helvetica, sans-serif; color: #525252;} .cs_sub_title {font:bold 12px Arial, Helvetica, sans-serif; color: #000000; padding:20px 0 10px 0;} .cs_log_sub_title {font:bold 12px Arial, Helvetica, sans-serif; color: #000000; padding: 2px 0;} .cs_log_cn_title {font:bold 12px Arial, Helvetica, sans-serif; color: #00449e; padding: 4px 0 2px 30px;} .cs_log_cn_name {font: 12px Arial, Helvetica, sans-serif; color: #000000; padding-left: 30px;} .cs_sub_title_blue {font:bold 12px Arial, Helvetica, sans-serif; color: #54a2e8; padding: 5px 0 2px 0;} .cs_sub_title_blue1 {font:bold 12px Arial, Helvetica, sans-serif; color: #54a2e8;} a.cs_link:link, a.cs_link:hover {font: 12px Arial, Helvetica, sans-serif; color: #5494e8; text-decoration: underline;} a.cs_link:visited {font: 12px Arial, Helvetica, sans-serif; color: #5494e8; text-decoration: underline;} a.cs_link_black:link, a.cs_link_black:hover, a.cs_link_black:visited {font: 12px Arial, Helvetica, sans-serif; color: #000000; text-decoration: underline;} .cs_table_box {font:bold 12px Arial, Helvetica, sans-serif; color: #000000; padding: 2px 0 2px 25px;} .cs_table_box_text {font: 12px Arial, Helvetica, sans-serif; color: #000000; padding:0 0 4px 25px; line-height: 20px;} .cs_table_text_2 {font: 12px Arial, Helvetica, sans-serif; color: #000000; padding:0 0 4px 25px;} .cs_table_box_text_underline {font: 12px Arial, Helvetica, sans-serif; color: #000000; padding-left: 25px; line-height: 18px; text-decoration:underline;} .cs_input1 {font:bold 11px Verdana, Arial, Helvetica, sans-serif; color: #ffffff; padding: 2px 5px; background-color:#54a2e8; border:1px #7f9db9;} .cs_tips {font:bold 11px Arial, Helvetica, sans-serif; color: #54a2e8; padding-bottom: 6px;} .cs_text {font: 12px Verdana, Arial, Helvetica, sans-serif; color: #444444; padding:0 0 3px 5px;} .cs_copy_gray5 {font: 12px Verdana, Arial, Helvetica, sans-serif; color: #444444; padding:0px 10px 10px 30px; text-decoration: none;} .cs_star_red {font: 12px Verdana, Arial, Helvetica, sans-serif; color: #FF0000;} .cs_star_error {font: 11px Verdana, Arial, Helvetica, sans-serif; color: #FF0000; font-weight:bold;} .cs_close_text {font: 11px Verdana, Arial, Helvetica, sans-serif; color: #444444; padding:0 0 3px 5px; text-decoration:underline} /************ NEW TO NEXON PAGE ********************/ .sub_title{height:20px;margin-bottom:30px;}/*define the individual page title*/ #NewToNexon{font:11px Verdana, Arial, Helvetica, sans-serif;color:#666;width:545px;margin:0 auto;clear:both;} #NewToNexon h3{display:block;position:relative;} #NewToNexon p{padding:25px;} #NewToNexon img{padding-top:20px;} /*define individual headers within New to Nexon page*/ .what_is{background:url(http://nxcache.nexon.net/nx/sub_pages/support/new_to_nexon/new_to_nexon_txt_whatis.gif) no-repeat;width:163px;height:17px;text-indent:-9999px;left:25px;position:absolute;left:20px;top:7px;} .what_kind{background:url(http://nxcache.nexon.net/nx/sub_pages/support/new_to_nexon/new_to_nexon_txt_kindofgames.gif) no-repeat;width:347px;height:22px;text-indent:-9999px;position:absolute;left:20px;top:12px;} .free_to_play{background:url(http://nxcache.nexon.net/nx/sub_pages/support/new_to_nexon/new_to_nexon_txt_free2play.gif) no-repeat;width:252px;height:22px;text-indent:-9999px;position:absolute;left:20px;top:12px;} /*define the specific paragraph background styles below*/ .first_para{background:url(http://nxcache.nexon.net/nx/sub_pages/support/new_to_nexon/new_to_nexon_1st_para.gif) no-repeat;} .second_para{background:url(http://nxcache.nexon.net/nx/sub_pages/support/new_to_nexon/new_to_nexon_2nd_para.gif) no-repeat;} .third_para{background:url(http://nxcache.nexon.net/nx/sub_pages/support/new_to_nexon/new_to_nexon_3rd_para.gif) no-repeat;} /* GAME CLIENTS */ #game_clients div{width:602px; height:107px; } #game_clients div.dvd-order{height:101px;margin:20px 0 20px} #game_clients div.first{height:110px;margin-top:35px} #game_clients div.last{height:114px} #game_clients div img{margin:24px 0 0 477px;} #game_clients div.dvd-order img{margin:24px 0 0 477px;} #game_clients div.first img{margin:28px 0 0 477px;} /* DVD ORDER */ #dvd-order-header{background:url(http://nxcache.nexon.net/nx/sub_pages/downloads/bg-dvd-intro.png) no-repeat;width:572px;height:172px;padding:65px 0 0 30px;font:bold 12px Arial;color:#444;margin-top:-10px} #dvd-order-header strong{font-size:14px;margin-bottom:5px} #dvd-order-header ul{padding-left:10px;margin-bottom:15px} #dvd-order-header li{margin-bottom:3px} #dvd-order-header p{width:350px;margin-bottom:10px} #dvd-order-header p.faq{font-weight:normal} #dvd-order-header a{color:#5781d4} #dvd-order-body{background:#f3f2f2;width:584px;padding-left:18px} #dvd-order-footer{background:url(http://nxcache.nexon.net/nx/sub_pages/downloads/bg-dvd-footer.png) no-repeat;width:602px;height:11px} /****************************Store Locations*******************/ .cl{clear:both} .ac{margin:0 auto;display:block} #p-locations img.ac{margin-left:0} #p-locations{width:551px;padding:0 0 40px 49px;border:solid 1px #e2e3e3;padding-top:30px;-moz-border-radius:7px;-webkit-border-radius:7px} #MainContent #p-locations h2{text-indent:-9999px;border:none;clear:both} span.exp-col{width:13px;height:13px;background:url(http://nxcache.nexon.net/nx/sub_pages/store-locations/btn-exp-col.png) no-repeat;position:absolute;top:7px;right:8px;cursor:pointer} span.exp-col.exp{background-position:100% 0} #header-usa{background:url(http://nxcache.nexon.net/nx/sub_pages/store-locations/h-usa.png) no-repeat;width:505px;height:23px;text-indent:-9999px} #header-can{background:url(http://nxcache.nexon.net/nx/sub_pages/store-locations/h-can.png) no-repeat;width:505px;height:23px;text-indent:-9999px} #header-aus{background:url(http://nxcache.nexon.net/nx/sub_pages/store-locations/h-aus.png) no-repeat;width:505px;height:23px;text-indent:-9999px} #header-nzl{background:url(http://nxcache.nexon.net/nx/sub_pages/store-locations/h-nzl.png) no-repeat;width:505px;height:23px;text-indent:-9999px} .header-retail{background:url(http://nxcache.nexon.net/nx/sub_pages/store-locations/h-retail.png) no-repeat;width:505px;height:23px;position:relative;clear:both;} .header-food{background:url(http://nxcache.nexon.net/nx/sub_pages/store-locations/h-food.png) no-repeat;width:505px;height:23px;position:relative;clear:both} #p-locations ul{margin:10px 0 0;} #p-locations li{width:95px;height:53px;border:solid 1px #ebeaf0;float:left;margin:0 5px 5px 0;-moz-border-radius:5px;-webkit-border-radius:5px} #p-locations li:hover{border:solid 1px #2c84e1} #list-nzl, #list-aus{float:left;padding-bottom:15px} #usf,#car,#caf{margin-bottom:20px;float:left} /*Business Opportunities*/ #p-biz-op{padding:0 20px} #p-biz-op img{display:block;clear:both;margin-bottom:5px} #p-biz-op p{margin-bottom:30px;font-size:12px;font-family:Verdana;line-height:18px} #p-biz-op a{color:#666;font-weight:bold} p.support-link{font-weight:bold;border-top:solid 1px #bdbdbd;padding-top:18px} #p-biz-op p.support-link a{color:#ff5a00} #p-biz-op p.support-link a:hover{text-decoration:underline} /* SITEMAP */ #sitemap {text-align:left; font:11px Verdana, Arial, sans-serif; color:#444;} #sitemap a{color:#666; text-decoration:none; font-weight:normal;} #sitemap a:hover{color:#0b53ad; text-decoration:underline;} #sitemap ul{vertical-align:top;} #sitemap li{padding:7px 0 0 20px;} #sitemap div{height:175px; margin-bottom:20px; padding-left:17px;} #sitemap_forum{background:url(http://nxcache.nexon.net/nx/sub_pages/etc/sitemap/bg_forum.gif) no-repeat bottom; margin-left:-25px; vertical-align:top;} #sitemap_forum_link{margin-left:25px; color:#afa18a; vertical-align:top;} #sitemap_forum a{color:#afa18a; font-weight:bold;} .sitemap_inactive {color:#c3c3c3;} /* HOMEPAGE HELP */ #homepageHelp {background:url(http://nxcache.nexon.net/nx/sub_pages/support/homepage_help/bg_help.jpg) no-repeat bottom; padding-bottom:180px; color:#777777; font-weight:bold; font-size:12px;} #homepageHelp img{border:none; text-align:left; display:block; margin:0 0 0 0; padding:0 0 5px 0;} #homepageHelp p{text-align:left; margin:0 0 0 0; padding:0 20px 20px 20px;} #help_support {width:350px;} /************ UPDATES STYLES (PRESS, NEWSLETTER, EVENTS) ********************/ .contentHeader {font:bold 11px Verdana, Arial, Helvetica, sans-serif;color: #5a78cc;background:url(http://nxcache.nexon.net/nx/sub_pages/news/header_background.gif) no-repeat;width:602px;height:30px;position:relative;margin-top:20px;} .contentHeader div {float:left;} .categoryHeader {position:absolute;left:8px;top:8px;} .subjectHeader {position:absolute;left:245px;top:8px;} .dateHeader {position:absolute;left:487px;top:8px;} .viewsHeader {position:absolute;left:550px;top:8px;} .UpdateSection{width:605px;list-style:none;} .UpdateSection li{display:block;float:left;border-bottom:solid 1px #e5e5e5;min-height:22px;margin-top:12px;} .UpdateSection li span{/*use span tags to assemble the columns of information*/ display:block;float:left;color:#666;font:11px Verdana, Arial, Helvetica, sans-serif;text-align:left;} .UpdateSection li span a:link, a:visited, a:active{/*style the links inside the rows (used for the subject line)*/ text-decoration:none;color:#666;} .UpdateSection li span a:hover{text-decoration:underline;color:#4570e0;} .UpdateSection .category{margin:0 18px;} .UpdateSection .category img{/*align the icon to the middle of the row*/ display:block;vertical-align:middle;} .UpdateSection .subject{width:385px;} .UpdateSection .date{text-align:center;width:80px;} .UpdateSection .views{text-align:center;width:55px;} .UpdateSection .last_list_item{border-bottom:solid 2px #c1d6f9;} .UpdateNavigation, .UpdateNav {font:11px Verdana, Arial, Helvetica, sans-serif;color: #666;float:right;margin-right:5px;margin-top:7px;} .UpdateNavigation img {margin:0;vertical-align:middle;} .UpdateNavigation a {padding:0 1px;text-decoration:none;color:#666;} .UpdateNavigation a:hover {text-decoration:underline;color:#0b53ad;} .update_current_page{color:#fb0000;padding:0 1px;} .contentPostHeader{font:bold 11px Verdana, Arial, Helvetica, sans-serif;color: #5a78cc;background:url(http://nxcache.nexon.net/nx/sub_pages/news/header_background_post.gif) no-repeat;width:602px;height:30px;position:relative;margin-top:35px;padding:8px 0 0 17px;} .UpdateContent{font:11px Verdana, Arial, Helvetica, sans-serif;padding:10px 20px;border-bottom:solid 3px #c1d6f9;margin-bottom:7px;} .update_content_date{text-align:right;font:11px Verdana, Arial, sans-serif;color:#444;border-bottom:solid 1px #e5e5e5;width:602px;padding-bottom:5px;} /**************FREE TO PLAY STYLES****************************/ #FreeToPlay{padding:20px 25px 0 25px;font-size:12px;} #FreeToPlay h2{cursor:pointer;border-bottom:dashed 1px #f0f0f0;margin-bottom:10px;display:block;} #FreeToPlay p{padding-left:30px;text-align:left;padding-bottom:10px;} #FreeToPlay img{position:absolute;right:5px;top:5px;cursor:pointer;} #FreeToPlay .question_one{background:url(http://nxcache.nexon.net/passport/signup/2009_signup/txt_what_is_free2play.gif) no-repeat;text-indent:-9999px;height:29px;} #FreeToPlay .question_two{background:url(http://nxcache.nexon.net/passport/signup/2009_signup/txt_how_make_money.gif) no-repeat;text-indent:-9999px;height:29px;} #FreeToPlay .question_three{background:url(http://nxcache.nexon.net/passport/signup/2009_signup/txt_free_games_reason.gif) no-repeat;text-indent:-9999px;height:29px;} /*Below is the jQuery jModal pop-up styles. Use this to change the box the content displays inside of, background color, etc*/ .jqmWindow { display: none;/*jQuery changes this to display once the trigger is fired*/ position:absolute;/*fixed also works*/ top: 30%; left: 50%; margin-left: -313px; width: 575px;/*the padding inside FreeToPlay div may conflict with this width, make sure to change the padding on FreeToPlay to adjust*/ height:350px; background-color: #fff; color: #333; border: 1px solid black; } .jqmOverlay {background-color: #000;} .dd_itcg_inactive{width:133px;display:block;text-indent:-9999px;background:url(http://nxcache.nexon.net/nx/global/dropdown_menu/dropdown_itcg_inactive.gif) no-repeat;margin-bottom:5px;}.dd_itcg_inactive:hover{background-position:100% 0;} /****************Parature Iframe Styling*************************/ #parature-tabs {height:24px;padding:0 0 9px 30px;background:url(http://nxcache.nexon.net/nx/global/parature/parature-header.png) 0 100% no-repeat;} #parature-tabs a, #parature-tabs a span{font-size:12px;display:block;float:left;color:#444;height:24px;line-height:24px;text-decoration:none;background:url(http://nxcache.nexon.net/nx/global/parature/parature-tabs.png) 0 0 no-repeat;} #parature-tabs a span {padding-right:10px;background-position:100% 100%;} #parature-tabs a {padding-left:10px;margin-right:3px;background-position:0 100%;} #parature-tabs a:hover span, #parature-tabs a.active span {background-position:100% 0;} #parature-tabs a:hover, #parature-tabs a.active {background-position:0 0;} #parature-body {position:relative;clear:both;padding:10px;background:url(http://nxcache.nexon.net/nx/global/parature/parature-body.png) 0 0 repeat-y;} #parature-body iframe {border:0;} #parature-header {height:10px;background:url(http://nxcache.nexon.net/nx/global/parature/parature-header.png) 0 0 no-repeat;} #parature-footer {height:48px;background:url(http://nxcache.nexon.net/nx/global/parature/parature-footer.png) 0 0 no-repeat;} #parature-loading {position:absolute;top:80px;left:0;right:0;text-align:center;color:#444;} /***************Charge Account New Payment Methods**************************/ .cl{clear:both} input{border:none} #PaymentTop{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg-PaymentTop.png) no-repeat;width:602px;height:7px;margin-top:30px} #PaymentBot{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg-PaymentBot.png) no-repeat;width:602px;height:7px;margin-bottom:30px} #PaymentOptions{background:#dfeafb;width:592px;padding:0 5px;} #PaymentOptions ul{position:relative;z-index:100} #PaymentOptions li{float:left;cursor:pointer;text-indent:-9999px} #btnEarnNX{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/btnEarnNX.png) no-repeat;width:148px;height:148px;} #btnGameCards{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/btnGameCards.png) no-repeat;width:150px;height:148px;} #btnChargeOnline{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/btnChargeOnline.png) no-repeat;width:147px;height:148px;} #btnChargeMobile{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/btnChargeMobile.png) no-repeat;width:147px;height:148px;} #btnEarnNX:hover, #btnGameCards:hover, #btnChargeOnline:hover, #btnChargeMobile:hover{background-position:50% 0} #btnEarnNX.active, #btnGameCards.active, #btnChargeOnline.active, #btnChargeMobile.active{background-position:100% 0;} #optionGameCards, #optionChargeOnline, #optionChargeMobile, #optionEarnNX{display:none;background:#fff;width:588px;margin:-5px 0 0 2px} #optionGameCards .section-top{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg-GameCards.png) no-repeat #fff;height:18px;} #optionChargeOnline .section-top{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg-ChargeOnline.png) no-repeat #fff;height:19px} #optionChargeMobile .section-top{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg-ChargeMobile.png) no-repeat #fff;height:18px} #optionEarnNX .section-top{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg-EarnNX.png) no-repeat 0 -1px #fff;height:19px} #optionGameCards{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/optionGameCards.png) 0 30px no-repeat #fff;min-height:320px;font:bold 12px Arial;text-align:center;position:relative;-moz-border-radius-bottomleft:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px;padding-bottom:10px;} #optionGameCards strong{color:#ff6600} #optionGameCards p{margin-top:205px;padding:0 50px;} #optionGameCards .btnRedeemCard{width:143px;height:116px;background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/btnRedeemCard.png) no-repeat;display:block;text-indent:-9999px;position:absolute;right:88px;top:60px} #optionGameCards .btnRedeemCard.inactive{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/btnRedeemCard-inactive.png) no-repeat;} #optionGameCards #btnStoreLocator{width:171px;height:32px;background:url(http://nxcache.nexon.net/nx/sub_pages/charge/cash_guide/store_locator.gif) no-repeat;display:block;text-indent:-9999px;margin:18px auto 0} #optionChargeOnline{padding-bottom:10px;-moz-border-radius-bottomleft:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px} #optionChargeOnline h3{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/txtChargeOnline.png) no-repeat;width:370px;height:14px;margin:30px auto 20px;text-indent:-9999px;} #optionChargeOnline ul{float:left;margin:0 0 40px 20px} #optionChargeOnline li{text-indent:0;margin:0 10px;} #optionChargeOnline p{font:11px Arial;color:#333;background:#f7f7f7;clear:both;padding:10px;width:528px;margin:40px auto 0;-moz-border-radius:5px;-webkit-border-radius:5px;} #optionChargeOnline p strong{font:bold 12px Arial;} #optionChargeMobile{background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/optionChargeMobile.png) 0 30px no-repeat #fff;padding-bottom:10px;-moz-border-radius-bottomleft:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px} #optionChargeMobile h3{display:none} #optionChargeMobile ul{float:left;margin:150px 0 30px 15px} #optionChargeMobile li{text-indent:0;margin:0 4px;} #optionChargeMobile p{font:11px Arial;color:#333;background:#f7f7f7;clear:both;padding:10px;width:528px;margin:40px auto 0;-moz-border-radius:5px;-webkit-border-radius:5px;} #optionEarnNX{padding-bottom:10px;-moz-border-radius-bottomleft:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px} #optionEarnNX p.info{font:bold 12px Arial;background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/optionEarnNXv2.png) 0 39px no-repeat #fff;width:316px;height:75px;margin:35px 0 0 20px;} #optionEarnNX strong{color:#ff6600} #optionEarnNX p.note{font:11px Arial;color:#333;background:#f7f7f7;clear:both;padding:10px;width:528px;margin:40px auto 0;-moz-border-radius:5px;-webkit-border-radius:5px;} #optionEarnNX input{float:right;margin:35px 35px 0 0} /*New Billing Options*/ #payment-top{background:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/box-top.png) no-repeat;height:7px;width:602px;margin-top:10px;} #payment-body{background:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/box-bg.png) repeat-y;width:572px;padding:9px 15px 10px} #payment-bot{background:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/box-bot.png) no-repeat;width:602px;height:7px;} .payment-option{background:#f3f2f2;border:solid 1px #e5e5e5;-webkit-border-radius:5px;-moz-border-radius:5px;width:367px;float:left;padding:15px 10px 0;font-size:12px;color:#444;margin-bottom:10px} .payment-option h3{border-bottom:solid 1px #eaeaea;padding-bottom:10px;height:15px} .payment-option h3 img{float:left} .payment-option h3 a{font-weight:normal;color:#5e88d8;font-size:11px;float:right;vertical-align:top} .payment-option h3 a:hover{text-decoration:underline} .payment-option ul{border-top:solid 1px #fff;padding-top:10px;} .payment-option li{margin-bottom:15px;float:left} .payment-option p{clear:both} .payment-option p img{float:left;margin-right:15px} .payment-option p input{float:left;margin-right:15px} .img{float:left;margin-right:10px} #note{background:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/bg-note.png) no-repeat;width:348px;height:63px;float:left;font-size:11px;color:#444;padding:37px 0 0 43px;margin:20px 0 20px 180px} #note a.btn{background:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/btn-nx-restrictions.png) no-repeat;width:303px;height:28px;text-indent:-9999px;display:block;margin-bottom:5px} #note a.link{color:#5e88d8;font-weight:bold} #NxRestrictions{padding:20px 25px 50px 25px;font-size:12px;} #NxRestrictions h2{display:block;height:15px;background:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/h-restrictions.png) no-repeat;text-indent:-9999px;padding-bottom:15px;border-bottom:solid 1px #f0f0f0;margin-bottom:7px} #NxRestrictions.jqmWindow{height:auto;top: 30%;left: 60%;} #NxRestrictions div{color:#999;font-size:11px;margin-bottom:25px} #NxRestrictions h3{cursor:pointer;border-bottom:dashed 1px #f0f0f0;margin-bottom:10px;display:block;text-indent:-9999px;height:25px;background:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/h-combat.png) no-repeat;} #NxRestrictions p{padding-left:30px;text-align:left;padding-bottom:10px;} #NxRestrictions img{position:absolute;right:5px;top:5px;cursor:pointer;} #NxRestrictions h3.active{background-position:0 100%} #NxRestrictions h3.maple{background-image:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/h-maple.png)} #NxRestrictions h3.mabinogi{background-image:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/h-mabinogi.png)} #NxRestrictions h3.dfo{background-image:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/h-dfo.png)} #NxRestrictions h3.poptag{background-image:url(http://nxcache.nexon.net/nx/sub_pages/charge-account/h-poptag.png)} .link-careers{background:#DDD4C3;padding:2px} /*Earn Free NX*/ #earn-free-nx {width:548px;padding:20px 27px 0;background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg_earn_free_nx.gif) 0 0 no-repeat;} #earn-free-nx p {color:#444;font-size:12px;line-height:16px;margin-top:0;} #earn-free-nx p + p {margin-top:16px;} #earn-free-nx p span {color:#f60;} #earn-free-nx a {color:#5781d4;} #earn-free-nx-mid {height:7px;font-size:7px;line-height:7px;background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg_earn_free_nx.gif) 0 -90px no-repeat;} #earn-free-nx-subtext {background:#F3F2F2;padding:6px 27px;color:#666;font-size:10px;width:548px;} #earn-free-nx-footer {height:7px;font-size:7px;line-height:7px;margin-bottom:20px;background:url(http://nxcache.nexon.net/nx/sub_pages/charge/charge_account/bg_earn_free_nx.gif) 0 100% no-repeat;} #free-nx-tabs {width:582px;padding-left:20px;margin-bottom:20px;height:47px;background:url(http://nxcache.nexon.net/nx/sub_pages/charge/earn_free_nx/3pxblue.gif) 0 100% repeat-x;} #free-nx-tabs a {width:140px;margin-right:1px;height:47px;float:left;display:block;background-position:0 0;background-repeat:no-repeat;} #free-nx-tabs a.active, #free-nx-tabs a.active:hover {background-position:100% 0;} #free-nx-tabs a:hover {background-position:50% 0;} #tab-sometrics {background-image:url(../sub_pages/charge/earn_free_nx/tab-gc.png);} #tab-superrewards {background-image:url(../sub_pages/charge/earn_free_nx/tab-sr.png);} #tab-peanutlabs {background-image:url(../sub_pages/charge/earn_free_nx/tab-pl.png);} #tab-radiumone{background-image:url(../sub_pages/charge/earn_free_nx/tab-r1.png);}