ecomp-sdk-app/src/main/webapp/app/fusion/external/ebz/fn-ebz.css

   1 @CHARSET "ISO-8859-1";
   2
   3 * {
   4         font-family: Arial;
   5 }
   6
   7 /* html, body {
   8         overflow:auto
   9 } */
  10 div.fn-ebz-container {
  11         position: relative;
  12         display: inline-block;
  13         margin-top: 4px;
  14         padding-bottom: 16px;
  15 }
  16
  17 div.fn-ebz-small-container {
  18         position: relative;
  19         display: inline-block;
  20         margin-top: 4px;
  21         padding-bottom: 16px;
  22         height: 30px;
  23 }
  24
  25 .myDivBackground div {
  26         font-family: clearviewatt;
  27         font-size: 11px;
  28         font-weight: normal;
  29         background: rgb(242, 242, 242);
  30 }
  31
  32 .myGrid tr.z-row td.z-row-inner {
  33         border: 0px rgb(242, 242, 242);
  34         border-right: 0px solid transparent;
  35         padding: 0px;
  36 }
  37
  38 .myGrid tr.z-row-over>td.z-row-inner>.z-row-cnt {
  39         color: #00547A;
  40 }
  41
  42 .ebz-radioDiv {
  43         border: 1px solid #8FB9D0;
  44         padding: 10px;
  45         "
  46 }
  47 /**************************************************************************************/
  48 /**************************** following is for button**********************************/
  49 /**************************************************************************************/
  50 .fn-ebz-btn,.fn-ebz-btn.std {
  51         -webkit-border-radius: 6px;
  52         -moz-border-radius: 6px;
  53         border-radius: 6px;
  54         height: 40px;
  55         padding-left: 30px;
  56         padding-right: 30px;
  57         font-size: 18px;
  58         text-align: center;
  59         border: 0px;
  60         cursor: pointer;
  61         color: rgba(255, 255, 255, 1);
  62         margin-top: 5px;
  63         margin-bottom: 5px;
  64 }
  65
  66 .fn-ebz-btn.sm {
  67         -webkit-border-radius: 6px;
  68         -moz-border-radius: 6px;
  69         border-radius: 6px;
  70         height: 30px;
  71         padding-left: 20px;
  72         padding-right: 20px;
  73         font-size: 12px;
  74         text-align: center;
  75         border: 0px;
  76         cursor: pointer;
  77         color: rgba(255, 255, 255, 1);
  78 }
  79
  80 .fn-ebz-btn.primary {
  81         background-color: #067AB4;
  82 }
  83
  84 .fn-ebz-btn.footer {
  85         color: #067AB4;
  86 }
  87
  88 .fn-ebz-btn:hover {
  89         background-color: rgba(0, 145, 217, 1) !important;
  90 }
  91
  92 .fn-ebz-btn:active {
  93         background-color: rgba(57, 176, 236, 1) !important;
  94 }
  95
  96 .fn-ebz-btn:disabled {
  97         background-color: rgba(211, 211, 211, 1) !important;
  98         color: rgba(170, 170, 170, 1);
  99         cursor: initial;
 100 }
 101
 102 .fn-ebz-btn:focus {
 103         outline-offset: 2px; /* not supported in IE */
 104         outline: rgba(57, 176, 236, 1) solid 1px;
 105 }
 106
 107 .fn-ebz-btn.loading {
 108         color: transparent !important;
 109         background: url("../images/fn-ebz-css/processing.gif") no-repeat;
 110         background-position: center;
 111         background-color: rgba(211, 211, 211, 1) !important;
 112 }
 113
 114 .fn-ebz-btn.directional::after {
 115         content: " \2192";
 116         vertical-align: middle;
 117 }
 118
 119 /*************************************************************************************/
 120 /**************************** following is for label**********************************/
 121 /*************************************************************************************/
 122 /*-----------------------------------------------------------------------------------*/
 123 /*---- font-size rules for label, specify top attr when change font size of label ---*/
 124 /*------------------------------ top: -(font-size)px --------------------------------*/
 125 /*-----------------------------------------------------------------------------------*/
 126 label.fn-ebz-text-label,label.fn-ebz-select-label {
 127         position: absolute;
 128         color: #444444;
 129         left: 0px;
 130         top: -5px;
 131         white-space: nowrap;
 132         font-family: Arial;
 133         /*font-size: 12px;*/
 134         font-size: .75rem;
 135 }
 136
 137 label.fn-ebz-radiobtn-label {
 138         background-image: url(../images/fn-ebz-css/radio_btn.png);
 139         -webkit-touch-callout: none;
 140         -webkit-user-select: none;
 141         -khtml-user-select: none;
 142         -moz-user-select: none;
 143         -ms-user-select: none;
 144         user-select: none;
 145 }
 146
 147 /*************************************************************************************/
 148 /**************************** following is for text field ****************************/
 149 /*************************************************************************************/
 150 input[type="password"].fn-ebz-text {
 151         -webkit-border-radius: 6px;
 152         -moz-border-radius: 6px;
 153         border-radius: 6px;
 154         margin-top: 8px;
 155         height: 30px;
 156         width: 250px;
 157         border: 1px solid gray;
 158         font-size: .875rem;
 159         /*font-size: 11px;*/
 160         /*font-weight: bold;*/
 161         padding-left: 10px;
 162 }
 163
 164 input[type="text"].fn-ebz-text {
 165         width: 210px;
 166         margin-right: 20px;
 167 }
 168
 169 input[type="text"].fn-ebz-text:hover {
 170         border: 1px solid black;
 171 }
 172
 173 input[type="text"].fn-ebz-text:hover+label.fn-ebz-text-label {
 174         color: black;
 175 }
 176
 177 input[type="text"].fn-ebz-text:focus {
 178         outline: 0;
 179         border: 1px solid rgba(57, 176, 236, 1);
 180 }
 181
 182 input[type="text"].fn-ebz-text:focus+label.fn-ebz-text-label {
 183         color: rgba(57, 176, 236, 1);
 184 }
 185
 186 input[type="text"].fn-ebz-text:disabled {
 187         background-color: LightGray;
 188 }
 189
 190 input[type="text"].fn-ebz-text:disabled+label.fn-ebz-text-label {
 191         color: LightGray;
 192 }
 193
 194 input[type="text"].fn-ebz-text:hover:disabled {
 195         border: 1px solid gray;
 196 }
 197
 198 input[type="text"].fn-ebz-text:hover:disabled+label.fn-ebz-text-label {
 199         color: LightGray;
 200 }
 201
 202 input[type="text"].fn-ebz-text.small {
 203         width: 30px;
 204         height: 20px;
 205 }
 206
 207 input[type="text"].fn-ebz-text.medium-width {
 208         width: 60px;
 209 }
 210
 211 input[type="text"].fn-ebz-text.large {
 212         width: 350px;
 213 }
 214
 215 input[type="text"].fn-ebz-text.extra-large {
 216         width: 520px;
 217 }
 218
 219 input[type="text"].fn-ebz-text.medium {
 220         width: 200px;
 221         height: 29px;
 222         margin-top: 0;
 223         padding-top: 10px;
 224         padding-right: 10px;
 225         padding-bottom: 10px;
 226         padding-left: 10px;
 227 }
 228
 229 input[type="text"].fn-ebz-text.search {
 230         width: 200px;
 231         height: 30px;
 232         padding-top: 10px;
 233         padding-right: 10px;
 234         padding-bottom: 10px;
 235         padding-left: 10px;
 236 }
 237
 238 input[type="text"].fn-ebz-text.normal {
 239         width: 250px;
 240         height: 30px;
 241         padding-top: 10px;
 242         padding-right: 10px;
 243         padding-bottom: 10px;
 244         padding-left: 10px;
 245 }
 246 /********************************************************************************/
 247 /************************ following is for errors and valid *********************/
 248 /********************************************************************************/
 249 .fn-ebz-error {
 250         border: 1px solid red !important;
 251 }
 252
 253 .fn-ebz-errorGeneric {
 254         border: 1px solid red !important;
 255 }
 256
 257 .fn-ebz-errorGeneric+label.fn-ebz-text-label::after,.fn-ebz-errorGeneric+label.fn-ebz-select-label::after
 258         {
 259         content: url("../images/fn-ebz-css/error_sign_generic.png");
 260         baseline-shift: -2px;
 261         margin-left: 10px;
 262 }
 263
 264 .fn-ebz-validInput {
 265         border: 1px solid green !important;
 266 }
 267
 268 .fn-ebz-validInput+label.fn-ebz-text-label::after {
 269         content: url("../images/fn-ebz-css/warning_sign.png")
 270                 url("../images/fn-ebz-css/10px_space.png")
 271                 url("../images/fn-ebz-css/valid_check.png");
 272         baseline-shift: -2px;
 273         margin-left: 5px;
 274         margin-right: 5px;
 275 }
 276
 277 .fn-ebz-validInput+label.fn-ebz-select-label {
 278         color: green;
 279 }
 280
 281 .fn-ebz-validInput+label.fn-ebz-select-label::after {
 282         content: url("../images/fn-ebz-css/valid_check.png");
 283         baseline-shift: -2px;
 284         margin-left: 10px;
 285 }
 286
 287 /*************************************************************************************************/
 288 /************************************* Following is for tooltips *********************************/
 289 /*************************************************************************************************/
 290 span.fn-ebz-tooltip,span.fn-ebz-tooltip.south {
 291         position: absolute;
 292         height: 30px;
 293         top: 90%;
 294         left: 0%;
 295         line-height: 30px;
 296         text-align: center;
 297         visibility: hidden;
 298         border-radius: 6px;
 299         padding-left: 10px;
 300         padding-right: 10px;
 301         opacity: 0.7;
 302         z-index: 999;
 303         font-weight: bold;
 304         font-size: 14px;
 305         color: #000000;
 306         background: #FFFFFF;
 307         box-shadow: 0px 6px 6px gray;
 308         border: 2px solid #EEEEEE;
 309         text-align: center;
 310         white-space: nowrap;
 311 }
 312
 313 span.fn-ebz-tooltip::before,span.fn-ebz-tooltip.south::before {
 314         content: '';
 315         position: absolute;
 316         bottom: 100%;
 317         left: 14px;
 318         margin-left: -12px;
 319         width: 0;
 320         height: 0;
 321         border-bottom: 12px solid #EEEEEE;
 322         border-right: 12px solid transparent;
 323         border-left: 12px solid transparent;
 324 }
 325
 326 span.fn-ebz-tooltip::after,span.fn-ebz-tooltip.south::after {
 327         content: '';
 328         position: absolute;
 329         bottom: 99%;
 330         left: 14px;
 331         margin-left: -8px;
 332         width: 0;
 333         height: 0;
 334         border-bottom: 8px solid #FFFFFF;
 335         border-right: 8px solid transparent;
 336         border-left: 8px solid transparent;
 337 }
 338
 339 span.fn-ebz-tooltip:hover {
 340         border: 2px solid Darkgray;
 341 }
 342
 343 span.fn-ebz-tooltip:hover.south::before {
 344         border-bottom: 12px solid Darkgray;
 345 }
 346
 347 span.fn-ebz-tooltip:hover.south::after {
 348         border-bottom: 8px solid white;
 349 }
 350
 351 span.fn-ebz-tooltip:hover.north::before {
 352         border-top: 12px solid Darkgray;
 353 }
 354
 355 span.fn-ebz-tooltip:hover.north::after {
 356         border-top: 8px solid white;
 357 }
 358
 359 span.fn-ebz-tooltip.north {
 360         top: -70%;
 361 }
 362
 363 span.fn-ebz-tooltip.north::before {
 364         top: 100%;
 365         border-top: 12px solid #EEEEEE;
 366         border-bottom: 0;
 367 }
 368
 369 span.fn-ebz-tooltip.north::after {
 370         top: 100%;
 371         border-top: 8px solid #FFFFFF;
 372         border-bottom: 0;
 373 }
 374
 375 span.fn-ebz-tooltip.error {
 376         color: #FFFFFF;
 377         padding-left: 30px;
 378         background: url("../images/fn-ebz-css/error_sign_spec.png") no-repeat;
 379         background-position: 10px 7px;
 380         background-color: #FF0000;
 381         border: 0;
 382 }
 383
 384 span.fn-ebz-tooltip.error::before,span.fn-ebz-tooltip.warning:before {
 385         border: 0;
 386 }
 387
 388 span.fn-ebz-tooltip.error.south::after {
 389         border-bottom: 8px solid #FF0000 !important;
 390 }
 391
 392 span.fn-ebz-tooltip.error.north::after {
 393         border-top: 8px solid #FF0000 !important;
 394 }
 395
 396 span.fn-ebz-tooltip.warning {
 397         color: black;
 398         padding-left: 30px;
 399         background: url("../images/fn-ebz-css/warning_sign.png") no-repeat;
 400         background-position: 10px 7px;
 401         background-color: orange;
 402         border: 0;
 403 }
 404
 405 span.fn-ebz-tooltip.warning.south::after {
 406         border-bottom: 8px solid orange !important;
 407 }
 408
 409 span.fn-ebz-tooltip.warning.north::after {
 410         border-bottom: 8px solid orange !important;
 411 }
 412
 413 /*************************************************************************************************/
 414 /************************************* Following is for Dropdown *********************************/
 415 /*************************************************************************************************/
 416 select.fn-ebz-dropdown::-ms-expand {
 417         display: none;
 418 }
 419
 420 select.fn-ebz-dropdown {
 421         -webkit-border-radius: 6px;
 422         -moz-border-radius: 6px;
 423         border-radius: 6px;
 424         -webkit-appearance: none; /* not supported in IE */
 425         -moz-appearance: none; /* not supported in IE */
 426         appearance: none; /* not supported in IE */
 427         height: 30px;
 428         width: 200px;
 429         padding-left: 10px;
 430         padding-right: 30px;
 431         background: url(../images/fn-ebz-css/down_arrow.png) no-repeat right;
 432         background-color: white;
 433         color: gray;
 434         margin-top: 8px;
 435         font-size: 12px;
 436 }
 437
 438 select.fn-ebz-dropdown:hover {
 439         border: 1px solid black;
 440         color: black;
 441 }
 442
 443 select.fn-ebz-dropdown:hover+label.fn-ebz-select-label {
 444         color: black;
 445 }
 446
 447 select.fn-ebz-dropdown:focus {
 448         outline: 0;
 449         color: black;
 450         border: 1px solid rgba(0, 145, 217, 1);
 451         background: url(../images/fn-ebz-css/up_arrow.png) no-repeat right;
 452 }
 453
 454 select.fn-ebz-dropdown:focus+label.fn-ebz-select-label {
 455         color: rgba(0, 145, 217, 1);
 456 }
 457
 458 select.fn-ebz-dropdown.medium {
 459         width: 150px;
 460         height: 29px;
 461         margin: auto;
 462         padding-right: 10px;
 463         padding-left: 10px;
 464 }
 465
 466 select.fn-ebz-dropdown.large {
 467         height: 36px;
 468         font-size: 14px;
 469 }
 470
 471 .mydropdown {
 472         color: gray;
 473         /*font-size:11px;*/
 474         font-size: .875rem;
 475 }
 476
 477 select.fn-ebz-dropdown.search {
 478         width: 200px;
 479         height: 30px;
 480         margin: auto;
 481         padding: 0px;
 482 }
 483 /*************************************************************************************************/
 484 /********************************* following is for radio button *********************************/
 485 /*************************************************************************************************/
 486 div.fn-ebz-container>input[type=radio],input[type=radio].fn-ebz-radiobtn
 487         {
 488         display: none;
 489 }
 490
 491 div.fn-ebz-container>input[type=radio]+label.fn-ebz-radiobtn-label,input[type=radio].fn-ebz-radiobtn+label.fn-ebz-radiobtn-label
 492         {
 493         background-image: url(../images/fn-ebz-css/radio_btn.png);
 494         padding-left: 32px;
 495         height: 30px;
 496         display: block;
 497         line-height: 30px;
 498         background-repeat: no-repeat;
 499         background-position: 0 0px;
 500         font-size: 16px;
 501         vertical-align: middle;
 502         cursor: pointer;
 503         opacity: 0.8;
 504 }
 505
 506 div.fn-ebz-container>input[type=radio]+label.fn-ebz-radiobtn-label:hover,input[type=radio].fn-ebz-radiobtn+label.fn-ebz-radiobtn-label:hover
 507         {
 508         opacity: 1;
 509 }
 510
 511 div.fn-ebz-container>input[type=radio]:checked+label.fn-ebz-radiobtn-label,input[type=radio].fn-ebz-radiobtn:checked+label.fn-ebz-radiobtn-label
 512         {
 513         background-image: url(../images/fn-ebz-css/radio_btn.png);
 514         background-position: 0 -30px;
 515 }
 516
 517 div.fn-ebz-container>input[type=radio]:disabled+label.fn-ebz-radiobtn-label,input[type=radio].fn-ebz-radiobtn:disabled+label.fn-ebz-radiobtn-label
 518         {
 519         -webkit-filter: grayscale(100%);
 520         opacity: 0.5;
 521         cursor: default;
 522 }
 523
 524 label.fn-ebz-radiobtn-label:active {
 525         background-position: 0 -60px !important;
 526         color: rgba(0, 145, 217, 1);
 527 }
 528
 529 div.fn-ebz-container>input[type=radio].fn-ebz-error+label.fn-ebz-radiobtn-label,input[type=radio].fn-ebz-radiobtn.fn-ebz-error+label.fn-ebz-radiobtn-label
 530         {
 531         background-position: 0 -90px;
 532 }
 533
 534 div.fn-ebz-container>input[type=radio].fn-ebz-errorGeneric+label.fn-ebz-radiobtn-label,input[type=radio].fn-ebz-radiobtn.fn-ebz-errorGeneric+label.fn-ebz-radiobtn-label
 535         {
 536         background-position: 0 -90px;
 537 }
 538
 539 /*************************************************************************************************/
 540 /********************************* following is header and footer *********************************/
 541 /*************************************************************************************************/
 542 .ebz_footer {
 543         /*clear: both;*/
 544         border-width: 0px 1px 0px 1px;
 545         border-style: solid;
 546         border-color: #959595;
 547         font-family: inherit;
 548         font-size: 12px;
 549         padding: 10px 10px 30px 10px;
 550         /* background: rgba(6, 124, 180, 0.82) !important; */
 551         background: #067AB4;
 552         color: white;
 553 }
 554
 555 .ebz_header {
 556         border-width: 0px 1px 0px 1px;
 557         border-style: solid;
 558         border-color: #959595;
 559         font-size: 12px;
 560         font-family: inherit;
 561 }
 562
 563 .ebz_header.level1 {
 564         background: #226485;
 565         color: white;
 566 }
 567
 568 .ebz_header.level2 {
 569         background: #067AB4;
 570         padding: 10px 10px 15px 10px;
 571         color: white;
 572         font-size: 20px;
 573 }
 574
 575 .ebz_header.level3 {
 576         background: white;
 577         padding: 10px 10px 10px 10px;
 578         color: black;
 579 }
 580
 581 /*************************************************************************************************/
 582 /********************************* following is for grid in user page ****************************/
 583 /*************************************************************************************************/
 584 .heading1 {
 585         font-family: omnes_att_light;
 586         font-size: 36px;
 587         color: #444444;
 588         margin: 0;
 589         padding: 0;
 590         font-weight: normal;
 591 }
 592
 593 .heading2 {
 594         font-family: omnes_att_light;
 595         font-size: 24px;
 596         color: #444444;
 597         margin: 0;
 598         padding: 0;
 599         font-weight: normal;
 600 }
 601
 602 .heading3 {
 603         font-family: omnes_att_light;
 604         font-size: 16px;
 605         color: #444444;
 606         margin: 0;
 607         padding: 0;
 608         font-weight: bold;
 609 }
 610
 611 .fn-ebz-grid.limited-size {
 612         padding: 0;
 613         margin: 0;
 614         min-height: 40px;
 615         max-width: 940px;
 616         max-height: 900px;
 617 }
 618
 619 .fn-ebz-grid tr.z-row td.z-row-inner,tr.z-row .z-cell {
 620         border: 0 white;
 621         background: rgb(242, 242, 242);
 622 }
 623
 624 .fn-ebz-grid tr.z-grid-odd td.z-row-inner,tr.z-grid-odd .z-cell,tr.z-grid-odd
 625         {
 626         background: rgb(255, 255, 255);
 627 }
 628
 629 .fn-ebz-grid .z-grid-header-bg {
 630         background-image: none;
 631 }
 632
 633 /*      .fn-ebz-grid tr.z-grid-odd .z-row-over{
 634                 background:  rgb(107,166,191);
 635         } */
 636 .fn-ebz-grid .z-column-cnt,.z-row-cnt {
 637         font-size: 13px;
 638         font-weight: normal;
 639         color: black;
 640 }
 641
 642 .fn-ebz-grid .z-column-cnt {
 643         text-align: left;
 644 }
 645
 646 .fn-ebz-grid .z-label {
 647         font-size: 12px;
 648         font-weight: normal;
 649         word-wrap: break-word;
 650         white-space: pre-wrap;
 651 }
 652
 653 .fn-ebz-grid .z-grid-header th.z-column div.z-column-cnt {
 654         white-space: pre-wrap;
 655         color: white;
 656         backgroud: grey;
 657 }
 658
 659 .fn-ebz-grid div.z-grid-header th.z-column,div.z-grid-header th.z-auxheader
 660         {
 661         background: rgb(102, 102, 102) repeat-x 0 0 !important;
 662         background-image: none !important;
 663         background-color: grey;
 664         border-color: grey;
 665         height: 40px;
 666 }
 667
 668 .fn-ebz-grid tr.z-row-over>td.z-row-inner {
 669         border-color: lightgrey;
 670 }
 671
 672 .fn-ebz-grid tr.z-row-over>td.z-row-inner,tr.z-row-over>.z-cell {
 673         background-color: lightgrey;
 674 }
 675
 676 .fn-ebz-grid .z-row-cnt {
 677         color: black;
 678 }
 679
 680 .fn-ebz-grid tr.z-row-over>td.z-row-inner>.z-row-cnt {
 681         color: black;
 682 }
 683
 684 .fn-ebz-btn.grid-btn {
 685         margin: auto;
 686 }
 687
 688 .fn-ebz-grid .z-toolbarbutton-cnt {
 689         padding: 8px 2px;
 690         margin: auto;
 691 }
 692
 693 .z-button-os,.z-label,.z-button,.z-radio-cnt,.z-checkbox-cnt,.z-loading,.z-toolbarbutton-cnt,.z-button tr td
 694         {
 695         font-family: Arial;
 696 }
 697
 698 .fn-ebz-btn.z-button tr td {
 699         color: rgba(255, 255, 255, 1);
 700 }
 701
 702 .fn-ebz-btn.grid-btn.z-toolbarbutton-over .z-toolbarbutton-cnt,.fn-ebz-btn.z-button .z-button-tm,.z-button .z-button-bm,.fn-ebz-btn.z-button .z-button-cm,.z-button .z-button-tl,.fn-ebz-btn.z-button .z-button-tr,.fn-ebz-btn.z-button .z-button-bl,.z-button .z-button-br,.fn-ebz-btn.z-button .z-button-cl,.fn-ebz-btn.z-button .z-button-cr
 703         {
 704         background-image: none;
 705 }
 706
 707 .fn-ebz-btn.z-button .z-button-cm {
 708         padding: 0;
 709 }
 710
 711 .fn-ebz-btn.grid-btn.z-toolbarbutton-over .z-toolbarbutton-body {
 712         border: 0px;
 713 }
 714
 715 .fn-ebz-pop-up {
 716         -webkit-border-radius: 6px;
 717         -moz-border-radius: 6px;
 718         border-radius: 6px;
 719         border-style: solid;
 720         border-width: 1px;
 721         max-width: 360px;
 722 }
 723
 724 .fn-ebz-pop-up .z-label {
 725         margin: 0;
 726         padding: 0;
 727         white-space: pre-wrap;
 728 }
 729
 730 .fn-ebz-pop-up.success {
 731         border-color: #4CA90C;
 732 }
 733
 734 .fn-ebz-pop-up.warning-unsuccess {
 735         border-color: #FF9900;
 736 }
 737
 738 .fn-ebz-pop-up .heading,.fn-ebz-pop-up .heading .z-label {
 739         font-family: Calibri;
 740         font-size: 16px;
 741         font-weight: bold;
 742         white-space: pre-wrap;
 743 }
 744
 745 .fn-ebz-pop-up.success .heading,.fn-ebz-pop-up.success .heading .z-label
 746         {
 747         color: #4CA90C
 748 }
 749
 750 .fn-ebz-pop-up.warning-unsuccess .heading,.fn-ebz-pop-up.warning-unsuccess .heading .z-label
 751         {
 752         color: #FF9900;
 753 }
 754
 755 .fn-ebz-pop-up.success .text-content {
 756         background-image: url('../images/vsp_check_sign.jpg');
 757 }
 758
 759 .fn-ebz-pop-up.warning-unsuccess .text-content {
 760         background-image: url('../images/vsp_warning_sign.jpg');
 761 }
 762
 763 .fn-ebz-pop-up .text-content {
 764         background-repeat: no-repeat;
 765         background-position: 15px center;
 766         background-size: 30px 30px;
 767         margin: 0;
 768         padding: 10px 20px 16px 60px;
 769 }
 770
 771 .fn-ebz-pop-up {
 772         background-color: #FFF;
 773         opacity: 0.95;
 774 }
 775
 776 a.fn-ebz-link {
 777         font-family: Calibri;
 778         text-decoration: none;
 779         color: grey;
 780         font-size: 18px;
 781 }
 782
 783 a.fn-ebz-link:hover {
 784         color: rgb(6, 122, 180);
 785         cursor: pointer;
 786 }
 787
 788 .hide,.show {
 789         width: 100%;
 790         height: 100%;
 791 }
 792
 793 a.collapsibleArrow {
 794         width: 30px;
 795         height: 30px;
 796         margin-left: 10px;
 797 }
 798
 799 .fn-ebz-grid .z-column-unassigned-Image {
 800         width: 7px;
 801         height: 7px;
 802 }
 803
 804 /*************************************************************************************************/
 805 /********************************* following is for info label ***********************************/
 806 /*************************************************************************************************/
 807 .fn-ebz-info-label {
 808         display: inline-block;
 809         width: 300px;
 810         color: black;
 811         padding-left: 30px;
 812         background: url("../images/info_blue.jpg") no-repeat;
 813         background-position: top left;
 814 }
 815
 816 /*************************************************************************************************/
 817 /********************************* following is for ListBox  ****************************/
 818 /*************************************************************************************************/
 819
 820 /*To change the header color to gray*/
 821 .mylistbox .z-listbox-header tr.z-listhead,.mylistheader .z-listbox-header tr.z-auxhead
 822         {
 823         background: rgb(102, 102, 102) repeat-x 0 0 !important;
 824         background-image: none !important;
 825 }
 826
 827 .mylistbox .z-listheader-sort-asc .z-listheader-sort-img,.z-listheader-sort-dsc .z-listheader-sort-img
 828         {
 829         background-position: 0 0;
 830         background-repeat: no-repeat;
 831         background-image: none;
 832 }
 833
 834 .mylistbox tr.z-listbox-odd {
 835         background: rgb(255, 255, 255);
 836 }
 837
 838 .mylistbox .z-listitem {
 839         background: rgb(242, 242, 242);
 840 }
 841
 842 .mylistbox .z-listitem-over {
 843         background-color: rgb(107, 166, 191) !important;
 844         border: none;
 845         cursor: pointer;
 846         text-shadow: 1px 1px 1px #59ACC1;
 847 }
 848
 849 .mylistbox .z-listbox-header-bg {
 850         background-image: none;
 851 }
 852
 853 .mylistbox div.z-listheader-cnt {
 854         color: white;
 855 }
 856
 857 div.z-listbox {
 858         overflow: hidden;
 859         zoom: 1;
 860         background: #FFF;
 861         border: none;
 862         background-image: none;
 863 }
 864
 865 .mylistbox .z-listcell-cnt {
 866         font-size: 13px;
 867         font-family: Arial;
 868 }
 869
 870 div.ebz-listbox {
 871         height: 350px;
 872         border: 1px solid black;
 873         overflow: auto;
 874         border-radius: 6px;
 875         border-color: rgb(105, 138, 154);
 876         background-color: rgb(255, 255, 255);
 877         padding: 10px;
 878         -webkit-border-radius: 10px;
 879         -moz-border-radius: 10px;
 880 }
 881
 882 /*************************************************************************************************/
 883 /********************************* following is for butto on LocationPhoneNosList  ****************************/
 884 /*************************************************************************************************/
 885 .myComboboxTextbox .z-combobox .z-combobox-inp {
 886         border: 1px solid #E6E6E6;
 887         border-top-color: #B2B2B2;
 888         border-right: 0;
 889         padding: 2px;
 890         border-radius: 6px 0 0 2px;
 891         -moz-border-radius: 2px 0 0 2px;
 892         -webkit-border-radius: 6px 0 0 2px;
 893         height: 25px;
 894 }
 895
 896 .myzkBtn {
 897         color: gray;
 898         -webkit-border-radius: 6px;
 899         -moz-border-radius: 6px;
 900         border-radius: 6px;
 901         height: 32px;
 902         width: 32px;
 903         background: white;
 904         margin-top: 8px;
 905 }
 906
 907 .myTextbox {
 908         padding-left: 8px;
 909         border-radius: 6px;
 910         height: 30px;
 911         width: 150px;
 912 }
 913 /*************************************************************************************************/
 914 /********************************* following is for Dashboard ****************************/
 915 /*************************************************************************************************/
 916 .ebz_dashboard .z-panel-br,.ebz_dashboard .z-panel-cr,.ebz_dashboard .z-panel-cl,.ebz_dashboard .z-panel-hr,.ebz_dashboard .z-panel-tr,.ebz_dashboard .z-panel-hl
 917         {
 918         background-image: none;
 919         background-color: white;
 920         color: white;
 921 }
 922
 923 .ebz_dashboard .z-panel-hm .z-panel-header,.ebz_dashboard .z-panel-header
 924         {
 925         background-image: none;
 926         background-color: white;
 927         font-size: 15px;
 928         font-weight: bold;
 929         color: grey;
 930         font-family: Arial;
 931 }
 932
 933 .ebz_dashboard .z-panel-hl {
 934         border-bottom: 0px;
 935 }
 936
 937 .ebz_dashboard .z-panelchildren {
 938         border: 0px;
 939 }
 940
 941 .ebz_dashboard .z-panel-shadow {
 942         box-shadow: 0 2px 5px 0 #bebebe;
 943         border: 3px solid rgb(242, 242, 242);
 944 }
 945
 946 .ebz_dashboard .search_panel_span {
 947         font-size: 12px;
 948 }
 949
 950 .mypanel .z-panel-br,.mypanel .z-panel-cr,.mypanel .z-panel-cl,.mypanel .z-panel-hr,.mypanel .z-panel-tr,.mypanel .z-panel-hl
 951         {
 952         background-image: none;
 953         background-color: grey;
 954         color: white;
 955 }
 956
 957 .mypanel .z-panel-hm .z-panel-header,.mypanel .z-panel-header {
 958         background-image: none;
 959         background-color: grey;
 960         font-size: 15px;
 961         font-weight: bold;
 962         color: white;
 963 }
 964
 965 .adashboard {
 966         color: grey;
 967         text-decoration: none;
 968         font-size: 14px;
 969         font-family: Arial;
 970 }
 971
 972 .adashboard:hover {
 973         color: rgb(6, 122, 180);
 974 }
 975
 976 .horizontal-label {
 977         font-size: 12px;
 978 }
 979
 980 .myDashboard iframe {
 981         position: relative;
 982         height: 100%;
 983         width: 100%;
 984         background: rgb(242, 242, 242);
 985         border: none;
 986 }
 987
 988 .myDashboard .a {
 989         color: grey !important;
 990         font-family: Calibri;
 991         text-decoration: none;
 992         font-size: 18px;
 993 }
 994
 995 .myDashboard .a:hover {
 996         color: rgb(6, 122, 180);
 997 }
 998
 999 .fn-ebz-info {
1000         width: 500px
1001 }
1002
1003 .myDashboard .z-panel-hm .z-panel-header,.myDashboard .z-panel-header {
1004         background-image: none;
1005         background-color: grey;
1006         font-size: 15px;
1007         font-weight: bold;
1008 }
1009
1010 .myDashboard .z-window-overlapped-cnt-noborder {
1011         padding: 0px;
1012 }
1013
1014 .fn_ebz_dashboard_search_dd .select2-container .select2-choice {
1015         height: 30px;
1016         border-top-right-radius: 0px;
1017         border-bottom-right-radius: 0px;
1018         border: 1px solid #D3D3D3;
1019         z-index: 0;
1020 }
1021
1022 .fn_ebz_dashboard_search_dd .select2-container .select2-chosen {
1023         line-height: 30px;
1024 }
1025
1026 .fn_ebz_dashboard_search_dd .select2-container .select2-choice .select2-arrow b:after,.select2-container.select2-container-disabled .select2-choice .select2-arrow b:after
1027         {
1028         height: 30px;
1029         line-height: 30px;
1030 }
1031
1032 .fn_ebz_dashboard_search_dd .select2-results {
1033         margin: -4px 0 0;
1034 }
1035
1036 .fn_ebz_dashboard_search_dd .select2-dropdown-open .select2-choice {
1037         border-top-right-radius: 0 !important;
1038 }
1039
1040 .fn_ebz_dashboard_search_dd .select2-container .select2-choice .select2-arrow
1041         {
1042         border-top-right-radius: 0 !important;
1043 }
1044
1045 .fn_ebz_dashboard_search_button .button {
1046         padding: 6px;
1047         border-bottom-left-radius: 0px;
1048         border-top-left-radius: 0px;
1049 }
1050
1051 .fn_ebz_dashboard_input {
1052         background: white !important;
1053         border-radius: 0 0 0 0 !important;
1054         font-family: Arial !important;
1055         height: 30px !important;
1056         border-left-width: 0px !important;
1057         padding-bottom: 9px !important;
1058 }
1059 /*************************************************************************************************/
1060 /********************************* following is for location Manage ****************************/
1061 /*************************************************************************************************/
1062 .ebz_location_manage tr.z-listitem-seld .z-listcell-cnt,.ebz_location_manage tr.z-listitem-over-seld .z-listcell-cnt,.ebz_location_manage tr.z-listitem-over .z-listcell-cnt
1063         {
1064         color: black;
1065 }
1066
1067 .ebz_location_manage div.z-listbox-header th.z-auxheader {
1068         border: none;
1069 }
1070
1071 .ebz_location_manage div.z-listbox-header div.z-auxheader-cnt {
1072         padding-bottom: 0;
1073 }
1074
1075 .ebz_location_manage div.z-listbox-footer .z-listfooter,.ebz_location_manage div.z-listbox-footer
1076         {
1077         background: none;
1078         border: none;
1079 }
1080
1081 .ebz_location_manage div.z-listbox-footer table {
1082         margin: 0;
1083 }
1084
1085 /*************************************************************************************************/
1086 /********************************* following is for CallFowardAdd ****************************/
1087 /*************************************************************************************************/
1088 .myhlayout .z-hlayout-inner {
1089         vertical-align: middle;
1090 }
1091
1092 .myhlayout {
1093         position: relative;
1094         left: 55px;
1095 }
1096
1097 /* div.tile{
1098         display: table-cell;
1099         position: relative;
1100         height:50%;
1101         border: 1px solid grey;
1102         border-radius: 15px;
1103 }
1104 div.tile-content{
1105         margin: 0;
1106         padding: 20px 20px 100px 20px;
1107         height:100%;
1108 }
1109 div.tile.without_save_btn .tile-content{
1110         padding-bottom: 20px;
1111 }
1112 div.detail{
1113         padding-left:5%;
1114         width: 100%;
1115         height:100%;
1116         display: table;
1117         table-layout: fixed;
1118         border-spacing: 5px;
1119 }
1120 div.detail-row{
1121         display:table-row;
1122         width:100%;
1123         height:100%;
1124 } */
1125 .right-bottom {
1126         position: absolute;
1127         right: 20px;
1128         top: 40px;
1129 }
1130
1131 .lred .tags__item--color.tags__item .tags__item--color-icon {
1132         background: red;
1133         border-color: red;
1134         z-index: 0;
1135 }
1136
1137 .lred .tags__item.tags__item--color {
1138         border: none;
1139 }
1140
1141 .lred .tags__item.tags__item--color:active {
1142         background: none;
1143 }
1144
1145 .lgreen .tags__item--color.tags__item .tags__item--color-icon {
1146         background: #118817;
1147         border-color: #118817;
1148         z-index: 0;
1149 }
1150
1151 .lgreen .tags__item.tags__item--color {
1152         border: none;
1153 }
1154
1155 .lgreen .tags__item.tags__item--color:active {
1156         background: none;
1157 }
1158
1159 ul.tab {
1160         list-style: none;
1161         padding: 0;
1162         margin: 0;
1163 }
1164
1165 ul.tab li {
1166         float: left;
1167         border: 1px solid #000;
1168         border-bottom-width: 0;
1169         margin: 3px 3px 0px 3px;
1170         padding: 5px 5px 0px 5px;
1171         background-color: #CCC;
1172         color: #696969;
1173         cursor: pointer;
1174 }
1175
1176 ul.tab li.active {
1177         background-color: #FFF;
1178         color: #000;
1179 }
1180
1181 a.info-link:before {
1182         content: url(../images/info_blue.jpg);
1183         margin: 0;
1184 }
1185
1186 table.tableSection {
1187         display: table;
1188         width: 100%;
1189 }
1190
1191 table.tableSection thead,table.tableSection tbody {
1192         float: left;
1193         width: 100%;
1194 }
1195
1196 table.tableSection tbody {
1197         overflow: auto;
1198         overflow-x: hidden;
1199 }
1200
1201 table.tableSection tr {
1202         width: 100%;
1203         display: table;
1204         text-align: left;
1205 }
1206
1207 .custom-file-input::-webkit-file-upload-button {
1208         visibility: hidden;
1209 }
1210
1211 .custom-file-input::before {
1212         content: 'Browse';
1213         background-color: #067AB4;
1214         -webkit-border-radius: 6px;
1215         -moz-border-radius: 6px;
1216         border-radius: 6px;
1217         display: inline-block;
1218         height: 30px;
1219         padding-left: 10px;
1220         padding-right: 10px;
1221         padding-top: 5px;
1222         font-size: 14px;
1223         text-align: center;
1224         border: 0px;
1225         cursor: pointer;
1226         color: rgba(255, 255, 255, 1);
1227         margin-top: 5px;
1228         margin-bottom: 5px;
1229         margin_right: 5px
1230 }
1231
1232 .custom-file-input:hover::before {
1233         border-color: black;
1234 }
1235
1236 .custom-file-input:active::before {
1237         background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
1238 }
1239
1240 .ebz_menu_anchorMenuDiv {
1241         position: absolute;
1242         display: none;
1243         margin-top: 0px;
1244         background-color: white;
1245         width: 955px;
1246         border: 1px solid;
1247         border-right: 0px;
1248         color: rgb(211, 211, 211);
1249 }
1250
1251 .ebz_menu_anchorMenuDiv2 {
1252         background-color: white;
1253         width: 130px;
1254         display: true;
1255         border: 1px solid;
1256         color: rgb(211, 211, 211);
1257         float: right;
1258         margin-top: -29px;
1259         box-shadow: 10px 10px 5px #888888;
1260         height: 94vh;
1261         position: relative;
1262         z-index: 1;
1263         border-radius: 8px;
1264 }
1265
1266 .ebz_menu_anchorHead2 {
1267         font-size: 18px;
1268 }
1269
1270 .ebz_menu_meunIcon_div {
1271         width: 1029px;
1272         position: relative;
1273         z-index: 2;
1274 }
1275
1276 .ebz_menu_anchorMenu_div {
1277         width: 1230px;
1278 }
1279
1280 .ebz_menu_anchorIcon {
1281         margin-top: 10px;
1282         font-size: 35px;
1283 }
1284
1285 .ebz_menu_anchorIcon2 {
1286         font-size: 35px;
1287 }
1288
1289 .ebz_menu_anchorIconAndHead {
1290         float: left;
1291         margin-left: 40px;
1292         width: 125px;
1293         height: 95px;
1294 }
1295
1296 .ebz_menu_anchorIconAndHead2 {
1297         margin-top: 20px;
1298         margin-bottom: 20px;
1299 }
1300
1301 .ebz_menu_userItems {
1302         text-transform: none;
1303         line-height: 10px;
1304         font-weight: 100;
1305         color: black;
1306 }
1307
1308 .ebz_menu_userItemsValue {
1309         color: #666666;
1310 }
1311
1312 .ebz_menu_secondLevelOption {
1313         font-size: 18px;
1314         color: #666666;
1315         margin-left: auto;
1316         margin-right: auto;
1317         float: left;
1318 }
1319
1320 .ebz_menu_thirdLevelOptionHeader a {
1321         color: black;
1322         font-weight: bold;
1323         font-size: 12px;
1324 }
1325
1326 .ebz_menu_thirdLevelOptionHeader {
1327         margin-top: 25px;
1328         float: left;
1329         width: 180px;
1330 }
1331
1332 .ebz_menu_userMenuInfoDiv {
1333         margin-top: -252px;
1334         background-color: white;
1335         margin-left: auto;
1336         height: 252px;
1337         width: 207px;
1338         display: block;
1339         border: 1px solid;
1340         color: rgb(211, 211, 211);
1341 }
1342
1343 .ebz_menu_userMenuLogoutDiv {
1344         margin-top: 0px;
1345         margin-left: 441px;
1346         background-color: rgb(250, 250, 250);
1347         height: 252px;
1348         width: 125px;
1349         display: true;
1350         border: 1px solid;
1351         border-right: 0px;
1352         color: rgb(211, 211, 211);
1353 }
1354
1355 .ebz_menu_navBtn a {
1356         position: relative;
1357         font-size: 18px;
1358         color: white;
1359         font-size: 18px;
1360         -webkit-transition-property: position, color; /* Safari */
1361         -webkit-transition-duration: 5s; /* Safari */
1362         transition-property: position, color;
1363         transition-duration: 5s;
1364 }
1365
1366 .ebz_menu_navBtn a:hover {
1367         position: relative;
1368         bottom: 2px;
1369         color: rgb(191, 213, 224);
1370 }
1371
1372 .ebz_search_directory_phone_detail .phoneDetail {
1373         display: inline-block;
1374         margin-left: 20px;
1375         margin-bottom: 20px;
1376 }
1377
1378 .ebz_search_directory_phone_detail .phoneDetailInside .colsize {
1379         width: 180px;
1380         height: 45px;
1381         padding: 0px;
1382 }
1383
1384 .ebz_search_directory_phone_detail .phoneDetailInside {
1385         border: 1px solid;
1386         width: 400px;
1387         height: 250px;
1388         background: white;
1389 }
1390
1391 .ebz_search_button {
1392         color: gray;
1393         -webkit-border-radius: 6px;
1394         -moz-border-radius: 6px;
1395         border-radius: 6px;
1396         height: 32px;
1397         width: 32px;
1398         background: white;
1399         background-repeat: no-repeat;
1400         background-position: center;
1401         margin-top: 0px;
1402 }
1403
1404 .ebz_helpfulInfo {
1405         border-style: solid;
1406         border-width: 1px;
1407         margin-bottom: 50px;
1408 }
1409
1410 .ebz_helpfulInfo .helpfulInfoContent {
1411         margin-left: 10px;
1412         margin-top: 10px;
1413 }
1414
1415 .ebz_helpfulInfo .helpfulInfoTable {
1416         width: 340px;
1417         margin-left: 10px;
1418         display: inline-flex;
1419 }
1420
1421 .ebz_helpfulInfo .helpfulInfoTableHeight {
1422         height: 250px;;
1423 }
1424
1425 .ebz_bulk_edit {
1426         margin-top: 20px;
1427 }
1428
1429 .ebz_bulk_edit .content {
1430         margin-top: 20px;
1431 }
1432
1433 .form-field,.form-field-input-container {
1434         width: 210px !important;
1435         margin-right: 20px;
1436 }
1437
1438 .form-field__square .select2-container .select2-choice,.form-field__square select,.form-field__square
1439         {
1440         -webkit-border-radius: 0;
1441         -moz-border-radius: 0;
1442         border-radius: 0;
1443 }
1444
1445 .form-field__square.left_round_border .select2-container .select2-choice,.form-field__square.left_round_border select,.form-field__square.left_round_border div,.form-field__glued.form-field__square.left_round_border input[type="text"]
1446         {
1447         -webkit-border-radius: 5px 0px 0px 5px;
1448         -moz-border-radius: 5px 0px 0px 5px;
1449         border-radius: 5px 0px 0px 5px;
1450 }
1451
1452 .form-field__square.right_round_border .select2-container .select2-choice,.form-field__square.right_round_border select,.form-field__square.right_round_border div,.form-field__glued.form-field__square.right_round_border input[type="text"]
1453         {
1454         -webkit-border-radius: 0px 5px 5px 0px;
1455         -moz-border-radius: 0px 5px 5px 0px;
1456         border-radius: 0px 5px 5px 0px;
1457 }
1458
1459 .form-field__glued.form-field__square {
1460         margin-right: -5px;
1461 }
1462
1463 .form-field__glued.form-field__square {
1464         vertical-align: top;
1465 }
1466
1467 .form-field__glued.form-field__square input[type=text],.form-field__glued.form-field__square select
1468         {
1469         margin-top: 0;
1470 }
1471
1472 div.hide-password-placeholder>div.form-field>label.form-field__label.form-field__label--show,div.hide-password-placeholder>div.form-field>label.form-field__label.form-field__label--hide
1473         {
1474         visibility: hidden;
1475 }
1476
1477 .col-md-18.content div.fn-ebz-container {
1478         margin-top: 14px;
1479 }
1480
1481 .col-md-18.content div.fixed-in-row {
1482         position: fixed;
1483         top: 115px;
1484         z-index: 95;
1485         width: 725px;
1486 }
1487
1488 .col-md-18.content div.fixed-in-row {
1489         text-align: right;
1490 }
1491
1492 .col-md-18.content .size-onefourth,.form-field__glued.size-onefourth {
1493         width: 25%;
1494 }
1495
1496 .voiceAndCalllog {
1497         display: none;
1498         position: relative;
1499         margin-left: 5px;
1500 }
1501
1502 .loadingId {
1503         position: fixed;
1504         top: 50%;
1505         right: 50%;
1506         z-index: 101;
1507 }
1508
1509 #messagingDashboard .widgetBody {
1510         border: 1px solid #d3d3d3;
1511         overflow: hidden
1512 }
1513
1514 #messagingDashboard .widgetHeader {
1515         height: 50px !important;
1516         border: 1px solid #d3d3d3;
1517         border-bottom: 0;
1518         background-color: #e5e5e5;
1519         padding-right: 20px;
1520         width: 100%;
1521         white-space: nowrap;
1522         text-overflow: ellipsis;
1523         z-index: 1;
1524         -webkit-border-radius: 2px 2px 0 0;
1525         -moz-border-radius: 2px 2px 0 0;
1526         -ms-border-radius: 2px 2px 0 0;
1527         -o-border-radius: 2px 2px 0 0;
1528         border-radius: 2px 2px 0 0;
1529         behavior: url(/ebiz/dashboard/web/common/css/pie/PIE.htc );
1530         position: relative
1531 }
1532
1533 #messagingDashboard .widgetHeader .widgetHeaderContent {
1534         line-height: 44px;
1535         font-family: clearviewatt;
1536         font-size: 18px;
1537         color: #444
1538 }
1539
1540 #messagingDashboard .widgetHeader .widgetSubHeaderContent {
1541         position: absolute;
1542         top: 29.5px;
1543         left: 18px;
1544         font-family: clearviewatt;
1545         font-size: 12px;
1546         color: #444
1547 }
1548
1549 #messagingDashboard input[type="text"].fn-ebz-text {
1550         width: 150px;
1551         margin-top: 0;
1552 }
1553
1554 #messagingDashboard div.without_save_btn {
1555         display: table-cell;
1556 }
1557
1558 #messagingDashboard .content-summary {
1559         margin-top: 20px;
1560         margin-right: 50px;
1561 }
1562
1563 .appBody {
1564         background-color: rgb(242, 242, 242)
1565 }
1566
1567 .att-drawer {
1568         z-index: 997 !important;
1569 }
1570
1571 .secondaryMenuContainer {
1572         z-index: 1000;
1573 }
1574
1575 .appContent {
1576         margin-left: 50px;
1577
1578         display: inline-block;
1579         float: left;
1580 }
1581
1582 .appLeftMenu{
1583         display: inline-block;
1584         float: left;
1585         width:200px;
1586         height:1px;
1587
1588 }
1589
1590 .appLeftMenu .appLeftMenuDiv{
1591         position: relative;
1592         color: black;
1593         top: 70px;
1594 }
1595
1596 .appLeftMenu .appLeftMenuAccordDiv{
1597         margin-left:10px;
1598         margin-right:10px;
1599
1600         }
1601 .appFooter{
1602         display: inline-block;
1603          width:100%
1604 }
1605 .drawer-backdrop{
1606                 position:relative !important;
1607 }
1608
1609 .license-notification{
1610         position:fixed;
1611         top:60px;
1612         right:20px;
1613         z-index: 999;
1614 }