/* File: main.css Description: Contains CSS for the background, header, footer and main containers. Does NOT contain site-wide tag defaults other than BODY or HTML. Used: Aion Online Game Guide Forums ***** Table of Contents ****** Search for "##)" to find corresponding area AA) Default AB) Main Containers AC) Header -Search AD) Top Navigation -Nav bar buttons -Positioning -Nav Dropdown Menu -Expand Section -News Menu -About Menu -Game Guide Menu -Fixes to MainNav -Media Menu -Media and Service Menus -Forum Menu -Service Menu -Quick Links AE) Footer -Simple Footer Dark B) Buttons /******************************************** ** AA) Default /********************************************/ body, html {margin: 0; padding: 0;} body { font-size: 62.5%; color: #333; font-family: 'CartoGothicProBook',Arial, Helvetica, sans-serif; text-align: center; background: url(/global/includes/images/template-items/background.jpg) no-repeat 50% 0 #121213;} a[href$=".pdf"] { background: url("/global/includes/images/template-items/pdf_icon.png") no-repeat scroll 100% 0 transparent; display: inline-block; padding-right: 20px; } .hide-text{display: block;text-align: left;text-indent: -9999em;overflow: hidden;outline: none;} /******************************************** ** AB) Main Containers /********************************************/ #outer-container {width: 100%} .inner-container {margin: 0 auto; width: 987px; text-align: left} #aion-footer-container {margin-top: 25px;position: relative; background: rgb(28,28,30); /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFjMWMxZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE0JSIgc3RvcC1jb2xvcj0iIzEzMTMxNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE0JSIgc3RvcC1jb2xvcj0iIzI5MjkyYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE2JSIgc3RvcC1jb2xvcj0iIzFjMWMxZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMjEyMTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(28,28,30,1) 0%, rgba(19,19,20,1) 42px, rgba(41,41,43,1) 43px, rgba(28,28,30,1) 44px, rgba(18,18,19,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(28,28,30,1)), color-stop(42px,rgba(19,19,20,1)), color-stop(42px,rgba(41,41,43,1)), color-stop(44px,rgba(28,28,30,1)), color-stop(100%,rgba(18,18,19,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #121213 0%,rgba(19,19,20,1) 42px,rgba(41,41,43,1) 43px,rgba(28,28,30,1) 44px,rgba(18,18,19,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(28,28,30,1) 0%,rgba(19,19,20,1) 42px,rgba(41,41,43,1) 43px,rgba(28,28,30,1) 44px,rgba(18,18,19,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(28,28,30,1) 0%,rgba(19,19,20,1) 42px,rgba(41,41,43,1) 43px,rgba(28,28,30,1) 44px,rgba(18,18,19,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, #121213 0%,rgba(19,19,20,1) 42px,rgba(41,41,43,1) 43px,rgba(28,28,30,1) 44px,rgba(18,18,19,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1c1e', endColorstr='#121213',GradientType=0 ); /* IE6-8 */ } .show-bg{position: relative; margin-top: -500px; left: 0; bottom: -10px; height: 490px; width: 100%; z-index: -1; } #bg{position: absolute;z-index: -1;top: 0%;left: -4px;width: 100%;min-width:980px;height: 1100px;} #bg .logo-anim .anim-logo{margin: 0 auto !important; display: block; height: 347px; width: 782px; } body#fp #bg #flash-background {position: relative;top:-29px;left:-15px;width: 460px;} /******************************************** ** AC) Header /********************************************/ #aion-header {margin-left: 12px; position: relative;width: 960px; height: 310px; text-align: left;} #aion-header #main-logo {position: absolute;display: block;top: 49px;left: 329px;width: 267px;height: 96px;outline: none} #aion-header P, #aion-header UL, #aion-header LI, #aion-header H1, #aion-header H2, #aion-header H3, #aion-header H4, #aion-header H5, #aion-header H6, #aion-header blockquote, #aion-header IMG, #aion-header DIV { margin: 0; padding: 0; border: 0 none;} #aion-header H4 { text-transform: uppercase; } #aion-header UL, #aion-header H4, #aion-header H5 { color: #333; } #aion-header A { color: #06506E; } #aion-header UL LI SPAN { color: #717171; } body#fp #aion-header {margin-left: 12px; position: relative; width: 960px; height: 357px} body#fp #aion-header #main-logo {display: none} /*** Search ***/ #aion-header .search{position: absolute;bottom: 48px;right: 0;width: 320px;height: 33px;border: 1px solid #878787;background: url(/global/includes/images/template-items/nav/search_bg.png) no-repeat} #aion-header .search .input_border{position: absolute;width: 308px;height: 23px;left: 5px; top: 5px;border: 1px solid #707070;background:none #f7f7f7} #aion-header .search #search_input{padding: 3px 2px 2px;position: absolute;left: 6px;top: 6px;width: 150px;height: 18px;border: none; -moz-border-radius: 0;font-family: 'CartoGothicProBook'; font-size: 12px; color: #656363;background:none #f7f7f7} #aion-header .search #search_area{margin: 0;padding: 1px;position: absolute;left: 161px; top: 7px;width: 130px;height: 21px;border: 1px solid #E4E4E4;font-family: 'CartoGothicProBook'; font-size: 12px; color: #323030;background: #c9c9c9} #aion-header .search #search_submit{margin: 1px;position: absolute;z-index: 106;left: 291px; top: 6px;width: 21px; height: 21px; border: none; -moz-border-radius: 0;background: url(/global/includes/images/template-items/search_submit.png) no-repeat transparent;cursor: pointer} /******************************************** ** AD) Top Navigation /********************************************/ #aion-nav-bar {margin: 0;display: block; position: absolute; bottom: 0; width: 960px; height: 48px; background: url(/global/includes/images/template-items/lang-en/nav_bar.jpg) no-repeat} #aion-nav-bar ul {margin: 0; padding: 0; display: block} #aion-nav-bar li {list-style: none} #aion-nav-bar ul li.nav-bar-button {padding: 0; display: block; position: relative; height: 48px; float: left} #aion-nav-bar a.menu-button {display: block; height: 48px; outline: none; background: url(/global/includes/images/template-items/lang-en/nav_bar.jpg) no-repeat} #aion-nav-bar a.menu-button span {margin: 0; position: relative; left: -5000em} #aion-nav-bar .right li.nav-bar-button {margin-left: 1px} #aion-nav-bar .left li.nav-bar-button {margin-right: 1px} #aion-nav-bar ul.left {float: left} #aion-nav-bar ul.right {float: right} /*** Nav bar buttons ***/ #aion-nav-bar-news {width: 107px} #aion-nav-bar-news a.menu-button {background-position: 0 0;} /*background-position: 0 0*/ #aion-nav-bar-news > a.active {background-position: 0 -96px} #aion-nav-bar-news a.menu-button:hover, #aion-nav-bar-news > a.hover {background-position: 0 -48px;} #aion-nav-bar-about {width: 147px} #aion-nav-bar-about a.menu-button {background-position: -108px 0} #aion-nav-bar-about > a.active {background-position: -108px -96px} #aion-nav-bar-about a.menu-button:hover, #aion-nav-bar-about > a.hover {background-position: -108px -48px} #aion-nav-bar-guide {width: 160px} #aion-nav-bar-guide a.menu-button {background-position: -256px 0} #aion-nav-bar-guide > a.active {background-position: -256px -96px} #aion-nav-bar-guide a.menu-button:hover, #aion-nav-bar-guide > a.hover {background-position: -256px -48px} #aion-nav-bar-media {width: 148px} #aion-nav-bar-media a.menu-button {background-position: -541px 0} #aion-nav-bar-media > a.active {background-position: -541px -96px} #aion-nav-bar-media a.menu-button:hover, #aion-nav-bar-media > a.hover {background-position: -541px -48px} #aion-nav-bar-forums {width: 125px} #aion-nav-bar-forums a.menu-button {background-position: -690px 0} #aion-nav-bar-forums > a.active {background-position: -690px -96px} #aion-nav-bar-forums a.menu-button:hover, #aion-nav-bar-forums > a.hover {background-position: -690px -48px} #aion-nav-bar-services {width: 144px} #aion-nav-bar-services a.menu-button {background-position: -816px 0} #aion-nav-bar-services > a.active {background-position: -816px -96px} #aion-nav-bar-services a.menu-button:hover, #aion-nav-bar-services > a.hover {background-position: -816px -48px} /*** Positioning ***/ .nav-bar-left {z-index: 105; width: 73px; height: 173px; position: absolute; top: -38px; left: -53px; background: url(/global/includes/images/template-items/nav/nav_left.png) no-repeat transparent} .nav-bar-right {z-index: 105; width: 73px; height: 173px; position: absolute; top: -38px; right: -53px; background: url(/global/includes/images/template-items/nav/nav_right.png) no-repeat transparent} .nav-bar-center-top {position: absolute; z-index: 105;top: -97px; left: 296px; width: 368px; height: 106px; background: url(/global/includes/images/template-items/nav/nav_center.png) no-repeat transparent} .nav-bar-center-bottom {position: absolute; z-index: 109; top: 9px; left: 383px; width: 194px; height: 54px; background: url(/global/includes/images/template-items/nav/nav_center.png) no-repeat -87px -106px transparent} .nav-bar-center-bottom a.btn-decor-3 {display: inline-block; position: absolute; top: -11px; left: 15px; width: 164px; height: 53px; background: url(/global/includes/images/template-items/lang-en/btn_my_aion.png) no-repeat; outline: none} .nav-bar-center-bottom a.btn-decor-3 span {margin: 0; position: relative; left: -5000em} .nav-bar-center-bottom a.btn-decor-3:hover {background-position: 0 -53px} /*** Nav Dropdown Menu ***/ #aion-nav-bar .nav-menu {display: none; position: relative; z-index: 200; top: 0; width: 185px; overflow:hidden; height: 260px; border-right: 1px solid #525252; border-bottom: 1px solid #525252; border-left: 1px solid #525252; background: url(/global/includes/images/template-items/nav/nav_menu_bg.png) repeat-x #e3e3e3;-moz-box-shadow: 0 4px 5px #555;-webkit-box-shadow: 0 4px 5px #555;box-shadow: 0 4px 5px #555} #aion-nav-bar .right .nav-menu {float: right} #aion-nav-bar .nav-menu a.expand-menu{display: block; position: relative; z-index: 116; width: 19px; height: 100%; outline: 0 none;} #aion-nav-bar .left .nav-menu a.expand-menu{float: right; background: url(/global/includes/images/template-items/nav/nav_expand_right.png) -45px 50% no-repeat transparent} #aion-nav-bar .right .nav-menu a.expand-menu{float: left; background: url(/global/includes/images/template-items/nav/nav_expand_left.png) -45px 50% no-repeat transparent} #aion-nav-bar .nav-menu a.expand-menu:hover{background-position: -26px 50%} #aion-nav-bar .left .nav-menu a.expand-menu-expand-link, #aion-nav-bar .right .nav-menu a.expand-menu-expand-link{width: 13px;background-position: -13px 50%} #aion-nav-bar .left .nav-menu a.expand-menu-expand-link:hover, #aion-nav-bar .right .nav-menu a.expand-menu-expand-link:hover{background-position: 0 50%} #aion-nav-bar .left .nav-menu ul.nav-menu-items{float: left} #aion-nav-bar .right .nav-menu ul.nav-menu-items{float: right} #aion-nav-bar .nav-menu ul.nav-menu-items{padding: 12px 14px 0; width: 140px; height: 248px;border-right : 1px solid #b3b3b3; border-left :1px solid #b3b3b3} #aion-nav-bar .nav-menu ul.nav-menu-items > li {margin-left: 3px;padding: 7px 0 5px; background:url(/global/includes/images/template-items/nav/nav_menu_ul_bg.png) no-repeat center top transparent} #aion-nav-bar .nav-menu ul.nav-menu-items > li {font-family:'AdelonMedium';font-size:15px;font-weight: normal;text-shadow:0 1px 0 #fff;text-transform:uppercase;} #aion-nav-bar .nav-menu ul.nav-menu-items > li:first-child {background:none} #aion-nav-bar .nav-menu ul.nav-menu-items > li a {color: #3c474c} #aion-nav-bar .nav-menu ul.nav-menu-items > li a:visited {color: #3c474c} #aion-nav-bar .nav-menu ul.nav-menu-items > li a:hover {color: #2b6c8c} #aion-nav-bar .nav-menu ul.nav-menu-items > li a.extLink-large {padding-left: 20px;padding-right: 0;background-position: 0 0} #aion-nav-bar .nav-menu ul.nav-menu-items > li a.extLink-large:hover {background-position: 0 -32px} #aion-nav-bar .nav-menu UL LI { font-family: CartoGothicProBook,Arial,Helvetica,sans-serif; font-size: 12px; line-height: 18px;} /*** Expand Section ***/ #aion-nav-bar .expand-section {padding: 17px 10px 17px 27px; float: left;width: 233px;} #aion-nav-bar .left .expand-section {} #navnav-bar-about-collapsed-bar .right .expand-section {padding: 17px 27px 17px 12px} #aion-nav-bar .expand-section h3 {padding: 0 0 2px; font-size: 14px; line-height: 14px; color: #0c3d51} #aion-nav-bar .expand-section h4, #aion-nav-bar .expand-section-guide h4 {padding: 0 0 2px;font-family: 'CartoGothicProBold'; font-size: 13px; font-weight: normal} #aion-nav-bar .expand-section span + h4 {margin-top: 15px} #aion-nav-bar .expand-section h5 {padding: 0;font: normal 13px/15px 'CartoGothicProBook'} #aion-nav-bar #aion-nav-bar-about .expand-section h5 {letter-spacing: 0.3px} #aion-nav-bar .expand-section h5 + span {margin: 0 0 8px;padding: 0;display: block;font-weight: normal;line-height: 11px} #aion-nav-bar #aion-nav-bar-about .expand-section h5 + span, #aion-nav-bar #aion-nav-bar-media .expand-section h5 + span, #aion-nav-bar #aion-nav-bar-services .expand-section h5 + span {color: #333} #aion-nav-bar .expand-section span {margin-bottom: 6px;font-size: 11px; line-height:13px} #aion-nav-bar .expand-section span a {font-size: 13px} #aion-nav-bar .expand-section img.white-border {border: 2px solid #fff} #aion-nav-bar .expand-section img.double-border {padding: 1px;border: 1px solid #9d9d9d;background-color: #fff} /*** News Menu ***/ #aion-nav-bar #aion-nav-bar-news .nav-menu {width:460px;} /** Set width of menu expanded**/ /*** About Menu ***/ #aion-nav-bar #aion-nav-bar-about .nav-menu {margin-left: -12px; width:460px;} #aion-nav-bar #aion-nav-bar-about .expand-section img {margin: 0 0 4px} #aion-nav-bar #aion-nav-bar-about .expand-section a.learn-more {display: block;font-size: 11px;line-height: 10px} /*** Game Guide Menu ***/ #aion-nav-bar #aion-nav-bar-guide .nav-menu {margin-left: -5px;width: 640px;} #aion-nav-bar #aion-nav-bar-guide .nav-menu .expand-section ul { width: 190px; } .nav-bar-guide-expand-section-loading {margin:50px auto;width:48px;height:48px;background:url("/global/includes/images/template-items/loading.gif") no-repeat;} #aion-nav-bar #aion-nav-bar-guide .menu-nav-icon-plus { display: inline-block; width: 9px; height: 9px; background:url("/global/includes/images/template-items/arrows_nav.png") no-repeat; padding-right: 3px; } #aion-nav-bar #aion-nav-bar-guide .menu-nav-icon-minus { display: inline-block; width: 9px; height: 9px; background:url("/global/includes/images/template-items/arrows_nav.png") no-repeat 0 -14px; padding-right: 3px; } #aion-nav-bar #aion-nav-bar-guide .nav-menu .expand-section {padding: 17px 0 0; width: 470px} #aion-nav-bar #aion-nav-bar-guide .nav-menu .expand-section ul {margin: -18px 10px 0 0;padding: 19px 21px 0;float: left;height: 246px;} #aion-nav-bar #aion-nav-bar-guide .nav-menu .expand-section ul li {margin: 0;line-height: 145%} #aion-nav-bar #aion-nav-bar-guide .nav-menu .expand-section ul li a {color: #485357} #aion-nav-bar #aion-nav-bar-guide .nav-menu .expand-section ul li a:hover {color: #2b6c8c} #aion-nav-bar #aion-nav-bar-guide .nav-menu ul.nav-menu-items {width: 122px;} #aion-nav-bar #aion-nav-bar-guide .nav-menu ul.nav-menu-items li.menu-item {margin: -6px 0 0;padding: 2px 0 0;background-position: center 3px} #aion-nav-bar #aion-nav-bar-guide .nav-menu ul.nav-menu-items li.menu-item > a {margin-left: -14px;padding: 8px 0 3px 17px;display: block;width: 151px;height:23px;} #aion-nav-bar #aion-nav-bar-guide .nav-menu ul.nav-menu-items li.nav-bar-guide-menu-item-active > a {color: #fff; text-shadow: none;background:url("/global/includes/images/template-items/nav/nav_menu_li_hover.png") no-repeat} #aion-nav-bar #menu-guide-listing { width:175px; left:160px; top:0px; padding:15px 5px; position:absolute;height:100%; } #aion-nav-bar #menu-guide-listing h5 { padding-top: 5px; cursor: pointer; outline: 0 none; font: normal 13px/15px 'CartoGothicProBold' } #aion-nav-bar #menu-guide-listing li, #aion-nav-bar #menu-guide-listing h5 { position:relative; left:10px; } #aion-nav-bar #guide-collapse-me { width:255px } #aion-nav-bar .expand-section-guide { padding:17px 10px 0; width:270px;height: 100%;top:0px; right:0px; position:absolute; border-left : 1px solid #b3b3b3} #aion-nav-bar .expand-section-guide h5{padding: 0;font: normal 13px/15px 'CartoGothicProBook'} #aion-nav-bar .expand-section-guide h5 + span {margin: 0 0 8px;padding: 0;display: block;font-weight: normal;line-height: 11px} #aion-nav-bar .expand-section-guide span {margin-bottom: 6px;font-size: 11px; line-height:13px} #aion-nav-bar .expand-section-guide span a {font-size: 13px} #aion-nav-bar .expand-section-guide img.white-border {border: 2px solid #fff} #aion-nav-bar .expand-section-guide img.double-border {padding: 1px;border: 1px solid #9d9d9d;background-color: #fff;} /*** Media Menu ***/ #aion-nav-bar #aion-nav-bar-media .nav-menu {margin-right: -23px; margin-left: 0px; width:460Px; } /*** Media and Service Menus ***/ #aion-nav-bar #aion-nav-bar-media .expand-section {padding: 0px;float:none; position: static;left: 0; width: 291px; height: 100%;} #aion-nav-bar #aion-nav-bar-services .expand-section {float:none; position: static;left: 0; height: 100%} #aion-nav-bar #aion-nav-bar-media .expand-section h5, #aion-nav-bar #aion-nav-bar-services .expand-section h5 {margin-bottom: 3px;line-height: 13px} #aion-nav-bar #aion-nav-bar-media .expand-section ul li, #aion-nav-bar #aion-nav-bar-services .expand-section ul li {margin-left: 0;padding: 12px 27px 0; height: 75px;background: url("/global/includes/images/template-items/nav/nav_expand_ul_bg.png") 0 100% repeat-x} #aion-nav-bar #aion-nav-bar-media .expand-section ul li:first-child, #aion-nav-bar #aion-nav-bar-services .expand-section ul li:first-child {border-top: none} #aion-nav-bar #aion-nav-bar-media .expand-section ul li img, #aion-nav-bar #aion-nav-bar-services .expand-section ul li img {margin: 2px 9px 13px 0;float: left} /*** Forum Menu ***/ #aion-nav-bar #aion-nav-bar-forums .nav-menu {margin-right: -41px; margin-left: 0px; width:460px; } #aion-nav-bar #aion-nav-bar-forums ul.nav-menu-items {width: 175px} #aion-nav-bar #aion-nav-bar-forums .expand-section {padding-left: 10px;width: 198px} /*** Service Menu ***/ #aion-nav-bar #aion-nav-bar-services .nav-menu {width:490px; margin-left: 0px;} #aion-nav-bar #aion-nav-bar-services .nav-menu ul.nav-menu-items {width: 156px} #aion-nav-bar #aion-nav-bar-services .nav-menu ul.nav-menu-items li li {margin: 0; padding: 2px 0; font-weight: normal; text-transform: none} /*** Quick Links ***/ .quick-links {display: none} #aion-nav-bar .left .nav-menu .quick-links {left: 17px} #aion-nav-bar .right .nav-menu .quick-links {right: 28px} #aion-nav-bar .nav-menu .quick-links {position: absolute;bottom: 12px; width: 122px; font-size: 12px;line-height:18px} #aion-nav-bar .nav-menu .quick-links h4 {padding: 0;font-family: 'CartoGothicProBold';font-size: 12px;font-weight: normal; color: #777} #aion-nav-bar .nav-menu .quick-links a {display: block; color: #000} #aion-nav-bar .nav-menu .quick-links a:hover {color: #2b6c8c} /******************************************** ** AE) Footer /********************************************/ #aion-footer {color: #333;} #aion-footer A { color: #06506E; } #aion-footer ul.footer-social {margin: 0;padding-right: 24px;float: right;list-style:none;} #aion-footer ul.footer-social > li{margin: 8px 0 0 15px;padding: 0;float: left;} #aion-footer ul.footer-social > li .social {} #aion-footer ul.footer-nav {padding-top: 5px} #aion-footer ul.footer-nav li {padding: 0 10px; height: 35px; display: inline-block; background: url(/global/includes/images/template-items/footer/footer_nav_sep.png) no-repeat top left} #aion-footer ul.footer-nav li a {margin-top: 7px; padding: 0 3px; display: block; font-family: 'CartoGothicProBook'; font-size: 12px; color: #eee; text-decoration: none} #aion-footer ul.footer-nav li a:hover {color: #ffffff} #aion-footer ul.footer-nav li:first-child {background: none} #aion-footer .footer-bottom {width: 100%; text-align: center} #aion-footer .footer-bottom ul.logo-garden{margin-top: 40px;margin-left: -24px;} #aion-footer .footer-bottom ul.logo-garden li{padding: 0;display: inline-block;vertical-align: middle;} #aion-footer .footer-bottom ul.logo-garden li span, #aion-footer .footer-bottom ul.logo-garden li a{display: block;background-repeat: no-repeat;background-position: 0 50%;} #aion-footer .footer-bottom ul.logo-garden li a.ncsoft{width: 138px;height: 77px;background-image: url(/global/includes/images/template-items/footer/footer_ncsoft_logo_dark.png);margin-right: 16px;} #aion-footer .footer-bottom ul.logo-garden li span.plaync{width: 103px;height: 77px;background-image: url(/global/includes/images/template-items/footer/footer_plaync_logo.png);} #aion-footer .footer-bottom ul.logo-garden li a.aion{margin: 0 177px 0 93px;width: 162px;height: 85px;background-image: url(/global/includes/images/template-items/footer/footer_aion_steel_cavalry_dark.png);} #aion-footer .footer-bottom ul.logo-garden li a.esrb{width: 158px;height: 77px;background-image: url(/global/includes/images/template-items/lang-en/footer_rating_logo.png);} #aion-footer p { font: 11px/20px CartoGothicProBook,Arial,Helvetica,sans-serif; color: #666; padding: 27px 15px 15px;} /*** Simple Footer Dark ***/ #simpleFooterDark{width:100%;background:#000;} #simpleFooterDark .footer-separator{width:100%;background:url(/global/includes/images/template-items/footer/footerDark_separator.png) no-repeat center top #000;height:1px;clear:both;} #simpleFooterDark .simpleFooterDarkContainer{width:960px;height:99px;margin:0 auto;padding:35px 0 35px 0;} #simpleFooterDark .simpleFooterDarkContainer ul.logos{list-style:none;margin:0;padding:0;} #simpleFooterDark .simpleFooterDarkContainer ul.logos li{float:left;width:33%;text-align:center;} #simpleFooterDark .simpleFooterDarkContainer ul.logos li img{border:0;} #simpleFooterDark .simpleFooterDarkLegal{width:960px;margin:0 auto;padding-bottom:35px;} #simpleFooterDark .simpleFooterDarkLegal p{text-align:center;color:#adadad;padding-top:20px;width:810px;margin:0 auto;} /******************************************** ** B) BUTTONS /********************************************/ /*** All buttons ***/ .btn-square-1, .btn-square-2, .btn-square-3, .btn-square-4, .btn-square-5, .btn-square-6, .btn-square-7, .btn-square-9, .btn-square-10, .btn-right-1, .btn-right-2, .btn-left-1, .btn-left-2, .btn-decor-1, button.btn-decor-1, .btn-decor-2, .btn-social-1, .btn-social-2, .btn-social-3 { display: inline-block;font:13px/18px CartoGothicProBook, Arial, Helvetica, sans-serif; color: #000; text-shadow: 0px 1px 0 #fff; } /*** End cap on right ***/ a.btn-square-1:hover, a.btn-square-5:hover, a.btn-square-6:hover, a.btn-square-7:hover, a.btn-square-9:hover, a.btn-square-10:hover, a.btn-right-1:hover, a.btn-decor-1:hover, a.btn-decor-2:hover, a.btn-square-2:hover span, a.btn-square-3:hover span, a.btn-square-4:hover span, a.btn-left-1:hover span, a.btn-social-1:hover span, a.btn-social-2:hover span, a.btn-social-3:hover span { background-position: right bottom !important; text-shadow: none; color: #06506e; cursor: pointer; text-decoration: none !important; } /*** End cap on left ***/ a.btn-square-1:hover span, a.btn-square-5:hover span, a.btn-square-6:hover span, a.btn-square-7:hover span, a.btn-square-9:hover span, a.btn-square-10:hover span, a.btn-right-1:hover span, a.btn-decor-1:hover span, a.btn-decor-2:hover span, a.btn-square-2:hover, a.btn-square-3:hover, a.btn-square-4:hover, a.btn-left-1:hover, a.btn-social-1:hover, a.btn-social-2:hover, a.btn-social-3:hover {background-position: left bottom !important; text-shadow: none; color: #06506e; cursor: pointer; text-decoration: none !important; } /*** Button span tags ***/ .btn-square-1 span, .btn-square-2 span, .btn-square-3 span, .btn-square-4 span, .btn-square-5 span, .btn-square-6 span, .btn-square-7 span, .btn-square-9 span, .btn-square-10 span { display: inline-block; height: 21px } .btn-square-8, .btn-square-10 { display: inline-block; font-family: CartoGothicProBook, Arial, Helvetica, sans-serif; font-size: 18px; color: #06506e; text-shadow: 0px 1px 0 #fff } .btn-square-8:hover { background-position: right bottom !important; cursor: pointer; text-decoration: none !important } .btn-square-8:hover span { background-position: left bottom !important; text-decoration: none !important; cursor: pointer } .btn-square-1 { background: url("/global/includes/images/template-items/btns/btn_square1_endcap.png") no-repeat right top transparent } .btn-square-2 { background: url("/global/includes/images/template-items/btns/btn_square2_endcap.png") no-repeat left top transparent } .btn-square-3 { background: url("/global/includes/images/template-items/btns/btn_square3_endcap.png") no-repeat left top transparent } .btn-square-4 { background: url("/global/includes/images/template-items/btns/btn_square4_endcap.png") no-repeat left top transparent } .btn-square-5 { background: url("/global/includes/images/template-items/btns/btn_square5_endcap.png") no-repeat right top transparent } .btn-square-6 { background: url("/global/includes/images/template-items/btns/btn_square6_endcap.png") no-repeat right top transparent } .btn-square-7 { background: url("/global/includes/images/template-items/btns/btn_square7_endcap.png") no-repeat right top transparent } .btn-square-8 { background: url("/global/includes/images/template-items/btns/btn_square8_endcap.png") no-repeat right top transparent } .btn-square-9 { background: url("/global/includes/images/template-items/btns/btn_square9_endcap.png") no-repeat right top transparent } .btn-square-10 { background: url("/global/includes/images/template-items/btns/btn_square10_endcap.png") no-repeat right top transparent } .btn-right-1 { background: url("/global/includes/images/template-items/btns/btn_right_endcap.png") no-repeat right top transparent } .btn-right-2 { height: 27px; width: 27px; background: url("/global/includes/images/template-items/btns/btn_right2_bg.png") no-repeat right top transparent } .btn-left-1 { background: url("/global/includes/images/template-items/btns/btn_left_endcap.png") no-repeat 0 0 transparent } .btn-left-2 { height: 27px; width: 27px; background: url("/global/includes/images/template-items/btns/btn_left2_bg.png") no-repeat 0 0 transparent } .btn-right-2:hover{background-position: 100% -27px} .btn-left-2:hover{background-position: 0 -27px} .btn-decor-1{ background: url("/global/includes/images/template-items/btns/btn_decor1_endcap.png") no-repeat right top transparent } .btn-decor-2 { background: url("/global/includes/images/template-items/btns/btn_decor2_endcap.png") no-repeat right top transparent } .btn-social-1 { background: url("/global/includes/images/template-items/btns/btn_social1_endcap.png") no-repeat left top transparent } .btn-social-2 { background: url("/global/includes/images/template-items/btns/btn_social2_endcap.png") no-repeat left top transparent } .btn-social-3 { background: url("/global/includes/images/template-items/btns/btn_social3_endcap.png") no-repeat left top transparent } .btn-square-1 span { background: url("/global/includes/images/template-items/btns/btn_square1_bg.png") no-repeat left top transparent; margin: 0 4px 0 0; padding: 3px 8px 0 14px } .btn-square-2 span { background: url("/global/includes/images/template-items/btns/btn_square2_bg.png") no-repeat right top transparent; margin: 0 0 0 19px; padding: 3px 8px 0 5px } .btn-square-3 span { background: url("/global/includes/images/template-items/btns/btn_square2_bg.png") no-repeat right top transparent; margin: 0 0 0 24px; padding: 3px 10px 0 4px } .btn-square-4 span { background: url("/global/includes/images/template-items/btns/btn_square2_bg.png") no-repeat right top transparent; margin: 0 0 0 61px; padding: 3px 7px 0 4px } .btn-square-5 span { background: url("/global/includes/images/template-items/btns/btn_square1_bg.png") no-repeat left top transparent; margin:0 21px 0 0; padding: 2px 6px 1px 10px } .btn-square-6 span { background: url("/global/includes/images/template-items/btns/btn_square1_bg.png") no-repeat left top transparent; margin: 0 21px 0 0; padding: 3px 6px 0 14px } .btn-square-7 span { background: url("/global/includes/images/template-items/btns/btn_square1_bg.png") no-repeat left top transparent; margin: 0 22px 0 0; padding: 3px 6px 0 11px } .btn-square-9 span { background: url("/global/includes/images/template-items/btns/btn_square1_bg.png") no-repeat left top transparent; margin: 0 31px 0 0; padding: 3px 7px 0 18px } .btn-square-10 span { margin: 0 6px 0 0; padding: 0 28px 0 34px;height: 57px;line-height: 57px;background: url("/global/includes/images/template-items/btns/btn_square10_bg.png") no-repeat left top; } .btn-square-8 span { background: url("/global/includes/images/template-items/btns/btn_square8_bg.png") no-repeat left top transparent; margin: 0 11px 0 0; padding: 10px 0 8px 11px; display: inline-block } .btn-right-1 span { background: url("/global/includes/images/template-items/btns/btn_right_bg.png") no-repeat left top transparent; display: inline-block; height: 21px; margin: 0 20px 0 0; padding: 3px 0 0 10px } .btn-left-1 span { background: url("/global/includes/images/template-items/btns/btn_left_bg.png") no-repeat right top transparent; display: inline-block; height: 21px; margin: 0 0 0 20px; padding: 3px 10px 0 0 } .btn-decor-1 span{ background: url("/global/includes/images/template-items/btns/btn_decor1_bg.png") no-repeat left top transparent; display: inline-block; height: 25px; margin: 0 28px 0 0; padding: 9px 0 0 28px } .btn-decor-2 span { background: url("/global/includes/images/template-items/btns/btn_decor2_bg.png") no-repeat left top transparent; display: inline-block; height: 23px; margin: 0 20px 0 0; padding: 4px 7px 0 27px } .btn-social-1 span { background: url("/global/includes/images/template-items/btns/btn_social1_bg.png") no-repeat right top transparent; display: inline-block; height: 22px; margin: 0 0 0 25px; padding: 6px 10px 0 4px } .btn-social-2 span { background: url("/global/includes/images/template-items/btns/btn_social1_bg.png") no-repeat right top transparent; display: inline-block; height: 22px; margin: 0 0 0 25px; padding: 6px 10px 0 4px } .btn-social-3 span { background: url("/global/includes/images/template-items/btns/btn_social1_bg.png") no-repeat right top transparent; display: inline-block; height: 22px; margin: 0 0 0 25px; padding: 6px 10px 0 4px } a.btn-social-4 { background: url("/global/includes/images/template-items/social/facebook_icon.png") no-repeat left top transparent } a.btn-social-5 { background: url("/global/includes/images/template-items/social/twitter_icon.png") no-repeat left top transparent } a.btn-social-6 { background: url("/global/includes/images/template-items/social/youtube_icon.png") no-repeat left top transparent } a.btn-social-4, a.btn-social-5, a.btn-social-6 { display: block; height: 34px; width: 34px } a.btn-social-4:hover, a.btn-social-5:hover, a.btn-social-6:hover { background-position:left bottom }