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

/* Cores: Roxo = #5c2d91
		  Amarelo = #edd66d 
		  Rosa = #ef4d8b
*/

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

	*:focus{
		outline: none;
	}

	.desktop-container{
	  	display: block;
	  }

	.mobile-container{
	  	display: none;
	  }

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

	a{
		text-decoration: none;
	}

	button:focus{
		outline: none;
	}

	body{
		margin: 0;
	}

	.floating-pills{
		height: 200px;
		width: auto;
		position: absolute;
		left: 155px;
  		top: 2795px;
		transform: translate(-50%,-50%);
	}

	.floating-pills-2{
		height: 200px;
		width: auto;
		position: absolute;
	    right: 130px;
    	top: 4815px;
		transform: translate(-50%,-50%);
	}

	.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: cover;
		background-attachment: fixed;
	}

	.hero-container hr{
		width: 80%;
		background-color: #5c2d91;
		border: 2px solid #5c2d91;
		border-radius: 25px;
		margin-top: 50px;
		margin-bottom: -5px;
	}

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

	.image-column{
		height: 500px;
		width: 50%;
		margin-top: -40px;
		text-align: right;
	}

	.image-column img{
		height: 640px;
		margin-left: 50px;
		width: auto;
	}

	.text-column{
		height: 500px;
		width: 50%;
		font-family: Montserrat;
		text-align: left;		
		margin-left: 20px;
	}

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

	.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: 750px;
		position: relative;
		margin-top: 150px;
		background-image: linear-gradient(to bottom, rgba(125,185,232,0) 0%,rgba(239,77,139,1) 100%);
		background-size: contain;
		background-repeat: no-repeat;
	}

	.row-queda{
		width: 75%;
		height: fit-content;
		display: inline-flex;
	}

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

	.queda-image img{
	    width: auto;
		height: 650px;
		max-height: 680px;
		margin: -10px 0 0 -55px;
	}

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

	.queda-text img{
		width: auto;
		height: 250px;
	}

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

	.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;
	}

	.tranca{
		height: auto;
		width: auto;
		position: absolute;
		right: -85px;
		z-index: 9;
   		top: 1290px;
	}

	.tranca img{
		transform: rotate(-45deg);
		height: 150px;
	}

	.info-container{
		height: 620px;
		width: 100%;
		background-color: white;
		margin: 0 0 40px 0;
		background-image: url('../images/wave.png');
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}

	.row-info{
		height: auto;
		width: 75%;
		display: inline-flex;
	}

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

	.info-text img{
		height: 200px;
		max-height: 200px;
	}

	.info-text p{
		font-family: Montserrat;
	    font-size: 18px;
	    text-align: left;
	    padding: 5px 70px 0 0;
	    float: right;
	    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: 20px 50px 0 0;
	    float: right;
	}

	.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: 620px;
		width: 55%;
		text-align: left;
	}

	.info-background img{
		height: 620px;
		margin: 0 0 0 0;
	}

	.video-container{
		height: 500px;
		width: 100%;
		background-color: #5c2d91;
		background-image: url('../images/background-video.png');
		background-attachment: fixed;
		background-repeat: no-repeat;
		background-size: cover;
		padding: 80px 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: 75%;
		display: inline-flex;
		text-align: center;
	}

	.video-text{
		height: 400px;
		width: 40%;
		margin: 50px 50px 50px -50px;
		text-align: right;
	}

	.video-text img{
		margin-left: -50px;
	}

	.video-text p{
		font-size: 15px;
	    color: white;
	    line-height: 25px;
	    font-family: Montserrat;
	    float: right;
	    text-align: justify;
	    width: 350px;
	    padding: 0 0 0 30px;
	}

	.video{
		height: 400px;
		width: 60%;
		margin: 50px 0;
		text-align: left;
		padding: 35px 0;
	}

	.youtube{
		border-radius: 6px;
	}

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

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

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

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

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

	.overlay-container {
	  position: relative;
	  width: 50%;
	  height: 220px;
	  border-radius: 30px 0;
	  margin: 0 35px;
	  background-color: #68146b;
	}

	.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: 1;
	  transition: .5s ease;
	  background-color: #ef4d8b;	  
	  background-image: url('../images/skill-how.png');	  
	  background-size: contain;
	  background-repeat: no-repeat;
	  background-position: bottom;
	}

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

	.overlay-container:hover .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;
	}

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

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

	.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;
	}

	.tabela-container{
		width: 100%;
		height: auto;
		margin: 60px 0 100px 0;
	}

	.table-title{
		height: auto;
		width: 70%;
		margin-top: -75px;
	}

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

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

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

	.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: 300px;
	}

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

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

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

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

	.carousel .carousel-item{
		visibility:hidden;
		width:530px;
		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: 210px;
		width: 500px;
		color: #333;
		padding: 10px;
		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: 100px;
	}

	.title-vitrine{
		margin: 140px 0 60px 0;
	}

	.title-vitrine img{
		height: 220px;
	}

	.row-vitrine{
		width: 70%;
		height: auto;
		display: inline-flex;
	}

	.especial{
		height: 550px !important;
		margin: -5px 0 0 0 !important;
	}

	.img-especial{
		height: 220px !important;
		margin: 0 0 0 0 !important;
	}

	.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: 500px;
		width: 32%;
		margin: 20px 15px 0 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: 15px;
	    width: 230px;
	    margin-top: -12px;
	    padding: 5px 0;
	    font-family: Lato;
	}

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

	.item-vitrine img{
		height: 180px;
		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: 40px;
		color: #ef4d8b;
		margin: 10px 0;
	}

	.item-vitrine button{
		font-family: Montserrat;
	    font-weight: bold;
	    font-size: 16px;
	    color: white;
	    border-radius: 25px;
	    background-color: #5c2d91;
	    border: solid 3px #5c2d91;
	    padding: 12px;
	    width: 220px;
	    margin: 25px 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%;
	}
}

/*--- Scrollbar CSS ------------------------------------------------------------*/

::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-track {
  background: #555;
}

::-webkit-scrollbar-thumb {
  background: #888;
}

::-webkit-scrollbar-thumb:hover {
  background: #999;
}