html{
  font-size: 16px;
}

body{
	letter-spacing: -.02em;
	font-size: 100%;
  
  -webkit-transform: none !important;
  -ms-transform: none !important;
  -o-transform: none !important;
  transform: none !important;
}

@media (max-width:1400px){
  body{
    font-size: 80%;
  }
}


@media (max-width:1020px){
  body{
    font-size: 75%;
  }
}

.header{
  display: block;
	position: fixed;
	top:0;
  right:0;
	left: 0;
	height: 100px;
  -webkit-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
	z-index: 10;
}


.header-fix .header{
  position: fixed;
  top: 0;
	background: rgba(255,255,255,1);
	box-shadow: 0 2px 6px rgba(0,0,0,.1),0 3px 24px rgba(0,0,0,.1);
}

/* Safari 7.1+ */
_::-webkit-full-page-media, _:future, :root .header-fix .header {
  background: rgba(255,255,255,.7);
  -webkit-backdrop-filter: blur(20px);
  -moz-webkit-backdrop-filter: blur(20px);
  -ms-webkit-backdrop-filter: blur(20px);
  -o-webkit-backdrop-filter: blur(20px);
}
  


.header .container-fluid{
	height: 100%;
	max-width: 1200px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.header .logo-content{
	position: relative;
}

.header .logo{
  position: relative;
	display: block;
	background: url("../img/logo@2x.svg") no-repeat center / contain;
	width: 142px;
	height: 81px;
	margin-top: 40px;
  margin-left: 24px;
  -webkit-transition: height 0.3s;
  -o-transition: height 0.3s;
  transition: height 0.3s;
}

.header-fix .header .logo{
	background: url("../img/logo_black@2x.svg") no-repeat center / contain;
  width: 138px;
	height: 60px;
  margin-top: 6px;
  margin-left: 16px;
  -webkit-transition: height 0.3s;
  -o-transition: height 0.3s;
  transition: height 0.3s;
}

.header .menu nav a:not(.btn){
	font-size: var(--p13);
  font-family: var(--font-secondary);
  text-transform: uppercase;
	color: white;
  line-height: var(--p30);
	font-weight: 800;
	display: inline-block;
	margin-left: 2rem;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
	border-bottom:2px solid transparent;
}

@media (max-width:1200px){
  .header .menu nav a:not(.btn){
    margin-left: .8rem;
  }
}


.header .menu nav a:not(.btn):hover{
	border-bottom:2px solid white;
}

.header-fix header .menu nav a:not(.btn):hover{
	border-bottom:2px solid var(--gray-light);
}

.header .menu nav a.btn{
	font-size: 0.813em;
	font-weight: 600;
	margin-left: 2rem
}

.header-fix .header .menu a:not(.btn){
	color: #7C8A91
}


/*menu mobile*/

.menu-mobile{
	position: fixed;
  text-transform: uppercase;
	left: 0;
	top:0;
	width: 100%;
	max-width: 250px;
	height: 100vh;
	background: white;
	box-shadow: none;
	padding-top: 3rem;
	-webkit-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
	z-index: 90;
  display: none;
}

.btn-menu{
	position: fixed;
	left: 2rem;
	top: 14px;
	font-size: 24px;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
	-webkit-transform: rotate(0);
	-ms-transform: rotate(0);
	-o-transform: rotate(0);
	transform: rotate(0);
	z-index: 99;
	cursor: pointer
}

.btn-menu:before{
	content: '\f35c';
	font-family: var(--mdi);
	color: white;
	-webkit-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
}


#btn-menu:checked + .btn-menu{
	color: var(--gray);
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

#btn-menu:checked + .btn-menu:before{
	content: '\f5ad';
	font-family: var(--mdi);
	color: var(--gray);
}

#btn-menu:checked ~ .menu-mobile{
	box-shadow: 0 0 24px rgba(0,0,0,.2);
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
}

.overlay{
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0,0,0,.6);
	position: fixed;
	left: 0;
	top:0;
	z-index: 89;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}

/* Safari 7.1+ */
_::-webkit-full-page-media, _:future, :root .overlay {
  background-color: rgba(0,0,0,.3);
  -webkit-backdrop-filter: blur(15px);
  -moz-webkit-backdrop-filter: blur(15px);
  -ms-webkit-backdrop-filter: blur(15px);
  -o-webkit-backdrop-filter: blur(15px);
}


#btn-menu:checked ~ .overlay{
	visibility: visible;
	opacity: 1;
}

.menu-mobile nav{
	padding: 1rem 0;
}

.menu-mobile nav a{
	display: block;
  color: var(--gray);
	padding: 1.2rem 2rem;
	font-size: .8rem;
	border-top:1px solid var(--gray-light);
	font-weight: 500;
}

.menu-mobile nav a:last-child{
	border-bottom:1px solid var(--gray-light);
}


.header-fix .btn-menu:before{
	color: var(--gray-dark);
}



@media (max-width:768px){
	.header{
    height: 64px;
	}
  
  .header .menu{
    display: none
  }
  
  .header .logo-content{
    width: 100%;
  }
  
  .header .logo{
    margin-left: 48px;
    margin-top: 72px;
  }
   
  .header-fix .header .logo{
    height: 48px;
    margin: 6px auto;
    display: block
  }
  
  .menu-mobile{
    display: block
  }
  
  .btn-menu{
		visibility: visible;
		opacity: 1;
	}
}



.bg-purple{
  background-image: 
    -webkit-linear-gradient(311deg, #606AD5 0%, #8631E8 34%, #C47BD5 74%, #D3C2E8 100%), 
    -webkit-linear-gradient(29deg, #1C364D 0%, rgba(255,255,255,0.00) 36%, rgba(255,255,255,0.00) 36%);
  background-image: 
    -o-linear-gradient(311deg, #606AD5 0%, #8631E8 34%, #C47BD5 74%, #D3C2E8 100%), 
    -o-linear-gradient(29deg, #1C364D 0%, rgba(255,255,255,0.00) 36%, rgba(255,255,255,0.00) 36%);
  background-image: 
    linear-gradient(41deg, #606AD5 0%, #8631E8 34%, #C47BD5 74%, #D3C2E8 100%), 
    linear-gradient(119deg, #1C364D 0%, rgba(255,255,255,0.00) 36%, rgba(255,255,255,0.00) 36%);
    box-shadow: inset -1px -144px 292px 0 rgba(0,0,0,0.19);
}

.bg-primary{
  background-image: url("../img/bg_primary.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.bg-prof{
  background-image: url("../img/bg_prof.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.bg-yellow{
  background-image: url("../img/bg_yellow.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}


/*HERO **************************************************************************/


.hero * {
	box-sizing: border-box;
	-webkit-backface-visibility: hidden;
	-webkit-transform-style: preserve-3d;
}


@keyframes scroll {
	0% {
		transform: translateY(0);
	}
	25% {
		transform: translateY(70px);
	}
}

.scrolling svg{
  opacity: .7
}

.scrolling svg #wheel {
	animation: scroll ease 2s infinite;
}

.scrolling{
  position: absolute;
  bottom: 3%;
  left: 50%;
  z-index: 4;
  text-align: center;
  color: white;
  font-size: .8em;
  font-size: 13px;
  -webkit-transform: translatex(-50%);
  -ms-transform: translatex(-50%);
  -o-transform: translatex(-50%);
  transform: translatex(-50%);
}

.hero .slick-prev, 
.hero .slick-next{
  display: none !important
}


.hero .wrapper{
  width: 100%;
  height: 100%;
  overflow: hidden
}

.hero .slick-list,
.hero .slick-track{
  height: 100%;
  padding: 0 !important;
}

.hero .slick-dots{
  right: 2em;
  bottom: 32px;
  left: unset;
  -webkit-transform: none;
  -ms-transform: none;
  -o-transform:none ;
  transform:none ;
}

.hero .slick-dots li button:before{
  font-size: 80px;
}

.hero .slick-dots li{
  width: 30px;
}

.hero .slick-dots li.slick-active button:before{
  color: #1AF4F6;
}

.hero .slick-dots li button:hover:before{
  color: #1AF4F6;
  opacity: .5
}

.hero{
  height: 100vh;
  max-height: 1100px;
  min-height:570px;
  background: #222;
/*
  background-image: -webkit-linear-gradient(bottom left, #0D1337 0%, #2B2B63 10%, #30D2D6 100%);
  background-image: -o-linear-gradient(bottom left, #0D1337 0%, #2B2B63 10%, #30D2D6 100%);
  background-image: linear-gradient(to top right, #0D1337 0%, #2B2B63 10%, #30D2D6 100%);
*/
  position: relative;
}

.hero .text-block{
	width: 80%;
  max-width: 50%;
	position: absolute;
	bottom: 18%;
  right: 2em;
	color: white;
  text-align: right;
  z-index: 4;
  text-shadow: 0 0 42px rgba(0,0,0,0.5);
}

.hero .text-block.top{
  top: 20%;
  bottom: unset;
}

.hero .text-block h1{
  text-shadow: 0 0 24px rgba(0,0,0,.45);
}

.hero .text-block h1 span{
  display: block;
  font-size: .45em;
  font-weight: 300;
  line-height: 1.3em
}

.hero .legend{
  position: absolute;
  bottom: 15%;
  left: 5%;
  color: white;
  z-index: 4;
  white-space: nowrap;
  opacity: 0;
  -webkit-transform: translateX(-200px);
  -ms-transform: translateX(-200px);
  -o-transform: translateX(-200px);
  transform: translateX(-200px);
}

.hero .slick-current .legend{
  animation: enter 1s ease forwards 3s;
}

.hero .legend h4{
  font-size: var(--p28);
  font-weight: 500;
}

.hero .legend h4 span{
  display: block;
  font-size: .8em;
  font-weight: 300
}

.hero .hero-bg{
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 60% center;
}


.hero3.hero-bg{
  background-position: 80% center;
}


.hero .hero1{ background-image: url("../img/hero_jadel_bg.jpg")}

.hero .hero2{ background-image: url("../img/hero_amauri_bg.jpg")}

.hero .hero3{ background-image: url("../img/hero_futebol_bg.jpg")}

.hero .hero4{ background-image: url("../img/hero_basquete_bg.jpg")}


.hero .hero_A1{ background-image: url("../img/hero_empty_bg.jpg")}

.hero .hero_P1{ background-image: url("../img/hero_Esp.jpg")}

.hero .hero_CP1{ background-image: url("../img/hero_CP.jpg")}


.hero .plano1{
  height: 80%;
  max-width: 70%;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  overflow: hidden;
  opacity: 0;
  -webkit-transition: 1s;
  -o-transition: 1s;
  transition: 1s;
}

.hero .plano1 img,
.hero .plano1 picture{
  height: 100%;
  float: right;
}


.hero .flare{
  position: absolute;
/*  mix-blend-mode: screen;*/
  z-index: 1;
  opacity: 0;
}

.hero .slick-current .flare{
  animation: fadein 2s linear forwards 3s;
}

@keyframes fadein{
  0%{
    opacity: 0
  }
  100%{
    opacity: 1
  }
}

.hero1 .flare{
  bottom: 0;
  left: 13%;
  z-index: 1;
  height: 80%;
}

.hero2 .flare{
  bottom: 14%;
  left: 17%;
  height: 80%;
}

.hero3 .flare{
  bottom: 12%;
  left: 19%;
  height: 80%;
}
.hero4 .flare{
  bottom: 6%;
  left: 13%;
  height: 80%;
}


.hero .slick-current .plano1{
  animation: enter 2s ease-out forwards 1.5s;
  -webkit-transform: translate(-200px,50px) scale(1.1);
  -ms-transform: translate(-200px,50px) scale(1.1);
  -o-transform: translate(-200px,50px) scale(1.1);
  transform: translate(-200px,50px) scale(1.1);
  opacity: 0;
}


@keyframes enter{
  0%{
  -webkit-transform: translate(-200px,50px) scale(1.1);
  -ms-transform: translate(-200px,50px) scale(1.1);
  -o-transform: translate(-200px,50px) scale(1.1);
  transform: translate(-200px,50px) scale(1.1);
    opacity: 0;
  }
  50%{
    opacity: 1;
  }
  100%{
    -webkit-transform: translate(0,0) scale(1);
    -ms-transform: translate(0,0) scale(1);
    -o-transform: translate(0,0) scale(1);
    transform: translate(0,0) scale(1);
    opacity: 1;
  }
}


@media (max-width:767px){
  .hero h1{
    font-size: var(--p56)
  }
  
  .hero .plano1{
    height: 70%;
  }
}

@media (max-width:660px){
  
  .hero h1{
    font-size: var(--p40)
  }
  
  .hero .flare{
    right: 0;
    left: unset
  }
    
  .hero .text-block{
     max-width: 90%;
  }
}




@media (max-width:414px){
  
  .hero h1{
    font-size: var(--p36)
  }

  .hero .slick-dots,
  .hero .legend,
  .scrolling,
  .hero .flare{
    display: none !important
  }
  
  .hero .text-block:not(.top){
    bottom: 10%;
      top:unset
  }
  
  .hero{
    height: calc(100vh - 80px);
  }
  

}


/*Modal video*/

.modal-dialog {
      max-width: 800px;
      margin: 30px auto;
  }



.modal-body {
  position:relative;
  padding:0px;
}

.modal-dialog .close {
  position:absolute;
  right:-30px;
  top:0;
  z-index:999;
  font-size:2rem;
  font-weight: normal;
  color:#fff;
  opacity:1;
}





/*Block Titles **********************/

section.section-block{
	margin-top: 8vw
}

.section-title{
  text-align: center;
  margin: 0 auto var(--p64);
  padding: 0 var(--p28);
}

section > .section-title{
  max-width: 860px;
}

.section-title.left{
  text-align: left;
  justify-content: flex-start;
}

.section-title.right{
  text-align: right;
  justify-content: flex-end;
}

.section-title h5{
  color: var(--prominent);
  font-family: var(--font-secondary);
  margin-bottom: 1rem
}

.section-title p{
  font-size: var(--p20);
  color: rgba(0,0,0,.5);
  font-weight: 300;
}

.section-title .text-block {
    max-width: 860px;
    align-self:center
}



/*Wrapper Blocks **********************/


.wrapper-blocks{
  display: flex;
  padding: 0 var(--p64);
  flex-wrap: nowrap;
}

.wrapper-blocks .block{
  flex-basis: 33%;
  padding: var(--p48);
  margin-right: 16px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 12px;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 60vh;
  min-height: 600px;
}

.wrapper-blocks .block p{
  font-size: var(--p24);
  font-weight: 300;
  line-height: 1.3em
}

/*HOME*/
.wrapper-blocks .block:nth-child(1){background-image: url("../img/block1-bg@2x.jpg")}
.wrapper-blocks .block:nth-child(2){background-image: url("../img/block2-bg@2x.jpg");justify-content: flex-end}
.wrapper-blocks .block:nth-child(3){background-image: url("../img/block3-bg@2x.jpg");margin: 0}


/*JOVEM ATLETA*/
.wrapper-blocks.ja .block:nth-child(1){background-image: url("../img/block1_ja@2x.jpg")}
.wrapper-blocks.ja .block:nth-child(2){background-image: url("../img/block2_ja@2x.jpg")}
.wrapper-blocks.ja .block:nth-child(3){background-image: url("../img/block3_ja@2x.jpg")}

/*PROFISSIONAL*/
.wrapper-blocks.prof .block:nth-child(1){background-image: url("../img/block1_pro@2x.jpg")}
.wrapper-blocks.prof .block:nth-child(2){background-image: url("../img/block2_pro@2x.jpg")}
.wrapper-blocks.prof .block:nth-child(3){background-image: url("../img/block3_pro@2x.jpg")}

/*CADEIA PRODUTIVA*/
.wrapper-blocks.cp .block:nth-child(1){background-image: url("../img/block1_cp@2x.jpg")}
.wrapper-blocks.cp .block:nth-child(2){background-image: url("../img/block2_cp@2x.jpg")}
.wrapper-blocks.cp .block:nth-child(3){background-image: url("../img/block3_cp@2x.jpg")}




@media (max-width:1440px){
  
  .wrapper-blocks .block h3{
    font-size: var(--p32);
  }
}

@media (max-width:860px){
  
  .wrapper-blocks{
    flex-wrap: wrap;
    padding: var(--p48) var(--p20);
  }
  .wrapper-blocks .block{      
      flex-basis: 100%;
      padding-bottom: 10vw;
      max-height: 340px;
      min-height: unset;
      margin: 0 0 16px 0;
      justify-content: flex-start !important;
  }

}



.split-half{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column: auto auto;
}

.img-block{
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  color: white;
}



/*Passos **********************/

.passos{
  min-height: 700px;
  background-image: url("../img/bg_primary.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: 12px 32px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center
}

.passos.prof{
  background-image: url("../img/bg_prof.png");
}


.img-block.leg:before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: -webkit-linear-gradient(rgba(31,8,43,0.0) 55%, rgba(31,8,43,0.80) 100%);
  background-image: -o-linear-gradient(rgba(31,8,43,0.0) 55%, rgba(31,8,43,0.80) 100%);
  background-image: linear-gradient(rgba(31,8,43,0.0) 55%, rgba(31,8,43,0.80) 100%);
}

.img-block .legend{
  position: absolute;
  bottom: var(--p18);
  left: var(--p48);
}

.passos + .img-block{
  min-height: 60vh
}

.passos .passo{
  color: white;
  text-align: center;
  flex-basis: calc(33% - var(--p32));
  margin: 0 var(--p32) var(--p32) 0;
  min-width: 200px;
  padding: 32px 0;
}

.passos.prof .passo{
  color: #000000
}

.passos .passo h4{
  font-size: var(--p22)
}

.passos .passo h5{
  color: var(--green-light)
}

.passos.prof .passo h5{
  color: #EB5065
}

.passos .passo .icon{
  width: 124px;
  height: 124px;
  background-repeat: no-repeat;
  background-size: 48px auto;
  background-position: center;
  border-radius: 50%;
  border: 1px solid white;
  background-color: rgba(0,0,0,.1);
  margin: var(--p12) auto var(--p32);
}

.passos.prof .passo .icon{
  background-color: rgba(0,0,0,.2);
  border: 0;
}

.icon.p1{background-image: url("../img/icons/install.svg")}
.icon.p2{background-image: url("../img/icons/linear-cadastro.svg")}
.icon.p3{background-image: url("../img/icons/auto-preenchimento.svg")}
.icon.p4{background-image: url("../img/icons/linear-search.svg")}
.icon.p5{background-image: url("../img/icons/avaliacao.svg")}
.icon.p6{background-image: url("../img/icons/talento.svg")}
.icon.p7{background-image: url("../img/icons/schedule.svg")}
.icon.p8{background-image: url("../img/icons/trophy.svg")}




/*Sobre o App **********************/

.sobre-app .split-half{
  height: 90vh;
  background-image: -webkit-linear-gradient(bottom, #E4E7EC 0%, #FFFFFF 50%);
  background-image: -o-linear-gradient(bottom, #E4E7EC 0%, #FFFFFF 50%);
  background-image: linear-gradient(to top, #E4E7EC 0%, #FFFFFF 50%);
}

.sobre-app .coeficientes{
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: var(--p24);
  font-weight: 700;
  display: flex;
  flex-wrap: wrap;
  margin-top: var(--p32)
}

.sobre-app .coeficientes li{
  margin-right: var(--p14);
  margin-bottom: var(--p16);
  width: calc(50% - var(--p14))
}

.sobre-app .text-block{
  width: 90%;
  max-width: 620px;
  margin: 0 auto;
}

.sobre-app .text-block > img{
  max-width: 310px;
  width: 80% !important
}

.sobre-app .img-block{
  background-position: left top;
  background-size: auto 95%;
}


.sobre-app.ja  .img-block{
  background-size: auto 67%;
}

.sobre-app .img-block .btn-lg{
  position: absolute;
  bottom: 25%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}

@media (max-width:1200px){
  .sobre-app .split-half{
    height: auto;
  }
  .sobre-app .img-block{
    background-image: none !important
  }
}

@media (max-width:760px){
  .hero .plano1{
    max-width: 100%
  }
}


@media (max-width:560px){
  .sobre-app .coeficientes li{
    font-size: 90%
  }
}


/*conheca o App **********************/

.conheca-app{
  height: 85vh;
  background-image: -webkit-linear-gradient(bottom, #E4E7EC 0%, #FFFFFF 50%);
  background-image: -o-linear-gradient(bottom, #E4E7EC 0%, #FFFFFF 50%);
  background-image: linear-gradient(to top, #E4E7EC 0%, #FFFFFF 50%);
}

.conheca-app .app-item{
  display: flex;
  height: 80vh;
}

.conheca-app .section-title{
  display: flex;
  flex-flow: column;
  justify-content: center;
  margin-top: -10em;
  padding: 0 var(--p24)
}


.conheca-app .section-title,
.conheca-app .img-block{
  flex-basis: 50%;
  max-width: unset
}

.conheca-app .section-title p{
  max-width: 480px;
}

.conheca-app .img-block{
  background-position: left top;
  background-repeat: no-repeat;
  background-size: auto 90%;
}

.conheca-app .slick-list{
  padding: 0 !important;
}

.conheca-app .text-block{
  max-width: 640px;
  margin: 0 0 0 auto;
}

.conheca-app .slick-dots{
  bottom: 25% !important;
  left: unset !important;
  right: 50% !important;
  margin-right: 2em;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0); 
}

.conheca-app .slick-dots li.slick-active button:before{
  color: #B56DC7;
}

.conheca-app .slick-prev, .conheca-app .slick-next{
  display: none !important
}

@media (max-width:640px){
  
  .conheca-app .section-title p{
    line-height: 1.3em;
  }
}



/*mosaic **********************/

.mosaic{
  min-height: 600px;
}

.mosaic .logos{
  width: 95%;
  max-width: 500px;
}

.mosaic .img-block{
  min-height: 60vh
}

.mosaic .section-title{
  max-width: unset
}


.bullets{
  margin: 0 0 16px 0;
  padding: 0 20px;
}

.bullets li{
  padding: 16px 0;
  font-size: var(--p18);
}


@media (max-width:1200px){
  .mosaic.img-right .section-title{
  order: 2;
  }
}



/*download ***************************/


.download{
  display: grid;
  grid-template-columns: 210px auto;
  grid-column: 210px auto;
  margin-bottom: 2em;
}

.download .phone{
  width: 200px;
  height: 355px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.download .text-block{
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: left;
}

.download .text-block p{
  color: #000;
  font-weight: 400;
  line-height: 1.3em;
  font-size: 14px;
}

.download .text-block p span{
  opacity: .5
}

.download .rating{
  font-size: 14px;
}

.download .rating .rate{
  font-size: 46px;
  font-family: var(--font-secondary);
  font-weight: 700;
  color: #000;
  float: left;
  margin-right: 12px;
}

.download .rating .stars{
  font-size: 22px;
  line-height: 1em;
  margin-top: .6em;
  color: #FEEE4D;
  letter-spacing: -.15em
}



/*depoimentos  ***************************/


.depoimento{
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 610px;
  display: flex;
  justify-content: flex-start;
  position: relative
}

.depoimento:before{
  content: '';
  position: absolute;
  display: block;
  width: 50%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: #000;
  mix-blend-mode:saturation;
}

.depoimento .text-block{
  color: white;
  width: 50%;
  height: 100%;
  display: flex;
  flex-flow: column;
  justify-content: flex-end;
  text-align: right;
  margin: 0;
  padding: var(--p32);
  position: relative;
  background-color: rgba(0,0,0,.65);
}

.depoimento .text-block h6{
  font-size: var(--p22)
}

.depoimento .btn-play{
  width: 106px;
  height: 106px;
  background-image: url("../img/btn-play.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  right: 25%;
  top: 50%;
  
  -webkit-transform: translate(50%, -50%);
  -ms-transform: translate(50%, -50%);
  -o-transform: translate(50%, -50%);
  transform: translate(50%, -50%); 
}

  .depoimento .btn-play:hover{
    -webkit-transform: translate(50%, -50%) scale(1.1);
    -ms-transform: translate(50%, -50%) scale(1.1);
    -o-transform: translate(50%, -50%) scale(1.1);
    transform: translate(50%, -50%) scale(1.1);
  }


/*Depoimentos*********************/

.depoimentos{
  min-height: 670px;
  background-image: -webkit-linear-gradient(left right, #2A1A57 0%, #30D2D6 100%);
  background-image: -o-linear-gradient(left right, #2A1A57 0%, #30D2D6 100%);
  background-image: linear-gradient(to left, #2A1A57 0%, #30D2D6 100%);
  padding: var(--p38);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  }

.depoimentos .item{
  color: white;
  text-align: center;
  display: inline-block;
  min-width: 230px;
  max-width: 280px;
  margin: var(--p24)
}

.depoimentos .item .avatar{
  width: 140px;
  height: 140px;
  border-radius: 50%;
  border: 2px solid white;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin: 0 auto 1em auto;
}

.depoimentos .item h4{
  font-size: var(--p20);
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1em;
  margin: 0;
}

.depoimentos .item span{
  color: var(--green-light);
  font-style: italic;
  font-size: .9em;
}


/*vídeo*********************/

.video{
  position: relative;
  height: 460px;
  background-blend-mode:luminosity;
  background-color: #000;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center
}

.video:before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(37,42,77,.9);
}

.video .text-block{
  position: relative;
  color: white;
  text-align: center
}

.video .avatar{
  width: 86px;
  height: 86px;
  border-radius: 50%;
  border: 1px solid white;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin: 0 auto 1em auto;
  -webkit-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%); 
}

.btn-play-text{
  border-radius: 50px;
  border: 2px solid rgba(255,255,255,.2);
  line-height: 2em;
  padding: var(--p20) var(--p44);
  color: white;
  font-weight: 500;
}

.btn-play-text:hover{
  color: white;
  background-color: rgba(0,0,0,.3);
}

.btn-play-text:before{
  font-size: var(--p36);
  vertical-align: middle;
  margin-right: 16px;
  margin-left: -12px;
}


@media (max-width:515px){
  
  .download{
    display: inline-block;
  }
  
  
  .download .phone{
    display: none
  }
  
  
  .depoimento {
    background-size: cover;
    background-position: right 10% center;
  }
  
  .depoimento:before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    background-image: -webkit-linear-gradient(bottom, #000000 0%, rgba(0,0,0,0.21) 64%, rgba(0,0,0,0.06) 83%, rgba(0,0,0,0.00) 100%);
    background-image: -o-linear-gradient(bottom, #000000 0%, rgba(0,0,0,0.21) 64%, rgba(0,0,0,0.06) 83%, rgba(0,0,0,0.00) 100%);
    background-image: linear-gradient(to top, #000000 0%, rgba(0,0,0,0.21) 64%, rgba(0,0,0,0.06) 83%, rgba(0,0,0,0.00) 100%);
    mix-blend-mode: normal;
    background-color: transparent
  }
  
  .depoimento .text-block{
    width: 100%;
    background-color: transparent
  }
  
  .depoimento .btn-play{
    right: var(--p32);
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    -o-transform: translate(0,0);
    transform: translate(0,0);
    bottom: 60%;
    top: unset;
  }
  
  .depoimento .btn-play:hover{
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }

  
  .wrapper-blocks .block{
      max-height: 740px;
      height: 80vh;
      min-height: unset;
  }
  
}



/*Footer*/

footer{
	background-color: #3F4147;
  color: white;
  padding: var(--p42) var(--p32) var(--p42);
}

footer h4{
  font-size: var(--p20);
  margin: var(--p36) 0 var(--p36);
}

.copyright{
  background-color: #2C2D33;
  padding: var(--p48) 0;
  color: white;
  font-size: .8em
}

footer .logo{
	display: block;
	background: url(../img/logo_white.svg) no-repeat center / contain;
	width: 127px;
	height: 36px;
}

footer .social{
  color: rgba(255,255,255,.8);
  font-size: 13px;
  display: block;
  margin: var(--p14) 0;
}

footer .social:before{
  display: inline-block;
  width: 32px;
  height: 32px;
  background: white;
  color: #000;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  margin-right: var(--p16);
}



@media (max-width:1200px){
  
  .split-half{
    grid-template-columns: 1fr;
    grid-column: auto;
    grid-template-rows: 1fr 1fr;
  }
  
  .split-half.img-right{
      grid-template-columns: 1fr;
      grid-column: auto;
      grid-template-rows: 1fr auto;
    }
  
  .split-half.img-left{
      grid-template-columns: 1fr;
      grid-column: auto;
      grid-template-rows:1fr 1fr;
    }
  
  .sobre-app .img-block{
    background-position: center
  }
}

/*Content Page*/


.content-page .back{
  height: 56px;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  background: white;
  box-shadow: 0 4px 12px rgba(0,0,0,.1)
}

.content-page .back a{
  font-size: 12px;
  text-transform: uppercase;
  color: var(--text-light);
  letter-spacing: 1px;
  font-family: "Nunito", Sans-serif;
}

.content-page .back a:hover{
  color: var(--primary)
}

.content-page .back a:hover svg{
  fill: var(--primary);
}

.content-page header{
  height: 360px;
  background-image: -webkit-linear-gradient(44deg, #2A1A57 0%, #30D2D6 100%);
  background-image: -o-linear-gradient(44deg, #2A1A57 0%, #30D2D6 100%);
  background-image: linear-gradient(134deg, #2A1A57 0%, #30D2D6 100%);
  padding: 60px 0;
  color: white;
  margin: 56px 0 30px 0;
}

.logo{
  width: 130px;
  height: 80px;
}

.logo img{
  width: 100%;
  height: 100%;
  object-fit: contain
}

header h1{
  margin-top: 36px
}

header p{
  max-width: 380px;
  line-height: 1.4em;
}


.content-page{background-color: #fff;}

.content-page h1{font-size: var(--p56);font-weight: 300;}
.content-page h2{font-size: var(--p50);font-weight: 300;}
.content-page h3{font-size: var(--p32);font-weight: 900;}
.content-page h4{font-size: var(--p26);font-weight: 900;}
.content-page h5{font-size: var(--p20);font-weight: 900;font-family: "Ubuntu", Sans-serif;}
.content-page h6{font-size: var(--p13);font-weight: 300;text-transform: uppercase;letter-spacing: 3px}


.content-page .text-block{
  color: var(--text-light);
  line-height: 1.4em;
  padding-bottom: 5em
}

.content-page .text-block time{
  display: block;
  margin-bottom: 32px;
}

.content-page .text-block p{
  font-size: var(--p16)
}

.content-page .text-block h2,
.content-page .text-block h3,
.content-page .text-block h4,
.content-page .text-block h5{margin: 1.6em 0 .8em 0}


.content-page .text-block a{
  color: var(--primary);
  text-decoration: underline
}

.content-page .text-block a:hover{
  color: var(--info);
  text-decoration: underline
}

.content-page .text-block b{
  font-weight: 700;
  color: var(--gray-dark)
}

@media (min-width: 1401px){
  .content-page .text-block p{
    font-size: var(--p17);
    line-height: 2em;
  }
}

@media (max-width: 1400px){
  body {
    font-size: 100%;
  }  
  
  .wrapper-blocks{
    font-size: 80%
  }

}


@media (max-width: 1020px){
  .content-page {
    font-size: 90%;
  }
  .section-title{
    font-size: .8em
  }

}

@media (max-width: 600px){
  .content-page header {
    font-size: 70%;
  }
    
  .passos{
    padding: 12px 16px
  }
  
  .passos .passo{
    margin: 0 0 16px 0
  }
  
  .conheca-app .section-title{
    padding: 0;
    margin-top: -5em
  }
  
  h2 {
    font-size: var(--p40);
  }
  
  .conheca-app .text-block{
    font-size: .8em
  }
  
  .conheca-app .slick-dots{
    right: 30% !important
  }
  
  .conheca-app .img-block{
    margin-right: -20%
  }

}

@media (max-width: 375px){
  .wrapper-blocks .block p{
    font-size: var(--p20)
  }
}

@media (max-width: 320px){
  .sobre-app .coeficientes{
    font-size: 1.05em
  }

  
  .depoimento p{
    line-height: 1.2
  }
  
  .section-title{
    padding: 0 var(--p18);
    margin: 0 auto var(--p22)
  }
  
  h2{
    font-size: var(--p36)
  }
}