html {
	overflow: auto;
	background: url(/static/images/background.jpg) white repeat-x;
	text-align: center;
	font-family: arial, sans-serif;
}

.x-tab-strip span.x-tab-strip-text,
p, h1, h2, h3, h4, h5, div, li, td, input, select, option {
	font-family: arial, sans-serif;
	font-size: 13px;
	text-align: left;
}

p, td, input, select, option, li, h2 {
	margin-bottom: 5px;
}

.account_settings input, .account_settings select,
p.inputhint {
	margin-bottom: 15px;
}

h1, .support h2 {
	font-size: 26px;
	font-weight: normal;
	margin-bottom: 11px;
}

a:link, a:visited, a:focus, a:hover, a:active {
	color: black;
}

body.main {
	background: none;
}

.mainPadding, .appAccountDetails {
	padding: 20px;
}

.appSettings .mainPadding,
.playersettings .mainPadding {
	border: 1px solid #999999;
	padding-right: 10px;
	padding-bottom: 5px;
	margin-bottom: 20px;
}

.playersettings div.mainPadding {
	max-width: 617px;
}

.lastParagraph {
	margin-bottom: 16px;
}

#header {
	height: 80px;
	position: relative;
	margin: 0 8px;
}

#squeezebox_logo {
	margin-top: 25px;
}

#logitech_logo, .playersettings td {
	vertical-align: top;
}

#mainmenu {
	height: 35px;
	padding: 0 10px;
	margin-bottom: 40px;
	position: relative;
}

#mainmenu_spacer {
	position:absolute;
	right: 5px;
	top: 0;
}

#installingServer a, .support a, #home_box_container a,
#header_right a, #mainmenu a, div.appSettings a, div.appHeader a, form.account_settings a {
	color: #14acac;
	font-weight: bold;
	text-decoration: none;
}

#installingServer a:hover, .support a:hover, #home_box_container a:hover,
#header_right a:hover, div.appSettings a:hover, div.appHeader a:hover, form.account_settings a:hover {
	text-decoration: underline;
}

#home_box_container a {
	font-weight: normal;
}

#mainmenu a {
	position: relative;
	top: 10px;
	padding: 9px 10px 13px;
}

#mainmenu a:link, #mainmenu a:visited, #mainmenu a:focus, #mainmenu a:hover, #mainmenu a:active {
	color: #14acac;
}

#content_header a:link, #content_header a:visited, #content_header a:focus,
#content_header a:hover, #content_header a:active,
#content_header a:focus, #content_header a:hover, #content_header a:active,
#mainmenu a:link.activeMenuItem, #mainmenu a:visited.activeMenuItem, #mainmenu a:focus.activeMenuItem,
#mainmenu a:hover.activeMenuItem, #mainmenu a:active.activeMenuItem,
#mainmenu a:focus, #mainmenu a:hover, #mainmenu a:active {
	color: white;
}

#mainmenu span.separator {
	margin: 0 0px;
	padding: 9px 0;
	top: 10px;
	position: relative;
	height: 38px;
	display: inline;
	background: url(/static/images/nav_divider_with_bg.png) no-repeat 0 0;
}

#home_heroes, #home_heroes div, #home_heroes h1 {
	text-align: center;
	background-color: transparent;
}

#home_box_container {
	margin-top: 35px;
}

#home_box_container td {
	vertical-align: top;
}

#heroesGallery .x-panel-body, #playerDetails .x-tab-panel-body {
	border-style: none;
}

#home_heroes .x-panel {
	margin-left: 205px;
}

.gradientSeparator {
	padding: 0 0 10px 0;
}

#homeHeadingOne, #homeHeadingTwo {
	text-align: center;
	padding-top: 5px;
}

#homeHeadingOne p {
	text-align: center;
	font-size: 32px;
}

#homeHeadingTwo p {
	text-align: center;
	font-size: 24px;
}

.galleryIcon {
	height: 100px;
	margin-bottom: 10px;
}

.galleryLabel {
	font-weight: bold;
	color: #14acac;
	text-decoration: none;
}

.removeFromCartLink a,
#heroesGallery a {
	text-decoration: none;
}

#content {
	top: 10px;
	min-height: 590px;
}

#content_header {
	height: 42px;
	padding: 0 12px 0 10px;
	background: url(/static/images/980_backpanel.png) no-repeat 0 0;
}

#content_header h1, h1.box-header {
	color: white;
	padding: 16px 24px;
	font-size: 100%;
}

#content_main {
	background: url(/static/images/980_backpanel.png) repeat-y -1005px 0;
	padding: 0 13px 0 11px;
	min-height: 500px;
}

.content_main_body {
	background-color: #e6e6e6;
	padding: 20px 20px 0;
}

#content_footer {
	height: 36px;
	background: url(/static/images/980_backpanel.png) no-repeat -2010px -6px;
}

div#body, #footer div {
	margin-right: auto;
	margin-left: auto;
	width: 1004px;
	text-align: left;
}

div#body {
	min-height: 550px;
	padding-bottom: 20px;
}

#installingServer {
	border: 1px rgb(153,153,153) solid;
	padding: 0px 20px 20px 20px;
	background-color: rgb(227,227,253);
}

#installingServer h2, #installingServer h3 {
	margin: 17px 0;
}

#installingServer h3 {
	color: #666666;
}


#footer {
	border-top: 1px solid gray;
	margin: 20px 0 20px;
	padding-top: 20px;
	bottom: 5px;
}

#footer_links {
	position: relative;
	top: 43px;
	left: 40px;
}

#footer_links, #footer_links a {
	color: #404040;
	text-decoration: none;
}

#header_right {
	position: absolute;
	right: 0px;
	top: 35px;
}

#tabUpItem, #tabDownItem {
	width: 24px;
	height: 24px;
	margin: 6px 5px 6px 25px;
	vertical-align: middle;
}

#tabUpItem {
	background: url(/static/images/up_pagination_button.png) no-repeat 0 0;
}

#tabDownItem {
	background: url(/static/images/down_pagination_button.png) no-repeat 0 0;
}

#tabUpItem.inactive, #tabDownItem.inactive {
	background-position: 0 -24px;
}

div.tabUpDownItem {
	border-bottom: 1px solid #b3b3b3;
	background-color: #e6e6e6;
	margin: 0;
	width: 100%;
	height: 36px;
	cursor: pointer;
}

.tabUpDownItem div {
	padding: 11px 0 0 20px;
}

.tabUpDownItem select {
	margin: 8px 0 0 20px;
	max-width: 210px;
}

div.tabUpDownItem.down {
	border-top: 1px solid #b3b3b3;
}


#outerbox {
	padding: 20px 25px 0;
}

input[type=checkbox] {
	margin-bottom: 0;
}

.padded, td.maintable {
	padding: 20px;
	vertical-align: top;
}

td.maintable.title {
	padding-bottom: 0px;
}

.input_hint  {
	margin-bottom: 15px;
}

.loginhint {
	margin-bottom: 25px;
}

form#download_form p {
	margin-bottom: 12px;
}

p.os, span#tabRange, span#tabCount {
	font-weight: bold;
}

img.osicon {
	display: inline;
	vertical-align: middle;
}

.nodownload {
	margin-top: 165px;
}

#errorMessages, .error {
	color: red;
}

.howto li, li.norm {
	margin: 0 0 10px 15px;
	list-style-type: disc;
}

li.norm {
	margin: 10px;
}

img#playerpic {
	position: relative;
	top: 0;
	right: 0;
	margin: 3px;
	float: right;
}

#appDetails, #editPlayer {
	background-color: white;
	margin-left: 240px;
	min-height: 560px;
	overflow: visible;
	padding: 20px 12px 0px 20px;
	text-align: left;
}

.appAccountDetails {
	float: right;
	width: 290px;
}

#appAddAccountLeft {
	padding: 0;
	float: left;
}

#appCreateTrial, #appAccounts, #appToAccounts {
	float: left;
	border: 1px solid #999999;
}

#appCreateTrial {
	background-color: #ebfafa;
}

#appToAccounts {
	margin-top: 20px;
}

#appToAccounts select {
	max-width: 300px;
}

div.appHeader, div.playerHeader {
	height: 130px;
	position: relative;
}

div.headerTextBox {
	width: 550px;
}

.playerHeader p {
	margin-bottom: 4px;
}

#deletePlayer, #enableDisableApp {
	position: absolute;
	top: 0;
	right: 20px;
}

#enableDisableApp p {
	text-align: right;
}

#deletePlayer #deletePlayerBtn,
#deletePlayer #disconnectPlayerBtn {
	text-align: right;
}

#deletePlayerBtn {
	margin-top: 5px;
}

img.appIcon, img.playerIcon {
	float: left;
	margin-right: 20px;
	height: 100px;
}

#appDetails ul, .support ul {
	list-style: disc outside none;
	padding-left: 20px;
}

.support ul, .support p {
	margin-bottom: 15px;
}

.support h3 {
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 10px;
}

div.appDescription {
	margin-top: 10px;
}

.shoppingCartDetails h2,
.appSettings h2,
.appAccountDetails h2,
.appDescription h1,
.appDescription h2,
.appDescription h3 {
	font-weight: normal;
	font-size: 18px;
	margin-bottom: 6px;
	margin-top: 12px;
}

#setAppInfo th {
	font-weight: bold;
}

.appAccountDetails h2, div.appAccountDetailsDetail {
	margin-bottom: 20px;
}

div.appAccountDetailsDetail div {
	margin-left: 25px;
}

.appDescription p {
	margin-bottom: 10px;
}

#playerNavigation, #appNavigation {
	overflow: hidden;
	height: 429px;
}

.navigation {
	float: left;
	width: 240px;
	height: 550px;
}

span.dragHandle {
	cursor: move;
}

.removeFromCartLink img, .draggable img, #appAccounts img {
	vertical-align: bottom;
}

.x-dd-drop-nodrop .x-dd-drop-icon {
	background-image: none;
}

.x-dd-drag-proxy li {
	list-style-type: none;
	list-style-position: outside;
}


/* front page animation */
#slideShowContainer {
	position: relative;
}

#slideShowContainer div.slide {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}

div.slideText {
	position: absolute;
	left: 44px;
	top: 360px;
	width: 340px;
}

.slide div, .slide h1 {
	color: white;
	text-align: center;
	font-size: 16px;
}

.slideDivider {
	margin: 0 0 26px;
}

.slide h1 {
	font-size: 24px;
}

img#slideBack, img#slideForward {
	position: absolute;
	top: 370px;
	cursor: pointer;
}

img#slideBack {
	left: 0;
}

img#slideForward {
	right: 0;
}

img#slidePaginator {
	position: absolute;
	top: 440px;
	left: 150px;
}


/* favorites */
.favoriteTitle, .favoriteUrl,
.addFavoriteIcon, .deleteFavoriteIcon {
	display: inline-block;
}

.favoriteTitle {
	width: 300px;
}

.favoriteUrl {
	width: 500px;
}

.addFavoriteIcon, .deleteFavoriteIcon {
	width: 30px;
}


/* boxes */
.box-content {
	padding: 15px 12px 1px 18px;
	background: url(/static/images/white_gradient_overlay.png) repeat-x 0 0;
	margin: 0 4px;
}

.box-240 {
	width: 264px;
}

div.box-240-top {
	background: url(/static/images/240_backpanel.png) no-repeat 0 0;
	height: 42px;
}

div.box-240-inner {
	background: url(/static/images/240_backpanel.png) repeat-y -264px 0;
}

div.box-240-bottom {
	background: url(/static/images/240_backpanel.png) no-repeat -528px -13px;
	font-size: 5px;
	height: 30px;
}

.box-240-inner div.box-content {
	margin: 0 12px;
	min-height: 147px;
}

.box-320-inner div.box-content {
	min-height: 160px;
}


h1.box-header {
	padding: 17px 0 0 30px;
}


.box-460 {
	width: 484px;
}

div.box-460-top {
	background: url(/static/images/460_backpanel.png) no-repeat 0 0;
	height: 42px;
}

div.box-460-inner {
	background: url(/static/images/460_backpanel.png) repeat-y -484px 0;
}

.box-460-inner div.box-content {
	background: url(/static/images/black_gradient_overlay.png) repeat-x 0 0;
	min-height: 460px;
	color: white;
	margin: 0 12px;
	padding-top: 0;
}

div.box-460-bottom {
	background: url(/static/images/460_backpanel.png) no-repeat -968px -13px;
	font-size: 5px;
	height: 30px;
}


.box-320 {
	width: 328px;
}

div.box-320-top {
	background: url(/static/images/320_frontpanel.png) no-repeat 0 0;
	height: 40px;
}

div.box-320-inner {
	background: url(/static/images/320_frontpanel.png) repeat-y -328px 0;
}

div.box-320-bottom {
	background: url(/static/images/320_frontpanel.png) no-repeat -656px -15px;
	font-size: 5px;
	height: 25px;
}


.box-380 {
	width: 388px;
}

div.box-380-top {
	background: url(/static/images/380_frontpanel.png) no-repeat 0 0;
	height: 40px;
}

div.box-380-inner {
	background: url(/static/images/380_frontpanel.png) repeat-y -388px 0;
}

div.box-380-bottom {
	background: url(/static/images/380_frontpanel.png) no-repeat -776px -15px;
	font-size: 5px;
	height: 25px;
}


.box-700 {
	width: 708px;
}

div.box-700-top {
	background: url(/static/images/700_frontpanel.png) no-repeat 0 0;
	height: 40px;
}

div.box-700-inner {
	background: url(/static/images/700_frontpanel.png) repeat-y -708px 0;
}

div.box-700-bottom {
	background: url(/static/images/700_frontpanel.png) no-repeat -1416px -15px;
	font-size: 5px;
	height: 25px;
}

#appDetails div.box-700-top,
#playerDetails div.box-700-top {
	height: 16px;
	background-position: 0 -2px;
}


.box-897 {
	width: 897px;
	margin-left: 18px;
}

div.box-897-top {
	background: url(/static/images/897_frontpanel.png) no-repeat 0 0;
	height: 40px;
}

div.box-897-inner {
	background: url(/static/images/897_frontpanel.png) repeat-y -897px 0;
}

div.box-897-bottom {
	background: url(/static/images/897_frontpanel.png) no-repeat -1794px -15px;
	font-size: 5px;
	height: 25px;
}

.box-320 h1.box-header,
.box-380 h1.box-header,
.box-700 h1.box-header,
.box-897 h1.box-header {
		padding: 15px 0 0 25px;
}

.box-897 h1.box-header {
	padding-top: 10px;
}

.box-320 .box-content,
.box-380 .box-content,
.box-897 .box-content,
.box-700 .box-content {
	padding-left: 21px;
}

.box-700 h1.box-header {
	color: black;
}


/* buttons */

#msg-div {
	position: absolute;
	left: 35%;
	top: 10px;
	width: 350px;
	z-index: 20000;
}


/* primary buttons */
.btn-primary .x-btn-text,
.btn-primary .x-btn button,
.btn-secondary .x-btn-text,
.btn-secondary .x-btn button {
	font-size: 12px;
	padding-bottom: 4px;
	margin: 0 15px 5px;
	color: white;
	font-weight: bold;
}

.x-item-disabled .x-btn-text,
.x-item-disabled .x-btn button {
	color: gray !important;
}

.btn-secondary .x-btn-text,
.btn-secondary .x-btn button {
	color: black;
	font-weight: normal;
}

.btn-primary .x-btn-ml,
.btn-primary .x-btn-mr,
.btn-primary .x-btn-mc {
	background-image: url(/static/images/primary_button.png);
}

.btn-secondary .x-btn-ml,
.btn-secondary .x-btn-mr,
.btn-secondary .x-btn-mc {
	background-image: url(/static/images/secondary_button.png);
}

.btn-primary .x-btn-ml,
.btn-primary .x-btn-mr,
.btn-secondary .x-btn-ml,
.btn-secondary .x-btn-mr {
	background-position: 0 0;
	width: 10px;
	height: 32px;
}

.btn-primary .x-btn-mc,
.btn-secondary .x-btn-mc {
	background-position: 0 -32px;
	vertical-align: middle;
}

.btn-primary .x-btn-mr,
.btn-secondary .x-btn-mr {
	background-position: 0 -64px;
}

.x-btn-tl, .x-btn-tc, .x-btn-tr,
.x-btn-bl, .x-btn-bc, .x-btn-br {
	background-image: none;
 }


/* app heroes slide show */
.x-carousel-layout {
    overflow: hidden;
    position: relative;
    zoom: 1;
}

.x-carousel-left-scrollbutton {
    width: 50px;
    position: absolute;
    top: 0;
    margin-top: 48px;
    background: url(/static/images/left_arrow.png) no-repeat 0px top;
    height: 100%;
    cursor: pointer;
}

.x-carousel-layout.x-scroll-button-position-right .x-carousel-left-scrollbutton {
    right: 50px;
}

.x-carousel-layout.x-scroll-button-position-left .x-carousel-left-scrollbutton,
.x-carousel-layout.x-scroll-button-position-split .x-carousel-left-scrollbutton {
    left: 0px;
}

.x-carousel-right-scrollbutton {
    width: 50px;
    position: absolute;
    text-align: right;
    top: 0;
    margin-top: 48px;
    background: url(/static/images/right_arrow.png) no-repeat right top;
    height: 100%;
    cursor: pointer;
}

.x-carousel-layout.x-scroll-button-position-right .x-carousel-right-scrollbutton,
.x-carousel-layout.x-scroll-button-position-split .x-carousel-right-scrollbutton {
    right: 0px;
}

.x-carousel-layout.x-scroll-button-position-left .x-carousel-right-scrollbutton {
    left: 23px;
}

.x-carousel-scroller {
    overflow: hidden;
    position: relative;
    left: 5px;
}

.x-carousel-layout.x-scroll-button-position-left .x-carousel-scroller {
    left: 41px;
}

.x-carousel-layout.x-scroll-button-position-split .x-carousel-scroller {
    left: 55px;
}

.x-carousel-body {
	width: 20000px;
    overflow: hidden;
    zoom: 1;
}

.x-carousel-scroller .x-carousel-body .x-carousel-item {
    float: left;
    overflow: hidden;
    zoom: 1
}


#settingsPanel {
	margin: 0 25px;
	height: 30px;
}

#playerDetails {
	margin-bottom: 20px;
}

div.alarmSettings,
div.playersettings {
	display: none;
}

.playersettings p, .playersettings h2,
.playersettings select, .playersettings input {
	margin-bottom: 10px;
	max-width: 660px;
}

select.alarmPlaylists {
	max-width: 400px;
}

.playersettings h1 {
	font-size: 18px;
}

.playersettings table {
	width: 98%;
}

.playersettings td.half {
	width: 50%;
}

.shoppingCartDetails td,
.playersettings td,
.playersettings th {
	vertical-align: top;
}

.shoppingCartDetails td {
	padding-bottom: 15px;
}

.cartPrice {
	text-align: right;
	font-weight: bold;
}


/* settings tabs and tab panel (settings) */
.mySBTabs .x-tab-strip-top .x-tab-strip-text {
	padding: 9px 9px 5px;
}

.mySBTabs .x-tab-strip-top .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
	padding-bottom: 6px;
}

.mySBTabs .x-tab-panel-header,
.mySBTabs .x-border-layout-ct .x-tab-panel,
.mySBTabs ul.x-tab-strip-top {
	border: none;
	background: none;
	padding-bottom: 0;
}

.mySBTabs .x-tab-strip-top .x-tab-right,
.mySBTabs .x-tab-strip-top .x-tab-left,
.mySBTabs .x-tab-strip-top .x-tab-strip-inner {
	background-image: url(/static/images/tab_sprite.png);
}

.mySBTabs .x-tab-strip-top .x-tab-left {
	background-position: right -150px;
}

.mySBTabs .x-tab-strip-top .x-tab-right {
	background-position: 0 -90px;
	padding-left: 12px;
}

.mySBTabs .x-tab-strip-top .x-tab-strip-inner {
	background-position: 0 -120px;
}

.mySBTabs .x-tab-strip-top .x-tab-strip-active .x-tab-left {
	background-position: right -60px;
}

.mySBTabs .x-tab-strip-top .x-tab-strip-active .x-tab-right {
	background-position: 0 0;
	padding-left: 12px;
}

.mySBTabs .x-tab-strip-top .x-tab-strip-active .x-tab-strip-inner {
	background-position: 0 -30px;
}

.mySBTabs .x-tab-strip span.x-tab-strip-text {
	font-weight: bold;
	color: #555555;
}

.mySBTabs .x-tab-strip-active span.x-tab-strip-text,
.mySBTabs .x-tab-strip-over span.x-tab-strip-text {
	color: black;
}

#settingsPanel.mySBTabs ul {
	padding-left: 0;
	list-style: none;
}



/* buttons */
.x-btn {
	display: inline-table;
	font-family: sans-serif;
}


/* vertical tabs */
.ux-vertical-tabs .x-tab-panel-header, .x-tab-panel-footer {
	background: #F6F6F6 none repeat scroll 0 0;
}

#appNavigation, #playerNavigation,
.ux-vertical-tabs .x-tab-strip-top .x-tab-right,
.ux-vertical-tabs .x-tab-strip-top .x-tab-left,
.ux-vertical-tabs .x-tab-strip-top .x-tab-strip-inner {
	background: url(/static/images/vertical_tab_bg.png) repeat-x 0 2px;
}

.ux-vertical-tabs .x-tab-strip-top .x-tab-strip-active .x-tab-right,
.ux-vertical-tabs .x-tab-strip-top .x-tab-strip-active .x-tab-left,
.ux-vertical-tabs .x-tab-strip-top .x-tab-strip-active .x-tab-strip-inner {
	background-color: white;
}

.ux-vertical-tabs .x-tab-strip span.x-tab-strip-text,
.ux-vertical-tabs .x-tab-strip-active span.x-tab-strip-text {
	color: black;
	font-weight: normal;
}

.x-window .ux-vertical-tabs{
  border:none;
}

.ux-vertical-tabs-left .x-tab-panel-header {
  float: left;
}

.ux-vertical-tabs-right .x-tab-panel-header {
  float: right;
}

.ux-vertical-tabs-alignright .x-tab-strip .x-tab-with-icon span.x-tab-strip-text{
  padding-right:20px;
  padding-left:0;
  background-position:right 3px; 
}


.ux-vertical-tabs .x-tab-strip-top .x-tab-strip-active .x-tab-right span.x-tab-strip-text {
	padding-bottom: 4px;
	height: 34px;
}

.ux-vertical-tabs, .ux-vertical-tabs .x-tab-panel-bwrap, .ux-vertical-tabs .x-tab-panel-body{
	height:100%;
}

.ux-vertical-tabs ul.x-tab-strip li {
	border-bottom: 1px solid #b3b3b3;
	margin: 0;
	width: 100%;
}

.ux-vertical-tabs .x-tab-strip a.x-tab-strip-close,
.ux-vertical-tabs .x-tab-edge{
	display: none;
}

.ux-vertical-tabs ul.x-tab-strip li .x-tab-strip-inner {
	padding: 0 20px;
}

.ux-vertical-tabs ul.x-tab-strip li .x-tab-strip-inner img {
	height: 34px;
	vertical-align: middle;
	margin-right: 5px;
}

.ux-vertical-tabs .x-tab-left,
.ux-vertical-tabs .x-tab-strip .x-tab-with-icon .x-tab-right,
.ux-vertical-tabs .x-tab-strip-top .x-tab-right {
	background: none;
	padding: 0;
}

.ux-vertical-tabs ul.x-tab-strip-top {
  background: none;
  border: none;
  padding-top: 0;
}

.ux-vertical-tabs .x-tab-panel-header {
  border:0 none transparent;
}


.ux-vertical-tabs-alignright ul.x-tab-strip {
  width: 100%;
}

.ux-vertical-tabs-alignright ul.x-tab-strip li {
  clear: both;
  margin: 0;
  text-align: right;
  width: 100%;
}

.ux-vertical-tabs .x-tab-panel-body{
  padding:5px;
  border:0;
}

.ux-vertical-tabs-left .x-tab-panel-bwrap{
  border-left:1px solid #8DB2E3;
}

.ux-vertical-tabs-right .x-tab-panel-bwrap{
  border-right:1px solid #8DB2E3;    
}

.ux-vertical-tabs .x-tab-strip-top .x-tab-strip-inner {
  background-position:0 -202px;
}

.ux-vertical-tabs .x-tab-strip-top .x-tab-strip-active .x-tab-right {
	margin-bottom: 0;
}


.loading-indicator {
	margin: 0;
	min-width: 20px;
	height: 32px;
}

#noJS {
	color: #14acac;
	font-weight: bold;
	align: center;
	padding: 5px 20px;
}