* { margin: 0; padding: 0; }
*,
*:after,
*:before {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
          box-sizing:border-box;
    -webkit-font-smoothing:antialiased;
          font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
img { display: block; max-width: 100%; }
body { background-color: #09212E; }

.gf-bold {
  font-family: 'GloboFutura-Bold';
}

.gt-regular {
  font-family: 'GlobotipoTexto-Regular';
}

.gt-bold {
  font-family: 'GlobotipoTexto-Bold';
}

.gt-black {
  font-family: 'globotipo_textoblack';
}

.mrg-b-1 {
	margin-bottom: 1rem;
}

.ff-regular { font-family: 'GlobotipoTexto-Regular'; }
.ff-bold { font-family: 'GlobotipoTexto-Bold'; }
.ff-heavy { font-family: 'GloboFutura-Bold'; }

.fs-small { font-size: 18px; }
.fs-medium { font-size: 23px; }
.fs-big { font-size: 40px; }
.fs-biggie { font-size: 32px;  }
.fs-bigger { font-size: 48px; }

@media (max-width: 1366px) {
	.fs-small { font-size: 15px; }
	.fs-medium { font-size: 20px; }
	.fs-big { font-size: 37px; }
	.fs-biggie { font-size: 29px;  }
	.fs-bigger { font-size: 45px; }
}
@media (max-width: 700px) {
	.fs-small { font-size: 16px; line-height: 14px; }
	.fs-medium { font-size: 17px; line-height: 18px; }
	.fs-big { font-size: 26px; line-height: 32px; }
	.fs-biggie { font-size: 22px; line-height: 24px; }
	.fs-bigger { font-size: 28px; line-height: 40px; }
}

.color-white { color: #fff; }
.color-red { color: #FF1E1E; }
.color-red2 { color: #FB0239; }
.color-yellow { color: #FFFB4B;  }
.color-blue { color: #0E3F59;  }
.color-light-grey { color: #F4F4F4; }
.color-grey { color: #B7B7B7; }
.color-dark { color: #1F1F1F; }
.color-dark2 { color: #101010; }

.txt-center { text-align: center; }
.txt-left { text-align: left; }
.txt-upper { text-transform: uppercase; }
.txt-ita { font-style: italic; }

.ratiohd {
    position: relative;
    padding-bottom: 56.25%;
    float: left;
    width: 100%;
    height: 0;
    z-index: 9;
}

.ratio_el {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.hero {
	text-align: center;
	padding-top: 32px;
	/*padding-bottom: 136px;*/
	position: relative;
	background: url('../images/bg-top-m.png') no-repeat;
	/*background-position: 72% top;*/
	background-size: 100% auto;
}

@media ( min-width: 600px ) {
	.hero {
		/*background-size: 405% auto;*/
	}
}
@media ( min-width: 712px ) {
	.hero {
		/*background-size: 359% auto;*/
	}
}
@media ( min-width: 800px ) {
	.hero {
		background: url('../images/bg-top.png') no-repeat;
		background-position: center top;
		background-size: 1380px auto;
	}
}
@media (min-width: 1900px) {
	.hero {
		background-size: auto 750px;
	}
}

.container { max-width: 802px; padding: 0 29px; margin: 0 auto; }
.container2 { max-width: 1065px; padding: 0 29px; margin: 0 auto; }


@media ( min-width: max-width: 799px ) {
	.logo { margin: 0 auto; width: 200px; }
}
@media (max-width: 1200px) {
	.logo { max-width: 60%; }
}

.owl-carousel { margin-top: 27px; }
.owl-theme .owl-dots .owl-dot span { background-color: #5F5F5F; }
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span { background-color: #FF1E1E; }

.owl-theme .owl-dots .owl-dot span {
	width: 1rem;
	height: 1rem;
}

.logo-s {
	margin: 4rem 0 6rem;
}

@media (max-width: 799px) {
	.logo-s {
		margin-top: 45%;
	}
}

@media (min-width: 1500px) {
	.logo-s {
		margin-bottom: 9rem;
	}
}

@media (min-width: 1900px) {
	.logo-s {
		margin-bottom: 15rem;
	}
}

.container-box {
	position: relative;
	background-color: #fff;
	padding: 22px;
}
@media ( min-width: 612px ) {
	.container-box { padding: 43px; }
}
.etapa1 .container-box {
	padding-bottom: 0;
}

.detail-box {
	position: absolute;
	left: 50%;
	bottom: 100%;
	transform: translate3d(-50%, 0, 0);
}

.tt-etapa1 {
	font-size: 23px;
	text-transform: uppercase;
	line-height: 1.2;
}
@media ( min-width: 606px ) {
	.tt-etapa1 { font-size: 33px; }
}
.tt-etapa1:after {
	display: block;
	width: 94px;
	height: 3px;
	margin: 27px auto 21px;
	content: '';

	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fa0234+0,ff5e03+50,ff8f01+100 */
	background: rgb(250,2,52); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(250,2,52,1) 0%, rgba(255,94,3,1) 50%, rgba(255,143,1,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(250,2,52,1) 0%,rgba(255,94,3,1) 50%,rgba(255,143,1,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(250,2,52,1) 0%,rgba(255,94,3,1) 50%,rgba(255,143,1,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa0234', endColorstr='#ff8f01',GradientType=1 ); /* IE6-9 */
}

@media ( max-width: 535px ) {
	.tt-etapa1 .break { display: none; }
}


.btn {
	max-width: 299px;
	width: 100%;
	background-color: #FB0234;
	border: none;
	color: #fff;
	padding: 17px 10px;
	margin-bottom: -2rem;
	cursor: pointer;
}
.intro-header {

}
.intro-p {
	position: relative;
	z-index: 2;
	margin-bottom: 1rem;
	overflow: hidden;
}
.intro-span {
	width: 46px;
	display: inline-block;
	margin: 0 auto;
	padding: 3px 0;
	background-color: #101010;

}
.span-span {
	padding: 8px;
	background-color: #fff;
	float: left;
}
.intro-p:before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	height: 1px;
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	z-index: -1;
	transform: translateY(-50%);
	background-color: #C4C4C4;
}

@media (max-width: 800px) {
	.span-span {
		padding: 0;
	}
	.intro-span {
		margin-top: 1rem;
		max-width: 70%;
	}
}

.intro-txt1 {
	font-size: 20px;
	text-transform: uppercase;
	margin-bottom: 43px;
}
@media (min-width: 612px) {
	.intro-txt1 { font-size: 30px; }
}

.bullets {
	margin: 0 auto 1rem;
	max-width: 345px;
	overflow: hidden;
	position: relative;
}

.bullets li {
	float: left;
	text-align: center;
	position: relative;
	font-size: 0;
}

.bullets div {
	display: inline-block;
	border: 3px solid #DDD6C9;
	border-radius: 50%;
	width: 14px;
	height: 14px;
	background-color: #fff;
	position: relative;
	z-index: 9;
}

.bullets li.progressed div, .bullets li.progressed:after {
	border-color: #FB0234;
	background-color: #FB0234;
}

.bullets li:after {
	content: '';
	display: block;
	width: 100%;
	height: 3px;
	background-color: #DDD6C9;
	position: absolute;
	right: -50%;
	top: 50%;
	transform: translateY(-50%);
}
.bullets li.last:after {
	display: none;
}

.enunciado { text-align: left; text-transform: uppercase; }

.respostas li {
	list-style: none;
	border: 1px solid #C4C4C4;
	padding: 10px;
	position: relative;
	/*text-indent: 1rem;*/
	cursor: pointer;
}

.oneliner p {
	/*line-height: 29px;*/
}

.respostas li figcaption {
	padding-left: 3rem;
}

.respostas .check {
    width: 27px;
    height: 27px;
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: url(../images/icon-check.png) no-repeat center center;
    /*margin: 7px 1rem 1rem;*/
}

.respostas .selected .check {
    background: url(../images/icon-checked.png) no-repeat center center;
}

.etapa1, .etapa2, .etapa3 {
	margin-bottom: 200px;
}

.etapa3 .btn-holder {
	font-size: 0;
    background-color: #FB0239;
    color: #fff;
    padding: 1rem;
    max-width: 256px;
    margin: 0 auto;
}
.etapa3 .btn-holder li {
    display: inline-block;
    vertical-align: middle;
    margin-left: 11px;
}
.etapa3 .btn-holder li:first-child { margin-left: 0; }

.etapa3 .span-span {
	display: inline-block;
	float: none;
}
.etapa3 .intro-span { width: auto; background: transparent; }

.social {
    width: 30px;
    height: 30px;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}
.fb {
    background: url(../images/icon-fb.png) no-repeat;
}
.twt {
    background: url(../images/icon-twt.png) no-repeat;
}
.btnreload {
	margin-bottom: 3rem;
	background-color: transparent;
	border: none;
	background: url('../images/reload.png') no-repeat left center;
	text-indent: 2rem;
	min-height: 20px;
	cursor: pointer;
	border-top: 2px solid #101010;
	padding: 7px 0;
}

.avatar img {
	display: block;
	margin: 0 auto;
}

.arrow-l {
    background: url(../images/arrow.png) no-repeat;
}
.pergunta-footer button {
	background: #FB0234;
	border: none;
	margin-top: 1rem;
	padding: 6px 26px;
	cursor: pointer;
}

.arrow {
    width: 19px;
    height: 13px;
    display: inline-block;
    vertical-align: middle;
}

.trilho .arrow-d {
	display: block;
	margin: 2rem auto;
}

.list-posters {
	position: relative;
	overflow: hidden;
}
.list-posters:before, .list-posters:after {
	display: block;
	width: 20px;
	height: 100%;
	position: absolute;
	top: 0;
	content: '';
}

@media ( min-width: 540px ) {
	.list-posters { padding: 0 37px; }
	.list-posters:before {
		left: 0;
		background: url('../images/bar-side-l-orange.jpg') repeat-y left top;
	}
	.list-posters:after {
		right: 0;
		background: url('../images/bar-side-r-orange.jpg') repeat-y left top;
	}
}
.list-posters li {
	width: 50%;
	list-style: none;
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 28px;
	float: left;
}
.list-posters li:nth-child(5), 
.list-posters li:nth-child(6) { margin-bottom: 0; }
@media ( min-width: 580px ) {
	.list-posters li { width: 33.33%; }

	.list-posters li:nth-child(4), 
	.list-posters li:nth-child(5),
	.list-posters li:nth-child(6) { margin-bottom: 0; }
}

.owl-carousel {
	list-style: none;
}
.owl-carousel a {
	cursor: pointer;
}

.copyright {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	font-size: 10px;
	color: #B7B7B7;
	padding: 15px 50px;
	background-color: #151515;
}

.copyright .links a {
    display: inline-block;
    padding: 0 10px;
}

.mrg-b-0 { margin-bottom: 0 !important; }