/* element wird in dynscale.jquery.js erzeugt */
#dsmode { width: 10px; }

html, body {
	font-family: Arial, Helvetica, sans-serif;
	font-family: "Source Sans Pro", Arial, Helvetica, sans-serif;
	font-size: 15px;
	line-height: 1.2em;
	margin: 0;
	padding: 0;
}

html {
	min-width: 300px;
	max-width: 100%;
}

body {
	overflow-y: scroll;
	background: #444;
/* 	text-align: center; */
	background: #777;
}

/**
 * Micro clearfix by Nicolas Gallagher
 * http://nicolasgallagher.com/micro-clearfix-hack/
 */
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

a {
	color: #222;
	text-decoration: underline;
}
a:HOVER, a:FOCUS {
/* 	text-decoration: none; */
	
}

img {
	border: none;
}

hr {	
	height: 1px;
	border: 0;
	border-top: 1px solid #999;
	box-shadow: 0px 0px 2px rgba(0,0,0,0.25);
}

p {
	margin: 0 0 1em 0;
}

.bbox, .bbox::after, .bbox::before {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

h1 {
	letter-spacing: 1px;
	font-size: 1.4em;
/* 	text-transform: uppercase; */
	font-weight: 600;
	color: #444;
	margin: 0.8em 0 0.5em;
}
h2 {
	letter-spacing: 1px;
	font-size: 1.04em;
	font-weight: normal;
/* 	font-weight: 600; */
	margin: 0 0 1em;
}
h3 {
/* 	letter-spacing: 1px; */
	font-size: 1.0em;
	margin: 1em 0 0 0;
}
h4 {
	font-size: 1.0em;
}
h5 {
	font-size: 1.0em;
}
h6 {
	font-size: 1.0em;
}

td, th {
	vertical-align: top;
	padding: 0.15em 2em 0.15em 0;
}

.pull-left { float: left; }
.pull-right { float: right; }

#canvas {
	position: relative;
	width: 990px;
	background: #333;
	padding: 10px 0 10px 10px;
	text-align: left;
	
	margin: 0 0 1.0em;
	margin: 0.75em auto 1.0em;
/* 	margin-left: auto; */
/* 	margin-right: auto; */
/* 	box-shadow: 0px 0px 12px rgba(255,255,255,0.5); */
	box-shadow: 0px 0px 18px rgba(0,0,0,0.75);
}

#header {
	position: relative;
	height: 80px;
}
#logo { display: inline-block; height: 90px; }
#logo a { display: block; background: #ff9801; height: 70px; }

#topMenu {
	position: absolute;
	top: 0;
/* 	right: 172px; */
	right: 235px;
}
#topMenu a {
	display: inline-block;
}
#topMenu .button {
	margin-left: 8px;
}

#search {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 150px;
	z-index: 10;
/* 	background: #ccc; */
}
#search a {
	color: #fff;
}

.searchformContainer {
	position: relative;
	margin: 6px 0 2em;
/* 	padding: 5px; */
	overflow: hidden;
}

#search .searchformContainer {
	display: block;
}
#mainContent .searchformContainer {
	display: none;
}


#search label {
	color: #ff9801;
/* 	font-size: 0.89em; */
	font-size: 0.95em;
	margin: 0 0 0.25em;
	line-height: normal;
}
#search input {
	width: 144px;
	line-height: normal;
}
/* select { */
/* 	font: inherit; */
/* } */
#search select {
	width: 150px;
	line-height: normal;
}
#search .form_row {
	margin-bottom: 1em;
	line-height: normal;
}
#search #form_search__submit {
	display: block;
	margin-top: 2.5em;
	width: 150px;
	line-height: normal;
}

#additionalInfoContainer {
	font-size: 0.85em;
	margin: 1em 0 0 0;
}
#additionalInfoContainer .item {
	margin-bottom: 1.5em;
}
#additionalInfoContainer a.arrow:before {
	position: relative;
	content: "»";
/* 	color: #ff9801; */
	display: inline-block; 
	text-decoration: none!important;
	margin-right: 0.5em;
}
#additionalInfoContainer a {
	text-decoration: none;
}
#additionalInfoContainer a:hover {
	color: #ff9801;
/* 	text-decoration: underline; */
}


.button {
	display: inline-block;
	overflow: hidden;
	width: 150px;
	height: 70px;
	background: url("../gfx/buttons.png") no-repeat;
}
.button-new {
	background-position: 0 0;
}
.button-new:hover, .button-new.active {
	background-position: 0 -70px;
}
.button-catalogue {
	background-position: -150px 0;
}
.button-catalogue:hover, .button-catalogue.active {
	background-position: -150px -70px;
}
.button-offers {
	background-position: -300px 0;
}
.button-offers:hover, .button-offers.active {
	background-position: -300px -70px;
}
.button-search {
	position: relative;
	display: block;
	background-position: -450px 0;
}
/*.button-search:hover, /**/ .button-search.active {
	background-position: -450px -70px;
}

#searchButtonContainer {
	
	width: 150px;
	margin: -10px 0 0 -10px;
	padding: 10px 10px 10px 10px;
	
	background: #393939;
	background: -webkit-linear-gradient(top left, #333, #404040); 
	background: -o-linear-gradient(bottom left, #333, #404040); 
	background: -moz-linear-gradient(bottom left, #333, #404040); 
	background: linear-gradient(to bottom left, #333, #404040); 
}

#searchButtonContainer a {
	cursor: default;
}

#mainMenu {
	position: relative;
	text-transform: uppercase;
	margin: 0;
	background: #555 url("../gfx/logo.png") no-repeat 0 -80px;
	padding-left: 110px;
	letter-spacing: 1px;
	font-size: 90%;
/* 	border-right: 170px solid #725020; */
	border-right: 170px solid #636363;
}

#mainMenu a {
	color: #fff;
	text-decoration: none;
	display: inline-block;
	height: 34px;
	line-height: 34px;
	padding: 0 20px;
	text-align: center;
	font-weight: bold;
}
#mainMenu a:hover, #mainMenu a.active {
	color: #ff9801;
}
#main {
	position: relative;
	overflow: hidden;
	background: #eee url("../gfx/main-bg.png") repeat-y;
	margin-right: 170px;
}
#footer {
	background: #555;
/* 	margin-right: 10px; */
}
#footerMenu {
	text-align: center;
}
#footerMenu a {
	color: #fff;
	text-decoration: none;
	display: inline-block;
	padding: 10px 20px;
	
}
#footerMenu a:hover, #footerMenu a.active {
	color: #ff9801;	
}
#categoryMenu {
	display: block;
	background: #ccc;
	float: left;
	width: 212px;
	line-height: 1.4em;
	
/* 	text-align: right; */
}
#categoryMenu ul {
	list-style: square;
	margin: 10px 0px 8px 8px;
	padding: 0 0 0 1em;
	color: #777;
}
#categoryMenu li {
	margin: 0 0 0.2em 0;
	text-transform: capitalize;
}
#categoryMenu li:hover,
#categoryMenu li.active {
	color: #ff9801;
}
#categoryMenu a {
	color: #444;
	text-decoration: none;
}
#categoryMenu a:hover, #categoryMenu li.active a {
	color: #000;
}

.img-responsive {
    display: block;
    height: auto;
    max-width: 100%;
}

#mainContent {
	overflow: hidden;
	color: #000;
	line-height: 1.5em;
	padding: 0 15px 15px;
	margin-left: 212px;
/* 	border-left: 212px solid #ccc; */
}
.cover a {
	text-decoration: none !important;
	display: block;
}
.cover .no-cover {
	display: block;
	text-align: center;
	vertical-align: middle;
	display: block;
	
	font-weight: bold;
	font-size: 2.25em;
	color: #ccc;
	text-shadow: 1px 1px 4px rgba(0,0,0,0.7);
	
	/*
	border: 1px solid #aaa;
	background: #bbb;
	
	background: -webkit-linear-gradient(top left, #ddd, #aaa, #ddd); 
	background: -o-linear-gradient(bottom right, #ddd, #aaa, #ddd); 
	background: -moz-linear-gradient(bottom right, #ddd, #aaa, #ddd); 
	background: linear-gradient(to bottom right, #ddd, #aaa, #ddd);
	/**/	
}
/* .cover .no-cover:after { */
/* 	content: "?"; */
/* } */

body.category-new #mainContent h1,
body.category-new #mainContent h2 {
	color: #446;
}
body.category-catalogue #mainContent h1,
body.category-catalogue #mainContent h2 {
	color: #733;
}
/* body.category-offers #mainContent h1, */
/* body.category-offers #mainContent h2 { */
/* 	color: #242; */
/* } */


.grid-list {
	position: relative;
	list-style: none;
	margin: 2em -3.05% 1em 0;
	padding: 0;
	font-size: 86%;
	line-height: 1.2em;
	overflow: hidden;
}
.grid-list li {
	position: relative;
	display: block;
	float: left;
	width: 31%;
	height: 290px;
	margin-right: 2%;
}
/* .grid-list li:last-child { */
/* 	margin-right: 0; */
/* } */

.grid-list li.separator {
	width: 97%;
	height: 1px;
	border: 0;
	background: #999;
	box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.25);
	margin: 1em 0 2em;
}
.grid-list li.separator.n2 {
	display: none;
}

.grid-list .cover img {
	display: block;
	width: 150px;
	height: 150px;
}

.grid-list .description .artist { display: block; }

.grid-list .price {
	position: absolute;
	left: 0px;
	bottom: 0.5em;
	font-size: inherit
}
.grid-list .cart-button {
	position: absolute;
	right: 35px;
	bottom: 0;
}

/**
 * PAGINATION
 */
.pagination {
	overflow: hidden;
	line-height: 30px;
	padding: 5px;
	margin: 10px -5px;
}
.pagination .info {
	float: left;
}
.pagination .navigation {
	float: right;
}
.pagination .navigation div {
	display: inline-block;
}
.pagination .navigation a,
.pagination .navigation span {
	font-family: "Consolas";
	display: block;
	width: 35px;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	font-size: 20px;
	margin: 0 0 0 4px; 
	color: #707070;
/* 	border: 1px solid #ccc; */
	background: #ddd;
	box-shadow: 0 0 5px 0px rgba(0,0,0,0.25);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.pagination .navigation a:hover {
	color: #555;
	box-shadow: 0 0 5px 1px rgba(0,0,0,0.35);
}

.pagination .navigation span.disabled {
	cursor: default;
	color: #aaa;
	box-shadow: 0 0 5px 0px rgba(0,0,0,0.15);
}

/**
 * RESULT LIST
 */
.result-list {
	list-style: none;
	margin: 0 0 1.5em 0;
	padding: 0;
	display: table;
	width: 100%;
	font-size: 0.9em;
	line-height: 1.2em;
/* 	background: #ccc; */
}
.result-list > li {
	display: table-row;
}
.result-list > li.head {
	background: #ccc;
	font-size: 0.96em;
	white-space: nowrap;
}
.result-list > li.head > div {
	font-weight: bold;
	text-align: center /*!important/**/;
	border-right: 1px solid #ddd;
	vertical-align: middle;
	line-height: 2em;
	height: auto;
	text-decoration: none !important;
}
.result-list > li.even {
	background: #ddd;
}
.result-list > li > div {
	display: table-cell;
	vertical-align: top;
	border-bottom: 1px solid #ddd;
/* 	border-right: 1px solid #ddd; */
	padding: 4px 4px;
	vertical-align: middle;
}
.result-list .cover {
/* 	padding-left: 0; */
	border-left: 1px solid #ddd;
	width: 60px;
	height: 60px;
}
.result-list .cover .no-cover {
	width: 59px;
	height: 59px;
}
.details .cover.no-cover {
	display: none;
}
.details .cover.no-cover .no-cover {
	width: 248px;
	height: 248px;
	font-size: 16em;
	cursor: default;
}

.result-list img {
	display: block;
}
.result-list .cover img {
	width: 100%;
	height: auto;
}
.result-list .artist,
.result-list .product {
	width: 100px;
}
.result-list .title {
	width: 125px;
}
.result-list .title a {
	text-decoration: underline;
}
.result-list .format {
	width: 100px;
}
.result-list .style {
}
.result-list .price {
	white-space: nowrap;
	text-align: right !important;
	width: 100px;
}
.result-list .count {
	white-space: nowrap;
	text-align: center !important;
}
.result-list .count .mobile-title {
	display: none;
}
.result-list .count input {
	width: 1.5em;
	text-align: right;
}

.result-list .basket {
/* 	padding-right: 0; */
/* 	border-right: 0 !important; */
	border-right: 1px solid #ddd !important;
	width: 25px;
}
.result-list .orderNumber {
	width: 100px;
}

.result-list.cart .cover .no-cover,
.result-list .row.hifi .cover .no-cover {
	display: none;
}

.result-list .actions {
	text-align: center;
	font-weight: bold;
}

.details .description table {
	border-collapse: collapse;
}
.details .description table td,
.details .description table th {
	padding: 0 0.75em 0 0;
}
.details .cover {
	float: left;
	margin-right: 15px;
	margin-bottom: 1em;
}

.page-action-list {
	display: block;
	text-align: center;
	list-style: none;
	padding: 0;
	margin: 3em 0;
}
.page-action-list li {
	display: inline-block;
	margin: 0 20px 0 0;
	padding: 0;
	text-align: center;
}
.page-action-list li a {
	display: block;
	margin: 0;
/* 	text-transform: uppercase; */
}

.page-action-list .link-button {
	min-width: 120px;
}

.link-button {
	text-decoration: none;
	cursor: pointer;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	font-size: 1.1em;
	padding: 10px 20px;
	background: #ddd;
	box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.25);
	
}
.link-button:hover {
	box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
}
.link-button.info {
	background: #058;
	color: #fff;
}
.link-button.success {
	background: #084;
	color: #fff;
	box-shadow: 0px 0px 6px 0px rgba(0,120,0,0.7);
}
.link-button.success:hover {
	box-shadow: 0px 0px 6px 0px rgba(0,80,0,0.9);
}

.link-button.info {
	background: #058;
	color: #fff;
}
.link-button.mds {
	background: #ff9801;
	color: #fff;
}

label {
	display: inline-block;
	line-height: 1.5em;
	width: 175px;
	vertical-align: top;
}

.form_row.checkbox label {
	width: auto;
}
.form_row.checkbox input {
	width: auto;
}

.form_row {
	margin: 0 0 0.5em 0;
}

.form_row.required label:AFTER {
	display: inline-block;
	content: '*';
}

input, 
textarea {
/* 	width: 50%; */
	width: 394px;
	line-height: 1.5em;
	display: inline-block;
/* 	display: block; */
}
select {
	width: auto;
	line-height: 1.5em;
	display: inline-block;
/* 	display: block; */
}

#mainContent select,
#mainContent input,
#mainContent textarea {
	font: inherit;
	max-width: 99%;
}

.form_legend {
	margin: 1em 0;
	font-weight: bold;
/* 	text-decoration: underline; */
/* 	margin-left: 180px; */
/* 	text-align: center; */
	font-size: 0.9em;
	color: #800;
/* 	font-style: italic; */
}

input[type=submit].link-button,
input[type=reset].link-button,
button.link-button {
	line-height: inherit;
	height: inherit;
	width: inherit;
	min-width: 160px;
	font-family: inherit;
	border: 0;
/*   padding: 0; */
}
input[type=submit].link-button::-moz-focus-inner,
input[type=reset].link-button::-moz-focus-inner,
button.link-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}

.error {
	color: #900;
}
.form_message {
	margin: 1em 0;
	padding: 1em;
	border: 1px solid #900;
}


#mobileSearch,
#mobileCatalogueSelectorContainer {
	display: none;
}
#mobileSearch {
	width: calc(100% - 233px);
	float: right;
	margin-right: 10px;
	padding: 10px;
	background: #888;
}
#mobileSearch input {
	color: #555;
	width: 100%;
	height: 50px;
	padding: 0 8px;
	font-size: 140%;
	letter-spacing: 1px;
}

#mainContent .searchformContainer input {
	width: 99%;
}
#mainContent .searchformContainer select {
	width: 100%;
	max-width: 100%;
}
#mainContent .searchformContainer option {
	height: 1.5em;
}
#mainContent .searchformContainer input[type=submit] {
	width: auto;
}

#flashMessagesContainer {
	position: relative;
	margin-top: 20px;
/* 	z-index: 99; */
	width: 98%;
	width: calc(100% - 20px);
	width: 100%;
	text-align: center;
/* 	font-size: 110%; */
}
#flashMessagesContainer ul {
	position: relative;
	list-style: none;
	width: 90%;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: left;
}
.message {
	position: relative;
	display: block;
	padding: 20px;
	margin: 0 0 15px 0;
/* 	border-radius: 5px; */
	border-width: 1px;
	border-style: solid;
/* 	box-shadow: 0 0 8px 8px rgba(0,0,0,0.5); */
	cursor: pointer;
}
.message-dismiss {
	position: absolute;
	right: 10px; top: 0;
	font-size: 120%;
	font-weight: bold;
	color: #aaa;
}
.message-dismiss:hover { color: #999; }

.message-success {
	background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d;
}
.message-info {
	background-color: #d9edf7;
	border-color: #bce8f1;
	color: #31708f;
}
.message-error {
	background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}