/*  TESTE */

/*@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700); */
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,100,100italic,300italic,400italic,500italic,500,700,700italic);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,700italic,600italic,400italic,300,300italic,600);
/*@import url(https://fonts.googleapis.com/css?family=Indie+Flower);*/
@import url(https://fonts.googleapis.com/css?family=Architects+Daughter);

html, body {
	min-height: 100%;
	height: 100%;
}

body {
	background-size: cover;
    background-position: top left;
    overflow-x: hidden;              
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

object {
	display: none;
}

body.modal-hipertexto-open .modal-backdrop {
	z-index: 1039;
}

img, img[usemap], map, map area, img.map {
	outline: none;
}

mark.highlight.in {
				background-position: -100%;
			}
	
mark.highlight {
	background-image: -webkit-linear-gradient(left, #ffffff 50%, #fee603 50%);
	background-image: linear-gradient(to right, #ffffff 50%, #fee603 50%);
	background-position: 0;
	background-size: 200%;
	-webkit-transition: all 0.8s;
	transition: all 0.8s;
}

sub{
    vertical-align: sub;
    font-size: smaller;
}


sup{
    vertical-align: sup;
    font-size: smaller;
}

.azul a.visited {
    position: relative;
}
.azul a.visited:before {
    content: " ";
    background: url(../img/visitado.png);
    width: 20px;
    height: 20px;
    top: -1px;
    left: -40px;
    position: absolute;
}

/* ######### FLEX DE ABERTURA DE CAPÍTULO ########## */

	.flexbox .abertura-cap {
		display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
		display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
		display: -ms-flexbox;      /* TWEENER - IE 10 */
		display: -webkit-flex;     /* NEW - Chrome */
		display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	      
		width: 100%;
		height: 50%;
		
		-webkit-flex-flow: wrap row;
  		flex-flow: wrap row;
		flex-flow: row wrap;

		align-items: center;
		justify-content: center;
	}
	.flexbox .abertura-cap > div {
		display: block;
		vertical-align: middle;
		margin: 0;
		/* padding: 0; */
		padding-left: 15px;
    	padding-right: 15px;
		float: left;
		bottom: 0;
		-webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
		-moz-box-flex: 1;         /* OLD - Firefox 19- */
		width: 100%;               /* For old syntax, otherwise collapses. */
		-webkit-flex: 1;          /* Chrome */
		-ms-flex: 1;              /* IE 10 */
		flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ */
		flex: 1 100%;
	}
	.flexbox .img-abertura-capitulo {
		-webkit-box-ordinal-group: 2;
		-moz-box-ordinal-group: 2;
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
	} 
	.flexbox .titulo-abertura-capitulo {
		-webkit-box-ordinal-group: 1;
		-moz-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
	}


                                                                                              
	@media screen and (min-width: 641px) {
		.flexbox .abertura-cap {
			height: 100%;
		}
		.flexbox .abertura-cap > div {
			flex: 1 0px; 
		}

		.flexbox .img-abertura-capitulo {
			position: static; 
			bottom: 0;
			left: 0px;
			order:1;
			width: 100%;
			left: 0;
			bottom: 0;
			/*position: static; */
		                                                                                                                                                                   
		} 
		.flexbox .titulo-abertura-capitulo {
			order:2;
		}
		#abertura_capitulo_canvas {
			/*padding-bottom: 0px /*opcional*/;  
		}
	}

@media( max-width: 480px ){
	#nav_menu ul{		
	    padding-left: 20px;
	}
	#nav_menu .modal-body {
	    padding: 25px 15px;
	}
}

body.abertura:after {
    content: "";    
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 20%, rgba(0,0,0,.5) 48%, rgba(0,0,0,0) 85%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 20%,rgba(0,0,0,.5) 48%,rgba(0,0,0,0) 85%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 20%,rgba(0,0,0,.5) 48%,rgba(0,0,0,0) 85%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00003556', endColorstr='#00003556',GradientType=0 ); /* IE6-9 */
    width: 100%;
    height: 100%;
    position: absolute;
    background-position: bottom center;
    background-repeat: repeat-x;
    top:0;
}
body.abertura div#main {
    z-index: 19;
}
body.abertura ol.breadcrumb.hidden-xs {
	display:none;
}

.abertura .container { background-color: transparent;}

.abertura .card-base { background-color: transparent;}

.modulo {
	padding: 2px 30px 0px 30px;
	opacity: 1;
	transition: opacity 0.5s;
	-webkit-transition: opacity 0.5s;
	-moz-transition: opacity 0.5s;
	-o-transition: opacity 0.5s;
}
.modulo:before {
	content: "\e252";
	font-family: 'Glyphicons Halflings';
	position: absolute;
	height: 15px;
	width: 15px;
	right: 10px;
	top: 1px;
	font-size: 1em;
}
.modulo ul li {
	padding: 10px 20px 10px 35px;
	box-shadow: inset 0px 1px 0px 0px rgba(50, 50, 50, 0.2);
	-webkit-box-shadow: inset 0px 1px 0px 0px rgba(50, 50, 50, 0.2);
	-moz-box-shadow: inset 0px 1px 0px 0px rgba(50, 50, 50, 0.2);
	width: 100%;
	line-height: 1.5;
}
.modulodrop {
	opacity: 0;
	transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;
	-moz-transition: opacity 0.3s;
	-o-transition: opacity 0.3s;
	visibility: hidden;
}

.modulo ul {
    position: absolute;
    top: 30px;
    left: -15px;
}
.titulo {
	height: 50px;
	font-size: 20px;
	line-height: 50px;
}

body.dev:before {
	content: "";
	background-image: url(../img/badge-dev.png);
	width: 200px;
	height: 200px;
	position: absolute;
	left: -15px;
	z-index: 2;
}

.embed-responsive > iframe {
	border: 3px solid #C5C5C5;
}
.modal-footer {
    margin-top: 0px;
}
.padrao #main .content,
.tela-exemplo #main .content,
.tela-exercicio #main .content,
.tela-desafio #main .content {
	margin-top: 0px;
	min-height: 100%;
	padding-bottom: 50px;
}
.tela-desafio {
    border-radius: 5px;
}
.tela-desafio,
.tela-desafio h1,
.tela-desafio h2 {
    margin-top: 0;
}

.tela-exercicio #questionario, .tela-desafio #questionario {
    padding: 15px;
    text-shadow: none;
}
.tela-exercicio .background-esticado, .tela-desafio .background-esticado {
	padding: 0;
}

.container {
	margin-bottom: 0;
	padding-bottom: 0;
	box-shadow: none;
	height: calc(100% - 130px);
}

.navbar-fixed-bottom, .navbar-fixed-top {
	z-index: 20;
}

ol.breadcrumb li:nth-child(1):before {
	list-style: none;
    content: "";
}


ol.breadcrumb li:nth-child(1) a:before {
    background-image: url(../img/home.svg);
	background-repeat: no-repeat;
    content: "";
	padding: 0 15px 0 5px;
	list-style: none;
}

.breadcrumb > li {
    display: inline;
}

#botao_confirma, #botao_feedback, #botao_voltar, #botao_avancar, #botao_fechar {
	border-radius: 3px;
}

.btn-info {
	border-radius: 0;
	border: 0;
	text-transform: uppercase;
	font-size: .85em;
	transition: all .3s ease;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
}

.box-align-middle .centered img { display: block; margin: 0 auto !important; max-width: 400px ; }


.cards, .cards .foto {
	height: calc(100vh - 130px);
}

.card-cap { height: 100%; }

.row.cards > div:nth-child(1) .card-cap .bg {
    background-position: top right;
}

.cards h2 {
    font-family: 'Architects Daughter', cursive;
    font-size: 3em;
    margin-top: 0;
}

.cards .svg-title {
    margin-bottom: 60px;
    width: 100%;
}

.cards text {
    fill: #fff;
    font-family: 'Architects Daughter', cursive;
    /*stroke: #fff;*/
    stroke-linejoin: round;
    stroke-width: 1px;
    paint-order: stroke;
}

       
.abertura .content { 
	position: absolute;
	bottom: 0;
	width: 100%;
	margin-left: 0;
	left: 0;
	padding: 0;
		
}
.container, .card-base {
    background-color: transparent;
}

.card-cap {
    background-color: transparent;
    padding: 0;
    margin-bottom: 25px;
}
.card-cap .titulo h2 {
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
    margin: 0;
    font-size: 16px;
    line-height: 30px;
}
        
.row.cards {
    margin-top: 0;
}
.cards .texto {
    max-height: 70vh;
    overflow: auto;
}
.row.cards > div .card-cap {
    margin-bottom: 25px;
    position: relative;
}

.abertura .card-base {
	display: table;
	width: 100%;
	height: 100%; 
}

.abertura .card-base h1 { 
	margin: 0;
	display: table-cell;
	vertical-align: middle;
	border: 0;
	text-align: center;
	font-size: 4.5em;
	text-transform: uppercase;
	font-weight: 200;
	text-shadow: 0 0 10px rgba(0,0,0,.5);
	padding: 0 30px 20px 30px;
}

.padrao .container h1, .tela-exemplo .container h1, .tela-exercicio .container h1, .tela-desafio .container h1 {
    font-size: 29px;
    font-weight: 300 !important;
    border-bottom: 0 !important;
    margin-bottom: 20px;
    margin-top: 20px;
}



.row.cards > div .card-cap .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    background-size: cover;
}
.abertura-capitulo #main .content {
	padding-bottom: 0;
	/*height: 100%;*/
	min-height: 100%;
}

.img-abertura-capitulo {
	position: fixed;
	bottom: -10vh;
	left: -100px;
	opacity: .5;
}

.img-abertura-capitulo > img {
	width: 45vw;
}

.img-left {
	float: left;
	margin: 0 20px 10px 0;
}


/*--------------------------- ABERTURAS DE CAPÍTULO e TÓPICO ----------------------------*/

.abertura-cap {
	display: table;
    width: 100%;
    height: 100%;
}

.abertura-cap > div {
	display: table-cell;
	vertical-align: middle;
	margin: 0;
	padding: 0;
	float: none;
}

.abertura-cap label,
.abertura-topico label,
.encerramento-topico label {
	display: block;
	font-size: 1.7em;
	padding: 5px;
	text-transform: uppercase;
	border-bottom: 1px dotted;
	letter-spacing: 1px;
	margin-bottom: 10px;
    text-shadow: 0 0 6px rgba(0, 0, 0, 0.35);
}

.padrao .container .abertura-cap h1 {
	font-size: 3.5em !important;
	font-weight: 300 !important;
	border: 0 !important;
	text-transform: uppercase;
	margin-top: 0;
    text-shadow: 0 0 3px rgba(0, 0, 0, 0.35);
}

.abertura-cap > div {
	text-align: center;
}

.abertura-topico .caixa-contorno h1 {
	margin-top: 0 !important;
	border: 0 !important;
    font-weight: 400 !important;
}


.abertura-topico label:before,
.encerramento-topico label:before {
	content: "";
	position: absolute;
	left: 3px;
	background-image: url(../img/bookmark.svg);
	background-repeat: no-repeat;
	position: absolute;
	width: 15px;
	height: 25px;
}

.body-abert-capitulo .content, .abertura .content {
	height: 100%;
	padding-bottom: 0 !important;
}

.body-abert-capitulo .container h1 {
	border: 0 !important;
}


/*---------------- SUMÁRIO ---------------------------*/

.menu .modal-dialog.modal-sm ul.sub_nivel {
    margin-left: 20px;
}



/*-------------------- PALETA CORES -----------------------------*/

.amostra-de-cor .color {
    background-color: #cccccc;
    color: white;
    display: table-cell;
    width: 400px;
    height: 100px;
    text-align: center;
    vertical-align: middle;
    border-radius: 4px;
}

.amostra-de-cor p:first-of-type:before {
    content: "RGB";
}
.amostra-de-cor p:first-of-type:before, .amostra-de-cor p:last-of-type:before {
    position: absolute;
    left: 15px;
    background-color: #cecece;
    width: 40px;
    text-align: center;
    font-weight: 400;
}

.amostra-de-cor p {
    margin: 0;
    background-color: #f2f2f2;
    font-size: .8em;
    margin-top: 1px;
    margin-left: 40px;
    padding: 0 10px;
    text-transform: uppercase;
    color: #000;
}

.amostra-de-cor p:last-child {
    margin-bottom: 30px;
}

.amostra-de-cor p:last-of-type:before {
    content: "HEX";
}

.amostra-de-cor p:first-of-type:before, .amostra-de-cor p:last-of-type:before {
    position: absolute;
    left: 15px;
    background-color: #cecece;
    width: 40px;
    text-align: center;
    font-weight: 400;
}

.rounded {
	border-radius: 5px;
}

/*---------------------------------------------------*/

.infografico-svg {
    background-color: #F5F5F5;
    padding: 20px;
}

svg .hipertexto_modal {
	cursor: pointer;
}

.img-responsive[src$=".svg"] {
	width: 100%;
}

svg .sublinhaLink {
	text-decoration: underline;
}

/* --------------------- ÍCONES ---------------------- */

.filme .ico-link { background: none;}

.icones .ico-link {
	cursor: pointer;
	background: none;
}

.icones.saiba .ico-link {
	position: relative;
    width: 80px;
    height: 80px;
    float: none;
    border-radius: 0;
    margin: 0 auto;
    cursor: pointer;
	background: none;
}
.icones.saiba .ico-cont {
	border-left: 0; 
	padding-left: 0; 
	position: relative; 
	overflow: inherit; 
}
.icones.saiba > .ico-cont p:first-child {
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	margin-top: 10px;
}
.icones.saiba > .ico-cont p.descricao {
	text-align: center;
	opacity: 0;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}
.icones svg #contorno {
	stroke-dasharray: 255px;
	transition: all .5s ease-out;
	-webkit-transition: all .5s ease-out;
	stroke-dashoffset: 0;
}
.icones.hover svg #contorno {
	transition: all .5s ease;
	-webkit-transition: all .5s ease;
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	stroke-dashoffset: -255px;
	transform-origin: center;
	-webkit-transform-origin: center;
	/*stroke-dasharray: 3;*/
}
.icones.saiba.hover > .ico-cont p.descricao {
	opacity: 1;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}

.icones.saiba svg#lampada {
	position: absolute;
	top: 50%;
	width: 35%;
	margin-top: -19px;
	left: 50%;
	margin-left: -14px;
}

.browser-family-ie .icones.saiba svg#lampada {
	margin-top: -39px;
}

.icones.saiba svg #bg-ico {
    fill: transparent;
}
.icones.saiba.active svg#lampada {
	animation: pulse .6s ease infinite;
	-webkit-animation: pulse .6s ease infinite;
}
@keyframes pulse {
	0% { opacity: .8; transform: scale(1); }
	50% { opacity: 1; transform: scale(1.2); }
	100% { opacity: .8; transform: scale(1); }
}
@-webkit-keyframes pulse {
	0% { opacity: .8; transform: scale(1); }
	50% { opacity: 1; transform: scale(1.2); }
	100% { opacity: .8; transform: scale(1); }
}
@keyframes pulseCenter {
	0% { opacity: .9; transform: scale(1); transform-origin: center center; }
	50% { opacity: 1; transform: scale(1.2); transform-origin: center center; }
	100% { opacity: .9; transform: scale(1); transform-origin: center center; }
}
@-webkit-keyframes softpulse {
	0% { opacity: .9; transform: scale(1); transform-origin: center center; }
	50% { opacity: 1; transform: scale(1.2); transform-origin: center center; }
	100% { opacity: .9; transform: scale(1); transform-origin: center center; }
}
.icones.saiba.active svg #bg-ico { fill: #ff0; }
.icones.saiba.active .cls-2 { fill: #BAB100; }

*[data-svgreplace='true'] {
	visibility: hidden;
}


/* ---------------------- UL ------------------------------- */

ul {
    list-style-type: none;
    margin-bottom: 20px;
}

ul li {
    padding-left: 1em;
    text-indent: -1.1em;
}

ul li:before {
	font-family: 'Glyphicons Halflings';
	content: "\25A0";
	position: relative;
	top: -1px;
	padding-right: 11px;
	color: #0070ba;
	font-size: 14px; /*1.1em;*/
}

.menu ul li.visited:before,
.menu ul.bullet-2 li.visited:before,
.menu ul.bullet-3 li.visited:before,
.menu ul.bullet-4 li.visited:before  {
	content: "";
	background: url(../img/visitado.png);
    width: 20px;
    height: 20px;
    display: inline-block;    
    position: relative;
    left: -5px;
    top: 3px;
}

ul.bullet-2 li:before { content: "\25A1"; }
ul.bullet-3 li:before { content: "\25CF"; font-size: 16px; }
ul.bullet-4 li:before { content: "\25CB"; font-size: 16px; }
ul.bullet-5 li:before { content: "\25C6"; font-size: 16px; }

ul li li:before {
    content: "\25A1";
    top: 0;
    font-size: 14px;
}
ul li li li:before {
    content: "\25CF";
    font-size: 14px;
}
ul li li li li:before {
    content: "\25CB";
}
ul li li li li li:before {
    content: "\25C6";
    font-size: 14px;
    top: 3px;
}

/*------------------------------------------------*/

.caixa-filmete { margin: 0; }
.caixa-filmete .box-icone { margin: 0; }

.pills-fgv .texto-tab, .pills .texto-tab {
    border: 0;
}

.texto-tab {
	background-color: #fff;
} 

.pills .nav-pills li, footer ul li {
	text-indent: 0;
	padding-left: 0;
}

.pills .nav-pills li:before, footer ul li:before {
    content: "";
    position: absolute;
    top: 0;
    padding-right: 0;
    color: transparent;
}

#linha-tempo .panel-title a {
	border: 1px solid transparent;
}

.panel h4.panel-title h3 {
    color: white;
    font-weight: normal;
    margin: 10px 0;
}


/* .tab-content .tab-pane  {

	background-color: #fff;
}
 */


/*------- TEXTO 2 COLUNAS --------- */

.duas-colunas > div:first-child { border-right: none; }
.duas-colunas > div:last-child { border-left: 1px solid; }

/*------- TEXTO 3 COLUNAS --------- */

.tres-colunas > div:first-child { border-left: none; }
.tres-colunas > div:last-child { border-right: none; }
.tres-colunas div > img { margin: 0 auto 30px !important; }
.tres-colunas div { border-right: none; border-left: 1px solid; float:left !important; }
.tres-colunas > div:last-child { border-left: 1px solid; }

/* ---------------------- ANIMAÇÕES DE ENTRADA ------------------------------- */

.content div.anima {
	position: relative;
/*	border: 1px dashed #e63973;*/
	min-height: 200px;
	background: url(../img/loader.gif) center center no-repeat;

}
.content div.anima .loader {
	position: absolute;
	width: 40px;
	height: 40px;
	top: 50%;
	margin-top: -20px;
	left: 50%;
	margin-left: -20px;
}
.content div.anima .loader > div {
	border-radius: 100%;
	width: 40px;
	height: 40px;  
	
}

@keyframes spin-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
@-webkit-keyframes spin-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* RIGHT-TO-LEFT */

.anima *[data-anima-direction='right-to-left'],
.anima *[data-anima-direction='left-to-right'],
.anima *[data-anima-direction='top-to-bottom'],
.anima *[data-anima-direction='bottom-to-top'],
.anima *[data-anima-direction='fade'] {
	opacity: 0;
	-webkit-animation-fill-mode: both; /* Chrome, Safari, Opera */
    animation-fill-mode: both;
}

*.complete[data-anima-direction='right-to-left'] {
	opacity: 1;
	animation: animaRight .5s ease-out;
	-webkit-animation: animaRight .5s ease-out;
	-moz-animation: animaRight .5s ease-out;
	display: block;
}
@keyframes animaRight {
	0% { display:none; opacity: 0; transform: translateX(100px); }
	100% { display:block; opacity: 1; transform: translateX(0px);}
}
@-webkit-keyframes animaRight {
	0% { display:none; opacity: 0; transform: translateX(100px); }
	100% { display:block; opacity: 1; transform: translateX(0px);}
}

/* LEFT-TO-RIGHT */

*.complete[data-anima-direction='left-to-right'] {
	opacity: 1;
	animation: animaLeft .5s ease-out;
	-webkit-animation: animaLeft .5s ease-out;
	-moz-animation: animaLeft .5s ease-out;
	/*display: inline-block;*/
}
@keyframes animaLeft {
	0% { display:none; opacity: 0; transform: translateX(-100px); }
	100% { display:block; opacity: 1; transform: translateX(0px);}
}
@-webkit-keyframes animaLeft {
	0% { display:none; opacity: 0; transform: translateX(-100px); }
	100% { display:block; opacity: 1; transform: translateX(0px);}
}

/* TOP-TO-BOTTOM */

*.complete[data-anima-direction='top-to-bottom'] {
	opacity: 1;
	animation: animaTop .5s ease-out;
	-webkit-animation: animaTop .5s ease-out;
	-moz-animation: animaTop .5s ease-out;
	display: inline-block;
}
@keyframes animaTop {
	0% { display:none; opacity: 0; transform: translateY(-100px); }
	100% { display:block; opacity: 1; transform: translateY(0px);}
}
@-webkit-keyframes animaTop {
	0% { display:none; opacity: 0; transform: translateY(-100px); }
	100% { display:block; opacity: 1; transform: translateY(0px);}
}
/* BOTTOM-TO-TOP */

*.complete[data-anima-direction='bottom-to-top'] {
	opacity: 1;
	animation: animaBottom .5s ease-out;
	-webkit-animation: animaBottom .5s ease-out;
	-moz-animation: animaBottom .5s ease-out;
/*	display: inline-block;*/
}
@keyframes animaBottom {
	0% { display:none; opacity: 0; transform: translateY(100px); }
	100% { display:block; opacity: 1; transform: translateY(0px);}
}
@-webkit-keyframes animaBottom {
	0% { display:none; opacity: 0; transform: translateY(100px); }
	100% { display:block; opacity: 1; transform: translateY(0px);}
}

/* FADE */

*.complete[data-anima-direction='fade'] {
	opacity: 1;
	animation: animaFade .5s ease-out;
	-webkit-animation: animaFade .5s ease-out;
	-moz-animation: animaFade .5s ease-out;
	/*display: inline-block;*/
}
@keyframes animaFade {
	0% { display:none; opacity: 0; }
	100% { display:block; opacity: 1; }
}
@-webkit-keyframes animaFade {
	0% { display:none; opacity: 0; }
	100% { display:block; opacity: 1; }
}

.complete[data-delay="0"] { -webkit-animation-delay: 0s; animation-delay: 0s; animation-fill-mode: both; -webkit-animation-fill-mode: both }
.complete[data-delay=".25"] { -webkit-animation-delay: .25s; animation-delay: .25s; animation-fill-mode: both; -webkit-animation-fill-mode: both }
.complete[data-delay=".5"] { -webkit-animation-delay: .5s; animation-delay: .5s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay=".75"] { -webkit-animation-delay: .75s; animation-delay: .75s; animation-fill-mode: both; -webkit-animation-fill-mode: both}

.complete[data-delay="1"] { -webkit-animation-delay: 1s; animation-delay: 1s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="1.25"] { -webkit-animation-delay: 1.25s; animation-delay: 1.25s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="1.5"] { -webkit-animation-delay: 1.5s; animation-delay: 1.5s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="1.75"] { -webkit-animation-delay: 1.75s; animation-delay: 1.75s; animation-fill-mode: both; -webkit-animation-fill-mode: both}

.complete[data-delay="2"] { -webkit-animation-delay: 2s; animation-delay: 2s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="2.25"] { -webkit-animation-delay: 2.25s; animation-delay: 2.25s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="2.5"] { -webkit-animation-delay: 2.5s; animation-delay: 2.5s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="2.75"] { -webkit-animation-delay: 2.75s; animation-delay: 2.75s; animation-fill-mode: both; -webkit-animation-fill-mode: both}

.complete[data-delay="3"] { -webkit-animation-delay: 3s; animation-delay: 3s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="3.25"] { -webkit-animation-delay: 3.25s; animation-delay: 3.25s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="3.5"] { -webkit-animation-delay: 3.5s; animation-delay: 3.5s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="3.75"] { -webkit-animation-delay: 3.75s; animation-delay: 3.75s; animation-fill-mode: both; -webkit-animation-fill-mode: both}

.complete[data-delay="4"] { -webkit-animation-delay: 4s; animation-delay: 4s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="4.25"] { -webkit-animation-delay: 4.25s; animation-delay: 4.25s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="4.5"] { -webkit-animation-delay: 4.5s; animation-delay: 4.5s; animation-fill-mode: both; -webkit-animation-fill-mode: both}
.complete[data-delay="4.75"] { -webkit-animation-delay: 4.75s; animation-delay: 4.75s; animation-fill-mode: both; -webkit-animation-fill-mode: both}

.complete[data-delay="5"] { -webkit-animation-delay: 5s; animation-delay: 5s; animation-fill-mode: both; -webkit-animation-fill-mode: both}




/*-------------- POSIÇÕES DE DIVS COM IMAGENS ------------------*/


/* BOTTOM-LEFT */

div[data-position="bottom-left"] {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: -1;
}
div[data-position="bottom-left"] img {
	text-align: left;
}

/* BOTTOM-RIGHT */

div[data-position="bottom-right"] {
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: -1;
}
div[data-position="bottom-right"] img {
	text-align: right;
}

/* TOP-LEFT */

div[data-position="top-left"] {
	float: left;
	z-index: -1;
}
div[data-position="top-left"] img {
	text-align: left;
}

/* TOP-RIGHT */

div[data-position="top-right"] {
	float: right;
	z-index: -1;
}
div[data-position="top-right"] img {
	text-align: right;
}

/* ---------- "FIXED" ---------------*/

div[data-position="bottom-left-fixed"] {
	position: fixed;
	bottom: 0;
	left: -15vw;
	z-index: -1;
}
div[data-position="bottom-left-fixed"] img {
	text-align: left;
}

/* BOTTOM-RIGHT */

div[data-position="bottom-right-fixed"] {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: -1;
}
div[data-position="bottom-right-fixed"] img {
	text-align: right;
}

/* TOP-LEFT */

div[data-position="top-left-fixed"] {
	position: fixed;
	top: 0;
	left: -15vw;
	z-index: -1;

}
div[data-position="top-left-fixed"] img {
	text-align: left;
}

/* TOP-RIGHT */

div[data-position="top-right-fixed"] {
	position: fixed;
	top: 0;
	right: -15vw;
	z-index: -1;
}
div[data-position="top-right-fixed"] img {
	text-align: right;
}

/*------------------------ POPUPS ----------------------------*/

.justificada { text-align: justify; } /*<--- IMPORTANTE PARA DISTRIBUIR AS DIVS DENTRO DO PAI*/

#modal-pop-tela {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 1039;
    /*padding: 10px;*/
    display: none;
}

#modal-pop-tela .pop-tela-overlay{
    background-color: rgba(0,0,0,.5);
	height: 100%;
	width: 100%;
    position: absolute;
    top: 0;
}

.pop-tela-content-wrap {
    background-color: white;
    z-index: 1;
    box-shadow: 0 0 10px rgba(0,0,0,0.15);
    border-radius: 3px;
    height: 100%;
    /*overflow: auto;*/
    margin: 0 auto;
    max-width: 100%;
    position: relative;
    transition: transform 1s, opacity 1s;
    transform: scale(1);
    opacity: 1;
}

.pop-tela-content-wrap {
    transform: scale(0);
    opacity: 0;
}


.modal-pop-tela-open .pop-tela-content-wrap {
    transform: scale(1);
    opacity: 1;
}

.pop-tela-content {
    overflow: auto;
    max-height: 100vh;
}

.saibamais .pop-tela-content:before {
    content: "";
    position: absolute;
    width: 84px;
    height: 84px;
    top: -20px;
    left: -20px;
    z-index: 99999;
    border: 10px solid #FFFF87;
    border-radius: 50%;
}

.azul .saibamais .pop-tela-content:before {
    background-image: url(../img/ico-saiba-azul.svg);
}

.vermelho .saibamais .pop-tela-content:before {
    background-image: url(../img/ico-saiba-vermelho.svg);
}

.vermelho .ui-dialog.gabarito .ui-icon.ui-icon-closethick {
    background: transparent url("../img/simulado-fechar-vermelho.png") 0 0 no-repeat;
}

.verde .saibamais .pop-tela-content:before {
    background-image: url(../img/ico-saiba-verde.svg);
}

.amarelo .saibamais .pop-tela-content:before {
    /* content: ""; */
    background-image: url(../img/ico-saiba-amarelo.svg);
    /* position: absolute;
    width: 84px;
    height: 84px;
    top: -20px;
    left: -20px;
    z-index: 99999;
    border: 10px solid #FFFF87;
    border-radius: 50%; */
}

.saibamais.lg {
    padding-top: 25px;
}

.saibamais.lg .pop-tela-content {
    max-height: calc( 100vh - 150px );
}


.saibamais .pop-tela-content-wrap {
    background-color: #FFFF87;
}

.pop-tela-content > .container {
	width: auto;
}

#modal-pop-tela.lx .pop-tela-content-wrap { max-width: 1500px; }
#modal-pop-tela.lg .pop-tela-content-wrap { max-width: 1000px; }
#modal-pop-tela.md .pop-tela-content-wrap { max-width: 750px; }
#modal-pop-tela.sm .pop-tela-content-wrap { max-width: 500px; }
#modal-pop-tela.xs .pop-tela-content-wrap { max-width: 250px; }

.pop-tela-content-wrap #fechar {
	overflow: hidden;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
	position: absolute;
	right: 20px;
	text-align: center;
	top: 10px;
	line-height: 30px;
	cursor: pointer;
	padding: 0 5px;
	text-transform: uppercase;
	font-size: 11px;
	width: 57px;
	height: 30px;
}

.pop-tela-content-wrap #fechar:before {
	content: 'fechar';
	position: absolute;
	left: 8px;
	top: 0;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}

.pop-tela-content-wrap #fechar:hover:before {
	top: 24px;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}

.pop-tela-content-wrap #fechar:after {
	content: 'X';
	width: 100%;
	position: absolute;
	top: -30px;
	left: 0;
	color: #FFF;
	font-size: 13px;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}

.pop-tela-content-wrap #fechar:hover:after {
	top: 0;
	background-color: rgba(0,0,0,0.15);
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}

.pop-tela-content-wrap .pop-tela-content{
    padding: 50px;	
}

/*--------------- POP-UP COLORIDA --------------*/

.popup-colorida {
	position: absolute;
	padding: 20px;
	top: 0;
	left: 0;
	border-radius: 5px;
	box-shadow: 5px 5px 0px rgba(0,0,0,0.2);
	border: 1px solid #909090;
    transform: scale(0);
    background-color: #eaeaea;
    color: #000;
    text-shadow: 1px 1px 0px #ffffff;
    z-index: 30;
}

.popup-colorida.lg { width: 850px; height: 500px; margin-left: -410px; margin-top: -240px; }
.popup-colorida.md { width: 500px; height: 400px; margin-left: -240px; margin-top: -185px; }
.popup-colorida.sm { width: 350px; height: 350px; margin-left: -165px; margin-top: -165px; }

.popup-colorida h3 {
	color: #909090;
    text-shadow: 1px 1px 0 #ffffff;
	margin-top: 0;
	width: 90%;
}

.popup-colorida p:last-child {
	margin-bottom: 0;
}

.popup-colorida button {
	position: static;
    right: 20px;
    /* background-color: #909090; */
    border: none;
    color: #fff;
    border-radius: 3px;
    font-size: 11px;
    font-weight: bold;
    transition: all .3s;
    float: right;
    margin-left: 20px;
}
.popup-colorida button:hover {
	background-color: #fff;
	color: #909090;	
}

.popup-colorida-overlay {
	position: fixed;
	top: 0;
	left: 0;
	background: transparent;
	height: 100vh;
	width: 100vw;
}

/*--------------------------------------------*/

.nav-icones #icone {
	display: inline-block;
	vertical-align: top;
	cursor: pointer;	
}

.nav-icones #icone span {
	display: block;
	text-align: center;
	margin-top: 10px;
}

.nav-icones #icone.clicado img { opacity: .5; }

.container-popups {
    width: 100%;
    text-align: justify;
}
.separador {
    width: 100%;
    display: inline-block;
    font-size: 0;
    line-height: 0
}

.container span.pop-tela {
	text-decoration: underline;
	cursor: pointer;
}

#nav_glossario .letras {
    display: table;
    padding: 0;
}

#nav_glossario .letras li {
    display: block;
    padding: 0;
    margin: 0;
    float: left;
    list-style: none;
    text-indent: 0;
}

#nav_glossario .letras a {
    display: block;
    width: 25px;
    height: 25px;
    padding: 2px;
    text-align: center;
    margin: 1px;
    border: 1px solid;
    background-color: #CCC;
}

#nav_glossario .letras a.disabled {
    opacity: .5;
    border: 0;
    cursor: default;
}

#nav_glossario .letras a:hover,
#nav_glossario .letras a:focus,
#nav_glossario .letras a:active,
#nav_glossario .letras a.active {
    text-decoration: none;
    background: #CCC;
    color: white;
}

#nav_glossario .letras a.disabled:hover,
#nav_glossario .letras a.disabled:active,
#nav_glossario .letras a.disabled:focus {
    text-decoration: none;
    background-color: #FFE3ED;
    color: #CCC;
}

#nav_glossario .letras li:before,
#nav_referencias .letras li:before {
    content: "";
    display: none;
}
#nav_referencias {
	z-index: 1030;
}

.modal-backdrop {
	z-index: 1029;
}

#nav_referencias .letras li {
	display: block;
	padding: 0;
	text-indent: 0;
	float: left;
	margin-right: 2px;
}
#nav_referencias .letras li a {
	display: block;
	padding: 6px 12px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
#nav_referencias .letras li a.hidden {
	display: none !important;
}
#nav_referencias .letras li a:hover,
#nav_referencias .letras li a:active,
#nav_referencias .letras li a:focus,
#nav_referencias .letras li a.active {
	text-decoration: none;
}

#nav_referencias .letras {
    padding: 0;
	display: table;
	width: 100%;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: 1px solid;
}


.container .nav a:link, .container .nav a:visited, .container .nav a:hover, 
.container .nav a:focus, .container .navbar-header a:link, .container .navbar-header a:visited, 
.container .navbar-header a:hover, .container .navbar-header a:focus {
    text-decoration: none!important;
}

.header .topo-logo {
	background-image: url("../img/logo_fundacao_bradesco.svg");
}


/*------------------- NAV-BOTÕES --------------------------------*/

.container .nav-botoes ul {
	padding: 0;
}

.container .nav-botoes li {
	padding-left: 0;
	text-indent: 0;
}

.container .nav-botoes li:before {
	content: "";
	padding-right: 0;
}

.container .nav-botoes li a {
	display: block;
	padding: 10px;
	margin: 5px;
	text-decoration: none;
}

/*-----------------------------------------------------------------*/

.exemplo-pos-divs > div:last-of-type {
	height: 300px;
	border: 1px solid #ccc;
	padding: 15px;
}

/*------------------------ FOOTER ---------------------------*/

footer {
	background-color: transparent;
	margin-left: 0px;
	bottom: 0;
	top: 0;
    position: fixed;
    z-index: 99;
	/*height: 0;
	width: 0;	
	
	*/
}

footer div.btn.disabled {
    opacity: 0.2 !important;
}

footer nav.menu-nav-inferior.navbar.navbar-default {
    margin: 0;
}
footer.navegacao nav.menu-nav-inferior pre {
    width: 120px;
    height: 50px;
    line-height: 50px;
    background: none;
    border: none;
    font-size: 20px;
    padding: 0;
    margin: 0 auto;
	display: block;
	text-align: center;
}

footer svg {
	width: 45px;
	height: 55px;
	padding: 0 5px;
}

footer ol, footer ul {
	height: 55px;
}

footer nav * {
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

footer .menu .navbar-collapse.in {
	overflow: visible;
}

/* footer .navbar-nav { margin: 0 -6px; } */

footer .menu .navbar-nav > li > a {
    padding-top: 0px;
    padding-bottom: 0px;
    line-height: normal;
    height: 55px;
}

footer .menu .pag_box a {
	display: block;
    height: 55px;
    overflow: hidden;
}

.menu .navbar-toggle {
    position: relative;
    float: left;
    padding: 10px 5px;
    margin-top: 8px;
    margin-left: 0px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 0px solid transparent;
    border-radius: 4px;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: transparent;
}

.menu .nav > li > a {
    position: relative;
    display: block;
    padding: 10px 0px;
}
 .navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border: 0 solid;
}
.menu .modal-dialog.modal-sm {
    width: 500px;
 }

 .menu .modal-dialog.modal-sm ul {
    margin-left: 0;
    padding-left: 0;
 }


.nav li:before {
    content: '';
    padding-right: 0;
}

.nav li {
	text-indent: 0;
}

/*-------------------- ANIMAÇÃO BARRA DE NAVEGAÇÃO ----------------*/

.navegacao li,
.navegacao pre,
.navegacao #paginacao > div svg {
	animation: footer .5s ease;
	-webkit-animation: footer .5s ease;
	animation-fill-mode: backwards;
	-webkit-animation-fill-mode: backwards;
	animation-delay: 0s;
	-webkit-animation-delay: 0s;
	position: relative;
}

@keyframes footer {
	0% { top: 35px; }
	30% { top: -10px; opacity: 1; }
	100% { top: 0px; opacity: 1; }
}
@-webkit-keyframes footer {
	0% { top: 35px; }
	30% { top: -10px; opacity: 1; }
	100% { top: 0px; opacity: 1; }
}

/*------------*/

.navegacao #bt_glossario {
	animation-delay: .1s;
	-webkit-animation-delay: .1s;
}
.navegacao #bt_sumario {
	animation-delay: .2s;
	-webkit-animation-delay: .2s;
}
.navegacao #bt_pdf {
	animation-delay: .3s;
	-webkit-animation-delay: .3s;
}
.navegacao #bt_objetos {
	animation-delay: .4s;
	-webkit-animation-delay: .4s;
}
.navegacao #paginacao > .previous svg {
	animation-delay: .1s;
	-webkit-animation-delay: .1s;
}
.navegacao #paginacao > .next svg {
	animation-delay: 0s;
	-webkit-animation-delay: 0s;
}
.navegacao pre {
	animation-delay: .2s;
	-webkit-animation-delay: .2s;
}

/*--------------------- DIV EXPANSÍVEL -----------------*/

.expande-vertical {
    text-align: center;
    margin-bottom: 25px;
}

.expande-vertical .cont {
	background-color: #fff;
	/*border: 2px solid;*/
	border-radius: 3px;
}

.expande-vertical .cont h2 {
	font-size: 1.3em;
	margin-top: 0;
	transition: all 1s ease;
	-webkit-transition: all 1s ease;
}

.expande-vertical .cont .descricao > * {
	margin: 0;
	transition: all .2s ease;
	-webkit-transition: all .2s ease;
}

.expande-vertical .cont .imagem-link {
	cursor: pointer;
	position: relative;
}

.expande-vertical .cont .imagem-link img {
    display: inline-block;
}

.expande-vertical .cont.clicado .imagem-link {
	cursor: default;
}


.expande-vertical .cont .imagem-link:hover:after {
	background-color: rgba(204,204,204,0.2);
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.expande-vertical .cont.clicado .imagem-link:hover:after {
    background: none !important;
}

.expande-vertical .cont .descricao {
	max-height: 0;
	opacity: 0;
	padding: 0;
	transition: all 1s ease;
	-webkit-transition: all 1s ease;
}

.expande-vertical .cont.clicado .descricao {
	max-height: 1500px;
	opacity: 1;
}

.expande-vertical .cont.clicado .descricao > * {
    margin: 20px 10px 10px;
}

.expande-vertical p:last-of-type {
	margin: 0;
}

/*-------------------- APARECE LATERAL ----------------------*/

.aparece-lateral {
	height: 100%;
	min-height: 100%;
	margin-bottom: 20px;
}

.aparece-lateral .cont {
	position: relative;
    overflow: hidden;
    background-color: #fff;
    /*border: 2px solid;*/
    border-radius: 3px;
    cursor: pointer;
}

.aparece-lateral .cont img {
    display: block;
	margin: 0 auto;
    transition: all .5s ease-in-out;
	-webkit-transition: all .5s ease-in-out;
}
/*.aparece-lateral .cont.clicado img {
	-webkit-filter: blur(5px);
}*/

.aparece-lateral .cont .descricao {
	position: absolute;
	width: 100%;
	top: 0;
	left: -100%;
	padding: 15px;
	background-color: rgba(255,255,255,0.8);
	display: table;
	color: #fff;
	border-radius: 0px;
	transition: all .5s cubic-bezier(.01,.65,.44,1);
	-webkit-transition: all .5s cubic-bezier(.01,.65,.44,1);	
}

.aparece-lateral .cont.clicado .descricao {
	width: 101%;
	left: 0;
}

.aparece-lateral .cont .descricao p {
	display: table-cell;
	vertical-align: middle;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}

/*-------------------- APARECE FADE ----------------------*/

.aparece-fade,
.fadeIn {
	height: 100%;
	min-height: 100%;
	margin-bottom: 20px;
}

.aparece-fade .cont,
.fadeIn .cont {
	position: relative;
    overflow: hidden;
    background-color: #fff;
    cursor: pointer;
}
.fadeIn .cont {
	cursor: default;
}

.aparece-fade .cont img,
.fadeIn .cont img {
    display: block;
	margin: 0 auto;
    transition: all .5s ease-in-out;
	-webkit-transition: all .5s ease-in-out;
}

.aparece-fade .cont .descricao,
.fadeIn .cont .descricao {
	position: absolute;
	top: 0;
	width: 100%;
	padding: 15px;
	color: #666;
	border-radius: 0px;
	opacity: 0;
	transition: all .5s ease-in-out;
	-webkit-transition: all .5s ease-in-out;
}

.aparece-fade .cont.clicado .descricao,
.fadeIn .cont.in .descricao {
	opacity: 1;
}

/*------------------ FLIP HORIZONTAL --------------------------*/

/* entire container, keeps perspective */
.flip-horizontal {
	-webkit-perspective: 1000;
    -moz-perspective: 1000;
    -o-perspective: 1000;
    perspective: 1000;
    -moz-transform: perspective(1000px);
    -moz-transform-style: preserve-3d;
}

.flip-horizontal[data-onclick]{
	cursor: pointer;
}

.no-touch .flip-horizontal:not([data-onclick]):hover .back, .flip-horizontal.hover .back {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.no-touch .flip-horizontal:not([data-onclick]):hover .front, .flip-horizontal.hover .front {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
/* -------------- TROCAR O TAMANHO DO FLIP DE ACORDO COM A NECESSIDADE ------------- */
.flip-horizontal, .flip-horizontal .front, .flip-horizontal .back {
	width: 300px;
	height: 370px;
}

/* flip speed goes here */
.flip-horizontal .flipper {
	-moz-transform: perspective(1000px);
    -moz-transform-style: preserve-3d;

    position: relative;
    
}

/* hide back of pane during swap */
.flip-horizontal .front, .flip-horizontal .back {
	-webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;

    -webkit-transition: 0.6s;
    -webkit-transform-style: preserve-3d;

    -moz-transition: 0.6s;
    -moz-transform-style: preserve-3d;

    -o-transition: 0.6s;
    -o-transform-style: preserve-3d;

    -ms-transition: 0.6s;
    -ms-transform-style: preserve-3d;

    transition: 0.6s;
    transform-style: preserve-3d;

    position: absolute;

    top: 0;
    left: 0;
	border-radius: 5px;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
}

/* front pane, placed above back */
.flip-horizontal .front {
	background-color: #fff;
	z-index: 2;
	/* for firefox 31 */
	transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
}

/* back, initially hidden pane */
.flip-horizontal .back {
	-webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
	padding: 20px;
	background-color: #EDEDED;
	display: table;
}
.flip-horizontal .back h2 {
	font-size: 1.4em;
	margin-top: 0;
}

.flip-horizontal .back .cont {
	display: table-cell;
	vertical-align: middle;
}

/*------------------- APARECE IRIS --------------------------*/

.aparece-iris {
	position: relative;
	border-radius: 50%;
	overflow: hidden;
	width: 160px;
	height: 160px;
	margin: 0 auto;
	text-align: center;
	cursor: pointer;
}

.aparece-iris .cont {
    position: absolute;
    display: table;
    width: 100%;
    height: 100%;
    top: 0; 
    opacity: 0;
    transition: all .25s ease;
    -webkit-transition: all .25s ease;
}

.no-touch .aparece-iris:hover .borda, .aparece-iris.hover .borda {
    border: 80px solid #8C6E6E;
}

.aparece-iris .borda {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    border: 0px solid #8C6E6E;
    border-radius: 50%;
    transition: all .25s ease;
    -webkit-transition: all .25s ease;
}

.aparece-iris.hover .cont, .no-touch .aparece-iris:hover .cont {
	opacity: 1;
}
.aparece-iris .descricao {
    width: 100%;
    height: 100%;
    top: 0;
    display: table-cell;
    vertical-align: middle;
    padding: 20px;
    color: #fff;
}
.aparece-iris .descricao p {
	margin: 0;
}

/*----------------------- BACKGOUND ESTICADO --------------*/

.background-esticado {
	background-color: #ccc;
	position: relative;
	width: 100vw;
	left: 50%;
	margin-left: -50vw;
	padding: 20px 0;
}

.background-esticado .container {
	padding-left: 0;
	padding-right: 0;
}

.background-esticado-vertical .container {
	position: absolute;
	/*background-color: #C9CD00;
	color: #414200;
	padding: 30px 15px;*/
	min-height: 100%;	
	/*overflow: hidden;*/
}

.background-esticado-vertical .container .cont {
    padding: 15px;
    padding-top: 20px;
    min-height: 100%;	
    margin-bottom: 50px;
}
.background-esticado-vertical .container h1 {
	margin-top: 0 !important;
}

.background-esticado-vertical.encerramento .container .cont {
    background-color: #C9CD00;
}
.background-esticado-vertical.encerramento .container h1 {
    color: #FFF !important;
    border: 0 !important;
    margin-top: 0 !important;
    font-weight: 600 !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3) !important;
}

@media screen and (max-width: 480px) {
	.background-esticado{
		margin: 0 -10px;
    	left: 0;    
    	width: auto;
	    left: 0;
	}

	.background-esticado-vertical .container {
    	margin-left: -10px;
    	margin-right: -10px;
    	position: relative;

	}
	.background-esticado .container {
		padding-left: 15px;
		padding-right: 15px;
	}
}


/*------------------ DIV COLORIDA ---------------------------*/

.colorida .container {    
    position: absolute;
    min-height: 100%;
    /*overflow: hidden;*/
}
.colorida .container .cont {
	background-color: #ccc;
	min-height: 100%;
	padding: 15px;
	margin-bottom: 50px;
}
.colorida .container .cont h1 {
	margin-top: 5px;
}

.Right > div {
    float: right !important;
    right: 0 !important;
}

.Left > div {
    float: left;
    left: 0;
}


/*---------------- TIMELINE VERTICAL COM ÍCONES --------------*/

.timeline-horizontal.timeline-icones.carousel {
    padding-top: 100px;
}

.timeline-horizontal.timeline-icones .carousel-indicators:before {
	bottom: 3px;
}

.timeline-horizontal.timeline-icones .carousel-indicators li {
	max-width: 60px;
	margin-top: 0;
	transition: all .5s ease-in-out;
	-webkit-transition: all .5s ease-in-out;
}

.timeline-horizontal.timeline-icones .carousel-indicators li img {
	position: relative;
	bottom: -15px;
	transition: all .5s ease-in-out;
	-webkit-transition: all .5s ease-in-out;
}
.timeline-horizontal.timeline-icones .carousel-indicators li.active img {
	bottom: 0;
}

.timeline-horizontal.timeline-icones .carousel-indicators li:before {
	bottom: 3px;
}

.timeline-horizontal.timeline-icones .carousel-indicators li.active {
	max-width: 80px;
}

.timeline-horizontal.timeline-icones .carousel-indicators li.active:before {
	bottom: 3px;
}

.timeline-horizontal.timeline-icones .carousel-indicators,
.timeline-horizontal.timeline-icones .links,
.timeline-horizontal.timeline-icones .carousel-indicators li {
	height: 100px;
}

/*-------------------------- CAROUSEL ------------------------------------*/

.box-align-middle {
    margin: 20px 0 20px 0;
}

.carousel .box-align-middle > div:last-child {
    padding-left: 60px;
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right,
.carousel-control .icon-prev,
.carousel-control .icon-next {
	font-size: 30px;
	width: 30px;
	height: 30px;
	top: 15px;
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right,
.carousel-control .icon-prev,
.carousel-control .icon-next {
	font-size: 70px;
	width: 80px;
	height: 80px;
	top: 45%;
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .icon-prev {
	margin-left: -40px;
}
.carousel-control .glyphicon-chevron-right,
.carousel-control .icon-next {
	margin-right: -35px;
}

.carousel-control .glyphicon-chevron-left,
.carousel-control .icon-prev {
    left: 50%;
}
.carousel-control .glyphicon-chevron-right,
.carousel-control .icon-next {
    right: 50%;
}

/*--------------------- CAIXA DESTAQUE ----------------------*/

.caixa-destaque {
    border-radius: 3px;
    padding: 20px;
    text-align: center;
}

.caixa-destaque p, .caixa-destaque-cadeado p {
    font-weight: 600;
}

.caixa-destaque-cadeado {
    background-color: #ccc;
    padding: 15px;
    border: 1px solid #ccc;
	padding-left: 30px;
}

.azul .caixa-destaque-cadeado:before {
    content: url(../img/cadeado.png);
    position: absolute;
    left: 0px;
    top: -20px;	
}

.caixa-destaque.estrutura p {
    font-weight: inherit;
}

.caixa-destaque div > *:last-child,
.caixa-destaque div > *:last-child p { 
	margin-bottom: 0;
}

.box-icone {
    background-color: #fff;
    border-radius: 3px;
    padding: 20px;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}

.icones {
	padding: 20px 0;
}

.icones .cls-2 {
	 opacity: 1; 
}


.box-icone .icones {
    min-height: 100px;
    padding-top: 15px;
}

.caixa-contorno {
	border: 1px solid;
	border-radius: 3px;
	margin-left: 0;
	margin-right: 0;
	padding: 20px;
	background-color: #fff;
	box-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}

.caixa-contorno > p:last-child {
	margin: 0;
}

.badge-concluido {
    position: relative;
    padding-left: 70px;
}

.badge-concluido:before {
	content: "";
	background: url(../img/badge-concluido.svg);
	width: 50px;
	height: 50px;
	position: absolute;
	top: -5px;
	left: 0;
}

.badge-concluido_2 {
    position: relative;
    padding-left: 70px;
}

.badge-concluido_2:before {
	content: "";
	background: url(../img/badge-concluido_2.svg);
	width: 50px;
	height: 50px;
	position: absolute;
	top: -5px;
	left: 0;
}

@media screen and (max-width: 480px) {
	.badge-concluido {
    	padding-left: 0px;

	}
	.badge-concluido h1 {
		padding-left: 60px;
	}
	.badge-concluido:before{
		top: 2px;
	}
}

/*-------------------------- ANEXOS -----------------------*/

.anexos li {
    position: relative;
    text-indent: 0;
}

.anexos li:before {
    content: '';
    position: absolute;
    width: 25px;
    height: 30px;
    background-size: cover;  
    left: -25px;
    top: -8px;    
}

.anexos li.doc:before { background-image: url(../img/ico-doc.png); }
.anexos li.pdf:before { background-image: url(../img/ico-pdf.png); }

/*----------------------- MISC -------------------------------*/
/*
.modal-footer {
	display: none;
}*/

.panel-body {
	padding: 25px;
}


/*------------------- EXERCÍCIOS -------------------------*/

#autoavaliacao_fgv .errada span.feedback {
	background-color: #f00;
	color: #fff;
	display: inline;
	padding: 0 4px;
	font-size: .8em;
	text-transform: uppercase;
	position: absolute;
	right: 20px;
	margin: 0;
	top: 5px;
	border-radius: 2px;
}

#autoavaliacao_fgv .feedback.inline {
	    background-color: #f00;
	    color: #fff !important;
	    display: inline;
	    padding: 0 4px;
	    font-size: .8em;
	    text-transform: uppercase;
	    /* position: inherit; */
	    /* position: absolute; */
	    left: 15px;
	    margin: 0;
	    top: 30px;
	    border-radius: 2px;
	}

/*  #autoavaliacao_fgv .feedback, #autoavaliacao_fgv .feedback_indiv {
	background-color: #f00;
	color: #fff;
	display: inline;
	padding: 0 4px;
	font-size: .8em;
	text-transform: uppercase;
	position: absolute;
	left: 15px;
	margin: 0;
	top: 30px;
	border-radius: 2px;
}  */

#autoavaliacao_fgv .rel_linha.errada span.feedback {
	position: inherit;
	margin: 0 5px;
	padding: 4px;
}

#autoavaliacao_fgv #comentario p {
	text-transform: none;
}

/*-------------------- MODAL ---------------------------*/

.modal-body {
	max-height: 80vh;
	padding: 35px;
	overflow-y: auto;
}

/*----------------------- JOGO ----------------------------*/

.radio label.marcada:after {
	background: url(../img/icons-feedback.png) 0 16px;
	content: '';
	width: 16px;
	height: 16px;
	position: absolute;
	top: 0px;
	left: -20px;
}

.radio label.correta:after {
	background: url(../img/icons-feedback.png) 0 0;
	content: '';
	width: 16px;
	height: 16px;
	position: absolute;
	top: 0px;
	left: -20px;
}

pre#texto_codigo {
    display: block;
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #000;
    word-break: break-all;
    word-wrap: break-word;
    background-color: transparent;
    border: 0px;
    border-radius: 4px;
}

pre#texto_codigo .pre_rosa {
	color: #FF00B6;
}
pre#texto_codigo .pre_azul {
	color: #0061C8;
}
pre#texto_codigo .pre_roxo {
	color: #8460ae;
}
pre#texto_codigo .pre_laranja {
	color: #ff9500;
}
pre#texto_codigo .pre_verde {
	color: #0e9500;
}


.supertooltip .titulo {
    color: #fff;
    padding: 0px 14px;
} 

.supertooltip-box {
	color: #FFF;	
	font-size: 1em;
	line-height: 1.6em;
	z-index: 100;
	border: none;  	
	max-width: 300px;
}


.azul .supertooltip-box {
	background-color: #0070ba;
}

.vermelho .supertooltip-box {
	background-color: #cc0033;
}

.verde .supertooltip-box {
	background-color: #009453;
}

.amarelo .supertooltip-box {
	background-color: #ffdd00;
	color: #000;
}



.azul .supertooltip.style-esquerda:before {
    border-color: transparent #0070ba transparent transparent;
}

.vermelho .supertooltip.style-esquerda:before {
    border-color: transparent #cc0033 transparent transparent;
}

.verde .supertooltip.style-esquerda:before {
    border-color: transparent #009453 transparent transparent;
}

.amarelo .supertooltip.style-esquerda:before {
    border-color: transparent #ffdd00  transparent transparent;
}



.azul .supertooltip.style-acima:after {
    border-color: #0070ba transparent transparent transparent;
}

.vermelho .supertooltip.style-acima:after {
    border-color: #cc0033 transparent transparent transparent;
}

.verde .supertooltip.style-acima:after {
    border-color: #009453 transparent transparent transparent;
}

.amarelo .supertooltip.style-acima:after {
    border-color: #0070ba transparent transparent transparent;
}

.azul .supertooltip.style-abaixo:after {
    border-color: transparent transparent #0070ba transparent;
}

.vermelho .supertooltip.style-abaixo:after {
    border-color: transparent transparent #cc0033 transparent;
}

.verde .supertooltip.style-abaixo:after {
    border-color: transparent transparent #009453 transparent;
}

.amarelo .supertooltip.style-abaixo:after {
    border-color: transparent transparent #0070ba transparent;
}


.supertooltip.force-close:after {
    content: "x";
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    position: absolute;
    right: 20px;
    left: auto;
    top: 15px;
    cursor: pointer;
    border: none;
    display: block;
}


.amarelo .supertooltip.force-close:after {
	color: #000;		
}

.supertooltip-box {
	cursor: pointer;
}

.supertooltip .titulo:after {
    display: none;
 } 

.supertooltip .descricao p.box_titulo{
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 5px;
    border-bottom: 1px solid #fff;
    padding-bottom: 5px;
}

.amarelo .supertooltip .descricao p.box_titulo {
	border-bottom: 1px solid #000;
}

.supertooltip .descricao p:last-child {
	margin-bottom: 0;
}

.supertooltip a,
.supertooltip span.hipertexto_modal{
	opacity: 0.5;
	cursor: pointer;
	color: white;
	text-decoration: underline;
}

/*  .supertooltip .titulo:after {
    top: -16px;   
    color: #fff;
    opacity: 1
}   */

/* .supertooltip:hover .titulo:after {
    opacity: 1;
} */

/*  .supertooltip .titulo {
    padding-right: 6px;
    margin: 0;
    border-bottom: 0px;
    color: #fff;
	height: 6px;
	cursor: pointer;
	font-size: 14px;
    width: 100%;
    text-align: right;
    line-height: 1.2;
}  */


/*------------------------ IMG 100% ------------------------------*/

.esticaImg .imagem_100 {
  background-size: contain;
  background-position: top center;
  background-repeat: no-repeat;
  height: calc(100vh - 130px);
}


.esticaImg .imagem_100.animaLeft {
	animation: animaLeft .5s ease-out;
	-webkit-animation: animaLeft .5s ease-out;
	-moz-animation: animaLeft .5s ease-out;	

}


.esticaImg .imagem_100.animaRight {
	animation: animaRight .5s ease-out;
	-webkit-animation: animaRight .5s ease-out;
	-moz-animation: animaRight .5s ease-out;	

}


/*------------------------ IMG 100% ------------------------------*/


/*------------------------ MEDIAS ------------------------------*/


@media screen and (max-width: 1300px) {
	#modal-pop-tela .container {
	    width: 90%;
	}

}

@media screen and (min-width: 1200px) {
	.cards .svg-title {
	    width: 60%;
	}
}

@media screen and (max-width: 1200px) {

	.abertura-cap h1 {
		font-size: 3em;
	}
	.cards .svg-title {
	    width: 60%;
	}
	
}

@media screen and (min-width: 1024px) {
	.content {
		padding: 0;
	}
}
@media screen and (max-width: 1024px) {

	.img-abertura-capitulo > img {
		width: 55vw;
	}

	.flip-horizontal {
		margin-bottom: 30px;
	}
	/*.background-esticado {
		padding-bottom: 0;
	}*/
	.carousel-control .glyphicon-chevron-left,
	.carousel-control .glyphicon-chevron-right,
	.carousel-control .icon-prev,
	.carousel-control .icon-next {
		font-size: 50px;
	    width: 50px;
	    height: 50px;
	    top: 50%;
	}
	.carousel-control .glyphicon-chevron-left,
	.carousel-control .icon-prev {
    	margin-left: -55px;
	}
	.carousel-control .glyphicon-chevron-right,
	.carousel-control .icon-next {
    	margin-right: -50px;
    }
    .background-esticado .container {
		padding-left: 15px;
		padding-right: 15px;
	}
	.aparece-iris {
		margin-top: 10px;
    	margin-bottom: 10px;
	}

	.breadcrumb li {
	    font-size: 13px !important;
	    padding: 0 5px !important;
	}

	.container {
	    height: calc(100% - 127px);
	}

	.imagem_fundo {
		height: calc(100vh - 127px);
	}


}

@media screen and (max-width: 992px) {

	.Right > div {
	    padding-left: 30px;
	}
	.background-esticado .container {
		padding-left: 30px;
		padding-right: 30px;
	}
}

@media screen and (min-width: 992px) {
	.abertura-cap > div {
		text-align: left;
	}	

	.abertura-cap > div:last-child {
		border: 0;
	}
	
}

@media screen and (min-width: 800px) {

	.popup-colorida.lg {
		width: 90%;
		height: auto;
		margin-left: -45%;
	}

}

@media screen and (min-width: 768px) {

	.abertura-topico label,
	.encerramento-topico label {
		margin-top: 25px;
	}
	.cards .svg-title {
	    margin-bottom: 30px;	    
	}
	
}

@media screen and (max-width: 768px) {

	.carousel-control .glyphicon-chevron-left,
	.carousel-control .glyphicon-chevron-right,
	.carousel-control .icon-prev,
	.carousel-control .icon-next {
		font-size: 30px;
		width: 30px;
		height: 30px;
		top: 0;
		margin-top: 15px;
	}

	.carousel-control .glyphicon-chevron-left,
	.carousel-control .icon-prev {
    	margin-left: -20px;
	}
	.carousel-control .glyphicon-chevron-right,
	.carousel-control .icon-next {
    	margin-right: -20px;
    }

    .background-esticado .container {
		padding-left: 25px;
		padding-right: 25px;
	}
	ul li:before {
		font-size: 10px;
	}
	.popup-colorida.lg, .popup-colorida.md, .popup-colorida.sm { 
		width: 90%; 
		left: 0 !important; 
		margin-left: 40px;
		height: auto; 
	}
}

@media screen and (max-width: 780px) {

}

@media screen and (max-width: 767px) {

	.cards .svg-title {
	    width: 50%;
	}

	.box-icone {
		margin-top: 30px;
	}

	div[data-position="bottom-right"],
	div[data-position="bottom-left"],
	div[data-position="top-right"],
	div[data-position="top-left"] {
		position: inherit;
	}

	.img-abertura-capitulo > img {
	    width: 65vw;
	}

	.titulo-abertura-capitulo {
	    font-size: .7em;
	}

	.colorida .container {
		position: relative;
		width: 100%;    
		padding-bottom: 15px;
	}

	div[data-position="top-left-fixed"],
	div[data-position="top-right-fixed"] {
		position: inherit;
	}
	div[data-position="bottom-left-fixed"],
	div[data-position="bottom-right-fixed"] {
		position: inherit;
	}
	.Right > div {
		margin-top: 15px;
	    padding-left: 15px;
	}
	div.navbar-collapse {    
		width: 100%;
		height: 55px;
	    position: fixed;
	    bottom: 50px;
	    background-color: #83C1EA;
	    margin-left: -15px;
	}
    .titulo {
	    height: 50px;
	    font-size: 18px;
	    line-height: 21px;
	    display: block;
	    width: 70%;
	    padding-top: 5px;
	}
	#main .content {
	    margin-top: 50px;
	}
	.row.cards {
	    margin-top: 20px;
	}
	#main {
		padding-top: 30px;
	}

	.background-esticado-vertical .container {
		position: relative;
	}

	div[data-position="bottom-right-fixed"],
	div[data-position="bottom-right"],
	div[data-position="bottom-left-fixed"],
	div[data-position="bottom-left"] {
		margin-top: 20px;
	}
	.colorida {
	    margin-top: 20px;
	}

	
}

@media screen and (max-width: 768px) {

	.content {
		padding: 0 10px;
	}

	/*div[data-position] {
		margin-left: 10px;
		margin-right: 10px;
	}*/

	.pop-tela-content-wrap {
		padding: 50px 0 0;
	}

	.cards, .cards .foto {
	    height: 70%;
	}

	.aparece-iris {
		margin-bottom: 30px;
	}
	.background-esticado-vertical .container h1 {
		margin-top: 10px;
	}
	.colorida .container .cont h1 {
		margin-top: 30px;
	}
	footer #paginacao {
	    position: absolute;
    	right: 10px;
		margin: 0;
	}

	footer.navegacao nav.menu-nav-inferior pre { width: auto; }
	
	
}
@media (max-width: 640px) {

	.abertura-cap > div {
		display: block;
		width: 100%;
	    margin-top: 10vh;
	}

	.img-abertura-capitulo {
		width: 100%;
		left: 0;
		bottom: -30vh;
	}

	.img-abertura-capitulo > img {
	    width: 100vw;
	}

	.padrao #main .content, .tela-exemplo #main .content, .tela-exercicio #main .content {
		padding-bottom: 80px;
	}

	.background-esticado .container {
		padding-left: 15px;
		padding-right: 15px;
	}
}

@media (max-width: 600px) {
	#modal-pop-tela .container {
	    width: 100%;
	}

	.pop-tela-content-wrap #fechar {
		width: 30px;
	}
	.pop-tela-content-wrap #fechar:before {
		content: 'X';
		width: 100%;
		left: 0;
	}

	.cards .svg-title {
	    width: 60%;
	}


}

@media screen and (max-width: 480px) {

	.cards .svg-title {
	    width: 80%;
	}
	.abertura .container .card-base h1 {
		font-size: 3em;
	}

	.img-abertura-capitulo {
		width: 100%;
		left: 0;
		bottom: -10vh;
	}

	body {
		font-size: 1.5em;
	}
	.abertura-cap h1 {
    	font-size: 2em;
	}

	.abertura .container .card-base h1 {
		font-size: 1.5em !important;
	}

	.padrao .container .abertura-cap h1 {
		font-size: 1.5em !important;
	}
	.popup-colorida.lg, .popup-colorida.md, .popup-colorida.sm { 
		width: 90%; 
		margin-left: 20px;
	}


}
@media screen and (max-width: 425px) {

	footer svg { width: 45px; height: 55px; padding: 0; }

	div.navbar-collapse {
		padding-left: inherit;
	}

	nav.menu-nav-inferior .navbar-nav li {
		padding: 0;
		width: 60px;
	}

	footer .previous svg,
	footer .next svg {
	    width: 45px;
	}

	.menu .nav > li > a {
		padding: 0;
	}

	.abertura .container .card-base h1 {
	    font-size: 2em;
	}

}

@media screen and (max-width: 414px) {

	html, body {
	   height: 100%;
	}

	.container {
		height: calc(100% - 180px);
	}

	.amostra-de-cor {
	    width: 100%;
	}

	.expande-vertical {
		width: 100%;
	}
	.padrao .container h1,
	.tela-exemplo .container h1,
	.tela-exercicio .container h1 {
		margin-top: 0px;
	}
	.colorida .container .cont h1 {
		margin-top: 0;
	}
	.popup-colorida {
	    width: auto;
	    height: auto;
	    left: inherit; 
	    margin-left: 0; 
	    max-width: 95%;
        margin-bottom: 65px;
	}

}

@media screen and (max-width: 360px) {

	.abertura-cap > div:first-child img {
		max-width: 100%;
	}
	.abertura-cap h1 {
    	font-size: 2em;
	}

	.abertura .container .card-base h1 {
		font-size: 1.5em;
	}

	.padrao .container .abertura-cap h1 {
		font-size: 1.5em;
	}
	
}

@media screen and (max-height: 320px) {

	.header .topo-logo {
		background-image: url("../img/logo_fundacao_bradesco_pq.svg");
		top: -31px !important;
	}

}

/*----------------- iPAD ----------------------------*/

/*PORTRAIT*/

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {

  	.img-abertura-capitulo {
  		width: 70%;
  	}

  	.caixa-destaque ul li,
  	ul li {
	    text-indent: -23px;
	}

	.azul a.visited:before {
		left: -24px;
	}

	.padrao #main .content, .tela-exemplo #main .content, .tela-exercicio #main .content {
		/* padding-bottom: 0; */ /* RETIRADO PARA RESOLVER CONFLITO ( não temos certeza do motivo ) */
	}
}

/*LANDSCAPE*/

@media(min-width: 767px) {
	.breadcrumb {
		padding: 0px 150px 0 15px !important
	}
}

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

  	.caixa-destaque ul li,
  	ul li {
	    text-indent: -25px;
	}

}
#questionario .rc-direita.errada:after {
    background: url(../img/icons-feedback.png) 0 16px;
    width: 16px;
    height: 16px;
    content: ' ';
    position: absolute;
    left: -7px;/*20px;*/
    top: -8px;/*0;*/
}
#questionario .rc-direita.certa:after {
    background: url(../img/icons-feedback.png) 0 0;
    width: 16px;
    height: 16px;
    content: ' ';
    position: absolute;
     left: -7px;/*20px;*/
    top: -8px;/*0;*/
}

.link-video {
	display: block;
	position: relative;
	float: left;

}
.link-video:hover:before {
	opacity: 1;
}
.link-video:before {
	-webkit-transition: opacity 500ms ease-out 0s;
    -moz-transition: opacity 500ms ease-out 0s;
    -o-transition: opacity 500ms ease-out 0s;
    transition: opacity 500ms ease-out 0s;

 	-webkit-filter: drop-shadow( 0px 1px 3px #000 );
	filter: drop-shadow( 0px 1px 3px #000 ); /* Same syntax as box-shadow, except 
                                                       for the spread property */

	opacity: .5;
	content: ' ';
	width: 120px;
	height: 120px;
	background: url(../img/ico-play-videos.svg) center center no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -60px;
	margin-top: -60px;
};
