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

/* Generic Redefined HTML tags */
* {margin:0;padding:0;border:0;}
html {font-size: 62.5%;}
body {font-family: arial, helvetica, sans-serif; color:#000000; text-align:center; background:#454545 url('images/bg-runner.gif') repeat-y 50% top;}
a {text-decoration:none; cursor:pointer;}
a:hover {text-decoration:none;}

/* Generic Class Styles */
.bold {font-weight:bold;}
.noDisplay {display:none;}
.white {color:#FFF;}
.black {color:#000;}
.red {color:#FF0000;}
.pink {color:#d32784;}
.blue {color:#00a2ff;}
.green {color:#87dc08;}

/* Site Layout */

.outerContainer {width:100%; min-height:100%; }
.innerContainer {width:1024px; height:100%; margin: 0 auto 0 auto; text-align: left; background:#FFFFFF url('images/header-bg.jpg') no-repeat 50% top;}
.slim .innerContainer {background:#FFFFFF url('images/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;}
.clear { clear:both; height:20px; }
.left-pane { width:620px; }
.footer { padding:40px 40px 10px 40px; position:relative; width:944px; background:#000000 url('images/footer-bg.gif') no-repeat left top;}

/* Menu */

.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:1.5em; background:url('images/arrow-white-right.gif') no-repeat 0px 40%;}
.main-menu a:visited {color:#EEEEEE;}
.main-menu li:hover span {cursor:pointer;}
.main-menu li:hover a, .main-menu li:hover span {color:#87dc08; background:url('images/arrow-green-right.gif') no-repeat 0px 40%;}
.main-menu > li.hasSubMenu:hover > a, .main-menu > li.hasSubMenu:hover > span {color:#87dc08; background:url('images/arrow-green-down.gif') no-repeat 0px 60%;}
.main-menu > li.selected.hasSubMenu:hover > a, .main-menu > li.selected.hasSubMenu:hover > span {color:#87dc08; background:url('images/arrow-green-right.gif') no-repeat 0px 40%;}
.main-menu a:active {color:#87dc08; background:url('images/arrow-green-right.gif') no-repeat 0px 40%;}

.sub-menu { position:absolute; margin-top:22px; left:3px; }
.sub-menu a, .sub-menu span {float:left; padding:4px 5px 4px 20px; color:#FFFFFF; font-size:1.5em; background:url('images/arrow-white-right.gif') no-repeat 0px 40%;}

.main-menu li.selected > span, .main-menu li.servicesLink > span { cursor:default; }
.main-menu li.selected > span, .main-menu li.selected > a {color:#87dc08; background:url('images/arrow-green-right.gif') no-repeat 0px 40%;}
.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; font-size:1.5em; background:url('images/arrow-white-right-mini.gif') no-repeat 0px 50%;}
.main-menu li:hover ul li a:hover {color:#87dc08; background:url('images/arrow-green-down-mini.gif') no-repeat 0px 50%;}

.main-menu li ul li.broadcastLink a:hover {color:#00a2ff;background:url('images/arrow-blue-right-mini.gif') no-repeat 0px 50%;}
.main-menu li ul li.webLink a:hover {color:#d32784;background:url('images/arrow-pink-right-mini.gif') no-repeat 0px 50%;}
.main-menu li ul li.liveeventsLink a:hover {color:#87dc08;background:url('images/arrow-green-right-mini.gif') no-repeat 0px 50%;}
.main-menu li ul li.customsoftwareLink a:hover {color:#f96e1a;background:url('images/arrow-orange-right-mini.gif') no-repeat 0px 50%;}
.main-menu li ul li.showcontrolLink a:hover {color:#7045fe;background:url('images/arrow-purple-right-mini.gif') no-repeat 0px 50%;}

.sub-menu li.broadcastLink.selected * {color:#00a2ff;background:url('images/arrow-blue-right-mini.gif') no-repeat 0px 50%;}
.sub-menu li.webLink.selected * {color:#d32784;background:url('images/arrow-pink-right-mini.gif') no-repeat 0px 50%;}
.sub-menu li.liveeventsLink.selected * {color:#87dc08;background:url('images/arrow-green-right-mini.gif') no-repeat 0px 50%;}
.sub-menu li.customsoftwareLink.selected * {color:#f96e1a;background:url('images/arrow-orange-right-mini.gif') no-repeat 0px 50%;}
.sub-menu li.showcontrolLink.selected * {color:#7045fe;background:url('images/arrow-purple-right-mini.gif') no-repeat 0px 50%;}

.main-menu ul li {display:inline-block; font-size:0.8em;position:relative;}


.intro-text { position:absolute; top:131px; left:6px; width:410px; color:#FFFFFF; font-size:1.2em; line-height:1.3em; float:left;}
.intro-text a{color:#87DC08;}

/* Media Player */

.media-player {position:absolute; top:30px; right:0px; width:380px; height:260px }

a.link-on-black {color:#87DC08;}

/* login */

.login-box { position:absolute; right:0px; top:5px; z-index:10000; }
.login-container { color:White; left:-140px; top:13px; position:absolute; width:205px; height:0px; background:url('images/login-box.png') no-repeat right top; }
.login-container form { margin:20px; padding-left:5px; }
.login-container form input { margin:4px 0px 8px 0px; }

a.login-link {color:#666666; padding:0px 20px 2px 0px; font-size:1.1em; background:url('images/login-arrows-top.gif') no-repeat right top}
.login-box:hover a.login-link {color:#FFFFFF; background:url('images/login-arrows-top.gif') no-repeat right -17px}

.login-input { width:150px; }
.login-button { width:60px; }

.login-text input { margin:5px 0px; }
.login-panel { border:dotted 1px #959595; margin-top:30px;  width:auto; display:block; float:left; padding:10px; }

/* Content */

.content { padding:20px 33px 20px 55px; min-height:400px; width:924px; }
.content h3 {font-size:1.6em; margin:6px 0px;}
.content h4 {font-size:1.4em; margin:6px 0px;}
.content p {width:100%; display:block;margin:8px 0px 10px 0px; font-size:1.2em; line-height:1.4em;}
.content p.date {color:#666; margin:5px 0px;}
.content ul {list-style:none; float:left; min-width:200px;}
.content li {font-size:1.2em; line-height:2em;padding:0px 0px 0px 20px; background:url('images/arrow-li-small.gif') no-repeat 0px 50%;}
.content .news-item {padding:10px 0px; float:left; width:500px;}
.content .news-item p {margin:4px 0px;}
.content .project-item {padding:10px 0px; float:left; width:500px;}
.content .project-item p {margin:4px 0px;}

.image-left { clear:left; border:solid 3px #ddd; background:#ddd; }
.image-left img { float:left; max-width:300px; display:inline; margin-right:10px; }
.image-left p { margin: 10px 10px 10px 0px; padding-right:10px; width:485px; height:100%; color:#555; }

.image-right { float:right; width:250px; border:solid 3px #ddd; margin:0px 0px 10px 20px; background:#ddd; color:#555; }
.image-right img { width:100%; }
.image-right p { padding:0px 10px; width:230px; }

.main-panel.with-image .page-text { padding-top:230px; }
.page-text {float:left;width:500px; padding:80px 0px 40px 50px;}
.page-text a {color:#333; }
.page-text a:visited {color:#333; }
.page-text a:hover {color:#000; border-bottom:solid 1px #000;}
.page-text a:active {color:#87dc08; border-bottom:solid 1px #87dc08;}
.page-text li, .box-text li {font-size:1.2em; line-height:1.2em;padding:0px 0px 0px 20px; margin:14px 0px; background:url('images/arrow-li-small.gif') no-repeat 0px 1px;}

.box-text {float:left;width:230px; padding:2px 10px 10px 10px;}
.box-text a {color:#333; }
.box-text a:visited {color:#333; }
.box-text a:hover {color:#000; border-bottom:solid 1px #000;}
.box-text a:active {color:#87dc08; border-bottom:solid 1px #87dc08;}
.box-text ul { margin-left:10px;}

.feature-boxes {float:left; display:block;}
.feature-box { height:32em; float:left; position:relative; width:260px; margin:0px 15px 0px 0px; padding:60px 30px 20px 0px; display:inline-block;}
.feature-half-box { float:left; height:12em; margin:0px 15px 18px 0px; position:relative; width:260px; padding:60px 30px 10px 0px; display:inline-block;}
.feature-box h2 a, .feature-half-box h2 a {position:absolute; top: -7px; left: -6px; padding:13px 20px 0px 50px; color:#FFFFFF; font-size:1.8em; height:37px; background:url('images/title-arrow-link.png') no-repeat top left;}
.feature-box h2 a:hover, .feature-half-box h2 a:hover {color:#ededed; background:url('images/title-arrow-link.png') no-repeat left -50px; }
.feature-box p, .feature-half-box p {display:block; padding:4px 0px 8px 0px; margin: 0px 40px; width:210px; font-size:1.4em; line-height:1.4em;}
.feature-box h2 { margin-bottom:140px;  }
.feature-box, .feature-half-box { background-color:#f4f4f4; }

.sidebar-box, .white-box {border:solid 1px #959595; background-color:#EEEEEE; }

.broadcast-box {border:solid 1px #00a2ff; background-color:#EEEEEE; }
.web-box {border:solid 1px #d32784; background-color:#EEEEEE; }
.customsoftware-box {border:solid 1px #f96e1a; background-color:#EEEEEE; }
.showcontrol-box {border:solid 1px #7045fe; background-color:#EEEEEE; }
.liveevents-box { border:solid 1px #78CC00; background-color:#EEEEEE; }
.generic-box, .news-box, .projects-box {border:solid 1px #959595; background-color:#EEEEEE; }

p.more {position:absolute; bottom:0px; margin:0px; width:90px; padding:2px 0px 0px 200px;} /*padding:10px 30px 15px 45px;*/
/*
p.more a {color:#000; font-weight:normal;}
p.more a:hover {color:#222; }
*/
p.more a {color:#FFF; font-weight:normal;}
p.more a:hover {color:#DDD; }



div.strap { position:absolute; top:0px; left:0px; width:260px; height:51px; }
.broadcast-box div.strap { background: url('images/title-bg-blue.gif') no-repeat top left; }
.web-box div.strap { background:url('images/title-bg-pink.gif') no-repeat top left; }
.customsoftware-box div.strap {  background:url('images/title-bg-orange.gif') no-repeat top left; }
.showcontrol-box div.strap { background:url('images/title-bg-purple.gif') no-repeat top left; }
.liveevents-box div.strap { background:url('images/title-bg-green.gif') no-repeat top left; }
.generic-box div.strap, .news-box div.strap, .projects-box div.strap { background:url('images/title-bg-grey.gif') no-repeat top left; }


.broadcast-box p.more {background:#00a2ff;}
.web-box p.more {background:#D32784;}
.customsoftware-box p.more {background:#F96E1A;}
.showcontrol-box p.more {background:#7045FE;}
.liveevents-box p.more {background:#78CC00;}

/*
.broadcast-box p.more {background:#a0b2ff; border-top:solid 1px #00a2ff; }
.web-box p.more {background:#f357b4; border-top:solid 1px #D32784;}
.customsoftware-box p.more {background:#FA8E3A; border-top:solid 1px #F96E1A;}
.showcontrol-box p.more {background:#b085FF; border-top:solid 1px #7045FE;}
.liveevents-box p.more {background:#A8FC40; border-top:solid 1px #78CC00;}
*/

.header-contact {float:right; color:#60DC08; font-size:1.4em; font-weight:bold; padding:5px;}
.header-contact span {color:#000;}

.heading-box {position:absolute;top:0px; left:0px; z-index:1001; width:597px; min-height:80px; }

.content .subtitle-box {position:absolute;top:100px; left:30px; width:550px;  vertical-align:bottom; }
.content .subtitle-box h3 { color:White; font-size:4em; }

.main-panel {float:left; position:relative; width:597px; padding:0px;}
.main-panel h2 span {position:absolute; top: -7px; left: -6px; padding:13px 20px 0px 50px; color:#FFFFFF; font-size:1.8em; height:37px; background:url('images/title-arrow-link.png') no-repeat top left;}

.side-panel { float:left; position:relative; width:290px; padding:0px 0px 0px 0px; display:inline-block; margin:0px 0px 20px 15px;}
.side-panel div.strap { display:block; position:relative; background:url('images/title-bg-dark-grey.gif') no-repeat top left; height:auto; }
.side-panel div.strap h2 { padding: 10px 10px 10px 28px; color:White; font-size:1.4em; width:200px; }
.side-panel div.strap h2 div.arrow {position:absolute; top: 3px; left: -6px; background:url('images/title-arrow-link-small.png') no-repeat top left; height:50px; width:50px;}
.side-panel .box-text {  display:block; clear:left; }


.footer-menu li {font-size:1.2em; color:#d32784; display:inline-block; padding:0px 10px; border-right: solid 1px #d32784; float:left; }
.footer-menu li.last {border-right:none;}
.footer-menu li a {color:#d32784;}
.footer-menu 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; }

/*div.project-item img { position:relative; right:10px; }*/

/* 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; 
    font-size: 1em;
    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-size:1.1em;
	font-family: Arial;
}

.Example p { float:none; }

.Note
{
	background-color: #FAE5E5;
	border-color: White;
	border-style: solid;
	border-width: 1px;
	padding: 8px 8px 8px 8px;
	max-width: 600px;
	clear:both;
	display:block;
	color: Black;
}

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