.table td, .table th { border-bottom: 1px solid #323e5a !important; } body { background-color: #1A2035 !important; } .form-check:not(.form-switch) .form-check-input[type="checkbox"]:checked { background: #2680ea !important; border-color: #d1d7e1 !important; } .card { box-shadow: 0 4px 25px 1px rgb(0 0 0 / 5%), 0 1px 2px 1px rgb(0 0 0 / 6%); } .dropdown-menu.show { background: #1A2035 !important; } .btn.bg-gradient-primary:hover { color: #fff !important; } .form-select { background-color: #1A2035 !important; } .bg-gradient-primary { background-image: none !important; background: #428CC2 !important; box-shadow:none !important; } .card-body { color: #babcc2 !important; } .text-primary { color: #428cc2 !important; } .customselect { border: 1px solid #d2d6da !important; border-radius: 0.375rem !important; border-top-left-radius: 0.375rem !important; border-bottom-left-radius: 0.375rem !important; border-top-left-radius: 0.375rem !important; border-bottom-left-radius: 0.375rem !important; padding: 0.625rem 0.75rem !important; line-height: 1.3 !important; } .position-sticky { background: #1a2035; } .main { max-width: 200px; width: 200px; } .cardbg { background: #202940 !important; } .has-search .form-control { padding-left: 2.375rem; } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { color: #babcc2 !important; background-color: #2780eb !important; } .navbar-vertical .navbar-nav > .nav-item .nav-link.active { background-color: #428cc2 !important; } .has-search .form-control-feedback { position: absolute; z-index: 2; display: block; /* width: 2.375rem; */ padding-left: 15px; height: 2.375rem; line-height: 2.375rem; text-align: center; pointer-events: none; color: #aaa; } .search:focus { display: block; border-bottom: 1px solid #aaa; border-radius: 2px; } .timeline:before { content: ''; position: absolute; top: 0; left: 1rem; height: 68%; border-right: 2px solid #e5e5e5; } label, .form-label { color:#babcc2 !important; } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: #428cc2 !important; } /* timeline */ .timeline, .timeline-horizontal { list-style: none; padding: 20px; position: relative; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { color: #babcc2 !important; } .table { --bs-table-color: #babcc2 !important; } .timeline:before { top: 40px; bottom: 0; position: absolute; content: " "; width: 3px; background-color: #eeeeee; left: 10%; margin-left: -1.5px; } .timeline .timeline-item { margin-bottom: 20px; position: relative; } .timeline .timeline-item:before, .timeline .timeline-item:after { content: ""; display: table; } .timeline .timeline-item:after { clear: both; } .timeline .timeline-item .timeline-badge { color: #fff; width: 32px; height: 33px; line-height: 42px; font-size: 12px; text-align: center; position: absolute; top: 18px; left: 50%; margin-left: -27px; background-color: #7c7c7c; border: 3px solid #ffffff; z-index: 100; border-top-right-radius: 50%; border-top-left-radius: 50%; border-bottom-right-radius: 50%; border-bottom-left-radius: 50%; } .timeline .timeline-item .timeline-badge i, .timeline .timeline-item .timeline-badge .fa, .timeline .timeline-item .timeline-badge .glyphicon { top: 2px; left: 0px; } .timeline .timeline-item .timeline-badge.primary { background-color: #1f9eba; } .timeline .timeline-item .timeline-badge.info { background-color: #5bc0de; } .timeline .timeline-item .timeline-badge.success { background-color: #59ba1f; } .timeline .timeline-item .timeline-badge.warning { background-color: #d1bd10; } .timeline .timeline-item .timeline-badge.danger { background-color: #ba1f1f; } .timeline .timeline-item .timeline-panel { position: relative; width: 46%; float: left; right: 16px; border: 1px solid #c0c0c0; background: #ffffff; border-radius: 2px; padding: 20px; -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175); } .timeline .timeline-item .timeline-panel:before { position: absolute; top: 26px; right: -16px; display: inline-block; border-top: 16px solid transparent; border-left: 16px solid #c0c0c0; border-right: 0 solid #c0c0c0; border-bottom: 16px solid transparent; content: " "; } .btn-primary, .btn.bg-gradient-primary { box-shadow: none !important; background: #428cc2 !important; } .btn-outline-primary { border-color: #428cc2 !important; color: #428cc2 !important; } .timeline .timeline-item .timeline-panel .timeline-title { margin-top: 0; color: inherit; } .nav.nav-pills .nav-link { color: #7b809a !important; } .timeline .timeline-item .timeline-panel .timeline-body>p, .timeline .timeline-item .timeline-panel .timeline-body>ul { margin-bottom: 0; } .btn{ text-transform:capitalize !important; } .timeline .timeline-item .timeline-panel .timeline-body>p+p { margin-top: 5px; } .timeline .timeline-item:last-child:nth-child(even) { float: right; } .timeline .timeline-item:nth-child(even) .timeline-panel { float: right; left: 16px; } .timeline .timeline-item:nth-child(even) .timeline-panel:before { border-left-width: 0; border-right-width: 14px; left: -14px; right: auto; } .timeline-horizontal { list-style: none; position: relative; padding: 20px 0px 20px 0px; display: inline-block; } .timeline-horizontal:before { height: 3px; top: 19px; bottom: 18px; left: 42px; right: 0; width: 84%; margin-bottom: 20px; } .timeline-horizontal .timeline-item { display: table-cell; width: 20%; min-width: 150px; float: none !important; padding-left: 0px; padding-right: 20px; margin: 0 auto; vertical-align: bottom; } .timeline-horizontal .timeline-item .timeline-panel { top: auto; bottom: 64px; display: inline-block; float: none !important; left: 0 !important; right: 0 !important; width: 100%; margin-bottom: 20px; } .timeline-horizontal .timeline-item .timeline-panel:before { top: auto; bottom: -16px; left: 28px !important; right: auto; border-right: 16px solid transparent !important; border-top: 16px solid #c0c0c0 !important; border-bottom: 0 solid #c0c0c0 !important; border-left: 16px solid transparent !important; } .timeline-horizontal .timeline-item:before, .timeline-horizontal .timeline-item:after { display: none; } .timeline-horizontal .timeline-item .timeline-badge { top: -16px; bottom: 0px; left: 43px; } /* */ [data-steps] { display: flex; counter-reset: step; margin: 50px 0px; } .list { display: flex; justify-content: center; align-items: center; list-style: none; width: 33.33%; text-align: center; position: relative; } .list::before { content: counter(step); counter-increment: step; position: absolute; display: block; width: 30px; height: 30px; background-color: #ff0000; color: #ffffff; border-radius: 5px; line-height: 30px; top: -35px; } .list:not(:first-child)::after { content: " "; width: 100%; height: 2px; background-color: #000000; position: absolute; z-index: -1; left: -50%; top: -21px; } .list.active::before, .list:not(:first-child).active::after { background-color: #27AE60; } .btn-container { display: flex; justify-content: space-between; width: 50%; } .btn { border-radius: 4px; background-color: #0000ff; padding: 0.5em; outline: none; color: #ffffff; cursor: pointer; } .btn.disabled { background-color: #333; cursor: no-drop; } .single-form { display: flex; flex-direction: column; align-items: center; justify-content: space-around; position: relative; border: 1px solid; border-radius: 4px; width: 80%; min-height: 400px; margin: 0 auto; } .single-form.hide { display: none; } .input-field { width: 50%; padding: 1em; position: relative; outline: none; } .input-field.invalid { border: 1px solid #FF0000; } #formData { width: 400px; white-space: break-spaces; } .card0 { background-color: #F5F5F5; border-radius: 8px; z-index: 0 } .card00 { z-index: 0 } .card1 { margin-left: 40px; z-index: 0; border-right: 1px solid #F5F5F5 } .card2 { display: none } .card2.show { display: block } .custom-checkbox .custom-control-input:checked~.custom-control-label::before { background-color: #E53935 } .next-button { width: 18%; height: 50px; background-color: #BDBDBD; color: #fff; border-radius: 6px; padding: 10px; cursor: pointer } .next-button:hover { background-color: #E53935; color: #fff } .get-bonus { margin-left: 154px } #progressbar { position: absolute; left: -9px; overflow: hidden; color: #E53935 } #progressbar li { list-style-type: none; font-size: 8px; font-weight: 400; margin-bottom: 36px } #progressbar li:nth-child(3) { margin-bottom: 88px } #progressbar .step0:before { content: ""; color: #fff } #progressbar li:before { width: 30px; height: 30px; line-height: 30px; display: block; font-size: 20px; background: #fff; border: 2px solid #E53935; border-radius: 50%; margin: auto } #progressbar li:last-child:before { width: 40px; height: 40px } #progressbar li:after { content: ''; width: 3px; height: 66px; background: #BDBDBD; position: absolute; left: 58px; top: 15px; z-index: -1 } #progressbar li:last-child:after { top: 147px; height: 132px } #progressbar li:nth-child(3):after { top: 81px } #progressbar li:nth-child(2):after { top: 0px } #progressbar li:first-child:after { position: absolute; top: -81px } #progressbar li.active:after { background: #E53935 } #progressbar li.active:before { background: #E53935; font-family: FontAwesome; content: "\f00c" } .tick { width: 100px; height: 100px } .prev { display: block; position: absolute; left: 40px; top: 20px; cursor: pointer } .prev:hover { color: #D50000 !important } @media screen and (max-width: 912px) { .card00 { padding-top: 30px } .card1 { border: none; margin-left: 50px } .card2 { border-bottom: 1px solid #F5F5F5; margin-bottom: 25px } .social { height: 30px; width: 30px; font-size: 15px; padding-top: 8px; margin-top: 7px } .get-bonus { margin-top: 40px !important; margin-left: 75px } #progressbar { left: -9px } } .main { max-width: 200px; width: 200px; } .has-search .form-control { padding-left: 2.375rem; } .has-search .form-control-feedback { position: absolute; z-index: 2; display: block; /* width: 2.375rem; */ padding-left: 15px; height: 2.375rem; line-height: 2.375rem; text-align: center; pointer-events: none; color: #aaa; } .search:focus { display: block; border-bottom: 1px solid #aaa; border-radius: 2px; } /* .tabbable-panel { border: 1px solid #eee; padding: 10px; } */ .tabbable-line>.nav-tabs { border: none; margin: 0px; } .tabbable-line>.nav-tabs>li { margin: 10px; margin-inline: 28px } .tabbable-line>.nav-tabs>li>a { border: 0; margin-right: 0; color: #9c9898; } .tabbable-line>.nav-tabs>li>a>i { color: #a6a6a6; } /* .tabbable-line > .nav-tabs > li.open, .tabbable-line > .nav-tabs > li:hover { border-bottom: 4px solid rgb(80,144,247); } */ .tabbable-line>.nav-tabs>li.open>a, .tabbable-line>.nav-tabs>li:hover>a { border: 0; background: none !important; color: #333333; } .tabbable-line>.nav-tabs>li.open>a>i, .tabbable-line>.nav-tabs>li:hover>a>i { color: #a6a6a6; } .tabbable-line>.nav-tabs>li.open .dropdown-menu, .tabbable-line>.nav-tabs>li:hover .dropdown-menu { margin-top: 0px; } .tabbable-line>.nav-tabs>li.active { border-bottom: 4px solid #3FD6D4; position: relative } .tabbable-line>.nav-tabs>li.active>a { border: 0; color: #262646 } .tabbable-line>.nav-tabs>li.active>a>i { color: #404040; } .tabbable-line>.tab-content { margin-top: -3px; /* background-color: #fff; */ border: 0; /* border-top: 1px solid #eee; */ /* padding: 15px 0; */ } .portlet .tabbable-line>.tab-content { padding-bottom: 0; } .card { box-shadow: 0 4px 25px 1px rgb(0 0 0 / 5%), 0 1px 2px 1px rgb(0 0 0 / 6%); } #buttonColor{ background-color: #3fd6d4; text-transform: none; margin-left: -10px; color: #fff !important; font-weight: bolder; } .btn-icon{ margin-inline: -27px; } .btn-tab { text-transform: none; color: black; font-weight: bolde; font-size: 25px; justify-content: center; background-color: #88888B } #buttonoutline{ /* background-color: #BAE0C9; */ text-transform: none; border: 1px solid #BAE0C9; color: #FFFFFF; } p:focus { color:green; } button.accordion { width: 100%; background-color: whitesmoke; border: none; outline: none; text-align: left; padding: 15px 20px; font-size: 18px; color: #333; cursor: pointer; transition: background-color 0.2s linear; } button.accordion:after { font-family: FontAwesome; content: "\f150"; font-family: "fontawesome"; font-size: 18px; float: right; } button.accordion.is-open:after { content: "\f151"; } button.accordion:hover, button.accordion.is-open { background-color: #ddd; } .accordion-content { background-color: white; border-left: 1px solid whitesmoke; border-right: 1px solid whitesmoke; padding: 0 20px; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-in-out; } /* upload file */ #imageUpload { display: none; } #profileImage { cursor: pointer; } #profile-container { width: 150px; height: 150px; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } #profile-container img { width: 150px; height: 150px; } .nav.nav-pills .nav-link.active { color:#babcc2 !important; } .accordion .accordion-item { border-radius: 10px !important; } ::-webkit-input-placeholder { color: #babcc2 !important; } .form-control { color:#babcc2 !important; } .form-select { background-color: #202940 !important; color:#babcc2 !important; } option:disabled { color: #babcc2 !important; } select:disabled { color: red !important; } input::file-selector-button { color:#babcc2 !important; } .dropdown-item:hover, .dropdown-item:focus { background-color: #428cc2 !important; } .dataTable-input { background: #202940 !important; } .dataTable-selector { background: #202940 !important; color:#babcc2 !important; } .dataTable-wrapper .dataTable-container .table thead tr th { color:#babcc2!important; } a:hover { color: #428cc2 !important; } .dropdown-item:hover{ color:#babcc2!important } .nav-pills .nav-link.active a:hover { color: #babcc2 !important; } .btn:hover{ color:#babcc2 !important; } .input-group.input-group-outline .form-control { border: 1px solid #babcc2 !important; } .text-white { color: #babcc2 !important; } .swal2-popup.swal2-toast { box-sizing: border-box; grid-column: 1/4 !important; grid-row: 1/4 !important; grid-template-columns: 1fr 99fr 1fr; padding: 1em; overflow-y: hidden; background: #202940 !important; box-shadow: 0 0 0.625em #d9d9d9; } .swal2-success-fix { background: none !important; } .swal2-success-circular-line-left { background: none !important; } .swal2-success-circular-line-right { background: none !important; } .swal2-popup { background: #202940 !important; border: 1px solid #babcc2 !important; } .swal2-html-container { color: #babcc2 !important; } .table thead th{ padding:5px !important; } .table tbody td { padding: 5px !important; } .rz-textbox { background-color: transparent !important; color: #babcc2 !important; } .pac-container.pac-logo.hdpi { position: absolute; z-index: 20000 !important; /* Adjust the value as needed */ } .pac-container { z-index: 20000 !important; /* Adjust the value as needed */ } .btn-outline-primary:focus { background-color: transparent !important; box-shadow: none !important; } .rz-multiselect-filter-container .rz-inputtext, .rz-dropdown-filter { background-color: transparent; color: #babcc2 !important; } .rz-html-editor-dropdown-items, .rz-splitbutton-menu, .rz-autocomplete-panel, .rz-multiselect-panel, .rz-dropdown-panel { background-color: #1a2035 !important; color: #babcc2 !important; } .rz-form-field-content, .rz-colorpicker, .rz-lookup-search input, .rz-spinner, .rz-calendar .rz-inputtext, .rz-multiselect, .rz-dropdown, .mask, .rz-textarea, .rz-textbox { background-color: transparent !important; color: #babcc2 !important; } .rz-button.rz-primary.rz-shade-default { background-color: #428cc2 !important; } .rz-datatable-data td .rz-cell-data, .rz-grid-table td .rz-cell-data { color: #babcc2 !important; } .rz-datatable-thead th .rz-column-title-content, .rz-grid-table thead th .rz-column-title-content { color: #babcc2 !important; } .rz-sortable-column .rzi-sort { margin-left: 10px !important; } .rz-sortable-column .rzi-sort-asc { color: #babcc2 !important; } .rz-sortable-column .rzi-sort:before { color: #babcc2 !important; } .rz-datatable { background-color: #202940 !important; border: none !important; } .rz-grid-table td, .rz-grid-table th { background-color: transparent !important; } .rz-grid-table thead th { border-bottom: 1px solid #323e5a !important; border-right: 1px solid #323e5a !important; } .rz-grid-table td { border-right: 1px solid #323e5a !important; border-bottom: 1px solid #323e5a !important; } .rz-paginator.rz-align-center { background-color: transparent !important; border-top: 1px solid #323e5a !important } .rz-overlaypanel { background-color: #1a2035 !important; color: #babcc2 !important; } .rz-paginator-page.rz-state-active { background-color: #428cc2 !important; color: white !important; } .rz-paginator-first, .rz-paginator-prev { background-color: transparent; color: white; } .navbar-vertical.navbar-expand-xs .navbar-collapse { overflow-x:hidden !important; } /*.rz-paginator-page { background-color: transparent !important; border: 1px solid white !important; color: white !important; }*/ .rz-button-text { font-size: 12px !important; text-transform: capitalize !important; } .rz-date-filter-buttons .rz-button .rzi, .rz-button-md .rzi { font-size: 16px !important; } .rz-button-md.rz-button-icon-only { padding: 4px !important; line-height: 0; min-height: auto !important; min-width: auto !important; } .rz-grid-table td, .rz-grid-table th { padding: 4px 0.5rem !important; } /* Absolute Center Spinner */ .loading { position: fixed; z-index: 999; height: 2em; width: 2em; overflow: show; margin: auto; top: 0; left: 0; bottom: 0; right: 0; z-index:2000; } /* Transparent Overlay */ .loading:before { content: ''; display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0, .8)); background: -webkit-radial-gradient(rgba(20, 20, 20,.8), rgba(0, 0, 0,.8)); } /* :not(:required) hides these rules from IE9 and below */ .loading:not(:required) { /* hide "loading..." text */ font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .loading:not(:required):after { content: ''; display: block; font-size: 10px; width: 1em; height: 1em; margin-top: -0.5em; -webkit-animation: spinner 150ms infinite linear; -moz-animation: spinner 150ms infinite linear; -ms-animation: spinner 150ms infinite linear; -o-animation: spinner 150ms infinite linear; animation: spinner 150ms infinite linear; border-radius: 0.5em; -webkit-box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0; box-shadow: rgba(255,255,255, 0.75) 1.5em 0 0 0, rgba(255,255,255, 0.75) 1.1em 1.1em 0 0, rgba(255,255,255, 0.75) 0 1.5em 0 0, rgba(255,255,255, 0.75) -1.1em 1.1em 0 0, rgba(255,255,255, 0.75) -1.5em 0 0 0, rgba(255,255,255, 0.75) -1.1em -1.1em 0 0, rgba(255,255,255, 0.75) 0 -1.5em 0 0, rgba(255,255,255, 0.75) 1.1em -1.1em 0 0; } /* Animation */ @-webkit-keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-moz-keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-o-keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } }