@charset "UTF-8";

/********************************************************/
/* base tags                                            */
/********************************************************/

html, body, form { height: 100%; height: auto !important; min-height: 100%; }
body { font-family: Calibri, Arial, Verdana, Helvetica; font-size: 12px; color: #ffffff; margin: 0; background: #418db4 url(../images/design/bg-bodygrad.gif) repeat-x left 435px;  }
h1, h2, h3, h4, h5, h6 { font-weight: normal; color: #ffffff; margin-top: 0px; }
h1 { font-size: 19px; }
h2 { font-size: 18px; margin-bottom: 5px; }
h3 { font-size: 16px; }
h4 { font-size: 15px; }
h5 { font-size: 14px; }
h6 { font-size: 13px; font-weight: bold; }
p { margin-top: 0px; margin-bottom: 1em; }
img { border: none; }

/********************************************************/
/* forms                                                */
/********************************************************/

input[type="submit"], input[type="button"] { font-family: Calibri, Arial, Verdana, Helvetica; font-size: 14px; padding: 5px; }

/********************************************************/
/* global styles                                        */
/********************************************************/

.hide { display: none; }
.clearFloats { clear: both; }

/********************************************************/
/* main layout                                          */
/********************************************************/

#wrapper { background: url(../images/design/bg-header.gif) repeat-x left top; }
#subWrapper { background: url(../images/design/bg-mid.jpg) repeat-x center 181px; min-height: 435px; }
#subSubWrapper { margin: 0 auto; width: 997px; }

/********************************************************/
/* navigation                                           */
/********************************************************/

#nav { overflow: hidden; height: 180px; }
#nav #logo { background: url(../images/design/impel.gif) no-repeat left top; width: 208px; height: 68px; position: absolute; margin-left: 16px; margin-top: 25px; }
#nav #logo a { display: block; width: 208px; height: 68px; }
#nav #logo a span { display: none; }

#nav ul { list-style: none; padding: 0; position: absolute; margin-top: 119px; margin-left: 0px;  }
#nav ul ul { display: none; }
#nav ul li { display: block; float: left; background: url(../images/design/nav-sep.gif) no-repeat right top; }
#nav ul li.first { display: none; }
#nav ul li a { display: block; padding: 25px 31px 25px 30px;  height: 11px; }
#nav ul li.selected a, #nav ul li a:hover { text-decoration: underline; }

#nav ul li a span { display: none; }
#nav ul li a.reflexcms { background: url(../images/design/nav/reflexcms.gif) no-repeat center center; width: 92px; }
#nav ul li a.services { background: url(../images/design/nav/services.gif) no-repeat center center; width: 73px; }
#nav ul li a.customers { background: url(../images/design/nav/customers.gif) no-repeat center center; width: 90px; }
#nav ul li a.devcen { background: url(../images/design/nav/devcen.gif) no-repeat center center; width: 154px; }
#nav ul li a.support { background: url(../images/design/nav/support.gif) no-repeat center center; width: 69px; }

#nav #search { position: absolute; margin-left: 813px; margin-top: 139px; background: url(../images/design/bg-search.gif) no-repeat left top; width: 151px; height: 23px; }
#nav #search input { border: 0; padding: 0; position: absolute; margin-top: 5px; margin-left: 6px; font-family: Calibri, Arial, Verdana, Helvetica; font-size: 11px;  }

/********************************************************/
/* home                                                 */
/********************************************************/

#homeFeatures { padding-bottom: 10px; margin-top: 25px; } 
#homeFeatures #homeFeatureLeft { float: left; width: 282px; background: url(../images/icons/boxing-home.png) no-repeat 33px 24px; padding: 27px 40px 0px 178px; height: 172px; border-right: solid 1px #367a98; }
#homeFeatures #homeFeatureLeft h1 { background: url(../images/design/reflex-cms-logo.png) no-repeat top left; width: 170px; height: 45px; display: block; }
#homeFeatures #homeFeatureLeft h1 span { display: none; }
#homeFeatures #homeFeatureLeft a.moreLink { display: block; width: 128px; height: 37px; background: url(../images/design/button-learnmore.png) no-repeat left top; }
#homeFeatures #homeFeatureLeft a.moreLink span { display: none; }

#homeFeatures #homeFeaturesRight { float: left; width: 382px; }
#homeFeatures #homeFeaturesRight .onlineDemo { background: url(../images/icons/lcd.png) no-repeat 28px 13px; border-bottom: solid 1px #367a98; padding-bottom: 14px; }
#homeFeatures #homeFeaturesRight .download { background: url(../images/icons/download.png) no-repeat 28px 28px; padding-top: 25px;  }
#homeFeatures #homeFeaturesRight .homeFeatureBox { padding-left: 78px; padding-top: 14px; }
#homeFeatures #homeFeaturesRight .homeFeatureBox h1 { margin-bottom: 0px; }
#homeFeatures #homeFeaturesRight .homeFeatureBox p { margin-bottom: 5px; }
#homeFeatures #homeFeaturesRight .homeFeatureBox a.moreLink { background: url(../images/design/arrow-more.gif) no-repeat left center; padding-left: 10px; color: #c6ca73; text-decoration: none;  }
 
#homeInfo { margin-top: 43px; }
#homeInfo .homeInfoSeparator { width: 47px; height: 40px; float: left; }
#homeInfo .homeInfoBox { background: url(../images/design/home-second-row-bg.png) no-repeat left bottom; width: 475px; height: 111px; float: left; }
#homeInfo .homeInfoBox h1 { background: url(../images/design/bullet.png) no-repeat 3px 7px; padding-left: 17px; margin: -25px 0px 0px 13px; }
#homeInfo .homeInfoBox a.moreLink { background: url(../images/design/arrow-more.gif) no-repeat left center; padding-left: 10px; color: #c6ca73; text-decoration: none;  }
#homeInfo .homeInfoBox .homeInfoContent { width: 434px; position: absolute; margin: 20px 0px 0px 30px;  }

/********************************************************/
/* content                                              */
/********************************************************/

#contentWrapper { margin-top: 17px; }
#contentWrapper #content input[type="text"], #contentWrapper #content textarea { background: #ffffff url(../images/bg-input.gif) repeat-x left top; border: solid 1px #116e9a; padding: 3px; font-family: Verdana; font-size: 11px; }

#contentWrapper #content #minorColumn { float: left; width: 243px; padding-bottom: 10px; }
#contentWrapper #content #majorColumn { float: left; width: 727px; margin-left: 27px; color: #ffffff; }
#contentWrapper #content #majorColumn a { color: #ffffff; }
#contentWrapper #content #majorColumn .backTop { margin-top: 0px; float: right; margin-right: 50px; }
#contentWrapper #content #majorColumn h1 { background: url(../images/design/bullet.png) no-repeat 3px 7px; padding-left: 17px; margin: 0px 0px 0px 13px; }
#contentWrapper #content #majorColumn h2 { color: #aaaaaa; border-bottom: solid 1px #aaaaaa; margin-bottom: 20px; margin-top: 20px; }
#contentWrapper #content #majorColumn p { margin-left: 10px; margin-right: 10px; }

#contentWrapper #content #majorColumn .boxTop { }
#contentWrapper #content #majorColumn .box { background: url(../images/design/bg-overlay.png) repeat left top; width: 687px; padding: 20px 20px 40px 20px; }
#contentWrapper #content #majorColumn .boxBottom { }

.fullWidth #contentWrapper #content #majorColumn { width: 997px; margin-left: 0px; }
.fullWidth #contentWrapper #content #majorColumn .box { background: url(../images/design/bg-overlay.png) repeat left top; width: 997px; }

#contentWrapper #content #minorColumn h1 { background: url(../images/design/bullet.png) no-repeat 3px 7px; padding-left: 17px; margin: 0px 0px 0px 13px; }
#contentWrapper #content #minorColumn #subNav { padding: 0px 10px 0px 10px; }
#contentWrapper #content #minorColumn #subNav a { color: #ffffff; display: block; width: 220px;}
#contentWrapper #content #minorColumn #subNav ul { list-style: none; margin: 0; padding: 0; width: 223px; }
#contentWrapper #content #minorColumn #subNav ul li { display: block; border-top: solid 1px #44bc99; padding: 0px; background-position: 5px 13px; }
#contentWrapper #content #minorColumn #subNav ul li a { padding: 9px 0px 9px 14px; }
#contentWrapper #content #minorColumn #subNav ul li.first { border-top: none; }
#contentWrapper #content #minorColumn #subNav ul li:hover, #contentWrapper #content #minorColumn #subNav ul li.selected { background: url(../images/design/arrow-white.gif) no-repeat 6px 12px;  }
#contentWrapper #content #minorColumn #subNav ul li:hover ul li:hover, #contentWrapper #content #minorColumn #subNav ul li.selected ul li.selected { background: url(../images/design/arrow-white.gif) no-repeat -11px 11px;  }
#contentWrapper #content #minorColumn #subNav ul ul { display: none; }
#contentWrapper #content #minorColumn #subNav ul li a { text-decoration: none; }
#contentWrapper #content #minorColumn #subNav ul li.selected ul { display: block; margin-left: 14px; padding-bottom: 10px; border-top: solid 1px #5cc3a5; width: 180px; }
#contentWrapper #content #minorColumn #subNav ul li ul li { font-size: 90%; background-image: none; border-top: solid 1px #5cc3a5; padding: 0px; margin-left: 10px; }
#contentWrapper #content #minorColumn #subNav ul li ul li a { color: #f0f0f0; padding: 8px 0px 8px 0px; }
#contentWrapper #content #minorColumn #subNav ul li ul li.selected a { font-weight: bold; }

#contentWrapper #content #minorColumn .leftBox { background: url(../images/design/bg-overlay.png) repeat left top; width: 243px; padding: 10px 0px 10px 0px; }
#contentWrapper #content #minorColumn .leftBoxBottom { margin-bottom: 20px; }
#contentWrapper #content #minorColumn .leftBox .leftBoxBody { padding: 20px;}
#contentWrapper #content #minorColumn .leftBox .leftBoxBody a { color: #ffffff; text-decoration: underline; }

#contentWrapper #content #majorColumn .invalid { border: solid 2px #ffffff; background-color: Red; margin-bottom: 10px; color: #ffffff !important; font-weight: bold; padding: 10px; font-size: 14px; }
#contentWrapper #content #majorColumn .invalid ul { list-style: none; margin: 0; padding: 10px; border-top: solid 2px #ffffff; }
#contentWrapper #content #majorColumn .invalid ul li { background: url(../images/design/arrow-white.gif) no-repeat left center; padding-left: 10px; color: #ffffff; font-weight: bold; font-size: 12px; }

#contentWrapper #content #majorColumn .captcha { margin-left: 10px; margin-right: 10px; }
#contentWrapper #content #majorColumn .captcha div { float: left; margin-right: 10px; }
#contentWrapper #content #majorColumn .captcha div img { border: solid 1px #116e9a; }
#contentWrapper #content #majorColumn .captcha input { float: left; margin-top: 5px; }

/********************************************************/
/* recent work                                          */
/********************************************************/

#recentWork { background: url(../images/design/recentwk-bg.png) no-repeat left bottom; height: 174px; margin-top: 22px; }
#recentWork h1 { background: url(../images/design/bullet.png) no-repeat left 7px; padding-left: 17px; margin: 0px 0px 0px 13px; }
#recentWork #recentWorkBack { position: absolute; display: block; margin-top: 35px; margin-left: 18px; width: 20px; height: 81px; }
#recentWork #recentWorkForward { position: absolute; display: block; margin-top: 35px; margin-left: 961px; width: 20px; height: 81px; }
#recentWork .recentWorkItems { width: 957px; height: 89px; margin-top: 32px; margin-left: 40px; position: absolute; }
#recentWork .recentWorkItems .recentWorkItem { float: left; width: 112px; height: 89px; padding-right: 3px; }
#recentWork .recentWorkItems .recentWorkItem .recentWorkImage { width: 112px; height: 89px; }
#recentWork .recentWorkItems .recentWorkItem .recentWorkDetail { position: absolute; background: url(../images/design/bg-overlay-85.png) repeat left top; margin-top: -128px; margin-left: -58px; height: 99px; width: 189px; padding: 15px 20px 10px 20px; display: none; }
#recentWork .recentWorkItems .recentWorkItem .recentWorkDetail h2 { text-align: center; font-size: 14px; font-weight: bold; }
#recentWork .recentWorkItems .recentWorkItem .recentWorkDetail ul { list-style: none; padding: 0; margin: 0; }
#recentWork .recentWorkItems .recentWorkItem .recentWorkDetail ul li { background: url(../images/design/arrow-white.gif) no-repeat left 4px; padding-left: 10px; }

/********************************************************/
/* footer                                               */
/********************************************************/

#copyright { font-size: 11px; color: #84b5ce; text-align: center; padding: 55px 30px 120px 0px; }
#copyright a { color: #ffffff; text-decoration: underline; }
#copyright a img { vertical-align: middle; }

/********************************************************/
/* developer                                            */
/********************************************************/

.developer #subWrapper { min-height: 0 !important; }
.developer #contentWrapper { width: 100%; margin: 0px; padding: 0px; }
.developer #contentWrapper #content { width: 100%; padding: 0px; margin: 0px; background-color: #e0e0e0; border-bottom: solid 1px #555555; border-top: solid 1px #555555; }
.developer #contentWrapper #content #minorColumn { width: 250px; padding: 0px; height: 590px; overflow: auto; padding-top: 10px; padding-left: 10px; }
.developer #contentWrapper #content #minorColumn a { color: #000000; font-size: 11px; }
.developer #contentWrapper #content #minorColumn .nodeSelected { background-color: #aaaaaa; }
.developer #contentWrapper #content #majorColumn { padding: 0 0 0 260px; margin: 0; width: auto; float: none; }
.developer #contentWrapper #content #majorColumn .loading { position: absolute; right: 40px; top: 190px; }
.developer #contentWrapper #content #majorColumn .frameBorder { border-left: solid 3px #999999; }
.developer #contentWrapper #content #majorColumn iframe.doc, .developer #contentWrapper #content #majorColumn div.doc { display: block; width: 100%; background-color: #ffffff; border: none; height: 600px; }

body.developerDocument { background-image: none; }
.developerDocument { background-color: #ffffff; padding: 20px; color: #000000; margin: 0px; }
.developerDocument h1, .developerDocument h2, .developerDocument h3, .developerDocument h4, .developerDocument h5, .developerDocument h6 { color: #000000 !important; margin-top: 0px !important; }
.developerDocument h3 { font-weight: bold; }
.developerDocument h4 { font-weight: bold; margin-bottom: 0px !important }
.developerDocument p { margin-left: 10px; }
.developerDocument .code { white-space: nowrap; overflow: auto; font-family: Courier New, Lucida Console, OCR A Std, Consolas; color: #000066; background-color: #dddddd; padding: 10px; border: dashed 1px #888888; margin-bottom: 10px; height: auto; }
.developerDocument .code p { margin: 0px; padding: 0px; }
.developerDocument .code .highlight { color: #0000ff; }
.developerDocument .code .comment { color: #008000; }
.developerDocument .code .attribute { color: #515151; }