/* Estilos del login */
.columnaImagen {
        display: flex;
		float: left;
        width: 50%;
        height: calc(100vh - 40px);
        flex-direction: column;
        background: linear-gradient(90deg, rgb(224 42 88) 0%, rgb(190 0 49) 100%);
        margin-top: 20px;
    	margin-left: 20px;
    	border-radius: 20px 0px 0px 20px;
    	overflow: hidden;
}

.imgPrincipal {
    margin: auto;
    margin-bottom:0;
    width: 84%;
    z-index: 10;
}

.logoHeinsohnBlanco {
    position: relative;
    top: 0;
    width: 278px;
    height: 81px;
    margin: auto;
   	opacity: 1;
   	z-index: 10;
}

.cardLogin {
    padding: 40px;
    box-shadow: 0px 0px 20px #d8e5fd67;
    text-align: center;
    border-radius: 20px
}
.containerImgRound {
    position: absolute;
    height: calc(100vh - 40px);
    width: 50%;
    margin-top: 20px;
    margin-left: 20px;
    overflow: hidden;
    border-radius: 20px;
}

.imgRound {
    position: relative;
    border-radius: 50%;
    background-color: #E02A58;
    opacity: .5;
    z-index: 0;
}

hr.lineaVertical {
	display: none;
    background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
    margin-top: 0px;
    margin-bottom: 0px;
    position: absolute;
    top: 22px;
    left: 59.4667vw;
    width: 33px;
   	height: 2px;
    opacity: 1;
}

.tituloHeinsohn {
	display: none;
    margin-top: 0px;
    margin-bottom: 0px;
   	position: absolute;
    top: 18px;
    right: 8vw;
    font-size: 3.73334vw;
    color: #FFFFFF;
}

.tituloHcm {
	display: none;
    margin-top: 0px;
   	margin-bottom: 0px;
   	position: absolute;
   	top: 27px;
   	right: 8vw;
   	font-size: 8.53334vw;
    color: #FFFFFF;
}

img.imagenPrincipal {
    width: 100%;
	height: 100vh;
}
        
.imagenHeinsohn {
	width: 50%;
   	position: absolute;
    bottom: 0;
    left: 0;
}

.columnaLogin {
    display: flex;
    justify-content: center;
    position: absolute;
    right: 0;
    width: 50%;
	height: 100%;
}

#messages {
	position: absolute;
    top: 0;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 363px;
    height: 79px;
    background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
	border-radius: 0px 0px 5px 5px;
	opacity: 1;	
}

.mensajeError {
	display: block;
	position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 75px;
    margin-right: 20px;
	font-size: 14px;
	color: #FFFFFF;
	opacity: 1;
}

img.iconoError {
	position: absolute;
	top: 22px;
	left: 20px;
	width: 35px;
	height: 35px;
}

.columnaFormularioLogin {
   	width: 72%;
	margin: auto;
}

h1.tituloUno {
	font-size: 35px;
    font-weight: bold;
    font-family: 'Montserrat', bold;
    margin-top: 0px;
    margin-bottom: 0px;
   	color: #3E3E3C;
}

h1.tituloDos {
	font-size: 35px;
   	font-weight: bold;
    margin-top: 0px;
    margin-bottom: 0px;
    color: #3E3E3C;
}

hr.lineaHorizontal {
	width: 33px;
    height: 2px;
    background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
    opacity: 1;
    margin: auto;
    margin-top: 11px;
   	margin-bottom: 0px;
}

p.saludo {
  	font-size: 20.4px;
    font-weight: bold;
   	margin-top: 35px;
    margin-bottom: 0px;
    color: #3E3E3C;
}

p.bienvenida {
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 0px;
	color: #3E3E3C;
}

.form-horizontal .form-group {
  	margin-right: 0px;
	margin-left: 0px;
}

img.iconoUsuario {
	position: absolute;
    top: 11px;
    width: 14px;   
   	height: 14px;
   	left: 0;
}

.usuario {
   	font-size: 14px;
   	padding-left: 26px;
}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	transition: background-color 5000s ease-in-out 0s;
}

/* Sirve para eliminar los botones de limpiar input y ver contrase�a que genera Internet Explorer por defecto */
/* Internet Explorer */
input::-ms-clear, input::-ms-reveal {
	display: none;
}

input[type="email"], select.form-control {
	background: transparent;
    border: none;
   	border-bottom: 1px solid #E9E9EA;
   	-webkit-box-shadow: none;
   	box-shadow: none;
  	border-radius: 0;
}

input[type="email"]:focus, select.form-control:focus {
  	-webkit-box-shadow: none;
   	box-shadow: none;
}

img.iconoContrasenia {
 	position: absolute;
  	top: 11px;
  	width: 14px;
  	height: 14px;
  	left: 0;
}

img.iconoOculto {
  	position: absolute;
 	top: 11px;
   	right: 8px;
   	width: 14px;
  	height: 14px;
} 

.contrasenia {
   	font-size: 14px;
 	padding-left: 26px;
}

input[type="password"], select.form-control {
   	background: transparent;
   	border: none;
   	border-bottom: 1px solid #E9E9EA;
  	-webkit-box-shadow: none;
   	box-shadow: none;
  	border-radius: 0;
}

input[type="password"]:focus, select.form-control:focus {
   	-webkit-box-shadow: none;
  	box-shadow: none;
}

input[type="text"], select.form-control {
   	background: transparent;
   	border: none;
  	border-bottom: 1px solid #E9E9EA;
  	-webkit-box-shadow: none;
   	box-shadow: none;
 	border-radius: 0;
}

input[type="text"]:focus, select.form-control:focus {
   	-webkit-box-shadow: none;
  	box-shadow: none;
}

label.cajaRecordar {
   	font-size: 14px;
  	color: #3E3E3C;
}

.ingresar {
  	width: 259px;
  	height: 45px;
  	border-radius: 10px;
   	font-size: 18px;
   	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
   	opacity: 1;
    margin-top: 20px;
    margin-bottom: 0px;
 	color: #FFFFFF;
}

a.recuperarContrasenia {
  	font-size: 14px;
  	color: #DB2452;
 	text-decoration: underline;
}

.columnaLogoHeinsohnGris {
   	display: flex;
   	justify-content: center;
 	margin-bottom: 0px;
  	position: absolute;
  	left: 0px;
  	right: 0px;
}

img.logoHeinsohnGris {
   	width: 140px;
 	height: 42px;
  	margin-top: 38px;
 	margin-bottom: 0px;
}

@media screen and (min-width: 1025px) and (max-height: 656px) { 
	.columnaImagen {
     	position: relative;
   	}
   	img.imagenPrincipal {
    	height: 657px;
    }
    .imagenHeinsohn {
    	width: 100%;
    }
    .columnaFormularioLogin {
   		margin-top: 84.5px;
   	}
}

/* Responsive login */
@media screen and (max-width: 1025px) {
    .containerImgRound {
        border-radius: 20px;
    }
}

/* iPhone 5/SE */
@media screen and (max-width: 320px) { 
	.columnaImagen {
       	float: left;
        width: 100%;
     	height: 100%;
 	}
 	img.logoHeinsohnBlanco {
       	position: absolute;
      	top: 20px;
     	left: 9.375vw;
       	width: 46.5625vw;
       	height: 43px;
     	opacity: 1;
  	}
  	hr.lineaVertical {
       	display: block;
       	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
       	margin-top: 0px;
       	margin-bottom: 0px;
       	position: absolute;
       	top: 22px;
      	left: 61.875vw;
      	width: 0.625vw;
      	height: 40px;
     	opacity: 1;
 	}
 	.tituloHeinsohn {
      	display: block;
      	margin-top: 0px;
      	margin-bottom: 0px;
      	position: absolute;
       	top: 18px;
    	right: 9.375vw;
       	font-size: 4.375vw;
    	color: #FFFFFF;
   	}
   	.tituloHcm {
       	display: block;
       	margin-top: 0px;
      	margin-bottom: 0px;
      	position: absolute;
       	top: 27px;
       	right: 9.375vw;
      	font-size: 10vw;
     	color: #FFFFFF;
  	}
  	.imagenPrincipalContainer {
     	width: 100%;
      	height: 100vh;
  	}
  	.imagenHeinsohn {
  		display: none;
   	}
   	.columnaLogin {
       	display: flex;
      	justify-content: center;
      	position: absolute;
       	right: 0;
       	width: 81.25vw;
       	height: 78.346vh;
       	margin-right: 30px;
      	background: #FFFFFF 0% 0% no-repeat padding-box;
      	border-radius: 5px;
      	opacity: 1;
     	bottom: 30px;
   	}
   	#messages {
		position: fixed;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	width: 81.25vw;
    	height: 79px;
    	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
		border-radius: 0px 0px 5px 5px;
		opacity: 1;	
	}
	.mensajeError {
		display: block;
		position: absolute;
    	top: 50%;
    	transform: translateY(-50%);
    	margin-left: 23.4375vw;
    	margin-right: 6.25vw;
		font-size: 4.0625vw;
		color: #FFFFFF;
		opacity: 1;
	}
	img.iconoError {
		position: absolute;
		top: 22px;
		left: 6.25vw;
		width: 10.9375vw;
		height: 35px;
	}
   	.columnaFormularioLogin {
     	width: 70.3125vw;
     	margin: auto;
  	}
  	h1.tituloUno {
       	font-size: 8.09375vw;
      	font-weight: bold;
     	margin-top: 0px;
       	margin-bottom: 0px;
      	color: #3E3E3C;
  	}
  	h1.tituloDos {
      	font-size: 6.71875vw;
      	font-weight: bold;
     	margin-top: 0px;
      	margin-bottom: 0px;
      	color: #3E3E3C;
  	}
  	hr.lineaHorizontal {
      	width: 28.75vw;
      	height: 4px;
      	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
      	opacity: 1;
      	margin-top: 6px;
     	margin-bottom: 0px;
  	}
  	p.saludo {
       	font-size: 5.3125vw;
       	font-weight: bold;
       	margin-top: 5px;
     	margin-bottom: 0px;
      	color: #3E3E3C;
   	}
   	p.bienvenida {
      	font-size: 3.75vw;
       	text-align: justify;
       	margin-top: 5px;
       	margin-bottom: 0px;
    	color: #3E3E3C;
   	}
   	.form-horizontal .form-group {
      	margin-right: 0px;
      	margin-left: 0px;
   	}
   	.form-group {
      	margin-bottom: 10px;
   	}
   	.form-horizontal {
    	margin-top: 10px !important;
   	}
   	img.iconoUsuario {
       	position: absolute;
       	top: 11px;
     	width: 4.375vw;   
      	height: 14px;
  	}
  	.usuario {
       	font-size: 3.75vw;
     	padding-left: 8.125vw;
 	}
 	img.iconoContrasenia {
      	position: absolute;
       	top: 11px;
       	width: 4.375vw;
       	height: 14px;
  	}
  	img.iconoOculto {
      	position: absolute;
      	top: 11px;
       	right: 2.5vw;
      	width: 4.375vw;
       	height: 14px;
  	}
  	.contrasenia {
      	font-size: 3.75vw;
  		padding-left: 8.125vw;
  	}
  	input[type=checkbox], input[type=radio] {
     	margin: 2px 0 0;
  	}
  	label.cajaRecordar {
      	font-size: 3.65625vw;
    	color: #3E3E3C;
   	}
   	.ingresar {
       	width: 70.3125vw;
      	height: 35px;
       	font-size: 3.75vw;
      	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
       	opacity: 1;
        margin-top: 0px;
      	margin-bottom: 0px;
      	color: #FFFFFF;
 	}
 	#olvidarContrasenia { 
   		margin-top: 0px !important;
   	}
   	a.recuperarContrasenia {
    	font-size: 3.75vw;
      	color: #DB2452;
    	text-decoration: none;
  	}
  	.columnaLogoHeinsohnGris {
      	display: flex;
      	justify-content: center;
       	position: inherit;
      	left: 0px;
      	right: 0px;
     	margin-bottom: 0px;
  	}
  	img.logoHeinsohnGris {
      	width: 36.25vw;
      	height: 42px;
      	margin-top: 4px;
     	margin-bottom: 0px;
  	}
}

modal-body {
    text-align: center;
}

/* Moto G4, Galaxy S5, iPhone 6/7/8, iPhone X */
@media screen and (min-width: 321px) and (max-width: 375px) { 
	.columnaImagen {
       	float: left;
     	width: 100%;
    	height: 100%;
   	}
   	img.logoHeinsohnBlanco {
      	position: absolute;
       	top: 20px;
      	left: 8vw;
       	width: 39.734vw;
       	height: 43px;
     	opacity: 1;
  	}
  	hr.lineaVertical {
     	display: block;
       	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
      	margin-top: 0px;
       	margin-bottom: 0px;
      	position: absolute;
      	top: 22px;
      	left: 59.4667vw;
      	width: 0.64vw;
       	height: 40px;
     	opacity: 1;
   	}
   	.tituloHeinsohn {
      	display: block;
      	margin-top: 0px;
      	margin-bottom: 0px;
       	position: absolute;
      	top: 18px;
      	right: 8vw;
     	font-size: 3.73334vw;
     	color: #FFFFFF;
  	}
  	.tituloHcm {
       	display: block;
      	margin-top: 0px;
      	margin-bottom: 0px;
       	position: absolute;
      	top: 27px;
      	right: 8vw;
       	font-size: 8.53334vw;
     	color: #FFFFFF;
  	}
  	img.imagenPrincipal {
      	width: 100%;
     	height: 100vh;
 	}
 	.imagenHeinsohn {
    	display: none;
  	}
  	.columnaLogin {
      	display: flex;
       	justify-content: center;
      	position: absolute;
       	right: 0;
       	width: 84.2667vw;
     	height: 81.56vh;
      	margin-right: 30px;
       	background: #FFFFFF 0% 0% no-repeat padding-box;
       	border-radius: 5px;
      	opacity: 1;
    	bottom: 30px;	
 	}
 	#messages {
		position: fixed;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	width: 84.2667vw;
    	height: 79px;
    	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
		border-radius: 0px 0px 5px 5px;
		opacity: 1;	
	}
	.mensajeError {
		display: block;
		position: absolute;
    	top: 50%;
    	transform: translateY(-50%);
    	margin-left: 20vw;
    	margin-right: 5.33334vw;
		font-size: 3.46667vw;
		color: #FFFFFF;
		opacity: 1;
	}
	img.iconoError {
		position: absolute;
		top: 22px;
		left: 5.33334vw;
		width: 9.33334vw;
		height: 35px;
	}
 	.columnaFormularioLogin {
     	width: 74.93334vw;
    	margin: auto;
   	}
   	h1.tituloUno {
      	font-size: 8.64vw;
     	font-weight: bold;
    	margin-top: 0px;
      	margin-bottom: 0px;
  		color: #3E3E3C;
 	}
 	h1.tituloDos {
      	font-size: 7.146667vw;
      	font-weight: bold;
      	margin-top: 0px;
       	margin-bottom: 0px;
   		color: #3E3E3C;
  	}
  	hr.lineaHorizontal {
     	width: 24.5334vw;
       	height: 4px;
      	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
      	opacity: 1;
      	margin-top: 11px;
    	margin-bottom: 0px;
  	}
  	p.saludo {
      	font-size: 4.53334vw;
      	font-weight: bold;
      	margin-top: 18px;
      	margin-bottom: 0px;
       	color: #3E3E3C;
  	}
  	p.bienvenida {
      	font-size: 3.73334vw;
     	text-align: justify;
       	margin-top: 10px;
    	margin-bottom: 0px;
  		color: #3E3E3C;
	}
	.form-horizontal .form-group {
      	margin-right: 0px;
     	margin-left: 0px;
	}
	img.iconoUsuario {
       	position: absolute;
     	top: 11px;
       	width: 3.73334vw;   
   		height: 14px;
   	}
   	.usuario {
      	font-size: 3.73334vw;
     	padding-left: 6.93334vw;
   	}
   	
   	img.iconoContrasenia {
       	position: absolute;
       	top: 11px;
      	width: 3.73334vw;
   		height: 14px;
 	}
 	img.iconoOculto {
       	position: absolute;
       	top: 11px;
     	right: 2.133334vw;
     	width: 3.73334vw;
      	height: 14px;
	} 
	.contrasenia {
       	font-size: 3.73334vw;
    	padding-left: 6.93334vw;
  	}
  	label.cajaRecordar {
      	font-size: 3.73334vw;
   		color: #3E3E3C;
  	}
  	.ingresar {
       	width: 69.0667vw;
      	height: 35px;
      	font-size: 3.73334vw;
     	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
      	opacity: 1;
       	margin-top: 0px;
      	margin-bottom: 0px;
      	color: #FFFFFF;
  	}
  	a.recuperarContrasenia {
      	font-size: 3.73334vw;
       	color: #DB2452;
     	text-decoration: none;
  	}
  	.columnaLogoHeinsohnGris {
      	display: flex;
       	justify-content: center;
       	position: inherit;
       	left: 0px;
     	right: 0px;
      	margin-bottom: 0px;
  	}
  	img.logoHeinsohnGris {
      	width: 37.3334vw;
       	height: 42px;
     	margin-top: 15px;
    	margin-bottom: 0px;
   	}
}

/* Pixel 2, Pixel 2 XL, iPhone 6/7/8 Plus */
@media screen and (min-width: 376px) and (max-width: 414px) { 
	.columnaImagen {
       	float: left;
     	width: 100%;
     	height: 100%;
 	}
 	img.logoHeinsohnBlanco {
      	position: absolute;
       	top: 20px;
     	left: 7.24634vw;
       	width: 35.99034vw;
      	height: 43px;
    	opacity: 1;
   	}
   	hr.lineaVertical {
      	display: block;
     	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
       	margin-top: 0px;
      	margin-bottom: 0px;
       	position: absolute;
      	top: 22px;
       	left: 53.8648vw;
      	width: 0.4831vw;
      	height: 40px;
  		opacity: 1;
	}
	.tituloHeinsohn {
       	display: block;
     	margin-top: 0px;
     	margin-bottom: 0px;
      	position: absolute;
      	top: 18px;
      	right: 7.24634vw;
     	font-size: 3.38164vw;
   		color: #FFFFFF;
   	}
   	.tituloHcm {
      	display: block;
      	margin-top: 0px;
     	margin-bottom: 0px;
     	position: absolute;
     	top: 27px;
     	right: 7.24634vw;
    	font-size: 7.72947vw;
    	color: #FFFFFF;
 	}
 	img.imagenPrincipal {
     	width: 100%;
  		height: 100vh;
   	}
   	.imagenHeinsohn {
  		display: none;
  	}
  	.columnaLogin {
       	display: flex;
       	justify-content: center;
       	position: absolute;
       	right: 0;
      	width: 85.50725vw;
     	height: 83.29vh;
     	margin-right: 30px;
      	background: #FFFFFF 0% 0% no-repeat padding-box;
      	border-radius: 5px;
      	opacity: 1;
   		bottom: 30px;
  	}
  	#messages {
		position: fixed;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	width: 85.50725vw;
    	height: 79px;
    	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
		border-radius: 0px 0px 5px 5px;
		opacity: 1;	
	}
	.mensajeError {
		display: block;
		position: absolute;
    	top: 50%;
    	transform: translateY(-50%);
    	margin-left: 18.11595vw;
    	margin-right: 4.83091vw;
		font-size: 3.38164vw;
		color: #FFFFFF;
		opacity: 1;
	}
	img.iconoError {
		position: absolute;
		top: 22px;
		left: 4.83091vw;
		width: 8.45411vw;
		height: 35px;
	}
  	.columnaFormularioLogin {
     	width: 77.05314vw;
   		margin: auto;
  	}
  	h1.tituloUno {
     	font-size: 8.8889vw;
      	font-weight: bold;
    	margin-top: 0px;
      	margin-bottom: 0px;
    	color: #3E3E3C;
  	}
  	h1.tituloDos {
     	font-size: 7.36715vw;
     	font-weight: bold;
       	margin-top: 0px;
    	margin-bottom: 0px;
    	color: #3E3E3C;
 	}
 	hr.lineaHorizontal {
      	width: 22.2223vw;
      	height: 4px;
    	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
       	opacity: 1;
    	margin-top: 11px;
  		margin-bottom: 0px;
  	}
  	p.saludo {
     	font-size: 4.10628vw;
    	font-weight: bold;
      	margin-top: 18px;
    	margin-bottom: 0px;
   		color: #3E3E3C;
 	}
 	p.bienvenida {
    	font-size: 3.38164vw;
     	text-align: justify;
     	margin-top: 10px;
     	margin-bottom: 0px;
   		color: #3E3E3C;
 	}
 	.form-horizontal .form-group {
       	margin-right: 0px;
    	margin-left: 0px;
   	}
   	img.iconoUsuario {
     	position: absolute;
      	top: 11px;
       	width: 3.381643vw;   
     	height: 14px;
 	}
 	.usuario {
     	font-size: 3.38164vw;
    	padding-left: 6.2802vw;
  	}
  	img.iconoContrasenia {
     	position: absolute;
     	top: 11px;
      	width: 3.381643vw;
  		height: 14px;
   	}
   	img.iconoOculto {
      	position: absolute;
      	top: 11px;
      	right: 1.93237vw;
      	width: 3.381643vw;
  		height: 14px;
 	}
 	.contrasenia {
       	font-size: 3.38164vw;
     	padding-left: 6.2802vw;
 	} 
 	label.cajaRecordar {
     	font-size: 3.38164vw;
   		color: #3E3E3C;
 	}
 	.ingresar {
       	width: 62.5604vw;
       	height: 35px;
      	font-size: 3.38164vw;
      	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
     	opacity: 1;
     	margin-top: 0px;
        margin-bottom: 0px;
     	color: #FFFFFF;
  	}
  	a.recuperarContrasenia {
     	font-size: 3.38164vw;
    	color: #DB2452;
   		text-decoration: none;
 	}
 	.columnaLogoHeinsohnGris {
      	display: flex;
       	justify-content: center;
       	position: inherit;
     	left: 0px;
     	right: 0px;
   		margin-bottom: 0px;
	}
	img.logoHeinsohnGris {
      	width: 28.019324vw;
       	height: 42px;
        margin-top: 15px;
     	margin-bottom: 0px;
 	}
}

/* iPad */
@media screen and (min-width: 415px) and (max-width: 768px) and  {
	.columnaImagen {
      	float: left;
      	width: 100%;
  		height: 100%;
 	}
 	img.logoHeinsohnBlanco {
       	position: absolute;
       	top: 20px;
       	left: 2.60417vw;
       	width: 18.2292vw;
      	height: 42px;
    	opacity: 1;
  	}
  	hr.lineaVertical {
      	display: none;
     	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
      	margin-top: 0px;
      	margin-bottom: 0px;
      	position: absolute;
     	top: 22px;
      	left: 53.8648vw;
      	width: 0.4831vw;
       	height: 40px;
     	opacity: 1;
   	}
   	.tituloHeinsohn {
       	display: none;
       	margin-top: 0px;
    	margin-bottom: 0px;
      	position: absolute;
       	top: 18px;
       	right: 7.24634vw;
      	font-size: 3.38164vw;
      	color: #FFFFFF;
   	}
   	.tituloHcm {
     	display: none;
    	margin-top: 0px;
     	margin-bottom: 0px;
      	position: absolute;
      	top: 27px;
      	right: 7.24634vw;
     	font-size: 7.72947vw;
      	color: #FFFFFF;
  	}
  	img.imagenPrincipal {
     	width: 100%;
     	height: 100vh;
 	}
 	.imagenHeinsohn {
     	width: 100%;
    	position: absolute;
     	bottom: 0;
    	left: 0;
	} 
	.columnaLogin {
       	display: flex;
       	justify-content: center;
       	position: absolute;
      	right: 0;
      	width: 76.5625vw;
     	height: 66.993vh;
     	margin-right: 11.71875vw;
      	background: #FFFFFF 0% 0% no-repeat padding-box;
     	border-radius: 5px;
     	opacity: 1;
    	bottom: 169px;
  	}
  	#messages {
		position: fixed;
		top: 0px;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	width: 47.265625vw;
    	height: 79px;
    	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
		border-radius: 0px 0px 5px 5px;
		opacity: 1;	
	}
	.mensajeError {
		display: block;
		position: absolute;
    	top: 50%;
    	transform: translateY(-50%);
    	margin-left: 9.765625vw;
    	margin-right: 2.6041667vw;
		font-size: 1.82292vw;
		color: #FFFFFF;
		opacity: 1;
	}
	img.iconoError {
		position: absolute;
		top: 22px;
		left: 2.6041667vw;
		width: 4.5572917vw;
		height: 35px;
	}
  	.columnaFormularioLogin {
     	width: 55.078125vw;
   		margin: auto;
	}
	h1.tituloUno {
       	font-size: 6.3541667vw;
     	font-weight: bold;
      	margin-top: 0px;
      	margin-bottom: 0px;
    	color: #3E3E3C;
	}
	h1.tituloDos {
       	font-size: 5.2604167vw;
        font-weight: bold;
       	margin-top: 0px;
        margin-bottom: 0px;
    	color: #3E3E3C;
 	}
 	hr.lineaHorizontal {
      	width: 11.9792vw;
      	height: 4px;
    	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
      	opacity: 1;
     	margin-top: 11px;
      	margin-bottom: 0px;
    }
    p.saludo {
       	font-size: 2.65625vw;
      	font-weight: bold;
        margin-top: 18px;
       	margin-bottom: 0px;
     	color: #3E3E3C;
  	}
  	p.bienvenida {
      	font-size: 1.82292vw;
      	text-align: justify;
      	margin-top: 10px;
     	margin-bottom: 0px;
    	color: #3E3E3C;
   	}
   	.form-horizontal .form-group {
      	margin-right: 0px;
    	margin-left: 0px;
  	}
  	img.iconoUsuario {
     	position: absolute;
      	top: 11px;
      	width: 1.82292vw;   
   		height: 14px;
 	}
 	.usuario {
       	font-size: 1.82292vw;
   		padding-left: 3.38542vw;
   	}
   	img.iconoContrasenia {
      	position: absolute;
      	top: 11px;
      	width: 14px;
     	height: 14px;
  	}
  	img.iconoOculto {
     	position: absolute;
      	top: 11px;
      	right: 1.041667vw;
     	width: 1.82292vw;
      	height: 14px;
  	}
  	.contrasenia {
      	font-size: 1.82292vw;
      	padding-left: 3.38542vw;
 	} 
 	label.cajaRecordar {
       	font-size: 1.82292vw;
       	color: #3E3E3C;
 	}
 	.ingresar {
      	width: 33.72396vw;
       	height: 35px;
     	font-size: 1.82292vw;
      	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
       	opacity: 1;
     	margin-top: 20px;
     	margin-bottom: 0px;
     	color: #FFFFFF;
 	}
 	a.recuperarContrasenia {
      	font-size: 1.82292vw;
     	color: #DB2452;
   		text-decoration: none;
 	}
 	img.logoHeinsohnGris {
    	width: 18.22917vw;
    	height: 42px;
       	margin-top: 45px;
   		margin-bottom: 0px;
	}
}


@media screen and (min-width: 769px) and (max-width: 1024px) and (max-height: 1024px) {
	.columnaImagen {
      	position: relative;
   	}
   	img.logoHeinsohnBlanco {
       	position: absolute;
     	top: 20px;
      	left: 20px;
      	width: 140px;
      	height: 42px;
       	opacity: 1;
 	}
 	img.imagenPrincipal {
     	height: 1024px;
  	}
  	.columnaLogin {
      	height: 686px;
      	top: 169px;
   		bottom: 169px;
 	}
 	#messages {
		position: absolute;
    	top: 0;
    	margin-top: 0px;
    	margin-bottom: 0px;
    	width: 41.308594vw;
    	height: 79px;
    	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
		border-radius: 0px 0px 5px 5px;
		opacity: 1;	
	}
	.mensajeError {
		display: block;
		position: absolute;
    	top: 50%;
    	transform: translateY(-50%);
    	margin-left: 75px;
    	margin-right: 20px;
		font-size: 14px;
		color: #FFFFFF;
		opacity: 1;
	}
	img.iconoError {
		position: absolute;
		top: 22px;
		left: 20px;
		width: 35px;
		height: 35px;
	}
 	hr.lineaHorizontal {
       	width: 92px;
       	height: 4px;
      	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
      	opacity: 1;
       	margin-top: 11px;
    	margin-bottom: 0px;
   	}
   	p.saludo {
       	font-size: 20.4px;
      	font-weight: bold;
     	margin-top: 18px;
       	margin-bottom: 0px;
     	color: #3E3E3C;
 	}
 	p.bienvenida {
      	font-size: 14px;
       	text-align: justify;
       	margin-top: 10px;
        margin-bottom: 0px;
      	color: #3E3E3C;
  	}
  	img.iconoUsuario {
       	position: absolute;
       	top: 11px;
      	width: 14px;   
   		height: 14px;
 	}
 	.usuario {
      	font-size: 14px;
    	padding-left: 26px;
 	}
 	img.iconoContrasenia {
      	position: absolute;
       	top: 11px;
      	width: 14px;
     	height: 14px;
  	}
  	img.iconoOculto {
      	position: absolute;
       	top: 11px;
      	right: 8px;
      	width: 14px;
     	height: 14px;
  	}
  	.contrasenia {
       	font-size: 14px;
     	padding-left: 26px;
   	}
   	label.cajaRecordar {
       	font-size: 14px;
   		color: #3E3E3C;
	}
	.ingresar {
        width: 100%;
        height: 35px;
       	font-size: 14px;
       	background: transparent linear-gradient(90deg, #E02A58 0%, #BE0031 100%) 0% 0% no-repeat padding-box;
       	opacity: 1;
       	margin-top: 20px;
       	margin-bottom: 0px;
     	color: #FFFFFF;
  	}
  	a.recuperarContrasenia {
       	font-size: 14px;
      	color: #DB2452;
     	text-decoration: none;
  	}

  	img.logoHeinsohnGris {
      	width: 140px;
     	height: 42px;
       	margin-top: 45px;
     	margin-bottom: 0px;
  	}
}
@media (max-width: 375px) and (max-height: 667px) {
    .logoHeinsohnBlanco {
        bottom: 10px !important;
    }
    .logoHeinsohnBlanco img {
        width: 150px !important;
        position: relative !important;
        bottom: -28px !important;
    }
    .columnaLogin {
        top: 28% !important;
    }
    .containerTitle {
        top:42% !important;
    }
}

@media (max-width: 470px) and (max-height: 740px) {
    .columnaLogin {
        top: 30% !important;
    }
    .containerTitle {
        top: -48% !important;
    }
    .imgPrincipal {
        top: 10% !important;
    }
}
@media (max-width: 426px) {
    .columnaLogin {
        top: 38px;
        width: 90% !important;
        z-index: 10;
    }
    .imgPrincipal {
        top: 14%;
        width: 66%;
    }
    .columnaFormularioLogin {
        width: 100%;
    }
    p.bienvenida {
        font-size: 12px;
    }
    .iconoUsuario, iconoContrasenia, iconoOculto {
        height: 14px;
        width: auto !important;
        top: 10px;
    }
    .form-control {
        font-size: 14px;
    }
    .usuario, .contrasenia {
        padding-left: 20px;
    }
    .ingresar {
        width: 90%;
        font-size: 14px !important;
    }
    a.recuperarContrasenia {
        font-size: 14px !important;
    }
    .imgPrincipal {
        width: 70% !important;
        top: 18%;
    }
    .logoHeinsohnBlanco {
        z-index: 0;
    }
}


@media (max-width: 768px) {
    .columnaImagen {
        height: 100vh;
        width: 100%;
        margin: 0;
        border-radius: 0;
    }
    .containerImgRound {
        height:100vh;
        width: 100%;
        margin: 0;
    }
    .columnaFormularioLogin {
        width: 100%;
    }
    .columnaLogin {
        position: absolute;
        top: 40%;
        height: 400px;
        width: auto;
        right: 50%;
        transform: translateX(50%);
        margin: 0;
        border-radius: 20px;
        background-color: #fff;
    }
    .cardLogin {
        height: auto;
        padding-bottom: 20px;
        z-index: 10;
        box-shadow: none;
        border-radius: 0;
        padding-top: 20px;
    }
    .containerTitle {
        position: absolute;
        top: -64%;
        right: 50%;
        width: 100%;
        transform: translateX(50%);
    }
    h1.tituloUno {
        font-size: 22px;
        color: #ffff;
    }
    .imgPrincipal {
        position: absolute;
        top: 20%;
        right: 50%;
        transform: translateX(50%);
        width: 37%;
        z-index: 0;
     }
    .ingresar {
        margin-top: 0;
    }
    p.bienvenida {
        margin-top: 20px;
    }
    p.saludo {
        margin-top: -10px;
        font-size: 20px;
    }
    hr.lineaHorizontal {
        position: absolute;
        width: 33px;
        height: 2px;
        margin-top: 18px;
        right: 50%;
        transform: translateX(50%);
    }
    .logoHeinsohnBlanco {
        position: absolute;
        top: auto;
        right: 50%;
        transform: translateX(50%);
        bottom: 0;
        width: auto;
    }
    .logoHeinsohnBlanco img {
        height: 60px;
    }
}


 @media (min-width: 1440px) {
    .containerTitle {
       padding-right: 60px;
       padding-left: 60px;
    }
 }
