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