/*
 * Body
 */
html {
	overflow-y: scroll;
	height: 100%;
}
.toast-item {
	font-family: Segoe UI, Arial, sans-serif;
}

body {
	margin: 0 auto;
	width: 960px;
	background-color: #444444;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222));
	background-image: -webkit-linear-gradient(top, #444444, #222222);
	background-image: -moz-linear-gradient(top, #444444, #222222);
	background-image: -ms-linear-gradient(top, #444444, #222222);
	background-image: -o-linear-gradient(top, #444444, #222222);
	background-image: linear-gradient(top, #444444, #222222);
	filter: progid
	: DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#222222');
	overflow: hidden;
}
a {
	text-decoration: none;
	color: #888;
}

/**
 * header
 */
#tka-header {
	text-shadow: 1px 1px 3px #888;
}
#tka-title {
	float: left;
	width: 500px;
	font-size: 22px;
}
#tka-title a {
	color: #000;
}
#tka-description, #tka-home {
	clear: right;
	float: right;
	width: 400px;
	font-size: 12px;
	color: #ddd;
	padding: 0;
	margin: 0;
	text-align: right;
}
#tka-home a {
	text-decoration: none;
	color: #bbb;
}
#tka-description {
	margin-top: 12px;
}
.clear {
	clear: both;
}
/*
 * Instrument in tabs
 */
.ui-state-default a.tka-instrument {
	font-size: 12px;
	color: rgba(255, 255, 255, .3);
}
.tka-instrument .tuning {
	font-weight: normal;
	font-style: italic;
	font-size: 10px;
}
.ui-state-active a.tka-instrument {
	color: #fff;
}
.ui-state-default a.tka-instrument:hover {
	color: #fff;
}
/*
 * Content and sidebar
 */
#tka-main {
	display: table;
	padding: .5em;
}
#tka-left {
	display: table-cell;
	vertical-align: top;
	width: 220px;
}
#tka-right {
	display: table-cell;
	vertical-align: top;
	width: 600px;
}
#tka-ads {
	display: table-cell;
	vertical-align: top;
	width: 125px;
}
/**
 * 	Sidebar
 */
section.tka-options {
	font-size: 11px;
}

.ui-widget .tka-button {
	font-size: .8em;
	width: 100%;
}

.tka-applet {
	height: 5px;
}

.tka-applet object {
	width: 0;
	height: 0;
}

/*
 #myTabs {
 border:1px solid #636363; width:400px;
 background:#c2c2c2 none; padding:5px;
 }
 .ui-widget-header {
 border:0; background:#c2c2c2 none; font-family:Georgia;
 }
 #myTabs .ui-widget-content {
 border:1px solid #aaaaaa; background:#ffffff none;
 font-size:80%;
 }
 .ui-state-default, .ui-widget-content .ui-state-default {
 background:#a2a2a2 none; border:1px solid #636363;
 }
 .ui-state-active, .ui-widget-content .ui-state-active {
 background:#ffffff none; border:1px solid #aaaaaa;
 }*/

/*
 * Types
 */
.tka-types {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.tka-types ul {
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 70px;
}
.tka-types ul li a {
	font-size: 16px;
	display: block;
	width: 100%;
	height: 100%;
}
.tka-types li.tka-type {
	line-height: 60px;
	display: block;
	text-decoration: none;
	text-align: center;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 2px solid transparent;
}

.tka-types li.tka-type.tka-bg-current a, .tka-types #tka-types-minor li.tka-type.tka-bg-current a {
	color: #F58400;
	font-weight: bold;
}

/*
.tka-types ul a:hover, .tka-types ul a:active {
	background-color: #F58400;
}
*/
.tka-types #tka-types-minor a {
	color: #CCC;
}
/**
 * Keys
 */
.tka-keys-section a {
	font-size: 12px;
	text-decoration: none;
	display: block;
}
.tka-keys-section ul {
	list-style-type: none;
	clear: both;
}
.tka-keys-section li {
	float: left;
	width: 66px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	margin: 2px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.tka-keys-section .tka-key-Db {
	margin-left: 35px;
}
.tka-keys-section .tka-key-Gb {
	margin-left: 70px;
}
.tka-keys-section .tka-keys-hi li.tka-bg-default, .tka-keys-section .tka-keys-hi li.tka-bg-current {
	border: 2px solid #222;
	background-color: #222;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#333333), to(#000000)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #333333, #000000); /* Chrome 10+, Saf5.1+, iOS 5+ */
	background-image:    -moz-linear-gradient(top, #333333, #000000); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #333333, #000000); /* IE10 */
	background-image:      -o-linear-gradient(top, #333333, #000000); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #333333, #000000);
	            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#333333', EndColorStr='#000000'); /* IE6–IE9 */
}

.tka-bg-white {

}

.tka-bg-black {
}

.tka-keys-section .tka-keys-lo li.tka-bg-default, .tka-keys-section .tka-keys-lo li.tka-bg-current {
	border: 2px solid #888;
	background-color: transparent;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#dddddd)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #ffffff, #dddddd); /* Chrome 10+, Saf5.1+, iOS 5+ */
	background-image:    -moz-linear-gradient(top, #ffffff, #dddddd); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #ffffff, #dddddd); /* IE10 */
	background-image:      -o-linear-gradient(top, #ffffff, #dddddd); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #ffffff, #dddddd);
	            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#dddddd'); /* IE6–IE9 */

}
.tka-keys-section .tka-keys-lo a {
	color: #333;
}

/**
 * 	Keys/chords
 */
.tka-types ul li.tka-bg-hover, .tka-keys-section li.tka-bg-hover {
  background-color: #0178A3;
  border: 2px solid #0178A3;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0178A3), to(#3D98B9)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #0178A3, #3D98B9); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #0178A3, #3D98B9); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #0178A3, #3D98B9); /* IE10 */
  background-image:      -o-linear-gradient(top, #0178A3, #3D98B9); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #0178A3, #3D98B9);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#0178A3', EndColorStr='#3D98B9'); /* IE6–IE9 */

}

._tka-types ul li.tka-bg-current, ._tka-keys-section li.tka-bg-current {
  background-color: #F58400;
  border: 2px solid #F58400;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#F58400), to(rbg(246,153,45))); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #F58400, rbg(246,153,45)); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #F58400, rbg(246,153,45)); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #F58400, rbg(246,153,45)); /* IE10 */
  background-image:      -o-linear-gradient(top, #F58400, rbg(246,153,45)); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #F58400, rbg(246,153,45));
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#F58400', EndColorStr='rbg(246,153,45)'); /* IE6–IE9 */
}

.tka-keys-section .tka-keys-lo li.tka-bg-current, .tka-keys-section .tka-keys-hi li.tka-bg-current, .tka-keys-section li.tka-bg-current {
	color: orange;
	font-weight: bold;
	border: 2px solid #F58400;
}

/*
 * Tuning/Permalink
 */
.tka-tuning, .tka-permalink {
	font-size: 10px;
	text-align: center;
	height: 14px;
	margin: 0;
}
.tka-permalink a {
	text-decoration: none;
	font-style: italic;
	color: #AAA;
}
/**
 * Title
 */
.tka-chord-title {
	clear: both;
	padding-top: 2px;
	display: block;
	text-align: center;
	color: #3D98B9;
}
.tka-chord-title h1 {
	margin: 12px;
}
/**
 * Chords
 */
.tka-chords-section {
	clear: both;
	float: left;
}
.tka-chords-section ul li {
	float: left;
}
.tka-chords-section ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
/**
 * 	footer
 */
footer p {
	text-align: right;
	color: rgba(255, 255, 255, .2);
	font-size: 8px;
	font-style: italic
}