@charset "UTF-8"; /* ESTILOS GENERALES */

body { font-family:regular; font-size:1em; color:#555; background:#fff; 

    /*VARIABLES*/
    --color-white: #fff; 
    --color-black: #000;
    --color-gray: #777;
    --color-lihgt: #aaa;

    --color-prim:#E20513;
    --color-sec: #FFEC00;
    --color-ter: #4B4B4D;

    --color-facebook:#3b5998;
    --color-youtube: #e62117;
    --color-twitter: #00acee;
    --color-instagram:#dd2a7b;
    --color-whatsapp:#25d366;
    --color-mail:#0072c6;
    /*background-color: var(--color-prim); */
    }

/*PARA ESTRUTUCTURA GENERAL*/
h1{font-family: bold; font-size: 2.5em; font-weight: normal;}
h2{font-family: bold; font-size: 1.5em; line-height: 1; font-weight: normal;}
h3{font-family: bold; font-size: 1.3em; line-height: 1; font-weight: normal;}

p{line-height: 1.4; font-family: regular;} /*Define un párrafo  */
q{font-family: light; font-style: italic; display: block; } 	/*Define una cita corta*/

b{font-family: bold; font-weight: normal;} /*Define texto en negrita*/
i{font-family: light; font-style: normal;} /*Define una parte del texto de modo alternativo*/
u{color: var(--color-sec); text-decoration: none;} /* Muestra el texto subrayado para Fragmento de texto para nombres propios o escritura incorrecta intencionada (sic). */
em{color:var(--color-prim); font-style: normal;} /*Define énfasis en un texto*/
strong{font-family: black; color:var(--color-prim);} /*Define un texto en negrita - adiferencia de <b> es texto que engloba se tiene que reforzar.*/
mark {background-color: var(--color-prim); color:var(--color-white); font-family: bold; padding: 2px 7px;} /*Define texto resaltado o marcado*/

address {font-style: normal;}     /*Define la información de contacto del autor / propietario del documento*/
/*<menu>        Define la lista de un menú*/
/*<option> 	    Define una opción en una lista desplegable*/
/*<s> 	        Define texto que no es correcto*/
/*<sub> 	    Define un texto que es subíndice*/
/*<sup> 	    Define un texto que es superíndice*/

/*PARA FORMULARIOS*/
input[type=text], textarea {/*padding:12px 20px;*/ margin:8px 0; border: 1px solid #eee; font-family: regular; font-size: 0.9em;}
    input[type=text]:focus, textarea:focus {box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);}
input[type=submit] {font-family: regular; font-size: 0.8em; padding:12px 20px; margin:8px 0; background-color: var(--color-sec); color: var(--color-white); cursor: pointer; transition: 0.2s Ease-in-out; }
    input[type=submit]:hover {font-family: bold; background-color: var(--color-sec); box-shadow: 0px 0px 10px 0px rgba(229,204,162,1); transform: scale(1.1);}

    .inputTextarea{ resize: vertical; width: 100%; height: 300px; padding:12px 20px; border-radius: 4px;}
    .inputNormal{width: 100%; padding:12px 20px; border-radius: 4px;}
    .inputSearch{width: 100%; padding:12px 20px 12px 40px; border-radius: 4px 0px 0px 4px; background: url(../simg/--search.png) no-repeat 10px center;}

/* ESTILO DE LA FUENTE TIPOGRAFICA: Todas los estilos, estan basado en los mismos nombre: 
        font-family:regular;
        font-family:bold;
        font-family:light;
        font-family:special;*/
@font-face { font-family: 'regular';
    src: url('../sfont/montserrat-medium-webfont.eot');
    src: url('../sfont/montserrat-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../sfont/montserrat-medium-webfont.woff') format('woff'),
         url('../sfont/montserrat-medium-webfont.ttf') format('truetype'),
         url('../sfont/montserrat-medium-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face { font-family: 'bold';
    src: url('../sfont/montserrat-bold-webfont.eot');
    src: url('../sfont/montserrat-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../sfont/montserrat-bold-webfont.woff') format('woff'),
         url('../sfont/montserrat-bold-webfont.ttf') format('truetype'),
         url('../sfont/montserrat-bold-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face { font-family: 'black';
    src: url('../sfont/montserrat-black-webfont.eot');
    src: url('../sfont/montserrat-black-webfont.eot?#iefix') format('embedded-opentype'),
            url('../sfont/montserrat-black-webfont.woff') format('woff'),
            url('../sfont/montserrat-black-webfont.ttf') format('truetype'),
            url('../sfont/montserrat-black-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;}
    
@font-face { font-family: 'light';
    src: url('../sfont/montserrat-light-webfont.eot');
    src: url('../sfont/montserrat-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../sfont/montserrat-light-webfont.woff') format('woff'),
         url('../sfont/montserrat-light-webfont.ttf') format('truetype'),
         url('../sfont/montserrat-light-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face { font-family: 'softicon';
    src: url('../sfont/softsitesfont_iconsb-webfont.eot');
    src: url('../sfont/softsitesfont_iconsb-webfont.eot?#iefix') format('embedded-opentype'),
            url('../sfont/softsitesfont_iconsb-webfont.woff') format('woff'),
            url('../sfont/softsitesfont_iconsb-webfont.ttf') format('truetype'),
            url('../sfont/softsitesfont_iconsb-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;}