html,body{ height: 100%; }
body{ font-family: "Lucida Grande","Trebuchet MS",Helvetica,Arial,Verdana,sans-serif;}
/* **************** CONTENT OBJECTS ***************** */
/* ====== Default spacing ====== */
h1, h2, h3, h4, h5, h6, ul, ol,dl, p,blockquote {padding:10px;}
h1, h2, h3, h4, h5, h6,img{padding-bottom:0px;}
pre{margin: 10px;}
table h1,table h2,table h3, table h4, table h5, table h6, table p, table ul, table ol, table dl{padding:0;}
/* ====== Elements ====== */
img{display:block; }
a img   { background: none; border: none; }
em{font-style: italic;}
strong{font-weight:bold;}
.inline-block   { display: inline-block; }
.left { float: left; }
.right { float: right; }
.clear  { float: none; clear: both; }
.tx-center{text-align:center;}
.tx-center img{margin:0 auto;}
.tx-right{text-align:right;}
/* misc classes */
.small      { font-size: .8em; margin-bottom: 1.875em; /*line-height: 1.875em;*/ }
.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.hide       { display: none; }

.quiet 	    { color: #666 !important; cursor: default !important; }
.loud       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first  { margin-left:0; padding-left:0; }
.last   { margin-right:0; padding-right:0; }
.top    { margin-top:0; padding-top:0; }
.bottom { margin-bottom:0; padding-bottom:0; }
hr{border: 5px solid #e2e2e2; border-width: 0 0 5px 0; margin: 20px 10px 10px 10px;}
code{color:/*#0B8C8F*/#000;}
pre,code    { margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; } 
pre,code    { font-family: Arial, sans-serif;  line-height: normal !important; white-space: normal !important; word-wrap: break-word; }
/* ====== Headings ====== */
/* .h1-.h6 classes should be used to maintain the semantically appropriate heading levels - NOT for use on non-headings */
h1, .h1{font-size:196%; font-weight:normal; font-style: normal; color:#3d3d3d;}
h2, .h2{font-size:167%; font-weight:normal; font-style: normal; color:#3d3d3d;}
h3, .h3{font-size:146.5%; font-weight:normal; font-style: normal; color:#3d3d3d;}
h4, .h4{font-size:123.1%; font-weight:normal; font-style: normal; color: #333;}
h5, .h5{font-size:108%; font-weight:bold; font-style: normal; color:#AE0345;}
h6, .h6{font-size:108%; font-weight:normal; font-style: italic; color:#333;}
/* if additional headings are needed they should be created via additional classes, never via location dependant styling */
.category{font-size:108%; font-weight:normal; font-style: normal; text-transform:uppercase; color: #333;}
.category a{color: #333;}
.important a{font-weight:bold;}
/* links */
a.href { color: #3680A1; font-weight:bold; text-decoration: underline; }
a.href:focus, a.href:hover { color: #7B8738; cursor: pointer;  }
a img   { border: none; }
/* ====== Lists ======*/
ol.simpleList li, .markup ol li, #wmd-preview ol li, .markdown-help ol li{list-style-type: decimal; margin-left:15px;}
/* standard list */
ul.simpleList li, .markup ul li, #wmd-preview ul li, .markdown-help ul li{list-style-type:disc; margin-left:15px; padding-bottom: 10px; }
/* ====== Tables ====== */
.data{padding: 20px; position:relative; zoom:1;vertical-align: top;border-right:solid 1px transparent;/* border fixes a FF2 bug which causes the data table to overlay its borders*/}
.data table {width:100%;border:1px solid #223322;}
th, td{vertical-align:top;border:1px solid #223322;}
.txtC, .data .txtC td, .data .txtC th{text-align:center;}
.txtL, .data .txtL td, .data .txtL th{text-align:left;}
.txtR, .data .txtR td, .data .txtR th{text-align:right;}
.txtT, .data .txtT td, .data .txtT th{vertical-align:top;}
.txtB, .data .txtB td, .data .txtB th{vertical-align:bottom;}
.txtM, .data .txtM td, .data .txtM th{vertical-align:middle;}
.data th,.data td{padding:3px 20px}
.data thead tr{background-color: #fff0f8;}
.data th{color: #000; font-weight:bold}
/* specification table - extends data table */
.spec{padding:10px;}
.spec table{border-top: 1px solid #e2e2e2; border-bottom-color:#fff; border-left:none; border-right:none;}
.spec th, .spec td{border:1px solid #e2e2e2; border-width: 1px 0; padding-left:0;}
.spec .odd, .spec .even{background-color: #fff;}
/* ====== blockquote ====== */
cite{display:block; text-align:right; padding-top: 10px;}
/* ====== callout ====== */
.callout{font-size:189%;color:#999999; font-style:italic;}
.callout cite{display:block; text-align:right;padding-top: 30px; font-size:69.25%;}
.callout span.quot{font-size: 500%; vertical-align: sub; color:#e2e2e2; line-height:25px; font-weight:bold;}
.callout span.quotLast{vertical-align:middle;}
/* ====== image treatments (get more from jason santa maria) ====== */
.caption{font-size:13px; color:#666666; font-style:italic;padding-top:0;}
/* will need to either
1. find a way to capture the width of the caption in the width of the image or flash
2. Set some default widths, mby use flickr widths?
*/
/* ====== media ====== */
.media{overflow:hidden; overflow:visible; zoom:1;margin:10px;}
.media .img{float:left;margin-right: 10px;}
.media .img img{display:block;}
.media .imgExt{float:right; margin-left: 10px;}
/* ====== special formatting classes ====== */
.detail{color: #777; font-size:11px;display:block;}

/* ====== Custom ========*/
/* forms */
label       { font-weight: bold; font-size: 1.2em; display: block; }
fieldset    { margin:20px; border: 1px solid #ccc; padding: 10px; }
legend      { font-weight: bold; font-size:1.7em; }
.hint { color: #555; font-style: italic; }

/* form fields */
input.text, input[type=text], 
input.password, input[type=password], 
input.title, textarea, select       { background: #FEFEF8; border: 1px solid #bbb; font-size: 1.2em; margin:0.5em 0; }
input.text:focus, 
input[type=text]:focus, 
input.password:focus, 
input[type=password]:focus, 
input.title:focus,textarea:focus, 
select:focus                        { background : #FEFEF8; border: 1px solid #FFCB05; }
input.text, input[type=text],
input.password, input[type=password],
input.title                         { color: #000; width: 300px; padding:5px; }
input.title                         { font-size:1.5em; }
textarea                            { width: 390px; height: 250px; padding:5px; }
textarea:hover                      { background: #FEFEF8; }
.required { color: #ff0000; }


.error,.notice,
.success					{ padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }
.error						{ background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.success					{ background: #E6EFC2; color: #264409; border-color: #C6D880; }
.saved						{ color:#390; }
.invalid					{ color:#900; }
label .ui-state-error		{ padding: 3px !important; border: none !important; background: none !important; font-size: .6em !important; }

html { background: transparent; }
body { 	font-family: Arial, Helvetica, sans-serif; color: #000; background: #fff url(../images/bg-top.png) repeat-x 0 0; font-size: 12px; }
textarea#message { width: 500px; height: 150px; overflow: auto; }
.page { position: relative; z-index: 1000; } 
.head { /*background: transparent url('../images/nav-2.png') no-repeat 0 106px;*/ }

.nav ul li { display:inline; float:left; position:relative; }
.ddsmoothmenu { width: 100%; }
.org-nav .ddsmoothmenu ul { z-index:99; margin: 0; padding: 0; list-style-type: none; }
.ddsmoothmenu ul { z-index:100; margin: 0; padding: 0; list-style-type: none; }
.ddsmoothmenu ul li { position: relative; display: inline; float: left; }
.ddsmoothmenu ul li a.top { background: transparent; font-size: 1.3em; padding: 0px 20px; font-weight: bold; }
.ddsmoothmenu ul li a { display: block; background: #454545; /*background of menu items (default state)*/ color: #fff; padding: 5px 10px 5px 10px; border-right: 1px solid #778; text-decoration: none; }
* html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/ display: inline-block; }
.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited { color: #fff; }
.ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/ background: #000; color: #fff; }
.ddsmoothmenu ul li a:hover { background: #000; /*background of menu items during onmouseover (hover state)*/ color: #fff; }
.ddsmoothmenu ul li a:hover { background: #2A91F2; }
.ddsmoothmenu ul li ul { position: absolute; left: 0; display: none; /*collapse all sub menus to begin with*/ visibility: hidden; }
.ddsmoothmenu ul li ul li { display: list-item; float: none; }
.ddsmoothmenu ul li ul li ul { top: 0; }
.ddsmoothmenu ul li ul li a { width: 160px; /*width of sub menus*/ padding: 5px; margin: 0; border-top-width: 0; border-bottom: 1px solid gray; }
* html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/
.downarrowclass { position: absolute; top: 12px; right: 7px; }
.rightarrowclass { position: absolute; top: 6px; right: 5px; }
.ddshadow { position: absolute; left: 0; top: 0; width: 0; height: 0; }
.toplevelshadow{ /*shadow opacity. Doesn't work in IE*/ opacity: 0.8; }

.foot { line-height: 1.5; width: 960px; }

.navbar { position: absolute; float: left;}



.page { width: 100%; }
.body { background: #fff; width: 960px; margin: 0 auto; }
.head { margin: 0 auto; width: 960px; line-height: 1.5; z-index: 11; position: relative; z-index: 5000;}
.navbar { top: 125px;}

/* BUTTONS */

.buttons a, .buttons button{ display:block; float:left; font-family: Verdana,Arial,sans-serif; margin:0 7px 0 0; background-color:#f5f5f5; border:1px solid; border-color: #bbb #555 #555 #bbb; font-size:100%; line-height:130%; text-decoration:none; font-weight:bold; color:#565656; cursor:pointer; padding:5px 10px 6px 7px; /* Links */ }
.buttons button{ width:auto; overflow:visible; padding:4px 10px 3px 7px; /* IE6 */ }
.buttons button[type]{ padding:5px 10px 5px 7px; /* Firefox */ line-height:17px; /* Safari */ }
*:first-child+html button[type]{ padding:4px 10px 3px 7px; /* IE7 */ }
.buttons button img, .buttons a img{ margin:0 3px -3px 0 !important; padding:0; border:none; width:16px; height:16px; }

button:hover, .buttons a:hover{ background-color:#dff4ff; border:1px solid #c2e1ef; border-color: #555 #bbb #bbb #555; color:#336699; }
.buttons a:active{ background-color:#6299c5; border:1px solid #6299c5; color:#fff; }

button.positive, .buttons a.positive{ color:#529214; }
.buttons a.positive:hover, button.positive:hover{ background-color:#E6EFC2; border:1px solid #C6D880; color:#529214; }
.buttons a.positive:active{ background-color:#529214; border:1px solid #529214; color:#fff; }

.buttons a.negative, button.negative{ color:#d12f19; }
.buttons a.negative:hover, button.negative:hover{ background:#fbe3e4; border:1px solid #fbc2c4; color:#d12f19; }
.buttons a.negative:active{ background-color:#d12f19; border:1px solid #d12f19; color:#fff; }

.buttons .ui-button-text { padding:0.4em 1em 0.4em 2.1em; display: inline-block;}
.no-style { border: 0 !important; background: none !important; }


textarea#message { width: 500px; height: 150px; overflow: auto; }

div.actions-top{ background: #fff; padding: 2px 0 4px 15px; width: 945px; float: left; }
.foot { background: none; width: 960px; margin: 0 auto; height: 50px; padding-top: 25px; text-align: center; color: #333; font-weight: bold; border-top: 2px solid #eee; border-bottom: 2px solid #eee; }
.sitemap-heading { color: #fff; }



#top-logo { background: url(../images/CGM-logo-2010.png) no-repeat top left; float: left; height: 106px; text-align: right; color: #FFFFFF; }
.banner { background: url(../images/banner-3.jpg) no-repeat top left; float: left; width: 100%; height: 250px; text-align: right; color: #FFFFFF; }
.b-network { background: url(../images/header2.jpg) no-repeat top left;}
.b-software { background: url(../images/banner-software.jpg) no-repeat top left;}
.b-cable { background: url(../images/banner-cable.jpg) no-repeat top left;}
.b-pastiche { background: url(../images/header1.jpg) no-repeat top left;}
.b-government { background: url(../images/banner-government.jpg) no-repeat top left;}
.b-performance { background: url(../images/banner-performance.jpg) no-repeat top left;}
.b-telecommunications { background: url(../images/banner-telecommunications.jpg) no-repeat top left;}
.b-support { background: url(../images/banner-support.jpg) no-repeat top left;}
.b-management { background: url(../images/banner-management.jpg) no-repeat top left;}
.b-staff { background: url(../images/banner-staff.jpg) no-repeat top left;}
.b-career { background: url(../images/banner-career.jpg) no-repeat top left;}
.b-contact { background: url(../images/banner-contact.jpg) no-repeat top left;}
.b-certifications { background: url(../images/banner-certifications.jpg) no-repeat top left;}

.inline-image { margin: 10px; }
.government-images { float: left; text-align: center; width: 140px; }
.government-certifications { float: right; width: 500px; }
.main { padding: 0 0px 20px 0px; }
/*.page { width: 100%; }*/
.body-top { background: transparent url(../images/wrapper.png) no-repeat; height: 20px; margin: 0 auto; width: 960px; }
.body-bottom { background: transparent url(../images/wrapper.png) no-repeat 0 -30px; height: 20px; margin: 0 auto; width: 960px; }
.screenshots { float: left; padding-left: 46px; padding-top: 130px; }
.title-text { font-size: 1.3em; float: left; padding-left: 10px; }

.icon-clock, .icon-monitor, .icon-users, .icon-mail, .icon-lock, .icon-rss, .icon-bullet, .icon-paint, .icon-pastiche, .icon-barcode, .icon-globe, .icon-arrow, .icon-distributed, .icon-wizard { background: transparent url('../images/default-sprite.png') no-repeat; display: inline-block; float: left; }

.icon-clock { background-position: 0 0; height: 50px; width: 50px; }
.icon-monitor { background-position: 0 -180px; height: 50px; width: 47px; }
.icon-users { background-position: -115px 0; height: 50px; width: 44px; }
.icon-mail { background-position: -166px 0; height: 51px; width: 49px; }
.icon-lock { background-position: -218px 0; height: 47px; width: 50px; }
.icon-rss { background-position: -270px 0; height: 46px; width: 46px; }
.icon-paint { background-position: -320px 0; height: 47px; width: 50px; }
.icon-pastiche { background-position: -385px 0; height: 56px; width: 58px; }
.icon-barcode { background-position: 0 -65px; height: 56px; width: 66px; }
.icon-globe { background-position: -77px -68px; height: 54px; width: 53px; }
.icon-arrow { background-position: 0px -135px; height: 30px; width: 32px; }
.icon-distributed { background-position: -145px -65px; height: 51px; width: 64px; }
.icon-wizard { background-position: -220px -57px; height: 51px; width: 44px; }
.icon-bullet { background-position: -160px -155px; height: 15px; width: 16px; margin-right: 7px; }

.top-bar { margin-bottom: 15px; padding-bottom: 35px; border-bottom: 1px solid #eee; }
.top-bar .text { color: #fff; position: absolute; top: 20px; right: 10px; }
.nav { padding-top: 75px; }
.banner { background-color: #ccc; height: 350px; } 
.extra-head-banner { width: 960px; height: 350px; background: transparent url('../images/header1.jpg') no-repeat 0 0; }
.extra-head-banner .cycle { overflow: hidden; height: 350px;  width: 960px; }
#bannerNav { position: absolute; top: 475px; left: 398px; z-index: 10; }
#bannerNav a { color: #fff; font-weight: bold; font-size: 1.2em; border: 1px solid #ccc; background: #333; padding: 5px 10px; margin-left: 5px; text-decoration: none; }
#bannerNav a.activeSlide { background: #ccc; color: #333; border-color: #333; }
a.send-mail { cursor: pointer; background: #ddd; border-color:#ddd #ccc #ccc #ddd; border-style:solid; border-width:2px; display:block; font-weight:bold; margin:10px; padding:10px; width:30px;}
.contact-us { color: #006600; font-size: 1.8em; font-weight: bold; text-decoration: underline; cursor: pointer; }
.section h3 { color: #000; }
h2.pastiche { color: #993300; }
.green { background: #65CB65 url(skin/header-green.png) repeat-x left bottom; font-size:120%;padding:5px 10px;}
.red { background: #D9060D url(skin/header-red.png) repeat-x left bottom; font-size:120%;padding:5px 10px;}

.yellow { background: #FFE361 url(skin/header-yellow.png) repeat-x left bottom; font-size:120%;padding:5px 10px;}

.blue { background: #D6EAFC url(skin/header-blue.png) repeat-x left bottom; font-size:120%;padding:5px 10px;}

.title-text { color: #005193; font-weight: bold; font-size: 1.7em; font-family: "Lucida Grande","Trebuchet MS",Helvetica,Arial,Verdana,sans-serif;  }
.simpleList li { font-size: 1.3em; }

.points { margin-bottom: -10px; }
.contact-form p { padding-left: 20px; }
p.highlights, .single { font-size: 1.2em; line-height: 1.8em;}
.single { line-height: 1em; padding-bottom: 0; }
p.home-highlights { font-size: 1.2em; line-height: 1.5em;}
ul.pastiche li{ list-style-type: none; padding-bottom: 14px; }
.learn-more { font-size: 1.3em; font-style: italic; font-weight: bold; padding-left: 15px;  }
.col-one { height: 72px; }
.col-two { height: 126px; }
.col-three { height: 109px; }