@charset "utf-8";
/* CSS Document */

@import url(http://fonts.googleapis.com/css?family=Roboto:500,100,300,400);
@import url('lib/icones.css');

html{
	overflow: hidden;
}
html,body{
	padding:0;
	margin:0;
	max-height:100%;
	height:100%;
	width:100%;
	position:relative;
	font-family: 'Roboto', sans-serif;
	font-size: 12px;
}
body{

/*	background: url(imagens/bg1.svg) no-repeat;
	background-size:3500px;*/
}

audio#abertura{
   display: none;
}
#audio_controls{
   position: absolute;
   top: 10px;
   right: 10px;
   z-index: 999;
   color: rgb(107, 22, 92);
   border: 2px solid rgb(111, 58, 101);
   padding: 0px 10.5px 4px 10.5px;
   font-size: 32px;
   background-color: rgb(255, 255, 255);
}
#audio_controls.audio_play{
   padding: 4px 3px 3px 7px;
   font-size: 30px;
}

.creditos{
   display:block;
   position:fixed;
   bottom:10px;
   right:20px;
   border:2px solid rgb(111, 58, 101);
   z-index:9999;
   padding:5px;
   background-color:#FFF;
   text-decoration: none;
}

a{
   text-decoration:none;
   color: #333;
}

.fancybox-title a{
   color: #fff !important;
   text-decoration: underline;
}

#inicial{

/*	background-color: #6b165c;*/
	background: #FFF url(imagens/bg1.svg) top left no-repeat;
	width: 100%;
   /* background-size:5180px; */
	background-size:5320px;
	height: 100%;
	z-index: 1000;
	position: fixed;
	text-align: center;
	color: #9c2d86;
}

#inicial #box-explicacao{
	padding-top: 20px;
	height: 100%;
	background: rgba(255, 255, 255,0.8) ;
}

.container {
	position: fixed;
	height: 100%;
	width: 100%;
	background-color:rgba(255, 255, 255,1)
	z-index:-1;
}

section{
	min-height:100%;
	height:100%;
	position:relative;
	background-color:rgba(255, 255, 255, 0.6);
	/*background-color:rgba(255, 255, 255, 1);*/
	z-index:10;
   /* width:5180px; */
	width:5320px;
	top: 0;
}

.bg{
	width: 3500px;
	background: url(imagens/bg1.svg) no-repeat;
   /* background-size:5180px; */
	background-size:5320px;
	position: absolute;
	height: 100%;
	z-index: 10;
}

.txt{
	position: absolute;
	padding: 10px;
	text-align: center;
}


.ano_box{
	z-index:auto;
	/* width:140px; */
	height:100%;
	color:#333;
	display:inline-block;
	white-space: nowrap;
	background:url(imagens/linha-pontilhada-preta.png) left top repeat-y;
	position:relative;
	float:left;
	clear:none;
	/*border:1px solid #9C0;*/

}

.ano_box_init{
	background-image:url(imagens/linha-solida.png);
}

.ano_box:hover{
	background:rgba(0,0,0, 0.08) url(imagens/linha-pontilhada-preta.png) left top repeat-y;
	-webkit-transition: all ease-out 0.5s;
    -moz-transition: all ease-out 0.5s;
    -o-transition: all ease-out 0.5s;
    transition: all ease-out 0.5s;
}

.ano_box .ano_txt{
	background:rgba(255,255,255, 0.1);
	width:100%;
	position:relative;
	height:60px;
}

.ano_box .ano_txt span{
	position:absolute;
	top:15px;;
	left:0px;
	font-weight:300;
	font-size:18px;
	color:#333;

	-webkit-transform: rotate(90deg);	/* Safari */
	-moz-transform: rotate(90deg);	/* Firefox */
	-ms-transform: rotate(90deg);	/* IE */
	-o-transform: rotate(90deg);	/* Opera */
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=4); /* Internet Explorer */
}

/* Elementos */
.rad10{
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}


.box{
	position: relative;
	width:100px;
   padding: 5px 10px;
	/* color: #333; */
	margin:0 auto;
	text-align: center;
	display: table;
	line-height: 12px;
	z-index: 100;

	color: #447757;
	border: 2px solid #ccc;
	background:rgba(255,255,255, 0.44);

	-webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
           box-sizing: border-box;
}

.box.amarelo{
	top:420px;
	display: table;
	/* background-color: #ffe36c; */
	color: #fff;
	border: 2px solid #a03e7c;
	background:rgba(160,62,124, 0.8);
	z-index: 10;
   left:50%;
}


.box.amarelo .bola_branca{
	position: absolute;
	left:0;
	margin:-50px auto 0 auto;
   background-color: #a03e7c;
}
.box.amarelo .bola_branca:hover{
	background: #EAB600;
}


.box.amarelo::before{
	content: "▲"; /* ▼ ▲ */
	position:absolute;
	top:-18px;
	margin-left: 2px;
	left: 0;

	font-size:1.5em;
	color:#666;
	z-index:100;
	/*
	-webkit-transform: rotate(90deg);	/* Safari * /
	-moz-transform: rotate(90deg);	/* Firefox * /
	-ms-transform: rotate(90deg);	/* IE * /
	-o-transform: rotate(90deg);	/* Opera * /
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); /* Internet Explorer */

}

.box.branco:hover{
	background:rgba(255,255,255, 0.7);
}



.branco:after{
	content: "▼"; /* ▼ ▲ */
	position:absolute;
	font-size:1.5em;
	color:#666;
	z-index:100;
	width: 100%;
	display: block;
	margin:0 auto;
	bottom:-18px;
	left:0;
	/*
	 -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
   */

}

.linha1{
	top:160px;
	position:relative;
	z-index: 1;
}

.linha3{
	top:440px;
	position:absolute;
	z-index: 1;
}

.linha1 canvas,
.linha3 canvas{
	/*box-shadow: 5px 5px 10px #999;*/
	position: absolute;
	z-index: 1;
}

.bt_esquerda{
	width:65px;
	height:65px;
	background-color:#333;
	color:#fff;
	font-weight:bold;
	font-size:5.3em;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	zoom: 1;
	filter: alpha(opacity=80);
	opacity: 0.8;
	position:fixed;
	z-index:1000;
	text-align:center;
	line-height:0.8em;
	left:20px;
	top:45%;
	margin-top:-32px;
	/*display:none;*/

}

.bt_direita{
	width:65px;
	height:65px;
	background-color:#333;
	color:#fff;
	font-weight:bold;
	font-size:5.3em;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	zoom: 1;
	filter: alpha(opacity=80);
	opacity: 0.8;
	position:fixed;
	z-index:1000;
	text-align:center;
	line-height:0.8em;
	right:20px;
	top:45%;
	margin-top:-32px;
	/*display:none;*/
}

.bt_esquerda::before{
	content:"<";
}

.bt_direita::before{
	content:">";
}


.tempo{
	height:20px;
	margin-bottom:0px;
	bottom:0;
	position:fixed;
	display:block;
	z-index:100;
	width:100%;
	/*opacity: 0.5;*/
}
.tempo > div{
	position:absolute;
	top: 0;
	left: 0;
}

.tempo:hover{
/*	opacity: 1; */
}
.tempo .marca_tempo{
	opacity: 0.5;
	position:relative;
	height:10px;
	width:50%;
	display:block;
	margin:0 auto;
	z-index: 10;
}

.tempo .marcacoes{
	opacity: 1;
	position:relative;
	height:10px;
	width:50%;
	display:block;
	margin:0 auto;
	margin-top: -15px;
	z-index: 100;
	color: #000;
}


.bola_branca {
	position: relative;
	margin: 26px auto 0 auto;
	z-index:100;
	width: 10px;
	height:10px;
   border-radius: 100%;
	border:5px solid #fff;
   /*overflow:hidden;*/

    background: #000000;
    /*background: transparent;*/
    box-shadow: 0 0 3px #333;
    display:block;
    -webkit-transition: all ease-out 0.5s;
    -moz-transition: all ease-out 0.5s;
    -o-transition: all ease-out 0.5s;
    transition: all ease-out 0.5s;
}

.bola_branca:hover {
	background:#95C835;
    transform:scale(1.5);
    -webkit-transition: all ease-out 0.5s;
    -moz-transition: all ease-out 0.5s;
    -o-transition: all ease-out 0.5s;
    transition: all ease-out 0.5s;
}


.bola_branca + .resumo{
	display: none;
}

/*.bola_branca:hover + .resumo{
	position: absolute;
	display: block;
	white-space: normal;
	padding: 10px;
	margin:0 auto;
	color:#FFF;
	background:rgba(78,113,54, 1) !important;
	z-index: 100;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	   	  box-sizing: border-box;
}*/



.bola_rosa {
	position: relative;
	margin: 15px auto 10px auto;
	z-index:100;
	width: 10px;
	height:10px;
   border-radius: 100%;
   border: 5px solid #FFF;
	/*border: 5px solid #e04ba9;*/
	background: #333;
	box-shadow: 0 0 3px #333;
	display:block;
	-webkit-transition: all ease-out 0.5s;
	-moz-transition: all ease-out 0.5s;
	-o-transition: all ease-out 0.5s;
	transition: all ease-out 0.5s;
}

.seta_top:before{
      content: "▲"; /* ▼ ▲ */
   position:absolute;
   top:50%;
   margin-top: -20px;


   font-size:0.8em;
   color:#666;
   z-index:100;
}

 .seta_bottom:before{
   content: "▼"; /* ▼ ▲ */
   position:absolute;
   top:50%;
   margin-top: 10px;


   font-size:0.8em;
   color:#666;
   z-index:100;
}


.bola_rosa:hover {
   /*background:#fff;*/
	background:#e04ba9;
    transform:scale(1.5);
    -webkit-transition: all ease-out 0.5s;
    -moz-transition: all ease-out 0.5s;
    -o-transition: all ease-out 0.5s;
    transition: all ease-out 0.5s;
}


.bola_rosa + .resumo{
	display: none;
}
/*.bola_rosa:hover + .resumo{
	position: absolute;
	display: block;
	left: 50%;
	top: 0;
	margin-left: -70px;
	margin-top:-80px;
	white-space: normal;
	padding: 10px;
	width: 120px;
	/*background: #e04ba9;* /
	background:rgba(224,75,169, 1) !important;
	color: #FFF;
	z-index: 100;
}*/

img+.bola_rosa:hover + .resumo{
	margin-top:0px;
}
.marca-centro{
	position:fixed;
	bottom:5px;
	font-size:2em;
	color:#fff;
	text-align:center;
	z-index:100;
	width:100%;
	-webkit-transform: rotate(-90deg);	/* Safari */
	-moz-transform: rotate(-90deg);	/* Firefox */
	-ms-transform: rotate(-90deg);	/* IE */
	-o-transform: rotate(-90deg);	/* Opera */
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=4); /* Internet Explorer */
}

.foto_redonda{

	    border-radius: 100%;
}


.marca-seta-lateral::before{
	content: "▼"; /* ▼ ▲ */
	position:absolute;
	top:50%;
	margin-top: -12px;
	margin-left: -35px;

	font-size:1.5em;
	color:#666;
	z-index:100;
	/*
	-webkit-transform: rotate(90deg);	/* Safari * /
	-moz-transform: rotate(90deg);	/* Firefox * /
	-ms-transform: rotate(90deg);	/* IE * /
	-o-transform: rotate(90deg);	/* Opera * /
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); /* Internet Explorer */

}



/**
*
* CSS NOVO LAYOUT
*
**/

.box1{
	position: absolute;
	vertical-align: bottom;
	width: 140px;
	min-height: 68px;
	display: table;
	top:150px;
	z-index: 100;
}

.box2{
	position: absolute;
	vertical-align: bottom;
	width: 140px;
	min-height: 68px;
	display: table;
	top:295px;
	z-index:100;
}

.box2 .box{
	color: #993C76;
}


.box-top1{
	position: absolute;
	z-index: 100;
	width:40px;
	margin-left:60px !important;
}
.box-top3{
	position: absolute;
	z-index: 100;
	width:40px;
	margin-left:60px !important;
	top:530px;
}

.box-top1:hover{
	z-index: 300;
}






/**
*
* CSS DO IFRAME DOS BOTOES DO CFEMEA
*
**/
.box-iframe {
	font-size: 14px;
}

.box-iframe h2{
	text-transform: uppercase;
	color: #9c2d86;
}

.box-iframe a {
	/*color:#711896;
	color:#5A316C;*/
	color: #84689C;
}
.box-iframe a:hover {
	color: #711896;
}

.box-iframe > div.box-iframe-first {
	float: left;
	padding: 20px 45px 15px 20px;
}

.box-iframe > div.box-iframe-second {
	/*float: right;*/
	padding-right: 45px;
	max-height: 425px;
	overflow: auto;
}

.box-iframe > div.box-iframe-second-txt {
	/*float: right;*/
	padding: 0 25px;
	max-height: 445px;
	overflow: auto;
}


/**
*
* CSS MISC (Andreolle)
*
**/

.citacao{
   color:#9C2D86;
   text-align: left;
}