/** ELEMENTS **/
*
{
  box-sizing: border-box; font-size: 13px; -webkit-user-select:none;
  font-family: Tahoma, 'Lucida Grande CE', lucida, sans-serif; margin: 0px; padding: 0px;
}

a { color: black; text-decoration: none; }

html,
body 
{
  width: 1000px;
  min-height: 500px;  
}

button {
  background-image: 
    -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #AAA));
  cursor: pointer; border: 1px solid silver; border-radius: 4px; height: 26px;  
  line-height: 26px; padding: 0px 7px; vertical-align: middle;
  -webkit-transition: all 0.2s;
}

.sectionMenu button {
  background: none;
  border: 1px solid #78A0BC;   
}
.sectionMenu button:hover {
  -tmp-background-image: 
    -webkit-gradient(
      linear, 
      left top, left bottom, 
      color-stop(0%, #98CBEE),
      color-stop(50%, #83AFCD), 
      color-stop(100%, #98CBEE)
    );
}


  button.icon:before {
    background-image: url(/images/common/e.gif);
    background-repeat: no-repeat;
    content: ""; display: inline-block; height: 16px; padding-right: 5px; position: relative;
    width: 16px; top: 3px;
  }
  
  button.icon.icon2:before {
    background-image: url(/images//finance/icons/png/16x16/15_16x16.png);
  }  
  button.icon.icon3:before {
    background-image: url(/images//finance/icons/png/16x16/18_16x16.png);
  }  
  
  

button:active:not(:disabled),
button.active:not(:disabled)
{
  background-image: 
    -webkit-gradient(linear, left bottom, left top, color-stop(0%, white), color-stop(100%, #AAA));
}

fieldset
{
  border: 1px solid #98CBEE; border-radius: 4px; margin: 10px 0px; padding: 7px; -webkit-box-shadow: inset 0px 0px 7px #98CBEE;
}

form
{
}
form th, form td { padding: 2px 0px; } 
form th label { display: block; font-weight: bold; padding-right: 3px; text-align: right; }

input[type="text"],
input[type="password"],
input[type="number"],
input[type="datetime-local"],
input[type="date"],
input[type="datetime-local"],
textarea,
select
{
  border: 1px solid silver; border-radius: 4px; padding: 2px; resize: none;
  -webkit-user-select: auto; width: 200px;
}
input[type="number"],
input[type="datetime-local"],
input[type="date"],
input[type="datetime-local"],
select
{
  border-top-right-radius: 0px; border-bottom-right-radius: 0px;
  width: 204px;
}

input[type="file"]
{
  visibility: hidden;
  width: 1px;
  height: 1px;
}

input:required,
textarea:required
{
  background: #F2FFF2; 
}

input:invalid,
textarea:invalid
{
  background: #FFF2FF; 
}

input:required:invalid,
textarea:required:invalid
{
  background: #F2F2FF; 
}

input:focus,
textarea:focus
{
  border: 1px solid #FAA; outline: none;
}



legend
{
  background-color: white; font-weight: bold; margin-left: 20px; padding: 0px 5px;  
}

table { border-collapse: collapse; }

ul, ul li { list-style-type: none; }



/** /ELEMENTS **/



/** CLASSES **/

.alignCenter { text-align: center !important; }
.alignLeft { text-align: left !important; }
.alignRight { text-align: right !important; }

.w25   { width: 25px !important; min-width: 25px !important; max-width: 25px !important; }
.w50   { width: 50px !important; min-width: 50px !important; max-width: 50px !important; }
.w100  { width: 100px !important; min-width: 100px !important; max-width: 100px !important; }
.w125  { width: 125px !important; min-width: 125x !important; max-width: 125px !important; }
.w150  { width: 150px !important; min-width: 150px !important; max-width: 150px !important; }
.w200  { width: 200px !important; min-width: 200px !important; max-width: 200px !important; }
.w250  { width: 250px !important; min-width: 250px !important; max-width: 250px !important; }
.w600  { width: 600px !important; min-width: 600px !important; max-width: 600px !important; }
.w700  { width: 700px !important; min-width: 700px !important; max-width: 700px !important; }
.w25p  { width: 25% !important; min-width: 25% !important; max-width: 25% !important; }
.w50p  { width: 50% !important; min-width: 50% !important; max-width: 50% !important; }
.w100p { width: 100% !important; min-width: 100% !important; max-width: 100% !important; }


.box { border: 1px solid #98CBEE; border-radius: 4px; margin: 10px 0px; padding: 7px; -webkit-box-shadow: inset 0px 0px 7px #98CBEE; }


table.list { border: 1px solid #96CBE5; margin: 5px 0px; width: 100%; }

table.list tbody tr:nth-child(odd) { background-color: #F5F4F3; }


table.list thead tr:first-child 
{ 
  background-color: #D6D2D0; border-bottom: 1px solid #AFACAA;
}

table.list thead tr:nth-child(2) { display: none; }  
  

table.list td,
table.list th { font-weight: normal; padding: 2px 3px; text-align: left; line-height: 16px; }

table.list td:not(:first-child),
table.list th:not(:first-child) { border-left: 1px solid #AFACAA }


td[data-action="edit"],
td[data-action="delete"],
td[data-action="down"],
td[data-action="view"] {
  background-position: 3px 2px;
  background-repeat: no-repeat;
  cursor: pointer; width: 22px;  
}

td[data-action="edit"] {
  background-image: url(/images/crystalclear/16x16/actions/edit.png); 
}

td[data-action="delete"] {
  background-image: url(/images/crystalclear/16x16/actions/cancel.png); 
}  
td[data-action="view"] {
  background-image: url(/images/crystalclear/16x16/actions/14_layer_novisible.png); 
}  
td[data-action="down"] {
  background-image: url(/images/crystalclear/16x16/actions/down.png); 
}  

.toolbar
{
  background-image: 
    -webkit-gradient(
      linear, 
      left top, left bottom, 
      color-stop(0%, #98CBEE),
      color-stop(50%, #8CBBDB), 
      color-stop(100%, #98CBEE)
    );
  border: 1px solid #78A0BC; border-radius: 4px; overflow: hidden; padding: 2px;
   
  
}
.toolbar li { float: left; margin-right: 3px; }


/** /CLASSES **/




/** ICONS **/
  button#loginBtn:before {
    background-image: url(/images/vistaaero/png/toolbar/16x16/login.png);
  }  
  button#userPassword:before {
    background-image: url(/images/crystalclear/16x16/apps/password.png);
  }    
  button.listIcon:before {
    background-image: url(/images/crystal/16x16/actions/list.png);
  }  
  button.addIcon:before {
    background-image: url(/images/crystalclear/16x16/actions/edit_add.png);
  }  
  button.cancelIcon:before {
    background-image: url(/images/crystalclear/16x16/actions/cancel.png);
  }  
  button.fileImageIcon:before {
    background-image: url(/images/crystalpack/png/file/16x16/image.png);
  }  
  
  button.saveIcon:before {
    background-image: url(/images/crystal/16x16/actions/filesave.png);
  }  
  button.settingsIcon:before {
    background-image: url(/images/nixus/16x16/tools.png) !important;
  }  
  button.userIcon:before {
    background-image: url(/images/nixus/16x16/user.png);
  }  
  button.waitIcon:before {
    background-image: url(/images/common/wait.gif) !important;
  }  
  
  
  
  

/** /ICONS **/


/** LOGIN **/

#loginForm { display: none; }

#loginBox
{
  background: url(/images/dellipack2/128/vault.png) no-repeat 0px center;
  
  height: 140px; margin: 100px auto; padding-left: 140px; width: 485px;
}  
#loginBox form { margin-top:25px; }

#loginBox div { 
  display: none; height: 140px; line-height: 140px; vertical-align: middle;
  text-align: center; 
}  
#loginBox div img { opacity: 0.2; vertical-align: middle; }  
  
/** /LOGIN **/  


/** APPMAINMENU **/
#appMainMenu { float: left; background: #98CBEE; overflow:hidden; width: 200px; }
#appMainMenu li { padding: 0px 0px 5px 5px; }
#appMainMenu li:first-child { padding-top: 5px; }
#appMainMenu a { 
  border: 1px solid rgba(0, 0, 0, 0); border-right: 0px none; border-radius: 4px 0px 0px 4px; 
  display: block; font-size: 20px; height: 78px; line-height: 74px;
  padding-left: 5px; vertical-align: middle; 
  -webkit-transition: all 0.2s;
}

#appMainMenu a.active {
  background-color: white; 
  border: 1px solid rgba(0, 0, 0, 1); border-right: 0px none;
   
}

#appMainMenu a:hover { 
  border: 1px solid rgba(255, 255, 255, 1); border-right: 0px none;
  background-image: -webkit-gradient(
    linear, left bottom, left top, 
    color-stop(0%, rgba(255, 255, 255, 0.5)),
    color-stop(25%, rgba(255, 255, 255, 0)),  
    color-stop(75%, rgba(255, 255, 255, 0)),
    color-stop(100%, rgba(255, 255, 255, 0.5))
  ); 
  -webkit-box-shadow: 0px 0px 10px #000000;
}


#appMainMenu a img { vertical-align: middle; }

/** /APPMAINMENU **/

/** APPMAINCONTENT **/
#appMainContentBox { padding: 5px 5px 5px 205px; min-width: 800px;}
#appMainContent > section { display: none; }
/** /APPMAINCONTENT **/