@font-face {
	font-family: 'myriadpro';
	src: url('fonts/myriadpro_regular.eot');
	src: url('fonts/myriadpro_regular.ttf');
}
@font-face {
	font-family: 'myriadproB';
	src: url('fonts/myriadpro_semibold.eot');
	src: url('fonts/myriadpro_semibold.ttf');
}
@font-face {
	font-family: 'myriadproI';
	src: url('fonts/myriadpro_it.eot');
	src: url('fonts/myriadpro_it.ttf');
}
@font-face {
	font-family: 'myriadproBI';
	src: url('fonts/myriadpro_semiboldit.eot');
	src: url('fonts/myriadpro_semiboldit.ttf');
}

#areaVideo{
	z-index:101; 
}
#interatividade{
	background: url(img/bg.png) no-repeat 0 0;
}

.tela{
	width: 800px;
    height: 600px;
}

#image-reel{
	top: 0px;
    left: 0px;
}

#stage .credito small{ text-transform: none; }

#cotas, #pins, #pins .pin, #rosa, #legenda, #btPosInicial, #pad, #pad button, #menu{
	position: absolute;
}
#cotas, #pins{
	top: 48px;
    left: 85px;
    width: 468px;
    height:357px;
}
#cotas{
    background: url(img/cotas.png) no-repeat 0 0;
}
#rosa{
    bottom: 20px;
    left: 20px;
	width: 66px;
    height:91px;
    background: url(img/rosa.png) no-repeat 0 0;
}
#legenda{
	bottom: 20px;
    right: 30px;
    width: 137px;
    height:110px;
    background: url(img/box_legenda.png) no-repeat 0 0;
}

#pins .pin{
	width: 34px;
    height:47px;
	background: url(img/pins.png) no-repeat 0 0;
	text-indent: -5000px;
}
#pins .pin[data-visited=true]{
	background-position: -36px 0;
}
#pins #pin1{ top: 282px; left: 194px; }
#pins #pin2{ top: 119px; left: 427px; }
#pins #pin3{ top: 396px; left: 270px; }

#btPosInicial{
	width:58px;
	height:96px;
    background: url(img/bt_pos_inicial.png) no-repeat 0 0;
	border: 0;
	text-indent: -5000px;
	cursor: pointer;
	top: 190px;
    left: 77px;
}
#btPosInicial[data-disabled=true]{
	background: url(img/bt_pos_inicial_off.png) no-repeat 0 0;
}

.bgCredito{
	width:99px;
	height:600px;
    background: url(img/credito.png) no-repeat 0 0;
	position: absolute;
	top: 0px;
    right: 0px;
}

#menu{
	top:0;
	right: 0;
	width: 201px;
    height:600px;
	background: url(img/barra.png) no-repeat 0 0;
}
#menu ul{
	list-style: none;
	width: 181px;
    display: inline-block;
    position: absolute;
    bottom: 153px;
    left: 0px;
    padding: 0 15px;
}
#menu ul li{
	display: inline-block;
	width: 100%;
}
#menu ul li span{
	float: left;
	width: 23px;
    height:50px;
	margin-right: 5px;
	background: url(img/checkbox.png) no-repeat 0 top;
}
#menu ul li span[data-checked=false][data-disabled=false]{
	background-position: 0 top;
}
#menu ul li span[data-checked=true][data-disabled=false]{
	background-position: -26px top;
}
#menu ul li span[data-checked=true][data-disabled=true]{
	background-position: -52px top;
}
#menu ul li label{
	font-family: 'myriadpro';
	font-size: 16px;
	color: #000;
    line-height: 20px;
	cursor: pointer;
    position: relative;
    top: 3px;
}
#menu ul li label[data-disabled=true]{
	color: #c2c2c2;
	cursor: auto;
}

#pad{
	top: 20px;
    right: 20px;
	width: 154px;
    height:154px;
	background: url(img/pad.png) no-repeat 0 0;
}
#pad button{
	width: 38px;
    height:38px;
	background: url(img/arrows.png) no-repeat 0 0;
	border: none;
	text-indent: -5000px;
	cursor: pointer;
}
#pad #btTop{
	top: 8px;
    left: 50%;
    margin-left: -22px;
	background-position: -38px -38px;
}
#pad #btTop[data-disabled=true]{
	background-position: -38px -2px;
}
#pad #btDown{
	bottom: 11px;
    left: 50%;
    margin-left: -22px;
	background-position: 0 -38px;
}
#pad #btDown[data-disabled=true]{
	background-position: 0 0;
}
#pad #btLeft{
	top: 50%;
    left: 9px;
    margin-top: -22px;
	background-position: -76px -38px;
}
#pad #btLeft[data-disabled=true]{
	background-position: -76px -2px;
}
#pad #btRight{
	top: 50%;
    right: 13px;
    margin-top: -22px;
	background-position: -114px -38px;
}
#pad #btRight[data-disabled=true]{
	background-position: -114px -2px;
}