/* Template Name: Simulor - Responsive Bootstrap 4 Admin Dashboard Author: CoderThemes Version: 2.0.0 Website: https://coderthemes.com/ Contact: support@coderthemes.com File: Main Css File */ @import url("https://fonts.googleapis.com/css?family=Rubik:300,400,500,700&display=swap"); html { position: relative; min-height: 100%; } body { padding-bottom: 60px; overflow-x: hidden; } .logo { display: block; line-height: 70px; } .logo span.logo-lg { display: block; } .logo span.logo-sm { display: none; } .logo-box { height: 70px; float: left; padding-right: 40px; } .navbar-custom { position: fixed; left: 0; right: 0; height: 70px; z-index: 100; padding: 0 12px; /* Search */ } .navbar-custom .topnav-menu > li { float: left; } .navbar-custom .topnav-menu .nav-link { padding: 0 15px; color: rgba(255, 255, 255, 0.8); min-width: 32px; display: block; line-height: 70px; text-align: center; max-height: 70px; } .navbar-custom .app-search { padding: 16px 0; overflow: hidden; } .navbar-custom .app-search form { max-width: 320px; } .navbar-custom .app-search .form-control { border: none; height: 38px; padding-left: 20px; padding-right: 20px; color: #fff; background-color: rgba(255, 255, 255, 0.05); -webkit-box-shadow: none; box-shadow: none; } .navbar-custom .button-menu-mobile { border: none; color: #fff; display: block; height: 70px; line-height: 70px; width: 60px; background-color: transparent; font-size: 24px; cursor: pointer; } .navbar-custom .button-menu-mobile.disable-btn { display: none; } @media (max-width: 767.98px) { body { padding-bottom: 80px; } .pro-user-name { display: none; } .navbar-custom { padding: 0 0 0 12px; } .logo-box { padding-right: 0px; } .logo-box .logo-lg { display: none !important; } .logo-box .logo-sm { display: block !important; } } /* Notification */ .noti-scroll { max-height: 230px; } .notification-list { margin-left: 0; } .notification-list .noti-title { background-color: #fff; padding: 15px 20px; } .notification-list .noti-icon { font-size: 21px; vertical-align: middle; } .notification-list .noti-icon-badge { display: inline-block; position: absolute; top: 14px; right: 12px; } .notification-list .notify-item { padding: 12px 20px; } .notification-list .notify-item .notify-icon { float: left; height: 36px; width: 36px; font-size: 16px; line-height: 36px; text-align: center; margin-right: 10px; border-radius: 50%; color: #fff; } .notification-list .notify-item .notify-details { margin-bottom: 5px; overflow: hidden; margin-left: 45px; text-overflow: ellipsis; white-space: nowrap; color: #414d5f; } .notification-list .notify-item .notify-details b { font-weight: 500; } .notification-list .notify-item .notify-details small { display: block; } .notification-list .notify-item .notify-details span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; } .notification-list .notify-item .user-msg { margin-left: 45px; white-space: normal; line-height: 16px; } .notification-list .profile-dropdown .notify-item { padding: 0.45rem 1.2rem; } .profile-dropdown { width: 170px; } .profile-dropdown i { vertical-align: middle; margin-right: 5px; } .nav-user { padding: 0 12px !important; } .nav-user img { height: 32px; width: 32px; } .topbar-light .navbar-custom { background-color: #ffffff; -webkit-box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); /* Search */ } .topbar-light .navbar-custom .topnav-menu .nav-link { color: #6c757d; } .topbar-light .navbar-custom .app-search .form-control { background-color: rgba(50, 58, 70, 0.05); color: #98a6ad; } .topbar-dark .navbar-custom { background-color: #494f5d; } @media (min-width: 1200px) { .container-fluid { max-width: 90%; } } .wrapper { padding: 130px 12px 0 12px; } #topnav { background: #494f5d; position: fixed; left: 0; right: 0; z-index: 1001; padding: 0 12px; } #topnav .arrow-down { display: inline-block; } #topnav .arrow-down:after { border-color: initial; border-style: solid; border-width: 0 0 1px 1px; content: ""; height: .4em; display: inline-block; right: 5px; top: 50%; margin-left: 5px; -webkit-transform: rotate(-45deg) translateY(-50%); transform: rotate(-45deg) translateY(-50%); -webkit-transform-origin: top; transform-origin: top; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; width: .4em; } #topnav .navbar-toggle { border: 0; position: relative; padding: 0; margin: 0; cursor: pointer; } #topnav .navbar-toggle .lines { width: 25px; display: block; position: relative; margin: 15px 20px 0 20px; padding-top: 13px; height: 44px; -webkit-transition: all .5s ease; transition: all .5s ease; } #topnav .navbar-toggle span { height: 2px; width: 100%; background-color: #adb5bd; display: block; margin-bottom: 5px; transition: -webkit-transform .5s ease; -webkit-transition: -webkit-transform .5s ease; transition: transform .5s ease; transition: transform .5s ease, -webkit-transform .5s ease; } #topnav .navbar-toggle.open span { position: absolute; } #topnav .navbar-toggle.open span:first-child { top: 18px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } #topnav .navbar-toggle.open span:nth-child(2) { visibility: hidden; } #topnav .navbar-toggle.open span:last-child { width: 100%; top: 18px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } #topnav .has-submenu.active > a { color: #fff; } #topnav .has-submenu.active .submenu li.active > a { color: #007bff; } #topnav .topbar-menu { margin-top: 70px; } .navigation-menu { list-style: none; margin: 0; padding: 0; } .navigation-menu > li { float: left; position: relative; } .navigation-menu > li > a { display: block; color: rgba(255, 255, 255, 0.7); font-size: 15px; font-family: "Rubik", sans-serif; -webkit-transition: all .5s ease; transition: all .5s ease; line-height: 20px; padding: 20px; position: relative; } .navigation-menu > li > a i { font-size: 15px; margin-right: 8px; } .navigation-menu > li > a:hover, .navigation-menu > li > a:focus { background-color: transparent; } /* Responsive Menu */ @media (min-width: 992px) { .navigation-menu > li > a:hover, .navigation-menu > li > a:focus, .navigation-menu > li > a:active { color: #fff; } .navigation-menu > li:hover a { color: #fff; } .navigation-menu > li:first-of-type > a { padding-left: 0; } .navigation-menu > li.last-elements .submenu { left: auto; right: 0; } .navigation-menu > li.last-elements .submenu > li.has-submenu .submenu { left: auto; right: 100%; margin-left: 0; margin-right: 10px; } .navigation-menu > li > ul > li.has-submenu:active > a, .navigation-menu > li > ul > li.has-submenu:hover > a { color: #007bff; } .navigation-menu > li .submenu { position: absolute; top: 100%; left: 0; z-index: 1000; padding: 10px 0; list-style: none; min-width: 200px; text-align: left; visibility: hidden; opacity: 0; margin-top: 10px; border-radius: 4px; -webkit-transition: all .2s ease; transition: all .2s ease; background-color: #fff; border: 2px solid #f1f5f7; -webkit-box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); } .navigation-menu > li .submenu:before { left: 16px; top: -10px; content: ""; display: block; position: absolute; background-color: transparent; border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #fff; z-index: 9999; } .navigation-menu > li .submenu li { position: relative; } .navigation-menu > li .submenu li ul { list-style: none; padding-left: 0; margin: 0; } .navigation-menu > li .submenu li a { display: block; padding: 9px 25px; clear: both; white-space: nowrap; color: #323a46; } .navigation-menu > li .submenu li a:hover { color: #007bff; } .navigation-menu > li .submenu li.has-submenu > a .arrow-down:after { right: 20px !important; -webkit-transform: rotate(-135deg) translateY(-50%) !important; transform: rotate(-135deg) translateY(-50%) !important; position: absolute; } .navigation-menu > li .submenu li .submenu { left: 100%; top: 0; margin-left: 20px; margin-top: -1px; } .navigation-menu > li .submenu li .submenu:before { left: -20px; top: 10px; border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-right: 12px solid #fff; } .navigation-menu > li .submenu.megamenu { white-space: nowrap; width: auto; } .navigation-menu > li .submenu.megamenu > li { overflow: hidden; width: 200px; display: inline-block; vertical-align: top; } .navbar-toggle { display: none !important; } #navigation { display: block !important; } } @media (min-width: 768px) { .navigation-menu > li.has-submenu:hover > .submenu { visibility: visible; opacity: 1; margin-top: 0; } .navigation-menu > li.has-submenu:hover > .submenu > li.has-submenu:hover > .submenu { visibility: visible; opacity: 1; margin-left: 10px; margin-right: 0; } .navigation-menu > li.has-submenu.last-elements > .submenu:before { right: 11px; left: auto; } } @media (max-width: 991px) { .wrapper { padding-top: 70px; } #topnav .navigation-menu { float: none; max-height: 400px; text-align: left; } #topnav .navigation-menu > li { display: block; float: none; } #topnav .navigation-menu > li > a { color: #323a46; padding: 15px; } #topnav .navigation-menu > li > a i { display: inline-block; margin-right: 10px; margin-bottom: 0; vertical-align: inherit; } #topnav .navigation-menu > li > a:after { position: absolute; right: 15px; } #topnav .navigation-menu > li .submenu { display: none; list-style: none; padding-left: 20px; margin: 0; } #topnav .navigation-menu > li .submenu li a { display: block; position: relative; padding: 7px 20px; color: #323a46; } #topnav .navigation-menu > li .submenu li a:hover { color: #007bff; } #topnav .navigation-menu > li .submenu.open { display: block; } #topnav .navigation-menu > li .submenu .submenu { display: none; list-style: none; } #topnav .navigation-menu > li .submenu .submenu.open { display: block; } #topnav .navigation-menu > li .submenu.megamenu > li > ul { list-style: none; padding-left: 0; } #topnav .navigation-menu > li.has-submenu.open > a { color: #007bff; } #topnav .has-submenu.active a { color: #007bff; } #topnav .has-submenu.active .submenu li.active > a { color: #007bff; } #topnav .arrow-down:after { right: 15px; position: absolute; } #topnav .navbar-header { float: left; } #navigation { position: absolute; top: 70px; left: 0; width: 100%; display: none; height: auto; padding-bottom: 0; overflow: auto; -webkit-box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); background-color: #fff; } #navigation.open { display: block; overflow-y: auto; } } @media (max-height: 375px) { .navigation-menu { max-height: 240px !important; } } .menubar-light #topnav { background: #ffffff; -webkit-box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); } .menubar-light #topnav .has-submenu.active > a { color: #007bff; } .menubar-light #topnav .has-submenu.active .submenu li.active > a { color: #007bff; } .menubar-light .navigation-menu > li > a { color: rgba(50, 58, 70, 0.7); } @media (min-width: 992px) { .center-menu #topnav .navigation-menu { text-align: center; } .center-menu #topnav .navigation-menu > li { display: inline-block; float: none; } .center-menu #topnav .navigation-menu > li > a { padding: 20px; } .center-menu #topnav .navigation-menu > li > a i { display: block; margin: 0 0 5px 0; float: none; text-align: center; } .center-menu #topnav .navigation-menu > li > a .arrow-down { display: none; margin: 0 0 5px 0; } .center-menu .wrapper { padding: 150px 12px 0 12px; } } @media (min-width: 992px) { .unsticky-header #topnav, .unsticky-header .navbar-custom { position: absolute; } } .page-title-box .page-title { font-size: 18px; margin: 0; line-height: 75px; color: #323a46; } .page-title-box .page-title-right { float: right; margin-top: 20px; } .page-title-box .breadcrumb { padding-top: 8px; } @media (max-width: 767.98px) { .page-title-box .page-title { display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 70px; } .page-title-box .breadcrumb { display: none; } } @media (max-width: 640px) { .page-title-box .page-title-right { display: none; } } @media (max-width: 419px) { .page-title-box .breadcrumb { display: none; } } .footer { bottom: 0; padding: 19px 15px 20px; position: absolute; right: 0; color: #98a6ad; left: 0; background-color: #fbfbfb; } .footer .footer-links a { color: #98a6ad; margin-left: 1.5rem; -webkit-transition: all .4s; transition: all .4s; } .footer .footer-links a:hover { color: #323a46; } .footer .footer-links a:first-of-type { margin-left: 0; } .right-bar { background-color: #fff; -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02); box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02); display: block; position: fixed; -webkit-transition: all 200ms ease-out; transition: all 200ms ease-out; width: 260px; z-index: 9999; float: right !important; right: -270px; top: 0; bottom: 0; } .right-bar .rightbar-title { background-color: #007bff; padding: 27px 25px; color: #fff; } .right-bar .right-bar-toggle { background-color: #414b5b; height: 24px; width: 24px; line-height: 24px; color: #fff; text-align: center; border-radius: 50%; margin-top: -4px; } .right-bar .right-bar-toggle:hover { background-color: #475364; } .right-bar .user-box { padding: 25px; text-align: center; } .right-bar .user-box .user-img { position: relative; height: 64px; width: 64px; margin: 0 auto 15px auto; } .right-bar .user-box .user-img .user-edit { position: absolute; right: -5px; bottom: 0px; height: 24px; width: 24px; background-color: #fff; line-height: 24px; border-radius: 50%; -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); } .right-bar .user-box h5 { margin-bottom: 2px; } .right-bar .user-box h5 a { color: #323a46; } .rightbar-overlay { background-color: rgba(50, 58, 70, 0.55); position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: none; z-index: 9998; -webkit-transition: all .2s ease-out; transition: all .2s ease-out; } .right-bar-enabled .right-bar { right: 0; } .right-bar-enabled .rightbar-overlay { display: block; } @media (max-width: 767.98px) { .right-bar { overflow: auto; } .right-bar .slimscroll-menu { height: auto !important; } } .inbox-widget .inbox-item { overflow: hidden; padding: 0.625rem 0; position: relative; } .inbox-widget .inbox-item .inbox-item-img { display: block; float: left; margin-right: 15px; } .inbox-widget .inbox-item .inbox-item-img img { width: 40px; } .inbox-widget .inbox-item .inbox-item-author { color: #323a46; display: block; margin-bottom: 0px; } .inbox-widget .inbox-item .inbox-item-text { color: #98a6ad; display: block; margin: 0; overflow: hidden; } .inbox-widget .inbox-item .inbox-item-date { color: #98a6ad; font-size: 0.6875rem; position: absolute; right: 5px; top: 10px; } .width-xs { min-width: 80px; } .width-sm { min-width: 95px; } .width-md { min-width: 110px; } .width-lg { min-width: 140px; } .width-xl { min-width: 160px; } .font-family-secondary { font-family: "Rubik", sans-serif; } .avatar-xs { height: 1.5rem; width: 1.5rem; } .avatar-sm { height: 2.25rem; width: 2.25rem; } .avatar-md { height: 3.5rem; width: 3.5rem; } .avatar-lg { height: 4.5rem; width: 4.5rem; } .avatar-xl { height: 6rem; width: 6rem; } .avatar-xxl { height: 7.5rem; width: 7.5rem; } .avatar-title { -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .avatar-group { padding-left: 12px; } .avatar-group .avatar-group-item { margin: 0 0 10px -12px; display: inline-block; border: 2px solid #fff; border-radius: 50%; } .font-weight-medium { font-weight: 500; } .font-weight-semibold { font-weight: 600; } .sp-line-1, .sp-line-2, .sp-line-3, .sp-line-4 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; } .sp-line-1 { -webkit-line-clamp: 1; } .sp-line-2 { -webkit-line-clamp: 2; } .sp-line-3 { -webkit-line-clamp: 3; } .sp-line-4 { -webkit-line-clamp: 4; } .pull-in { margin-left: -1.5rem; margin-right: -1.5rem; } .social-list-item { height: 2rem; width: 2rem; line-height: calc(2rem - 4px); display: block; border: 2px solid #adb5bd; border-radius: 50%; color: #adb5bd; } .widget-flat { position: relative; overflow: hidden; } .widget-flat i.widget-icon { font-size: 36px; } .checkbox label { display: inline-block; padding-left: 8px; position: relative; font-weight: normal; margin-bottom: 0; } .checkbox label::before { -o-transition: 0.3s ease-in-out; -webkit-transition: 0.3s ease-in-out; background-color: #fff; border-radius: 3px; border: 2px solid #98a6ad; content: ""; display: inline-block; height: 18px; left: 0; margin-left: -18px; position: absolute; transition: 0.3s ease-in-out; width: 18px; outline: none !important; top: 2px; } .checkbox label::after { color: #6c757d; display: inline-block; font-size: 11px; height: 18px; left: 0; margin-left: -18px; padding-left: 3px; padding-top: 2px; position: absolute; top: 0; width: 18px; } .checkbox input[type="checkbox"] { cursor: pointer; opacity: 0; z-index: 1; outline: none !important; } .checkbox input[type="checkbox"]:disabled + label { opacity: 0.65; } .checkbox input[type="checkbox"]:focus + label::before { outline-offset: -2px; outline: none; } .checkbox input[type="checkbox"]:checked + label::after { content: ""; position: absolute; top: 6px; left: 7px; display: table; width: 4px; height: 8px; border: 2px solid #6c757d; border-top-width: 0; border-left-width: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .checkbox input[type="checkbox"]:disabled + label::before { background-color: #f7f7f7; cursor: not-allowed; } .checkbox.checkbox-circle label::before { border-radius: 50%; } .checkbox.checkbox-inline { margin-top: 0; } .checkbox.checkbox-single input { height: 18px; width: 18px; position: absolute; } .checkbox.checkbox-single label { height: 18px; width: 18px; } .checkbox.checkbox-single label:before { margin-left: 0; } .checkbox.checkbox-single label:after { margin-left: 0; } .checkbox-primary input[type="checkbox"]:checked + label::before { background-color: #007bff; border-color: #007bff; } .checkbox-primary input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-secondary input[type="checkbox"]:checked + label::before { background-color: #6c757d; border-color: #6c757d; } .checkbox-secondary input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-success input[type="checkbox"]:checked + label::before { background-color: #25b343; border-color: #25b343; } .checkbox-success input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-info input[type="checkbox"]:checked + label::before { background-color: #4b88e4; border-color: #4b88e4; } .checkbox-info input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-warning input[type="checkbox"]:checked + label::before { background-color: #f7b84b; border-color: #f7b84b; } .checkbox-warning input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-danger input[type="checkbox"]:checked + label::before { background-color: #f1556c; border-color: #f1556c; } .checkbox-danger input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-light input[type="checkbox"]:checked + label::before { background-color: #f7f7f7; border-color: #f7f7f7; } .checkbox-light input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-dark input[type="checkbox"]:checked + label::before { background-color: #323a46; border-color: #323a46; } .checkbox-dark input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-pink input[type="checkbox"]:checked + label::before { background-color: #f672a7; border-color: #f672a7; } .checkbox-pink input[type="checkbox"]:checked + label::after { border-color: #fff; } .checkbox-purple input[type="checkbox"]:checked + label::before { background-color: #6b5eae; border-color: #6b5eae; } .checkbox-purple input[type="checkbox"]:checked + label::after { border-color: #fff; } .radio label { display: inline-block; padding-left: 8px; position: relative; font-weight: normal; margin-bottom: 0; } .radio label::before { -o-transition: border 0.5s ease-in-out; -webkit-transition: border 0.5s ease-in-out; background-color: #fff; border-radius: 50%; border: 2px solid #98a6ad; content: ""; display: inline-block; height: 18px; left: 0; margin-left: -18px; position: absolute; transition: border 0.5s ease-in-out; width: 18px; outline: none !important; } .radio label::after { -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -ms-transform: scale(0, 0); -o-transform: scale(0, 0); -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -webkit-transform: scale(0, 0); -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); background-color: #6c757d; border-radius: 50%; content: " "; display: inline-block; height: 10px; left: 6px; margin-left: -20px; position: absolute; top: 4px; transform: scale(0, 0); transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33), -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); width: 10px; } .radio input[type="radio"] { cursor: pointer; opacity: 0; z-index: 1; outline: none !important; } .radio input[type="radio"]:disabled + label { opacity: 0.65; } .radio input[type="radio"]:focus + label::before { outline-offset: -2px; outline: 5px auto -webkit-focus-ring-color; outline: thin dotted; } .radio input[type="radio"]:checked + label::after { -webkit-transform: scale(1, 1); transform: scale(1, 1); } .radio input[type="radio"]:disabled + label::before { cursor: not-allowed; } .radio.radio-inline { margin-top: 0; } .radio.radio-single label { height: 17px; } .radio-primary input[type="radio"] + label::after { background-color: #007bff; } .radio-primary input[type="radio"]:checked + label::before { border-color: #007bff; } .radio-primary input[type="radio"]:checked + label::after { background-color: #007bff; } .radio-secondary input[type="radio"] + label::after { background-color: #6c757d; } .radio-secondary input[type="radio"]:checked + label::before { border-color: #6c757d; } .radio-secondary input[type="radio"]:checked + label::after { background-color: #6c757d; } .radio-success input[type="radio"] + label::after { background-color: #25b343; } .radio-success input[type="radio"]:checked + label::before { border-color: #25b343; } .radio-success input[type="radio"]:checked + label::after { background-color: #25b343; } .radio-info input[type="radio"] + label::after { background-color: #4b88e4; } .radio-info input[type="radio"]:checked + label::before { border-color: #4b88e4; } .radio-info input[type="radio"]:checked + label::after { background-color: #4b88e4; } .radio-warning input[type="radio"] + label::after { background-color: #f7b84b; } .radio-warning input[type="radio"]:checked + label::before { border-color: #f7b84b; } .radio-warning input[type="radio"]:checked + label::after { background-color: #f7b84b; } .radio-danger input[type="radio"] + label::after { background-color: #f1556c; } .radio-danger input[type="radio"]:checked + label::before { border-color: #f1556c; } .radio-danger input[type="radio"]:checked + label::after { background-color: #f1556c; } .radio-light input[type="radio"] + label::after { background-color: #f7f7f7; } .radio-light input[type="radio"]:checked + label::before { border-color: #f7f7f7; } .radio-light input[type="radio"]:checked + label::after { background-color: #f7f7f7; } .radio-dark input[type="radio"] + label::after { background-color: #323a46; } .radio-dark input[type="radio"]:checked + label::before { border-color: #323a46; } .radio-dark input[type="radio"]:checked + label::after { background-color: #323a46; } .radio-pink input[type="radio"] + label::after { background-color: #f672a7; } .radio-pink input[type="radio"]:checked + label::before { border-color: #f672a7; } .radio-pink input[type="radio"]:checked + label::after { background-color: #f672a7; } .radio-purple input[type="radio"] + label::after { background-color: #6b5eae; } .radio-purple input[type="radio"]:checked + label::before { border-color: #6b5eae; } .radio-purple input[type="radio"]:checked + label::after { background-color: #6b5eae; } .ribbon-box { position: relative; /* Ribbon two */ } .ribbon-box .ribbon { position: relative; clear: both; padding: 5px 12px; margin-bottom: 15px; -webkit-box-shadow: 2px 5px 10px rgba(50, 58, 70, 0.15); box-shadow: 2px 5px 10px rgba(50, 58, 70, 0.15); color: #fff; font-size: 13px; font-weight: 500; } .ribbon-box .ribbon:before { content: " "; border-style: solid; border-width: 10px; display: block; position: absolute; bottom: -10px; left: 0; margin-bottom: -10px; z-index: -1; } .ribbon-box .ribbon.float-left { margin-left: -30px; border-radius: 0 3px 3px 0; } .ribbon-box .ribbon.float-right { margin-right: -30px; border-radius: 3px 0 0 3px; } .ribbon-box .ribbon.float-right:before { right: 0; } .ribbon-box .ribbon.float-center span { margin: 0 auto 20px auto; } .ribbon-box.ribbon-icon-box .ribbon { padding-left: 40px; } .ribbon-box.ribbon-icon-box .ribbon .ribbon-icon { position: absolute; left: 6px; top: 6px; } .ribbon-box .ribbon-content { clear: both; } .ribbon-box .ribbon-primary { background: #007bff; } .ribbon-box .ribbon-primary:before { border-color: #007f8e transparent transparent; } .ribbon-box .ribbon-secondary { background: #6c757d; } .ribbon-box .ribbon-secondary:before { border-color: #545b62 transparent transparent; } .ribbon-box .ribbon-success { background: #25b343; } .ribbon-box .ribbon-success:before { border-color: #1c8933 transparent transparent; } .ribbon-box .ribbon-info { background: #4b88e4; } .ribbon-box .ribbon-info:before { border-color: #216bdb transparent transparent; } .ribbon-box .ribbon-warning { background: #f7b84b; } .ribbon-box .ribbon-warning:before { border-color: #f5a51a transparent transparent; } .ribbon-box .ribbon-danger { background: #f1556c; } .ribbon-box .ribbon-danger:before { border-color: #ed2643 transparent transparent; } .ribbon-box .ribbon-light { background: #f7f7f7; } .ribbon-box .ribbon-light:before { border-color: #dedede transparent transparent; } .ribbon-box .ribbon-dark { background: #323a46; } .ribbon-box .ribbon-dark:before { border-color: #1d2128 transparent transparent; } .ribbon-box .ribbon-pink { background: #f672a7; } .ribbon-box .ribbon-pink:before { border-color: #f34289 transparent transparent; } .ribbon-box .ribbon-purple { background: #6b5eae; } .ribbon-box .ribbon-purple:before { border-color: #544990 transparent transparent; } .ribbon-box .ribbon-two { position: absolute; left: -5px; top: -5px; z-index: 1; overflow: hidden; width: 75px; height: 75px; text-align: right; } .ribbon-box .ribbon-two span { font-size: 13px; color: #fff; text-align: center; line-height: 20px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); width: 100px; display: block; -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02); box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02); position: absolute; top: 19px; left: -21px; font-weight: 500; } .ribbon-box .ribbon-two span:before { content: ""; position: absolute; left: 0; top: 100%; z-index: -1; border-right: 3px solid transparent; border-bottom: 3px solid transparent; } .ribbon-box .ribbon-two span:after { content: ""; position: absolute; right: 0; top: 100%; z-index: -1; border-left: 3px solid transparent; border-bottom: 3px solid transparent; } .ribbon-box .ribbon-two-primary span { background: #007bff; } .ribbon-box .ribbon-two-primary span:before { border-left: 3px solid #006875; border-top: 3px solid #006875; } .ribbon-box .ribbon-two-primary span:after { border-right: 3px solid #006875; border-top: 3px solid #006875; } .ribbon-box .ribbon-two-secondary span { background: #6c757d; } .ribbon-box .ribbon-two-secondary span:before { border-left: 3px solid #494f54; border-top: 3px solid #494f54; } .ribbon-box .ribbon-two-secondary span:after { border-right: 3px solid #494f54; border-top: 3px solid #494f54; } .ribbon-box .ribbon-two-success span { background: #25b343; } .ribbon-box .ribbon-two-success span:before { border-left: 3px solid #18742b; border-top: 3px solid #18742b; } .ribbon-box .ribbon-two-success span:after { border-right: 3px solid #18742b; border-top: 3px solid #18742b; } .ribbon-box .ribbon-two-info span { background: #4b88e4; } .ribbon-box .ribbon-two-info span:before { border-left: 3px solid #1e60c5; border-top: 3px solid #1e60c5; } .ribbon-box .ribbon-two-info span:after { border-right: 3px solid #1e60c5; border-top: 3px solid #1e60c5; } .ribbon-box .ribbon-two-warning span { background: #f7b84b; } .ribbon-box .ribbon-two-warning span:before { border-left: 3px solid #eb990a; border-top: 3px solid #eb990a; } .ribbon-box .ribbon-two-warning span:after { border-right: 3px solid #eb990a; border-top: 3px solid #eb990a; } .ribbon-box .ribbon-two-danger span { background: #f1556c; } .ribbon-box .ribbon-two-danger span:before { border-left: 3px solid #e71332; border-top: 3px solid #e71332; } .ribbon-box .ribbon-two-danger span:after { border-right: 3px solid #e71332; border-top: 3px solid #e71332; } .ribbon-box .ribbon-two-light span { background: #f7f7f7; } .ribbon-box .ribbon-two-light span:before { border-left: 3px solid #d1d1d1; border-top: 3px solid #d1d1d1; } .ribbon-box .ribbon-two-light span:after { border-right: 3px solid #d1d1d1; border-top: 3px solid #d1d1d1; } .ribbon-box .ribbon-two-dark span { background: #323a46; } .ribbon-box .ribbon-two-dark span:before { border-left: 3px solid #121519; border-top: 3px solid #121519; } .ribbon-box .ribbon-two-dark span:after { border-right: 3px solid #121519; border-top: 3px solid #121519; } .ribbon-box .ribbon-two-pink span { background: #f672a7; } .ribbon-box .ribbon-two-pink span:before { border-left: 3px solid #f12a7a; border-top: 3px solid #f12a7a; } .ribbon-box .ribbon-two-pink span:after { border-right: 3px solid #f12a7a; border-top: 3px solid #f12a7a; } .ribbon-box .ribbon-two-purple span { background: #6b5eae; } .ribbon-box .ribbon-two-purple span:before { border-left: 3px solid #4a407f; border-top: 3px solid #4a407f; } .ribbon-box .ribbon-two-purple span:after { border-right: 3px solid #4a407f; border-top: 3px solid #4a407f; } @media print { .right-bar, .page-title-box, .navbar-custom, .footer { display: none; } .card-body, .content-page, .right-bar, .content, body { padding: 0; margin: 0; } } /*! * Waves v0.7.6 * http://fian.my.id/Waves * * Copyright 2014-2018 Alfiana E. Sibuea and other contributors * Released under the MIT license * https://github.com/fians/Waves/blob/master/LICENSE */ .waves-effect { position: relative; cursor: pointer; display: inline-block; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; } .waves-effect .waves-ripple { position: absolute; border-radius: 50%; width: 100px; height: 100px; margin-top: -50px; margin-left: -50px; opacity: 0; background: rgba(0, 0, 0, 0.2); background: radial-gradient(rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.5) 60%, rgba(255, 255, 255, 0) 70%); -webkit-transition: all 0.5s ease-out; transition: all 0.5s ease-out; -webkit-transition-property: -webkit-transform, opacity; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-transform: scale(0) translate(0, 0); transform: scale(0) translate(0, 0); pointer-events: none; } .waves-effect.waves-light .waves-ripple { background: rgba(255, 255, 255, 0.4); background: radial-gradient(rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0) 70%); } .waves-effect.waves-classic .waves-ripple { background: rgba(0, 0, 0, 0.2); } .waves-effect.waves-classic.waves-light .waves-ripple { background: rgba(255, 255, 255, 0.4); } .waves-notransition { -webkit-transition: none !important; transition: none !important; } .waves-button, .waves-circle { -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%); } .waves-button, .waves-button:hover, .waves-button:visited, .waves-button-input { white-space: nowrap; vertical-align: middle; cursor: pointer; border: none; outline: none; color: inherit; background-color: rgba(0, 0, 0, 0); font-size: 1em; line-height: 1em; text-align: center; text-decoration: none; z-index: 1; } .waves-button { padding: 0.85em 1.1em; border-radius: 0.2em; } .waves-button-input { margin: 0; padding: 0.85em 1.1em; } .waves-input-wrapper { border-radius: 0.2em; vertical-align: bottom; } .waves-input-wrapper.waves-button { padding: 0; } .waves-input-wrapper .waves-button-input { position: relative; top: 0; left: 0; z-index: 1; } .waves-circle { text-align: center; width: 2.5em; height: 2.5em; line-height: 2.5em; border-radius: 50%; } .waves-float { -webkit-mask-image: none; -webkit-box-shadow: 0px 1px 1.5px 1px rgba(0, 0, 0, 0.12); box-shadow: 0px 1px 1.5px 1px rgba(0, 0, 0, 0.12); -webkit-transition: all 300ms; transition: all 300ms; } .waves-float:active { -webkit-box-shadow: 0px 8px 20px 1px rgba(0, 0, 0, 0.3); box-shadow: 0px 8px 20px 1px rgba(0, 0, 0, 0.3); } .waves-block { display: block; } .slimScrollDiv { height: auto !important; } #toast-container > div { opacity: 1; -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); } #toast-container > div:hover { -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); } .toast-progress { background-color: #fff; } .toast-success { background-color: #25b343; } .toast-info { background-color: #4b88e4; } .toast-warning { background-color: #f7b84b; } .toast-error { background-color: #f1556c; } .swal2-modal { font-family: "Rubik", sans-serif; -webkit-box-shadow: 0 10px 33px rgba(0, 0, 0, 0.1); box-shadow: 0 10px 33px rgba(0, 0, 0, 0.1); } .swal2-modal .swal2-title { font-size: 24px; font-weight: 500; } .swal2-modal .swal2-content { font-size: 16px; } .swal2-modal .swal2-spacer { margin: 10px 0; } .swal2-modal .swal2-file, .swal2-modal .swal2-input, .swal2-modal .swal2-textarea { border: 2px solid #dee2e6; font-size: 16px; -webkit-box-shadow: none; box-shadow: none; } .swal2-modal .swal2-styled:focus { -webkit-box-shadow: none !important; box-shadow: none !important; } .swal2-icon.swal2-question { color: #007bff; border-color: #007bff; } .swal2-icon.swal2-warning { color: #f7b84b; border-color: #f7b84b; } .swal2-icon.swal2-error { border-color: #f1556c; } .swal2-icon.swal2-error .line { background-color: #f1556c; } .swal2-icon.swal2-info { color: #4b88e4; border-color: #4b88e4; } .swal2-icon.swal2-info .line { background-color: #4b88e4; } .swal2-modal .swal2-file:focus, .swal2-modal .swal2-input:focus, .swal2-modal .swal2-textarea:focus { outline: 0; border: 2px solid #007bff; } .swal2-container.swal2-shown { background-color: rgba(50, 58, 70, 0.9); } .irs--modern .irs-bar, .irs--modern .irs-to, .irs--modern .irs-from, .irs--modern .irs-single { background: #007bff !important; } .irs--modern .irs-to:before, .irs--modern .irs-from:before, .irs--modern .irs-single:before { border-top-color: #007bff; } .irs--modern .irs-min, .irs--modern .irs-max { color: #98a6ad; } .irs--modern .irs-grid-text { font-size: 12px; } .irs--modern .irs-handle > i:nth-child(1) { width: 8px; height: 8px; } .irs--modern .irs-handle > i:first-child { background-color: #007bff !important; } .calendar { float: left; margin-bottom: 0; } .fc-view { margin-top: 30px; } .none-border .modal-footer { border-top: none; } .fc-toolbar { margin: 15px 0 5px 0; } .fc-toolbar h2 { font-size: 1.25rem; line-height: 1.875rem; text-transform: uppercase; } .fc-day-grid-event .fc-time { font-weight: 500; } .fc-day { background: #fff; } .fc-toolbar .fc-state-active, .fc-toolbar .ui-state-active, .fc-toolbar button:focus, .fc-toolbar button:hover, .fc-toolbar .ui-state-hover { z-index: 0; } .fc th.fc-widget-header { background: #f1f5f7; font-size: 13px; line-height: 20px; padding: 10px 0; text-transform: uppercase; font-weight: 500; } .fc-unthemed th, .fc-unthemed td, .fc-unthemed thead, .fc-unthemed tbody, .fc-unthemed .fc-divider, .fc-unthemed .fc-row, .fc-unthemed .fc-popover { border-color: #dee2e6; } .fc-button { background: #f1f5f7; border: none; color: #6c757d; text-transform: capitalize; -webkit-box-shadow: none; box-shadow: none; border-radius: 3px; margin: 0 3px; padding: 6px 12px; height: auto; } .fc-text-arrow { font-family: inherit; font-size: 1rem; } .fc-state-hover { background: #f1f5f7; } .fc-state-highlight { background: #dee2e6; } .fc-state-down, .fc-state-active, .fc-state-disabled { background-color: #007bff; color: #fff; text-shadow: none; } .fc-cell-overlay { background: #dee2e6; } .fc-unthemed .fc-today { background: #fff; } .fc-event { border-radius: 2px; border: none; cursor: move; font-size: 0.8125rem; margin: 5px 7px; padding: 5px 5px; text-align: center; } .external-event { cursor: move; margin: 10px 0; padding: 8px 10px; color: #fff; border-radius: 4px; } .fc-basic-view td.fc-week-number span { padding-right: 8px; } .fc-basic-view td.fc-day-number { padding-right: 8px; } .fc-basic-view .fc-content { color: #fff; } .fc-time-grid-event .fc-content { color: #fff; } @media (max-width: 767.98px) { .fc-toolbar .fc-left, .fc-toolbar .fc-right, .fc-toolbar .fc-center { float: none; display: block; clear: both; margin: 10px 0; } .fc .fc-toolbar > * > * { float: none; } .fc-today-button { display: none; } } .chartjs-chart { margin: auto; position: relative; width: 100%; } .chartjs-chart-example { height: 300px; } .jqstooltip { -webkit-box-sizing: content-box; box-sizing: content-box; width: auto !important; height: auto !important; background-color: #323a46 !important; -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); padding: 5px 10px !important; border-radius: 3px; border-color: #323a46 !important; } .jqsfield { color: #fff !important; font-size: 12px !important; line-height: 18px !important; font-family: "Rubik", sans-serif !important; font-weight: 500 !important; } .nice-select .option.selected { font-weight: 500; } .select2-container .select2-selection--single { border: 1px solid #ced4da; height: 38px; outline: none; } .select2-container .select2-selection--single .select2-selection__rendered { line-height: 36px; padding-left: 12px; } .select2-container .select2-selection--single .select2-selection__arrow { height: 34px; width: 34px; right: 3px; } .select2-container .select2-selection--single .select2-selection__arrow b { border-color: #d1d1d1 transparent transparent transparent; border-width: 6px 6px 0 6px; } .select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #d1d1d1 transparent !important; border-width: 0 6px 6px 6px !important; } .select2-results__option { padding: 6px 12px; } .select2-dropdown { border: 1px solid #eaeaea; -webkit-box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); box-shadow: 0px 0px 35px 0px rgba(154, 161, 171, 0.15); } .select2-container--default .select2-search--dropdown { padding: 10px; background-color: white; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #eaeaea; outline: none; } .select2-container--default .select2-results__group { font-weight: 500; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #007bff; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #f7f7f7; color: #323a46; } .select2-container--default .select2-results__option[aria-selected=true]:hover { background-color: #007bff; color: #fff; } .select2-container .select2-selection--multiple { min-height: 38px; border: 1px solid #ced4da !important; } .select2-container .select2-selection--multiple .select2-selection__rendered { padding: 1px 10px; } .select2-container .select2-selection--multiple .select2-search__field { border: 0; } .select2-container .select2-selection--multiple .select2-selection__choice { background-color: #007bff; border: none; color: #fff; border-radius: 3px; padding: 0 7px; margin-top: 7px; } .select2-container .select2-selection--multiple .select2-selection__choice__remove { color: #fff; margin-right: 5px; } .select2-container .select2-selection--multiple .select2-selection__choice__remove:hover { color: #fff; } .daterangepicker { font-family: "Rubik", sans-serif; } .daterangepicker td.active, .daterangepicker td.active:hover, .daterangepicker .ranges li.active { background-color: #007bff; } .daterangepicker .drp-buttons .btn { font-weight: 500; } @font-face { font-family: "summernote"; font-style: normal; font-weight: normal; src: url("../fonts/summernote.eot"); src: url("../fonts/summernote.eot?#iefix") format("embedded-opentype"), url("../fonts/summernote.woff?") format("woff"), url("../fonts/summernote.ttf?") format("truetype"); } .note-editor.note-frame { border: 2px solid #f7f7f7; -webkit-box-shadow: none; box-shadow: none; margin: 0; } .note-editor.note-frame .note-statusbar { background-color: #fcfcfc; border-top: 1px solid #f7f7f7; } .note-editor.note-frame .note-editable { border: none; } .note-status-output { display: none; } .note-editable { border-radius: 0.2rem; padding: 0.45rem 0.9rem; } .note-editable p:last-of-type { margin-bottom: 0; } .note-popover .popover-content .note-color .dropdown-menu, .card-header.note-toolbar .note-color .dropdown-menu { min-width: 344px; } .note-toolbar { z-index: 1; background-color: #fff !important; } .dropzone { border: 2px dashed rgba(50, 58, 70, 0.3); background: #fff; border-radius: 6px; } .dataTables_wrapper.container-fluid { padding: 0; } table.dataTable { border-collapse: collapse !important; margin-bottom: 15px !important; } table.dataTable tbody > tr.selected, table.dataTable tbody > tr > .selected { background-color: #007bff; } table.dataTable tbody > tr.selected td, table.dataTable tbody > tr > .selected td { border-color: #007bff; } table.dataTable tbody td:focus { outline: none !important; } table.dataTable tbody th.focus, table.dataTable tbody td.focus { outline: 2px solid #007bff !important; outline-offset: -1px; color: #007bff; background-color: rgba(0, 123, 255, 0.15); } .dataTables_info { font-weight: 500; } table.dataTable.dtr-inline.collapsed > tbody > tr[role=row] > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr[role=row] > th:first-child:before { -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.12); background-color: #25b343; top: 0.85rem; } table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before { background-color: #f1556c; top: 0.85rem; } div.dt-button-info { background-color: #007bff; border: none; color: #fff; -webkit-box-shadow: none; box-shadow: none; border-radius: 3px; text-align: center; z-index: 21; } div.dt-button-info h2 { border-bottom: none; background-color: rgba(255, 255, 255, 0.2); color: #fff; } @media (max-width: 767.98px) { li.paginate_button.previous, li.paginate_button.next { display: inline-block; font-size: 1.5rem; } li.paginate_button { display: none; } .dataTables_paginate ul { text-align: center; display: block; margin: 1.5rem 0 0 !important; } div.dt-buttons { display: inline-table; margin-bottom: 1.5rem; } } .activate-select .sorting_1 { background-color: #f1f5f7; } .gmaps, .gmaps-panaroma { height: 300px; background: #f1f5f7; border-radius: 3px; } .gmaps-overlay { display: block; text-align: center; color: #fff; font-size: 16px; line-height: 40px; background: #007bff; border-radius: 4px; padding: 10px 20px; } .gmaps-overlay_arrow { left: 50%; margin-left: -16px; width: 0; height: 0; position: absolute; } .gmaps-overlay_arrow.above { bottom: -15px; border-left: 16px solid transparent; border-right: 16px solid transparent; border-top: 16px solid #007bff; } .gmaps-overlay_arrow.below { top: -15px; border-left: 16px solid transparent; border-right: 16px solid transparent; border-bottom: 16px solid #007bff; } .jvectormap-label { border: none; background: #323a46; color: #fff; font-family: "Rubik", sans-serif; font-size: 0.875rem; padding: 5px 8px; } .jvectormap-zoomin, .jvectormap-zoomout { line-height: 12px; } .button-list { margin-left: -8px; margin-bottom: -12px; } .button-list .btn { margin-bottom: 12px; margin-left: 8px; } .icons-list-demo div { cursor: pointer; line-height: 45px; white-space: nowrap; text-overflow: ellipsis; display: block; overflow: hidden; } .icons-list-demo div p { margin-bottom: 0; line-height: inherit; } .icons-list-demo i { text-align: center; vertical-align: middle; font-size: 22px; width: 50px; height: 50px; line-height: 50px; margin-right: 12px; color: rgba(50, 58, 70, 0.7); border-radius: 3px; display: inline-block; -webkit-transition: all 0.2s; transition: all 0.2s; } .icons-list-demo .col-lg-4 { background-clip: padding-box; margin-top: 10px; } .icons-list-demo .col-lg-4:hover, .icons-list-demo .col-lg-4:hover i { color: #007bff; } .grid-structure .grid-container { background-color: #f1f5f7; margin-bottom: 10px; font-size: .8rem; font-weight: 500; padding: 10px 20px; } body.authentication-bg { background-color: #f7f7f7; background-size: cover; background-repeat: no-repeat; padding-bottom: 0; } .home-btn { position: absolute; top: 15px; right: 25px; } .timeline { border-collapse: collapse; border-spacing: 0; display: table; margin-bottom: 50px; position: relative; table-layout: fixed; width: 100%; } .timeline .w-lg { min-width: 140px; } .timeline .time-show { margin-bottom: 30px; margin-left: -70px; margin-top: 30px; position: relative; } .timeline:before { background-color: #007bff; bottom: 0; content: ""; left: 70px; position: absolute; top: 30px; width: 2px; z-index: 0; } .timeline .timeline-icon { -webkit-border-radius: 50%; background-color: #007bff; border-radius: 50%; display: block; height: 20px; left: -10px; margin-top: -10px; position: absolute; text-align: center; top: 50%; width: 20px; } .timeline .timeline-icon i { color: #fff; font-size: 10px; margin-top: 3px; position: absolute; left: 5px; } .timeline .time-icon:before { font-size: 16px; margin-top: 5px; } .timeline-item { padding-left: 70px; } .timeline-item .timeline-desk { position: relative; } .timeline-item .timeline-desk .timeline-box { padding: 15px 30px 15px 40px; } .timeline-item .timeline-desk .album img { height: 36px; width: auto; border-radius: 3px; } .member-card .member-thumb { width: 80px; } .social-links li a { border-radius: 50%; color: #adb5bd; display: inline-block; height: 30px; line-height: 27px; border: 2px solid #adb5bd; text-align: center; width: 30px; } .social-links li a:hover { color: #6c757d; border-color: #6c757d; }