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