public/assets/css/global/custom.css

   1 /* here you can put your own css to customize and override the theme */
   2 /*.text_filter {
   3 letter-spacing:2px;
   4 font-style:italic;
   5 color:#999;
   6 }*/
   7
   8 /*.toolbar {
   9 float: right;
  10 }*/
  11
  12 /***
  13 Rounded Portlets
  14 ***/
  15 /*
  16 .portlet {
  17 border-radius: 4px !important;
  18 }
  19
  20 .portlet .portlet-title {
  21 border-radius: 4px 4px 0px 0px !important;
  22 }
  23
  24 .portlet .portlet-body,
  25 .portlet .portlet-body .form-actions  {
  26 border-radius: 0px 0px 4px 4px !important;
  27 }
  28 */
  29
  30 /*
  31 Change Quick Sidebar Width
  32 */
  33
  34 /*
  35 .page-quick-sidebar-wrapper {
  36 right: -370px;
  37 width: 370px;
  38 }
  39
  40 .page-quick-sidebar-open.page-quick-sidebar-push-content .page-sidebar-wrapper {
  41 margin-left: -370px;
  42 }
  43
  44 .page-quick-sidebar-open.page-quick-sidebar-push-content .page-footer {
  45 margin-right: 370px;
  46 margin-left: -370px;
  47 }
  48
  49 .page-sidebar-reversed.page-quick-sidebar-open.page-quick-sidebar-push-content .page-sidebar-wrapper {
  50 margin-right: 370px;
  51 }
  52
  53 .page-quick-sidebar-open.page-quick-sidebar-push-content.page-quick-sidebar-full-height .page-header {
  54 margin-left: -370px;
  55 }
  56
  57 .page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-list {
  58 width: 370px !important;
  59 }
  60
  61 .page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-item {
  62 width: 370px !important;
  63 margin-left: 370px;
  64 }
  65
  66 .page-quick-sidebar-wrapper .page-quick-sidebar .page-quick-sidebar-content-item-shown .page-quick-sidebar-list {
  67 margin-left: -370px;
  68 }
  69 */
  70
  71 .file-upload {
  72   position: relative;
  73   overflow: hidden;
  74   background: #00FF33;
  75   border: none;
  76   margin: 1px;
  77   height: 26px;
  78   width: 26px;
  79 }
  80
  81 .file-upload:hover {
  82   background-color: #00CC33;
  83 }
  84
  85 .file-upload input.file-input {
  86   position: absolute;
  87   top: 0;
  88   right: 0;
  89   margin: 0;
  90   padding: 0;
  91   font-size: 20px;
  92   cursor: pointer;
  93   opacity: 0;
  94   filter: alpha(opacity=0);
  95 }
  96
  97 .ta-editor.form-control.myform2-height, .ta-scroll-window.form-control.myform2-height  {
  98   height: 400px;
  99   min-height: 400px;
 100   overflow: auto;
 101   font-family: inherit;
 102   font-size: 100%;
 103 }
 104
 105 .ta-editor.form-control.myform2-height::-webkit-scrollbar {
 106   width: 7px;
 107 }
 108
 109 .form-control.myform2-height > .ta-bind {
 110   min-height: 400px;
 111   padding: 6px 12px;
 112 }
 113
 114 #chat-box {
 115   height: 350px;
 116   overflow : auto;
 117   padding-right: 10px;
 118 }
 119
 120 #chat-box::-webkit-scrollbar {
 121   width: 7px;
 122 }
 123
 124 #mail-box {
 125   height: 781px;
 126   overflow : auto;
 127   padding-right: 10px;
 128 }
 129
 130 #mail-box::-webkit-scrollbar {
 131   width: 7px;
 132 }
 133
 134 .motion-contact-uib-tab div.ng-binding, .motion-newContact-uib-tab div.ng-binding {
 135   border-top: 2px solid #8775a7 !important;
 136 }
 137
 138 .motion-chatRoom-uib-tab div.ng-binding {
 139   border-top: 2px solid #5bc0de !important;
 140 }
 141
 142 .motion-mailRoom-uib-tab div.ng-binding {
 143   border-top: 2px solid #5cb85c !important;
 144 }
 145
 146 .motion-faxRoom-uib-tab div.ng-binding {
 147   border-top: 2px solid #f0ad4e !important;
 148 }
 149
 150 .motion-smsRoom-uib-tab div.ng-binding {
 151   border-top: 2px solid #d9534f !important;
 152 }
 153
 154 .motion-jscripty-uib-tab div.ng-binding {
 155   border-top: 2px solid #002C4C !important;
 156 }
 157
 158 .pretty-avatar {
 159   padding-top: 4px;
 160 }
 161
 162 .pretty-avatar-v {
 163   padding: 2px;
 164 }
 165
 166 .small-pretty-avatar {
 167   height: 27px;
 168   width: 27px;
 169   -webkit-border-radius: 50% !important;
 170   -moz-border-radius: 50% !important;
 171   border-radius: 50% !important;
 172   padding: 2px;
 173   border: 2px solid #3399CC;
 174   border-radius: 100%;
 175   box-shadow: 0 0 4px RGBA(51, 153, 204, 0.4);
 176 }
 177
 178 .small-pretty-avatar-v {
 179   height: 27px;
 180   width: 27px;
 181   -webkit-border-radius: 50% !important;
 182   -moz-border-radius: 50% !important;
 183   border-radius: 50% !important;
 184   padding: 2px;
 185   border: 2px solid #EA4C61;
 186   border-radius: 100%;
 187   box-shadow: 0 0 4px RGBA(51, 153, 204, 0.4);
 188 }
 189
 190 .message-body {
 191   word-wrap: break-word;
 192   white-space: pre-wrap
 193 }
 194
 195 .inactive-link {
 196   pointer-events: none;
 197   cursor: default;
 198 }
 199
 200 .ui-grid-vcenter div {
 201   /*background-color: yellow !important;*/
 202   /*text-align:center;*/
 203   position: relative;
 204   top: 50%;
 205   vertical-align: middle;
 206   text-align:center;
 207   /*padding-left: 10px;*/
 208   -webkit-transform: translateY(-50%);
 209   -ms-transform: translateY(-50%);
 210   transform: translateY(-50%);
 211   /*word-wrap: break-word;*/
 212   white-space: nowrap;
 213   text-overflow: ellipsis;
 214   overflow: hidden !important;
 215 }
 216
 217 .demo {
 218   background-image:url('../../images/demo.png');
 219 }
 220
 221 .float-right{
 222   float: right;
 223 }
 224
 225 .float-left{
 226   float: left !important;
 227 }
 228
 229 .checker {
 230   width: 19px;
 231   height: 19px;
 232 }
 233
 234 .collapse.am-collapse {
 235   animation-duration: .3s;
 236   animation-timing-function: ease;
 237   animation-fill-mode: backwards;
 238   overflow: hidden;
 239   &.in-remove {
 240     animation-name: collapse;
 241     display: block;
 242   }
 243   &.in-add {
 244     animation-name: expand;
 245   }
 246 }
 247
 248 .message-info {
 249   float: right;
 250   color: lightgrey;
 251   margin-right: 5px;
 252 }
 253
 254 .centered-td {
 255   text-align: center;
 256 }
 257
 258 [ui-view].ng-enter{
 259   -webkit-animation: fadeInUpm .5s;
 260   animation: fadeInUpm .5s;
 261 }
 262
 263 .steps-indicator, .steps{
 264   padding-bottom: 20px !important;
 265 }
 266
 267 .ui-sortable-handle,.ui-sortable{
 268   cursor: move;
 269 }
 270
 271 .step .btn:not(.ui-select-toggle,.remove-condition){
 272   margin-bottom: 10px;
 273 }
 274
 275 .mbottom20{
 276   margin-bottom: 20px;
 277 }
 278
 279 .pbottom20{
 280   padding-bottom: 20px;
 281 }
 282
 283 .break-overflow{
 284   overflow-wrap: break-word;
 285 }
 286
 287 button.close {
 288   padding: 0;
 289   cursor: pointer;
 290   background: 0 0;
 291   border: 0;
 292   -webkit-appearance: none;
 293 }
 294 .close {
 295   float: right;
 296   font-size: 21px;
 297   font-weight: 700;
 298   line-height: 1;
 299   color: #000;
 300   text-shadow: 0 1px 0 #fff;
 301   opacity: .2;
 302   filter: alpha(opacity=20);
 303 }
 304
 305 .alert {
 306   padding: 15px !important;
 307   margin-bottom: 20px !important;
 308   border: 1px solid transparent !important;
 309   border-radius: 4px !important;
 310 }
 311 .alert h4 {
 312   margin-top: 0 !important;
 313   color: inherit !important;
 314 }
 315 .alert .alert-link {
 316   font-weight: bold !important;
 317 }
 318 .alert > p,
 319 .alert > ul {
 320   margin-bottom: 0 !important;
 321 }
 322 .alert > p + p {
 323   margin-top: 5px !important;
 324 }
 325 .alert-dismissable,
 326 .alert-dismissible {
 327   padding-right: 35px !important;
 328 }
 329 .alert-dismissable .close,
 330 .alert-dismissible .close {
 331   position: relative !important;
 332   top: -2px !important;
 333   right: -21px !important;
 334   color: inherit !important;
 335 }
 336 .alert-success {
 337   background-color: #dff0d8 !important;
 338   border-color: #d6e9c6 !important;
 339   color: #3c763d !important;
 340 }
 341 .alert-success hr {
 342   border-top-color: #c9e2b3 !important;
 343 }
 344 .alert-success .alert-link {
 345   color: #2b542c !important;
 346 }
 347 .alert-info {
 348   background-color: #d9edf7 !important;
 349   border-color: #bce8f1 !important;
 350   color: #31708f !important;
 351 }
 352 .alert-info hr {
 353   border-top-color: #a6e1ec !important;
 354 }
 355 .alert-info .alert-link {
 356   color: #245269 !important;
 357 }
 358 .alert-warning {
 359   background-color: #fcf8e3 !important;
 360   border-color: #faebcc !important;
 361   color: #8a6d3b !important;
 362 }
 363 .alert-warning hr {
 364   border-top-color: #f7e1b5 !important;
 365 }
 366 .alert-warning .alert-link {
 367   color: #66512c !important;
 368 }
 369 .alert-danger {
 370   background-color: #f2dede !important;
 371   border-color: #ebccd1 !important;
 372   color: #a94442 !important;
 373 }
 374 .alert-danger hr {
 375   border-top-color: #e4b9c0 !important;
 376 }
 377 .alert-danger .alert-link {
 378   color: #843534 !important;
 379 }
 380
 381 .alert .close{
 382   text-indent: inherit !important;
 383   background-image: none !important;
 384   width: auto !important;
 385 }
 386
 387 .page-404 {
 388   text-align: center;
 389 }
 390
 391 .page-404 .number {
 392   position: relative;
 393   top: 35px;
 394   display: inline-block;
 395   letter-spacing: -10px;
 396   margin-top: 0px;
 397   margin-bottom: 10px;
 398   line-height: 128px;
 399   font-size: 128px;
 400   font-weight: 300;
 401   color: #7bbbd6;
 402   text-align: right;
 403 }
 404
 405 .page-404 .details {
 406   margin-left: 40px;
 407   display: inline-block;
 408   padding-top: 0px;
 409   text-align: left;
 410 }
 411
 412 .sounds-title-icon{
 413   font-size: 17px;
 414 }
 415
 416 /*.ui-select-multiple input.ui-select-search {
 417 width: 100% !important;
 418 }*/
 419
 420 .over-topbar, .modal.fade {
 421   z-index: 9996 !important;
 422 }
 423
 424 .list-group-item-custom {
 425   border: none;
 426 }
 427
 428 .pointer-cursor{
 429   cursor: pointer !important;
 430 }
 431
 432 .select-group-father{
 433   font-weight:bold !important;
 434 }
 435
 436 .select-group-son{
 437   font-style: italic !important;
 438 }
 439
 440 @media (max-height: 908px) {
 441   .modal-body-scroll{
 442     max-height: 325px;
 443     overflow-y: scroll;
 444   }
 445 }
 446
 447 .widget .dashboard-stat{
 448   margin-bottom:0px !important;
 449 }
 450
 451 .widget .panel-body{
 452   padding: 0px;
 453 }
 454
 455 .left-margin{
 456   margin-left: 20px;
 457 }
 458
 459 .left-margin-40{
 460   margin-left: 40px;
 461 }
 462
 463 .contact-portlet{
 464   /*overflow-x:hidden;
 465   overflow-y:auto;*/
 466   /*height: 337px;*/
 467 }
 468
 469 .contact-tab{
 470   background: #F1F3FA;
 471   padding-top:20px;
 472 }
 473
 474 .contact-tab-container{
 475   padding-left:20px;
 476   padding-right:20px;
 477 }
 478
 479 .col-fixed, .tree-row {
 480   float: left;
 481 }
 482
 483 .col-fixed {
 484   width: 277px;
 485   margin-right: 15px;
 486 }
 487
 488 .tree-row {
 489   width:calc(100% - 277px + 15px);
 490 }
 491
 492 .tree-search{
 493   float: left;
 494   display: inline-block;
 495   line-height: 18px;
 496   font-weight: 300;
 497   padding: 10px 0;
 498 }
 499
 500 .report-field-handle{
 501   width: 66px;
 502   height:66px;
 503   background-image: url('../../images/move.png');
 504   background-repeat:no-repeat;
 505   background-size:66px 66px;
 506 }
 507
 508 .ui-sortable-helper {
 509   display: table;
 510 }
 511
 512 .report-field-remove{
 513   width: 66px;
 514   height:66px;
 515   text-align: center;
 516 }
 517
 518 .portlet.light .portlet-title {
 519   padding: 0;
 520   min-height: 48px;
 521 }
 522 .portlet .portlet-title {
 523   border-bottom: 1px solid #eee;
 524   padding: 0;
 525   margin-bottom: 10px;
 526   min-height: 41px;
 527   -webkit-border-radius: 4px 4px 0 0;
 528   -moz-border-radius: 4px 4px 0 0;
 529   -ms-border-radius: 4px 4px 0 0;
 530   -o-border-radius: 4px 4px 0 0;
 531   border-radius: 4px 4px 0 0;
 532 }
 533
 534 .ui-select-match-text{
 535   width: 100%;
 536   overflow: hidden;
 537   text-overflow: ellipsis;
 538   padding-right: 20px;
 539 }
 540
 541 .ui-select-choices-row-inner div{
 542   width: 100%;
 543   overflow: hidden;
 544   text-overflow: ellipsis;
 545 }
 546
 547 .ui-select-toggle > .btn.btn-link {
 548   margin-right: 10px;
 549   top: 6px;
 550   position: absolute;
 551   right: 10px;
 552 }
 553
 554 .extract-grid{
 555   min-height: 600px;
 556 }
 557
 558 body > [uib-modal-window]:not([modal-render]) {
 559   display: none;
 560 }
 561
 562 .watermark {
 563   /*border: 1px blue solid;*/
 564   position: absolute;
 565   top: 50%;
 566   transform: translateY(-50%);
 567   opacity: 0.7;
 568   width: 100%;
 569   text-align: center;
 570   z-index: 1000;
 571   font-size: 25px;
 572 }
 573
 574 .centered-uigrid-td {
 575   text-align: center;
 576   margin:4px;
 577 }
 578
 579 .condition{
 580   margin-top: 8px;
 581   margin-bottom:8px;
 582 }
 583
 584 .ms-container .ms-list{
 585   height:430px !important;
 586 }
 587
 588 .ms-container .ms-selectable li.ms-elem-selectable, .ms-container .ms-selection li.ms-elem-selection{
 589   padding: 7px 12px !important;
 590 }
 591
 592 .ms-container{
 593   width:100% !important;
 594 }
 595
 596 .ms-optgroup-label{
 597   text-align: center;
 598   font-weight:bold;
 599   background-color: #F0F0F0;
 600 }
 601
 602 .ui-grid-cell div {
 603   /*word-wrap: break-word;
 604   white-space: nowrap;
 605   text-overflow: ellipsis;
 606   overflow: hidden !important;*/
 607 }
 608
 609 .pause-select{
 610   width:20px;
 611   /*border-color: #E3D9D9;*/
 612   color: #A29999;
 613   border:none;
 614 }
 615
 616 @keyframes blink {  0% {border-color: transparent;}
 617 25% { outline-color: #EACD9E; }
 618 50% { outline-color: #ECC077; }
 619 75% { outline-color: #ECB861; }
 620 100% { outline-color: #FFB848; }
 621 }
 622 .paused-agent{
 623   outline: 2px solid transparent;
 624   animation: blink .5s step-end infinite alternate;
 625   outline-offset:-2px;
 626 }
 627
 628 .otherfields-col{
 629   min-height: 400px !important;
 630   max-width: 100%;
 631 }
 632
 633 .profile-content{
 634   min-height: 800px;
 635 }
 636
 637 .portfolio-stat p {
 638   color: #16a1f2;
 639   display: block;
 640   font-size: 22px;
 641   line-height: 28px;
 642   margin-top: 0px;
 643   font-weight: 200;
 644   width: 100%;
 645   text-transform: uppercase;
 646   overflow: hidden;
 647   text-overflow: ellipsis;
 648 }
 649
 650 .portfolio-stat{
 651   text-transform: uppercase;
 652   padding: 10px 25px;
 653 }
 654
 655 .scrollable-menu {
 656   height: auto;
 657   max-height: 380px;
 658   overflow-x: hidden;
 659 }
 660
 661 .daterangepicker_start_input,.daterangepicker_end_input{
 662   display:none !important;
 663 }
 664
 665 .margin-top20{
 666   margin-top:20px;
 667 }
 668
 669 .disabled-invisible{
 670   color:#EEEEEE !important;
 671 }
 672
 673 .display-none{
 674   display:none !important;
 675 }
 676
 677 .padding-side-7{
 678   padding-right:7px !important;
 679   padding-left:7px !important;
 680 }
 681
 682 .custom-header-a{
 683   padding:4px 6px 1px 8px !important;
 684 }
 685
 686 .custom-header-a div{
 687       color: #c6cfda;
 688       max-width: 100px;
 689       white-space: nowrap;
 690       text-overflow: ellipsis;
 691       overflow: hidden !important;
 692 }
 693
 694 .custom-header-a:hover{
 695   background-color:transparent !important;
 696 }
 697
 698 .page-header.navbar .top-menu .navbar-nav > li.dropdown.open .dropdown-toggle.custom-header-a{
 699   background-color:transparent !important;
 700 }
 701
 702 .header-bar-button{
 703   padding-bottom: 3px !important;
 704   padding-top: 4px !important;
 705   margin-top: 10px !important;
 706   border-radius: 20px !important;
 707 }
 708
 709 .header-bar-button-controls{
 710     border: 1px solid #79869a;
 711 }
 712
 713 .header-ul-with-separator{
 714   height: 46px;
 715   outline: 2px solid #79869a;
 716   outline-offset:-4px;
 717 }
 718
 719 .paused-header{
 720   outline: 2px solid transparent;
 721   animation: blink .5s step-end infinite alternate;
 722   outline-offset:-4px;
 723 }
 724
 725 .custom-date-filter-modal .modal-dialog.modal-md{
 726   width: 350px;
 727 }
 728
 729 .chat-canned-answer-div{
 730   margin-top:15px;
 731   padding-top: 15px;
 732   border-top: 1px solid #eee;
 733 }
 734
 735 rzslider .rz-pointer{
 736   border-radius: 16px !important;
 737 }
 738
 739 rzslider .rz-ticks .rz-tick{
 740   border-radius: 50% !important;
 741 }
 742
 743 .span-link{
 744   color: #337ab7;
 745   text-decoration: none;
 746   text-shadow: none;
 747 }
 748
 749 .span-link:hover{
 750   text-decoration: underline;
 751   cursor:pointer;
 752 }
 753
 754 .custom-logo{
 755   max-height: 23px;
 756 }
 757
 758 .custom-login-logo{
 759   max-height: 140px;
 760 }