.carousel-indicators li{
	width: 15px;
	height: 15px;
	border-radius: 20%;
	background-color: white;
	opacity: 0.5;
	
}
.carousel-indicators .active {
    width: 15px;
    height: 15px;
	margin-right: 10px;
	margin-left: 10px;
	margin-top: 0px;
    background-color: white;
	opacity: 1;
}

.carousel-fade .carousel-item {
 opacity: 0;
 transition-duration: .6s;
 transition-property: opacity;
}

.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
 opacity: 0;
}

.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}

.btn{
width: 200px;
height: 60px;
background: none;
border: 6px solid;
color: #3498db;
text-transform: uppercase;
cursor: pointer;
font-size: 16px;
position: relative;
}

.testing{
	color: #A065BA;
	background: #00AFEF;
}

.testing2{
	color: #00AFEF;
	background: #A065BA;
}

.testing3{
	color: #000000;
/*	background: #3498db;*/
}

.btn::before, .btn::after{
	content: "";
	position: absolute;
	width: 14px;
	height: 3px;
	background: white;
	transform: skewX(50deg);
	transition: .4s linear;
	}

.btn::before{
	top: -4px;
	left: 10%;
}


.btn::after{
	bottom: -4px;
	right: 10%;
}



.btn:hover::before{
	background: red;
	left: 80%
}

.btn:hover::after{
	background: red;
	right: 80%
}


.fishy
{
    position: relative;

}

.fishy::before,
.fishy::after
{
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    background: linear-gradient(45deg,#fb0094,#0000ff, #00ff00, #ffff00, #ff0000, #fb0094,#0000ff, #00ff00, #ffff00, #ff0000);
    background-size: 300%;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    z-index: -1;
    animation: animate 20s linear infinite;
}

.fishy::after
{
    filter: blur(20px);
}

@keyframes animate
{
    0%
    {
        background-position: 0 0;
    }
    50%
    {
        background-position: 300% 0;
    }
    100%
    {
        background-position: 0 0;
    }
}

@-webkit-keyframes animate
{
    0%
    {
        background-position: 0 0;
    }
    50%
    {
        background-position: 300% 0;
    }
    100%
    {
        background-position: 0 0;
    }
}