5 background: #FAFAFA !important;
6 /* background-image: linear-gradient(-45deg, #000 10%, #fff 0);
7 background-size: 6px 6px; */
9 /* font-family: 'Nunito' !important; */
10 font-family: Arial, Helvetica, sans-serif !important;
11 color: #1B3E6F !important;
18 transition: 0.3s !important;
24 .custom-control-label::before{
25 border: solid 1px #C3CDDB !important;
26 border-radius: 0 !important;
28 .custom-control-input:checked ~ .custom-control-label::before{
29 background: #1B3E6F !important;
31 .custom-radio .custom-control-label::before{
32 border-radius: 50% !important;
34 .custom-control-label{
38 .form-check-input + span{
39 display: inline-flex !important;
41 .form-check-input + span i{
42 margin-right: 9px !important;
45 background-color: #F4F9FE !important;
47 .label-input input[type="radio"]{
48 width: 14px !important;
51 .card-header .btn[aria-expanded="true"],
52 .card-header .btn[aria-expanded="false"]{
53 padding-left: 25px !important;
54 padding-right: 25px !important;
55 border-radius: 0 !important;
57 .card-header .btn[aria-expanded="true"]{
58 background-color:#F4F9FE;
60 .card-header .btn[aria-expanded="false"]{
61 background-color:#fff;
65 border-radius: 2px !important;
66 color: #1B3E6F !important;
67 font-size: 13px !important;
68 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1) !important;
71 border-left: solid 5px #66BB00 !important;
72 background: url(/assets/img/icon-required-yes.svg) 12px center #fff no-repeat !important;
75 border-left: solid 5px #FF6469 !important;
76 background: url(/assets/img/icon-error.svg) 12px center #fff no-repeat !important;
77 background-size: 18px !important;
81 font-size: 3px !important;
83 vertical-align: middle;
102 background-color:#fff;
118 .primary-nav .menu li{
125 pointer-events: none;
132 vertical-align: middle;
138 text-decoration: none!important;
153 .menu-dropdown li .icon{
162 .menu-dropdown li.active .icon{
167 .menu-dropdown li:hover{
177 .menu input[type="checkbox"]{
180 input#menu[type="checkbox"]{
189 width: calc(100% - 50px);
190 transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1);
192 #menu:checked + ul.menu-dropdown{
194 -webkit-animation: all .45s cubic-bezier(0.77, 0, 0.175, 1);
195 animation: all .45s cubic-bezier(0.77, 0, 0.175, 1);
197 .sub-menu-checkbox:checked + ul.sub-menu-dropdown{
198 display: block!important;
199 -webkit-animation: grow .45s cubic-bezier(0.77, 0, 0.175, 1);
200 animation: grow .45s cubic-bezier(0.77, 0, 0.175, 1);
201 border-top: solid 2px #1B3E6F;
203 .openNav .new-wrapper{
205 transform: translate3d(200px, 0, 0);
206 width: calc(100% - 250px);
207 transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1);
210 background: transparent;
230 transition: all 0.45s cubic-bezier(0.77, 0, 0.175, 1);
231 background-color: #1B3E6F;
240 height: calc(100vh - 50px)!important;
242 border-top: 60px solid #fff;
248 position: absolute !important;
253 /* .sub-menu-dropdown{
254 background-color: #333;
261 .openNav .menu:hover{
268 transform: translate3d(200px, 0, 0);
269 transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1);
271 @-webkit-keyframes grow{
299 .userProfile .dropdown{
302 .userProfile .dropdown:hover{
303 background: #172B4D !important;
305 .userProfile .dropdown-text{
306 background: transparent;
312 .import-container-all{
314 padding-bottom: 20px;
321 border: solid 1px #EEF4F9;
323 .import-container-input{
326 display: inline-block;
329 .import-container-input input{
332 padding: 5px 40px 5px 12px;
335 -webkit-box-shadow: 0px 0px 42px -27px rgba(0,0,0,0.75);
336 -moz-box-shadow: 0px 0px 42px -27px rgba(0,0,0,0.75);
337 box-shadow: 0px 0px 42px -27px rgba(0,0,0,0.75);
341 .import-container-input input:focus{
342 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.18);
344 .import-container-input input::placeholder{
345 color: #959DA8 !important;
355 text-decoration: none;
357 .import-container-input input::placeholder{
360 .import-container-span{
363 .import-container-all .accordion .card-header{
364 padding: 0 !important;
365 background: #fff !important;
366 border-bottom: 0 !important;
368 .import-container-all .collapse.show{
369 border-top: solid 1px #ECEDF2;
371 .import-container-all .card-header .accordion-delete{
377 .import-container-all .card-header:hover .accordion-delete{
385 .accordion-delete:hover{
386 text-decoration: none;
388 /* .userProfile .dropdown-toggle{
391 .userProfile .dropdown-toggle:hover ~ .dropdown-text,
392 .userProfile .dropdown-toggle:focus ~ .dropdown-text{
393 background: transparent !important;
394 border-radius: 0 !important;
395 box-shadow: none !important;
398 .userProfile .dropdown-text::after {
403 background: url(/assets/img/img-userProfile.png) center center no-repeat;
405 .packagesFilter .custom-checkbox{
408 .packagesFilter .custom-control-label{
409 line-height: 28px !important;
410 font-size: 14px !important;
411 text-indent: 6px !important;
413 .packagesFilter .reset-filter{
417 border-top: solid 1px #ECEDF2;
420 .packagesFilter .reset-filter a:hover{
421 background: none !important;
422 text-decoration: none;
431 .sort-packages .dropdown{
434 .sort-packages .dropdown-text{
435 background: transparent;
440 .sort-packages .dropdown-text::after{
441 right: 18px !important;
442 border: solid !important;
443 border-color: #1B3E6F transparent transparent transparent !important;
445 .sort-packages .dropdown-toggle:focus ~ .dropdown-text::after{
446 top: 12px !important;
447 border-color: transparent transparent #1B3E6F transparent !important;
449 .sort-packages .dropdown-toggle:hover ~ .dropdown-text,
450 .sort-packages .dropdown-toggle:focus ~ .dropdown-text{
451 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, .15);
454 .sort-packages .dropdown-content:hover,
455 .sort-packages .dropdown-toggle:focus ~ .dropdown-content{
458 .sort-packages .dropdown-content{
464 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, .15);
466 .sort-packages .dropdown-content a{
470 .sort-packages .dropdown-content a:hover{
472 background-color: #F4F9FE;
473 text-decoration: unset;
480 .page-item .page-link,
481 .page-item.disabled .page-link{
483 background: transparent !important;
485 color: #1B3E6F !important;
489 .page-item.active .page-link,
491 color: #1B3E6F !important;
492 background-color: #fff !important;
493 border-radius: 100% !important;
494 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
497 /**Packages Cards***/
498 /***Package Info Card***/
499 .packages-card .card{
504 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
506 .packages-card .card:hover .packageName{
507 color: #1273EB !important;
509 .packages-card .card-title{
510 margin-bottom: 0 !important;
515 .packages-card .card-title span{
518 vertical-align: bottom;
524 .packages-card p.package-desc{
528 display: -webkit-box;
529 -webkit-line-clamp: 1;
530 -webkit-box-orient: vertical;
534 .packages-card p.package-desc:hover{
535 color: #1B3E6F !important;
536 text-decoration: underline;
539 .packages-card [data-tooltip]::before,
540 .packages-card .tooltip::before{
541 border: 0 !important;
543 .packages-card .tooltip:after,
544 .packages-card [data-tooltip]:after {
548 border: solid 1px #E6EDF5;
549 box-shadow: 0 0 12 rgba(0,0,0,0.8);
552 /***Add Package Card***/
555 background: #F4F9FE !important;
556 border: solid 1px #D7E7F9 !important;
557 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.18) !important;
559 .addPaackage-card .card-body img{
561 vertical-align: text-top;
571 background-position: 15px center;
572 background-repeat: no-repeat;
575 .addPaackage-card a:hover{
576 text-decoration: unset;
578 .btn-create-package i,
579 .btn-import-package i{
582 vertical-align: middle;
585 .btn-create-package:hover{
586 background-color: #1B3E6F;
590 .btn-import-package:hover{
595 .packages-card .dropdown{
599 .packages-card .dropdown-text{
600 background: transparent;
605 border-bottom-left-radius: 0;
606 border-bottom-right-radius: 0;
609 .packages-card .dropdown-text:hover{
612 .packages-card .dropdown-text::after{
615 .packages-card .dropdown-text img{
618 .packages-card .dropdown-content{
625 /* .userProfile .dropdown-content{
626 bottom: 40px !important;
627 top: unset !important;
632 border-bottom-color: #ECEDF2 !important;
635 padding: 15px 20px 15px 20px !important;
636 text-transform: uppercase !important;
639 color: #C3CDDB !important;
640 border: none !important;
642 .nav-tabs .nav-link:focus,
643 .nav-tabs .nav-link:hover{
644 border: 0 !important;
647 .nav-tabs .nav-link:hover{
648 color: #1B3E6F !important;
650 .nav-tabs .nav-link.active{
651 color: #1B3E6F !important;
652 background: transparent !important;
653 border: 0 !important;
654 border-bottom: solid 2px #1B3E6F !important;
656 .nav-tabs .nav-link::before{
658 padding-right: 20px !important;
664 .nav-tabs .nav-link:first-child::before{
667 .nav-tabs .nav-link:first-child{
668 padding-left: 20px !important;
670 .nav-item.nav-link.complete,
671 .nav-item.active.complete{
672 padding: 15px 20px 15px 44px !important;
673 background: url(/assets/img/icon-required-yes.svg) 20px center no-repeat !important;
675 /**Sliding Search Input**/
680 transform: translate(0%,-0%);
686 padding-left: 0 !important;
687 padding-right: 24px !important;
690 background: url(../src/assets/img/icon-search.svg) center center no-repeat;
691 background-size: 24%;
692 border: 0 !important;
693 border-right: solid 1px #1B3E6F !important;
695 justify-content: center;
699 .searchBox:hover > .searchInput{
701 border-bottom: solid 1px #C3CDDB;
703 .searchBox:hover > .searchInput::placeholder{
706 .searchBox > .searchInput:focus{
707 border-bottom: solid 1px #1B3E6F !important;
708 -webkit-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .6);
709 -moz-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .6);
710 box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .6);
712 .searchBox:hover > .searchButton{
727 .searchInput::placeholder{
732 border-bottom: solid 1px #C3CDDB;
737 display: inline-block;
747 background-color: #eee;
748 border: 1px solid #ccc;
750 box-shadow: 0 1px 0 rgba(255,255,255, .9) inset, 0 1px 3px rgba(0,0,0, .1);
753 .dropdown-text:after{
761 /* border-width: 5px 4px 0 4px;
762 border-color: #555 transparent transparent transparent; */
774 background: transparent;
779 .dropdown-toggle:focus{
790 -webkit-transition: all .25s ease;
791 -moz-transition: all .25s ease;
792 -ms-transition: all .25s ease;
793 -o-transition: all .25s ease;
794 transition: all .25s ease;
795 list-style-type: none;
799 background-color: #eee;
800 border: 1px solid #ccc;
805 .dropdown-content a:hover{
808 .dropdown-toggle:hover ~ .dropdown-text,
809 .dropdown-toggle:focus ~ .dropdown-text{
810 background-color: #e8e8e8;
812 .dropdown-toggle:focus ~ .dropdown-text{
813 box-shadow: 0 1px 3px rgba(0,0,0, .2) inset, 0 1px 0 rgba(255,255,255, 0.8);
816 .dropdown-toggle:focus ~ .dropdown-text:after{
817 border-width: 0 4px 5px 4px;
818 border-color: transparent transparent #555 transparent;
820 .dropdown-content:hover,
821 .dropdown-toggle:focus ~ .dropdown-content{
830 transform: translateY(-3px);
833 transform: translateY(-6px);
838 transform: translateY(6px);
842 transform: translateY(3px);
846 transform: translateY(6px);
851 /* display: inline-block;
853 transition-duration: 0.2s;
854 transition-property: transform;
855 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
856 transform: translateZ(0); */
857 margin-bottom: 25px !important;
858 box-shadow: 0 0 1px rgba(0, 0, 0, 0);
861 pointer-events: none;
870 background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 70%);
871 transition-duration: 0.2s;
872 transition-property: transform opacity;
875 transform: translateY(-3px);
876 animation-name: hover;
877 animation-duration: 1s;
878 animation-delay: 0.2s;
879 animation-timing-function: linear;
880 animation-iteration-count: 1;
881 animation-direction: alternate;
885 transform: translateY(3px);
886 animation-name: card;
887 animation-duration: 1s;
888 animation-delay: .2s;
889 animation-timing-function: linear;
890 animation-iteration-count: 1;
891 animation-direction: alternate;
894 padding: 10px 20px 20px !important;
899 padding: 0 !important;
901 .header-button-save button{
908 border-left: solid 1px #FAFAFA;
910 -webkit-box-shadow: 0 4px 10px 0 #eef0f5;
911 box-shadow: 0 4px 10px 0 #eef0f5;
915 width: calc(100% - 50px); */
928 padding: 0 30px !important;
930 .body-container > .container{
934 padding-right: 0 !important;
935 border-bottom: solid 1px #ECEDF2 !important;
937 /**Packages Filter**/
941 z-index: 220 !important;
943 .packagesFilter .dropdown-toggle{
944 height: 36px !important;
946 .packagesFilter .dropdown-toggle:focus ~ .dropdown-text::after{
947 border-color: transparent transparent #1B3E6F transparent;
949 .packagesFilter .dropdown-text{
950 background: transparent;
957 .packagesFilter .dropdown-text::after{
959 border: solid !important;
960 border-width: 5px 4px 0 4px !important;
961 border-color: #1B3E6F transparent transparent transparent !important;
963 .packagesFilter .dropdown-toggle:hover ~ .dropdown-text,
964 .packagesFilter .dropdown-toggle:focus ~ .dropdown-text{
965 background-color: transparent;
969 .packagesFilter .dropdown-toggle:focus ~ .dropdown-text{
971 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, .15);
973 .packagesFilter .dropdown-text::after{
976 .packagesFilter .dropdown-content{
979 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, .15);
981 border-top-left-radius: 0;
982 border-top-right-radius: 0;
983 border-bottom-left-radius: 2px;
984 border-bottom-right-radius: 2px;
986 .packagesFilter .dropdown-content li:hover .custom-checkbox{
989 .packagesFilter .dropdown-content:hover,
990 .packagesFilter .dropdown-toggle:focus ~ .dropdown-content{
993 .packagesFilter .form-control{
994 padding: 12px 9px 12px 38px !important;
995 border: 0 !important;
996 border-bottom: solid 1px #D7E7F9 !important;
997 background: url(../src/assets/img/icon-search.svg) 15px center no-repeat;
999 border-radius: 0 !important;
1003 .packagesFilter .form-control::placeholder{
1006 .packagesFilter .form-control:focus{
1007 box-shadow: none !important;
1008 border-bottom: solid 1px #1B3E6F !important;
1010 .packagesFilter .custom-checkbox{
1013 .packagesFilter .custom-control-input{
1016 .packagesFilter .custom-control-label{
1017 line-height: 28px !important;
1018 font-size: 13px !important;
1019 text-indent: 6px !important;
1024 background: #1B3E6F;
1034 .sort-packages .dropdown{
1037 .sort-packages .dropdown-text{
1038 background: transparent;
1043 .sort-packages .dropdown-text::after{
1044 border-color: #1B3E6F transparent transparent transparent;
1046 .sort-packages .dropdown-toggle:focus ~ .dropdown-text::after{
1047 border-color: transparent transparent #1B3E6F transparent;
1049 .sort-packages .dropdown-toggle:hover ~ .dropdown-text,
1050 .sort-packages .dropdown-toggle:focus ~ .dropdown-text{
1051 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, .15);
1054 .sort-packages .dropdown-content:hover,
1055 .sort-packages .dropdown-toggle:focus ~ .dropdown-content{
1058 .sort-packages .dropdown-content{
1064 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, .15);
1066 .sort-packages .dropdown-content a{
1070 .sort-packages .dropdown-content a:hover{
1071 background-color: #F4F9FE;
1072 text-decoration: unset;
1075 .page-item .page-link,
1076 .page-item.disabled .page-link{
1077 background: transparent !important;
1079 color: #1B3E6F !important;
1083 color: #1B3E6F !important;
1084 background-color: #fff !important;
1085 border-radius: 100%;
1087 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.12);
1089 .page-item.disabled{
1092 /**Packages Cards***/
1093 /***Package Info Card***/
1094 .packages-card .card{
1098 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.12);
1100 .packages-card .card:hover{
1101 box-shadow: 0 2px 13px 6px rgba(47, 83, 151, .17);
1102 transition: all 0.5s ease;
1105 .packages-card .card:hover .card-title,
1106 .packages-card .card:hover .card-title span{
1107 color: #1273EB !important;
1109 .packages-card .card-title{
1110 margin-bottom: 0 !important;
1114 .packages-card .card-title .packageName{
1116 display: inline-block;
1119 white-space: nowrap;
1121 text-overflow: ellipsis;
1123 vertical-align: bottom;
1126 .packages-card .card-title:hover,
1127 .packages-card .card-title:hover .packageName{
1128 text-decoration: none;
1131 .packages-card .card-body{
1132 padding-bottom: 0 !important;
1134 .packages-card .card-footer .col{
1135 padding-left: 3px !important;
1139 /***Add Package Card***/
1141 background: #F4F9FE !important;
1142 border: solid 1px #D7E7F9 !important;
1144 .addPaackage-card:hover{
1145 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1) !important;
1148 .addPaackage-card a:hover{
1149 text-decoration: unset;
1151 .addPaackage-card .card-footer .col{
1155 .addPaackage-card .card-footer .col:last-child{
1158 .btn-create-package,
1159 .btn-import-package{
1162 .btn-create-package{
1163 margin-bottom: 6px !important;
1165 .btn-import-package{
1166 margin-bottom: 15px !important;
1168 .btn-create-package,
1169 .btn-create-package:hover{
1170 background-color: #1B3E6F;
1171 border-color: #1B3E6F;
1174 .btn-import-package,
1175 .btn-import-package:hover{
1178 /***Actions Menu***/
1179 .packages-card .dropdown{
1183 .packages-card .dropdown-text{
1184 background: transparent;
1189 border-bottom-left-radius: 0;
1190 border-bottom-right-radius: 0;
1193 .packages-card .dropdown-text::after{
1196 .packages-card .dropdown-text img{
1199 .packages-card .dropdown-content{
1206 border-top-right-radius: 0;
1207 background: #1B3E6F;
1209 .packages-card .dropdown-content a{
1213 /* background-position: 14px center;
1214 background-size: 10%;
1215 background-repeat: no-repeat; */
1217 .packages-card .dropdown-content a i{
1220 .packages-card .dropdown-content a:hover{
1221 background-color: #172B4D;
1222 text-decoration: unset;
1225 .packages-card .dropdown-content:hover,
1226 .packages-card .dropdown-toggle:focus ~ .dropdown-content{
1229 .packages-card .dropdown-toggle:focus ~ .dropdown-text .icon-menuDots{
1232 .packages-card .dropdown-toggle:hover ~ .dropdown-text{
1233 background: transparent;
1236 .packages-card .dropdown-toggle:focus ~ .dropdown-text{
1240 background: #1B3E6F;
1244 .package-version::before{
1248 vertical-align: text-bottom;
1251 /***Contributers***/
1252 ul.package-contributers{
1253 margin-bottom: 9px !important;
1254 padding-left: 0 !important;
1256 .package-contributers li{
1258 display: inline-block;
1260 .package-contributers li{
1263 .package-contributers li:first-child{
1266 .package-contributers li:last-child{
1270 .package-contributers button{
1271 height: 20px !important;
1272 padding: 0 !important;
1273 border-radius: 100%;
1274 border: 0 !important;
1276 -webkit-transition: box-shadow 0.2s ease;
1277 -moz-transition: box-shadow 0.2s ease;
1278 transition: box-shadow 0.2s ease;
1279 -webkit-backface-visibility: hidden;
1280 backface-visibility: hidden;
1281 display: inline-block;
1284 .package-modifier:before,
1285 .package-contributers button:before{
1286 -webkit-transition: all 0.2s ease;
1287 -moz-transition: all 0.2s ease;
1288 transition: all 0.2s ease;
1291 box-shadow: 0 0 0 2px #fff;
1298 .package-modifier:hover,
1299 .package-contributers button:hover{
1300 box-shadow: 0 0 0 2px #D7E7F9;
1301 text-decoration: none;
1303 .package-modifier:hover:before,
1304 .package-contributers button:hover:before{
1305 -webkit-transform: scale(0.925);
1306 -moz-transform: scale(0.925);
1307 -ms-transform: scale(0.925);
1308 -o-transform: scale(0.925);
1309 transform: scale(0.925);
1310 box-shadow: 0 0 0 1px #D7E7F9;
1313 .package-modifier img,
1314 .package-contributers button img{
1318 vertical-align: top;
1319 border-radius: 100%;
1321 .package-contributers a{
1325 .package-contributers a:hover{
1326 text-decoration: unset;
1328 /***Package Footer***/
1329 .packages-card .card-footer{
1330 padding: 0 !important;
1331 background: transparent !important;
1332 border-top-color: #F7F6F6 !important;
1334 .packages-card .card-footer .col{
1337 .packages-card .card-footer .col:first-child{
1338 border-right: solid 1px #F7F6F6;
1340 .packages-card .card-footer .btn{
1341 padding: 10px 0 10px 0 !important;
1342 background-color: transparent !important;
1343 color: #1B3E6F !important;
1349 .packages-card .card-footer .btn:hover{
1352 .packages-card .card-footer i{
1355 .icon-deployed-active,
1356 .icon-deploy-inactive{
1359 background-image: url(/assets/img/icon-deploy-active.svg);
1360 background-position: center center;
1361 background-repeat: no-repeat;
1362 vertical-align: baseline;
1364 .icon-deploy-inactive{
1365 background-image: url(/assets/img/icon-deploy-inactive.svg);
1369 /*CREATE NEW ACTION MODAL*/
1370 .createActionModal .modal-dialog{
1373 .createActionModal .modal-header{
1374 padding-top: 21px !important;
1375 padding-bottom: 0 !important;
1378 .createActionModal .close{
1379 margin: 0 !important;
1380 padding: 6px 13px 10px !important;
1382 opacity: 1 !important;
1383 border-radius: 100%;
1385 .createActionModal .close:hover{
1386 background-color: #E0E8F2;
1388 .createActionModal .icon-action-close{
1392 .createActionModal .modal-body{
1393 padding-top: 0 !important;
1394 padding-bottom: 10px !important;
1396 .createActionModal .modal-body .carousel-item{
1398 padding-right: 10px;
1400 @keyframes fadeInScale {
1403 -webkit-transform: scale(0) translateY(50%);
1404 transform: scale(0) translateY(50%);
1407 -webkit-transform: scale(1.05);
1408 transform: scale(1.05);
1412 -webkit-transform: scale(1) translateY(0);
1413 transform: scale(1) translateY(0);
1417 margin-bottom: 25px !important;
1418 padding: 220px 25px 50px;
1421 -webkit-transition: all 0.3s ease-in-out;
1422 transition: all 0.3s ease-in-out;
1424 .card.actionType:hover{
1425 box-shadow: 0 10px 20px 0 rgba(27,62,111,.1);
1426 transition: 0.3s !important;
1428 .createActionModal h1{
1429 margin-bottom: 21px;
1432 font-weight: normal;
1434 .createActionModal .skip-btn{
1438 font-weight: normal !important;
1440 border: solid 1px #F1F2FA;
1447 background-position: center 40px;
1448 background-repeat: no-repeat;
1449 background-size: 144px 172px;
1456 text-transform: uppercase;
1461 font-size: 13px !important;
1465 .actionType:hover .btn{
1469 left: 30% !important;
1470 margin-bottom: 26px;
1473 background: #1B3E6F;
1477 border-radius: 15px !important;
1478 -webkit-transform: translateY(-20%);
1479 transform: translateY(-20%);
1480 -webkit-transition: all 0.3s ease-in-out;
1481 transition: all 0.3s ease-in-out;
1483 .actionType:hover .btn{
1485 -webkit-transform: translateY(0);
1486 transform: translateY(0);
1489 background-image: url(/assets/img/icon-action-custom.svg);
1491 .actionType.custom:hover{
1493 background-image: url(/assets/img/icon-action-custom-hover.svg);
1495 .actionType.default{
1496 background-image: url(/assets/img/icon-action-default.svg);
1498 .actionType.default:hover{
1500 background-image: url(/assets/img/icon-action-default-hover.svg);
1503 background-image: url(/assets/img/icon-action-recent.svg);
1505 .actionType.recent:hover{
1507 background-image: url(/assets/img/icon-action-recent-hover.svg);
1510 background-image: url(/assets/img/icon-action-import.svg);
1512 .actionType.import:hover{
1514 background-image: url(/assets/img/icon-action-import-hover.svg);
1516 .createActionModal .carousel-indicators{
1519 .createActionModal .carousel-indicators li{
1525 .createActionModal .back{
1526 position: fixed !important;
1529 padding:0 !important;
1536 .createActionModal .form-control.customAction{
1542 border-bottom: solid 1px #E0E8F2;
1543 color: #1B3E6F !important;
1546 .createActionModal .form-control:focus{
1547 border-bottom: solid 1px #1B3E6F;
1548 background: transparent !important;
1549 -webkit-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .8);
1550 -moz-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .8);
1551 box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .8);
1554 .createActionModal .form-control::placeholder{
1558 .createActionModal .submit,
1559 .createActionModal .submit:hover{
1563 background: #1B3E6F;
1567 border-radius: 15px !important;
1575 .form-control.searchInput,
1576 .form-control.searchInput:focus{
1578 width: 250px !important;
1579 height: 30px !important;
1580 padding-left: 32px !important;
1581 border: solid 1px #E0E8F2 !important;
1582 border-radius: 2px !important;
1583 background: url(../src/assets/img/icon-search-light.svg) 9px center no-repeat !important;
1584 font-size: 13px !important;
1592 .createActionModal .actionName{
1593 margin-bottom: 15px;
1595 box-shadow: 0 2px 6px rgba(47,83,151,0.15);
1597 .createActionModal p.selectedActions{
1599 margin-bottom: 10px;
1603 .createActionModal .sort-packages .dropdown{
1606 .createActionModal .sort-packages .dropdown-text::after {
1609 .createActionModal .sort-packages .dropdown-content{
1612 .createActionModal .folder-upload-text button{
1617 display: inline-block;
1618 transition-duration: 0.3s;
1619 transition-property: box-shadow;
1620 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
1621 transform: translateZ(0);
1622 box-shadow: inset 0 0 0 4px #ececec, 0 0 1px rgba(0, 0, 0, 0);
1623 /* Hack to improve aliasing on mobile/tablet devices */
1625 .border-fade:hover {
1626 box-shadow: inset 0 0 0 4px #666, 0 0 1px rgba(0, 0, 0, 0);
1627 /* Hack to improve aliasing on mobile/tablet devices */
1631 /**Title Action Buttons**/
1632 .page-title-actions li{
1633 display: inline-block;
1637 -webkit-transition: box-shadow 0.2s ease;
1638 -moz-transition: box-shadow 0.2s ease;
1639 transition: box-shadow 0.2s ease;
1640 -webkit-backface-visibility: hidden;
1641 backface-visibility: hidden;
1644 display: inline-block;
1650 text-transform: lowercase;
1654 .title-action:before{
1655 -webkit-transition: all 0.2s ease;
1656 -moz-transition: all 0.2s ease;
1657 transition: all 0.2s ease;
1660 box-shadow: 0 0 0 1px #000;
1667 .title-action:hover{
1668 box-shadow: 0 0 0 7px #07819b;
1669 text-decoration: none;
1671 .title-action:hover:before{
1672 -webkit-transform: scale(0.925);
1673 -moz-transform: scale(0.925);
1674 -ms-transform: scale(0.925);
1675 -o-transform: scale(0.925);
1676 transform: scale(0.925);
1677 box-shadow: 0 0 0 1px #07819b;
1681 /*Animation Button*/
1684 display: inline-block;
1685 transition-duration: 0.3s;
1686 transition-property: transform;
1687 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
1688 transform: translateZ(0);
1689 box-shadow: 0 0 1px rgba(0, 0, 0, 0);
1692 transform: translateY(-5px);
1696 /* Base styles for the element that has a tooltip */
1704 /* Base styles for the entire tooltip */
1705 [data-tooltip]:before,
1706 [data-tooltip]:after,
1711 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
1712 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
1715 opacity 0.2s ease-in-out,
1716 visibility 0.2s ease-in-out,
1717 -webkit-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
1719 opacity 0.2s ease-in-out,
1720 visibility 0.2s ease-in-out,
1721 -moz-transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
1723 opacity 0.2s ease-in-out,
1724 visibility 0.2s ease-in-out,
1725 transform 0.2s cubic-bezier(0.71, 1.7, 0.77, 1.24);
1726 -webkit-transform: translate3d(0, 0, 0);
1727 -moz-transform: translate3d(0, 0, 0);
1728 transform: translate3d(0, 0, 0);
1729 pointer-events: none;
1732 /* Show the entire tooltip on hover and focus */
1733 [data-tooltip]:hover:before,
1734 [data-tooltip]:hover:after,
1735 [data-tooltip]:focus:before,
1736 [data-tooltip]:focus:after,
1737 .tooltip:hover:before,
1738 .tooltip:hover:after,
1739 .tooltip:focus:before,
1740 .tooltip:focus:after {
1741 visibility: visible;
1742 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
1743 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
1747 /* Base styles for the tooltip's directional arrow */
1749 [data-tooltip]:before {
1751 border: 6px solid transparent;
1752 background: transparent;
1756 /* Base styles for the tooltip's content area */
1758 [data-tooltip]:after {
1762 background-color: #DEE8F3;
1763 background-color: rgba(222, 232, 243, 1.0);
1765 content: attr(data-tooltip);
1774 [data-tooltip]:before,
1775 [data-tooltip]:after,
1778 .tooltip-top:before,
1779 .tooltip-top:after {
1784 [data-tooltip]:before,
1786 .tooltip-top:before {
1788 margin-bottom: -12px;
1790 border-bottom-color: #DEE8F3;
1791 border-bottom-color: rgba(222, 232, 243, 1.0);
1794 /* Horizontally align top/bottom tooltips */
1795 [data-tooltip]:after,
1797 .tooltip-top:after {
1801 [data-tooltip]:hover:before,
1802 [data-tooltip]:hover:after,
1803 [data-tooltip]:focus:before,
1804 [data-tooltip]:focus:after,
1805 .tooltip:hover:before,
1806 .tooltip:hover:after,
1807 .tooltip:focus:before,
1808 .tooltip:focus:after,
1809 .tooltip-top:hover:before,
1810 .tooltip-top:hover:after,
1811 .tooltip-top:focus:before,
1812 .tooltip-top:focus:after {
1813 -webkit-transform: translateY(-12px);
1814 -moz-transform: translateY(-12px);
1815 transform: translateY(-12px);
1819 .tooltip-left:before,
1820 .tooltip-left:after {
1826 .tooltip-left:before {
1828 margin-right: -12px;
1830 border-top-color: transparent;
1831 border-left-color: #000;
1832 border-left-color: hsla(0, 0%, 20%, 0.9);
1835 .tooltip-left:hover:before,
1836 .tooltip-left:hover:after,
1837 .tooltip-left:focus:before,
1838 .tooltip-left:focus:after {
1839 -webkit-transform: translateX(-12px);
1840 -moz-transform: translateX(-12px);
1841 transform: translateX(-12px);
1845 .tooltip-bottom:before,
1846 .tooltip-bottom:after {
1852 .tooltip-bottom:before {
1855 border-top-color: transparent;
1856 border-bottom-color: #DEE8F3;
1857 border-bottom-color: rgba(222, 232, 243, 1.0);
1860 .tooltip-bottom:hover:before,
1861 .tooltip-bottom:hover:after,
1862 .tooltip-bottom:focus:before,
1863 .tooltip-bottom:focus:after {
1864 -webkit-transform: translateY(12px);
1865 -moz-transform: translateY(12px);
1866 transform: translateY(12px);
1870 .tooltip-right:before,
1871 .tooltip-right:after {
1876 .tooltip-right:before {
1879 border-top-color: transparent;
1880 border-right-color: #000;
1881 border-right-color: hsla(0, 0%, 20%, 0.9);
1884 .tooltip-right:hover:before,
1885 .tooltip-right:hover:after,
1886 .tooltip-right:focus:before,
1887 .tooltip-right:focus:after {
1888 -webkit-transform: translateX(12px);
1889 -moz-transform: translateX(12px);
1890 transform: translateX(12px);
1893 /* Move directional arrows down a bit for left/right tooltips */
1894 .tooltip-left:before,
1895 .tooltip-right:before {
1899 /* Vertically center tooltip content for left/right tooltips */
1900 .tooltip-left:after,
1901 .tooltip-right:after {
1903 margin-bottom: -16px;
1906 /*TooltipModule - Shady*/
1909 width: 100% !important;
1911 .tooltip .tooltip-inner{
1912 max-width: 280px !important;
1913 width: 100% !important;
1914 text-align: left!important;
1916 background-color: #F4F9FE;
1917 border: solid 1px #E6EDF5;
1918 border-radius: 3px !important;
1921 .bs-tooltip-bottom .arrow::before{
1922 border-bottom-color: #E6EDF5 !important;
1924 .bs-tooltip-top .arrow::before{
1925 border-top-color: #E6EDF5 !important;
1932 padding-right: 20px !important;
1933 padding-left: 20px !important;
1937 border-radius: 20px !important;
1940 background-color: #1273EB !important;
1941 border-color: #1273EB !important;
1943 .btn-primary:hover {
1944 background-color: #0069d9 !important;
1945 border-color: #0062cc !important;
1950 .package-view-button button{
1954 .package-view-button{
1957 .package-view-button .btn{
1959 border-radius: 18px;
1961 .package-view-button .btn:hover{
1964 .package-view-button .btn-primary{
1965 background-color: #1B3E6F !important;
1966 border-color: #1B3E6F !important;
1968 /* margin-bottom: 10px; */
1970 .package-view-button .btn-outline-secondary{
1971 background-color: #fff !important;
1972 border-color: #D0DFF1 !important;
1973 color: #1B3E6F !important;
1975 .package-view-title {
1982 .package-view-title+p{
1986 .package-view-title+ul{
1989 .package-view-button .btn-outline-secondary i{
1997 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
1999 .card.creat-card .single-line{
2000 padding: 15px 25px 15px;
2002 .card.creat-card .single-line-model{
2005 .card.creat-card .editor-container{
2011 .single-line-model label{
2013 border-bottom: 1px solid #FAFAFA;
2016 .single-line-model .label-name{
2019 .single-line-model .label-input{
2020 width: calc(100% - 325px);
2022 .single-line-model input{
2023 border-bottom: 1px solid #FAFAFA !important;
2024 padding: 15px 25px 15px 0px;
2026 .customKeyTitle span{
2027 color: #C3CDDB !important;
2030 .single-line-model input:focus,
2031 .single-line-custom-key input:focus{
2032 border-bottom-color: #1B3E6F !important;
2033 -webkit-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .6);
2034 -moz-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .6);
2035 box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .6);
2037 .model-note-container{
2038 width: calc(100% - 325px);
2039 padding: 0px 25px 0px 0px ;
2047 margin-bottom: 25px;
2052 padding: 5px 25px 5px 0px;
2056 background: #E0E8F2;
2059 border-radius: 50px;
2062 margin-bottom: 10px;
2070 display: inline-block;
2081 background: #FFE6E7;
2082 border: 1px solid #FFC9CB;
2083 padding: 3px 10px 2px;
2089 background: #FFC9CB;
2090 border: 1px solid #FF6469;
2091 text-decoration: none;
2094 width: calc(100% - 300px);
2095 display: inline-block;
2098 margin-left: 0px !important;
2099 margin-top: 2px !important;
2101 .form-check-input+span{
2107 .form-check-input+span i{
2119 transition: all 250ms ease-out;
2121 .label-input input:focus{
2122 border-bottom: solid 1px #1B3E6F;
2123 background: transparent !important;
2124 -webkit-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .8);
2125 -moz-box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .8);
2126 box-shadow: 0 4px 6px -6px rgba(18, 115, 235, .8);
2129 .label-input input:disabled{
2133 .label-input input[type=radio]{
2136 .label-input input[type=radio]+span{
2139 margin-right: 100px;
2141 .single-line select{
2144 padding-right: 50px;
2146 border: solid 1px #EEF4F9;
2148 background: url(/assets/img/arrow.svg) 90% center #F4F9FE no-repeat;
2149 background-size: 10px;
2151 -webkit-appearance: none;
2152 -moz-appearance: none;
2158 .single-line select:focus{
2159 box-shadow: 0 0 0 0;
2161 .single-line select option:first-child{
2164 .single-line-model input::placeholder{
2168 .single-line-model.error{
2171 .single-line-model.error input{
2173 border-bottom: 1px solid #FF6469 !important;
2175 .single-line .custom-key{
2181 .single-line .custom-key:focus{
2185 padding:70px 100px 70px 70px;
2190 margin-bottom: 21px;
2192 .single-line-custom-key{
2194 display: inline-block;
2196 .single-line-custom-key-delete{
2198 display: inline-block;
2199 border-bottom: 1px solid #FAFAFA;
2200 padding: 13px 12px 14px;
2202 .single-line-custom-key label{
2205 border-bottom: 1px solid #FAFAFA;
2208 .single-line-custom-key input{
2209 border-bottom: 1px solid #FAFAFA !important;
2210 padding: 15px 25px 15px 0;
2212 .single-line-custom-key input::placeholder{
2216 .single-line-custom-key .label-input{
2217 width: calc(100% - 150px);
2219 .single-line-custom-key .label-name span{
2220 color: #C3CDDB !important;
2224 background: transparent;
2229 .custom-key-delete:focus{
2234 margin-top: 0rem !important;
2235 margin-bottom: 0rem !important;
2236 border-top: 1px solid #efefef !important;
2238 .creat-action-container{
2246 margin-bottom: 12px;
2248 color: #BABBC3 !important;
2251 display: inline-block;
2253 .action-button:hover{
2254 text-decoration: none;
2258 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
2263 border-radius: 40px;
2266 display: inline-block;
2268 .action-button i:hover{
2269 background: #dee2e6;
2271 .action-button i.icon-save-sm{
2272 background: #1273EB;
2276 .action-button i.icon-discard-sm{
2280 .action-button.save{
2281 color: #1273EB !important;
2283 .action-button.save:hover{
2286 .action-button.delete i{
2289 .action-button.delete:hover{
2298 margin-top: 60px !important;
2301 z-index: 11000000 !important;
2302 background: rgba(27, 62, 111, 0.10) !important;
2305 border-radius: 2px !important;
2306 border: 0 !important;
2307 box-shadow: 0 2px 6px rgba(47, 83, 151, .10);;
2310 font-size: 14px !important;
2313 padding: 1.5rem 1.5rem 1rem !important;
2322 border-bottom-color: #ECEDF2 !important;
2323 padding: .7rem 1.5rem !important;
2326 padding-top: 0 !important;
2327 border-top: 0 !important;
2333 border: 0 !important;
2335 .modal-footer .btn-primary{
2336 background-color: #1B3E6F !important;
2338 .modal-footer .btn-secondary,
2339 .modal-footer .btn-secondary:hover{
2340 background-color: transparent;
2344 .modal-footer .btn-secondary:hover{
2347 .modal-footer .btn-secondary:active{
2348 background-color: #E7F1FC !important;
2349 color: #1B3E6F !important;
2351 .action-button span{
2353 display: inline-block;
2356 .creat-action-container hr{
2358 padding-bottom: 18px;
2360 .btn-link:hover, .btn-link:focus{
2361 text-decoration: none !important;
2365 font-family:'FontAwesome';
2369 .btn-link.collapsed::before{
2371 font-family:'FontAwesome';
2378 .ngx-file-drop__content{
2379 background: #F4F9FE;
2381 height: auto !important;
2382 display: inline-block !important;
2385 .ngx-file-drop__drop-zone{
2386 border: 1px dashed #D7E7F9 !important;
2387 border-radius: 0px !important;
2388 height: auto !important;
2392 margin: 15px auto 18px;
2393 display: inline-block;
2396 .btn-group-sm>.btn, .btn-sm{
2403 /* text-transform: uppercase; */
2406 .folder-upload-text{
2409 display: inline-block;
2414 .folder-upload-text button{
2418 .folder-upload-type{
2423 display: inline-block;
2430 border: dashed 1px #D7E7F9;
2432 .upload-table tr th{
2433 border-bottom: solid 1px #F4F9FE !important;
2435 .upload-table .table thead th{
2437 border-top: 0px !important;
2438 font-weight: normal;
2441 .upload-table .table thead th:first-child{
2445 .upload-table tr:last-child th{
2446 border-bottom: 0 !important;
2448 .upload-table .table{
2449 margin-bottom: 0px !important;
2451 .nav-tabs .nav-link{
2454 .nav-tabs .nav-link.tab-done{
2455 padding-left: 40px !important;
2457 .nav-tabs .nav-link.tab-done::after{
2460 font-family: 'FontAwesome';
2466 .authentication-container-all{
2467 background: #F4F9FE;
2468 border:1px solid #D0DFF1 ;
2472 .authentication-header{
2478 padding: 10px 20px ;
2480 .authentication-search{
2488 .authentication-search::after{
2490 font-family: 'FontAwesome';
2495 .authentication-search input{
2501 padding: 10px 20px 10px 35px;
2503 border-top: 1px solid #D7E7F9;
2505 .authentication-search input::placeholder{
2510 .authentication-accordion{
2516 .authentication-accordion .card{
2517 border-radius: 0px !important;
2518 margin-bottom: 10px !important;
2520 .authentication-accordion .card-header{
2521 padding: 0px !important;
2522 background: #fff !important;
2523 border-radius: 0px !important;
2527 .authentication-accordion .card-header .btn-link{
2531 padding: 9px 0px !important;
2535 .authentication-accordion .custom-control{
2536 display: inline-block;
2538 .authentication-accordion .btn-link::before{
2541 .authentication-accordion .btn-link.collapsed::before{
2544 .template-mapping-accordion{
2547 .card-header .btn.regularTitle{
2548 padding-left: 0 !important;
2549 padding-right: 0 !important;
2554 .template-mapping-accordion .accordian-title{
2555 color: #C3CDDB !important;
2556 font-size: 12px !important;
2557 font-weight: normal !important;
2562 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
2563 border: 0px !important;
2566 padding: 0px 25px !important;
2567 background: #F4F9FE !important;
2568 border-radius: 0px !important;
2569 border-bottom: 1px solid #ECEDF2 !important;
2571 .template-mapping-accordion .card-body{
2572 padding: 20px 26px 0 !important;
2575 .card-header .btn-link{
2579 padding: 9px 0px !important;
2584 margin-bottom: 0px !important;
2585 border-top: 1px solid #ECEDF2 !important;
2587 .accordion > .card > .card-header{
2588 padding: 0 !important;
2590 .template-mapping-accordion .card{
2591 margin-bottom: 25px !important;
2594 display: inline-block;
2599 .btn-link.collapsed::before{
2603 padding: 12px 20px 9px 20px;
2613 background: #F4F9FE;
2614 border: 1px solid #D7E7F9;
2622 .select-type:hover, .select-type.active{
2623 background: #1B3E6F;
2624 border: 1px solid #D7E7F9;
2626 text-decoration: none;
2631 .select-type::before{
2633 border: 1px solid #1273EB;
2636 border-radius: 18px;
2637 display: inline-block;
2641 .select-type:hover::before, .select-type.active::before{
2642 border: 1px solid #fff;
2644 .select-type.active::after{
2649 border-radius: 18px;
2650 display: inline-block;
2655 .ace-tomorrow-night-bright .ace_print-margin{
2656 left: 100% !important;
2657 background: #eee !important;
2663 .ace-eclipse .ace_print-margin{
2664 /* background: #fff; */
2667 height: 55vh !important;
2669 border: 1px solid #ECEDF2;
2670 background-color: #fff;
2673 .ace-tomorrow-night-bright .ace_gutter,
2674 .ace-eclipse .ace_gutter{
2675 background: #E0E8F2 !important;
2676 border-right: 0px !important;
2677 color: #1B3E6F !important;
2679 .ace-tomorrow-night-bright .ace_gutter-active-line,
2680 .ace-eclipse .ace_gutter-active-line{
2681 background-color: #265699;
2684 .ace-tomorrow-night-bright .ace_cursor{
2687 .ace-tomorrow-night-bright .ace_marker-layer .ace_active-line {
2694 .breadcrumb-header li{
2696 display: inline-block;
2700 .breadcrumb-header li:last-child::after{
2704 .breadcrumb-header li:last-child{
2705 /* background: #F4F9FE; */
2706 border-radius: 50px;
2708 padding: 0 10px 0 0;
2710 .breadcrumb-header li:first-child,
2711 .breadcrumb-header li:first-child a{
2715 color: #1B3E6F !important;
2717 background: transparent;
2719 .create-template-import{
2721 margin: 30px 0px 10px ;
2724 .create-template-import a:hover{
2725 text-decoration: none;
2727 .mapping-source-load{
2731 display: inline-block;
2732 vertical-align: top;
2734 margin-bottom: 10px;
2735 margin:15px 30px 20px;
2737 .mapping-source-load:hover{
2738 text-decoration: none;
2740 .mapping-source-load i {
2744 border-radius: 100px;
2747 display: inline-block;
2749 margin-bottom: 20px;
2751 .mapping-source-load:hover i{
2752 background: #F4F9FE;
2754 .mapping-source-load:hover span{
2761 .mapping-source-load.hover-disable{
2764 .mapping-source-load.hover-disable:hover span{
2767 .mapping-source-load.hover-disable:hover i{
2768 background: transparent;
2770 .template-mapping-list{
2771 background: #F4F9FE;
2772 border: 1px solid #E9F3FF;
2774 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
2776 display: inline-block;
2777 margin-bottom: 20px;
2780 .template-mapping-list:hover,
2781 .template-mapping-list.active {
2782 /* background: #1B3E6F; */
2783 text-decoration: none;
2784 /* color: #fff !important; */
2786 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.3);
2788 .template-mapping-list p,
2789 .template-mapping-list:hover p{
2792 display: inline-block !important;
2794 .template-mapping-list:hover p{
2797 .template-mapping-list:hover{
2801 .template-mapping-list span{
2803 border: solid 1px #E9F3FF;
2807 border-radius: 50px;
2811 .template-mapping-list:hover span{
2820 background: transparent;
2823 color: #FF6469 !important;
2826 .template-mapping-list:hover .deleteTemplate{
2831 padding-bottom: 5px !important;
2834 .create-template-mapping-button{
2835 background: #C3CDDB;
2836 border-radius: 50px;
2840 margin-bottom: 20px;
2841 display: inline-block;
2844 .create-template-mapping-button i{
2847 .view-package-container{
2852 background: #C1CDDD;
2855 border-radius: 48px;
2856 display: inline-block;
2860 /* margin-right: 20px; */
2870 .package-name-container{
2871 width: calc(100% - 60px);
2872 display: inline-block;
2891 vertical-align: baseline;
2893 .package-description{
2896 font-weight: normal;
2901 .package-auth-info p{
2904 .package-auth-info div{
2906 border-right: solid 1px #F4F9FE;
2908 .package-auth-info div:first-child{
2911 .package-auth-info .col-4:first-child{
2914 .package-auth-info div:last-child{
2917 .package-auth-info .package-contributers{
2918 margin-bottom: 0 !important;
2920 .package-auth-info .package-contributers button img{
2924 .template-mapping-action{
2925 margin-bottom: 20px;
2927 .template-mapping-action button{
2928 border-radius: 50px;
2932 .template-mapping-action .btn-primary{
2933 background:#5DBDBA !important ;
2934 border-color:#5DBDBA !important ;
2935 color: #fff !important ;
2937 .template-mapping-action .btn-outline-secondary{
2938 background:#fff !important ;
2939 border-color:#ECEDF2 !important ;
2940 color: #C3CDDB !important ;
2946 server-side-angular-way.component.css
2948 .no-data-available {
2953 src/styles.css (i.e. your global style)
2961 color: #1B3E6F !important;
2963 /* font-weight: bold; */
2966 .dataTables_filter input{
2968 background: url(../src/assets/img/icon-search.svg) 9px center no-repeat;
2969 padding: 4px 9px 4px 24px !important;
2970 border: solid 1px #ECEDF2;
2973 .dataTables_filter input:focus{
2974 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
2978 width: auto !important;
2979 padding: 7px 20px 7px 0 !important;
2980 border-bottom: solid 1px #ECEDF2 !important;
2983 .mapping-table th:first-child,
2984 .mapping-table td:first-child{
2985 padding-left: 20px !important;
2987 .mapping-table thead th{
2988 border-bottom-color: #ECEDF2 !important;
2990 .mapping-table tbody tr:hover{
2991 background-color: #F4F9FE !important;
2994 padding-top: 10px !important;
2995 padding-bottom: 10px !important;
2996 background: #F4F9FE;
2999 border-top: 0 !important;
3001 table.dataTable.no-footer{
3003 border-bottom: solid 1px #ECEDF2 !important;
3007 color: #1B3E6F !important;
3011 .dataTables_wrapper .dataTables_paginate,
3012 .dataTables_wrapper .dataTables_paginate a.paginate_button,
3013 .dataTables_wrapper .dataTables_paginate a.paginate_button.current,
3014 .dataTables_wrapper .dataTables_paginate a.paginate_button.disabled{
3016 color: #1B3E6F !important;
3019 border: 0 !important;
3021 .dataTables_wrapper .dataTables_paginate a.paginate_button:hover{
3023 color: #1B3E6F !important;
3024 background: none !important;
3026 .dataTables_wrapper .dataTables_paginate a.paginate_button{
3027 padding: 0.4em .9em !important;
3029 .dataTables_wrapper .dataTables_paginate a.paginate_button.current{
3030 color: #1B3E6F !important;
3031 background: #F4F9FE !important;
3032 border: solid 1px #EEF4F9 !important;
3033 border-radius: 100% !important;
3034 box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.1);
3037 .dataTables_wrapper .dataTables_paginate a.paginate_button.disabled{
3040 .dataTables_wrapper .dataTables_paginate a.paginate_button.disabled:hover{
3042 background: none !important;
3043 border: 0 !important;
3045 .mapping-table .form-control,
3046 .mapping-table .custom-select{
3048 border-color: #EEF4F9;
3053 .mapping-table .form-control{
3054 box-shadow: 0 2px 4px rgba(47,83,151,0.1);
3056 .mapping-table tbody tr:hover .form-control:focus,
3057 .mapping-table tbody tr:hover .custom-select{
3058 background-color: #fff !important;
3060 .mapping-table .custom-select{
3061 background-color: #F4F9FE;
3064 .mapping-table .form-control:disabled{
3068 background: transparent !important;
3072 /* Windows View as 150% */
3073 @media (resolution: 150dpi) {
3074 /* @media (-webkit-device-pixel-ratio: 1.5) { */
3075 .body-container > .container{
3076 max-width: 960px !important;
3079 /* Extra small devices (portrait phones, less than 576px) */
3080 @media (max-width: 575.98px) {
3086 /* Small devices (landscape phones, 576px and up) */
3087 @media (min-width: 576px) and (max-width: 767.98px) {
3091 /* Medium devices (tablets, 768px and up) */
3092 @media (min-width: 768px) and (max-width: 991.98px) {
3096 /* Large devices (desktops, 992px and up) */
3097 @media (min-width: 992px) and (max-width: 1199.98px) {
3101 /* Extra large devices (large desktops, 1200px and up) */
3102 @media (min-width: 1200px) {