/**
------------------------------------------------------------------------------------------------------
@project   : Admin Panel
@version   : 1.4
@url       : http://www.cnctechnologies.net
@author    : Network Admin
@info      : Base stylesheet used for the entire site, controls base elements, colour and typography.
------------------------------------------------------------------------------------------------------
*
* BODY
* NOTE: Set the font size in % for a consistent change in size according to user settings
*/
body, html{
margin:0;
padding:0;
width:100%;
height:100%;
font:92% "Trebuchet MS", arial, verdana, sans-serif;
color:#333;
background:#FFF;
}

/**
 * LINE-HEIGHT (LEADING)
 * Default line-height based on font-size rather than "computed-value"
 * @see: http://www.w3.org/TR/CSS21/visudet.html#line-height
 */
body * {line-height:1.7em;}

/**
 * HEAD
 */
h1, h2, h3, h4, h5{margin:0;padding:0;}

/* Base font sizes */
h1{font:197% "Trebuchet MS", arial, verdana, sans-serif;} /* 26px equiv */
h2{font:182% "Trebuchet MS", arial, verdana, sans-serif;} /* 24px equiv */
h3{font:167% "Trebuchet MS", arial, verdana, sans-serif;} /* 22px equiv */
h4{font:152% "Trebuchet MS", arial, verdana, sans-serif;} /* 20px equiv */
h5{font:136% "Trebuchet MS", arial, verdana, sans-serif;} /* 18px equiv */

/**
 * P, TABLE, TH, TR, TD
 */
p, table, th, tr, td, form{margin:0;padding:0;border:0;}

/**
 * A
 */
a{
color:#000;
background:inherit;
}

/**
 * A:HOVER
 */
a:hover{
color:#4ac1d8;
}

/**
 * IMAGE
 * Remove border from image, rollover border for image a tags
 */
img{border:0;}

/**
 * FORM ELEMENTS
 * 99% for safari; 100% is too large
 */
select, input, textarea{font:99% sans-serif;}

/**
 * Bump up !IE to get to 13px equivalent
 */
pre, code{font:115% monospace;}

/**
 * Clear floating elements
 */
.cleaner{clear:both;height:1px;}

/**
 * SPAN
 */
span{display:none;}

/**
 * EM
 */
em{color:#AAA;background:#FFF;}

/**
 * PAGE DIVS
 */
#page{
width:100%;
}

#content{
margin:0 auto;
width:930px;
}

/**
 * HEADER
 */
h1{
margin:0 0 45px;
width:400px;
height:190px;
background:#FFF url(images/logo.png) no-repeat 0 0;
}

.head-wrapper{
width:100%;
height:190px;
background:#FFF url(images/panel-background.png) repeat-x 0 0;
}

h2{
margin:0;
padding:20px 20px 15px;
color:#555;
width:50%;
}

hr{
border:1px solid #999;
}

/**
 * LIST
 */
ul{
margin:0;
padding:0 20px 10px;
list-style-type:none;
}

.nav{
margin:0;
padding:0;
position:absolute;
top:160px;
right:20px;
}

.top-nav{
padding:0;
margin:0;
display:inline;
}

.top-nav a{
padding:10px;
margin:0;
color:#000;
text-decoration:none;
font-weight:bold;
text-transform:uppercase;
}

.top-nav a:hover{
background:#000;
color:#FFF;
}

/**
 * LISTS
 */
dl, dd, dt{
margin:0;
padding:0;
}

dl{
margin:10px;
padding:10px;
width:260px;
background:#FFF url(images/background.png) repeat-x 0 100%;
border:1px solid #F1F1F1;

}

dt{
text-align:center;
margin:0 0 8px;
padding:20px 0 20px;
height:20px;
font:152% "Trebuchet MS", arial, verdana, sans-serif;
}

dd{
margin:0 0 10px;
padding:0;
}

.left-col{ float:left; }

.green{
padding:0 0 0 20px;
color:#000;
background:#FFF url(images/started.png) no-repeat 0 50%;
}

.red{
padding:0 0 0 20px;
color:#000;
background:#FFF url(images/stopped.png) no-repeat 0 50%;
}

.disconnected{
padding:0 0 0 20px;
color:#000;
background:#FFF url(images/disconnect.png) no-repeat 0 50%;
}

.configure{
padding:0 0 0 20px;
color:#000;
background:#FFF url(images/configure.png) no-repeat 0 50%;
}

.stop{
padding:0 0 0 20px;
color:#000;
background:#FFF url(images/stop.png) no-repeat 0 50%;
}

.ban{
padding:0 0 0 20px;
color:#000;
background:#FFF url(images/ban.png) no-repeat 0 50%;
}

.red-text{
padding:5px;
color:#3fa6ba;
background:#FFF;
border:1px solid #EEE;
display:block;
}

.info{
padding:5px 10px;
color:#000;
background:#FFF;
border:1px solid #EEE;
}

.full-width{
margin:10px auto;
padding:10px;
width:75%;
text-align:left;
background:#FFF url(images/background.png) repeat-x 0 50%;
border:1px solid #F1F1F1;
}

.full-width tr{
text-align:center;
}

.full-width td{
padding:5px;
background:#FFF;
}

.blanked{
background:#F1F1F1;
}

.med-width{
margin:10px auto;
padding:1px;
width:45%;
text-align:left;
background:#FFF url(images/background.png) repeat-x 0 100%;
border:1px solid #F1F1F1;
}

.med-width td{
width:50%;
padding:5px;
background:#FCFCFC;
}

.head-td{
}

/**
 * FORM ELEMENTS
 */
.padded-input{
padding:6px;
border:1px solid #DDD;
}

#hide1, #hide2{
margin:10px 0;
padding:15px;
background:#F9F9F9;
border:1px solid #EEE;
}

#hide1 p, #hide2 p{
margin:0 0 5px;
}


/**
 * FOOTER
 */
#footer{
margin:40px 0 0;
padding:30px 10px;
text-align:center;
}