/*
Theme: Famatex
Version: 1.0
Date: 18/04/2020
Developer: Brian Gamboa
*/

html {
    box-sizing: border-box;
    font-size: 62.5%;
    /** Reset para REMS - 62.5% = 10px de 16px **/
    scroll-behavior: smooth;
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

body {
    margin: 0;
    padding: 0;
    line-height: 1.7;
    color: var(--color-gris-famatex);
    position: relative;
    font-family: "Montserrat", sans-serif;
    /* background-color: var(--color-gris-claro); */
}

/* Variables */

:root {
    --color-rojo: #E60032;
    --color-verde: #00af46;
    --color-verde-famatex: #4BB597;
    --color-gris-famatex: #393939;
    --color-amarillo-famatex: #FFB344;
    --color-rojo-famatex: #E60032;
    --color-azul: #0779ea;
    --color-blanco: #ffffff;
    --color-gris: #ECECEC;
    --color-gris-claro: #f3f5f6;
    --swiper-theme-color: #36A287 !important; 
}

/* Globales */

html h1 {
    font-size: 3.4rem;
}

html h2 {
    font-size: 3rem;
}

html h3 {
    font-size: 2.4rem;
}

html h4 {
    font-size: 1.4rem;
}

p {
    font-size: 1.5rem;
}

img {
    max-width: 100%;
}

video {
    max-width: 100%;
}

.conteiner {
    max-width: 120rem;
    width: 95%;
    margin: 0 auto;
}

/* Utilidades */

.grayscale {
    filter: grayscale(1);
    -webkit-filter: grayscale(1);
}
.button {
    background-color: var(--color-amarillo-famatex);
    color: var(--color-gris-famatex);
    padding: 0.8rem 3rem;
    text-decoration: none;
    display: block;
    border-radius: 3rem;
    font-size: 1.5rem;
    text-align: center;
    font-weight: 600;
    border: none;
    cursor: pointer;
}
.header-button {
    padding: 0.9rem 3rem;
    display: none;
    font-size: 1.6rem;
    text-decoration: none;
    border-radius: 3rem;
    line-height: 1;
    line-break: strict;
    /* animation-duration: 1s;
    animation-name: wpIcon;
    animation-iteration-count: infinite;*/
    background-color: var(--color-amarillo-famatex);
    color: var(--color-gris-famatex); 
}

@media (min-width: 990px) {
    .header-button {
       display: block;
    }
}

.button.button-agregar-cliente {
    width: 100%;
    height: 4rem;
    padding: 1rem 4rem;
    font-size: 1.6rem;
}

.button-chatear {
    background-color: var(--color-verde-famatex);
    color: var(--color-blanco);
}

.button .fab.fa-whatsapp {
    margin-right: 1rem;
    font-size: 2rem;
}

.margin-r {
    margin-right: 1rem;
}

.color-verde {
    color: var(--color-verde-famatex);
}

.bandera {
    width: 20px;
    margin-left: 8px;
}

.oferta-si::before {
    content: '';
}

.opacity {
    opacity: 0.5;
}

.inline-block {
    display: inline-block;
}

.overflow-hidden {
    overflow: hidden;
}

/* Scroll */

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: #fbfbfe;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #c8cdd0;
}

::-webkit-scrollbar-thumb:hover {
    background: #a0a7ac;
}
/* Formularios */
.formulario label span{
    display: block;
    color: var(--color-negro);
    font-size: 1.2rem;
    line-height: 1.8;
}
.formulario input, .formulario select{
    display: block;
    border-radius: 10px;
    border: 1px solid var(--color-plomo);
    font-size: 1.5rem;
    padding:12px 15px ;
    width: 100%;
    height: 44px;
  
}
.input-file{
    background-color: var(--color-blanco); 
}
.formulario textarea{
    display: block;
    border-radius: 10px;
    border: 1px solid var(--color-plomo);
    font-size: 1.5rem;
    padding:12px 15px ;
    width: 100%;
    height: 100px;
    max-width: 490px;
}
.formulario input.boton{
    border: none;
}