body{font-family:arial, helvetica, sans-serif; font-size:9pt; margin:0; padding:0; text-align:center;}
table input{width: auto; height: auto;}

img, fieldset { border:none; }
fieldset {clear:both; margin:0; padding:2px 0 2px 0;}

.btn, .btn a{display:block; width:134px !important; height:27px; border:none; font-family:arial, helvetica, sans-serif !important; line-height:27px !important; background:url(../images/button.jpg) top left no-repeat; text-align:center; color:#fff !important; font-weight:bold; text-decoration:none; padding:0; margin:0;}
form .btn{padding-bottom:4px;}

h1, h2, h3 {font-weight:normal; margin:0; padding:0;}

th{font-weight:bold; text-align:left; padding-left:3.5px;}

#container {width:760px; margin: 0 auto 0 auto; border:1px solid; text-align:left;}
  #header{padding:0 10px 0 0; height:100px; border-bottom:1px solid; overflow:none; background: #FFFFFF url(../images/header_background.jpg) repeat-x left top;}
  #footer {height:24px; border-top:1px solid; border-bottom:1px solid; text-align:center; overflow:none;}
    #header p{width:300px; float:right; font-size:10px; line-height:10px; height:10px; text-transform:uppercase; text-align:right; padding-bottom:5px;}

  #nav {clear:both;}   
    #nav {clear:both; margin:0; padding:0 40px 0 0; height:24px; border-bottom:1px solid;}
    #nav li {list-style:none; margin:0; padding:0; display:inline;}    
    #nav li a{height:24px; line-height:24px; display:block; float:left; padding-left:25px; margin:0 10px 0 10px; text-decoration:none; font-weight:bold;}

    #nav a.home { background:url(../images/home.gif) 0 5px no-repeat; }
    #nav a.new_ticket { background:url(../images/new_ticket.gif) 0 5px no-repeat; }
    #nav a.my_tickets { background:url(../images/my_tickets.gif) 0 5px no-repeat; }
    #nav a.ticket_status { background:url(../images/ticket_status.gif) 0 5px no-repeat; }
    #nav a.log_out { background:url(../images/logout.gif) 0 5px no-repeat; }
   
  #content{clear:both; padding:2px 10px 10px 10px; line-height:14pt; margin:5px auto 5px auto;}
    #content #index {width:525px; margin:10px auto 10px auto;}

    #index .box{width:250px; float:left;}    
    #index .box p {clear:both; padding-top:10px; text-align:justify;}
    
    #content form{margin:0; padding:0;}
      #content form label{display:block; width:60px; padding-right:10px; text-align:right; float:left; font-weight:bold;}
      #content #index form input{width:175px; float:left;}
    #content #bar{width:21px; height:auto; display:block; float:left;}
   
   #ticketform{padding:20px 20px 50px 20px; width:600px; margin:20px auto 20px auto; border:1px solid;}
   #loginform{padding:20px 20px 50px 20px; width:400px; margin:20px auto 20px auto; border:1px solid;}
   
   #ticketform input, #ticketform select {
     width:300px;
     float:left;
   }

   #loginform input {
     width:160px;
     float:left;
   }
      
   #ticketform label {
     width:130px;
     text-align:right;
     display:block;
     float:left;
     padding-right:10px;
   }
   
   #loginform label {
     width:130px;
     text-align:right;
     display:block;
     float:left;
     padding-right:10px;
   }
   
   #ticketform textarea {
     width:400px;
   }
   
   #ticketform .ticketsubmit {
     margin-left:410px;
   }
   
   #loginform .ticketsubmit {
     margin-left:170px;
   }

   
  #powered_by {
      clear:both;
      display:block;
      width:126px;
      height:23px;
  }
   

.error{font-family: Arial, Helvetica, sans-serif; font-size: 10px; text-decoration: none; border: none; font-weight: bold;}
.msg{font-family: Arial, Helvetica, sans-serif; font-size: 13.5px; text-decoration: none; font-weight: bold;}

#infomessage, #warnmessage, #errormessage {
    margin-bottom: 1.5em;
    padding: 0.3em;
    font-weight: bold;
    border-top: 1px solid;
    border-bottom: 1px solid;
}


/* Buttons  */
.button{font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; margin: 5px; border: 1px solid;}
    
/* Generic CSS based Icons. use=> <tag class="Icon iconname">text</tag> */
.Icon{width: auto; padding-left:20px; background-position: left center; background-repeat: no-repeat; color:#006699; text-decoration: none;}

a.Icon{ }
a.Icon:hover{text-decoration: underline;}

.Icon.Ticket{background:url(../images/icons/ticket.gif) 0 2px no-repeat;}
.Icon.webTicket{background:url(../images/icons/ticket_source_web.gif) 0 2px no-repeat;}
.Icon.emailTicket{background:url(../images/icons/ticket_source_email.gif) 0 2px no-repeat;}
.Icon.phoneTicket{background:url(../images/icons/ticket_source_phone.gif) 0 2px no-repeat;}
.Icon.attachment{background-image: url(../images/icons/attachment.gif);}
.Icon.file{background-image: url(../images/icons/attachment.gif);}
.Icon.refresh{background-image: url(../images/icons/refresh.gif);}   
.Icon.thread{font-weight: bold; font-size: 1em; background-image: url(../images/icons/thread.gif);}

/* Ticket view (Messages and Responses) */
#ticketthread table.message {margin:10px 0 5px 0;}
#ticketthread table.response {margin-bottom:5px;}

table.message, table.response {
    border: 1px solid;
    border-bottom: none;
}

table.message td, table.message th,table.response td, table.response th {
    border-bottom:1px solid;
    padding:5px;
}

table.message tr.header td, table.response tr.header td {
    padding:1px;
    padding-left:5px;
}

table.message th, table.response th {
    line-height:24px;
    font-size:12px;
    padding:1px;                
    padding-left:5px;
    font-weight:bold;
}