/*Coisas que serão exibidas no Mobile*/

@media only screen and (max-width: 1200px) {

	*:focus{
		outline: none;
	}

	.desktop-container{
	  	display: none;
	  }

	.mobile-container{
	  	display: block;
	  	width: 100%;
	  }

	html{	
		scroll-behavior: smooth;
		overflow-x: hidden;
	}

	a{
		text-decoration: none;
	}

	button:focus{
		outline: none;
	}

	body{
		margin: 0;
		overflow-x: hidden;
	}

	.header{
		height: 80px;
		width: 100%;
		background-color: #5c2d91;
	}

	.header img{
		height: auto;
		width: 100px;
		margin: 15px 0 0 -10px;
	}

	.hero-container{
		height: auto;
		width: 100%;
		background-color: #edd66d;
		background-image: url('../images/background-hero.png');
		background-size: inherit;
		background-position: 0% 63%;
		background-attachment: fixed;
	}

	.row-hero{
		height: auto;
		width: 80%;
	}

	.image-column{
		height: 500px;
		width: 100%;
		margin-top: 0px;
	}

	.image-column img{
		height: 450px;
		width: auto;
		margin: -20px 0 0 -20px;
	}

	.text-column{
		height: 500px;
		width: 100%;
		font-family: Montserrat;
		margin: -35px 0 0 5px;
	}

	.text-column img{
		height: 250px;
		width: auto;
		margin-top: 10px;
	}

	.text-column p{
		font-size: 18px;
		font-weight: bold;
	}

	.button-hero{
	    border: solid 1.5px #5c2d91;
	    border-radius: 35px;
	    width: 310px;
	    height: 55px;
	    display: inline-flex;
	    text-align: center;
	}

	.button-hero:hover .button-inside{
		transition: 0.3s ease-in-out;
		margin: 0;
		width: 300px;
		padding: 15px;
	}

	.button-inside{
		border-radius: 25px;
		width: 250px;
		padding: 15px;
		font-family: Roboto;
		color: white;
		font-weight: bold;
		background-color: #5c2d91;
	}

	.queda-container{
		width: 100%;
		height: 1200px;
		position: relative;
		margin-top: 0px;
		background-image: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(239,77,139,1) 100%);
		background-size: inherit;
		background-position: bottom;
		background-repeat: no-repeat;
	}

	.row-queda{
		width: 100%;
		height: fit-content;
	}

	.queda-image{
		width: 100%;
		height: fit-content;
	}

	.queda-image img{
	    width: auto;
		height: 450px;
	}

	.queda-text{
		width: 90%;
		height: 100%;
		padding: 40px 15px 50px 15px;
		background-color: rgba(92, 45, 145, 0.8);
		border-radius: 30px;
		margin: -4px 0 0 0;
	}

	.queda-text img{
		width: 100%;
		height: 340px;
	}

	.queda-text p{
		color: white;
		font-weight: unset;
		font-family: Montserrat;
		text-align: justify;
		padding:0 35px;
	}

	.queda-text span{
		font-weight: bolder !important;
		font-size: 20px;
	}

	.queda-wave{
		width: 100%;
		height: auto;
		max-height: 700px;
		position: absolute;
		bottom: 0%;
		left: 0%;
		margin: 0 0 0 0;
	}

	.info-container{
		height: 620px;
		width: 100%;
		background-color: white;
		margin: 50px 0 260px 0;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}

	.row-info{
		height: auto;
		width: 100%;
	}

	.info-text{
		height: 400px;
		width: 80%;
		margin: 50px 0 0 0;
	}

	.info-text img{
		height: auto;
		width: 100%;
	}

	.info-text p{
		font-family: Montserrat;
	    font-size: 18px;
	    text-align: left;
	    padding: 5px 0 0 0;
	    width: 350px;
	    line-height: 40px;
	    margin: 0;
	    color: #423838;
	}

	.button-info{
	    border: solid 1.5px #edd66d;
	    border-radius: 35px;
	    width: 310px;
	    height: 55px;
	    display: inline-flex;
	    text-align: center;
	    margin: 0 0 0 0;
	}

	.button-info:hover .button-inside-info{
		transition: 0.2s ease-in-out;
		margin: 0;
		width: 300px;
		padding: 17px;
	}

	.button-inside-info{
		border-radius: 25px;
		width: 268px;
		padding: 15px;
		font-family: Roboto;
		color: white;
		font-weight: bold;
		background-color: #edd66d;
		margin: 5px;
	}

	.info-background{
		height: auto;
		width: 100%;
	}

	.info-background img{
		width: auto;
		height: 400px;
	}

	.video-container{
		height: auto;
		width: 100%;
		background-color: #5c2d91;
		background-image: url('../images/background-video.png');
		background-attachment: fixed;
		background-repeat: no-repeat;
		background-position: 83%;
		background-size: cover;
		padding: 80px 0 0px 0;		
		box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	}

	.row-video{
		height: auto;
		width: 100%;
	}

	.video-text{
		height: 400px;
		width: 100%;
		margin: 0px 0px 50px 0px;
	}

	.video-text img{
		width: 90%;
    	margin: 0 0 0 10px;
	}

	.video-text p{
		font-size: 15px;
	    color: white;
	    line-height: 25px;
	    font-family: Montserrat;
	    text-align: justify;
	    width: 70%;
	}

	.video{
		width: 90%;
		margin: 50px 0;
		padding: 65px 0;
	}

	.youtube{
		border-radius: 6px;
		height: 270px;
		width: 100%;
	}

	.skills-container{
		width: 100%;
		height: auto;
		margin: 60px 0 0 0;
		padding: 0 0 40px 0;
		background-image: url('../images/skew-bg.png');
		background-size: inherit;
		background-repeat: no-repeat;
		background-position: 0% 115%;
	}

	.skills-title{
		height: auto;
		width: 100%;
	}

	.skills-title img{
		width: 100%;
	}

	.skills-title p{
		font-size: 18px;
		font-family: Montserrat;
		color: #333;
		padding: 10px 50px;
	}

	.row-skill{
		width: 100%;
		height: auto;
		margin: 25px 0;
	}

	.row-center{
		height: auto;
		display: inline-flex;
		width: 100%;
	}

	.overlay-container {
	  position: relative;
	  width: 50%;
	  height: 220px;
	  border-radius: 30px 0;
	  margin: 0 7.5px 0 15px;
	  background-color: #68146b;
	  background-image: url('../images/skill-how.png');
	  background-size: contain;
	  background-repeat: no-repeat;
	  background-position: bottom;
	}

	.image-overlay {
	  display: block;
	  width: auto;
	  height: 130px;
	  margin-top: 45px;
	}

	.overlay {
	  position: absolute;
	  top: 0;
	  bottom: 0;
	  left: 0;
	  right: 0;
	  border-radius: 30px 0;
	  height: 100%;
	  width: 100%;
	  opacity: 0.9;
	  transition: .5s ease;
	  background-color: #ef4d8b;
	}

	.overlay-container:hover .image-overlay {
	  transform: rotate(360deg);
	  transition: 0.3s ease-in-out;
	  cursor: pointer;
	}

	.overlay-container:active .overlay {
	  opacity: 0;
	  cursor: pointer;
	}

	.text-overlay {
	  color: white;
	  font-size: 20px;
	  position: absolute;
	  font-family: Roboto;
	  top: 50%;
	  left: 50%;
	  -webkit-transform: translate(-50%, -50%);
	  -ms-transform: translate(-50%, -50%);
	  transform: translate(-50%, -50%);
	  text-align: center;
	  width: 80%;
	}

	.text-overlay img{
		height: 70px;
	}

	.banner-details{
		height: auto;
		width: 100%;
		background-color: #f0d56c;
		padding: 40px 0;
	}

	.banner-details img{
		width: 100%;
	}

	.button-banner{
	    border: solid 1.5px #5c2d91;
	    border-radius: 35px;
	    width: 310px;
	    height: 55px;
	    display: inline-flex;
	    text-align: center;
	    margin: 40px 0 0 0;
	}

	.button-banner:hover .button-inside-banner{
		transition: 0.2s ease-in-out;
		margin: 0;
		width: 300px;
		padding: 17px;
	}

	.button-inside-banner{
		border-radius: 25px;
		width: 268px;
		padding: 15px;
		font-family: Roboto;
		color: white;
		font-weight: bold;
		background-color: #5c2d91;
		margin: 5px;
	}

	.table-container{
		width: 100%;
		height: auto;
		margin: 0px 0 10px 0;
	}

	.table-title{
		height: auto;
		width: 110%;
		margin-top: -65px;
	}

	.table-title p{
		font-size: 24px;
		font-family: Montserrat;
		color: #333;
		padding: 0 20px !important;
  		margin: 0 35px 0 0;
	}

	.table-container img{
		margin: 30px 0;
		width: 100%;
	}

	.tabela-img{
		width: 125% !important;
   		margin: 30px -12% !important;
	}

	.banner-modelo{
		height: auto;
		width: 100%;
		background-color: #5b2b8f;
		padding: 0 0 40px 0;
	}

	.banner-modelo img{
		width: 100%;
	}

	.depoimentos-container{
		background-color: #5b2b8f;
		width: 100%;
		height: auto;		
		padding: 0 0 80px 0;
		margin-bottom: 60px;
		box-shadow: 2px 11px 8px 0 rgba(0, 0, 0, 0.2), -2px 18px 20px 0 rgba(0, 0, 0, 0.19);
		border-bottom: 10px solid #edd66d;
	}

	.row-depoimentos{
		width: 100%;
		height: auto;
	}

	.carousel-button-p{
		height: 35px;
	    position: relative;
	    right: 42%;
	    margin-bottom: -170px;
	}

	.carousel-button-n{
		height: 35px;
	    position: relative;
	    left: 42%;
	    margin-bottom: -170px;
	}

	.carousel{
		overflow:hidden;
		position:relative;
		width:85%;
		margin-top: -165px;
		height:550px;
		perspective:700px;
		transform-style:preserve-3d;
		transform-origin:0% 50%;
		transition: 0.5s ease-in-out;
	}

	.carousel-item{
		width:60%;
		height:100%;
		position:absolute;
		top:90px;
		left:0;
	}

	.carousel .carousel-item{
		visibility:hidden;
		width:560px;
		height:200px;
		position:absolute;
		top:0;
		left:0;
	}

	.carousel .indicators{
		position:absolute;
		text-align:center;
		left:0;
		right:0;
		bottom:0;
		margin:0;
		padding-left: 0;
	}

	.carousel .indicators .indicator-item{
		display:inline-block;
		position:relative;
		cursor:pointer;
		height:8px;
		width:8px;
		margin:24px 4px;
		background-color:rgba(255,255,255,0.5);
		-webkit-transition:background-color .3s;
		transition:background-color .3s;
		border-radius:50%;
	}

	.carousel .indicators .indicator-item.active{
		background-color:#fff;
	}

	.carousel-content{
		background-color: white;
		height: 250px;
		width: 270px;
		color: #333;
		padding: 20px;
		box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
		border-radius: 4px;
		font-family: Montserrat;
	}

	.carousel-content p{
		margin: 0;
	}

	.quote-up{
		height: 75px;
	    width: auto;
	    position: relative;
	    right: 30%;
	    margin-top: -30px;
	}

	.quote-down{
		height: 75px;
	    width: auto;
	    margin-top: -10px;
	    left: 40%;
	    transform: rotate(180deg);
	    position: relative;
	}

	.quote-pic{
		height: 100px;
	    width: 100px;
	    border-radius: 100%;
	    position: relative;
	    right: 32px;
	    margin-top: -35px !important;
	}

	.signature{    
		font-size: 20px;
	    font-weight: bold;
	    margin-top: 15px !important;
	    color: #c02ec0;
	    font-family: Lato;
	}

	.vitrine-container{
		width: 100%;
		height: auto;	
		margin-bottom: 40px;
	}

	.title-vitrine{
		margin: 100px 0 40px 0;
	}

	.title-vitrine img{
		width: 90%;
		margin: 0 0 0 10px;
	}

	.row-vitrine{
		width: 100%;
		height: auto;
	}

	.label-especial{
		display: inline-flex;
		width: auto;
		margin: -10px 0 10px 0;
	}

	.label-especial span{
		font-family: Lato !important;
		font-weight: bold !important;
		font-size: 20px !important;
		color: #ef4d8b !important;
	}

	.label-especial span img{
		height: 20px;
		margin: 0 0 -3px 0;
	}

	.item-vitrine{
		height: auto;
		width: 90%;
		margin: 20px 15px 50px 15px;
		border: solid 2px #ef4d8b;
		border-radius: 8px;
		box-shadow: 2px 11px 8px 0 rgba(0, 0, 0, 0.09), -2px 18px 20px 0 rgba(0, 0, 0, 0.09);
	}

	.item-vitrine h3{
		background-color: #ef4d8b;
	    border-radius: 20px;
	    color: white;
	    font-size: 18px;
	    width: 85%;
	    margin-top: -12px;
	    padding: 5px 0;
	    font-family: Lato;
	}

	.item-vitrine p{
		font-family: Lato;
		color: #5c2d91;
		font-weight: bold;
		font-size: 16px;
	}

	.item-vitrine img{
		height: 230px;
		margin: -10px 0;
	}

	.item-vitrine span{
		font-family: Montserrat;
		font-size: 13px;
		color: #333;
		font-weight: bold;
	}

	.item-vitrine h2{
		font-family: Montserrat;
		font-weight: bolder;
		font-size: 33px;
		color: #ef4d8b;
		margin: 3px 0;
	}

	.item-vitrine button{
		font-family: Montserrat;
	    font-weight: bold;
	    font-size: 15px;
	    color: white;
	    border-radius: 25px;
	    background-color: #5c2d91;
	    border: solid 3px #5c2d91;
	    padding: 10px;
	    width: 250px;
	    margin: 15px 0;
	}

	.item-vitrine button:hover{
		cursor: pointer;
		transition: 0.3s ease-in-out;
		border: solid 2px #edd66d;
	}

	.footer-container{
		width: 100%;
		height: auto;
	}

	.footer{
		width: 100%;
		height: 100%;
	}

	.newsletter{
		width: 100%;
		height: 100%;
	}

}