@import url(http://fonts.googleapis.com/css?family=Viga); /*font-family: 'Viga', sans-serif;*/
@import url(http://fonts.googleapis.com/css?family=Oxygen:400,700); /*font-family: 'Oxygen', sans-serif;*/

body {
  background: #dcdcdc;
  color: #545454;
  font-family: Arial;
  font-size: 13px;
  margin: 0;
  padding: 0;
}

a {
  outline: none;
  color: #545454;
  text-decoration: none;
}
/*for FireFox*/
input[type="submit"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner {
  border: 0px;
}
/*for IE8 */
input[type="submit"]:focus,
input[type="button"]:focus {
  outline: none;
}
img {
  outline: none;
  border: 0px;
}
.clear {
  clear: both;
}
.error {
  color: #f00;
}
.text_decoration {
  text-decoration: none;
}
.text_decoration:hover {
  text-decoration: underline;
}
.hover_menu {
  -webkit-transition: all 100ms ease-out 100ms;
  -moz-transition: all 100ms ease-out 100ms;
  -o-transition: all 100ms ease-out 100ms;
  transition: all 100ms ease-out 100ms;
}
.left {
  float: left;
}
.right {
  float: right;
}

::-webkit-input-placeholder {
  opacity: 1;
}
::-moz-placeholder {
  opacity: 1;
} /* firefox 19+ */
:-ms-input-placeholder {
  opacity: 1;
} /* ie */
input:-moz-placeholder {
  opacity: 1;
}

.fonte_20_oxy_laranja {
  color: #f86300;
  font-family: "Oxygen", sans-serif;
  font-size: 20px;
  font-weight: bold;
}
.fonte_27_oxy_preta {
  color: #333;
  font-family: "Oxygen", sans-serif;
  font-size: 27px;
}

.fonte_18_Viga_preta {
  color: #120c0b;
  font-family: "Viga", sans-serif;
  font-size: 18px;
}
.fonte_26_viga_preta {
  color: #191713;
  font-family: "Viga", sans-serif;
  font-size: 26px;
}

#superior {
  width: auto;
  height: auto;
}
#inferior {
  width: auto;
  height: auto;
  background: url(files_index/bg/rodape.jpg) no-repeat top center;
}

#esquerda {
  width: 50%;
  height: 858px;
  background: url(files_index/bg/esquerda.jpg) no-repeat right top;
  position: absolute;
  z-index: 1;
  left: 1px;
  top: 0;
}
#direita {
  width: 50%;
  height: 858px;
  background: url(files_index/bg/direita.jpg) no-repeat left top;
  position: absolute;
  z-index: 1;
  right: 0px;
  top: 0;
}

#esquerda_interno {
  width: 50%;
  height: 199px;
  background: url(files_index/bg/esquerda-interno.jpg) no-repeat right top;
  position: absolute;
  z-index: 1;
  left: 1px;
  top: 0;
}
#direita_interno {
  width: 50%;
  height: 199px;
  background: url(files_index/bg/direita-interno.jpg) no-repeat left top;
  position: absolute;
  z-index: 1;
  right: 0px;
  top: 0;
}

#geral {
  width: 960px;
  height: auto;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

#cabecalho {
  width: auto;
  height: auto;
}
#cabecalho .logo {
  width: 193px;
  height: 76px;
  background: url(files_index/imagens/logo.png) no-repeat;
  display: block;
  float: left;
  margin: 45px 0 0 22px;
}
#cabecalho #menu {
  width: 680px;
  height: auto;
  float: right;
  margin: 60px 0 0;
}
#cabecalho #menu .menu {
  height: 40px;
  font-family: "Viga", sans-serif;
  font-size: 15px;
  color: #ffffff;
  display: block;
  float: left;
  padding: 0 17px;
}
#cabecalho #menu .menu:hover {
  border-bottom: 6px solid #f96302;
}
#cabecalho #menu .menu_marcado {
  height: 40px;
  font-family: "Viga", sans-serif;
  font-size: 15px;
  color: #ffffff;
  display: block;
  float: left;
  padding: 0 17px;
  border-bottom: 6px solid #f96302;
}
#cabecalho #menu .barra {
  width: 1px;
  height: 23px;
  background: url(files_index/imagens/barra-menu.png) no-repeat;
  float: left;
}

#banner {
  width: auto;
  height: 342px;
  background: url(files_index/bg/banner.png) no-repeat;
  margin: 95px 0 0 0;
}

#chamadas {
  width: auto;
  height: auto;
  position: absolute;
}
#chamadas .link {
  width: 221px;
  height: 323px;
  background: url(files_index/imagens/chamadas2.png) no-repeat top;
  display: block;
  padding: 6px;
  float: left;
  margin: 0 7px 0 0;
}
#chamadas .link:hover {
  background: url(files_index/imagens/chamadas2.png) no-repeat 0 -371px;
  color: #fff;
}
#chamadas .link:hover .fonte_18_Viga_preta {
  color: #fff;
}
#chamadas .texto {
  padding: 23px 13px 13px 13px;
}
#chamadas .fonte_18_Viga_preta {
  margin: 0 0 10px 0;
}

#rodape {
  width: 960px;
  height: auto;
  margin: 0 auto;
  display: table;
}
#rodape #tel_rodape {
  width: 644px;
  height: auto;
  margin: 48px 0 0 260px;
}
#tel_rodape .esquerda {
  width: 275px;
  height: 47px;
  float: left;
  background: url(files_index/imagens/ico-tel.png) no-repeat left center;
  padding: 0 0 0 60px;
}
#tel_rodape .direita {
  width: 240px;
  height: auto;
  float: right;
}
#rodape #rodape_baixo {
  width: auto;
  height: auto;
  margin: 80px 0 30px 0;
  color: #fff;
  font-size: 12px;
}
#rodape #rodape_baixo .barra {
  width: 1px;
  height: 33px;
  background: url(files_index/imagens/barra-rodape.png) no-repeat;
  float: left;
  margin: 27px 50px 0;
}

#conteudo {
  width: auto;
  height: auto;
  background: url(files_index/bg/conteudo-baixo.jpg) no-repeat bottom;
  padding: 0 0 23px 0;
  margin: 95px 0 0 0;
}
#conteudo .fundo {
  background: #fff;
  padding: 28px;
  border: 1px solid #e4e4e4;
}

#menu_lateral {
  width: 168px;
  height: auto;
  float: left;
}
#menu_lateral .menu {
  padding: 7px 17px;
  background: #fff;
  display: block;
  margin: 0 0 3px 0;
  border: 1px solid #dcdcdc;
  color: #5f7a4d;
  font-family: "Oxygen", sans-serif;
}
#menu_lateral .menu:hover {
  background: #658353;
  color: #fff;
}
#menu_lateral .sub_menu {
  padding: 7px 10px 7px 25px;
  background: #f0f0f0;
  display: block;
  margin: 0 0 3px 0;
  border: 1px solid #dcdcdc;
  color: #5f7a4d;
  font-family: "Oxygen", sans-serif;
}
#menu_lateral .sub_menu:hover {
  color: #f96302;
}
#menu_lateral .menu_marcado {
  padding: 7px 17px;
  background: #658353;
  color: #fff;
  display: block;
  margin: 0 0 3px 0;
  border: 1px solid #dcdcdc;
  font-family: "Oxygen", sans-serif;
}

#box_copa {
  width: auto;
  height: auto;
}
#box_copa .box {
  width: 265px;
  height: auto;
  float: left;
  margin: 30px 38px 0 0;
}

#revenda_stihl {
  width: auto;
  height: auto;
}
#revenda_stihl .direita {
  width: 100%;
  height: auto;
  float: right;
}
#revenda_stihl .direita .campos {
  width: 190px;
  height: 33px;
  float: left;
  border: 1px solid #dcdcdc;
  font-size: 13px;
  font-family: Arial;
  color: #525252;
  padding: 0 10px;
}
#revenda_stihl .direita .enviar {
  width: 40px;
  height: 35px;
  float: left;
  border: 1px solid #dcdcdc;
  font-size: 13px;
  font-family: Arial;
  color: #525252;
  background: #fff;
}
#revenda_stihl .direita .enviar:hover {
  color: #fff;
  background: #658353;
  cursor: pointer;
}
#revenda_stihl .direita .link {
  width: 230px;
  height: 142px;
  position: relative;
  float: left;
  margin: 10px 10px 0 0;
}
#revenda_stihl .direita .descri {
  width: 204px;
  position: absolute;
  bottom: 0;
  background: #658453;
  padding: 7px 13px;
  color: #fff;
  opacity: 0.9;
}
#revenda_stihl .direita .link:hover .descri {
  background: #f96302;
}

#box_racoes {
  width: auto;
  height: auto;
}
#box_racoes .direita {
  width: 711px;
  height: auto;
  float: right;
}
#box_racoes .direita .campos {
  width: 190px;
  height: 33px;
  float: left;
  border: 1px solid #dcdcdc;
  font-size: 13px;
  font-family: Arial;
  color: #525252;
  padding: 0 10px;
}
#box_racoes .direita .enviar {
  width: 40px;
  height: 35px;
  float: left;
  border: 1px solid #dcdcdc;
  font-size: 13px;
  font-family: Arial;
  color: #525252;
  background: #fff;
}
#box_racoes .direita .enviar:hover {
  color: #fff;
  background: #658353;
  cursor: pointer;
}
#box_racoes .direita .link {
  width: 231px;
  height: auto;
  float: left;
  margin: 10px 9px 0 0;
}
#box_racoes .direita .link .img {
  border: 1px solid #cdcdcd;
  text-align: center;
}
#box_racoes .direita .link .descri {
  background: #658453;
  padding: 7px 13px;
  color: #fff;
}
#box_racoes .direita .link:hover .descri {
  background: #f96302;
}

#box_fale_conosco {
  width: auto;
  height: auto;
}
#box_fale_conosco .esquerda {
  width: 232px;
  height: auto;
  float: left;
}
#box_fale_conosco .direita {
  width: 609px;
  height: auto;
  float: right;
  border: 1px solid #dcdcdc;
  padding: 20px;
}
#box_fale_conosco .direita .campos {
  width: 280px;
  height: 33px;
  border: 1px solid #dcdcdc;
  font-size: 13px;
  font-family: Arial;
  color: #525252;
  padding: 0 10px;
  margin: 0 0 5px 0;
}
#box_fale_conosco .direita .select {
  width: 89px;
  height: auto;
  border: 1px solid #dcdcdc;
  font-size: 13px;
  font-family: Arial;
  color: #525252;
  padding: 7px;
  margin: 0 0 0 6px;
}
#box_fale_conosco .direita .msg {
  width: 587px;
  height: 156px;
  border: 1px solid #dcdcdc;
  font-size: 13px;
  font-family: Arial;
  color: #525252;
  padding: 10px;
}
#box_fale_conosco .direita .enviar {
  width: 168px;
  height: 35px;
  float: right;
  border: 0;
  font-size: 13px;
  font-family: Arial;
  color: #fff;
  background: #658353;
  margin: 10px 0 0 0;
}
#box_fale_conosco .direita .enviar:hover {
  color: #525252;
  background: #dcdcdc;
  cursor: pointer;
}

.container {
  margin: 0 auto;
  width: 960px;
  height: 958px;
}

.gridLinhaProdutos h2 {
  color: #191713;
  font-family: "Viga", sans-serif;
  font-size: 26px;
  padding: 0 20px;
}
.gridLinhaProdutos p {
  max-width: 100ch;
  clear: both;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  margin-top: 10px;
  padding: 5px 20px;
}

.itemLinhaProdutos {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 15px;
  padding: 20px;
}

.produto {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border: 1px solid #627d52; /* Borda ao redor */
  border-radius: 5px;
  padding: 10px;
  width: 250px; /* Tamanho fixo opcional */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  transition: color 0.3s ease; /* Transição suave para a cor */
  text-decoration: none; /* Remove sublinhado dos links */
}

.produto img {
  width: 250px; /* Ajusta para caber dentro do container */
  height: 160px;
  object-fit: cover;
}

.produto p {
  margin-top: 10px; /* Espaço entre a imagem e o texto */
  font-size: 14px;
  font-weight: 500;
  color: #333;
  border-top: 1px solid #627d52; /* Borda acima do texto */
  padding-top: 10px;
  font-family: Arial, Helvetica, sans-serif;
  width: 100%; /* Garante que o texto e a borda ocupem todo o espaço horizontal */
  text-align: center;
  box-sizing: border-box; /* Inclui o padding no tamanho total */
}

/* Alteração de estilo ao passar o mouse sobre o produto */
/* Apenas o texto muda ao passar o mouse sobre o produto */
.produto:hover p {
  color: #f37a1f; /* Cor laranja ao passar o mouse */
}

.linkProduto {
  text-decoration: none; /* Remove sublinhado dos links */
}