body { font-size: 62.5%; } .nav { font-family: Verdana,Arial,sans-serif; width: 200px; } .nav dt { color: #E87B10; font-size: 1.7em; font-weight: bold; margin-top: 1em; margin-bottom: 0.5em; } .nav dd { margin-left: 0.5em; } .nav dd a { border-bottom:1px solid #F4F4F4; color:#000000; display:block; font-size: 1.4em; font-weight: bold; height:1.4em; padding:7px 3px 3px 12px; text-decoration:none; } .nav dd a:hover { background: #eaeaea; border-bottom: 1px solid #bbb; } /* Site -------------------------------- */ body { margin: 0; padding: 0 0 20px; min-height: 100%; /* font-family: "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; */ font-family: "Arial", "Helvetica", "Verdana", "sans-serif"; font-size: 10px; } #wrapper { margin: 0 auto; width: 956px; position: relative; /* background: url('/images/body_footer_bg.jpg') no-repeat center bottom; padding-bottom: 365px; */ } #banner { height: 125px; } #content .bg { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); } table.layout-grid a.disabled, table.layout-grid a.disabled:hover { color: #aaa; cursor: default; text-decoration: line-through; } div.notice { background: #FFF1AF; padding: 3px; margin-bottom: 5px; font-size: 12px; border: 1px solid #EFD500; } /* Logo -------------------------------- */ h1.logo { position: absolute; top: 55px; left: 28px; margin: 0; } h1.logo, h1.logo a { width: 235px; height: 55px; } h1.logo a { display: block; background: url('/images/logo.gif') no-repeat; } h1.logo a span { display: none; } /* Dock -------------------------------- */ #dock { height: 25px; float: left; position: absolute; top: 0; right: 2px; } #dock .left { float: left; width: 3px; height: 25px; background: url('/images/dock.png') no-repeat left top; } #dock .right { float: left; width: 3px; height: 25px; background: url('/images/dock.png') no-repeat right top; } #dock ul, #dock ul li { float: left; list-style-type: none; margin: 0; padding: 0; } #dock ul { padding: 0 6px; height: 25px; background-color: #000; } #dock ul li { padding: 0 6px; position: relative; } #dock ul li a { float: left; display: block; padding: 0 5px; color: #ccc; text-decoration: none; font-size: 12px; line-height: 22px; } #dock ul li a:hover, #dock ul li.selected a { color: #fff; border-bottom: 2px solid #ff9c08; } #dock ul li.selected a { font-weight: bold; } /* Navigation -------------------------------- */ #navigation { height: 41px; float: left; position: absolute; top: 62px; right: 0px; } #navigation .left { float: left; width: 5px; height: 41px; /* background: url('/images/navigation.png') no-repeat left top; */ background: url('/images/navigation_l.png') no-repeat left top; } #ie6 #navigation .left { background: transparent none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/navigation_l.png', sizingMethod='scale'); zoom: 1; } #navigation .right { float: left; width: 3px; height: 41px; background: url('/images/navigation.png') no-repeat right top; } #navigation ul, #navigation ul li { float: left; list-style-type: none; margin: 0; padding: 0; font-size: 13px; line-height: 38px; } #navigation ul { height: 41px; background: url('/images/navigation.png') repeat-x 0 -41px; } #navigation ul li a { float: left; display: block; height: 41px; padding: 0 18px; color: #ccc; text-decoration: none; background: url('/images/navigation_s.png') no-repeat right top; } #navigation ul li.selected a { color: #fff; } #navigation ul li.last a{ background-image: none; } #navigation ul li a:hover { color: #fff; } /* Content -------------------------------- */ #content-wrapper { background: #FFF url('/images/content_bg.png') repeat-y 0 0; } #content { background: url('/images/content_body_bg.png') no-repeat 0 13px; zoom: 1; } .content-top { font-size: 1px; height: 13px; background: url('/images/content_top_bg.png'); } .content { padding: 0 3px 0 3px; overflow: hidden; } #content .content { min-height: 380px; background: url('/images/dot.png') repeat-y 203px 0; } #home #content .content, #download #content .content, #demos #content .content { background: none; } #ie6 #content .content { height: 380px; overflow-y: visible; } /* Layout */ .content-head { height: 74px; border-bottom: 1px solid #ccc; background-color: #fff; } .content-head h2 { float: left; margin: 0; padding: 20px 0 20px 24px; color: #ff9c08; font: normal 29px/30px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; letter-spacing: .5px; } .content-head h2 span { padding-right: 16px; border-right: 1px solid #ccc; } .content-head p { margin: 0; padding: 28px 0 0 12px; float: left; font: bold 15px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; letter-spacing: .5px; } /* Layout -------------------------------- */ .themes { background: url('/images/themes_bg.png') repeat-x scroll 0 -1px; } /* Layout -------------------------------- */ .layout-grid { width: 100%; } .layout-grid td { vertical-align: top; } .layout-grid td.home { background: url('/images/home_bg.jpg') no-repeat scroll right top; height: 412px; padding: 0 600px 0 24px; } .layout-grid td.left-nav { width: 200px; } .layout-grid td.normal { border-left: 1px solid #ccc; padding: 20px 24px; font-family: "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; } .layout-grid td.demos { background: url('/images/demos_bg.jpg') no-repeat; height: 337px; overflow: hidden; } .layout-grid td.download { background: url('/images/demos_bg.jpg') no-repeat; height: 337px; } /* Home -------------------------------- */ .home h3 { margin: 0; padding: 17px 0 11px 0; color: #ff9c08; font: normal 30px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; letter-spacing: .5px; } .home p.large { padding-bottom: 15px; color: #000; font: bold 13px/19px "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; letter-spacing: .2px; line-height: 16px; } .home p { margin: 0; padding-bottom: 14px; color: #333; font: normal 11px/14px 'Trebuchet MS', 'Arial', 'Helvetica', sans-serif; } .teaserbox { position: absolute; top: 265px; left: 452px; width: 450px; } .teaserbox ul { list-style-type: square; } .teaserbox p { margin: 5px; padding: 0px; } .teaserbox h4 { margin-bottom: 0px; position: relative; left: 1px; top: 1px; color: #fff; } .teaserbox h4 span { position: absolute; top: -1px; left: -1px; color: #000; } /* Side Menu -------------------------------- */ .section { padding: 24px 23px 8px 22px; border-bottom: 1px dashed #ccc; } ul.side-menu, ul.side-menu li, p.side-menu-title { list-style-type: none; margin: 0; padding: 0; letter-spacing: 0.75pt; } ul.side-menu li a { font: normal 11px 'Arial', 'Helvetica', sans-serif; text-decoration: none; color: #000; } ul.side-menu li a:hover { color: #e87b10; } p.side-menu-title { font: bold 15px 'Arial', 'Helvetica', sans-serif; color: #e87b10; } ul.side-menu { padding: 5px 2px 0; } /* Normal -------------------------------- */ .normal h3, .normal h4 { margin: 0; font-weight: normal; } .normal h3 { padding: 0 0 9px; } .normal h4 { padding-bottom: 21px; border-bottom: 1px dashed #999; font-size: 12px; font-weight: bold; } .normal .pull-quote { padding: 6px 0; line-height: 20px; text-transform: uppercase; font-size: 12px; } .normal p { font-size: 12px; } /* Download -------------------------------- */ td.download { /*height: 650px !important;*/ } .download .click-to-download { position: relative; margin: 61px 3px 0; padding: 0 19px; background: url('/images/download-top.gif') no-repeat left top; width: 270px; height: 226px; float: left; font-family: "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; } .download .click-to-download .bg-footer, .download .click-to-download .bg { position: absolute; bottom: 0; left: 0; width: 308px; height: 102px; background: url('/images/download-bottom.png') no-repeat left top; } .download .click-to-download .bg { background-position: left bottom; } .download .click-to-download h3 { margin: 0; padding: 14px 0 10px; font-weight: normal; font-size: 21px; } .download .click-to-download h3 span { font-size: 10px; } .download .click-to-download p { margin: 0; padding: 12px 0 0; font-size: 12px; } .download .click-to-download a.download { display: block; position: absolute; left: 65px; top: 136px; height: 38px !important; width: 240px; font-size: 16px; font-weight: bold; } .download .click-to-download a.download:link { color: #333; text-decoration: none; } .download .click-to-download a.download:visited { color: #333; text-decoration: none; } .download .builder { position: absolute; top: 475px; right: 16px; width: 612px; font-family: "Lucida Grande", "Arial", "Helvetica", "Verdana", "sans-serif"; font-size: 12px; opacity: 0; filter: alpha(opacity=0); } .download .builder h3 { margin: 0; padding: 5px 10px 10px; font-weight: normal; font-size: 21px; } .download .builder p { margin: 0; padding: 0 0 0 12px; font-size: 12px; } .download .builder .top { height: 8px; background-image: url('/images/builder_top.png'); } .download .builder .bottom { height: 8px; background-image: url('/images/builder_bottom.png'); } .download .builder .content { background-image: url('/images/builder_bg.png'); } .download .p { padding: 5px 10px 10px; } .components-list { font-size: 12px; } .components-list table { width: 100%; } .components-list th, .components-list td { text-align: left; vertical-align: middle !important; padding: 3px; } .components-list th { line-height: 22px; padding: 0 0 4px 2px; cursor: default; } .components-list label { padding-left: 5px; } .list-section { border-bottom: 1px dashed #bbb; background: #EAEAEA; padding: 10px 10px 10px 10px; width: 715px; line-height: 18px; } .list-padding { padding: 5px; line-height: 18px; } .list-component { background-color: #F4F4F4; } .list-component-selected { font-weight: bold; } .text-bg-up, .text-bg-down { background:#FFFFFF url(/images/text-bg-up.gif) repeat-x scroll 0pt; background-position:0px 0px; } .text-bg-down { background:#FFFFFF url(/images/text-bg-down.gif) repeat-x scroll 0pt !important; } .ui-transparent { opacity:0; filter:Alpha(Opacity=0); } .text-align-right { text-align: right !important; } .text-align-left { text-align: left !important; } .text-align-center { text-align: center !important; } .label-files { background: url(/images/group.png) no-repeat; padding-left: 20px; line-height: 20px; margin-left: 10px; cursor: pointer; } .download #total-size { width: 160px; margin-left: 90px; text-align: right; } .big { font-size: 13px; font-weight: bold; } .title-big { font-size: 14px; font-weight: bold; letter-spacing: .3px; } /* Launch Pad -------------------------------- */ #launch-pad { height: 127px; overflow: hidden; background: url('/images/launch-pad_bg.png') repeat-y center top; padding: 11px 0px 11px 16px; } #launch-pad .launch-pad-button { float: left; width: 255px; height: 106px; background: url('/images/launch-pad_button.png') no-repeat; padding: 21px 22px 0 23px; margin: 0 6px; cursor: pointer; cursor: hand; position: relative; } #ie6 #launch-pad .launch-pad-button { height: 106px; } #launch-pad .launch-pad-button .bg { position: absolute; top: 0; left: 0; width: 310px; height: 127px; background: url('/images/launch-pad_button.png') no-repeat left bottom; } #launch-pad .launch-pad-button h3, #launch-pad .launch-pad-button p { position: relative; } #launch-pad .launch-pad-button.left { margin-left: 0; } #launch-pad .launch-pad-button.right { margin-right: 0; } #launch-pad .launch-pad-button h3 { margin: 0; padding: 0 0 4px; color: #ff9c08; font: normal 18px 'Arial', 'Helvetica', sans-serif; letter-spacing: .8px } #launch-pad .launch-pad-button h3 a, #launch-pad .launch-pad-button h3 a:hover { color: #ff9c08; text-decoration: none; } #launch-pad .launch-pad-button p { margin: 0; padding: 0 2px; color: #cbcbcb; font: normal 11px/15px 'Arial', 'Helvetica', sans-serif; letter-spacing: .2px; } /* Footer -------------------------------- */ #footer { height: 45px; padding: 10px 0; position: relative; } #footer .inner { position: relative; z-index: 2; } #ie6 #footer .inner { zoom: 1; } #footer .bg { background: url('/images/footer_bg.png') no-repeat left top; width: 100%; height: 65px; position: absolute; top: 0; left: 0; z-index: 1; } #ie6 #footer .bg { background: transparent none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/footer_bg.png', sizingMethod='scale'); zoom: 1; } #footer p { margin: 0; padding: 0; color: #5e5e5e; font: normal 9px 'Arial', 'Helvetica', sans-serif; text-transform: uppercase; } #footer p a { color: #bbb; } #footer span.first { display: block; float: left; padding: 6px 0 0 16px; } #footer .block { display: block; float: left; } #footer .block span, #footer span.empty { display: none; } #footer .liferay { margin: 3px 10px 0px 10px; background: url('/images/icon_liferay.gif'); width: 98px; height: 22px; border: 0; } #footer .filamentgroup { background: url('/images/icon_filamentgroup.gif'); width: 180px; height: 28px; border: 0; margin: 3px 22px 0px 3px; } #footer .adobe { margin: 2px 0 0 0; background: url('/images/icon_adobe.png'); width: 28px; height: 28px; } /* Demoflow -------------------------------- */ div.demoflow-button-left { position: absolute; left: -3px; top: 371px; background: url('/images/demos_arrows.png') no-repeat left top; width: 52px; height: 45px; cursor: pointer; cursor: hand; z-index: 999; } div.demoflow-button-left .bg { background: url('/images/demos_arrows.png') no-repeat left bottom; width: 52px; height: 45px; position: absolute; top: 0; left: 0; } div.demoflow-button-right { position: absolute; right: -4px; top: 371px; background: url('/images/demos_arrows.png') no-repeat right top; width: 52px; height: 45px; cursor: pointer; cursor: hand; z-index: 999; } div.demoflow-button-right .bg { position: absolute; left: 0; top: 0; background: url('/images/demos_arrows.png') no-repeat right bottom; width: 52px; height: 45px; } .demoflow { position: relative; top: 22px; left: 0; width: 950px; height: 337px; } .demoflow div { float: left; height: 100px; width: 75px; cursor: pointer; cursor: hand; } .ie .demoflow div { zoom: 1; } .demoflow div { border: 1px solid #666; } .demoflow div:hover { border: 1px solid #666; /*opacity: 1 !important;*/ } .demoflow div img { height: 100%; width: 100%; } .demoflow div.shadow { height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; background-color: black; } .ie .demoflow div.shadow { display: none; } /* Functional Demos */ #links { float:left; width:155px; font-size: 13px; } #functional ul { list-style: none; padding: 0; margin: 0; } #functional #links ul { margin-top:10px; line-height:1.2em; } #functional #links ul li a{ border-bottom: 1px solid #F4F4F4; display:block; padding: 3px 3px 3px 12px; font-size: 95%; text-decoration: none; color: #000; height: 15px; } #functional #links ul li a:hover, #functional #links ul li a:focus { background: #EAEAEA; border-color: #BBBBBB; } /* About */ div.about ul { list-style-type: square; margin-bottom: 50px; } div.about ul li h5 { font-size: 16px; margin-bottom: 10px; } div.about ul li a:link, div.about ul li a:visited { text-decoration: none; color: #666; } div.about ul li a:hover { color: #000; } div.about ul li p { padding-right: 40px; padding-left: 20px; } /* Specific code from former individual files */ .jquery-safari-checkbox {display: inline;} .jquery-safari-checkbox-box {display: inline; font-size: 16px; line-height: 16px; cursor: pointer; cursor: hand;} .jquery-safari-checkbox .mark {display: inline;} .jquery-safari-checkbox img {vertical-align: middle; width: 16px; height: 16px;} .jquery-safari-checkbox img{background: transparent url(/images/safari-checkbox.png) no-repeat;} .jquery-safari-checkbox img{ background-position: 0px 0px; } .jquery-safari-checkbox-hover img{ background-position: -16px 0px; } .jquery-safari-checkbox-checked .jquery-safari-checkbox img{ background-position: 0px -16px; } .jquery-safari-checkbox-checked .jquery-safari-checkbox-hover img { background-position: -16px -16px; } .jquery-safari-checkbox-disabled img{ background-position: 0px -32px; } .jquery-safari-checkbox-checked .jquery-safari-checkbox-disabled img{ background-position: 0px -48px; } .jquery-checkbox-box {display: inline; font-size: 20px; line-height: 20px; cursor: pointer; cursor: hand;} .jquery-checkbox {display: inline;} .jquery-checkbox .mark {display: inline;} .jquery-checkbox img {vertical-align: middle; width: 60px; height: 20px;} .jquery-checkbox img{background: transparent url(/images/checkbox.png) no-repeat;} .jquery-checkbox img{ background-position: 0px 0px; } .jquery-checkbox-hover img{ background-position: 0px 0px; } .jquery-checkbox-checked .jquery-checkbox img{ background-position: 0px -40px; } .jquery-checkbox-checked .jquery-checkbox-hover img { background-position: 0px -40px; } .jquery-checkbox-disabled img{ background-position: 0px -80px; } .jquery-checkbox-checked .jquery-checkbox-disabled img{ background-position: 0px -100px; } div.selectbox-wrapper { position:absolute; width:158px; background-color: #fff; border:1px solid #6c6c6c; margin:0px; margin-top: -1px; padding:0px; font-size:0.8em; text-align:left; max-height:200px; overflow:auto; } div.selectbox-wrapper ul { list-style-type:none; margin:0px; padding:0px; } div.selectbox-wrapper ul li.selected { /*background-color: #D2D2D2;*/ } div.selectbox-wrapper ul li.current { background-color: #CFCFCF; } div.selectbox-wrapper ul li { list-style-type:none; display:block; margin:0; padding:2px; cursor:pointer; } .selectbox /* look&fell of select box*/ { padding: 4px 0 0 4px; _padding: 0 0 0 4px; font-family:Verdana, Geneva, Arial, Helvetica, sans-serif; font-size:12px; width : 150px; display : block; text-align:left; background: url('/images/select-bg.png') right no-repeat; height:22px; cursor: pointer; border:0px solid #6c6c6c; color:#CECECE; } /* ie7 */ html>body .selectbox { *padding: 0 0 0 4px; } /* opera9, webkit */ @media all and (min-width:0px) { head~body .selectbox { padding: 0 0 0 3px; } } input.selectbox { line-height: 21px; vertical-align: middle !important; }