/* ---------------------------------------------------------------------------------------------- */
/* corpo */

@media all and ( max-width: 599px )
{
	div#Artists { display: none; position: absolute; top: 0; left: 100%; width: 100%; background-color: #ffffff; height: 100%; margin: 0 auto; overflow: auto; }
		div#Artists div.content { display: block; position: relative; width: 100%; min-height: 100vh; }
}
@media all and ( min-width: 600px ) and ( max-width: 1099px )
{
	div#Artists { display: none; position: absolute; top: 0; left: 100%; width: 100%; background-color: #ffffff; height: 100%; margin: 0 auto; overflow: auto; }
		div#Artists div.content { display: block; position: relative; width: 100%; min-height: 100vh; }
}
@media all and ( min-width: 1100px )
{
	div#Artists { display: block; position: absolute; top: 0; left: 100%; width: 100%; background-color: #ffffff; height: 100%; margin: 0 auto; overflow: hidden; }
		div#Artists div.content { display: block; position: relative; width: 100%; height: 100%; }
}


/* ---------------------------------------------------------------------------------------------- */
/* videos*/

@media all and ( max-width: 599px )
{
	div#Artists div.slide div.video { display: none; position: absolute; top: 0; left: 0; width: 0; height: 0; }
}
@media all and ( min-width: 600px ) and ( max-width: 1099px )
{
	div#Artists div.slide div.video { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
		div#Artists div.slide div.video span { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
}
@media all and ( min-width: 1100px )
{
	div#Artists div.slide div.video { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
		div#Artists div.slide div.video span { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
}


/* ---------------------------------------------------------------------------------------------- */
/* slide da introducao */

@media all and ( max-width: 599px )
{
	div#Artists div.slideIntro { background-size: cover; background: transparent url(../../src/img/bg/bg_artists.jpg) no-repeat center center; }

	div#Artists div.slide div.intro { display: inline-block; position: relative; width: 250px; margin: 50px 0 0 0; text-align: left; }
		div#Artists div.slide div.intro p.day { display: block; position: relative; font-family: 'HelveticaNeueBlack', sans-serif; line-height: 30px; font-size: 20px; color: #0fbdcc; cursor: pointer; }
			div#Artists div.slide div.intro p.day span { display: inline-block; position: relative; font-family: 'Helvetica_Thin', sans-serif; height: 30px; font-size: 14px; color: #0fbdcc; margin: 0 0 0 10px; background: transparent url(../../src/img/artists/title.png) no-repeat top left; text-indent: 28px; }
		div#Artists div.slide div.intro p.ui-state-hover { color: #a7ce38; }
			div#Artists div.slide div.intro p.ui-state-hover span { color: #a7ce38; }
		div#Artists div.slide div.intro p.ui-state-active { color: #a7ce38; }
			div#Artists div.slide div.intro p.ui-state-active span { color: #a7ce38; }

		div#Artists div.slide div.intro div p.text { display: block; position: relative; font-family: 'HelveticaNeueMedium', sans-serif; line-height: 25px; font-size: 18px; color: #515252; margin: 0 0 10px 0; padding: 0 0 0 25px; }

		div#Artists div.slide div.instructions { display: none; }
		div#Artists div.slide p.instructions { display: none; }
}
@media all and ( min-width: 600px ) and ( max-width: 1099px )
{
	div#Artists div.slideIntro { background-size: cover; background: transparent url(../../src/img/bg/bg_artists.jpg) no-repeat center center; }

	div#Artists div.slide div.intro { display: inline-block; position: relative; width: 250px; margin: 50px 0 0 0; text-align: left; }
		div#Artists div.slide div.intro p.day { display: block; position: relative; font-family: 'HelveticaNeueBlack', sans-serif; line-height: 35px; font-size: 25px; color: #0fbdcc; cursor: pointer; }
			div#Artists div.slide div.intro p.day span { display: inline-block; position: relative; font-family: 'Helvetica_Thin', sans-serif; height: 35px; font-size: 14px; color: #0fbdcc; margin: 0 0 0 10px; background: transparent url(../../src/img/artists/title.png) no-repeat top left; text-indent: 28px; }
		div#Artists div.slide div.intro p.ui-state-hover { color: #a7ce38; }
			div#Artists div.slide div.intro p.ui-state-hover span { color: #a7ce38; }
		div#Artists div.slide div.intro p.ui-state-active { color: #a7ce38; }
			div#Artists div.slide div.intro p.ui-state-active span { color: #a7ce38; }

		div#Artists div.slide div.intro div p.text { display: block; position: relative; font-family: 'HelveticaNeueMedium', sans-serif; line-height: 25px; font-size: 18px; color: #515252; margin: 0 0 10px 0; padding: 0 0 0 25px; }

		div#Artists div.slide div.instructions { display: none; }
		div#Artists div.slide p.instructions { display: none; }
}
@media all and ( min-width: 1100px )
{
	div#Artists div.slideIntro { background-size: cover; background: transparent url(../../src/img/bg/bg_artists.jpg) no-repeat center center; }

	div#Artists div.slide div.intro { display: inline-block; position: absolute; top: 50%; left: 50%; text-align: left; }
		div#Artists div.slide div.intro p.day { display: block; position: relative; font-family: 'HelveticaNeueBlack', sans-serif; line-height: 30px; font-size: 25px; color: #0fbdcc; cursor: pointer; }
			div#Artists div.slide div.intro p.day span { display: inline-block; position: relative; font-family: 'Helvetica_Thin', sans-serif; height: 30px; font-size: 14px; color: #0fbdcc; margin: 0 0 0 10px; background: transparent url(../../src/img/artists/title.png) no-repeat top left; text-indent: 28px; }
		div#Artists div.slide div.intro p.ui-state-hover { color: #a7ce38; }
			div#Artists div.slide div.intro p.ui-state-hover span { color: #a7ce38; }
		div#Artists div.slide div.intro p.ui-state-active { color: #a7ce38; }
			div#Artists div.slide div.intro p.ui-state-active span { color: #a7ce38; }

		div#Artists div.slide div.intro div p.text { display: block; position: relative; font-family: 'HelveticaNeueMedium', sans-serif; line-height: 20px; font-size: 16px; color: #515252; margin: 0; padding: 0 0 0 25px; }

		div#Artists div.slide div.instructions { display: block; position: absolute; bottom: 10px; left: 50%; width: 375px; height: 95px; margin: 0 0 0 -190px; }
			div#Artists div.slide span.instructions { display: block; position: relative; width: 115px; height: 95px; background: transparent url(../../src/img/artists/mouseInstructions.png) no-repeat; float: right; }
		div#Artists div.slide p.instructions { display: block; position: relative; line-height: 28px; font-family: 'HelveticaNeueBlack', sans-serif; font-size: 22px; color: #515252; border: 7px solid #515252; border-radius: 20px; padding: 0 20px; float: left; margin: 12px 0 0 0; }
}
@media all and ( min-height: 942px )
{
	div#Artists div.slide div.intro p.day { line-height: 40px; font-size: 35px; }
		div#Artists div.slide div.intro p.day span { height: 40px; font-size: 16px; }

		div#Artists div.slide div.intro div p.text { line-height: 30px; font-size: 22px; color: #515252; margin: 0 0 15px 0;; }

		div#Artists div.slide div.instructions { width: 425px; height: 95px; margin: 0 0 0 -200px; }
			div#Artists div.slide span.instructions { display: block; position: relative; width: 115px; height: 95px; background: transparent url(../../src/img/artists/mouseInstructions.png) no-repeat; float: right; }
		div#Artists div.slide p.instructions { line-height: 37px; font-size: 24px; }
}


/* ---------------------------------------------------------------------------------------------- */
/* slides */

@media all and ( max-width: 599px )
{
	div#Artists div.slide { display: none; }
	div#Artists div.slide:first-child { display: block; position: relative; width: 100%; min-height: 100vh; text-align: center; overflow: hidden; background-color: #ffffff; background-size: cover; }
}
@media all and ( min-width: 600px ) and ( max-width: 1099px )
{
	div#Artists div.slide { display: none; }
	div#Artists div.slide:first-child { display: block; position: relative; width: 100%; min-height: 100vh; text-align: center; overflow: hidden; background-color: #ffffff; background-size: cover; }
}
@media all and ( min-width: 1100px )
{
	div#Artists div.slide { display: block; position: absolute; top: 100%; left: 0; width: 100%; height: 100%; text-align: center; overflow: hidden; background-color: #ffffff; background-size: cover; }
	div#Artists div.slide:first-child { top: 0; left: 0; }
		div#Artists div.slide div.text { display: block; position: absolute; width: 1000px; height: 145px; left: 50%; margin: 0 0 0 -500px; }
		div#Artists div.slide div.bottomLeft { bottom: 75px; text-align: left; }
		div#Artists div.slide div.bottomRight { bottom: 75px; text-align: right; }
		div#Artists div.slide div.topLeft { top: 75px; text-align: left; }
		div#Artists div.slide div.topRight { top: 75px; text-align: right; }

			div#Artists div.slide div.text h1 { display: block; font-size: 70px; line-height: 75px; font-family: 'HelveticaNeueBlack', sans-serif; }
			div#Artists div.slide div.text h2 { display: block; font-size: 40px; line-height: 45px; font-family: 'HelveticaNeueBlack', sans-serif; }
			div#Artists div.slide div.text h3 { display: block; font-size: 20px; line-height: 25px; font-family: 'HelveticaNeueThin', sans-serif; }
			div#Artists div.slide div.text .white { color: #ffffff; }
			div#Artists div.slide div.text .black { color: #221f1f; }

		div#Artists div.slide div.bottomLeft div.more { bottom: 10px; left: 175px; }
			div#Artists div.slide div.bottomLeft div.more div.container { bottom: 100px; left: -50px; }
				div#Artists div.slide div.bottomLeft div.more div.container span.arrow { display: block; position: absolute; bottom: -35px; left: 40px; width: 0; height: 0; border-left: 35px solid transparent; border-right: 35px solid transparent; border-top: 35px solid #515252; }

		div#Artists div.slide div.bottomRight div.more { bottom: 10px; right: 175px; }
			div#Artists div.slide div.bottomRight div.more div.container { bottom: 100px; right: -50px; }
				div#Artists div.slide div.bottomRight div.more div.container span.arrow { display: block; position: absolute; bottom: -35px; right: 40px; width: 0; height: 0; border-left: 35px solid transparent; border-right: 35px solid transparent; border-top: 35px solid #515252; }

		div#Artists div.slide div.topLeft div.more { bottom: 10px; left: 175px; }
			div#Artists div.slide div.topLeft div.more div.container { top: 100px; left: -50px; }
				div#Artists div.slide div.topLeft div.more div.container span.arrow { display: block; position: absolute; top: -35px; left: 40px; width: 0; height: 0; border-left: 35px solid transparent; border-right: 35px solid transparent; border-bottom: 35px solid #515252; }

		div#Artists div.slide div.topRight div.more { bottom: 10px; right: 175px; }
			div#Artists div.slide div.topRight div.more div.container { top: 100px; right: -50px; }
				div#Artists div.slide div.topRight div.more div.container span.arrow { display: block; position: absolute; top: -35px; right: 40px; width: 0; height: 0; border-left: 35px solid transparent; border-right: 35px solid transparent; border-bottom: 35px solid #515252; }

		div#Artists div.slide div.text div.more { display: block; position: absolute; width: 50px; height: 50px; }
			div#Artists div.slide div.text div.more span.more { display: block; position: relative; width: 50px; height: 50px; background: transparent url(../../src/img/artists/more.png) no-repeat; cursor: pointer; }
			div#Artists div.slide div.text div.more div.container { display: none; position: absolute; padding: 50px 30px 75px 30px; background-color: #515252; width: 790px; height: -webkit-calc(100vh - 310px); height: -moz-calc(100vh - 310px); height: calc(100vh - 435px); }
				div#Artists div.slide div.text div.more div.container p { display: block; position: relative; font-family: 'HelveticaNeueLight', sans-serif; color: #ffffff; font-size: 16px; line-height: 22px; text-align: left; }
				div#Artists div.slide div.text div.more div.container a { display: block; position: absolute; bottom: 10px; right: 30px; text-align: center; font-family: 'HelveticaNeueMedium', sans-serif; color: #ffffff; font-size: 18px; line-height: 20px; text-decoration: none; }
				div#Artists div.slide div.text div.more div.container a:hover { text-decoration: underline; }
}


/* ---------------------------------------------------------------------------------------------- */