﻿@charset "UTF-8";
/* CSS Document */

/*.row {
    margin-left: 0px;
    margin-right: 0px;
}*/

body {
    font-family: 'Lato', sans-serif !important;
    font-weight: 400;
}

*:focus {
    outline: none;
}

a:link, a:visited, a:active, a:hover {
	text-decoration:none;
}

.font-weight-black {
    font-weight: 900;
}

.btn-logo {
    position: relative;
    top: -38px;
    font-size: 20px;
}

.btn-background {
    position: absolute;
    right: 0px;
    font-size: 20px;
    padding: 10px;
}

.btn-profile {
    position: absolute;
    left: 670px;
    font-size: 20px;
}

#ProfileLogo {
    width: 100px;
}

.lgEmpresa {
    /* width: 100px;*/
    max-height: 100px;
}

.bg-IdCards-uno {
  /*  background-image: url("../img/bg_banner.jpg");*/
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 257px;
    margin-bottom: 24px;
    /*display: flex;*/ /* Si no se le coloca la clase flex-d desde el html es necesario colocarla desde aquí para permitir al objeto aceptar alineaciones flexibles */
    align-items: flex-end; /* Permite al objeto aceptar alineaciones flexibles */
	background-blend-mode: luminosity;
}

.bg-row-leonora {
    /*background-color: #f3705a;*/
}

.ttBlanco {
    color: #ffffff;
    font-size: 3rem;
    font-weight: 700;
}

.ttLeonora {
    /*color: #f3705a;*/
    font-size: 3rem;
    font-weight: 700;
}

/*.box-svg-bottom-banner {
    position: absolute;
    background-color: aqua;
}*/

/* Ordenador */
.svg-bottom-banner {
    position: absolute;
    display: block;
    width: 100%;
    height: 55px;
}

.svg-top-footer {
   /* fill:#f3705a;*/
    display: block;
    width: 100%;
    height: 55px;
}

.picId-box {
    /*height: fit-content;*/
    z-index: 1;
    background-color: none; /*tmp*/
    /*align-items: flex-end;*/
    height: 176px;
    display: flex; /* Permite al objeto aceptar alineaciones flexibles */
    /*align-self: flex-end; /* Alinea al objeto mismo hacia la parte baja del contendedor */
    align-items: flex-end; /* Funciona como contenedor para alinear a los elementos hacia abajo */
    
}

.picId-svg {
    position: absolute;
    height: 24px;
    /*display: flex;*/ /* Permite al objeto aceptar alineaciones flexibles */
    /*align-self: flex-end;*/ /* Alinea al objeto mismo hacia la parte baja del contendedor */
}

.picId {
    width: 176px;
    background-size: contain;
    border-radius: 88px;
    border: #ffffff 9px solid;
    -webkit-box-shadow: 0px 3px 12px #4b4b4b;
    -moz-box-shadow: 0px 3px 12px #4b4b4b;
    box-shadow: 0px 3px 12px #4b4b4b;
}

.txtNombre {
    color: #000203;
    font-weight: 400;
    font-size: 3rem;
}

.txtName {
    color: #000203;
    font-weight: 400;
    width: 275px;
}

.txtApellido {
    /*color: #f3705a;*/
    font-weight: 900;
    font-size: 3rem;
}

.txtLastName {
    /*color: #f3705a;*/
    font-weight: 900;
    width: 275px;
}

.txtProfile {
    color: #000203;
    font-weight: 400;
    font-size: 3rem;
    width: 275px;
}

.boxNombre {
    border-bottom: 1px solid #919292;
    display: flex;
}

.boxNombreAdmin {
    border-bottom: 0px solid #919292;
    display: flex;
}

.txtPuesto {
    color: #040006;
    font-weight: 900;
    font-size: 2rem;
}

.txtEmployment {
    color: #040006;
    font-weight: 900;
    width: 100%;
}

.txtEmpresa {
    color: #919292;
    font-weight: 400;
    font-size: 2rem;
}

.txtCompany {
    color: #919292;
    font-weight: 400;
    width: 100%;
}

.txtGral {
    /*color: #f3705a;*/
    font-weight: 400;
    font-size: 1.5rem;
}

.txtDescription {
    /*color: #f3705a;*/
    font-weight: 400;
    width: 100%;
}

/*.wrapperBtn {
    color: #f3705a;
    font-size: 3rem;
    width: 96px;
    height: 96px;
    background-color: #e3e3e1;
    border-radius: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.linkRedesSociales a,
.linkRedesSociales a:active,
.linkRedesSociales a:visited {
    /*color: #f3705a;*/
/*font-size: 3rem;*/
/*padding: 0px 0px 0px 0px;*/
/*text-decoration: none;*/
/*cursor: pointer;*/
/*transition: all 200ms;*/
/*display: inline-block;*/
/*margin: 0px 10px;
}*/
/*.linkRedesSociales a:hover {
	/*color: cyan;
	text-decoration: none;
}*/
.btnContacto,
.btnContacto:active,
.btnContacto:visited {
    color: #ffffff;
    font-size: 3rem;
    width: 96px;
    height: 96px;
    /*background-color: #f3705a;*/
    -moz-border-radius: 48px;
    -webkit-border-radius: 48px;
    border-radius: 48px;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: all 200ms;
}

.btnContacto:hover {
    color: #ffffff;
	background-color: #b9b9b9;
	text-decoration: none;
}

.txtBoton {
    color: #404142;
    font-size: 1rem;
    font-weight: 400;
}

.txtBotonInput {
    color: #404142;
    font-size: 1rem;
    font-weight: 400;
}

.txtWhatsAppCode {
    color: #404142;
    font-weight: 400;
    width: 20px;
}

.txtWhatsAppPhone {
    color: #404142;
    font-weight: 400;
    width: 149px;
}

.txtCallMe {
    color: #404142;
    font-weight: 400;
    width: 175px;
}

.txtMail {
    color: #404142;
    font-weight: 400;
    width: 175px;
}

.txtAddContact {
    color: #404142;
    font-weight: 400;
    width: 210px;
}

.compartirQR {
    width: 190px;
    max-height: 190px;
}

.cmbService {
    /*background-color: #f3705a !important;*/
    color: #fff !important;
    font-size: 2rem !important;
    padding: 0 .875rem !important;
    font-weight: 700 !important;
    border-bottom-width: 0px !important;
}

select.cmbService option {
    color: #fff;
    background-color: transparent;
}

.txtService {
    font-size: 2rem;
   /* background-color: #f3705a;*/
    color: #fff;
}

input.txtService::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #fff;
}

input.txtService:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #fff;
}

input.txtService::-ms-input-placeholder { /* Microsoft Edge */
    color: #fff;
}

.btn-service {
    font-size: 2rem;
}

.txtYouTube {
    font-size: 2rem;
    /*background-color: #f3705a;*/
    color: #fff;
    width: 100%;
}

input.txtYouTube::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #fff;
}

input.txtYouTube:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #fff;
}

input.txtYouTube::-ms-input-placeholder { /* Microsoft Edge */
    color: #fff;
}

.txtFacebook {
    color: #404142;
    font-weight: 400;
    width: 175px;
}

.txtInLinkedin {
    color: #404142;
    font-weight: 400;
    width: 175px;
}

.txtTwitter {
    color: #404142;
    font-weight: 400;
    width: 175px;
}

.txtInstagram {
    color: #404142;
    font-weight: 400;
    width: 175px;
}

.txtMatterYouTube {
    color: #404142;
    font-weight: 400;
    width: 175px;
}

.txtGoogleMap {
    font-size: 2rem;
    /*color: #404142;*/
    width: 100%;
}

.txtBotonInputTel {
    /*color: #404142;*/
    font-size: 1rem;
    font-weight: 400;
}

.txtWebSite {
    font-size: 2rem;
    /*color: #404142;*/
    width: 100%;
}

.btnRedesSociales,
.btnRedesSociales:active,
.btnRedesSociales:visited {
    /*color: #f3705a;*/
    font-size: 3rem;
    width: 96px;
    height: 96px;
    background-color: #e3e3e1;
    -moz-border-radius: 48px;
    -webkit-border-radius: 48px;
    border-radius: 48px;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: all 200ms;
}

.btnRedesSociales:hover {
    color: #ffffff;
	background-color: #b9b9b9;
	text-decoration: none;
}

.linkURL a:link,
.linkURL a:visited, 
.linkURL a:active {font-size:3rem;font-weight:700;font-family: 'Lato', sans-serif;}
.linkURL a:hover {font-size:3rem;font-weight:700;font-family: 'Lato', sans-serif;}

.linkFtr a:link,
.linkFtr a:visited, 
.linkFtr a:active {color:#ffffff;font-size:2rem;font-weight:700;font-family: 'Lato', sans-serif;}
.linkFtr a:hover {color:#ffffff;font-size:2rem;font-weight:700;font-family: 'Lato', sans-serif;}

.txtFtr {
    color: #ffffff;
    font-size: 1.5rem;
    font-weight: 400;
}

.lgIdCards {
    background-image: url('/assets/images/lg_idcards@2x.png');
    background-repeat: no-repeat;
    background-size: contain;
    width: 152px;
    height: 52px;
    cursor: pointer;
    display: block;
    opacity: 0.7;
    margin: 0 auto;
}

.hide {
    display: none !important;
}

.color_882b7c {
    background-color: #882b7c;
}

.color_c51f3d {
    background-color: #c51f3d;
}

.color_f3705a {
    background-color: #f3705a;
}

.color_d97823 {
    background-color: #d97823;
}

.color_fcb041 {
    background-color: #fcb041;
}

.color_113481 {
    background-color: #113481;
}

.color_009ddc {
    background-color: #009ddc;
}

.color_4294ab {
    background-color: #4294ab;
}

.color_54b9ce {
    background-color: #54b9ce;
}

.color_57616b {
    background-color: #57616b;
}

.color_919292 {
    background-color: #919292;
}

.color_e3e3e1 {
    background-color: #e3e3e1;
}

.color_2c662f {
    background-color: #2c662f;
}

.color_5cc871 {
    background-color: #5cc871;
}

#map-canvas { 
	width: 100%;
	height: 300px;
}

/* Tablets Landscape */
/*@media all and (max-width: 1024px){
    
}*/
/* Tablets Portrait */
/*@media all and (max-width: 768px){
    
}*/
/* Smartphones Landscape */
/*@media all and (max-width: 568px){
    
}*/
/* Smartphones Portrait */
/*@media all and (max-width: 320px){

}*/
/** SEGUNDO COMPORTAMIENTO - Tablets Portrait  **/
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .txtNombre {
        font-size: 2rem;
    }

    .txtName {
        width: 175px;
    }

    .txtApellido {
        font-size: 2rem;
    }

    .txtLastName {
        width: 175px;
    }

    .txtProfile {
        font-size: 2rem;
        width: 175px;
    }
    
    .txtPuesto {
        font-size: 1.5rem;
    }

    .txtEmpresa {
        font-size: 1.5rem;
    }

    .txtCompany {
        /*width: 435px;*/
    }
    
    .txtGral {
        font-size: 1.2rem;
    }

    .txtWhatsApp {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtCallMe {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtMail {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtAddContact {
        width: 113px;
        font-size: 0.8rem;
    }

    .cmbService {
        font-size: 1.5rem !important;
    }

    .txtService {
        font-size: 1.5rem !important;
    }

    .txtYouTube {
        font-size: 1.5rem !important;
    }

    .btn-service {
        font-size: 1.5rem;
    }

    .txtFacebook {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtInLinkedin {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtTwitter {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtInstagram {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtMatterYouTube {
        width: 113px;
        font-size: 0.8rem;
    }

    .txtGoogleMap {
        font-size: 1.5rem !important;
    }

    .TxtWebSite {
        font-size: 1.5rem !important;
    }

    .ttBlanco {
        font-size: 2rem;
    }
    
    .ttLeonora {
        font-size: 2rem;
    }
    
    .linkURL a:link,
    .linkURL a:visited, 
    .linkURL a:active {font-size:2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    .linkURL a:hover {font-size:2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    
    .linkFtr a:link,
    .linkFtr a:visited, 
    .linkFtr a:active {color:#ffffff;font-size:1.2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    .linkFtr a:hover {color:#ffffff;font-size:1.2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    
    .txtFtr {
        font-size: 1.2rem;
    }
    
}

/*** TERCER COMPORTAMIENTO - Smartphones Landscape ***/
@media screen and (min-width: 576px) and (max-width: 767px) {
    
}

/**** CUARTO COMPORTAMIENTO - Smartphones Portrait ****/
@media screen and (min-width: 0px) and (max-width: 575px) {

    .svg-bottom-banner {
        width: 100%;
    }

    .txtNombre {
        font-size: 1rem;
    }

    .txtName {
        width: 100px;
    }

    .txtApellido {
        font-size: 1rem;
    }

    .txtLastName {
        width: 100px;
    }

    .txtProfile {
        font-size: 1rem;
        width: 100px;
    }

    .txtPuesto {
        font-size: 1rem;
    }

    .txtEmpresa {
        font-size: 1rem;
    }

    .txtCompany {
        /*width: 245px;*/
    }

    .txtGral {
        font-size: 1rem;
    }

    .txtDescription {
        width: 100%;
    }
    
    .btnContacto,
    .btnContacto:active,
    .btnContacto:visited {
        font-size: 2rem;
        width: 64px;
        height: 64px;
        -moz-border-radius: 25px;
        -webkit-border-radius: 25px;
        border-radius: 32px;
    }

    .btnContacto:hover {
        color: #ffffff;
        background-color: #b9b9b9;
        text-decoration: none;
    }
    
    .txtBoton {
        color: #404142;
        font-size: .5rem;
        font-weight: 700;
    }

    .txtBotonInput {
        color: #404142;
        font-size: .6rem;
        font-weight: 700;
    }

    .txtBotonInputTel {
        /*color: #404142;*/
        font-size: .6rem;
        font-weight: 700;
    }

    .txtWhatsApp {
        width: 113px;
    }

    .txtCallMe {
        width: 113px;
    }

    .txtMail {
        width: 113px;
    }

    .txtAddContact {
        width: 113px;
    }

    .cmbService {
        font-size: 1rem !important;
    }

    .txtService {
        font-size: 1rem !important;
    }

    .txtYouTube {
        font-size: 1rem !important;
    }

    .btn-service {
        font-size: 1rem;
    }

    .txtFacebook {
        width: 90px;
    }

    .txtTwitter {
        width: 90px;
    }

    .txtInLinkedin {
        width: 90px;
    }

    .txtInstagram {
        width: 90px;
    }

    .txtMatterYouTube {
        width: 90px;
    }

    .txtGoogleMap {
        font-size: 1rem !important;
    }

    .TxtWebSite {
        font-size: 1rem !important;
    }

    .ttBlanco {
        font-size: 1rem;
    }
    
    .ttLeonora {
        font-size: 1rem;
    }
    
    .btnRedesSociales,
    .btnRedesSociales:active,
    .btnRedesSociales:visited {
        font-size: 1.5rem;
        width: 48px;
        height: 48px;
        -moz-border-radius: 24px;
        -webkit-border-radius: 24px;
        border-radius: 24px;
    }

    .btnRedesSociales:hover {
        color: #ffffff;
        background-color: #b9b9b9;
        text-decoration: none;
    }
    
    .linkURL a:link,
    .linkURL a:visited, 
    .linkURL a:active {font-size:1.2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    .linkURL a:hover {font-size:1.2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    
    .linkFtr a:link,
    .linkFtr a:visited, 
    .linkFtr a:active {color:#ffffff;font-size:1.2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    .linkFtr a:hover {color:#ffffff;font-size:1.2rem;font-weight:700;font-family: 'Lato', sans-serif;}
    
    .txtFtr {
        font-size: 1rem;
    }
}




