/* Created by: @themepixels URL: http://themepixels.com/ */ label { font-weight: normal; margin-bottom: 5px !important; color: #4a535e; } code { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; background: none; padding: 0; } small { font-size: 11px; } .lead { color: #333; } blockquote p { font-family: 'Georgia', sans-serif; font-weight: 100; color: #333; } blockquote .glyphicon, blockquote .fa { float: left; margin-right: 10px; font-size: 20px; } h4, .h4 { line-height: 24px; } .row { margin-left: -10px; margin-right: -10px; } .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { padding-left: 10px; padding-right: 10px; } .form-group::after { clear: both; display: block; content: ''; } .form-bordered .form-group { margin: 0; padding: 15px 0; border-top: 1px solid #e0e2e5; } .form-bordered .form-group:first-child { border-top: 0; } .form-striped .form-group { margin: 0; padding: 15px 0; } .form-striped .form-group:nth-child(even) { background: #fcfcfc; } .form-inline .form-group { margin-right: 20px; } .form-inline .checkbox { margin-right: 20px; } .form-control { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 10px; height: auto; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; font-size: 13px; } .form-control:focus { border-color: #999; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -moz-box-shadow: 3px 3px 0 rgba(12,12,12,0.05); -webkit-box-shadow: 3px 3px 0 rgba(12,12,12,0.05); box-shadow: 3px 3px 0 rgba(12,12,12,0.05); } .input-sm { font-size: 12px; padding: 7px 10px; height: auto; margin-top: 3px; } .input-lg { font-size: 18px; padding: 12px 10px; } .btn { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; line-height: 21px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; padding: 6px 15px; } .btn:focus { outline: none; } .btn-sm { padding: 5px 10px; } .btn-xs { padding: 2px 10px; } .btn-lg { padding: 12px 20px; } .btn-default { background: #e4e7ea; color: #636e7b; } .btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default { background: #f7f7f7; border-color: #ccc; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .btn-success { background-color: @orangeColor; border-color:@orangeColor; } .btn-success:hover, .btn-success:active, .btn-success.active, .open .dropdown-toggle.btn-success { background-color: @darkOrangeColor; border-color: @darkOrangeColor; } .btn-white { background: @whiteColor; border: 1px solid #ccc; color: #666; } .btn-white:hover, .btn-white:focus, .btn-white:active, .btn-white.active, .open .dropdown-toggle.btn-white { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; background: #f7f7f7; } .btn-default-alt { border: 2px solid #999; color: #999; text-transform: uppercase; font-family: 'LatoBold'; font-size: 12px; } .btn-default-alt:hover, .btn-default-alt:active, .btn-default-alt:focus { border-color: #666; color: #666; } .btn-primary-alt { border: 2px solid #428BCA; color: #428BCA; text-transform: uppercase; font-family: 'LatoBold'; font-size: 12px; } .btn-primary-alt:hover, .btn-primary-alt:active, .btn-primary-alt:focus { border-color: #357EBD; color: #357EBD; } .btn-success-alt { border: 2px solid #1CAF9A; color: #1CAF9A; text-transform: uppercase; font-family: 'LatoBold'; font-size: 12px; } .btn-success-alt:hover, .btn-success-alt:active, .btn-success-alt:focus { border-color: #17a08c; color: #17a08c; } .btn-warning-alt { border: 2px solid #F0AD4E; color: #F0AD4E; text-transform: uppercase; font-family: 'LatoBold'; font-size: 12px; } .btn-warning-alt:hover, .btn-warning-alt:active, .btn-warning-alt:focus { border-color: #EEA236; color: #EEA236; } .btn-danger-alt { border: 2px solid #D9534F; color: #D9534F; text-transform: uppercase; font-family: 'LatoBold'; font-size: 12px; } .btn-danger-alt:hover, .btn-danger-alt:active, .btn-danger-alt:focus { border-color: #D43F3A; color: #D43F3A; } .btn-info-alt { border: 2px solid #5BC0DE; color: #5BC0DE; text-transform: uppercase; font-family: 'LatoBold'; font-size: 12px; } .btn-info-alt:hover, .btn-info-alt:active, .btn-info-alt:focus { border-color: #46B8DA; color: #46B8DA; } .btn-brown { background-color: #583f26; border-color: #513921; color: @whiteColor; } .btn-brown:hover, .btn-browm:active, .btn-brown:focus { color: @whiteColor; background-color: #513921; border-color: #48321c; } .btn-brown-alt { border: 2px solid #583f26; color: #583f26; text-transform: uppercase; font-size: 12px; font-family: 'LatoBold'; } .btn-brown-alt:hover, .btn-brown-alt:active, .btn-brown-alt:focus { border-color: #513921; color: #513921; } .btn-black { background: #333; color: @whiteColor; border-color: #222; } .btn-black:hover, .btn-black:active, .btn-black:focus { background: #222; border-color: #111; color: @whiteColor; } .btn-black-alt { border: 2px solid #333; color: #333; font-size: 12px; font-family: 'LatoBold'; text-transform: uppercase; } .btn-black-alt:hover, .btn-black-alt:active, .btn-black-alt:focus { border: 2px solid #222; color: #222; } .btn-pink { background: #f579e8; border-color: #ec6bde; color: @whiteColor; } .btn-pink:hover, .btn-pink:active, .btn-pink:focus { background: #ec6bde; border-color: #e261d4; color: @whiteColor; } .btn-pink-alt { border: 2px solid #f579e8; color: #f579e8; font-size: 12px; font-family: 'LatoBold'; text-transform: uppercase; } .btn-pink-alt:hover, .btn-pink-alt:active, .btn-pink-alt:focus { border-color: #ec6bde; color: #ec6bde; } .btn-darkblue { color: @whiteColor; background: #2e4678; border-color: #29406f; } .btn-darkblue:hover, .btn-darkblue:active, .btn-darkblue:focus { background: #29406f; border-color: #243a66; color: @whiteColor; } .btn-darkblue-alt { border: 2px solid #2e4678; color: #2e4678; text-transform: uppercase; font-size: 12px; font-family: 'LatoBold'; } .btn-darkblue-alt:hover, .btn-darkblue-alt:active, .btn-darkblue-alt:focus { border-color: #29406f; color: #29406f; } .btn-orange { color: @whiteColor; background: #f38108; border-color: #de7504; } .btn-orange:hover, .btn-orange:active, .btn-orange:focus { background: #de7504; border-color: #d67003; color: @whiteColor; } .btn-orange-alt { border: 2px solid #f38108; color: #f38108; text-transform: uppercase; font-size: 12px; font-family: 'LatoBold'; } .btn-orange-alt:hover, .btn-orange-alt:active, .btn-orange-alt:focus { border-color: #de7504; color: #de7504; } .btn-maroon { color: @whiteColor; background: #990000; border-color: #880000; } .btn-maroon:hover, .btn-maroon:active, .btn-maroon:focus { background: #880000; border-color: #770000; color: @whiteColor; } .btn-maroon-alt { border: 2px solid #990000; color: #990000; text-transform: uppercase; font-size: 12px; font-family: 'LatoBold'; } .btn-maroon-alt:hover, .btn-maroon-alt:active, .btn-maroon-alt:focus { border-color: #880000; color: #880000; } .btn-lightblue { background: #0390fd; color: @whiteColor; border-color: #028af3; } .btn-lightblue:hover, .btn-lightblue:active, .btn-lightblue:focus { background: #028af3; border-color: #0385ea; color: @whiteColor; } .btn-lightblue-alt { border: 2px solid #0390fd; color: #0390fd; text-transform: uppercase; font-size: 12px; font-family: 'LatoBold'; } .btn-lightblue-alt:hover, .btn-lightblue-alt:active, .btn-lightblue-alt:focus { border-color: #028af3; color: #028af3; } .btn-group.open .dropdown-toggle { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .btn-group { margin-bottom: 10px; } .badge { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-weight: normal; font-size: 11px; vertical-align: middle; display: inline-block; } .badge-warning { background-color: #ec8c04; } .badge-success { background-color: #019a1e; } .nav-pills > li > a { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .nav-tabs > li > a { -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .panel { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; background: #fcfcfc; border: 0; -moz-box-shadow: 0 6px 10px rgba(0,0,0,0.12); -webkit-box-shadow: 0 6px 10px rgba(0,0,0,0.12); box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3);} .panel-heading, .panel-footer { background: @whiteColor; border-color: #eee; } .panel-heading { padding: 20px; } /* .panel-default > .panel-heading { border-color: #e7e7e7; background-color: #f2f2f2; }*/ .panel-heading-empty { background: none; border-bottom: 0; } .panel-heading p { font-size: 13px; margin-top: 10px; margin-bottom: 0; color: #77818e; } .panel-primary .panel-heading, .panel-success .panel-heading, .panel-warning .panel-heading, .panel-danger .panel-heading, .panel-info .panel-heading { border-bottom: 0; } .panel-success .panel-heading { background-color: #1CAF9A; } .panel-warning .panel-heading { background-color: #F0AD4E; } .panel-danger .panel-heading { background-color: #D9534F; } .panel-info .panel-heading { background-color: #5BC0DE; } .panel-dark .panel-heading { background-color: @blackColor; } .panel-btns a { margin-left: 8px; float: right; color: #000; display: inline-block; font-weight: 500; opacity: 0.2; font-size: 16px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .panel-btns a.minimize { font-size: 18px; } .panel-btns a:hover { text-decoration: none; opacity: 0.5; cursor: pointer; } .panel-btns a.minimize:active, .panel-btns a.minimize:focus { opacity: 0.2; text-decoration: none; } .panel-title { font-size: 18px; color: #111; /*font-family: 'LatoBold'; */ } .panel-title-alt { font-size: 13px; font-family: 'LatoBold'; text-transform: uppercase; margin: 0; } .panel-title-alt + p { margin-top: 5px !important; } .panel-primary .panel-title, .panel-success .panel-title, .panel-warning .panel-title, .panel-danger .panel-title, .panel-info .panel-title, .panel-dark .panel-title { color: @whiteColor; } .panel-success .panel-btns a, .panel-danger .panel-btns a, .panel-dark .panel-btns a { color: @whiteColor; } .panel-body { padding:15px; } .panel-body-nopadding { padding: 0; } .panel-footer { padding:15px; } .panel-footer:after { clear: both; display: block; content: ''; } .panel-heading .nav-tabs { margin-bottom: -20px; border-bottom: 0; } .panel-heading .nav-tabs li { margin-right: 5px; } .panel-heading .nav-tabs li a { color: #666; } .panel-heading .nav-tabs li a:hover, .panel-heading .nav-tabs li a:active, .panel-heading .nav-tabs li a:focus { background-color: @whiteColor; border-color: @whiteColor; border-bottom: 0; color: #111; } .panel-heading .nav-tabs li.active a { background: #fcfcfc; color: #111; } .panel-heading .nav-tabs li.active a:hover, .panel-heading .nav-tabs li.active a:active, .panel-heading .nav-tabs li.active a:focus { background: #fcfcfc; color: #111; border: 1px solid #ddd; border-bottom-color: #fcfcfc; } .panel-heading .nav-justified { margin-bottom: -21px; } .panel-heading .nav-justified li a { border-bottom: 0; } .panel-alt .panel-heading { padding: 20px 20px; } .panel-alt .panel-title { font-size: 13px; text-transform: uppercase; font-family: 'LatoBold'; } .panel-alt .panel-heading p { margin-top: 5px; line-height: 16px; } .panel-alt .panel-btns a { margin-top: -3px; } .panel-alt .panel-footer { padding: 15px; } .panel-alt .panel-body { padding: 15px; } .panel-primary .panel-heading p, .panel-warning .panel-heading p, .panel-success .panel-heading p, .panel-danger .panel-heading p, .panel-info .panel-heading p { color: @whiteColor; opacity: 0.6; } .form-horizontal .control-label { font-weight: normal; } .has-success .form-control, .has-warning .form-control, .has-error .form-control { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .has-success .form-control:focus, .has-warning .form-control:focus, .has-error .form-control:focus { -moz-box-shadow: 5px 5px 0 rgba(12,12,12,0.05); -webkit-box-shadow: 5px 5px 0 rgba(12,12,12,0.05); box-shadow: 5px 5px 0 rgba(12,12,12,0.05); } .input-group-addon { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-size: 13px; background-color: #f7f7f7; } .input-group-lg > .form-control, .input-group-lg > .input-group-addon, .input-group-lg > .input-group-btn > .btn { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; height: 46px; } .input-group-btn .btn { line-height: 22px; } .dropdown-menu { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 5px; -moz-box-shadow: 3px 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 3px 3px 0 rgba(12,12,12,0.03); box-shadow: 3px 3px 0 rgba(12,12,12,0.03); } .dropdown-menu li a { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .dropdown-menu > li > a { padding: 7px 10px; color: #666; } .dropdown-menu > li > a:hover { background-color: #e7e7e7; color: #333; } .tooltip-inner { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .popover { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.05); -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.05); box-shadow: 1px 1px 2px rgba(0,0,0,0.05); padding: 0; } .popover-title { -moz-border-radius: 2px 2px 0 0; -webkit-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0; font-size: 13px; border-color: #ddd; } .modal-dialog { border: 0; } .modal-content { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 7px 7px 0 rgba(0,0,0,0.4);; -webkit-box-shadow: 7px 7px 0 rgba(0,0,0,0.4);; box-shadow: 7px 7px 0 rgba(0,0,0,0.4); border: 0; } .modal-title { font-size: 20px; color: #333; } .modal-header .close { margin-top: 4px; } .modal-backdrop.in { opacity: 0.65; } .alert { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .alert .close { font-size: 16px; margin-top: 3px; } .alert .alert-link { font-family: 'LatoBold'; font-weight: normal; } .alert > p + p { margin-top: 15px; } .alert > p + p .btn { margin-right: 5px; } .label { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; padding: 4px 8px; font-weight: normal; font-size: 11px; } .label-success { background-color: #1CAF9A; } .badge-primary { background-color: #428BCA; } .badge-warning { background-color: #F0AD4E; } .badge-success { background-color: #0499ff; } .badge-danger { background-color: #D9534F; } .badge-info { background-color: #5BC0DE; } .progress { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 8px; height: 24px; margin-bottom: 15px; } .progress-bar { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .progress-bar-success { background-color: #1CAF9A; } .progress-sm { height: 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .nav-tabs { background: #d8dbde; border: 0; -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .nav-tabs > li > a { border: 0; padding: 14px 20px; color: #666; } .nav-tabs > li > a:hover { background: none; color: #333; } .tab-content { background: #fcfcfc; padding: 15px; -moz-box-shadow: 0 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 0 3px 0 rgba(12,12,12,0.03); box-shadow: 0 3px 0 rgba(12,12,12,0.03); -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background-color: #fcfcfc; border: 0; } .tab-pane address:last-child { margin-bottom: 0; } .nav-dark { background: @orangeColor; } .nav-dark > li > a { color: @whiteColor; } .nav-dark > li > a:hover { color: @whiteColor; } .nav-tabs.nav-justified > li > a { border-bottom: 0; } .nav .dropdown > a { font-family: 'LatoBold'; } .nav .dropdown-menu { margin-top: -2px; } .nav .dropdown .caret { border-top-color: #666; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border-color: @whiteColor; border-bottom-color: #fcfcfc; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border: 0; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { border: 0; background: none; color: #333; font-family: 'LatoBold'; } .panel-group .panel-heading { padding: 0; } .panel-group .panel-title { font-size: 14px; font-family: 'LatoBold'; } .panel-group .panel-title a { padding: 14px 15px; display: block; } .panel-group .panel-title a:hover, .panel-group .panel-title a:focus, .panel-group .panel-title a:active { text-decoration: none; } .panel-group .panel-title a.collapsed { background-color: #f7f7f7; color: #666; border-bottom: 1px solid #ddd; } .panel-group .panel:last-child .panel-title a { border-bottom: 0; } .panel-group .panel-title a.collapsed:hover { background-color: #f3f3f3; } .panel-collapse.in .panel-body { border-bottom: 1px solid #ddd; } .panel-group .panel + .panel { margin-top: 0; border-top: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } .panel-group .panel:last-child { -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; } .panel-group .panel:first-child { -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .panel-group-dark .panel { border-bottom: 0; } .panel-group-dark .panel-title a.collapsed { background-color: #1d2939; color: #ccc; border-bottom: 1px solid #273548; } .panel-group-dark .panel-title a.collapsed:hover { background-color: #17222f; color: @whiteColor; } .pagination > li:first-child > a, .pagination > li:first-child > span { border-bottom-left-radius: 3px; border-top-left-radius: 3px; } .pagination > li:last-child > a, .pagination > li:last-child > span { border-bottom-right-radius: 3px; border-top-right-radius: 3px; } .pagination > li > a, .pagination > li > span { color: #636e7b; } .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { background-color: #e4e7ea; } .pagination-split li { margin-left: 5px; display: inline-block; float: left; } .pagination-split li:first-child { margin-left: 0; } .pagination-split li a { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { background-color: @orangeColor; border-color: @orangeColor; } .pager li > a, .pager li > span { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; color: #636e7b; } .well { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; background-color: #e4e7ea; } .thumbnail { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 5px; } .media { padding-bottom: 15px; } .media-heading { color: #333; font-size: 14px; font-family: 'LatoBold'; margin: 0; } small.media-desc { line-height: 16px; font-size: 12px; display: block; } .text-success { color: #1CAF9A; } .table { background: #fcfcfc; -moz-box-shadow: 0 6px 10px rgba(0,0,0,0.12); -webkit-box-shadow: 0 6px 10px rgba(0,0,0,0.12); box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3); } .table th { font-weight: normal; } .table thead > tr > th { border-color: #eee; background-color: #414141; padding-top: 12px; padding-bottom: 12px; color: @whiteColor; } .table thead > tr > th, .table tbody > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tbody > tr > td, .table tfoot > tr > td { border-color: #eee; } .table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th { background-color: #f5f5f5; } /* Created by: @themepixels URL: http://themepixels.com/ */ /* New Variables */ @primaryColor: #FFB900; @primaryDarkColor: #E1590C; @secondaryColor: #262835; @tertiaryColor: #484A58; @blueColor: #3871C2; @lightBackground: #F7F8FC; @defaultColor: #DDDDDD; @formControlBg: #F9F9F9; @greenText: #4EC506; @redText: #E1590C; @whiteColor: #FFFFFF; @moltenRedText: #d03000; @color191B28: #191B28; @color1F212E: #1F212E; @color3B3D4A: #3B3D4A; @color20222F: #20222F; @colorA8A9AE: #A8A9AE; @colore4e4e4: #e4e4e4; @colorebcb9f: #ebcb9f; body { background: @secondaryColor; font-family: 'Equals', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif !important; line-height: 20px; color: @secondaryColor; font-size: 14px; } .logopanel h1 a img.dark-theme-logo { display: none; } .logopanel h1 a img.light-theme-logo { display: block; } /* width */ ::-webkit-scrollbar { width: 6px; height: 6px; border-radius: 6px; } /* Track */ ::-webkit-scrollbar-track { background: transparent; border-radius: 6px; } /* Handle */ ::-webkit-scrollbar-thumb { background: @primaryColor; border-radius: 6px; } /*body.notfound, body.signin { background: @whiteColor; }*/ .molten-red-text { color: @moltenRedText !important; } .mid-risk { color: #ffb900 !important; } .high-risk { color: #ff883b !important; } .table-responsive ::-webkit-scrollbar { height: 10px; transition: width 0.3s, height 0.3s; } .table-responsive ::-webkit-scrollbar-track { background: #F4F4F4; border-top: 3px solid #FFFFFF; border-bottom: 3px solid #FFFFFF; } .table-responsive ::-webkit-scrollbar-thumb { background: #E5E5E5; border-top: 3px solid #FFFFFF; border-bottom: 3px solid #FFFFFF; } .table-responsive ::-webkit-scrollbar-thumb:hover { border-radius: 10px; border: 3px solid #E5E5E5; transition: width 0.3s, height 0.3s; } .table-responsive ::-webkit-scrollbar-track:hover { border: 3px solid #F4F4F4; transition: width 0.3s, height 0.3s; } .tableScrollbar ::-webkit-scrollbar { height: 10px; transition: width 0.3s, height 0.3s; } .tableScrollbar ::-webkit-scrollbar-track { background: #F4F4F4; border-top: 3px solid #FFFFFF; border-bottom: 3px solid #FFFFFF; } .tableScrollbar ::-webkit-scrollbar-thumb { background: #E5E5E5; border-top: 3px solid #FFFFFF; border-bottom: 3px solid #FFFFFF; } .tableScrollbar ::-webkit-scrollbar-thumb:hover { border-radius: 10px; border: 3px solid #E5E5E5; transition: width 0.3s, height 0.3s; } .tableScrollbar ::-webkit-scrollbar-track:hover { border: 3px solid #F4F4F4; transition: width 0.3s, height 0.3s; } input, select, textarea { font-family: 'Equals', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif !important; color: #636e7b; } a:focus, a:active { outline: none; } h1, h2, h3, h4, h5 { font-family: 'Equals', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; } strong { font-weight: bold; } /* preloader */ #preloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(@secondaryColor, 0.8); z-index: 10000; } #status { width: 45px; height: 45px; position: absolute; left: 50%; top: 50%; margin: -22px 0 0 -22px; color: @primaryColor; display: flex; align-items: center; flex-direction: column; gap: 5px; } #status p { white-space: nowrap; } .partialPreloader { position: relative; top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; display: none; } .partialPreloaderForClient { top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; display: none; } .partialStatus { width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; font-size: 50px; display: flex; align-items: center; flex-direction: column; gap: 5px; z-index: 1000; } #partialMessage { width: max-content; font-size: medium; text-align: center; position: absolute; top: calc(50% + 20px); left: 50%; transform: translateX(-50%); margin: 0; } /* signin */ /***** HEADER PANEL *****/ /************************/ .headerbar { padding-top: 15px; position: fixed; right: 15px; left: 296px; z-index: 99; top: 0; background: @secondaryColor; transition: all 0.4s; } .headerbar-inner { background: @lightBackground; border-radius: 8px 8px 0 0; padding: 16px 20px; border-bottom: solid 1px rgba(@secondaryColor, 0.2); display: flex; justify-content: space-between; } .headerbar .menutoggle { display: none; border-radius: 8px; margin-left: 10px; } .headerbar .header-left { display: flex; align-items: center; } .headerbar .header-left .back-link { margin: 0 7px 0 0; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; color: @secondaryColor; border-radius: 8px; text-decoration: none; } .headerbar .header-left .back-link img { display: block; } .headerbar .header-left .back-link:hover { background: rgba(@secondaryColor, 0.2); } .headerbar .header-left .back-link span { font-size: 12px; } .headerbar .header-left h2 { font-size: 22px; line-height: 28px; padding: 0; margin: 0; font-weight: 600; max-width: calc(100vw - 220px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .headerbar .header-right { display: flex; align-items: center; } .menutoggle { padding: 8px; cursor: pointer; border-radius: 40px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; background: @tertiaryColor; } .menutoggle svg { display: block; } .menutoggle:hover { background-color: @primaryColor; } .menutoggle:hover svg g { opacity: 1; } .menutoggle:hover svg path { stroke: @secondaryColor; } .menutoggle:hover .fa-hamburger { background: url(../images/ic-hamburger-hover.svg) no-repeat center center !important; display: block !important; } .searchform input { width: 250px; background: @whiteColor url(../images/icon-search.png) no-repeat 95% center; float: left; padding: 18px 20px; border: 0; border-right: 1px solid #eee; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; height: 50px; font-size: 14px; } .searchform input:focus { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-color: #ddd; } .headermenu { list-style: none; margin: 0; padding: 0; display: flex; } .headermenu > li { position: relative; } .headermenu > li + li { padding-left: 14px; } .headermenu .dropdown-toggle { padding: 14px 10px; border-color: @whiteColor; background: @whiteColor; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; border: 0; } .headermenu .dropdown-toggle:hover, .headermenu .dropdown-toggle:focus, .headermenu .dropdown-toggle:active, .headermenu .dropdown-toggle.active, .headermenu .open .dropdown-toggle.dropdown-toggle { background: #f9f9f9; color: #333; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .headermenu .dropdown-toggle img { vertical-align: middle; width: 26px; } .headermenu .dropdown-toggle .caret { margin-left: 5px; } .headermenu .tp-icon { padding: 7px; font-size: 14px; line-height: 20px; background: none; color: @secondaryColor; border: 0; border-radius: 8px; transition: all 0.4s; } .headermenu .tp-icon:hover { background: rgba(@secondaryColor, 0.2); } .headermenu .tp-icon + .dropdown-menu:after { right: 17px; } .headermenu .chat-icon { border-right: 0; } .chosen-container, .chosen-single { width: 100% !important; } .headermenu .btn-group, .popover-content.text-center .btn-group { margin-bottom: 0; } .dropdown-list li { padding: 7px 15px 7px 15px; overflow: hidden; border-bottom: 1px solid #eee; } .seeAll { border-bottom: 0 !important; } .dropdown-list .thumb { width: 36px; float: left; } .dropdown-list .thumb img { width: 100%; display: block; vertical-align: middle; } .dropdown-list .desc { margin-left: 45px; display: block; } .dropdown-list .desc h5 { font-size: 13px; margin-top: 7px; } .seeAll { padding: 0 !important; } .dropdown-list li .badge { float: right; } .user-list { width: 300px; } .gen-list li a { display: block; } .gen-list li a:hover { color: @primaryColor !important; text-decoration: underline; } .gen-list li .name { font-size: 13px; font-family: 'LatoBold','Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; line-height: 21px; display: block; } .gen-list li .msg { font-size: 11px; line-height: normal; color: #999; display: block; } .link-for-download-msg { color: #2a6496 !important; } .link-for-download:hover { color: @primaryColor !important; } /***** LEFT PANEL *****/ /**********************/ .leftpanel { width: 296px; position: absolute; top: 0; left: 0; } .sticky-leftpanel { position: fixed; height: 100%; z-index: 999 !important; transition: all 0.4s; } .logopanel { display: flex; justify-content: space-between; padding: 43px 30px 30px; align-items: center; transition: all 0.4s; } .logopanel h1 { margin: 0; max-width: 180px; } .logopanel h1 a, .logopanel h1 a img { display: block; width: auto; height: auto; max-height: 50px; max-width: 100%; max-height: 40px; } .logopanel h1 span { color: #1caf9a; } .leftpanelinner { padding: 0 30px 10px; height: calc(100% - 140px); overflow: auto; transition: all 0.4s; } .leftpanel .searchform { display: none; } .leftpanel .searchform::after { content: ''; display: block; clear: both; } .leftpanel .searchform input { padding: 10px; height: auto; width: 100%; margin: 5px 0 20px 0; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .leftpanel .userlogged { margin: 0; padding: 0; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid rgba(255,255,255,0.1); display: none; } .leftpanel .userlogged .media-object { width: 40px; -moz-border-radius: 100px; -webkit-border-radius: 100px; border-radius: 100px; float: left; border: 2px solid #1CAF9A; padding: 2px; margin-left: 2px; } .leftpanel .userlogged .media-body { margin-left: 50px; color: #ccc; } .leftpanel .userlogged .media-body h4 { font-size: 15px; margin: 0; } .leftpanel .userlogged .media-body span { font-style: italic; font-size: 11px; opacity: 0.5; } .sidebartitle { font-size: 11px; text-transform: uppercase; color: @whiteColor; margin-bottom: 10px; } .nav- > li > a { color: rgba(@whiteColor, 0.6); padding: 10px 30px 10px 10px; border-radius: 8px; font-size: 15px; display: flex; align-items: center; background: none; transition: all 0.4s; } .nav- > li > a svg { width: 24px; height: 24px; display: block; margin-right: 10px; opacity: 0.6; transition: all 0.4s; } .nav- > li > a svg path { transition: all 0.4s; } .nav- > li.active > a svg { opacity: 1; } .nav- > li.active > a svg path[stroke] { stroke: @secondaryColor; } .nav- > li.active > a svg path[fill] { fill: @secondaryColor; } .nav- > li > a span { display: block; width: 160px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.4s; } .nav- > li > a:focus { background: none; } .nav- > li + li { margin-top: 20px; transition: all 0.4s; } .nav- > li > a i { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; font-size: 20px; margin-right: 10px; transition: all 0.4s; } .nav- > li.nav-hover > a, .nav- > li > a:active { background-color: @tertiaryColor; } .nav- > li.nav-parent > a { position: relative; } .nav- > li.nav-parent > a:before { content: ''; width: 14px; height: 14px; position: absolute; top: 50%; margin-top: -7px; right: 10px; background-image: url(../images/ic-arrow-down.svg); background-repeat: no-repeat; background-position: center center; transition: all 0.4s; opacity: 0.6; } .nav- > li.active > a:before { background-image: url(../images/ic-arrow-down-dark.svg); opacity: 1; } .nav- > li.nav-active > a:before { transform: rotate(-180deg) } .leftpanel .nav- > li.active > a, .leftpanel .nav- > li.active > a:hover, .leftpanel .nav- > li.active > a:focus { background-color: @primaryColor !important; color: @secondaryColor !important; box-shadow: none !important; } .nav- .children { list-style: none; display: none; margin: 5px 0; padding: 0; } .nav- .children > li > a { color: #bebebe; font-size: 13px; display: block; padding: 5px 5px 5px 45px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; position: relative; } .nav- .children > li > a:hover, .nav- .children > li > a:active, .nav- .children > li > a:focus { text-decoration: none; color: @whiteColor; } .nav- .children > li > a:hover .fa, .nav- .children > li > a:active .fa, .nav- .children > li > a:focus .fa { background: @whiteColor; } .nav- .children > li .fa { width: 6px; height: 6px; background: #bebebe; border-radius: 6px; opacity: 0.5; margin-right: 5px; text-align: left; vertical-align: baseline; position: absolute; top: 13px; left: 30px; } .nav- .children > li .fa:before { content: ""; } .nav- .children > li.active > a { color: @whiteColor; } .nav- .children ul { margin-left: 12px; border: 0; } .infosummary { margin-top: 30px; } .infosummary ul { padding: 0; margin: 20px 0 0; list-style: none; border-top: 1px solid rgba(255,255,255,0.05); } .infosummary li { padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.05); } .infosummary li:after { clear: both; display: block; content: ''; } .infosummary .datainfo { float: left; line-height: normal; } .infosummary .datainfo h4 { margin: 0; font-size: 16px; color: @whiteColor; opacity: 0.7; } .infosummary span { font-size: 11px; line-height: normal; text-transform: uppercase; font-size: 10px; opacity: 0.4; } .infosummary .chart { float: right; margin-top: 5px; opacity: 0.6; } /***** MAIN PANEL *****/ /**********************/ .mainpanel { margin: 86px 15px 20px 296px; border-radius: 0 0 8px 8px; background: @lightBackground; min-height: calc(100vh - 110px); transition: all 0.4s; } .pageheader { padding: 15px; border-bottom: 1px solid #d3d7db; border-top: 1px solid #eee; background: #f4f4f4; position: relative; } .pageheader h2 { font-size: 28px; color: #1D2939; letter-spacing: -0.5px; margin: 0; } /*Commented By DIPAL on 19122017. Dont use these*/ /*.pageheader .glyphicon, .pageheader .fa { font-size: 24px; margin-right: 5px; padding: 6px 7px; border: 2px solid #1D2939; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; } .pageheader .fa.fa-pencil { padding: 6px 9px; } .pageheader .fa.fa-hand-o-up { padding: 6px 9px 6px 7px; } .pageheader .fa-file-o { padding: 6px 10px; } .pageheader .fa-user { padding: 6px 10px; } .pageheader .fa-file-text { padding: 6px 10px; `; } .pageheader .fa-map-marker { padding: 6px 12px; } .pageheader .fa-dollar { padding: 6px 12px; } .pageheader .fa-clock-o { padding: 6px 8px; }*/ .pageheader h2 span { font-size: 13px; text-transform: none; color: #999; font-style: italic; vertical-align: middle; letter-spacing: 0; } .pageheader h2 span::before { content: '/'; margin: 0 10px 0 5px; color: #ccc; } .pageheader .breadcrumb-wrapper { position: absolute; top: 23px; right: 25px; } .pageheader .breadcrumb-wrapper .label { color: #999; text-transform: uppercase; font-size: 11px; font-weight: normal; display: inline-block; } .pageheader .breadcrumb { background: none; display: inline-block; padding: 0; } .pageheader .breadcrumb li { font-size: 12px; } .pageheader .breadcrumb li.active { color: #333; } .contentpanel { padding: 20px 20px 0; min-height: calc(100vh - 152px); /*overflow: auto;*/ } .contentpanel::after { clear: both; display: block; content: ''; } /*form .form-group:last-child { margin-bottom: 0; }*/ .row-pad-5 { margin-left: -5px; margin-right: -5px; } .row-pad-5 [class*="col-lg"], .row-pad-5 [class*="col-md"], .row-pad-5 [class*="col-sm"] { padding-left: 5px; padding-right: 5px; margin-bottom: 10px; } .subtitle { font-size: 13px; text-transform: uppercase; color: #333; font-weight: bold; margin-bottom: 15px; margin-top: 0; } p { margin-bottom: 10px; } /***** DASHBOARD *****/ /*********************/ .panel-stat { background: none; } .panel-stat .panel-heading { padding: 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .panel-stat .stat { color: @whiteColor; max-width: 250px; } .panel-stat .stat img { text-align: center; } .panel-stat i { font-size: 30px; border: 1px solid @whiteColor; padding: 15px; border-radius: 50px; opacity: 0.5; } .panel-stat .stat-label { text-transform: uppercase; font-size: 11px; opacity: 0.75; display: block; line-height: normal; margin-bottom: 2px; } .panel-stat h1 { margin: 0; line-height: 36px; font-family: 'Helvetica Neue', sans-serif; font-size: 38px; } .panel-stat h4 { margin: 0; font-family: 'Helvetica Neue', sans-serif; } .sublabel { display: block; font-size: 12px; margin-bottom: 2px; } /*div.dataTables_scroll { margin-bottom: 20px !important; }*/ .dashboard-datatable .dataTables_filter { float: left; } /***** FORM STYLES *****/ /***********************/ .ckbox, .rdio { position: relative; } .ckbox input[type="checkbox"], .rdio input[type="radio"] { opacity: 0; } .ckbox label, .rdio label { padding-left: 10px; cursor: pointer; margin-bottom: 7px !important; } .ckbox label:before { width: 18px; height: 18px; position: absolute; top: 1px; left: 0; content: ''; display: inline-block; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #bbb; background: @whiteColor; } .ckbox input[type="checkbox"]:disabled + label { color: #999; } .ckbox input[type="checkbox"]:disabled + label:before { background-color: #eee; } .ckbox input[type="checkbox"]:checked + label::after { font-family: 'FontAwesome'; content: "\F00C"; position: absolute; top: 0; left: 3.5px; display: inline-block; font-size: 11px; width: 16px; height: 16px; color: @whiteColor; } .ckbox-default input[type="checkbox"]:checked + label:before { border-color: #999; } .ckbox-default input[type="checkbox"]:checked + label::after { color: #333; } .ckbox-primary input[type="checkbox"]:checked + label:before { border-color: #357EBD; background-color: #428BCA; } .ckbox-warning input[type="checkbox"]:checked + label:before { border-color: #EEA236; background-color: #F0AD4E; } .ckbox-success input[type="checkbox"]:checked + label:before { border-color: #0499ff; background-color: #0499ff; } .ckbox-danger input[type="checkbox"]:checked + label:before { border-color: #D43F3A; background-color: #D9534F; } .rdio label:before { width: 18px; height: 18px; position: absolute; top: 1px; left: 0; content: ''; display: inline-block; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; border: 1px solid #bbb; background: @whiteColor; } .rdio input[type="radio"]:disabled + label { color: #999; } .rdio input[type="radio"]:disabled + label:before { background-color: #eee; } .rdio input[type="radio"]:checked + label::after { content: ''; position: absolute; top: 5px; left: 4px; display: inline-block; font-size: 11px; width: 10px; height: 10px; background-color: #444; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; } .rdio-default input[type="radio"]:checked + label:before { border-color: #999; } .rdio-primary input[type="radio"]:checked + label:before { border-color: #428BCA; } .rdio-primary input[type="radio"]:checked + label::after { background-color: #428BCA; } .rdio-warning input[type="radio"]:checked + label:before { border-color: #F0AD4E; } .rdio-warning input[type="radio"]:checked + label::after { background-color: #F0AD4E; } .rdio-success input[type="radio"]:checked + label:before { border-color: #1CAF9A; } .rdio-success input[type="radio"]:checked + label::after { background-color: #1CAF9A; } .rdio-danger input[type="radio"]:checked + label:before { border-color: #D9534F; } .rdio-danger input[type="radio"]:checked + label::after { background-color: #D9534F; } pre { font-size: 12px; color: #C7254E; border: 1px solid #ddd; padding: 8px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; background: @whiteColor; } label.error { color: #B94A48; margin-top: 2px; } .asterisk { color: #D9534F; } div.error { margin-bottom: 20px; display: none; position: relative; } div.chosen-container.error { display: block; margin-bottom: 0px; } div.error label.error { display: block; padding-left: 25px; position: relative; } div.error label.error:before { font-family: 'Glyphicons Halflings'; content: '\e101'; position: absolute; top: -2px; left: 0; font-size: 16px; color: #D9534F; display: inline-block; } /***** FORM WIZARD STYLES *****/ /**************************/ .basic-wizard .nav li a { background: #e4e7ea; border-bottom: 1px solid #ccc; color: #4A535E; border-right: 1px solid #ccc; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; opacity: 0.75; } .basic-wizard .nav li:last-child a { border-right: 0; } .basic-wizard .nav li a:hover { background-color: #f7f7f7; opacity: 1; } .basic-wizard .nav li.active a, .basic-wizard .nav li.active a:focus, .basic-wizard .nav li.active a:active { background: #fcfcfc; border-bottom-color: #fcfcfc; color: #333; opacity: 1; } .basic-wizard .pager { margin: 0; border-top: 1px solid #ddd; background: #f7f7f7; padding: 10px; } .basic-wizard .pager li a { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border-color: @orangeColor; background-color: @orangeColor; color: @whiteColor; } .basic-wizard .pager li a:hover { background-color: #0464c8; border-color: #0464c8; } .basic-wizard .pager li.disabled a { background: #eee; color: #999; border-color: #ccc; } .basic-wizard .progress { height: 12px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .basic-wizard .nav-disabled-click li a:hover, .basic-wizard .nav-disabled-click li a:active, .basic-wizard .nav-disabled-click li a:focus { background-color: #E4E7EA; opacity: 0.75; color: #4A535E; cursor: default; } .basic-wizard .nav-disabled-click li.active a:hover, .basic-wizard .nav-disabled-click li.active a:active, .basic-wizard .nav-disabled-click li.active a:focus { background: #fcfcfc; color: #333; opacity: 1; } .basic-wizard .tab-content { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } .tab-pane::after { clear: both; display: block; content: ''; } /***** UI ELEMENTS *****/ /***********************/ .btn-demo::after { clear: both; display: block; content: ''; } .btn-demo .btn { float: left; margin: 0 10px 10px 0; } .fonticon-list { list-style: none; margin: 20px 0; padding: 0; } .fontawesome-list { list-style: none; padding: 0; } .fonticon-list li, .fontawesome-list li { display: block; margin-bottom: 5px; } .fonticon-list li span, .fontawesome-list li span { color: #333; vertical-align: middle; margin-right: 8px; min-width: 20px; } .tooltip-example .btn, .popover-example .btn { margin: 0 5px 5px 0; } .tooltipflot { background-color: rgba(0,0,0,0.75); font-size: 11px; color: @whiteColor; padding: 3px 10px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .jqstooltip { min-height: 25px; border: 0; min-width: 30px; height: auto !important; width: auto !important; } .tinystat { display: inline-block; } .tinystat .chart, .tinystat .datainfo { display: inline-block; vertical-align: middle; } .tinystat .chart { margin-right: 5px; } .tinystat .text-muted { text-transform: uppercase; font-size: 10px; } .tinystat h4 { margin: 0; color: #333; font-weight: bold; line-height: normal; font-size: 16px; } .widget-quick-status-post .nav-tabs > li > a { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } .widget-quick-status-post .panel-body { padding: 0; } .widget-messaging .panel-btns .panel-edit { padding: 15px 17px; opacity: 0.5; font-size: 24px; margin-top: -18px; margin-right: -20px; position: relative; } .widget-messaging .panel-btns .panel-edit:hover { opacity: 1; } .widget-messaging .panel-body { padding: 0; } .widget-messaging ul { list-style: none; padding: 0; margin: 0; } .widget-messaging ul li { padding: 15px; border-top: 1px solid #eee; background-color: @whiteColor; } .widget-messaging ul li:hover { background-color: #fcfcfc; } .widget-messaging ul li:first-child { border-top: 0; } .widget-messaging .sender { font-size: 13px; color: #333; margin: 0; font-weight: bold; line-height: normal; } .widget-messaging ul li small { line-height: normal; } .widget-today .panel-heading, .widget-time .panel-heading { height: 115px; } .widget-today .glyphicon, .widget-today .fa { font-size: 72px; color: @whiteColor; opacity: 1; } .widget-time .glyphicon, .widget-time .fa { font-size: 60px; color: @whiteColor; opacity: 1; } .widget-today .today, .widget-time .today { line-height: normal; margin: 0; color: #333; font-weight: bold; font-size: 20px; } .widget-photoday .panel-body { padding: 0; } .widget-photoday .photoday img { width: 100%; display: block; -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .widget-photoday .photo-details { padding: 15px; } .widget-photoday .photo-title { color: #333; font-size: 16px; margin: 0; font-weight: bold; line-height: normal; } .widget-photoday .photo-details small { display: block; } .widget-photoday .photo-meta { list-style: none; padding: 0; margin: 0; border-top: 1px solid #e3e3e3; background-color: #f7f7f7; } .widget-photoday .photo-meta li { display: table-cell; width: 1%; text-align: center; border-left: 1px solid #e3e3e3; } .widget-photoday .photo-meta li:first-child { border-left: 0; } .widget-photoday .photo-meta li a, .widget-photoday .photo-meta li span { padding: 15px 10px; display: block; color: #999; font-size: 12px; } .widget-photoday .photo-meta li a:hover { color: #666; text-decoration: none; } .widget-bloglist .media { border-bottom: 1px solid #eee; } .widget-weather { overflow: hidden; } .widget-weather .panel-body { padding: 0; background-color: #1D2939; } .widget-weather .row { margin: 0; } .widget-weather .temp, .widget-weather .weather { padding: 0; } .widget-weather .temp { background-color: #1CAF9A; color: @whiteColor; padding: 10px 0; } .widget-weather .temp h1 { font-size: 60px; font-family: 'LatoLight'; } .widget-weather .temp h1 span { width: 20px; height: 20px; display: inline-block; margin-left: -10px; } .widget-weather .temp h5 { text-transform: uppercase; } .widget-weather .weather-icon { color: #666; font-size: 60px; background-color: @whiteColor; display: block; padding: 20px 0; } .widget-weather .weather > div { width: 50%; text-align: center; color: @whiteColor; font-size: 14px; padding-top: 10px; } .widget-profile .panel-heading { position: relative; } .widget-profile .cover { position: absolute; top: 0; left: 0; height: 105px; overflow: hidden; -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .widget-profile .cover img { width: 100%; display: block; } .widget-profile .panel-body { position: relative; padding: 0; } .widget-profile-img { position: relative; margin-top: 30px; margin-left: 15px; } .widget-profile-title { background: #428BCA; margin-top: -55px; padding: 15px 0 15px 120px; color: @whiteColor; } .widget-profile-title h4 { font-size: 18px; margin: 0; line-height: normal; } .widget-profile-title small { line-height: normal; } .widget-profile blockquote { font-size: 18px; border-left: 0; margin: 0; color: #555; padding: 15px; } .widget-profile-title .fa { margin-right: 7px; } .widget-profile .row { margin: 0; } .widget-profile .row > div { padding: 0; } .widget-profile .row > div > span { display: block; border-right: 1px solid rgba(255,255,255,0.15); font-size: 14px; padding: 15px 10px; text-transform: uppercase; background: #1D2939; color: @whiteColor; } .widget-profile .row > div:first-child span { -moz-border-radius: 0 0 0 3px; -webkit-border-radius: 0 0 0 3px; border-radius: 0 0 0 3px; } .widget-profile .row > div:last-child span { border-right: 0; -moz-border-radius: 0 0 3px 0; -webkit-border-radius: 0 0 3px 0; border-radius: 0 0 3px 0; } /***** EMAIL *****/ /*****************/ .btn-compose-email { padding: 10px 0; margin-bottom: 20px; } .nav-email > li > a > .badge { margin-top: 2px; } .nav-email > li > a { color: #444; } .nav-email > li > a > i { width: 16px; text-align: center; margin-right: 10px; } .nav-email > li > a:hover { background-color: #d8dcdf; } .table-email { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-bottom: 1px solid #eee; margin: 0; background-color: #f7f7f7; } .table-email tr.unread td { background-color: @whiteColor; } .table-email tbody > tr > td { vertical-align: middle; } .table-email tr:hover { background-color: #eee; cursor: pointer; } .table-email tr.selected td { background-color: #eee; } .table-email .ckbox { width: 18px; height: 19px; } .table-email .ckbox input[type="checkbox"]:checked + label:after { top: 2px; } .table-email .star { color: #ccc; } .table-email .star-checked { color: #F0AD4E; } .table-email td:first-child { width: 30px; } .table-email td:nth-child(2) { width: 30px; } .table-email .media { margin: 0; padding: 0; } .table-email .media-object { width: 35px; } .table-email .media h4 { margin: 0; font-size: 13px; line-height: normal; } .table-email .media-meta { font-size: 11px; color: #999; } .table-email .email-summary { margin: 2px 0 0 0; } .table-email .email-summary strong { color: #333; } .read-panel { margin-top: 10px; border-top: 1px solid #eee; padding-top: 20px; } .read-panel .media-object { width: 35px; } .read-panel .media h4 { margin: 2px 0 0 0; font-size: 14px; line-height: normal; } .read-panel .media-meta { font-size: 12px; } .email-subject { color: #333; } /***** TABLES *****/ /******************/ .dataTables_length .chosen-container { min-width: 75px; width: auto !important; } .dataTables_length .chosen-container-single .chosen-single { padding-right: 0; } .table-action { text-align: center; } .table-action-hide a { opacity: 0; } .table-action a, .table-action-hide a { display: inline-block; margin-right: 5px; color: #666; } .table-action a:hover, .table-action-hide a:hover { color: #333; } .table-action a:last-child, .table-action-hide a:last-child { margin-right: 0; } .body-popup-table { border: 0; margin-bottom: 0 !important; box-shadow: none !important; background: none !important; } /***** PAGES *****/ /*****************/ .external-event { background: @orangeColor; margin-bottom: 5px; padding: 6px 10px; color: @whiteColor; font-size: 13px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } /* mediamanager */ .filemanager-options { list-style: none; margin: 0; padding: 0; margin-bottom: 20px; background: #fcfcfc; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 0 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 0 3px 0 rgba(12,12,12,0.03); box-shadow: 0 3px 0 rgba(12,12,12,0.03); } .filemanager-options li { display: inline-block; padding: 12px 15px; border-right: 1px solid #eee; font-size: 12px; color: #666; } .filemanager-options li a { color: #666; } .filemanager-options li a.disabled { opacity: 0.5; cursor: default; } .filemanager-options li a.disabled:hover { text-decoration: none; } .filemanager-options li i { font-size: 14px; margin-right: 5px; color: #444; } .filemanager-options .ckbox label { margin: 0 !important; } .filemanager-options .filter-type { float: right; border-right: 0; border-left: 1px solid #eee; } .filemanager-options .filter-type a { display: inline-block; margin-right: 10px; } .filemanager-options .filter-type a:last-child { margin-right: 0; } .filemanager-options .filter-type a:first-child { margin-left: 10px; } .filemanager-options .filter-type a.active { text-decoration: underline; color: #2A6496; } .filemanager .thmb { border: 1px solid #fcfcfc; background: #fcfcfc; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 10px; margin-bottom: 20px; position: relative; -moz-box-shadow: 0 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 0 3px 0 rgba(12,12,12,0.03); box-shadow: 0 3px 0 rgba(12,12,12,0.03); } .filemanager .thmb.checked { border-color: #ccc; } .filemanager .thmb::after { clear: both; display: block; content: ''; } .filemanager .ckbox { position: absolute; top: 15px; left: 15px; display: none; } .filemanager .fm-group { position: absolute; top: 15px; right: 15px; display: none; } .filemanager .fm-toggle { padding: 1px 4px; line-height: normal; background: @whiteColor; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .filemanager .fm-menu { min-width: 120px; } .filemanager .fm-menu a { font-size: 12px; color: #333; } .filemanager .fm-menu i { margin-right: 7px; color: #999; width: 16px; font-size: 13px; } .filemanager .thmb-prev { background: #eee; overflow: hidden; } .filemanager .thmb-prev a { display: block; } .filemanager .fm-title { margin-bottom: 0; font-size: 13px; } .fm-sidebar { padding-left: 10px; } .fm-sidebar .subtitle a { color: #999; font-size: 11px; } .fm-sidebar .subtitle a:hover { text-decoration: none; color: #333; } .folder-list { list-style: none; padding: 0; margin: 0; } .folder-list li { display: block; border-bottom: 1px solid #ddd; } .folder-list li a { display: block; padding: 5px 0; color: #666; } .folder-list li a:hover { color: #333; text-decoration: none; } .folder-list li i { margin-right: 10px; width: 16px; } .fm-sidebar .tag-list { list-style: none; padding: 0; margin: 0; } .fm-sidebar .tag-list li { float: left; margin-right: 5px; margin-bottom: 5px; } .fm-sidebar .tag-list li a { display: block; padding: 2px 7px; font-size: 11px; background: #fcfcfc; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; color: #666; } .fm-sidebar .tag-list li a:hover { color: @whiteColor; text-decoration: none; background: #428BCA; } /* profile */ .profile-name { margin: 0; margin-bottom: 10px; color: #333; } .profile-location, .profile-position { font-size: 13px; margin-bottom: 3px; } .profile-location .fa, .profile-position .fa { width: 16px; margin-right: 8px; text-align: center; } .profile-header { margin-bottom: 30px; } .profile-header .btn .fa { margin-right: 7px; } .profile-social-list { list-style: none; margin: 0; padding: 0; } .profile-social-list li { border-bottom: 1px solid #ddd; padding: 5px 0; } .profile-social-list li:first-child { padding-top: 0; } .profile-social-list li .fa { margin-right: 10px; width: 16px; } .activity-list { padding: 20px 10px; } .activity-list .act-media { border-bottom: 1px solid #eee; } .activity-list .act-thumb { width: 28px; vertical-align: middle; } .activity-list .act-media-body { line-height: 16px; } .activity-list .media-body p { line-height: 21px; font-size: 13px; } .activity-list .media-title { font-weight: bold; font-size: 15px; margin-bottom: 0; } .activity-list .blog-media { padding-bottom: 0; } .activity-list .blog-media .media-object { width: 120px; margin-right: 10px; margin-top: 5px; } .activity-list .blog-media .media-title { margin: 0; } .activity-list .img-single img { width: 50%; } .uploadphoto-list { list-style: none; padding: 0; margin: 0; margin-top: 20px; } .uploadphoto-list li { width: 20%; float: left; } .uploadphoto-list li a { display: block; margin-right: 5px; } .follower-list { padding: 10px; } .follower-list .media { border-bottom: 1px solid #eee; } .follower-list .btn .fa { margin-right: 5px; } .follower-list .media-object { margin-right: 10px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .follower-name { color: #333; margin: 0; font-size: 18px; margin-bottom: 5px; } .events { padding: 10px; } .events .subtitle { margin-bottom: 20px; } .events .media-object { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .events-list { list-style: none; margin: 0; padding: 0; } .events-list .event-body { font-size: 13px; } .event-body small { display: block; } .event-body small .fa { margin-right: 5px; width: 14px; text-align: center; } .event-body p { margin-top: 10px; } .event-title { margin: 0; margin-bottom: 5px; font-size: 16px; font-weight: bold; line-height: normal; } /* bloglist */ .blog-item { background: #fcfcfc; margin-bottom: 20px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 0 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 0 3px 0 rgba(12,12,12,0.03); box-shadow: 0 3px 0 rgba(12,12,12,0.03); position: relative; } .blog-img img { -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .blog-details { padding: 15px; } .blog-title { font-weight: bold; margin: 0; } .blog-title a { color: #333; } .blog-meta { list-style: none; padding: 0; margin: 0; margin-top: 10px; } .blog-meta::after { clear: both; display: block; content: ''; } .blog-meta li { float: left; padding: 0 5px; border-right: 1px solid #ddd; line-height: normal; font-size: 11px; margin-bottom: 5px; } .blog-meta li:first-child { padding-left: 0; } .blog-meta li:last-child { padding-right: 0; border-right: 0; } .blog-summary { font-size: 13px; } .blog-summary p { margin: 10px 0; } .blog-summary .btn { margin-top: 10px; } .blog-quote .quote { margin: 0; font-size: 18px; line-height: 24px; } .blog-quote .quote a { padding: 15px; background: #1d2939; color: #dadfe6; display: block; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; text-align: center; } .blog-quote .quote a:hover { text-decoration: none; background: #2c394c; } .blog-quote .quote-author { display: block; font-family: 'Equals'; opacity: 0.5; } .blog-quote .blog-meta { margin-top: 3px; } .blog-video { -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; overflow: hidden; height: 0; padding-top: 30px; padding-bottom: 56.25%; position: relative; } .blog-video iframe { position: absolute; width: 100%; height: 100%; border: 0; top: 0; left: 0; } .blog-quote .quote-primary a { background-color: #428BCA; } .blog-quote .quote-primary a:hover { background-color: #357EBD; } .blog-quote .quote-success a { background-color: #1CAF9A; color: @whiteColor; } .blog-quote .quote-success a:hover { background-color: #17A08C; } .blog-quote .quote-danger a { background-color: #D9534F; color: @whiteColor; } .blog-quote .quote-danger a:hover { background-color: #D43F3A; } /* blog single */ .panel-blog .blog-img img { width: 100%; } .blogsingle-title { font-family: 'Equals'; color: #333; margin: 0; } .blog-content { max-width: 975px; } .authorpanel { margin: 20px 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 20px 0; } .authorpanel::after { clear: both; display: block; content: ''; } .authorpanel .media { padding: 0; } .authorpanel .media-object { margin-right: 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .authorpanel p { margin-bottom: 0; font-size: 13px; } .blog-sidebar { font-size: 13px; padding-left: 5px; margin-top: 5px; } .sidebar-list { list-style: none; padding: 0; margin: 0; } .sidebar-list li { display: block; border-bottom: 1px solid #ddd; } .sidebar-list li a { padding: 7px 0; display: block; } .sidebar-list li i { display: inline-block; margin-right: 5px; } /* comment list */ .comment-list .media { border-bottom: 1px solid #ddd; } .comment-list .media-object { width: 60px; margin-right: 10px; } .comment-list h4 { margin: 0; color: #333; font-size: 16px; } .comment-list .media-body { font-size: 13px; position: relative; } .comment-list .reply { padding: 3px 8px; line-height: normal; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .comment-list .media-body p:last-child { margin-bottom: 0; } .comment-list .media-body .media:last-child { padding-bottom: 0; border-bottom: 0; } /* people directory */ .letter-list { list-style: none; padding: 0; margin: 0; -moz-box-shadow: 0 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 0 3px 0 rgba(12,12,12,0.03); box-shadow: 0 3px 0 rgba(12,12,12,0.03); } .letter-list li { border-left: 1px solid #eee; display: table-cell; width: 1%; } .letter-list li:first-child { border-left: 0; } .letter-list li a { display: block; padding: 8px 0; text-align: center; text-transform: uppercase; background: #f7f7f7; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .letter-list li:first-child a { -moz-border-radius: 3px 0 0 3px; -webkit-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px; } .letter-list li:last-child a { -moz-border-radius: 0 3px 3px 0; -webkit-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0; } .letter-list li a:hover { color: @whiteColor; background: #428BCA; text-decoration: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .people-item { background: #fcfcfc; padding: 20px; font-size: 13px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 0 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 0 3px 0 rgba(12,12,12,0.03); box-shadow: 0 3px 0 rgba(12,12,12,0.03); margin-bottom: 20px; } .people-item .media { padding: 0; } .people-item .media-object { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; margin-right: 10px; width: 110px; height: 110px; } .people-item .fa { margin-right: 5px; } .person-name { margin: 0 0 5px 0; color: #428BCA; } .people-item .social-list { margin-top: 10px; margin-bottom: 0; list-style: none; padding: 0; } .people-item .social-list::after { clear: both; display: block; content: ''; } .people-item .social-list li { float: left; margin-right: 5px; margin-bottom: 5px; } .people-item .social-list li a { font-size: 16px; border: 1px solid #ddd; padding: 3px 5px; width: 30px; display: block; text-align: center; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; color: #666; } .people-item .social-list li a:hover { background-color: #eee; color: #333; } .people-item .social-list li a .fa { margin-right: 0; } .notfoundpanel { text-align: center; margin-top: 10%; width: 600px; margin: 10% auto 0 auto; } .notfoundpanel h1 { font-size: 130px; color: #333; margin: 0; line-height: 130px; } .notfoundpanel h3 { color: #333; margin: 0; } .notfound h4 { font-size: 14px; } .notfoundpanel form { width: 350px; margin: 20px auto 0 auto; } .notfoundpanel .form-control { width: 250px; float: left; } /* search results */ .nav-sr li { border-bottom: 1px solid #ddd; } .nav-sr li a { padding: 5px 0; color: #555; } .nav-sr li a:hover { background: none; color: #333; } .nav-sr li a i { margin-right: 5px; } .results-list .media { border-bottom: 1px solid #eee; } .results-list .media-object { width: 125px; margin-right: 10px; } .results-list .filename { margin: 0; font-size: 16px; } .results-list .media-body { line-height: 18px; } /* invoice */ .table-invoice { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-bottom: 1px solid #eee; margin-top: 20px; } .table-invoice thead > tr > th { background: none; } .table-invoice thead > tr > th:last-child, .table-invoice thead > tr > th:nth-child(3), .table-invoice thead > tr > th:nth-child(2) { text-align: right; } .table-invoice tbody > tr > td:last-child, .table-invoice tbody > tr > td:nth-child(3), .table-invoice tbody > tr > td:nth-child(2) { width: 15%; text-align: right; } .table-total { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; float: right; } .table-total > tbody > tr > td { border: 0; } .table-total > tbody > tr > td:last-child { border-bottom: 1px solid #ddd; width: 15%; text-align: right; } .table-total > tbody > tr > td:first-child { text-align: right; color: #333; } /* timeline */ .timeline-post .panel-body { padding: 0; } .timeline-post .form-control { border: 0; -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; resize: vertical; } .timeline-post .form-control:focus { -moz-box-shdow: none; -webkit-box-shadow: none; box-shadow: none; } .timeline-post .panel-footer { padding: 10px; background: #f7f7f7; } .timeline-btns { padding: 5px; } .timeline-btns a { display: inline-block; font-size: 14px; width: 20px; height: 20px; color: #ccc; text-align: center; margin-right: 5px; } .timeline-btns a:hover { color: #666; } .panel-timeline .panel-heading { padding: 10px 10px 6px 10px; border-bottom: 0; } .panel-timeline .panel-body { padding: 0 10px; } .panel-timeline .panel-heading .media { margin: 0; padding: 0; } .panel-timeline .panel-heading .media-object, .panel-timeline .panel-footer .media-object { width: 32px; border-radius: 1px; } .panel-timeline .panel-body .media { margin-top: 10px; padding-bottom: 10px; } .panel-timeline .panel-body .media-object { width: 150px; } .panel-timeline .panel-body h4 { font-size: 16px; margin-bottom: 5px; } .panel-timeline h4 { margin: 0; font-size: 13px; line-height: normal; } .panel-timeline .panel-footer { padding: 10px; } .panel-timeline .panel-footer .form-control { padding: 8px 10px; border-radius: 0; } .timeline-btns { padding: 10px; } .timeline-btns:after { clear: both; display: block; content: ''; } .timeline-video { -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; overflow: hidden; height: 0; padding-top: 30px; padding-bottom: 56.25%; position: relative; } .timeline-video iframe { position: absolute; width: 100%; height: 100%; border: 0; top: 0; left: 0; } /* locked screen */ .lockedpanel { width: 250px; margin: 10% auto 0 auto; text-align: center; } .lockedpanel .loginuser { text-align: center; } .lockedpanel .loginuser img { -moz-border-radius: 100px; -webkit-border-radius: 100px; border-radius: 100px; background: rgba(255,255,255,0.4); padding: 5px; } .lockedpanel .locked { font-size: 42px; margin-bottom: 20px; } .lockedpanel .logged { margin-top: 20px; } .lockedpanel .logged h4 { margin: 0; font-size: 21px; color: #333; } .lockedpanel form { margin-top: 20px; } .lockedpanel form .btn { display: block; margin-top: 10px; } /* sign in */ .signinpanel { display: flex; min-height: 100vh; } .signinpanel-content { width: 100%; max-width: 580px; background: @whiteColor; border-radius: 8px; padding: 24px 40px; display: flex; flex-direction: column; justify-content: space-between; gap: 30px; } .signinpanel .signinpanel-content-right { display: flex; width: 595px; padding: 15px 15px 15px 0; } .signinpanel .signinpanel-content-left { flex-grow: 1; padding: 75px; display: flex; align-items: flex-end; justify-content: center; background: @secondaryColor url(../images/Sign-In-Image.svg) no-repeat center center; background-size: contain; } .signinpanel .signinpanel-content-left p { width: 100%; max-width: 475px; color: @whiteColor; margin: 0; font-size: 20px; line-height: 26px; font-weight: 300; } .signinpanel .logopanel { float: none; width: auto; padding: 0; background: none; } .signinpanel .signin-info ul { list-style: none; padding: 0; margin: 20px 0; } .signinpanel .signin-info a { color: #333; } .signinpanel .form-control { display: block; margin-top: 0px; } .signinpanel .uname { background: @whiteColor url(../images/user.png) no-repeat 95% center; } .signinpanel .pword { background: @whiteColor url(../images/locked.png) no-repeat 95% center; } .signinpanel form a { color: #666; } /* sign up */ .signuppanel { margin: 5% auto 0 auto; width: 780px; } .signuppanel .row { margin-left: -5px; margin-right: -5px; } .signuppanel .logopanel { float: none; width: auto; padding: 0; background: none; } .signuppanel .col-sm-6, .signuppanel .col-sm-5, .signuppanel .col-sm-3, .signuppanel .col-sm-4 { padding-left: 5px; padding-right: 5px; } .signuppanel .signup-info { padding-right: 20px; } .signuppanel form { background: rgba(255,255,255,0.2); border: 1px solid #ccc; -moz-box-shadow: 0 3px 0 rgba(12,12,12,0.03); -webkit-box-shadow: 0 3px 0 rgba(12,12,12,0.03); box-shadow: 0 3px 0 rgba(12,12,12,0.03); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 30px; } .feat-list { margin-top: 20px; } .feat-list .fa { font-size: 20px; border: 2px solid #636e7b; padding: 4px 5px; -moz-border-radius: 100px; -webkit-border-radius: 100px; border-radius: 100px; float: left; } .feat-list h4 { margin-left: 45px; padding-top: 3px; } .feat-list p { margin-left: 45px; } .signup-footer { color: @tertiaryColor; border-top: none; box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1) inset; -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1) inset; -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1) inset; font-size: 12px; line-height: 22px; padding: 0; text-align: center; -moz-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3); -webkit-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3); } .signup-footer p { color: @secondaryColor; font-size: 14px; margin: 0; padding: 0; } /***** LEFT PANEL COLLAPSE *****/ /*******************************/ .leftpanel-collapsed .logopanel { padding: 15px 5px 5px; } .leftpanel-collapsed .logopanel .menutoggle { border-radius: 8px; } .leftpanel-collapsed .leftpanel { width: 50px; } .leftpanel-collapsed .leftpanelinner { padding: 0; overflow: visible; } .leftpanel-collapsed .leftpanelinner .sidebartitle { display: none; } .leftpanel-collapsed .nav- { margin: 0; } .leftpanel-collapsed .nav- li { padding: 0 5px; } .leftpanel-collapsed .nav- li a { padding: 8px; } .leftpanel-collapsed .nav- li + li { margin-top: 5px; } .leftpanel-collapsed .nav- > li.nav-parent > a { background-image: none; } .leftpanel-collapsed .nav- > li.nav-parent > a:before { display: none; } .leftpanel-collapsed .nav- li a span { width: 0px; overflow: hidden; } .leftpanel-collapsed .nav- li.active a span { -moz-border-radius: 0 2px 0 0; -webkit-border-radius: 0 2px 0 0; border-radius: 0 2px 0 0; } .leftpanel-collapsed .nav- ul { display: none; } /*.leftpanel-collapsed .nav- > li.nav-hover > a { background: @whiteColor; color: #1d2939; }*/ /*.leftpanel-collapsed .nav- > li.nav-hover.active > a { background: #1CAF9A; color: @whiteColor; }*/ .leftpanel-collapsed .nav- li.nav-hover a span { display: block; } .leftpanel-collapsed .nav- li.nav-hover.active a span { background: #1CAF9A; color: @whiteColor; } .leftpanel-collapsed .nav- li.nav-hover ul { display: block; position: absolute; top: 0; left: 100%; margin: 0; min-width: 200px; background: @secondaryColor; z-index: 100; -moz-border-radius: 0 0 2px 0; -webkit-border-radius: 0 0 2px 0; border-radius: 0 0 2px 0; } .leftpanel-collapsed .nav- li ul.children { padding: 6px 0; border-radius: 0px 8px 8px 0px; } .leftpanel-collapsed .nav- li ul.children li { margin-top: 0; } .leftpanel-collapsed .nav- ul a { text-align: left; padding: 6px 10px; padding-left: 0; } .leftpanel-collapsed .nav- .children > li > a { padding: 5px 5px 5px 20px; } .leftpanel-collapsed .nav- ul a:hover { background: none; } .leftpanel-collapsed .nav- .children > li .fa { left: 0; } .leftpanel-collapsed .nav- li a svg { margin-right: 0; } .leftpanel-collapsed .headerbar { left: 50px; } .leftpanel-collapsed .mainpanel { margin-left: 50px; } .leftpanel-collapsed .infosummary { display: none; } .leftpanel-collapsed .sticky-leftpanel { overflow-y: visible; } /***** RIGHT PANEL STYLES *****/ /**************************/ .chat-view { margin-right: 240px; } .rightpanel { width: 240px; height: 100%; position: fixed; overflow-y: auto; overflow-x: hidden; top: 0; right: -240px; display: none; } .chat-view .rightpanel { display: block; right: 0; } .chat-relative-view { right: 240px; } .chat-relative-view .rightpanel { display: block; right: 0; } .rightpanel, .rightpanel label { color: #999; } .rightpanel .nav-tabs { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; background: #131d29; position: fixed; width: 240px; } .rightpanel .nav-tabs > li { display: table-cell; width: 1%; } .rightpanel .nav-tabs > li > a { padding: 15px 20px 16px 20px; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; color: rgba(255,255,255,0.5); } .rightpanel .nav-tabs > .active > a, .rightpanel .nav-tabs > .active > a:hover, .rightpanel .nav-tabs > .active > a:focus { background: #1D2939; color: @whiteColor; } .rightpanel .tab-content { background: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; margin-top: 45px; } .chatuserlist { list-style: none; padding: 0; border-bottom: 1px dotted rgba(255,255,255,0.05); } .chatuserlist li { border-top: 1px dotted rgba(255,255,255,0.05); } .chatuserlist .media-thumb { -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; border: 2px solid #999; padding: 3px; display: block; } .chatuserlist .media { margin: 10px 0; padding: 0; } .chatuserlist .online .media-thumb { border-color: #1CAF9A; } .chatuserlist .media-object { width: 30px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; } .chatuserlist .media-body { line-height: normal; padding-top: 7px; } .chatuserlist .media-body small { color: #666; display: block; } .chatuserlist .media-body strong { color: #bbb; font-size: 13px; margin-bottom: 4px; display: block; } .chatuserlist .badge { margin-top: 5px; } .rightpanel .pane-settings { font-size: 13px; } /***** ADDITIONAL STYLES *****/ /*****************************/ /* DROPDOWN */ .dropdown-menu-head { background: @whiteColor; } .dropdown-menu-head .title { background: @primaryColor; color: #bbbec6; font-weight:600; padding: 15px; text-transform: none; font-size: 13px; margin: 0; } /* ICON */ .tp-icon { padding: 10px 20px; line-height: 20px; border-color: #ddd; position: relative; } .tp-icon .badge { position: absolute; font-size: 10px; font-weight: 600; right: 4px; top: 10px; line-height: 13px; background-color: @orangeColor; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; padding: 1px 3px; color: #262835; } /* CHOSEN OVERRIDE */ .chosen-container-single .chosen-single div { width: 30px; border-left: 1px solid #d8dde1; background: #e4e7ea; } .chosen-container-single .chosen-single div b { background: url(../images/dropdown-arrow.png) no-repeat 8px 15px !important; } .chosen-container-active.chosen-with-drop .chosen-single div { width: 30px; border-left: 0; background: @whiteColor; } .chosen-container-active.chosen-with-drop .chosen-single div b { background-position: 8px -33px; } /* TIME PICKER */ .bootstrap-timepicker-widget.dropdown-menu { width: 230px; } /* COLOR PICKER */ .colorpicker-input { width: 200px; float: left; } .colorselector { margin-top: 4px; } /* CUSTOM STYLES */ .mb5 { margin-bottom: 5px; } .mb10 { margin-bottom: 10px; } .mb15 { margin-bottom: 15px; } .mb20 { margin-bottom: 20px; } .mb30 { margin-bottom: 30px; } .mb40 { margin-bottom: 40px; } .mr5 { margin-right: 5px; } .mr10 { margin-right: 10px; } .mr20 { margin-right: 20px; } .mr30 { margin-right: 30px; } .mt5 { margin-top: 5px; } .mt10 { margin-top: 10px; } .nomargin { margin: 0; } .border-right-0 { border-right: 0; } .border-left-0 { border-left: 0; } .nopadding { padding: 0; } .padding-top-0 { padding-top: 0; } .padding5 { padding: 5px; } .padding10 { padding: 10px; } .serif { font-family: 'Georgia, serif'; } .italic { font-style: italic; } .dark { color: #333; } .width100p { width: 100%; } .width20 { width: 20px; } .width30 { width: 30px; } /*************************Extra css********************************/ .form-control { border-radius: 8px; border-color: @defaultColor; box-shadow: none !important; color: @secondaryColor; font-size: 14px; line-height: 20px; padding: 9px 10px; } .form-control:focus { border-color: @primaryColor; } .dataTables_info { /*float: right;*/ clear: inherit; margin-right: 10px; line-height: 32px; } .table-footer { padding: 0; background: none; border: 0; } .table-footer .pagination { margin: 0; float: left; } .table-footer .dataTables_length .chosen-container-single .chosen-single { padding: 5px 10px 6px; } .table-panel .fa { color: #333; } .mr5 { margin-right: 5px; } .btn-panel .btn i { color: @whiteColor; } .btn-panel .btn span { padding-right: 7px; } .add-link { float: right; margin: 0 10px 10px 0; } .panel-header h3 { float: left; margin-top: 0; } .table-panel .table tbody > tr:hover { background: @formControlBg; } .table-panel .table tbody > tr > td { border-right: 1px solid #eee; word-break: break-all; } .table-panel .table tbody > tr > td div.action-btns { white-space: nowrap; display: flex; align-items: center; justify-content: center; } .table-panel .table tbody > tr > td .form-control.edit-control { width: calc(100% + 16px) !important; margin: -9px; } .table-panel .table tbody > tr > td.text-right .form-control.edit-control { text-align: right; } .table-panel .table tbody > tr > td:first-child { border-left: 1px solid #eee; } .table-panel .table { border-bottom: 1px solid #eee; box-shadow: none; -webkiit-box-shadow: none; -moz-box-shadow: none; } .table-panel .ckbox input[type="checkbox"]:checked + label:after { top: 2px; } .form-panel .chosen-container { width: 100% !important; } .form-panel .panel-body { padding-bottom: 5px; } .table-panel .dataTables_length, .table-panel .dataTables_info, .table-panel .dataTables_paginate { margin-bottom: 0; margin-top: 20px; } .user-name { font-size: 14px; position: relative; padding: 0 30px 0 7px; font-weight: 400; } .user-name:after { position: absolute; content: ""; right: 4px; top: 5px; border-bottom: solid 1px; border-left: solid 1px; transform: rotate(-45deg); width: 8px; height: 8px; } .headermenu .tp-icon + .dropdown-menu-usermenu:after { right: 60px; } .login-form { background: @whiteColor; border-radius: 0 0px 8px 8px; -webkit-border-radius: 0 0px 8px 8px; -moz-border-radius: 0 0px 8px 8px; } .login-content { padding: 20px; } .login-content .ckbox { display: inline-block; } .login-content .ckbox label:before { background: @whiteColor; border: 1px solid #d8dde1; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; content: ""; display: inline-block; height: 18px; left: 0; position: absolute; top: 1px; width: 18px; } .login-content .form-group small.remember { color: #828282; position: relative; top: -3px; } .login-content .box-footer button.btn-success.disabled, .btn-success[disabled], .btn-success.active { background-color: #ffc77a; border-color: #ffc77a; } .login-fix .box-extra { } .login-fix .box-extra a { color: rgba(255, 255, 255, 0.5); padding-right: 2px; } .login-fix .box-extra a:hover { color: rgba(255, 255, 255, 0.7); } .w-100 { width: 100% !important; } /****************** 3/10/2014 user view data *****************/ .viewdata-user { background: @whiteColor; } .viewdata-column { margin-bottom: 5px; display: inline-block; width: 100%; } .viewdata-column.lastchild { margin-bottom: 0px; } .viewdata-column .viewdata-title { font-size: 14px; font-weight: 500; width: 8%; color: #34404e; } .viewdata-column .viewdata-detail { font-size: 13px; font-weight: 400; text-align: left; } /***** MEDIA QUERIES *****/ /*************************/ /****************** 3/10/2014 user view data *****************/ @media screen and (max-width: 1440px) { .viewdata-column .viewdata-title { width: 11%; } } /****************** 3/10/2014 user view data *****************/ @media screen and (max-width: 1200px) { .viewdata-column .viewdata-title { width: 11%; } } @media screen and (min-width: 1025px) { /* Header type 2 */ .stickyheader .headerbar { left: 0 !important; padding: 15px 15px 0 15px; right: 0; } .stickyheader .headerbar-inner { padding-left: 296px; border-bottom-left-radius: 8px; } .stickyheader .logopanel { padding: 30px 15px 30px 30px !important; width: 296px; position: absolute; top: 0; left: 0; display: flex; align-items: center; min-height: 100px; } .stickyheader .sticky-leftpanel { padding-top: 105px; } .stickyheader .leftpanelinner { height: calc(100% - 20px); } .stickyheader .menutoggle { position: absolute; top: 110px; left: 281px; background: @whiteColor; border: solid 1px @secondaryColor; border-radius: 24px !important; padding: 8px 7px 8px 9px; transition: all 0.4s; z-index: 10; } .stickyheader .menutoggle svg { display: none; } .stickyheader .menutoggle:before { content: ""; height: 7px; width: 7px; border-left: solid 1px @secondaryColor; border-bottom: solid 1px @secondaryColor; display: block; box-sizing: border-box; transform: rotate(45deg); transform-origin: center center; transition: all 0.7s; } .stickyheader.leftpanel-collapsed .menutoggle { left: 38px; } .stickyheader.leftpanel-collapsed .menutoggle:before { transform: rotate(-135deg); } .stickyheader.leftpanel-collapsed .menutoggle { padding: 8px 9px 8px 7px; } } @media screen and (max-width: 1024px) { body { position: relative; background: none; } .headerbar { left: 0; top: 0; width: 100%; box-shadow: 0 0 10px rgba(0, 0, 0, .3); padding: 0; } .headerbar-inner { padding: 12px; border-radius: 0; } .contentpanel { padding: 77px 12px 12px; max-height: inherit; overflow: inherit; height: auto; } .leftpanel { margin-left: -296px; background: @secondaryColor; } .leftpanel .menutoggle { display: none; } .leftpanel-show { overflow: hidden !important; } .leftpanel-show .leftpanel { margin-left: 0; } .leftpanel-overlay { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(@secondaryColor, 0.8); visibility: hidden; opacity: 0; transition: all 0.4s; z-index: 990; } .leftpanel-show .leftpanel-overlay { opacity: 1; visibility: visible; } .logopanel { padding: 20px 10px; } .leftpanelinner { padding: 5px 10px; height: calc(100% - 99px); } .nav- > li + li { margin-top: 10px; } .footer { padding: 0 20px 20px; } .mainpanel { background: none; margin: 0; border-radius: 0; } .headerbar .menutoggle { display: block; } .headermenu > li + li { padding-left: 10px; } .btn-demo { margin-bottom: 20px; } .leftpanelinner .searchform input { background: #131b26; border: 0; } .headermenu > li.full-screen { display: none; } } /****************** 3/10/2014 user view data *****************/ @media screen and (max-width: 1050px) { .viewdata-column .viewdata-title { width: 14%; } } /****************** 3/10/2014 user view data *****************/ @media screen and (max-width: 990px) { .viewdata-column { margin-bottom: 10px; } .viewdata-column .viewdata-title { width: inherit; margin-bottom: 2px; } } @media screen and (max-width: 767px) { .searchform { position: relative; } .headermenu li:nth-child(4) { display: block; } .user-detail { display: none !important; } .leftpanel .searchform, .leftpanel .userlogged { display: block; } .breadcrumb-wrapper { display: none; } .headermenu .dropdown-menu:after { display: none; } .rightpanel .nav-tabs.nav-justified > li > a, .rightpanel .nav-justified > li > a { margin-bottom: 0; } .panel-email .col-sm-3 { display: none; } } @media screen and (max-width: 640px) { .user-name { display: none; } .notfoundpanel { width: auto; padding: 0 20px; } .notfoundpanel h1 { font-size: 72px; line-height: 72px; } .notfoundpanel h3 { font-size: 14px; line-height: normal; } .notfound h4 { font-size: 12px; line-height: 18px; } .notfoundpanel form { width: auto; } .notfoundpanel .form-control { float: none; width: 100%; } .notfoundpanel .btn { margin-top: 10px; width: 100%; } .signinpanel, .signuppanel { margin: 0 auto; width: 480px; padding: 20px; } .signinpanel form { margin-top: 0px; } .signup-footer { margin-bottom: 10px; } .signuppanel .form-control { margin-bottom: 10px; } .signup-footer .pull-left, .signup-footer .pull-right { float: none !important; text-align: center; } .widget-quick-status-post .nav-tabs.nav-justified > li { display: table-cell; width: 1%; margin-bottom: -5px; } .widget-quick-status-post .nav-tabs.nav-justified > li a { margin: 0; } .nav-tabs.nav-justified.nav-profile > li { float: none; margin-bottom: 0; display: table-cell; width: 1%; } .nav-tabs.nav-justified.nav-profile > li a { margin: 0; -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .dataTables_info { float: none !important; text-align: center; margin-bottom: 10px; } .dataTables_paginate { margin-bottom: 10px; text-align: center !important; float: none !important; } .paginate_disabled_previous, .paginate_enabled_previous, .paginate_disabled_next, .paginate_enabled_next { float: none !important; } .dataTables_filter, .dataTables_length { float: none !important; padding: 10px 0 0 10px; margin: auto !important; display: inline-block; } .table.dataTable th, .table.dataTable td { font-size: 13px; min-width: 150px; } .paging_full_numbers { min-width: 500px; margin: 0 0 10px 10px; } .paging_full_numbers:after { clear: both; display: block; content: ''; } .btn-panel { text-align: center; } .btn-panel .btn { float: none; display: inline-block; } .table-footer .pagination { float: none; } .dataTables_filter, .dataTables_length { float: none !important; } .dataTables_info { float: none; } .table-footer { text-align: center; } .chosen-container-single .chosen-single span { text-align: left; } .panel-header h3 { margin-bottom: 0px; } .add-link { float: right; margin: 0 10px 10px 0; } } @media screen and (max-width: 480px) { .signinpanel, .signuppanel { width: 360px; } .panel-email .pull-right { float: none !important; } .pageheader h2 { font-size: 18px; } .pageheader .glyphicon, .pageheader .fa { font-size: 18px; } .pageheader h2 span { font-size: 11px; } .fc-header td { display: block !important; text-align: center; width: 100%; border: 1px solid #eee; padding: 10px !important; margin-top: -1px; } .fc-button { padding: 2px 5px !important; margin: 0 !important; } .fc-header-title h2 { margin: 0 !important; } .filemanager-options li { padding: 5px 7px; } .filemanager-options .filter-type { display: block; float: none; border-top: 1px solid #eee; } .comment-list .media-object { width: 30px; padding: 2px; } .comment-list .media > .pull-left { margin: 0; } .comment-list h4 { font-size: 13px; } .comment-list .reply { font-size: 10px; padding: 2px 5px; } .comment-list .media-body { font-size: 12px; line-height: 18px; } .blog-content form { margin-bottom: 20px; } .letter-list { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .letter-list::after { clear: both; display: block; content: ''; } .letter-list li { float: left; width: auto; display: inline-block; } .letter-list li a { display: block; padding: 2px 5px; } .btn-invoice:before { display: block; content: ''; clear: both; } .btn-invoice .btn { display: block; width: 100%; margin-top: 10px; } .nav-tabs.nav-justified.nav-profile > li a { font-size: 13px; padding: 14px 10px; } #bloglist > div { padding: 0; margin: 0; float: none; width: auto; } } @media screen and (max-width: 360px) { .blog-title { font-size: 14px; line-height: 18px; } .blog-summary { font-size: 12px; line-height: 18px; } .blog-summary .btn { padding: 2px 5px; display: block; width: 100%; } .headermenu li:first-child .dropdown-menu { margin-right: -85px; } .headermenu li:nth-child(2) .dropdown-menu { margin-right: -37px; } /* .headermenu li:nth-child(3) .dropdown-menu { margin-right: -37px; } */ .nav-tabs.nav-justified.nav-profile > li { float: none; display: block; width: auto; } .blog-media .media-body { overflow: visible; } .follower-list .btn { display: block; margin: 0 0 5px 0; width: 100%; } .filemanager-options li { display: block; border-top: 1px solid #eee; } .filemanager-options li:first-child { border-top: 0; } .authorpanel .media-object { width: 80px; margin-right: 10px; } .people-item .media-object { width: 80px !important; height: 80px !important; } .pagination { margin-bottom: 20px; } } @media screen and (max-width: 320px) { .signinpanel, .signuppanel { width: auto; } } .input-validation-error { border-color: @redText !important; /*border: 1px solid #a94442 !important;*/ } .input-validation-error.chosen-container .chosen-choices { border-color: #E1590C !important; } .input-validation-error.chosen-container .chosen-single { border-color: #E1590C !important; } .control-label-value { padding-top: 7px; font-weight: bold; } .edit-control input[type="radio"], input[type="checkbox"].edit-control { margin-top: 0px; } .negative-margin { margin-bottom: -5px !important; padding-left: 0px !important; } .popover { max-width: 360px; } .popup-table th { background-color: #f7f7f7; /*color:#414141;*/ font-weight: initial !important; font-family: 'Equals', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif !important; width: 150px; } .popup-table { border-bottom: 1px solid #ebebeb; } .popup-table th { vertical-align: middle !important; } .popup-table td label { margin-bottom: 0px !important; } span.popovers { cursor: pointer; } /* New Theme Changes 26-09-2024 -----------------------*/ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { transition: color 9999s ease-out, background-color 9999s ease-out; } .btn { border-radius: 8px; /*font-size: 16px; padding: 14px 16px;*/ line-height: 26px; font-weight: bold; display: inline-flex; align-items: center; justify-content: center; } .btn.btn-xl { padding: 20px 20px 21px; } .btn.btn-xl[disabled] { color: #d3d3d3 !important; border-color: #d3d3d3 !important; } .btn.btn-xl[disabled] svg path[stroke] { stroke: #d3d3d3 !important; } .btn.btn-xl[disabled] svg path[fill] { fill: #d3d3d3 !important; } .btn.btn-primary { background: @primaryColor !important; border-color: @primaryColor !important; color: @secondaryColor !important; } .btn.btn-primary:hover, body .open .dropdown-toggle.btn-primary { background: #d59b03 !important; border-color: #d59b03 !important; color: @secondaryColor !important; } .btn.btn-default { background: none !important; border-color: @defaultColor !important; color: @secondaryColor !important; } .btn.btn-default:hover { background: @defaultColor !important; } .btn.btn-outline-primary { background: none !important; border-color: @primaryColor !important; color: @primaryColor !important; } .btn.btn-outline-primary:hover { background: @primaryColor !important; color: @secondaryColor !important; } .btn.btn-dark { background: @color191B28 !important; border-color: @color191B28 !important; color: @whiteColor !important; } .btn.btn-dark:hover { background: @tertiaryColor !important; border-color: @tertiaryColor !important; } .btn.btn-outline-dark { background: @whiteColor !important; border-color: @color191B28 !important; color: @color191B28 !important; } .btn.btn-outline-dark.no-bg:not(:hover) { background: transparent !important; } .btn.btn-outline-dark:hover { background: @color191B28 !important; color: @whiteColor !important; border-color: @whiteColor !important; } .large-btn-list .btn { font-size: 13px; } .large-btn-list .btn-outline-primary:hover svg path[stroke] { stroke: @secondaryColor; } .large-btn-list .btn-outline-primary:hover svg path[fill] { fill: @secondaryColor; } .large-btn-list .btn-outline-primary:hover svg.mr-10 path[fill] { fill: @whiteColor; } .large-btn-list .btn-outline-primary:hover .fa-spot-deal { background: url(../images/ic-book-a-spot-deal-light.svg) no-repeat center center !important; } .large-btn-list .btn-outline-primary:hover .fa-fwd-deal { background: url(../images/ic-book-a-fwd-deal-light.svg) no-repeat center center !important; } .large-btn-list .btn-outline-primary:hover .fa-next-arrow { background: url(../images/ic-next-arrow-light.svg) no-repeat center center !important; } /*.large-btn-list .btn-outline-primary:disabled { opacity: 1; color: #D3D3D3 !important; border-color: #D3D3D3 !important; } .large-btn-list .btn-outline-primary:disabled svg path[stroke] { stroke: #D3D3D3; } .large-btn-list .btn-outline-primary:disabled svg path[fill] { fill: #D3D3D3; }*/ .btn.has-down-arrow { padding-right: 35px; position: relative; } .btn.has-down-arrow:before { content: ""; position: absolute; height: 8px; width: 8px; border-left: solid 1px; border-bottom: solid 1px; right: 16px; top: 50%; transform: translateY(-60%) rotate(-45deg); } .btn.has-down-arrow.active-btn:before { transform: translateY(-20%) rotate(135deg); } /* Tab */ .contentpanel .nav-tabs { margin-bottom: 15px; background: none; display: flex; overflow: auto; white-space: nowrap; } .contentpanel .nav-tabs li { float: none; margin: 0; } .contentpanel .nav-tabs li + li { padding-left: 10px; } .contentpanel .nav-tabs.nav-wrap li + li { padding-left: 0px; } .contentpanel .nav-tabs.nav-wrap li { padding-right: 10px !important; } .nav-tabs.nav-wrap { flex-wrap: wrap; gap: 15px 0px; } .contentpanel .nav-tabs li a { color: @secondaryColor; border-radius: 8px; padding: 10px 16px; margin: 0; } .contentpanel .nav-tabs li a strong { font-weight: 400; } .contentpanel .nav-tabs li a:hover { background: rgba(@secondaryColor, 0.2); } .contentpanel .nav-tabs li.active a { background: @secondaryColor; color: @whiteColor; } .contentpanel .nav-tabs li.active a strong { font-weight: bold; } .contentpanel .nav-tabs.secondary li a { border: solid 1px @primaryColor; line-height: 30px; font-weight: 500; } .contentpanel .nav-tabs.secondary li a:hover { background: #fffaeb; } .contentpanel .nav-tabs.secondary li.active a { background: @primaryColor !important; color: @secondaryColor !important; } .contentpanel .tab-content { padding: 0; box-shadow: none; background: none; } body #account-detail-tab.nav-tabs { margin-bottom: 0 !important; } .contentpanel .tab-content .nav-tabs li, body #account-detail-tab.nav-tabs li { width: auto !important; padding: 0; } .contentpanel .tab-content .nav-tabs li a, body #account-detail-tab.nav-tabs li a { font-size: 14px; line-height: 20px; padding: 14px 14px 12px; background: none; border: 0; border-bottom: solid 2px transparent; background-color: transparent !important; color: @tertiaryColor !important; border-radius: 0; } .contentpanel .tab-content .nav-tabs li a, body #account-detail-tab.nav-tabs li a { padding-top: 0; } .contentpanel .tab-content .nav-tabs.secondary li a { padding-top: 14px !important; } .contentpanel .tab-content .nav-tabs li.active, body #account-detail-tab.nav-tabs li.active { background: transparent !important; } .contentpanel .tab-content .nav-tabs li.active a, body #account-detail-tab.nav-tabs li.active a { border-bottom-color: @secondaryColor; color: @secondaryColor !important; background-color: transparent !important; } /* Panel */ body .panel { background: @whiteColor; border: solid 1px #E1E1EA; border-radius: 8px; padding: 20px; box-shadow: none; } body .panel.form-panel { padding-bottom: 10px; } body .panel .panel-heading { padding: 0 0 20px; border: 0; display: flex; justify-content: space-between; align-items: center; background: none; } body .same-height .eh > .panel { min-height: calc(100% - 20px); } body .panel .panel-heading h4 { font-size: 18px; line-height: 24px; margin: 0; padding: 0; font-weight: 600; } .ip-address-head { font-size: 16px; line-height: 22px; color: @secondaryColor; margin: 0 0 0px; margin-bottom: 0px; text-align: right; } .ip-address { display: block; font-size: 18px; line-height: 25px; color: #000000; text-align: right; } body .panel .panel-heading .panel-heading-btns { display: flex; align-items: center; } body .panel .panel-heading .panel-heading-btns .btn + .btn, body .panel .panel-heading .panel-heading-btns > * + * { margin-left: 10px; } body .panel .panel-heading .btn img { display: block; } body .panel .panel-heading .btn span { padding-left: 4px; } body .panel .panel-heading .btn.dropdown-toggle span { padding-left: 0; padding-right: 5px; } body .panel .panel-body { padding: 0; } body .panel .panel-footer { padding: 16px 0 0; display: flex; gap: 16px; } /* Table */ .table-panel .table { border: 0; margin-bottom: 0; background: none; } .table-panel .table a { display: inline-block; color: @primaryColor; text-decoration: none; margin: 0 4px !important; } .table-panel .table .popovers { color: @primaryColor; } .table-panel .table a:not(.btn):hover { opacity: 0.7; } .table-panel .table thead > tr > th { background-color: @formControlBg; background-repeat: no-repeat; background-position: right 15px top 17px; color: @secondaryColor; font-size: 14px; line-height: 20px; vertical-align: middle; font-weight: 600; font-family: 'Equals', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif; border: 0; padding: 10px 14px; } .table-panel .table thead > tr > th.sorting { background-image: url(../images/ic-sort-normal.svg); } .table-panel .table thead > tr > th.sorting.sorting_asc { background-image: url(../images/ic-sort-acending.svg); } .table-panel .table thead > tr > th.sorting.sorting_desc { background-image: url(../images/ic-sort-decending.svg); } .table-panel .table thead > tr > th.sorting { padding-right: 50px !important; } .table-panel .table tbody > tr > td:first-child { border-left: 0; } .table-panel .table tbody > tr > td { border: 0; /*border-bottom: solid 1px #f9f9f9;*/ border-bottom: solid 1px rgba(38,40,53,0.1); font-size: 14px; line-height: 22px; padding: 16px 14px 15px; vertical-align: middle; } .table-panel .table tbody > tr:last-child > td { border-bottom: 0; } .table-responsive { /*overflow-x: auto; overflow-y: hidden; margin:0!important;*/ border: 0 !important; } .popover { border: solid 1px #E1E1EA; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,0.3); } .popover .popover-title { background: @secondaryColor; border: 0; font-weight: bold; color: @whiteColor; font-size: 16px; line-height: 22px; border-radius: 8px 8px 0 0; padding: 8px; } .popover .popover-content { padding: 8px; } .popover.right .arrow { border-right-color: #E1E1EA; } .popup-table tbody tr th { font-size: 12px; line-height: 18px; padding: 5px; border: 0; color: @secondaryColor; font-weight: bold !important; } .popup-table tbody tr td { font-size: 12px !important; line-height: 18px !important; padding: 5px !important; } /* Table Pagenation */ .table-responsive .bottom { display: flex; align-items: center; } .dataTables_paginate .paginate_button, .dataTables_paginate { margin-left: auto; } .dataTables_paginate .paginate_button, .dataTables_paginate .ellipsis { border-radius: 8px !important; font-size: 14px !important; line-height: 22px !important; border-color: @defaultColor !important; color: @tertiaryColor !important; padding: 3px 7px !important; min-width: 30px !important; height: 30px !important; text-align: center; } .dataTables_paginate .paging_full_numbers a.current { background: @defaultColor !important; border-color: @defaultColor !important; } .dataTables_paginate .paginate_button.first, .dataTables_paginate .paginate_button.previous, .dataTables_paginate .paginate_button.next, .dataTables_paginate .paginate_button.last { border-color: transparent !important; font-size: 0 !important; background-position: center center; background-repeat: no-repeat; } .dataTables_paginate .paginate_button.first { background-image: url(../images/ic-first.svg); } .dataTables_paginate .paginate_button.previous { background-image: url(../images/ic-back-page.svg); } .dataTables_paginate .paginate_button.next { background-image: url(../images/ic-next-page.svg); } .dataTables_paginate .paginate_button.last { background-image: url(../images/ic-last.svg); } .dataTables_length label { color: @secondaryColor; margin-bottom: 0 !important; } .dataTables_info { color: @secondaryColor; padding-left: 20px; } .chosen-container .chosen-single { border-radius: 8px; border: solid 1px @defaultColor !important; color: @secondaryColor; font-size: 14px; line-height: 20px; padding: 9px 36px 9px 8px; background: url(../images/ic-dropdown.svg) no-repeat right 10px center !important; } .chosen-container .chosen-single div { display: none; } .chosen-container.chosen-container-active .chosen-single { border-color: @primaryColor !important; } .chosen-container.chosen-with-drop .chosen-single { margin: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .chosen-container-single .chosen-search input[type="text"] { border-radius: 8px !important; border-color: @defaultColor !important; } .chosen-container-single .chosen-search input[type="text"]:focus { border-color: @primaryColor !important; } .chosen-container .chosen-drop { border-color: @primaryColor !important; border-radius: 0 0 8px 8px !important; } .dataTables_length .chosen-container .chosen-drop { border-radius: 8px 8px 0 0 !important; top: auto; bottom: 100%; margin: 0 0 -1px 0; border-top: solid 1px; border-bottom: 0; } .dataTables_length .chosen-container.chosen-with-drop .chosen-single { border-top: 0; border-radius: 0 0 8px 8px; } .chosen-container .chosen-results li { padding: 8px !important; } .dataTables_length .chosen-container .chosen-results { padding: 4px 4px 0 4px; margin: 0; } .chosen-container-multi .chosen-choices { border-radius: 8px; border: solid 1px @defaultColor !important; color: @secondaryColor; font-size: 14px; line-height: 19px; } .chosen-container-active.chosen-container-multi .chosen-choices { border-color: @primaryColor !important; /*border-bottom-right-radius: 0; border-bottom-left-radius: 0;*/ } .chosen-container-multi .chosen-choices li.search-field input[type="text"] { padding: 8px; } body .bootstrap-datetimepicker-widget table td.active, body .bootstrap-datetimepicker-widget table td.active:hover, body .bootstrap-datetimepicker-widget table td span.active, body .chosen-container .chosen-results li.highlighted, .ui-state-active { background-color: @primaryColor !important; color: @secondaryColor !important; } /* Action Buttons Icons */ .edit, .margin-edit-icon, .delete-row, .save, .cancel { display: inline-block; } .fa.fa-refresh:before, .fa.fa-exchange:before, .fa.fa-ban:before, .fa.fa-yes:before, .fa.fa-undo:before, .fa.fa-download:before, .fa.fa-resend:before, .fa.fa-registration-proceed:before, .fa.fa-check-square:before, .fa.fa-file:before, .fa.fa-pencil:before, .fa.fa-trash-o:before, .fa.fa-floppy-o:before, .fa.fa-times:before, .fa.fa-envelope:before, .fa.fa-ticket:before, .fa-upload:before, .fa.fa-lock:before, .fa.fa-unlock:before, .fa.fa-profile:before, .fa.fa-download-small:before, .fa.fa-logout:before, .fa.fa-download-big:before, .fa.fa-animation:before, .fa.fa-manage-rate-alert:before, .fa.fa-add:before, .fa.fa-minus:before, .fa.fa-copy:before, .fa.fa-application:before, .fa.fa-turnover:before, .fa.fa-deal:before, .fa.fa-balance:before, .fa.fa-application:before, .fa.fa-revenue:before, .fa-fa-arrow:before { display: none !important; } .fa.fa-refresh, .fa.fa-exchange, .fa.fa-ban, .fa.fa-yes, .fa.fa-undo, .fa.fa-download, .fa.fa-resend, .fa.fa-registration-proceed, .fa.fa-check-square, .fa.fa-file, .fa.fa-pencil, .fa.fa-trash-o, .fa.fa-floppy-o, .fa.fa-times, .fa.fa-envelope, .fa.fa-ticket, .fa.fa-upload, .fa.fa-lock, .fa.fa-unlock, .fa.fa-profile, .fa.fa-download-small, .fa.fa-logout, .fa.fa-download-big, .fa.fa-animation, .fa.fa-manage-rate-alert, .fa.fa-copy { display: inline-block; width: 18px; height: 18px; } .fa.fa-arrow{ display:inline-block; width:15px; height:17px; } .fa.fa-add, .fa.fa-minus { display: inline-block; width: 12px; height: 12px; } .fa.fa-application, .fa.fa-deal, .fa.fa-turnover, .fa.fa-balance, .fa.fa-revenue { display: inline-block; width: 30px; height: 30px; } .seeAll a:hover .fa.fa-arrow { background: url(../images/arrow-orange.svg) no-repeat center center; } .fa.fa-arrow { background: url(../images/arrow-right-black.svg) no-repeat center center; } .fa.fa-exchange { background: url(../images/ic-exchange.svg) no-repeat center center; } .fa.fa-add { background: url(../images/ic-add.svg) no-repeat center center; } .fa.fa-minus { background: url(../images/ic-minus.svg) no-repeat center center; } .fa.fa-refresh { background: url(../images/ic-refresh.svg) no-repeat center center; } .fa.fa-ban { background: url(../images/ic-no.svg) no-repeat center center; } .fa.fa-yes { background: url(../images/ic-yes.svg) no-repeat center center; } .fa.fa-undo { background: url(../images/ic-retry.svg) no-repeat center center; } .fa.fa-download { background: url(../images/ic-download.svg) no-repeat center center; } .fa.fa-resend { background: url(../images/ic-resend.svg) no-repeat center center; } .fa.fa-registration-proceed { background: url(../images/ic-registration-proceed.svg) no-repeat center center; } .fa.fa-file { background: url(../images/ic-file.svg) no-repeat center center; } .fa.fa-check-square { background: url(../images/ic-check-square.svg) no-repeat center center; } .fa.fa-pencil { background: url(../images/ic-edit.svg) no-repeat center center; } .fa.fa-copy { background: url(../images/ic-copy.svg) no-repeat center center; } .fa.fa-application { background: url(../images/Application.svg) no-repeat center center; } .fa.fa-deal { background: url(../images/Deal.svg) no-repeat center center; } .fa.fa-revenue { background: url(../images/Revenue.svg) no-repeat center center; } .fa.fa-turnover { background: url(../images/Turnover.svg) no-repeat center center; } .fa.fa-balance { background: url(../images/TotalBalance.svg) no-repeat center center; } .fa.fa-lock { background: url(../images/ic-lock.svg) no-repeat center center; } .fa-notification { background: url(../images/ic-notification.svg) no-repeat center center !important; } .fa-swap { background: url(../images/Swap.svg) no-repeat center center !important; } .fa-user { background: url(../images/ic-user.svg) no-repeat center center !important; } .fa-manage-rate-alert { background: url(../images/ic-manage-rate-alert.svg) no-repeat center center; } .fa-spot-deal { background: url(../images/ic-book-a-spot-deal.svg) no-repeat center center !important; } .fa-spot-deal-disabled { background: url(../images/ic-book-a-spot-deal-disabled.svg) no-repeat center center !important; } .fa-back-page { background: url(../images/ic-back-page.svg) no-repeat center center !important; } .fa-fwd-deal { background: url(../images/ic-book-a-fwd-deal.svg) no-repeat center center !important; } .fa-fwd-deal-disabled { background: url(../images/ic-book-a-fwd-deal-disabled.svg) no-repeat center center !important; } .fa-make-a-payment { background: url(../images/ic-make-a-payment.svg) no-repeat center center !important; } .fa-next-arrow { background: url(../images/ic-next-arrow.svg) no-repeat center center !important; } .fa-next-arrow-make-a-payment { background: url(../images/ic-next-arrow-make-a-payment.svg) no-repeat center center !important; } .fa.fa-unlock { background: url(../images/ic-unlock.svg) no-repeat center center; } .fa.fa-upload { background: url(../images/ic-upload.svg) no-repeat center center !important; } .fa.fa-profile { background: url(../images/ic-profile.svg) no-repeat center center !important; } .fa.fa-add-beneficiary { background: url(../images/ic-plus.svg) no-repeat center center !important; } .fa-hamburger { display: block !important; background: url(../images/ic-hamburger.svg) no-repeat center center !important; } .fa.fa-logout { background: url(../images/ic-logout.svg) no-repeat center center !important; } .fa.fa-download-small { background: url(../images/ic-download-small.svg) no-repeat center center !important; } .fa.fa-download-big { background: url(../images/ic-download-big.svg) no-repeat center center !important; } .fa.fa-trash-o { background: url(../images/ic-delete.svg) no-repeat center center; } .fa.fa-floppy-o { background: url(../images/ic-save.svg) no-repeat center center; } .fa.fa-times { background: url(../images/ic-close.svg) no-repeat center center; } .fa.fa-envelope { background: url(../images/ic-email.svg) no-repeat center center; } .fa.fa-ticket { background: url(../images/ic-manage-booking.svg) no-repeat center center; } .fa.fa-links { background: url(../images/ic-link.svg) no-repeat center center; height: 18px; width: 18px; } .fa.fa-plus { width: 12px; height: 12px; position: relative; } .fa.fa-plus:before { content: ""; position: absolute; width: 100%; height: 1px; background: @secondaryColor; top: 50%; transform: translateY(-50%; ); left: 0; } .fa.fa-plus:after { content: ""; position: absolute; height: 100%; width: 1px; background: @secondaryColor; top: 0; transform: translateX(-50%; ); left: 50%; } .fa.fa-minus { width: 12px; height: 12px; position: relative; } .fa.fa-minus:before { content: ""; position: absolute; width: 100%; height: 1px; background: @secondaryColor; top: 50%; transform: translateY(-50%; ); left: 0; } .form-row-outer { margin-bottom: -16px; } .form-row { background: @formControlBg; padding: 12px 20px; border-radius: 8px; margin-bottom: 16px; position: relative; } .form-row.has-icon { padding-right: 48px; } .form-row.has-icon.pr-100 { padding-right: 100px; } .form-row.has-icon .icon { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); } .form-row label { display: block; font-size: 14px; line-height: 20px; color: @tertiaryColor; margin-bottom: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .form-row p { margin: 0; font-size: 16px; line-height: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .form-row p.green-text { color: @greenText; } .margin-top-24 { margin-top: 24px; } .table .text-green.status { display: flex; align-items: center; white-space: nowrap; } .table .text-green.status i { display: block; margin-right: 10px; } .table .text-red.status { display: flex; align-items: center; white-space: nowrap; } .table .text-red.status i { display: block; margin-right: 10px; } .text-green { color: @greenText !important; } .text-red { color: @redText; } .btn-swap:hover .fa-swap { background: url(../images/Swap-hover.svg) no-repeat center center !important; } #swapCurrency .disable .fa-swap { background: url(../images/Swap-hover.svg) no-repeat center center !important; } .fa-spot-deal, .fa-fwd-deal, .fa-next-arrow, .fa-make-a-payment, .fa-next-arrow-make-a-payment, .fa-user, .fa-back-page, .fa-hamburger, .fa-notification, .fa-fwd-deal-disabled, .fa-spot-deal-disabled { width: 24px !important; height: 24px !important; background-size: contain !important; } .add-recepient-btn:hover .fa.fa-add-beneficiary { background: url(../images/ic-plus-black.svg) no-repeat center center !important; } .fa-swap { width: 40px !important; height: 40px !important; background-size: contain !important; } .fa.fa-animation { background: url(../images/Animation.svg) no-repeat center center; } /* Form Input ----------- */ .form-floating { position: relative; margin-bottom: 16px; } .form-floating .chosen-container-multi .chosen-choices { padding: 35px 20px 12px 20px; height: 71px !important; } .form-floating .chosen-container-multi .chosen-choices li.search-choice { margin: 0 5px 5px 0; } .form-floating .chosen-container-multi .chosen-choices li.search-field input[type="text"] { padding: 2px 0; font-size: 16px; } .form-floating.mb-0 { margin-bottom: 10px; } .modal-body .form-floating.mb-0, .form-floating.mb-0.no-margin { margin-bottom: 0; } .form-floating.floating-group { display: flex; } .form-floating.floating-group .w-30 { /*width: 30%; min-width: 30%;*/ width: 150px; min-width: 150px; } .form-floating.floating-group .w-100px { /*width: 30%; min-width: 30%;*/ width: 100px; min-width: 100px; } .form-floating.floating-group .first-input, .form-floating.floating-group .last-input { position: relative; } .form-floating.floating-group .flex-grow { flex-grow: 1; } .form-floating.floating-group .ml-n1 { margin-left: -1px; } .form-floating.floating-group .mr-n1 { margin-right: -1px; } .form-floating.floating-group .first-input .select2-container .select2-selection--single, .form-floating.floating-group .first-input .form-control, .form-floating.floating-group .first-input .chosen-single { border-top-right-radius: 0; border-bottom-right-radius: 0; } .form-floating.floating-group .last-input .select2-container .select2-selection--single, .form-floating.floating-group .last-input .form-control, .form-floating.floating-group .last-input .chosen-single { border-top-left-radius: 0; border-bottom-left-radius: 0; } body .form-floating.floating-group .select2-container { width: 100% !important; } .form-floating.floating-group .form-control:focus { z-index: 5; } .form-floating.floating-group .form-control:focus ~ label { z-index: 6; } .form-floating.floating-group .form-control.primary-input { min-width: 65%; width: 65%; margin-right: -1px; border-top-right-radius: 0; border-bottom-right-radius: 0; } .form-floating.floating-group .form-control.primary-input:disabled { border-right: solid 1px @defaultColor !important; z-index: 1; } .form-floating.floating-group .form-control.secondary-input, .form-floating.floating-group .form-control.secondary-input + .chosen-container .chosen-single { border-top-left-radius: 0; border-bottom-left-radius: 0; } .form-floating label { color: @tertiaryColor; position: absolute; padding: 24px 21px 5px; top: 1px; left: 1px; font-size: 16px; line-height: 22px; margin: 0 !important; cursor: text; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.2s; z-index: 2; border-radius: 8px; max-width: 100%; } .form-floating .hint { position: absolute; right: 20px; bottom: 12px; padding: 0; margin: 0; color: @tertiaryColor; } .form-floating textarea + label { background: transparent; width: calc(100% - 2px); } .form-floating .chosen-container .chosen-single { font-size: 16px; line-height: 22px; padding: 35px 20px 12px 20px; } .form-floating .chosen-container.chosen-disabled { opacity: 1 !important; } .form-floating .chosen-container.chosen-disabled .chosen-single { background: @formControlBg !important; border-color: @formControlBg !important; cursor: default !important; } .form-floating .form-control.no-label, .form-floating .form-control.no-label + .chosen-container .chosen-single { padding: 24px 30px 23px 20px !important; } .form-floating .chosen-container .chosen-results li { padding: 10px 20px !important; font-size: 14px !important; } .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .last-input > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label, .form-floating.floating-group .form-control:focus ~ label, .form-floating.floating-group .form-control:not(:placeholder-shown) ~ label { font-size: 14px; padding-top: 11px; padding-bottom: 5px; } .form-floating > .jscolor ~ label { padding-left: 40px; } .form-floating .form-control { background: @whiteColor; border: solid 1px @defaultColor; padding: 35px 20px 12px 20px; border-radius: 8px; font-size: 16px; line-height: 22px; color: @secondaryColor; outline: none !important; } .form-floating .datepicker.form-control { padding-right: 50px; background: url(../images/ic-calendar.svg) no-repeat center right 15px; } .form-control.datepicker { padding-right: 40px; background: url(../images/ic-calendar.svg) no-repeat center right 10px; } .form-floating .form-control[type="file"] { padding: 33px 20px 11px 20px; } label { color: #484A58; } body .select2-container .select2-selection--single { height: auto !important; border: solid 1px @defaultColor; border-radius: 8px; } .select2-container .select2-selection--single .select2-selection__rendered { padding: 31px 30px 8px 20px; font-size: 16px; line-height: 22px; color: @secondaryColor; width: 100%; display: flex; align-items: center; line-height: 30px; } select.no-label + .select2-container .select2-selection--single .select2-selection__rendered { padding: 20px 30px 19px 20px; } .select2-container .select2-selection--single .select2-selection__rendered .dd-selected-image { display: block; height: 30px; margin: 0; } .form-floating .select2-container--open.select2-container { z-index: 2; } .form-floating .select2-container--focus.select2-container--open .select2-selection--single { border-color: @primaryColor !important; } .form-floating .form-control.primary-color { font-weight: bold !important; color: @primaryDarkColor !important; } .form-floating.has-icon .form-control, .form-floating.has-action .form-control { padding-right: 48px; } .form-floating.has-icon.pr-100 .form-control, .form-floating.has-action.pr-100 .form-control { padding-right: 100px; } .form-floating.has-icon > .icon { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); z-index: 1; display: flex; align-items: center; gap: 10px; } .form-floating.has-icon > .right-content-risk:not(.hidden) + .icon { display: none; } .form-floating.has-icon > .right-content-CreditLimitApproved:not(.hidden) + .icon { display: none; } .form-floating .form-control:focus { box-shadow: none; border-color: @primaryColor; } .form-floating .form-control:disabled { background-color: @formControlBg; border-color: @formControlBg; cursor: default; } .modal-body .form-floating .form-control:disabled { border-color:; } .form-floating .form-control[readonly] { background-color: @formControlBg; border-color: @formControlBg; cursor: default; } .form-floating .action-btn { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); display: flex; } .form-floating .action-btn a:hover { opacity: 0.7; } .form-floating .action-btn a + a { margin-left: 10px; } .form-floating .action-btn a img { display: block; width: 21px; height: 21px; } .form-floating ::placeholder { color: transparent; opacity: 0; /* Firefox */ } .form-floating ::-ms-input-placeholder { /* Edge 12 -18 */ color: transparent; opacity: 0; } .custom-checkbox { position: relative; margin: 0 0 16px !important; color: @tertiaryColor; cursor: pointer; display: inline-block; } .custom-checkbox.mb-0 { margin-bottom: 0 !important; } .custom-checkbox.mb-10 { margin-bottom: 10px !important; } .custom-checkbox input { position: absolute; opacity: 0; } .custom-checkbox span { display: inline-block; padding: 2px 0 2px 32px; color: @tertiaryColor; min-height: 24px; } .custom-checkbox span:before { content: ""; position: absolute; left: 0; top: 0; width: 24px; height: 24px; border: solid 1px @tertiaryColor; border-radius: 8px; } .custom-checkbox input:checked ~ span:before { background: url(../images/ic-checkbox-check.svg) @primaryColor no-repeat center center; border-color: @primaryColor; } .custom-checkbox input:disabled ~ span { opacity: 0.5; cursor: not-allowed; } /* select 2 */ .dd-selected-image { width: 30px; height: 30px; object-fit: cover; margin-bottom: 0; /*border-radius: 30px;*/ } .select2-container--default .select2-selection--single .select2-selection__arrow { background: url(../images/ic-dropdown.svg) no-repeat center center; height: 14px; width: 14px; top: 50%; right: 7px; margin-top: -7px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { display: none; } .select2-dropdown { border-color: @defaultColor; border-radius: 8px; } .select2-search--dropdown { padding: 8px; } .select2-container--default .select2-search--dropdown .select2-search__field { border-radius: 4px; border-color: @defaultColor; font-size: 16px; line-height: 22px; outline: none; } .select2-results__option { display: flex; align-items: center; } .select2-container--default .select2-search--dropdown .select2-search__field:focus { border-color: @primaryColor; } .select2-results__option[aria-selected] { color: @secondaryColor !important; } body .select2-container--default .select2-results__option--highlighted[aria-selected] { background: @primaryColor !important; color: @secondaryColor !important; } .btn-dark .fa.fa-trash-o { background: url(../images/ic-delete-light.svg) no-repeat center center; } .red-btn { color: #FFFFFF !important; background: #D92D20 !important; border-color: #D92D20 !important; } .red-btn:focus, .red-btn:hover { background: #FFFFFF !important; border-color: #D92D20 !important; color: #D92D20 !important; } /* Multi Currency Info */ .mb-n10 { margin-bottom: -10px; } #multiCurrency-info #multiCurrency-lbltransfer { color: @secondaryColor; font-size: 14px; line-height: 20px; margin-bottom: 12px !important; } #multiCurrency-info p { border: solid 1px @defaultColor; border-radius: 8px; margin: 0 0 16px; padding: 12px 45px 12px 20px; position: relative; } #multiCurrency-info p.large { height: 158px; } #multiCurrency-info p label { font-size: 14px; line-height: 22px; color: @tertiaryColor; display: block; margin-bottom: 4px !important; } #multiCurrency-info p span { font-size: 14px; line-height: 19px; font-weight: 600; color: @secondaryColor; display: block; } #multiCurrency-info p .fa-xs.fa.fa-copy { position: absolute; right: 12px; top: 24px; height: 20px; width: 20px; background: url(../images/ic-copy.svg) no-repeat center center; } #multiCurrency-info p .fa-xs.fa.fa-copy:hover { opacity: 0.7; } #multiCurrency-info p .fa-xs.fa.fa-copy:before { content: none; } /* Icons */ .fa.fa-check.green, .fa.fa-check-circle.green { width: 18px; height: 18px; background: url(../images/ic-check.svg) no-repeat center center; background-size: 18px 18px; } .fa.fa-check.black { width: 18px; height: 18px; background: url(../images/ic-check-black.svg) no-repeat center center; background-size: 18px 18px; } .fa.fa-check.green:before, .fa.fa-check-circle.green:before, .fa.fa-check.black:before { content: none; } .fa.fa-times.red, .fa.fa-exclamation-triangle.red { width: 18px; height: 18px; background: url(../images/ic-not-authorized.svg) no-repeat center center !important; background-size: 18px 18px; } .fa.fa-trade-ticket { width: 18px; height: 18px; background: url(../images/ic-trade-ticket.svg) no-repeat center center; background-size: 18px 18px; } .fa.fa-times.red:before, .fa.fa-exclamation-triangle.red:before { content: none; } .glyphicon.glyphicon-eye-open { width: 18px; height: 18px; background: url(../images/ic-view.png) no-repeat center center; background-size: 18px 18px; } .glyphicon.glyphicon-eye-slash { width: 18px; height: 18px; background: url(../images/ic-eye-slash.png) no-repeat center center; background-size: 18px 18px; } .glyphicon.glyphicon-eye-open:before, .glyphicon.glyphicon-eye-slash:before { content: none; } .table .fa.fa-money { width: 22px; height: 22px; background: url(../images/ic-coin.svg) no-repeat center center; background-size: 22px 22px; } .table .fa.fa-money:before { content: none; } /* Footer -----------*/ .footer { display: flex; justify-content: space-between; align-items: center; padding: 0 20px 20px; } .footer p { margin: 0; padding: 0; font-size: 14px; line-height: 22px; color: @tertiaryColor; } /* Modal---------------- */ .modal-content { border-radius: 8px; box-shadow: none; } .modal-header { background: @whiteColor; border-radius: 8px 8px 0 0; border: 0; border-bottom: 1px solid #e5e5e5; } .modal-title { color: #000000; } .modal-header .close { color: #000000; text-shadow: none; opacity: 1; } .modal-footer { margin: 0; padding: 15px; } .switch { width: 40px !important; height: 24px !important; } .switch .slider { background-color: @secondaryColor !important; } .switch .slider:before { height: 20px; width: 20px; left: 2px; bottom: 2px; } .switch input:checked + .slider { background-color: @primaryColor !important; } .switch input:checked + .slider:before { transform: translateX(16px); } .expires-block { display: flex; align-items: center; margin-top: 35px; } .expires-block p { margin: 0; padding-right: 8px; } .expires-block .time { display: flex; align-items: center; padding-bottom: 5px; margin-right: 20px; position: relative; } .expires-block .time em { font-style: normal; padding: 0 5px; color: @primaryColor; font-size: 16px; } .expires-block .time .timeline { position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; border-radius: 2px; background: @defaultColor; } .expires-block .time .timeline .timeline-progress { height: 2px; border-radius: 2px; background: @primaryColor; width: 70%; } .mr-10 { margin-right: 10px !important; } .ml-10 { margin-left: 10px !important; } .mt-13 { margin-top: 13px !important; } .mt-24 { margin-top: 24px !important; } .filter-action-btns { display: flex; gap: 10px; } .form-action-btns { display: flex; gap: 10px; margin-bottom: 20px; } /* Alert */ .message { position: fixed; right: 20px; bottom: 10px; z-index: 1999; min-width: 300px; } .alert .close { margin-top: 0; margin-left: 10px; } .alert { padding: 16px 6px 16px 16px; border-radius: 4px; margin-bottom: 15px; max-width: 400px; display: flex; align-items: center; justify-content: center; } .alert .icon { width: 20px; height: 20px; display: block; margin-right: 16px; } .alert p { margin: 0 !important; padding: 0 15px 0 0 !important; flex-grow: 1; text-align: left; font-size: 14px; line-height: 20px; } .alert-danger { background: #F8D7DA; border: solid 1px #F5C6CB; color: #9D1C24; } .alert-info { background: #CCE5FF; border: solid 1px #B8DAFF; color: #004085; } .alert-success { background: #D4EDDA; border: solid 1px #C3E6CB; color: #155724; } .alert-notify { background: #CCE5FF; border: solid 1px #B8DAFF; color: #195594; } .alert-warning { background: #FFF3CD; border: solid 1px #FCE69F; color: #B87A04; } .alert .close { margin: 0 !important; opacity: 1; font-size: 0; line-height: 0; width: 20px; height: 20px; background: url(../images/ic-close-error-msg.svg) no-repeat center center; background-size: 10px 10px; border-radius: 20px; } .alert .close:hover { background-color: rgba(0,0,0,0.1); } /*legend ----------*/ .semi-circle-graph { display: block; margin: 0 auto 15px; } ul.legend { padding: 0px; list-style: none; margin: 0; color: @secondaryColor; } ul.legend li { display: flex; align-items: center; white-space: pre-wrap; } .legend li { float: left; margin-right: 10px; } ul.legend li span { width: 16px; height: 16px; margin-right: 10px; border-radius: 2px; } ul.legend li span.usedamountlegend { background-color: @primaryColor; } ul.legend li span.remainingamountlegend { background-color: #ffecb4; } .radio-inline input { position: absolute; opacity: 0; } .radio-inline label { position: relative; padding-left: 30px; } .radio-inline label:before { content: ""; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 20px; border: solid 1px #bbb; } .radio-inline input:checked + label:before { border-color: @primaryColor; } .radio-inline input:checked + label:after { content: ""; position: absolute; left: 5px; top: 5px; width: 10px; height: 10px; border-radius: 10px; background: @primaryColor; } /* SW toolbar */ .sw-toolbar-bottom { margin-bottom: 20px; } .sw-toolbar .sw-btn-group .btn + .btn, .sw-toolbar .sw-btn-group-extra { margin-left: 14px; } .mb-20 { margin-bottom: 20px !important; } .mt-20 { margin-top: 20px !important; } .table-panel .table a.chosen-single { color: @secondaryColor !important; margin: -12px 0 !important; } .file-type-tooltip { position: absolute; top: 25px; right: 10px; } /* Dropdown Menu */ .dropdown-menu { padding: 0; border: solid 1px #E1E1EA; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 8px rgba(0,0,0,0.06); } .dropdown-menu.min-w-250 { min-width: 250px; } .dropdown-menu.min-w-300 { min-width: 300px; } .dropdown-menu .dropdown-list.gen-list { margin: 0; padding: 0; } .dropdown-menu .dropdown-list.gen-list a { text-align: center; padding: 7px; } .dropdown-menu > li > a { font-size: 14px; line-height: 20px; padding: 10px; display: flex; gap: 10px; align-items: center; color: @secondaryColor; } .dropdown-menu > li > a:hover { background: #FFF7E3; } .align-items-center { display: flex; align-items: center; } .checkAlign { display: flex !important; } .justify-content-center { display: flex; justify-content: center; } .checkbox-col .custom-checkbox { margin-bottom: 0 !important; } .no-label-checkbox { height: 24px; width: 24px; margin-bottom: 0 !important; } @media (min-width: 1200px) { .mb-lg-0 { margin-bottom: 0 !important; } .mt-lg-24 { margin-top: 24px !important; } } @media (min-width: 768px) { .mb-sm-0 { margin-bottom: 0 !important; } } /* Download Listing *******************************************/ .download-listing { padding: 0; list-style: none; } .download-listing li { display: flex; align-items: center; border: solid 1px #E1E1EA; border-radius: 8px; padding: 20px; gap: 16px; } .download-listing li + li { margin-top: 16px; } .download-listing li .file-icon { width: 40px; height: 40px; min-width: 40px; min-height: 40px; display: block; } .download-listing li h5 { width: 50%; min-width: 50%; font-size: 18px; line-height: 25px; font-weight: 600; margin: 0; padding: 0; } .download-listing li h5 span { display: block; font-size: 14px; line-height: 20px; font-weight: normal; } .download-listing li .time { margin: 0; padding: 0; font-size: 14px; line-height: 20px; flex-grow: 1; } .download-listing li .time span { margin-left: 5px; } .download-listing li .action-btn-block { display: flex; align-items: center; gap: 4px; } .download-listing li .btn { padding: 8px; border-radius: 50px; background: none; box-shadow: none; } .download-listing li .btn:hover { background: rgba(0,0,0,0.05); } .download-listing li .btn svg { display: block; width: 24px; height: 24px; } html:not([data-theme="dark"]) { .mode-change .light-mode { display: none; } } .btn-loader { display: inline-block; width: 26px; aspect-ratio: 1; border-radius: 50%; border: 3px solid @secondaryColor; border-right-color: rgba(12, 12, 12, 0.03); animation: l2 1s infinite linear; } @keyframes l2 { to { transform: rotate(1turn) } } .primary-loader { width: 45px; aspect-ratio: 1; border-radius: 50%; border: 5px solid @primaryColor; border-right-color: rgba(12, 12, 12, 0.03); animation: l2 1s infinite linear; } /* Skeleton loader style */ .skeleton-table { display: grid; grid-template-columns: repeat(1, 1fr); /* 3 columns */ grid-template-rows: repeat(10, 45px); /* 3 rows */ grid-gap: 10px; width: 100%; margin: 0 auto; } /* Skeleton cells (using :nth-child to target them) */ .skeleton-table > div { background-color: #e0e0e0; border-radius: 4px; animation: skeleton-loading 1.5s infinite ease-in-out; height: 45px; /* Set fixed height for each cell */ } /* Skeleton loading animation */ @keyframes skeleton-loading { 0% { background-color: #e0e0e0; } 50% { background-color: #f0f0f0; } 100% { background-color: #e0e0e0; } } .datatable-processing-bg { min-height: 595px !important; overflow: hidden; } .datatable-processing-bg .dataTables_scrollBody { overflow: hidden !important; } .dataTables_processing { top: 50px; background: rgba(255, 255, 255, 1); } .dataTables_processing .text-center { align-items: flex-start; justify-content: flex-start; } .dashboardSkeletonLoader { background-color: #e0e0e0; border-radius: 8px; animation: skeleton-loading 1.5s infinite ease-in-out; height: 45px; /* Set fixed height for each cell */ } .color-square { display: inline-block; width: 14px; height: 14px; margin-right: 6px; vertical-align: middle; border-radius: 3px; margin-top: -3px; } .deal-balance-sec h3 { margin-top: 10px; font-weight: 500; font-size: 31px; } #barchart, #areachart { min-height: 250px; } #piechart { min-height: 293px; } .apexcharts-bar-area:hover { fill: #d59b03; } g.apexcharts-pie-series:nth-of-type(1) path.apexcharts-pie-area:hover { fill: #3f4154 !important; } g.apexcharts-pie-series:nth-of-type(2) path.apexcharts-pie-area:hover { fill: #d59b03 !important; } g.apexcharts-pie-series:nth-of-type(3) path.apexcharts-pie-area:hover { fill: #66BB6A !important; } .forgot-password { text-align: left; } .forgot-password a { color: @primaryColor !important; } .show-hide { position: absolute; top: calc(50% + -8px); right: 15px; } .error-text { color: #E1590C !important; } .error-border { border-color: #E1590C !important; } .error-msg-panel { text-align: center; min-height: calc(100vh - 190px); display: flex; flex-direction: column; align-items: center; justify-content: center; } .error-msg-panel h3 { margin: 0; padding: 0 0 15px; } .error-msg-icon { background: url(../images/error-img.svg) no-repeat center center; background-size: contain; height: 100px; width: 100px; margin-bottom: 20px } .error-msg-panel.guest { min-height: calc(100vh - 20px) !important; } .mr-5 { margin-right: 5px; } .p-0 { padding: 0 !important; } .p-15 { padding: 15px !important; } .section-title { display: flex; align-items: center; } .dashboard-section-p { padding: 14px !important; } .dashboard-border-right { border-right: 1px solid #eee; } .bb { border-bottom: 1px solid #eee !important; } .new-application-legend { background-color: #262835 !important; } .dashboard-content .chosen-container { width: 25% !important; } .dashboard-content .chosen-container .chosen-single { padding: 5px 34px 5px 15px; } @media screen and (max-width: 1400px) { .risk-image { display: none !important; } .p-risk-name { padding-right: 0px !important; } } @media screen and (max-width: 1199px) { .risk-image { display: flex !important; } .p-risk-name { padding-right: 100px !important; } } #accountBalanceBreakdownReport tbody tr[class]:not([class="tbodyrows- "]):not(.last-row) > td { border-bottom: none !important; } #accountBalanceBreakdownReport tfoot > tr:first-child > td { border-top: none !important; } #accountBalanceBreakdownReport tbody tr[class]:not([class="tbodyrows- "]) td { border-top: solid 1px rgba(38, 40, 53, 0.1) !important; /*border-bottom: none !important;*/ } #accountBalanceBreakdownReport tbody > tr:not([class="tbodyrows- "]) > td:nth-child(3) { border-left: 1px solid rgba(38, 40, 53, 0.1) !important; } #accountBalanceBreakdownReport tbody > tr:not([class="tbodyrows- "]) > td:last-child:not(.hidden) { border-right: 1px solid rgba(38, 40, 53, 0.1) !important; } #accountBalanceBreakdownReport tbody > tr:not([class="tbodyrows- "]):last-child td { border-bottom: 1px solid rgba(38, 40, 53, 0.1) !important; } #accountBalanceBreakdownReport tbody tr[class="tbodyrows- "] + tr > td:nth-child(3) { border-radius: 10px 0 0 0; } #accountBalanceBreakdownReport tbody tr[class="tbodyrows- "] + tr > td:last-child:not(.hidden) { border-radius: 0 10px 0 0; } #accountBalanceBreakdownReport tbody tr[class="tbodyrows- "] ~ tr.last-row > td:nth-child(3) { border-radius: 0 0 0 10px; } #accountBalanceBreakdownReport tbody tr[class="tbodyrows- "] ~ tr.last-row > td:last-child { border-radius: 0 0 10px 0; } #ClientLiability tbody:not(:last-child) tr td { border-bottom: 1px solid rgba(38, 40, 53, 0.1) !important; } #ClientLiability tr[class]:not([class=""]):not(.exclude-row) td { border-top: solid 1px rgba(38, 40, 53, 0.1) !important; border-bottom: none !important; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row) > td:first-child { border-left: 1px solid rgba(38, 40, 53, 0.1) !important; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row) > td:last-child { border-right: 1px solid rgba(38, 40, 53, 0.1) !important; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row):last-child td { border-bottom: 1px solid rgba(38, 40, 53, 0.1) !important; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row):first-child > td:first-child { border-radius: 10px 0 0 0; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row):first-child > td:last-child { border-radius: 0 10px 0 0; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row):last-child > td:first-child { border-radius: 0 0 0 10px; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row):last-child > td:last-child { border-radius: 0 0 10px 0; } /* Dark Mode CSS *******************************************/ html[data-theme="dark"] { .mode-change .dark-mode { display: none; } .logopanel h1 a img.dark-theme-logo { display: block; } .logopanel h1 a img.light-theme-logo { display: none; } .seeAll a { color: #FFFFFF !important; } .mainpanel { background: @color191B28; color: @whiteColor; } .headerbar-inner { background: @color191B28; color: @whiteColor; border-bottom-color: @secondaryColor; } .headerbar .btn { color: @whiteColor !important; } .headerbar svg path[stroke] { stroke: @whiteColor !important; } .headerbar svg path[fill] { fill: @whiteColor !important; } .headerbar .btn.btn-default:hover { background: @secondaryColor !important; } .dropdown-menu { background: @color1F212E; border-color: @color1F212E; box-shadow: 0 4px 8px rgba(244, 244, 244, 0.06); } .dropdown-menu > li > a { color: @whiteColor; } .dropdown-menu > li > a:hover { background: @secondaryColor; } .panel { background: @secondaryColor; border-color: @color1F212E; color: @whiteColor; } .form-control { background: none; color: @whiteColor; border-color: @color3B3D4A; } .form-control:focus { border-color: @primaryColor; } /*.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { opacity: 0.5; }*/ .chosen-container .chosen-single { border-color: @color3B3D4A !important; color: @whiteColor !important; background-image: url(../images/ic-dropdown-light.svg) !important; } .chosen-container.chosen-with-drop .chosen-drop { background: @secondaryColor; } .chosen-container.chosen-container-active .chosen-single { border-color: @primaryColor !important; } .chosen-container-single .chosen-search input[type="text"] { background-color: transparent !important; color: @whiteColor; } .chosen-container .chosen-results li.no-results { background-color: transparent; } .chosen-container-multi .chosen-choices li.search-choice { background-color: #20222F; color: #fff; } .form-control.datepicker { background: url(../images/ic-calendar-light.svg) no-repeat center right 10px; } .custom-checkbox span { color: @colorA8A9AE; } .radio-inline label { color: @colorA8A9AE !important; } .modal-header { border-bottom: 1px solid @color3B3D4A; } .modal-header, .modal-footer, .modal-body { background: transparent; } .modal-header .close, .modal-title { color: #FFFFFF; } .modal-footer { border-top: 1px solid @color3B3D4A; } .password-criteria-visible { background: @color1F212E !important; } .password-criteria-visible > span { color: @colorA8A9AE !important; } .ui-widget-content { background-color: #262835 !important; color: #fff !important; border-color: @color3B3D4A !important; } .btn.btn-default { color: #DDDDDD !important; } .btn.btn-default:hover { background: @color191B28 !important; } .table-panel .table tbody > tr:hover { background-color: @color20222F; } .table-panel .table thead > tr > th { background-color: @color20222F; color: #F7F7F7; } .table-panel .table tbody > tr > td { border-bottom-color: @color20222F; } .table-panel .table thead > tr > th.sorting { background-image: url(../images/ic-sort-normal-light.svg); } .table-panel .table thead > tr > th.sorting.sorting_asc { background-image: url(../images/ic-sort-acending-light.svg); } .table-panel .table thead > tr > th.sorting.sorting_desc { background-image: url(../images/ic-sort-decending-light.svg); } .table-responsive ::-webkit-scrollbar { height: 10px; transition: width 0.3s, height 0.3s; } .table-responsive ::-webkit-scrollbar-track { background: @color20222F; border-top: 3px solid #262835; border-bottom: 3px solid #262835; } .table-responsive ::-webkit-scrollbar-thumb { background: @color3B3D4A; border-top: 3px solid #262835; border-bottom: 3px solid #262835; } .table-responsive ::-webkit-scrollbar-thumb:hover { border-radius: 10px; border: 3px solid @color3B3D4A; transition: width 0.3s, height 0.3s; } .table-responsive ::-webkit-scrollbar-track:hover { border: 3px solid @color20222F; transition: width 0.3s, height 0.3s; } .tableScrollbar ::-webkit-scrollbar { height: 10px; transition: width 0.3s, height 0.3s; } .tableScrollbar ::-webkit-scrollbar-track { background: @color20222F; border-top: 3px solid #262835; border-bottom: 3px solid #262835; } .tableScrollbar ::-webkit-scrollbar-thumb { background: @color3B3D4A; border-top: 3px solid #262835; border-bottom: 3px solid #262835; } .tableScrollbar ::-webkit-scrollbar-thumb:hover { border-radius: 10px; border: 3px solid @color3B3D4A; transition: width 0.3s, height 0.3s; } .tableScrollbar ::-webkit-scrollbar-track:hover { border: 3px solid @color20222F; transition: width 0.3s, height 0.3s; } .dataTables_length label, .dataTables_info { color: @whiteColor; } .paging_full_numbers a.paginate_button, .paging_full_numbers a.current, .ellipsis { background-color: @secondaryColor; color: @whiteColor !important; } .paging_full_numbers a.current { color: @secondaryColor !important; font-weight: 600 !important; } .paging_full_numbers a.paginate_button:hover { background-color: @color20222F; } .dataTables_paginate .paginate_button.next { background-image: url(../images/ic-next-page-light.svg); } .dataTables_paginate .paginate_button.last { background-image: url(../images/ic-last-light.svg); } .dataTables_paginate .paginate_button.previous { background-image: url(../images/ic-back-page-light.svg); } .dataTables_paginate .paginate_button.first { background-image: url(../images/ic-first-light.svg); } .footer p { color: #ADADAD; } .dataTables_processing { background: @secondaryColor; } /* Skeleton cells (using :nth-child to target them) */ .skeleton-table > div { background-color: @color191B28; animation: skeleton-loading-dark 1.5s infinite ease-in-out; } .dashboardSkeletonLoader { background-color: @color191B28; animation: skeleton-loading-dark 1.5s infinite ease-in-out; } .popover { background: #191b28; } .red-btn { color: #262835 !important; background: #D92D20 !important; border-color: #D92D20 !important; } .red-btn:focus, .red-btn:hover { background: #262835 !important; border-color: #D92D20 !important; color: #D92D20 !important; } .popup-table th { background-color: @secondaryColor; color: @whiteColor; } .popover.right .arrow:after { border-right-color: #191b28; } .contentpanel .nav-tabs.secondary li a { color: @whiteColor; } .contentpanel .nav-tabs.secondary li a:hover { background: @color191B28; } .select2-container .select2-selection--single { background-color: transparent; border-color: @color3B3D4A; } .select2-container .select2-selection--single .select2-selection__rendered { color: @whiteColor; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: @color20222F; } .select2-container--default .select2-selection--single .select2-selection__arrow { background-image: url(../images/ic-dropdown-light.svg); } .select2-dropdown { background-color: @secondaryColor; border-color: @color3B3D4A; } .select2-results__option[aria-selected] { color: @whiteColor !important; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: @color191B28; } .form-floating .form-control:disabled { background: @color20222F; border-color: @color20222F; } .form-floating .chosen-container.chosen-disabled .chosen-single { background: @color20222F !important; border-color: @color20222F !important; } .form-control[readonly] { background: @color20222F !important; border-color: #20222F !important; } .contentpanel .nav-tabs li a { color: #f7f7f7; } .chosen-container-multi .chosen-choices { background: none; } .chosen-container-multi:not(.chosen-container-active) .chosen-choices { border-color: @color3B3D4A !important; } .input-validation-error.chosen-container .chosen-choices, .input-validation-error.chosen-container .chosen-single, .input-validation-error.chosen-container-multi:not(.chosen-container-active) .chosen-choices, .input-validation-error .chosen-container-multi:not(.chosen-container-active) .chosen-choices { border-color: #E1590C !important; } .select2-container--default .select2-search--dropdown .select2-search__field { background: none; color: @whiteColor; } .btn-default svg path[fill] { fill: @defaultColor; } .btn-default svg path[stroke] { stroke: @defaultColor; } .fa.fa-arrow { background: url(../images/arrow-right-white.svg) no-repeat center center; } .fa.fa-undo { background-image: url(../images/ic-retry-light.svg); } .fa.fa-download { background-image: url(../images/ic-download-light.svg); } .fa.fa-resend { background-image: url(../images/ic-resend-light.svg); } .fa.fa-registration-proceed { background-image: url(../images/ic-registration-proceed-light.svg); } .fa.fa-file { background-image: url(../images/ic-file-light.svg); } .fa.fa-check-square { background-image: url(../images/ic-check-square-light.svg); } .fa.fa-pencil { background-image: url(../images/ic-edit-light.svg); } .fa.fa-copy { background-image: url(../images/ic-copy-light.svg); } .fa.fa-profile { background: url(../images/ic-profile-light.svg) no-repeat center center !important; } .fa.fa-application { background: url(../images/Application-light.svg) no-repeat center center; } .fa.fa-deal { background: url(../images/Deal-light.svg) no-repeat center center; } .fa.fa-revenue { background: url(../images/Revenue-light.svg) no-repeat center center; } .fa.fa-turnover { background: url(../images/Turnover-light.svg) no-repeat center center; } .fa.fa-balance { background: url(../images/TotalBalance-light.svg) no-repeat center center; } .fa.fa-logout { background: url(../images/ic-logout-light.svg) no-repeat center center !important; } .fa.fa-add { background: url(../images/ic-add-light.svg) no-repeat center center !important; } .fa.fa-minus { background: url(../images/ic-minus-light.svg) no-repeat center center !important; } .fa.fa-check.black { background: url(../images/ic-check-black-light.svg) no-repeat center center; background-size: 18px 18px; } .fa-back-page { background: url(../images/ic-back-page-light.svg) no-repeat center center !important; background-size: contain !important; } .fa.fa-download-small { background: url(../images/ic-download-small-light.svg) no-repeat center center !important; } .fa.fa-download-big { background: url(../images/ic-download-big-light.svg) no-repeat center center !important; } .fa-user { background: url(../images/ic-user-light.svg) no-repeat center center !important; } .fa-notification { background: url(../images/ic-notification-light.svg) no-repeat center center !important; } .fa-swap { background: url(../images/Swap-Dark-Mode.svg) no-repeat center center !important; background-size: contain !important; } .fa.fa-lock { background-image: url(../images/ic-lock-light.svg); } .fa.fa-unlock { background-image: url(../images/ic-unlock-light.svg); } .fa.fa-upload { background-image: url(../images/ic-upload-light.svg); } .fa.fa-trash-o { background-image: url(../images/ic-delete-light.svg); } .fa.fa-floppy-o { background-image: url(../images/ic-save-light.svg); } .fa.fa-times { background-image: url(../images/ic-close-light.svg); } .fa.fa-envelope { background-image: url(../images/ic-email-light.svg); } .fa.fa-ticket { background-image: url(../images/ic-manage-booking-light.svg); } .fa.fa-links { background-image: url(../images/ic-link-light.svg); } .fa.fa-animation { background: url(../images/Animation-light.svg) no-repeat center center; } .glyphicon.glyphicon-eye-open { background-image: url(../images/ic-view-light.svg) !important; } .glyphicon.glyphicon-eye-slash { background-image: url(../images/ic-eye-slash-light.svg); } .btn-swap:hover .fa-swap { background: url(../images/Swap-Dark-Mode.svg) no-repeat center center !important; background-size: contain !important; } #swapCurrency .disable .fa-swap { background: url(../images/Swap-Dark-Mode.svg) no-repeat center center !important; background-size: contain !important; } .bootstrap-datetimepicker-widget table thead tr:first-child th:hover, .bootstrap-datetimepicker-widget table td.day:hover, .bootstrap-datetimepicker-widget table td.hour:hover, .bootstrap-datetimepicker-widget table td.minute:hover, .bootstrap-datetimepicker-widget table td.second:hover, .bootstrap-datetimepicker-widget table td span:hover { background: @secondaryColor !important; } .panel-heading, .panel-footer { background: none; border-color: @color3B3D4A; } .signinpanel-content { background: @color1F212E; color: @whiteColor; } .signup-footer { box-shadow: none; } .signinpanel .signup-content .signup-content-links a:not(:hover), .signup-footer p { color: @whiteColor; } .signup-footer span { color: #ADADAD; } .table-panel .table tfoot > tr > td { border-bottom: 1px solid #20222F; } .table tbody > tr > th { border-color: #20222F; } .chart-div { background: #20222F !important; } hr { border-top: 1px solid #3B3D4A; } .modal-content { background: @secondaryColor; } label { color: @colorA8A9AE; } .form-floating label { color: @colorA8A9AE } .form-floating.has-action svg.icon path[fill], .headerbar .header-left .back-link svg path[fill] { fill: @defaultColor; } .form-floating.has-action svg.icon path[stroke], .headerbar .header-left .back-link svg path[stroke] { stroke: @defaultColor; } .contentpanel .tab-content .nav-tabs li.active a, #account-detail-tab.nav-tabs li.active a { color: @defaultColor !important; border-bottom-color: @defaultColor !important; } ul.legend { color: @defaultColor; } g.apexcharts-pie-series:nth-of-type(1) path.apexcharts-pie-area:hover { fill: #e3e3e3 !important; } .btn.btn-dark { background: @whiteColor !important; border-color: @whiteColor !important; color: @color191B28 !important; } /* .btn.btn-dark:not(:hover) { background: @color191B28 !important; }*/ .iban-correct, .ifsc-correct { background: url(../images/ic-yes.svg) no-repeat transparent right center !important } .exclude-row { background-color: @color1F212E !important; } span.desc { color: @whiteColor; } .dropdown-list li, .dropdown-menu-head .title { border-bottom-color: @secondaryColor; } .download-listing li { border-color: @color3B3D4A; } .download-listing li .btn:hover { background: rgba(255, 255, 255, 0.05); } .download-listing li .btn svg path[fill] { fill: @defaultColor; } .download-listing li .btn svg path[stroke] { stroke: @defaultColor; } .gen-list li a:hover { color: @primaryColor !important; text-decoration: underline; } .select2-container--default .select2-search--dropdown .select2-search__field { border-color: @color3B3D4A !important; } .error-msg-icon { background: url(../images/error-img-light.svg) no-repeat center center; background-size: contain; } .link-for-download { color: #FFFFFF !important; } .link-for-download:hover { color: @primaryColor !important; } .stickyheader .leftpanel .menutoggle.menutoggle { background: @secondaryColor; border: solid 1px @whiteColor; } .stickyheader .leftpanel .menutoggle:before { border-left: solid 1px @whiteColor; border-bottom: solid 1px @whiteColor; } body .bootstrap-datetimepicker-widget table td.active, body .bootstrap-datetimepicker-widget table td.active:hover, body .bootstrap-datetimepicker-widget table td span.active, body .chosen-container .chosen-results li.highlighted, body .select2-results__option--highlighted[aria-selected], .ui-state-active { background-color: @primaryColor !important; color: @secondaryColor !important; } .contentpanel .tab-content .nav-tabs li a, body #account-detail-tab.nav-tabs li a { color: @colorA8A9AE !important; } .add-later-block { background-color: @secondaryColor; } .partialPreloader .btn-loader { border-color: @colore4e4e4; border-right-color: rgba(12, 12, 12, 0.03); } .partialPreloaderForClient .btn-loader { border-color: @colore4e4e4; border-right-color: rgba(12, 12, 12, 0.03); } .loader-dark { border-color: @colore4e4e4 !important; border-right-color: rgba(12, 12, 12, 0.03) !important; } .form-floating .hint { color: @colorA8A9AE; } .tooltip-box .icon { background: #B0B1B7; } .popover { color: @colorA8A9AE; } .modal-body #AddressPopup { background: #191B28 !important; } .fa.fa-trade-ticket { background: url(../images/ic-trade-ticket-light.svg) no-repeat center center; } .ip-address { color: @colore4e4e4; } .ip-address-head { color: @colore4e4e4; } .edit-details-block ul li p i { color: #929396; } body .panel .panel-heading h4 { color: @whiteColor; } .switch .slider { background-color: @whiteColor !important; } .slider:before { background-color: @color20222F !important; } .switch input:checked + .slider { background-color: @primaryColor !important; } .highlightDates { background-color: @colorebcb9f; } .bb { border-bottom: 1px solid #3B3D4A !important; } .dashboard-border-right { border-right: 1px solid #3B3D4A; } .new-application-legend { background-color: #ffffff !important; } #ClientLiability tbody:not(:last-child) tr td { border-bottom: 1px solid @color3B3D4A !important; } #ClientLiability tr[class]:not([class=""]):not(.exclude-row) td { border-top: 1px solid @color3B3D4A !important; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row) > td:first-child { border-left: 1px solid @color3B3D4A !important; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row) > td:last-child { border-right: 1px solid @color3B3D4A !important; } #ClientLiability tbody > tr[class]:not([class=""]):not(.exclude-row):last-child td { border-bottom: 1px solid @color3B3D4A !important; } #accountBalanceBreakdownReport tbody:not(:last-child) tr td { border-bottom: 1px solid @color3B3D4A !important; } #accountBalanceBreakdownReport tr[class]:not([class="tbodyrows- "]) td { border-top: 1px solid @color3B3D4A !important; } #accountBalanceBreakdownReport tbody > tr:not([class="tbodyrows- "]) > td:last-child:not(.hidden) { border-right: 1px solid @color3B3D4A !important; } #accountBalanceBreakdownReport tbody > tr:not([class="tbodyrows- "]):last-child td { border-bottom: 1px solid @color3B3D4A !important; } #accountBalanceBreakdownReport tbody > tr:not([class="tbodyrows- "]) > td:nth-child(3) { border-left: 1px solid @color3B3D4A !important; } #accountBalanceBreakdownReport table > tfoot td { border-color: @color3B3D4A !important; } } /* Skeleton loading animation */ @keyframes skeleton-loading-dark { 0% { background-color: @color191B28; } 50% { background-color: @color20222F; } 100% { background-color: @color191B28; } } .chosen-drop { display: none; } .chosen-container.chosen-with-drop .chosen-single.border-bottom-8 { border-bottom-left-radius: 8px !important; border-bottom-right-radius: 8px !important; } .chosen-container.chosen-with-drop .chosen-drop { display: block; } .leftpanelinner { background: #262835; } input[type="radio"], input[type="checkbox"] { margin-top: 10px; } a { cursor: pointer; } .address-text-control { width: 50% !important; display: inline-block; height: 35px !important; border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; } .address-button-control { width: 50% !important; display: inline-block; height: 35px !important; border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; margin-top: -2px; } .address-select { margin-top: 15px; } .headermenu li:first-child .dropdown-menu { margin-right: -35px; } .overlap-file { position: relative; top: -30px; left: 91px; background-color: @whiteColor; width: 100%; max-width: 220px; margin-left: 0px; overflow: hidden; text-overflow: ellipsis; } .ellipsis { border: 1px solid #ddd; padding: 6px 12px; margin-right: 5px; cursor: pointer; color: #636E7B; line-height: 21px; float: left; position: relative; background: @whiteColor; display: inline-block; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .this-visible { display: block; } .this-hide { display: none; } .masterfeesGoGo input[type="radio"] { margin-top: 4px; } .actions-add-remove .fa-trash-o { margin-top: 10px; float: right; } .top-section-transferfees #btnAdd i { color: @whiteColor; } .top-section-transferfees #btnAdd { float: right; } .modal#PaymentOptions .modal-footer { margin-top: 0px; } .modal#PaymentOptions .modal-body { padding-bottom: 0px; } .modal#PaymentOptions .modal-body span { font-weight: 600; } .blue { color: #0094ff; } .green { color: #2ECC71; } .red { color: #ff6f6f; } .modal#PaymentOptions .modal-body hr { margin-top: 0px; margin-bottom: 20px; } @media (min-width: 242px) { .overlap-file { max-width: 90px; } } @media (max-width: 396px) { .overlap-file { max-width: 200px; } } /* Pointer cursor for ascending and descending */ .sorting_asc, .sorting_desc, .sorting { cursor: pointer; } /* Datatable loading div */ .headermenu .tp-icon + .dropdown-menu:after { right: 50px !important; } /*Notification popup*/ .dropdown-list .desc { margin-left: 0px !important; } .notify-badge { background-color: #FFB900 !important; color: #1d2939; } .msg { display: block; /* Fallback for non-webkit */ display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box !important; overflow: hidden; text-overflow: ellipsis; } .notification-data { margin-top: 15px; } .notification-data h5 { font-size: 16px; line-height: 24px; font-weight: 400; text-transform: uppercase; padding-bottom: 2px; line-height: 24px; text-transform: capitalize; } .notification-data p { font-size: 16px; line-height: 24px; font-weight: 400; margin-bottom: 15px; line-height: 24px; border-bottom: 1px dashed #6a6565; padding-bottom: 3px; } .notification-data .pagination .active a { color: @whiteColor !important; } .notification-data .pagination a { color: #636e7b !important; } .notification-time { display: flex; justify-content: end; font-size: 11px; color: #999; } .notification-link { display: flex; /*justify-content: space-between;*/ } .notification-link span { margin-top: -2px; } input[type="checkbox"].chk-action { margin: 0px; vertical-align: middle; } .va-m { vertical-align: middle; } /*Manage Customers*/ /*.red { color: red !important; } .green { color: green !important; }*/ .form-panel textarea { width: 100% !important; } #TradeStatusModal .modal-dialog { width: 70%; } .light-orange { background: #ffecb4 !important; } /*CustomerSummary*/ #CustomerSummary input[type="checkbox"] { margin-top: 0px; } #CustomerSummary .popover { max-width: 130%; } #CustomerSummary .popovers { cursor: pointer; } #gridTableRefunded .popover { max-width: 130%; } #gridTableRefunded .popovers { cursor: pointer; color: @orangeColor; } #gridTableCancelled .popover { max-width: 130%; } #gridTableCancelled .popovers { cursor: pointer; color: @orangeColor; } #gridTableSetteled .popover { max-width: 130%; } #gridTableSetteled .popovers { cursor: pointer; color: @orangeColor; } #gridTableUnSetteled .popover { max-width: 130%; } #gridTableUnSetteled .popovers { cursor: pointer; color: @orangeColor; } #CustomerSummary .text-center { text-align: center; } .header-color { color: @orangeColor; } /*Customer Beneficiary*/ #ManageCustomerBeneficiary input[type="radio"] { margin-top: 3px; } #ManageCustomerBeneficiary .left-align { text-align: left !important; } .table-condensed thead > tr > th { color: #636e7b; } .back-link { float: right; margin: 0 10px 10px 0; } .table-panel .glyphicon { color: #333; } .tab-content-BoxShadow { -moz-box-shadow: 0 6px 10px rgba(0,0,0,0.12); -webkit-box-shadow: 0 6px 10px rgba(0,0,0,0.12); box-shadow: 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12), 0 3px 5px -1px rgba(0,0,0,0.3); } .box-none { box-shadow: none; } .padding-left-right-bottom-zero { padding-left: 0px; padding-right: 0px; padding-bottom: 0px; } .panel-margin-zero { margin-bottom: 0px; } h4 { font-size: 20px; } span.account-name { color: @orangeColor; } /*Popover Styles*/ .popup-table th { background-color: #f7f7f7; /*color:#414141;*/ font-weight: initial !important; font-family: 'Equals', 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, sans-serif !important; } .popup-table { border-bottom: 1px solid #ebebeb; } .popup-table th { vertical-align: middle !important; } .popup-table td label { margin-bottom: 0px !important; } .spinicon { position: absolute; top: 50%; } /*.popover { min-width: 350px !important; min-height: 150px !important; }*/ /*Rate Alert Model*/ .rate-alert-text { font-weight: bold; color: @orangeColor; } .text-capitalize { text-transform: capitalize; } /*give link color where popovers are shown*/ .popovers { color: @orangeColor; } #PepSanctionCheckModal .modal-body { min-height: 0px; max-height: 500px; overflow: auto; } .pageheader h2 { float: left; } #PepSanctionCheckModal .modal-content { width: 900px; } #TradeBeneficiaryModel .modal-dialog { width: 75%; } #BankStatementDetailModel .modal-dialog { width: 70%; } #InwardFundsModel .modal-dialog { width: 70%; } #CPTradeDetailsModal .modal-dialog { width: 70%; } /* Custom Green Button */ .btn-green { background: #1CAF9A; color: @whiteColor; border-color: #1CAF9A; } .btn-green:hover, .btn-green:active, .btn-green:focus { background: #14a28e; color: @whiteColor; border-color: #1CAF9A; } .tooltip-inner { max-width: none; } .fa { font-size: 18px; } .fa-spin { font-size: 50px; } .btn .fa-spin { font-size: 18px; } .margin-icon { margin-right: 10px; } .glyphicon-eye-open { font-size: 15px; } .glyphicon-check { font-size: 17px; } /*#InwardFundsModel .modal-body { padding-top: 0px; }*/ .highlightDates { background-color: #ffeed6; } .btn-primary i { display: inline-block; width: 13px; height: 13px; margin: 0 5px; } .iban-loading, .ifsc-loading, .rate-loading { background: url(../../images/loader1.gif) no-repeat @whiteColor right center; background-position-x: 98.00%; } .iban-correct, .ifsc-correct { background: url(../../images/ic-yes.svg) no-repeat @whiteColor right center !important; background-position-x: 97.00% !important; } .popover { color: #636e7b; } .bold-text { font-weight: bold; } .group-user-chk { margin-top: 3px !important; } /*Customer summary*/ /*.text-green { color: green !important; }*/ .margin-top-12 { margin-top: 12px !important; } .padding-right-zero { padding-right: 0px !important; } .padding-top-zero { padding-top: 0px !important; } .margin-left-6 { margin-left: 6px !important; } .margin-left-1 { margin-left: 1px; } .font-16 { font-size: 16px; } .padding-top-14 { padding-top: 14%; } .currency-image { vertical-align: middle; margin-left: 5px; max-width: 23px; margin-bottom: 2px; } .min-wifth-100 { min-width: 100px; } .iban-bank-name { margin-bottom: 0px !important; margin-top: 6.5px; padding-left: 10px; } .padding-top-0 { padding-top: 0px !important; } .margin-bottom-0 { margin-bottom: 0px !important; } .trade-summary-title { font-size: 18px; } .trade-summary-title:focus { background-color: inherit !important; } /*css form select2 image dropdown*/ .select2-container { width: 120px !important; } /* #BeneficiaryDropdown .select2-container { width:350px!important }*/ #BeneficiaryDropdown .select2-container--default .select2-selection--single .select2-selection__rendered { line-height:32px!important } .select2-container--default .select2-selection--single .select2-selection__arrow b { margin-top: 0px !important; } .card.send-money-card ul li span { padding-top: 1px !important; } .select2-container .select2-selection--single { height: 46px !important; display: flex; justify-content: space-between; align-items: center; } @keyframes red-highlight { 0% { color: white; background-color: red; } 80% { color: white; background-color: red; } } #lblExchangeRateDisplay.red-highlight { /*animation: red-highlight 5s;*/ color: @moltenRedText; } @keyframes green-highlight { 0% { color: white; background-color: #4fa951; } 80% { color: white; background-color: #4fa951; } } #lblExchangeRateDisplay.green-highlight { /*animation: green-highlight 5s;*/ color: @greenText; } span#lblExchangeRateDisplay.forex-lbl.red-highlight, span#lblExchangeRateDisplay.forex-lbl.green-highlight { margin-left: 8px !important; } .dd-selected-image { width: 30px !important; margin-right: 5px !important; float: none !important; margin-bottom: 1.5px; } .margin-top-20 { margin-top: 20px; } .dataTable::before { display: none; } .upDownArrow { width: 12px; height: 10px; display: none; margin-top: -2.4px; } .up-down-arrow-spot-forward { display: none; } .card.send-money-card .select2-container--default .select2-selection--single .select2-selection__arrow b { margin-left: 38px !important; } .card.send-money-card .steps-content .card.send-money-card ul li span.select2-selection.select2-selection--single { padding-top: 0px !important; } .card.send-money-card .card.send-money-card ul li span.select2-selection__arrow { padding-top: 0px !important; } .col-border-right.steps-content { width: 50% !important; display: block !important; } .padding-top-7 { padding-top: 7.3px; } /*i icon hover message css from front*/ .tooltip-box { position: relative; display: inline-block; vertical-align: top; } .tooltip-box .icon { width: 20px; height: 20px; display: block; border-radius: 50%; color: @whiteColor; background: @blackColor; font-style: normal; text-align: center; line-height: 20px; font-size: 11px; font-weight: 700; cursor: pointer; } .tooltip-box .tooltip-description { display: none; position: absolute; width: 200px; height: auto; top: 130%; background: rgba(36,36,36,0.9); right: -10px; z-index: 999; padding: 15px; border-radius: 6px; color: @whiteColor; font-size: 14px; } .tooltip-description::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 0 5px 5px 5px; border-color: transparent transparent rgba(36,36,36,0.9) transparent; position: absolute; bottom: 100%; right: 15px; } .tooltip-box .icon:hover + .tooltip-description { display: block; } em.tooltip-box { line-height: 21px !important; padding-top: 1.2px; padding-left: 2px; } .tooltip-box .icon { width: 16px; height: 16px; line-height: 15px; font-size: 10px; } .tooltip-box .tooltip-description { font-style: normal; } /*i icon hover message css from front*/ .margin-right-0 { margin-right: 0px !important; } .margin-top-7 { margin-top: 7px; } .select2-container--default .select2-results__option[aria-disabled=true] { background-color: #ececec; } .triangle-div.active:after { content: ''; position: absolute; top: 100%; left: 50%; margin-left: -18px; width: 0; height: 0; border-top: solid 7px @orangeColor !important; border-left: solid 15px transparent; border-right: solid 15px transparent; background-color: white; } /* #AddBeneficiaryModal .modal-dialog { width: auto !important; max-width: 742px !important; }*/ .add-beneficiary-panel { width: 100% !important; max-width: 830px !important; } #AddBeneficiaryModal .form-horizontal .form-group, .add-beneficiary-panel .form-group { margin-left: 0px !important; margin-right: 0px !important; } /* .add-beneficiary-panel .form-control { display:inline-block; width: 95%; } */ .add-beneficiary-panel .chosen-container { width: 95% !important; } #AddBeneficiaryModal #FullName + .tooltip-box { margin-top: -26px !important; } #AddBeneficiaryModal #CompanyName + .tooltip-box { margin-top: -26px !important; } .orange-color { color: @orangeColor; } .orange-bg-color { background: @orangeColor; } /* Override Colors */ .bootstrap-datetimepicker-widget table td.today:before { border-bottom-color: @orangeColor !important; } .bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active:hover, .bootstrap-datetimepicker-widget table td span.active, .chosen-container .chosen-results li.highlighted { background-color: @orangeColor !important; color: @whiteColor !important; } a { color: @orangeColor; } .seeAll a { color: @secondaryColor !important; } .seeAll i { position: absolute; margin-left: 10px; margin-top: 2px; } .btn-primary { color: @whiteColor !important; background-color: @orangeColor !important; border-color: @orangeColor !important; } .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { color: @whiteColor !important; background-color: @orangeColor !important; } .paginate_enabled_previous, .paginate_enabled_next { color: @whiteColor !important; background: @orangeColor !important; border: 1px solid @orangeColor !important; } .paging_full_numbers a.current { background-color: @orangeColor !important; border-color: @orangeColor !important; color: @secondaryColor !important; font-weight: 600; } .filled-strength-bar-3 { background-color: @orangeColor !important; } /*#strength-descriptor { color: @blackColor !important; } */ #UserMobile { color: @darkOrangeColor !important; } .dark-orange-color { color: @darkOrangeColor; } /* .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary { color:@whiteColor !important; background-color:@darkOrangeColor !important; border-color:@darkOrangeColor !important; }*/ .paginate_enabled_previous:hover, .paginate_enabled_next:hover { color: @whiteColor !important; background: @darkOrangeColor !important; border-color: @darkOrangeColor !important; } /* Override Colors */ /*override choosen select functionality*/ /*.chosen-container-multi .chosen-choices li.search-field { width: 100% !important; } .chosen-container-multi .chosen-choices li.search-field input[type="text"] { width: 100% !important; }*/ /*override choosen select functionality*/ .orange-text { color: #FFB900 !important; } /*==================================================*/ .switch { position: relative; display: inline-block; width: 35px; height: 20px; margin-left: 10px; margin-top: 5px; } .switch input { opacity: 0; width: 0; height: 0; } .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 12px; width: 12px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; } input:checked + .slider { background-color: #2196F3; } input:focus + .slider { box-shadow: 0 0 1px #2196F3; } input:checked + .slider:before { -webkit-transform: translateX(17px); -ms-transform: translateX(17px); transform: translateX(17px); } /* Rounded sliders */ .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; } @media (min-width:768px) { .modal-dialog.kyc-doc { width: 850px; } } @media (min-width:768px) { .modal-dialog.forward-points{ width: 975px; } } @media (max-width:767px) { #AddBeneficiaryModal .col-sm-5, #AddBeneficiaryModal .col-sm-4 { padding-right: 72px; } #AddBeneficiaryModal .optional-block { padding-left: 10px !important; margin-top: 10px !important; } #AddBeneficiaryModal #isdDDL ~ #MobileNo { width: 80% !important; } .add-beneficiary-panel .optional-block { padding-left: 10px !important; margin-top: 10px !important; } .add-beneficiary-panel #isdDDL ~ #MobileNo { width: 76.3% !important; } }