/*

	ARCHIVO ---------------------------------------------------------------
	
		./css/main.css
		
	UBICACION -------------------------------------------------------------
	
		/_binalia/framework/v2/modules/WebBuilder/login2021

	DESCRIPCIÓN------------------------------------------------------------
			
		Hoja de estilos principal del componente.
		
	REGISTRO --------------------------------------------------------------
	
		20210721.130000.jfmarco
		
*/

/* Tipografía ************************************************************************************* */

@font-face {
	font-family		: Orbitron;
	src				: url(./fonts/Orbitron/Orbitron-Regular.ttf);
}
@font-face {
	font-family		: Exo2;
	src				: url(./fonts/Exo2/Exo2-Regular.ttf);
}
@font-face {
	font-family		: Exo2;
	src				: url(./fonts/Exo2/Exo2-Bold.ttf);
	font-weight		: bold;
}
@font-face {
	font-family		: Exo2;
	src				: url(./fonts/Exo2/Exo2-Italic.ttf);
	font-style		: italic;
}

/* ************************************************************************************* Tipografía */

/* CLASE INICIAL ********************************************************************************** */

/*
	la clase inicial establece las directivas básicas para que el componente funcione adecuadamente.

	Estre estas directivas básicas suele encontrarse colores de texto y fondo, tipografía principal
	y tamaño de fuente.
	
	Son directivas que se heredarán en las clases interiores.
*/

.binalia_WebBuilder_components_login2021 {
	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	background-color	: White;

	color				: Black;
	font-family			: Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: 18px;
}

/* ********************************************************************************** CLASE INICIAL */

/* CLASES INTERIORES ****************************************************************************** */

.binalia_WebBuilder_components_login2021 .loginscreen {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	display				: block;
	position			: absolute;

	top					: 0;
	left				: 0;
	bottom				: 0;
	right				: 0;
	
	text-align			: center;
	
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	display				: block;
	position			: absolute;

	top					: 50%;
	left				: 50%;
	width				: 95%;
		max-width		: 15em;
	height				: auto;
	
	transform			: translate(-50%,-50%);
	
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .logoblock {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	display				: block;
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .logoblock img.logo {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	display				: inline-block;
	width				: 100%;
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .titleblock {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	/* Para el título modificamos la tipografía */
	font-family			: Orbitron, Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: larger;
	text-align			: center;
	
	display				: block;
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .subtitleblock {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	display				: block;

	font-size			: 100%;
	font-variant		: small-caps;
	text-align			: center;

	margin				: 1em 0 1em 0;
}
.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .subtitleblock.green {
	color				: darkgreen;
	font-weight			: bold;

	padding				: 0.5em;

	border				: solid 1px darkgreen;
	border-radius		: 0.5em;
	background-color	: palegreen;
}
.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .subtitleblock.yellow {
	color				: darkorange;
	font-weight			: bold;

	padding				: 0.5em;

	border				: solid 1px darkorange;
	border-radius		: 0.5em;
	background-color	: antiquewhite;
}
.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .subtitleblock.red {
	color				: red;
	font-weight			: bold;

	padding				: 0.5em;

	border				: solid 1px red;
	border-radius		: 0.5em;
	background-color	: mistyrose;
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	font-family			: Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: 100%;
	text-align			: center;

	display				: block;
	
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock .reportpart {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	font-family			: Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: 75%;
	font-variant		: unset;
	text-align			: center;

	display				: block;
	
	margin				: 1em 0 1em 0;
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock input.field {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	font-family			: Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: 100%;
	text-align			: center;

	display				: block;
	
	margin				: 0.5em auto;
	
	width				: 100%;
		max-width		: 15em;
	
	background-color		: whitesmoke;
	background-attachment	: scroll;
	background-position		: center left 0.25em;
	background-repeat		: no-repeat;
	background-clip			: border-box;
	background-size			: 1.5em;
	padding-left			: 2em !important;
	padding-right			: 2em !important;
	
	color				: gray;
	padding				: 0.5em;

	font-size			: 110%;
	border				: solid 1px silver;
	border-radius		: 0.5em;
	text-align			: center;
	text-align-last		: center;
	
	transition			: all 500ms ease 0s;
	
}
.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock input.field:hover {
	border				: solid 1px black;
	box-shadow			: dimgray 0 0 0.5em 0;
}
.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock input.field.user {
	background-image	: url("./images/username.png");
}
.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock input.field.password {
	background-image	: url("./images/userpassword.png");
}

.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock input.action {

	box-sizing			: border-box; /* IE8+, Chrome (any), Opera 8.5+ */
	-moz-box-sizing		: border-box; /* Firefox (any) */
	-webkit-box-sizing	: border-box; /* Safari 3 */

	font-family			: Exo2, Verdana, Arial, Helvetica, Sans-serif;
	font-size			: 100%;
	text-align			: center;

	cursor				: pointer;

	display				: block;
	
	margin				: 1em auto;
	
	width				: 100%;
		max-width		: 15em;
	
	background-color		: black;
	background-attachment	: scroll;
	background-position		: center left 0.25em;
	background-repeat		: no-repeat;
	background-clip			: border-box;
	background-size			: 1.5em;
	background-image		: url("./images/send-w.png");
	padding-left			: 2em !important;
	padding-right			: 2em !important;
	
	color				: white;
	padding				: 0.5em;

	font-size			: 110%;
	border				: solid 1px black;
	border-radius		: 0.5em;
	text-align			: center;
	text-align-last		: center;
	text-transform		: uppercase;
	
	transition			: all 500ms ease 0s;
	
}
.binalia_WebBuilder_components_login2021 .loginscreen .loginblock .formblock input.action:hover {
	box-shadow				: dimgray 0 0 0.5em 0;
	/*
	background-image		: url("./images/send-b.png");
	color					: black;
	*/
	 /* Azul MEDLAND */
	color					: rgb(0, 173, 38);	/* binalia light green		*/
	background-color		: rgb(0,127,28);	/* binalia middle green		*/
	border-color			: rgb(50,94,22);	/* binalia dark green		*/
}