﻿@charset "utf-8";
body {width: 100%; height: 100%; margin:0}
	
A { color: #336699; text-decoration: none; }
A:visited { color: #336699; text-decoration: none; }
A:hover { color: #CC6600; text-decoration: underline; }

h1 {display: inline; margin-left: 20px}


#BoxLeft {vertical-align: top; float: left; width: 320px; height: auto; margin: 65px 30px 40px 0; top: 0;  min-height: 100%; position: absolute; overflow: hidden;left: 0px;}
#BoxCenter {vertical-align: top; float: left; width: 986px; height: auto; margin: 12px 0 40px 340px; top: 0; display: inline-block; padding: 10px 0 15px 0px; overflow: hidden}
#BoxRight {vertical-align: top; float: right; width: auto; height: auto; margin: 12px 25px 40px 0; padding: 30px 20px 5px 20px; top: -554px; display: inline-block;visibility: visible; border-left: 1px solid #F2F2F2; background:#FFFFFF; border-radius: 8px; overflow: hidden; font-weight:300; position: absolute; }


div.container { /*top: 50%; margin-top: -275px; width: 1024px*/}

div.Box { width: 550px; height: 320px; margin-top: 60px; margin-left: auto; margin-right: auto; border-radius: 6px; border:1px solid silver; padding: 15px; background-color:white; box-shadow: 3px 3px 3px rgba(0,0,0,0.2); }
#Box span {display:block; margin-top: 20px;}

div.BoxTitle {width: 550px; background-color: #465A63; padding: 0px; font-weight: bold; color: white; height: 69px; margin-bottom: 15px; }
div.Logo { display: inline-block; width:260px; height: 60px; float: left; margin-left: 10px; margin-top: 2px;  background:url(/images/logo/Logo260x60.png); background-repeat:no-repeat; cursor: pointer;}
div.Home { display: inline-block; float: left; margin-top: 10px; margin-left: 150px; padding: 5px; width: 50px; height: 50px; text-align: center; cursor: pointer;}
div.Email { display: inline-block; float: right; margin-top: 20px; width: 40px; height: 30px; margin-right: 20px; text-align: center; padding: 5px;  cursor: pointer;}

div.Sign { font-size: x-large; font-weight: 400; color: #444444; display: block; margin-left: 1px}
div.Msg { font-size: large; font-weight:bold; color: crimson; margin-left: 10px; display: inline-block;}
.psw-msg {
	position: relative;
	text-align:left;
	font-size:medium; 
	font-weight:400; 
	width: 570px; 
	height: auto; 
	line-height: 1.5em;
	padding: 10px; 
	color: #475A62; 
	padding: 8px; 
	margin-left: auto; 
	margin-right: auto;
	margin-top: 40px;
	background-color: #F4F4F4;
	border: 1px solid #E8E8E8;
	/* box-shadow: 2px 2px 2px 2px #EAEAEA; */
	border-radius: 8px;
	vertical-align:central;
}
div.psw-msg:empty {visibility: hidden}

.weak-password { background-color: #9E2923; border: 1px solid #CC3300; padding: 0 10px 0 10px; color: #FFFFFF; font-weight:400; border-radius: 4px; top: 0; line-height:2em}
.medium-password { background-color: #FF9900; border: 1px solid #C14F17; padding: 0 10px 0 10px; color: #333333; font-weight:400; border-radius: 4px; top: 0; line-height:2em}
.strong-password { background-color: #009900; border: 1px solid #006600; padding: 0 10px 0 10px; color: #FFFFFF; font-weight:500; border-radius: 4px; margin-top: 0; line-height:2em}

.wrong-password {border: 2px brown inset}

.percent {margin-left: 40px; color: darkgreen; font-weight:500}

.eye {position: relative; width: 50px; height: 33px; margin-left: 10px; top:10px; display: inline-block; cursor:pointer; background-image:url('/images/icons/eye2.png'); background-repeat:no-repeat; opacity:0.7; transform:scale(0.9)}

.gologin {font-size: medium; float:right; display: inline-block}

div.Register {display: inline-block; left: 10px; float: left; width: 230px; text-align: left; color: #336699; margin: 30px 0 10px 10px; font-size: large; cursor: pointer;}
div.Register:hover { color: #CC6600}

div.Remember {display: inline-block; left: 5px; float: left; width: 240px; text-align: left; color: #336699; margin: 30px 0 10px 1px; font-size: large; cursor: pointer; font-weight:400}
div.Remember:hover { color: #CC6600}

div.Create {display: inline-block; float: right; width: 240px; padding-right: 30px; text-align: right; color: #336699; margin: 30px 0 10px 1px; font-size:large; cursor: pointer; font-weight:400}
div.Create:hover { color: #CC6600}

div.Fixed {display: inline-block; float: left; width: 20px; margin-left: 50px; text-align: left; color: #336699; margin-bottom: 10px; font-size:18px; cursor: pointer; color: silver}
div.Fixed:hover { color: #CC6600}	

.account {display: inline-block; float:right; line-height: 35px; margin: 40px 0 30px 70px;}

.user {width: 240px; margin: 40px 50px 40px 30px; padding: 8px 5px 12px 15px; line-height: 1.7em; height:auto; border: 1px solid cornflowerblue; box-shadow: 3px 3px 2px 0 #DAE1E4; border-radius: 6px; color: darkgreen; overflow:hidden}
.useremail {font-size:small; line-height: 1.6em; color:  #808080}

.download {z-index:4;width: 100%; border: 0; margin-top: -5px; margin-bottom: 10px; font-size:large; border-collapse:collapse}
.download th {text-align: left; padding-left: 0; line-height:3em; border: 1px solid white; border-bottom: 1px solid silver;font-size:large;}
.download td {width: auto;border-bottom: silver solid 1px; padding-left: 0; line-height:3.5em; white-space:nowrap;  vertical-align:top;font-weight: 300;}
.download td:nth-child(1) { font-weight: 400; width: auto}
.download td:nth-child(5) { font-weight: 400; width: auto; color: #485A63}
.download td:nth-child(6) { font-weight: 400; width: 170px;}

.downloadselect {z-index: 5; width: 170px;position: inherit; display:none; border: 1px solid silver; background-color: #F2F2F2; padding: 0}

.downloaditem {width: 160px; border: 0; margin: 0; padding: 0; border-collapse:collapse;}
.downloaditem td {width: auto; white-space:nowrap; border-bottom: 1px solid #EBEBEB; line-height: 1em; height: 20px; padding-left: 20px;}
.downloaditem td:nth-child(1) {width: 50%; }
.downloaditem td:nth-child(2) {width: 50%; font-size: medium; vertical-align: middle}
.downloaditem div {line-height: 2em}
.downloaditem a {line-height: 2em;}
.downloaditem a:link {cursor:pointer;}
.downloaditem a:visited{cursor:progress;}
.downloaditem a:hover{cursor:pointer;}

.wait { position:absolute; width: 24px; height: 24px; margin-left: 10px;margin-top:10px;display: inline-block; visibility: hidden ;background-image:url('/images/wait/wait24.gif')}

.tbl_opts {width: 260px; font-weight:200;border: 1px solid silver; box-shadow: 2px 2px 2px 0 #F3F3F3; border-radius: 6px;}
.tbl_opts td {line-height: 3em}
.tbl_opts td:nth-child(1) {width: 250px}
.tbl_opts td:nth-child(2) {width: auto}

.form {position: relative; float: left; margin: 0}

.form input[type=email] {text-transform: lowercase;padding: 10px}
.form input[type=password] {padding: 10px}

input {
    padding: 10px 10px;
    border:1px solid #d5d9da;
    border-radius:5px;
    box-shadow: 0 0 5px #e8e9eb inset;
    width: 520px; /* 500 (#container) - 10 (span paddings) - 20 (input paddings) - 2 (input borders) */
    height: 2em;
    font-size: medium;
    outline:0; /* remove webkit focus styles */
}
#forma input {width: 90%;padding: 10px 10px}

input:focus {
    border:1px solid #b9d4e9;
    border-top-color:#b6d5ea;
    border-bottom-color:#b8d4ea;
    box-shadow:0 0 5px #b9d4e9;
    }

input:hover { border: 1px solid cornflowerblue; }
input:valid { color: green; }
input:invalid { color: red; }

 
select { font-size: medium; width: 490px; height: 3em; line-height: 3em; padding: 5px; margin: 0px; border-radius: 6px; border: 1px solid silver; background-color: white}
select:hover { border: 1px solid cornflowerblue}
select option {line-height: 150%;}    

#CompanyType option {padding: 8px; height: 30px}

.sel { font-size: medium; width: 490px; height: 3em; line-height: 3em; padding: 5px 5px 5px 5px; margin: 0px; border-radius: 6px; border: 1px solid silver; background-color: white}
.sel:hover { border: 1px solid cornflowerblue}
.sel option {line-height: 3em}    

.boton {
    background: #57a9eb; /* Old browsers */
    background: -moz-linear-gradient(top, #57a9eb 0%, #3a76c4 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#57a9eb), color-stop(100%,#3a76c4)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #57a9eb 0%,#3a76c4 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #57a9eb 0%,#3a76c4 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #57a9eb 0%,#3a76c4 100%); /* IE10+ */
    background: linear-gradient(to top, #57a9eb 0%,#3a76c4 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#57a9eb', endColorstr='#3a76c4',GradientType=0 ); /* IE6-9 */
    border:1px solid #326fa9;
    border-top-color:#3e80b1;
    border-bottom-color:#1e549d;
    text-shadow:0 1px 0 #1e3c5e;
    display: block;
    margin: 25px 0 0 0;
    font-size: large;
    color: white;
    width:250px;
    height: 2.7em;
    line-height: 2.7em;
    border-radius: 8px;
    box-shadow:0 1px 0 #bbb, 0 1px 0 #9cccf3 inset;
}
.boton:active {
    background: #3a76c4; /* Old browsers */
    background: -moz-linear-gradient(top, #3a76c4 0%, #57a9eb 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3a76c4), color-stop(100%,#57a9eb)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #3a76c4 0%,#57a9eb 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #3a76c4 0%,#57a9eb 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #3a76c4 0%,#57a9eb 100%); /* IE10+ */
    background: linear-gradient(to top, #3a76c4 0%,#57a9eb 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a76c4', endColorstr='#57a9eb',GradientType=0 ); /* IE6-9 */
    box-shadow:none;
    text-shadow:0 -1px 0 #1e3c5e;
}
.boton:disabled {
    background: silver; /* Old browsers */
    background: -moz-linear-gradient(top, silver 0%, #EAEAEA 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,silver), color-stop(100%,#EAEAEA )); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, silver 0%,#EAEAEA 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, silver 0%,#EAEAEA 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, silver 0%,#EAEAEA 100%); /* IE10+ */
    background: linear-gradient(to top, silver 0%,#EAEAEA 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='silver', endColorstr='#EAEAEA',GradientType=0 ); /* IE6-9 */
    box-shadow:none;
    text-shadow:0 -1px 0 gray;
    border: 1px solid gray;
}
.conf {
    height: 2.8em;
    line-height: 2.8em;
    color: #003366;
    display: none;
    cursor:pointer;
    margin-left: 20px;
    font-size: large
}

.tblinv {border: 0px solid silver; border-collapse: collapse; width: 100%; font-weight: 400; font-size: large; border-radius: 6px; overflow: hidden; margin-bottom: 40px}
.tblinv th {border: 1px solid #E0E0E0; width: auto; font-weight: 400 ; background-color: #F7F7F7; line-height: 2.5em; padding: 0 5px 0 5px}
.tblinv th:nth-child(3) {text-align: left}
/*.tblinv tr {border-bottom: 1px solid #F3F3F3;}*/
.tblinv tr:hover { background-color: #F7F7F7 ;}
.tblinv td {width: auto;height: 3em; line-height: 3em; font-weight:300; padding: 0 5px 0 5px; text-align:left;}
.tblinv td:nth-child(1) {text-align: center; font-weight:500}
.tblinv td:nth-child(2) {text-align: center}
.tblinv td:nth-child(3) {text-align: left}
.tblinv td:nth-child(4) {text-align: center; font-weight: 400}
.tblinv td:nth-child(5) {text-align: center}
.tblinv td:nth-child(6) {text-align: center; font-weight: 400}


/* form edit */

.tblEdit {width: 100%; margin: 0px; font-size: medium; border: 0px;}
.tblEdit td {width: auto; line-height: 3em}
.tblEdit td:nth-child(1) {width: 160px}
.tblEdit td:nth-child(2) {width: auto}


.tblEdit label { font-size: medium}

.tblpc { border: 0px solid silver; border-collapse: collapse; width: 100%; font-weight: 300; font-size: large; border-radius: 6px; overflow: scroll;}
.tblpc th {border: 0; font-size: large; font-weight:400 ; background-color: #F7F7F7; height: 3em; padding-left:10px; padding-right:5px; text-align:left}
.tblpc tr {border-bottom: 1px solid #F3F3F3;}
.tblpc td {font-size: large; font-weight: 300; text-align:left; height: 3em; line-height: 3em; padding-left: 10px; padding-right:5px;}
.tblpc tr:hover {background-color: #F7F7F7}

.pop {z-index: 300; border-radius: 4px;display:none; overflow: auto; border:1px solid gray; padding:10px;; background-color:white; position:absolute; width: 650px; height: 500px; top:160px; left:470px; line-height:150%; box-shadow: 2px 2px 2px 0px silver}

.Msg {margin-left: 20px; font-size: medium; font-weight: 400; color:#CC0000; text-align: right}

.msgpay {margin-top: 50px; width: 95%;padding: 10px; font-size: medium; color: firebrick; border: 1px solid cornflowerblue; border-radius: 8px}

