/*[fmt]1C20-1C0D-E*/ /* * Licensed to the Apache Software Foundation (ASF) under one * or more contributor license agreements. See the NOTICE file * distributed with this work for additional information * regarding copyright ownership. The ASF licenses this file * to you under the Apache License, Version 2.0 (the * "License"); you may not use this file except in compliance * with the License. You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /*+clearfix {*/ div.toolbar:after, .multi-wizard .progress ul li:after, .multi-wizard.zone-wizard .select-container .field .select-array-item:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; font-size: 0; } div.toolbar, .multi-wizard .progress ul li, .multi-wizard.zone-wizard .select-container .field .select-array-item { display: inline-block; } div.toolbar, .multi-wizard .progress ul li, .multi-wizard.zone-wizard .select-container .field .select-array-item { /*\*/ display: block; /**/ -height: 1px; } /*+}*/ body { min-width: 1024px; font-family: sans-serif; height: 769px !important; overflow: auto; background: #EDE8E8; } body.install-wizard { font-family: sans-serif; height: 769px !important; overflow: auto; overflow-x: hidden; background: #FFFFFF url(../images/bg-login.png); } #main-area { width: 1024px; height: 729px; margin: auto; border: 1px solid #D4D4D4; /*+box-shadow:0px -5px 11px #B7B7B7;*/ -moz-box-shadow: 0px -5px 11px #B7B7B7; -webkit-box-shadow: 0px -5px 11px #B7B7B7; -o-box-shadow: 0px -5px 11px #B7B7B7; box-shadow: 0px -5px 11px #B7B7B7; border: 1px solid #E8E8E8; } #container { /*[empty]width:;*/ height: 100%; margin: auto; position: relative; } #sections { display: none; } a { color: #0B84DC; text-decoration: none; } a:hover { text-decoration: underline; color: #000000; } /*Table*/ table { width: 740px; max-width: 777px; margin: 15px 15px 12px 12px; font-size: 13px; text-align: left; text-indent: 10px; border-bottom: 1px solid #C4C5C5; border-collapse: collapse; position: relative; } table thead { background: url(../images/bg-table-head.png) repeat-x; cursor: default; } table thead th { border: 1px solid #C6C3C3; color: #525252; border-top: none; border-bottom: 1px solid #CFC9C9; text-align: left; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; font-weight: bold; } table thead th.sorted { color: #312F2F; /*+text-shadow:0px 1px 1px #BFBFBF;*/ -moz-text-shadow: 0px 1px 1px #BFBFBF; -webkit-text-shadow: 0px 1px 1px #BFBFBF; -o-text-shadow: 0px 1px 1px #BFBFBF; text-shadow: 0px 1px 1px #BFBFBF; } table thead th.sorted.desc { background-position: 102% -111px; } table thead th.sorted.asc { background-position: 102% -157px; } table tbody td, table th { padding: 10px 5px 8px; border-right: 1px solid #BFBFBF; color: #282828; clear: none; min-width: 88px; font-size: 11px; overflow: hidden; vertical-align: middle; } table tbody td.loading { text-align: center; background: #DBE2E9; border-top: 1px solid #FBFBFB; } table tbody td.truncated { overflow: visible; max-width: 88px; } table tbody td.truncated > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /** Multiselect*/ table thead th.multiselect, table tbody td.multiselect { width: 20px; min-width: 20px; max-width: 20px; } table thead th.multiselect input, table tbody td.multiselect input { margin: 0; /*+placement:shift -8px 0px;*/ position: relative; left: -8px; top: 0px; } table thead th.multiselect input { margin-left: 2px; } /** Actions table cell*/ table tbody td.actions { width: 130px; max-width: 130px !important; min-width: 130px !important; vertical-align: middle; } table tbody td.actions input { /*+placement:shift 10px -6px;*/ position: relative; left: 10px; top: -6px; margin: 11px 0 0px; } /** Quick view table cell*/ table tbody td.quick-view, table thead th.quick-view { min-width: 58px; max-width: 58px !important; width: 58px !important; height: 14px !important; text-indent: 2px; white-space: nowrap; } table tbody td.quick-view { cursor: pointer; } table tbody td.quick-view .icon { margin-left: 22px; margin-top: 3px; padding: 0px 0px 6px 12px; background: url(../images/sprites.png) no-repeat -44px -62px; } table tbody td.quick-view:hover .icon { background-position: -44px -644px; } table tbody tr.loading td.quick-view .icon { display: none; } table tbody tr.loading td.quick-view { cursor: default; } table tbody tr.loading td.quick-view .loading { background-position: center center; } /** Row styling*/ table tbody tr { border-left: 1px solid #C4C5C5; border-right: 1px solid #C4C5C5; border-top: 1px solid transparent; } table tbody tr.even { background: #FFFFFF; } table tbody tr.odd { background: #F2F0F0; } table tbody tr.selected { background: #CBDDF3; border-top: 1px solid #EDF0F7 !important; border-bottom: 1px solid #BABFD9; text-shadow: 0px 1px 1px #FCFBF7; } table tbody tr.to-remove { background: #E05959; border-top: 1px solid #EDF0F7 !important; border-bottom: 1px solid #BABFD9; text-shadow: 0px 1px 1px #FCFBF7; } table tbody tr.loading { background: #E2E9F0; } table tbody tr.loading td { /*+opacity:50%;*/ filter: alpha(opacity=50); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); -moz-opacity: 0.5; opacity: 0.5; } table tbody tr.loading td.loading.icon { background: url(../images/ajax-loader.gif) no-repeat center; height: 35px; padding: 0; } table tbody tr div.loading { display: block; width: 50px; height: 14px; background: transparent url(../images/ajax-loader-small.gif) no-repeat center; margin: auto; } table th.resizable { position: relative; cursor: col-resize; } table th div.ui-resizable-handle { position: relative; top: -30px; float: right; } /** Header, misc*/ #template { display: none; } /*Login screen*/ body.login { background: url(../images/overlay-pattern.png) repeat center, #106CA9 url(../images/bg-login.jpg) no-repeat center; background-size: auto, cover; overflow: hidden; } .login { display: block; width: 100%; height: 350px; /*+placement:shift 0 80px;*/ position: relative; left: 0; top: 80px; background: #053663; } .login .select-language { margin-top: 10px; float: left; } .login .select-language select { width: 260px; border: 1px solid #808080; margin-top: 30px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; font-size: 12px; /*+box-shadow:inset 0px 1px 1px #838383;*/ -moz-box-shadow: inset 0px 1px 1px #838383; -webkit-box-shadow: inset 0px 1px 1px #838383; -o-box-shadow: inset 0px 1px 1px #838383; box-shadow: inset 0px 1px 1px #838383; } .login .fields { width: 409px; float: left; margin: 72px 0 0 88px; } .login .fields .field { position: relative; } .login .fields .field label { font-size: 12px; color: #4E4F53; /*+placement:displace 9px 14px;*/ position: absolute; margin-left: 9px; margin-top: 14px; } .login .fields .field label.error { color: #FF0000; float: right; left: 264px; top: 0; } .login .fields input { width: 248px; height: 20px; margin: 5px 0 0; text-indent: 1px; font-size: 13px; border: none; padding: 5px; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; /*+box-shadow:inset 0px 1px 1px #4E4E4E;*/ -moz-box-shadow: inset 0px 1px 1px #4E4E4E; -webkit-box-shadow: inset 0px 1px 1px #4E4E4E; -o-box-shadow: inset 0px 1px 1px #4E4E4E; box-shadow: inset 0px 1px 1px #4E4E4E; background: #ECECEC; } .login .fields input.error { border-color: #FF8080; background: #FFEAEA; } .login .fields input[type=submit] { background: transparent url(../images/sprites.png) -563px -747px; cursor: pointer; border: none; margin: 7px 238px 0 -1px; text-align: center; width: 69px; height: 25px; display: block; color: #FFFFFF; font-weight: bold; float: left; text-indent: -1px; /*+text-shadow:0px 1px 2px #000000;*/ -moz-text-shadow: 0px 1px 2px #000000; -webkit-text-shadow: 0px 1px 2px #000000; -o-text-shadow: 0px 1px 2px #000000; text-shadow: 0px 1px 2px #000000; } .login .fields input[type=submit]:hover { background-position: -563px -772px; } .login .logo { width: 250px; height: 31px; float: left; margin: 72px 0 0 209px; background: url(../images/logo-login.png) no-repeat 0 0; } .login.nologo .logo { background-image: url(../images/logo-login-oss.png); } .login form { display: block; width: 1000px; height: 100%; margin: auto; background: #053663; } /*About dialog*/ .dialog-about .ui-widget-content { padding-left: 0; padding-right: 0; width: 100% !important; } .dialog-about .logo { font-size: 26px; color: #636363; padding-top: 20px; } .dialog-about .version { font-size: 12px; padding-top: 10px; } .dialog-about .ui-button { float: none; margin: 0 auto; } #browser div.panel div.detail-view .toolbar { width: 100%; } div.list-view table tbody td span { display: block; float: left; max-width: 89%; word-wrap: break-word; text-indent: 0; margin-left: 12px; line-height: 15px; } div.list-view div.toolbar div.section-switcher div.section-select label { margin: 0 9px 0 0; } .loading-overlay { position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; background: #F2F2F2 url(../images/ajax-loader.gif) no-repeat center; z-index: 500; /*+opacity:70%;*/ filter: alpha(opacity=70); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); -moz-opacity: 0.7; opacity: 0.7; } .loading-overlay span { display: block; text-align: center; margin: 155px 0 0 5px; color: #4B4B4B; } .detail-view .ui-tabs-panel .loading-overlay { background-position: 50% 250px; } /*Install wizard*/ .install-wizard { width: 1024px; height: 768px; margin: auto; border-top: none; position: relative; } .install-wizard .header { text-align: center; background: url(../images/bg-login.png); color: #626E82; height: 365px; padding: 32px 0 89px; /*+text-shadow:0px 1px 2px #FFFFFF;*/ -moz-text-shadow: 0px 1px 2px #FFFFFF; -webkit-text-shadow: 0px 1px 2px #FFFFFF; -o-text-shadow: 0px 1px 2px #FFFFFF; text-shadow: 0px 1px 2px #FFFFFF; z-index: 9; } .install-wizard .header h3 { font-size: 20px; } .install-wizard .step { max-width: 691px; margin: auto; padding: 56px 0 0; } .install-wizard .step .title { width: 303px; margin: auto auto 30px; font-size: 22px; clear: both; color: #626E82; } .install-wizard .step .subtitle { color: #4B5E69; font-weight: bold; font-size: 12px; } .install-wizard .step p { color: #4A4A4A; font-size: 15px; line-height: 23px; background: url(../images/bg-gradient-white-transparent.png) repeat-x -114px -270px; } .install-wizard .step ul li { margin: 14px 0 0 18px; width: 465px; font-size: 13px; list-style: disc; } .install-wizard .step .field { text-align: left; margin: 0 0 12px; } .install-wizard .step .field label { display: block; clear: both; font-size: 11px; color: #4D4D4D; } .install-wizard .step .field label.error { color: #FF2424; font-size: 11px; } .install-wizard .body { width: 1012px; height: 762px; margin: -352px auto auto; z-index: 10; background: url(../images/bg-gradient-white-transparent.png) repeat-x -114px -141px; /*+box-shadow:0px -3px 4px #CFCFCF;*/ -moz-box-shadow: 0px -3px 4px #CFCFCF; -webkit-box-shadow: 0px -3px 4px #CFCFCF; -o-box-shadow: 0px -3px 4px #CFCFCF; box-shadow: 0px -3px 4px #CFCFCF; } .install-wizard h2 { font-size: 28px; margin: 0 0 19px; } .install-wizard input[type=text], .install-wizard input[type=password], .install-wizard input[type=text], .install-wizard select { width: 288px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border: 1px solid #CDCDCD; /*+box-shadow:inset 0px 1px #AEAEAE;*/ -moz-box-shadow: inset 0px 1px #AEAEAE; -webkit-box-shadow: inset 0px 1px #AEAEAE; -o-box-shadow: inset 0px 1px #AEAEAE; box-shadow: inset 0px 1px #AEAEAE; -moz-box-shadow: inset 0px 1px 0px #AEAEAE; -webkit-box-shadow: inset 0px 1px 0px #AEAEAE; -o-box-shadow: inset 0px 1px 0px #AEAEAE; font-size: 14px; color: #232323; padding: 6px; background: #F7F7F7; } .install-wizard .button { background: url(../images/bg-gradients.png) 0px -221px; padding: 7px 16px 7px 18px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border: 1px solid #505050; color: #FFFFFF; font-size: 12px; font-weight: bold; /*+text-shadow:0px -1px 3px #3F4351;*/ -moz-text-shadow: 0px -1px 3px #3F4351; -webkit-text-shadow: 0px -1px 3px #3F4351; -o-text-shadow: 0px -1px 3px #3F4351; text-shadow: 0px -1px 3px #3F4351; float: right; cursor: pointer; margin-top: 15px; } .install-wizard .button.advanced-installation, .install-wizard .button.go-back { background: #E0DEDE; color: #3B3B3B; border: 1px solid #C7C2C2; /*+text-shadow:0px 0px #FFFFFF;*/ -moz-text-shadow: 0px 0px #FFFFFF; -webkit-text-shadow: 0px 0px #FFFFFF; -o-text-shadow: 0px 0px #FFFFFF; text-shadow: 0px 0px #FFFFFF; float: left; } .install-wizard .button.go-back { padding: 9px 16px 10px 18px; font-size: 12px; } .install-wizard .setup-form .button.go-back { /*+placement:shift 15px -14px;*/ position: relative; left: 15px; top: -14px; } .install-wizard .step { z-index: 11; position: relative; } .install-wizard .step .tooltip-info { /*+placement:shift 547px 50px;*/ position: relative; left: 547px; top: 50px; position: absolute; } /*** Intro*/ .install-wizard .step.intro.what-is-cloudstack p { background: url(../images/bg-what-is-cloudstack.png) no-repeat 50% 237px; height: 540px; } /*** Diagram*/ .install-wizard .diagram { width: 910px; height: 385px; /*+placement:shift 65px 496px;*/ position: relative; left: 65px; top: 496px; position: absolute; z-index: 10; } .install-wizard .diagram .part { background: url(../images/install-wizard-parts.png) no-repeat; display: none; } .install-wizard .diagram .part.zone { width: 742px; height: 135px; background-position: -267px -580px; /*+placement:shift 77px 222px;*/ position: relative; left: 77px; top: 222px; position: absolute; } .install-wizard .diagram .part.loading { width: 742px; height: 432px; background-position: -1264px -487px; /*+placement:shift 105px -67px;*/ position: relative; left: 105px; top: -67px; position: absolute; } .install-wizard .diagram .part.loading .icon { width: 61px; height: 76px; background: url(../images/ajax-loader.gif) no-repeat; /*+placement:shift 322px 130px;*/ position: relative; left: 322px; top: 130px; } .install-wizard .diagram .part.pod { width: 266px; height: 396px; background-position: -47px -3px; /*+placement:shift 313px -76px;*/ position: relative; left: 313px; top: -76px; position: absolute; } .install-wizard .diagram .part.cluster { width: 266px; height: 396px; background-position: -364px 1px; /*+placement:shift 313px -76px;*/ position: relative; left: 313px; top: -76px; position: absolute; } .install-wizard .diagram .part.host { width: 266px; height: 396px; background-position: -688px 1px; /*+placement:shift 313px -76px;*/ position: relative; left: 313px; top: -76px; position: absolute; } .install-wizard .diagram .part.primaryStorage { width: 275px; height: 396px; background-position: -1046px 1px; /*+placement:shift 306px -76px;*/ position: relative; left: 306px; top: -76px; position: absolute; } .install-wizard .diagram .part.secondaryStorage { width: 385px; height: 396px; background-position: -1469px 1px; /*+placement:shift 306px -76px;*/ position: relative; left: 306px; top: -76px; position: absolute; } /*** Setup form*/ .install-wizard .step .setup-form { display: inline-block; background: url(../images/bg-transparent-white.png); width: 469px; border: 1px solid #DFDFDF; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; -moz-text-shadow: 0px 1px 0px #FFFFFF; -webkit-text-shadow: 0px 1px 0px #FFFFFF; -o-text-shadow: 0px 1px 0px #FFFFFF; /*+box-shadow:0px 5px 9px #9F9F9F;*/ -moz-box-shadow: 0px 5px 9px #9F9F9F; -webkit-box-shadow: 0px 5px 9px #9F9F9F; -o-box-shadow: 0px 5px 9px #9F9F9F; box-shadow: 0px 5px 9px #9F9F9F; } .install-wizard .step .setup-form .title { float: left; margin: 17px 0 0 29px; color: #626F7C; } .install-wizard .step .setup-form .field { width: 389px; display: inline-block; margin: 6px 0 1px 31px; padding: 9px; color: #57646D; } .install-wizard .step .setup-form .field .name { width: 98px; text-align: right; float: left; font-size: 13px; padding: 10px 0 0 0px; } .install-wizard .step .setup-form .field .value { float: right; } .install-wizard .step .setup-form input[type=text], .install-wizard .step .setup-form input[type=password] { width: 278px; border: 1px solid #8D8D8D; padding: 2px 2px 1px; margin: 6px 4px 0 0; } .install-wizard .step .setup-form .range-item { width: 142px; float: left; } .install-wizard .step .setup-form .range-item input { width: 131px; } .install-wizard .step .setup-form .multi-range input[type=text] { width: 128px; } .install-wizard .step .setup-form input.button { margin: 0 30px 14px 15px; } /*** Step: Change user*/ .install-wizard .step.change-user { text-align: center; padding-top: 95px; width: 316px; margin: auto; } .install-wizard .step.intro { } .install-wizard .step.intro iframe { width: 99%; height: 99%; margin: 4px; } .install-wizard .step.intro .title { color: #565454; margin-left: 0; margin-bottom: 21px; font-size: 25px; } .install-wizard .step.intro .subtitle { margin-bottom: 9px; } .install-wizard .step.intro .subtitle li { background: url(../images/ajax-loader-small.gif) no-repeat 3px 0px; position: relative; width: 45%; padding: 1px 0 1px 30px; height: 24px; list-style: none; } .install-wizard .step.intro .subtitle li.complete { background: url(../images/icons.png) -1px -224px; } .install-wizard .step.intro .subtitle li.error { background: url(../images/icons.png) -1px -190px; } .install-wizard .step.intro .subtitle li img { float: right; } /*Notifications*/ div.notification-box { width: 323px; height: 354px; background: url(../images/bg-notifications.png) no-repeat 0px 0px; } div.notification-box h3 { color: #FFFFFF; /*+placement:shift 0px 35px;*/ position: relative; left: 0px; top: 35px; text-align: center; font-size: 21px; letter-spacing: 1px; /*+text-shadow:0px 1px 2px #000000;*/ -moz-text-shadow: 0px 1px 2px #000000; -webkit-text-shadow: 0px 1px 2px #000000; -o-text-shadow: 0px 1px 2px #000000; text-shadow: 0px 1px 2px #000000; } div.notification-box .container { background: #FFFFFF; width: 296px; height: 241px; margin: auto; /*+placement:shift 3px 46px;*/ position: relative; left: 3px; top: 46px; /*+box-shadow:inset 0px 3px 7px #656565;*/ -moz-box-shadow: inset 0px 3px 7px #656565; -webkit-box-shadow: inset 0px 3px 7px #656565; -o-box-shadow: inset 0px 3px 7px #656565; box-shadow: inset 0px 3px 7px #656565; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border: 1px solid #8198AE; } div.notification-box .container ul { margin-top: 8px; height: 229px; overflow: auto; overflow-x: hidden; width: 294px; } div.notification-box .container ul li { width: 100%; height: 41px; border-bottom: 1px solid #CECECE; overflow-x: hidden; text-indent: 0; font-size: 12px; color: #4D5E6E; background: url(../images/icons.png) no-repeat 10px -213px; cursor: pointer; } div.notification-box .container ul li.error { height: 53px; background: url(../images/icons.png) no-repeat 10px -171px; } div.notification-box .container ul li.error .subtitle { display: block; width: 213px; height: 10px; overflow: hidden; white-space: nowrap; float: left; text-overflow: ellipsis; color: #808080; text-indent: 0; padding: 0; margin: 0; /*+placement:shift 48px 17px;*/ position: relative; left: 48px; top: 17px; } div.notification-box .container ul li span { float: left; /*+placement:shift 48px 15px;*/ position: relative; left: 48px; top: 15px; max-width: 202px; font-size: 14px; font-weight: 100; overflow: hidden; } div.notification-box .container ul li span:hover { color: #5FAAF7; text-decoration: underline; } div.notification-box .container ul div.remove { width: 17px; height: 21px; background: url(../images/buttons.png) no-repeat -623px -8px; float: right; margin: -4px 8px 0px 0px; cursor: pointer; /*+placement:shift 0px 16px;*/ position: relative; left: 0px; top: 16px; } div.notification-box .container ul div.remove:hover { background-position: -606px -8px; } div.notification-box .container ul li.pending { color: #7E96AC; background: url(../images/ajax-loader.gif) no-repeat 8px 6px; } div.notification-box .container ul li.first { border-top: none; } div.notification-box .container ul li.last { } div.notification-box .button { float: left; background: url(../images/buttons.png) no-repeat; cursor: pointer; /*+placement:shift 0px 51px;*/ position: relative; left: 0px; top: 51px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border-bottom: 1px solid #2B2B2B; /*+box-shadow:0px 0px 2px #272727;*/ -moz-box-shadow: 0px 0px 2px #272727; -webkit-box-shadow: 0px 0px 2px #272727; -o-box-shadow: 0px 0px 2px #272727; box-shadow: 0px 0px 2px #272727; padding: 5px 10px 6px; } div.notification-box .button span { color: #FFFFFF; font-size: 11px; font-weight: bold; letter-spacing: 1px; /*+text-shadow:0px -1px 2px #171717;*/ -moz-text-shadow: 0px -1px 2px #171717; -webkit-text-shadow: 0px -1px 2px #171717; -o-text-shadow: 0px -1px 2px #171717; text-shadow: 0px -1px 2px #171717; } div.notification-box .button.clear-list { background: url(../images/gradients.png) 0px -10px; margin-left: 16px; } div.notification-box .button.clear-list:hover { background-position: 0px -51px; } div.notification-box .button.close { background: url(../images/gradients.png) 0px -317px; float: right; margin-right: 10px; border-bottom: 1px solid #232323; } div.notification-box .button.close:hover { background-position: -4px -368px; } /*** Corner alert*/ div.notification.corner-alert { background: #FFFFFF; background: rgba(255, 255, 255, 0.95); /*+box-shadow:0px 2px 10px #000000;*/ -moz-box-shadow: 0px 2px 10px #000000; -webkit-box-shadow: 0px 2px 10px #000000; -o-box-shadow: 0px 2px 10px #000000; box-shadow: 0px 2px 10px #000000; width: 300px; height: 75px; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; position: absolute; text-indent: 10px; padding: 7px 7px 0; font-size: 12px; /*+opacity:70%;*/ filter: alpha(opacity=70); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); -moz-opacity: 0.7; opacity: 0.7; z-index: 100; margin: 38px 0 0 -56px; } div.notification.corner-alert .top-arrow { background: url(../images/sprites.png) no-repeat -580px -1353px; width: 36px; height: 15px; position: absolute; top: -15px; left: 50px; } div.notification.corner-alert div.title { width: 100%; height: 33px; color: #FFFFFF; } div.notification.corner-alert div.title span { /*+placement:shift 0px 10px;*/ position: relative; left: 0px; top: 10px; color: #6D6D6D; padding: 3px 0 12px 24px; font-weight: 100; font-size: 14px; padding-left: 33px; background: url(../images/icons.png) no-repeat 3px -223px; } div.notification.corner-alert.error div.title span { background: url(../images/icons.png) no-repeat -2px -190px; } div.notification.corner-alert div.message span { position: relative; padding-top: 6px; font-size: 14px; display: block; color: #000000; /*+placement:shift 17px -2px;*/ position: relative; left: 17px; top: -2px; } /*Tooltips*/ .tooltip { } .tooltip-info { width: 239px; min-height: 83px; display: inline-block; background: #FFFFFF; border: 1px solid #BEB8B8; position: absolute; z-index: 1000; /*+border-radius:22px;*/ -moz-border-radius: 22px; -webkit-border-radius: 22px; -khtml-border-radius: 22px; border-radius: 22px; border-radius: 22px 22px 22px 22px; } .tooltip-info .arrow { width: 27px; height: 47px; position: absolute; top: 17px; left: -18px; background: url(../images/sprites.png) -583px -939px; } .tooltip-info .title { color: #485766; margin: 12px; font-size: 19px; } .tooltip-info .content { width: 182px; font-size: 11px; line-height: 19px; padding-bottom: 13px; overflow: auto; overflow-x: hidden; margin: auto; } /*List view*/ div.panel div.list-view { overflow: auto; overflow-x: hidden; height: 632px; margin-top: 30px; } .detail-view div.list-view { width: 730px; border: 1px solid #DAD4D4; margin: 41px auto auto !important; height: 536px !important; background: #F7F7F7; } div.panel div.list-view div.data-table table { width: 755px; margin-top: 44px; } .detail-view div.list-view div.data-table table { width: 703px !important; } .detail-view div.list-view div.data-table table td { border-left: 1px solid #CACACA; } div.panel div.list-view div.fixed-header { position: absolute; top: 29px; left: 12px; width: 760px; height: 47px; display: table; background-color: #F7F7F7; margin: 0; z-index: 1; } .detail-view div.list-view div.fixed-header { width: 703px !important; top: 49px !important; left: 32px !important; background: #FFFFFF; } .detail-view div.list-view div.fixed-header table { width: 100% !important; } .project-view div.panel div.list-view div.fixed-header { background: #6D747D; } div.panel div.list-view div.fixed-header table { margin: 0; /*+placement:shift 0px 18px;*/ position: relative; left: 0px; top: 18px; width: 755px; /*+box-shadow:0px 4px 10px #DFE1E3;*/ -moz-box-shadow: 0px 4px 10px #DFE1E3; -webkit-box-shadow: 0px 4px 10px #DFE1E3; -o-box-shadow: 0px 4px 10px #DFE1E3; box-shadow: 0px 4px 10px #DFE1E3; } .project-view div.panel div.list-view div.fixed-header table { /*+box-shadow:0px 2px 2px #CACDD1;*/ -moz-box-shadow: 0px 2px 2px #CACDD1; -webkit-box-shadow: 0px 2px 2px #CACDD1; -o-box-shadow: 0px 2px 2px #CACDD1; box-shadow: 0px 2px 2px #CACDD1; } div.list-view td.state { width: 120px; min-width: 120px; max-width: 120px; } div.list-view td.first { cursor: pointer; } div.list-view td.first:hover { color: #3A82CD; } div.list-view td.state span { padding: 1px 0 0 18px; text-align: center; width: 80px; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; background: url(../images/sprites.png) 1px -536px; } div.list-view td.state.on span { background-image: url(../images/sprites.png); background-repeat: no-repeat; color: #008000; background-position: 1px -460px; } div.list-view td.state.off span { background-image: url(../images/sprites.png); background-repeat: no-repeat; color: #B90606; background-position: 1px -496px; } /** Quick view tooltip*/ .quick-view-tooltip { width: 470px; display: inline-block; padding-top: 50px; margin-left: 8px; } .quick-view-tooltip > div.title { width: 444px; position: absolute; top: 71px; left: 10px; color: #808080; font-weight: 100; } .quick-view-tooltip > div.title .icon { position: relative; top: -2px; left: -7px; background: url(../images/sprites.png) no-repeat -42px -67px; float: right; padding: 0px 13px 0 0px; } .quick-view-tooltip .loading-overlay { top: 94px; height: 57px; left: 1px; /*+opacity:35%;*/ filter: alpha(opacity=35); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=35); -moz-opacity: 0.35; opacity: 0.35; } .quick-view-tooltip > div.title span.title { } .quick-view-tooltip .container { border: 1px solid #9EA2A5; background: #FFFFFF; width: 471px; min-height: 100px; height: auto; overflow: hidden; display: inline-block; /*+box-shadow:0px 7px 9px #676F76;*/ -moz-box-shadow: 0px 7px 9px #676F76; -webkit-box-shadow: 0px 7px 9px #676F76; -o-box-shadow: 0px 7px 9px #676F76; box-shadow: 0px 7px 9px #676F76; } /*** Quick view detail view*/ .quick-view-tooltip .detail-view { } .quick-view-tooltip .detail-view .main-groups { width: 456px; height: 170px; position: absolute; padding-top: 7px; top: 55px; border: 1px solid #808080; border-left: none; border-right: none; overflow: hidden; /*+box-shadow:0px 1px #E6E6E6;*/ -moz-box-shadow: 0px 1px #E6E6E6; -webkit-box-shadow: 0px 1px #E6E6E6; -o-box-shadow: 0px 1px #E6E6E6; box-shadow: 0px 1px #E6E6E6; } .quick-view-tooltip .detail-view .actions { } .quick-view-tooltip .detail-view .tagger { display: none; } .quick-view-tooltip .detail-view ul { display: none !important; } .quick-view-tooltip .detail-view .ui-tabs-panel { display: inline-block; width: 100% !important; float: left; height: auto; overflow: hidden; } .quick-view-tooltip .detail-view .details { display: inline-block; height: auto; padding-bottom: 224px; } .quick-view-tooltip .detail-view .detail-group { width: 365px; margin: 0; padding: 0; left: -9px; background: none; border: none; } .quick-view-tooltip .detail-view .detail-group table { margin: 0; border: none; background: none; } .quick-view-tooltip .detail-view .detail-group table tr { background: none; } .quick-view-tooltip .detail-view .detail-group table td.name { color: #000000 !important; padding: 0px 29px 0px 5px !important; font-size: 13px; } .quick-view-tooltip .detail-view .detail-group table td.value { font-size: 12px; /*+text-shadow:0px 1px #EAEAEA;*/ -moz-text-shadow: 0px 1px #EAEAEA; -webkit-text-shadow: 0px 1px #EAEAEA; -o-text-shadow: 0px 1px #EAEAEA; text-shadow: 0px 1px #EAEAEA; overflow: hidden; } .quick-view-tooltip .detail-view .detail-group table td.value input[type=text] { width: 258px; height: 10px; margin-left: 0px; } .quick-view-tooltip .detail-view .detail-group .main-groups table td.value span { height: 25px; top: 7px; } .quick-view-tooltip .detail-view .detail-group.actions { position: relative; top: 202px; float: left; width: 100%; height: auto; } .quick-view-tooltip .detail-view .detail-group.actions .button { top: 160px; } .quick-view-tooltip .detail-view .detail-group.actions .action.text { width: 112px; height: 41px; background: none; border: none; float: left; margin-left: 5px; display: inline-block; } .quick-view-tooltip .detail-view .detail-group.actions .action.text:hover { /*+box-shadow:none;*/ -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .quick-view-tooltip .detail-view .detail-group.actions .action.text .icon { display: block; float: left; width: 4px; } .quick-view-tooltip .detail-view .detail-group.actions .action.text .label { width: 81px; display: block; float: right; font-size: 11px; color: #454C53; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; text-indent: 0px; } .quick-view-tooltip .detail-view .detail-group.actions .action.text:hover .label { color: #000000; } .quick-view-tooltip .detail-view .detail-group.actions .detail-actions { width: 460px; height: auto; background: none; vertical-align: top; position: relative; top: 27px; float: left; } .quick-view-tooltip .detail-view .detail-group.actions td.view-all { position: relative; left: 0px; top: 26px; float: left; height: 26px; /*+box-shadow:inset 0px 1px #FFFFFF;*/ -moz-box-shadow: inset 0px 1px #FFFFFF; -webkit-box-shadow: inset 0px 1px #FFFFFF; -o-box-shadow: inset 0px 1px #FFFFFF; box-shadow: inset 0px 1px #FFFFFF; } .quick-view-tooltip .detail-view .detail-actions a { background: none; width: 30px; } /*Details page*/ .detail-view { padding: 0 0 0 14px; } .ui-tabs ul.ui-tabs-nav { margin-top: 42px; display: block; width: 100%; height: 41px; float: left; border: none; overflow: hidden; z-index: 2; /*+placement:shift 0px 2px;*/ position: relative; left: 0px; top: 2px; } .ui-tabs .info { background: #EFEFEF; width: 91%; height: auto; overflow: visible; padding: 14px 14px 0; border: 1px dashed #D7D7D7; /*+box-shadow:inset 0px 1px 2px #FFFFFF;*/ -moz-box-shadow: inset 0px 1px 2px #FFFFFF; -webkit-box-shadow: inset 0px 1px 2px #FFFFFF; -o-box-shadow: inset 0px 1px 2px #FFFFFF; box-shadow: inset 0px 1px 2px #FFFFFF; margin: 10px; display: inline-block; } .ui-tabs .info li { font-size: 12px; color: #3E4C59; margin: 0 0 18px; } .ui-tabs .info li strong { font-weight: bold; color: #506273; } .ui-tabs ul.ui-tabs-subnav li { display: block; float: left; } .ui-tabs li a { float: left; padding: 15px 10px; min-width: 91px; text-align: center; font-size: 11px; margin-right: 5px; color: #4E6070; text-decoration: none; /*+placement:shift 0px 2px;*/ position: relative; left: 0px; top: 2px; } .ui-tabs li { float: left; } .ui-tabs ul li.ui-state-default a { padding-bottom: 10px; border: 1px solid #D9D9D9; /*+border-radius:4px 4px 0 0;*/ -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; -khtml-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; background: #F0F0F0; } .project-view .ui-tabs ul li.ui-state-default a { background: #6D747D; /*+box-shadow:inset -1px -2px 12px #596066;*/ -moz-box-shadow: inset -1px -2px 12px #596066; -webkit-box-shadow: inset -1px -2px 12px #596066; -o-box-shadow: inset -1px -2px 12px #596066; box-shadow: inset -1px -2px 12px #596066; color: #FFFFFF; font-weight: bold; /*+text-shadow:0px -1px 1px #3A3E42;*/ -moz-text-shadow: 0px -1px 1px #3A3E42; -webkit-text-shadow: 0px -1px 1px #3A3E42; -o-text-shadow: 0px -1px 1px #3A3E42; text-shadow: 0px -1px 1px #3A3E42; } .ui-tabs ul li.ui-state-hover a { text-decoration: underline; color: #000000; } .ui-tabs ul li.ui-state-active { display: block; } .ui-tabs ul li.ui-state-active a { background: #FFFFFF; padding-bottom: 12px; } .project-view .ui-tabs ul li.ui-state-hover a { background: #878E97 0px 8px; } .project-view .ui-tabs ul li.ui-state-active a { background: #DBDDDF; color: #4F6270; font-weight: bold; /*+text-shadow:0px 0px #FFFFFF;*/ -moz-text-shadow: 0px 0px #FFFFFF; -webkit-text-shadow: 0px 0px #FFFFFF; -o-text-shadow: 0px 0px #FFFFFF; text-shadow: 0px 0px #FFFFFF; /*+box-shadow:0px 0px;*/ -moz-box-shadow: 0px 0px; -webkit-box-shadow: 0px 0px; -o-box-shadow: 0px 0px; box-shadow: 0px 0px; -moz-box-shadow: 0px 0px none; -webkit-box-shadow: 0px 0px none; -o-box-shadow: 0px 0px none; } .ui-tabs li.ui-state-active.first a, .ui-tabs li.ui-state-default.first a { /*+border-radius:4px 4px 0 0;*/ -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; -khtml-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; border: 1px solid #E2DDDD; border: 1px solid #E2DDDD; } .ui-tabs li.ui-state-active.last a, .ui-tabs li.ui-state-default.last a { } .ui-tabs li.ui-state-active.first.last a, .ui-tabs li.ui-state-default.first.last a { /*+border-radius:4px 4px 0 0;*/ -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; -khtml-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; } .ui-tabs .ui-tabs-hide { display: none !important; } .ui-tabs div.ui-tabs-panel { border: 1px solid #D9D9D9; clear: both; height: 78%; width: 97%; padding-top: 7px; overflow: auto; overflow-x: hidden; height: 591px; margin: -5px 0 0; } .detail-view .main-groups { max-height: 407px; overflow: auto; overflow-x: hidden; width: 100%; /*[empty]padding:;*/ margin-right: 12px; } .detail-view.edit-mode .main-groups { max-height: 360px; } .detail-group table { width: 96%; font-size: 12px; border-bottom: 1px solid #DFDFDF; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#eaeaea',GradientType=0 ); margin-top: 10px; } .detail-group table tr, .detail-group table td { vertical-align: middle; border: none; cursor: default; } .detail-group table tr.odd { background: none; } .details.group-multiple table { border: none; border-top: none; } .details.group-multiple table.header { width: 94%; margin-bottom: 1px; } .details.group-multiple table tbody { border-top: 1px solid #F2F0F0; } .detail-group .main-groups table td.name { width: 113px; color: #6D6D6D; font-weight: bold; padding: 14px 12px 13px 13px; border: none; text-indent: 0; } .detail-group .main-groups table td.value { text-indent: 0; } .detail-group .main-groups table td.value > span { display: block; height: 30px; overflow: auto; position: relative; top: 9px; float: left; width: 245px; } .detail-group .main-groups table td.value > span.copypasteenabledvalue { text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .detail-group .main-groups table td.value > .copypasteactive { display: auto; white-space: nowrap; overflow: none; } div.copypasteicon { background: url("../images/sprites.png") no-repeat scroll -271px -65px; float: left; height: 21px; margin-left: 6px; margin-top: 0px; width: 18px; } div.copypasteicon:hover { background: url("../images/sprites.png") no-repeat scroll -271px -646px; } .detail-group .main-groups table td.value > span.copypasteenabledvalue { text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .detail-group .main-groups table td.value > .copypasteactive { display: auto; white-space: nowrap; overflow: none; } div.copypasteicon { background: url("../images/sprites.png") no-repeat scroll -271px -65px; float: left; height: 21px; margin-left: 6px; margin-top: 0px; width: 18px; } div.copypasteicon:hover { background: url("../images/sprites.png") no-repeat scroll -271px -646px; } .detail-group .main-groups table td.value > span select { width: 100% !important; } .detail-group .main-groups table td.value .view-all { cursor: pointer; /*[empty]height:;*/ /*+border-radius:4px 0 0 4px;*/ -moz-border-radius: 4px 0 0 4px; -webkit-border-radius: 4px 0 0 4px; -khtml-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; float: right; margin: 7px 0 0; padding: 0px; } .detail-group .main-groups table td.value .view-all span { display: block; float: left; padding: 5px 2px 8px 4px; background: url(../images/gradients.png) repeat-x 0px -529px; border-left: 1px solid #9FA2A6; /*+border-radius:4px 0 0 4px;*/ -moz-border-radius: 4px 0 0 4px; -webkit-border-radius: 4px 0 0 4px; -khtml-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; margin-top: -5px; } .detail-group .main-groups table td.value .view-all .end { background: url(../images/sprites.png) no-repeat 100% -397px; float: right; width: 22px; height: 25px; padding: 0px; margin: -6px 0px 0px; } .detail-group .main-groups table td.value .view-all:hover { background-position: 100% -431px; } .detail-group .main-groups table td.value .view-all:hover span { background-position: 0px -566px; } .detail-group .main-groups table td.value .view-all:hover div.end { background-position: -618px -430px; } .detail-view .detail-group .button.add { clear: both; margin: 0px 21px 13px 0 !important; } .detail-view .details.group-multiple { float: left; width: 100%; margin-bottom: 30px; } .detail-view .details.group-multiple .main-groups { overflow: visible; width: 98%; margin-bottom: 35px; } /*List-view: subselect dropdown*/ .list-view .subselect { width: 116px; display: block; float: left; background: url(../images/bg-gradients.png) 0px -42px; padding: 0; margin: 8px 0 1px 7px; clear: both; border: 1px solid #A8A7A7; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .list-view .subselect span { margin: 4px 0 0 12px; } .list-view .subselect select { width: 85%; margin: 5px 0 4px; font-size: 10px; } .detail-group .main-groups table td.value .view-all:hover { background-position: 100% -431px; } .panel.always-maximized .detail-group .main-groups table td.value span { width: 565px; } .detail-group.head table td.name { padding: 20px 0px 17px; } .detail-view .button.done, .detail-view .button.cancel { display: inline-block; color: #FFFFFF; font-size: 12px; font-weight: bold; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; /*+text-shadow:0px -1px 2px #000000;*/ -moz-text-shadow: 0px -1px 2px #000000; -webkit-text-shadow: 0px -1px 2px #000000; -o-text-shadow: 0px -1px 2px #000000; text-shadow: 0px -1px 2px #000000; /*+box-shadow:0px 1px 4px #ADADAD;*/ -moz-box-shadow: 0px 1px 4px #ADADAD; -webkit-box-shadow: 0px 1px 4px #ADADAD; -o-box-shadow: 0px 1px 4px #ADADAD; box-shadow: 0px 1px 4px #ADADAD; cursor: pointer; margin: 0 0 0 12px; padding: 9px 20px; background: url(../images/bg-gradients.png) 0px -221px; /*+placement:shift -1px 550px;*/ position: relative; left: -1px; top: 550px; position: absolute; } .detail-view .button.cancel { background-position: 0px -795px; left: 85px; color: #808080; /*+text-shadow:0px -1px 2px #000000;*/ -moz-text-shadow: 0px -1px 2px #000000; -webkit-text-shadow: 0px -1px 2px #000000; -o-text-shadow: 0px -1px 2px #000000; text-shadow: 0px -1px 2px #000000; -moz-text-shadow: 0px -1px 2px #CCCCCC; -webkit-text-shadow: 0px -1px 2px #CCCCCC; -o-text-shadow: 0px -1px 2px #CCCCCC; text-shadow: 0px -1px 2px #CCCCCC; } .detail-view .button.done:hover { background-position: 0px -950px; /*+box-shadow:inset 0px 1px 3px #000000;*/ -moz-box-shadow: inset 0px 1px 3px #000000; -webkit-box-shadow: inset 0px 1px 3px #000000; -o-box-shadow: inset 0px 1px 3px #000000; box-shadow: inset 0px 1px 3px #000000; } .detail-view .button.cancel:hover { background-position: 0px -834px; } div.group-multiple div.detail-group table { margin-top: -1px; } div.group-multiple div.detail-group table.header { border: none; margin-top: 11px; } div.group-multiple div.detail-group table.header thead th { background: transparent; border: none; } div.ui-tabs-panel table span.none { color: #9D9D9D; } #user div.options .arrow { } div.detail-group td.view-all div.view-all { width: auto; float: right; } div.detail-group td.view-all a { font-size: 13px; display: block; text-decoration: none; color: #0373B7; /*+text-shadow:0px 1px 2px #FFFFFF;*/ -moz-text-shadow: 0px 1px 2px #FFFFFF; -webkit-text-shadow: 0px 1px 2px #FFFFFF; -o-text-shadow: 0px 1px 2px #FFFFFF; text-shadow: 0px 1px 2px #FFFFFF; float: left; font-weight: 100; } div.detail-group td.view-all:hover a { background-position: 0px -566px; } div.detail-group td.view-all a span { /*+placement:shift -4px -1px;*/ position: relative; left: -4px; top: -1px; } div.detail-group td.view-all:hover a span { text-decoration: underline; color: #000000; } div.detail-group td.view-all div.view-all div.end { display: none; float: left; width: 15px; height: 25px; background: url(../images/sprites.png) -617px -398px; } div.detail-group td.view-all:hover div.view-all div.end { background-position: -617px -431px; } div.details div.detail-group td.value input, div.details div.detail-group td.value select { width: 282px; } div.details div.detail-group td.value input, div.details div.detail-group td.value input[type=checkbox] { float: left; width: 15px; margin-left: 10px; } div.details div.detail-group td.value input, div.details div.detail-group td.value input[type=text] { width: 93%; } div.details .main-groups label.error { position: absolute; right: 10%; top: 6px; } .detail-view td.view-all.multiple { max-width: 145px; display: block; float: left; height: 28px; margin-left: 0; text-align: left; } /*** Actions*/ div.detail-group.actions { padding: 0; margin: 0; } div.detail-group.actions table { padding: 0; } div.detail-group.actions tr { margin: 0; } div.detail-group.actions td { height: 50px; vertical-align: middle; } .details.group-multiple div.detail-group.actions { float: right; max-width: 75%; height: 23px; position: relative; margin: -15px 0 -5px; } .details.group-multiple div.detail-group.actions table { background: none; } .details.group-multiple div.detail-group.actions td.detail-actions { background: none; display: block; height: 35px; float: right; padding: 0; } .details.group-multiple div.detail-group.actions .detail-actions .action { float: left; width: 32px; /*+placement:shift 11px 7px;*/ position: relative; left: 11px; top: 7px; } .details.group-multiple div.detail-group.actions .detail-actions .action a { background: none; width: 31px; } .detail-group table td.detail-actions { height: 26px; } .detail-group table td.detail-actions.full-length { display: block; width: 99%; float: left; } .detail-group table td.detail-actions .action.text { padding: 0px 6px 0px 0px; cursor: pointer; display: inline-block; float: right; margin-right: 8px; border: 1px solid #C2C2C2; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; background: url(../images/bg-gradients.png) repeat-x 0px -83px; } .detail-group table td.detail-actions .action.text .label { font-size: 12px; /*+placement:shift -1px 8px;*/ position: relative; left: -1px; top: 8px; } .detail-group table td.detail-actions .action.text:hover { /*+box-shadow:inset 0px 1px 3px #171717;*/ -moz-box-shadow: inset 0px 1px 3px #171717; -webkit-box-shadow: inset 0px 1px 3px #171717; -o-box-shadow: inset 0px 1px 3px #171717; box-shadow: inset 0px 1px 3px #171717; } .detail-group table td.detail-actions div.buttons { } .detail-group table td.detail-actions a { display: block; float: left; text-indent: -9999px; width: 30px; height: 25px; margin: 0; } .detail-group table td.detail-actions a:hover { background-position: -417px -43px; } .detail-group table td.detail-actions div.action.first a { background-position: -385px -11px; width: 32px; } .detail-group table td.detail-actions div.action.first a:hover { background-position: -385px -43px; } .detail-group table td.detail-actions div.action.last a { background-position: -596px -11px; width: 30px; } .detail-group table td.detail-actions div.action.last a:hover { background-position: -596px -43px; } .detail-group table td.detail-actions div.action.single a { width: 31px; height: 26px; background-position: -414px -625px; } .detail-group table td.detail-actions div.action.text a { background: none; } .detail-group table td.detail-actions div.action.single a:hover { background-position: -414px -587px; } .detail-group table td.detail-actions a span.icon { background-image: url(../images/sprites.png); padding: 10px; display: block; } /*Header*/ #header { width: 100%; height: 135px; background: url(../images/overlay-pattern.png) repeat 0, #1B5070 url(../images/header-gradient.png) no-repeat center; background-size: auto, cover; position: relative; } #header div.button { font-size: 12px; color: #FFFFFF; cursor: pointer; } #header.nologo div.logo { width: 1024px; height: 47px; margin: auto; background: url(../images/logo.png) no-repeat 0 center; /*+placement:shift 0px 15px;*/ position: relative; left: 0px; top: 15px; } #header div.controls { width: 1026px; height: 48px; position: relative; margin: 27px auto 0; padding-top: 13px; /*+border-radius:4px 4px 0 0;*/ -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; -khtml-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; } #header div.controls.nologo { background: #666666; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzZDNkM2QiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #666666 0%, #3d3d3d 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#666666), color-stop(100%,#3d3d3d)); background: -webkit-linear-gradient(top, #666666 0%,#3d3d3d 100%); background: -o-linear-gradient(top, #666666 0%,#3d3d3d 100%); background: -ms-linear-gradient(top, #666666 0%,#3d3d3d 100%); background: linear-gradient(to bottom, #666666 0%,#3d3d3d 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#3d3d3d',GradientType=0 ); /*+box-shadow:0px -1px 6px #0E3955;*/ -moz-box-shadow: 0px -1px 6px #0E3955; -webkit-box-shadow: 0px -1px 6px #0E3955; -o-box-shadow: 0px -1px 6px #0E3955; box-shadow: 0px -1px 6px #0E3955; } .button { float: left; background: url(../images/buttons.png) no-repeat; cursor: pointer; } #header div.notifications { background: transparent; float: right; height: 18px; padding: 1px 0 0; /*+placement:shift -174px -57px;*/ position: relative; left: -174px; top: -57px; } #header div.notifications:after { content: "|"; /*+placement:shift 28px 7px;*/ position: relative; left: 28px; top: 7px; } #header div.notifications span { position: relative; top: 5px; left: 7px; /*+text-shadow:0px -1px 1px #464646;*/ -moz-text-shadow: 0px -1px 1px #464646; -webkit-text-shadow: 0px -1px 1px #464646; -o-text-shadow: 0px -1px 1px #464646; text-shadow: 0px -1px 1px #464646; } #header div.notifications:hover { color: #5FAAF7; } #header div.notifications div.total { width: 22px; height: 19px; float: left; margin: 3px; background: url(../images/sprites.png) no-repeat -593px -870px; color: #FFFFFF; font-size: 11px; /*+text-shadow:0px -1px #6C7283;*/ -moz-text-shadow: 0px -1px #6C7283; -webkit-text-shadow: 0px -1px #6C7283; -o-text-shadow: 0px -1px #6C7283; text-shadow: 0px -1px #6C7283; -moz-text-shadow: 0px -1px 0px #6C7283; -webkit-text-shadow: 0px -1px 0px #6C7283; -o-text-shadow: 0px -1px 0px #6C7283; } #header div.notifications div.total.pending { background-position: -593px -846px; font-weight: bold; } #header div.notifications div.total span { /*+placement:shift 0px 3px;*/ position: relative; left: 0px; top: 3px; text-align: center; display: block; width: 21px; font-size: 12px; } #user { height: 30px; margin: 0; position: absolute; top: -47px; left: 890px; cursor: default !important; display: inline-block; float: left; background: transparent; } #user div.name { display: inline-block; float: left; padding: 9px 18px 7px 12px; border-right: none; /*[empty]border-top:;*/ min-width: 75px; max-width: 120px; text-align: center; height: 12px; overflow: hidden; /*+text-shadow:0px -1px 1px #464646;*/ -moz-text-shadow: 0px -1px 1px #464646; -webkit-text-shadow: 0px -1px 1px #464646; -o-text-shadow: 0px -1px 1px #464646; text-shadow: 0px -1px 1px #464646; margin: 0; } #user div.options { float: left; width: 31px; height: 28px; /*+placement:shift 0px 0px;*/ position: relative; left: 0px; top: 0px; background-position: 0px -867px; cursor: pointer; } #user div.options:hover { } #user div.options .arrow { width: 11px; height: 8px; background: url(../images/buttons.png) -402px -23px; /*+placement:shift 8px 11px;*/ position: relative; left: 8px; top: 11px; } /** Zone filter (mixed zone management)*/ #header .zone-filter { float: left; width: 111px; margin: 9px 20px 0 2px; } #header .zone-filter label { position: absolute; top: -3px; color: #FFFFFF; font-size: 11px; } #header .zone-filter select { width: 100%; font-size: 12px; border: 1px solid #000000; border-bottom: #FFFFFF; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; background: #ECECEC; margin-top: 2px; } /*Navigation*/ #navigation, #browser { } #navigation { width: 230px; position: relative; float: left; /*+box-shadow:inset -1px 4px 7px #DDDDDD;*/ -moz-box-shadow: inset -1px 4px 7px #DDDDDD; -webkit-box-shadow: inset -1px 4px 7px #DDDDDD; -o-box-shadow: inset -1px 4px 7px #DDDDDD; box-shadow: inset -1px 4px 7px #DDDDDD; background: #EDE8E8; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjYlIiBzdG9wLWNvbG9yPSIjZWRlOGU4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==); background: -moz-linear-gradient(top, #ffffff 0%, #ede8e8 6%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(6%,#ede8e8)); background: -webkit-linear-gradient(top, #ffffff 0%,#ede8e8 6%); background: -o-linear-gradient(top, #ffffff 0%,#ede8e8 6%); background: -ms-linear-gradient(top, #ffffff 0%,#ede8e8 6%); background: linear-gradient(to bottom, #ffffff 0%,#ede8e8 6%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ede8e8',GradientType=0 ); } .project-view #navigation { background: #6D747D; } #navigation ul { height: 700px; padding-top: 29px; } .project-view #navigation ul { border-right: 1px solid #464C53; background: #6D747D; } #navigation ul li { height: 42px; cursor: pointer; border-bottom: 1px solid #D2D2D2; } .project-view #navigation ul li { background-image: url(../images/bg-nav-item-project-view.png); background-position: 0px 0px; border: none; } .project-view #navigation ul li span { color: #FFFFFF; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } #navigation ul li:hover, #navigation ul li.active { width: 230px; background: #2C5D7B; /*+box-shadow:inset 0px 0px 7px #000000;*/ -moz-box-shadow: inset 0px 0px 7px #000000; -webkit-box-shadow: inset 0px 0px 7px #000000; -o-box-shadow: inset 0px 0px 7px #000000; box-shadow: inset 0px 0px 7px #000000; } #navigation ul li.disabled { /*+opacity:60%;*/ filter: alpha(opacity=60); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); -moz-opacity: 0.6; opacity: 0.6; } .project-view #navigation ul li:hover, .project-view #navigation ul li.active { background: url(../images/bg-nav-item-active-project-view.png); background-position: 0px 0px; width: 230px; } .project-view #navigation ul li.disabled:hover { background: #D5D5D5; color: #596D7F; cursor: default; } #navigation ul li:hover span, #navigation ul li.active span { color: #FFFFFF; /*+text-shadow:0px 1px #000000;*/ -moz-text-shadow: 0px 1px #000000; -webkit-text-shadow: 0px 1px #000000; -o-text-shadow: 0px 1px #000000; text-shadow: 0px 1px #000000; } #navigation ul li.disabled:hover { cursor: not-allowed !important; } #navigation ul li.disabled:hover span { color: #596D7F; /*+text-shadow:0px 0px;*/ -moz-text-shadow: 0px 0px; -webkit-text-shadow: 0px 0px; -o-text-shadow: 0px 0px; text-shadow: 0px 0px; -moz-text-shadow: 0px 0px none; -webkit-text-shadow: 0px 0px none; -o-text-shadow: 0px 0px none; -moz-text-shadow: none; -webkit-text-shadow: none; -o-text-shadow: none; } #navigation ul li.last { background-repeat: repeat; background-position: 0px 0px; /*[empty]color:;*/ } #navigation ul li span { /*+placement:shift 14px 13px;*/ position: relative; left: 14px; top: 13px; font-size: 12px; color: #515151; padding-left: 19px; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; } #navigation ul li span.icon { background: url(../images/icons.png) no-repeat 0px 0px; padding: 16px 16px 13px; /*+placement:shift 17px 10px;*/ position: relative; left: 17px; top: 10px; } #navigation ul li.custom-icon span.icon { display: block; width: 50px; height: 50px; position: relative; float: left; margin-right: -47px; background: none; } #navigation ul li.custom-icon span.icon img { width: 50px; height: 50px; float: left; /*+placement:shift -6px -17px;*/ position: relative; left: -6px; top: -17px; position: absolute; margin-right: -14px; } /*Navigation icons*/ #navigation ul li.dashboard span.icon, #navigation ul li.dashboard-user span.icon { background-position: -14px -18px; } #navigation ul li.dashboard:hover span.icon, #navigation ul li.dashboard-user:hover span.icon span.icon, #navigation ul li.dashboard.active span.icon, #navigation ul li.dashboard-user.active span.icon span.icon { background-position: -23px -687px; } #navigation ul li.instances span.icon { background-position: -73px -18px; } #navigation ul li.instances.active span.icon, #navigation ul li.instances:hover span.icon { background-position: -82px -686px; } #navigation ul li.affinityGroups span.icon { background-position: -73px -87px; } #navigation ul li.affinityGroups.active span.icon, #navigation ul li.affinityGroups:hover span.icon { background-position: -82px -755px; } #navigation ul li.storage span.icon { background-position: -127px -19px; } #navigation ul li.storage.active span.icon, #navigation ul li.storage:hover span.icon { background-position: -137px -687px; } #navigation ul li.network span.icon { background-position: -180px -20px; } #navigation ul li.network.active span.icon, #navigation ul li.network:hover span.icon { background-position: -189px -690px; } #navigation ul li.templates span.icon { background-position: -233px -21px; } #navigation ul li.templates.active span.icon, #navigation ul li.templates:hover span.icon { background-position: -242px -690px; } #navigation ul li.projects span.icon { background-position: -294px -21px; } #navigation ul li.projects.active span.icon, #navigation ul li.projects:hover span.icon { background-position: -303px -690px; } #navigation ul li.events span.icon { background-position: -351px -23px; } #navigation ul li.events.active span.icon, #navigation ul li.events:hover span.icon { background-position: -359px -692px; } #navigation ul li.configuration span.icon { background-position: -401px -21px; } #navigation ul li.configuration.active span.icon, #navigation ul li.configuration:hover span.icon { background-position: -410px -690px; } #navigation ul li.global-settings span.icon { background-image: url(../images/sprites.png); background-position: -143px -240px; } #navigation ul li.global-settings.active span.icon, #navigation ul li.global-settings:hover span.icon { background-image: url(../images/sprites.png); background-position: -366px -239px; } #navigation ul li.accounts span.icon { background-position: -458px -19px; } #navigation ul li.accounts.active span.icon, #navigation ul li.accounts:hover span.icon { background-position: -467px -688px; } #navigation ul li.system span.icon { background-position: -569px -24px; } #navigation ul li.system.active span.icon, #navigation ul li.system:hover span.icon { background-position: -578px -692px; } #navigation ul li.domains span.icon { background-position: -520px -21px; } #navigation ul li.domains.active span.icon, #navigation ul li.domains:hover span.icon { background-position: -529px -690px; } #navigation ul li.plugins span.icon { background: url(../images/sprites.png) no-repeat -140px -291px; } #navigation ul li.regions span.icon { background: url(../images/sprites.png) no-repeat -141px -379px; } #navigation ul li.regions.active span.icon, #navigation ul li.regions:hover span.icon { background: url(../images/sprites.png) no-repeat -365px -377px; } /*Browser*/ #browser { width: 794px; height: 100%; max-width: 794px; position: relative; float: left; overflow: hidden; } #browser.panel-highlight { overflow: visible; } #browser.panel-highlight .panel { } #browser div.panel { height: 100%; border-right: 1px solid #A5A5A5; overflow: visible; background-color: #F7F7F7; } #browser div.panel.panel-highlight-wrapper { display: inline-block; background: none; /*+border-radius:9px;*/ -moz-border-radius: 9px; -webkit-border-radius: 9px; -khtml-border-radius: 9px; border-radius: 9px; margin-top: 7px; /*+box-shadow:0px 0px 12px #000000;*/ -moz-box-shadow: 0px 0px 12px #000000; -webkit-box-shadow: 0px 0px 12px #000000; -o-box-shadow: 0px 0px 12px #000000; box-shadow: 0px 0px 12px #000000; border: 3px solid #FFFFFF; height: 542px; overflow: hidden; position: absolute; z-index: 10000; padding: 78px 0px 67px 51px; } #browser div.panel.panel-highlight-wrapper .panel { left: 20px !important; height: 631px; overflow: hidden; top: 3px; } .project-view #browser div.panel { background: #6D747D; } .ui-tabs div.ui-tabs-panel { position: relative; } .project-view .ui-tabs div.ui-tabs-panel { background: #DBDDDF; } #browser div.panel .shadow { width: 10px; height: 100%; top: 0px; left: -10px; position: absolute; background: url(../images/bg-panel-shadow.png) repeat-y 0px 0px; } #browser.panel-highlight { overflow: visible; } #browser.panel-highlight .panel.highlighted { /*+box-shadow:0px 10px 11px #5C5C5C;*/ -moz-box-shadow: 0px 10px 11px #5C5C5C; -webkit-box-shadow: 0px 10px 11px #5C5C5C; -o-box-shadow: 0px 10px 11px #5C5C5C; box-shadow: 0px 10px 11px #5C5C5C; border: 5px solid #FFFFFF; /*+border-radius:6px;*/ -moz-border-radius: 6px; -webkit-border-radius: 6px; -khtml-border-radius: 6px; border-radius: 6px; margin-top: 21px; } #browser.panel-highlight .panel > .shadow { display: none; } #browser .highlight-arrow { width: 24px; height: 19px; background: url(../images/sprites.png) -590px -1295px; position: absolute; top: -22px; left: 80px; } /*Toolbar*/ /*[clearfix]*/div.toolbar { width: 100%; height: 32px; /*+box-shadow:0px 1px 4px #CFCFCF;*/ -moz-box-shadow: 0px 1px 4px #CFCFCF; -webkit-box-shadow: 0px 1px 4px #CFCFCF; -o-box-shadow: 0px 1px 4px #CFCFCF; box-shadow: 0px 1px 4px #CFCFCF; /*+placement:shift 0px -1px;*/ position: relative; left: 0px; top: -1px; z-index: 6; position: absolute; top: 0px; background: #ECECEC 0px -6px; } .detail-view .ui-tabs-panel div.toolbar { width: 768px; background: transparent; border: none; margin-top: 8px; } .project-view div.toolbar { background: #808080 url(../images/bg-nav-item-active-project-view.png) 0px -210px; } div.toolbar div.filters { margin: 5px 0px 0 12px; } div.toolbar div.filters label { color: #3F3B3B; font-size: 12px; font-weight: 100; display: block; float: left; padding: 5px 11px 0 0; } .project-view div.toolbar div.filters label { color: #FFFFFF; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } div.toolbar div.filters select { width: 142px; border: 1px solid #808080; } div.toolbar div.text-search { float: right; position: relative; } div.toolbar div.text-search div.search-bar { float: left; width: 141px; height: 20px; margin: 5px 0 0 12px; background: #FFFFFF; border: 1px solid #8B7E7E; z-index: 4; position: relative; border-right: 1px solid #8B8989; /*+border-radius:4px 0 0 4px;*/ -moz-border-radius: 4px 0 0 4px; -webkit-border-radius: 4px 0 0 4px; -khtml-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; } div.toolbar div.text-search div.search-bar input { float: left; border: none; margin: 1px 0 0; width: 90%; height: 68%; } div.toolbar div.text-search div.search-bar div.filter { background: #FFFFFF; width: 74px; height: 15px; float: left; font-size: 12px; text-align: center; border-left: 1px solid #6D6D6D; margin: 2px 0 0px; padding: 1px; } div.toolbar div.button.search { background: url(../images/sprites.png) no-repeat -592px -328px; width: 33px; height: 22px; /*+placement:shift -10px 5px;*/ position: relative; left: -10px; top: 5px; z-index: 3; cursor: pointer; } div.toolbar div.button.search:hover { background-position: -592px -359px; } div.toolbar div.button.add, div.toolbar div.button.refresh, div.toolbar div.button.add, div.toolbar div.button.main-action, .toolbar div.button.header-action, .detail-group .button.add { /*+placement:shift 0px 5px;*/ position: relative; left: 0px; top: 5px; background: #EAEAEA; font-size: 12px; font-weight: 100; color: #000000; margin: 0 14px 0 0; cursor: pointer; /*+text-shadow:0px 1px 1px #DEE5EA;*/ -moz-text-shadow: 0px 1px 1px #DEE5EA; -webkit-text-shadow: 0px 1px 1px #DEE5EA; -o-text-shadow: 0px 1px 1px #DEE5EA; text-shadow: 0px 1px 1px #DEE5EA; padding: 5px 7px 5px 6px; background: #F7F7F7; background: rgb(247, 247, 247); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2Y3ZjdmNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlYWVhZWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(247,247,247,1) 1%, rgba(234,234,234,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(247,247,247,1)), color-stop(100%,rgba(234,234,234,1))); background: -webkit-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); background: -o-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); background: -ms-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); background: linear-gradient(to bottom, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#eaeaea',GradientType=0 ); border: 1px solid #B7B7B7; float: right; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; height: 12px; } div.toolbar div.button.add:hover, div.toolbar div.button.refresh:hover, div.toolbar div.button.main-action:hover, .toolbar div.button.header-action:hover, .detail-group .button.add:hover { background: #E5E5E5; /*+box-shadow:inset 0px 0px 5px #C3C3C3;*/ -moz-box-shadow: inset 0px 0px 5px #C3C3C3; -webkit-box-shadow: inset 0px 0px 5px #C3C3C3; -o-box-shadow: inset 0px 0px 5px #C3C3C3; box-shadow: inset 0px 0px 5px #C3C3C3; } div.toolbar div.button.main-action span.icon { background-image: url(../images/sprites.png); display: block; cursor: pointer; width: 34px; height: 20px; float: left; /*+placement:shift 0px -7px;*/ position: relative; left: 0px; top: -7px; } div.toolbar div.button.refresh { float: right; margin: 0 15px 0 0; } div.toolbar div.button.refresh span { background-image: url(../images/icons.png); padding: 1px 1px 1px 16px; background-position: -629px -232px; background-repeat: no-repeat; } div.toolbar div.button.add span, .detail-group .button.add span.icon { padding: 0px 0 3px 18px; background: url(../images/icons.png) no-repeat -626px -209px; /*+placement:shift 0px 0px;*/ position: relative; left: 0px; top: 0px; } #browser div.panel.selected div.toolbar { border-right: 1px solid #43586B; } /*** Advanced search*/ #advanced_search { width: 15px; position: absolute; left: 139px; top: 4px; z-index: 4; background: none; } #advanced_search .icon { /*+opacity:56%;*/ filter: alpha(opacity=56); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=56); -moz-opacity: 0.56; opacity: 0.56; background: url(../images/sprites.png) no-repeat -62px -162px; padding: 10px; position: absolute; top: 1px; left: -1px; z-index: 10; } #advanced_search:hover .icon { /*+opacity:100%;*/ filter: alpha(opacity=100); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); -moz-opacity: 1; opacity: 1; } #advanced_search .form-container { /*+opacity:91%;*/ filter: alpha(opacity=91); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=91); -moz-opacity: 0.91; opacity: 0.91; /*+box-shadow:0px 5px 9px #B6B0B0;*/ -moz-box-shadow: 0px 5px 9px #B6B0B0; -webkit-box-shadow: 0px 5px 9px #B6B0B0; -o-box-shadow: 0px 5px 9px #B6B0B0; box-shadow: 0px 5px 9px #B6B0B0; border: 1px solid #808080; /*+border-radius:0 0 4px 4px;*/ -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; -khtml-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; left: -290px; top: 2px; position: absolute; display: inline-block; background: #FFFFFF; padding: 18px; cursor: default; } #advanced_search .form-container .name { width: 66px; float: left; } #advanced_search .form-container .value { width: 186px; float: left; } #advanced_search .form-container .form-item { width: 268px; height: 40px; margin-bottom: 15px; } #advanced_search .form-container .form-item input, #advanced_search .form-container .form-item select { width: 97%; padding: 3px; } #advanced_search input[type=submit] { float: right; background: url(../images/bg-gradients.png) 0px -220px; /*+box-shadow:0px 2px 5px #858585;*/ -moz-box-shadow: 0px 2px 5px #858585; -webkit-box-shadow: 0px 2px 5px #858585; -o-box-shadow: 0px 2px 5px #858585; box-shadow: 0px 2px 5px #858585; border: 1px solid #606060; border-top: none; color: #FFFFFF; font-size: 12px; font-weight: bold; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; cursor: pointer; padding: 8px 20px; } #advanced_search input[type=submit]:hover { /*+box-shadow:inset 0px 2px 3px #000000;*/ -moz-box-shadow: inset 0px 2px 3px #000000; -webkit-box-shadow: inset 0px 2px 3px #000000; -o-box-shadow: inset 0px 2px 3px #000000; box-shadow: inset 0px 2px 3px #000000; } #advanced_search .button.cancel { background: url(noen); color: #9A9A9A; font-size: 12px; float: right; /*+placement:shift -32px 13px;*/ position: relative; left: -32px; top: 13px; font-weight: bold; } #advanced_search .button.cancel:hover { color: #494949; } /*** Panel controls*/ #browser div.panel div.toolbar div.panel-controls { float: right; width: 42px; height: 23px; display: none; } #browser div.panel.reduced div.toolbar div.panel-controls { display: block; float: left; width: 194px; } #browser div.panel.maximized div.toolbar div.panel-controls { display: block; } #browser div.panel div.toolbar div.panel-controls div.control { width: 25px; height: 26px; background: url(../images/buttons.png) no-repeat -599px -335px; float: right; cursor: pointer; margin-right: 6px; } #browser div.panel.maximized.single div.toolbar div.panel-controls div.control { display: none; } #browser div.panel div.toolbar div.panel-controls div.control:hover { background-position: -593px -309px; } #browser div.panel.maximized div.toolbar div.panel-controls div.control { background-position: -621px -334px; } #browser div.panel.maximized div.toolbar div.panel-controls div.control:hover { background-position: -617px -308px; } /*** Section switcher*/ div.panel div.toolbar div.section-switcher { margin-top: 6px; margin-left: 10px; float: left; } #browser div.panel.maximize-if-selected.selected div.toolbar div.panel-controls div.control { display: none; } div.toolbar div.section-switcher div.section-select { float: right; font-size: 12px; font-weight: 100; } div.toolbar div.section-switcher div.section { float: left; font-size: 11px; font-weight: bold; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; /*+text-shadow:0px 1px 1px #EDEDED;*/ -moz-text-shadow: 0px 1px 1px #EDEDED; -webkit-text-shadow: 0px 1px 1px #EDEDED; -o-text-shadow: 0px 1px 1px #EDEDED; text-shadow: 0px 1px 1px #EDEDED; } div.toolbar div.section-switcher div.section a { background: url(../images/bg-section-switcher.png) repeat-x 0px -22px; text-decoration: none; display: block; color: #516374; padding: 5px 10px 3px; border: 1px solid #979FA4; } div.toolbar div.section-switcher div.section a.active { background: url(../images/bg-section-switcher.png) repeat-x 0px -21px; background-position: 0px 0px; border: none; border-bottom: 1px solid #CCD1D4; padding-bottom: 2px; padding-top: 6px; /*+box-shadow:inset 0px 1px 5px #546874;*/ -moz-box-shadow: inset 0px 1px 5px #546874; -webkit-box-shadow: inset 0px 1px 5px #546874; -o-box-shadow: inset 0px 1px 5px #546874; box-shadow: inset 0px 1px 5px #546874; } div.toolbar div.section-switcher div.section.first a { /*+border-radius:4px 0 0 5px;*/ -moz-border-radius: 4px 0 0 5px; -webkit-border-radius: 4px 0 0 5px; -khtml-border-radius: 4px 0 0 5px; border-radius: 4px 0 0 5px; } div.toolbar div.section-switcher div.section.last a { /*+border-radius:0 4px 4px 0px;*/ -moz-border-radius: 0 4px 4px 0px; -webkit-border-radius: 0 4px 4px 0px; -khtml-border-radius: 0 4px 4px 0px; border-radius: 0 4px 4px 0px; } div.toolbar div.section-switcher div.section.first.last a { /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; border-radius: 5px 5px 5px 5px; } div.toolbar div.section-switcher div.section-select { float: left; height: 26px; } .project-view div.toolbar div.section-switcher div.section-select { background: transparent; } div.toolbar div.section-switcher div.section-select select { width: 142px; height: 21px; margin-right: 13px; font-size: 12px; border: 1px solid #808080; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } div.toolbar div.section-switcher div.section-select label { margin: 0 9px 0 0; } .project-view div.list-view div.toolbar div.section-switcher div.section-select label { color: #FFFFFF; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } /*Breadcrumbs*/ div.toolbar div.filters { margin: 5px 0px 0 12px; width: 168px; float: left; } div.toolbar label { } div.toolbar div.filters select { width: 104px; height: 21px; font-size: 12px; border: 1px solid #808080; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; padding: 0px 0 0; margin: 1px 0 0; } #breadcrumbs { height: 29px; max-height: 29px; background: #FFFFFF; overflow: hidden; width: 100%; } .project-view #breadcrumbs { background-image: url(../images/bg-breadcrumbs-project-view.png); background-position: 0px 1px; background-color: #828282; } #breadcrumbs div.home { width: 71px; height: 23px; float: left; /*+placement:shift -1px 0px;*/ position: relative; left: -1px; top: 0px; cursor: pointer; z-index: 5; } .project-view #breadcrumbs div.home { background-position: -63px -98px; } .project-view #breadcrumbs div.end { background-position: -89px -98px; } #breadcrumbs ul li, #breadcrumbs div.active-project, #breadcrumbs .home { height: 21px; float: left; font-size: 13px; color: #FFFFFF; padding: 9px 5px 0px 8px; cursor: pointer; /*+placement:shift -13px 0px;*/ position: relative; left: -13px; top: 0px; position: relative; margin: 0 0 0 2px; } #breadcrumbs ul li:after, #breadcrumbs .home:after { content: ">"; font-size: 11px; /*+placement:shift 7px -1px;*/ position: relative; left: 7px; top: -1px; color: #C4C4C4; } .project-view #breadcrumbs ul li { color: #FFFFFF !important; } #breadcrumbs ul li, #breadcrumbs div.active-project, #breadcrumbs .home { /*+placement:shift 0px 0px;*/ position: relative; left: 0px; top: 0px; color: #63A9F1; } #breadcrumbs ul li:hover, #breadcrumbs ul li.active, #breadcrumbs ul li.maximized { color: #000000; } /*NOTE: End divs are not displayed per UI changes*/ #breadcrumbs div.end { } #breadcrumbs ul div.end { /*+placement:shift -37px -1px;*/ position: relative; left: -37px; top: -1px; margin-right: 0px; /*Disabled*/ display: none; } #breadcrumbs ul li { position: relative; /*+placement:shift -36px 0px;*/ position: relative; left: -36px; top: 0px; margin-left: -10px; text-indent: 13px; font-size: 13px; } #breadcrumbs div.active-project { z-index: 2; text-indent: 9px; display: none; } /*Group View*/ div.panel div.view.group-thumbnail ul.groups li { float: left; width: 142px; height: 80px; background: url(../images/buttons.png) no-repeat -1px -399px; margin: 16px -1px -5px 16px; cursor: pointer; position: relative; } div.panel div.view.group-thumbnail ul.groups li.active { background-position: -1px -489px; } div.panel div.view.group-thumbnail ul.groups li.drop-hover { background-position: -1px -310px !important; } div.panel div.view.group-thumbnail ul.groups li.new { background-position: -147px -401px; } div.panel div.view.group-thumbnail ul.groups li.new.drop-hover { background-position: -148px -312px !important; } div.panel div.view.group-thumbnail ul.groups li span.name { font-size: 12px; color: #49596B; /*+placement:shift 9px 7px;*/ position: relative; left: 9px; top: 7px; font-weight: bold; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; position: absolute; } div.panel div.view.group-thumbnail ul.groups li span.vm-count { font-size: 21px; /*+placement:displace 54px 27px;*/ position: absolute; margin-left: 54px; margin-top: 27px; position: absolute; color: #3A4857; } /*Reduced view*/ #browser div.panel.reduced .reduced-hide { color: #BBB8B8; } #browser div.panel.reduced div.toolbar .reduced-hide { display: none; } /*List view -- edit field*/ div.view table td.editable div.edit { width: 106%; height: 20px; /*+placement:shift 6px 0px;*/ position: relative; left: 6px; top: 0px; } div.view table td.truncated.editable div.edit { top: 1px; width: 285px; left: 1px; } div.view table td.editable div.edit input { float: left; width: 66%; height: 17px; border: none; position: relative; z-index: 1; } .detail-view div.view table td.editable div.edit { width: 116px; } div.view table td.editable div.action { float: left; width: 16px; height: 19px; background: #FFFFFF url(../images/buttons.png) -614px -684px; padding-left: 2px; /*+placement:shift -2px 0px;*/ position: relative; left: -2px; top: 0px; cursor: pointer; } div.view table td.editable div.action.save { margin-left: 2px; } div.view table td.editable div.action.cancel { background-position: -628px -684px; } /*** Actions*/ table td.actions { cursor: default; /*Make fixed*/ width: 200px; min-width: 200px; max-width: 200px; } table td.actions span { margin: 0 0 0 2px !important; } table td.actions .action span.icon { background-image: url(../images/sprites.png); cursor: pointer; width: 23px; height: 21px; float: left; } table td.actions .action.disabled { } table td.actions .action.disabled:hover .icon { } table td.actions .action.disabled .icon { cursor: not-allowed; /*+opacity:20%;*/ filter: alpha(opacity=20); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20); -moz-opacity: 0.2; opacity: 0.2; } table tr.odd td.actions .action.disabled .icon { background-color: #F2F0F0; } table tr.even td.actions .action.disabled .icon { background-color: #DFE1E3; } table tr td.actions .action.text { cursor: pointer; display: inline-block; border: 1px solid #C2C2C2; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; background: url(../images/bg-gradients.png) repeat-x 0px -83px; } table tr td.actions .action.text:hover { /*+box-shadow:inset 0px 1px 3px #171717;*/ -moz-box-shadow: inset 0px 1px 3px #171717; -webkit-box-shadow: inset 0px 1px 3px #171717; -o-box-shadow: inset 0px 1px 3px #171717; box-shadow: inset 0px 1px 3px #171717; } table tr td.actions .action.text .label { padding: 4px 0 0 4px; } table tr td.actions .action.text .icon { padding-bottom: 4px; } table tr.selected td.actions .action.disabled .icon { background-color: #CBDDF3; } /*** Action icons Dialogs*/ .ui-dialog { background: #FFFFFF; text-align: left; /*+box-shadow:0px -4px 15px #4C4A4A;*/ -moz-box-shadow: 0px -4px 15px #4C4A4A; -webkit-box-shadow: 0px -4px 15px #4C4A4A; -o-box-shadow: 0px -4px 15px #4C4A4A; box-shadow: 0px -4px 15px #4C4A4A; position: absolute; padding: 15px; } .ui-dialog .ui-widget-content { padding: 8px; text-align: center; display: inline-block; } .ui-dialog .ui-widget-content .nothing-to-select { width: 386px; line-height: 21px; text-align: left; font-size: 16px; color: #3D3D3D; padding: 4px 25px 180px 28px; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; background: #FFFFFF; margin: 57px 0 0; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; } .ui-dialog .ui-widget-content .nothing-to-select p { margin: 18px 0 0; } .ui-dialog .ui-widget-content .nothing-to-select .specify-ip { margin-top: 28px; padding-top: 21px; font-size: 12px; border-top: 1px solid #DFDFDF; } .ui-dialog-buttonset { width: 285px; margin: 0; } .ui-dialog .ui-button { display: block; cursor: pointer; float: left; width: 110px; height: 31px; border: none; background: url(../images/gradients.png) -2px -481px; border: 1px solid #BFBCBC; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .ui-dialog .ui-button:hover { background-position: -4px -426px; } .ui-dialog.notice .close.ui-button { background: transparent; display: inline; padding: 0; float: right; color: #516374; /*+text-shadow:0px -1px 1px #FFFFFF;*/ -moz-text-shadow: 0px -1px 1px #FFFFFF; -webkit-text-shadow: 0px -1px 1px #FFFFFF; -o-text-shadow: 0px -1px 1px #FFFFFF; text-shadow: 0px -1px 1px #FFFFFF; } .ui-dialog .ui-button.ok { background-position: 0px -317px; border: 1px solid #0065C5; color: #FFFFFF; /*+text-shadow:0px -1px 1px #011238;*/ -moz-text-shadow: 0px -1px 1px #011238; -webkit-text-shadow: 0px -1px 1px #011238; -o-text-shadow: 0px -1px 1px #011238; text-shadow: 0px -1px 1px #011238; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .ui-dialog .ui-button.ok:hover { background-position: -3px -368px; border: 1px solid #004FF7; } .ui-dialog.confirm .ui-button { margin-top: 0px; margin-left: 11px; } .ui-dialog.confirm .ui-button.cancel { margin-left: 50px; } .ui-dialog span.message { display: block; text-align: center; color: #445361; font-size: 14px; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; padding-bottom: 40px; } .ui-dialog span.message ul { margin-left: 30px; margin-top: 14px; text-align: left; list-style: disc; } .ui-dialog span.message ul li { margin-top: 3px; } .ui-dialog span.message p { text-align: left; margin-top: 20px; } .ui-dialog-titlebar { background: #FFFFFF; color: #000000; height: 33px; /*+border-radius:7px 7px 0 0;*/ -moz-border-radius: 7px 7px 0 0; -webkit-border-radius: 7px 7px 0 0; -khtml-border-radius: 7px 7px 0 0; border-radius: 7px 7px 0 0; margin: auto; } .ui-dialog-titlebar .ui-icon-closethick { display: none; } .ui-dialog-title { /*+placement:shift 8px 9px;*/ position: relative; left: 8px; top: 9px; font-size: 14px; padding: 2px 0 5px 30px; background: url(../images/icons.png) no-repeat 0px -255px; } .notice .ui-dialog-title { background-position: 0px -288px; } .ui-dialog.confirm .ui-dialog-title { background: url(../images/icons.png) no-repeat 0px -224px; } .ui-dialog.create-form .ui-dialog-title { background: url(../images/icons.png) no-repeat 0px -255px; } .ui-dialog.confirm .ui-button { /*+placement:shift 0px -8px;*/ position: relative; left: 0px; top: -8px; } /*** Create form*/ .ui-dialog div.form-container { width: 94% !important; height: 106px; text-align: left; display: inline-block; } .ui-dialog div.form-container span.message { text-align: left; padding: 0 0 23px 5px; font-size: 15px; } .ui-dialog div.form-container span.message br { margin-bottom: 13px; } .ui-dialog div.form-container div.form-item { width: 100%; display: inline-block; margin: 0 0 12px; } .ui-dialog div.form-container div.name { float: left; clear: both; width: 115px; font-size: 15px; color: #485867; /*+text-shadow:0px 2px 1px #FFFFFF;*/ -moz-text-shadow: 0px 2px 1px #FFFFFF; -webkit-text-shadow: 0px 2px 1px #FFFFFF; -o-text-shadow: 0px 2px 1px #FFFFFF; text-shadow: 0px 2px 1px #FFFFFF; margin: 3px 0 0; } .ui-dialog div.form-container div.name label { display: block; width: 119px; text-align: right; font-size: 13px; margin-top: 2px; } .field-required { color: #EE7B7B; font-size: 14px; padding: 0 3px 0 0; font-weight: bold; } .ui-dialog div.form-container div.value { width: 61%; float: left; margin: 0 0 0 15px; display: inline-block; } .ui-dialog div.form-container div.value input { width: 98%; font-size: 14px; padding: 4px; background: #F6F6F6; border: 1px solid #AFAFAF; float: left; } .ui-dialog div.form-container div.value input.hasDatepicker { color: #2F5D86; cursor: pointer; font-size: 13px; text-indent: 3px; } .ui-dialog div.form-container div.value input.hasDatepicker:hover { /*+box-shadow:inset 0px 0px 3px;*/ -moz-box-shadow: inset 0px 0px 3px; -webkit-box-shadow: inset 0px 0px 3px; -o-box-shadow: inset 0px 0px 3px; box-shadow: inset 0px 0px 3px; } .ui-dialog div.form-container div.value .range-edit { width: 249px; height: 33px; margin: 2px 0 0; } .ui-dialog div.form-container div.value .range-edit .range-item { width: 124px; height: 32px; position: relative; float: left; } .ui-dialog div.form-container div.value .range-edit input { width: 105px; margin: 0 9px 0 0; } .ui-dialog div.form-container div.value .range-edit label.error { position: absolute; left: 3px; top: 25px; } .ui-dialog div.form-container div.value select { width: 100%; float: right; } .ui-dialog div.form-container div.value input[type=checkbox] { width: 14px; } .ui-dialog div.form-container div.value label.error { display: block; clear: both; font-size: 10px; color: #FA0000; display: none; } .ui-dialog div.form-container div.multi-array { display: inline-block; background: #FFFFFF; padding: 4px; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; border: 1px solid #808080; /*+box-shadow:inset 0px 1px 1px #929292;*/ -moz-box-shadow: inset 0px 1px 1px #929292; -webkit-box-shadow: inset 0px 1px 1px #929292; -o-box-shadow: inset 0px 1px 1px #929292; box-shadow: inset 0px 1px 1px #929292; } .ui-dialog div.form-container div.multi-array .item { width: 111px; float: left; margin: 0 0 13px; } .ui-dialog div.form-container div.multi-array .item .name { font-size: 11px; width: 61px; float: left; } .ui-dialog div.form-container div.multi-array .item .value { width: 13px; float: left; } .ui-dialog div.form-container div.multi-array .item .value input { float: left; margin: 0; padding: 0; } .ui-dialog.create-form .ui-button.ok { margin-left: 0; float: right; } .ui-dialog.create-form .ui-button.cancel { background: #B6B6B6 url(../images/gradients.png) 0px -480px; float: right; margin-right: 13px; border: 1px solid #AAAAAA; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .ui-dialog.create-form .ui-button.cancel:hover { background-position: -4px -426px; border-color: #878787; } /**** Dynamic input*/ .ui-dialog div.form-container div.value .dynamic-input { background: #FFFFFF; width: 98%; min-height: 50px; clear: both; max-height: 211px; overflow: auto; overflow-x: hidden; border: 1px solid #CDCDCD; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; /*+box-shadow:inset -1px 1px 1px #636363;*/ -moz-box-shadow: inset -1px 1px 1px #636363; -webkit-box-shadow: inset -1px 1px 1px #636363; -o-box-shadow: inset -1px 1px 1px #636363; box-shadow: inset -1px 1px 1px #636363; } .ui-dialog div.form-container div.value .dynamic-input .form-item { width: 97%; margin: 4px 0 0 5px; } .ui-dialog div.form-container div.value .dynamic-input .name { width: 99px; } .ui-dialog div.form-container div.value .dynamic-input .name label { width: inherit; font-size: 12px; } .ui-dialog div.form-container div.value .dynamic-input .value { width: 40%; } /*User options*/ #user-options { background: #FFFFFF; z-index: 10000; width: 104px; position: absolute; padding: 15px; top: 30px; /*+border-radius:0 0 3px 3px;*/ -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; -khtml-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; /*+box-shadow:0px 1px 7px #000000;*/ -moz-box-shadow: 0px 1px 7px #000000; -webkit-box-shadow: 0px 1px 7px #000000; -o-box-shadow: 0px 1px 7px #000000; box-shadow: 0px 1px 7px #000000; } #user-options a { float: left; width: 100%; padding: 10px 0; } #user-options a:hover { } /*Dashboard ** Admin*/ .dashboard.admin { background: #F2F0F0; height: 100%; padding: 10px; font-size: 13px; color: #3D5873; } .dashboard.admin .dashboard-container { background: #FFFFFF; border: 1px solid #C8C2C2; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; padding: 0px 8px 18px 0px; margin: 0 0 11px; } .dashboard.admin .dashboard-container.sub { width: 368px; } .dashboard.admin .dashboard-container.sub .button.view-all, .dashboard.admin .dashboard-container .button.fetch-latest { font-size: 13px; float: right; clear: none; /*+text-shadow:none;*/ -moz-text-shadow: none; -webkit-text-shadow: none; -o-text-shadow: none; text-shadow: none; -moz-text-shadow: 0px 1px 0px #333E49; -webkit-text-shadow: 0px 1px 0px #333E49; -o-text-shadow: 0px 1px 0px #333E49; padding: 3px 8px 3px 10px; background: rgb(234, 234, 234); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNmQ2ZDYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(234,234,234,1) 0%, rgba(214,214,214,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(234,234,234,1)), color-stop(100%,rgba(214,214,214,1))); background: -webkit-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); background: -o-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); background: -ms-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); background: linear-gradient(to bottom, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaeaea', endColorstr='#d6d6d6',GradientType=0 ); border: 1px solid #9D9D9D; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; /*+box-shadow:0px 1px #CACACA;*/ -moz-box-shadow: 0px 1px #CACACA; -webkit-box-shadow: 0px 1px #CACACA; -o-box-shadow: 0px 1px #CACACA; box-shadow: 0px 1px #CACACA; cursor: pointer; font-weight: 100; color: #000000; } .dashboard.admin .dashboard-container.sub .button.view-all:hover, .dashboard.admin .dashboard-container .button.fetch-latest:hover { background: #E8E8E8; /*+box-shadow:inset 0px 0px 6px #636363;*/ -moz-box-shadow: inset 0px 0px 6px #636363; -webkit-box-shadow: inset 0px 0px 6px #636363; -o-box-shadow: inset 0px 0px 6px #636363; box-shadow: inset 0px 0px 6px #636363; } .dashboard.admin .dashboard-container.sub .title { float: left; } /**** Head*/ .dashboard.admin .dashboard-container.head { width: 766px; height: 331px; margin: 9px 0 0; float: left; } .dashboard.admin .dashboard-container .top { background: #EFEFEF 0px -4px; padding: 4px 4px 8px; width: 100%; float: left; margin: 0; color: #FFFFFF; } .dashboard.admin .dashboard-container .title { float: left; font-size: 13px; font-weight: 100; /*+text-shadow:0px 1px 1px #9A9A9A;*/ -moz-text-shadow: 0px 1px 1px #9A9A9A; -webkit-text-shadow: 0px 1px 1px #9A9A9A; -o-text-shadow: 0px 1px 1px #9A9A9A; text-shadow: 0px 1px 1px #9A9A9A; padding: 5px 0 0 4px; } .dashboard.admin .dashboard-container .title span { color: #000000; /*+text-shadow:none;*/ -moz-text-shadow: none; -webkit-text-shadow: none; -o-text-shadow: none; text-shadow: none; } .dashboard.admin .dashboard-container.head .selects { float: right; } .dashboard.admin .dashboard-container.head .selects .select { float: left; padding: 0; margin: 0 0 0 21px; } .dashboard.admin .dashboard-container.head .selects .select label { display: block; float: left; padding: 5px 0px 0px; } .dashboard.admin .dashboard-container.head .selects .select select { width: 124px; margin: 3px 0 0 10px; padding: 0px; } /**** Charts / stats*/ .dashboard.admin .zone-stats { width: 774px; height: 348px; overflow: auto; overflow-x: hidden; /*+placement:shift 0px -11px;*/ position: relative; left: 0px; top: -11px; } .dashboard.admin .zone-stats ul { width: 796px; /*+placement:shift -2px 11px;*/ position: relative; left: -2px; top: 11px; } .dashboard.admin .zone-stats ul li { width: 388px; font-size: 14px; height: 79px; float: left; position: absolute; position: relative; cursor: pointer; z-index: 1; } .dashboard.admin .zone-stats ul li canvas { position: relative; z-index: -1; } .dashboard.admin .zone-stats ul li:hover { background: #FFF2DA; } .dashboard.admin .zone-stats ul li .label { width: 111px; float: left; font-weight: 100; border-bottom: 1px solid #E2E2E2; margin: 5px 0 0 22px; padding: 22px 0 7px; } .dashboard.admin .zone-stats ul li .info { float: left; width: 151px; white-space: nowrap; margin: 12px 0 0; color: #636363; } .dashboard.admin .zone-stats ul li .info .name { font-weight: bold; margin-top: 8px; margin-bottom: 9px; font-size: 12px; font-weight: 100; /*[empty]color:;*/ } .dashboard.admin .zone-stats ul li .pie-chart-container { width: 91px; height: 69px; overflow: hidden; float: left; position: relative; /*+placement:shift -8px 7px;*/ position: relative; left: -8px; top: 7px; } .dashboard.admin .zone-stats ul li .pie-chart-container .percent-label { width: 52px; color: #C98200; /*+placement:shift 28px 31px;*/ position: relative; left: 28px; top: 31px; position: absolute; font-weight: bold; text-align: center; } .dashboard.admin .zone-stats ul li .pie-chart { width: 70px; height: 66px; float: left; margin: 3px 27px 0 16px; position: relative; z-index: -1; } .dashboard.admin .dashboard-container .stats ul li { display: block; width: 97%; height: 40px; background: url(../images/bg-gradients.png) 0px -29px; clear: both; border: 1px solid #C8C2C2; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; padding: 0 12px 0px; margin: 0 0 10px; } .dashboard.admin .dashboard-container .stats ul li .name { width: 178px; float: left; font-size: 11px; font-weight: bold; margin: 15px 15px 0 0; } .dashboard.admin .dashboard-container .stats ul li div.value { float: left; background: url(../images/bg-gradients.png) 0px -51px; width: 295px; height: 100%; border-left: 1px solid #C8C2C2; border-right: 1px solid #C8C2C2; margin: 0 9px 0 0; } .dashboard.admin .dashboard-container .stats ul li .value .content { background: url(../images/bg-gradients.png) repeat-x 0px 0px; margin: 6px 9px 9px; padding: 9px; color: #FFFFFF; /*Adjusting the font size for proper display*/ font-size: 10px; border-left: 1px solid #6A6A6A; border-right: 1px solid #6A6A6A; border-bottom: 1px solid #FFFFFF; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; /*+text-shadow:0px -1px 1px #6F6F6F;*/ -moz-text-shadow: 0px -1px 1px #6F6F6F; -webkit-text-shadow: 0px -1px 1px #6F6F6F; -o-text-shadow: 0px -1px 1px #6F6F6F; text-shadow: 0px -1px 1px #6F6F6F; } .dashboard.admin .dashboard-container .stats ul li .chart { float: left; width: 290px; height: 17px; padding: 0px 1px; background: url(../images/bg-gradients.png) 0px -130px; margin: 12px 23px 0 0; /*+border-radius:7px;*/ -moz-border-radius: 7px; -webkit-border-radius: 7px; -khtml-border-radius: 7px; border-radius: 7px; border-radius: 7px 7px 7px 7px; border-bottom: 1px solid #FFFFFF; border-top: 1px solid #727272; } .dashboard.admin .dashboard-container .stats ul li .chart .chart-line { height: 15px; background: url(../images/bg-gradients.png) 0px -149px; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; margin: 1px 0px 0; } .dashboard.admin .dashboard-container .stats ul li .percentage { float: left; font-size: 20px; font-weight: bold; margin: 13px 0 0; /*+text-shadow:0px -2px 1px #FFFFFF;*/ -moz-text-shadow: 0px -2px 1px #FFFFFF; -webkit-text-shadow: 0px -2px 1px #FFFFFF; -o-text-shadow: 0px -2px 1px #FFFFFF; text-shadow: 0px -2px 1px #FFFFFF; } /**** Alerts*/ .dashboard.admin .dashboard-container.sub.alerts { float: left; margin: 0 12px 0 0; height: 270px; overflow: hidden; position: relative; } .dashboard.admin .dashboard-container.sub.alerts.last { margin-right: 0; } .dashboard.admin .dashboard-container.sub.alerts ul { width: 368px; height: 234px; overflow: auto; overflow-x: hidden; position: relative; margin: 0px 0 0 8px; } .dashboard.admin .dashboard-container.sub.alerts ul li { background: #F0F0F0; float: left; border: 1px solid #D4D0D0; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; margin: 9px; padding: 8px; } .dashboard.admin .dashboard-container.sub.alerts ul li .content { } .dashboard.admin .dashboard-container.sub.alerts ul li { border: 1px solid #FF7070; background: #FFEFEF; } .dashboard.admin .dashboard-container.sub.alerts ul li span.title { width: 100%; font-weight: bold; font-size: 14px; font-weight: 100; color: #266E9A; margin: 3px 0 5px; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; padding: 0; } .dashboard.admin .dashboard-container.sub.alerts ul li p { float: left; margin: 4px 0px 0px; color: #252525; } .dashboard.admin .dashboard-container.sub.alerts ul li p br { display: none; } /*** User*/ .dashboard.user { } #browser div.panel .dashboard.user .toolbar { height: 60px; position: relative; } .dashboard.user .button.view-all { float: right; border: 1px solid #4B5B6B; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; color: #FFFFFF; /*+text-shadow:0px -1px 2px #13293E;*/ -moz-text-shadow: 0px -1px 2px #13293E; -webkit-text-shadow: 0px -1px 2px #13293E; -o-text-shadow: 0px -1px 2px #13293E; text-shadow: 0px -1px 2px #13293E; padding: 2px 3px 3px; margin: -4px 4px -4px 0; text-indent: 0; background: url(../images/bg-gradients.png) 0px -147px; } .dashboard.user .button.view-all:hover { background-position: 0px 0px; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } /**** Actions*/ .dashboard.user .dashboard-actions { } .dashboard.user .dashboard-actions ul { padding: 11px; } .dashboard.user .dashboard-actions ul li { float: left; width: 123px; cursor: pointer; height: 40px; margin: 0 9px 0 0; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; /*+box-shadow:inset 0px 0px 1px #DDE3EC;*/ -moz-box-shadow: inset 0px 0px 1px #DDE3EC; -webkit-box-shadow: inset 0px 0px 1px #DDE3EC; -o-box-shadow: inset 0px 0px 1px #DDE3EC; box-shadow: inset 0px 0px 1px #DDE3EC; border: 1px solid #395268; border-right: 1px solid #556778; background: url(../images/bg-gradients.png) repeat-x 0px -181px; } .dashboard.user .dashboard-actions ul li span { color: #FFFFFF; font-size: 11px; /*+text-shadow:0px 1px 2px #444444;*/ -moz-text-shadow: 0px 1px 2px #444444; -webkit-text-shadow: 0px 1px 2px #444444; -o-text-shadow: 0px 1px 2px #444444; text-shadow: 0px 1px 2px #444444; background: url(../images/icons.png) no-repeat -613px -309px; padding: 8px 12px 11px 34px; /*+placement:shift 4px 10px;*/ position: relative; left: 4px; top: 10px; } .dashboard.user .dashboard-actions ul li.add-iso span { background-position: -613px -352px; } .dashboard.user .dashboard-actions ul li.add-volume span { background-position: -613px -264px; } .dashboard.user .dashboard-actions ul li.acquire-ip span { background-position: -613px -389px; } /**** VM Status*/ .dashboard.user .vm-status { width: 98%; margin: 19px auto auto; border: 1px solid #D2CDCD; /*+border-radius:9px;*/ -moz-border-radius: 9px; -webkit-border-radius: 9px; -khtml-border-radius: 9px; border-radius: 9px; border-radius: 9px 9px 9px 9px; } .dashboard.user .vm-status .title { width: 100%; background: url(../images/bg-gradients.png) 0px -53px; /*+border-radius:10px 10px 0 0;*/ -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; -khtml-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; font-size: 13px; color: #4A5967; padding: 13px 0 12px; border-bottom: 1px solid #C8C2C2; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; } .dashboard.user .vm-status .title span { padding: 0 0 0 8px; } .dashboard.user .vm-status .content { padding: 9px 0px; } .dashboard.user .vm-status .content ul { display: inline-block; margin: auto; } .dashboard.user .vm-status .content ul li { float: left; width: 243px; height: 237px; border: 1px solid #E6EBEE; border-top: 2px solid #D3D9DE; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; margin: 0 0 0 11px; background: #EBEDF1; } .dashboard.user .vm-status .content ul li .name { font-size: 28px; color: #5C7082; padding: 0 0 0 35px; margin: 14px 0 0; /*+text-shadow:0px 2px 2px #FFFFFF;*/ -moz-text-shadow: 0px 2px 2px #FFFFFF; -webkit-text-shadow: 0px 2px 2px #FFFFFF; -o-text-shadow: 0px 2px 2px #FFFFFF; text-shadow: 0px 2px 2px #FFFFFF; background: url(../images/icons.png) -617px -488px; } .dashboard.user .vm-status .content ul li .value { background: #DFE9CC; width: 229px; color: #5D7C98; /*+text-shadow:0px 1px 2px #FFFFFF;*/ -moz-text-shadow: 0px 1px 2px #FFFFFF; -webkit-text-shadow: 0px 1px 2px #FFFFFF; -o-text-shadow: 0px 1px 2px #FFFFFF; text-shadow: 0px 1px 2px #FFFFFF; font-size: 58px; margin: 12px auto auto; text-align: center; padding: 59px 0px; } .dashboard.user .vm-status .content ul li.stopped .name { background-position: -617px -524px; } .dashboard.user .vm-status .content ul li.stopped .value { background: #EDCBCE; } .dashboard.user .vm-status .content ul li.total .name { background-position: -617px -559px; } .dashboard.user .vm-status .content ul li.total .value { background: #DFE4E9; } /***** Tables / status list*/ .dashboard.user .status-lists { margin: 15px 0 0 8px; } .dashboard.user .status-lists ul li.events { width: 512px; } .dashboard.user .status-lists ul li.events .content li { width: 97%; cursor: pointer; margin: 6px 11px 0 0; font-size: 11px; padding: 13px 0 12px 16px; color: #495A76; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; border: 1px solid #DBDBDB; /*+box-shadow:0px 2px 4px #C0C0C0;*/ -moz-box-shadow: 0px 2px 4px #C0C0C0; -webkit-box-shadow: 0px 2px 4px #C0C0C0; -o-box-shadow: 0px 2px 4px #C0C0C0; box-shadow: 0px 2px 4px #C0C0C0; background: #EFEFEF url(../images/bg-gradients.png) repeat-x 0px -29px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .dashboard.user .status-lists ul li.events .content li .title { font-weight: bold; color: #4A5A6A; margin-bottom: 9px; } .dashboard.user .status-lists ul li { float: left; margin: 0 10px 0 0; } .dashboard.user .status-lists table { width: 252px; margin: 0; cursor: default; } .dashboard.user .status-lists table th { padding: 8px 0px 6px; } .dashboard.user .status-lists .events table { width: 515px; } .dashboard.user .status-lists table tbody { height: 256px; display: block; overflow: auto; overflow-x: hidden; padding: 0 0px; } .dashboard.user .status-lists table td.value { cursor: default; } .dashboard.user .status-lists table td.desc { width: 151px; overflow: hidden; cursor: default; } .dashboard.user .status-lists .my-account table tbody tr { } .dashboard.user .status-lists .my-account table tbody tr td { padding-top: 19px; padding-bottom: 19px; } .dashboard.user .status-lists table thead { background: url(../images/bg-gradients.png) 0px -351px; border-top: 1px solid #C4C5C5; } .dashboard.user .status-lists table tr.odd { background: #DFE1E3; } .dashboard.user .status-lists table td { vertical-align: middle; } /****** IP addresses*/ .dashboard.user .status-lists li.ip-addresses { } .dashboard.user .status-lists li.ip-addresses td { width: 250px; padding: 28px 0 51px; } .dashboard.user .status-lists li.ip-addresses .desc { color: #3F5468; } .dashboard.user .status-lists li.ip-addresses .value { font-size: 29px; margin: 7px 0 0; /*+text-shadow:0px 1px 2px #FFFFFF;*/ -moz-text-shadow: 0px 1px 2px #FFFFFF; -webkit-text-shadow: 0px 1px 2px #FFFFFF; -o-text-shadow: 0px 1px 2px #FFFFFF; text-shadow: 0px 1px 2px #FFFFFF; } /*System chart*/ .system-chart { width: 100%; height: 100%; overflow: auto; overflow-x: hidden; } .system-chart ul.resources li { background: transparent url(../images/bg-gradients.png) repeat-x 0px -1340px; text-align: left; width: 100px; height: 60px; position: absolute; border: 1px solid #99A0A5; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; /*+box-shadow:0px 0px 2px #A6A6A6;*/ -moz-box-shadow: 0px 0px 2px #A6A6A6; -webkit-box-shadow: 0px 0px 2px #A6A6A6; -o-box-shadow: 0px 0px 2px #A6A6A6; box-shadow: 0px 0px 2px #A6A6A6; } .system-chart ul.resources li .button.view-all { width: 65px; height: 25px; background: url(../images/buttons.png) no-repeat -458px -504px; /*+placement:shift 32px 34px;*/ position: relative; left: 32px; top: 34px; position: absolute; } .system-chart ul.resources li .button.view-all:hover { background-position: -537px -504px; } .system-chart ul.resources li .button.view-all .view-all-label { color: #FFFFFF; font-size: 11px; /*+text-shadow:0px -1px 1px #000000;*/ -moz-text-shadow: 0px -1px 1px #000000; -webkit-text-shadow: 0px -1px 1px #000000; -o-text-shadow: 0px -1px 1px #000000; text-shadow: 0px -1px 1px #000000; /*+placement:shift 9px 0px;*/ position: relative; left: 9px; top: 0px; } .system-chart ul.resources li .label { font-weight: bold; font-size: 12px; color: #5C7485; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; /*+placement:shift 3px 3px;*/ position: relative; left: 3px; top: 3px; position: absolute; } /** Resources*/ .system-chart.dashboard.admin { width: 97%; height: 96%; background: transparent; } .system-chart.dashboard.admin .dashboard-container { width: 740px; border: none; } .system-chart.dashboard.admin .dashboard-container .top { background: transparent; } .system-chart.dashboard.admin .dashboard-container .top .title { color: #55687A; } .system-chart.dashboard.admin .dashboard-container .top .title span { /*+text-shadow:0px 0px #FFFFFF;*/ -moz-text-shadow: 0px 0px #FFFFFF; -webkit-text-shadow: 0px 0px #FFFFFF; -o-text-shadow: 0px 0px #FFFFFF; text-shadow: 0px 0px #FFFFFF; } .system-chart.dashboard.admin .dashboard-container .stats .chart { width: 136px; } /** Compute*/ .system-chart.compute { background: url(../images/bg-system-chart-compute.png) no-repeat center; } /*** Compute resources*/ .system-chart.compute ul.resources { width: 98%; height: 97%; margin: 0; position: relative; } .system-chart.compute ul.resources li.zone { left: 96px; } .system-chart.compute ul.resources li.zone .label { width: 100%; left: 0px; top: 20px; font-size: 14px; text-align: center; } .system-chart.compute ul.resources li.pods { left: 199px; top: 112px; } .system-chart.compute ul.resources li.clusters { left: 296px; top: 189px; } .system-chart.compute ul.resources li.hosts { left: 407px; top: 265px; } .system-chart.compute ul.resources li.primaryStorage { left: 407px; top: 375px; } .system-chart.compute ul.resources li.secondaryStorage { left: 199px; top: 497px; } .system-chart.compute ul.resources li.ucs { left: 199px; top: 406px; } /** Network*/ .system-chart.network { } .system-chart.network .network-switch-icon { color: #506980; font-weight: bold; background: url(../images/bg-gradients.png) repeat-x 0px -38px; border: 1px solid #CDCDCD; border-top: 2px solid #FFFFFF; /*+box-shadow:0px 0px 2px #A4A4A4;*/ -moz-box-shadow: 0px 0px 2px #A4A4A4; -webkit-box-shadow: 0px 0px 2px #A4A4A4; -o-box-shadow: 0px 0px 2px #A4A4A4; box-shadow: 0px 0px 2px #A4A4A4; /*+border-radius:2px;*/ -moz-border-radius: 2px; -webkit-border-radius: 2px; -khtml-border-radius: 2px; border-radius: 2px; border-radius: 2px 2px 2px 2px; padding: 8px 7px; /*+placement:shift 187px 76px;*/ position: relative; left: 187px; top: 76px; position: absolute; z-index: 3; } .system-chart.network .base-circle-icon { width: 35px; height: 34px; background: url(../images/bg-system-network-traffic.png) 0px -853px; /*+placement:shift 227px 557px;*/ position: relative; left: 227px; top: 557px; position: absolute; z-index: 5; } .system-chart.network ul.resources { width: 100%; height: 98%; position: absolute; z-index: 2; } .system-chart.network ul.resources li { background: transparent; /*+box-shadow:0px 0px;*/ -moz-box-shadow: 0px 0px; -webkit-box-shadow: 0px 0px; -o-box-shadow: 0px 0px; box-shadow: 0px 0px; -moz-box-shadow: 0px 0px none; -webkit-box-shadow: 0px 0px none; -o-box-shadow: 0px 0px none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; border: none; /*+border-radius:0px;*/ -moz-border-radius: 0px; -webkit-border-radius: 0px; -khtml-border-radius: 0px; border-radius: 0px; border-radius: 0px 0px 0px 0px; } .system-chart.network ul.resources li .view-all { /*+placement:shift 19px 21px;*/ position: relative; left: 19px; top: 21px; } .system-chart.network ul.resources li.public { /*+placement:shift 356px 23px;*/ position: relative; left: 356px; top: 23px; position: absolute; } .system-chart.network ul.resources li.guest { /*+placement:shift 356px 155px;*/ position: relative; left: 356px; top: 155px; position: absolute; } .system-chart.network ul.resources li.management { /*+placement:shift 356px 242px;*/ position: relative; left: 356px; top: 242px; position: absolute; } .system-chart.network ul.resources li.storage { /*+placement:shift 356px 333px;*/ position: relative; left: 356px; top: 333px; position: absolute; } .system-chart.network ul.resources li.providers { /*+placement:shift 248px 427px;*/ position: relative; left: 248px; top: 427px; height: 77px; width: 258px; position: absolute; background: url(../images/bg-system-network-traffic.png) no-repeat -50px -848px; } .system-chart.network ul.resources li.providers span { /*+placement:shift 99px 5px;*/ position: relative; left: 99px; top: 5px; position: absolute; font-size: 12px; } .system-chart.network ul.resources li.providers .view-all { /*+placement:shift 186px 48px;*/ position: relative; left: 186px; top: 48px; position: absolute; } .system-chart.network .system-network-chart { width: 100%; height: 100%; position: relative; z-index: 1; } .system-chart.network .system-network-chart .network-chart-item { background: url(../images/bg-system-network-traffic.png) no-repeat; width: 213px; height: 539px; } .system-chart.network .system-network-chart .network-chart-item.public { background-position: -793px -1px; /*+placement:shift 245px 20px;*/ position: relative; left: 245px; top: 20px; position: absolute; } .system-chart.network .system-network-chart .network-chart-item.management { background-position: -273px 12px; /*+placement:shift 239px 20px;*/ position: relative; left: 239px; top: 20px; position: absolute; } .system-chart.network .system-network-chart .network-chart-item.storage { background-position: -523px 12px; /*+placement:shift 231px 20px;*/ position: relative; left: 231px; top: 20px; position: absolute; } .system-chart.network .system-network-chart .network-chart-item.guest { background-position: -43px 12px; /*+placement:shift 251px 20px;*/ position: relative; left: 251px; top: 20px; position: absolute; } /** NAAS ** Add initial resource form*/ .panel .add-first-network-resource { margin: 37px; font-size: 14px; background: #FFFFFF; padding: 19px 19px 79px; /*+border-radius:12px;*/ -moz-border-radius: 12px; -webkit-border-radius: 12px; -khtml-border-radius: 12px; border-radius: 12px; border-radius: 12px 12px 12px 12px; border: 1px solid #ECECEC; } .panel .add-first-network-resource form { display: inline-block; height: 442px; overflow: auto; overflow-x: hidden; } .panel .add-first-network-resource .title { font-size: 26px; color: #3984D1; /*+text-shadow:0px 1px 2px #BCBCBC;*/ -moz-text-shadow: 0px 1px 2px #BCBCBC; -webkit-text-shadow: 0px 1px 2px #BCBCBC; -o-text-shadow: 0px 1px 2px #BCBCBC; text-shadow: 0px 1px 2px #BCBCBC; margin: 0 0 17px; } .panel .add-first-network-resource .message { display: block; color: #545151; margin: 0 0 30px; } .panel .add-first-network-resource .form-item { width: 409px; display: inline-block; padding: 5px; position: relative; margin: 0 0 2px; } .panel .add-first-network-resource .form-item label { float: left; width: 109px; text-align: right; } .panel .add-first-network-resource .form-item label.error { display: none; font-size: 10px; position: absolute; top: 30px; left: 137px; } .panel .add-first-network-resource .form-item input { float: right; /*+border-radius:6px;*/ -moz-border-radius: 6px; -webkit-border-radius: 6px; -khtml-border-radius: 6px; border-radius: 6px; border-radius: 6px 6px 6px 6px; font-size: 16px; border: 1px solid #B7B7B7; } .panel .add-first-network-resource .form-item input[type=checkbox] { float: right; margin: 0 266px 0 0; } .panel .add-first-network-resource .form-item input[type=text], .panel .add-first-network-resource .form-item input[type=password], .panel .add-first-network-resource .form-item input[type=text], .panel .add-first-network-resource .form-item select { width: 276px; } .panel .add-first-network-resource .form-item select { width: 280px; margin: 0 0 0 20px; } .panel .add-first-network-resource .button { padding: 11px 23px 11px 21px; cursor: pointer; background: url(../images/bg-gradients.png) repeat-x 0px -221px; margin: 29px 0 0; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; border: 1px solid #858585; color: #FFFFFF; clear: both; /*[empty]position:;*/ } .panel .add-first-network-resource .multi-array { background: #FFFFFF; border: 1px solid #DCDCDC; display: inline-block; float: left; padding: 12px; clear: both; width: 383px; margin: 3px 0 10px; /*+border-radius:7px;*/ -moz-border-radius: 7px; -webkit-border-radius: 7px; -khtml-border-radius: 7px; border-radius: 7px; border-radius: 7px 7px 7px 7px; } .panel .add-first-network-resource .multi-array .item { max-width: 155px; float: left; margin: 6px 0 0 24px; } .panel .add-first-network-resource .multi-array .item .name { float: left; } .panel .add-first-network-resource .multi-array .item .value { float: right; margin: 0 0 0 13px; } .panel .add-first-network-resource .multi-array .item .value input { margin: 0; } /*Form validation*/ input.error { background: #FEE5E5; } label.error { color: #FF0000; } /*Multi-step wizard*/ .multi-wizard { width: 500px; height: 550px; display: inline-block; } /*** Progress bar*/ .multi-wizard .progress { color: #FFFFFF; font-size: 11px; } .multi-wizard .progress ul { width: 780px; height: 40px; float: left; clear: both; } /*[clearfix]*/.multi-wizard .progress ul li { float: left; width: 128px; height: 40px; padding: 0 0px; position: relative; } .multi-wizard.instance-wizard .progress ul li { width: 102px; margin-left: 8px; } .multi-wizard .progress ul li.first { /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; } .multi-wizard .progress ul li.last { } .multi-wizard .progress ul li.active { background: url(../images/bg-gradients.png) 0px -221px; height: 40px; /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; } .multi-wizard .progress ul li span { display: block; /*+placement:shift 46px 17px;*/ position: relative; left: 46px; top: 17px; text-align: left; color: #000000; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; float: right; position: absolute; width: 62px; text-align: center; } .multi-wizard.instance-wizard .progress ul li span { left: 26px; top: 16px; } .multi-wizard .progress ul li span.multiline { width: 71px; top: 12px; } .multi-wizard .progress ul li span.arrow { width: 17px; height: 15px; /*+placement:displace 74px -3px;*/ position: absolute; margin-left: 74px; margin-top: -3px; background: url(../images/icons.png) no-repeat 0px -422px; z-index: 1000; display: none; } .multi-wizard.instance-wizard .progress ul li span.arrow { left: 19px; } .multi-wizard .progress ul li.active span.arrow { background-position: -1px -396px; } .multi-wizard .progress ul li span.number { width: auto; position: absolute; top: 7px; left: 26px; font-size: 27px; font-weight: bold; color: #BBBBBB; background: transparent; } .multi-wizard.instance-wizard .progress ul li span.number { left: 8px; } .multi-wizard.instance-wizard .progress ul li span.multiline { width: 79px; left: 26px; } .multi-wizard .progress ul li.active span { /*+text-shadow:0px -1px 1px #004AFF;*/ -moz-text-shadow: 0px -1px 1px #004AFF; -webkit-text-shadow: 0px -1px 1px #004AFF; -o-text-shadow: 0px -1px 1px #004AFF; text-shadow: 0px -1px 1px #004AFF; color: #FFFFFF; } .multi-wizard .progress ul li.active span.number { } /*** Content*/ .multi-wizard .main-desc { font-size: 11px; text-align: left; width: 437px; /*+placement:shift 3px 25px;*/ position: relative; left: 3px; top: 25px; line-height: 17px; } .multi-wizard .content { background: #FFFFFF; width: 440px; min-height: 366px; margin: 24px 0 0; padding-bottom: 8px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; display: inline-block; float: left; } .multi-wizard .select-security-group .content { height: 366px; } .multi-wizard .content .section { width: 416px; background: #E9E9E9; margin: 16px auto auto; overflow: hidden; text-align: left; font-size: 12px; color: #505A62; border: 1px solid #E0DFDF; } .multi-wizard.instance-wizard .service-offering .content { width: 463px; max-height: 365px; overflow: auto; overflow-x: hidden; } .multi-wizard .content .section .select-area { width: 334px; height: 45px; margin: 9px auto auto; background: #D6D6D6; } .multi-wizard .content .section .select-area .desc { text-align: left; width: 155px; float: right; padding: 9px 0 0; font-size: 12px; color: #989898; } .multi-wizard .content .section .select-area input { float: left; margin: 0; padding: 9px; } .multi-wizard .content .section .select-area select { padding: 0; width: 158px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; margin: 11px 0px 0 14px; float: left; } .multi-wizard .content .section .select-area input[type=radio] { margin: 14px 16px 0; } .multi-wizard .content .section .select-area label { float: left; text-align: left; font-size: 18px; color: #62798E; /*+text-shadow:0px 2px 2px #EFEFEF;*/ -moz-text-shadow: 0px 2px 2px #EFEFEF; -webkit-text-shadow: 0px 2px 2px #EFEFEF; -o-text-shadow: 0px 2px 2px #EFEFEF; text-shadow: 0px 2px 2px #EFEFEF; margin: 12px 12px 12px 2px; } .multi-wizard .content .section .select-area label.error { font-size: 10px; color: #FF0000; margin: 2px 0 0 14px; } .multi-wizard .content .section p { font-size: 11px; text-align: left; color: #808080; padding: 0 0 0 40px; } .multi-wizard .content .section h3 { text-align: left; color: #62798E; font-weight: bold; padding: 14px 14px 3px 39px; /*+text-shadow:0px 1px 1px #EFEFEF;*/ -moz-text-shadow: 0px 1px 1px #EFEFEF; -webkit-text-shadow: 0px 1px 1px #EFEFEF; -o-text-shadow: 0px 1px 1px #EFEFEF; text-shadow: 0px 1px 1px #EFEFEF; margin: 0; } .multi-wizard .content .section.select-zone { height: 117px; } .multi-wizard .content .section.select-template { height: 206px; } .multi-wizard .content.tab-view { margin: 31px 0px 0px; background: transparent; padding: 0px 8px; } .multi-wizard .content.tab-view div.ui-tabs-panel { border: 1px solid #E2DDDD; clear: both; height: 72% !important; width: 95%; margin: auto; overflow: auto; overflow-x: hidden; height: 591px; /*+border-radius:0 3px 10px 10px;*/ -moz-border-radius: 0 3px 10px 10px; -webkit-border-radius: 0 3px 10px 10px; -khtml-border-radius: 0 3px 10px 10px; border-radius: 0 3px 10px 10px; background: #FFFFFF; } .multi-wizard .content.tab-view div.ui-tabs-panel.ui-tabs-hide { display: none; } .multi-wizard.instance-wizard .select-iso .content .select .hypervisor { float: left; display: block; clear: both; margin: 12px 0 0 58px; /*+placement:shift 0px -6px;*/ position: relative; left: 0px; top: -6px; } .multi-wizard.instance-wizard .select-iso .content .select .hypervisor select { width: 160px; } .multi-wizard.instance-wizard .select-iso .content .select .hypervisor label { color: #000000; font-size: 11px; margin-right: 9px; margin-left: 2px; /*+placement:shift;*/ position: relative; left: 0; top: 0; } .multi-wizard.instance-wizard .select-iso .wizard-step-conditional.select-iso .content .select.selected { height: 90px; } /*** UI widgets*/ .multi-wizard .ui-tabs ul.ui-tabs-nav { margin-left: 2px; margin-top: 7px; display: block; height: 41px; background: transparent; border: none; /*+placement:shift -6px 5px;*/ position: relative; left: -6px; top: 5px; overflow: hidden; display: inline-block; z-index: 10; } .multi-wizard .select-iso .ui-tabs ul { float: left; left: 0px; top: 1px; } .multi-wizard .ui-tabs ul li.first a { border-left: 1px solid #E2DDDD; } .multi-wizard .ui-tabs ul li.last a { border-right: 1px solid #E2DDDD; } .multi-wizard .ui-tabs li.ui-state-default a { float: left; padding: 15px; width: 110px; text-align: center; font-size: 11px; margin-right: 1px; color: #4E6070; text-decoration: none; background: #DEE3E5; } .multi-wizard .ui-tabs li.ui-state-active a { background: #FFFFFF; } .multi-wizard .ui-slider { width: 136px; padding: 0; margin: 8px -2px 3px; background: url(../images/bg-gradients.png) 0px -307px; float: left; } .multi-wizard .ui-slider .ui-slider-handle { display: block; background: url(../images/buttons.png) -622px -274px; width: 18px; height: 18px; position: relative; outline: none; } /*** Select container*/ .multi-wizard .select-container { height: 352px; overflow: auto; overflow-x: hidden; border: 1px solid #D9DFE1; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; margin: 10px 10px 0px; } .multi-wizard .select-container p { padding: 11px; color: #424242; background: #DFDFDF; } .multi-wizard .select-container .select { font-size: 13px; margin: -1px 0 0; padding: 0 0 14px; min-height: 35px; width: 100%; display: inline-block; text-align: left; float: left; border: none; background: #FFFFFF; } .multi-wizard .select-container .select.odd { background: #EBEFF4; } .multi-wizard .select-container .select input { float: left; margin: 24px 24px 0; } .multi-wizard .select-container .select .select-desc { max-width: 335px; min-height: 28px; overflow: hidden; float: left; clear: none; margin: 21px 0 0; display: inline-block; } .multi-wizard .select-container .select .select-desc .name { font-weight: bold; margin: 0 0 5px; } .multi-wizard .select-container .select .select-desc .desc { font-size: 11px; color: #808080; display: inline-block; /*[empty]height:;*/ } /*** Buttons*/ .multi-wizard .buttons { width: 100%; position: absolute; bottom: 10px; left: 0px; } .multi-wizard .buttons .button { width: 88px; height: 16px; padding: 11px 0 8px; /*+box-shadow:0px 1px 1px #FFFFFF;*/ -moz-box-shadow: 0px 1px 1px #FFFFFF; -webkit-box-shadow: 0px 1px 1px #FFFFFF; -o-box-shadow: 0px 1px 1px #FFFFFF; box-shadow: 0px 1px 1px #FFFFFF; border: 1px solid #78818F; cursor: pointer; font-weight: bold; font-size: 12px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .multi-wizard .buttons .button.next { /*+placement:float-right 77px 0px;*/ float: right; position: relative; left: 77px; top: 0px; color: #FFFFFF; /*+text-shadow:0px -1px 1px #465259;*/ -moz-text-shadow: 0px -1px 1px #465259; -webkit-text-shadow: 0px -1px 1px #465259; -o-text-shadow: 0px -1px 1px #465259; text-shadow: 0px -1px 1px #465259; background: #0049FF url(../images/gradients.png) 0px -317px; font-weight: bold; border: 1px solid #0069CF; border-top: 1px solid #0070FC; } .multi-wizard .buttons .button.next:hover { background-position: -3px -368px; border: 1px solid #0035B8; border-bottom: 1px solid #0062FA; } .multi-wizard .buttons .button.next.final { padding: 4px 0px 9px; width: 115px; margin: 3px 0 0; } .multi-wizard .buttons .button.next.final span { background: url(../images/icons.png) 0px -349px; /*+placement:shift 0px 5px;*/ position: relative; left: 0px; top: 5px; padding: 5px 0px 5px 30px; } .multi-wizard .buttons .button.cancel { border: none; /*+placement:float-right -127px 0px;*/ float: right; position: relative; left: -127px; top: 0px; color: #808080; /*+border-radius:0;*/ -moz-border-radius: 0; -webkit-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; border-radius: 0 0 0 0; background: transparent; /*+box-shadow:0px 0px;*/ -moz-box-shadow: 0px 0px; -webkit-box-shadow: 0px 0px; -o-box-shadow: 0px 0px; box-shadow: 0px 0px; -moz-box-shadow: 0px 0px inherit; -webkit-box-shadow: 0px 0px inherit; -o-box-shadow: 0px 0px inherit; -moz-box-shadow: inherit; -webkit-box-shadow: inherit; -o-box-shadow: inherit; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; padding: 14px 0 0px 0px; } .multi-wizard .buttons .button.cancel:hover { color: #5E5E5E; } .multi-wizard .buttons .button.previous { background: #D6D6D6; color: #62798E; margin-left: 27px; } .multi-wizard .buttons .button.previous:hover { background: #C6C6C6; } /** Instance wizard ** Select ISO*/ .multi-wizard.instance-wizard .select-iso .select-container { height: 260px; margin: 0; /*+border-radius:0 0 5px 5px;*/ -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; -khtml-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; } /*** Data disk offering*/ .multi-wizard.instance-wizard .data-disk-offering .content .section { padding: 9px 0 16px; margin: 12px 0 15px 8px; } .multi-wizard.instance-wizard .data-disk-offering .select-container { height: 300px; margin: -7px 6px 0 8px; /*+border-radius:6px;*/ -moz-border-radius: 6px; -webkit-border-radius: 6px; -khtml-border-radius: 6px; border-radius: 6px; border-radius: 6px 6px 6px 6px; } .multi-wizard.instance-wizard .data-disk-offering.required .select-container { height: 344px; position: relative; margin-top: 9px !important; } .multi-wizard.instance-wizard .custom-disk-size .select-container { height: 279px; } .multi-wizard.instance-wizard .custom-disk-size .select-container { height: 213px; margin: -7px 6px 0 8px; /*+border-radius:6px;*/ -moz-border-radius: 6px; -webkit-border-radius: 6px; -khtml-border-radius: 6px; border-radius: 6px; border-radius: 6px 6px 6px 6px; } .multi-wizard.instance-wizard .content .section input { float: left; } .multi-wizard.instance-wizard .content .section input[type=radio] { margin: 8px 2px 0 17px; } .multi-wizard.instance-wizard .content .section label { display: block; float: left; margin: 10px 7px 7px; } .multi-wizard.instance-wizard .content .section label.size { color: #647A8E; font-weight: bold; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; } .multi-wizard.instance-wizard .section.custom-size { position: relative; background: #F4F4F4; padding: 7px; border-radius: 4px; } .multi-wizard.instance-wizard .section.custom-iops { position: relative; background: #F4F4F4; padding: 7px; border-radius: 4px; } .multi-wizard.instance-wizard .section.custom-iops-do { position: relative; background: #F4F4F4; padding: 7px; border-radius: 4px; } .multi-wizard.instance-wizard .section.custom-size input[type=radio] { float: left; } .multi-wizard.instance-wizard .section.custom-size input[type=text] { float: left; width: 28px; margin: 6px -1px 0 8px; } .multi-wizard.instance-wizard .section.custom-iops input[type=text] { float: left; width: 28px; margin: 6px -1px 0 8px; } .multi-wizard.instance-wizard .section.custom-iops-do input[type=text] { float: left; width: 28px; margin: 6px -1px 0 8px; } .multi-wizard.instance-wizard .section.custom-size label.error { position: absolute; top: 29px; left: 242px; font-size: 10px; } .instance-wizard .step.data-disk-offering.custom-disk-size .select-container { height: 272px; } .instance-wizard .step.data-disk-offering.custom-iops-do .select-container { height: 240px; } .instance-wizard .step.data-disk-offering.custom-disk-size.custom-iops-do .select-container { height: 176px; } .instance-wizard .step.data-disk-offering.required.custom-disk-size .select-container { height: 315px; } .instance-wizard .step.data-disk-offering.required.custom-iops-do .select-container { height: 295px; } .instance-wizard .step.data-disk-offering.required.custom-disk-size.custom-iops-do .select-container { height: 223px; } .instance-wizard .step.data-disk-offering .custom-iops-do { display: none; } .instance-wizard .step.data-disk-offering.custom-iops-do .custom-iops-do { display: block; } .instance-wizard .step.data-disk-offering .custom-iops-do .field { width: 30%; float: left; margin-bottom: 5px; } .instance-wizard .step.data-disk-offering .custom-iops-do .field label { text-indent: 20px; } .instance-wizard .step.data-disk-offering .custom-iops-do .field input { width: 88%; margin-left: 26px; } /*** Compute offering*/ .instance-wizard .step.service-offering { } .instance-wizard .step.service-offering.custom-size .select-container { height: 235px; } .instance-wizard .step.service-offering.custom-iops .select-container { height: 235px; } .instance-wizard .step.service-offering .custom-size { display: none; } .instance-wizard .step.service-offering .custom-iops { display: none; } .instance-wizard .step.service-offering.custom-size .custom-size { display: block; } .instance-wizard .step.service-offering.custom-iops .custom-iops { display: block; } .instance-wizard .step.service-offering .custom-size .field { width: 30%; float: left; margin-bottom: 13px; } .instance-wizard .step.service-offering .custom-iops .field { width: 30%; float: left; margin-bottom: 13px; } .instance-wizard .step.service-offering .custom-size .field label { text-indent: 20px; } .instance-wizard .step.service-offering .custom-iops .field label { text-indent: 20px; } .instance-wizard .step.service-offering .custom-size .field input { width: 88%; margin-left: 26px; } .instance-wizard .step.service-offering .custom-iops .field input { width: 88%; margin-left: 26px; } /*** Network*/ .multi-wizard.instance-wizard .no-network { background: #FFFFFF; width: 773px; height: 52px; position: absolute; top: 98px; left: 11px; /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; border-radius: 5px 5px 5px 5px; z-index: 1; padding: 162px 0 194px; } .multi-wizard.instance-wizard .no-network p { font-size: 22px; line-height: 25px; } .multi-wizard.instance-wizard .select-network .select table { width: 405px; margin: 4px 12px 0; float: left; } .multi-wizard.instance-wizard .select-network .select table thead { margin: 0; padding: 0; } .multi-wizard.instance-wizard .select-network .select table td { padding: 0; margin: 0; vertical-align: top; } .multi-wizard.instance-wizard .select-network .select table .select-container { margin: 0px; border: 0; height: 223px; } .multi-wizard.instance-wizard .select-network.no-add-network .select table .select-container { height: 282px; } .multi-wizard.instance-wizard .select-network .select.new-network table .select-container { height: 29px; overflow: visible; } .multi-wizard.instance-wizard .select-network .select.new-network table .select-container .select { margin: -12px 0 0; position: relative; text-align: right; } .multi-wizard.instance-wizard .select-network .select.new-network table .select-container .select select { width: 145px; margin: 4px 0 0; /*+placement:shift;*/ position: relative; left: 0; top: 0; } .multi-wizard.instance-wizard .select-network .select.new-network { margin: -17px 0 0; } .multi-wizard.instance-wizard .select-network.no-add-network .select.new-network { display: none !important; } .multi-wizard.instance-wizard .select-network .main-desc { width: 252px; top: 12px; left: 12px; float: left; } .multi-wizard.instance-wizard .select-network .select .secondary-input { float: right; width: 80px; height: 48px; font-size: 11px; border-left: 1px solid #D7D7D7; color: #000000; } .multi-wizard.instance-wizard .select-network .select.advanced .secondary-input { height: 73px; } .multi-wizard.instance-wizard .select-network .select .secondary-input input { margin: 0 !important; padding: 0 !important; /*+placement:shift 9px 21px;*/ position: relative; left: 9px; top: 21px; } .multi-wizard.instance-wizard .select-network .select .secondary-input .name { float: right; /*+placement:shift -16px 22px;*/ position: relative; left: -16px; top: 22px; } .multi-wizard.instance-wizard .select-network .select-container .select { width: 100%; float: left; padding: 0; position: relative; } .multi-wizard.instance-wizard .select-network .select-container .select.advanced { height: 74px; } .multi-wizard.instance-wizard .select-network .select .advanced-options { background: url(../images/sprites.png) -7px -795px; width: 20px; height: 20px; float: right; cursor: pointer; margin-top: 15px; margin-right: 13px; } .multi-wizard.instance-wizard .select-network .select .advanced-options:hover, .multi-wizard.instance-wizard .select-network .select.advanced .advanced-options { background: url(../images/sprites.png) -32px -795px; } .multi-wizard.instance-wizard .select-network .select .specify-ip { display: none; position: absolute; top: 45px; left: 0px; width: 100%; } .multi-wizard.instance-wizard .select-network .select.advanced .specify-ip { display: block; } .multi-wizard.instance-wizard .select-network .select.advanced .specify-ip input { margin: 0px 0 0 15px; width: 138px; } .multi-wizard.instance-wizard .select-network .select-container .select input { margin: 21px 15px 0px; float: left; } .multi-wizard.instance-wizard .select-network .select-container .select label { float: left; font-size: 11px; margin: 4px 0 0 42px; color: #4E6B82; } .multi-wizard.instance-wizard .select-network .select-vpc { float: left; padding: 3px; margin: 7px 0px 7px 7px; } .multi-wizard.instance-wizard .select-network.no-add-network .select-vpc { visibility: hidden !important; } .multi-wizard.instance-wizard .select-network .select-vpc select { width: 124px; } .multi-wizard.instance-wizard .select-network .select-vpc label { font-size: 10px; } /**** New networ*/ .multi-wizard.instance-wizard .select-network .select.new-network { } .multi-wizard.instance-wizard .select-network .select.new-network .advanced-options { /*+placement:shift 379px 15px;*/ position: relative; left: 379px; top: 15px; position: absolute; } .multi-wizard.instance-wizard .select-network .select.new-network .select.advanced { height: 106px; position: relative; } .multi-wizard.instance-wizard .select-network .select.new-network.unselected .select.advanced { height: auto; } .multi-wizard.instance-wizard .select-network .select.new-network .select.advanced .specify-ip { top: 74px; left: 29px; } .multi-wizard.instance-wizard .select-network .select.new-network .hide-if-selected { display: none; } .multi-wizard.instance-wizard .select-network .select.new-network.unselected .hide-if-unselected { display: none; } .multi-wizard.instance-wizard .select-network .select.new-network.unselected .hide-if-selected { display: block; } .multi-wizard.instance-wizard .select-network .select.new-network input { margin-top: 24px; } .multi-wizard.instance-wizard .select-network .select.new-network .field { /*+placement:shift 41px 21px;*/ position: relative; left: 41px; top: 21px; font-size: 11px; color: #000000; position: absolute; } .multi-wizard.instance-wizard .select-network .select.new-network .field .name { width: 99px; float: left; padding: 3px 0 0; /*[empty]display:;*/ } .multi-wizard.instance-wizard .select-network .select.new-network .field .value { float: left; } .multi-wizard.instance-wizard .select-network .select.new-network .field .value input { width: 138px; margin: 0 0 0 11px; } .multi-wizard.instance-wizard .select-network .select.new-network label.error { display: none !important; } .multi-wizard.instance-wizard .select-network .select.new-network .secondary-input { width: 97px; padding: 13px 0 17px; } .multi-wizard.instance-wizard .select-network .select.new-network .secondary-input .name { margin: 0 17px 0 0; } .multi-wizard.instance-wizard .select-network .select.new-network .select-desc { width: 255px; } .multi-wizard.instance-wizard .select-network .select-container .select .select-desc .desc { font-size: 11px; color: #808080; float: left; max-width: 113px; } .multi-wizard.instance-wizard .select-network .select-container .select .select-desc .name { width: 116px; font-size: 11px; font-weight: normal; float: left; color: #000000; margin: 0 16px 0 0; } .multi-wizard.instance-wizard .select-network .select.new-network .select-desc .name { width: 99px; margin: 4px 0 0; } .multi-wizard.instance-wizard .select-network .select.new-network.unselected .select-desc .name { color: #808080; } .multi-wizard.instance-wizard .select-network .select.new-network .select-desc .desc { } /*** Confirmation*/ .multi-wizard .review { } .multi-wizard .review .select-container { } .multi-wizard .review .select-container .select { height: 35px; padding: 0; } .multi-wizard .review .select-container .select .name { float: left; margin: 13px 22px 0 14px; width: 127px; font-size: 11px; } .multi-wizard .review .select-container .select .value { float: left; margin: 9px 21px 0; width: 136px; } .multi-wizard .review .select-container .select .value span { font-size: 10px; } .multi-wizard .review .select-container .select .edit { float: right; cursor: pointer; height: 18px; margin: 11px 20px 0 0px; background: url(../images/icons.png) -10px -452px; padding: 0px 0px 0 20px; } .multi-wizard .review .select-container .select.odd .edit a { background: #EBEFF4; } .multi-wizard .review .select-container .select .edit a { font-size: 10px; color: #0000FF; text-decoration: none; padding: 5px 0 8px; background: #FFFFFF; } .multi-wizard .review .select-container .select input, .multi-wizard .review .select-container .select select { margin: 0; width: 151px; float: left; } /*** Diagram*/ .multi-wizard.instance-wizard .diagram { width: 1px; height: 502px; position: absolute; top: 109px; left: 465px; } .multi-wizard.instance-wizard .diagram .part { background: url(../images/instance-wizard-parts.png) no-repeat 0px 0px; } .multi-wizard.instance-wizard .diagram .part.zone-plane { width: 354px; height: 117px; background-position: 0px -55px; /*+placement:displace -38px 259px;*/ position: absolute; margin-left: -38px; margin-top: 259px; } .multi-wizard.instance-wizard .diagram .part.computer-tower-front { width: 95px; height: 254px; background-position: -54px -210px; /*+placement:displace 44px 92px;*/ position: absolute; margin-left: 44px; margin-top: 92px; } .multi-wizard.instance-wizard .diagram .part.computer-tower-back { width: 194px; height: 271px; background-position: -148px -192px; /*+placement:displace 138px 74px;*/ position: absolute; margin-left: 138px; margin-top: 74px; } .multi-wizard.instance-wizard .diagram .part.os-drive { width: 194px; height: 86px; background-position: -348px -192px; /*+placement:displace 138px 74px;*/ position: absolute; margin-left: 138px; margin-top: 74px; } .multi-wizard.instance-wizard .diagram .part.cpu { width: 194px; height: 49px; background-position: -344px -278px; /*+placement:displace 138px 156px;*/ position: absolute; margin-left: 138px; margin-top: 156px; } .multi-wizard.instance-wizard .diagram .part.hd { width: 194px; height: 44px; background-position: -344px -331px; /*+placement:displace 138px 208px;*/ position: absolute; margin-left: 138px; margin-top: 208px; } .multi-wizard.instance-wizard .diagram .part.network-card { width: 194px; height: 44px; background-position: -344px -380px; /*+placement:displace 138px 260px;*/ position: absolute; margin-left: 138px; margin-top: 260px; } /** Add zone wizard*/ .multi-wizard.zone-wizard { display: block; height: 675px; } .multi-wizard.zone-wizard ul.subnav { text-align: left; /*+placement:shift 30px 104px;*/ position: relative; left: 30px; top: 104px; position: absolute; list-style: disc inside; } .multi-wizard.zone-wizard ul.subnav li { float: left; padding: 0; font-size: 12px; white-space: nowrap; text-transform: uppercase; list-style: none; height: 20px; margin-right: 34px; color: #9A9A9A; } .multi-wizard.zone-wizard ul.subnav li:after { content: ">"; font-size: 13px; /*+placement:shift 4px -1px;*/ position: relative; left: 4px; top: -1px; } .multi-wizard.zone-wizard ul.subnav li.active { color: #0000FF; } .multi-wizard.zone-wizard .ui-tabs-panel { height: 422px; overflow: auto; overflow-x: hidden; } .multi-wizard.zone-wizard ul.ui-tabs-nav { /*+placement:shift 0px 0px;*/ position: relative; left: 0px; top: 0px; float: left; margin: 6px 0 3px 3px; } .multi-wizard.zone-wizard .select-container { height: 333px; overflow: auto; } .multi-wizard.zone-wizard .setup-guest-traffic .select-container { background: #E9EAEB; overflow: hidden; } .multi-wizard.zone-wizard .setup-guest-traffic.basic .select-container { background: #FFFFFF; } .multi-wizard.zone-wizard .main-desc { width: 516px; float: left; /*+placement:shift 0;*/ position: relative; left: 0; top: 0; margin: 23px 0 0px 6px; font-weight: 100; font-size: 14px; color: #424242; } .multi-wizard.zone-wizard .review .main-desc.pre-setup { width: 90%; font-size: 18px; color: #2C4159; background: url(../images/icons.png) no-repeat 74px -224px; padding: 1px 0 1px 20px; text-align: center; margin-left: 50px; font-weight: 100; /*+placement:shift 0px 153px;*/ position: relative; left: 0px; top: 153px; left: -10px; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; } .multi-wizard.zone-wizard .info-desc { font-size: 11px; float: left; text-align: left; overflow: auto; overflow-x: hidden; padding: 11px; width: 698px; margin: 29px 0 68px 5px; background: #FFFFFF; border: 1px solid #C7C7C7; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .multi-wizard.zone-wizard .setup-storage-traffic .info-desc { margin-bottom: 10px; } .multi-wizard.zone-wizard .setup-public-traffic .info-desc, .multi-wizard.zone-wizard .setup-guest-traffic .info-desc, .multi-wizard.zone-wizard .setup-physical-network .info-desc { margin-bottom: 12px; } .multi-wizard.zone-wizard .info-desc strong { font-weight: bold; } .multi-wizard.zone-wizard .main-desc em { text-decoration: underline; font-weight: bold; } .multi-wizard.zone-wizard .buttons { top: 609px; } .multi-wizard.zone-wizard .progress ul { width: 776px; } .multi-wizard.zone-wizard .progress ul li { width: 107px; margin-left: 7px; padding: 0 32px 0 0; } .multi-wizard.zone-wizard .progress ul li span { width: 102px; left: 28px; } .multi-wizard.zone-wizard .progress ul li span.number { left: -28px; } .multi-wizard.zone-wizard .progress ul li span.arrow { margin: -4px 0 0 109px; } .multi-wizard.zone-wizard .select-network .content .section { width: 665px; height: 430px; /*+placement:shift 0px 14px;*/ position: relative; left: 0px; top: 14px; } .multi-wizard.zone-wizard .select-network .content { width: 100%; height: 461px; float: none; margin: 7px auto auto; padding-bottom: 28px; } .multi-wizard.zone-wizard .select-network-model .select-area { height: 181px; width: 586px; position: relative; } .multi-wizard.zone-wizard .select-network-model .select-area.basic-zone { height: 105px; } .multi-wizard.zone-wizard .select-network-model .select-area.advanced-zone { height: 233px; } .multi-wizard.zone-wizard .select-network-model .select-area .isolation-mode { height: 98px; overflow: hidden; float: left; margin: 5px 0 0; position: absolute; top: 114px; left: 9px; } .multi-wizard.zone-wizard .select-network-model .select-area.disabled .isolation-mode { /*+opacity:50%;*/ filter: alpha(opacity=50); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); -moz-opacity: 0.5; opacity: 0.5; } .multi-wizard.zone-wizard .select-network-model .select-area.disabled .isolation-mode input { } .multi-wizard.zone-wizard .select-network-model .select-area .isolation-mode .title { font-size: 15px; color: #5D7387; /*+placement:shift 36px 2px;*/ position: relative; left: 36px; top: 2px; } .multi-wizard.zone-wizard .select-network-model .select-area .desc { width: 373px; height: 70px; color: #727272; background: #EFEFEF; padding: 12px 18px 25px; /*+placement:shift -27px 12px;*/ position: relative; left: -27px; top: 12px; /*+border-radius:7px;*/ -moz-border-radius: 7px; -webkit-border-radius: 7px; -khtml-border-radius: 7px; border-radius: 7px; border-radius: 7px 7px 7px 7px; line-height: 19px; } .multi-wizard.zone-wizard .select-network-model .select-area.basic-zone .desc { padding-bottom: 4px; } .multi-wizard.zone-wizard .select-network-model .select-area .desc em { font-weight: bold; text-decoration: underline; } .multi-wizard.zone-wizard .select-network-model .select-area .isolation-mode .select-area { width: 586px; height: 61px; overflow: hidden; margin: 0; padding: 0px 0 9px; background: none; } .multi-wizard.zone-wizard .select-network-model .select-area .isolation-mode .select-area label { font-size: 11px; margin: 24px 0 0 2px; } .multi-wizard.zone-wizard .select-network-model .select-area .isolation-mode .select-area input { margin: 26px 0 11px; } .multi-wizard.zone-wizard .select-network-model .select-area .isolation-mode .select-area input { margin: 24px 8px 0 12px !important; padding: 0 !important; } .multi-wizard.zone-wizard .select-network-model .select-area .isolation-mode .select-area .desc { padding: 6px 7px 11px; width: 388px; height: 29px; font-size: 11px; margin-right: 9px; background: #EFEFEF; float: right; /*+placement:shift -27px 12px;*/ position: relative; left: -27px; top: 12px; } .multi-wizard.zone-wizard .content.input-area { width: 721px; min-height: inherit; margin: -50px auto auto 4px; overflow: auto; overflow-x: hidden; } /*** Add physical network -- network form items*/ .multi-wizard.zone-wizard .setup-physical-network .content.input-area { width: 627px; height: 396px; background: transparent; position: relative; } .multi-wizard.zone-wizard .setup-physical-network .drag-helper-icon { width: 80px; height: 84px; background: url(../images/sprites.png) no-repeat 0px -1365px; /*+placement:shift 134px 303px;*/ position: relative; left: 134px; top: 303px; position: absolute; } .multi-wizard.zone-wizard .select-container.multi { display: inline-block; width: 490px; margin: 6px auto auto; float: right; height: auto; border: 1px solid #BFBFBF; overflow: visible; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; /*+box-shadow:inset 0px 1px 2px #CBCACA;*/ -moz-box-shadow: inset 0px 1px 2px #CBCACA; -webkit-box-shadow: inset 0px 1px 2px #CBCACA; -o-box-shadow: inset 0px 1px 2px #CBCACA; box-shadow: inset 0px 1px 2px #CBCACA; background: #F8F6F6; /*[empty]display:;*/ } .multi-wizard.zone-wizard .select-container.multi.disabled { border: 1px dotted #A7A7A7; /*+opacity:40%;*/ filter: alpha(opacity=40); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); -moz-opacity: 0.4; opacity: 0.4; } .multi-wizard.zone-wizard .select-container.multi .physical-network-icon { width: 61px; height: 53px; float: left; border-right: 1px solid #CDCDCD; background: url(../images/sprites.png) -109px -1393px; } .multi-wizard.zone-wizard .select-container.multi input { width: 195px !important; margin: 2px 0 0 17px !important; } .multi-wizard.zone-wizard .select-container.multi .field { width: 425px; height: 46px; margin-top: -6px; } .multi-wizard.zone-wizard .select-container.multi .field .name { width: 93%; margin-left: 17px; } .multi-wizard.zone-wizard .select-container.multi .drop-container { background: #DAE2EC; width: 484px; height: 114px; clear: both; position: relative; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border: 3px dashed #BBBFC4; } .multi-wizard.zone-wizard .select-container.multi .drop-container ul { background: #DAE2EC; /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; border-radius: 5px 5px 5px 5px; width: 99%; height: 94%; top: 4px; left: 2px; position: absolute; } .multi-wizard.zone-wizard .select-container.multi .drop-container ul.active { background: #DFEAFF; } .multi-wizard.zone-wizard .select-container.multi .drop-container ul li { float: left; margin: 2px 17px 0 29px; } .multi-wizard.zone-wizard .select-container.multi .drop-container span.empty-message { text-align: center; color: #959BA0; font-size: 13px; /*+placement:shift 0px 45px;*/ position: relative; left: 0px; top: 45px; } /*** Add physical network -- traffic type drag area*/ .multi-wizard.zone-wizard .traffic-types-drag-area { width: 96px; height: 370px; background: #F0F1F2; border: 1px solid #DCCACA; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; float: left; text-align: left; padding: 0; margin: 8px 0 0; /*+placement:shift 3px 0px;*/ position: relative; left: 3px; top: 0px; } .multi-wizard.zone-wizard .traffic-types-drag-area .header { margin: 0; font-size: 13px; font-weight: bold; color: #5C5C5C; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; background: #F8F8F8; text-align: center; padding: 8px 0 7px; /*+border-radius:4px 4px 0 0;*/ -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; -khtml-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; border-bottom: 1px solid #DCCACA; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul { width: 100%; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li { float: left; font-size: 11px; width: 100%; background: transparent; height: 83px; margin: 16px 13px 0 0; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li.required { display: none; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li.required.clone { display: block; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li ul.container { width: 60px; height: 54px; margin-left: 16px; background: #E4E4E4; /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; border-radius: 5px 5px 5px 5px; /*+box-shadow:inset 0px 2px 4px #999696;*/ -moz-box-shadow: inset 0px 2px 4px #999696; -webkit-box-shadow: inset 0px 2px 4px #999696; -o-box-shadow: inset 0px 2px 4px #999696; box-shadow: inset 0px 2px 4px #999696; border-bottom: 1px solid #FFFFFF; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li ul.container li { /*+placement:shift 1px 2px;*/ position: relative; left: 1px; top: 2px; } .multi-wizard.zone-wizard li.traffic-type-draggable { display: block; background: transparent url(../images/sprites.png) no-repeat 0px -1161px; width: 51px; height: 51px; margin: auto; cursor: move; z-index: 5000; } .multi-wizard.zone-wizard .traffic-types-drag-area li.traffic-type-draggable:hover, .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable:hover { width: 69px !important; height: 66px !important; } .multi-wizard.zone-wizard .traffic-types-drag-area li.traffic-type-draggable:hover, .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable:hover { /*+placement:shift -2px -4px;*/ position: relative; left: -2px; top: -4px; } .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable:hover { /*+placement:shift -8px -6px;*/ position: relative; left: -8px; top: -6px; margin-right: 0px; width: 70px !important; } .multi-wizard.zone-wizard li.traffic-type-draggable.disabled { /*+opacity:50%;*/ filter: alpha(opacity=50); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); -moz-opacity: 0.5; opacity: 0.5; cursor: not-allowed; } .multi-wizard.zone-wizard .traffic-types-drag-area ul > li.disabled { display: none; } .multi-wizard.zone-wizard li.traffic-type-draggable.disabled { /*+opacity:50%;*/ filter: alpha(opacity=50); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); -moz-opacity: 0.5; opacity: 0.5; cursor: not-allowed; } .multi-wizard.zone-wizard li.traffic-type-draggable.management { background-position: 0px -1161px; height: 52px; } .multi-wizard.zone-wizard .traffic-types-drag-area li.traffic-type-draggable.management:hover, .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable.management:hover { background-position: -11px -1225px; } .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable.management:hover { margin-right: -1px; } .multi-wizard.zone-wizard li.traffic-type-draggable.public { width: 53px; height: 53px; background-position: -54px -1160px; } .multi-wizard.zone-wizard .traffic-types-drag-area li.traffic-type-draggable.public:hover, .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable.public:hover { background-position: -87px -1225px; } .multi-wizard.zone-wizard li.traffic-type-draggable.guest { background-position: -113px -1161px; } .multi-wizard.zone-wizard .traffic-types-drag-area li.traffic-type-draggable.guest:hover, .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable.guest:hover { background-position: -166px -1227px; } .multi-wizard.zone-wizard li.traffic-type-draggable.storage { background-position: -170px -1160px; } .multi-wizard.zone-wizard .traffic-types-drag-area li.traffic-type-draggable.storage:hover, .multi-wizard.zone-wizard .select-container.multi li.traffic-type-draggable.storage:hover { background-position: -244px -1224px; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li .info { width: 100%; margin: 5px 0 0 -2px; line-height: 14px; float: left; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li .info .title { text-align: center; font-weight: bold; color: #787879; } .multi-wizard.zone-wizard .traffic-types-drag-area > ul > li .info .desc { display: none; } /*** Traffic type icon -- edit button*/ .multi-wizard.zone-wizard .traffic-type-draggable .edit-traffic-type { display: none; } .multi-wizard.zone-wizard .drop-container .traffic-type-draggable > .edit-traffic-type { cursor: pointer; display: block; width: 59px; height: 23px; padding: 2px 9px 0 12px; background: url(../images/bg-gradients.png) 0px -1342px; border: 1px solid #C4C4C4; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border-top: 1px solid #FFFFFF; /*+placement:shift -16px 70px;*/ position: relative; left: -16px; top: 70px; } .multi-wizard.zone-wizard .drop-container .traffic-type-draggable > .edit-traffic-type:hover { background-position: 0px -105px; color: #FFFFFF; /*+box-shadow:inset 0px -1px 1px #727272;*/ -moz-box-shadow: inset 0px -1px 1px #727272; -webkit-box-shadow: inset 0px -1px 1px #727272; -o-box-shadow: inset 0px -1px 1px #727272; box-shadow: inset 0px -1px 1px #727272; } .multi-wizard.zone-wizard .drop-container .traffic-type-draggable > .edit-traffic-type:hover span { color: #FFFFFF; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } .multi-wizard.zone-wizard .drop-container .traffic-type-draggable:hover > .edit-traffic-type { /*+placement:shift -7px 76px;*/ position: relative; left: -7px; top: 76px; } .multi-wizard.zone-wizard .drop-container .traffic-type-draggable .edit-traffic-type span { text-align: center; font-size: 11px; font-weight: bold; color: #4E73A6; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; } .multi-wizard.zone-wizard .drop-container .traffic-type-draggable .edit-traffic-type span.icon { float: left; background: url(../images/sprites.png) -7px -4px; padding: 7px 11px 0 7px; } .multi-wizard.zone-wizard .traffic-type-draggable .edit-traffic-type span.name { float: left; width: 76px; font-size: 10px; padding: 2px; color: #4E5F6F; background: #DBE1E9; /*+border-radius:4px 4px 0 0;*/ -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; -khtml-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; /*+placement:shift -13px -16px;*/ position: relative; left: -13px; top: -16px; margin-bottom: -13px; border: 1px solid #C3BCBC; border-bottom: 1px solid #D1CDCD; /*+box-shadow:inset 0px 1px 1px #F5F4F4;*/ -moz-box-shadow: inset 0px 1px 1px #F5F4F4; -webkit-box-shadow: inset 0px 1px 1px #F5F4F4; -o-box-shadow: inset 0px 1px 1px #F5F4F4; box-shadow: inset 0px 1px 1px #F5F4F4; } .multi-wizard.zone-wizard .traffic-type-draggable .edit-traffic-type:hover span.name { background: #C4C3C3; } /*** Configure guest network -- tabs*/ .multi-wizard.zone-wizard .setup-guest-traffic .ui-widget-content { width: 682px; height: 281px; border-bottom: none; border-right: none; /*+placement:shift -1px -7px;*/ position: relative; left: -1px; top: -7px; } .multi-wizard.zone-wizard .setup-guest-traffic ul.ui-tabs-nav { width: 456px; /*+placement:shift -4px -8px;*/ position: relative; left: -4px; top: -8px; } .multi-wizard.zone-wizard .setup-guest-traffic .main-desc { margin-top: 27px; margin-left: -3px; } .multi-wizard.zone-wizard .setup-guest-traffic .content { margin-left: -4px; margin-top: 2px; } /*** Multi-edit*/ .multi-wizard.zone-wizard .multi-edit { width: 732px; float: left; margin-left: 0px; } .multi-wizard.zone-wizard .multi-edit table { float: left; width: 98%; } .multi-wizard.zone-wizard .multi-edit table td, .multi-wizard.zone-wizard .multi-edit table th { padding: 4px; } .multi-wizard.zone-wizard .multi-edit table th { padding-top: 11px; padding-bottom: 8px; } .multi-wizard.zone-wizard .multi-edit table input { margin: 2px 0px 2px -5px; padding: 2px 0px; } .multi-wizard.zone-wizard .multi-edit .data { float: left; overflow: visible; } .multi-wizard.zone-wizard .multi-edit .data-body { margin: 0; } .multi-wizard.zone-wizard .multi-edit .data-body .data-item { float: left; } .multi-wizard.zone-wizard .multi-edit .data-body .data-item td { padding-top: 8px; padding-bottom: 8px; } .multi-wizard.zone-wizard .multi-edit .data-body .data-item td span { font-size: 10px; text-overflow: ellipsis; max-width: 91px; } /*** Select container fields*/ .multi-wizard.zone-wizard .select-container .field { width: 100%; padding-bottom: 13px; float: left; } .multi-wizard.zone-wizard .select-container .field.odd { background: #EBEFF5; } .multi-wizard.zone-wizard .select-container .field .name { float: left; margin: 18px 0 0 12px; width: 95px; font-size: 11px; text-align: left; line-height: 13px; } .multi-wizard.zone-wizard .select-container .field .value { float: left; position: relative; } .multi-wizard.zone-wizard .select-container .field .value span { display: block; font-size: 11px; color: #052060; margin: 20px 0 0; } .multi-wizard.zone-wizard .select-container .field .value label.error { color: #FF0000; font-size: 10px; position: absolute; display: block; text-align: left; margin: 2px 0 0 16px; float: right; /*+placement:shift 1px 31px;*/ position: relative; left: 1px; top: 31px; position: absolute; } .multi-wizard.zone-wizard .select-container .field .value input, .multi-wizard.zone-wizard .select-container .field .value select { width: 316px; height: 12px; margin: 13px 13px 0 18px; float: left; } .multi-wizard.zone-wizard .select-container .field .range-edit .range-item { width: 106px; float: left; } .multi-wizard.zone-wizard .select-container .field .range-edit .range-item input[type=text] { width: 93px; margin: 16px 0 0 17px; } .multi-wizard.zone-wizard .select-container .field .value select { width: 327px; height: 21px; } .multi-wizard.zone-wizard .select-container .field .value input[type=checkbox] { float: left; display: block; width: 13px; } .multi-wizard.zone-wizard .select-container .field .value.multi-range input { float: left; width: 137px; } .multi-wizard.zone-wizard .select-container .field .value.multi-range span { float: left; margin: 13px 0 0; } .multi-wizard.zone-wizard .select-container .field .select-array { width: 360px; display: inline-block; } /*[clearfix]*/.multi-wizard.zone-wizard .select-container .field .select-array-item { width: 175px; height: 34px; float: left; } .multi-wizard.zone-wizard .select-container .field .select-array-item .name { width: 127px; float: right; padding: 0; margin: 11px 0 0; } .multi-wizard.zone-wizard .select-container .field .select-array-item .value { width: 41px; float: right; padding: 0; margin: 0; } .multi-wizard.zone-wizard .select-container .field .select-array-item .value input { width: inherit; margin: 12px 0 0 11px; } .multi-wizard.zone-wizard .setup-physical-network .button.add.new-physical-network { background: #808080 url(../images/bg-gradients.png) 0px -264px; visibility: hidden; border: 1px solid #ADA7A7; padding: 6px 20px 6px 11px; font-size: 12px; float: right; margin: 14px 6px 0 0; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; color: #475765; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; cursor: pointer; } .multi-wizard.zone-wizard .setup-physical-network .button.remove.physical-network { padding: 10px 10px 0px; background: url(../images/sprites.png) -6px -93px; cursor: pointer; position: relative; float: right; top: 27px; margin: -26px 0 0; } .multi-wizard.zone-wizard .setup-physical-network .select-container.disabled .button.remove.physical-network { display: none; } .multi-wizard.zone-wizard .setup-physical-network .button.remove.physical-network:hover { background-position: -6px -675px; } .multi-wizard.zone-wizard .setup-physical-network .button.add.new-physical-network:hover { background-position: 0px -349px; color: #000000; /*+text-shadow:0px 1px 2px #FFFFFF;*/ -moz-text-shadow: 0px 1px 2px #FFFFFF; -webkit-text-shadow: 0px 1px 2px #FFFFFF; -o-text-shadow: 0px 1px 2px #FFFFFF; text-shadow: 0px 1px 2px #FFFFFF; } .multi-wizard.zone-wizard .setup-physical-network .button.add.new-physical-network .icon { padding: 10px; background: url(../images/sprites.png) -44px -58px; } /*** Review / launch*/ .multi-wizard.zone-wizard .review .launch-container { width: 98%; max-height: 438px; overflow: auto; overflow-x: hidden; float: left; background: #ECECEC 0px -12px; background: #F7F7F7; background: -moz-linear-gradient(top, #f7f7f7 0%, #eaeaea 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#eaeaea)); background: -webkit-linear-gradient(top, #f7f7f7 0%,#eaeaea 100%); background: -o-linear-gradient(top, #f7f7f7 0%,#eaeaea 100%); background: -ms-linear-gradient(top, #f7f7f7 0%,#eaeaea 100%); background: linear-gradient(to bottom, #f7f7f7 0%,#eaeaea 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#eaeaea',GradientType=0 ); margin: 11px 0 0 7px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border: 1px solid #CACACA; border-radius: 4px 4px 4px 4px; } .multi-wizard.zone-wizard .review .launch-container li { width: 100%; text-align: left; padding: 15px 0 15px 12px; font-size: 12px; font-weight: bold; } .multi-wizard.zone-wizard .review .launch-container li .icon { /*[empty]display:;*/ padding: 10px 21px 10px 10px; background: url(../images/icons.png) -2px -217px; } .multi-wizard.zone-wizard .review .launch-container li.loading .icon { background: url(../images/ajax-loader-small.gif) no-repeat 2px 9px; } .multi-wizard.zone-wizard .review .launch-container li.error .icon { background-position: -2px -185px; } .multi-wizard.zone-wizard .review .launch-container li.info .icon { display: none; } /*Tree view*/ .tree-view { width: 24%; height: 98%; overflow: auto; } #browser .tree-view div.toolbar { } .tree-view ul { display: block; width: 85px; } .tree-view ul li { position: relative; left: 21px; font-size: 12px; display: block; margin: 7px 0 0; clear: both; width: 100%; } .tree-view > ul { /*+placement:shift 3px 40px;*/ position: relative; left: 3px; top: 40px; } .tree-view > ul > li { left: 5px; } .tree-view ul li .name { float: left; margin: 1px 0px 13px 17px; padding: 6px 9px 6px 4px; cursor: pointer; } .tree-view ul li .name:hover { text-decoration: underline; } .tree-view ul li .name.selected { background: #DDDCDD; /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; border-radius: 5px 5px 5px 5px; } .tree-view ul li .expand { width: 10px; height: 10px; float: left; background: url(../images/buttons.png) -630px -245px; margin: 4px 5px 0 0; float: left; cursor: pointer; position: absolute; } .tree-view ul li.expanded > .expand { background-position: -631px -228px; } #browser .tree-view div.toolbar div.text-search { float: left; } #navigation ul li.last.active { } .detail-group table tbody { border: none; } div.detail-group td.view-all div.view-all div.end { } /*Dialog-based list view*/ .ui-dialog .list-view { height: 515px !important; overflow: auto; overflow-x: hidden; } .ui-dialog .list-view .toolbar { top: 50px; width: 854px; } div.panel.ui-dialog div.list-view div.fixed-header { top: 55px; left: 35px; width: 759px; height: 49px; background-color: #FFFFFF; margin: 0; z-index: 1; } .ui-dialog .list-view table { top: 9px !important; } .ui-dialog.panel div.list-view div.data-table table { width: 778px; margin-top: 39px; } .ui-dialog.panel div.list-view div.data-table table tbody tr.multi-edit-selected { background: #C3E0FC; } /*List-view: subselect dropdown*/ .list-view .subselect { width: 116px; display: block; float: left; background: url(../images/bg-gradients.png) 0px -42px; padding: 0; margin: 8px 0 1px 7px; clear: both; border: 1px solid #A8A7A7; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .list-view .subselect span { margin: 4px 0 0 12px; } .list-view .subselect select { width: 85%; margin: 5px 0 4px; font-size: 10px; } /*Multi-edit*/ div.container div.panel div#details-tab-addloadBalancer.detail-group div.loadBalancer div.multi-edit form table.multi-edit thead tr th, div.container div.panel div#details-tab-addloadBalancer.detail-group div.loadBalancer div.multi-edit form table.multi-edit tbody tr td { min-width: 100px; } .multi-edit { overflow: auto; } .multi-edit > form { position: relative; clear: both; } .multi-edit table.multi-edit { border-top: none; } .multi-edit table th { min-width: 88px; white-space: nowrap; text-align: center; text-indent: 0; } .detail-group .multi-edit table td { border-left: 1px solid #CDCCCC; } .detail-view .multi-edit input { width: 70%; } .detail-view .multi-edit select { width: 93%; font-size: 10px; } .multi-edit input { width: 85%; } .multi-edit .range { position: relative; } .multi-edit .range .range-item { float: left; } .multi-edit .range input { width: 35px; margin-right: 2px; position: relative; } .multi-edit .range label { display: block; clear: both; /*+placement:shift 3px 2px;*/ position: relative; left: 3px; top: 2px; } .multi-edit label.error { font-size: 10px; margin: 3px 0 0; float: left; } .multi-edit .data-table td span { float: left; } .multi-edit .data-table td.add-vm { cursor: pointer; } .multi-edit th.add-rule, .multi-edit td.add-rule { } .multi-edit .data-table td.add-vm:hover { color: #5FAAF7; } .multi-edit .data-table .fixed-header { display: none; } .multi-edit .button.add-vm { font-size: 10px; font-weight: bold; cursor: pointer; color: #FFFFFF; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; /*+box-shadow:0px 1px 1px #FFFFFF;*/ -moz-box-shadow: 0px 1px 1px #FFFFFF; -webkit-box-shadow: 0px 1px 1px #FFFFFF; -o-box-shadow: 0px 1px 1px #FFFFFF; box-shadow: 0px 1px 1px #FFFFFF; border: 1px solid #858585; border-top: none; /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; border-radius: 5px 5px 5px 5px; width: 74px; text-indent: 0px; text-align: center; padding: 6px 0px 4px; background: url(../images/bg-gradients.png) repeat-x 0px -220px; /*+placement:shift 4px 0px;*/ position: relative; left: 4px; top: 0px; } .multi-edit .button.add-vm:hover { background-position: 0px -241px; /*+box-shadow:inset 0px 1px 1px #000000;*/ -moz-box-shadow: inset 0px 1px 1px #000000; -webkit-box-shadow: inset 0px 1px 1px #000000; -o-box-shadow: inset 0px 1px 1px #000000; box-shadow: inset 0px 1px 1px #000000; } .multi-edit .button.custom-action { background: url(../images/bg-gradients.png) 0px -271px; border: 1px solid #B7B7B7; color: #485867; font-size: 10px; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; } .multi-edit td.disabled .button.add-vm.custom-action { /*+opacity:50%;*/ filter: alpha(opacity=50); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); -moz-opacity: 0.5; opacity: 0.5; cursor: not-allowed; } .multi-edit .button.custom-action:hover { background: #808080 url(../images/bg-gradients.png); color: #FFFFFF; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } .multi-edit-add-list .ui-button.ok, .multi-edit-add-list .ui-button.cancel { float: right; /*+placement:shift 506px -18px;*/ position: relative; left: 506px; top: -18px; height: 23px; } .multi-edit-add-list .ui-button.cancel { /*+placement:shift 492px -18px;*/ position: relative; left: 492px; top: -18px; border: none; background: transparent; color: #808B95; font-weight: bold; } .multi-edit .data .data-body { margin: auto auto auto 11px; overflow: hidden; } .panel.always-maximized .multi-edit .data .data-body { width: 96%; margin: 0 0 0 12px; } .multi-edit .data .data-body .data-item { margin-bottom: 14px; border: 1px solid #CDCCCC; position: relative; } .multi-edit .data .data-body .data-item .loading-overlay { background-position: 50% 50%; } .multi-edit .data .data-body .data-item.loading { height: 28px; background: #FFFFFF url(../images/ajax-loader.gif) no-repeat center; border: 1px solid #DDDDDD; } .multi-edit .data .data-body .data-item.loading .label { color: #808080; font-size: 12px; text-align: center; text-indent: 19%; margin: 12px 0 0; } .multi-edit .data .data-body .data-item table { margin: 0; border: none; width: 100%; overflow: hidden; background: #F0F1F2; } .multi-edit .data .data-body .data-item tr { background: #EFEFEF; border: none; } .multi-edit .data .data-body .data-item table tbody tr td { background: #F0F1F2; border-left: none; border-right: 1px solid #CFC9C9; height: 15px; overflow: auto; padding-right: 0; } .multi-edit .data .data-body .data-item > table tbody tr td span { overflow: hidden; max-width: 78px; display: block; float: left; text-overflow: ellipsis; white-space: nowrap; } .multi-edit .data .data-body .data-item table tbody tr td.blank { } .multi-edit .data .data-body .data-item table tbody tr td.name { padding-top: 9px; } .multi-edit .data .data-body .data-item table tbody tr td.name span { width: 53px; color: #4C5D78; font-weight: bold; } .multi-edit .data .data-body .data-item .expandable-listing table tbody tr td.name span { color: #4C5D78; font-weight: normal; cursor: pointer; } .multi-edit .data .data-body .data-item .expandable-listing table tbody tr td.name span:hover { color: #0000FF; } .multi-edit .data .data-body .data-item table tbody tr td.multi-actions { border-right: none; } .multi-edit .data .data-body .data-item table tbody tr td.multi-actions .action { cursor: pointer; width: 28px; height: 21px; float: left; } .multi-edit .data .data-body .data-item table tbody tr td.multi-actions .action span.icon { background-image: url(../images/sprites.png); cursor: pointer; width: 28px; height: 21px; float: left; } .multi-edit .data .data-body .data-item tr td .expand { width: 14px; height: 15px; display: block; cursor: pointer; background: #FFFFFF url(../images/sprites.png) -541px -499px; border: 1px solid #D0D0D0; /*+border-radius:9px;*/ -moz-border-radius: 9px; -webkit-border-radius: 9px; -khtml-border-radius: 9px; border-radius: 9px; border-radius: 9px 9px 9px 9px; float: left; margin: -3px 0 0 11px; } .multi-edit .data .data-body .data-item tr td.add-vm, .multi-edit tr th.add-vm { cursor: pointer; } .multi-edit .data .data-body .data-item tr td .custom-action { margin: -2px 0 0 0px; } .multi-edit .data .data-body .data-item tr td.add-vm:hover { color: #0060FF; font-weight: bold; } .multi-edit .data .data-body .data-item tr td.add-vm p { text-indent: 0; padding-left: 9px; margin-top: 3px; margin-bottom: 6px; } .multi-edit .data .data-body .data-item tr td.multi-actions .icon { /*+placement:shift -3px -2px;*/ position: relative; left: -3px; top: -2px; } .multi-edit .data .data-body .data-item .expandable-listing { width: 99.8%; border: 1px solid #CFC9C9; max-height: 161px; overflow: auto; overflow-x: hidden; } .multi-edit .data .data-body .data-item .expandable-listing tr { width: 100%; border: none; margin: 0; padding: 0; } .multi-edit .data .data-body .data-item .expandable-listing tr td { background: #DDE0E2; border: none; margin: 0; text-indent: 37px; } .multi-edit .data .data-body .data-item .expandable-listing tr.odd td { background: #F2F0F0; } .ui-tabs-panel .add-by { font-size: 12px; color: #536474; width: 94%; margin: 13px 0 0 14px; } .ui-tabs-panel .add-by .selection { width: 236px; margin: 8px 0 0; } .ui-tabs-panel .add-by .selection input { margin: 0 6px 0 0; } .ui-tabs-panel .add-by .selection label { margin: 0 22px 0 0; } /** Fix long table overflow*/ .detail-view .multi-edit { width: 100%; } .detail-view .multi-edit table { width: 97%; max-width: inherit; } .detail-view .multi-edit table tr th, .detail-view .multi-edit table tr td { width: 87px !important; min-width: 87px !important; max-width: 87px !important; font-size: 10px; } /** Header fields*/ .multi-edit .header-fields { position: relative; /*+placement:shift 14px 11px;*/ position: relative; left: 14px; top: 11px; } .multi-edit .header-fields .form-container { width: 96%; height: 32px; background: #E4E4E4; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border: 1px solid #D4CFCF; } .multi-edit .header-fields .form-item { padding: 4px 15px 3px 9px; margin-bottom: 32px; margin-right: 0; float: left; } .multi-edit .header-fields .form-item input, .multi-edit .header-fields .form-item select { margin-top: 4px; } .multi-edit .header-fields .form-item .name, .multi-edit .header-fields .form-item .value { float: left; } .multi-edit .header-fields .form-item .name { font-size: 14px; padding: 5px; color: #55687A; } .multi-edit .header-fields input[type=submit] { } /*Sortable*/ .multi-edit table tbody tr td.reorder, .multi-edit table thead tr th.reorder { width: 30px !important; min-width: 30px !important; max-width: 30px !important; } /*Security Rules*/ .security-rules .multi-edit input { width: 69px; margin: 0 0 0 9px; } .security-rules .multi-edit .range input { width: 44px; margin: 0 0 0 8px; } /*Recurring snapshots*/ .recurring-snapshots { display: inline-block; } .recurring-snapshots .schedule { } .recurring-snapshots .schedule .add-snapshot-actions { width: 581px; clear: both; float: left; font-size: 13px; margin-bottom: 13px; border-top: 1px solid #FFFFFF; } .recurring-snapshots .schedule .add-snapshot-action { /*+placement:shift -7px -34px;*/ position: relative; left: -7px; top: -34px; float: right; cursor: pointer; padding: 10px; } .recurring-snapshots .schedule .add-snapshot-action.add { color: #0000FF; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; font-weight: bold; } .recurring-snapshots .schedule .add-snapshot-action.add:hover { color: #1A85F4; } .recurring-snapshots .schedule p { float: left; font-size: 13px; padding: 0; margin: 5px 0 0 14px; } .recurring-snapshots .schedule .forms { width: 436px; float: left; /*+placement:shift 24px 2px;*/ position: relative; left: 24px; top: 2px; } .recurring-snapshots .schedule .forms > div { } .recurring-snapshots .schedule .forms form { font-size: 12px; color: #4F6171; } .recurring-snapshots .schedule .forms form select { float: left; margin: 3px 10px 3px 3px; max-width: 100%; } .recurring-snapshots .schedule .forms form input { /*+placement:shift 1px 4px;*/ position: relative; left: 1px; top: 4px; } .recurring-snapshots .schedule .forms form label { /*+placement:shift 5px 4px;*/ position: relative; left: 5px; top: 4px; } .recurring-snapshots .schedule .forms form label.error { width: 100%; float: left; font-size: 10px; } .recurring-snapshots .schedule .forms form .field { width: 100%; float: left; margin: 8px 0 0; } .recurring-snapshots .schedule .forms form .name { float: left; text-align: right; width: 72px; padding: 4px 0 0; margin: 3px 14px 0 0; } .recurring-snapshots .schedule .forms form .value { width: 470px; float: left; text-align: left; } .ui-dialog .recurring-snapshots .ui-widget-content { padding: 0; margin: 0; } .recurring-snapshots .ui-button { /*+placement:anchor-bottom-right 9px 9px;*/ position: absolute; right: 9px; bottom: 9px; } .recurring-snapshots .scheduled-snapshots { clear: both; display: inline-block; /*+placement:shift 0px -26px;*/ position: relative; left: 0px; top: -26px; } .recurring-snapshots .scheduled-snapshots p { font-weight: bold; font-size: 12px; /*+text-shadow:0px 2px 2px #FFFFFF;*/ -moz-text-shadow: 0px 2px 2px #FFFFFF; -webkit-text-shadow: 0px 2px 2px #FFFFFF; -o-text-shadow: 0px 2px 2px #FFFFFF; text-shadow: 0px 2px 2px #FFFFFF; text-indent: 12px; padding-bottom: 8px; } .recurring-snapshots .scheduled-snapshots table { border: none; /*+placement:shift 0px -14px;*/ position: relative; left: 0px; top: -14px; width: 564px; } .recurring-snapshots .scheduled-snapshots table td.actions div.action span.icon { /*+placement:shift -3px -4px;*/ position: relative; left: -3px; top: -4px; } .recurring-snapshots .scheduled-snapshots tr { padding: 0; border: 0; display: block; width: 100%; height: 38px; margin: 22px 0 0; display: none; } .recurring-snapshots .scheduled-snapshots tr td { border: none; min-width: 102px; padding: 5px 0px 0 14px; font-size: 12px; word-break: keep-all; word-wrap: normal; text-indent: 0px; } .recurring-snapshots .scheduled-snapshots tr td.keep { min-width: 60px; } .recurring-snapshots .scheduled-snapshots tr td.timezone { min-width: 168px; font-size: 12px; } .recurring-snapshots .scheduled-snapshots tr td.timezone span { font-size: 10px; } .recurring-snapshots .scheduled-snapshots table tbody tr td.actions { max-width: 22px !important; min-width: 22px; } .recurring-snapshots .scheduled-snapshots tr td.time { min-width: 144px; background: url(../images/sprites.png) no-repeat -536px -533px; text-indent: 0.7em; } .recurring-snapshots .scheduled-snapshots tr.daily td.time { background-position: -537px -569px; } .recurring-snapshots .scheduled-snapshots tr.weekly td.time { background-position: -537px -605px; } .recurring-snapshots .scheduled-snapshots tr.monthly td.time { background-position: -537px -648px; } .recurring-snapshots p { text-align: left; font-size: 14px; line-height: 18px; padding: 0 47px 0 0; color: #475765; margin-bottom: 16px; /*+text-shadow:0px 3px 3px #FFFFFF;*/ -moz-text-shadow: 0px 3px 3px #FFFFFF; -webkit-text-shadow: 0px 3px 3px #FFFFFF; -o-text-shadow: 0px 3px 3px #FFFFFF; text-shadow: 0px 3px 3px #FFFFFF; max-width: 550px; display: block; } .recurring-snapshots .ui-tabs ul { position: relative; margin: 0; width: 100%; padding: 0; margin: 0; display: block; } .recurring-snapshots .ui-tabs ul li a { width: 76px; text-indent: 28px; margin: 0 14px 0 0; padding: 8px 0 5px; background: url(../images/sprites.png) no-repeat -521px -540px; border: none; } .recurring-snapshots .ui-tabs ul li.disabled a { /*+opacity:50%;*/ filter: alpha(opacity=50); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); -moz-opacity: 0.5; opacity: 0.5; } .recurring-snapshots .ui-tabs ul li.disabled:hover a { border: none; background-color: transparent; border: none; /*+box-shadow:0px 0px;*/ -moz-box-shadow: 0px 0px; -webkit-box-shadow: 0px 0px; -o-box-shadow: 0px 0px; box-shadow: 0px 0px; -moz-box-shadow: 0px 0px none; -webkit-box-shadow: 0px 0px none; -o-box-shadow: 0px 0px none; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; cursor: default; } .recurring-snapshots .ui-tabs ul li.ui-state-active a, .recurring-snapshots .ui-tabs ul li:hover a { background-color: #DFDFDF; /*+border-radius:8px;*/ -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; border-radius: 8px 8px 8px 8px; /*+box-shadow:inset 0px 1px 2px #4E4E4E;*/ -moz-box-shadow: inset 0px 1px 2px #4E4E4E; -webkit-box-shadow: inset 0px 1px 2px #4E4E4E; -o-box-shadow: inset 0px 1px 2px #4E4E4E; box-shadow: inset 0px 1px 2px #4E4E4E; } .recurring-snapshots .ui-tabs ul li.daily a { background-position: -522px -577px; } .recurring-snapshots .ui-tabs ul li.weekly a { background-position: -526px -612px; } .recurring-snapshots .ui-tabs ul li.monthly a { background-position: -528px -656px; } .recurring-snapshots .ui-tabs div.ui-tabs-panel { height: 144px; width: 576px; border: none; border-bottom: 1px solid #C3C3C3; background: #E9E9E9; margin: 0; padding: 0; /*+placement:shift -89px 0px;*/ position: relative; left: -89px; top: 0px; } .recurring-snapshots .ui-tabs div.ui-tabs-panel.ui-tabs-hide { display: none; } /*Upload volume*/ .upload-volume { } .upload-volume .list-view { margin-top: 5px !important; } .upload-volume .listView-container { background: #FFFFFF; width: 823px; margin: 71px 0px 20px 28px; border: 1px solid #DADADA; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .upload-volume div.list-view .data-table div.fixed-header { top: 115px !important; left: 56px !important; background: #FFFFFF !important; } .upload-volume .data-table table.body { margin-top: 66px !important; margin-left: 19px; } .upload-volume .list-view .toolbar { top: 118px; width: 801px; left: 43px; background: transparent; border: none; } .upload-volume .top-fields { float: left; clear: none; margin-left: 24px; } .upload-volume .top-fields .field { float: left; margin-right: 50px; } .upload-volume .top-fields input { float: right; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; border-radius: 3px 3px 3px 3px; padding: 2px; width: 186px; } .upload-volume .top-fields label, .upload-volume .desc { display: block; float: left; padding: 6px; font-size: 12px; color: #4C5D6C; /*+text-shadow:0px 0px #FFFFFF;*/ -moz-text-shadow: 0px 0px #FFFFFF; -webkit-text-shadow: 0px 0px #FFFFFF; -o-text-shadow: 0px 0px #FFFFFF; text-shadow: 0px 0px #FFFFFF; } .upload-volume .desc { position: absolute; width: 825px; text-align: left; top: 79px; left: 32px; border-top: 1px solid #CFCFCF; } /*Network detail chat*/ .network-chart { width: 100%; height: 100%; position: relative; background: url(../images/bg-network.png) no-repeat 38% 70px; } .network-chart.static-nat { background: url(../images/bg-network-nat.png) no-repeat 31% 62px; } .network-chart ul { width: 536px; height: 421px; position: absolute; top: 0px; left: 0px; } .network-chart li { display: block; width: 147px; height: 86px; background: url(../images/buttons.png) no-repeat 0px -399px; } .network-chart li.static-nat-enabled { /*+placement:shift 31px 44px;*/ position: relative; left: 31px; top: 44px; } .network-chart li.static-nat-enabled .vmname { /*+placement:shift 16px 41px;*/ position: relative; left: 16px; top: 41px; cursor: pointer; max-width: 98px; max-height: 21px; padding: 7px; font-size: 10px; position: absolute; overflow: hidden; color: #485563; font-weight: bold; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; background: url(../images/bg-gradients.png) repeat-x 2px -221px; color: #FFFFFF; /*+border-radius:9px;*/ -moz-border-radius: 9px; -webkit-border-radius: 9px; -khtml-border-radius: 9px; border-radius: 9px; border-radius: 9px 9px 9px 9px; } .network-chart li.static-nat-enabled .vmname:hover { background-position: 0px -946px; } .network-chart li.static-nat-enabled .name { background: url(../images/sprites.png) no-repeat -6px -460px; } .network-chart li.static-nat-enabled .name span { font-size: 11px; padding: 0 0 0 25px; } .network-chart li.disabled { /*+opacity:100%;*/ filter: alpha(opacity=100); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); -moz-opacity: 1; opacity: 1; } .network-chart li.firewall { /*+placement:shift 282px 188px;*/ position: relative; left: 282px; top: 188px; position: absolute; } .network-chart li.loadBalancing { /*+placement:shift 167px 342px;*/ position: relative; left: 167px; top: 342px; position: absolute; } .network-chart li.portForwarding { /*+placement:shift 401px 342px;*/ position: relative; left: 401px; top: 342px; position: absolute; } .network-chart li .name { color: #4E5F6F; width: 130px; /*+text-shadow:0px 1px 1px #FCFCFC;*/ -moz-text-shadow: 0px 1px 1px #FCFCFC; -webkit-text-shadow: 0px 1px 1px #FCFCFC; -o-text-shadow: 0px 1px 1px #FCFCFC; text-shadow: 0px 1px 1px #FCFCFC; /*+placement:shift 10px 11px;*/ position: relative; left: 10px; top: 11px; } .network-chart li.disabled .name { color: #8695A5; /*+placement:shift 5px 32px;*/ position: relative; left: 5px; top: 32px; text-decoration: line-through; text-align: center; } .network-chart li .view-details { /*+placement:anchor-bottom-right 34px 19px;*/ position: absolute; right: 34px; bottom: 19px; cursor: pointer; background: #F7F7F7; background: rgb(247, 247, 247); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2Y3ZjdmNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlYWVhZWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(247,247,247,1) 1%, rgba(234,234,234,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(247,247,247,1)), color-stop(100%,rgba(234,234,234,1))); background: -webkit-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); background: -o-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); background: -ms-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); background: linear-gradient(to bottom, rgba(247,247,247,1) 1%,rgba(234,234,234,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#eaeaea',GradientType=0 ); font-size: 11px; padding: 8px 20px; color: #000000; border: 1px solid #A2A2A2; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .network-chart li .view-details:hover { background: #D5D5D5; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; /*+box-shadow:inset 0px 0px 4px #000000;*/ -moz-box-shadow: inset 0px 0px 4px #000000; -webkit-box-shadow: inset 0px 0px 4px #000000; -o-box-shadow: inset 0px 0px 4px #000000; box-shadow: inset 0px 0px 4px #000000; } .network-chart li.disabled .view-details { display: none; } /*System Dashboard*/ .system-dashboard { height: 258px; width: 762px; display: block; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; /*+box-shadow:inset 0px 0px 1px #FFFFFF;*/ -moz-box-shadow: inset 0px 0px 1px #FFFFFF; -webkit-box-shadow: inset 0px 0px 1px #FFFFFF; -o-box-shadow: inset 0px 0px 1px #FFFFFF; box-shadow: inset 0px 0px 1px #FFFFFF; position: relative; margin: 18px 0 0 15px; } .system-dashboard.zone { height: 609px; background-position: 0px -1423px; } .system-dashboard-view .toolbar { position: relative; } .system-dashboard .head { color: #000000; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; text-indent: 11px; padding: 0px 0 12px; /*+box-shadow:0px 0px 1px #FFFFFF;*/ -moz-box-shadow: 0px 0px 1px #FFFFFF; -webkit-box-shadow: 0px 0px 1px #FFFFFF; -o-box-shadow: 0px 0px 1px #FFFFFF; box-shadow: 0px 0px 1px #FFFFFF; } .project-view .system-dashboard .head { color: #FFFFFF; /*+text-shadow:0px -1px #000000;*/ -moz-text-shadow: 0px -1px #000000; -webkit-text-shadow: 0px -1px #000000; -o-text-shadow: 0px -1px #000000; text-shadow: 0px -1px #000000; /*+box-shadow:none;*/ -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; padding-top: 14px; } .system-dashboard .view-more, .system-dashboard .view-all { float: right; margin: -4px 19px 0 0; cursor: pointer; font-size: 13px; font-weight: 100; background: #DADADA repeat-x 0px -735px; background: rgb(234, 234, 234); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNmQ2ZDYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(234,234,234,1) 0%, rgba(214,214,214,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(234,234,234,1)), color-stop(100%,rgba(214,214,214,1))); background: -webkit-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); background: -o-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); background: -ms-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); background: linear-gradient(to bottom, rgba(234,234,234,1) 0%,rgba(214,214,214,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaeaea', endColorstr='#d6d6d6',GradientType=0 ); /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; border-radius: 3px 3px 3px 3px; border: 1px solid #B5B5B5; } .system-dashboard .view-more:hover, .system-dashboard .view-all:hover { background-position: 0px -763px; /*+box-shadow:inset 0px 1px 1px #000000;*/ -moz-box-shadow: inset 0px 1px 1px #000000; -webkit-box-shadow: inset 0px 1px 1px #000000; -o-box-shadow: inset 0px 1px 1px #000000; box-shadow: inset 0px 1px 1px #000000; background: #C1C1C1; } .system-dashboard .status_box .view-all { /*+placement:shift 18px 110px;*/ position: relative; left: 18px; top: 110px; width: 78%; position: absolute; text-align: center; padding: 8px 0; } .system-dashboard .status_box { font-size: 14px; margin: 10px 0 0; background: transparent; border: none; } .system-dashboard .status_box li { height: 178px; width: 178px; padding: 0; margin: 0 0 0 8px; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; position: relative; border: 1px solid #C6C6C6; float: left; } .system-dashboard.zone .status_box li { margin-bottom: 8px; height: 152px; background-color: #F4F4F4; } .system-dashboard.zone .status_box li .icon { background: url(../images/infrastructure-icons.png) no-repeat 0px 0px; padding: 65px 80px 5px; /*+placement:shift 31px 19px;*/ position: relative; left: 31px; top: 19px; position: absolute; /*+opacity:56%;*/ filter: alpha(opacity=56); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=56); -moz-opacity: 0.56; opacity: 0.56; } .system-dashboard .status_box li span { } .system-dashboard .status_box li span.label { color: #CCCFD4; font-size: 12px; } .system-dashboard .status_box li span.total { font-size: 25px; } .system-dashboard .status_box li span.label { color: #CCCFD4; font-size: 12px; } .system-dashboard .status_box li span.unit { color: #C1C4C9; font-size: 13px; } .system-dashboard .status_box li span.header { margin: 1px 0 0; /*+placement:shift 13px 5px;*/ position: relative; left: 13px; top: 5px; font-weight: 100; } .system-dashboard.zone .status_box li span.header { font-size: 14px; color: #4F4F4F; } .system-dashboard .status_box li span.status { font-size: 27px; /*+placement:shift 13px 141px;*/ position: relative; left: 13px; top: 141px; position: absolute; color: #25FF25; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } .system-dashboard .status_box li span.instance.total { /*+placement:shift 12px 32px;*/ position: relative; left: 12px; top: 32px; position: absolute; } .system-dashboard .status_box li span.instance.label { /*+placement:shift 15px 53px;*/ position: relative; left: 15px; top: 53px; position: absolute; } .system-dashboard .status_box li span.vcpu-hours.total { /*+placement:shift 13px 76px;*/ position: relative; left: 13px; top: 76px; position: absolute; } .system-dashboard .status_box li span.vcpu-hours.label { /*+placement:shift 14px 95px;*/ position: relative; left: 14px; top: 95px; position: absolute; } .system-dashboard .status_box li span.gb-hours.total { /*+placement:shift 106px 77px;*/ position: relative; left: 106px; top: 77px; position: absolute; } .system-dashboard .status_box li span.gb-hours.label { /*+placement:shift 106px 95px;*/ position: relative; left: 106px; top: 95px; position: absolute; } .system-dashboard .status_box li span.overview.total { font-size: 56px; /*+placement:shift 9px 29px;*/ position: relative; left: 9px; top: 29px; position: absolute; font-weight: 100; color: #2B7DAF; /*+text-shadow:0px -1px 2px #FFFFFF;*/ -moz-text-shadow: 0px -1px 2px #FFFFFF; -webkit-text-shadow: 0px -1px 2px #FFFFFF; -o-text-shadow: 0px -1px 2px #FFFFFF; text-shadow: 0px -1px 2px #FFFFFF; } .system-dashboard .status_box li.capacity span.overview.total { font-size: 32px; } .system-dashboard .status_box li span.overview.label { /*+placement:shift 52px 79px;*/ position: relative; left: 52px; top: 79px; position: absolute; } .system-dashboard .status_box li span.used.total { /*+placement:shift 14px 130px;*/ position: relative; left: 14px; top: 130px; font-size: 30px; position: absolute; } .system-dashboard .status_box li span.used.label { /*+placement:shift 14px 153px;*/ position: relative; left: 14px; top: 153px; position: absolute; } .system-dashboard .status_box li span.used.unit { /*+placement:shift 67px 135px;*/ position: relative; left: 67px; top: 135px; position: absolute; } .system-dashboard .status_box li span.available.unit { /*+placement:shift 159px 135px;*/ position: relative; left: 159px; top: 135px; position: absolute; } .system-dashboard .status_box li span.available.total { /*+placement:shift 97px 130px;*/ position: relative; left: 97px; top: 130px; font-size: 30px; position: absolute; } .system-dashboard .status_box li span.available.label { /*+placement:shift 97px 153px;*/ position: relative; left: 97px; top: 153px; position: absolute; } .system-dashboard-view .socket-info { width: 100%; height: 239px; overflow: auto; float: left; padding: 0; } .system-dashboard-view .socket-info > .title { padding: 8px; font-size: 13px; } .system-dashboard-view .socket-info ul { } .system-dashboard-view .socket-info li { width: 139px; padding: 13px; /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; margin: 7px; border: 1px solid #CCC; background: #EFEFEF; float: left; } .system-dashboard-view .socket-info li > div { text-decoration: none; float: left; } .system-dashboard-view .socket-info li .name { width: 100%; font-weight: 100; margin-bottom: 13px; } .system-dashboard-view .socket-info li .hosts, .system-dashboard-view .socket-info li .sockets { width: 54px; /*[empty]color:;*/ } .system-dashboard-view .socket-info li div .title { color: #424242; border: none; font-size: 13px; padding-bottom: 3px; } .add-zone-resource .form-container { height: auto !important; display: inline-block; overflow: visible; } .add-zone-resource .form-container form { display: inline-block; height: auto; } .add-zone-resource { } .add-zone-resource .head { width: 100%; margin-bottom: 7px; display: inline-block; border-bottom: 1px solid #AFBDCA; /*+box-shadow:0px 1px #FFFFFF;*/ -moz-box-shadow: 0px 1px #FFFFFF; -webkit-box-shadow: 0px 1px #FFFFFF; -o-box-shadow: 0px 1px #FFFFFF; box-shadow: 0px 1px #FFFFFF; } .add-zone-resource .head span { float: left; font-size: 14px; text-indent: 5px; padding: 10px 0 18px; } .add-zone-resource .head select { float: left; margin: -3px 0 6px 13px; margin: 8px 0 0 9px; } /** Infrastructure icons*/ .system-dashboard.zone .status_box li.zones .icon { background-position: -36px -105px; } .system-dashboard.zone .status_box li.pods .icon { background-position: -229px -105px; } .system-dashboard.zone .status_box li.clusters .icon { background-position: -411px -96px; } .system-dashboard.zone .status_box li.hosts .icon { background-position: -601px -102px; } .system-dashboard.zone .status_box li.primary-storage .icon { background-position: -32px -404px; /*+placement:shift 37px 68px;*/ position: relative; left: 37px; top: 68px; } .system-dashboard.zone .status_box li.sockets .icon { background-position: -14px -581px; } .system-dashboard.zone .status_box li.secondary-storage .icon { background-position: -216px -404px; /*+placement:shift 37px 68px;*/ position: relative; left: 37px; top: 68px; } .system-dashboard.zone .status_box li.system-vms .icon { background-position: -408px -399px; } .system-dashboard.zone .status_box li.virtual-routers .icon { background-position: -601px -400px; } /*Projects ** View switcher*/ #header .view-switcher { font-size: 12px; color: #55687B; float: left; margin: 11px 0 0 18px; } #header div.view-switcher { height: 39px; background-position: 0px -5px; /*+placement:shift 0px -10px;*/ position: relative; left: 0px; top: -10px; margin-right: 9px; display: none; } #header div.view-switcher.alt { background-position: 0px -41px; } #header div.view-switcher div { float: left; /*[empty]display:;*/ width: 126px; padding: 13px 0 0; margin: 0; text-indent: 17px; position: relative; /*+text-shadow:0px -1px 1px #2D2D2D;*/ -moz-text-shadow: 0px -1px 1px #2D2D2D; -webkit-text-shadow: 0px -1px 1px #2D2D2D; -o-text-shadow: 0px -1px 1px #2D2D2D; text-shadow: 0px -1px 1px #2D2D2D; } #header div.view-switcher .select.active { color: #FFFFFF; font-weight: bold; /*+text-shadow:0px -1px 1px #5B5B5B;*/ -moz-text-shadow: 0px -1px 1px #5B5B5B; -webkit-text-shadow: 0px -1px 1px #5B5B5B; -o-text-shadow: 0px -1px 1px #5B5B5B; text-shadow: 0px -1px 1px #5B5B5B; } #header div.view-switcher div span.icon { background: url(../images/icons.png) no-repeat; width: 10px; height: 10px; padding: 0 19px 0 0; top: 0; /*+placement:shift -4px 0px;*/ position: relative; left: -4px; top: 0px; } #header div.view-switcher div.default-view span.icon { background-position: -23px 0px; } #header div.view-switcher div.project-view span.icon { background-position: -24px 0px !important; } #header div.view-switcher div.select span.icon { background-position: -47px 0px; } #header .view-switcher span { padding: 0 13px 0 0; background-repeat: repeat-x; } #header .view-switcher select { max-width: 120px; margin: 6px 3px 0 -21px; padding: 3px 0 4px; } /*** View switcher (drop-down)*/ .project-switcher { float: left; width: 223px; padding: 9px 17px 0 19px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .project-switcher label { top: 29px; color: #FFFFFF; font-size: 13px; float: left; margin-right: 7px; margin-top: 5px; } .project-switcher select { width: 70%; float: left; margin-top: 0px; border: 1px solid #393939; /*+text-shadow:0px -1px 1px #373737;*/ -moz-text-shadow: 0px -1px 1px #373737; -webkit-text-shadow: 0px -1px 1px #373737; -o-text-shadow: 0px -1px 1px #373737; text-shadow: 0px -1px 1px #373737; background: #515151; font-size: 13px; font-weight: 100; color: #FFFFFF; } /*** Select project*/ .project-selector { display: inline-block; } .project-selector-dialog .ui-widget-content { padding: 0 !important; } .project-selector .toolbar { width: 420px; position: relative; background: transparent; border: none; border-bottom: 1px solid #93A4B4; /*+box-shadow:0px 2px #FFFFFF;*/ -moz-box-shadow: 0px 2px #FFFFFF; -webkit-box-shadow: 0px 2px #FFFFFF; -o-box-shadow: 0px 2px #FFFFFF; box-shadow: 0px 2px #FFFFFF; -moz-box-shadow: 0px 2px 0px #FFFFFF; -webkit-box-shadow: 0px 2px 0px #FFFFFF; -o-box-shadow: 0px 2px 0px #FFFFFF; } .project-selector .search input[type=text] { /*+border-radius:3px;*/ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; border-radius: 3px 3px 3px 3px; width: 192px; height: 18px; margin: 6px 0 0 105px; /*+box-shadow:0px 1px 1px #FFFFFF;*/ -moz-box-shadow: 0px 1px 1px #FFFFFF; -webkit-box-shadow: 0px 1px 1px #FFFFFF; -o-box-shadow: 0px 1px 1px #FFFFFF; box-shadow: 0px 1px 1px #FFFFFF; border: 1px solid #9DADBB; float: left; } .project-selector .search input[type=submit] { display: block; float: left; border: none; cursor: pointer; margin: 6px 0 0; background: url(../images/sprites.png) no-repeat -601px -328px; width: 25px; height: 22px; border-left: 1px solid #283979; /*+placement:shift -2px 0px;*/ position: relative; left: -2px; top: 0px; cursor: pointer; } .project-selector .listing { margin: 15px; border: 1px solid #D0D0D0; position: relative; } .project-selector .listing .data { width: 100%; height: 275px; background: #F2F0F0; overflow: auto; overflow-x: hidden; margin: 18px 0 0; } .project-selector .listing .data ul { text-align: left; font-size: 11px; } .project-selector .listing .data ul li { padding: 10px 0 10px 7px; cursor: pointer; font-size: 12px; } .project-selector .listing .data ul li.odd { background: #DFE1E3; } .project-selector .listing .data ul li:hover { background: #CBDDF3; border-top: 1px solid #FFFFFF; border-bottom: 1px solid #BABFD9; padding: 9px 0 9px 7px; } .project-selector .listing .header { width: 379px; background: url(../images/bg-gradients.png) repeat-x 0px -164px; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; text-align: left; color: #4F6171; font-size: 11px; padding: 3px 2px 3px 7px; border-bottom: 1px solid #FFFFFF; position: absolute; left: 0; } .project-selector .button.cancel { color: #808080; background: #B6B6B6 url("../images/gradients.png") repeat 0 -480px; border: 1px solid #AAAAAA; border-radius: 4px 4px 4px 4px; font-size: 13px; font-weight: bold; padding: 8px 20px; float: none; cursor: pointer; color: #838181; left: 170px; top: -8px; width: 54px; margin: auto auto 17px; } .project-selector .button.cancel:hover { color: #3A3A3A; } /*** Resource management*/ .project-dashboard .resources { } .project-dashboard .resources form { background: #FFFFFF; width: 87%; /*+border-radius:11px;*/ -moz-border-radius: 11px; -webkit-border-radius: 11px; -khtml-border-radius: 11px; border-radius: 11px; border-radius: 11px 11px 11px 11px; padding: 26px; margin-top: 17px; margin-left: 22px; /*+box-shadow:inset 0px 3px 4px #979797;*/ -moz-box-shadow: inset 0px 3px 4px #979797; -webkit-box-shadow: inset 0px 3px 4px #979797; -o-box-shadow: inset 0px 3px 4px #979797; box-shadow: inset 0px 3px 4px #979797; display: inline-block; } .project-dashboard .resources form .field { width: 100%; float: left; clear: both; margin: auto auto 30px; } .project-dashboard .resources form label { float: left; } .project-dashboard .resources form input[type=text] { float: right; width: 176px; font-size: 16px; margin: 0 287px 0 0; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border: 1px solid #C6C6C6; padding: 6px; } .project-dashboard .resources form input[type=submit] { display: block; border: none; background: transparent url(../images/bg-gradients.png) 0px -220px; float: left; padding: 9px 20px; cursor: pointer; color: #FFFFFF; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; clear: both; } .detail-view .project-dashboard .resources form { width: 83%; border-bottom: 1px solid #DBDBDB; } .detail-view .project-dashboard .resources form .field input { margin-right: 105px; } /*** Dashboard*/ .project-dashboard .toolbar { position: relative; } .project-dashboard .ui-tabs { /*+placement:shift 10px -31px;*/ position: relative; left: 10px; top: -31px; } .project-view .project-dashboard .ui-tabs .multi-edit table td { background: #EAEAEA; } .project-dashboard-view .overview-area { float: left; } .project-dashboard-view .compute-and-storage .system-dashboard, .project-dashboard-view .users .system-dashboard { width: 510px; height: 230px; float: left; background: #777E88; } .project-dashboard-view .compute-and-storage .system-dashboard ul, .project-dashboard-view .users .system-dashboard ul { height: 162px; margin: 14px 0 0; } .project-dashboard-view .compute-and-storage .system-dashboard li, .project-dashboard-view .users .system-dashboard li { width: 156px; height: 161px; background: #3D4045; color: #FFFFFF; } .project-dashboard-view .compute-and-storage .system-dashboard li .icon, .project-dashboard-view .users li .icon { width: 100px; height: 76px; /*+placement:shift 27px 20px;*/ position: relative; left: 27px; top: 20px; position: absolute; background: url(../images/sprites.png) no-repeat 2px -1039px; } .project-dashboard-view .compute-and-storage .system-dashboard li.storage .icon { background-position: -89px -1036px; } .project-dashboard-view .compute-and-storage .system-dashboard li.bandwidth .icon { background-position: -184px -1036px; } .project-dashboard-view .compute-and-storage .system-dashboard li .overview { width: 100%; height: 53px; position: relative; margin: 81px 0 0; color: #FFFFFF; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; } .project-dashboard-view .compute-and-storage .system-dashboard li.storage .overview .total { font-size: 28px; /*+placement:shift 30px 21px;*/ position: relative; left: 30px; top: 21px; position: absolute; } .project-dashboard-view .compute-and-storage .system-dashboard li.storage .overview .label { font-size: 13px; color: #C3C1C1; /*+placement:shift 91px 33px;*/ position: relative; left: 91px; top: 33px; position: absolute; } .project-dashboard-view .compute-and-storage .system-dashboard li .overview .overview-item { float: left; margin: 12px 0 0 20px; } .project-dashboard-view .compute-and-storage .system-dashboard li .overview .overview-item .total { font-size: 24px; font-weight: bold; } .project-dashboard-view .compute-and-storage .system-dashboard li .overview .overview-item .label { font-size: 11px; margin: 4px 0 0; color: #C7C7C7; } .project-dashboard-view .compute-and-storage .system-dashboard li .overview .overview-item.running .label { color: #2BFF2B; /*[empty]background-position:;*/ } .project-dashboard-view .users .system-dashboard { width: 509px; height: 100%; clear: both; } .project-dashboard-view .users .system-dashboard ul { overflow-y: auto; } .project-dashboard-view .users .system-dashboard li { width: 86px; height: 138px; margin-bottom: 24px; margin-left: 6px; } .project-dashboard-view .users .system-dashboard li .icon { background-position: -306px -1044px; left: 16px; } .project-dashboard-view .users .system-dashboard li .header { width: 77px; /*+placement:shift 7px 110px;*/ position: relative; left: 7px; top: 110px; position: absolute; text-align: center; } /**** Info box*/ .info-boxes { float: right; width: 233px; height: 551px; margin: 21px 5px 0 0; } .info-boxes .info-box { display: inline-block; border: 1px solid #B3C3D0; /*+box-shadow:inset 0px -1px 7px #A7A7A7;*/ -moz-box-shadow: inset 0px -1px 7px #A7A7A7; -webkit-box-shadow: inset 0px -1px 7px #A7A7A7; -o-box-shadow: inset 0px -1px 7px #A7A7A7; box-shadow: inset 0px -1px 7px #A7A7A7; background: #FFFFFF; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; } .info-boxes .info-box.events { margin-top: 4px; height: 323px; width: 228px; } .info-boxes .info-box.events ul { max-height: 295px; overflow: auto; overflow-x: hidden; } .info-boxes .info-box ul { margin: 0 0 3px 2px; height: auto; display: inline-block; } .info-boxes .info-box ul li { width: 224px; margin: 0 2px 0 0; display: inline-block; border-bottom: 1px solid #BDD2DF; border-top: 1px solid #FFFFFF; } .info-boxes .info-box ul li.odd { background: #ECECEC; } .info-boxes .info-box .button { background: url(../images/bg-gradients.png) 0px -734px; color: #FFFFFF; border: 1px solid #82A3C7; /*+text-shadow:0px 1px 1px #000000;*/ -moz-text-shadow: 0px 1px 1px #000000; -webkit-text-shadow: 0px 1px 1px #000000; -o-text-shadow: 0px 1px 1px #000000; text-shadow: 0px 1px 1px #000000; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; /*+box-shadow:inset 0px 1px 1px #85ACC4;*/ -moz-box-shadow: inset 0px 1px 1px #85ACC4; -webkit-box-shadow: inset 0px 1px 1px #85ACC4; -o-box-shadow: inset 0px 1px 1px #85ACC4; box-shadow: inset 0px 1px 1px #85ACC4; padding: 2px 6px 3px 3px; font-size: 10px; cursor: pointer; font-weight: bold; float: right; margin: 0 14px 0 0; } .info-boxes .info-box .button span { /*+placement:shift 0px 2px;*/ position: relative; left: 0px; top: 2px; float: left; } .info-boxes .info-box .title .button { margin: 4px 6px 0 3px; } .info-boxes .info-box .title .button span { color: #FFFFFF; font-size: 10px; margin: 0; padding: 0; /*+placement:shift 1px 1px;*/ position: relative; left: 1px; top: 1px; } .info-boxes .info-box .button:hover { background-position: 0px -766px; } .info-boxes .info-box .button .arrow { width: 16px; height: 13px; float: right; /*+placement:shift 0px 0px;*/ position: relative; left: 0px; top: 0px; background: url(../images/sprites.png) no-repeat -455px -84px; } .info-boxes .info-box ul li .total, .info-boxes .info-box ul li .date { width: 52px; height: 36px; float: left; font-size: 24px; color: #647C91; border-right: 1px solid #BDD2DF; /*+placement:shift;*/ position: relative; left: 0; top: 0; text-align: right; } .info-boxes .info-box ul li .date { font-size: 11px; text-align: center; margin: 1px 0 0; } .info-boxes .info-box ul li .date span { /*+placement:shift 0px 11px;*/ position: relative; left: 0px; top: 11px; } .info-boxes .info-box ul li .desc { color: #606060; font-size: 12px; /*+placement:shift 5px 8px;*/ position: relative; left: 5px; top: 8px; display: inline-block; padding-bottom: 13px; max-width: 153px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .info-boxes .info-box ul li .total span { /*+placement:shift -5px 7px;*/ position: relative; left: -5px; top: 7px; } .info-boxes .info-box .title { height: 27px; border-bottom: 1px solid #BDD2DF; } .info-boxes .info-box .title span { /*+placement:shift 8px 6px;*/ position: relative; left: 8px; top: 6px; font-size: 12px; font-weight: bold; color: #4E748C; } /*** New project form*/ .new-project { display: inline-block; margin: 0 0 20px 30px; } .new-project form { margin: 0; } .ui-dialog .new-project { text-align: left; } .ui-dialog .new-project .add-by { font-size: 12px; color: #5E6D7D; margin-left: 11px; } .ui-dialog .new-project .add-by input { margin-right: 8px; } .ui-dialog .new-project .add-by label { margin-right: 12px; } .new-project .title { color: #3497E6; font-size: 26px; /*+text-shadow:0px 1px 2px #D6D6D6;*/ -moz-text-shadow: 0px 1px 2px #D6D6D6; -webkit-text-shadow: 0px 1px 2px #D6D6D6; -o-text-shadow: 0px 1px 2px #D6D6D6; text-shadow: 0px 1px 2px #D6D6D6; letter-spacing: 0px; margin: 10px 0 32px; } .new-project .field { /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; width: 686px; display: inline-block; background: #DFDFDF; margin: -2px 0 -4px auto; } #new-project-review-tabs-resouces { background: #D2D2D2; height: 225px; } .new-project .resources .ui-widget-content { background: #FFFFFF; } .new-project .resources .field { height: 39px; padding: 0; } .new-project .resources .field input { } .new-project .field span.value { color: #475765; /*+placement:shift 21px 20px;*/ position: relative; left: 21px; top: 20px; } .new-project .field label { display: block; width: 104px; height: 59px; color: #5B5B5B; float: left; background: #D2D2D2; text-align: right; padding: 20px 24px 0 0; } .new-project .resources .field label { font-size: 14px; height: auto; padding: 10px 14px 14px 40px; } .new-project .field label.error { color: #FF0000; font-size: 9px; /*+placement:displace 154px 29px;*/ position: absolute; margin-left: 154px; margin-top: 29px; background: transparent; width: auto; height: auto; } .new-project .field input[type=text] { background: #FFFFFF 0px 7px; /*+border-radius:5px;*/ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; border-radius: 5px 5px 5px 5px; font-size: 14px; border: 1px solid #E2E1DF; /*+box-shadow:inset 0px 1px #A1A1A1;*/ -moz-box-shadow: inset 0px 1px #A1A1A1; -webkit-box-shadow: inset 0px 1px #A1A1A1; -o-box-shadow: inset 0px 1px #A1A1A1; box-shadow: inset 0px 1px #A1A1A1; -moz-box-shadow: inset 0px 1px 0px #A1A1A1; -webkit-box-shadow: inset 0px 1px 0px #A1A1A1; -o-box-shadow: inset 0px 1px 0px #A1A1A1; width: 506px; height: 20px; margin: 17px 25px 0 0; float: right; border: 1px solid #C7C7C7; } .new-project .resources .field input[type=text] { margin: 6px 9px 0 0; } .new-project .button.cancel { color: #808080; background: transparent; font-size: 12px; font-weight: bold; float: left; cursor: pointer; color: #838181; /*+placement:shift 488px 9px;*/ position: relative; left: 488px; top: 9px; left: 480px; margin: 19px 0 0 40px; } .new-project .button.cancel:hover { color: #3A3A3A; } .new-project input[type=submit], .new-project .button.confirm { display: inline-block; height: 31px; border: none; /*+placement:float-right 63px 18px;*/ float: right; position: relative; left: 63px; top: 18px; color: #FFFFFF; /*+text-shadow:0px -1px 1px #465259;*/ -moz-text-shadow: 0px -1px 1px #465259; -webkit-text-shadow: 0px -1px 1px #465259; -o-text-shadow: 0px -1px 1px #465259; text-shadow: 0px -1px 1px #465259; background: #0049FF url(../images/gradients.png) 0px -317px; font-size: 13px; font-weight: bold; border: 1px solid #0069CF; border-top: 1px solid #0070FC; /*+border-radius:9px;*/ -moz-border-radius: 9px; -webkit-border-radius: 9px; -khtml-border-radius: 9px; border-radius: 9px; border-radius: 9px 9px 9px 9px; margin: 0px 63px 0 0; cursor: pointer; } .new-project input[type=submit]:hover, .new-project .button.confirm:hover { background-position: -3px -369px; } .new-project .button { cursor: pointer; } .new-project .button.confirm { display: block; height: 27px; padding: 13px 10px 0px 12px; } .new-project .button.confirm.next { padding: 10px 34px 0px 29px; } .new-project .review .button.confirm.next { /*+placement:shift 25px 11px;*/ position: relative; left: 25px; top: 11px; } .new-project .review .ui-tabs { /*+placement:shift -29px -31px;*/ position: relative; left: -29px; top: -31px; } .new-project .review .ui-tabs .ui-widget-content { width: 695px; height: 185px; } .new-project .review .ui-tabs .ui-widget-content.ui-tabs-hide { display: none; } .new-project .review .ui-tabs li { } .new-project .review .ui-tabs ul { text-align: left; /*+placement:shift 0px -2px;*/ position: relative; left: 0px; top: -2px; } .new-project .review .ui-tabs .list-view { width: 688px; height: 185px !important; } .new-project .review .ui-tabs .list-view .fixed-header { position: absolute; z-index: 1000; height: 58px; background: #FFFFFF; top: -22px; } .new-project .review .ui-tabs .list-view .data-table table { width: 669px; margin: 31px 0 -1px; } .new-project .review .ui-tabs .list-view .data-table table .edit { width: 132px; background: #FFFFFF; /*+placement:shift 14px 0px;*/ position: relative; left: 14px; top: 0px; } .new-project .review .ui-tabs .list-view .data-table table .edit select { width: 95px; height: 20px; float: left; background: #FFFFFF; border: 1px solid #B2B2B2; } .new-project .review .ui-tabs .list-view .data-table table .edit .action { float: left; margin: 0; padding: 0; /*+placement:shift 14px 0px;*/ position: relative; left: 14px; top: 0px; height: 20px; } .new-project .review .ui-tabs .list-view .toolbar { display: none; } .new-project .review .ui-tabs .list-view .toolbar { } .new-project .review .project-data { padding: 16px; background: #F4F4F4; margin: 0; /*+placement:shift -19px -13px;*/ position: relative; left: -19px; top: -13px; } .new-project .review .project-data .field { width: 677px; margin: auto; } .new-project .button.later { color: #808080; background: url(../images/bg-gradients.png) 0px -261px; border: 1px solid #B1B1B1; /*+box-shadow:inset 0px 2px 2px #FFFFFF;*/ -moz-box-shadow: inset 0px 2px 2px #FFFFFF; -webkit-box-shadow: inset 0px 2px 2px #FFFFFF; -o-box-shadow: inset 0px 2px 2px #FFFFFF; box-shadow: inset 0px 2px 2px #FFFFFF; float: right; font-size: 13px; margin: 19px -40px 0 0; padding: 13px 7px 14px 8px; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; } .new-project .button.later:hover { color: #000000; /*+box-shadow:inset 0px 1px 1px #A1A1A1;*/ -moz-box-shadow: inset 0px 1px 1px #A1A1A1; -webkit-box-shadow: inset 0px 1px 1px #A1A1A1; -o-box-shadow: inset 0px 1px 1px #A1A1A1; box-shadow: inset 0px 1px 1px #A1A1A1; background-position: 0px -86px; } .new-project input[type=submit]:hover { background-position: -3px -369px; } .new-project .resources input[type=submit] { display: none; } .new-project .multi-edit { width: 671px; } .new-project .multi-edit .data { width: 700px; } .new-project .multi-edit .data .data-item { margin: 0; border: none; border: 1px solid #D2D2D2; } .new-project .multi-edit .data .data-item.even td { background: #DFE1E3; } /*Tooltip*/ .tooltip-box { width: 15%; height: auto; display: inline-block; padding: 4px; background: #FFFFFF; border: 1px solid #BEB8B8; padding: 10px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; margin-left: 23px; /*+box-shadow:0px 1px 12px #353535;*/ -moz-box-shadow: 0px 1px 12px #353535; -webkit-box-shadow: 0px 1px 12px #353535; -o-box-shadow: 0px 1px 12px #353535; box-shadow: 0px 1px 12px #353535; } .tooltip-box .arrow { width: 19px; height: 30px; background: url(../images/sprites.png) -585px -947px; /*+placement:shift -16px 3px;*/ position: relative; left: -16px; top: 3px; position: absolute; } /*Tagger*/ .tagger { width: 94%; margin: auto; padding-bottom: 12px; background: #F2F0F0; border: 1px solid #CFC9C9; /*+placement:shift -4px 0px;*/ position: relative; left: -4px; top: 0px; } .tagger .field { width: 35%; float: left; position: relative; } .tagger .tag-info { font-size: 11px; color: #757575; margin-top: 12px; margin-left: 8px; } .tagger .tag-info.title { font-size: 11px; color: #6F9BF0; margin-bottom: 5px; } .tagger form { margin: 12px 9px 0px; } .tagger.readonly form { display: none; } .tagger form label { display: block; float: left; width: 25px; text-align: right; font-size: 10px; color: #394552; margin-right: 9px; /*+placement:shift 5px 8px;*/ position: relative; left: 5px; top: 8px; } .tagger form label.error { position: absolute; color: #FF0000; left: 44px; top: 28px !important; /*[empty]background-color:;*/ } .tagger form input { padding: 4px; background: #FFFFFF; border: 1px solid #808080; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .tagger form input { width: 45%; margin-left: 9px; } .tagger form input[type=submit] { background: url(../images/bg-gradients.png) repeat-x 0px -220px; cursor: pointer; color: #FFFFFF; /*+text-shadow:0px -1px 2px #000000;*/ -moz-text-shadow: 0px -1px 2px #000000; -webkit-text-shadow: 0px -1px 2px #000000; -o-text-shadow: 0px -1px 2px #000000; text-shadow: 0px -1px 2px #000000; border: none; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; padding: 7px 25px 7px 26px; margin-left: 16px; width: auto; } .tagger form input[type=submit]:hover { background-position: 0px -946px; } .tagger ul { display: block; width: 96%; margin: 16px auto auto; /*+border-radius:2px;*/ -moz-border-radius: 2px; -webkit-border-radius: 2px; -khtml-border-radius: 2px; border-radius: 2px; overflow: auto; padding-bottom: 10px; border: 1px solid #D2D2D2; background: #FFFFFF; /*+box-shadow:inset 0px 0px 10px #DCDCDC;*/ -moz-box-shadow: inset 0px 0px 10px #DCDCDC; -webkit-box-shadow: inset 0px 0px 10px #DCDCDC; -o-box-shadow: inset 0px 0px 10px #DCDCDC; box-shadow: inset 0px 0px 10px #DCDCDC; } .tagger.readonly ul { } .tagger ul li { background: #DFDFDF 0px 4px; height: 15px; padding: 0px 18px 0 7px; display: inline-block; float: left; margin-left: 7px; margin-right: 2px; margin-top: 5px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; /*+placement:shift 0px 2px;*/ position: relative; left: 0px; top: 2px; } .tagger ul li span { color: #000000; } .tagger ul li span.label span.value { max-width: 100px; overflow: hidden; } .tagger ul li span.label { font-size: 10px; position: relative; left: 15px; top: -2px; } .tagger.readonly ul li span.label { left: 6px; } .tagger ul li span.label > span { float: left; display: block; margin-top: 2px; } .tagger ul li span.label > span.key { font-weight: bold; max-width: 134px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-left: 15px; margin-right: 5px; } .tagger ul li span.label > span.value { max-width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-left: 6px; } .tagger ul li span.remove { width: 15px !important; overflow: hidden !important; height: 11px !important; background: #DFDFDF; display: block; top: 0px !important; left: -3px !important; text-indent: 4px; padding: 4px 0px 0px 8px; font-size: 8px; font-weight: bold; cursor: pointer; position: absolute !important; color: #5B5B5B; } .tagger.readonly ul li span.remove { display: none; } .tagger ul li span.remove:hover { color: #000000; } /** Dialog tagger*/ .ui-dialog .tagger { width: 375px; } .ui-dialog .tagger .tag-info { display: none; } .ui-dialog.editTags .ui-button { float: right; } .ui-dialog.editTags .ui-dialog-buttonpane { float: right; } .ui-dialog .tagger .field { width: 119px !important; } .ui-dialog .tagger input.key, .ui-dialog .tagger input.value { width: 66px !important; height: 15px; font-size: 11px !important; } .ui-dialog .tagger input[type=submit] { padding: 6px 15px; } /*VPC / vApps*/ .vpc-chart { width: 100%; height: 94%; overflow: auto; position: relative; margin: 30px 0 0; background: #FFFFFF 0px 24px; } .vpc-chart .vpc-title { width: 210px; font-size: 22px; /*+placement:shift 11px 41px;*/ position: relative; left: 11px; top: 41px; position: absolute; color: #5F768A; } .vpc-chart .vpc-title > span { max-width: 160px; display: block; float: left; overflow-y: hidden; overflow-x: auto; } .vpc-chart .vpc-title .icon { padding: 7px 15px; background: url(../images/sprites.png) no-repeat -145px -195px; margin-left: 10px; cursor: pointer; /*+placement:shift 6px -8px;*/ position: relative; left: 6px; top: -8px; float: left; } .vpc-chart .vpc-title .vpc-configure-tooltip { width: 129px; padding: 35px 10px 10px; font-size: 14px; display: none; z-index: 2000; position: absolute; } .vpc-chart .vpc-title .vpc-configure-tooltip .arrow { width: 30px; height: 20px; background: #FFFFFF url(../images/sprites.png) no-repeat -589px -997px; /*+placement:shift 13px 26px;*/ position: relative; left: 13px; top: 26px; position: absolute; z-index: 1; } .vpc-chart .vpc-title .vpc-configure-tooltip ul { border: 1px solid #C2C2C2; background: #FFFFFF; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; /*+placement:shift 0px -6px;*/ position: relative; left: 0px; top: -6px; margin: 10px 0; padding: 9px; /*+box-shadow:0px 1px 8px #CBCBCB;*/ -moz-box-shadow: 0px 1px 8px #CBCBCB; -webkit-box-shadow: 0px 1px 8px #CBCBCB; -o-box-shadow: 0px 1px 8px #CBCBCB; box-shadow: 0px 1px 8px #CBCBCB; } .vpc-chart .vpc-title .vpc-configure-tooltip li { padding: 3px 0 5px; cursor: pointer; font-size: 12px; } .vpc-chart .vpc-title .vpc-configure-tooltip li:hover { font-weight: bold; } .vpc-chart ul.tiers { padding: 0 0 0 26px; margin: 79px 0 0 232px; border-left: 3px solid #CCC; } .vpc-chart li.tier { display: block; width: 258px; height: 107px; margin: -55px 0 90px; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border: 1px solid #50545A; background: url(../images/bg-gradients.png) 0px -2637px; /*+placement:shift 0px 58px;*/ position: relative; left: 0px; top: 58px; position: relative; /*+box-shadow:0px 5px 7px #DADADA;*/ -moz-box-shadow: 0px 5px 7px #DADADA; -webkit-box-shadow: 0px 5px 7px #DADADA; -o-box-shadow: 0px 5px 7px #DADADA; box-shadow: 0px 5px 7px #DADADA; } .vpc-chart li.tier .loading-overlay { /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .vpc-chart li.tier .connect-line { position: absolute; width: 28px; height: 3px; background: #CCCCCC 0px -8px; /*+placement:shift -29px 49px;*/ position: relative; left: -29px; top: 49px; position: absolute; } .vpc-chart li.tier span.title { color: #FFFFFF; /*+placement:shift 8px 7px;*/ position: relative; left: 8px; top: 7px; position: absolute; cursor: pointer; padding: 3px; font-size: 24px; /*+text-shadow:1px 2px 2px #000000;*/ -moz-text-shadow: 1px 2px 2px #000000; -webkit-text-shadow: 1px 2px 2px #000000; -o-text-shadow: 1px 2px 2px #000000; text-shadow: 1px 2px 2px #000000; text-decoration: underline; } .vpc-chart li.tier span.cidr { /*+placement:shift 12px 46px;*/ position: relative; left: 12px; top: 46px; position: absolute; font-size: 14px; /*+text-shadow:0px -1px 1px #343E4C;*/ -moz-text-shadow: 0px -1px 1px #343E4C; -webkit-text-shadow: 0px -1px 1px #343E4C; -o-text-shadow: 0px -1px 1px #343E4C; text-shadow: 0px -1px 1px #343E4C; color: #FFFFFF; } .vpc-chart li.tier .actions { width: 258px; height: 35px; background: #CCC; /*+border-radius:0 0 4px 4px;*/ -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; -khtml-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; /*+placement:shift -1px 71px;*/ position: relative; left: -1px; top: 71px; position: absolute; /*+box-shadow:inset 0px 1px #FFFFFF;*/ -moz-box-shadow: inset 0px 1px #FFFFFF; -webkit-box-shadow: inset 0px 1px #FFFFFF; -o-box-shadow: inset 0px 1px #FFFFFF; box-shadow: inset 0px 1px #FFFFFF; border: 1px solid #808080; border-top: 1px solid #4C545E; position: absolute; } .vpc-chart li.tier .actions .action { cursor: pointer; float: left; width: 50px; height: 24px; text-align: center; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; margin: 4px 0px 4px 4px; border: 1px solid #909090; color: #4B637A; font-weight: bold; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; background: url(../images/bg-gradients.png) 0px -2533px; } .vpc-chart li.tier .actions .action.disabled, .vpc-chart li.tier .actions .action.disabled:hover { color: #9D9D9D; background: #CFCFCF; /*+text-shadow:none;*/ -moz-text-shadow: none; -webkit-text-shadow: none; -o-text-shadow: none; text-shadow: none; border-color: #B5B5B5; cursor: not-allowed; /*+box-shadow:none;*/ -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .vpc-chart li.tier .actions .action:hover { border: 1px solid #7A8B9A; background-position: 0px -106px; color: #5B7A96; /*+box-shadow:inset 1px 2px 4px #808080;*/ -moz-box-shadow: inset 1px 2px 4px #808080; -webkit-box-shadow: inset 1px 2px 4px #808080; -o-box-shadow: inset 1px 2px 4px #808080; box-shadow: inset 1px 2px 4px #808080; } .vpc-chart li.tier .actions .action span.label { /*+placement:shift 1px 3px;*/ position: relative; left: 1px; top: 3px; font-size: 11px; } .vpc-chart li.tier .actions .action.remove, .vpc-chart li.tier .actions .action.remove:hover { background: none; width: 30px; padding: 0; float: right; border: none; /*+placement:shift -3px -2px;*/ position: relative; left: -3px; top: -2px; /*+box-shadow:none;*/ -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .vpc-chart li.tier .action span.icon { background-image: url(../images/sprites.png); cursor: pointer; width: 37px; height: 23px; float: left; /*+placement:shift 1px 3px;*/ position: relative; left: 1px; top: 3px; } .vpc-chart li.tier .vm-count { font-size: 23px; left: 134px; top: 3px; position: absolute; color: #FFFFFF; /*+text-shadow:1px 2px 2px #000000;*/ -moz-text-shadow: 1px 2px 2px #000000; -webkit-text-shadow: 1px 2px 2px #000000; -o-text-shadow: 1px 2px 2px #000000; text-shadow: 1px 2px 2px #000000; cursor: pointer; display: block; padding: 5px; text-align: center; width: 100px; border: 1px solid transparent; margin: 4px; text-decoration: underline; } .vpc-chart li.tier.loading .vm-count { padding-right: 10px; } .vpc-chart li.tier .vm-count .loading-overlay { display: none; width: 24px; height: 24px; position: absolute; left: 15px; top: 7px; /*+border-radius:12px;*/ -moz-border-radius: 12px; -webkit-border-radius: 12px; -khtml-border-radius: 12px; border-radius: 12px; background-image: url(../images/ajax-loader-small.gif); /*+opacity:100%;*/ filter: alpha(opacity=100); -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); -moz-opacity: 1; opacity: 1; } .vpc-chart li.tier.loading .vm-count .loading-overlay { display: block; } .vpc-chart li.tier .vm-count:hover, .vpc-chart li.tier .title:hover { border-radius: 4px; border: 1px solid #4C545E; background: url(../images/bg-gradients.png) 0px -2751px; } .vpc-chart li.tier .vm-count .total { padding-right: 4px; font-size: 24px; } .vpc-chart li.tier.placeholder { background: #ECECEC; border: dotted #ACACAC; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; /*+box-shadow:none;*/ -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; cursor: pointer; } .vpc-chart li.tier.placeholder:hover { background: #D3D3D3; /*+box-shadow:0px 2px 8px #A7A7A7;*/ -moz-box-shadow: 0px 2px 8px #A7A7A7; -webkit-box-shadow: 0px 2px 8px #A7A7A7; -o-box-shadow: 0px 2px 8px #A7A7A7; box-shadow: 0px 2px 8px #A7A7A7; } .vpc-chart li.tier.placeholder span { top: 40px; left: 66px; color: #9F9F9F; /*+text-shadow:none;*/ -moz-text-shadow: none; -webkit-text-shadow: none; -o-text-shadow: none; text-shadow: none; text-decoration: none; } .vpc-chart li.tier.placeholder:hover span { color: #000000; /*+text-shadow:0px 0px 7px #FFFFFF;*/ -moz-text-shadow: 0px 0px 7px #FFFFFF; -webkit-text-shadow: 0px 0px 7px #FFFFFF; -o-text-shadow: 0px 0px 7px #FFFFFF; text-shadow: 0px 0px 7px #FFFFFF; background: none; border: none; } .vpc-chart li.tier.virtual-router { margin: 0px; width: 222px; height: 65px; /*+placement:shift 17px -36px;*/ position: relative; left: 17px; top: -36px; background-position: 0px -2519px; border: 1px solid #ADADAD; cursor: pointer; } .vpc-chart li.tier.virtual-router:hover { text-decoration: underline; } .vpc-chart li.tier.virtual-router.disabled:hover { text-decoration: none; } .vpc-chart li.tier.virtual-router.disabled, .vpc-chart li.tier.virtual-router.disabled span { cursor: default; } .vpc-chart li.tier.virtual-router span { color: #586E82; font-size: 18px; /*+text-shadow:0px 1px 3px #FFFFFF;*/ -moz-text-shadow: 0px 1px 3px #FFFFFF; -webkit-text-shadow: 0px 1px 3px #FFFFFF; -o-text-shadow: 0px 1px 3px #FFFFFF; text-shadow: 0px 1px 3px #FFFFFF; /*+placement:shift 53px 22px;*/ position: relative; left: 53px; top: 22px; text-decoration: none; } .vpc-chart li.tier.virtual-router span:hover { background: none; border: none; } .vpc-chart li.tier.virtual-router .connect-line { /*+placement:shift -47px 14px;*/ position: relative; left: -47px; top: 14px; width: 46px; } /*VPC: Enable Static NAT fields*/ .list-view.instances .filters.tier-select { width: 246px; padding: 2px 20px 2px 13px; margin: 1px 120px 0 19px; } .list-view.instances .filters.tier-select label { color: #FFFFFF; /*+text-shadow:0px 1px 3px #000000;*/ -moz-text-shadow: 0px 1px 3px #000000; -webkit-text-shadow: 0px 1px 3px #000000; -o-text-shadow: 0px 1px 3px #000000; text-shadow: 0px 1px 3px #000000; } .list-view.instances .filters.tier-select select { width: 166px; float: left; } /*Configure ACL dialog / VM tier list view dialog*/ .ui-dialog.configure-acl .multi-edit { width: 866px; } .ui-dialog.configure-acl .multi-edit table { max-width: none; } .ui-dialog.configure-acl .multi-edit table select, .detail-view .acl .multi-edit select { width: 76px; } .ui-dialog.configure-acl .ui-dialog-buttonpane { /*+placement:shift 722px -2px;*/ position: relative; left: 722px; top: -2px; } .ui-dialog.configure-acl div.view.list-view { max-height: 474px; } .ui-dialog.configure-acl .multi-edit .data { width: 901px; padding: 0; margin: 0; height: 370px; overflow: auto; overflow-x: hidden; } .ui-dialog.configure-acl .multi-edit .data .multi-actions { min-width: none !important; max-width: none !important; } .ui-dialog.configure-acl .view.list-view table.body tr td.actions { width: 184px !important; max-width: 184px !important; } div.ui-dialog div.acl div.multi-edit table.multi-edit thead tr th, div.ui-dialog div.acl div.multi-edit table.multi-edit tbody tr td { min-width: 75px; } div.ui-dialog div.acl div.multi-edit div.data div.data-body div.data-item table tbody tr td { width: 100%; min-width: 77px; } .detail-view .acl .multi-edit { } .detail-view .acl .multi-edit th, .detail-view .acl .multi-edit td { padding-right: 0px !important; min-width: 25px !important; } .detail-view .acl .multi-edit th { font-size: 10px; } .detail-view .acl .multi-edit input { width: 50px; } .detail-view .acl .multi-edit .add-vm { width: 51px; text-indent: 0px; padding-right: 0px; } .detail-view .acl .multi-edit td.multi-actions { width: 65px; } /*HEALTH CHECK*/ .ui-dialog .health-check { height: 295px !important; padding-bottom: 93px; } div.ui-dialog div.health-check div.health-check-description { color: #808080; } div.ui-dialog div.health-check div.form-container form div.form-item { width: 58% margin-left:116px; margin-top: -16px; margin-bottom: 30px; } div.ui-dialog div.health-check div.health-check-config-title { float: left; color: #808080; font-size: 17px; margin-left: 15px; } div.ui-dialog div.health-check div.health-check-advanced-title { float: left; color: #808080; font-size: 17px; margin-left: 15px; margin-top: -70px; } /*Autoscaler*/ .ui-dialog div.autoscaler { overflow: auto; max-height: 600px; } div.container div.panel div#details-tab-network.detail-group div div.multi-edit table.multi-edit tbody tr td, div.container div.panel div#details-tab-network.detail-group div div.multi-edit table.multi-edit thead tr th { min-width: 80px; max-width: 80px; font-size: 10px; } .ui-dialog div.autoscaler .detail-actions { } .ui-dialog div.autoscaler .detail-actions .buttons { float: right; margin-right: 6px; } .ui-dialog div.autoscaler .detail-actions .buttons .action { width: 32px; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=securityGroups] { display: block; width: 370px; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=diskOfferingId] { display: inline-block; width: 370px; float: left; position: relative; margin-top: 1px; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=minInstance] { display: block; width: 50%; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=maxInstance] { display: inline-block; width: 50%; float: left; left: -30px; position: relative; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=interval] { display: block; width: 50%; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=quietTime] { display: inline-block; width: 50%; float: left; left: -15px; position: relative; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=snmpCommunity] { display: block; width: 50%; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=snmpPort] { display: inline-block; width: 50%; float: left; left: -15px; position: relative; } .ui-dialog div.autoscaler div.form-container div.value select { width: 88%; float: left; } div.ui-dialog div.autoscaler div.scale-up-policy-title div.form-container { height: 55px; } div.ui-dialog div.autoscaler div.scale-down-policy-title div.form-container { height: 55px; } div.ui-dialog div.autoscaler div.scale-up-policy div.multi-edit { margin-top: 0px; } div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit { margin-top: 0px; } div.ui-dialog div.autoscaler div.scale-up-policy-title { color: #0055BB; margin-left: -650px; margin-top: 40px; } div.ui-dialog div.autoscaler div.scale-up-policy-title label { font-size: 13px; margin-left: 200px; margin-right: 10px; } div.ui-dialog div.autoscaler div.scale-up-policy-title hr.policy-divider { border-left: 1px none #38546D; border-right: 1px none #16222C; border-top: 1px none #38546D; margin-bottom: 12px; } div.ui-dialog div.autoscaler div.scale-down-policy-title hr.policy-divider { border-left: 1px none #38546D; border-right: 1px none #16222C; border-top: 1px none #38546D; margin-bottom: 12px; } div.ui-dialog div.autoscaler div.field-group.bottom-fields hr.policy-divider { border-left: 1px none #38546D; border-right: 1px none #16222C; border-top: 1px none #38546D; margin-top: 15px; margin-bottom: -1px; } div.ui-dialog div.autoscaler div.scale-down-policy-title label { font-size: 13px; margin-left: 170px; margin-right: 10px; } div.ui-dialog div.autoscaler div.scale-down-policy-title { color: #0055BB; margin-left: -620px; margin-top: 10px; } div.ui-dialog div.autoscaler div.scale-up-policy-title div.form-container div.form-item div.value input[type=text] { margin-left: 729px; width: 30%; margin-top: -17px; } div.ui-dialog div.autoscaler div.scale-up-policy-title div.form-container div.form-item div.name { margin-left: 420px; } div.ui-dialog div.autoscaler div.scale-down-policy-title div.form-container div.form-item div.value input[type=text] { margin-left: 698px; width: 30%; margin-top: -16px; } div.ui-dialog div.autoscaler div.scale-down-policy-title div.form-container div.form-item div.name { margin-left: 420px; } div.ui-dialog div.autoscaler div.scale-up-policy div.multi-edit div.data div.data-body div.data-item { margin-bottom: 0px; margin-right: 22px; } div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.data-body div.data-item { margin-bottom: 0px; margin-right: 22px; } div.ui-dialog div.autoscaler div.scale-up-policy div.slide-label { color: #A5A3A7; font-size: 14px; margin-bottom: 3px; margin-left: 755px; width: 12px; } div.ui-dialog div.autoscaler div.scale-down-policy div.slide-label { color: #A5A3A7; font-size: 14px; margin-bottom: 3px; margin-left: 755px; width: 12px; } div.ui-dialog div.autoscaler div.scale-up-policy div.hide { background: #FFFFFF url("../images/minus.png") no-repeat 38% 59%; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.scale-down-policy div.hide { background: #FFFFFF url("../images/minus.png") no-repeat 31% 54%; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.scale-up-policy div.expand { background: #FFFFFF url("../images/sprites.png") repeat -541px -499px; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.scale-down-policy div.expand { background: #FFFFFF url("../images/sprites.png") repeat -541px -499px; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.field-group div.form-container form div.form-item div.name label { font-size: 11px; } /*List state BG colors*/ .list-view .body td.item-state-on { background: #C0FFC0; border-bottom: 1px solid #09BC09; } .list-view .body td.item-state-off { background: #FFD8CF; border-bottom: 1px solid #FF9F9F; } .list-view .body tr.selected td.item-state-on, .list-view .body tr.selected td.item-state-off { background-color: inherit; border-color: inherit; } /*Autoscaler*/ .ui-dialog div.autoscaler { overflow: auto; max-height: 600px; } div.container div.panel div#details-tab-network.detail-group div div.multi-edit table.multi-edit tbody tr td, div.container div.panel div#details-tab-network.detail-group div div.multi-edit table.multi-edit thead tr th { min-width: 72px; font-size: 10px; } .ui-dialog div.autoscaler .detail-actions { } .ui-dialog div.autoscaler .detail-actions .buttons { float: right; margin-right: 6px; } .ui-dialog div.autoscaler .detail-actions .buttons .action { width: 32px; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=securityGroups] { display: block; width: 370px; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=diskOfferingId] { display: inline-block; width: 370px; float: left; position: relative; margin-top: 1px; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=minInstance] { display: block; width: 50%; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=maxInstance] { display: inline-block; width: 50%; float: left; left: -30px; position: relative; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=interval] { display: block; width: 50%; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=quietTime] { display: inline-block; width: 50%; float: left; left: -15px; position: relative; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=snmpCommunity] { display: block; width: 50%; float: left; } .ui-dialog div.autoscaler div.form-container div.form-item[rel=snmpPort] { display: inline-block; width: 50%; float: left; left: -15px; position: relative; } .ui-dialog div.autoscaler div.form-container div.value select { width: 88%; float: left; } div.ui-dialog div.autoscaler div.scale-up-policy-title div.form-container { height: 55px; } div.ui-dialog div.autoscaler div.scale-down-policy-title div.form-container { height: 55px; } div.ui-dialog div.autoscaler div.scale-up-policy div.multi-edit { margin-top: 0px; } div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit { margin-top: 0px; } div.ui-dialog div.autoscaler div.scale-up-policy-title { color: #0055BB; margin-left: -650px; margin-top: 40px; } div.ui-dialog div.autoscaler div.scale-up-policy-title label { font-size: 13px; margin-left: 200px; margin-right: 10px; } div.ui-dialog div.autoscaler div.scale-up-policy-title hr.policy-divider { border-left: 1px none #38546D; border-right: 1px none #16222C; border-top: 1px none #38546D; margin-bottom: 12px; } div.ui-dialog div.autoscaler div.scale-down-policy-title hr.policy-divider { border-left: 1px none #38546D; border-right: 1px none #16222C; border-top: 1px none #38546D; margin-bottom: 12px; } div.ui-dialog div.autoscaler div.field-group.bottom-fields hr.policy-divider { border-left: 1px none #38546D; border-right: 1px none #16222C; border-top: 1px none #38546D; margin-top: 15px; margin-bottom: -1px; } div.ui-dialog div.autoscaler div.scale-down-policy-title label { font-size: 13px; margin-left: 170px; margin-right: 10px; } div.ui-dialog div.autoscaler div.scale-down-policy-title { color: #0055BB; margin-left: -620px; margin-top: 10px; } div.ui-dialog div.autoscaler div.scale-up-policy-title div.form-container div.form-item div.value input[type=text] { margin-left: 195px; width: 30%; margin-top: 1px; } div.ui-dialog div.autoscaler div.scale-up-policy-title div.form-container div.form-item div.name { margin-left: 390px; } div.ui-dialog div.autoscaler div.scale-down-policy-title div.form-container div.form-item div.value input[type=text] { margin-left: 670px; width: 30%; margin-top: -16px; } div.ui-dialog div.autoscaler div.scale-down-policy-title div.form-container div.form-item div.name { margin-left: 390px; } div.ui-dialog div.autoscaler div.scale-up-policy div.multi-edit div.data div.data-body div.data-item { margin-bottom: 0px; margin-right: 22px; } div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.data-body div.data-item { margin-bottom: 0px; margin-right: 22px; } div.ui-dialog div.autoscaler div.scale-up-policy div.slide-label { color: #A5A3A7; font-size: 14px; margin-bottom: 3px; margin-left: 755px; width: 12px; } div.ui-dialog div.autoscaler div.scale-down-policy div.slide-label { color: #A5A3A7; font-size: 14px; margin-bottom: 3px; margin-left: 755px; width: 12px; } div.ui-dialog div.autoscaler div.scale-up-policy div.hide { background: #FFFFFF url("../images/minus.png") no-repeat 38% 59%; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.scale-down-policy div.hide { background: #FFFFFF url("../images/minus.png") no-repeat 31% 54%; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.scale-up-policy div.expand { background: #FFFFFF url("../images/sprites.png") repeat -541px -499px; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.scale-down-policy div.expand { background: #FFFFFF url("../images/sprites.png") repeat -541px -499px; border: 1px solid #D0D0D0; border-radius: 9px 9px 9px 9px; cursor: pointer; float: right; height: 15px; margin: -20px 45px 0 11px; width: 14px; } div.ui-dialog div.autoscaler div.field-group div.form-container form div.form-item div.name label { font-size: 11px; } /*UI datepicker*/ .ui-datepicker { background: #FFFFFF 0px -2470px; width: 300px; height: auto; overflow: hidden; padding: 4px 0 0; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; /*+box-shadow:0px 3px 8px #000000;*/ -moz-box-shadow: 0px 3px 8px #000000; -webkit-box-shadow: 0px 3px 8px #000000; -o-box-shadow: 0px 3px 8px #000000; box-shadow: 0px 3px 8px #000000; display: none; } .ui-datepicker .ui-datepicker-title { width: 100%; margin: auto; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { font-size: 13px; color: #FFFFFF; /*+box-shadow:0px 1px 5px #444444;*/ -moz-box-shadow: 0px 1px 5px #444444; -webkit-box-shadow: 0px 1px 5px #444444; -o-box-shadow: 0px 1px 5px #444444; box-shadow: 0px 1px 5px #444444; /*+text-shadow:0px -1px 1px #050505;*/ -moz-text-shadow: 0px -1px 1px #050505; -webkit-text-shadow: 0px -1px 1px #050505; -o-text-shadow: 0px -1px 1px #050505; text-shadow: 0px -1px 1px #050505; padding: 6px; margin: 6px 13px 6px 14px; font-size: 12px; background: url(../images/bg-gradients.png) 0px -182px; cursor: pointer; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; } .ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover { /*+box-shadow:inset 0px 0px 10px #000000;*/ -moz-box-shadow: inset 0px 0px 10px #000000; -webkit-box-shadow: inset 0px 0px 10px #000000; -o-box-shadow: inset 0px 0px 10px #000000; box-shadow: inset 0px 0px 10px #000000; } .ui-datepicker .ui-datepicker-prev { float: left; } .ui-datepicker .ui-datepicker-next { float: right; } .ui-datepicker .ui-datepicker-title .ui-datepicker-month { width: 85px; font-size: 16px; color: #2C363F; } .ui-datepicker .ui-datepicker-title .ui-datepicker-year { } .ui-datepicker .ui-datepicker-title { text-align: center; width: 188px; height: 19px; padding: 3px 0 0; /*+placement:shift 0px 6px;*/ position: relative; left: 0px; top: 6px; } .ui-datepicker table { width: 277px; height: 9px; } .ui-datepicker table th, .ui-datepicker table td { min-width: 24px; text-align: center; border: 1px solid #B9B6B6; text-indent: 0px; padding: 7px 0; /*[empty]+placement:;*/ } .ui-datepicker table td { cursor: pointer; } .ui-datepicker table td.ui-state-disabled, .ui-datepicker table td.ui-state-disabled:hover { background-color: #DCDCDC; /*+box-shadow:none;*/ -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; cursor: default; } .ui-datepicker table td a { text-decoration: none; color: #485867; font-size: 12px; } .ui-datepicker table td:hover { background-color: #6A839A; /*+box-shadow:inset 0px 0px 4px #6B6B6B;*/ -moz-box-shadow: inset 0px 0px 4px #6B6B6B; -webkit-box-shadow: inset 0px 0px 4px #6B6B6B; -o-box-shadow: inset 0px 0px 4px #6B6B6B; box-shadow: inset 0px 0px 4px #6B6B6B; } .ui-datepicker table td:hover a { color: #FFFFFF; text-shadow: 0px -1px #000000; } /*Plugins listing*/ .plugins-listing { } .plugins-listing ul { width: 100%; } .plugins-listing ul li { /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; /*+box-shadow:0px 2px 6px #D3D3D3;*/ -moz-box-shadow: 0px 2px 6px #D3D3D3; -webkit-box-shadow: 0px 2px 6px #D3D3D3; -o-box-shadow: 0px 2px 6px #D3D3D3; box-shadow: 0px 2px 6px #D3D3D3; border: 1px solid #A8A3A3; background: url(../images/bg-gradients.png) 0px -29px; width: 98%; height: 66px; margin: 9px auto 12px; cursor: pointer; } .plugins-listing ul li:hover { /*+box-shadow:inset 0px 2px 4px #B9B9B9;*/ -moz-box-shadow: inset 0px 2px 4px #B9B9B9; -webkit-box-shadow: inset 0px 2px 4px #B9B9B9; -o-box-shadow: inset 0px 2px 4px #B9B9B9; box-shadow: inset 0px 2px 4px #B9B9B9; } .plugins-listing ul li .title { display: block; float: left; width: 90%; font-weight: bold; /*+text-shadow:0px 1px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px 1px #FFFFFF; -webkit-text-shadow: 0px 1px 1px #FFFFFF; -o-text-shadow: 0px 1px 1px #FFFFFF; text-shadow: 0px 1px 1px #FFFFFF; color: #4A5A6A; margin: 13px 0 7px; } .plugins-listing ul li .desc { color: #524E4E; font-size: 13px; } .plugins-listing ul li .icon { display: block; width: 50px; height: 50px; float: left; margin: 8px 13px 13px 11px; } .plugins-listing ul li .icon img { width: 100%; height: 100%; } /*Regions*/ .region-switcher { display: inline-block; position: relative; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; height: 28px; float: left; margin: 5px 13px 0 0; cursor: pointer; /*+placement:shift 27px 1px;*/ position: relative; left: 27px; top: 1px; } .region-selector { /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; width: 318px; background: url(../images/bg-notifications.png) center; height: 372px; /*+placement:shift 185px 49px;*/ position: relative; left: 185px; top: 49px; position: absolute; z-index: 5500; } .region-selector h2 { color: #FFFFFF; text-align: center; font-size: 21px; letter-spacing: 1px; /*+text-shadow:0px 1px 2px #000000;*/ -moz-text-shadow: 0px 1px 2px #000000; -webkit-text-shadow: 0px 1px 2px #000000; -o-text-shadow: 0px 1px 2px #000000; text-shadow: 0px 1px 2px #000000; margin: 31px 0 14px; } .region-selector .buttons { width: 95%; height: 33px; margin: 5px auto 0; } .region-selector .buttons .button.close { background: url(../images/gradients.png) 0px -317px; float: right; margin-right: 10px; border-bottom: 1px solid #232323; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; padding: 8px; } .region-selector .buttons .button.close:hover { /*+box-shadow:inset 0px 2px 4px #525252;*/ -moz-box-shadow: inset 0px 2px 4px #525252; -webkit-box-shadow: inset 0px 2px 4px #525252; -o-box-shadow: inset 0px 2px 4px #525252; box-shadow: inset 0px 2px 4px #525252; } .region-selector .buttons .button.close span { color: #FFFFFF; font-weight: bold; letter-spacing: 1px; /*+text-shadow:0px 1px 2px #000000;*/ -moz-text-shadow: 0px 1px 2px #000000; -webkit-text-shadow: 0px 1px 2px #000000; -o-text-shadow: 0px 1px 2px #000000; text-shadow: 0px 1px 2px #000000; } .region-selector .buttons .button.close:hover span { } .region-selector ul { background: #FFFFFF; width: 94%; /*+border-radius:4px;*/ -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; height: 237px; border: 1px solid #B7B7B7; overflow: auto; margin: auto; /*+box-shadow:inset 0px 0px 8px #A3A3A3;*/ -moz-box-shadow: inset 0px 0px 8px #A3A3A3; -webkit-box-shadow: inset 0px 0px 8px #A3A3A3; -o-box-shadow: inset 0px 0px 8px #A3A3A3; box-shadow: inset 0px 0px 8px #A3A3A3; } .region-selector ul li { background: none; color: #415C72; font-size: 13px; /*+text-shadow:none;*/ -moz-text-shadow: none; -webkit-text-shadow: none; -o-text-shadow: none; text-shadow: none; text-indent: 14px; cursor: pointer; border-bottom: 1px solid #CACACA; width: 100%; padding: 15px 0; } .region-selector ul li:hover, .region-selector ul li.active { background: #E9E9E9 url(../images/bg-gradients.png) repeat-x 0px -31px; /*+text-shadow:0px 1px #FFFFFF;*/ -moz-text-shadow: 0px 1px #FFFFFF; -webkit-text-shadow: 0px 1px #FFFFFF; -o-text-shadow: 0px 1px #FFFFFF; text-shadow: 0px 1px #FFFFFF; } .region-switcher .icon { display: inline-block; float: left; display: block; width: 26px; height: 26px; background: url(../images/sprites.png) -15px -1313px; position: absolute; } .region-switcher .title { display: inline-block; float: right; padding: 9px 9px 0 34px; color: #FFFFFF; font-size: 13px; font-weight: 100; max-width: 285px; overflow: hidden; white-space: nowrap; /*+placement:shift -1px 0px;*/ position: relative; left: -1px; top: 0px; } .region-switcher:hover, .region-switcher.active { /*+box-shadow:inset 0px 1px 5px #000000;*/ -moz-box-shadow: inset 0px 1px 5px #000000; -webkit-box-shadow: inset 0px 1px 5px #000000; -o-box-shadow: inset 0px 1px 5px #000000; box-shadow: inset 0px 1px 5px #000000; } .region-switcher:hover .icon, .region-switcher.active .icon { background-position: -70px -1311px; } /*Action icons*/ .action.edit .icon { background-position: 1px -1px; } .action.edit:hover .icon { background-position: 1px -583px; } .start .icon { background-position: -169px -1px; } .start:hover .icon { background-position: -169px -583px; } .stop .icon, .removeVmwareDc .icon, .release .icon { background-position: 0px -31px; } .stop:hover .icon, .removeVmwareDc:hover .icon, .release:hover .icon { background-position: 0px -613px; } .restart .icon, .releaseDedicatedZone .icon { background-position: 0px -63px; } .restart:hover .icon, .releaseDedicatedZone:hover .icon { background-position: 0px -645px; } .destroy .icon, .expunge .icon, .remove .icon, .removeMulti .icon, .delete .icon, .decline .icon, .deleteacllist .icon { background-position: 1px -92px; } .destroy:hover .icon, .expunge:hover .icon, .remove:hover .icon, .delete:hover .icon, .deleteacllist:hover .icon { background-position: 1px -674px; } .migrate .icon, .migrateToAnotherStorage .icon { background-position: 0px -125px; } .migrate:hover .icon, .migrateToAnotherStorage:hover .icon { background-position: 0px -707px; } .migrate .icon, .migrateVolume .icon { background-position: 0px -125px; } .migrate:hover .icon, .migrateVolume:hover .icon { background-position: 0px -707px; } .attach .icon, .attachISO .icon, .attachDisk .icon, .associateProfileToBlade .icon { background-position: -104px -3px; } .attach:hover .icon, .attachISO:hover .icon, .attachDisk:hover .icon { background-position: -101px -585px; } .detach .icon, .detachISO .icon, .detachDisk .icon, .disassociateProfileFromBlade .icon { background-position: -101px -65px; } .detach:hover .icon, .detachISO:hover .icon, .detachDisk:hover .icon, .disassociateProfileFromBlade:hover .icon { background-position: -101px -647px; } .resetPassword .icon, .changePassword .icon { background-position: -68px -30px; } .resetPassword:hover .icon, .changePassword:hover .icon { background-position: -68px -612px; } .changeService .icon { background-position: -38px -33px; } .changeService:hover .icon { background-position: -38px -615px; } .snapshot .icon, .takeSnapshot .icon { background-position: -36px -91px; } .snapshot:hover .icon, .takeSnapshot:hover .icon { background-position: -36px -673px; } .recurringSnapshot .icon { background-position: -69px -95px; } .recurringSnapshot:hover .icon { background-position: -69px -677px; } .downloadVolume .icon, .downloadTemplate .icon, .downloadISO .icon, .replaceacllist .icon, .replaceACL .icon { background-position: -35px -125px; } .downloadVolume:hover .icon, .downloadTemplate:hover .icon, .downloadISO:hover .icon, .replaceacllist:hover .icon, .replaceACL:hover .icon { background-position: -35px -707px; } .createVolume .icon { background-position: -70px -124px; } .createVolume:hover .icon { background-position: -70px -706px; } .enable .icon, .enableStaticNAT .icon { background-position: -102px -92px; } .enable:hover .icon, .enableStaticNAT:hover .icon { background-position: -102px -676px; } .disable .icon, .disableStaticNAT .icon { background-position: -136px -93px; } .disable:hover .icon, .disableStaticNAT:hover .icon { background-position: -136px -677px; } .add .icon, .addNew .icon, .addLdapAccount .icon, .assignVm .icon, .rootAdminAddGuestNetwork .icon { background-position: -37px -61px; } .add:hover .icon, .addNew:hover .icon, .addLdapAccount:hover .icon, .assignVm:hover .icon, .rootAdminAddGuestNetwork:hover .icon { background-position: -37px -643px; } .assignVmToAnotherAccount .icon { background-position: -232px -97px; } .assignVmToAnotherAccount:hover .icon { background-position: -231px -678px; } .create .icon, .createTemplate .icon, .enableSwift .icon, .addVM .icon, .dedicateZone .icon, .dedicate .icon { background-position: -69px -63px; } .create:hover .icon, .createTemplate:hover .icon, .enableSwift:hover .icon, .addVM:hover .icon, .dedicateZone:hover .icon { background-position: -69px -645px; } .copyTemplate .icon, .copyISO .icon { background-position: -138px -2px; } .copyTemplate:hover .icon, .copyISO:hover .icon { background-position: -138px -584px; } .createVM .icon { background-position: -137px -32px; } .createVM:hover .icon { background-position: -137px -614px; } .enableMaintenanceMode .icon { background-position: -138px -65px; } .enableMaintenanceMode:hover .icon { background-position: -138px -647px; } .cancelMaintenanceMode .icon { background-position: -138px -123px; } .cancelMaintenanceMode:hover .icon { background-position: -138px -705px; } .lock .icon { background-position: -104px -124px; } .lock:hover .icon { background-position: -104px -706px; } .updateResourceLimits .icon { background-position: -100px -32px; } .updateResourceLimits:hover .icon { background-position: -100px -614px; } .addVlanRange .icon, .addVmwareDc .icon { background-position: -37px -62px; } .addVlanRange:hover .icon, .addVmwareDc:hover .icon { background-position: -37px -62px; } .removeVlanRange .icon { background-position: 1px -92px; } .removeVlanRange:hover .icon { background-position: 1px -92px; } .resize .icon, .updateResourceCount .icon { background-position: -167px -66px; } .resize:hover .icon, .updateResourceCount:hover .icon { background-position: -167px -648px; } .generateKeys .icon, .networkACL .icon { background-position: -167px -95px; } .generateKeys:hover .icon, .networkACL:hover .icon { background-position: -167px -677px; } .restoreVM .icon, .restore .icon, .recover .icon { background-position: -168px -31px; } .reset .icon, .reinstall .icon { background-position: -168px -31px; } .scaleUp .icon { background-position: -167px -66px; } .restoreVM:hover .icon, .restore:hover .icon { background-position: -168px -613px; } .reset:hover .icon { background-position: -168px -613px; } .enableVPN .icon { background-position: -198px -3px; } .enableVPN:hover .icon { background-position: -197px -586px; } .disableVPN .icon { background-position: -198px -32px; } .disableVPN:hover .icon { background-position: -197px -615px; } .addIpRange .icon { background-position: -197px -65px; } .addIpRange:hover .icon { background-position: -197px -647px; } .forceReconnect .icon { background-position: -196px -95px; } .forceReconnect:hover .icon { background-position: -196px -677px; } .manage .icon { background-position: -165px -122px; } .manage:hover .icon { background-position: -165px -704px; } .unmanage .icon { background-position: -196px -122px; } .unmanage:hover .icon { background-position: -196px -704px; } .viewConsole .icon { background-position: -231px -2px; } .viewConsole:hover .icon { background-position: -229px -586px; } .moveTop .icon { background-position: -24px -161px; } .moveTop:hover .icon { background-position: -24px -734px; } .moveBottom .icon { background-position: -98px -161px; } .moveBottom:hover .icon { background-position: -98px -734px; } .moveUp .icon { background-position: -2px -161px; } .moveUp:hover .icon { background-position: -2px -734px; } .moveDown .icon { background-position: -55px -161px; } .moveDown:hover .icon { background-position: -55px -734px; } .moveDrag .icon { cursor: move; /*+border-radius:10px;*/ -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; border-radius: 10px 10px 10px 10px; background-position: -74px -162px; } .moveDrag:hover .icon { background-color: #FFFFFF; cursor: move !important; } .uploadVolume .icon { background-position: -232px -34px; } .uploadVolume:hover .icon { background-position: -230px -615px; } .editTags .icon { background-position: -228px -65px; } .editTags:hover .icon { background-position: -228px -646px; } .changeAffinity .icon { background-position: -264px -2px; } .changeAffinity:hover .icon { background-position: -263px -583px; } .releaseFromAccount .icon { background-position: -230px -123px; } .releaseFromAccount:hover .icon { background-position: -229px -704px; } .addAccount .icon { background-position: -231px -96px; } .addAccount:hover .icon { background-position: -230px -677px; } .label-hovered { cursor: pointer; color: #0000FF !important; } .accounts-wizard table { margin: 0; width: 100%; table-layout: fixed; } .accounts-wizard .ui-button { display: inline-block !important; float: none !important; } .accounts-wizard td:last-child { border: none; } .accounts-wizard tbody tr:nth-child(even) { background: #DFE1E3; } .accounts-wizard tbody tr:nth-child(odd) { background: #F2F0F0; } .accounts-wizard .content { display: inline-block; } .accounts-wizard .content td { white-space: nowrap; text-overflow: ellipsis; } .accounts-wizard .content td.select, .accounts-wizard .content th.select { background: none; border-right: 1px solid #BFBFBF; width: 60px !important; min-width: 60px !important; max-width: 60px !important; } .accounts-wizard .content .select input { padding: 0; width: auto; height: auto; margin: 18px 0 0 24px; } .accounts-wizard .content:last-child { margin-left: 14px; } .accounts-wizard table thead th:first-child { width: 50px; min-width: 50px; max-width: 50px; } .accounts-wizard .input-area { width: 320px; font-size: 13px; color: #485867; text-shadow: 0px 2px 1px #FFFFFF; } .ldap-account-choice { border: none !important; border-radius: 0 0 0 0 !important; } .manual-account-details .name { margin-top: 2px; width: 100px; float: left; padding-bottom: 10px; } .manual-account-details { height: auto !important; overflow: visible !important; overflow-x: visible !important; } .manual-account-details label.error { display: block; font-size: 10px; } .manual-account-details .value { float: left; } .manual-account-details .form-item:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .manual-account-details .form-item { padding: 5px; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .manual-account-details select, .manual-account-details input { width: 150px; } .manual-account-details input { background: #F6F6F6; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px; border-radius: 4px 4px 4px 4px; border: 1px solid #AFAFAF; -moz-box-shadow: inset 0px 1px #727272; -webkit-box-shadow: inset 0px 1px #727272; -o-box-shadow: inset 0px 1px #727272; box-shadow: inset 0px 1px #727272; -moz-box-shadow: inset 0px 1px 0px #727272; -webkit-box-shadow: inset 0px 1px 0px #727272; -o-box-shadow: inset 0px 1px 0px #727272; } .manual-account-details > *:nth-child(even) { background: #DFE1E3; } .manual-account-details > *:nth-child(odd) { background: #F2F0F0; } .manual-account-details .value { display: inline-block; }