/* Não copie o código, aprenda a codificar. Assista os vídeos no YouTube. Inspirado no trabalho de: LUN DEV - https://www.lundevweb.com/ */

.slider-principal-fronts-operations-services {
	width: 100vw;
	height: 680px;
	padding-top: 100px;
	/* background-color: rgba(0,0,0,0.3); */
	text-align: center;
  overflow-x: hidden;
}

.card-slide-fronts-operations-services {
	position: relative;
	
	z-index: 100;
}

.slide-fronts-operations-services {
	width: 420px;
	height: 540px;
	padding: 30px 40px;
	/* border: 1px solid rgba(115,114,114,0.5); */
	border: 1px solid rgba(255, 255, 255, 1);
	border-radius: 30px;
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
	/* background-color: rgba(166,161,161,1); */
	background-color: rgba(5,5,99,0.60);
	position: absolute;
	left: calc(50% - 210px); 
	transition:  0.5s;
  top: 0;
}

.image-fronts-operations-services {
	width: 60px;
	height: 60px;
	margin: 20px 0 10px 0;
	
	padding: 10px;
	background-color: rgba(244,239,239,0.40);
  border-radius: 50%;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
	
	/* transform: scale(0.5); */
	filter: invert(1);
}

.slide-fronts-operations-services h4 {
	margin-bottom: 10px;
	font-size: 20px;
	color: white;
	
	font-size: 20px;
	font-weight: 900;
}

.slide-fronts-operations-services p {
	color: white;
}

.border-card-fronts-operations-service {
	width: 100%;
	height: 1px;
	border-bottom: 2px dotted white;
	margin: 20px 0;
}

.last-card-operations-service {
	margin-right: 30px;
}

.glitter-palette-card-slide-services {
	width: 200px;
	height: 200px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	background-color: #F2E9E9;
	opacity: .4;
	background-clip: mask;
	-webkit-mask-size: contain;
	-webkit-mask-position: center center;
	-webkit-mask-repeat: no-repeat;
	filter: blur(200px);
	-webkit-filter: blur(200px);
}

#next {
    position: absolute;
    right: 50px;
    top: 50%;
}
#prev {
    position: absolute;
    left: 50px;
    top: 50%;
}

#prev, #next {
    color: #fff;
    /* background: black; */
	  background-color: rgba(5,5,99,0.90);
    border: none;
    font-size: xxx-large;
    font-family: monospace;
    font-weight: bold;
    opacity: 0.3;
    transition: opacity 0.5s;
    padding: 5px 17px 10px 17px;
    border-radius: 50%;
    z-index: 200;
}

#prev:hover,
#next:hover {
    opacity: .5;
}

/* Media Query */

/* Media Queries max width 412 */

@media screen and (max-width: 412px) {
	
	.slide-fronts-operations-services {
		
	}
	
	.slide-fronts-operations-services {
		max-width: 300px;
		max-height: 640px;
		left: calc(50% - 150px); 
		/* padding-bottom: 40px; */
	}
	
	.image-fronts-operations-services {
		transform: scale(0.8);
		margin-top: 0px;
	}
	
	.slide-fronts-operations-services h4 {
		margin-bottom: 10px;
		font-size: 18px;
		/* color: red; */
	}
	
	#prev, #next {
		padding: 10px 18px;
	}
		
	#next {
		right: 30px;
		top: 5%;
	}
	
	#prev {
		left: 30px;
		top: 5%;
	}

}