Hello,Ihaveadifficultyheretoremovethisweaktonethatisinthearrows,Ihavealreadychangedthecolorseveraltimesanddoesnothavethestrongblueonlypicksupwhenthemouseisover.Followmycode.Tousingbootstrap3'
HTML
<!doctypehtml><htmllang="pt-br">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- As 3 meta tags acima *devem* vir em primeiro lugar dentro do 'head'; qualquer outro conteúdo deve vir *após* essas tags -->
<title>Serviços de SEO</title>
<!-- Bootstrap -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="style.css" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<body>
<div class="container-header1">
<div class="container">
<div class="row">
<div class="col-md-4" >
<span class="glyphicon glyphicon-earphone"></span>  (+123) 456 7890      
<span class="glyphicon glyphicon-envelope"></span>  [email protected]
</div>
<div class="col-md-offset-5 col-md-3">
Siga-nos   <i class="fab fa-facebook-f"></i>     
<i class="fab fa-twitter"></i>     
<i class="fab fa-google-plus-g"></i>     
<i class="fab fa-linkedin-in"></i>
</div>
</div>
</div>
</div>
<!--/header1-->
<nav class="navbar navbar-default " id="mainNav">
<div class="container ">
<div class="row menus" >
<div class="col-sm-5 col-md-5">
<ul class="nav navbar-nav">
<li><a href="#"><strong>HOME</strong></a></li>
<li><a href="#"><strong>SOBRE NÓS</strong></a></li>
<li><a href="#"><strong>SERVIÇOS</strong></a></li>
<li><a href="#"><strong>ESTUDO DE CASO</strong></a></li>
</ul>
</div>
<div class="col-sm-3 col-md-2">
<a href="#">
<img class="logo" src="img/logo.png" class="img-responsive">
</a>
</div>
<div class="col-sm-4 col-md-5">
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><strong>PAGINAS</strong></a></li>
<li><a href="#"><strong>BLOG</strong></a></li>
<li><a href="#"><strong>CONTATO</strong></a></li>
<li><a href="#"><strong>TESTEMUNHOS</strong></a></li>
</ul>
</div>
</div>
</div>
</nav>
<!-- /.navegação -->
<!-- .Carousel -->
<div id="carouselHacked" class="carousel slide carousel-fade" data-ride="carousel">
<!-- Indicators -->
<!-- /Indicators -->
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="img/slider1.png" alt="">
<div class="carousel-caption">
caption 1
</div>
</div>
<div class="item">
<img src="img/slider2.jpg" alt="">
<div class="carousel-caption">
caption 2
</div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carouselHacked" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carouselHacked" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" class="seta-slide" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<!-- /.Carousel -->
<!-- jQuery (obrigatório para plugins JavaScript do Bootstrap) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><!--Incluitodosospluginscompilados(abaixo),ouincluaarquivosseparadadossenecessário--><scriptsrc="js/bootstrap.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
CSS
*{margin:0; padding: 0;}
/*Header Index*/
.container-header1{width: 100%; background-color: #006699; height: 33px; color: #fff; line-height: 33px;}
/*Menu/Nav Index*/
.menus{margin:auto; padding-top: 15px;}
.logo{padding-top: 3px; margin-left: 15px; }
/*Slide Index Fade*/
.carousel-fade .carousel-inner .item {opacity: 0; transition-property: opacity;}
.carousel-fade .carousel-inner .active {opacity: 1;}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {left: 0; opacity: 0; z-index: 1;}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right { opacity: 1;}
.carousel-fade .carousel-control {z-index: 2;}
/*
WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
now override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
.carousel-fade .carousel-inner > .item.next,
.carousel-fade .carousel-inner > .item.active.right {opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform:
translate3d(0, 0, 0);}
.carousel-fade .carousel-inner > .item.prev,
.carousel-fade .carousel-inner > .item.active.left { opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
.carousel-fade .carousel-inner > .item.next.left,
.carousel-fade .carousel-inner > .item.prev.right,
.carousel-fade .carousel-inner > .item.active { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
}
.carousel-control.left, .carousel-control.right{ background: none !important; filter: progid:none !important; }/*Remove gradiente do slide default do bootstrap*/
.carousel-fade .carousel-control .glyphicon-chevron-left, .carousel-fade .carousel-control .glyphicon-chevron-right{border-radius: 40px; border: 3px solid #0473AA; padding-bottom: 45px; padding-top: 9px; width: 55px; color: #0473AA; text-shadow: none;}
Thank you.