1/**
2 * WHMCS Main Style Sheet
3 *
4 * Additional styles for WHMCS beyond Bootstrap
5 *
6 * This stylesheet contains all the customized styling used
7 * by WHMCS. Overrides to Bootstrap styles can be found in
8 * overrides.css.
9 *
10 * @project WHMCS
11 * @cssdoc version 1.0-pre
12 * @package WHMCS
13 * @author WHMCS Limited <development@whmcs.com>
14 * @copyright Copyright (c) WHMCS Limited 2005-2018
15 * @license http://www.whmcs.com/license/
16 * @link http://www.whmcs.com/
17 */
18
19html,body {
20 height: 100%;
21}
22
23body {
24 background-color: #f8f8f8;
25}
26
27.primary-bg-color {
28 background-color: #fff;
29}
30
31h1, h2, h3, h4, h5, h6 {
32 font-weight: 400;
33}
34
35a {
36 color: #058;
37}
38
39/**
40 * -------------------------
41 * @section Sections
42 * -------------------------
43 */
44
45section#header {
46 margin: 0;
47 padding: 10px 0;
48 background-color: #fff;
49 border-radius: 5px 5px 0 0;
50}
51
52section#header .logo img {
53 margin: 0;
54 padding: 0;
55 max-height: 50px;
56 vertical-align: middle;
57}
58section#header .logo-text {
59 font-family: 'Raleway';
60 font-weight: 400;
61 font-size: 2.6em;
62 white-space: nowrap;
63}
64
65section#header .search {
66 margin: 20px 0;
67}
68section#header .search .form-control {
69 border-color: #eee;
70 box-shadow: none;
71}
72section#header .search .btn {
73 background-color: #eee;
74 border-color: #eee;
75 color: #888;
76}
77
78section#main-body {
79 margin: 0;
80 padding: 20px 0;
81 min-height: 350px;
82 background-color: #fff;
83}
84
85section#main-content {
86 margin-bottom: 60px;
87}
88
89.main-content {
90 margin-bottom: 60px;
91 min-height: 300px;
92}
93
94section#footer {
95 margin: 0;
96 padding: 20px 10px;
97 background-color: #f8f8f8;
98 border-top: 1px solid #ddd;
99 color: #666;
100 font-size: 0.9em;
101}
102section#footer p {
103 margin: 0;
104}
105
106@media (min-width: 450px) {
107 section#footer {
108 line-height: 32px;
109 }
110}
111
112section#footer .back-to-top {
113 float: right;
114}
115section#footer .back-to-top i {
116 padding: 10px;
117 background-color: #ddd;
118 color: #888;
119 border-radius: 3px;
120 opacity: 0.7;
121}
122
123.adminreturndiv {
124 display: none !important;
125}
126
127.alert-bordered-left {
128 border: 0;
129 border-left: 3px solid;
130 border-radius: 0;
131 text-align: left;
132}
133
134.truncate {
135 white-space: nowrap;
136 overflow: hidden;
137 text-overflow: ellipsis;
138}
139
140.text-md {
141 font-size: 1.2em;
142}
143
144/**
145 * -------------------------
146 * @section Main Navbar
147 * -------------------------
148 */
149
150.navbar-main > li.dropdown:hover > ul.dropdown-menu {
151 display: block;
152}
153.navbar-main .navbar-toggle {
154 border-color: transparent;
155}
156.navbar-main .navbar-toggle .icon-bar {
157 background-color: #eee;
158}
159.navbar-main .navbar-toggle:focus,
160.navbar-main .navbar-toggle:hover {
161 background-color: transparent;
162}
163.navbar-main .navbar-toggle:focus .icon-bar,
164.navbar-main .navbar-toggle:hover .icon-bar {
165 background-color: #bbb;
166}
167
168@media (max-width: 991px) {
169 .navbar-main .navbar-nav>li>a {
170 padding: 3px 20px;
171 }
172
173 .navbar-main .open .dropdown-menu .dropdown-header,
174 .navbar-main .open .dropdown-menu>li>a {
175 padding: 3px 25px;
176 }
177}
178
179/**
180 * -------------------------
181 * @section General Styles
182 * -------------------------
183 */
184
185div.header-lined h1 {
186 margin-top: 0;
187 margin-bottom: 15px;
188 padding:6px 0;
189 border-bottom:1px solid #ccc;
190 font-weight: 400;
191 color: #058;
192}
193
194div.header-lined .breadcrumb {
195 margin-top: -15px;
196 padding-left: 0;
197 background: transparent;
198 font-size: 0.8em;
199 border-radius: 0 0 4px 4px;
200}
201div.header-lined .breadcrumb li a {
202 color: #888;
203}
204div.header-lined .breadcrumb > .active {
205 color: #0e5077;
206}
207
208div.header-lined small {
209 white-space: nowrap;
210 overflow: hidden;
211}
212
213@media (max-width: 600px) {
214 h1,.h1{font-size:26px}
215 h2,.h2{font-size:20px}
216 h3,.h3{font-size:16px}
217 h4,.h4{font-size:14px}
218 h5,.h5{font-size:12px}
219 h6,.h6{font-size:11px}
220 div.header-lined small {
221 display: none;
222 }
223}
224
225@media (min-width: 380px) {
226 .btn-input-padded-responsive {
227 padding-left: 20px;
228 padding-right: 20px;
229 }
230}
231@media (min-width: 500px) {
232 .btn-input-padded-responsive {
233 padding-left: 35px;
234 padding-right: 35px;
235 }
236}
237
238.form-horizontal .checkbox-inline.no-padding,
239.no-padding {
240 padding: 0;
241}
242
243#fullpage-overlay {
244 display: table;
245 position: fixed;
246 z-index: 1000;
247 top: 0;
248 left: 0;
249 width: 100%;
250 height: 100%;
251 background-color: black;
252 background-color: rgba(0, 0, 0, 0.8);
253 color: #fff;
254}
255#fullpage-overlay .outer-wrapper {
256 position: relative;
257 height: 100%;
258}
259#fullpage-overlay .inner-wrapper {
260 position: absolute;
261 top: 50%;
262 left: 50%;
263 height: 30%;
264 width: 50%;
265 margin: -3% 0 0 -25%;
266 text-align: center;
267}
268#fullpage-overlay .msg {
269 display: inline-block;
270 padding: 20px;
271 max-width: 400px;
272}
273
274.compact-control-bar {
275 margin: 0;
276 padding: 5px;
277 background-color: #eee;
278 border-radius: 3px;
279}
280
281/**
282 * -------------------------
283 * @section Margin Classes
284 * -------------------------
285 */
286
287.margin-10 {
288 margin: 10px;
289}
290.margin-bottom {
291 margin-bottom: 20px;
292}
293.margin-top-5 {
294 margin-top: 5px;
295}
296.margin-bottom-5 {
297 margin-bottom: 5px;
298}
299
300.col-button-left {
301 padding-left: 0;
302 padding-right: 7px;
303}
304.col-button-right {
305 padding-left: 7px;
306 padding-right: 0;
307}
308.margin-top {
309 margin-top: 1.5em;
310}
311
312/**
313 * -------------------------
314 * @section Form Classes
315 * -------------------------
316 */
317
318.input-inline {
319 display: inline-block;
320}
321
322.input-inline-100 {
323 width: 100px;
324}
325
326.select-inline {
327 display: inline-block;
328 width: auto;
329}
330
331.form-group .field-error-msg {
332 display: none;
333 font-size: 0.85em;
334 color: #cc0000;
335}
336
337/**
338 * -------------------------
339 * @section Responsive Pull Left & Right
340 * -------------------------
341 */
342
343@media (min-width: 992px) {
344 .pull-md-left {
345 float: left;
346 }
347 .pull-md-right {
348 float: right;
349 }
350}
351@media (min-width: 768px) {
352 .pull-sm-left {
353 float: left;
354 }
355 .pull-sm-right {
356 float: right;
357 }
358 .text-right-sm {
359 text-align: right;
360 }
361}
362
363/**
364 * -------------------------
365 * @section Login Page
366 * -------------------------
367 */
368
369.logincontainer {
370 margin: 40px auto 100px auto;
371 padding: 0 10px;
372 max-width: 500px;
373}
374
375.logincontainer.with-social {
376 max-width: 650px;
377}
378
379.logincontainer .social-signin-btns {
380 padding: 23px 0;
381}
382
383@media (max-width: 500px) {
384 .logincontainer .social-signin-btns .btn {
385 display: block;
386 width: 100%;
387 }
388}
389
390@media (max-width: 600px) {
391 .logincontainer {
392 margin: 0 auto 30px auto;
393 }
394}
395
396@media (min-width: 768px) {
397 .logincontainer.with-social .login-form {
398 padding-right: 29px;
399 border-right: 1px solid #ddd;
400 }
401 .logincontainer .social-signin-btns .btn {
402 display: block;
403 width: 100%;
404 }
405}
406
407/**
408 * -------------------------
409 * @section Icons
410 * -------------------------
411 */
412
413i.icon-rss {
414 color: #ff6600;
415}
416
417/**
418 * -------------------------
419 * @section Main Menu
420 * -------------------------
421 */
422
423section#main-menu {
424 background-color: #006687;
425}
426
427/**
428 * -------------------------
429 * @section Home Page Banner
430 * -------------------------
431 */
432
433section#home-banner {
434 margin: 0;
435 padding: 50px 0 60px;
436 background-color: #043d5f;
437 color: #fff;
438}
439
440section#home-banner.with-recaptcha {
441 padding-bottom: 90px;
442}
443
444section#home-banner .tooltip-inner {
445 background-color: #00a3c6;
446}
447
448section#home-banner .tooltip.left .tooltip-arrow {
449 border-left-color: #00a3c6;
450}
451
452section#home-banner .tooltip.bottom .tooltip-arrow {
453 border-bottom-color: #00a3c6;
454}
455
456section#home-banner .tooltip.right .tooltip-arrow {
457 border-right-color: #00a3c6;
458}
459
460section#home-banner h2 {
461 margin: 0;
462 padding: 0 25px 10px 25px;
463}
464
465section#home-banner .form-control {
466 border-radius: 0;
467 border: 0;
468 box-shadow: none;
469 font-weight: 300;
470}
471
472section#home-banner .btn {
473 border-radius: 0;
474 border: 0;
475 font-weight: 300;
476 color: #fff;
477}
478
479section#home-banner .btn.search {
480 background-color: #4ab98b;
481}
482section#home-banner .btn.transfer {
483 background-color: #bbb;
484}
485
486@media (max-width: 992px) {
487 section#home-banner h2 {
488 font-size: 26px;
489 }
490}
491
492@media (max-width: 767px) {
493 section#home-banner h2 {
494 font-size: 22px;
495 }
496}
497
498/**
499 * -------------------------
500 * @section Home Page Shortcut Buttons
501 * -------------------------
502 */
503
504.home-shortcuts {
505 margin: 0;
506 background: #25a2c7;
507 color: #fff;
508}
509.home-shortcuts ul {
510 list-style-type: none;
511 margin: 0;
512 padding: 0;
513}
514.home-shortcuts li {
515 float: left;
516 width: 24%;
517 padding: 5px 3px;
518 border-right: 1px solid #0E88B0;
519 font-size: 0.9em;
520 text-align: center;
521 cursor: pointer;
522 overflow: hidden;
523 white-space: nowrap;
524}
525.home-shortcuts li:first-child {
526 border-left: 1px solid #0E88B0;
527}
528.home-shortcuts li a {
529 display: block;
530 color: #fff;
531 text-decoration: none;
532}
533.home-shortcuts li i {
534 font-size: 22px;
535}
536.home-shortcuts li p {
537 margin: 2px 0 0;
538 text-transform: uppercase;
539}
540.home-shortcuts li span {
541 display: none;
542}
543.home-shortcuts li:hover span {
544 display: inline-block;
545}
546.home-shortcuts .lead {
547 margin: 0;
548 line-height: 55px;
549}
550@media (max-width: 992px) {
551 .home-shortcuts ul {
552 text-align: center;
553 }
554}
555@media (max-width: 767px) {
556 .home-shortcuts li {
557 display: block;
558 float: none;
559 width: 100%;
560 border-right: 0;
561 border-bottom: 1px solid #0E88B0;
562 }
563 .home-shortcuts li:first-child {
564 border-left: 0;
565 }
566 .home-shortcuts li:last-child {
567 border: 0;
568 }
569 .home-shortcuts ul:hover li {
570 width: 100%;
571 }
572}
573
574/**
575 * -------------------------
576 * Client Homepage
577 * -------------------------
578 */
579
580.text-domain {
581 font-size: 12px;
582 color: #006687;
583}
584
585.client-home-panels .panel > .panel-heading {
586 background-color: #fff;
587 border-bottom: 0;
588 font-weight: bold;
589}
590.client-home-panels .panel > .panel-heading .panel-title .btn {
591 color: #fff;
592 border: 0;
593}
594.client-home-panels .panel > .panel-heading .panel-title .btn:hover {
595 color: #000;
596}
597.client-home-panels .panel small {
598 color: #888;
599}
600.client-home-panels .panel > .panel-body {
601 padding: 0;
602 max-height: 170px;
603 overflow: auto;
604}
605.client-home-panels .panel > .panel-footer {
606 border-top: 0;
607}
608.client-home-panels .panel > .panel-body p {
609 padding: 10px 15px;
610}
611.client-home-panels .panel > .list-group {
612 max-height: 170px;
613 overflow: auto;
614 border-top: 1px solid #ddd;
615 border-bottom: 1px solid #ddd;
616}
617
618.client-home-panels .panel > .list-group .list-group-item {
619 padding: 4px 10px;
620}
621
622.client-home-panels .panel > .list-group .list-group-item:last-child {
623 border-bottom: 0;
624}
625
626.home-kb-search {
627 margin-bottom: 15px;
628}
629.home-kb-search .form-control {
630 padding-left: 50px;
631 background-color: #fff;
632 border: 1px solid #eee;
633 color: #999;
634 font-weight: 300;
635}
636.home-kb-search .form-control:focus {
637 border-color: #eee;
638 outline: 0;
639 -webkit-box-shadow: none;
640 box-shadow: none;
641}
642.home-kb-search i {
643 float: left;
644 margin-top: -30px;
645 margin-left: 20px;
646 color: #777;
647}
648
649/**
650 * -------------------------
651 * Client Homepage Tiles
652 * -------------------------
653 */
654
655.tiles {
656 margin: 0 15px 15px 15px;
657}
658.tiles .tile {
659 padding: 12px 20px;
660 background-color: #f8f8f8;
661 border-right: 1px solid #ccc;
662}
663.tiles .tile a {
664 text-decoration: none;
665}
666.tiles .tile:hover {
667 background-color: #f2f2f2;
668 cursor: pointer;
669}
670.tiles .tile .highlight {
671 margin-top: 4px;
672 height: 2px;
673 border-radius: 2px;
674}
675.tiles .tile:last-child {
676 border: 0;
677}
678@media (max-width: 767px) {
679 .tiles .tile:nth-child(2) {
680 border: 0;
681 }
682 .tiles .tile:nth-child(1),
683 .tiles .tile:nth-child(2) {
684 border-bottom: 1px solid #ccc;
685 }
686}
687.tile .icon {
688 position: absolute;
689 top: 10px;
690 right: 10px;
691 font-size: 48px;
692 line-height: 1;
693 color: #ccc;
694}
695.tile .stat {
696 margin-top: 20px;
697 font-size: 40px;
698 line-height: 1;
699}
700.tile .title {
701 font-weight: bold;
702 color: #888;
703 text-transform: uppercase;
704 font-size: 12px;
705}
706
707/**
708 * -------------------------
709 * Panel Accents
710 * -------------------------
711 */
712
713.panel.panel-accent-gold {
714 border-top: 3px solid #f0ad4e;
715}
716.panel.panel-accent-green {
717 border-top: 3px solid #5cb85c;
718}
719.panel.panel-accent-red {
720 border-top: 3px solid #d9534f;
721}
722.panel.panel-accent-blue {
723 border-top: 3px solid #5bc0de;
724}
725.panel.panel-accent-orange {
726 border-top: 3px solid #f39c12;
727}
728.panel.panel-accent-pink {
729 border-top: 3px solid #e671b8;
730}
731.panel.panel-accent-purple {
732 border-top: 3px solid #7b4f9d;
733}
734.panel.panel-accent-lime {
735 border-top: 3px solid #8cbf26;
736}
737.panel.panel-accent-magenta {
738 border-top: 3px solid #ff0097;
739}
740.panel.panel-accent-teal {
741 border-top: 3px solid #00aba9;
742}
743.panel.panel-accent-turquoise {
744 border-top: 3px solid #1abc9c;
745}
746.panel.panel-accent-emerald {
747 border-top: 3px solid #2ecc71;
748}
749.panel.panel-accent-amethyst {
750 border-top: 3px solid #9b59b6;
751}
752.panel.panel-accent-wet-asphalt {
753 border-top: 3px solid #34495e;
754}
755.panel.panel-accent-midnight-blue {
756 border-top: 3px solid #2c3e50;
757}
758.panel.panel-accent-sun-flower {
759 border-top: 3px solid #f1c40f;
760}
761.panel.panel-accent-pomegranate {
762 border-top: 3px solid #c0392b;
763}
764.panel.panel-accent-silver {
765 border-top: 3px solid #bdc3c7;
766}
767.panel.panel-accent-asbestos {
768 border-top: 3px solid #7f8c8d;
769}
770.panel.panel-accent-brand-cpanel-orange {
771 border-top: 3px solid #ff6c2c;
772}
773.panel.panel-accent-brand-xovinow-blue {
774 border-top: 3px solid #10069F;
775}
776
777/**
778 * -------------------------
779 * Background Colors
780 * -------------------------
781 */
782
783.bg-color-gold {
784 background-color: #f0ad4e;
785}
786.bg-color-green {
787 background-color: #5cb85c;
788}
789.bg-color-red {
790 background-color: #d9534f;
791}
792.bg-color-blue {
793 background-color: #5bc0de;
794}
795.bg-color-orange {
796 background-color: #f39c12;
797}
798.bg-color-pink {
799 background-color: #e671b8;
800}
801.bg-color-purple {
802 background-color: #7b4f9d;
803}
804.bg-color-lime {
805 background-color: #8cbf26;
806}
807.bg-color-magenta {
808 background-color: #ff0097;
809}
810.bg-color-teal {
811 background-color: #00aba9;
812}
813.bg-color-turquoise {
814 background-color: #1abc9c;
815}
816.bg-color-emerald {
817 background-color: #2ecc71;
818}
819.bg-color-amethyst {
820 background-color: #9b59b6;
821}
822.bg-color-wet-asphalt {
823 background-color: #34495e;
824}
825.bg-color-midnight-blue {
826 background-color: #2c3e50;
827}
828.bg-color-sun-flower {
829 background-color: #f1c40f;
830}
831.bg-color-pomegranate {
832 background-color: #c0392b;
833}
834.bg-color-silver {
835 background-color: #bdc3c7;
836}
837.bg-color-asbestos {
838 background-color: #7f8c8d;
839}
840
841/**
842 * -------------------------
843 * @section Navigational Bar
844 * -------------------------
845 */
846
847ul.top-nav {
848 float: right;
849 margin-top: 8px;
850 padding-left: 0;
851 margin-bottom: 0;
852 list-style: none;
853 white-space: nowrap;
854}
855ul.top-nav > li,
856ul.top-nav > li > a {
857 display: inline-block;
858 position: relative;
859}
860ul.top-nav > li > a {
861 padding: 6px 10px;
862 color: #777;
863 line-height: 20px;
864 text-decoration: none;
865}
866ul.top-nav > li:active > a,
867ul.top-nav > li:focus > a,
868ul.top-nav > li:hover > a,
869ul.top-nav > li > a:focus {
870 color: #333;
871 text-decoration: none;
872 background: transparent;
873}
874ul.top-nav > li.primary-action {
875 padding-left: 15px;
876 margin-left: 5px;
877 border-left: solid 1px #ddd;
878}
879ul.top-nav > li.primary-action > a.btn {
880 padding: 6px 15px;
881 background-color: #0e5077;
882 color: #fff;
883 border-radius: 3px;
884}
885ul.top-nav > li > a.btn-logged-in-admin {
886 margin-left: 5px;
887 font-size: 1.5em;
888}
889ul.top-nav .tooltip-inner {
890 margin-left: -200px;
891 min-width: 250px;
892 width: 250px;
893}
894
895@media (max-width: 991px) {
896 ul.top-nav {
897 font-size: 0.9em;
898 }
899 ul.top-nav > li.primary-action > a.btn {
900 padding: 4px 12px;
901 font-size: 1em;
902 }
903 ul.top-nav > li > a.btn-logged-in-admin {
904 margin-top: -2px;
905 }
906}
907
908@media (max-width: 767px) {
909 ul.top-nav {
910 margin: 0;
911 font-size: 0.8em;
912 }
913 ul.top-nav > li > a {
914 padding: 6px;
915 }
916 ul.top-nav > li.primary-action > a.btn {
917 padding: 3px 12px;
918 font-size: 1em;
919 }
920}
921
922/**
923 * -------------------------
924 * @section Twitter Feed
925 * -------------------------
926 */
927
928div.home-twitter {
929 margin-top: 20px;
930 margin-bottom: 40px;
931}
932div.tweet > i {
933 color: #2BABCF;
934 float: left;
935 margin-right: 15px;
936}
937div.tweet span {
938 font-size: 12px;
939 color: #ccc;
940}
941
942/**
943 * -------------------------
944 * @section Announcements Page
945 * -------------------------
946 */
947
948div.announcement-single {
949 margin: 0 0 20px 0;
950}
951div.announcement-single blockquote {
952 margin-top: 30px;
953}
954div.announcement-single .label {
955 margin-right: 10px;
956}
957
958.announcement-single {
959 margin: 0 0 25px 0;
960}
961.announcement-single .title {
962 font-size: 1.5em;
963 font-weight: bold;
964}
965.announcement-single p {
966 margin: 2px 0 10px;
967}
968.announcement-single .article-items {
969 font-size: 0.85em;
970 color: #888;
971}
972
973/**
974 * -------------------------
975 * @section Product Details Page
976 * -------------------------
977 */
978
979div.product-details {
980 margin: 0 0 20px 0;
981}
982div.product-details div.product-icon {
983 margin: 0;
984 background-color: #efefef;
985 border-radius: 10px;
986 padding: 30px;
987 line-height: 1em;
988 font-size: 60px;
989}
990@media (max-width: 767px) {
991 div.product-details div.product-icon {
992 font-size: 30px;
993 }
994}
995
996.product-status {
997 margin: 0 0 20px 0;
998 padding: 0;
999 border-radius: 10px;
1000}
1001.product-status-pending {
1002 background-color: #F89406;
1003}
1004.product-status-active {
1005 background-color: #46A546;
1006}
1007.product-status-suspended {
1008 background-color: #0768B8;
1009}
1010.product-status-terminated,
1011.product-status-cancelled {
1012 background-color: #666;
1013}
1014.product-status-fraud {
1015 background-color: #000;
1016}
1017.product-status-text {
1018 padding: 5px;
1019 color: #fff;
1020 text-align: center;
1021 text-transform: uppercase;
1022}
1023
1024div.product-details-tab-container {
1025 margin: 0;
1026 padding: 20px;
1027 border: 1px solid #ddd;
1028 border-top: 0;
1029 background-color: #fff;
1030}
1031
1032.module-client-area {
1033 padding: 15px 15px 0 15px;
1034}
1035
1036.ssl-inactive {
1037 cursor: pointer;
1038}
1039
1040.promo-container {
1041 margin-bottom: 20px;
1042}
1043
1044#mc-promo-widgets {
1045 margin: 10px 0;
1046}
1047@media (min-width: 1200px) {
1048 #mc-promo-widgets {
1049 display: grid;
1050 grid-template-columns: repeat(2, 1fr);
1051 column-gap: 20px;
1052 }
1053}
1054
1055.mc-promo-manage,
1056.mc-promo-login {
1057 position: relative;
1058}
1059
1060.mc-promo-manage .panel,
1061.mc-promo-login .panel {
1062 padding: 10px;
1063}
1064
1065.mc-promo-manage .panel-title,
1066.mc-promo-login .panel-title {
1067 font-size: 18px;
1068}
1069
1070.mc-promo-manage .logo,
1071.mc-promo-login .logo {
1072 display: inline-block;
1073 vertical-align: middle;
1074 position: relative;
1075 margin-right: 1em;
1076}
1077
1078.mc-promo-manage .logo,
1079.mc-promo-login .logo {
1080 width: 130px;
1081 height: 130px;
1082}
1083@media (max-width: 767px) {
1084 .mc-promo-manage .logo,
1085 .mc-promo-login .logo {
1086 width: 65px;
1087 height: 65px;
1088 }
1089}
1090
1091.mc-promo-manage .logo img,
1092.mc-promo-login .logo img {
1093 display: block;
1094 margin: 0 -50% 0 auto;
1095 border-radius: 4px;
1096 position: absolute;
1097 top: 50%;
1098 left: 50%;
1099 transform: translate(-50%, -50%);
1100 max-width: 130px;
1101 max-height: 130px;
1102}
1103@media (max-width: 767px) {
1104 .mc-promo-manage .logo img,
1105 .mc-promo-login .logo img {
1106 max-width: 65px;
1107 max-height: 65px;
1108 }
1109}
1110
1111.mc-promo-manage .logo + div,
1112.mc-promo-login .logo + div {
1113 display: inline-block;
1114 position: absolute;
1115 top: 50%;
1116 transform: translate(0, -50%);
1117}
1118
1119@media (max-width: 767px) {
1120 .mc-promo-manage .panel-heading,
1121 .mc-promo-login .panel-heading {
1122 padding: 10px 10px 5px 10px;
1123 }
1124 .mc-promo-manage .panel-body,
1125 .mc-promo-login .panel-body {
1126 padding: 5px 10px 10px 10px;
1127 }
1128}
1129
1130
1131/**
1132 * -------------------------
1133 * @section List Tables
1134 * -------------------------
1135 */
1136
1137.dataTables_wrapper .dataTables_info {
1138 margin: 0;
1139 padding: 9px 10px;
1140 background-color: #4f5360;
1141 border: 0;
1142 border-bottom: 1px solid #fff;
1143 font-size: 0.9em;
1144 color: #fff;
1145 border-radius: 0;
1146 text-align: left !important;
1147}
1148div.dataTables_wrapper div.dataTables_info {
1149 padding: 21px 30px !important;
1150 font-weight: 300;
1151}
1152
1153.dataTables_wrapper table.table-list {
1154 margin-top: 0 !important;
1155 margin-bottom: 6px !important;
1156 width: 100% !important;
1157}
1158
1159.dataTables_wrapper table.table-list thead th {
1160 border-bottom: 4px solid #a2d27a;
1161 font-weight: normal;
1162}
1163.dataTables_wrapper table.table-list thead th:nth-child(even) {
1164 border-bottom: 4px solid #7bc144;
1165}
1166
1167.dataTables_wrapper table.table-list thead th.sorting_asc,
1168.dataTables_wrapper table.table-list thead th.sorting_desc {
1169 background-color: #f6f6f6;
1170}
1171
1172.dataTables_wrapper .dataTables_filter {
1173 float: right;
1174}
1175.dataTables_wrapper .dataTables_filter label {
1176 margin: 0;
1177 padding: 12px;
1178}
1179.dataTables_wrapper .dataTables_filter label .form-control {
1180 background: url('../../../assets/img/search.png') #fff no-repeat 8px 5px;
1181 padding: 7px 10px 7px 45px!important;
1182 border: 1px solid #fff;
1183 height: auto;
1184 width: 200px;
1185 font-size: 13px;
1186 border-radius: 2px;
1187}
1188
1189@media (max-width: 600px) {
1190 .dataTables_wrapper .dataTables_info {
1191 padding: 9px 10px 40px;
1192 }
1193 .dataTables_wrapper .dataTables_filter {
1194 float: right;
1195 margin-top: 30px;
1196 width: 100%;
1197 }
1198 .dataTables_wrapper .dataTables_filter label {
1199 display: block;
1200 margin: 5px;
1201 padding: 0;
1202 }
1203 .dataTables_wrapper .dataTables_filter label .form-control {
1204 margin: 0;
1205 width: 100%;
1206 }
1207}
1208
1209.dataTables_wrapper .dataTables_length {
1210 background-color: #f6f6f6;
1211 font-size: 0.8em;
1212 color: #888;
1213}
1214.dataTables_wrapper .dataTables_length label {
1215 padding: 10px 10px 0 30px;
1216}
1217.dataTables_wrapper .dataTables_length label .form-control {
1218 display: inline-block;
1219 padding: 2px;
1220 height: 25px;
1221 width: auto;
1222 border: 0;
1223}
1224
1225.dataTables_wrapper .dataTables_paginate {
1226 float: right;
1227 padding: 6px 30px 0;
1228}
1229
1230.dataTables_wrapper .dataTables_paginate .pagination > li > a,
1231.dataTables_wrapper .dataTables_paginate .pagination > li > span {
1232 padding: 4px 8px;
1233}
1234
1235.pagination>li>a,
1236.pagination>li>span {
1237 color: #444;
1238}
1239.pagination>.active>a,
1240.pagination>.active>a:focus,
1241.pagination>.active>a:hover,
1242.pagination>.active>span,
1243.pagination>.active>span:focus,
1244.pagination>.active>span:hover {
1245 background-color: #4f5360;
1246 border-color: #4f5360;
1247}
1248
1249table.dataTable.dtr-inline.collapsed tbody td:first-child:before, table.dataTable.dtr-inline.collapsed tbody th:first-child:before {
1250 top: inherit !important;
1251 box-shadow: none !important;
1252 line-height: 16px !important;
1253}
1254
1255.table-container {
1256 padding: 0 0 25px 0;
1257}
1258
1259table.table-list thead th {
1260 padding: 8px;
1261 background-color: #fff;
1262 border-bottom: 1px solid #ccc;
1263 color: #333;
1264 text-align: center;
1265}
1266
1267.table-list > tbody > tr:hover {
1268 cursor: pointer;
1269 cursor: hand;
1270}
1271
1272table.table-list tbody td {
1273 padding: 10px;
1274 vertical-align: middle;
1275 font-size: 0.94em;
1276}
1277
1278.table-list > tbody > tr > td a.border-left {
1279 border-left: 1px solid #eee;
1280 padding-left: 20px;
1281 display: block;
1282}
1283
1284
1285.table-list > tbody > tr > td {
1286 background-color: #fff;
1287}
1288.table-list > tbody > tr:nth-child(even) > td {
1289 background-color: #f8fcfd;
1290}
1291
1292table.dtr-inline .dtr-title:empty {
1293 display: none !important;
1294}
1295
1296table.dtr-inline .responsive-edit-button {
1297 display: none;
1298}
1299
1300table.dtr-inline.collapsed .responsive-edit-button {
1301 display: inherit;
1302}
1303/**
1304 * -------------------------
1305 * @section Status Lights
1306 * -------------------------
1307 */
1308
1309.status {
1310 display: block;
1311 font-size: 0.9em;
1312 line-height: 22px;
1313 border: 2px solid #ccc;
1314 border-radius: 3px;
1315 background-color: #fff;
1316 color: #333;
1317}
1318
1319.status-custom {
1320 background-color: white;
1321 color: black;
1322 border: 1px solid black;
1323 padding: 1px;
1324}
1325
1326.status-pending {
1327 color: #D9534F;
1328}
1329.status-pending-transfer {
1330 color: #A68500;
1331}
1332.status-active,
1333.status-open,
1334.status-completed {
1335 color: #3fad46;
1336}
1337.status-suspended {
1338 color: #F0AD4E;
1339}
1340.status-customer-reply {
1341 color: #ff6600;
1342}
1343.status-fraud,
1344.status-answered {
1345 color: #000000;
1346}
1347.status-expired,
1348.status-transferred-away {
1349 color: #004258;
1350}
1351.status-pending-registration,
1352.status-redemption,
1353.status-grace {
1354 color: #F89406;
1355}
1356.status-cancelled {
1357 color: #9FA29A;
1358}
1359.status-terminated {
1360 color: #666;
1361}
1362.status-onhold {
1363 color: #224488;
1364}
1365.status-inprogress {
1366 color: #cc0000;
1367}
1368.status-closed {
1369 color: #888;
1370}
1371
1372.status-paid {
1373 color: #498302;
1374}
1375.status-unpaid {
1376 color: #ED3E48;
1377}
1378.status-cancelled {
1379 color: #87939F;
1380}
1381.status-collections {
1382 color: #9A141E;
1383}
1384.status-refunded {
1385 color: #319FC3;
1386}
1387
1388.status-customer-reply {
1389 color: #ff6600;
1390}
1391
1392.status-delivered {
1393 color: #224488;
1394}
1395
1396.status-accepted {
1397 color: #498302;
1398}
1399.status-lost, .status-dead {
1400 color: #000;
1401}
1402
1403/**
1404 * -------------------------
1405 * @section Affiliates Page
1406 * -------------------------
1407 */
1408
1409.affiliate-stat {
1410 margin: 0;
1411 padding: 15px;
1412 font-size: 1.6em;
1413 text-align: center;
1414}
1415
1416.affiliate-stat span {
1417 display: block;
1418 font-size: 2.4em;
1419}
1420
1421.affiliate-stat i {
1422 float: left;
1423 padding: 10px;
1424 font-size: 4em;
1425}
1426
1427.affiliate-referral-link {
1428 margin: 40px 0;
1429}
1430
1431.affiliate-referral-link span {
1432 display: block;
1433 margin: 0;
1434 padding: 10px;
1435 font-size: 1.4em;
1436 border-radius: 10px;
1437 border: 1px solid #ccc;
1438 overflow: hidden;
1439}
1440
1441@media (max-width: 1200px) {
1442 .affiliate-stat {
1443 font-size: 1.2em;
1444 }
1445 .affiliate-stat span {
1446 font-size: 2.1em;
1447 }
1448 .affiliate-stat i {
1449 font-size: 3.6em;
1450 }
1451}
1452
1453@media (max-width: 992px) {
1454 .affiliate-stat {
1455 font-size: 1.0em;
1456 }
1457 .affiliate-stat span {
1458 font-size: 1.6em;
1459 }
1460 .affiliate-stat i {
1461 font-size: 3em;
1462 }
1463}
1464
1465/**
1466 * -------------------------
1467 * @section Support Tickets
1468 * -------------------------
1469 */
1470
1471.ticket-number {
1472 display: block;
1473 font-size: 1.2em;
1474 font-style: italic;
1475 color: #2a9fbb;
1476}
1477.ticket-subject.unread {
1478 font-weight: bold;
1479}
1480
1481.ticket-attachments-message {
1482 padding-top: 4px;
1483 font-size: 0.8em;
1484}
1485
1486.ticket-reply {
1487 margin: 10px 0;
1488 padding: 0;
1489 border: 1px solid #efefef;
1490 background-color: #fff;
1491}
1492
1493.ticket-reply.staff {
1494 border: 1px solid #CCE4FC;
1495}
1496
1497.ticket-reply .date {
1498 float: right;
1499 padding: 8px 10px;
1500 font-size: 0.8em;
1501}
1502
1503.ticket-reply .user {
1504 padding: 5px 0;
1505 background-color: #f8f8f8;
1506}
1507
1508.ticket-reply.staff .user {
1509 background-color: #F2F9FF;
1510}
1511
1512.ticket-reply .user i {
1513 float: left;
1514 font-size: 2.2em;
1515 padding: 2px 15px;
1516}
1517
1518.ticket-reply .user .name {
1519 display: block;
1520 font-size: 0.9em;
1521}
1522
1523.ticket-reply .user .type {
1524 display: block;
1525 font-weight: bold;
1526 font-size: 0.8em;
1527}
1528
1529.ticket-reply .message {
1530 padding: 12px 15px;
1531}
1532
1533.ticket-reply .rating,
1534.ticket-reply .rating-done {
1535 float: right;
1536 padding: 5px 10px;
1537 unicode-bidi: bidi-override;
1538 direction: rtl;
1539 font-size: 24px;
1540}
1541.ticket-reply .rating span.star,
1542.ticket-reply .rating-done span.star {
1543 font-family: "Font Awesome 5 Pro";
1544 font-weight: normal;
1545 font-style: normal;
1546 display: inline-block;
1547}
1548.ticket-reply .rating-done .rated {
1549 display: inline-block;
1550 font-size: 12px;
1551 font-family: Tahoma;
1552}
1553.ticket-reply .rating span.star:hover {
1554 cursor: pointer;
1555}
1556.ticket-reply .rating span.star:before,
1557.ticket-reply .rating-done span.star:before {
1558 content: "\f005";
1559 padding-right: 0;
1560 color: #999;
1561}
1562.ticket-reply .rating span.star:hover:before,
1563.ticket-reply .rating span.star:hover ~ span.star:before,
1564.ticket-reply .rating-done span.star.active:before {
1565 content: "\f005";
1566 color: #F2DE88;
1567}
1568
1569.ticket-reply .attachments {
1570 margin: 0;
1571 padding: 10px 20px;
1572 border-top: 1px dashed #efefef;
1573 background-color: #f8f8f8;
1574 font-size: 0.8em;
1575}
1576
1577.ticket-reply .attachments ul {
1578 margin: 0;
1579 padding: 0 0 0 15px;
1580 list-style: none;
1581}
1582
1583.ticket-reply .clear {
1584 clear: both;
1585}
1586
1587.panel > .list-group .ticket-details-children {
1588 line-height: 20px;
1589}
1590.panel > .list-group .ticket-details-children .title {
1591 font-size: 0.9em;
1592 color: #999;
1593}
1594
1595/**
1596 * -------------------------
1597 * @section Requestor Types
1598 * -------------------------
1599 */
1600
1601.requestor-type-operator {
1602 background-color: #5bc0de;
1603}
1604.requestor-type-owner {
1605 background-color: #5cb85c;
1606}
1607.requestor-type-authorizeduser {
1608 background-color: #777;
1609}
1610.requestor-type-registereduser {
1611 background-color: #f0ad4e;
1612}
1613.requestor-type-subaccount {
1614 background-color: #777;
1615}
1616.requestor-type-guest {
1617 background-color: #ccc;
1618}
1619
1620
1621/**
1622 * -------------------------
1623 * @section Support Ticket Feedback
1624 * -------------------------
1625 */
1626
1627.ticketfeedbackstaffcont {
1628 margin: 10px auto;
1629 padding: 15px;
1630 width: 90%;
1631 background-color: #efefef;
1632 -moz-border-radius: 6px;
1633 -webkit-border-radius: 6px;
1634 -o-border-radius: 6px;
1635 border-radius: 6px;
1636}
1637
1638.ticketfeedbackrating {
1639 padding: 0 100px;
1640}
1641
1642.ticketfeedbackrating .rate {
1643 float: left;
1644 padding: 0 10px;
1645 min-width: 30px;
1646 text-align: center;
1647}
1648
1649/**
1650 * -------------------------
1651 * @section Client Notifications
1652 * -------------------------
1653 */
1654
1655.popover-user-notifications {
1656 border-radius: 0;
1657 padding: 5px 10px;
1658 border-color: #ddd;
1659 min-width: 310px;
1660 font-family: 'Open Sans', sans-serif;
1661}
1662.popover-user-notifications .popover-content {
1663 padding: 0;
1664}
1665.popover-user-notifications ul {
1666 margin: 0;
1667 padding: 0;
1668 list-style: none;
1669}
1670.popover-user-notifications ul li {
1671 padding: 5px 0;
1672 min-height: 66px;
1673 border-bottom: 1px solid #ddd;
1674}
1675.popover-user-notifications ul li:last-child {
1676 border: 0;
1677}
1678.popover-user-notifications ul li a {
1679 display: block;
1680 padding: 10px 15px 10px 12px;
1681 text-decoration: none;
1682 color: #555;
1683 font-size: 0.95em;
1684}
1685.popover-user-notifications ul li a:hover {
1686 background-color: #f6f6f6;
1687}
1688.popover-user-notifications ul li i.fas,
1689.popover-user-notifications ul li i.far {
1690 float: left;
1691 padding-top: 6px;
1692 font-size: 21px;
1693}
1694.popover-user-notifications ul li i.fas.fa-check-circle,
1695.popover-user-notifications ul li i.far.fa-check-circle{
1696 color: #5cb85c;
1697}
1698.popover-user-notifications ul li i.fas.fa-warning,
1699.popover-user-notifications ul li i.far.fa-warning {
1700 color: #ecc317;
1701}
1702.popover-user-notifications ul li i.fas.fa-exclamation-circle,
1703.popover-user-notifications ul li i.far.fa-exclamation-circle{
1704 color: #ec2d45;
1705}
1706.popover-user-notifications ul li .message {
1707 margin-left: 40px;
1708}
1709.popover-user-notifications ul li.none {
1710 padding: 12px 0;
1711 min-height: auto;
1712 text-align: center;
1713 font-weight: bold;
1714}
1715
1716/**
1717 * -------------------------
1718 * @section Captcha
1719 * -------------------------
1720 */
1721
1722.captchaimage {
1723 margin: 0;
1724 padding: 3px 0 4px;
1725 -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
1726 transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
1727 text-align: right;
1728}
1729
1730/**
1731 * -------------------------
1732 * @section Credit Cards
1733 * -------------------------
1734 */
1735
1736div.credit-card {
1737 margin: 0 auto 30px;
1738 max-width: 400px;
1739 background-color: #f8f8f8;
1740 border: 1px solid #ccc;
1741 border-radius: 8px;
1742}
1743
1744div.credit-card div.card-type {
1745 float: right;
1746 padding: 10px 20px;
1747 font-size: 1.2em;
1748}
1749div.credit-card div.card-icon {
1750 float: left;
1751 padding: 7px 7px;
1752 font-size: 1.2em;
1753}
1754
1755div.credit-card div.card-number {
1756 padding: 10px;
1757 background-color: #ccc;
1758 font-size: 1.6em;
1759 text-align: center;
1760 clear: both;
1761}
1762
1763div.credit-card div.card-start {
1764 float: left;
1765 padding: 20px 0 50px 50px;
1766 font-size: 1.3em;
1767 text-align: right;
1768}
1769
1770div.credit-card div.card-expiry {
1771 float: right;
1772 padding: 20px 50px 50px 0;
1773 height: 120px;
1774 font-size: 1.3em;
1775 text-align: right;
1776}
1777
1778div.credit-card div.end {
1779 clear: both;
1780}
1781
1782@media (max-width: 600px) {
1783 div.credit-card {
1784 max-width: 250px;
1785 }
1786 div.credit-card div.card-type {
1787 font-size: 1.0em;
1788 }
1789 div.credit-card div.card-icon {
1790 font-size: 1.0em;
1791 }
1792 div.credit-card div.card-number {
1793 padding: 6px 10px;
1794 font-size: 1.2em;
1795 }
1796 div.credit-card div.card-start {
1797 padding: 20px 0 30px 50px;
1798 font-size: 0.9em;
1799 }
1800 div.credit-card div.card-expiry {
1801 padding: 20px 50px 30px 0;
1802 height: 80px;
1803 font-size: 0.9em;
1804 }
1805}
1806
1807.auth3d-area {
1808 border: 1px solid #fff;
1809}
1810
1811.submit-3d {
1812 width: 80%;
1813 border: 1px solid #fff;
1814}
1815
1816.invoice-summary {
1817 margin: 0 0 25px 0;
1818 padding: 15px;
1819 height: 500px;
1820 background-color: #f8f8f8;
1821 border: 4px dashed #efefef;
1822 border-radius: 10px;
1823}
1824
1825.invoice-summary-table {
1826 margin: 25px 0 25px 0;
1827 max-height: 300px;
1828 overflow: auto;
1829}
1830
1831.invoice-summary-table td {
1832 font-size: 0.8em;
1833}
1834
1835.invoice-summary-table td.total-row {
1836 background-color: #efefef;
1837 font-weight: bold;
1838}
1839
1840/* Card colors colorpicked from website logos */
1841div.credit-card .logo-visa {
1842 color: #1a1f71;
1843}
1844
1845div.credit-card .logo-amex {
1846 color: #43abdf;
1847}
1848
1849div.credit-card .logo-mastercard {
1850 color: #ed0b00;
1851}
1852
1853div.credit-card .logo-discover {
1854 color: #000000;
1855}
1856
1857div.two-column-grid,
1858div.three-column-grid {
1859 display: inline-grid;
1860 grid-template-columns: repeat(3, auto) minmax(10em, 30em) auto;
1861 font-weight: 300;
1862 font-size: 13px;
1863}
1864div.two-column-grid {
1865 grid-template-columns: repeat(2, auto) minmax(10em, 30em) auto;
1866}
1867div.two-column-grid > div,
1868div.three-column-grid > div {
1869 margin: 5px 0;
1870 padding-right: 5px;
1871}
1872div.two-column-grid > div > label,
1873div.three-column-grid > div > label {
1874 font-weight: normal;
1875}
1876#frmPayment .paymethod-info {
1877 margin: 5px 0;
1878 cursor: pointer;
1879}
1880#frmPayment .paymethod-info label {
1881 font-weight: normal;
1882 cursor: pointer;
1883}
1884
1885.iframe-input-container {
1886 height: 34px;
1887}
1888/**
1889 * -------------------------
1890 * @section Sidebar Responsive Behaviour Classes
1891 * -------------------------
1892 */
1893
1894div.sidebar .list-group-item-selected {
1895 background-color: #319FC3;
1896 color: #FFFFFF;
1897}
1898div.sidebar .list-group-item-selected .badge {
1899 background-color: #FFFFFF;
1900 color: #319FC3;
1901}
1902
1903.sidebar.sidebar-secondary {
1904 clear: left;
1905}
1906
1907@media (max-width: 991px) {
1908
1909 .panel-actions {
1910 border: 0;
1911 box-shadow: none;
1912 }
1913
1914 .panel-actions > .panel-heading > .panel-title {
1915 display: inline;
1916 }
1917
1918 .panel-actions > .panel-heading {
1919 border-radius: 3px;
1920 }
1921
1922 .panel-actions > .list-group {
1923 padding: 10px;
1924 overflow-x: scroll;
1925 overflow-y: none;
1926 white-space: nowrap;
1927 }
1928
1929 .panel-actions > .list-group .list-group-item {
1930 display: inline-block;
1931 border: 1px solid #ddd !important;
1932 border-radius: 3px !important;
1933 white-space: nowrap;
1934 text-align: center;
1935 padding: 5px 25px;
1936 margin: 2px;
1937 }
1938
1939 .panel-actions > .list-group .list-group-item > .badge {
1940 float: none;
1941 margin: -2px 0 0 10px;
1942 }
1943
1944}
1945
1946/**
1947 * -------------------------
1948 * @section Two Factor Authentication
1949 * -------------------------
1950 */
1951
1952.twofa-setup .modal-body {
1953 min-height: 100px;
1954}
1955.twofa-setup .activation-msg {
1956 margin: 25px 0;
1957 padding: 15px;
1958 border: 1px dashed #ddd;
1959 text-align: center;
1960 font-weight: bold;
1961 font-size: 1.1em;
1962}
1963.twofa-setup .backup-code {
1964 margin: 20px auto;
1965 padding: 10px;
1966 background-color: #efefef;
1967 color: #444;
1968 text-align: center;
1969}
1970
1971.twofa-module {
1972 margin: 10px 0;
1973 padding: 14px 20px;
1974 border: 1px solid #ccc;
1975 border-radius: 4px;
1976 cursor: pointer;
1977}
1978.twofa-module .col-radio {
1979 float: left;
1980 width: 35px;
1981 margin-top: 12px;
1982}
1983.twofa-module .col-logo {
1984 float: left;
1985 width: 80px;
1986 line-height: 40px;
1987 text-align: center;
1988}
1989.twofa-module .col-description {
1990 margin-left: 136px;
1991}
1992.twofa-module img {
1993 max-width: 100%;
1994 max-height: 40px;
1995}
1996.twofa-module.active {
1997 border-color: #337ab7;
1998}
1999
2000/**
2001 * -------------------------
2002 * @section Popups
2003 * -------------------------
2004 */
2005
2006#popup-backdrop {
2007 background-color: #2E363F;
2008 padding: 15px;
2009 height: 100%;
2010}
2011
2012.popup-header-padding {
2013 margin-top: 5px;
2014 margin-bottom: 5px;
2015}
2016
2017/**
2018 * -------------------------
2019 * @section Uncategorized
2020 * -------------------------
2021 */
2022
2023.btn.btn-action {
2024 background-color: #72CA06;
2025 border-color: #498302;
2026}
2027
2028/**
2029 * -------------------------
2030 * @section Knowledgebase
2031 * -------------------------
2032 */
2033
2034.kb-category {
2035 margin: 0 0 10px 0;
2036}
2037.kb-category a {
2038 display: block;
2039 margin: 0 0 2px 0;
2040 font-weight: bold;
2041 text-decoration: none;
2042}
2043.kb-category a small {
2044 color: #888;
2045}
2046
2047.kbarticles {
2048 padding: 0 0 25px 0;
2049 font-size: 0.8em;
2050}
2051.kbarticles a {
2052 font-size: 1.2em;
2053 font-weight: 700;
2054}
2055.kbarticles a .glyphicon {
2056 color: #8ce;
2057}
2058.kbcategories a.admin-inline-edit,
2059.kbarticles a.admin-inline-edit {
2060 font-size: 0.92em;
2061}
2062
2063h3.kb-alsoread {
2064 padding: 8px 15px;
2065 background-color: #eee;
2066 border-radius: 6px;
2067 font-size: 0.9em;
2068}
2069
2070.kb-article-title {
2071 margin: 0 0 22px 0;
2072 font-size: 1.6em;
2073}
2074.kb-article-title h2 {
2075 margin: 0;
2076}
2077.kb-article-title .btn-print {
2078 float: right;
2079 font-size: 1em;
2080}
2081.kb-article-content {
2082 margin: 0 0 30px 0;
2083 font-size: 1.2em;
2084 line-height: 1.2em;
2085 font-weight: 200;
2086}
2087.kb-rate-article {
2088 margin: 20px 0;
2089 padding: 15px 20px;
2090 background-color: #eff7ff;
2091 font-size: 1.4em;
2092 line-height: 38px;
2093 font-weight: 200;
2094 color: #4d7cab;
2095}
2096.kb-rate-article .btn-lg {
2097 padding: 0 16px;
2098}
2099
2100.kb-article-details {
2101 color: #999;
2102 list-style: none;
2103 margin: 35px 5px;
2104 padding: 0;
2105 font-size: 0.9em;
2106
2107}
2108.kb-article-details li {
2109 float: left;
2110 padding-right: 30px;
2111}
2112
2113.kb-search .form-control {
2114 box-shadow: none;
2115 border-radius: 3px;
2116}
2117.kb-search > .input-group-btn > .btn {
2118 border-radius: 0 3px 3px 0;
2119}
2120
2121/**
2122 * -------------------------
2123 * @section Domain Checker Responsive
2124 * -------------------------
2125 */
2126
2127#stepResults {
2128 font-size: 20px;
2129}
2130#stepResults .label {
2131 font-size: 20px;
2132}
2133
2134@media (max-width: 992px) {
2135 #stepResults {
2136 font-size: 14px;
2137 }
2138 #stepResults .label {
2139 font-size: 14px;
2140 }
2141 div.domainresults table tr td {
2142 padding: 5px 5px;
2143 }
2144}
2145
2146/**
2147 * -------------------------
2148 * Printing
2149 * -------------------------
2150 */
2151
2152@media print {
2153 .sidebar,
2154 #main-menu,
2155 #top-nav,
2156 .header-lined {
2157 display: none;
2158 }
2159 a[href]:after {
2160 content:"" !important;
2161 }
2162}
2163
2164/**
2165 * -------------------------
2166 * Badges Spacing
2167 * -------------------------
2168 */
2169
2170h3.with-badge::after {
2171 content: '.';
2172 color: #fff;
2173}
2174
2175h3.with-badge span, h3.with-badge i {
2176 float: left;
2177 padding-right: 8px;
2178}
2179
2180h3.with-badge .badge {
2181 line-height: initial;
2182 margin-top: 3px;
2183}
2184
2185@media (min-width: 992px) {
2186 h3.with-badge .badge {
2187 padding: 3px 7px 3px 8px;
2188 }
2189 .sidebar .list-group-item .badge {
2190 margin-top: -2px;
2191 padding: 3px 7px 3px 8px;
2192 line-height: initial;
2193 min-width: 36px;
2194 }
2195}
2196
2197/**
2198 * -------------------------
2199 * Admin Masquerade Notice
2200 * -------------------------
2201 */
2202
2203.admin-masquerade-notice {
2204 margin: 25px 0 0 auto;
2205 padding: 4px 10px;
2206 max-width: 240px;
2207 font-family: Tahoma;
2208 font-size: 0.7em;
2209 text-align: right;
2210}
2211.admin-masquerade-notice a {
2212 text-decoration: underline;
2213}
2214
2215a.admin-inline-edit {
2216 margin-left: 6px;
2217 font-weight: 400;
2218 color: #888;
2219}
2220a.admin-inline-edit:hover {
2221 color: #444;
2222 text-decoration: none;
2223}
2224
2225/**
2226 * -------------------------
2227 * Language Chooser
2228 * -------------------------
2229 */
2230
2231.language-popover {
2232 max-width: 450px;
2233 width: 100%;
2234 background-color: rgba(20, 20, 20, 0.98);
2235 background-image: url('../img/worldmap.png');
2236 background-repeat: no-repeat;
2237 font-size: 0.8em;
2238}
2239.language-popover.popover.bottom > .arrow:after {
2240 border-bottom-color: rgba(20, 20, 20, 0.97);
2241}
2242.language-popover .popover-content ul {
2243 margin: 6px 0 14px 0;
2244 padding: 0;
2245 max-width: 400px;
2246 list-style-type: none;
2247 overflow: hidden;
2248}
2249.language-popover .popover-content li {
2250 float: left;
2251 display: inline;
2252 padding: 0 20px 0 40px;
2253 width: 33.333%;
2254 line-height: 2em;
2255}
2256.language-popover .popover-content li a {
2257 color: #f2f2f2;
2258}
2259
2260@media (max-width: 480px) {
2261 .language-popover {
2262 max-width: 250px;
2263 background-position: -50px 0;
2264 }
2265 .language-popover .popover-content li {
2266 padding: 0 20px;
2267 width: 50%;
2268 }
2269}
2270
2271/**
2272 * -------------------------
2273 * Login or Register Popover
2274 * -------------------------
2275 */
2276
2277.login-popover {
2278 font-size: 12px;
2279}
2280.login-popover .form-group {
2281 margin-bottom: 5px;
2282}
2283.login-popover hr {
2284 margin: 5px 0;
2285}
2286
2287/**
2288 * -------------------------
2289 * Mass Pay
2290 * -------------------------
2291 */
2292
2293tr.masspay-invoice-detail td {
2294 font-size: 0.8em;
2295}
2296tr.masspay-total td {
2297 background-color: #efefef;
2298 font-weight: bold;
2299}
2300
2301/**
2302 * -------------------------
2303 * Error Page
2304 * -------------------------
2305 */
2306
2307.error-container {
2308 text-align: center;
2309}
2310.error-container h1 {
2311 margin-top: 40px;
2312}
2313.error-container .buttons {
2314 margin: 25px 0;
2315}
2316.error-container .buttons .btn {
2317 margin: 5px;
2318}
2319
2320/**
2321 * -------------------------
2322 * Collapsable Panels
2323 * -------------------------
2324 */
2325
2326.panel-collapsable > .panel-heading {
2327 cursor: pointer;
2328}
2329.panel-collapsable > .panel-body-collapsed {
2330 display: none;
2331}
2332
2333/**
2334 * -------------------------
2335 * Licensing Addon
2336 * -------------------------
2337 */
2338
2339.licensing-addon-latest-download h3 {
2340 margin-top: 0;
2341}
2342
2343.licensing-verification .secondary-input-submit {
2344 display: none;
2345}
2346
2347@media (max-width: 576px) {
2348 .licensing-verification .input-group .input-group-btn {
2349 display: none;
2350 }
2351
2352 .licensing-verification .input-group input {
2353 border-radius: 0 6px 6px 0 !important;
2354 }
2355
2356 .licensing-verification .secondary-input-submit {
2357 display: block;
2358 padding-top: 0.5em;
2359 }
2360}
2361
2362/**
2363 * -------------------------
2364 * Domain Checker Captchas
2365 * -------------------------
2366 */
2367.recaptcha-container {
2368 display: inline-block;
2369}
2370
2371#google-recaptcha-domainchecker {
2372 width: 304px;
2373 height: 78px;
2374 margin-top: 15px;
2375 margin-bottom: 15px;
2376}
2377
2378#default-captcha-domainchecker {
2379 margin-top: 15px;
2380 margin-bottom: -63px;
2381}
2382
2383#default-captcha-domainchecker #inputCaptcha {
2384 width: 100px;
2385 border-radius: 4px;
2386}
2387
2388.domainchecker-homepage-captcha #google-recaptcha-domainchecker {
2389 margin-bottom: -46px;
2390}
2391
2392@media (max-width: 991px) {
2393 #google-recaptcha-domainchecker {
2394 padding-left: 2.5%;
2395 }
2396
2397 #default-captcha-domainchecker {
2398 margin-bottom: -25px;
2399 }
2400}
2401
2402@media (max-width: 736px) {
2403 #google-recaptcha-domainchecker {
2404 transform: scale(0.935);
2405 transform-origin: 0 0;
2406 -webkit-transform: scale(0.935);
2407 -webkit-transform-origin: 0 0;
2408 }
2409}
2410
2411@media (max-width: 384px) {
2412 #google-recaptcha-domainchecker {
2413 transform: scale(0.96);
2414 transform-origin: 0 0;
2415 }
2416}
2417
2418@media (max-width: 360px) {
2419 #google-recaptcha-domainchecker {
2420 transform: scale(0.89);
2421 transform-origin: 0 0;
2422 }
2423}
2424
2425@media (max-width: 320px) {
2426 #google-recaptcha-domainchecker {
2427 padding-left: 13.5%;
2428 transform: scale(0.83);
2429 transform-origin: 0 0;
2430 -webkit-transform: scale(0.785);
2431 -webkit-transform-origin: 0 0;
2432 }
2433}
2434
2435/**
2436 * -------------------------
2437 * Email Verification
2438 * -------------------------
2439 */
2440
2441.verification-banner {
2442 margin: 0;
2443 padding: 10px;
2444 font-weight: 300;
2445 background-color: #f8f8f8;
2446 border-bottom: 1px solid #eee;
2447 color: #333;
2448}
2449.verification-banner .text {
2450 display: block;
2451 padding: 6px 0;
2452}
2453.verification-banner .btn {
2454 margin: 3px 0;
2455 padding: 3px 10px;
2456 font-style: normal;
2457 white-space: nowrap;
2458 overflow: hidden;
2459 text-overflow: ellipsis;
2460}
2461.verification-banner.email-verification .btn.btn-action,
2462.verification-banner.email-verification .btn.btn-action:active,
2463.verification-banner.email-verification .btn.btn-action[disabled]:hover {
2464 background-color: #50525f;
2465 border-color: #50525f;
2466 color: #fff;
2467}
2468.verification-banner.user-validation .btn.btn-action,
2469.verification-banner.user-validation .btn.btn-action:active,
2470.verification-banner.user-validation .btn.btn-action[disabled]:hover {
2471 background-color: #fff;
2472 border-color: #ccc;
2473 color: #333;
2474}
2475.verification-banner.user-validation i {
2476 margin-left:0.11em
2477}
2478.verification-banner .btn.close {
2479 margin-left: 10px;
2480 background-color: transparent;
2481 color: rgba(55, 55, 55, 0.5);
2482 font-size: 22px;
2483 opacity: 1;
2484}
2485.verification-banner .btn.close:hover {
2486 color: rgba(55, 55, 55, 0.8);
2487}
2488.verification-banner .fas,
2489.verification-banner .fal,
2490.verification-banner .far {
2491 color: #666;
2492 float: left;
2493 padding: 2px 10px 0 0;
2494 font-size: 24px;
2495}
2496
2497@media (min-width: 768px) {
2498 .verification-banner .text {
2499 padding-top: 9px;
2500 padding-bottom: 0;
2501 }
2502 .verification-banner .btn {
2503 margin: 0;
2504 padding: 9px 25px;
2505 }
2506 .verification-banner .button {
2507 float: right;
2508 }
2509 .verification-banner .fas,
2510 .verification-banner .fal,
2511 .verification-banner .far {
2512 font-size: 36px;
2513 }
2514}
2515
2516.verification-banner.success {
2517 background-color: #ebfde4;
2518 border-bottom: 1px solid #e3f7d5;
2519 color: #5cb85c;
2520}
2521.verification-banner.success .fas,
2522.verification-banner.success .fal,
2523.verification-banner.success .far {
2524 color: #6fbb51;
2525}
2526.verification-banner.failed {
2527 background-color: #fdf8e3;
2528 border-bottom: 1px solid #f7f3d0;
2529 color: #b3a879;
2530}
2531.verification-banner.failed .fas,
2532.verification-banner.failed .fal,
2533.verification-banner.failed .far {
2534 color: #b3a879;
2535}
2536
2537/**
2538 * -------------------------
2539 * Markdown Editor
2540 * -------------------------
2541 */
2542
2543.md-editor {
2544 border: 1px solid #ddd;
2545 border-radius: 3px;
2546}
2547.md-editor > .btn-toolbar {
2548 background-color: #fff !important;
2549}
2550.md-editor > textarea.markdown-editor,
2551.md-editor > .md-preview {
2552 padding: 15px !important;
2553 border-top: 1px solid #ddd !important;
2554 border-bottom: 1px solid #ddd !important;
2555 background-color: #fff !important;
2556}
2557div.md-editor.active {
2558 display: block;
2559 border: 1px solid #ddd;
2560 outline: 0;
2561 -webkit-box-shadow: none;
2562 box-shadow: none;
2563}
2564.markdown-editor-status {
2565 padding: 2px 10px;
2566 font-size: 9pt;
2567 color: #959694;
2568 text-align: right;
2569
2570}
2571
2572.small-font {
2573 font-size: 0.9em;
2574}
2575
2576/**
2577 * -------------------------
2578 * Markdown Content Formatting
2579 * -------------------------
2580 */
2581
2582.markdown-content h1 {
2583 font-size: 1.6em;
2584 color: #333;
2585}
2586.markdown-content h2 {
2587 font-size: 1.4em;
2588 color: #333;
2589}
2590.markdown-content h3 {
2591 font-size: 1.2em;
2592 color: #333;
2593}
2594.markdown-content h4 {
2595 font-size: 1.1em;
2596 color: #333;
2597}
2598
2599.markdown-content pre {
2600 padding: 15px;
2601 background-color: #444;
2602 color: #f8f8f8;
2603 border: 0;
2604}
2605.markdown-content pre code {
2606 white-space: pre;
2607 word-break: normal;
2608 word-wrap: normal;
2609}
2610
2611.markdown-content blockquote {
2612 font-size: 1em;
2613}
2614
2615.markdown-content table {
2616 margin: 10px 0;
2617 background-color: #fff;
2618 border: 1px solid #ddd;
2619}
2620.markdown-content table > thead > tr > th {
2621 padding: 4px 10px;
2622 background-color: #f8f8f8;
2623 border: 1px solid #ddd;
2624 font-weight: bold;
2625 text-align: center;
2626}
2627.markdown-content table > tbody > tr > td {
2628 padding: 3px 8px;
2629 border: 1px solid #ddd;
2630}
2631
2632/**
2633 * -------------------------
2634 * Sidebar Panels
2635 * -------------------------
2636 */
2637
2638.panel-sidebar {
2639 border-color: #eee;
2640 font-size: 15px;
2641}
2642.panel-sidebar>.panel-heading {
2643 color: #333;
2644 background-color: #f5f5f5;
2645 border-bottom: 0;
2646}
2647
2648.panel-heading i.far,
2649.panel-heading i.fas,
2650.panel-heading i.fal,
2651.panel-heading i.fab {
2652 font-size:0.85em;
2653}
2654
2655.panel-sidebar .panel-title {
2656 font-size: 1.1em;
2657 font-weight: 300;
2658 font-family: 'Open Sans', sans-serif;
2659 line-height: 26px;
2660 color: #555;
2661}
2662.panel-sidebar .panel-minimise {
2663 margin-top: 4px;
2664 color: #ddd;
2665 cursor: pointer;
2666 transition: transform 200ms ease;
2667}
2668.panel-sidebar .panel-minimise.minimised {
2669 transform: rotate(180deg);
2670 margin-top: 7px;
2671}
2672.panel-sidebar>.panel-footer {
2673 color: #333;
2674 background-color: #f5f5f5;
2675 border-top: 0;
2676}
2677.panel-sidebar .list-group-item {
2678 line-height: 24px;
2679 word-wrap: break-word;
2680}
2681.panel-sidebar .list-group-item i:not(.fa-circle):not(.fa-dot-circle):not(.no-transform) {
2682 float: right;
2683 line-height: 24px;
2684 font-size: 16px;
2685 color: #ccc;
2686}
2687.panel-sidebar .list-group-item.disabled,
2688.panel-sidebar .list-group-item.disabled:focus,
2689.panel-sidebar .list-group-item.disabled:hover {
2690 background-color: transparent;
2691 opacity: 0.5;
2692}
2693
2694.panel-sidebar a.list-group-item:hover i.fas,
2695.panel-sidebar a.list-group-item:hover i.far {
2696 color: #666 !important;
2697}
2698.panel-sidebar a.list-group-item.active,
2699.panel-sidebar a.list-group-item.active:focus,
2700.panel-sidebar a.list-group-item.active:hover {
2701 background-color: #465054;
2702 border-color: #465054;
2703}
2704.panel-sidebar a.list-group-item.active i,
2705.panel-sidebar a.list-group-item.active:focus i,
2706.panel-sidebar a.list-group-item.active:hover i {
2707 color: #fff;
2708}
2709.panel-sidebar.view-filter-btns .list-group-item.active,
2710.panel-sidebar.view-filter-btns .list-group-item.active:focus,
2711.panel-sidebar.view-filter-btns .list-group-item.active:hover {
2712 background-color: #eee;
2713 border-color: #eee;
2714 color: #555;
2715}
2716
2717.panel-sidebar .recent-ticket {
2718 line-height: 20px;
2719}
2720
2721.panel-sidebar .validation-status-label {
2722 font-size: initial;
2723}
2724.panel-sidebar .validation-submit-div {
2725 margin-top: 1em;
2726}
2727.panel-sidebar .validation-status-container {
2728 text-align: center;
2729 margin-top: 5px;
2730}
2731
2732/**
2733 * -------------------------
2734 * Store
2735 * -------------------------
2736 */
2737
2738.store-order-container {
2739 margin: 20px 0;
2740 padding: 30px;
2741}
2742.store-order-container h2 {
2743 margin-top: 0;
2744}
2745.store-order-container .btn {
2746 padding: 10px 30px;
2747 font-size: 1.15em;
2748 font-weight: 300;
2749}
2750
2751.store-order-container .store-domain-tabs {
2752 margin-top: 20px;
2753}
2754.store-order-container .store-domain-tabs li a {
2755 margin-right: 10px;
2756 padding: 7px 15px;
2757 background-color: #f9f9f9;
2758 border-bottom: 1px solid #ddd;
2759}
2760.store-order-container .store-domain-tabs li.active a {
2761 background-color: #fff;
2762 border-bottom: 1px solid transparent;
2763}
2764.store-order-container .store-domain-tab-content {
2765 margin-bottom: 20px;
2766 padding: 20px;
2767 border: 1px solid #ddd;
2768 border-top: 0;
2769}
2770.store-order-container .store-domain-tab-content a {
2771 text-decoration: underline;
2772}
2773.store-order-container .store-domain-tab-content a:hover {
2774 text-decoration: none;
2775}
2776
2777.store-order-container .payment-term h4 {
2778 margin-top: 25px;
2779}
2780@media (min-width: 768px) {
2781 .store-order-container .payment-term {
2782 float: right;
2783 }
2784 .store-order-container .payment-term h4 {
2785 margin-top: 0;
2786 }
2787}
2788
2789.store-order-container .domain-validation {
2790 display: block;
2791 padding-top: 5px;
2792 font-size: 1.2em;
2793 font-weight: 300;
2794 color: #888;
2795}
2796.store-order-container .domain-validation.ok {
2797 color: #53a22d;
2798}
2799
2800.store-promoted-product {
2801 margin: 50px 0;
2802 padding: 30px 30px 50px 30px;
2803 background-color: #f6f6f6;
2804}
2805.store-promoted-product .icon {
2806 height: 200px;
2807 line-height: 200px;
2808 text-align: center;
2809 overflow: hidden;
2810}
2811.store-promoted-product .icon img {
2812 max-width: 100%;
2813 max-height: 100%;
2814}
2815.store-promoted-product ul.features {
2816 margin: 20px 0;
2817 padding: 0;
2818 list-style: none;
2819 font-size: 1.1em;
2820 font-weight: 300;
2821}
2822.store-promoted-product ul.features li {
2823 float: left;
2824 width: 50%;
2825 margin-bottom: 5px;
2826}
2827.store-promoted-product ul.features li .fa:not(.fa-spinner) {
2828 font-size: 1.2em;
2829 color: #91c590;
2830 margin-left: 20px;
2831 margin-right: 10px;
2832}
2833.store-promoted-product .btn {
2834 margin-top: 10px;
2835 padding: 10px 30px;
2836 font-size: 1.2em;
2837 font-weight: 300;
2838}
2839
2840/**
2841 * -------------------------
2842 * Promotional Content Formatting
2843 * -------------------------
2844 */
2845
2846.promo-banner {
2847 margin: 0;
2848 padding: 15px 10px 20px 10px;
2849 background-color: #fff;
2850 border: 1px solid #ddd;
2851 font-size: 1em;
2852 overflow: auto;
2853}
2854.promo-banner .icon {
2855 float: left;
2856 margin: 0 20px 0 0;
2857}
2858.promo-banner img {
2859 max-width: 100%;
2860 max-height: 100%;
2861}
2862.promo-banner .icon-left {
2863 text-align: center;
2864 float: left;
2865 margin: 0;
2866 width: 155px;
2867}
2868.promo-banner .content {
2869 margin-left: 185px;
2870}
2871@media (max-width: 767px) {
2872 .promo-banner form {
2873 text-align: center;
2874 }
2875 .promo-banner .icon-left {
2876 width: 90px;
2877 float: none;
2878 }
2879 .promo-banner .content {
2880 margin: 10px 0 0 0;
2881 }
2882}
2883
2884.promo-banner h3 {
2885 margin: 0;
2886 padding: 0;
2887 font-size: 24px;
2888 font-weight: 300;
2889}
2890.promo-banner h4 {
2891 font-size: 18px;
2892 font-weight: 300;
2893}
2894
2895.promo-banner p {
2896 margin: 5px 0;
2897}
2898
2899.promo-banner ul {
2900 margin: 0;
2901 padding: 0;
2902 list-style: none;
2903 font-size: 0.92em;
2904}
2905.promo-banner ul li {
2906 margin-bottom: 4px;
2907}
2908@media (min-width: 1200px) {
2909 .promo-banner ul li {
2910 float: left;
2911 width: 50%;
2912 }
2913}
2914
2915.promo-banner .fa:not(.fa-spinner) {
2916 font-size: 1.2em;
2917 color: #91c590;
2918 margin-left: 20px;
2919 margin-right: 10px;
2920}
2921
2922.promo-banner a {
2923 color: #ff6600;
2924 text-decoration: underline;
2925}
2926.promo-banner .btn {
2927 margin: 6px 0 0 0;
2928 padding: 8px 30px;
2929 background-color: #ff6600;
2930 border: 0;
2931 color: #fff;
2932}
2933
2934@media (max-width: 650px) {
2935 .promo-banner .icon {
2936 width: 100%;
2937 margin-bottom: 15px;
2938 }
2939}
2940
2941.promo-banner-rounded {
2942 border-radius: 4px;
2943}
2944
2945.promo-banner-slim {
2946 padding: 10px;
2947}
2948.promo-banner-slim .icon-left {
2949 width: 85px;
2950}
2951.promo-banner-slim .content {
2952 margin-left: 110px;
2953}
2954.promo-banner-slim h3 {
2955 font-size: 18px;
2956}
2957.promo-banner-slim h4 {
2958 font-size: 14px;
2959}
2960.promo-banner-slim .btn {
2961 margin: 0 20px 0 0;
2962 padding: 6px 20px;
2963}
2964
2965.promo-banner.symantec {
2966 border-top: 3px solid #4da24c;
2967}
2968.promo-banner.symantec .btn {
2969 background-color: #4da24c;
2970}
2971
2972.promo-banner.weebly {
2973 border-top: 3px solid #2990ea;
2974}
2975.promo-banner.weebly .btn {
2976 background-color: #2990ea;
2977}
2978
2979.promo-banner.spamexperts {
2980 border-top: 3px solid #589ed7;
2981}
2982.promo-banner.spamexperts .btn {
2983 background-color: #589ed7;
2984}
2985
2986.promo-banner-slim.weebly .icon-left {
2987 width: 160px;
2988}
2989.promo-banner-slim.weebly .content {
2990 margin-left: 185px;
2991}
2992
2993.promo-banner.sitelock {
2994 border-top: 3px solid #f2952d;
2995}
2996.promo-banner.sitelock .btn {
2997 background-color: #f2952d;
2998}
2999
3000.promo-banner.codeguard {
3001 border-top: 3px solid #a9cc5f;
3002}
3003.promo-banner.codeguard a {
3004 color: #a9cc5f;
3005}
3006.promo-banner.codeguard .btn {
3007 background-color: #a9cc5f;
3008}
3009
3010.promo-banner.sitelockvpn {
3011 border-top: 3px solid #555;
3012}
3013.promo-banner.sitelockvpn .btn {
3014 background-color: #555;
3015}
3016
3017.promo-banner.nordvpn {
3018 border-top: 3px solid #4687FF;
3019}
3020.promo-banner.nordvpn .btn {
3021 background-color: #4687FF;
3022}
3023
3024.promo-banner.marketgoo {
3025 border-top: 3px solid #3090e0;
3026}
3027.promo-banner.marketgoo .btn {
3028 background-color: #3090e0;
3029}
3030
3031.promo-banner.ox {
3032 border-top: 3px solid #666;
3033}
3034.promo-banner.ox a {
3035 color: #666;
3036}
3037.promo-banner.ox .btn {
3038 background-color: #666;
3039}
3040
3041.promo-banner.sitebuilder {
3042 border-top: 3px solid #ff3377;
3043}
3044.promo-banner.sitebuilder a {
3045 color: #ff3377;
3046}
3047.promo-banner.sitebuilder .btn {
3048 background-color: #ff3377;
3049}
3050
3051.promo-banner.xovinow {
3052 border-top: 3px solid #10069F;
3053}
3054.promo-banner.xovinow a {
3055 color: #10069F;
3056}
3057.promo-banner.xovinow .btn {
3058 background-color: #10069F;
3059}
3060
3061.promo-banner.threesixtymonitoring {
3062 border-top: 3px solid #ce3b56;
3063}
3064.promo-banner.threesixtymonitoring .btn {
3065 background-color: #ce3b56;
3066}
3067.promo-banner.threesixtymonitoring a {
3068 color: #ce3b56;
3069}
3070
3071.mc-panel-promo {
3072 font-size: 0.95em;
3073}
3074.mc-panel-promo img {
3075 display: block;
3076 margin: 0 auto 6px;
3077 max-width: 90%;
3078 max-height: 87px;
3079}
3080
3081/**
3082 * -------------------------
3083 * MarketConnect Service SSO
3084 * -------------------------
3085 */
3086
3087.panel-mc-sso {
3088 padding: 0 10px 10px 10px;
3089}
3090.panel-mc-sso img {
3091 max-width: 100%;
3092 max-height: 120px;
3093}
3094.panel-mc-sso .row {
3095 margin-left: -5px;
3096 margin-right: -5px;
3097}
3098.panel-mc-sso .col-sm-6 {
3099 padding-left: 5px;
3100 padding-right: 5px;
3101}
3102.panel-mc-sso .form-control,
3103.panel-mc-sso .btn,
3104.panel-mc-sso small {
3105 margin-top: 5px;
3106}
3107.panel-mc-sso small {
3108 display: block;
3109}
3110.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] {
3111 border-top: solid 3px #ce3b56;
3112}
3113.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .panel-body {
3114 max-height: initial;
3115}
3116.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-metrics-row > div:not(:last-child) {
3117 border-right: 1px solid #ccc;
3118}
3119.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-metric {
3120 margin-top: 20px;
3121 font-size: 40px;
3122 line-height: 1;
3123 color: #902a6d;
3124}
3125.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-title {
3126 font-weight: bold;
3127 color: #888;
3128 text-transform: uppercase;
3129 font-size: 12px;
3130}
3131.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-highlight {
3132 margin-top: 4px;
3133 height: 2px;
3134 border-radius: 2px;
3135 background-color: #902a6d;
3136}
3137.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-highlight-servers,
3138.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-highlight-monitors,
3139.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-highlight-alerts {
3140 margin-top: 4px;
3141 height: 2px;
3142 border-radius: 2px;
3143}
3144.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-highlight-servers {
3145 background-color: #902a6d;
3146}
3147.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-highlight-monitors {
3148 background-color: #af3362;
3149}
3150.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .threesixtymonitoring-highlight-alerts {
3151 background-color: #ce3b56;
3152}
3153.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] form,
3154.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] small {
3155 text-align: center;
3156}
3157.client-home-panels div[menuitemname="ThreesixtymonitoringLogin"] .btn {
3158 width: 100%;
3159}
3160
3161/**
3162 * -------------------------
3163 * Social buttons
3164 * -------------------------
3165 */
3166
3167.social-signin-btns {
3168 text-align: center;
3169}
3170.social-signin-btns .btn {
3171 margin-bottom: 5px;
3172}
3173
3174.btn-social {
3175 position: relative;
3176 margin-bottom: 12px;
3177 text-align: center;
3178 white-space: nowrap;
3179 overflow: hidden;
3180 text-overflow: ellipsis;
3181}
3182
3183.btn-social i.fas,
3184.btn-social i.far {
3185 position: absolute;
3186 left: 0;
3187 top: 0;
3188 bottom: 0;
3189 padding-right: 2px;
3190 width: 32px;
3191 line-height: 34px;
3192 font-size: 1.6em;
3193 text-align: center;
3194 border-right: 1px solid rgba(0, 0, 0, 0.2);
3195}
3196.btn-facebook {
3197 color: #fff;
3198 background-color: #4267b2;
3199 border-color: rgba(0, 0, 0, 0.2)
3200}
3201.btn-facebook:hover, .btn-facebook:focus, .btn-facebook:active, .btn-facebook.active, .open .dropdown-toggle.btn-facebook {
3202 color: #fff;
3203 background-color: #30487b;
3204 border-color: rgba(0, 0, 0, 0.2)
3205}
3206.btn-facebook:active, .btn-facebook.active, .open .dropdown-toggle.btn-facebook {
3207 background-image: none
3208}
3209.btn-facebook.disabled, .btn-facebook[disabled], fieldset[disabled] .btn-facebook, .btn-facebook.disabled:hover, .btn-facebook[disabled]:hover, fieldset[disabled] .btn-facebook:hover, .btn-facebook.disabled:focus, .btn-facebook[disabled]:focus, fieldset[disabled] .btn-facebook:focus, .btn-facebook.disabled:active, .btn-facebook[disabled]:active, fieldset[disabled] .btn-facebook:active, .btn-facebook.disabled.active, .btn-facebook[disabled].active, fieldset[disabled] .btn-facebook.active {
3210 background-color: #4267b2;
3211 border-color: rgba(0, 0, 0, 0.2)
3212}
3213.btn-social.btn-google {
3214 padding: 0px;
3215 border: none;
3216}
3217.btn-twitter {
3218 color: #fff;
3219 background-color: #2ba9e1;
3220 border-color: rgba(0, 0, 0, 0.2)
3221}
3222.btn-twitter:hover, .btn-twitter:focus, .btn-twitter:active, .btn-twitter.active, .open .dropdown-toggle.btn-twitter {
3223 color: #fff;
3224 background-color: #1c92c7;
3225 border-color: rgba(0, 0, 0, 0.2)
3226}
3227.btn-twitter:active, .btn-twitter.active, .open .dropdown-toggle.btn-twitter {
3228 background-image: none
3229}
3230.btn-twitter.disabled, .btn-twitter[disabled], fieldset[disabled] .btn-twitter, .btn-twitter.disabled:hover, .btn-twitter[disabled]:hover, fieldset[disabled] .btn-twitter:hover, .btn-twitter.disabled:focus, .btn-twitter[disabled]:focus, fieldset[disabled] .btn-twitter:focus, .btn-twitter.disabled:active, .btn-twitter[disabled]:active, fieldset[disabled] .btn-twitter:active, .btn-twitter.disabled.active, .btn-twitter[disabled].active, fieldset[disabled] .btn-twitter.active {
3231 background-color: #2ba9e1;
3232 border-color: rgba(0, 0, 0, 0.2)
3233}
3234
3235.providerPreLinking {
3236 min-height: 52px;
3237}
3238.providerLinkingFeedback {
3239 display: none;
3240}
3241
3242/**
3243 * -------------------------
3244 * Registration page
3245 * -------------------------
3246 */
3247
3248#registration {
3249 margin: 0;
3250 padding: 0 0 40px 0;
3251}
3252
3253#registration .field-container {
3254 margin: 0 0 30px 0;
3255}
3256
3257#registration label {
3258 font-weight: 300;
3259 color: #666;
3260 font-size: 13px;
3261}
3262
3263#registration .info-text-sm {
3264 font-size: 0.85em;
3265 text-align: center;
3266}
3267
3268.marketing-email-optin {
3269 margin: 0 0 20px 0;
3270 padding: 10px 20px 20px;
3271 background-color: #f8f8f8;
3272 border-radius: 3px;
3273}
3274
3275@media (max-width: 767px) {
3276 .btn-xs-block {
3277 display: block;
3278 width: 100%;
3279 }
3280}
3281
3282/*
3283 * Section Dividers
3284 */
3285
3286#registration .sub-heading {
3287 height: 0;
3288 border-top: 1px solid #DDD;
3289 text-align: center;
3290 margin-top: 20px;
3291 margin-bottom: 30px;
3292}
3293#registration .sub-heading span {
3294 display: inline-block;
3295 position: relative;
3296 padding: 0 17px;
3297 top: -11px;
3298 font-size: 16px;
3299 color: #058;
3300 background-color: #fff;
3301}
3302
3303/**
3304 * Form fields
3305 */
3306
3307#registration .prepend-icon {
3308 top: 0;
3309 left: 0;
3310 display: inline-block;
3311 vertical-align: top;
3312 position: relative;
3313 width: 100%;
3314 font-weight: normal;
3315}
3316#registration .field,
3317#registration .form-control {
3318 position: relative;
3319 vertical-align: top;
3320 border: 1px solid #DDD;
3321 display: -moz-inline-stack;
3322 display: inline-block;
3323 color: #626262;
3324 outline: none;
3325 background: #fff;
3326 height: 36px;
3327 width: 100%;
3328 border-radius: 3px;
3329 font-size: 13px;
3330}
3331#registration .input-group-lg > .form-control {
3332 height: 46px;
3333 padding: 10px 16px;
3334 font-size: 18px;
3335 line-height: 1.3333333;
3336 border-radius: 6px 0 0 6px;
3337}
3338#registration .form-control-qty {
3339 width: 70px;
3340 text-align: center;
3341}
3342#registration .form-control-static-inline {
3343 display: inline-block;
3344}
3345#registration .form-control:focus {
3346 border-color: #ddd;
3347 outline: 0;
3348 -webkit-box-shadow: none;
3349 box-shadow: none;
3350}
3351#registration textarea.field {
3352 height: auto;
3353}
3354#registration .prepend-icon .field {
3355 -webkit-appearance: none;
3356 padding-left: 36px;
3357}
3358#registration .prepend-icon .field-icon i {
3359 position: relative;
3360 font-size: 14px;
3361}
3362#registration .prepend-icon .field-icon {
3363 top: 0;
3364 z-index: 4;
3365 width: 42px;
3366 height: 36px;
3367 color: inherit;
3368 line-height: 36px;
3369 position: absolute;
3370 text-align: center;
3371 -webkit-transition: all 0.5s ease-out;
3372 -moz-transition: all 0.5s ease-out;
3373 -ms-transition: all 0.5s ease-out;
3374 -o-transition: all 0.5s ease-out;
3375 transition: all 0.5s ease-out;
3376 pointer-events: none;
3377}
3378#registration .field-icon i {
3379 color: #bbb;
3380}
3381
3382#registration .field[disabled],
3383#registration .field[readonly],
3384#registration .form-control[disabled],
3385#registration .form-control[readonly] {
3386 background-color: #f8f8f8;
3387 opacity: 1;
3388}
3389
3390#registration .field-help-text {
3391 display: block;
3392 margin-top: 5px;
3393 margin-bottom: 10px;
3394 color: #888;
3395 font-size: 12px;
3396}
3397
3398/**
3399 * -------------------------
3400 * Password Strength Meter
3401 * -------------------------
3402 */
3403
3404.password-strength-meter .progress {
3405 margin-bottom: 5px;
3406}
3407.password-strength-meter p {
3408 margin-bottom: 15px;
3409}
3410
3411/**
3412 * -------------------------
3413 * Service Upgrade
3414 * -------------------------
3415 */
3416
3417.upgrade .product-to-be-upgraded {
3418 margin: 20px 0;
3419 padding: 15px;
3420 background-color: #f8f8f8;
3421}
3422.upgrade .product-to-be-upgraded h4,
3423.upgrade .product-to-be-upgraded h5 {
3424 margin: 0;
3425}
3426.upgrade .products {
3427 margin-left: -5px;
3428 margin-right: -5px;
3429}
3430.upgrade .products .column {
3431 padding-left: 5px;
3432 padding-right: 5px;
3433}
3434.upgrade .products .product {
3435 margin: 20px 0;
3436 padding: 0;
3437 background-color: #fff;
3438}
3439.upgrade .products .product .current,
3440.upgrade .products .product .recommended {
3441 padding: 5px;
3442 background-color: #ffbc00;
3443 color: #f5f5f5;
3444 font-weight: bold;
3445 text-align: center;
3446}
3447.upgrade .products .product .recommended {
3448 background-color: #25ac2f;
3449}
3450.upgrade .products .product ul {
3451 border-left: 1px solid #eee;
3452 border-right: 1px solid #eee;
3453}
3454.upgrade .products .product .footer {
3455 border: 1px solid #eee;
3456 border-top: 0;
3457}
3458.upgrade .products .product .header {
3459 margin: 0;
3460 padding: 20px;
3461 background-color: #2b5580;
3462 color: #fff;
3463 min-height: 150px;
3464}
3465.upgrade .products .product .header p {
3466 font-size: 1.1em;
3467 font-weight: 300;
3468}
3469.upgrade .products .product ul {
3470 margin: 0;
3471 padding: 20px 25px;
3472 list-style: none;
3473}
3474.upgrade .products .product ul li {
3475 line-height: 25px;
3476 font-size: 0.9em;
3477 text-align: right;
3478 color: #aaa;
3479 border-bottom: 1px solid #eee;
3480}
3481.upgrade .products .product ul li:last-child {
3482 border: 0;
3483}
3484.upgrade .products .product ul li span {
3485 float: left;
3486 color: #444;
3487}
3488.upgrade .products .fas,
3489.upgrade .products .far {
3490 font-size: 1.3em;
3491}
3492.upgrade .products .fa-check {
3493 color: #23ad2e;
3494}
3495.upgrade .products .product .footer {
3496 margin: 0;
3497 padding: 20px;
3498}
3499.upgrade .products .product .footer select {
3500 margin-bottom: 10px;
3501}
3502.upgrade .products .product .btn {
3503 background-color: #2b5580;
3504 color: #fff;
3505}
3506
3507/**
3508 * Helper Alerts
3509 */
3510.alert .fas.pull-left {
3511 margin: -3px 0 0 -3px;
3512}
3513.alert .alert-text {
3514 margin-left: 56px;
3515}
3516.panel-sidebar .alert {
3517 padding: 10px 15px;
3518 margin-bottom: 5px;
3519}
3520
3521/**
3522 * iCheck controls
3523 */
3524
3525.checkbox-inline.icheck-label, .radio-inline.icheck-label {
3526 padding-left: 0;
3527 margin-left: 30px;
3528 margin-right: 20px;
3529}
3530
3531.icheck-label .iradio_square-blue {
3532 margin-right: 5px;
3533 margin-left: -30px;
3534 margin-top: -2px;
3535}
3536
3537/**
3538 * JsonForm
3539 */
3540
3541form[data-role="json-form"] .has-error input.form-control,
3542form[data-role="json-form"] .has-error textarea.form-control,
3543form[data-role="json-form"] .has-error select.form-control {
3544 background-color: #fff0f0;
3545 transition: 0.2s;
3546}
3547
3548form[data-role="json-form"] .has-error .tooltip-inner {
3549 background-color: #9d2a0b;
3550}
3551
3552form[data-role="json-form"] .has-error .tooltip.top .tooltip-arrow {
3553 border-top-color: #9d2a0b;
3554}
3555
3556/**
3557 * Credit Card Input
3558 */
3559
3560.cc-number-field {
3561 background-image: url(../../../assets/img/payment/unknown.png);
3562 background-repeat: no-repeat;
3563 background-position: right 10px center;
3564}
3565.cc-number-field.visa {
3566 background-image: url(../../../assets/img/payment/visa.png);
3567}
3568.cc-number-field.mastercard {
3569 background-image: url(../../../assets/img/payment/mastercard.png);
3570}
3571.cc-number-field.amex {
3572 background-image: url(../../../assets/img/payment/amex.png);
3573}
3574.cc-number-field.dinersclub {
3575 background-image: url(../../../assets/img/payment/dinersclub.png);
3576}
3577.cc-number-field.discover {
3578 background-image: url(../../../assets/img/payment/discover.png);
3579}
3580.cc-number-field.unionpay {
3581 background-image: url(../../../assets/img/payment/unionpay.png);
3582}
3583.cc-number-field.jcb {
3584 background-image: url(../../../assets/img/payment/jcb.png);
3585}
3586.cc-number-field.maestro {
3587 background-image: url(../../../assets/img/payment/maestro.png);
3588}
3589.cc-number-field.forbrugsforeningen {
3590 background-image: url(../../../assets/img/payment/forbrugsforeningen.png);
3591}
3592.cc-number-field.dankort {
3593 background-image: url(../../../assets/img/payment/dankort.png);
3594}
3595
3596/**
3597 * Usage Billing
3598 */
3599
3600.modal-metric-pricing .modal-header,
3601.modal-metric-pricing .modal-body,
3602.modal-metric-pricing .modal-footer {
3603 text-align: center !important;
3604 border: 0;
3605}
3606
3607.modal-metric-pricing .modal-footer {
3608 padding-bottom: 45px;
3609}
3610
3611/**
3612 * Select Account
3613 */
3614
3615.select-account {
3616 margin: 20px auto;
3617 padding: 0;
3618 border-top: 1px solid #ddd;
3619}
3620.select-account a {
3621 display: block;
3622 margin: 0;
3623 padding: 10px;
3624 border-bottom: 1px solid #ddd;
3625 text-decoration: none;
3626}
3627.select-account a.disabled {
3628 opacity: 0.5;
3629}
3630.select-account a:hover {
3631 background-color: #f6f6f6;
3632}
3633
3634.continue-container {
3635 margin: 40px auto;
3636 padding: 20px;
3637 background-color: #f6f6f6;
3638 border: 1px solid #eee;
3639 max-width: 500px;
3640}
3641
3642/**
3643 * Invites
3644 */
3645
3646.invite-box {
3647 margin: 20px 0;
3648 padding: 20px;
3649 background-color:#f6f6f6;
3650 border:1px solid #eee;
3651}
3652
3653/**
3654 * Domain Pricing
3655 */
3656
3657.featured-tlds-container {
3658 margin: 35px 0 15px;
3659}
3660
3661.featured-tld {
3662 margin: 0 0 20px 0;
3663 border-radius: 4px;
3664 box-shadow: 0 6px 20px rgba(0,0,0,.1);
3665}
3666.featured-tld .img-container {
3667 padding: 20px 0;
3668 height: 115px;
3669 line-height: 75px;
3670 overflow: hidden;
3671 text-align: center;
3672}
3673@media (max-width: 767px) {
3674 .featured-tld .img-container {
3675 height: 80px;
3676 line-height: 40px;
3677 }
3678}
3679.featured-tld .img-container img {
3680 max-width: 70%;
3681 max-height: 100%;
3682}
3683.featured-tld .price {
3684 padding: 5px;
3685 background-color: #f9f9f9;
3686 color: #555;
3687 font-weight: 400;
3688 line-height: 28px;
3689 text-align: center;
3690 border-radius: 0 0 4px 4px;
3691}
3692
3693.featured-tld .price.blog {
3694 background-color: #a0d5cb;
3695 color: #fff;
3696}
3697.featured-tld .price.club {
3698 background-color: #053796;
3699 color: #fff;
3700}
3701.featured-tld .price.com {
3702 background-color: #3aa4da;
3703 color: #fff;
3704}
3705.featured-tld .price.couk {
3706 background-color: #1d3774;
3707 color: #fff;
3708}
3709.featured-tld .price.host {
3710 background-color: #ed4d42;
3711 color: #fff;
3712}
3713.featured-tld .price.live {
3714 background-color: #ff9e19;
3715 color: #fff;
3716}
3717.featured-tld .price.name {
3718 background-color: #44b03e;
3719 color: #fff;
3720}
3721.featured-tld .price.net {
3722 background-color: #efc00e;
3723 color: #fff;
3724}
3725.featured-tld .price.online {
3726 background-color: #38ce6a;
3727 color: #fff;
3728}
3729.featured-tld .price.rocks {
3730 background-color: #fd563c;
3731 color: #fff;
3732}
3733.featured-tld .price.shop {
3734 background-color: #ff5900;
3735 color: #fff;
3736}
3737.featured-tld .price.social {
3738 background-color: #ff9a00;
3739 color: #fff;
3740}
3741.featured-tld .price.store {
3742 background-color: #0eadb3;
3743 color: #fff;
3744}
3745.featured-tld .price.tech {
3746 background-color: #0db04b;
3747 color: #fff;
3748}
3749.featured-tld .price.tv {
3750 background-color: #ea3438;
3751 color: #fff;
3752}
3753.featured-tld .price.website {
3754 background-color: #2db9ea;
3755 color: #fff;
3756}
3757
3758.tld-filters {
3759 margin: 0 0 25px 0;
3760}
3761.tld-filters a {
3762 display: inline-block;
3763 margin-bottom: 4px;
3764 padding: 5px 6px;
3765 font-size: 90%;
3766 font-weight: normal;
3767 border-radius: 2px;
3768}
3769.tld-filters a.badge-secondary{
3770 background-color:#777
3771}
3772.tld-filters a.badge-secondary[href]:focus,
3773.tld-filters a.badge-secondary[href]:hover {
3774 background-color:#5e5e5e
3775}
3776.tld-filters a.badge-success {
3777 background-color:#5cb85c
3778}
3779.tld-filters a.badge-success[href]:focus,
3780.tld-filters a.badge-success[href]:hover {
3781 background-color:#449d44
3782}
3783
3784.domain-pricing .tld-row {
3785 padding-top: 3px;
3786 padding-bottom: 3px;
3787 border-bottom: 1px solid #f5f5f5;
3788}
3789.domain-pricing .tld-row.highlighted {
3790 background: #f3f9fd;
3791}
3792
3793.domain-pricing .tld-pricing-header .col-xs-2,
3794.domain-pricing .tld-pricing-header .col-sm-2 {
3795 height: 56px;
3796}
3797.domain-pricing .tld-pricing-header .col-xs-2,
3798.domain-pricing .tld-pricing-header .col-sm-2,
3799.domain-pricing .tld-pricing-header .col-xs-4,
3800.domain-pricing .tld-pricing-header .col-sm-4 {
3801 padding-top: 4px;
3802 padding-bottom: 4px;
3803 border-bottom: 6px solid #97b5d2;
3804 background-color: #efefef;
3805 border-radius: 4px 4px 0 0;
3806}
3807.domain-pricing .no-bg {
3808 background-color: transparent !important;
3809}
3810.domain-pricing .tld-pricing-header div:nth-child(odd) {
3811 border-color: #336699;
3812 background-color: #f5f5f5;
3813}
3814.domain-pricing .two-row-center {
3815 line-height: 28px;
3816 margin-top: 6px;
3817 margin-bottom: 6px;
3818 border-right: 2px solid #c7d7e6;
3819}
3820
3821.domain-pricing .tld-row.no-tlds {
3822 display: none;
3823}
3824
3825.tld-sale-group {
3826 padding: 1px 3px;
3827 color: #fff;
3828 font-size: 10px;
3829 text-transform: uppercase;
3830}
3831.tld-sale-group-hot {
3832 background-color: #f9615a;
3833}
3834.tld-sale-group-sale {
3835 background-color: #f7d458;
3836}
3837.tld-sale-group-new {
3838 background-color: #2ad588;
3839}
3840
3841.w-hidden {
3842 display: none;
3843}
3844
3845/**
3846 * OX Email Management
3847 */
3848
3849.ox-table-accounts td {
3850 padding-top: 4px !important;
3851 padding-bottom: 4px !important;
3852}
3853
3854.ox-table-accounts .dropdown-hamburger::after {
3855 display: none;
3856}
3857.ox-table-accounts ul.dropdown-menu button.btn-sm {
3858 border-radius: 0;
3859}
3860.ox-table-accounts .account-entry > tr:hover {
3861 background-color: rgba(0,0,0,.05);
3862}
3863.ox-table-accounts .account-entry {
3864 cursor: pointer;
3865}
3866.ox-table-accounts .alias-entry td:first-child,
3867.ox-table-accounts .create-alias td:first-child {
3868 font-size: .9em;
3869}
3870.ox-table-accounts .email-aliases {
3871 font-size: .9em;
3872 font-weight: bold;
3873}
3874.ox-table-accounts .aliases-body,
3875.ox-table-accounts .aliases-body > tr > td {
3876 border-top: 0;
3877}
3878
3879.ox-table-accounts .list-group-item-danger {
3880 color: #a94442;
3881 background-color: #f2dede;
3882}
3883.ox-table-accounts .list-group-item-danger:hover,
3884.ox-table-accounts .list-group-item-danger:focus {
3885 color: #a94442;
3886 background-color: #ebcccc;
3887}
3888
3889.ox-table-accounts .menu-sm {
3890 display: inline;
3891}
3892.ox-table-accounts .menu-md {
3893 display: none;
3894}
3895.ox-table-accounts .menu-lg {
3896 display: none;
3897}
3898
3899.ox-table-accounts .input-group {
3900 width: 65%;
3901}
3902
3903.input-group-xs + .form-control-feedback {
3904 width: 30px;
3905 height: 30px;
3906 line-height: 30px;
3907}
3908.input-group-xs > .form-control,
3909.input-group-xs > .input-group-addon,
3910.input-group-xs > .input-group-btn > .btn {
3911 height: 25px;
3912 padding: 1px 5px;
3913 font-size: 12px;
3914 line-height: 1.5;
3915 border-radius: 3px;
3916}
3917select.input-group-xs > .form-control,
3918select.input-group-xs > .input-group-addon,
3919select.input-group-xs > .input-group-btn > .btn {
3920 height: 30px;
3921 line-height: 30px;
3922}
3923textarea.input-group-xs-sm > .form-control,
3924textarea.input-group-xs > .input-group-addon,
3925textarea.input-group-xs > .input-group-btn > .btn,
3926select[multiple].input-group-xs > .form-control,
3927select[multiple].input-group-xs > .input-group-addon,
3928select[multiple].input-group-xs > .input-group-btn > .btn {
3929 height: auto;
3930}
3931
3932@media (min-width: 768px) {
3933 .ox-table-accounts .menu-sm {
3934 display: none;
3935 }
3936 .ox-table-accounts .menu-md {
3937 display: inline;
3938 }
3939 .ox-table-accounts .menu-lg {
3940 display: none;
3941 }
3942}
3943
3944@media (min-width: 992px) {
3945 .ox-table-accounts .menu-sm {
3946 display: none;
3947 }
3948 .ox-table-accounts .menu-md {
3949 display: none;
3950 }
3951 .ox-table-accounts .menu-lg {
3952 display: inline;
3953 }
3954}
3955
3956div[menuitemname='Active Products/Services'] .list-group {
3957 overflow: initial !important;
3958 max-height: initial !important;
3959 border-bottom: 0px !important;
3960}
3961div[menuitemname='Active Products/Services'] .list-group .list-group-item:nth-child(n+5) {
3962 display: none;
3963}
3964div[menuitemname='Active Products/Services'] .panel-footer {
3965 padding: 4px 15px;
3966}
3967div[menuitemname='Active Products/Services'] .btn-view-more {
3968 font-size: 12px;
3969}
3970div[menuitemname='Active Products/Services'] .btn-view-more.disabled {
3971 cursor: default;
3972 text-decoration: none;
3973 color: #6c757d;
3974}
3975.div-service-item {
3976 display: flex;
3977 align-items: center;
3978 cursor: pointer;
3979}
3980.div-service-status {
3981 text-align: center;
3982}
3983.div-service-status .label {
3984 white-space: nowrap;
3985 overflow: hidden;
3986 text-overflow: ellipsis;
3987 color: white;
3988 display: inline-block;
3989 line-height: initial;
3990 margin: 0;
3991}
3992.div-service-status .label-placeholder {
3993 position: absolute;
3994 visibility: hidden;
3995}
3996.div-service-status .label:not(.label-placeholder) {
3997 width: 3rem;
3998}
3999.div-service-name {
4000 flex: 1;
4001 min-width: 0;
4002 display: flex;
4003 flex-direction: column;
4004 margin-left: 10px;
4005 margin-right: 10px;
4006}
4007.div-service-name > span {
4008 white-space: nowrap;
4009 overflow: hidden;
4010 text-overflow: ellipsis;
4011}
4012.div-service-buttons {
4013 margin-left: auto;
4014}
4015.div-service-buttons .disabled {
4016 cursor: default;
4017}
4018.div-service-buttons .btn-group-secondary,
4019.div-service-buttons .btn-view-details span:not(.sr-only) {
4020 display: none;
4021}
4022.div-service-item .dropdown-menu {
4023 right: 0;
4024 left: auto;
4025}
4026.div-service-item .dropdown-menu li {
4027 display: block;
4028 padding: 3px 20px;
4029 clear: both;
4030 font-weight: 400;
4031 line-height: 1.42857143;
4032 color: #333333;
4033 white-space: nowrap;
4034}
4035.div-service-item .dropdown-menu > li:hover,
4036.div-service-item .dropdown-menu > li:focus {
4037 color: #262626;
4038 background-color: #f5f5f5;
4039}
4040.div-service-item .dropdown-menu > li:active {
4041 color: #fff;
4042 background-color: #337ab7;
4043}
4044.dropdown-menu li.disabled,
4045.dropdown-menu li.disabled:hover,
4046.dropdown-menu li.disabled:focus {
4047 color: #777777;
4048 cursor: default;
4049 background-color: transparent;
4050}
4051@media (min-width: 768px) {
4052 .div-service-status .label {
4053 width: initial !important;
4054 }
4055 .div-service-buttons i,
4056 .div-service-buttons .btn-group-primary {
4057 display: none;
4058 }
4059 .div-service-buttons .btn-group-secondary {
4060 display: inline-flex;
4061 }
4062 .div-service-buttons span:not(.sr-only):not(.caret) {
4063 display: initial !important;
4064 }
4065}
4066