/* CSS for idonix.com. Copyright 2010 */

/*******************/
/* Colours     */
/*******************//*
#383838: dark grey
#959595: medium grey
#eee: light grey
#00a2ff: broadcast blue
#D32784: web magenta
#F96E1A: custom software orange
#78CC00: live events green

#8D649B: communicate
#E17084: imagine
#B9DE81: deliver
#5BBCC2: captivate
#E3C567: data to life
*/
/*
headingbox-bg.gif:
1px -> 600px = light grey
601px -> 1200px = dark grey
1201px -> 1800px = blue
1801px -> 2400px = pink
2401px -> 3000px = orange
3001px -> 3600px = green
*/

/* RESET*/

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, font, 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 
{margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline;	background: transparent;}

body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {	border-collapse: collapse; border-spacing: 0;}

/* GLOBAL */
body {font-family: helvetica, arial, sans-serif; font-size: small; color: #333; text-align:center; background-color :#454545; /* url('images/bg-runner.gif') repeat-y 50% top;*/ }

.outerContainer {width:100%; min-height:100%; }
.innerContainer {width:1024px; height:100%; margin: 0 auto 0 auto; text-align: left; background:#ffffff url('/../../../../../../../../../../../../images/architecture/header-bg.jpg') no-repeat 50% top;
}
.slim .innerContainer {background:#FFFFFF url('/../../../../../../../../../../../../images/architecture/header-bg-small.jpg') no-repeat 50% top;
}
.header {margin:0px 50px 0px 50px; position:relative; min-height:105px; padding:0px 0px 55px 0px;}
.main .header {min-height:215px;}
.header h1 {padding:20px 0px 10px 0px; display:block; width:200px;}
.header img {border-style: none; }
.clear { clear:both; height:20px; }
.left-pane { width:620px; }
.footer { padding:40px 40px 10px 40px; width:944px; background:#000000 url('/../../../../../../../../../../../../images/architecture/footer-bg.gif') no-repeat left top;
}

a {text-decoration:none; cursor:pointer; }
a:hover {text-decoration:none;}

h2 {color: #383838; font-size: 150%;}
h3 {color: #383838; font-size: 140%; padding-top: 8px; padding-bottom: 8px}
h4 {color: #383838; font-size: 130%; }
h5 {color: #383838; font-size: 120%; }
h6 {color: #383838; font-size: 110%;}
hr { clear: both; visibility: hidden; }
strong {font-weight:bold; color: #383838 }
img {border: 1px solid #959595;}

blockquote p {color: #383838; font-style: normal; border-left: 3px solid #959595; margin-left: 10px; padding-left: 6px; }
blockquote p:before {content: '\201C'; }
blockquote p:after {content: '\201D'; }
p.credit {color: #383838; padding-left: 12px; font-style: italic;}

p.intro {font-size: 110%; font-weight:bold; color: #383838 }

.noDisplay {display:none;}

.page-text {float:left; width:500px; padding:80px 0px 0px 50px;} 
/*.page-text  li {line-height:1.2em; padding:0px 0px 0px 20px; margin: 0px 0px 14px 0px; background:url('images/arrow-li-small.gif') no-repeat 0px 1px;} */

.page-text a {color: #0D4E00; } 
.page-text a:hover {border-bottom:solid 1px #0D4E00;}
.page-text a:active {color:#87dc08; border-bottom:solid 1px #87dc08;}
.page-text h3 a {color: #383838; } 
.page-text h3 a:hover {border-bottom:solid 1px #383838;}
.page-text h3 a:active {color:#87dc08; border-bottom:solid 1px #87dc08;}

.main-panel {float:left; position:relative; width:597px; padding: 0px 0px 20px 0px; border-color: #959595; background-color: transparent; border-style: solid; border-width: 1px 1px 1px 1px; border-radius: 10px; box-shadow: 5px 5px 5px #888;}

dt {font-size: 115%; font-weight: bold; color: #383838 }
div.twoColumn dt > a {color: #383838; }
div.twoColumn dt > a:hover {border-bottom:solid 1px #383838;}

div.twoColumn { float: left; width: 540px; padding-bottom: 20px; }
div.twoColumn dl { float: left; width: 234px; padding: 0px 34px 10px 0px;  }
div.twoColumn dl dt {background: transparent none; color: #383838; }

div.thumbnail img {width: 74px; height: 56px; }
div.thumbnail dt {font-size: 125%; position: relative; bottom: -60px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 80px;  }
div.twoColumn thumbnail dd {margin: 4px 0 4px 0; }

div.people img {width: 74px; height: 99px; }
div.people dt {font-size: 125%; position: relative; bottom: -100px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 80px;  }
div.people dd.position {position: relative; bottom: -104px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 80px; color: #959595;}
 
div.twoColumn banner img {width: 100%; height: 40px; }
div.twoColumn banner dt {margin: 0px 0px 4px 0px;  }

div.icon img {width: 56px; height: 56px; border-style:none; }
div.icon dt {font-size: 125%; position: relative; bottom: -40px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 60px;  }
div.icon thumbnail dd {margin: 4px 0 4px 0; }

div.twoColumn hr { visibility: hidden; }

ul.twoColumn { float: left; width: 540px; padding-bottom: 20px; }
ul.twoColumn li { float: left; width: 234px; }
ul.twoColumn hr { clear: none; }

.content { padding:20px 33px 20px 55px; min-height:400px; width:924px; line-height: 1.4em; }
.content h4 {margin:6px 0px;}
.content p {margin: 0px 0px 10px 0px; line-height:1.5em;}
.content p.date {color:#666; margin:5px 0px;}
.content ul {list-style:none; min-width:200px; display: block; clear: both; }
.content ul li {padding: 4px 0px 0px 20px; margin-bottom: 10px; background: url('/../../../../../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 -212px;
}
.content ol {list-style: decimal; list-style-image:none;}
.content ol li {margin: 0px 0px 14px 20px;}


.right-box { float:right; width:232px; margin:0px 0px 10px 20px; color:#555; }
.right-box img { width:100%; border: 1px solid gray; }

p.caption { padding: 0 0 0 0; margin: 0 0 0 0; font-size: 85%; color: #383838}

.left-box {float: left; position: relative; display: inline-block; width: 235px; margin: 0px 0px 20px 0px; }
.left-box p {margin-top: 0px; color: #000000; padding-top: 6px; }
.left-box p.more {background-color: transparent; position: relative; padding: 0 0 0 0; } 
.left-box h4 {padding-top: 44px; } 
.left-box div {height: 56px;}
.left-box img {float: left; margin: 0px 10px 0px 0px;  width: 74px; height: 56px; }
div.section {background-color: #EEE; padding: 8px; margin: 0px 0px 10px 0px; }
div.section p {margin: 0px 0px 0px 0px; }
.main-panel.with-image .page-text { padding-top:230px; }
img.fade { opacity: 1; -webkit-transition: opacity 1s linear;}
img.fade:hover { opacity: 0; }

.page-text .strap { position: relative; left: -50px; display:inline-block; width: 552px; margin-bottom: 6px; border-bottom-right-radius: 6px;}
.generic-box .strap { background-color: #959595 ; }
.broadcast-box .strap { background-color: #77D0FF ; }
.customsoftware-box .strap { background-color: #F9A26B ;}
.web-box .strap { background-color: #D373A6 ;}
.liveevents-box .strap { background-color: #9CCC58 ;}

div.strap h3 { position: relative; left: -8px; top: -4px; padding-left: 56px; background: url('/../../../../../../../../../../../../images/architecture/bullet-arrows.png') no-repeat left 50%; 
color: white; font-size: 120%; } 

.broadcast {background-color: #00a2ff;}
.web {background-color: #D32784;}

.generic-box {border-color: #959595;}
.broadcast-box {border-color: #00a2ff;}
.web-box {border-color: #d32784;}
.customsoftware-box {border-color: #f96e1a;}
.liveevents-box {border-color: #78CC00;}

.customsoftware p.more {background-color: #F96E1A;}
.liveevents p.more {background-color: #78CC00;}
.broadcast h4, .web h4, .customsoftware h4, .showcontrol h4, liveevents h4 {color: #ffffff;}
.broadcast p, .web p, .customsoftware p, .showcontrol p, liveevents p {color: #ffffff;}

.heading-box {position:absolute;top:0px; left:0px; z-index:1001; width:260px; min-height:64px; background-image: url('/../../../../../../../../../../../../images/architecture/headingbox-bg.gif'); 
background-repeat: repeat-y; border-bottom-right-radius: 6px; }

.heading-box-withgrouptext{position:absolute;top:0px; left:0px; z-index:1001; width:552px; min-height:64px; background-image: url('/../../../../../../../../../../../../images/architecture/headingbox-bg.gif'); 
background-repeat: repeat-y; border-bottom-right-radius: 6px; }

.heading-box h2{position:absolute; top: -9px; left: -6px; width: 200px; height:37px; line-height: 1.1em; padding:13px 20px 0px 50px; color:#FFFFFF; background:url('/../../../../../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 0;
}


.heading-box-withgrouptext h1 {position:absolute; top: -9px; left: 0px; width: 200px; height:37px; line-height: 1.1em; padding:13px 20px 0px 50px; color:#FFFFFF; font-size: 110%; font-weight:200; background:url('/../../../../../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 0;
}
.heading-box-withgrouptext h2 {position:absolute; top: 20px; left: 0px; width: 500px; height:37px; line-height: 1.1em; padding:13px 20px 0px 50px; color:#FFFFFF; font-size: 140%;}

.broadcast-box .heading-box { background-position: -1540px 0px;}
.web-box .heading-box { background-position: -2140px 0px;}
.liveevents-box .heading-box { background-position: -3340px 0px; }
.customsoftware-box .heading-box { background-position: -2740px 0px; }

.broadcast-box .heading-box-withgrouptext { background-position: -1248px 0px;}
.web-box .heading-box-withgrouptext { background-position: -1848px 0px;}
.liveevents-box .heading-box-withgrouptext { background-position: -3048px 0px; }
.customsoftware-box .heading-box-withgrouptext { background-position: -2448px 0px; }

.generic-box dl.strap { background-color: #959595 ; }
.broadcast-box dl.strap { background-color: #77D0FF ; }
.customsoftware-box dl.strap { background-color: #F9A26B ;}
.web-box dl.strap { background-color: #D373A6 ;}
.liveevents-box dl.strap { background-color: #9CCC58 ;}

.communicate.strap  { background-color: #8D649B ;}
.strap.imagine { background-color: #E17084 ;}
.strap.deliver { background-color: #B9DE81 ;}
.strap.captivate { background-color: #5BBCC2 ;}
.strap.dataToLife { background-color: #E3C567 ;}


/* NAVIGATION */
.main-menu {width:600px;}
.main-menu li {float:left; margin:0px; padding:0px 7px; }
.main-menu a, .main-menu span {float:left; padding: 3px 5px 4px 18px; color:#FFFFFF; font-size:115%;background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 4px;
} /* white right */
.main-menu a:visited {color:#FFFFFF;}
.main-menu li:hover span {cursor:pointer;}
.main-menu li:hover a, .main-menu li:hover span {color:#87dc08; background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0px -15px;
} 
.main-menu > li.hasSubMenu:hover > a, .main-menu > li.hasSubMenu:hover > span {color:#87dc08; background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -34px;
}
.main-menu > li.selected.hasSubMenu:hover > a, .main-menu > li.selected.hasSubMenu:hover > span {color:#87dc08; background:url('/images/architecture/menu-arrows.gif') no-repeat 0px -89x;}
.sub-menu { position:absolute; margin-top:22px; left:0px; }
.main-menu li.selected > span, .main-menu li.hasSubMenu > span { cursor:default; }
.main-menu li.selected > span, .main-menu li.selected > a {color:#87dc08; background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -15px;
}
.main-menu li:hover ul a, .main-menu li ul a, .main-menu li ul span {display:block; padding:4px 5px 4px 14px; color:#FFFFFF; background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0px -89px;
}
.main-menu li:hover ul li a:hover {color:#87dc08; background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -89px;
} /* green down */
.main-menu li ul.sub-menu li a:hover, .sub-menu li.selected > span, .sub-menu li.selected > a {color:#87dc08;background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -118px;
} /* green right */
.main-menu li ul li.broadcastLink a:hover, .sub-menu li.broadcastLink.selected * {color:#00a2ff;background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -134px;
} /* blue right */
.main-menu li ul li.webLink a:hover, .sub-menu li.webLink.selected * {color:#d32784;background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -149px;
} /* pink right */
.main-menu li ul li.liveeventsLink a:hover, .sub-menu li.liveeventsLink.selected * {color:#87dc08;background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -119px;
} /* green right */
.main-menu li ul li.customsoftwareLink a:hover, .sub-menu li.customsoftwareLink.selected * {color:#f96e1a;background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat 0 -164px;
} /* orange right */
.main-menu ul li {display:inline-block; font-size:80%; position:relative;}
.intro-text { position:absolute; top:131px; left:6px; width:410px; color:#cccccc; font-size:90%; line-height:1.3em; float:left;}
.intro-text a {color:#87DC08;}

/* MEDIA PLAYER */
.mediaPlayer {position:absolute; top:30px; right: -20px; width:380px; height:260px; background-image:url('/../../../../../../../../images/architecture/media-player-container.png'); 
background-repeat:no-repeat; }
.mediaPlayerContent { border:0px solid red; width:320px; height:180px; top:14px; left:18px; position:absolute; }
.mediaPlayer p { color: #959595;}
.mediaPlayer img {border: none;}
.mediaPlayer a {color: #959595;}
.mediaPlayer a:hover {color: #78CC00;}
ul.mediaPlayerButtons { width: 320px; height: 1.5em; top: 205px; left: 18px; position: absolute; }
ul.mediaPlayerButtons li { width: 14px; height: 14px; display: table-cell; display: inline-table; display: inline-block; text-align: center; vertical-align: middle; background-image:url('/../../../../../../../../images/architecture/media-player-button.png'); 
margin-right:5px; position: relative; }
ul.mediaPlayerButtons li.active { background-image:url('/../../../../../../../../images/architecture/media-player-button-active.png'); }
ul.mediaPlayerButtons a {  color: #ffffff; font-size: 10px; font-weight:bold; display:block; margin-top:1px; }
.mediaPlayerLink { position:absolute; top:205px; left:270px; }
.mediaPlayerLink a { color: #959595; }
.mediaPlayerLink a:hover { color: #87dc08; }

/* FORMS */
input[type=text], input[type=password] {padding: 0px 4px  2px 4px; border: 1px solid grey; background-color: #ffffff;  margin: 4px 0px 8px 0px;  }
input[type=text]:focus, input[type=password]:focus {background-color: #ffffff; border-color: #87dc08; }
input[type=submit] { padding: 1px 4px 1px 4px; cursor: pointer; margin-top: 4px;}
label { font-size: 90%; }
#fancybox-inner label {color: #eee; }

/* LOGIN */
.loginArea { position:absolute; right:10px; top:5px; z-index:10000; color: #eee; }
.loginArea a.login-link {color:#666666; padding:0px 20px 2px 0px; background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat right -56px
}
.loginArea:hover a.login-link {color:#FFFFFF; background:url('/../../../../../../../../images/architecture/menu-arrows.gif') no-repeat right -72px
}
.loginArea a {color:#959595; }
.loginArea a:hover {color:#ffffff; }
.loginArea .userName {color: #ffffff; text-transform: uppercase; }

.login-container { color:Black;  }
.login-container form { margin:10px 20px 4px 20px; padding-left:5px; text-align:left; font-size: 1.2em; }
.login-container input.login-button { padding:3px; border: solid 1px #aaa; width:60px; }
.login-container input.login-button:hover { border: solid 1px #595; }
.login-container .login-input { width:150px; }
.login-container .login-error { width:150px; color: Red; text-align:left; margin: 10px 28px; }


/* NEWS */
div.news-item {padding:10px 0px; float:left; width:500px;}
div.news-item h3 { background: none; color: #383838; margin-top: 0px; padding-bottom: 0px; padding-top: 0px;}
div.news-item p {margin:4px 0px;}


/* HOME PAGE */
.feature-box { height: 322px; float:left; position: relative; width: 261px; margin: 0px 15px 20px 0px; padding: 60px 30px 20px 0px; display: inline-block; background-color: #f4f4f4; position: relative; width:261px; border-style: solid; border-width: 1px 1px 10px 1px; border-radius: 10px; box-shadow: 5px 5px 5px #888;}
.feature-box p {display:block; padding:4px 0px 8px 0px; margin: 0px 40px; width:220px; font-size:110%; line-height:1.4em;}
.feature-box h2 a {position:absolute; top: -7px; left: -6px; padding:13px 20px 0px 50px; color:#FFFFFF; height:37px; background:url('/../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 0;
}
.feature-box h2 a:hover {color:#ededed; background:url('/../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 -50px;
}
.feature-full-box { height:331px; }
.feature-full-box h2 { width: 260px; }
.feature-half-box { height: 110px; }
.feature-half-box h2 { width: 200px; }
.feature-full-box p { padding-top: 150px; }
.features h2 { position:absolute; top:0px; left:0px; height:51px; }
.feature-box h2 {background-image: url('/../../../../../../../../images/architecture/headingbox-bg.gif'); 
background-repeat: repeat-y;
}
.features .broadcast-box {background-image:url('/../../../../../../../../images/homepage/broadcast.jpg'); 
background-repeat:no-repeat; background-position:left top; }
.features .broadcast-box h2 { background-position: -1540px 0 ; }
.features .web-box h2 { background-position: -2200px 0 ; }
.features .customsoftware-box h2 { background-position: -2800px 0 ; }
.features .liveevents-box h2 { background-position: -3400px 0 ; }
.features .generic-box h2 { background-position: -400px 0 ; }
.feature-box a.more {position:absolute; bottom:0px; margin:0px; width: 92px; padding:2px 0px 0px 200px; color:#FFF; font-weight:normal;} 
.feature-box a.more:hover {color:#DDD; }
.broadcast-box a.more {background:#00a2ff;}
.web-box a.more {background:#D32784;}
.customsoftware-box a.more {background:#F96E1A;}
.showcontrol-box a.more {background:#7045FE;}
.liveevents-box a.more {background:#78CC00;}
.generic-box a.more {background:#959595;}

/* SERVICES */
.service .broadcast-box {background-image:url('/../../../../../../../../images/servicepages/broadcast.jpg'); 
background-repeat:no-repeat; background-position:left top; }
.service .web-box {background-image:url('/../../../../../../../../images/servicepages/web.jpg'); 
background-repeat:no-repeat; background-position:left top; }
.service .liveevents-box {background-image:url('/../../../../../../../../images/servicepages/live-events.jpg'); 
background-repeat:no-repeat; background-position:left top; }
.service .customsoftware-box {background-image:url('/../../../../../../../../images/servicepages/custom-software.jpg'); 
background-repeat:no-repeat; background-position:left top; }
.service .page-text {padding-top: 140px;}
.service h3 { color: #ffffff; position: relative; width:280px; left: 24px; top: 100px; vertical-align:bottom; font-size: 210%; line-height: 1.2em; text-transform: lowercase; }


/* PROJECTS */
.project-item {float:left; width:500px;}
.project-item p {margin:4px 0px;}
.header-contact {float:right; color:#60DC08; font-weight:bold; padding:5px;}
.header-contact p {color: #383838; font-size: 140%; }
div.clientLogo {float: right; padding-left: 20px; padding-bottom: 20px; width: 120px; } 
div.clientLogo a:hover {border: none;} 
div.clientLogo img {width: 100%; } 


/* SIDE BAR */
.sideBarBox { float:left; position:relative; width:290px; padding:0px 0px 0px 0px; display:inline-block; margin:0px 0px 20px 15px; border-color: #959595; background-color:#EEEEEE; border-style: solid; border-width: 1px 1px 1px 1px; border-radius: 10px; box-shadow: 5px 5px 5px #888;}
.sideBarBox h2 { padding: 6px 10px 6px 36px; z-index: 3; position:absolute; top: 3px; left: -6px; color:White; font-size:120%; width:200px; background:url('/../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 -100px;
}
.sideBarBox .headingBox { padding: 10px 10px 10px 28px; width:200px; height: 40px; background:url('/../../../../../../../../images/architecture/headingbox-bg.gif') repeat-y -960px 0; 
border-top-left-radius: 10px; border-bottom-right-radius: 6px; }
.sideBarBox ul { padding: 10px 0px 10px 20px}
.sideBarBox a { color: #383838 }
.sideBarBox a:hover {border-bottom:solid 1px #383838;}
.sideBarBox blockquote {padding: 0px 20px 20px 0px; }


/* FAQS */
#accordion dt {font-size: 100%; font-style: normal; position: relative; left: -50px; background-color: #eee; margin: 16px 0 8px 0; padding: 6px 0 0 0 ; width: 552px;}
#accordion dt > a {color: #383838; position: relative; left: -8px; top: -6px; padding: 8px 0 4px 56px;}
#accordion dt > a:hover {border: none;}
#accordion dt.ui-state-default > a {background: url('/../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 -146px
}
#accordion dt.ui-state-hover > a, dt.ui-state-active > a {background: url('/../../../../../../../../images/architecture/bullet-arrows.png') no-repeat 0 -172px
}

/* FOOTER */
.footerMenu {padding: 0px 0px 20px 0px}
.footerMenu li {color:#d32784; display:inline-block; padding:0px 10px; border-right: solid 1px #d32784; float:left; }
.footerMenu li.last {border-right:none;}
.footerMenu li a {color:#d32784;}
.footerMenu li a:hover {color:#FFFFFF;}

img.banner-image {position:absolute; top:0px; left:0px; z-index:1001; display:none;}
img.image-left { margin:0px 25px 25px 0px; }
img.image-left-bullet { margin:0px 50px 25px 0px; }
img.image-right { margin:0px 0px 25px 25px; }

img.MSPartnerLogo {width: 240px; height: 72px; border: none;}


/* FANCYBOX */
a.magnify img {z-index: -1; background: url('images/iconMagnify.jpg') no-repeat 50% left; }
a.magnify:hover, a.jwPlayer:hover {border-style: none; text-shadow: 1px 1px 2px #333333 }
a.magnify:hover img, a.jwPlayer:hover img {border: 1px solid black; -mozilla-box-shadow: 3px 3px 3px #666; -webkit-box-shadow: 3px 3px 3px #666; box-shadow: 3px 3px 3px #666;}
a.magnify p {color: gray; }
li.magnify:hover {background:url('images/arrow-li-small-down.gif') no-repeat top left}

div.jwPlayer {height: 180px; width: 360px; overflow: hidden; }

/* Google Maps */
#map_canvas p { /* font-size:1em; */ margin:0px; padding:0px; line-height:normal; }

/* Client Area Styles */
#client-area {vertical-align:top; margin-top: 0px;}
#client-navmenu {width: 250px; display:inline-block;float:left;}

#client-navmenu li, #client-navmenu ul
{
    list-style: none;
    background-image: none;
    background-color: Transparent; 
    display:block;
    clear:left;
    padding: 0px;
    width:100%;
}


#client-navmenu a
{
    display: block;
    padding: 4px 4px 3px 15px;
    background-color: Transparent;
    border: solid 2px #ccc; 
    line-height: 1em;
}

#client-navmenu ul.depth-1
{
    margin-bottom: 10px;
    border-left: solid 2px #ddd; 
    border-bottom: solid 2px #ddd; 
    border-right: solid 2px #ddd;
    width: 246px;
}

#client-navmenu li.client-navmenu-item
{
    background-color: White;
}

#client-navmenu li.client-navmenu-item.depth-1  
{ 
    margin-bottom: 10px; 
    background-color: #f7f7f7;
}

#client-navmenu li.client-navmenu-item.depth-1 > div a
{ 
    font-weight:bold;
    padding: 5px 5px 5px 15px;
}

#client-navmenu li.depth-2 div.articlelink-container
{ 
    padding-left: 15px; 
}

#client-navmenu li.depth-3 div.articlelink-container 
{ 
    padding-left: 30px; 
}

#client-navmenu li.depth-4 div.articlelink-container 
{ 
    padding-left: 45px; 
}

#client-navmenu li ul a
{
    background-color: Transparent;
    border: none;
}

#client-navmenu div.articlelink-container:hover
{
    background-color: #eff2ff;
}

#client-navmenu div.articlelink-container.selected, #client-navmenu div.articlelink-container.selected:hover
{
    background-color: #ddddff;
}

.client-navmenu-item
{
    display:block;
}

#client-navmenu .title-prefix
{
    position:absolute;
    margin-left: -8px;
    color: #999;
    font-weight:lighter;
    font-family: Arial;
}

#client-article-container
{
    width: 600px;
    margin-left:10px; 
    padding: 10px;
    display:inline-block;

    min-height: 400px;
    background-color: #FFFFFF;
    border: solid 2px #ddd; 
}

#client-article-breadcrumbs div
{
    padding-bottom: 8px;
}
#client-article-breadcrumbs a {color: #333333;}
#client-article-breadcrumbs a:hover {color: #666666;}

#client-article-container h3
{
    clear:left;
    /* font-size: 2.5em; */ 
    margin: 0px 0px 10px -2px;
}

#client-article-container li
{
    background-image:none;
    list-style-type:circle;
    list-style-position:outside;
    padding: 0px;
    margin: 0px 0px 0px 20px;
    
}

#client-article-container.documentation h3
{
    background-color: #a9b9fa;
    color:White;
    font-weight:bold;
    padding:10px;
}

/* Downloads */

div.downloads
{
    padding-top:20px;
    clear:both;
}

div.downloads table
{
    width:100%;
    height:100%;
}

div.downloads td
{
    /* font-size:1.2em; */
}

div.downloads thead tr
{
    border-bottom: solid 1px #bbb;
    margin-bottom: 100px;
}

div.downloads thead td
{
    font-weight:bold;
    padding: 3px 3px 10px 3px;
}

div.downloads tbody td
{
    border-bottom: solid 1px #ccc;
    padding: 3px;
}

div.downloads td.download-link
{
    text-align:right;
    width:5em;
}

div.downloads tr.odd { background-color: #dddddd; }
div.downloads tr.even { background-color: #f3f3f3; }

/* Documentation */


.HelpModuleTableContainer
{
    clear:left;
    display:block;
}

.HelpModuleTableContainer th
{
  text-align: left;
  vertical-align: top;
  border: solid 1px #ccc;
  background-color: #DDDCFF;
  padding: 6px 6px 6px 6px;
  text-transform: capitalize;
}

.HelpModuleTableContainer td
{
  border: solid 1px #eee;
  padding: 6px 6px 6px 6px;
    background-color: White;
  color: Black;
}

.Scrollable
{
  border: solid 1px #eee;
  width: 100%;
  overflow: scroll;
}

.Example
{
  background-color: #BDD6FF;
  border-color: #A9A9FA;
  border-style: dashed;
  border-width: 1px;
  padding: 8px 8px 8px 8px;
  max-width: 600px;
  clear:both;
  display:block;
  color: Black;
  font-family: Arial;
}

.Example p { float:none; }

p.Note
{
  border: 0px none White;
	padding: 8px -8px 8px 20px;
	margin: 0px 0px 10px 0px;
	clear:both;
    color: #383838;
  background: url('/../../../../../../images/architecture/iconInformation.gif') no-repeat left 50%;
}

.Note p { float:none; }
.Note dd { /* font-size:1em; */ padding: 3px 0px; }