/* 
    Style Name: WMatis Web
    Designer: Wilvin Jiménez
    Slicer/Coder: Wilvin Jiménez
    Version : 1.0
*/

body {
	font-family:Arial, Tahoma, sans-serif, verdana;
	background:#084590 url(../cImages/login/bg-light.png) top no-repeat;
}

h1  {
    margin: 0 0 18px; clear: both;
    font-size: 16px; font-weight: bold; color: #3874bd;  
}

h2 {
    margin: 0 0 16px; clear: both;
    font-size: 14px; font-weight: bold; color: #6983a2;  
}

h3 {
    margin: 0 0 14px; clear: both;
    font-size: 13px; font-weight: bold; line-height: 16px; color: #6983a2;  
}

p {
    color: #2d2d2d; font-size: 13px;
}

b {
    font-weight: bold;
}

#container {
	width: 433px; margin: 14% auto;
}

h1.main-logo {
    text-align:center;
    margin: 16px auto;
}

h2.welcome {
	clear: both; margin: 0 0 20px;
	font-size: 20px; font-weight: bold; color: #585858; text-align: center;
}

h2.log-off-message {
	clear: both; margin: 0 0 32px;
	font-size: 16px; font-weight: bold; color: #3874bd; text-align: center;
}

#container div.box-wrapper {
	padding: 4px 0 0;
	background: url(../cImages/login/box-top.png) top no-repeat;
}

#container div.box-outer {
	padding: 0 0 4px;
	background: url(../cImages/login/box-bottom.png) bottom no-repeat;
}

#container div.box-inner {
	width: 393px; padding: 20px; text-align: center;
	background: url(../cImages/login/box-middle.png) repeat-y;
}

#container table.form {
	float: left;
}

#container table.form {
	width: 264px; margin: 0 0 14px 26px;
}

#container table.form.afiliate {
	width: 340px;
}

#container table.form tr td {
	 vertical-align: middle; height: 30px; border-bottom:solid 1px #eaeaea; padding: 6px 0;
}

#container table.form.afiliate tr td {
    padding: 6px;
}

#container table.form.afiliate tr td select {
    width: 100%;
}

#container table.form tr td.first {
	border-top:solid 1px #eaeaea;
}

#container table.form tr td label {
	font-size: 12px; font-weight: bold; color: #585858;
}

#container table.form tr td span {
	font-size: 12px; font-weight: bold; color: #3874bd;
}

#container table.form tr td input {
	padding: 6px; margin: 0 0 0 8px; width:170px;
}

#container div.img-wrapper {
	float: left; margin: 18px; padding: 5px; border: solid 1px #dfdfdf;
}

#container div.login-btns {
	clear: both;
}
#container div.login-btns div.links {
    margin: 12px 0 0;
    font-size: 10px; text-align: center; color: #3874bd;
}
#container div.login-btns a {
	font-size: 10px; color: #3874bd;
}

#container #footer {
	clear:both; margin: 18px 0 0;
	font-size: 11px; color: #6a6a6a; line-height: 14px; text-align: center;
}

/* ------- Messages ------- */

div.message {
    margin: 0 0 14px; padding: 10px;
    border-style: solid; border-width: 1px;    
}

div.message span {
    font-size:12px; font-weight:bold;
}

div.message.success {
    border-color: #c1e2b9;
    background: #eefedf;
    color: #56af40;
}

div.message.error {
    border-color: #e2b9b9;
    background: #fedfdf;
    color: #af4040;
}

div.message.warning {
    border-color: #e2d2b9;
    background: #fefadf;
    color: #ba7c3a;
}

div.message.info {
    border-color: #b9d1e2;
    background: #dff6fe;
    color: #2a84f5;
}

/* ------- Content --> Loading ------- */

div.loading {
    position: fixed; bottom: 0; right: 0;
    background: white; border: solid 1px #dfdfdf; padding: 8px;
}

div.loading h3 {
    height: 34px; margin: 0;
}

div.loading img  {
    float:left; margin: 0 12px 0 0;
}

div.loading span {
    float:left;
}


/* ------- Content --> Password Wizard ------- */

div.content.change-pwd {
    font-size: 12px;    
    color: #585858;
}

div.content.change-pwd table.input-component {
    width:100%;
    border-collapse: separate;
    border-spacing: 0;
    vertical-align: middle;    
    border-bottom: solid 1px #EAEAEA;
    padding: 6px 0;
}

div.content.change-pwd table.input-component tr td {
    padding:4px;
}

div.content.change-pwd table.input-component tr td.input {
    width:60%;
}

div.content.change-pwd table.input-component tr td.label, 
div.content.change-pwd table.input-component label,
div.content.change-pwd table.input-component span {
    font-size: 12px;
    font-weight: bold;
    color: #585858;
    text-align:right;
}

div.content.change-pwd table.input-component.radio-list tr td.input {    
    padding:2px;
}

div.content.change-pwd table.input-component.radio-list tr td.input label {    
    font-size:13px;
}

div.content.change-pwd table.input-component tr td.input input[type=text],
div.content.change-pwd table.input-component tr td.input input[type=password],
div.content.change-pwd table.input-component tr td.input select {
    width:90%;
    padding: 6px;
    margin: 0 0 0 8px;
    font-size:12px;
}

div.content.change-pwd table.input-component tr td.input select {
    width:97%;
}

div.content.change-pwd div.change-pwd-btns-wrapper {
    margin:16px 0 0;
}

div.content.change-pwd div.change-pwd-btns-wrapper input {
    margin-left:14px;
}

div.content.change-pwd div.change-pwd-btns-wrapper input.first {
    margin-left:0;
}

.img-Certificate {
    width: 100px;
    height: 100px;
    object-fit: cover;
    object-position: center center;
}