﻿body, html { background-color: #ccc; height: 100%; margin-top: 20px; }
.boxcaption h3{ margin: 10px 10px 10px 10px; color:#FFF; font:20px Arial, sans-serif; letter-spacing:; font-weight: normal;  }
#boxes { overflow: hidden; background-color: #efefef; margin-top: 15px; }
#wrapper { width: 980px; margin: 0 auto; background: url("../img/main/body-bg.png") repeat-y; }
#wrapper-head { background: url("../img/main/top-bg-round.png") no-repeat top; padding-top: 20px; }
#wrapper-footer { background: url("../img/main/bottom-bg.png") no-repeat bottom; padding-bottom: 17px;}
#container { width: 960px; margin: 0 10px; }
/* meta - breadcrumbs & global nav */
#meta { border-bottom: 1px solid #c0c0c0; border-top: 1px solid #c0c0c0; font: 11px Arial, Helvetica, sans-serif; }
#breadcrumbs, .bc, #globalnav { padding: 10px 0; }
#globalnav { text-align: right; }
#footer { background-color: #efefef; font-weight: bold; font: 11px Arial, Helvetica, sans-serif; }
#footer #copyright { padding: 10px 0; font-weight: bold; }
#footer #bottomlinks { text-align: right; padding: 10px 0; }
.boxgrid{ width: 300px; height: 200px; margin: 10px 8px; float:left; background:#161613; border: solid 2px #8399AF; overflow: hidden; position: relative; }
.boxgrid a { text-decoration: none; }
.boxgrid img { position: absolute; top: 0; left: 0; border: 0; }
.boxgrid p{ margin: 0;padding: 0 10px; color:#fff; font-weight:bold; font:12px Arial, sans-serif; }
.boxcaption{ float: left; position: absolute; top: 160px;background: #000; height: 100px; width: 100%; opacity: .8; /* For IE 5-7 */filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);/* For IE 8 */-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; }
.captionfull .boxcaption { top: 260;left: 0; }
.caption .boxcaption {top: 120;left: 0;}
#boxes a { display: block; width: 300px; height: 200px; background: url("../img/main/services-main.jpg") no-repeat; }
#solutions a { background-position: -300px 0; }
#repair a { background-position: -600px 0; }
#content {  padding-top: 10px;}
#intro { background-color: #efefef; margin-top: 15px;}
#header { padding: 10px 0;  }
#logo h1 { display: none; }
#logo a { background: url("../img/main/cats-logo.png") no-repeat; display: block; width: 264px; height: 77px; }
#navigation { margin-top: 30px; float: right;  }
#navigation li { float: left;}
#navigation a { display: block; text-indent: -9999px; margin: 5px;   height: 26px; text-decoration: none; color: #228281; font-weight: bold; }
#navigation a:hover { color: #000; }
#navigation #tabdefault { width: 41px; background: url("../img/main/navigation.png") no-repeat 0px -26px; }
#navigation #tabdefault:hover, #navigation #tabdefault.current { background: url("../img/main/navigation.png") no-repeat 0px 0px; }
#navigation #tabcompany { width: 88px; background: url("../img/main/navigation.png") no-repeat -41px -26px; }
#navigation #tabcompany:hover, #navigation #tabcompany.current { background: url("../img/main/navigation.png") no-repeat -41px 0px; }
#navigation #tabapproach{ width: 91px; background: url("../img/main/navigation.png") no-repeat -130px -26px; }
#navigation #tabapproach:hover, #navigation #tabapproach.current { background: url("../img/main/navigation.png") no-repeat -130px 0px; }
#navigation #tabteam{ width: 66px; background: url("../img/main/navigation.png") no-repeat -220px -26px; }
#navigation #tabteam:hover, #navigation #tabteam.current { background: url("../img/main/navigation.png") no-repeat -220px 0px; }
#navigation #tabcareers{ width: 53px; background: url("../img/main/navigation.png") no-repeat -285px -26px; }
#navigation #tabcareers:hover, #navigation #tabcareers.current { background: url("../img/main/navigation.png") no-repeat -285px 0px; }
#navigation #tabcontact{ width: 71px; background: url("../img/main/navigation.png") no-repeat -338px -26px; }
#navigation #tabcontact:hover, #navigation #tabcontact.current { background: url("../img/main/navigation.png") no-repeat -338px 0px; } 
/* home - services */
#carousel-wrapper{position: relative; width:700px;height:200px;margin-top: 10px;}
#carousel-wrapper.loading{background:url(../img/loading.gif) no-repeat center 40%;}
.carousel-content{position:absolute;width:700px;height:200px;top:0;left:0;}
#carousel-navigation{width:80px;height:27px;position:absolute;left:0;top:175px;z-index:10080;*zoom:1;}
#carousel-navigation a{display:block;float:left;height:26px;width:26px;overflow:hidden;text-indent:-1000px;position:relative;cursor:pointer;}
#carousel-navigation a.previous{margin:0 4px 0 0;background:url(../img/main/arrow-left.png) no-repeat 0 0;_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/main/arrow-left.png', sizingMethod='crop');}
#carousel-navigation a.next{background:url(../img/main/arrow-right.png) no-repeat 0 0;_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/main/arrow-right.png', sizingMethod='crop');}
#carousel-navigation a:hover{background-position:0 -26px;}
#carousel-title { position: absolute; color: #228281; width: 450px; height: 15px; z-index: 10080; color: #000; top: 0; left: 0; font: bold 11px Arial, Helvetica, sans-serif; text-transform: uppercase; }
.home-service {position: absolute; background-color: #fff; z-index: 10050; top:0; left: 0; width:700px; height: 200px; margin:0 auto;}
.home-service a { display: block; width: 700px; height: 200px; background: url("../img/main/carousel/carousel.jpg") top right no-repeat; }
.home-service a:hover p { text-decoration: underline; }
.service-image{z-index:10;position:absolute;display:block;}
.home-service h2 {position: absolute; top: 20px; left: 0px; font: bold 24px Arial, Helvetica, sans-serif; letter-spacing: -1px; color: #000; z-index: 10020;}
.home-service p{z-index:10011; color: #000;display:block;top:50px; width: 435px;left: 0px;position:absolute;font-size:12px;line-height:18px;}
.home-service img {z-index:10;position:absolute;right: 0;display:block;}
.managed-services { z-index: 10065; }
.professional-staffing a { background-position: right -200px; }
.network-infrastructure a { background-position: right -400px; }
.repair-services a { background-position: right -600px;}
.managed-services p{ width: 360px; }
.network-infrastructure p { width: 415px; }
.professional-staffing p { width: 325px; }
.repair-services p { width: 320px; }
.news {margin-top: 10px;color: #000;padding: 10px;border-left: 1px solid #c0c0c0;font: 11px Arial, Helvetica, sans-serif;}
.news p {font: 11px Arial, Helvetica, sans-serif;}
.news h3 {font-size: 14px;font-weight: bold;padding-bottom: 10px;border-bottom: 1px solid #333; margin-bottom: 10px;text-transform: uppercase;color: #000;}
.news ul { margin-bottom: 15px; }
#PositionMeta { width: 600px; }
#PositionMeta dt { font-size: 11px; font-weight: bold; width: 150px; margin-bottom: 0px; text-align: right; float: left; }
#PositionMeta dd { float: left; width: 340px; font-size: 11px; padding-left: 6px; margin-bottom: 0px; }
#PositionTitle { font-size: 18px; }
#newsletter { width: 500px; }
#newsletter dt { text-align:left; }
#newsletter dd { width: 500px; }
.timeline span { color: #206e6e; font-weight: bold; }
