.thin-x{
	width: 100%;
	height: 100%;
	opacity: 0.75;
	position: absolute;
	left: 0;
	top: 0;
	transition: opacity 0.5s;
	&:hover{
		opacity: 1;
	}
}

.gear-container{
	width: 50%;
	height: 50%;
	//position: absolute;
	//left: 50%;
	//top: 50%;
	animation: spin 10s linear infinite;

}

.cloud-container{
	width: 50%;
	height: 50%;
	// position: absolute;
	// left: 50%;
	// top: 50%;
	animation: pulse 2s linear infinite;

}

@keyframes spin{
	0% {transform: rotate(0deg)}
	100% {transform: rotate(360deg)}

}


@keyframes pulse {
	0% {opacity: 0.75; transform: scale(1)}
	50% {opacity: 1; transform: scale(1.2)}
	100% {opacity: 0.75; transform: scale(1)}

}

.gear-icon{
	fill: white;
	opacity: 0.85;
}

.add-image-container{
	width: 100%;
	height: 45%;
	z-index: 1;
	margin: auto;
	flex: 1 1 40px;
  max-height: 40px;
}

.add-image-icon{
	opacity: 0.5;
	fill: white;
}

.check-icon{
	opacity: 0.5;
	fill: white;
}

.undo-icon{
	opacity: 0.5;
	fill: white;
}

.eye-container{
	width: 50%;
	height: 50%;
	position:absolute;
	left: 50%;
	top: 50%;
	transform:translate(-50%, -50%);
}

.eye-icon{
	fill: white;
	opacity: 0.50;
}

.error-icon{
	fill: white;
	opacity: 0.75;
}

.cloud-icon{
	fill: white;
	//opacity: 0.75;
}


