/* shared */
html {background: #dcdcdc}

section {
	position: absolute;
	width: 100%;
	height: 100%;
	background-size: cover;
	display: none
}

article, aside {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 720px;
	height: 420px;
	margin-left: -360px;
	margin-top: -210px;
}

a.download { font-family: "Courier New", Courier, monospace; text-align: center; text-decoration: none; color: white; text-transform: uppercase}

input { display: block; margin: 0 auto; width: 300px; padding: 5px; text-align: center; border: 0}
input[type="email"] { background: white; }
input[type="submit"] { background: #f00; color: white; cursor: pointer}

aside p { padding: 0 100px; font-size: 116%;}
aside { display: none; background: black; color: white; font-family: "Courier New", Courier, monospace; text-align: center}
aside p { display: table-cell; vertical-align: middle; text-align: center}
aside a { color: white; text-decoration: none}

article img:first-child { display: block; margin: 0 auto; cursor: pointer; margin-top: 92px}

/* track numbers */
li { display: inline}
.track-list { display: block; margin: 10px auto; height: 65px; width: 127px;}
.track-list a { 
	background: url(img/track-numbers.png) no-repeat;
	height: 65px; 
	display: block;
	float: left;
	text-indent: -9999px;
	cursor: pointer;
}
.track-list li:nth-child(1) a { width: 23px; margin-right: 5px; background-position: 0 0}
.track-list li:nth-child(2) a { width: 43px; margin-right: 5px; background-position: -28px 0}
.track-list li:nth-child(3) a { width: 48px; margin-right: 3px; background-position: -76px 0}

/* contact+newsletter */
.make-contact { display: block; margin: 0 auto; height: 63px; width: 115px;}
.make-contact a { 
	background: url(img/make-contact.png) no-repeat;
	height: 63px; 
	display: block;
	float: left;
	text-indent: -9999px;
}
.make-contact li:nth-child(1) a { width: 40px; margin-right: 12px}
.make-contact li:nth-child(2) a { width: 63px; background-position: -52px 0}


/* section-specific */

#home { background-image: url(img/bg_home0.jpg)}
#my-way { background-image: url(img/bg_my-way.jpg)}
#oscar { background-image: url(img/bg_oscar.jpg)}
#cubizm { background-image: url(img/bg_cubizm.jpg)}

#home aside#about { background: #00f}
aside#newsletter { background: #f00}
aside#newsletter form { display: inline !important}

#my-way article img:first-child { margin-top: 20px;}

audio { display: block; margin: 10px auto; width: 318px}

/* audio player */
.mejs-container {
	position: relative;
	margin: 0 auto 10px auto;
}

.mejs-embed, .mejs-embed body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background: white;
	overflow: hidden;
}

/* Start: CONTROL BAR */
.mejs-container .mejs-controls {
	position: absolute;
	background: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	bottom: 0;
	left: 0;
	height: 11px;
	width: 100%;
}
.mejs-container .mejs-controls  div {
	display: block;
	float: left;
	width: 507px;
	height: 11px;
	background: 0;
	border: 0;
}

/* :focus for accessibility */
.mejs-controls .mejs-button button:focus {
	outline: solid 1px yellow;
}

/* End: CONTROL BAR */


/* Start: Progress bar */
.mejs-controls div.mejs-time-rail {
	width: 100%;
	padding-top: 0;
}
.mejs-controls .mejs-time-rail span {
	display: block;
	position: absolute;
	width: 100%;
	height: 11px;
	cursor: pointer;
}
.mejs-controls .mejs-time-rail .mejs-time-total {
	background: rgba(255,255,255,.4);
}
.mejs-controls .mejs-time-rail .mejs-time-loaded {
	/*background: rgba(255,255,255,.5);*/
	width: 0;
}
.mejs-controls .mejs-time-rail .mejs-time-current {
	width: 0;
	background: white;
}

.mejs-controls .mejs-time-rail .mejs-time-handle {
	display: none;
	position: absolute;
	margin: 0;
	width: 10px;
	background: #fff;
	cursor: pointer;
	border: solid 2px #333;
	top: -2px;
	text-align: center;
}

.mejs-controls .mejs-time-rail .mejs-time-float {
	visibility: hidden;
	position: absolute;
	display: block;
	background: #eee;
	width: 36px;
	height: 17px;
	border: solid 1px #333;
	top: -26px;
	margin-left: -18px;
	text-align: center;
	color: #111;
}
.mejs-controls .mejs-time-total:hover .mejs-time-float {
	display:none
}

/*
.mejs-controls .mejs-time-rail:hover .mejs-time-handle {
	visibility:visible;
}
*/
/* End: Progress bar */


.mejs-clear {
	clear: both;
}

/* Start: ERROR */
.me-cannotplay {
}
.me-cannotplay a {
	color: #fff;
	font-weight: bold;
}
.me-cannotplay span {
	padding: 15px;
	display: block;
}
/* End: ERROR */

.mejs-playpause-button{ 
	display:none !important
}