/*
=========================================

Project Name: Stellasoft
Creation date: 03 December 2012
Last modified: 07 December 2012
Description: 
Version: 1.0
Author: Matt Tymus | matt@stellasoft.co.uk
Company: Stellasoft
Company URI: http: //www.stellasoft.co.uk

===========[TABLE OF CONTENTS]===========

1. BASE
-1.1. CSS Reset [RES]
-1.2. Global Settings [GLO]
-1.3. Common Formatting [COM]
-1.4. Links [LIN]
-1.5. Forms [FOR]
-1.6. Tables [TAB]
-1.7. Global Classes [GLC]
-----
2. CONTENT
-2.1. Header [HEA]
-2.2. Nav [NAV]
-2.3. Content [CON]
-2.4. Footer [FOO]
-2.5. Classes [CLA]
-2.6. Media Queries [MDQ]

=========================================
*/

/* =[RES]= CSS Reset - derivative of YUI Reset CSS - http://developer.yahoo.com/yui/reset/#code ===== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, 
figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 
{margin: 0; padding: 0; border: 0; border: none; line-height: 1; font-size: 100%; font: inherit; vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
html, body, textarea, input {color: #6F6F6F; font-family: 'PT Sans', sans-serif;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
strong { font-weight:bold;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0; font-family: 'PT Sans', sans-serif;}
h1, h2, h3, h4, h5, h6, p{font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:normal;line-height: 1.1em; font-family: 'PT Sans', sans-serif;}
.clear { clear:both;}
embed, object, video {max-width: 100%;min-width: 12px;}
header, footer, nav, section {display: block;}

/* =[GLO]= Global Settings ===== */
html { font-size: 100%; height: 100%; overflow-y: scroll;}
body {text-align:center; margin: 0 auto; background: #fff url(../images/main_bg.png);}
.clear:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
.clear{display: inline-block; margin: 0;}
::-moz-selection{text-shadow:none;  }
::selection {text-shadow:none; }

/* =[TXT] Text Formatting ===== */
p {font-size: .9em; margin: 10px 0 10px 0; line-height: 1.6em; color: #333; text-align:left; }
h1, h2, h3, h4, h5, h6{text-shadow:0 1px 0 #ffffff; font-weight:100; text-align:left; }
h1 {font-size:28px;	line-height:32px;}
h2 {font-size:24px; line-height:26px;}
h3 {font-size:20px;	line-height:24px;}
h4 {font-size:18px;	line-height:22px;}
h5 {font-size:16px;	line-height:22px;}
h6 {font-size:14px;	line-height:20px;}

/* =[LIN]= Links ===== */
a {text-decoration: none; font-weight: bold; }

/* =[FOR]= Forms ===== */
.gobtn:active {position:relative; top:1px;}
#holdingchange {-moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; height:20px; float:left;}
#headerbox {padding:10px 4px 6px 4px; margin:-5px 10px 0 0; float:right;-moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; }

/* =[TAB]= Tables ===== */
table{width:100%; border-collapse:collapse;	margin-bottom:18px;	text-align: left;font-size: .8em;}
table td, table th{border:1px solid; padding:6px 3px; text-align:center;}
table th {background-image: url(../images/alt_bg.png);}
table th{font-weight:700;}
div.chart .legend table{border:0; width:auto;}
div.chart{max-width:100%; margin-bottom:18px;}
div.chart .legend table td{vertical-align:middle; text-align:center;}
table td, table th{border-color:#dddddd #e7e7e7 #dddddd #e7e7e7;}
table th{text-shadow:0 -1px 0 #ffffff;}
table th.smlcol { width: 20px!important;}
.textleft th, .textleft td, .textleft{text-align:left!important;}
th.rvet {min-width: 90px;}
th.oncall {min-width: 50px;}

/* =================================
2. CONTENT STYLES
==================================== */
/* =[HEA]= Header ===== */
header { height: 53px; position:relative; width:100%;}
header h1#logo {height: 46px; padding: 5px 0 0 0; margin-left: 1%; width: 82px; background: url(../images/mainlogo.png) left center no-repeat; text-indent:-99999px; float:left;}
header p {float:right; margin: 0 1% 0 0; font-size:.8em;}

/* =[NAV]= Nav ===== */
nav { height: 34px; position:relative; width:100%;}
nav ul#mainnav {margin-left: 1%;}
nav ul#mainnav li{ float:left;}
nav ul#mainnav li a {height: 34px; line-height: 34px; padding:0 16px; display:block; font-size: .9em; -webkit-transition-duration:0.6s; -webkit-transition-timing-function:linear; -moz-transition-duration:0.6s; -moz-transition-timing-function:linear  transition-duration:0.6s; transition-timing-function:linear; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}

hr {display:block; height:0; line-height:0; border:0; margin:16px 0; float:none; clear:both; padding:0;}
section#content {width: 98.0%; background-image: url(../images/alt_bg.png); border: 1px solid; padding: 12px 0; margin: 9px 1% 9px 1%; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; min-height: 400px; overflow: hidden; left: 0; right: 0; top: 0; z-index: 1;}
#messages {width:100%; min-height:21px;}
#messages h2{font-size: .8em; margin-left: 1%; line-height:21px;}

/* =[FOO]= Footer ===== */
footer { text-align:right; font-size:.8em; margin-right:1%;}

/*----------------------------------------------------------------------*/
/* Grid System (based on the 960 Grid System (http://960.gs)
/*----------------------------------------------------------------------*/

.g1,.g2,.g3,.g4,.g5,.g6,.g7,.g8,.g9,.g10,.g11,.g12 {display:inline; float:left; margin-left:1%; margin-right:1%; padding:0; min-height:10px;}
.g1{width:6.333%;}
.g2{width:14.667%;}
.g3{width:23.0%;}
.g4{width:31.333%;}
.g5{width:39.667%;}
.g6{width:48.0%;  }
.g7{width:56.333%;}
.g8{width:64.667%;}
.g9{width:73.0%;}
.g10{width:81.333%;}
.g11{width:89.667%;}
.g12{width:98.0%; padding:0;}
.right { float: right!important;}


/*----------------------------------------------------------------------*/
/* Widgets
/*----------------------------------------------------------------------*/
.widget, .widget.loading {background-image:url(../images/main_bg.png);}
.widget {margin-bottom:15px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; text-align:left;}
.widget>div{margin:2px;padding:0 0 2px 0;border:1px solid;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px; background-image:url(../images/main_bg.png)}
.widget>div>img{-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}
.widget>div.ui-widget{width:99%;padding:0;background-image:none}
.widget .ui-widget-header{overflow:hidden}
.widget h3{margin:0}
.widget h3.handle{position:relative;font-size:14px!important;border-top:1px solid;border-bottom:1px solid;padding:8px 10px;margin:0;line-height:18px;margin-bottom:1px;cursor:pointer;-webkit-border-top-left-radius:4px;-moz-border-radius-topleft:4px;border-top-left-radius:4px;-webkit-border-top-right-radius:4px;-moz-border-radius-topright:4px;border-top-right-radius:4px;color:#444;text-shadow:0 0 1px #fff;}
.widget.sortable h3.handle{cursor:move}
.widget h3.handle .collapse,.widget h3.handle .reload{position:absolute;right:8px;top:5px;display:block;height:24px;width:24px;background-repeat:no-repeat;background-position:center center;display:none}
.widget h3.handle .reload{right:30px}
.widget h3.handle a:first-child{right:8px}
.widget:hover h3.handle .collapse,.widget.loading h3.handle .reload,.widget:hover h3.handle .reload{display:block}
.widget h3.handle .icon{margin-top:-3px;margin-left:-4px;height:24px;width:24px;display:inline-block;float:left;background-position:center}
.widget.collapsed h3.handle{border-bottom:0;-webkit-border-bottom-right-radius:4px;-moz-border-radius-bottomright:4px;border-bottom-right-radius:4px}
.widget.number-widget>div ul{overflow:auto}
.widget.number-widget>div ul li{display:block;margin:0;list-style:none; padding:7px 10px 4px;margin:0}
.widget.number-widget>div ul li:first-child{border-top:0}
.widget.number-widget>div ul li a{font-size:12px;display:block; text-shadow:0 1px 0 #fff}
.widget.number-widget>div ul li a:hover{text-decoration:none;}
.sortable_placeholder{margin-bottom:15px;border:1px solid;z-index:1;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;background-image:url(../images/alt_bg.png);}
.widget h3.handle .collapse{background-image:url(../images/collapse.png);}
.widget.collapsed h3.handle .collapse{background-image:url(../images/expand.png);}
a.collapse { cursor: pointer; }
.widget ul li a span {text-align: right; display: inline-block; font-size: 24px; font-weight: 700; letter-spacing: -0.05em; padding: 2px 6px 2px 0;}

@media screen and (max-width: 760px) {
    .g1,.g2,.g3,.g4,.g5,.g6,.g7,.g8,.g9,.g10,.g11,.g12 { width: 98%;}
}