openo-portal/portal-common/src/main/webapp/common/css/plugins.css

   1 /**\r
   2  * Copyright 2016-2017, CMCC Technologies Co., Ltd.\r
   3  *\r
   4  * Licensed under the Apache License, Version 2.0 (the "License");\r
   5  * you may not use this file except in compliance with the License.\r
   6  * You may obtain a copy of the License at\r
   7  *\r
   8  *         http://www.apache.org/licenses/LICENSE-2.0\r
   9  *\r
  10  * Unless required by applicable law or agreed to in writing, software\r
  11  * distributed under the License is distributed on an "AS IS" BASIS,\r
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
  13  * See the License for the specific language governing permissions and\r
  14  * limitations under the License.\r
  15  */\r
  16 /**************************\r
  17  PLUGIN CSS CUSTOMIZATIONS \r
  18 **************************/\r
  19 \r
  20 /***\r
  21 Calendar with full calendar\r
  22 ***/\r
  23 .external-event {\r
  24   display: inline-block ;\r
  25   cursor:move;\r
  26   margin-bottom: 5px ;  \r
  27   margin-left: 5px ;\r
  28 }\r
  29 \r
  30 .portlet .event-form-title {\r
  31   font-size: 14px;\r
  32   margin-top: 4px;\r
  33   font-weight: 400;\r
  34   margin-bottom: 10px;\r
  35 }\r
  36 \r
  37 .portlet.calendar .fc-button {\r
  38   -webkit-box-shadow: none ;\r
  39      -moz-box-shadow: none ;\r
  40           box-shadow: none ;\r
  41   text-shadow: none;\r
  42   border: 0 ;\r
  43   padding: 6px 8px 30px 8px ;\r
  44   margin-left:2px;  \r
  45   border-top-style: none;\r
  46   border-bottom-style: none;\r
  47   border-right-style: solid;\r
  48   border-left-style: solid;\r
  49   border-color: #ddd;\r
  50   background: transparent;\r
  51   color: #fff;\r
  52   top: -46px;\r
  53 }\r
  54 \r
  55 .portlet.calendar .fc-header {\r
  56   margin-bottom:-21px;\r
  57 }\r
  58 \r
  59 .portlet.calendar .fc-button-prev {\r
  60   padding-right: 10px;\r
  61   padding-left: 8px;\r
  62 }\r
  63 \r
  64 .portlet.calendar .fc-button-next {\r
  65   padding-right: 8px;\r
  66   padding-left: 10px;\r
  67 }\r
  68 \r
  69 .portlet.calendar .fc-button.fc-state-active,\r
  70 .portlet.calendar .fc-button.fc-state-hover {\r
  71   color: #666 ;\r
  72   background-color: #F9F9F9 ;\r
  73 }\r
  74 \r
  75 .portlet.calendar .fc-button.fc-state-disabled {\r
  76   color: #ddd ;\r
  77 }\r
  78 \r
  79 .portlet.calendar .fc-text-arrow {\r
  80   font-size: 22px;\r
  81   font-family: "Courier New", Courier, monospace;\r
  82   vertical-align: baseline; \r
  83 }\r
  84 \r
  85 /* begin: event element */\r
  86 .portlet.calendar .fc-event {\r
  87   border: 0px;\r
  88   background-color: #69a4e0;\r
  89   color: #fff;\r
  90 }\r
  91 \r
  92 .portlet.calendar .fc-event-inner {\r
  93   border: 0px;\r
  94 }\r
  95 \r
  96 .portlet.calendar .fc-event-time {\r
  97   float: left;\r
  98   text-align: left;\r
  99   color: #fff;\r
 100   font-size: 13px;\r
 101   font-weight: 300;\r
 102 }\r
 103 \r
 104 .portlet.calendar .fc-event-title {\r
 105   text-align: left;\r
 106   float: left;\r
 107   color: #fff;\r
 108   font-size: 13px;\r
 109   font-weight: 300;\r
 110 }\r
 111 /* end: event element */\r
 112 \r
 113 .portlet.calendar .fc-header-title h2 {\r
 114   font-size: 14px ;\r
 115   line-height: 20px;\r
 116   font-weight: 400;\r
 117   color: #111;\r
 118 }\r
 119 \r
 120 .portlet.calendar .fc-widget-header {\r
 121   background-image: none ;\r
 122   filter:none;\r
 123   background-color: #eee ;\r
 124   text-transform: uppercase;\r
 125   font-weight: 300;\r
 126 }\r
 127 \r
 128 .portlet.calendar .mobile .fc-button {\r
 129   margin-left: 2px ;\r
 130 }\r
 131 \r
 132 .portlet.calendar .mobile .fc-button {\r
 133     padding: 0px 6px 20px 6px ;\r
 134     margin-left:2px ;\r
 135     border: 0;    \r
 136     background-color: #ddd ;\r
 137       background-image: none;\r
 138       -webkit-box-shadow: none ;\r
 139          -moz-box-shadow: none ;\r
 140               box-shadow: none ;\r
 141       -webkit-border-radius: 0 ;\r
 142          -moz-border-radius: 0 ;\r
 143               border-radius: 0 ;\r
 144       color: #000;\r
 145       text-shadow: none ;\r
 146       text-align: center;\r
 147 }\r
 148 \r
 149 .portlet.calendar .mobile .fc-state-hover, \r
 150 .portlet.calendar .mobile .fc-state-active {\r
 151   background-color: #eee ;\r
 152 }\r
 153 \r
 154 .portlet.calendar .mobile .fc-button-prev {\r
 155   margin-right: 5px;\r
 156   margin-top: -2px;\r
 157 }\r
 158 \r
 159 .portlet.calendar .mobile .fc-button-next {   \r
 160   margin-right: -0px;\r
 161   margin-top: -2px;\r
 162 }\r
 163 \r
 164 .portlet.calendar .mobile .fc-header-space {\r
 165   margin: 0px ;\r
 166   padding: 0px ;\r
 167   width: 0px ;\r
 168 }\r
 169 \r
 170   .portlet.calendar .mobile .fc-state-disabled {\r
 171       color: #bbb ;\r
 172   }\r
 173 \r
 174   .portlet.calendar .mobile .fc-header-left {\r
 175     position: absolute;\r
 176     z-index: 10;\r
 177   }\r
 178     \r
 179   .portlet.calendar .mobile .fc-header-right {\r
 180     position: absolute;\r
 181      z-index: 9;\r
 182   }\r
 183 \r
 184   .portlet.calendar .mobile .fc-header-left .fc-button { \r
 185     top: -2px ;\r
 186   }\r
 187 \r
 188   .portlet.calendar .mobile .fc-header-right {\r
 189     position: relative;\r
 190     right:0;\r
 191   }\r
 192 \r
 193   .portlet.calendar .mobile .fc-header-right .fc-button { \r
 194     top: 35px ;\r
 195   }\r
 196 \r
 197   .portlet.calendar .mobile .fc-content {\r
 198     margin-top: 53px;\r
 199   }\r
 200 \r
 201 \r
 202 /***\r
 203 Form wizard\r
 204 ***/\r
 205 \r
 206 .form-wizard .progress {\r
 207   margin-bottom: 30px;\r
 208 }\r
 209 \r
 210 .form-wizard .steps {\r
 211   //padding: 10px 0;\r
 212   //margin-bottom: 15px;\r
 213 }\r
 214 \r
 215 .form-wizard .steps {  \r
 216   background-color: #fff ;\r
 217   background-image: none ;\r
 218   filter:none ;\r
 219   border: 0px;\r
 220   box-shadow: none ;\r
 221 }\r
 222 \r
 223 .form-wizard .steps li a {\r
 224   background-color: #fff ;\r
 225   background-image: none ;\r
 226   filter:none;\r
 227   border: 0px;\r
 228   box-shadow: none ;\r
 229 }\r
 230 \r
 231 .form-wizard .steps li a:hover {\r
 232   background: none;\r
 233 }\r
 234 \r
 235 .form-wizard .step:hover {\r
 236   text-decoration: none;\r
 237 }\r
 238 \r
 239 .form-wizard .step .number {\r
 240   background-color: #eee;\r
 241   display: inline-block;\r
 242   text-align: center !important;\r
 243   font-size: 16px;\r
 244   font-weight: 300;\r
 245   padding: 11px 15px 13px 15px;\r
 246   margin-right: 10px;\r
 247   height: 45px;\r
 248   width: 45px;\r
 249   -webkit-border-radius: 50% !important;\r
 250      -moz-border-radius: 50% !important;\r
 251           border-radius: 50% !important;\r
 252 }\r
 253 \r
 254 .form-wizard .step .desc {\r
 255   display: inline-block;\r
 256   font-size: 16px;\r
 257   font-weight: 300;\r
 258 }\r
 259  \r
 260 .form-wizard .active .step .number {\r
 261   background-color: #35aa47;\r
 262   color: #fff;\r
 263 }\r
 264 \r
 265 .form-wizard .active .step .desc {\r
 266   color: #333;\r
 267   font-weight: 400;\r
 268 }\r
 269 \r
 270 .form-wizard .step i {\r
 271   display: none;\r
 272 }\r
 273 \r
 274 .form-wizard .done .step .number {\r
 275   background-color: #f2ae43;\r
 276   color: #fff;\r
 277 }\r
 278 \r
 279 .form-wizard .done .step .desc {\r
 280   font-weight: 400;\r
 281 }\r
 282 \r
 283 .form-wizard .done .step i {\r
 284   font-size: 12px;\r
 285   font-weight: normal;\r
 286   color: #999;\r
 287   display: inline-block;\r
 288 }\r
 289 \r
 290 \r
 291 @media (min-width: 600px) and (max-width: 1280px) { \r
 292   .form-wizard .step .desc {\r
 293     margin-top: 10px;\r
 294     display: block;\r
 295   }\r
 296 } \r
 297 \r
 298 @media (max-width: 600px) { \r
 299   .form-wizard .steps > li > a {\r
 300     text-align: left;\r
 301   }\r
 302 } \r
 303 \r
 304 @media (min-width: 600px){\r
 305   .nav-justified>li{\r
 306       display:table-cell;\r
 307           width:1%;\r
 308   }\r
 309 }\r
 310 \r
 311 /***\r
 312 Google Maps\r
 313 ***/\r
 314 .gmaps {\r
 315   height: 300px;\r
 316   width: 100%;\r
 317 }\r
 318 \r
 319 /* important!  bootstrap sets max-width on img to 100% which conflicts with google map canvas*/\r
 320 .gmaps img {\r
 321   max-width: none; \r
 322 }\r
 323 \r
 324 #gmap_static div{\r
 325   background-repeat: no-repeat ;\r
 326   background-position: 50% 50% ;\r
 327   height:100%;\r
 328   display:block;\r
 329   height: 300px;\r
 330 }\r
 331 \r
 332 #gmap_routes_instructions {\r
 333   margin-top: 10px;\r
 334   margin-bottom: 0px;\r
 335 }\r
 336 \r
 337 /***\r
 338 SlimScrollBar plugins css changes\r
 339 ***/\r
 340 .scroller {\r
 341   padding: 0px ;\r
 342   margin: 0px ;\r
 343   padding-right: 12px ;\r
 344   overflow: hidden;\r
 345 }\r
 346 \r
 347 .scroller-footer {\r
 348   margin-top: 10px;\r
 349 }\r
 350 \r
 351 .scroller-footer:after,\r
 352 .scroller-footer:before {\r
 353   content: "";\r
 354   display: table;\r
 355   line-height: 0;\r
 356 }\r
 357 \r
 358 .scroller-footer:after {\r
 359   clear: both;\r
 360 }\r
 361 \r
 362 .portlet-body .slimScrollBar {\r
 363   margin-right: 0px ;\r
 364 }\r
 365 \r
 366 /***\r
 367 jqvmap changes\r
 368 ***/\r
 369 .jqvmap-zoomin {\r
 370   height: 16px;\r
 371   width: 16px;\r
 372   background-color: #666 ;\r
 373 }\r
 374 \r
 375 .jqvmap-zoomout {\r
 376   height: 16px;\r
 377   width: 16px;\r
 378  background-color: #666 ; \r
 379 }\r
 380 \r
 381 .vmaps {\r
 382   position: relative; \r
 383   overflow: hidden;\r
 384   height: 300px;\r
 385 }\r
 386 \r
 387 \r
 388 /***\r
 389 Error state for WYSIWYG Editors\r
 390 ***/\r
 391 .has-error .md-editor,\r
 392 .has-error .wysihtml5-sandbox, \r
 393 .has-error .cke {\r
 394   border: 1px solid #B94A48 !important;\r
 395 }\r
 396 \r
 397 .has-success .md-editor,\r
 398 .has-success .wysihtml5-sandbox, \r
 399 .has-success .cke {\r
 400   border: 1px solid #468847 !important;\r
 401 }\r
 402 \r
 403 /***\r
 404 Select2 plugin css changes\r
 405 ***/\r
 406 \r
 407 /* enable form validation classes for select2 dropdowns */\r
 408 .has-error .select2-container .select2-choice {\r
 409   border-color: #B94A48;\r
 410 }\r
 411 \r
 412 .has-error .select2-container.select2-dropdown-open .select2-choice {\r
 413   border-color: #e5e5e5; \r
 414 }\r
 415 \r
 416 .has-error .select2-container.select2-dropdown-open .select2-choice > span {\r
 417   color: #999999;\r
 418 }\r
 419 \r
 420 .has-success .select2-container .select2-choice {\r
 421   border-color: #468847;\r
 422 }\r
 423 \r
 424 .has-success .select2-container.select2-dropdown-open .select2-choice {\r
 425   border-color: #e5e5e5; \r
 426 }\r
 427 \r
 428 .has-success .select2-container.select2-dropdown-open .select2-choice > span {\r
 429   color: #999999;\r
 430 }\r
 431 \r
 432 \r
 433 /***\r
 434 Jansy File Input plugin css changes\r
 435 ***/\r
 436 .fileinput {\r
 437   margin-bottom: 0;\r
 438 }\r
 439 \r
 440 \r
 441 /***\r
 442 WYSIWYG\r
 443 ***/\r
 444 .wysihtml5-toolbar li {\r
 445   margin: 0px;\r
 446   height: 29px;\r
 447 }\r
 448 \r
 449 .wysihtml5-toolbar li .dropdown-menu {\r
 450   margin-top: 5px;\r
 451 }\r
 452 \r
 453 /***\r
 454 CKEditor css changes\r
 455 ***/\r
 456 .cke_bottom, \r
 457 .cke_inner, \r
 458 .cke_top, \r
 459 .cke_reset, \r
 460 .cke_dialog_title,\r
 461 .cke_dialog_footer,\r
 462 .cke_dialog {\r
 463   background-image: none !important;\r
 464   filter:none ; \r
 465   border-top: 0 ;\r
 466   border-bottom: 0 ;\r
 467    -webkit-box-shadow: none !important;\r
 468       -moz-box-shadow: none !important;\r
 469            box-shadow: none !important;\r
 470   text-shadow:none ;\r
 471 }\r
 472 \r
 473 .cke_dialog_ui_button,\r
 474 .cke_dialog_tab {\r
 475   background-image: none !important;\r
 476   filter:none ;\r
 477   -webkit-box-shadow: none !important;\r
 478   -moz-box-shadow: none !important;\r
 479   box-shadow: none !important;\r
 480   text-shadow:none !important;\r
 481 }\r
 482 \r
 483 .cke_dialog_ui_button:hover,\r
 484 .cke_dialog_tab:hover {\r
 485   text-decoration: none;\r
 486   text-shadow:none ;\r
 487 }\r
 488 \r
 489 .cke_dialog_ui_input_text {\r
 490   background-image: none !important;\r
 491   filter:none ;\r
 492   -webkit-box-shadow: none !important;\r
 493   -moz-box-shadow: none !important;\r
 494   box-shadow: none !important;\r
 495 }\r
 496 \r
 497 .cke_combo_button, \r
 498 .cke_button, \r
 499 .cke_toolbar, \r
 500 .cke_toolgroup {\r
 501   background-image: none !important;\r
 502   filter:none !important;\r
 503   border: 0 ;\r
 504    -webkit-box-shadow: none !important;\r
 505   -moz-box-shadow: none !important;\r
 506   box-shadow: none !important;\r
 507 }\r
 508 \r
 509 .cke_button, \r
 510 .cke_combo_button,\r
 511 .cke_panel_grouptitle,\r
 512 .cke_hc.cke_panel_listItem a {  \r
 513   background-image: none !important;\r
 514   filter:none ;\r
 515   text-shadow:none ;\r
 516   -webkit-border-radius: 0px !important;\r
 517   -moz-border-radius: 0px !important;\r
 518   -ms-border-radius: 0px !important;\r
 519   -o-border-radius: 0px !important;\r
 520 }\r
 521 \r
 522 .cke_button:hover, \r
 523 .cke_combo_button:hover {  \r
 524   background-color: #ddd;\r
 525 }\r
 526 \r
 527 .cke_toolbar_break {\r
 528   background-image: none !important;\r
 529   filter:none !important;\r
 530   border: 0 ;\r
 531   box-shadow: none !important;\r
 532   -webkit-box-shadow : none !important;\r
 533   -moz-box-shadow: none !important;\r
 534   -ms-box-shadow: none !important;\r
 535   -o-box-shadow: none !important;\r
 536 }\r
 537 \r
 538 /***\r
 539 Modify tags input plugin css\r
 540 ***/\r
 541 div.tagsinput {\r
 542   min-height: 35px;\r
 543   height: auto !important;\r
 544   margin: 0;\r
 545   padding: 5px 5px 0px 5px;\r
 546   overflow: auto;\r
 547 }\r
 548 \r
 549 div.tagsinput span.tag {\r
 550   background: #aaa ;\r
 551   color: #fff ;\r
 552   border: 0 ;\r
 553   padding: 3px 6px;\r
 554   margin-top: 0;\r
 555   margin-bottom: 5px;\r
 556 }\r
 557 \r
 558 div.tagsinput input {\r
 559   padding: 3px 6px ; \r
 560   width: 75px !important;\r
 561 }\r
 562 \r
 563 div.tagsinput span.tag a {\r
 564   color: #fff ;\r
 565 }\r
 566 \r
 567 div.tagsinput .not_valid {\r
 568   color: #fff ;\r
 569   padding: 3px 6px ;\r
 570   background-color: #e02222 ;\r
 571 }\r
 572 \r
 573 /***\r
 574 Gritter notification modify\r
 575 ***/\r
 576 \r
 577 #gritter-notice-wrapper {\r
 578   right:1px !important;\r
 579 }\r
 580 \r
 581 .gritter-close {\r
 582   left:auto !important;\r
 583   right: 3px !important;\r
 584 }\r
 585 \r
 586 .gritter-title {\r
 587   font-family:  'Open Sans' ;\r
 588   font-size: 18px ;\r
 589   font-weight: 300 ;\r
 590 }\r
 591 \r
 592 /***\r
 593 jQuery UI Sliders(new in v1.1.1)\r
 594 ***/\r
 595 .slider {\r
 596   border: 0;\r
 597   padding: 0;\r
 598   display: block;\r
 599   margin: 12px 5px;\r
 600   min-height: 11px; \r
 601 }\r
 602 \r
 603 .ui-slider-vertical {\r
 604   width: 11px;\r
 605 }\r
 606 \r
 607 .ui-slider-horizontal .ui-slider-handle {\r
 608   top: -3px;\r
 609 }\r
 610 \r
 611 .ui-slider-vertical .ui-slider-handle {\r
 612   left: -3px;\r
 613 }\r
 614 \r
 615 .ui-slider-vertical,\r
 616 .ui-slider-handle {\r
 617   filter: none !important;\r
 618   background-image: none !important;\r
 619 }\r
 620 \r
 621 /***\r
 622 Dropzone css changes(new in v1.1.1)\r
 623 ***/\r
 624 .dropzone {\r
 625   -webkit-border-radius: 0px ;\r
 626     -moz-border-radius: 0px ;\r
 627          border-radius: 0px ;\r
 628 }\r
 629 \r
 630 \r
 631 /***\r
 632 Dashboard Charts(new in v1.2.1)\r
 633 ***/\r
 634 .easy-pie-chart,\r
 635 .sparkline-chart {\r
 636    text-align: center;\r
 637 }\r
 638 \r
 639 .sparkline-chart {\r
 640   margin-top: 15px;\r
 641   position:relative ;\r
 642 }\r
 643 \r
 644 .easy-pie-chart .number {\r
 645     font-size: 16px;\r
 646     font-weight: 300;\r
 647     width: 85px;\r
 648     margin: 0 auto;\r
 649 }\r
 650 \r
 651 .sparkline-chart .number {  \r
 652     width: 100px;\r
 653     margin: 0 auto;\r
 654     margin-bottom: 10px;\r
 655 }\r
 656 \r
 657 .sparkline-chart .title,\r
 658 .easy-pie-chart .title {\r
 659     display: block;\r
 660     text-align: center;\r
 661     color: #333;\r
 662     font-weight: 300;\r
 663     font-size: 16px;\r
 664     margin-top: 5px;\r
 665     margin-bottom: 10px;\r
 666 }\r
 667 \r
 668 .sparkline-chart .title:hover,\r
 669 .easy-pie-chart .title:hover {\r
 670   color: #666;\r
 671   text-decoration: none;\r
 672 }\r
 673 \r
 674 .sparkline-chart .title > i,\r
 675 .easy-pie-chart .title > i {\r
 676   margin-top: 5px;\r
 677 }\r
 678 \r
 679 /***\r
 680 Fancy box fix overlay fix(in v1.2.4)\r
 681 ***/\r
 682 .fancybox-overlay {\r
 683   z-index: 10000 ;\r
 684 }\r
 685 \r
 686 /***\r
 687 Datatables Plugin(in v1.3)\r
 688 ***/\r
 689 .dataTable {  \r
 690   width: 100% !important;\r
 691   clear: both;\r
 692   /*margin-top: 5px;*/\r
 693 }\r
 694 \r
 695 .dataTables_filter label {\r
 696   line-height: 32px ;\r
 697 }\r
 698 \r
 699 .dataTable .row-details {  \r
 700   margin-top: 3px;\r
 701   display: inline-block;\r
 702   cursor: pointer;\r
 703   width: 14px;\r
 704   height: 14px;\r
 705 }\r
 706 \r
 707 .dataTable .row-details.row-details-close {\r
 708   background: url("../image/datatable-row-openclose.png") no-repeat 0 0;\r
 709 }\r
 710 \r
 711 .dataTable .row-details.row-details-open {  \r
 712   background: url("../image/datatable-row-openclose.png") no-repeat 0 -23px ;\r
 713 }\r
 714 \r
 715 .dataTable .details {\r
 716   background-color: #eee ;\r
 717 }\r
 718 \r
 719 .dataTable .details td,\r
 720 .dataTable .details th {\r
 721   padding: 4px;\r
 722   background: none ;\r
 723   border: 0;\r
 724 }\r
 725 \r
 726 .dataTable .details tr:hover td,\r
 727 .dataTable .details tr:hover th {\r
 728   background: none ;\r
 729 }\r
 730 \r
 731 .dataTable .details tr:nth-child(odd) td,\r
 732 .dataTable .details tr:nth-child(odd) th {\r
 733   background-color: #fff ;\r
 734 }\r
 735 \r
 736 .dataTable .details tr:nth-child(even) td,\r
 737 .dataTable .details tr:nth-child(even) th {\r
 738   background-color: #eee ;\r
 739 }\r
 740 \r
 741 .dataTable > thead > tr > th.sorting,\r
 742 .dataTable > thead > tr > th.sorting_asc,\r
 743 .dataTable > thead > tr > th.sorting_desc {\r
 744    padding-right: 18px;\r
 745 }\r
 746 \r
 747 .dataTable .table-checkbox {\r
 748   width: 8px !important;\r
 749 }\r
 750 \r
 751 @media (max-width: 768px) {  \r
 752   .dataTables_wrapper .dataTables_length .form-control,\r
 753   .dataTables_wrapper .dataTables_filter .form-control {\r
 754     display: inline-block;\r
 755   }\r
 756 \r
 757  /* .dataTables_wrapper .dataTables_info {\r
 758     top: 17px;\r
 759   }*/\r
 760 \r
 761 /*  .dataTables_wrapper .dataTables_paginate {\r
 762     margin-top: -15px;\r
 763   }*/\r
 764 }\r
 765 \r
 766 @media (max-width: 480px) {  \r
 767   .dataTables_wrapper .dataTables_filter .form-control {\r
 768     width: 175px !important;\r
 769   }\r
 770 \r
 771   .dataTables_wrapper .dataTables_paginate {\r
 772     float: left;\r
 773     margin-top: 20px;\r
 774   }\r
 775 }\r
 776 \r
 777 .dataTables_processing {\r
 778   position: fixed;\r
 779   top: 50%;\r
 780   left: 50%;\r
 781   min-width: 125px;\r
 782   margin-left: 0;\r
 783   padding: 7px;\r
 784   text-align: center;\r
 785   color: #333;\r
 786   font-size: 13px;\r
 787   border: 1px solid #ddd;\r
 788   background-color: #eee;  \r
 789   vertical-align: middle;\r
 790   -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);\r
 791      -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);\r
 792           box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);  \r
 793 }\r
 794 \r
 795 .dataTables_processing span {\r
 796   line-height:15px;\r
 797   vertical-align: middle;\r
 798 }\r
 799 \r
 800 .dataTables_empty {\r
 801   text-align: center; \r
 802 }\r
 803 \r
 804 /***\r
 805 Extended Datatable\r
 806 ***/\r
 807 .dataTables_extended_wrapper {\r
 808         position: relative !important;\r
 809         clear: both !important;\r
 810 }\r
 811 .dataTables_extended_wrapper .seperator {\r
 812   padding: 0 2px;\r
 813 }\r
 814 \r
 815 .dataTables_extended_wrapper .dataTables_paginate,\r
 816 .dataTables_extended_wrapper .dataTables_length,\r
 817 .dataTables_extended_wrapper .dataTables_info {\r
 818   display: inline-block;\r
 819   float: none !important;\r
 820   padding: 0 !important;\r
 821   margin: 0 !important;\r
 822   position: static !important;\r
 823   font-size: 13px;\r
 824 }\r
 825 \r
 826 @media (max-width: 480px) { \r
 827 \r
 828   .dataTables_extended_wrapper .dataTables_paginate,\r
 829   .dataTables_extended_wrapper .dataTables_length,\r
 830   .dataTables_extended_wrapper .dataTables_info {\r
 831     display: block;\r
 832     margin-bottom: 10px !important;\r
 833   }\r
 834 \r
 835   .dataTables_extended_wrapper .seperator {\r
 836     display: none;\r
 837   }\r
 838 }\r
 839 \r
 840 .dataTables_extended_wrapper .dataTables_length label {\r
 841   margin: 0 !important;\r
 842   padding: 0 !important;\r
 843   font-size: 13px;\r
 844   float: none !important;\r
 845   display: inline-block !important;\r
 846 }\r
 847 \r
 848 .table-container .table-actions-wrapper {\r
 849   display: none;\r
 850 }\r
 851 \r
 852 /***\r
 853 Password Strength(in v1.4)\r
 854 ***/\r
 855 .password-strength .password-verdict {\r
 856   display: inline-block;\r
 857   margin-top: 6px;\r
 858   margin-left: 5px;\r
 859 }\r
 860 \r
 861 .password-strength .progress {\r
 862   margin-top: 5px;\r
 863   margin-bottom: 0;\r
 864 }\r
 865 \r
 866 .password-strength .progress-bar {\r
 867   padding: 2px;\r
 868 }\r
 869 \r
 870 /***\r
 871 Uniform disabled checkbox, radio button fix(in v1.4)\r
 872 ***/\r
 873 \r
 874 .table .uniform-inline {\r
 875   padding: 0;\r
 876   margin: 0;\r
 877 }\r
 878 \r
 879 .checker {\r
 880   margin-top: -2px !important;\r
 881   margin-right: 2px !important;\r
 882   display:inline;\r
 883 }\r
 884 \r
 885 .checker input,\r
 886 .radio input {\r
 887   outline: none !important;\r
 888 }\r
 889 \r
 890 div.checker.disabled span, \r
 891 div.checker.disabled.active span{\r
 892     background-position: -152px -260px; \r
 893 }\r
 894 \r
 895 div.checker.disabled:hover,\r
 896 div.radio.disabled:hover {\r
 897     cursor: not-allowed;  \r
 898 }\r
 899 \r
 900 div.radio,\r
 901 div.checker {\r
 902  margin-right: 0;\r
 903  margin-left: 3px;\r
 904 }\r
 905 \r
 906 /***\r
 907 jQuery Sparkline\r
 908 ***/\r
 909 .jqstooltip {\r
 910   width: auto !important;\r
 911   height: auto !important;\r
 912 }\r
 913 \r
 914 \r
 915 /***\r
 916 jQuery Multi Select\r
 917 ***/\r
 918 \r
 919 .ms-container .ms-list {\r
 920   border: 1px solid #e5e5e5;\r
 921   -webkit-box-shadow: none;\r
 922      -moz-box-shadow: none;\r
 923           box-shadow: none;\r
 924 \r
 925 }\r
 926 \r
 927 .ms-container .ms-optgroup-label{\r
 928   font-size: 14px;\r
 929 }\r
 930 \r
 931 .ms-container .ms-selectable li.ms-elem-selectable,\r
 932 .ms-container .ms-selection li.ms-elem-selection{\r
 933   font-size: 13px;\r
 934 }\r
 935 \r
 936 .ms-container .ms-list.ms-focus {\r
 937   border-color: #999999;\r
 938   -webkit-box-shadow: none;\r
 939      -moz-box-shadow: none;\r
 940           box-shadow: none;\r
 941 }\r
 942 \r
 943 .ms-container .ms-selectable li.ms-hover,\r
 944 .ms-container .ms-selection li.ms-hover{\r
 945   color: #333;\r
 946   background-color: #eee;\r
 947 }\r
 948 \r
 949 .ms-container .form-control {\r
 950   margin-bottom: 5px;\r
 951 }\r
 952 \r
 953 /***\r
 954 Bootstrap Colorpicker\r
 955 ***/\r
 956 .input-group.color .input-group-btn i {\r
 957   position: absolute;\r
 958   display: block;\r
 959   cursor: pointer;\r
 960   width: 20px;\r
 961   height: 20px;\r
 962   right: 6px;\r
 963 } \r
 964 \r
 965 .colorpicker.dropdown-menu {\r
 966   padding: 5px;\r
 967 }\r
 968 \r
 969 /* change z-index when opened in modal */\r
 970 .modal-open .colorpicker {\r
 971   z-index: 10055 !important;\r
 972 }\r
 973 \r
 974 /***\r
 975 Bootstrap  Datetimepicker\r
 976 ***/\r
 977 \r
 978 .datetimepicker table td {\r
 979   font-weight: 300  !important;\r
 980   font-family: 'Open Sans' !important;\r
 981 }\r
 982 \r
 983 .datetimepicker table th {\r
 984   font-family: 'Open Sans' !important;\r
 985   font-weight: 400  !important;\r
 986 }\r
 987 \r
 988 .datetimepicker.dropdown-menu {\r
 989   padding: 5px;\r
 990 }\r
 991 \r
 992 .datetimepicker .active {  \r
 993   background-color:#4b8df8 !important;\r
 994   background-image: none !important;\r
 995   filter: none !important;\r
 996 }\r
 997 \r
 998 .datetimepicker .active:hover {\r
 999   background-color: #2678FC !important;\r
1000   background-image: none !important;\r
1001   filter: none !important;\r
1002 \r
1003 }\r
1004 \r
1005 /* change z-index when opened in modal */\r
1006 .modal-open .datetimepicker {\r
1007   z-index: 10055 !important;\r
1008 }\r
1009 \r
1010 /***\r
1011 Bootstrap Time Picker\r
1012 ***/\r
1013 .bootstrap-timepicker-widget table td a  {\r
1014   padding: 4px 0;\r
1015 }\r
1016 \r
1017 .bootstrap-timepicker-widget input,\r
1018 .bootstrap-timepicker-widget input:focus {\r
1019   outline: none !important;\r
1020   border: 0;\r
1021 }\r
1022 \r
1023 .modal-open  .bootstrap-timepicker-widget {\r
1024   z-index: 10055 !important;\r
1025 }\r
1026 \r
1027 .bootstrap-timepicker-widget.timepicker-orient-bottom:before,\r
1028 .bootstrap-timepicker-widget.timepicker-orient-bottom:after {\r
1029   top: auto;\r
1030 }\r
1031 \r
1032 /***\r
1033 Bootstrap Datepicker\r
1034 ***/\r
1035 \r
1036 .datepicker.dropdown-menu {\r
1037   padding: 5px;\r
1038 }\r
1039 \r
1040 .datepicker .selected {  \r
1041   background-color:#909090 !important;\r
1042   background-image: none !important;\r
1043   filter: none !important;\r
1044 }\r
1045 \r
1046 .datepicker .active {  \r
1047   background-color:#4b8df8 !important;\r
1048   background-image: none !important;\r
1049   filter: none !important;\r
1050 }\r
1051 \r
1052 .datepicker .active:hover {\r
1053   background-color: #2678FC !important;\r
1054   background-image: none !important;\r
1055   filter: none !important;\r
1056 }\r
1057 \r
1058 .datepicker .input-daterange input {\r
1059   text-align: left;\r
1060 }\r
1061 \r
1062 /* change z-index when opened in modal */\r
1063 .modal-open .datepicker {\r
1064   z-index: 10055 !important;\r
1065 }\r
1066 \r
1067 .datepicker table td {\r
1068   font-weight: 300  !important;\r
1069   font-family: 'Open Sans' !important;\r
1070 }\r
1071 \r
1072 .datepicker table th {\r
1073   font-family: 'Open Sans' !important;\r
1074   font-weight: 400  !important;\r
1075 }\r
1076 \r
1077 \r
1078 /***\r
1079 Clockface\r
1080 ***/\r
1081 \r
1082 .modal-open .clockface {\r
1083   z-index: 10055 !important;\r
1084 }\r
1085 \r
1086 .clockface .cell .inner.active,\r
1087 .clockface .cell .outer.active {\r
1088   background-color:#4b8df8 !important;\r
1089   background-image: none ;\r
1090   filter:none ;\r
1091 }\r
1092 \r
1093 \r
1094 /***\r
1095 Bootstrap Daterangepicker\r
1096 ***/\r
1097 \r
1098 .modal-open .daterangepicker {\r
1099   z-index: 10055 !important;\r
1100 }\r
1101 \r
1102 .daterangepicker td {\r
1103   text-shadow: none ;\r
1104 }\r
1105 \r
1106 .daterangepicker td.active {\r
1107   background-color: #4b8df8 ;\r
1108   background-image: none ;\r
1109   filter:none ;\r
1110 }\r
1111 \r
1112 .daterangepicker th {\r
1113   font-weight: 400;\r
1114   font-size: 14px;\r
1115 }\r
1116 \r
1117 .daterangepicker .ranges input[type="text"]  {\r
1118   width: 70px !important;\r
1119   font-size: 11px;\r
1120   vertical-align: middle;\r
1121 }\r
1122 \r
1123 .daterangepicker .ranges label {\r
1124   font-weight: 300;\r
1125   display: block;\r
1126 }\r
1127 \r
1128 .daterangepicker .ranges .btn {\r
1129   margin-top: 10px;\r
1130 }\r
1131 \r
1132 .daterangepicker.dropdown-menu {\r
1133   padding: 5px;\r
1134 }\r
1135 \r
1136 .daterangepicker .ranges li {\r
1137   color: #333;\r
1138 }\r
1139 \r
1140 .daterangepicker .ranges li.active, \r
1141 .daterangepicker .ranges li:hover {\r
1142   background: #4b8df8 !important;\r
1143   border: 1px solid #4b8df8 !important;\r
1144   color: #fff;\r
1145 }\r
1146 \r
1147 .daterangepicker .range_inputs input {\r
1148   margin-bottom: 0 !important;\r
1149 }\r
1150 \r
1151 /***\r
1152 Bootstrap Editable\r
1153 ***/\r
1154 \r
1155 .editable-input table,\r
1156 .editable-input table th,\r
1157 .editable-input table td,\r
1158 .editable-input table tr {\r
1159   border: 0 !important;\r
1160 }\r
1161 \r
1162 .editable-input .combodate select {\r
1163   margin-bottom: 5px;\r
1164 }\r
1165 \r
1166 /***\r
1167 FuelUX Spinners\r
1168 ***/\r
1169 \r
1170 .spinner-buttons.btn-group-vertical .btn {\r
1171   text-align: center;\r
1172   margin: 0;\r
1173   height: 17px;\r
1174   width: 22px;\r
1175   padding-left: 6px;\r
1176   padding-right: 6px;\r
1177   padding-top: 0px;\r
1178 } \r
1179 \r
1180 \r
1181 /***\r
1182 NoUI Range Sliders\r
1183 ***/\r
1184 .noUi-handle {\r
1185   height: 20px;\r
1186   width: 20px;\r
1187   margin: -3px 0 0 -20px;\r
1188 }\r
1189 \r
1190 .noUi-base {\r
1191   height: 16px;\r
1192 }\r
1193 \r
1194 .noUi-connect {\r
1195   background: #ffb848;\r
1196 }\r
1197 \r
1198 /***\r
1199 Toastr Notifications\r
1200 ***/\r
1201 .toast {\r
1202     -webkit-box-shadow: none !important;\r
1203      -moz-box-shadow: none !important;\r
1204           box-shadow: none !important;\r
1205 }\r
1206 \r
1207 .toast {\r
1208   background-color: #030303;\r
1209 }\r
1210 .toast-success {\r
1211   background-color: #51a351;\r
1212 }\r
1213 .toast-error {\r
1214   background-color: #bd362f;\r
1215 }\r
1216 .toast-info {\r
1217   background-color: #2f96b4;\r
1218 }\r
1219 .toast-warning {\r
1220   background-color: #f89406;\r
1221 }\r
1222 \r
1223 .toast .toast-close-button {\r
1224   display: inline-block;\r
1225   margin-top: 0px;\r
1226   margin-right: 0px;\r
1227   text-indent: -100000px;\r
1228   width: 11px;\r
1229   height: 16px;\r
1230   background-repeat: no-repeat !important;\r
1231   background-image: url("../image/portlet-remove-icon-white.png") !important;\r
1232 }\r
1233 \r
1234 .toast-top-center {\r
1235   top: 12px;\r
1236   margin: 0 auto;\r
1237   left: 50%;\r
1238   margin-left: -150px;\r
1239 }\r
1240 \r
1241 .toast-bottom-center {\r
1242   bottom: 12px;\r
1243   margin: 0 auto;\r
1244   left: 50%;\r
1245   margin-left: -150px;\r
1246 }\r
1247 \r
1248 /***\r
1249 Google reCaptcha\r
1250 ***/\r
1251 .form-recaptcha-img {\r
1252   margin-bottom: 10px;\r
1253   clear: both;\r
1254   border: 1px solid #e5e5e5;\r
1255   padding: 5px;\r
1256 }\r
1257 \r
1258 iframe[src="about:blank"] {\r
1259   display:none;\r
1260 }\r
1261 \r
1262 /***\r
1263 Bootstrap Markdown\r
1264 ***/\r
1265 .md-input {\r
1266   padding: 5px !important;\r
1267   border-bottom: 0 !important;\r
1268 }\r
1269 \r
1270 .md-editor .btn-toolbar {\r
1271   margin-left: 0px;\r
1272 }\r
1273 \r
1274 .md-editor.active {\r
1275   border: 1px solid #999999;\r
1276   -webkit-box-shadow: none !important;\r
1277      -moz-box-shadow: none !important;\r
1278           box-shadow: none !important;\r
1279 }\r
1280 \r
1281 /***\r
1282 Bootstrap Datepaginator\r
1283 ***/\r
1284 .datepaginator a {\r
1285   font-family: 'Open Sans';\r
1286   font-size: 13px;\r
1287   font-weight: 300;\r
1288 }\r
1289 \r
1290 .datepicker .today {\r
1291   background-image: none !important;\r
1292   filter: none !important;\r
1293 }\r
1294 \r
1295 #dp-calendar {\r
1296   right: 4px !important;\r
1297 }\r
1298 \r
1299 /***\r
1300 Font Awesome 4.0 Demo\r
1301 ***/\r
1302 .fa-item {\r
1303   font-size: 14px;\r
1304   padding: 10px 10px 10px 20px;\r
1305 }\r
1306 \r
1307 .fa-item i {\r
1308   font-size: 16px;\r
1309   display: inline-block;\r
1310   width: 20px;\r
1311 }\r
1312 \r
1313 .fa-item:hover {\r
1314   cursor: pointer;\r
1315   background: #eee;  \r
1316 }\r
1317 \r
1318 /***\r
1319 Bootstrap Modal\r
1320 ***/\r
1321 /* fix: content shifting to the right on modal open */\r
1322 .modal-open.page-overflow .page-container,\r
1323 .modal-open.page-overflow .page-container .navbar-fixed-top,\r
1324 .modal-open.page-overflow .page-container .navbar-fixed-bottom,\r
1325 .modal-open.page-overflow .modal-scrollable {\r
1326   overflow-y: auto !important;\r
1327 }\r
1328 \r
1329 .modal-scrollable {\r
1330   overflow: hidden !important;\r
1331 }\r
1332 \r
1333 \r
1334 /***\r
1335 jQuery Notific8 Plugin\r
1336 ***/\r
1337 \r
1338 .jquery-notific8-message {\r
1339   font-size: 13px;\r
1340 }\r
1341 \r
1342 [class*="jquery-notific8"],\r
1343 [class*="jquery-notific8"]:after,\r
1344 [class*="jquery-notific8"]:before {\r
1345    -webkit-box-sizing: content-box;\r
1346       -moz-box-sizing: content-box;\r
1347            box-sizing: content-box;\r
1348 }\r
1349 \r
1350 .right .jquery-notific8-close-sticky span,\r
1351 .left .jquery-notific8-close-sticky span {\r
1352     font-size: 10px;  \r
1353 }\r
1354 \r
1355 .jquery-notific8-heading {\r
1356   font-weight: 300;\r
1357   font-size: 16px;\r
1358 }\r
1359 \r
1360 /***\r
1361 jQuery File Upload\r
1362 ***/\r
1363 \r
1364 .blueimp-gallery .close {  \r
1365   background-image: url("../image/portlet-remove-icon-white.png") !important;\r
1366   margin-top: -2px;\r
1367 }\r
1368 \r
1369 .blueimp-gallery .prev,\r
1370 .blueimp-gallery .next {\r
1371   border-radius: 23px !important;\r
1372 }\r
1373 \r
1374 /***\r
1375 Bootstrap Switch \r
1376 ***/\r
1377 \r
1378 .has-switch {\r
1379   border-color: #e5e5e5;\r
1380 }\r
1381 \r
1382 .has-switch:focus {\r
1383   -webkit-box-shadow: none;\r
1384           box-shadow: none;\r
1385 }\r
1386 \r
1387 /***\r
1388 Jstree\r
1389 ***/\r
1390 \r
1391 .jstree-default .jstree-clicked {\r
1392   border: 0;\r
1393   background-color: #e1e1e1;\r
1394   box-shadow:none;\r
1395 }\r
1396 \r
1397 .jstree-default .jstree-hovered {\r
1398   border: 0;\r
1399   background-color: #eee;\r
1400   box-shadow:none;\r
1401 }\r
1402 \r
1403 .jstree-default .jstree-wholerow-clicked,\r
1404 .jstree-wholerow .jstree-wholerow-clicked {\r
1405   background: none;\r
1406   border: 0;\r
1407   background-color: #e1e1e1;\r
1408   box-shadow:none;\r
1409 }\r
1410 \r
1411 .jstree-default .jstree-wholerow-hovered,\r
1412 .jstree-wholerow .jstree-wholerow-hovered {\r
1413   border: 0;\r
1414   background-color: #eee;\r
1415   box-shadow:none;\r
1416 } \r
1417 \r
1418 .jstree-icon.icon-lg {\r
1419   margin-top: 1px;\r
1420 }\r
1421 \r
1422 .jstree-open > .jstree-anchor > .fa-folder:before {\r
1423   margin-left: 2px;\r
1424   content: "\f07c"; \r
1425 }\r
1426 \r
1427 .jstree-default.jstree-rtl .jstree-last {\r
1428   background: transparent;\r
1429   background-repeat: no-repeat;\r
1430 }\r
1431 \r
1432 .vakata-context,\r
1433 .vakata-context ul {\r
1434   padding: 0;\r
1435   min-width: 125px;\r
1436   background-color: #ffffff;\r
1437   -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);\r
1438   -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);\r
1439   box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);  \r
1440   font-size: 14px;\r
1441   font-family: "Segoe UI",Helvetica, Arial, sans-serif;\r
1442   border: 1px solid #ddd;\r
1443 }\r
1444 \r
1445 .vakata-context li a {\r
1446   padding: 0 10px;\r
1447 }\r
1448 \r
1449 .vakata-context .vakata-context-hover > a,\r
1450 .vakata-context li a:hover {\r
1451   background-color: #eee;\r
1452   color: #333;\r
1453   box-shadow: none;\r
1454 }\r
1455 \r
1456 .vakata-context li a span,\r
1457 .vakata-context li a ins {\r
1458   display: none;\r
1459 }\r
1460 \r
1461 .vakata-context .vakata-context-separator a, \r
1462 .vakata-context-rtl .vakata-context-separator a {\r
1463   margin: 0;\r
1464 }\r
1465 \r
1466 .jstree-rename-input {\r
1467   background-color: #ffffff !important;\r
1468   border: 1px solid #e5e5e5 !important;\r
1469   outline: none !important;\r
1470   padding: 2px 6px !important;\r
1471   margin-right: -4px !important;\r
1472 }\r
1473 \r
1474 /***\r
1475 Bootstrap Select\r
1476 ***/\r
1477 \r
1478 .bootstrap-select .btn {\r
1479   border-color: #e5e5e5;\r
1480 }\r
1481 \r
1482 .bootstrap-select.open .btn1 {\r
1483   border-color: #999999;\r
1484 }\r
1485 \r
1486 .bootstrap-select.open.dropup .btn1 {\r
1487   border-color: #999999;\r
1488 }\r
1489 \r
1490 .bootstrap-select .btn:focus {\r
1491     outline: none !important;\r
1492     outline-offset: 0;\r
1493 }\r
1494 \r
1495 .bootstrap-select.btn-group .dropdown-menu {\r
1496   margin-top: 1px;\r
1497 }\r
1498 \r
1499 .bootstrap-select.btn-group .dropdown-menu > li > dt > .text {\r
1500   font-weight: 600;\r
1501   font-family: 'Open Sans';\r
1502   font-size: 14px;\r
1503 }\r
1504 \r
1505 .bootstrap-select.btn-group .dropdown-menu .text-muted {\r
1506   color: #999 !important;\r
1507 }\r
1508 \r
1509 .bootstrap-select .caret {\r
1510   border: 0;\r
1511   width: auto;\r
1512   height: auto;\r
1513   margin-top: -10px !important;\r
1514 }\r
1515 \r
1516 .bootstrap-select .caret:before {\r
1517     content: "\f107";\r
1518     display: inline-block;\r
1519     border: 0; \r
1520     font-family: FontAwesome;\r
1521     font-style: normal;\r
1522     font-weight: normal;\r
1523 }\r
1524 \r
1525 .bootstrap-select .selected i {\r
1526   color: #aaa;\r
1527 }\r
1528 \r
1529 /***\r
1530 Pace - Page Progress\r
1531 ***/\r
1532 \r
1533 .pace .pace-progress {\r
1534   z-index: 10000;\r
1535   top: 40px;\r
1536   height: 2px;\r
1537 }\r
1538 \r
1539 .pace .pace-progress-inner {\r
1540   box-shadow: none;\r
1541 }\r
1542 \r
1543 .pace .pace-activity {\r
1544   top: 44px;\r
1545   right: 22px;\r
1546   border-radius: 10px !important;\r
1547 }\r
1548 \r
1549 \r
1550 @media (max-width: 480px) { \r
1551 \r
1552   .page-header-fixed .pace .pace-progress {\r
1553     top: 82px;\r
1554   }\r
1555 \r
1556   .page-header-fixed .pace .pace-activity {\r
1557     top: 88px;\r
1558     right: 15px;\r
1559   }\r
1560 \r
1561 }\r