@import url(../css/bstyle.css); 

html, body { background-color:#f5f6f7; }

.bigboxborder { position:absolute; width:984px; height:7px; left:0; z-index:5; font-size:1px; }
.bigboxborder.top { top:0; background:url(../images/content_tp.png) no-repeat; }
.bigboxborder.bottom { bottom:0; _bottom:-1px; background:url(../images/content_btm.png) no-repeat 0 100%; }

#main { background:#fff url(../images/content_bg.png) repeat-y; }
#content { margin:0 2px; *margin:0 1px; padding:4em 50px 2em; }

h1 img { *margin-bottom:10px; }
#content h2 { font-size:1.8333em; line-height:1.15em; }

#content .left { float:left; }
#content .right { float:right; }

#content .flushtop { position:relative; margin-top:-4em; }
#content .flushright { position:relative; margin-right:-50px; }
#content .flushleft { position:relative; margin-left:-50px; }
#content .flushbottom { position:absolute; bottom:0; }
#content img.inline { margin-top:1em; }
#content img.center { display:block; margin-right:auto; margin-left:auto; }

.nowrap { white-space:nowrap; }
span.more { color:#08c; padding-right:10px; white-space:nowrap; background:url(../images/more.gif) no-repeat 100% 50%; zoom:1; }
a.wrap:hover { text-decoration:none; }
a.block { display:block; color:#333; }
a.block:hover { text-decoration:none; }
a.wrap:hover span,
a.block:hover span,
a:hover span.more { text-decoration:underline; cursor:pointer; }


.column { display:inline; }
.gridbox .column { width:47%; }


/* main header */
#mainheader { z-index:10; }
#mainheader h2 a { display:inline; text-indent:0; }
#mainheader h2 a img { position:relative; margin-bottom:-8px; }



/* stepbox */
.stepbox { margin:-10px -50px 0; *margin: -10px -49px 0; padding-bottom:1px; line-height:16px; text-align:center; background:#fff url(../images/stepbox_gradient.png) repeat-x left bottom; }
.stepbox:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.stepbox li { display:-moz-inline-stack; display:inline-block; *display:inline; width:176px; margin:0 -2px 0; text-align:left; background:url(../images/stepbox_border.png) no-repeat 0 100%; *margin:0 -1px 0 0; zoom:1; }
.stepbox li a { display:block; display:inline-block; *display:inline; width:132px; padding:27px 15px 19px 30px; color:#333; outline:none; background:url(../images/stepbox_border.png) no-repeat 100% 100%; zoom:1; }
.stepbox li a img { padding:4px; margin-bottom:7px; border:1px solid #ccc; background-color:#fff; }
.stepbox li a h4 { line-height:1.4; word-spacing:-1px; color:inherit; }
.stepbox li a p { margin:0; }
.stepbox li:hover a,
.stepbox li a:hover { text-decoration:none; background:url(../images/stepbox_hover.png) no-repeat 0 100%; }

/* selected steps */
#generator        .stepbox li#stepnav-generator,
#viewer  .stepbox li#stepnav-viewer,
#router      .stepbox li#stepnav-router { background:url(../images/stepbox_on.png) no-repeat 0 100%; }

#generator        .stepbox li#stepnav-generator a,
#viewer  .stepbox li#stepnav-viewer a,
#router      .stepbox li#stepnav-router a { color:#666 !important; text-shadow:#fff 0 1px 0; cursor:default; background:none; }




#overview #bigbox { position:relative; width:984px; margin:0 auto 12px; background:#fff url(../images/content_bg.png) repeat-y; }




#specs #content { padding:32px 50px 24px; }
#specs #content .grid3col .column { margin-left:50px; width:260px; }

#specs #content img { display:block; }
#specs #content img.left,
#specs #content img.right { display:inline; }

#specs #content h3 { clear:both; font-size:15px; font-weight:normal; color:#000; line-height:16px; margin-top:16px; padding:5px 0 10px; border-top:1px solid #bbb; }

#specs #content dl { display:inline; font-size:11px; line-height:16px; color:#333; }
#specs #content dl#dimensions { display:block; margin-bottom:32px; }
#specs #content dl#dimensions dt { float:left; }
#specs #content dl#dimensions dd { margin-left:80px; }
#specs #content dl#dimensions dt,
#specs #content dl#dimensions dd { margin-bottom:8px; }
#specs #content dl#dimensions span { font-weight:bold; color:#000; }

#specs #content ul { margin-bottom:32px; font-size:11px; line-height:16px; color:#333; }
#specs #content ul ul { margin-top:8px; margin-bottom:16px; }
#specs #content ul li { margin-bottom:8px; }




/* selected tutorial steps */
#scenario_1        .stepbox li#stepnav-scenario_1,
#scenario_2  .stepbox li#stepnav-scenario_2,
#scenario_3      .stepbox li#stepnav-scenario_3 { background:url(../images/stepbox_on.png) no-repeat 0 100%; }
#scenario_4      .stepbox li#stepnav-scenario_4 { background:url(../images/stepbox_on.png) no-repeat 0 100%; }

#scenario_1        .stepbox li#stepnav-scenario_1 a,
#scenario_2  .stepbox li#stepnav-scenario_2 a,
#scenario_3      .stepbox li#stepnav-scenario_3 a { color:#666 !important; text-shadow:#fff 0 1px 0; cursor:default; background:none; }
#scenario_4      .stepbox li#stepnav-scenario_4 a { color:#666 !important; text-shadow:#fff 0 1px 0; cursor:default; background:none; }