L/* Project Name : Global Customer Demonstrations - NUBI Profile : Demo User, Developer HTML Prototype Author : Pooja Shah Date : Jan 23, 2012 -------------------------------------------------------- */ /* Reset Styles */ body, img, h1, h2, h3, h4, h5, h6, div, span, p, ul, li, form, label, input, button, select, textarea, iframe, table, th, td {margin:0; padding:0} img {border:none} ul, li {list-style:none} a, a:hover {text-decoration:none} a:focus {outline:none} h1, h2, h3, h4, h5, h6 {line-height:normal; font-size:100%} /* Common Styles */ html {height:100%} body {height:100%; margin:0; font-family:Verdana, Arial, sans-serif; font-size:11px} input, button, select, textarea {font: bold 11px Verdana, Arial, sans-serif; border: 1px solid #ddd; border-radius: 0.4em; padding:0.15em} h1 {font-size:18px; color:#1e324b; padding-bottom:10px; border-bottom:1px solid #c6e4f3} h2 {font-size:14px} h3 {color:#2c2c2c; margin-bottom:5px} select {height:22px}lo fieldset {border: 1px solid #DDD; padding: 0 0.5em 0.5em} legend {color: #1FACEF; font-size: 1.2em} radio {display:inline} .adminDivs {position: relative;} .relPos {position: relative} .divsWOlay { position: relative; height: 455px;} .editOverlay {display:none; position: absolute; top:0; left:50%; margin-left: -300px; width: 600px; height: 445px; background-color: #fff; border: 2px solid #c6e4f3; z-index:1000; box-shadow: 0px 12px 6px -6px #bbb; -moz-box-shadow: 0px 12px 6px -6px #bbb; -webkit-box-shadow: 0px 12px 6px -6px #bbb; border-radius: 0px 0px 3px 3px; -moz-border-radius:0px 0px 3px 3px; -webkit-border-radius: 0px 0px 3px 3px;} .speedOverlay {display:none; position: absolute; top:0; left:50%; margin-left: -400px; width: 800px; height: 445px; background-color: #fff; border: 2px solid #c6e4f3; z-index:1000; box-shadow: 0px 12px 6px -6px #bbb; -moz-box-shadow: 0px 12px 6px -6px #bbb; -webkit-box-shadow: 0px 12px 6px -6px #bbb; border-radius: 0px 0px 3px 3px; -moz-border-radius:0px 0px 3px 3px; -webkit-border-radius: 0px 0px 3px 3px;} .accordion div.editorField {clear: both; padding-left:20%; padding-right: 20%; padding-top:6px; border-style: none;} .editorField label {float:left; padding-top: 2px; width:35%;} .editorField input {float:left; width: 60%} .overlayHdr {background-color: #cee0ec; color: #2779aa; padding: 4px; border-bottom: 1px solid #81a4c0} .accordion div.overlayWrap { padding-left: 10px; padding-right: 10px; border: none;} .accordion div.overlayFrm { height: 360px; padding-left: 10px; padding-right: 10px; border: none;} .accordion div.overlayFtr { padding: 10px; float:right; width: 25%; margin-left: auto; border: none;} .accordion .clearstyle {border:none; line-height: 16px;} .clearstyle div.valueField {border: 1px solid #ddd; border-radius: 0.4em; padding: 0.15em; width: 65%; height:14px; background-color: #fdfdfd; overflow: hidden} .css_right {float:right} .iwrap {padding:0 63px} .iMarginWrap {margin:0 55px; min-width:830px} .iMarginWrapDev {margin:0 55px; min-width:1075px} .iWrap2 {} .iwrap3 {padding:0 33px} .lFloat {float:left} .rFloat {float:right} .topSpacer {margin-top:10px} .btmSpacer {margin-bottom:20px} .lrtSpacer {margin:20px 20px 0} .lSpacer {margin-left:10px} .leftSpacer {padding-left:100px} .hideScr {display:none} .showScr {display:block} .floatLeftnoPad {float:left; margin: 0 0 0 10px;} .floatLeftPad {float:left; margin:20px 0 0 10px} .floatRightPad {float:right; margin:5px 10px 0 0} .hilited {font-weight:bold} .newStatus {font-size:14px; letter-spacing:1px; text-transform:uppercase} /* Custom Styles */ /* Header Styles */ #header {height:75px; background:url('../images/header_bg.jpg') bottom left repeat-x;} #header .logo {float:left; margin-top:10px} .hdrRight {float:right; margin:22px 0 0; height:45px} .hdrRight li {float:left; height:100%} .hdrRight li img {margin:15px 15px 0 0} .hdrRight li span.leftCorner, .hdrRight li span.rightCorner {float:left; width:13px; height:100%; background-image:url('../images/action-corner.png')} .hdrRight li span.leftCorner {background-position:bottom left} .hdrRight li span.rightCorner {background-position:bottom right} .hdrRight li a {float:left; height:100%; background:url('../images/action-bg.png') bottom left repeat-x} .hdrRight li a.active span {float:left; height:100%; background:url('../images/topmenu_activeBg.png') bottom center no-repeat; cursor:default} .hdrRight li a img {margin:15px 10px 0} .hdrRight li.hdrTxtLink a {background:none; color:#b3cfe1; padding-top:24px; height:auto; padding-left:15px; text-decoration:underline} .hdrRight li.hdrTxtLink a:hover {text-decoration:none} /* Anchor:hover property */ .hdrRight li.hdrTxtLink a:hover, .profilePicWrap a:hover, #popWrap .loginBtnWrap a.loginNavLink:hover, #popWrap .smallWrapper a.titleLink:hover {text-decoration:none} /* Banner Styles */ #banner {height:250px; background:url('../images/banner_block_bg.jpg') 0 0 repeat-x; padding-top:13px;} #bannerBg {height:189px; background:url('../images/banner_bg.jpg') 0 0 repeat-x; border:14px solid #044672; margin:0 63px} /* Banner Carousel */ #featured {width:100%; position:relative; height:190px; background:#cde0ec;} #featured ul.ui-tabs-nav {position:absolute; top:142px; left:12px; right:0; overflow:hidden; z-index:994} #featured ul.ui-tabs-nav li {display:block; float:left; margin-right:5px} #featured ul.ui-tabs-nav li img {float:left; height:30px; width: 60px;} #featured li.ui-tabs-nav-item a {display:block; height:30px; width:60px; border:2px solid #cde0ec} #featured li.ui-tabs-selected {} #featured ul.ui-tabs-nav li.ui-tabs-selected a {border:2px solid #fff} #featured .ui-tabs-panel {width:100%; height:190px; position:relative; float:left} #featured .ui-tabs-panel img {float:right; height:190px; width:674px;} #featured .ui-tabs-panel .info {position:absolute; height: 90%; top:10px; left:10px; width:50%; xbackground:#dae8f1} #featured .info h2 {color:#044672; margin:0px 0px 5px 15px} #featured .info p {margin:0px 15px 0; color:#044672} #featured .info a {color:#fff; float:right; margin:0 15px 5px 0; text-align:center; background:url('../images/banner/banner-button-bg.png') 0 0 no-repeat; width:79px; height:30px; line-height:20px} #featured .ui-tabs-hide {display:none} /* Banner Sliding Panel */ #bannerTxtWrap {width:342px; position:absolute; z-index:995; right:63px; margin-top: 12px;} #bannerTxtWrap li h6 {color:#fff; background:#044672; height:19px; padding-left:15px; position:relative} #bannerTxtWrap li h6 a.btn-slide {position:absolute; top:0; right:0px; width:24px; background:url('../images/white-arrow.png') right -58px no-repeat} #bannerTxtWrap li h6 a.btn-slide.active {background-position:right top} #bannerTxtWrap li span {float:left; width:6px; height:6px; line-height:6px; background-image:url('../images/banner_txtbg.png')} #bannerTxtWrap li span.leftCorner {background-position:bottom left} #bannerTxtWrap li span.rightCorner {background-position:bottom right} #bannerTxtWrap li span.midSpacer {background:#044672 none; width:330px} #bannerTxtWrap li#bannerHidPanel {clear:both; display:none; background:#044672; color:#fff; padding:10px 0} #bannerTxtWrap li#bannerHidPanel p {padding:0 15px; line-height:13pt} /* Inner Screen Banner */ #innbanner {height:28px; background:url('../images/banner_block_bg.jpg') bottom left repeat-x} #innbanner .lhs, #innbanner .rhs {float:left; color:#b3cfe1; font-weight:bold} #innbanner .lhs {width:65%} #innbanner .lhs .picBlock {float:left; width:64px; height:42px; padding:8px 0 0; margin-top:15px; background:url('../images/pic_user_bg.png') bottom left no-repeat} #innbanner .lhs .picBlock img {border:1px solid #4991bc; margin-left:14px} #innbanner .lhs .txtBlock {float:left; margin-left:14px} #innbanner .lhs #username {color:#fff} #innbanner .rhs {width:35%; text-align:right; height:28px} #innbanner .rhs span {display:block} #innbanner .lhs .txtBlock, #innbanner .rhs span {padding-top:10px} .layoutWrap {min-height: 100%; min-width: 1024px; height: auto !important; height:100%; margin: 0 auto -63px; background-color: #e7f4fb; } /* Content Wrapper Styles */ #contentWrap {background:#e7f4fb url('../images/page_bg.jpg') 0 0 repeat-x; padding:20px 0 10px;} #contentWrap .topRow, #contentWrap .btmRow, #contentWrap .midRow {clear:both} #contentWrap .topRow, #contentWrap .btmRow {height:20px} #contentWrap .topRow span, #contentWrap .btmRow span, #contentWrap .midRow li {float:left; height:100%} #contentWrap .topRow span.leftCorner, #contentWrap .topRow span.rightCorner, #contentWrap .btmRow span.leftCorner, #contentWrap .btmRow span.rightCorner, #contentWrap .midRow li.leftSide, #contentWrap .midRow li.rightSide {width:3%} #contentWrap .topRow span.midSection, #contentWrap .btmRow span.midSection, #contentWrap .midRow li.midSection {width:94%} #contentWrap .topRow span.leftCorner, #contentWrap .topRow span.rightCorner, #contentWrap .btmRow span.leftCorner, #contentWrap .btmRow span.rightCorner {background-image:url('../images/content_wrapper.jpg')} #contentWrap .topRow span.midSection, #contentWrap .btmRow span.midSection {background-image:url('../images/content_wrapper_tb.jpg'); background-repeat:repeat-x} #contentWrap .midRow li.leftSide, #contentWrap .midRow li.rightSide {background-image:url('../images/content_wrapper_lr.jpg'); background-repeat:repeat-y} #contentWrap .midRow li.midSection {background:#fff;} #contentWrap .topRow span.leftCorner, #contentWrap .topRow span.midSection, #contentWrap .midRow li.leftSide {background-position:top left} #contentWrap .topRow span.rightCorner, #contentWrap .midRow li.rightSide {background-position:top right} #contentWrap .btmRow span.leftCorner, #contentWrap .btmRow span.midSection {background-position:bottom left} #contentWrap .btmRow span.rightCorner {background-position:bottom right} #contentWrap .midRowHeight0 {height:540px} #contentWrap .midRowHeight1 {height:600px} #contentWrap .midRowHeight2 {height:710px} #contentWrap .midRowHeight3 {height:1040px} #contentWrap .midRowHeight4 {height:760px} #contentWrap .midRowHeight5 {height:790px} #contentWrap .midRow li.midSection h1 {position:relative} #loading {position: absolute; padding: 5px; width:70px; top:200px; left: 50%; margin-left: -35px; z-index:1000; border: 0px; opacity: 0.7; -mox-opacity: 0.7; filter:alpha(opacity=70);border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;} /* Main Navigation styles */ .rightNavMenu {position:absolute; top:0; right:0; display:block; width:auto; font-size:11px; font-weight:normal} .rightNavBtn {width:44px; height:25px; background:transparent url('../images/smallNavBtn.jpg') 0 0 no-repeat; border:0; text-align:center; color:#fff; font-weight:bold; cursor:pointer; padding-top:2px; vertical-align:middle} #contentWrap .midRow li.midSection h1 .mainNavBtn {position:absolute; right:0; background:url('../images/mainNavBtn_bg.jpg') right top no-repeat; padding-right:12px; line-height:28px; color:#fff; font-weight:normal; font-size:11px; height:30px} #contentWrap .midRow li.midSection h1 .mainNavBtn span {float:left; background:url('../images/mainNavBtn_bg_left.jpg') 0 0 no-repeat; width:12px; height:30px} /* Sub Navigation styles */ #contentWrap .midRow li.midSection .subNavBtnWrap {padding:10px 0 20px} #contentWrap .midRow li.midSection .subNavBtnWrap a {float:right; margin-left:3px; padding-right:12px; line-height:28px; background:url('../images/subNavBtn_bg.jpg') right top no-repeat; color:#fff} #contentWrap .midRow li.midSection .subNavBtnWrap a span {float:left; background:url('../images/subNavBtn_bg_left.jpg') 0 0 no-repeat; width:12px; height:30px} /* Left-Right Column Content */ .leftCol, .rightCol {float:left; padding-top:20px} .leftCol {width:25%} .rightCol {width:75%} /* User Profile styles */ .profilePicWrap {text-align:center} .profilePicBlock {border:1px solid #b4cee1; width:80px; height:80px; padding:10px; margin:0 auto} .profilePicWrap a {display:block; margin-top:10px; color:#1e324b; text-decoration:underline} .profilePicWrap a:hover {text-decoration:none} .profileWrap {padding-top:20px; height:110px} .profileWrap label, .profileWrap span.valueCol, .accountWrap label, .accountWrap span.valueCol, .personaWrap label, .personaWrap span.valueCol, .uinfoWrap label, .uinfoWrap span.valueCol {float:left; padding:2px 0; vertical-align: middle;} /* .profileWrap label {width:20%} .profileWrap span.valueCol {width:80%} */ .accountWrap, .personaWrap {float:left} .accountWrap h2, .personaWrap h2, .uinfoWrap h2 {margin-bottom:10px} .accountWrap {width:50%} .accountWrap label {width:40%} .accountWrap span.valueCol {width:60%} .personaWrap {width:45%} .personaWrap label {width:45%} .personaWrap span.valueCol {width:55%} .uinfoWrap {padding-top:40px} .uinfoWrap label {width:20%} .uinfoWrap span.valueCol {width:80%} .accordion div.profileSettings {float: left; margin:10px; padding: 10px; border-style: none;} .endPointKits {height:355px;} /* Accordion Styles */ .accordion {margin-top:20px; clear:both; border-right:1px solid #fff} /* Border-right Need to fix layout breakage in IE6 */ .accordion div {border:1px solid #b4cee1; border-top:0} .accordion div div.noBdr {border:0} /* Need to override set properties of
*/ .accordion div.filter {border:0; padding-top: 2px; padding-bottom: 2px; float:right} .accordion div.fc div {border-style: none;} .accordion a.tab, .accordion a.tab1 {display:block; background:url('../images/tab_Off.jpg') 0 0 repeat-x; border:1px solid #d9e9f2; height:30px; line-height:30px; font-weight:bold; color:#1e324b; padding-left:10px; position:relative} .accordion a span.arrow, .accordion a.selected span.arrow {background-image:url('../images/tab_arrow.png'); background-repeat: none;} .accordion a.tab span.arrow, .accordion a.tab1 span.arrow {position:absolute; top:8px; right:10px; width:14px; height:14px; background-position:center top} .accordion a.tab:hover, .accordion a.tab1:hover {background:#e9f2f8 none} .accordion a.selected {color:#fff; background:url('../images/tab_On.jpg') 0 0 repeat-x; border-color:#81a4c0; cursor:default} .accordion a.selected:hover {background:url('../images/tab_On.jpg') 0 0 repeat-x} .accordion a.selected span.arrow {background-position:bottom center} /* Demo Details screen - Demo State & Name Display ---------------- */ .accordion a.tab span.activeStateIcon, .accordion a.tab span.pendingStateIcon, .accordion a.tab span.completeStateIcon {position:absolute; top:8px; left:10px; width:16px; height:16px; background-position:0 0; background-repeat:no-repeat} .accordion a.tab span.activeStateIcon {background-image: url('../images/ico_demoActive.png')} .accordion a.tab span.pendingStateIcon {background-image: url('../images/ico_demoPending.png')} .accordion a.tab span.inactiveStateIcon {background-image: url('../images/ico_demoComplete.png')} .accordion a.tab span.demoName {position:absolute; top:0; left:34px; line-height:30px} .accordion a.tab span.activeStateIcon, .accordion a.tab span.demoName {cursor:pointer} .accordion a.selected span.activeStateIcon, .accordion a.selected span.demoName {cursor:default} div.endPointStatus {height: 40px; float: left; padding: 15px;} div.endPointStatus span {width:16px; height: 16px; background-repeat: no-repeat} div.endPointStatus span.activeStateIcon {background-image: url('../images/ico_demoActive.png')} div.endPointStatus span.inactiveStateIcon {background-image: url('../images/ico_demoComplete.png')} /* ---------------- */ /* .listView {padding-top:15px; height: 477px;} */ .listView {padding-top:15px; height:300px;} #contentWrap .midRow li .listView li {float:none; height:auto} /* Need to override set properties of
  • */ .listView li {clear:both; border-top:1px solid #d9e5f1} .listView li.noTopBdr {border-top:0} /* Alternate Rows in List View ---------------- */ .listView li.odd, .listView li.odd div.picContent, .listView li.odd div.txtContent {background:#f2f6fa} .listView li.odd div.picContent, .listView li.odd div.txtContent, .listView li.even div.picContent, .listView li.even div.txtContent {height:80px} .rowView li.odd div.picContent, .rowView li.odd div.txtContent, .rowView li.even div.picContent, .rowView li.even div.txtContent {height:80px;} /* ---------------- */ .picContent {height:120px; margin: 15px; float: left;} .picContent img {border: 5px solid #1facef; height:59px; width:59px} .txtContent {height:120px; float: left; margin-top: 40px; margin-right: 15px;} .dirSection {height:150px; width: 50px; font-size: 4em; font-weight: bold; color: lightblue; float: left;} .tableView#sessionListDiv {height:455px} .dataTables_wrapper div {border-style: none;} table#sessionList.tableView {width: 100%} .tableView tr {height: 25px} .tableView tr.odd {background: #f2f6fa} div.DataTables_sort_wrapper span {margin-top: -15px;} .sessionOptions {width:100px} .listView li div.picContent, .listView li div.txtContent, .listView li div.txtContent div.txtLinks, .listView li div.txtContent .lhs, .listView li div.txtContent .rhs, .listView li div.txtContent .demoLinks, .listView li div.demoLinks, .listView li div.vpnInfoDiv, .listView li div.topologyWrap, .listView li div.topologyWrap div.cloud1, .listView li div.topologyWrap div.cloud2, .listView li div.topologyWrap div.cloud3 {border:0} /* Need to override set properties of
    */ .listView li div.picContent, .listView li div.txtContent {float:left; padding-top:12px} .listView li div.picContent {width:10%} .listView li div.txtContent {width:89.9%} .listView li div.picContent img {border:1px solid #7c7c7c; margin-left:10px} .rowView li div.picContent img {border:0} .listView li div.wideWidth {width:98% !important; padding-left:10px} .listView li p {line-height:16px} /* HyperLinks under Accordion */ .accordion .listView li a {display:inline; background:none; border:0; height:auto; line-height:normal; font-weight:normal; padding:0; color:#2970a6} /* Need to override set properties of */ .listView li a {text-decoration:underline; margin-right:12px} .rowView li div.txtContent .rhs {position:relative} .rowView li div.txtContent .rhs a.removeBtn {position:absolute; right:10px; top:0} .listView li div.txtContent .lhs, .listView li div.txtContent .rhs {float:left} .listView li div.txtContent .lhs {width:49%} .listView li div.txtContent .rhs {width:50%} .listView li div.wideWidth .lhs {width:54%} .listView li div.wideWidth .rhs {width:46%} .rowView li div.txtContent .lhs {width:70%} .rowView li div.txtContent .rhs {width:30%; text-align:center; height:auto} .listView li div.txtContent label, .listView li div.txtContent span {float:left; line-height:16px} .listView li div.txtContent label {width:20%} .listView li div.txtContent span {width:79%} .listView li div.wideWidth .lhs label {width:20%} .listView li div.wideWidth .lhs span {width:80%} .listView li div.txtContent span.hilited {font-weight:bold} .listView li .demoLinks {clear:both; padding-top:6px} /* Topology styles */ .listView li div.vpnInfoDiv {background:#f3f7fb; margin-top:-15px; height:45px; padding:15px 0 0} .listView li div.vpnInfoDiv label, .listView li div.vpnInfoDiv p {float:left;} .listView li div.vpnInfoDiv label {width:15%; text-align:center; font-weight:bold} .listView li div.vpnInfoDiv p {width:85%} .listView li.noSess {text-align: center;} .listView li.noSess span.noSessions {color: #666666;} .listView li.noSess span.noSessions h3 {color: #cccccc; font-size: 18px;} /* Pagination Styles */ .accordion div.pagination, .accordion div.pagination div {border:0; background-color: #FFF} /* Need to override set properties of
    */ .pagination {height:48px; padding:0 12px; font-weight:bold; color:#696969; border-top:1px solid #d9e5f1 !important} .pagination div {width:49%} .pagination div.txt {float:left; line-height:48px} .pagination div.btns {float:right; line-height:48px; text-align:right; font-weight:normal; color:#696969;} .pagination div.btns a {text-decoration: none; color: #666666; cursor: pointer;} /* Need to override set properties of */ .pagination div.btns .no_more {color: lightgray !important;cursor: default !important;} /* Notification styles */ .rowView {} .rowView li {float:left} .rowView li.colIcon {width:10%; text-align:center} .rowView li.colTxt {width:55%} .rowView li.colDate {width:25%} .rowView li.colClose {width:10%; text-align:center} /* Footer Styles */ #pushFooter {height:63px;} #footer {background: #7fbfda url('../images/foot_bg.jpg') 0 0 repeat-x ; text-align: center; height: 63px;} #footer .supportInfo {width: 80%; padding-top: 10px; padding-bottom: 10px; margin-left: auto; margin-right: auto;} /* Popup Styles */ #popWrap {} /* Login screen styles */ #popWrap .loginWrapper {width:300px; padding-top:30px;} #popWrap .loginBtnWrap {width:300px; text-align:center; padding-top:20px} #popWrap .loginWrapper, #popWrap .loginBtnWrap {clear:both; margin:0 auto} #popWrap .loginBtnWrap a.loginNavLink {color:#1e324b; text-decoration:underline} #popWrap .loginBtnWrap a.loginNavLink:hover {text-decoration:none} #popWrap .loginError {color: red; font-size: 12px;} button.BtnWrap {cursor: pointer} #pushLoginFtr {height:78px} #popWrap .loginFooter {height:26px; background:#fff;} /* margin-top:82px */ #popWrap .loginFooter .lhs, #popWrap .loginFooter .rhs {float:left; width:50%; line-height:22px; color:#46484a} #popWrap .loginFooter .rhs {text-align:right} #popWrap .panels {float: left;} #popWrap label, #popWrap input, #popWrap select, #popWrap textarea {float:left; margin:6px; padding:2px} #popWrap label {color:#fff; width:25%; text-align:right; line-height:22px} #popWrap label.blackTxt {color:#000} #popWrap p.blackTxt {color:#000} #popWrap input, #popWrap select {border:1px solid #b5b8c8; height:22px; line-height:22px; width:60%} #popWrap textarea {border:1px solid #b5b8c8; width:60%; line-height:22px} #popWrap textarea.decriptionFld {height:150px; overflow:auto} #popWrap textarea.attendeesFld {height:80px; overflow:auto} #popWrap input.srchFld {margin:0 10px; color:#777} #popWrap input.loginFld, #popWrap select.loginFld {width:50%} #popWrap .btnWrap {clear:both; padding:20px 0 0 125px} #popWrap button {background:transparent url('../images/blackBtn_bg.png') 0 0 no-repeat; border:0; height:22px; width:75px; color:#fff; margin:0 10px; cursor:pointer} #popWrap button.grey {background:transparent url('../images/greyBtn_bg.png') 0 0 no-repeat} #popWrap input.up {background:transparent url('../images/greyBtn_up.png') 0 0 no-repeat; width:30px;} #popWrap input.down {background:transparent url('../images/greyBtn_dn.png') 0 0 no-repeat;width:30px;} #popWrap .btnWrap a {color:#e7f4fb; text-decoration:underline; margin-left:11px} #popWrap .lhs, #popWrap .rhs {float:left;} #popWrap .lhs {width:34%} #popWrap .rhs {width:66%} #popWrap .lhs h2, #popWrap .lhs p {margin-left:10px} #popWrap h1 {color:#fff; padding:10px} #popWrap h2 {color:#b3cfe1; margin:20px 0 5px} #popWrap p {color: #f3f4f5} #popWrap .lhs label, #popWrap .lhs input, #popWrap .lhs select {padding:0} /* Need to override the set 'PADDING' property */ #popWrap .lhs label {width:22%; margin:10px 0 0; padding-right:10px} #popWrap .lhs input, #popWrap .lhs select {margin:10px 0 0} #popWrap .lhs input.dateFld {width:130px} #popWrap .lhs input.timeFld {width:35px} #popWrap .lhs input.dateFld, #popWrap .lhs input.timeFld {margin-right:10px} #popWrap .lhs select.timeFld {width:47px} #popWrap .lhs input.durationFld {width:26px; text-align:center} /*#popWrap .lhs span {float:left; margin:14px 2px 0; color:#fff}*/ #popWrap .btnWrap1 {position:absolute; bottom:10px; width:100%; background-color: white; height:35px; padding-top: 5px;} #popWrap .btnWrap1 .lFloat {margin-left:0px} #popWrap .btnWrap1 .rFloat {margin-right:0px} #popWrap .rhs .tLegends {color:#fff; padding:7px 0} #popWrap .rhs .tLegends span {margin:8px 5px 0 0} #popWrap .rhs .tLegends span, #popWrap .rhs label {float:left} #popWrap .rhs .tLegends span.pastTime, #popWrap .rhs .tLegends span.unavailableTime, #popWrap .rhs .tLegends span.availableTime, #popWrap .rhs .tLegends span.selectedTime {width:15px; height:10px} #popWrap .rhs .tLegends span.pastTime {background:#e3e1e1; margin-left:10px} #popWrap .rhs .tLegends span.unavailableTime {background:#e1ccb0} #popWrap .rhs .tLegends span.availableTime {background:url('../images/legend_availableTime.jpg') 0 0 no-repeat} #popWrap .rhs .tLegends span.selectedTime {background:#99d2fb} #popWrap .rhs label {width:75px; text-align:left; margin:0 0 0 2px} /* Need to override the set properties of