/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Aug 31, 2020, 10:08:54 AM
    Author     : axelobscura
*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;900&display=swap');

body {
    font-family: 'Roboto', sans-serif;
}

.btn.cuenta {
    background: rgb(255,198,9);
    background: linear-gradient(355deg, rgba(255,198,9,1) 0%, rgba(255,241,0,1) 100%);
    border-radius: 50px;
    margin-top: 10px;
    font-size: 0.7rem;
    transition: all 1s;
    font-weight: bold;
}
.btn.cuenta:hover {
    background: #111;
    color:#fff;
}
.btn.ingresa {
    color: rgb(255,198,9);
    margin-top: 10px;
    font-size: 0.7rem;
    font-weight: bold;
}
ul.menuprincipal {
    list-style: none;
    width: 100%;
    display: flex;
    padding: 5px;
    background: #000;
    padding-bottom: 10px;
}
ul.menuprincipal li a {
    color: #fff;
    font-size: 0.8rem;
    transition: all 1s;
    padding: 10px;
    border-radius: 10px;
}
ul.menuprincipal li a:hover {
    color: rgb(255,198,9);
    text-decoration: none;
    background: #333;
}


.show-neighbors {
  overflow: hidden;
}

.multi-item-carousel {
  overflow: hidden;
}
.multi-item-carousel .carousel-indicators {
  margin-right: 25%;
  margin-left: 25%;
}
.multi-item-carousel .carousel-control-prev,
.multi-item-carousel .carousel-control-next {
  background: rgba(255, 255, 255, 0.3);
  width: 25%;
  z-index: 11; /* .carousel-caption has z-index 10 */
}
.multi-item-carousel .carousel-inner {
  width: 150%;
  left: -25%;
}
.multi-item-carousel .carousel-item-next:not(.carousel-item-left),
.multi-item-carousel .carousel-item-right.active {
  -webkit-transform: translate3d(33%, 0, 0);
  transform: translate3d(33%, 0, 0);
}
.multi-item-carousel .carousel-item-prev:not(.carousel-item-right),
.multi-item-carousel .carousel-item-left.active {
  -webkit-transform: translate3d(-33%, 0, 0);
  transform: translate3d(-33%, 0, 0);
}
.multi-item-carousel .item__third {
  float: left;
  position: relative;
  width: 33.33333333%;
}

.container.entrada.listado {
    text-align: center;
}
.container.entrada.listado h1 {
    padding: 5px;
    margin: 10px 0;
    box-shadow: 0 0 5px #777;
    margin-top: 15px;
    margin-bottom: 15px;
    background: #fff;
}
.card {
    margin: 10px 0;
    box-shadow: 0 2px 5px #555;
}
.card-header {
    background: #fff;
}
.card-footer .btn.btn-primary {
    background: #ffd800;
    color: #111;
    border:0;
    font-weight: bold;
}
h5.card-title {
    font-weight: bold;
}
.container-fluid.pb-3.productos {
    background: #fff;
    background: url(../images/herramientas.jpg) no-repeat;
    background-size: 400px;
}
.container-fluid.entrada.categos {
    background: #EFEFEF; 
    text-align: center;
    box-shadow: 0 0 10px #777;
}
.container-fluid.entrada.categos .container h1.eltiter {
    padding: 10px;
    background: rgb(255,198,9);
    background: linear-gradient(355deg, rgba(255,198,9,1) 0%, rgba(255,241,0,1) 100%);
    color: #111;
    margin-bottom: 0;
}

.container-fluid.pagos {
    background: #333;
    padding: 15px 0;
}
.footer {
    background: rgb(255,198,9);
    background: linear-gradient(355deg, rgba(255,198,9,1) 0%, rgba(255,241,0,1) 100%);
    padding: 10px;
    font-weight: bold;
}
.buscador .form-group {
    margin:0;
    padding:20px ;

    &:first-child { border-color: transparent; }
}

.buscador .form-control {
  padding: 0px 10px 0 20px;
  margin-top: 10px;
  color: #333;
  font-size: 28px;
  font-weight: 500;
    border: 3px solid #555;
    -webkit-box-shadow: none;
    box-shadow: none;
    min-height:60px;
    height: auto;
    border-radius: 50px 0  0 50px !important;
}
.buscador .form-control :focus {
        -webkit-box-shadow: none;
        box-shadow: none;
        border-color: transparent;

    }

.buscador #searchbtn
{   border:0;
    padding: 0px 10px;
    margin-top: 10px;
    color: #fff;
    background:#111;
    font-size: 17px;
    font-weight: 500;
    border: 3px solid #555;
    border-left: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    min-height:60px;
    height: auto;
    border-radius: 0 50px 50px 0 !important;
}

a.latBtn {
    background: #fedd00;
    color:#111;
    border-radius: 50px;
    width: 100%;
    padding: 10px;
    margin: 5px;
    display: block;
    font-weight: bold;
}

.col-md-3.lateral ul {
    list-style: none;
    text-align: left;
    color:#333;
}

.col-md-3.lateral ul li a {
    color: #111111;
    width: 100%;
    display: block;
    margin: 5px;
    font-weight: bold;
    transition: all 1s;
}

.col-md-3.lateral ul li a:hover {
    color: #555;
    text-decoration: none;
}
.col-md-3.lateral h3 {
    font-size: 1rem;
    padding: 10px;
    text-align: left;
    font-weight: bold;
    border-bottom: 1px solid #ccc;
}
.container.producto p {
    padding: 10px 0;
    padding-bottom: 0;
}
h4.naranja {
    background: #fe2d02;
    color: #fff;
    font-weight: bold;
    padding: 10px;
}
.container-fluid.bannerentra {
    background-image: url("../images/ingeniero.jpg"); /* The image used */
    background-color: #cccccc; /* Used if the image is unavailable */
    height: 500px; /* You must set a specified height */
    background-position: center center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

.container-fluid.bannerentra h2 {
    margin-top: 200px;
    display: block;
}

.d-flex.promocoder .lnr {
    color: #3db450;
    font-weight: bold;
    font-size: 1.5rem;
    margin-right: 10px;
}

.d-flex.promocoder p {
    color: #3db450;
    padding-top: 13px;
}

#navbarTogglerDemo01 ul.dropdown-menu li a {
    color: #222;
    margin: 2px 5px;
    padding: 5px 10px;
    transition: all 1s;
    width: 100%;
    display: block;
    width: 100%;
}

#navbarTogglerDemo01 ul.dropdown-menu li a:hover {
    background: #111;
    color: #fff;
    text-decoration: none;
}

/* Partners carousel: uniform image height */
.brands_item {
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.brands_item img {
    height: 100px; /* mismo alto para todas */
    width: auto;  /* permitir que el ancho varíe */
    object-fit: contain;
}

.container-fluid.dfabrica {
    background: #FFD800;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.container-fluid.dfabrica h2 {
    font-weight: bold;
}

.btn.btn-primary.login {
    background: #ffd800;
    color: #111;
    border: 0;
    font-weight: 100;
}