/* SITE STANDARD LAYOUT FOR:
   CCTS telecommunications PTY LTD.
   CCTS Telephone Systems PTY LTD.
   CCTS Telecommunications Construction PTY LTD.
   http://www.ccts.com.au
   Author: Nathan Kelly - http://www.nathan-kelly.com
------------------------------------------------------------------------------*/

/* Common and Containing Elements.
------------------------------------------------------------------------------*/
html, body {
margin:0;
padding:0;
}

body {
color:#333;
background-color:#fff;
font:86%/1.7 Verdana, Arial, Helvetica, sans-serif;
}

#container {
width:100%;
float:left;
min-width:984px;
background:url(../images/sub-nav-bg.png) repeat-y left top;
}

a {
color:#0000ee;
text-decoration:none;
}

a:hover {
color:#bf7900;
text-decoration:underline;
}

a img {
border:0;
}

/* Clearing and Hidden Elements, common elements.
------------------------------------------------------------------------------*/
#main-nav, #location, #content-area, .clear {
clear:both;
}

/* Very stupid output created by eZpublish <li><p></p></li>, fix it here, 
they need to fix this issue, this markup is unacceptable.
This fix is ignored by IE. */
li p {
margin:0;
}

/* Skip nav hidden, try telling a client its good. */
hr, .skip-nav, .hide {
display:none;
}

/* Header Elements.
------------------------------------------------------------------------------*/
#header {
height:100px;
background-color:#fff;
position:relative;
}

#header h1 {
margin:0;
float:left;
width:180px;
height:100px;
}

#header h1 img {
border:0;
}

#header h2 {
top:0em;
right:1em;
width:218px;
font-size:1.2em;
position:absolute;
text-indent:-1000em;
background:url(../images/tagline.png) no-repeat right top;
}

#site-tools {
right:1em;
bottom:.6em;
color:#062c5e;
font-size:.7em;
position:absolute;
}

#site-tools .user {
margin-right:.6em;
}

#site-tools ul {
margin:0;
padding:0;
}

#site-tools ul li {
float:left;
list-style-type:none;
}

#site-tools li a {
padding:0 .6em;
text-decoration:none;
border-left:1px solid #062c5e;
}

#site-tools li.no-delim a {
border:0;
}

/* Main Navigation.
------------------------------------------------------------------------------*/
#main-nav, #main-nav ul {
margin:0;
padding:0;
}

#main-nav {
width:100%;
float:left;
background:url(../images/nav-top.png) repeat-x left top;
}

#main-nav .wrapper {
width:100%;
float:left;
background:url(../images/nav-end-top.png) no-repeat right top;
}

#main-nav .nav-end {
width:100%;
float:left;
background:url(../images/nav-bottom.png) repeat-x left bottom;
}

#main-nav ul {
width:100%;
float:left;
background:url(../images/nav-end-bottom.png) no-repeat right bottom;
}

#main-nav li {
float:left;
display:block;
list-style-type:none;
}

#main-nav a {
color:#fff;
display:block;
font-size:.7em;
padding:.4em 1em;
font-weight:bold;
white-space:nowrap;
text-decoration:none;
text-transform:uppercase;
}

#main-nav a.current {
color:#b4bcd0;
cursor:default;
}

#main-nav a:hover {
color:#b4bcd0;
text-decoration:none;
}

/* Location Elements.
------------------------------------------------------------------------------*/
#location {
height:66px;
position:relative;
background:url(../images/location-bg.png) repeat-x left top;
}

#location h2 {
margin:0;
color:#fff;
font-size:1.2em;
padding:20px 0 0 12px;
background:url(../images/spotlight.png) no-repeat left bottom;
}

#location .tele-collage {
top:0;
right:0;
width:431px;
height:66px;
position:absolute;
background:url(../images/tele-collage.png) no-repeat right top;
}

#location .con-collage {
top:0;
right:0;
width:431px;
height:66px;
position:absolute;
background:url(../images/con-collage.png) no-repeat right top;
}

/* Sub nav.
------------------------------------------------------------------------------*/
#sub-nav { 
float:left;
width:190px;
font-size:.8em;
padding-bottom:3.2em;
background:url(../images/sub-nav-cap.png) no-repeat left top;
}

#sub-nav ul {
margin:0;
padding:0;
}

#sub-nav ul li {
width:180px;
list-style-type:none;
}

#sub-nav a {
width:167px;
color:#062d5f;
display:block;
padding:8px 0 8px 12px;
text-decoration:none;
border-bottom:2px solid #fff;
}

#specials a {
background:#b1b7c8;
}

#sub-nav a.current, #sub-nav a:hover.current, #specials a:hover.current {
background:#f9efab url(../images/sub-nav-arrow.png) no-repeat top right;
}

#sub-nav a:hover {
color:#062d5f;
background:#d2d9e1;
text-decoration:none;
}

#sub-nav ul li ul li a {
background:#f3ebd1;
}

#sub-nav ul li ul li a:hover {
background:#e9dfc7;
}

#sub-nav ul li ul li a.current, #sub-nav ul li ul li a:hover.current {
background:#e9dfc7 url(../images/sub-nav-arrow.png) no-repeat top right;
}

#specials a.current, #specials a:hover.current {
background:#b7c2de url(../images/sub-nav-arrow.png) no-repeat top right;
}

#specials a:hover {
background:#b7c2de;
}

/* big buttons */
#sub-nav .big-buttons a,
#sub-nav .big-buttons span {
border:0;
padding:0;
margin:8px 0 0 8px;
text-indent:-999em;
width:163px;
height:55px;
display:block;
background-repeat:no-repeat;
background-position:top left;
}

#button-support {background-image:url(../images/click-support.png)!important;}
#button-quote {background-image:url(../images/click-quote.png)!important;}
#button-1800 {background-image:url(../images/click-1800.png)!important;}

#sub-nav .big-buttons a:hover {background-position:bottom left;}

/* Content Area.
------------------------------------------------------------------------------*/
#content-area {
background:transparent url(../images/content-area-bg.png) repeat-x left top;
}

#content {
padding:1em 0 0 0;
font-size:.85em;
text-align:left;
}

#content .wrapper {
width:774px;
margin-left:200px;
padding-right:10px;
margin-bottom:1em;
}

#content h2 {font-size:1.8em; clear:right;}
#content h3 {font-size:1.6em; clear:right;}
#content h4 {font-size:1.4em; clear:right;}
#content h5 {font-size:1.2em; clear:right;}
#content h6 {font-size:1em; clear:right;}

#content h2, #content h3, #content h4, #content h5, #content h6 {
margin:.5em 0 0 0;
color:#2a417a;
}

#content h2 a, #content h3 a, #content h4 a, #content h5 a, #content h6 a {
color:#2a417a;
text-decoration:none;
}

#content h2 a:hover, #content h3 a:hover, #content h4 a:hover, 
#content h5 a:hover, #content h6 a:hover {
color:#96a1be;
}

#content ul li {
list-style-image:url(../images/bullet-box-1.png);
}

/* Editor content styles */
#content .clear-both {clear:both; padding-top:.5em;}
#content .clear-left {clear:left; padding-top:.5em;}
#content .clear-right {clear:right; padding-top:.5em;}

#content div.float-left {
float:left;
margin:0 10px 10px 0;
}
#content div.float-right {
float:right;
margin:0 0 10px 10px;
}

/* Set the page up for extra content, warnings, notices etc.
------------------------------------------------------------------------------*/
#content .notification {
color:#062c5e;
border:1px solid #bfd3ff;
background:#eff4ff url(../images/notification.png) no-repeat .7em .7em;
}

#content .notification h4 {
color:#062c5e;
}

#content .notification form {
margin:0;
}

#content .warning {
color:#9f2735;
border:1px solid #ffbfc5;
background:#fff8f8 url(../images/error.png) no-repeat .7em .7em;
}

#content .warning h4 {
color:#9f2735;
}

#content .warning ul li {
list-style-image:url(../images/bullet-box-2.png);
}

#content .warning fieldset.required .req {
color:#af3636;
font-weight:bold;
}

#content .notice {
color:#cd9602;
border:1px solid #ffe8a8;
background:#fffdf7 url(../images/notice.png) no-repeat .7em .7em;
}

#content .notice h4 {
color:#cd9602;
}

#content .info {
color:#456f45;
border:1px solid #d7f1d7;
background:#efffef url(../images/info.png) no-repeat .7em .7em;
}

#content .info h4 {
color:#456f45;
}

#content .info ul li {
list-style-image:url(../images/bullet-box-3.png);
}

#content .notification,
#content .warning, 
#content .notice, 
#content .info {
margin-bottom:1em;
padding:.5em 3em;
}

#content fieldset .notification,
#content table .notification,
#content fieldset .warning, 
#content table .warning,
#content fieldset .notice,
#content table .notice,
#content fieldset .info,
#content table .info{
margin-bottom:3px;
}

#content .notification h4, 
#content .warning h4, 
#content .notice h4, 
#content .info h4 {
margin:0;
font-size:1em;
}

#content .notification,
#content .warning,
#content .search {
margin-top:1em;
}

/* News Pages and articles.
------------------------------------------------------------------------------*/
#content .news-item hr {
clear:both;
}

#content .date {
margin-top:1.5em;
margin-bottom:0;
}

#content .date {
color:#ac8421;
font-weight:bold;
}

#content h3.news-title {
margin-top:0;
}

#content .news-file a {
font-size:1.4em;
}

#content .news-file a:hover {
text-decoration:none;
}

#content .news-file img {
float:none;
border:0;
margin:0;
padding:0;
vertical-align:middle;
}

/* Forms 
------------------------------------------------------------------------------*/
#content form fieldset {
margin:0;
width:50em;
padding:3px;
margin-top:-2px;
position:relative;
}

#content form fieldset {
border:2px solid #e7e7e7;
}

#content form fieldset.first {
border-bottom:0;
}

#content form fieldset.mid {
border-top:0;
border-bottom:0;
}

#content form fieldset.last {
border-top:0;
}

#content fieldset h3 {
color:#fff;
padding:4px;
font-size:1em;
margin:0 0 3px 0;
position:relative;
background:#3a5187;
}

#content fieldset label {
padding:6px;
color:#062d5f;
font-size:1em;
display:block;
margin-bottom:3px;
position:relative;
}

#content fieldset div, #content fieldset p {
padding:6px;
}

#content fieldset p {
margin:0 0 3px 0;
color:#062d5f;
background:#eff4ff;
}

#content fieldset p a {
color:#0000ee;
text-decoration:none;
}

#content fieldset p a:hover {
text-decoration:underline;
}

#content fieldset .alt-light {
background:#f9f9f9;
}

#content fieldset .alt-dark {
background:#eee;
}

#content fieldset label:hover, #content fieldset div.block:hover {
background:#fffbef;	
}

#content fieldset label input, 
#content fieldset label select {
right:6px;
position:absolute;
}

#content fieldset label input {
margin-top:-2px;
}

#content fieldset textarea {
width:98%;
}

/* Table Elements.
------------------------------------------------------------------------------*/

#content table {
color:#3a5187;
border:2px solid #e7e7e7;
margin:1em 0;
width:50em;
}

#content table h3 {
margin:0;
font-size:1em;
}

#content table td p {
margin:0;
}

#content table td, #content table th {
padding:4px;
}

#content table.maint-table {
text-align:center;
}

#content table.user-table span {
color:#9f9f9f;
}

#content table.user-table span.disabled {
color:#6f6f6f;
}

#content table thead, #content table .thead-clone {
color:#fff;
font-weight:bold;
background:#3a5187;
}

#content table .alt-light {
background:#f9f9f9;
}

#content table .alt-dark {
background:#eee;
}

#content table tbody tr:hover {
background:#fffdef;
}

#content table td.footer, 
#content table td.footer:hover, 
#content fieldset .buttons, 
#content fieldset .buttons:hover {
text-align:right;
background:#fffdef;
border:1px solid #fff29f;
}

#content #downloads-table {
width:100%;
clear:right;
}

#content table th {
white-space:nowrap;
}

#content table th * {
color:#fff;
}

#content #downloads-table td {
text-align:left;
}

#content #downloads-table td img {
padding:0;
border:0;
margin:0 .5em;
float:left;
}

#content #downloads-table td[headers="c2"] {
width:40%;
}

#content #downloads-table td[headers="c4"] {
width:10%
}

#content #downloads-table td[headers="c1"],
#content #downloads-table td[headers="c3"] {
width:25%
}

/* Search resutls
------------------------------------------------------------------------------*/
#content dl dt {
margin:1.5em 0 0 0;
padding:1px;
background:#eff4ff;
border-bottom:2px solid #fff;
}

#content dl dd p {
margin:0;
padding:.5em;
background:#f9f9f9;
}

#content dl.search-results dt a {
color:#0000ee;
font-size:1.1em;
padding:.4em;
display:block;
text-decoration:none;
}

#content dl.search-results dt a:hover {
color:#5f92ff;
}

#content dl dd {
margin-left:0;
padding-left:0;
}

#content dl dd p a {
color:#bf7900;
text-decoration:none;
}

#content dl dd p a:hover {
color:#dfa745;
}

/* Google Navigator - For news pages etc... */
#content .page-nav ul {
margin:0;
padding:0;
text-align:center;
border:2px solid #e7e7e7;
list-style-type:none;
}

#content .page-nav li {
margin:0 4px;
margin:0;
display:inline;	
}

#content .page-nav li.current {
color:#ccc;
padding:0 5px;
font-weight:bold;
}

#content .page-nav li.null {
color:#666;
padding:0 5px;
}

#content .page-nav a {
padding:0 5px;
text-decoration:none;
}

/* Common Inline Navigation and Link Elements.
------------------------------------------------------------------------------*/
.top-link {
clear:both;
}

.top-link, 
#content .more-link,
#content .tell-link,
#content .pdf-link {
font-size:.7em;
text-transform:uppercase;
}

.top-link a, 
#content .more-link a,
#content .tell-link a,
#content .pdf-link a {
color:#062c5e;
font-weight:bold;
text-decoration:none;
padding:3px 3px 3px 15px;
border-left:4px solid #e7e7e7;
}

.top-link a {
background:url(../images/top-link.png) no-repeat left top;
}

#content .more-link a, #content .tell-link a, #content .pdf-link a  {
background:url(../images/more-link.png) no-repeat left top;
}

.top-link a:hover,
#content .more-link a:hover,
#content .tell-link a:hover,
#content .pdf-link a:hover {
color:#96a1be;
}

/* Footer Elements.
------------------------------------------------------------------------------*/
#footer {
width:100%;
float:left;
color:#666;
font-size:.8em;
margin-top:-1px;
position:relative;
border-top:2px solid #fff;
background:#fff url(../images/footer.png) repeat-x left top;
}

#footer .wrapper {
float:left;
padding-bottom:2em;
}

#quality-endorsment {
float:left;
margin:1.5em 1.5em 0 1em;
}

#footer ul {
margin:0;
padding:0;
position:relative;
}
/* Position is for IE, for some reason the ul's disapear beneath the footer 
background image if I don't relative position them? Typical. */

#footer ul li {
list-style-type:none;
}

#footer-contact ul {
float:left;
padding-left:.6em;
margin:1.5em 2em 1.5em 0;
border-left:4px solid #e7e7e7;
}

#footer h5 {
margin-top:0;
color:#062c5e;
font-size:1em;
font-weight:normal;
margin-bottom:.5em;
}

#footer-copyright {
clear:left;
padding-left:.6em;
border-left:4px solid #e7e7e7;
}

#footer-copyright ul {
margin-left:-2px;
}

#footer-copyright li {
display:inline;
margin-right:1em;
}

#footer-copyright li a {
padding:2px;
color:#0000ee;
text-decoration:none;
}

#footer-copyright li a:hover {
text-decoration:underline;
}

/* Tooltip UI
------------------------------------------------------------------------------*/
#content fieldset label#antispam input {
right:30px;
}

#antispam img {
border:0;
top:4px;
right:6px;
position:absolute;
}

div.tool-tip {
display:none;
}

#tool-tip #tool-tip-content div.tool-tip {
display:block;
padding:10px;
border:1px solid #afceff;
background-color:#dfebff;
}

#tool-tip {
width:500px;
z-index:1000;
text-align:left;
padding-top:16px;
position:absolute;
font-family:Arial, Helvetica, Verdana, sans-serif;
background:url(../images/ui-tool-tip-top.png) no-repeat top left;
}

#tool-tip #tool-tip-arrow {
width:15px;
height:8px;
display:block;
background-repeat:no-repeat;
background-image:url(../images/ui-tool-tip-arrow.png);
}

div.ttp-tl #tool-tip-arrow {
top:3px;
left:34px;
position:absolute;
background-position:top left;
}

div.ttp-tr #tool-tip-arrow {
top:3px;
right:34px !important;
position:absolute;
background-position:top left;
}

div.ttp-bl #tool-tip-arrow {
left:34px;
bottom:3px;
position:absolute;
background-position:top right;
}

div.ttp-br #tool-tip-arrow {
right:34px !important;
bottom:3px;
position:absolute;
background-position:top right;
}

#tool-tip * {
margin:0;
padding:0;
}

#tool-tip h5,
#tool-tip p {
font-size:.9em;
}

#tool-tip h5 {
line-height:16px;
padding-left:20px;
font-weight:bold;
background:url(../images/ui-icon-info-static.png) no-repeat top left;
}

#tool-tip p {
margin-top:5px;
}

#tool-tip-footer {
height:1%;
padding:0 20px 20px 20px;
background:url(../images/ui-tool-tip-bot-n.png) no-repeat bottom left;
}

#tool-tip-footer.button-visible {
padding-top:10px;
}

#tool-tip-content {
padding:5px 20px 0 20px;
background:url(../images/ui-tool-tip-mid.png) repeat-y top left;
}

/* tooltip toggles *
#content-area .has-tool-tip {
padding-top:5px;
}
/*
.has-tool-tip span,
.has-tool-tip a {
float:left;
white-space:nowrap;
}*/
