label {
	display: inline-block;
	min-width: 110px;
}
input,.input, button {
	border-width: 1px !important;
	border-style: solid !important;
	border-color: #AAA !important;
	border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px;
	background-color: white !important;
	color: black;
	font-weight: bold;
	text-shadow: 1px 1px 3px #AAA;
}
input.skillTurns {
	border-left: none !important;
	border-right: none !important;
	border-top: none !important;
	border-bottom: 1px dashed #AAA !important;
	text-align: right;
	padding-right: 0.1em;
	background: none transparent !important;
}
fieldset {
	border-radius: 1em; -moz-border-radius: 1em; -webkit-border-radius: 1em; -o-border-radius: 1em; -ms-border-radius: 1em;
	border: 2px solid rgba(200, 200, 200, 0.4);
}
#container, div.sideMenu {
	box-shadow: 0 0 10px rgba(200, 200, 200, 0.8); -moz-box-shadow: 0 0 10px rgba(200, 200, 200, 0.8); -webkit-box-shadow: 0 0 10px rgba(200, 200, 200, 0.8); -o-box-shadow: 0 0 10px rgba(200, 200, 200, 0.8); -ms-box-shadow: 0 0 10px rgba(200, 200, 200, 0.8);
}
#container {
	margin: 5ex 10%;
	padding: 20px;
	border: 1px solid #AAA;
	border-radius: 10pt; -moz-border-radius: 10pt; -webkit-border-radius: 10pt; -o-border-radius: 10pt; -ms-border-radius: 10pt;
	background-color: rgba(255,255,255,0.8);
}

#sideMenuContainer {
	float: left;
	min-width: 50px; /* hover-sensitive area */
	height: 100%;
	position: fixed;
}
#sideMenuContainer *|* {
	/* adjust manually */ transition: all .6s ease-in, transform .6s ease-out; -moz-transition: all .6s ease-in, -moz-transform .6s ease-out; -webkit-transition: all .6s ease-in, -webkit-transform .6s ease-out; -o-transition: all .6s ease-in, -o-transform .6s ease-out; -ms-transition: all .6s ease-in, -ms-transform .6s ease-out;
}
#sideMenuContainer div.sideMenu div.collapsedTitle {
	border-radius: 0 10pt 10pt 0; -moz-border-radius: 0 10pt 10pt 0; -webkit-border-radius: 0 10pt 10pt 0; -o-border-radius: 0 10pt 10pt 0; -ms-border-radius: 0 10pt 10pt 0;
	box-shadow: 0 0 5px #666; -moz-box-shadow: 0 0 5px #666; -webkit-box-shadow: 0 0 5px #666; -o-box-shadow: 0 0 5px #666; -ms-box-shadow: 0 0 5px #666;
	background-color: black;
	opacity: 0;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
#sideMenuContainer div.sideMenu div.collapsedTitle > * {
	transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg);
	display:block;

	color:white;
	font-size:9pt;
	font-weight:bold;

	position:absolute;
	height:0;
	overflow:visible;
	top:50%;

	left:0;
	right:-100%;

	line-height:25pt;

	text-align:center;
	text-shadow:1px 1px 1px rgba(200, 200, 200, 0.8);
}
/*#sideMenuContainer div.sideMenu div.collapsedTitle span.queueLength {
	transform: rotate(-90deg); -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg);
}*/
#sideMenuContainer:not(:hover) div.sideMenu {
	transform: translate(-70%,0); -moz-transform: translate(-70%,0); -webkit-transform: translate(-70%,0); -o-transform: translate(-70%,0); -ms-transform: translate(-70%,0);
}
#sideMenuContainer:not(:hover) div.sideMenu div.collapsedTitle {
	opacity: 1;
	z-index: 1000;
}
#sideMenuContainer div.sideMenu div.collapsedTitle {
	z-index: -1;
}
div.sideMenu {
	border: 1px solid #AAA;
	border-left: none;
	border-radius: 0 10pt 10pt 0; -moz-border-radius: 0 10pt 10pt 0; -webkit-border-radius: 0 10pt 10pt 0; -o-border-radius: 0 10pt 10pt 0; -ms-border-radius: 0 10pt 10pt 0;
	background-color: rgba(255,255,255,0.8);
	padding: 0;
	margin: 1ex 1em 1ex 0;
	position: relative;
	min-height: 100px;
}
div.sideMenu h2 {
	border-radius: 0 10pt 0 0; -moz-border-radius: 0 10pt 0 0; -webkit-border-radius: 0 10pt 0 0; -o-border-radius: 0 10pt 0 0; -ms-border-radius: 0 10pt 0 0;
	background-color: black;
	color: white;
	padding: 5pt 15pt 5pt 10pt;
	margin: 0;
	font-size: 10pt;
}
div.sideMenu > div {
	padding: 10pt;
}
div.sideMenu ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
div.sideMenu dl {
	margin: 0;
	font-size: 10pt;
	color: #000;
	text-shadow: 1px 1px 3px #AAA;
}
div.sideMenu dl dt {
	margin-top: .5ex;
}
div.sideMenu dl dd {
	font-weight: bold;
	margin: 0;
	text-align: right;
}

.botStatus {
	font-weight: bold;
	text-shadow: 1px 1px 1px rgba(128,128,128,0.8);
}
.botStatus, #sideMenuContainer div.sideMenu div.collapsedTitle .botStatus {
	color: rgb(255,100,100);
}
.botStatus.running, #sideMenuContainer div.sideMenu div.collapsedTitle .botStatus.running {
	color: rgb(100,255,100);
}
.botStatus.booting, #sideMenuContainer div.sideMenu div.collapsedTitle .botStatus.booting {
	color: rgb(220,255,100);
}
.botStatus.starting, #sideMenuContainer div.sideMenu div.collapsedTitle .botStatus.starting {
	color: rgb(180,255,100);
}
.botStatus.brb, #sideMenuContainer div.sideMenu div.collapsedTitle .botStatus.brb {
	color: rgb(180,255,100);
}

body {
	background: #E0E0E0; background: linear-gradient(left, #E0E0E0, #FFF); background: -moz-linear-gradient(left, #E0E0E0, #FFF); background: -webkit-linear-gradient(left, #E0E0E0, #FFF);
	font-family: sans-serif;
	margin: 0;
	padding: 0;
}

h1 {
	margin: 1ex -20px;
	padding: .25ex .5em;
	background: #E5E5E5; background: linear-gradient(85deg, #E5E5E5, #FDFDFD); background: -moz-linear-gradient(85deg, #E5E5E5, #FDFDFD); background: -webkit-linear-gradient(85deg, #E5E5E5, #FDFDFD);
	text-shadow: 1px 1px 3px #AAA;
}
h1:before { content: '// '; }

#error h1 {
	background: #F6D4D4; background: linear-gradient(85deg, #F6D4D4, #FFFBFB); background: -moz-linear-gradient(85deg, #F6D4D4, #FFFBFB); background: -webkit-linear-gradient(85deg, #F6D4D4, #FFFBFB);
	text-shadow: 1px 1px 3px #B99;
}

.maintenanceNotice {
	border-radius: 10pt; -moz-border-radius: 10pt; -webkit-border-radius: 10pt; -o-border-radius: 10pt; -ms-border-radius: 10pt;
	background: #F6E3E3; background: linear-gradient(left, #FFF, #F6E3E3); background: -moz-linear-gradient(left, #FFF, #F6E3E3); background: -webkit-linear-gradient(left, #FFF, #F6E3E3);
	border: 1px solid #F6E0E0;
	padding: 1ex 1em;
	margin: 3ex 30%;
	text-align: center;
}
.maintenanceHeadline {
	text-shadow: 1px 1px 3px #B99;
	text-size: 200%;
	font-weight: bold;
}


a {
	text-decoration: none;
	font-weight: bold;
	color: #000;
	text-shadow: 1px 1px 3px #AAA;
}

.innerBox, body.slim .leftCol .innerBox, body.slim .rightCol .innerBox {
	border: 1px solid #DDD;
	border-radius: 10pt; -moz-border-radius: 10pt; -webkit-border-radius: 10pt; -o-border-radius: 10pt; -ms-border-radius: 10pt;
	background: #F0F0F0; background: linear-gradient(left, #FFF, #FFF 10%, #F0F0F0 25%, #F0F0F0); background: -moz-linear-gradient(left, #FFF, #FFF 10%, #F0F0F0 25%, #F0F0F0); background: -webkit-linear-gradient(left, #FFF, #FFF 10%, #F0F0F0 25%, #F0F0F0);
	transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out;
	margin: 0.5ex .5em;
	padding: 1ex 1em;
}
.multiCol .innerBox {
	box-flex: 1; -moz-box-flex: 1; -webkit-box-flex: 1; -o-box-flex: 1; -ms-box-flex: 1;
}
.multiCol, body.slim .multicol {
	box-orient: vertical; -moz-box-orient: vertical; -webkit-box-orient: vertical; -o-box-orient: vertical; -ms-box-orient: vertical;
	display: box; display: -moz-box; display: -webkit-box; display: -o-box; display: -ms-box;
	width: 100%;
}
/* if we have enough screen estate, let's go multi-col */
@media screen and (min-width: 1250px) {
.multiCol {
	box-orient: horizontal; -moz-box-orient: horizontal; -webkit-box-orient: horizontal; -o-box-orient: horizontal; -ms-box-orient: horizontal;
}
.leftCol .innerBox {
	background: #F0F0F0; background: linear-gradient(left, #FFF, #FFF 20%, #F6F6F6 50%, #F6F6F6); background: -moz-linear-gradient(left, #FFF, #FFF 20%, #F6F6F6 50%, #F6F6F6); background: -webkit-linear-gradient(left, #FFF, #FFF 20%, #F6F6F6 50%, #F6F6F6);
}
.rightCol .innerBox {
	background: #F0F0F0; background: linear-gradient(left, #FAFAFA, #FAFAFA 20%, #F0F0F0 50%, #F0F0F0); background: -moz-linear-gradient(left, #FAFAFA, #FAFAFA 20%, #F0F0F0 50%, #F0F0F0); background: -webkit-linear-gradient(left, #FAFAFA, #FAFAFA 20%, #F0F0F0 50%, #F0F0F0);
}
}

	
.leftCol, .rightCol {
	display: box; display: -moz-box; display: -webkit-box; display: -o-box; display: -ms-box;
	box-orient: vertical; -moz-box-orient: vertical; -webkit-box-orient: vertical; -o-box-orient: vertical; -ms-box-orient: vertical;
	box-flex: 2; -moz-box-flex: 2; -webkit-box-flex: 2; -o-box-flex: 2; -ms-box-flex: 2;
}
#skillGroupsRight {
	box-flex: 3; -moz-box-flex: 3; -webkit-box-flex: 3; -o-box-flex: 3; -ms-box-flex: 3;
}
.centeredBox {
	display: box; display: -moz-box; display: -webkit-box; display: -o-box; display: -ms-box;
	box-pack: center; -moz-box-pack: center; -webkit-box-pack: center; -o-box-pack: center; -ms-box-pack: center;
}
.centeredBox table {
	margin: auto;
}
.centeredBox h2 {
	text-align: center;
}

div.buffIcon, div.skillIcon {
	width: 30px;
	height: 30px;
	padding: 0;
	margin: 0 5px;
	vertical-align: top;
	display: inline-block;
	background-image: url('../img/skills-0737794.png');
}
.skillIcon182 { background-position: -30px 0px; }
.skillIcon183 { background-position: -60px 0px; }
.skillIcon184 { background-position: -90px 0px; }
.skillIcon2007 { background-position: -120px 0px; }
.skillIcon2008 { background-position: -150px 0px; }
.skillIcon2009 { background-position: -180px 0px; }
.skillIcon2010 { background-position: 0px -30px; }
.skillIcon2012 { background-position: -30px -30px; }
.skillIcon2025 { background-position: -60px -30px; }
.skillIcon2026 { background-position: -90px -30px; }
.skillIcon2031 { background-position: -120px -30px; }
.skillIcon4007 { background-position: -150px -30px; }
.skillIcon4008 { background-position: -180px -30px; }
.skillIcon4011 { background-position: 0px -60px; }
.skillIcon4019 { background-position: -30px -60px; }
.skillIcon6003 { background-position: -60px -60px; }
.skillIcon6004 { background-position: -90px -60px; }
.skillIcon6005 { background-position: -120px -60px; }
.skillIcon6006 { background-position: -150px -60px; }
.skillIcon6007 { background-position: -180px -60px; }
.skillIcon6008 { background-position: 0px -90px; }
.skillIcon6009 { background-position: -30px -90px; }
.skillIcon6010 { background-position: -60px -90px; }
.skillIcon6011 { background-position: -90px -90px; }
.skillIcon6012 { background-position: -120px -90px; }
.skillIcon6013 { background-position: -150px -90px; }
.skillIcon6014 { background-position: -180px -90px; }
.skillIcon6015 { background-position: 0px -120px; }
.skillIcon6016 { background-position: -30px -120px; }
.skillIcon6017 { background-position: -60px -120px; }
.skillIcon6018 { background-position: -90px -120px; }
.skillIcon6020 { background-position: -120px -120px; }
.skillIcon6021 { background-position: -150px -120px; }
.skillIcon6022 { background-position: -180px -120px; }
.skillIcon6023 { background-position: 0px -150px; }
.skillIcon6024 { background-position: -30px -150px; }
.skillIcon6026 { background-position: -60px -150px; }
.skillIcon6027 { background-position: -90px -150px; }
.skillIcon6028 { background-position: -120px -150px; }
.skillIcon6045 { background-position: -150px -150px; }

ul.skillGroup li {
	min-height: 30px;
}
ul#requestBuffs li, ul.skillGroup li {
	position: relative;
	list-style-type: none;
	padding-left: 5px;

	transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -webkit-transition: all .6s ease-in-out; -o-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out;
}
ul.skillGroup.disabled li, ul.skillGroup li.abusable {
	opacity: 0.4;
}

span.skillTurnsOf {
	font-size: 90%;
}

ul#requestBuffs {
	padding: 0;
}

ul#requestBuffs li.success {
	background: #D3F6C3; background: linear-gradient(left, #FFF, #FFF 10%, #D3F6C3 25%, #D3F6C3); background: -moz-linear-gradient(left, #FFF, #FFF 10%, #D3F6C3 25%, #D3F6C3); background: -webkit-linear-gradient(left, #FFF, #FFF 10%, #D3F6C3 25%, #D3F6C3);
}
ul#requestBuffs li.failed {
	background: #F6E3E3; background: linear-gradient(left, #FFF, #FFF 10%, #F6E3E3 25%, #F6E3E3); background: -moz-linear-gradient(left, #FFF, #FFF 10%, #F6E3E3 25%, #F6E3E3); background: -webkit-linear-gradient(left, #FFF, #FFF 10%, #F6E3E3 25%, #F6E3E3);
}
ul#requestBuffs li:hover {
	background: #D6E2F6; background: linear-gradient(left, #FFF, #FFF 10%, #D6E2F6 45%, #D9E2F3); background: -moz-linear-gradient(left, #FFF, #FFF 10%, #D6E2F6 45%, #D9E2F3); background: -webkit-linear-gradient(left, #FFF, #FFF 10%, #D6E2F6 45%, #D9E2F3);
}
ul#requestBuffs li {
	padding-right: 0;
	padding-top: 0;
	padding-bottom: 0;
}

ul#requestBuffs li > div {
	display: inline-block;
	vertical-align: middle;
	margin: 3px 0px 4px 5px;
}

span.buffTurns {
	font-weight: bold;
}
span.buffName, span.skillName {
	font-weight: bold;
	text-shadow: 1px 1px 3px #AAA;
}
span.buffStatusLine {
	font-size: 85%;
}
ul#requestBuffs li.success span.buffStatusLine,
ul#requestBuffs li.pending span.buffStatusLine {
	display: none;
}
ul#requestBuffs li.success.noscript:hover span.buffStatusLine,
ul#requestBuffs li.pending.noscript:hover span.buffStatusLine {
	display: inline;
}

ul#requestBuffs li.success span.buffStatus,
ul#requestBuffs li.failed span.buffStatus {
	font-weight: bold;
	text-shadow: 1px 1px 1px #AAA;
}
ul#requestBuffs li.success span.buffStatus {
	color: lime;
}
ul#requestBuffs li.failed span.buffStatus {
	color: red;
}
ul#requestBuffs li.pending span.buffStatus {
	font-style: italic;
}
span.buffStatusMessage {
	color: gray;
	font-style: italic;
}

div.buttonPanel {
	font-size: 90%;
	padding: 0 0.75em;
	display: inline-block;
}
div.buttonPanel.buttonPanelRight {
	float: right;
}

div.buttonPanel button:after { content: '.'; }


/* buff form */
ul#savedTargets {
	list-style-type: none;
	padding: 0;
	margin: 0;
	display: inline;
}
ul#savedTargets li {
	margin: 0 0.25em;
	display: inline;
	font-weight: bold;
	font-size: 70%;
}
ul#savedTargets li a.name {
	text-decoration: none;
	border-bottom: 1px dashed #AAA;
	color: #444;
	text-shadow: 1px 1px 3px #AAA;
}
ul#savedTargets li.selected {
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px;

	background: #DDD; background: linear-gradient(85deg, #DDD, #EAEAEA); background: -moz-linear-gradient(85deg, #DDD, #EAEAEA); background: -webkit-linear-gradient(85deg, #DDD, #EAEAEA);

	padding: 0.5ex 0.5em;
}
ul#savedTargets li.selected a.name, ul#savedTargets li.showControls a.name {
	border-bottom-style: none;
}
ul#savedTargets li a.deleteButton {
	border-radius: 1px; -moz-border-radius: 1px; -webkit-border-radius: 1px; -o-border-radius: 1px; -ms-border-radius: 1px;
	width: 9px;
	height: 9px;
	font-size: 11px;
	line-height: 9px;

	margin-left: 0.5em;
	text-align: center;
	vertical-align: middle;	
	font-weight: bold;
	text-decoration: none;

	display: none;

	background: #BBB;
	color: #444;
}
ul#savedTargets li.showControls {
	border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px;

	border: 1px solid #DDD;

	padding: 0.5ex 0.5em;
}
ul#savedTargets li a.deleteButton:hover {
	background: #444;
	color: #BBB;
}
ul#savedTargets li.showControls a.deleteButton {
	display: inline-block;
}

div#favourites {
	float: right;
	position: relative;
	font-weight: bold;
	font-size: 70%;
	padding: .5ex .5em;
	opacity: .4;
}
div#favourites.favouritesActive {
	opacity: 1;
}
#favourites_label {
	text-decoration: none;
	/*border-bottom: 1px dashed #AAA;*/
	color: #444;
	text-shadow: 1px 1px 3px #AAA;
	cursor: default;
}
#favourites_label:after {
	content: ' ▼';
}
div#favourites ul {
	list-style-type: none;
	margin: .5ex 0;
	padding: 0 .5em;
	position: absolute;
	right: 0;
	display: none;

	background-color: white;
	border: 1px solid #AAA;

	border-radius: .7em 0 .7em .7em; -moz-border-radius: .7em 0 .7em .7em; -webkit-border-radius: .7em 0 .7em .7em; -o-border-radius: .7em 0 .7em .7em; -ms-border-radius: .7em 0 .7em .7em;

	z-index: 100;
}
div#favourites ul li {
	text-align: right;
	padding: .5ex .5em;
	border-top: 1px dashed #BBB;
	white-space: pre;

	transition: all .25s ease; -moz-transition: all .25s ease; -webkit-transition: all .25s ease; -o-transition: all .25s ease; -ms-transition: all .25s ease;

}
div#favourites ul li:first-child {
	border-top: none;
}
div#favourites ul:hover li {
	opacity: .5;
}
div#favourites ul:hover li:hover {
	opacity: 1;
}
div#favourites ul:hover li:hover + li {
	border-top-color: #777;
}
div#favourites ul li div {
	display: inline-block;
	text-align: center;
	margin: 0 .2em;
}

div#MPInfo.noscript {
	display: none;
}
div#MPInfo {
	margin-left: 2em;
}
span#mpLeft, span#mpCost {
        color: black;
        font-weight: bold;
        text-shadow: 1px 1px 3px #AAA;
}
span#mpCost.over {
	color: red;
}


/* password stuff */
#passwordBox {
	display: none;
	margin-top: 1ex;
}
#passwordError {
	margin-left: 1em;
	color: red;
	font-size: 70%;
}

#passwordNotice {
	display: none;
	color: red;
	background-color: white;
	border: 1px solid red;
	margin: 1ex 1em;
	padding: 4ex 4em;
}
#passwordNotice.noscript {
	display: block;
}
#passwordNotice span:first-child {
	font-weight: bold;
} 

#copyright {
	font-size: xx-small;
	left: 15%;
	right: 15%;
	bottom: 1px;
	position: fixed;
	text-align: center;
	opacity: .1;
	z-index: -100;
	transition: all 2s ease-in-out; -moz-transition: all 2s ease-in-out; -webkit-transition: all 2s ease-in-out; -o-transition: all 2s ease-in-out; -ms-transition: all 2s ease-in-out;
}
#copyright:hover {
	opacity: .9;
}
.copyright_style_buffbot:after {
	content: 'Original Buffbot style by StuBorn.';
}
.copyright_original {
	display: none;
}

/* stats */
#stats h2 {
	margin: 8pt 0;
}
table.stats {
        font-weight: bold;
        text-shadow: 1px 1px 3px #AAA;
	margin-bottom: 8pt;
}
table.stats th {
	text-align: left;
}
table.stats td {
	font-size: 9pt;
}

table.stats td:first-child {
	padding-right: 3ex;
}

.num, table.stats th.num {
	text-align: right;
}
#stats .numFailed {
	font-size: 8pt;
}
#stats .numFailed:before { content: '('; }
#stats .numFailed:after { content: ')'; }

/* faq */
#faq div.innerBox {
	padding-top: .5ex;
}
#faq div.innerBox.highlight {
	background: #F0F0EE; background: linear-gradient(left, #FFFFF0, #FFFFF0 10%, #F0F0EE 25%, #F0F0EE); background: -moz-linear-gradient(left, #FFFFF0, #FFFFF0 10%, #F0F0EE 25%, #F0F0EE); background: -webkit-linear-gradient(left, #FFFFF0, #FFFFF0 10%, #F0F0EE 25%, #F0F0EE);
}
#faq div.innerBox.highlight h2:before {
	content: "☛ ";
}

/* food colors */
.crappy {
	color: #999;
}
.decent {
	color: black;
}
.good {
	color: green;
}
.awesome {
	color: blue;
}
.EPIC {
	color: blueviolet;
}


/*
 %s/^\s*\(box-[^:]*\|border-radius\|transition\|transform\):\s*\([^;]*\).*$/\t\1: \2; -moz-\1: \2; -webkit-\1: \2; -o-\1: \2; -ms-\1: \2;/gc
 %s/^\s*background: \([^;]*\); background: \(linear-gradient[^;]*\);.*$/\tbackground: \1; background: \2; background: -moz-\2; background: -webkit-\2;/gc
*/