* {margin:0; padding:0; outline:0; border:0;}

body{ background:#fff; font:12px/1.3 Arial,sans-serif; color:#333; }
td, th {line-height:1.3;}
li{ list-style:none;}
input {padding:2px; height:16px; color:#333; font:12px Tahoma,sans-serif;}
a{color:#c00; text-decoration:none;}
a:hover{ text-decoration:underline;}
p {margin:0 0 15px;}
table {border-collapse:collapse;}

/*global classes*/
.error {color:#f00;}
.hide {display:none;}
.clear {clear:both;}
.fleft{float:left;}
.fright{float:right;}
.redlink{color:#c00;}
.redlink:hover{text-decoration:underline;}
img.avatar, .avatar img {-webkit-border-radius:3px; border-radius:3px;}
.validateMsg {margin:3px 0; color:#666;}
.red, .error {color:#f00;}
.breakword{word-break:break-word; word-wrap:break-word;}
.ellipsis {white-space:nowrap; overflow:hidden;}
.ellipsis.multiline {white-space:normal;}
.ellipisDots{white-space:nowrap; overflow:hidden;text-overflow:ellipsis}

/*image sprite*/
.clanMenu, .clanMenu a, .panel .hd, .panelM .hd, .panelM .hdR {background:url(../images/clan-panel.png) no-repeat;}
.panelM .bd,.panelL .bd {background:url(../images/clan-panel.png) repeat-x 0 -165px #fff !important;}
.arA,.arB,.arC,.arD,.arE,.arAs,.arBs,.arCs,.arDs,.arEs{display:inline-block; vertical-align:middle; width:68px; height:65px; background:url(../images/ar.png) no-repeat; position:relative;}
.arAs,.arBs,.arCs,.arDs,.arEs{width:17px; height:16px;}
.arA{background-position:0 0;} .arB{background-position:-70px 0;} .arC{background-position:-140px 0;} 
.arD{background-position:-210px 0;} .arE{background-position:-280px 0;}
.arAs{background-position:-350px 0;} .arBs{background-position:-370px 0;} .arCs{background-position:-390px 0;} 
.arDs{background-position:-410px 0;} .arEs{background-position:-430px 0;}

.icoLike, .icoGrp,.icoArrDown, .icoFootOn, .icoFootOff, .icoTick, .icoWarning, #cluetip-close a {display:inline-block; vertical-align:middle; position:relative; background:url(../images/clan-icons.png) no-repeat;}
.icoLike {width:10px; height:10px; background-position:0 0;}
.icoGrp {width:12px; height:10px; background-position:-10px 0;}
.icoArrDown {background-position:-55px 0; width:7px; height:4px;}
.icoFootOn, .icoFootOff {background-position:-70px 0; width:14px; height:16px;}
.icoFootOff {background-position:-85px 0;}
.icoTick {background-position:-100px 0; width:16px; height:16px;}
.icoWarning {background-position:-120px 0; width:16px; height:16px;}

/*input*/
select, input[type="text"], input[type="password"], input[type="email"], input[type="file"], textarea {margin:0;}
select, input[type="text"], input[type="password"], input[type="email"], input[type="file"], textarea {border:1px solid #ddd; font:12px Tahoma,sans-serif; color:#333;}
input[type="text"], input[type="password"], input[type="email"], textarea, select {
	background:#fff;color:#333; padding:0 5px; height:25px; line-height:25px;
	border:1px solid #ccc;
	-webkit-box-shadow:	inset 0 1px 1px rgba(0,0,0,.1);
	-moz-box-shadow:	inset 0 1px 1px rgba(0,0,0,.1);
	box-shadow:			inset 0 1px 1px rgba(0,0,0,.1);
	-webkit-border-radius:	2px;
	-moz-border-radius:		2px;
	border-radius:			2px;
}
input[type="text"]:focus,input[type="password"]:focus, textarea:focus{color:#000; background:#fff; outline:0;}
input[type="radio"] {width:auto; padding:0 2px;}
textarea {overflow:auto; padding:5px; line-height:1.3;}
select {height:27px; padding:0;}
.placeholder                {color:#aaa !important;}
::-webkit-input-placeholder {color:#aaa !important;}
:-moz-placeholder           {color:#aaa !important;}
.btn {
  padding:0 1em; height:27px; font:700 12px Arial; color:#333; cursor:pointer; border:1px solid #ccc;
  background:#fafafa;
  background:-webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#ddd)); /* Saf4+, Chrome */
  background:-webkit-linear-gradient(top, #fafafa, #ddd); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background:-moz-linear-gradient(top, #fafafa, #ddd); /* FF3.6+ */
  background: -o-linear-gradient(top, #fafafa, #ddd); /* Opera 11.10+ */
  background:    linear-gradient(to bottom, #fafafa, #ddd);
  filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#dddddd',GradientType=0 );
 -webkit-border-radius:2px; 
		 border-radius:2px; 
		   text-shadow:1px 1px 0 #fff;
}
.btn:hover {
  color:#c00;
  background:#fff;
  background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee)); /* Saf4+, Chrome */
  background:-webkit-linear-gradient(top, #fff, #eee); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background:-moz-linear-gradient(top, #fff, #eee); /* FF3.6+ */
  background: -o-linear-gradient(top, #fff, #eee); /* Opera 11.10+ */
  background:    linear-gradient(to bottom, #fff, #eee);
  filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );
}

/*table*/
.tblList {width:100%;}
.tblList th, .tblList td {padding:5px 3px; text-align:center;}
.tblList th {text-align:center; font-weight:700; background:#eaeaea; border-left:1px solid #fff;}
.tblList th:first-child {border:0;}


/*footer*/
#footer{ width:986px; margin:0 auto; padding:0 0 40px 0; clear:both;}
#footer div{width:986px; overflow:hidden; padding:10px 0; border-top:1px solid #c7c7c7; color:#6c6c6c;}
#footer div p{ float:left;}
#footer div ul{ float:right;}
#footer div ul li{ display:inline; padding:0 5px 0 0; color:#6c6c6c}
#footer div ul li a{ padding:0 5px 0 0; color:#6c6c6c}
#footer #localeSwitch{ float:right; padding:0; width:auto;  border:1px solid #aaa;}
#footer p{font:12px/14px Tahoma;}

/* Header */
#globalHeader{ width:980px; margin:0 auto; height:85px;}
#globalHeader h1{ float:left; margin:5px 0 0 0;}

/* Navigation */
.nav {
	display:block; float:right; min-width:430px; margin:22px 0 0; border:1px solid #ccc; 
	font:13px Arial; white-space:nowrap; 
	background:#eee;
	background:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cccccc)); /* Safari 4+, Chrome */
	background:-webkit-linear-gradient(top, #ffffff, #cccccc); /* Chrome 10+, Safari 5.1+, iOS 5+ */
	background:  -moz-linear-gradient(top, #ffffff, #cccccc); /* Firefox 3.6-15 */
	background:    -o-linear-gradient(top, #ffffff, #cccccc); /* Opera 11.10-12.00 */
	background:       linear-gradient(to bottom, #ffffff, #cccccc); /* Firefox 16+, IE10, Opera 12.50+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 );
	-webkit-border-radius:3px;  border-radius:3px;
}
.nav li{display:inline}
.navLeft {float:left;}
.navLeft li a{display:block;float:left;height:35px;border-right:1px solid #ccc;text-transform:uppercase;color:#444;line-height:35px;text-shadow:1px 1px 0 #eee;padding:0 20px}
.navLeft li a:hover {
	color:#07C; text-shadow:1px 1px 0 #fff; 
	background:#eee;
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#dddddd)); /* Safari 4+, Chrome */
	background:-webkit-linear-gradient(top, #fff, #ddd); /* Chrome 10+, Safari 5.1+, iOS 5+ */
	background:  -moz-linear-gradient(top, #fff, #ddd); /* Firefox 3.6-15 */
	background:    -o-linear-gradient(top, #fff, #ddd); /* Opera 11.10-12.00 */
	background:       linear-gradient(to bottom, #fff, #ddd); /* Firefox 16+, IE10, Opera 12.50+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 );
}
.navLeft li.current a{color:#06A;cursor:default}
/*logout*/
.navUsr {padding:10px 5px 0 0; float:right; margin:0 15px 0 30px;}
.navUsr li {padding:3px 5px;}
.navUsr li:first-child {background:url(../images/ico_01.png) no-repeat 0 3px; padding-left:22px;}
.navUsr li.sep {color:#aaa; padding:0;}
.navUsr a{color:#c00;}

/*layout*/
#main {width:986px; margin:10px auto 20px auto; z-index:1; position:relative;}
.left, .middle, .right {width:210px; float:left; display:inline;}
.left {margin-right:9px;}
.middle {width:550px;}
.right {float:right;}

/*clan name and url on top*/
.clanNameUrl {margin:15px 0 5px; overflow:hidden;} 
.clanNameUrl .homeLink {float:left; font-weight:700;}
.clanNameUrl h4 {float:right;}
.clanNameUrl a {color:#333;}

/*horizontal clan navigation*/
.clanMenu{background-position:0 -40px; display:block; height:40px; margin:0 0 10px;}
.clanMenu a{font:700 13px Arial; color:#fff; line-height:35px; padding:0 25px; display:block; float:left;background-position:top right; height:40px;}
.clanMenu a:hover, .clanMenu a.active{color:#fc0; text-decoration:none;}
.clanMenu li{display:inline; }
.clanMenu li.quit a{float:right; background:none; font:100 10px/35px Tahoma; padding:0 10px; color:#f88;}
.clanMenu li.quit a:hover {color:#ddd;}
.clanMenu sub {font:100 9px Tahoma; margin:0 0 0 2px;}

/*panel*/
.panel {margin:0 0 10px; position:relative; z-index:1;}
.panel .hd{background-position:0 -129px; font:700 12px/28px Tahoma; color:#fff;height:28px; padding-left:12px; position:relative; z-index:2;	}
.panel .hd a.btnMore {padding:0 5px; position:absolute; top:5px; right:5px; font:100 11px/17px Tahoma; color:#000; z-index:2;
  background:#fafafa;
  background:-webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#ccc)); /* Saf4+, Chrome */
  background:-webkit-linear-gradient(top, #fafafa, #ccc); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background:-moz-linear-gradient(top, #fafafa, #ccc); /* FF3.6+ */
  background: -o-linear-gradient(top, #fafafa, #ccc); /* Opera 11.10+ */
  background:    linear-gradient(to bottom, #fafafa, #ccc);
  filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#cccccc',GradientType=0 );
	-webkit-border-radius:2px;
	border-radius:2px;
}
.panel .bd{
	padding:5px; background:#efefef; border:1px solid #b6b6b6; border-top:none; overflow:hidden;
	-webkit-border-bottom-left-radius:5px; -webkit-border-bottom-right-radius:5px;
	border-bottom-left-radius:5px; border-bottom-right-radius:5px;
	min-height:50px;
}
.panelM .hd, .panelL .hd{background-position:0 -93px;}
.panelM .hdR{background-position:-978px -93px; height:28px; width:8px; position:absolute; right:0; top:0; z-index:1;}
.panelL .bd {background:#fff;}

/*paging*/
.pageNav {padding:5px; text-align:center; margin:20px 0 10px; color:#555; font-size:.9em;}
.pageNav a {padding:3px 4px; background:#fff; border:1px solid #ddd; margin:2px; color:#666; cursor:pointer;}
.pageNav a:hover {text-decoration:none; background:#c00; color:#fff;}
.pageNav a.active {background:#777; color:#fff; cursor:default;}

/*tooltip*/
.cluetip-default h3#cluetip-title {
  display:none !important;
}
.cluetip-default .cluetip-arrows {
  display: none;
  position: absolute;
  top: 0;
  left: -9px;
  width: 9px;
  height: 17px;
  border-width: 0;
}
.cluetip-default .cluetip-extra {
  display: none;
}
/***************************************
   =cluetipClass: 'default'
-------------------------------------- */
.cluetip-default,
.cluetip-default .cluetip-outer {
  background-color: #fff; padding:5px; color:#666; border:1px solid #800; font-size: 11px;
}
.cluetip-default .ui-cluetip-header {
  /*background-color: #87876a;*/ display:none;
}

div.cluetip-default .cluetip-arrows {
  border-width: 0;
  background:url(../images/tooltip-arrow-red.gif) no-repeat;
}
div.clue-right-default .cluetip-arrows {
  background-position:-60px 0;
}
div.clue-left-default .cluetip-arrows {
  background-position:-40px 0;
  left: 100%;
  margin-right: -9px;
}
div.clue-top-default .cluetip-arrows {
  background-position:-20px 0;
  top: 100%;
  left: 50%;
  margin-left: -9px;
  width: 17px;
  height: 9px;
}
div.clue-bottom-default .cluetip-arrows {
  background-position:0 0;
  top: -9px;
  left: 50%;
  margin-left: -9px;
  width: 17px;
  height: 9px;
}

div.cluetip-jtip {font-size:1em;}
#cluetip-waitimage {width:43px; height:11px; position:absolute; background-image:url(../images/loading-tooltip.gif);}
div.cluetip-jtip .cluetip-arrows {display:none; position:absolute; top:0; left:-8px; width:9px; height:17px; background:url(../images/tooltip-arrow.gif?120807) no-repeat; border:0;}
.cluetip-extra {display:none;}
div.clue-right-jtip .cluetip-arrows {background-position:-60px 0;}
div.clue-left-jtip .cluetip-arrows {background-position:-40px 0; left:100%; margin-right:-11px;}
div.clue-top-jtip .cluetip-arrows {background-position:0 0; top:100%; left:50%; width:17px; height:9px; margin-left:-10px; margin-top:-1px;}
div.clue-bottom-jtip .cluetip-arrows {background-position:-20px 0; top:-8px; left:50%; width:17px; height:9px; margin-left:-10px;}
div.cluetip-jtip h3#cluetip-title, div.cluetip-jtip #cluetip-close a {display:block; width:12px; height:12px; background-position:-25px 0; border:0; cursor:pointer; opacity:.3; filter:alpha(opacity=30); position:absolute; top:5px; right:-45px; z-index:999; text-indent:-999px; overflow:hidden;}
div.cluetip-jtip #cluetip-close a:hover {opacity:1; filter:alpha(opacity=100);}
.tooltip {background:#fff; border:1px solid #bbb; padding:10px; -webkit-box-shadow:0 0 8px rgba(0,0,0,.5); box-shadow:0 0 8px rgba(0,0,0,.5); width:300px; overflow:hidden; color:#666; font-size:11px; position:relative; z-index:1;}
.ttl, .ttr{float:left;}
.ttl{padding:0 10px 0 0; margin:0 0 10px;}
.ttl .avatar img, .ttl img.avatar{width:80px; height:80px;}
.ttr {width:210px; margin-bottom:10px;}
.ttNickName{font:700 14px Tahoma; padding:4px 4px 5px 0; word-break:break-word; word-wrap:break-word;}
.ttName{color:#999; padding:0 0 3px;}
.ttNation {vertical-align:bottom; margin:0 0 0 5px;}
.ttStat {overflow:hidden;}
.ttLike, .ttMem, .ttAR {float:left; margin:0 10px 5px 0; height:20px; color:#000; font:700 11px/25px Tahoma;}
.tooltip .icoLike, .tooltip .icoGrp {top:-2px; margin:0 2px 0; *top:0;}
.tooltip .ttAR i {top:-2px; *top:0;}
.ttAR  {_top:-1px; font-weight:100; color:#666;}
.ttRate {font:700 13px/16px Tahoma; color:#000; overflow:hidden; height:20px;}
.ttRate .medalS {float:left;}
.ttRate span {float:left; line-height:14px;}
.ttInfo p {margin-bottom:3px;}
.ttSignature {font:11px/1.2 Tahoma; color:#666; width:200px;}
.ttMemInfo, .ttCWInfo {clear:left; padding:10px; background:#eee; margin:0 -10px -10px;}
.ttMemInfo p {margin:0 0 3px;}
.ttCWInfo {cursor:pointer;}
.ttCWInfo th {font-weight:100; text-align:center; width:25%; vertical-align:top; white-space:nowrap;}
.ttCWInfo td {font:700 12px Arial; text-align:center;}
.ttCWInfo:hover {
  background:#ddd;
  background:-webkit-gradient(linear, left top, left bottom, from(#ddd), to(#eee)); /* Saf4+, Chrome */
  background:-webkit-linear-gradient(top, #ddd, #eee); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background:-moz-linear-gradient(top, #ddd, #eee); /* FF3.6+ */
  background: -o-linear-gradient(top, #ddd, #eee); /* Opera 11.10+ */
  background:    linear-gradient(to bottom, #ddd, #eee);
  filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#eeeeee',GradientType=0 );
 }
.ttCWInfo:hover th, .ttCWInfo:hover td{color:#333;}
.clanTabs {height:20px; margin:-10px -10px 10px; *top:-20px; *margin-bottom:-15px; border:1px solid #ccc; border-left:0; border-right:0; position:relative;
	background:#fff;
    background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#f0f0f0));
    background:-webkit-linear-gradient(top,#fff,#f0f0f0);
    background:   -moz-linear-gradient(top,#fff,#f0f0f0);
    background:    -ms-linear-gradient(top,#fff,#f0f0f0);
    background:     -o-linear-gradient(top,#fff,#f0f0f0);
    background:        linear-gradient(to bottom,#fff,#f0f0f0);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f0f0f0',GradientType=0 );
}
.clanTabs li {
	display:block; float:left; padding:0 5px; margin:0; border-left:1px solid #ccc; height:20px;
	font:11px/20px Arial; color:#999; text-shadow:none; cursor:pointer;
}
.clanTabs li:first-child {border-left:0;}
.clanTabs li:hover {color:#444;}
.clanTabs li.active {
	border-top:1px solid #fff; border-bottom:1px solid #eee; position:relative; top:0; color:#666; cursor:default; background:#eee;
}
.clanTabs li:last-child.active {border-right:1px solid #ccc;}


/*browse*/
.browse .right {width:765px;}
.browse .bigBtn {
	display:block; width:185px; height:45px; margin:0 10px 15px; font:700 16px/45px Arial,sans-serif; text-align:center; color:#fff; text-decoration:none;
	background:#c00;
	background:-moz-linear-gradient(top,  #c00000 0%, #900000 50%, #780000 51%, #780000 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#c00000), color-stop(50%,#900000), color-stop(51%,#780000), color-stop(100%,#780000));
	background:-webkit-linear-gradient(top,  #c00000 0%,#900000 50%,#780000 51%,#780000 100%);
	background:-o-linear-gradient(top,  #c00000 0%,#900000 50%,#780000 51%,#780000 100%);
	background:-ms-linear-gradient(top,  #c00000 0%,#900000 50%,#780000 51%,#780000 100%);
	background:linear-gradient(to bottom,  #c00000 0%,#900000 50%,#780000 51%,#780000 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#c00000', endColorstr='#780000',GradientType=0 );
	-webkit-box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, .3);
        box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, .3);
	-webkit-border-radius:5px;
	border-radius:5px;	
}
.browse .bigBtn:hover {
	color:#fc0;
	background:#626262;
	background:-moz-linear-gradient(top,  #626262 0%, #484848 50%, #3c3c3c 51%, #242424 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#626262), color-stop(50%,#484848), color-stop(51%,#3c3c3c), color-stop(100%,#242424));
	background:-webkit-linear-gradient(top,  #626262 0%,#484848 50%,#3c3c3c 51%,#242424 100%);
	background:-o-linear-gradient(top,  #626262 0%,#484848 50%,#3c3c3c 51%,#242424 100%);
	background:-ms-linear-gradient(top,  #626262 0%,#484848 50%,#3c3c3c 51%,#242424 100%);
	background:linear-gradient(to bottom,  #626262 0%,#484848 50%,#3c3c3c 51%,#242424 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#626262', endColorstr='#242424',GradientType=0 );
}
.browse .filter {margin:5px 5px 10px; overflow:hidden;}
.browse .filter li {display:block; overflow:hidden;}
.browse .filter label, .browse .filter input, .browse .filter select {
	float:left; margin:3px;
}
.browse .filter label {width:80px; line-height:25px;}
.browse .filter select {width:140px;}
.browse .filter input[type="text"] {width:150px;}

.banner {width:986px; height:220px; position:relative;}

/*create clan*/
.create {margin:10px; width:550px;}
.create .whatis {color:#333; display:block; margin:20px 0; text-align:center; font-size:14px;}
.create .whatis:hover {text-decoration:underline;}
.createSearch {width:185px; margin:0 auto;}
.createSearch input[type=text] {width:115px;}
.createSearch .btn {position:relative; top:-1px; width:50px; padding:0; font-size:11px;}
.create .panelM .bd {padding:20px;}
.create p {margin:5px 0;}
.create  table {margin:20px 0;}
.create th, .tblCreate td {padding:5px; vertical-align:middle;}
.create th { font-weight:100; text-align:left; width:80px;}
.create td {width:400px;}
.create td input[type="text"], .tblCreate select {width:200px; margin:0 3px 3px 0;}
.create input[type="checkbox"] {vertical-align:bottom;}

.help {position:relative; display:inline-block; top:3px; width:20px; height:14px; float:left;}
.help p{margin:0 0 10px;}
.help li {list-style:disc; margin:0 0 5px 20px;}
.help img {margin-left:3px;}
.helpBd {
    background:#ffc; border:1px solid #b39d81; position:relative; top:5px; left:10px; width:280px; padding:8px; color:#642;
    display:none;
  -webkit-border-radius:5px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
          border-radius:5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4+, iOS 4, Android 2.1+ */
          -webkit-border-top-left-radius:0; border-top-left-radius:0;
}
.help i {display:block; width:9px; height:5px; position:absolute; top:-5px; left:-1px; background:url(../images/help-corner.png) no-repeat;}

/*game buttons on banner*/
 .btnGameSnake:hover {background-color:#a00; opacity:1; filter:alpha(opacity=100);}
.bannerGames {position:absolute; top:3px; left:3px;}
.btnGameSnake {
	width:24px; height:24px; cursor:pointer; border:1px solid #fff;
	background:url(../images/banner-games.png) no-repeat; opacity:.8; filter:alpha(opacity=80);
    -webkit-border-radius:  3px;
    -moz-border-radius:     3px;
    border-radius:          3px;	
}

ul.advLinks{padding:10px 5px; font-size:12px;}
ul.advLinks li{padding-left:18px; background:url(../images/icon-double-arrow.gif) no-repeat left center;  margin:0 0 10px;}
ul.advLinks li.active a {color:#333;}