/* v2
/* RESET
via
http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	font-family: Verdana, Geneva, sans-serif;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	background-color: #546471;
	overflow: hidden;
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*ios 7 safari bug fix */
audio {
	display: none;
	width: 0;
	height: 0;
}

body { -webkit-touch-callout: none !important; } /*prevents context menu along with #arrows a: webkit css for ios mobile safari*/
/*============================*/

#wrapper {
	width: 700px;
	height: 490px;
	margin: 50px auto;
	padding-top: 5px;
}

#loader {
	background-color: #546471;
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 1000;;
}

#loader img {
	margin: 20px auto;
    display: block;
}

#loader #status {
	text-align: center;
    text-transform: uppercase;
    font-size: 12px;
    color: #FFF;
	line-height: 1.5;
}

/*=============================
HEADER
==============================*/

header {
	position: relative;
	top: 245px;
}

#title {
	width: 700px;
	height: 46px;
}

#empty-banner {
	width: 1px;
	height: 46px;
	position: relative;
	left: 350px;
}

#banner {
	left: 0;
	position: absolute;
	display: none;
}

#header-nav {
	background-image: url(images/menurollout.jpg);
	width: 688px;
	opacity: 0;
	height: 43px;
	margin: 0 auto;
}

#header-nav ul {
	list-style-type: none;
    margin: 0;
    padding: 0;
}

#header-nav li {
	position: absolute;
}

#header-nav li:first-of-type {
	bottom: -1px;
	left: 6px;
}

#header-nav li:nth-of-type(2) {
	bottom: -1px;
	left: 181px;
}

#header-nav li:nth-of-type(3) {
	bottom: -1px;
	left: 349px;
}

#header-nav li:nth-of-type(4) {
	bottom: -1px;
	left: 528px;
}

#header-nav ul li a {
	display: block;
}

#header-nav ul li a img{
	opacity: 0.0;
}

/*=============================
SQUARES
==============================*/

#squares {
	width: 700px;
	height: 46px;
	position: absolute;
	z-index: 100;
	overflow: hidden;
	top: 0;
	left: 0;
}

#squares #big {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
}

#squares #big img {
	margin-top: 6px;
}

#squares #big #big-one {
	position: absolute;
	left: 0;
}

#squares #big #big-two {
	position: absolute;
	left: -700px;
}

#squares #big #big-three {
	position: absolute;
	left: -700px;
}

#squares #small {
	display: none;
	position: absolute;
	left: 0;
	top: 4px;
}

#squares #small img {
	margin-top: 6px;
}

#squares #small #small-one {
	position: absolute;
	left: 0;
}

#squares #small #small-two {
	position: absolute;
	left: -652px;
}

.mask {
	background-color: #546471;
	position: absolute;
	width: 14px;
	height: 46px;
	z-index: 101;
}



.mask.dark {
	opacity: 0.5;
}

.mask.dark:first-of-type {
	left: 0;
}

.mask.dark:nth-of-type(2) {
	left: 686px;
}



/*=============================
FOOTER
==============================*/

footer {
	top: -394px;
	position: relative;
	width: 700px;
	height: 45px;
	overflow: hidden;
}

footer img {
	width: 1px;
	height: 45px;
	position: relative;
	display: none;
	left: 350px;
}

/*=============================
MAIN
==============================*/

#main {
	background-image: url(images/moviebg5.png);
	width: 700px;
	opacity: 0;
	height: 354px;
	overflow: hidden;
}

#portrait {
	float: left;
	height: 216px;
	margin-bottom: 20px;
	opacity: 0;
	overflow: hidden;
	width: 144px;
}

#portrait img {
	height: 216px;
	width: 144px;
}

#content {
	height: 358px;
    overflow: hidden;
    position: relative;
    width: 480px;
}

.text-wrap {
	height: 320px;
    overflow: hidden;
    position: absolute;
    top: 15px;
    width: 480px;
}

.text {
	color: #fff;
    font-size: 12px;
    font-weight: 100;
    height: 297px;
    line-height: 1.4;
    overflow: hidden;
    padding: 0 25px;
    position: absolute;
    text-indent: 25px;
    width: 450px;
    z-index: 2;
}

.text p {
	margin: 10px 0;
}


#left-side {
	float: left;
    margin-left: 36px;
    margin-top: 8px;
    width: 144px;
}

#go-home {
	display: none;
    font-size: 13px;
    font-weight: 600;
    height: 20px;
    left: 15px;
    margin-left: 10px;
    position: absolute;
    top: 340px;
    width: 100px;
    z-index: 2;
}

.content {
	display: none;
}

#arrows {
	visibility: hidden;
	height: 320px;
    left: 458px;
    position: absolute;
    top: 8px;
    width: 20px;
    z-index: 3;
}

#arrows a { /*prevents mobile context menu along with body webkit css*/
	-webkit-user-select: none !important; 
	-moz-user-select: none !important;     /* Firefox all */
  	-ms-user-select: none !important;      /* IE 10+ */
	/* No support for these yet, use at own risk */
    -o-user-select: none !important;
    user-select: none !important; 
}

#arrows a:first-of-type{
	float: left;
	margin-bottom: 270px;
    margin-top: 15px;
}

/*=============================
SIDEBAR NAV
==============================*/

#side-nav {
	clear: left;
    display: none;
	font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    margin-left: 36px;
    padding-left: 10px;
    position: relative;
}


#side-nav a, #go-home {
	text-decoration: none;
	color: #fff;
}

#side-nav a:hover {
	color: #9FA6AD;
}

/*=============================
HOME
==============================*/

.home { /*elements associated with home content*/
	display: none;
}

#home {
	background-image: url("images/homepic.jpg");
    color: #fff;
	display: none;
    font-size: 16px;
    font-weight: bold;
    height: 353px;
    margin-left: 8px;
    margin-top: 5px;
	/*opacity: 0.4; /*temporary. Will animate */
    position: absolute;
	top: 0;
    width: 480px;
}

#home .caption {
	font-size: 16px;
	color: #fff;
	font-weight: bold;
	position: relative;
}

#home .caption.delay {
	display: none;
}

#home .caption:first-of-type {
	clear: both;
    margin-left: 177px;
    margin-top: 217px;
    width: 100px;
}

#home .caption:nth-of-type(2) {
	float: left;
    margin-left: 18px;
    margin-top: 12px;
}

#home .caption:nth-of-type(3) {
	float: right;
    margin-right: 27px;
    margin-top: 12px;
	position: relative;
    z-index: 1;
}

#home .caption:nth-of-type(4) {
	color: #242424;
    margin-left: 302px;
    margin-top: 14px;
    position: absolute;
    z-index: 0;
}

#home-text {
	padding-top: 16px;
}

/*=============================
BIO
==============================*/

.bio { /*elements associated with bio content*/
	display: none;
}

#bio {
	background-image: url("images/biopic.jpg");
    height: 353px;
    margin-left: 10px;
    margin-top: 5px;
	/*opacity: 0.4; /*temporary. Will animate */
    position: absolute;
    width: 480px;
	top: 0;
}

.bio.text {
	height: 1000px;
	top: 0;
	width: 425px;
}

/*=============================
REVIEWS
==============================*/

.reviews { /*elements associated with reviews cuntent*/
	display: none;
}

.source {
	color: #FF0;
}

#review-images {
	left: 394px;
    position: relative;
    top: -216px;
    width: 55px;
}

#review-images img {
    float: left;
    margin-bottom: 8px;
}

#jazz-forum p, #downbeat p {
	width: 385px;
}

.text-wrap .reviews.text p:first-of-type {
    margin-top: 0;
}

.text-wrap .reviews.text p {
     margin-bottom: 13px;
}

.text-wrap .reviews.text p:last-of-type {
    margin-top: 15px;
}

/*=============================
CONTACT
==============================*/

.contact { /*elements associated with contact content*/
	display: none;
}

#contact {
	background-image: url(images/contact-new.jpg);
	height: 353px;
    margin-left: 10px;
    margin-top: 5px;
    position: absolute;
    top: 0;
    width: 480px;
}

.contact.text {
	height: 320px;
	text-indent: 0;
}

.text-wrap .contact .alliance {
	left: 170px;
    position: absolute;
    text-align: center;
    top: -11px;
    width: 170px;
}

.text-wrap .contact .grossman {
	left: 36px;
    position: absolute;
    text-align: center;
    top: 271px;
    width: 110px;
}

.text-wrap .contact .don {
	left: 207px;
    position: absolute;
    text-align: center;
    top: 272px;
    width: 74px;
}

.text-wrap .contact .contact-info {
	left: 300px;
    position: absolute;
    top: 272px;
    width: 161px;
}

.text-wrap .contact a {
	text-decoration: none;
	color: #FFF;
}

.text-wrap .contact .shadow {
	background-color: rgba(120, 120, 120, 0.5);
	color: #000;
}

.text-wrap .contact .alliance.shadow {
	left: 171px;
    position: absolute;
    text-align: center;
    top: -11px;
    width: 170px;
	z-index: -1; 
}

.text-wrap .contact .grossman.shadow {
	left: 37px;
    position: absolute;
    text-align: center;
    top: 272px;
    width: 110px;
    z-index: -1;
}

.text-wrap .contact .don.shadow {
	left: 208px;
    position: absolute;
    text-align: center;
    top: 272px;
    width: 74px;
    z-index: -1;
}

.text-wrap .contact .contact-info.shadow {
	left: 301px;
    position: absolute;
    top: 272px;
    width: 161px;
    z-index: -1;
}


/*=============================
BASSIST
==============================*/

.bassist {
	display: none;
}

#bassist {
	/*background-image: url(images/bassist3.jpg);*/
	height: 353px;
    margin-left: 10px;
    margin-top: 5px;
	/*opacity: 0.4; /*temporary. Will animate */
    position: absolute;
    top: 0;
    width: 480px;
}

#bassist img:first-of-type {
	position: absolute;
	display: none;
}

#bassist img:nth-of-type(2) {
	position: absolute;
	display: none;
}

#bassist img:nth-of-type(3) {
	position: absolute;
	display: none;
}

#bassist .caption {
	position: absolute;
	font-size: 14px;
	color: #fff;
	font-weight: bold;
	display: none;
}

#bassist .caption.black {
	color: #000;
}

#bassist .caption:nth-of-type(1) {
	left: 154px;
    top: 120px;
}

#bassist .caption:nth-of-type(2) {
	left: 212px;
    top: 52px;
}

#bassist .caption:nth-of-type(3) {
	left: 392px;
    top: 52px;
}

#bassist .caption:nth-of-type(4) {
	left: 70px;
    top: 284px;
}

#bassist .caption:nth-of-type(5) {
	left: 186px;
    top: 252px;
}

#bassist .caption:nth-of-type(6) {
	left: 262px;
    top: 242px;
}

#bassist .caption:nth-of-type(7) {
	left: 390px;
    top: 330px;
}

.bassist.text {
	display: none;
}

/*=============================
PRODUCER
==============================*/

.producer {
	display: none;
}

#producer {
	background-image: url(images/producerpic.jpg);
	height: 353px;
    margin-left: 10px;
    margin-top: 5px;
	/*opacity: 0.4; /*temporary. Will animate */
    position: absolute;
    top: 0;
    width: 480px;
}

.producer.text {
	height: 1000px;
	top: 0;
	width: 425px;
	display: none;
}

/*=============================
EDUCATOR
==============================*/

.educator {
	display: none;
}

#educator {
	background-image: url(images/educpic.jpg);
	height: 353px;
    margin-left: 10px;
    margin-top: 5px;
	/*opacity: 0.4; /*temporary. Will animate */
    position: absolute;
    top: 0;
    width: 480px;
}

.educator.text {
	height: 1000px;
	top: 0;
	width: 425px;
	display: none;
}

#educator .caption {
	position: absolute;
	font-size: 14px;
	color: #fff;
	font-weight: bold;
	width: 50px;
	line-height: 1.1;
}

#educator .caption:nth-of-type(1) {
	left: 8px;
    top: 91px;
}

#educator .caption:nth-of-type(2) {
	left: 106px;
    top: 11px;
}

#educator .caption:nth-of-type(3) {
	left: 174px;
    top: 11px;
}

#educator .caption:nth-of-type(4) {
	left: 305px;
    top: 11px;
}

#educator .caption:nth-of-type(5) {
	left: 403px;
    top: 91px;
}

#educator .caption:nth-of-type(6) {
	left: 139px;
    text-align: center;
    top: 300px;
    width: 200px;
}


/*=============================
ENTREPRENEUR
==============================*/

.entrepreneur, #entrepreneur img {
	display: none;
}

#entrepreneur {
	background-image: url(images/pm-logo-bluebg.jpg);
	background-repeat: no-repeat;
	height: 353px;
    margin-left: 10px;
    margin-top: 5px;
	/*opacity: 0.4; /*temporary. Will animate */
    position: absolute;
    top: 0;
    width: 480px;
}

#entrepreneur img:first-of-type {
	left: 18px;
    position: absolute;
    top: 180px;
}

#entrepreneur img:nth-of-type(2) {
	position: absolute;
	right: 21px;
    top: 91px;
}

#entrepreneur img:nth-of-type(3) {
	left: 260px;
    position: absolute;
    top: 193px;
}

#entrepreneur img:nth-of-type(4) {
	left: 163px;
    position: absolute;
    top: 225px;
}

.entrepreneur.text {
	height: 1000px;
	top: 0;
	width: 425px;
}