@charset "utf-8";
/* CSS Document */


/*------------------------------------------------------------------
[ÍNDICE DE CONTEÚDO]

	1. ESTILOS COMUNS 
		1.1 PAGINAÇÃO
	2. BARRA DE ACESSIBILIDADE 
	3. HEADER
	4. BANNER ROTATIVO
	5. AJUDA DE ACESSIBILIDADE
	6. HOME
	7. CARRINHO

	9. CONTATO
	10. FOOTER

-------------------------------------------------------------------*/


/* 1. ESTILOS COMUNS */

@media only screen and (min-width: 1366px) { 
    .container {
    max-width: 1280px;
    } }

p {line-height: 1.8em; margin-bottom:20px;}

.asterisco {
    width: 10px;
    height: 10px;
    margin: 0 5px;
    vertical-align: inherit;}

.asterisco {width: 12px; height:auto;}
	
.borda-cz {border-bottom:1px solid #dddddd;}

.hidden-title { left: -999em !important; position:absolute !important; }

a {color: #000; transition: all .3s ease 0s;}
a.azul {color: #007bb4;} 
.azulclaro {color: #00ccff;}
.cinzaclaro {color: #cccccc;}
a.czclaro {color: #cccccc;}
a.czclaro:hover, a.czclaro:focus {color: #00a7ff;}

#nossosclientes, #nossosprodutos, #nossosservicos, #clientes, #produtos, #servicos, #noticias, #fokal, #sustentabilidade, #contato {padding: 70px 0 40px 0;}

audio {
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
    -moz-box-shadow: 2px 2px 4px 0px #999;
    -webkit-box-shadow: 2px 2px 4px 0px #999;
    box-shadow: 2px 2px 4px 0px #999;
    -moz-border-radius: 7px 7px 7px 7px;
    -webkit-border-radius: 7px 7px 7px 7px;
    border-radius: 7px 7px 7px 7px; }

.sr-only2 {
    position: relative;
	display:block;
    width: 100%;
    height: auto;
    padding: 6px 0;
    overflow: visible;
    clip: rect(0,0,0,0);
    white-space: normal;
    -webkit-clip-path: none;
    clip-path: none;
    border: 0;
}


@media only screen and (min-width: 769px) {
.sr-only2 {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    border: 0;
}
}

@media only screen and (max-width: 576px) {
.sr-only-mobile {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    border: 0;
}}


@media only screen and (max-width: 768px) { .ocultar-tablet {display: none !important;} }

.btn-outline-primary {border: 2px solid #0082c6; padding: 12px 20px; color: #000; font-size: 1.1rem; font-weight: 600;}
 .btn-outline-primary:hover, #noticias .btn-outline-primary:focus {border: 2px solid #0082c6; background-color: #0082c6; padding: 12px 20px; color: #fff; font-size: 1.1rem; font-weight: 600;}

#rodape a .icon-redes-sociais {
	display: inline;
	height: 24px;
	width: auto;
	opacity:1;}
#rodape a:hover .icon-redes-sociais, #rodape a:focus .icon-redes-sociais {
	display: inline;
	height: 24px;
	width: auto;
	opacity:0.5;}
	
@media only screen and (max-width: 600px) { .ocultar-mobile {display: none;} .ocultar-desktop {display: block;} }
@media only screen and (max-width: 768px) { .ocultar768 {display: none;} }
.ocultar-desktop {display: inline-block;}
@media only screen and (min-width: 769px) { .ocultar-desktop {display: none;} }
@media only screen and (min-width: 601px) { .ocultar-desktop-tablet {display: none;}  .ocultar-mobile {display: block;}}

.custom-control {margin: 5px 0;}

.g-recaptcha div {width: 340px !important; height: 78px;}

/* 1.1 ÍCONES */

.lnr {
  display: inline-block;
  fill: currentColor;
  width: 1em;
  height: 1em;
  vertical-align: middle;
}

.lnr2 {
  display: inline-block;
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.lnr-user {
  color: #404040;
  /* We can use "color" for setting the color
  of the SVG because we set its "fill" to
  "currentColor" */
  font-size: 24px;
  /* We can use "font-size" for changing the size
  of the SVG because its width and height were
  set 1em.
  To get crisp results, use sizes that are
  a multiple of 20; because Linearicons was
  designed on a 20 by 20 grid. */
}


.lnr-cart {
  color: #292929;
  font-size: 30px;
}

.lnr-film-play, .lnr-volume-high {font-size: 22px; vertical-align: text-top;}

/* 1.1 PAGINAÇÃO */

.campo-paginacao {position: relative; float: left; padding-top: 4px !important; padding-bottom:4px !important;}
.campo-num {max-width: 50px; max-height: 32px;} 
@media only screen and (max-width: 560px) {.campo-num {max-width: 45px; max-height: 28px;} }
@media only screen and (max-width: 375px) {.campo-num {max-width: 35px; max-height: 28px;} }
#paginacao .form-control {display:inline !important;}

.pagination > li > a, .pagination > li > span { padding: 10px 14px; margin-right: 8px; color: #333; }
.pagination > li > a.active, .pagination > li > span.active { color: #fff; background-color: #3a78ab; }
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { color: #fff; background-color: #3a78ab; }
@media only screen and (max-width: 560px) { .pagination > li > a, .pagination > li > span { padding: 8px 12px; margin-right:0; } }

/* 1.2 BANNER */

a.carousel-control-next div, a.carousel-control-prev div { 
	padding: 20px 20px 15px 20px;
	background-color: #000;
	}


/* 2. BARRA DE ACESSIBILIDADE */

#acessibilidade { width: 100%; padding-top: 10px; min-height: 42px; background-color: #333333; color: #fff; font-size:0.8em; line-height:1rem;}
@media only screen and (max-width: 1024px) { 
#acessibilidade .container { padding: 0;}}
@media only screen and (max-width: 768px) { #acessibilidade {text-align: center; padding: 10px auto; line-height:1.3rem;} }
@media only screen and (max-width: 460px) {#acessibilidade {font-size:0.72em; } }

#acessibilidade a {text-decoration: none; color: #fff;} 
#acessibilidade a:hover {text-decoration: underline;}

#acessibilidade a.linkcontr1:hover, a.linkcontr1:focus, a.linkcontr2:hover, a.linkcontr2:focus {border: 2px solid #00ccff !important;}
#acessibilidade a:hover, #acessibilidade a:focus {color: #fee949; border: 2px transparent;}

#acessibilidade li {vertical-align: middle;}
@media only screen and (max-width: 560px) { #acessibilidade li { padding: 8px 0; vertical-align: middle;} }
#acessibilidade li.item-contraste { padding-right: 1.5px; padding-right:1.5px;}

.contraste-normal { background-color:#fff; width:16px; height:16px; border: 2px solid #fff; display:block; border-radius: 50%;}
.alto-contraste { background-color:#1d3857; width:16px; height:16px; border: 2px solid #fff; display:block; border-radius: 50%;}

#acessibilidade ul.list-inline {display:inline-block;}

#acessibilidade ul.ferram-acessibilidade {list-style: none; font-size: 0.78rem;}
@media only screen and (min-width: 1280px) {#acessibilidade ul.ferram-acessibilidade {list-style: none; font-size:0.8rem;}}
.ferram-acessibilidade > li {
	float:none;
	position: relative;
	display: block; }

@media only screen and (min-width: 414px) {
.ferram-acessibilidade > li {
	float: left;
	position: relative;
	display: block; }
	}
	
#acessibilidade button {background-color: transparent; border: 0; color: #fff;}
#acessibilidade button:hover, button:focus {
    color: #fee949;
    border: 0;
	text-decoration: underline;}

#acessibilidade .nav-link {
    padding: .2rem 0.6rem;
}

#acessibilidade .nav-pills .nav-link {border: 2px solid transparent;}
#acessibilidade .nav-pills .nav-link.active, #acessibilidade .nav-pills .show > .nav-link {background-color: transparent; border: 2px solid #fff;}
#acessibilidade .dropdown-menu {background-color: #0082c6; color: #fff;}
#acessibilidade .dropdown-menu a {padding-top: 6px; padding-bottom: 6px;}
#acessibilidade .dropdown-menu a:hover, #acessibilidade .dropdown-menu a:focus {color: #333; text-decoration: none;}


/* 3. HEADER */

.logo {max-width: 130px;}
#menumain {min-height: 47px; font-weight: 600; font-size: 0.9rem; color: #333;}
.logo-selo {max-height: 60px; width: auto; margin-top: 20px;}

@media only screen and (min-width: 601px) and (max-width: 991px) {#menumain {width: 50%;} }

@media only screen and (max-width: 600px) { .selos {text-align: center;} }


#menumain li a.nav-link {padding: 8px 20px; border:2px solid transparent; border-radius: 3px;}
#menumain li a.nav-link:hover, #menumain li a.nav-link:focus {padding: 8px 20px; border:2px solid #000; border-radius: 3px;}

@media only screen and (min-width: 769px) and (max-width: 1279px) { 
#menumain li a.nav-link {padding: 8px 10px; border:2px solid transparent; border-radius: 3px;}
#menumain li a.nav-link:hover, #menumain li a.nav-link:focus {padding: 8px 10px; border:2px solid #000; border-radius: 3px;}

 }

.dropdown-menu { border: 1px solid rgba(0,0,0,.3); background-color: rgba(255,255,255,.9);}
#header .dropdown-item:hover, #header .dropdown-item:focus {
    color: #fff;
    background-color: #0082c6;
}

@media only screen and (max-width: 768px) { #menumain li a.nav-link {background-color: #f8f8f8; text-align: center;}}

@media only screen and (max-width: 375px) {.navbar-brand {margin-right: 0.3rem;} .slogan {font-size: 0.8rem;max-width: 120px;} }

#header {min-height: 90px;}
#header a.azul {font-size: 1rem}
.faixa-azul { height: 36px; background-color: #3b77ab; border-top: 3px solid #0c0c0c; }
.login-cadastro { text-align:center; margin-bottom: 10px;}
h1 { margin: 10px 0 0 0; font-size: 1rem;}
.login-block {display:block; padding: 10px 10px 10px 5px; margin-right: 5px; border-right: none;}

h2 {font-size:2rem; font-family: 'Domine', serif; font-weight: 700;}
.borda-header { display:inline-block; padding-bottom: 10px; border-bottom: 1px solid #5ea7dd;}
h2 .lnr-cart {font-size: 50px; margin-right: 10px;}
h2 .lnr-user {font-size: 32px; margin-right: 10px;}

.slogan {font-size: 0.7rem; font-weight: 600; color: #333; margin-bottom: 10px;}

@media only screen and (min-width: 1025px) { 
	.slogan {font-size: 0.85rem; font-weight: 600; color: #333; margin-bottom: 10px;}
}

@media only screen and (min-width: 769px) { 
	.login-cadastro {text-align: right;} 
	.login-block {display:inline-block; padding: 20px; margin-right: 20px; border-right: 1px solid #dddddd;}
	h1 {text-align: left;}
.logo-selo {max-height: 65px; width: auto; margin-top:0;}

}
 }

 #mainbanner .carousel-caption {max-width: 100%; margin: auto; top: 50%;}
 #mainbanner h2 {line-height: 1.4rem; text-align: center; font-size:4vw; line-height: auto; font-family: 'Domine', serif; font-weight: 700;}
 #mainbanner .carousel-caption .textocarousel {font-size: 1rem; line-height: 1.4rem; color: #33ffff; text-align: center;}
 
 @media only screen and (max-width: 320px) { 
#mainbanner h2 {line-height: 1.4rem; text-align: center; font-size:4vw; line-height: auto; font-family: 'Domine', serif; font-weight: 700;}
 #mainbanner .carousel-caption .textocarousel {
    font-size: 0.8rem;
    line-height: 1rem;
    color: #33ffff;
    text-align: center;

}}
 @media only screen and (min-width: 601px) and (max-width: 768px) { 
    #mainbanner .carousel-caption {max-width: 50%; top: 10%; margin:0; left: 50px;}
    #mainbanner h2 {font-size:2.2vw; line-height: 1.4em; text-align: left;  font-family: 'Domine', serif; font-weight: 700;}
    #mainbanner .carousel-caption .textocarousel {font-size: 0.9rem; line-height: 1.5rem; text-align: left; color: #33ffff;}
  }

 @media only screen and (min-width: 769px) and (max-width: 1279px) { 
    #mainbanner .carousel-caption {max-width: 50%; top: 10%; margin:0; left: 100px;}
    #mainbanner h2 {font-size:2.2vw; line-height: 2em; text-align: left;  font-family: 'Domine', serif; font-weight: 700;}
    #mainbanner .carousel-caption .textocarousel {font-size: 1rem; line-height: 1.5rem; text-align: left; color: #33ffff;}
  }

 @media only screen and (min-width: 1280px) and (max-width: 1440px) { 
    #mainbanner .carousel-caption {max-width: 45%; top: 15%; margin:0;}
    #mainbanner h2 {font-size:2.2vw; line-height: 2rem; text-align: left; font-family: 'Domine', serif; font-weight: 700;}
    #mainbanner .carousel-caption .textocarousel {font-size: 1.1rem; line-height: 2rem; text-align: left; color: #33ffff;}
  }
 
 
 @media only screen and (min-width: 1441px) { 
      #mainbanner .carousel-caption {max-width: 40%; top: 22%; margin:0;}
      #mainbanner h2 {font-size:2vw; line-height: 2.8rem; text-align: left; font-family: 'Domine', serif; font-weight: 700;}
      #mainbanner .carousel-caption .textocarousel {font-size: 1.2rem; line-height: 2.4rem; text-align: left; color: #33ffff;}
    }
 
    .navbar-light .navbar-toggler {

        color: rgba(255,255,255,1);
        border-color: 1px solid #000;
        background-color: #0059bd;
    
    }

   #menumain button:hover, button:focus {
        color: rgba(255,255,255,1);
        border-color: 1px solid #fff;
        background-color: #0082c6;
        }
    

    .navbar-toggler {

        padding: .6rem 1.75rem;
        font-size: 1.25rem;
        line-height: 1;
        background-color: transparent;
        border: 1px solid transparent;
            border-top-color: transparent;
            border-right-color: transparent;
            border-bottom-color: transparent;
            border-left-color: transparent;
        border-radius: .25rem;
    
    }

    #banner-interno h2 {
            font-size: 2.6em;
            line-height: 2.8rem;
            text-align: left;
            font-family: 'Domine', serif;
            font-weight: 700;      
    }

    #banner-interno .carousel-caption {

        position: absolute;
        right: 15%;
        bottom: 30%;
        left: 15%;
        z-index: 10;
        padding-top: 20px;
        padding-bottom: 20px;
        color: #fff;
        text-align: center;
    
    }

    @media only screen and (min-width: 601px) and (max-width: 768px) { 

          #banner-interno h2 {
            font-size: 2.6em;
            line-height: 2.8rem;
            text-align: center;
            font-family: 'Domine', serif;
            font-weight: 700;      
    }
        
        #banner-interno .carousel-caption {

            position: absolute;
            right: 15%;
            bottom: 10%;
            left: 15%;
            z-index: 10;
            padding-top: 30px;
            padding-bottom: 20px;
            color: #fff;
            text-align: center;
        
        }

    }

    @media only screen and (max-width: 600px) { 

        #banner-interno h2 {
            font-size: 2.6em;
            line-height: 2.8rem;
            text-align: center;
            font-family: 'Domine', serif;
            font-weight: 700;     
            
    }

    #banner-interno h2.sustentab {
        font-size: 2em;
        line-height: 2.8rem;
        text-align: center;
        font-family: 'Domine', serif;
        font-weight: 700;     
        
}

        #banner-interno .carousel-caption {

            position: absolute;
            right: 15%;
            bottom: 20%;
            left: 15%;
            z-index: 10;
            padding-top: 20px;
            padding-bottom: 20px;
            color: #fff;
            text-align: center;
        
        }

    }


 /* 6. QUEM SOMOS */

 #fokal .bg-info { background-color: #006FA9 !important;}
 

 /* 7. NOSSOS CLIENTES */
 
 #nossosclientes img {max-width: 250px; margin: auto;}



 /* 8. NOTÍCIAS */

 #noticias .fa-calendar-alt,  #noticias .fa-user {color: #0082c6;}

 #noticias a .icon-redes-sociais {
	display: inline;
	height: 24px;
	width: auto;
	opacity:1;}
#noticias a:hover .icon-redes-sociais, #noticias a:focus .icon-redes-sociais {
	display: inline;
	height: 24px;
	width: auto;
	opacity:0.5;}

.redesociais .compartilhar {padding: 10px 20px; border: 1px solid #333;}

 /* 8. NOSSOS PRODUTOS */

#nossosprodutos .image {
    display: block;
    width: 100%;
    height: auto;
  }


  .overlay, .overlay6 {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #d13d01;
    overflow: hidden;
    width: 100%;
    height: 50%;
    transition: .5s ease;
  }

   
  .prod01:hover .overlay, .prod02:hover .overlay2, .prod03:hover .overlay3, .prod04:hover .overlay4, .prod05:hover .overlay5, .prod06:hover .overlay6 {
    height: 100%;
  }

  .overlay2, .overlay4 {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #2f3943;
    overflow: hidden;
    width: 100%;
    height: 50%;
    transition: .5s ease;
  }

  .overlay3, .overlay5 {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #0d1e2d;
    overflow: hidden;
    width: 100%;
    height: 50%;
    transition: .5s ease;
  }
  

  #nossosprodutos .card .text {
    color: white;
    position: absolute;
    top: 50%;
    left: 35%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: left;
    /* padding: 20px 30px; */

}

@media only screen and (min-width: 769px) and (max-width: 1024px) { 
   #nossosprodutos .card .text {
    color: white;
    position: absolute;
    top: 50%;
    left: 45%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: left;
    /* padding: 20px 30px; */

}
 }
 

  #nossosprodutos .card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 2.1em 0.5rem;
}

#nossosprodutos .card-title {
    margin-bottom: .15rem;
    min-width: 300px;
    padding-left: 50px;
}

#nossosprodutos .card-text {
    min-width: 280px;
    padding-left: 50px;
}

#nossosprodutos h3 {font-size: 1.55rem;}
#nossosprodutos .prod03 h3 {font-size: 1.45rem;}

 @media only screen and (max-width: 375px) {
	 
   #nossosprodutos .card .text {
    color: white;
    position: absolute;
    top: 50%;
    left: 45%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: left;
    /* padding: 20px 30px; */

}

#nossosprodutos h3 {font-size: 1.35rem;}
#nossosprodutos .prod03 h3 {font-size: 1.25rem;}

	 }


 /* 9. NOSSOS SERVIÇOS */

#nossosservicos {

    width: 100%;
    min-height: 540px;
    height: auto;
    background-color: c;
    background-image: url(../imagens/bg-nossosservicos.jpg);
    background-size: cover;
    background-position: top left;
    background-repeat: no-repeat;
    color: #fff;

}

#nossosservicos .card {
    border: 2px solid;
    background: rgba(7, 15, 34, 0.6)
}

#servicos .bg-info {background-color: #006FA9 !important;}

/* 6. NOTICIAS */

#noticias .card {margin: 20px auto;}
#noticias .card h3 {font-size: 1.2rem; font-weight: 600; }
#noticias .categorias { padding-bottom:5px; border-bottom: 1px solid #dcdcdc; margin-bottom: 20px; }
#noticias .card:hover {border: 1px solid #0059bd; box-shadow: 0 3px 20px 0 rgba(0,0,0,0.2); transition: all .3s ease 0s;}
#noticias .modal-body {padding: 1.5rem 1.5rem 0.8rem 1.5rem; text-align:center;}

.card .data-noticia {color: #d13d01; font-size: 1rem;}
.card .resumo {color: #717171; font-size: 1rem; line-height: 1.5rem;}
#noticias .btn-outline-primary {border: 2px solid #0082c6; padding: 12px 20px; color: #000; font-size: 1.1rem; font-weight: 600;}
#noticias .btn-outline-primary:hover, #noticias .btn-outline-primary:focus {border: 2px solid #0082c6; background-color: #0082c6; padding: 12px 20px; color: #fff; font-size: 1.1rem; font-weight: 600;}

.card a:focus {background-color: #0059bd; color: #fff;}

.card .noticias-new {
    position: absolute;
    font-size: 15px;
    z-index: 5;
    height: 30px;
    text-align: center;
    line-height: 26px;
    right: -7px;
    top: 10px;
    color: #ffffff;
    border-top-right-radius: 3px;
    background-color: #2fbbe9;
    width: 60px;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
}


.card .noticias-new::after {
    content: '';
    position: absolute;
    border-right: 6px solid transparent;
    border-bottom: none;
    border-top: 8px solid #0059bd;
    border-left: nonet;
    right: 0;
    bottom: -8px;
    z-index: 1;
}

@media only screen and (min-width: 560px) and (max-width: 768px)  {
#noticias .card {max-width: 70%;} }


 /* 9. PRODUTOS */

 #produtos .foto-produto {max-width: 350px; height: auto;}
 #produtos .card {border: none;}
 #produtos li { margin: 10px 0; }
 #produtos img.medidor { max-width: 90%;}

 .modal-dialog {
    width: 800px;
    max-width: 90%;
    margin: 1.75rem auto;

}

/* 8. CONTATO */

#contato .form-control {
background-color: #f8f8f8;
border: 1px solid #ccc;
}

#contato input.form-control {
    height: calc(2.65rem + 2px);
    }

#contato .form-control:focus  {
    border: 1px solid #0082c6;
    }

#contato h3#comochegar {font-size: 1.3em; margin: 35px 0 25px 0;}

#contato iframe {width: 100%; height: 450px;}
@media only screen and (min-width: 992px) {#contato iframe {width: 90%; height: 450px;} }

 #contato .box-contato {width: 100%;}
 @media only screen and (min-width: 992px) { #contato .box-contato {width: 90%;} }

#contato .lead {font-size: 1.8em;}
#contato .lead > div {font-size: 0.8em;}

#contato .btn-primary {

    border: 2px solid #0082c6;
    padding: 8px 20px;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    background-color: #0082c6;
    margin-right: 20px;

}

#contato .btn-primary:hover, #contato .btn-primary:focus {

    border: 2px solid #0082c6;
    padding: 8px 20px;
    color: #000;
    font-size: 1.1rem;
    font-weight: 600;
    background-color: #fff;
    margin-right: 20px;

}

#contato .btn-link {padding: 8px 20px;}


/* 12. FOOTER */

#voltartop .fa-sort-up {
	font-size: 1.6rem;
	vertical-align: middle;
	vertical-align: -moz-middle-with-baseline;}

footer { color: #fff;}
@media only screen and (max-width: 540px) { footer { text-align:center;}}
#rodape {background-color: #0d1e2d; padding: 40px 0; font-size:0.95rem;}
#rodape .container {padding-left: 0 !important; padding-right: 0 !important;}
#rodape .logo {max-width: 110px;}
#rodape h2 {font-size: 1.1rem; font-weight: 600;}
#rodape h3 {font-size: 1.05rem; font-weight: 600;}

#rodape .btn-outline-info {border: 2px solid #00a7ff; color: #fff; font-weight: 600;}
#rodape .btn-outline-info:hover, #rodape .btn-outline-info:focus {border: 2px solid #00a7ff; background-color: #00a7ff; color: #fff; font-weight: 600;}

#rodape a {color: #fff;}
#rodape a:hover, #rodape a:focus {color: #00a7ff}
#rodape a:visited {color: #ccc;}