body 
{
	background-color:#2C2E38;
	font-family: Tahoma;
	font-size:11px;
	color:White;
}

#login
{
	/*background-image: url('../../img/imgMasterPage/login.png');*/	
	background-repeat:no-repeat;
	height:246px;
	width:325px;
    background-color:#285767;
	
	/* margin:0 auto; position: relative;
	top: 200px;
	left: 300px;*/
}

#login table
{
	position: relative;
	top: 60px;
	left: 50px;
}

/* Utilizado para centrar */

#outer {height: 400px; overflow: hidden; position: relative; width: 100%;}
#outer[id] {display: table; position: static;}
		
#middle {position: absolute; top: 50%; width: 100%; text-align: center;} /* for explorer only*/
#middle[id] {display: table-cell; vertical-align: middle; position: static;}
		
#inner {position: relative; top: 50%; text-align: left;} /* for explorer only */
#inner {width: 325px; margin-left: auto; margin-right: auto;} /* for all browsers*/
/* optional: #inner[id] {position: static;} */
.btnIngresar {border:0;padding :0;   background-color:white ; color:#285767;  background-repeat :no-repeat ;   background-position:top ;  
                	width :100px;   height:34px; }
.btnIngresar:hover {    background-position:bottom ; }   


/* logon container*/
.LogonContainer
{
    background-color: #285767;
    color: white;
    float:right;
    width: 68%;
    min-width: 600px;
    height: 500px;
    margin-top: 150px;
    padding-left: 100px;
}
.TableLoginCenter {
    text-align:center;

}
.LogonContainer.LogonError
{
    height: 490px;
}
.LogonContainer .LogonContent
{
    padding-top: 100px;
    padding-left: 20px
    
}
.LogonContainer .LogonFormLayout
{
    width: 540px;
    margin-left: 70px;
    margin-top: 40px;
    padding-top:100px;
}
.LogonContainer .LogonGroupBox > table
{
    margin-top: -31px!important;
}
.LogonContainer .LogonEmptyItem
{
    height: 28px!important;
}
.LogonContainer .LogonCaption,
.LogonContainer .LogonLogoCaption
{
    color: white!important;
    background-color: transparent!important;
}
.LogonContainer .LogonLogoCaption
{
    font-size: 60px;
    font-weight: 100;
}
.LogonContainer .LogonCaption
{
    font-size: 27px;
    font-weight: 300;
}
.LogonContainer .LogonGroupBox
{
    border-width: 50!important;
}
.LogonContainer .LogonAccountNameItem
{
    padding-bottom: 7px!important;
    padding-top:50px;
}
.LogonContainer .LogonUserPasswordItem
{
    padding-top: 7px!important;
}
.LogonContainer .AccountNameTextBox .dxic,
.LogonContainer .UserPasswordTextBox .dxic
{
    padding-left: 50px!important;
}
.LogonContainer .AccountNameTextBox input,
.LogonContainer .UserPasswordTextBox input
{
    font-size: 25px;
    font-weight: 400;
    background-color: transparent!important;
}
.LogonContainer .AccountNameTextBox,
.LogonContainer .UserPasswordTextBox
{
    background-position: 7px 50%!important;
}
.LogonContainer .AccountNameFocused,
.LogonContainer .PasswordFocused
{
    border-color: lightgray!important;
    outline-color: lightgray!important;
}
.LogonContainer .AccountNameError,
.LogonContainer .ErrorLabel
{
    color: white!important;
    font-size: 19px;
    font-weight: 300;
}
.LogonContainer .SignInButton
{
    width: 100px;
    height: 50px;
    color: white!important;
    background-image: none!important;
    background-color: transparent!important;
    border: 2px solid white!important;
    border-radius: 0;
    font-size: 15px;
    font-weight: 100;
}
.LogonContainer .ErrorLabel
{
    width: 490px;
}
.LogonContainer .LogonErrorItem
{
    padding-top: 17px!important;
}
.LogonContainer .dxeTextBox_Mulberry {
    border-width: 0 !important;
}
.deco {
    width: 130px;
    height: 130px;
    border: 2px dashed #ddd;
    border-radius: 50%;
    position: absolute;
    top: 13%;
    left: 50%;
    margin: 0 0 0 -65px;
    line-height: 120px;
    animation: roll 1s ease-out both, fadeIn 1s ease-out both;
}
.imag {
    display: inline-block;
    vertical-align: middle;
   -ms-interpolation-mode: bicubic;
    max-width: 100%;
    height: auto;
    border: 0;
   
    margin-top:25px;
}

.d-flex {
    display: flex;
    justify-content: center; /* Centra horizontalmente */
    align-items: center; /* Centra verticalmente */
    height: 100vh; /* Opcional: asegura que el contenedor ocupe toda la altura de la ventana */
}