/* ===============================
    HTML Elements
=============================== */
*{
    margin:0;
    padding:0;
}
img, div,a {
    vertical-align:text-bottom;
}
body{
    font-size: 12px;
    font-family: Arial, Tahoma, Verdana;
}
a, a:visited{
    text-decoration:none;
}
img{
    border:0;
    margin:1px;
}
p{
    padding:3px;
}
h2{

}
input{
    padding:2px;
}
select{
    padding:2px;
}
fieldset {
    display:block;
    padding:5px 10px 5px 10px;
    line-height:20px;
    margin-bottom:10px;
}
legend {
    font-size:12px;
    font-weight:bold;
    padding:1px;
    padding-left:3px;
    width:256px;
}
label {
    clear:left;
    display:block;
    float:left;
    width:85px;
    text-align:left;
    padding-right:10px;
    vertical-align:middle;
}


/* ===============================
    Structure
=============================== */
#container{
    width:1200px;
    margin-left:auto;
    margin-right:auto;
}
#header{
    width:1200px;
}
#header h2{
    margin-top:10px;
}
#content{
    min-width:740px;
    margin:10px 0 10px 0;
    margin-left:200px;
    margin-top:78px;
    padding:10px;
}
.print #content{
    min-width:740px;
    margin:10px 0 10px 0;
    padding:10px;
}
#sidebar{
    background:#FFF;
    width:170px;

    margin:0px 0 10px 0;
    padding:10px;
}
#notification{

    background:#FFF;
    width:170px;
    margin:0px 0 10px 0;
    padding:10px;
}
#sideWrapper{
    width: 190px;
    float:left;
}
#footer{
    clear:both;
    padding:5px;
    margin-top:10px;
    min-width: 950px;
}


/* ===============================
    Box Class
=============================== */
.box h3{
    padding:5px;
    font-size:14px;
}
.smallBox h3 {
    padding:2px;
    font-size:12px;
}
.smallBoxDashed h3 {
    padding:2px;
    font-size:12px;
}
.dptmtBox {
    margin: 10px;
    border: 1px;
}
.permBox td {
    border: 0px;
}


/* ===============================
    AutoComplete
=============================== */
.autocomplete-w1 { 
    position:absolute; 
    top:0px; 
    left:0px; 
    margin:6px 0 0 6px; 
    /* IE6 fix: */ 
    _background:none; 
    _margin:1px 0 0 0; 
}
.autocomplete { 
    border:1px solid #999; 
    background:#FFF; 
    cursor:default; 
    text-align:left; 
    max-height:350px; 
    overflow:auto; 
    margin:-6px 6px 6px -6px; 
    /* IE6 specific: */ 
    _height:350px;  
    _margin:0; 
    _overflow-x:hidden; 
}
.autocomplete .selected { 
    background:#F0F0F0; 
}
.autocomplete div { 
    padding:2px 5px; 
    white-space:nowrap; 
    overflow:hidden; 
}
.autocomplete strong { 
    font-weight:bold; 
    color:#000000; 
}

/* ===============================
    Login MessageBox
=============================== */

.loginMsgBox{
    padding:5px;
    color: #c09853;
    background-color: #fcf8e3;
    border-color: #fbeed5;
}
.loginMsgBoxPass{
    padding:5px;
    color: #468847;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}
.loginMsgBoxFail{
    padding:5px;
    color: #b94a48;
    background-color: #f2dede;
    border-color: #eed3d7;
}


/* ===============================
    Department 
=============================== */
.dptmtButton{
    padding:5px;
    font-size:14px;
    background:#f7f6f0;
    border-bottom:1px solid #e8e7e1;
    color:#a43708;
    font-weight: bold;
}

.dptmtRadio{
    width: 200px;
    padding:5px;
    margin-bottom:5px;
    margin-left:10px;
    font-size:14px;
    font-weight: bold;
}


/* ===============================
    Pagination
=============================== */
a.pagi
{ 
    margin: 5px; 
    padding:4px;
    border:solid 1px #dddddd;
    color:#0063DC; 
}
a.currentPage
{ 
    margin: 5px; 
    padding:4px;
    border:solid 3px #dddddd;
    color:#0063DC; 
}

#pagination{
    margin:5px;
    padding: 5px;
    text-align: center;
    display: table;
    table-layout: fixed;
    width:100%;
}
#previousPagi{
    display: table-cell;
    text-align: right;
}
#nextPagi{
    min-width: 50px;
    display: table-cell;
    text-align: left;
}
#pagesPagi{
    display: table-cell;
}

.perPageForm{
    padding: 0px;
}
.perPageForm select{
    margin-bottom: 0px;
    width:55px;
}


/* ===============================
    Notification
=============================== */
.notifText {
    font-weight:bold;
    font-size: 15px;
    color: #000000;
}
.notifBox {
    margin-right:12px;

}
.notifNone {
    opacity: 0.3;
}

#notifList thead th  {
    font-weight: bold;
}
#notifList th  {
    font-weight: normal;
}
table#notifList tbody tr:hover {
    cursor: pointer;
    background-color: #eee;
}
#notifBoxIcons {
    float:left;
}


/* ===============================
    Sidebar
=============================== */
#sidebar ul{
    list-style:none;
    line-height:22px;
}
#sidebar ul li a,#sidebar ul li a:visited{
    padding-left:19px;
    text-decoration:none;
    margin:0 3px;
    display:block;
}
#sidebar ul li a:hover{
    text-decoration:underline;
}
#sidebar ul li ul{
    margin-left:10px;
}
#sidebar h3{
    padding:2px;
    font-size:14px;
}


/* ===============================
    TopMenu, Top-Panel
=============================== */
#topmenu{
    margin-top:11px;
    margin-bottom: 1px; 
    width:700px;
    float:left;
    height: 25px;
}
#topmenu ul{
    list-style:none;
    line-height:25px;
}
#topmenu li{
    display:inline;
}
#topmenu a,#topmenu a:visited{
    padding:5px 12px 5px 12px;
    text-decoration:none;
}
#topmenu .current a, #topmenu .current a:hover, #topmenu .current a:visited{
    padding:5px 12px 5px 12px;
    font-weight:bold;

}
#top-panel{
    background:#FFF;
    height:25px;
    min-width:960px;
    float:left;
    width:100%;
    padding-top: 5px;
    padding-bottom: 5px;
}
#top-panel ul{
    list-style:none;
    padding-left: 5px;
}
#top-panel ul li{
    display:inline;
    line-height:20px;
}
#top-panel ul li a{
    padding-left:19px;
    text-decoration:none;
    margin:0 3px;
    display:inline-block;
}
#top-panel a:hover{
    text-decoration:underline;
}
#panel-login {
    padding-right: 5px;
}


/* ===============================
    Tables
=============================== */
table{
    margin:5px;
    border-collapse: collapse;
    table-layout:auto;
    width:98%;
    text-align: left;
}
td, th{
    padding: 2px;
}
thead{

}

/* No Border Table */
table.noborder td {
    border:0px;
}
table.noborder tr th {
    border:0px;
}


/* ===============================
    Forms - General
=============================== */
form{
    padding:10px;
    margin:0 auto;
}
form fieldset {
    display:block;
    padding:5px 10px 5px 10px;
    line-height:20px;
    margin-bottom:10px;
}
form legend {
    font-size:12px;
    font-weight:bold;
    margin-bottom:5px;
    padding:1px;
    padding-left:3px;
    width:256px;
}
form label {
    clear:right;
    display:block;
    float:left;
    width:110px;
    text-align:right;
    padding-right:10px;
    padding-top: 4px;
    vertical-align:middle;
}
form input {
    padding:3px;
    margin-bottom:5px;
    margin-left:5px;

}
form select {
    margin-left:5px;
    margin-bottom:5px;
    width: 150px;
}
form textarea {
    width:410px;
    height:200px;
    padding:5px;
    overflow:auto;
    margin-left:5px;
}
form option {
    background:#FFF;
}
form optgroup option {

}
form input[type=checkbox] {
    border:none;
    background:none;
    padding: 0px;
}
form input[type=radio] {
    border:none;
    background:none;
    padding: 0px;
}
form #buttonSend, form #buttonReset {
    padding-right:5px;
    cursor:pointer;
    width:150px;
    margin-left:8px;
    font-weight:bold;
}
form #buttonSend:hover, form #buttonReset:hover {
    background-position:center left;
}
form input[disabled='disabled']{
    background:#CCC;
}


/* ===============================
    Forms - Comments
=============================== */
form#cmt_form textarea {
    width:500px;
    height:100px;
}


/* ===============================
    Forms - Filter
=============================== */
form#filter label {
    font-weight:bold;
}


/* ===============================
    Ticket - View
=============================== */
form#t_edit div {
    clear: left;
    display: block;
    float: left;
}

form#t_edit textarea {
    width:500px;
    height:100px;
}
form#t_edit label {
    font-weight:bold;
}

.ticketLog{
    width: 500px;
}
.ticketLog .iconLog{
    width: 16px;
}
.ticketLog .field{
    width: 100px;
    text-transform: capitalize;
}
.ticketLog .oldValue{
    width: 192px;
}
.ticketLog .newValue{
    width: 192px;
}
.detailButton{
    font-size: 12px;
    opacity:0.6;
}
.logComment{
    padding:4px;
}
#ticketBox td{
    border:0px;
}


/* ===============================
    Ticket - New
=============================== */
#ticketSubmit {
    text-align: center;
}


/* ===============================
    Ticket - Index
=============================== */
table#ticketList {
    border: 1px;
    padding-left: 5px;
    padding-right: 5px;
}

table#ticketList tr {
    text-align: center;
}

table#ticketList tbody tr:hover {
    cursor: pointer;
    background-color: #eee;
}

#techSelect {
    border: 0px;
    margin: 0px;
    padding: 0px;
}

form#techList {
    padding: 0px;
}

#ticketLegend {
    text-align: center;
}


/* ===============================
    Dashboard
=============================== */
fieldset#ITHboard, fieldset#ITHnews{
    height: 300px;
    margin-bottom: 0px;
}

#ITHboardDate{
    text-align: right;
    font-size: 10px;
    font-weight: bold;
}


/* ===============================
    SUI - List
=============================== */
#suiList{
    padding: 10px; 
}

.suiList tr{
    height: 50px;
}

.suiIcon {
    height: 32px;
    width: 32px;
    text-align: center;
}

form#softForm label{
    clear:left;
    width: 125px;
    text-align: right;
    margin-top: 2px;
}
form#catForm label{
    clear:left;
    width: 125px;
    text-align: right;
    margin-top: 2px;
}


/* ===============================
    SKU - List
=============================== */
#skuList{
    padding: 10px; 
}

.skuList tr{
    height: 50px;
}

.skuIcon {
    height: 32px;
    width: 32px;
    text-align: center;
}


/* ===============================
    Errors
=============================== */
.Error{
    color: red;
}

label.error { 
    float: none; 
    clear: left; 
    color: red; 
    padding-left: .5em; 
    vertical-align: top; 
    width: inherit; 
    display: inline 
}

.error_box {
    background-color: #FFFFCC;
    border: 1px solid #DC143C;
    color: #DC143C;
    margin: 0 auto;
    overflow: auto;
    padding: 5px;
    position: relative;
    text-align: left;
    width: 90%;
    z-index: 5;
}

/* Error Class for forms*/
div.error { border: 2px dotted red; padding-top: 5px}
input.error { border: 2px dotted red; }
textarea.error { border: 2px dotted red; }


/* ===============================
    Logs
=============================== */
.logBox{ 
    overflow-x: scroll;
}
.log{
    font-family: courier;
    width: 3000px;
}


/* ===============================
    Other
=============================== */

/* Hovering Table */
.hovertable tbody tr:hover {
    background-color: #eee;
}


/* Category selection*/
.catBody {
    display: none;   
}
.catHead {
    cursor: pointer;
}
#loading
{ 
    width: 100%; 
    position:absolute;
}
.noDisplay{
    display: none;
}

/* Underline Text but not img. */
a.imgLink { text-decoration: none; }
a.imgLink span { text-decoration: underline; }

.a-right{text-align:right;}
.a-left{text-align:left;}
.a-center{text-align:center;}


#languageswitcher{
    float:right;
    margin-right: 25px;
}
#languagewitcher ul{
    list-style:none;
    line-height:10px;
}
#languageswitcher li{
    height:12px;
    display:inline;
}



#styleswitcher{
    float:right;
}
#styleswitcher ul{
    list-style:none;
    line-height:10px;
}
#styleswitcher li{
    height:12px;
    display:inline;
}
#footer ul {
    list-style:none;
}
#footer li {
    display:inline;
}
a#defswitch {
    width:15px;
    height:10px;
    margin: 3px 0 3px 0;
    background-color:#bd3f09;
    font-size: 8px;
    color:#bd3f09;
    display:inline-block;
}
a#blueswitch {
    width:15px;
    height:10px;
    margin: 3px 0 3px 0;
    background-color:#375b91;
    font-size: 8px;
    color:#375b91;
    display:inline-block;
}
a#greenswitch {
    width:15px;
    height:10px;
    margin: 3px 0 3px 0;
    background-color:#d0e0b8;
    font-size: 8px;
    color:#d0e0b8;
    display:inline-block;
}
a#brownswitch {
    width:15px;
    height:10px;
    margin: 3px 0 3px 0;
    background-color:#654322;
    font-size: 8px;
    color:#654322;
    display:inline-block;
}
a#mixswitch {
    width:15px;
    height:10px;
    margin: 3px 0 3px 0;
    background-color:#294145;
    font-size: 8px;
    color:#294145;
    display:inline-block;
}
a#monoswitch {
    width:15px;
    height:10px;
    margin: 3px 0 3px 0;
    background-color:#000000;
    font-size: 8px;
    color:#000000;
    display:inline-block;
}
#credits{
    clear:both;
    float:left;
}