/*Reset to a sane default across browsers*/
html, body{
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
}

a,blockquote,body,div,dl,dt,dd,form,fieldset,h1,h2,h3,h4,h5,h6,html,img,input,label,li,ul,ol,p,pre,span,textarea,table,tbody,td,th,thead,tr {
  border: 0;
  margin: 0;
  padding: 0;
}

table {
  table-layout: auto;
}

select,input,button,textarea{
  font-size:99%;
}

select {
  margin: 0;
}

table{
  border-collapse:collapse;
  border-spacing:10px;
  cell-spacing:10px;
  empty-cells:show;
  width: 100%;
}
/*End Reset*/

/* Lets set the primary styles and feel for the app */
body {
  font-family: "Liberation Sans", "URW Gothic", "Helvetica", "Luxi Sans", "Bitstream Vera Sans", arial,helvetica,clean,sans-serif;
  color: #333333;
  background-color: #EEEEEE;
  font-size: 1em;
}

a { color: #333333; text-decoration: none; }
a:hover { color: #306CAC; }
img { border: 0px; }
h1,h2,legend { color: #306CAC; font-weight: bold; }
h1 { font-size: 1.5em; }
h2,legend { font-size: 1.2em; margin-bottom: 0px; }
hr { height: 1px; margin: 0px; }
input, textarea { padding: 2px 4px; border: 1px solid #306CAC; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; }
input[type=text], input[type=password], select { width: 350px; }
input[type=submit], input[type=reset], input[type=button] { width: auto; margin-top: 5px; margin-bottom: 5px; }
input[type=checkbox] { background: none;  border: none; margin-right: 196px; margin-top: 5px; }
label { font-weight: bold; }
ol, ul { list-style: none; }
textarea { height: 8em; width: 25em; margin-bottom: 4px; }
pre textarea { height: 30em; width: 60em; }

/* Defining the classes */
.button, .action {
  text-decoration: none;
  background-color: #306CAC;
  border: 0px;
  font-weight: bold;
  color: #dddddd;
  cursor: pointer;
  margin: 0px 2px;
  padding: 2px 7px;
  -moz-border-radius:3px;
  -webkit-border-radius: 3px;
  text-transform: capitalize;
}
.button:hover, .action:hover {
  color: #DDDDDD;
  background-color: #333333;
}
.warn { color: #990000; font-weight: bold; font-size: 1.0em; }
.rpointers { font-size: 1.0em; margin-left: 5px; }
.lpointers { font-size: 1.0em; margin-right: 5px; }

/* Defining classes specific to a tag */
body.loginscreen { background-image: none; }
input.action { height: 22px; }
ol.sectionbody label { width: 300px; vertical-align: top; display: inline-block; line-height: 1.8; }
ol label { width: 300px; vertical-align: top; display: inline-block; line-height: 1.8; }
div.multiselect { display: -moz-inline-box; display:inline-block; vertical-align:top; clear: both; margin-bottom: 4px;}
div.multiselect label { width: auto; font-weight: normal; display: inline; }
div.multileft { float: left; text-align: left; width: auto; }
div.multileft select, div.multiright select { height: 156px; min-width: 150px; width: auto; }
div.multibuttons { width: 55px; padding-top: 75px; float: left;}
div.multibuttons input.button { font-size: .8em; clear: both; width: 50px; margin: 2px;}
div.multiright { float: left; text-align: right; width: auto; }
li.paginate { float:right; }
li.paginate select { width: auto; }
span.context-tip {
  display: none;
  background-repeat: no-repeat;
  background-image: url('/cobbler_webui_content/tooltip.png');
  padding-left: 30px;
  color: #EEEEEE;
}
span.context-tip:hover {
  background: none;
  padding: 0;
  color: #333333;
  font-size: .7em;
  font-style: italic;
}

/* Now for the 'id' specific statements */
#login { width: 250px; margin: auto; padding-top: 100px; text-align: center;}
#login input { text-align: center;}
#login input[type=text], #login input[type=password] { width: 200px; }

#container { position: relative; min-height: 100%; }

#header { height: 80px; width: 100%; }
#logo { float: left; }
#logo img { width: 180px; height: 60px; padding: 10px; }
#user { margin: 10px; text-align: right; font-size: 0.85em; float: right; }

#body { padding: 5px; padding-bottom: 25px; }
#menubar { float: left; padding-left: 10px; width: 15%; }
#menubar h1 { font-size: 1.0em; margin-bottom: 4px; }
#menubar ul { padding-left: 2px; margin: 0px; margin-bottom: 8px; }
#menubar ul li { font-size: .8em; padding-left: 8px; }

#submenubar { width: 100%; }
#submenubar li { float: left; height: 26px; margin-left: 8px; }
#submenubar li:first-child { margin-left: 0px; margin-top: 3px; }
#submenubar li.paginate { float: right; }
#submenubar li.paginate select { width: auto; }
#submenubar input { margin: 0px; }
#submenubar .action, #submenu .button { height: 26px; }

#content { float: left; width: 80%; }
#spacer { clear: both; }

#footer { font-size: .8em; text-align: center; position: absolute; width: 100%; bottom: 0px; height: 25px; }

#batchactions { font-weight: normal; width: auto; }
#batchactions option { padding-left: 1em; font-weight: normal; }
#batchactions option:first-child { font-weight: bold; padding-left: 0; }

#filter_field { width: auto; }

#listitems { clear: both; }
#listitems thead { background-color: #306CAC; color: #dddddd; font-weight: bold; text-align: left; }
#listitems thead a { color: #dddddd; }
#listitems thead tr th:first-child { width: 2em; padding-left: .3em; }
#listitems tbody tr a.action, #listitems tbody tr span.action { font-size: .8em; float: left; padding: 1px 7px; }
#listitems tbody tr { background-color: #eeeeee; }
#listitems tbody tr.selected { background-color: #e0e0e0; }
#listitems tbody tr:hover { background-color: #cccccc; }
#listitems tbody td { border-bottom: 1px solid #cccccc; }
#listitems tbody td:first-child { width: 2em; padding-left: .3em;}
#listitems tbody td:last-child { width: 21em; }
#listitems input[type=checkbox] { margin-right: 0px; }

#aiform li, #snippetform li { margin-top: 4px; }
#aiform input[type=checkbox], #snippetform input[type=checkbox] { margin-right: 0px; }

#filter-adder { margin-top: 5px; }

/* 
  jQuery UI formatting for tabs, some styling based on examples here:
  http://keith-wood.name/uiTabs.html 
*/
.ui-tabs .ui-tabs-nav li a {
  padding: 0.5em 0.5em;
  font-size: 0.95em;
  font-weight: bold;
}
.ui-widget {
  font-family: "Liberation Sans", "URW Gothic", "Helvetica", "Luxi Sans", "Bitstream Vera Sans", arial,helvetica,clean,sans-serif;
  font-size: 0.85em;
  font-weight: normal;
}
#tabs {
  width:100%;
  padding: 0px;
  background: none;
  border-width: 0px;
}
#tabs .ui-tabs-nav {
  padding-left: 0px;
  background: transparent;
  border-width: 0px 0px 1px 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
}
#tabs .ui-tabs-panel {
  border-width: 0px 1px 1px 1px;
  background-color: white;
}