/************************************************ ************************************************ A1. Importing Sass Variables ************************************************ ************************************************/ /*************** 2.Mixins ***************/ /************************************************ ************************************************ A2. Importing Web Fonts ************************************************ ************************************************/ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&display=swap"); @font-face { font-family: 'Kontora Extra Black'; src: url('/fonts/kontora-extrablack.eot') format('embedded-opentype'), url('/fonts/kontora-extrablack.woff2') format('woff2'), url('/fonts/kontora-extrablack.woff') format('woff'), url('/fonts/kontora-extrablack.otf') format('opentype'); font-weight: 900; font-style: normal; } @font-face { font-family: 'Kontora Medium'; src: url('/fonts/kontora-medium.eot') format('embedded-opentype'), url('/fonts/kontora-medium.woff2') format('woff2'), url('/fonts/kontora-medium.woff') format('woff'), url('/fonts/kontora-medium.otf') format('opentype'); font-weight: 500; font-style: normal; } :root { --ff-extra-black: 'Kontora Extra Black', sans-serif; --ff-medium: 'Kontora Medium', sans-serif; } /************************************************ ************************************************ Body Css ************************************************ ************************************************/ html { font-size: 100%; } body { margin: 0; padding: 0; font-family: var(--ff-medium); color: #333333; background: #f8f4ee; position: relative; } body.authentication { display: flex; align-items: center; justify-content: center; background: #f8f4ee; } body.countdown { background: #1b1b1b; } /*************** Loading ***************/ #loading-wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 5000; background: rgba(0, 0, 0, 0.95); display: flex; align-items: center; justify-content: center; } #loading-wrapper .spinner-border { width: 5rem; height: 5rem; color: #cd9d63; } /************************************************ ************************************************ Re Usable Css ************************************************ ************************************************/ a { color: #000000; cursor: pointer; } a:hover { text-decoration: none; } img { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } ul { list-style-type: none; margin: 0; padding: 0; } ul.custom { font-size: .825rem; margin: 20px 0 0 20px; font-weight: 400; } ul.custom li { line-height: 180%; } ul.custom-list2 { font-size: .825rem; list-style-type: disc; margin: 0 0 0 15px; } ul.custom-list2 li { line-height: 100%; margin: 0 0 15px 0; } ul.custom-list2 li a { display: flex; line-height: 160%; color: #333333; } ul.custom-list2 li a:hover { text-decoration: underline; color: #cd9d63; } h1, h2, h3, h4, h5, h6 { font-weight: 600; } h1 { font-size: 2.5rem; margin-bottom: .8rem; } h2 { font-size: 2rem; margin-bottom: .5rem; } h3 { font-size: 1.5rem; margin-bottom: .5rem; } h4 { font-size: 1.25rem; margin-bottom: .4rem; } h5 { font-size: 1rem; margin-bottom: .3rem; } h6 { font-size: .85rem; margin-bottom: .2rem; } p { margin-bottom: .2rem; line-height: 180%; } h1.styled { text-align: center; position: relative; line-height: 180%; padding-bottom: .2rem; margin-bottom: 3rem; font-weight: 400; } h1.styled:after { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; content: ""; position: absolute; bottom: 0; left: 50%; margin-left: -35px; background: #cd9d63; height: 5px; width: 70px; } h2.styled { text-align: center; position: relative; line-height: 180%; padding-bottom: .2rem; margin-bottom: 3rem; font-weight: 400; } h2.styled:after { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; content: ""; position: absolute; bottom: 0; left: 50%; margin-left: -25px; background: #cd9d63; height: 4px; width: 50px; } h3.styled { text-align: center; position: relative; line-height: 180%; padding-bottom: .2rem; margin-bottom: 3rem; font-weight: 400; } h3.styled:after { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; content: ""; position: absolute; bottom: 0; left: 50%; margin-left: -15px; background: #cd9d63; height: 3px; width: 30px; } .text-primary { color: #ad6c14 !important; } .text-secondary { color: #212020 !important; } .text-light { color: #d2d0cd !important; } .text-dark { color: #1b1b1b !important; } .text-success { color: #86a23b !important; } .text-info { color: #2f71c1 !important; } .text-warning { color: #ffc200 !important; } .text-danger { color: #f1614a !important; } .text-muted { color: #777b82 !important; } .bg-primary, a.bg-primary { background-color: #cd9d63 !important; } .bg-primary:hover, .bg-primary:focus, a.bg-primary:hover, a.bg-primary:focus { background-color: #c79150 !important; } .bg-secondary, a.bg-secondary { background-color: #615f5f !important; } .bg-secondary:hover, .bg-secondary:focus, a.bg-secondary:hover, a.bg-secondary:focus { background-color: #545252 !important; } .bg-light, a.bg-light { background-color: #d2d0cd !important; } .bg-light:hover, .bg-light:focus, a.bg-light:hover, a.bg-light:focus { background-color: #c6c3c0 !important; } .bg-dark, a.bg-dark { background-color: #1b1b1b !important; } .bg-dark:hover, .bg-dark:focus, a.bg-dark:hover, a.bg-dark:focus { background-color: #0e0e0e !important; } .bg-success, a.bg-success { background-color: #86a23b !important; } .bg-success:hover, .bg-success:focus, a.bg-success:hover, a.bg-success:focus { background-color: #778f34 !important; } .bg-info, a.bg-info { background-color: #2f71c1 !important; } .bg-info:hover, .bg-info:focus, a.bg-info:hover, a.bg-info:focus { background-color: #2a65ac !important; } .bg-warning, a.bg-warning { background-color: #ffc200 !important; } .bg-warning:hover, .bg-warning:focus, a.bg-warning:hover, a.bg-warning:focus { background-color: #e6af00 !important; } .bg-danger, a.bg-danger { background-color: #f1614a !important; } .bg-danger:hover, .bg-danger:focus, a.bg-danger:hover, a.bg-danger:focus { background-color: #ef4c32 !important; } .bg-pink, a.bg-pink { background-color: #f77eb9 !important; } .bg-pink:hover, .bg-pink:focus, a.bg-pink:hover, a.bg-pink:focus { background-color: #f666ac !important; } .img-48 { max-width: 48px; max-height: 48px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .img-72 { max-width: 72px; max-height: 72px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .img-90 { max-width: 90px; max-height: 90px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .rounded-2 { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .rounded-3 { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .rounded-4 { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } /************************************************ ************************************************ Animations Css ************************************************ ************************************************/ @-webkit-keyframes slideInUp { from { -webkit-transform: translate3d(0, 7%, 0); transform: translate3d(0, 7%, 0); visibility: visible; opacity: 0.2; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 2; } } @keyframes slideInUp { from { -webkit-transform: translate3d(0, 7%, 0); transform: translate3d(0, 7%, 0); visibility: visible; opacity: 0.2; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } } /************************************************ ************************************************ Layout Css ************************************************ ************************************************/ .header { padding: 1rem 0; z-index: 100; position: relative; min-height: 50px; display: flex; align-items: center; justify-content: space-between; -webkit-transition: padding-left 0.3s ease; -moz-transition: padding-left 0.3s ease; -ms-transition: padding-left 0.3s ease; -o-transition: padding-left 0.3s ease; transition: padding-left 0.3s ease; } .header .toggle-btns #pin-sidebar, .header .toggle-btns #toggle-sidebar { display: flex; justify-content: center; align-items: center; width: 38px; height: 38px; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .header .toggle-btns #pin-sidebar i, .header .toggle-btns #toggle-sidebar i { font-size: 1rem; font-weight: 600; color: #ffffff; } .header .toggle-btns #pin-sidebar:hover, .header .toggle-btns #toggle-sidebar:hover { background: #cd9d63; /* Old browsers */ background: -moz-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cd9d63), color-stop(100%, #ad6c14)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* IE10+ */ background: linear-gradient(to bottom, #cd9d63 0%, #ad6c14 100%); /* W3C */ } .header .toggle-btns #pin-sidebar:hover i, .header .toggle-btns #toggle-sidebar:hover i { color: #ffffff; } .header .toggle-btns #toggle-sidebar { display: none; } @media (max-width: 768px) { .header .toggle-btns #pin-sidebar { display: none; } .header .toggle-btns #toggle-sidebar { display: flex; } } .header-items { display: flex; align-items: center; justify-content: flex-end; } .custom-search { margin: 0; position: relative; } .custom-search .search-query { padding: 7px 15px; color: #333333; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; line-height: 20px; width: 240px; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .custom-search .search-query:focus { outline: none; background: #fffefc; width: 280px; } .custom-search i { padding: 0 20px; height: 36px; line-height: 36px; cursor: pointer; position: absolute; right: 0; top: 0; color: #ad6c14; border-left: 1px solid #e4dacd; font-size: 1.2rem; } @media (max-width: 992px) { .custom-search { display: none; } } .header-actions { display: flex; align-items: center; } .header-actions > li { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: 0 0 0 20px; background: #fffefc; border: 1px solid #e4dacd; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .header-actions > li > a { padding: 1rem; display: flex; position: relative; align-items: center; justify-content: center; } .header-actions > li > a > i { font-size: 1.2rem; color: #ad6c14; } .header-actions > li > a .count-label { position: absolute; top: 10px; right: 7px; width: 16px; height: 16px; line-height: 16px; font-size: .6rem; font-weight: 600; text-align: center; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ color: #ffffff; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .header-actions > li:hover, .header-actions > li:focus { background: #f1eae1; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } .header-actions > li:hover i, .header-actions > li:focus i { color: #615f5f; } .header-actions > li:hover .dropdown-menu, .header-actions > li:focus .dropdown-menu { margin-top: 0; display: block; } .header-actions > li.balance { position: relative; padding: 1rem 2rem; color: #ffffff; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border: 0; display: flex; align-items: flex-start; flex-direction: column; } .header-actions > li.balance:after { content: ''; background: url(../img/lines.svg) no-repeat; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-size: 150%; background-position: center center; } .header-actions > li.balance h3 { margin: 0; } .header-actions > li.balance h6 { margin: 0; } .header-actions > li.balance:hover, .header-actions > li.balance:focus { -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } .header-actions .dropdown-menu { -webkit-border-radius: 5px 5px 30px 30px; -moz-border-radius: 5px 5px 30px 30px; border-radius: 5px 5px 30px 30px; } @media (max-width: 576px) { /* .header-actions > li > a.user-settings span.user-name { display: none; } .header-actions > li:nth-child(2n) { display: none; } .header-actions > li:first-child { display: none; }*/ .header-actions > li.balance { padding: .5rem 1rem ; font-size:.8rem;} .header-actions > li { margin: 0 0 0 8px ;} } ul.header-notifications li a { padding: .7rem 1rem; display: flex; align-items: center; flex-direction: row; } ul.header-notifications li a > .user-img { position: relative; margin: 0 10px 0 0; } ul.header-notifications li a > .user-img img { width: 36px; height: 36px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } ul.header-notifications li a > .user-img:after { content: ''; position: absolute; right: -3px; bottom: 5px; width: 10px; height: 10px; border: 1px solid #ffffff; background: #cd9d63; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } ul.header-notifications li a > .user-img.online:after { background: #86a23b; } ul.header-notifications li a > .user-img.busy:after { background: #f1614a; } ul.header-notifications li a > .user-img.away:after { background: #ffc200; } ul.header-notifications li a .details { display: flex; flex-direction: column; } ul.header-notifications li a .details > .user-title { font-weight: 600; font-size: .875rem; margin: 0 0 5px 0; } ul.header-notifications li a .details .noti-details { color: #777b82; font-size: .825rem; line-height: 150%; } ul.header-notifications li a .details .noti-date { opacity: 0.4; line-height: 150%; font-size: .725rem; } ul.header-notifications li a:hover { color: #333333; } .header-profile-actions { margin: 0; padding: .8rem 0; } .header-profile-actions .header-user-profile { display: flex; flex-direction: column; align-items: center; margin-bottom: .5rem; } .header-profile-actions .header-user-profile .header-user { margin-bottom: .5rem; } .header-profile-actions .header-user-profile .header-user img { width: 4rem; height: 4rem; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; } .header-profile-actions .header-user-profile p { color: #777b82; font-size: .825rem; } .header-profile-actions a { border-bottom: 1px dotted rgba(1, 118, 192, 0.1); padding: .5rem 1rem; display: flex; align-items: center; color: #333333; } .header-profile-actions a:hover { background: #f8f4ee; } .header-profile-actions a i { font-weight: 700; margin-right: .5rem; font-size: 1rem; vertical-align: text-top; } .header-profile-actions a:last-child { border-bottom: 0; } /************************************************ ************************************************ Layout CSS ************************************************ ************************************************/ @-webkit-keyframes swing { 0%, 30%, 50%, 70%, 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 10% { -webkit-transform: rotate(10deg); transform: rotate(10deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } } @keyframes swing { 0%, 30%, 50%, 70%, 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 10% { -webkit-transform: rotate(10deg); transform: rotate(10deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } } .page-wrapper { background: #f8f4ee; } .page-wrapper .sidebar-wrapper { width: 230px; height: calc(100vh - 0px); background: #191919; overflow: hidden; position: fixed; top: 0; left: 0; z-index: 999; -webkit-transition: left .3s ease, width .3s ease; transition: left .3s ease, width .3s ease; } .page-wrapper .sidebar-wrapper .sidebar-brand { margin: 0 0 1rem 0; overflow: hidden; } .page-wrapper .sidebar-wrapper .sidebar-brand .logo { padding: 20px 13px; min-height: 50px; display: flex; align-items: center; } .page-wrapper .sidebar-wrapper .sidebar-brand .logo img { max-width: 160px; max-height: 45px; } .page-wrapper .sidebar-wrapper .sidebar-user-details { display: flex; justify-content: center; } .page-wrapper .sidebar-wrapper .sidebar-user-details .user-profile { padding: 10px 10px 25px 10px; text-align: center; position: relative; } .page-wrapper .sidebar-wrapper .sidebar-user-details .user-profile img.profile-thumb { width: 90px; height: 90px; padding: 7px; border: 2px solid #cd9d63; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; box-shadow: 0 0 15px black; margin: 0 auto; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .page-wrapper .sidebar-wrapper .sidebar-user-details .user-profile h6.profile-name { margin: 10px 0 0 0; font-weight: 400; color: #abaaaf; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions { display: flex; align-items: center; justify-content: center; margin-top: 20px; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li { border-right: 1px solid #0c0c0c; border-left: 1px solid #262626; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li a { font-size: .65rem; text-align: center; display: block; width: 50px; color: #abaaaf; position: relative; padding: 3px 0; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li a i { font-size: 1.2rem; margin: auto; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li a .count-label { position: absolute; top: 0; right: 12px; width: 8px; height: 8px; border: 2px solid #cd9d63; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li a .count-label.red { border: 2px solid #f1614a; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li a .count-label.green { border: 2px solid #86a23b; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li a .count-label.yellow { border: 2px solid #ffc200; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li a:hover { color: #cd9d63; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li:last-child { border-right: 0; } .page-wrapper .sidebar-wrapper .sidebar-user-details ul.profile-actions > li:first-child { border-left: 0; } .page-wrapper .sidebar-wrapper .sidebar-content { position: relative; height: calc(100% - 315px) !important; } .page-wrapper .sidebar-wrapper .sidebar-menu { padding-bottom: 10px; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li a { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-decoration: none; position: relative; padding: 5px 35px 5px 15px; width: 100%; color: #abaaaf; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li a i { margin-right: 7px; font-size: 1.2rem; color: #727176; width: 32px; height: 32px; padding: 5px; display: flex; align-items: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li a .menu-text { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; white-space: nowrap; text-overflow: ellipsis; -ms-flex-negative: 1; flex-shrink: 1; overflow: hidden; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li a:hover { background: #0e0e0e; color: #ffffff; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li a:hover i { color: #cd9d63; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active-page-link { position: relative; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active-page-link a { background: #292929; color: #ffffff; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active-page-link a i { color: #cd9d63; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active-page-link:after { content: ''; position: absolute; width: 0; height: 0; top: 50%; right: 0px; margin: -10px 0 0 0; border: 10px solid; border-color: transparent #f8f4ee transparent transparent; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active a i { color: #cd9d63; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active a.current-page { background: #292929; position: relative; color: #cd9d63; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active a.current-page:after { content: ''; position: absolute; right: -1px; top: 1px; background: url(../img/menu-arrow.svg); background-size: 100%; width: 9px; height: 40px; } .page-wrapper .sidebar-wrapper .sidebar-menu ul li.active .sidebar-submenu { display: block; } .page-wrapper .sidebar-wrapper .sidebar-menu .sidebar-dropdown > a:after { font-family: "icomoon"; font-weight: 100; font-size: 1rem; content: "\e911"; display: inline-block; position: absolute; right: 15px; top: 13px; -webkit-transition: -webkit-transform .3s ease; transition: -webkit-transform .3s ease; transition: transform .3s ease; transition: transform .3s ease, -webkit-transform .3s ease; } .page-wrapper .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu { display: none; } .page-wrapper .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul { padding: 0; margin-left: 12px; } /*.page-wrapper .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul li a { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 11px 35px 11px 42px; font-size: .8rem; } .page-wrapper .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul li a:before { font-family: "icomoon"; font-weight: 700; content: "\e91c"; margin: 0 10px 0 0; font-size: .5rem; } .page-wrapper .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul li a:hover { background: #292929; } .page-wrapper .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active > a:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); right: 15px; }*/ .page-wrapper .page-content { display: inline-block; width: 100%; -webkit-transition: padding-left 0.5s ease; -moz-transition: padding-left 0.5s ease; -ms-transition: padding-left 0.5s ease; -o-transition: padding-left 0.5s ease; transition: padding-left 0.5s ease; padding: 0 0 0 230px; } .page-wrapper.pinned .page-content { padding-left: 65px; } .page-wrapper.pinned .sidebar-wrapper .sidebar-user-details .user-profile img.profile-thumb { width: 50px; height: 50px; } .page-wrapper.pinned .sidebar-wrapper .sidebar-user-details .user-profile h6.profile-name { max-width: 40px; margin: 10px auto 0 auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .page-wrapper.sidebar-hovered .sidebar-wrapper .sidebar-user-details .user-profile img.profile-thumb { width: 90px; height: 90px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .page-wrapper.sidebar-hovered .sidebar-wrapper .sidebar-user-details .user-profile h6.profile-name { max-width: 150px; } @media screen and (max-width: 768px) { .page-wrapper .sidebar-wrapper { left: -265px; } .page-wrapper.toggled .sidebar-wrapper { left: 15px; } .page-wrapper.toggled .header { padding-left: 245px !important; } .page-wrapper .page-content { padding-left: 0; } .page-wrapper.pinned .page-content { padding-left: 0; } } @media (min-width: 768px) { .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper { width: 65px; } .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-menu .sidebar-submenu, .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-menu ul > li > a > span, .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-menu ul > li > a::after { display: none !important; } } .main-container { margin: 0; padding: 1.5rem; min-height: calc(100vh - 0px); } /************************************************ ************************************************ Page Header ************************************************ ************************************************/ .page-header { padding: 0; margin: 0 0 15px 0; display: flex; align-items: center; justify-content: space-between; } .app-actions { display: flex; flex-direction: row; } .app-actions li a { padding: .5rem 1rem; display: flex; align-items: center; font-size: .75rem; color: #ffffff; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .app-actions li a i { font-size: 1rem; margin: 0 .4rem 0 0; } .app-actions li a:hover { background: #c48c48; color: #ffffff; } @media (max-width: 576px) { /*.app-actions { display: none; }*/ .page-header { display: block; } } /************************************************ ************************************************ Re Usable Classes ************************************************ ************************************************/ .chart-height { position: relative; height: 250px; } .chart-height-md { position: relative; height: 190px; } .chart-height-md1 { position: relative; height: 245px; } .chart-height-md2 { position: relative; height: 200px; } .chart-height-sm { position: relative; height: 150px; } .chart-height-xs { position: relative; height: 120px; } .h-350 { min-height: 350px; } .h-150 { height: 150px; } .h-200 { min-height: 200px; } /************************************************ ************************************************ Login, Signup, Lock and Error Screens ************************************************ ************************************************/ .error-screen { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; color: #ffffff; height: 100vh; } .error-screen h1 { font-family: 'Erica One'; font-size: 15rem; font-weight: 400; } .error-screen h5 { margin-bottom: 1rem; line-height: 150%; font-size: 1rem; font-weight: 400; } .error-screen .btn { padding: .5rem 1rem; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .login-screen { position: relative; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: 60px auto; min-width: 320px; max-width: 353px; } .login-screen .login-logo { margin: 1rem 0 2rem 0; display: flex; font-size: 2rem; font-weight: 700; } .login-screen .login-logo img { max-width: 210px; } .login-screen .login-box { padding: 1.5rem; } .login-screen .login-box h5 { margin: 0 0 1rem 0; font-size: .85rem; line-height: 150%; font-weight: 400; color: #333333; } .login-screen .actions { margin-bottom: .5rem; display: flex; justify-content: flex-end; align-items: center; } .login-screen .actions a.link { color: #333333; } .login-screen .actions a.link:hover { color: #666666; } .login-screen .actions .btn { margin-left: 10px; } .login-screen .actions.align-left { justify-content: flex-start; } .login-screen .forgot-pwd { margin-bottom: .5rem; display: flex; justify-content: flex-start; align-items: center; } .login-screen .forgot-pwd a { color: #333333; } .login-screen .forgot-pwd a:hover { color: #666666; } .login-screen .custom-control { min-height: auto; color: #777b82; } .login-screen p.info { padding: 0; margin: 0 0 20px 0; line-height: 150%; color: #777b82; text-align: center; } .or { position: relative; text-align: center; margin-bottom: 20px; } .or::before { content: ''; position: absolute; top: 50%; left: 15%; width: 70%; height: 1px; background-color: #eff1f5; } .or span { position: relative; background-color: #ffffff; padding: 0 10px; z-index: 10; } /*********************** *********************** Pages *********************** ***********************/ /************************************************ ************************************************ User Profile Page ************************************************ ************************************************/ .skillset-container { padding: 1rem; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 1rem; display: flex; flex-direction: column; } .skillset-container h5 { font-size: 1rem; margin: 0 0 1rem 0; } .skillset-container .categories { margin: 5rem 0 0 0; display: flex; align-items: center; flex-direction: row; flex-wrap: wrap; } .skillset-container .categories .badge { margin: 2px; } /************************************************ ************************************************ Icons Page ************************************************ ************************************************/ .icons { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; align-content: center; } .icons span { font-size: 1rem; text-align: center; cursor: pointer; width: 60px; height: 60px; line-height: 60px; color: #333333; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; background: #f8f4ee; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: 2px; } .icons span:hover { background-color: #cd9d63; color: #ffffff; } /************************************************ ************************************************ Search Results Page ************************************************ ************************************************/ .search-result { margin-bottom: 3rem; } .search-result a { color: #333333; font-size: 1rem; margin: 0 0 1rem 0; font-weight: 600; display: inline-block; } .search-result p.title { font-size: .9rem; color: #777b82; margin: 0 0 .7rem 0; } .search-result p.desc { font-size: .8rem; margin: 0; } @media (max-width: 767px) { .search-result { max-width: 100%; } } /************************************************ ************************************************ Invoice Page ************************************************ ************************************************/ .invoice-container { padding: 1rem; } .invoice-container .invoice-header .invoice-logo { margin: .8rem 0 0 0; display: inline-block; } .invoice-container .invoice-header .invoice-logo img { max-width: 130px; } .invoice-container .invoice-header address { font-size: .8rem; color: #777b82; margin: 0; } .invoice-container .invoice-details { margin: 1rem 0 0 0; padding: 1rem; line-height: 180%; background: #f8f4ee; border: 1px solid #e4dacd; } .invoice-container .invoice-details .invoice-num { text-align: right; font-size: .8rem; } .invoice-container .invoice-body { padding: 1rem 0 0 0; } .invoice-container .invoice-footer { text-align: center; font-size: .7rem; margin: 5px 0 0 0; } .invoice-status { text-align: center; padding: 1rem; background: #fffefc; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: 1px solid #e4dacd; margin-bottom: 1rem; } .invoice-status h2.status { margin: 0 0 .8rem 0; } .invoice-status h5.status-title { margin: 0 0 .8rem 0; color: #777b82; } .invoice-status p.status-type { margin: 0; padding: 0; line-height: 150%; } .invoice-status i { font-size: 2rem; margin: 0 0 1rem 0; display: inline-block; padding: 1rem; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; color: #cd9d63; } @media (max-width: 767px) { .invoice-container { padding: 1rem; } } /************************************************ ************************************************ Timeline Page ************************************************ ************************************************/ .timeline { position: relative; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 5rem; margin: 0 auto; overflow: hidden; } .timeline:after { content: ""; position: absolute; top: 0; left: 50%; margin-left: -2px; border-right: 2px dashed #e0d9cc; height: 100%; display: block; } .timeline-row { padding-left: 50%; position: relative; margin-bottom: 30px; } .timeline-row .timeline-time { position: absolute; right: 50%; top: 15px; text-align: right; margin-right: 20px; color: #333333; font-size: 1.5rem; } .timeline-row .timeline-time small { display: block; font-size: .8rem; } .timeline-row .timeline-content { position: relative; padding: 20px 30px; background: #fffefc; border: 1px solid #e4dacd; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; } .timeline-row .timeline-content:after { content: ""; position: absolute; top: 20px; height: 16px; width: 16px; background: #fffefc; } .timeline-row .timeline-content:before { content: ""; position: absolute; top: 20px; right: -50px; width: 20px; height: 20px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; z-index: 10; background: #fffefc; border: 2px dashed #e0d9cc; } .timeline-row .timeline-content h4 { margin: 0 0 20px 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 150%; } .timeline-row .timeline-content p { margin-bottom: 30px; line-height: 150%; } .timeline-row .timeline-content i { font-size: 2rem; color: #cd9d63; line-height: 100%; padding: 12px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; background: #fffefc; border: 1px solid #e4dacd; margin-bottom: 10px; display: inline-block; } .timeline-row .timeline-content .thumbs { margin-bottom: 20px; display: flex; } .timeline-row .timeline-content .thumbs img { margin: 5px; max-width: 60px; } .timeline-row .timeline-content .badge { color: #ffffff; } .timeline-row:nth-child(even) .timeline-content { margin-left: 40px; text-align: left; } .timeline-row:nth-child(even) .timeline-content:after { left: -10px; right: initial; border: 1px solid #e4dacd; border-bottom: 0; border-left: 0; transform: rotate(-135deg); } .timeline-row:nth-child(even) .timeline-content:before { left: -52px; right: initial; } .timeline-row:nth-child(odd) { padding-left: 0; padding-right: 50%; } .timeline-row:nth-child(odd) .timeline-time { right: auto; left: 50%; text-align: left; margin-right: 0; margin-left: 20px; } .timeline-row:nth-child(odd) .timeline-content { margin-right: 40px; } .timeline-row:nth-child(odd) .timeline-content:after { right: -10px; border: 1px solid #e4dacd; border-left: 0; border-bottom: 0; transform: rotate(45deg); } @media (max-width: 992px) { .timeline { padding: 15px; } .timeline:after { border: 0; } .timeline .timeline-row:nth-child(odd) { padding: 0; } .timeline .timeline-row:nth-child(odd) .timeline-time { position: relative; top: 0; left: 0; margin: 0 0 10px 0; } .timeline .timeline-row:nth-child(odd) .timeline-content { margin: 0; } .timeline .timeline-row:nth-child(odd) .timeline-content:before { display: none; } .timeline .timeline-row:nth-child(odd) .timeline-content:after { display: none; } .timeline .timeline-row:nth-child(even) { padding: 0; } .timeline .timeline-row:nth-child(even) .timeline-time { position: relative; top: 0; left: 0; margin: 0 0 10px 0; text-align: left; } .timeline .timeline-row:nth-child(even) .timeline-content { margin: 0; } .timeline .timeline-row:nth-child(even) .timeline-content:before { display: none; } .timeline .timeline-row:nth-child(even) .timeline-content:after { display: none; } } /************************************************ ************************************************ Accounts Settings Page ************************************************ ************************************************/ .account-settings .user-profile { margin: 0 0 1rem 0; padding-bottom: 1rem; text-align: center; } .account-settings .user-profile .user-avatar { margin: 0 0 1rem 0; } .account-settings .user-profile .user-avatar img { width: 90px; height: 90px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; } .account-settings .user-profile h5.user-name { margin: 0 0 .5rem 0; } .account-settings .user-profile h6.user-email { margin: 0; font-size: .8rem; font-weight: 400; } .account-settings .about { margin: 1rem 0 0 0; font-size: .8rem; } /************************************************ ************************************************ Grid Page ************************************************ ************************************************/ .grid-container .column { border: 1px solid #cd9d63; background: #cd9d63; color: #ffffff; padding: .5rem .8rem; font-size: .725rem; margin: .2rem 0; border-radius: 2px; } /************************************************ ************************************************ Thumbnails/Images Page ************************************************ ************************************************/ .avatar-group { display: flex; align-items: center; } .avatar-group .avatar { display: inline-block; } .avatar { width: 48px; height: 48px; position: relative; margin: .5rem; } .avatar img { width: 100%; height: 100%; object-fit: cover; } .avatar img.circle { border-radius: 100% !important; } .avatar img.half-circle { border-radius: 30% !important; } .avatar img.rounded { border-radius: 10% !important; } .avatar.xs { width: 24px; height: 24px; } .avatar.sm { width: 36px; height: 36px; } .avatar.md { width: 48px; height: 48px; } .avatar.lg { width: 64px; height: 64px; } .avatar.xl { width: 72px; height: 72px; } .avatar.xxl { width: 90px; height: 90px; } .avatar.xxxl { width: 120px; height: 120px; } .text-avatar-group { display: flex; align-items: center; } .text-avatar { display: flex; justify-content: center; align-items: center; margin: .5rem; background: #cd9d63; color: #ffffff; font-weight: 700; border-radius: 4px; position: relative; } .text-avatar.secondary { background: #615f5f; } .text-avatar.success { background: #86a23b; } .text-avatar.warning { background: #ffc200; } .text-avatar.danger { background: #f1614a; } .text-avatar.info { background: #2f71c1; } .text-avatar.dark { background: #1b1b1b; } .text-avatar.xs { width: 24px; height: 24px; font-size: 11px; } .text-avatar.sm { width: 36px; height: 36px; font-size: 14px; } .text-avatar.md { width: 48px; height: 48px; font-size: 18px; } .text-avatar.lg { width: 64px; height: 64px; font-size: 21px; } .text-avatar.xl { width: 72px; height: 72px; font-size: 30px; } .text-avatar.xxl { width: 90px; height: 90px; font-size: 36px; } .text-avatar.xxxl { width: 120px; height: 120px; font-size: 48px; } .text-avatar.circle { border-radius: 100% !important; } .text-avatar.rounded { border-radius: 10% !important; } /*************** Chat Widget ***************/ .chats { position: relative; padding: 0; } .chats li { margin-bottom: 25px; } .chats li.chats-left, .chats li.chats-right { position: relative; } .chats li img { width: 50px; height: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .chats li .chats-avatar { float: left; } .chats li.chats-right > .chats-avatar { float: right; } .chats li .chats-name { font-size: .75rem; text-align: center; margin-top: 5px; color: #777b82; } .chats li .chats-hour { margin: 0 0 0 70px; padding: 2px; margin-bottom: 20px; font-size: .65rem; } .chats li .chats-hour > span { font-size: 16px; color: #86a23b; } .chats li .chats-text { margin: 0 0 0 70px; padding: 15px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; background-color: #f8f4ee; left: 15px; line-height: 200%; } .chats li .chats-text:before { content: ''; position: absolute; width: 0; height: 0; top: 25px; left: 50px; border: 10px solid; border-color: transparent #f8f4ee transparent transparent; } .chats li.chats-right > .chats-text { text-align: right; right: 16px; margin: 0 70px 0 0; background-color: #f1e8dc; } .chats li.chats-right > .chats-text:before { left: auto; right: 50px; border-color: transparent transparent transparent #f1e8dc; } .chats li.chats-right > .chats-hour { text-align: right; margin: 0 70px 0 0; } /************************************************ ************************************************ Pricing Page ************************************************ ************************************************/ .pricing-plan { margin: 0 0 1.5rem 0; width: 100%; position: relative; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .pricing-plan .pricing-header { padding: 0; margin-bottom: 1rem; text-align: center; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ -webkit-border-radius: 4px 4px 0px 0px; -moz-border-radius: 4px 4px 0px 0px; border-radius: 4px 4px 0px 0px; } .pricing-plan .pricing-header .pricing-title { font-size: 1.2rem; color: #ffffff; padding: 1rem 0; text-transform: uppercase; font-weight: 600; margin: 0; text-shadow: 0 30px 10px rgba(0, 0, 0, 0.15); } .pricing-plan .pricing-header .pricing-cost { color: #ffffff; padding: 1rem 0; font-size: 2.5rem; font-weight: 700; text-shadow: 0 30px 10px rgba(0, 0, 0, 0.15); } .pricing-plan .pricing-header .pricing-save { color: #ffffff; padding: .8rem 0; font-size: 1rem; font-weight: 700; } .pricing-plan .pricing-header.secondary { background: #212020; /* Old browsers */ background: -moz-linear-gradient(top, #212020 0%, #615f5f 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #212020), color-stop(100%, #615f5f)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #212020 0%, #615f5f 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #212020 0%, #615f5f 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #212020 0%, #615f5f 100%); /* IE10+ */ background: linear-gradient(to bottom, #212020 0%, #615f5f 100%); /* W3C */ } .pricing-plan .pricing-features { padding: 0; margin: 20px 0; text-align: left; } .pricing-plan .pricing-features li { padding: 15px 15px 15px 40px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; position: relative; line-height: 100%; } .pricing-plan .pricing-features li:before { position: absolute; left: 15px; top: 15px; font-size: 1rem; color: #000000; content: "\e9ec"; font-family: 'icomoon'; } .pricing-plan .pricing-footer { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; text-align: center; padding: 1rem 0 2rem 0; } @media (max-width: 767px) { .pricing-plan .pricing-header { text-align: center; } .pricing-plan .pricing-header i { display: block; float: none; margin-bottom: 1.5rem; } } /************************************************ ************************************************ Coming Soon ************************************************ ************************************************/ .countdown-container { padding: 4rem 0; text-align: center; color: #ffffff; } .countdown-container h3.countdown-title { font-family: 'ZCOOL KuaiLe', cursive; } #countdown { margin: 70px auto 30px auto; display: flex; justify-content: center; font-family: 'ZCOOL KuaiLe', cursive; } #countdown li { min-width: 180px; display: flex; align-items: center; flex-direction: column; } #countdown li.num { font-size: 6rem; font-weight: 600; line-height: 120%; color: #ad6c14; } #countdown li .text { font-size: .9rem; font-weight: 400; display: block; padding: .7rem 0; font-style: italic; line-height: 120%; color: #ffffff; } @media (max-width: 992px) { #countdown li { min-width: 150px; } #countdown li.num { font-size: 3rem; } #countdown li .text { font-size: .8rem; } } @media (max-width: 767px) { #countdown li { min-width: 90px; } #countdown li.num { font-size: 2rem; } #countdown li .text { font-size: .7rem; } } .countdown-form { display: inline-block; margin: 2rem 0 1rem 0; position: relative; font: 400 .8rem 'Open Sans', sans-serif; } .countdown-form input.countdown-email { width: 320px; height: 54px; padding: 13px 5px 13px 20px; float: left; font-size: .9rem; color: #333333; border: 0; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; outline: none; } .countdown-form .countdown-btn { position: absolute; right: 5px; top: 5px; border: none; height: 44px; color: #ffffff; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ padding: 0 15px; font-size: .9rem; font-weight: 600; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .countdown-form .countdown-btn:hover, .countdown-form .countdown-btn:focus { color: #ffffff; background: #cd9d63; /* Old browsers */ background: -moz-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cd9d63), color-stop(100%, #ad6c14)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* IE10+ */ background: linear-gradient(to bottom, #cd9d63 0%, #ad6c14 100%); /* W3C */ outline: none; cursor: pointer; } .countdown-note { color: #ffffff; } .social-btns { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; padding: 50px 0 0 0; } .social-btns .social-icon { display: flex; align-items: center; justify-content: center; cursor: pointer; margin: .7rem; width: 48px; height: 48px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; text-align: center; position: relative; z-index: 1; color: #ffffff; background: rgba(175, 119, 41, 0.1); -webkit-transition: background 0.2s, color 0.2s; -moz-transition: background 0.2s, color 0.2s; transition: background 0.2s, color 0.2s; } .social-btns .social-icon:after { top: -7px; left: -7px; padding: 7px; box-shadow: 0 0 0 3px #ffffff; -webkit-transition: -webkit-transform 0.2s, opacity 0.2s; -webkit-transform: scale(0.8); -moz-transition: -moz-transform 0.2s, opacity 0.2s; -moz-transform: scale(0.8); -ms-transform: scale(0.8); transition: transform 0.2s, opacity 0.2s; transform: scale(0.8); opacity: 0; pointer-events: none; position: absolute; width: 100%; height: 100%; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; content: ''; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } .social-btns .social-icon:before { speak: none; font-size: 24px; line-height: 48px; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; display: block; -webkit-font-smoothing: antialiased; } .social-btns .social-icon:hover { background: #ffffff; color: #cd9d63; } .social-btns .social-icon:hover:after { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /************************************************ ************************************************ Widgets CSS ************************************************ ************************************************/ .graph-status-right { display: flex; justify-content: flex-end; margin: 0; } .graph-status-right .graph-status { display: flex; align-items: center; margin: 0 0 0 20px; } .graph-status-right .graph-status .status-icon { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; display: inline-flex; align-items: center; justify-content: center; height: 44px; width: 44px; margin-right: 10px; } .graph-status-right .graph-status .status-icon i { font-size: 1.4rem; color: #ffffff; } .graph-status-right .graph-status .status-info { flex-direction: row; } .graph-status-right .graph-status .status-info .status-title { font-size: .8rem; } .graph-status-right .graph-status .status-info .percentage { font-size: .75rem; font-weight: 600; } .graph-status-right .graph-status.primary .status-icon { background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ } .graph-status-right .graph-status.primary .status-info .percentage { color: #cd9d63; } .graph-status-right .graph-status.secondary .status-icon { background: #86a23b; /* Old browsers */ background: -moz-linear-gradient(top, #86a23b 0%, #335113 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #86a23b), color-stop(100%, #335113)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #86a23b 0%, #335113 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #86a23b 0%, #335113 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #86a23b 0%, #335113 100%); /* IE10+ */ background: linear-gradient(to bottom, #86a23b 0%, #335113 100%); /* W3C */ } .graph-status-right .graph-status.secondary .status-info .percentage { color: #615f5f; } .monthly-avg { padding: 1rem .5rem; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; text-align: center; } .monthly-avg h5 { margin: 15px 20px 35px 20px; } .monthly-avg .avg-block { margin-bottom: 35px; } .monthly-avg .avg-block h3.avg-total { margin: 0; } .monthly-avg .avg-block h6.avg-label { margin: auto; } .monthly-avg .avg-block:last-child { margin-bottom: 0; } @media (max-width: 767px) { .monthly-avg { margin: 30px 0; } } a.graph-notify { position: absolute; top: -5px; right: 30px; display: inline-flex; } a.graph-notify i { font-size: 1.5rem; padding: 5px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ color: #ffffff; } .task-list-container { display: flex; flex-direction: row; justify-content: space-around; padding: 0; } .task-list-container .task-list-item { display: flex; align-items: center; margin: 0; } .task-list-container .task-list-item .task-icon { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; display: inline-flex; align-items: center; justify-content: center; height: 36px; width: 36px; margin-right: 10px; } .task-list-container .task-list-item .task-icon i { font-size: 1rem; color: #ffffff; } .task-list-container .task-list-item .task-info { flex-direction: row; } .task-list-container .task-list-item .task-info h6.task-title { margin: 0; line-height: 100%; font-weight: 700; } .task-list-container .task-list-item .task-info p.amount-spend { font-size: .75rem; font-weight: 600; margin: 0; color: #777b82; } .task-list-container .task-list-item.primary .task-icon { background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ } .task-list-container .task-list-item.secondary .task-icon { background: #335113; /* Old browsers */ background: -moz-linear-gradient(top, #335113 0%, #86a23b 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #335113), color-stop(100%, #86a23b)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #335113 0%, #86a23b 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #335113 0%, #86a23b 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #335113 0%, #86a23b 100%); /* IE10+ */ background: linear-gradient(to bottom, #335113 0%, #86a23b 100%); /* W3C */ } ul.team-activity { margin-bottom: 5px; } ul.team-activity li.product-list { border-bottom: 1px dotted #e4dacd; } ul.team-activity li.product-list .product-time { border-right: 1px solid #e4dacd; float: left; } ul.team-activity li.product-list .product-time .badge { -webkit-border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; min-width: 90px; text-align: left; font-size: .75rem; margin: 0 -1px 17px 0; } ul.team-activity li.product-list .product-time p.date { color: #777b82; font-size: .75rem; margin: 10px 0 0 0; } ul.team-activity li.product-list .product-info { padding: 15px 0 16px 0; margin-left: 105px; display: flex; align-items: center; justify-content: space-between; flex-direction: row; } ul.team-activity li.product-list .product-info > .activity h6 { margin: 0; } ul.team-activity li.product-list .product-info > .activity p { margin: 4px 0 0 0; color: #777b82; font-size: .75rem; } ul.team-activity li.product-list .product-info > .status { min-width: 150px; } ul.team-activity li.product-list .product-info > .status .progress { margin: 10px 0 5px 0; height: 5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } ul.team-activity li.product-list .product-info > .status .progress .progress-bar { background: #212020; } ul.team-activity li.product-list .product-info > .status p { font-size: .7rem; color: #777b82; } ul.team-activity li.product-list:last-child { border-bottom: 0; } .vs { margin: auto; width: 0; text-align: center; position: relative; height: 100%; } .vs:before { position: absolute; background: #e4dacd; width: 1px; height: 150px; content: ""; top: 50%; left: 0; margin-top: -75px; } .vs:after { position: absolute; top: 50%; left: 0; content: "vs"; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; width: 36px; height: 36px; background: #e4dacd; margin-left: -18px; margin-top: -18px; color: #333333; line-height: 36px; text-align: center; } @media (max-width: 992px) { .vs { margin: 30px auto; min-height: 90px; } .vs:before { height: 90px; margin-top: -45px; } } table.projects-table { margin: 0; font-size: .825rem; border: 0; background: #fffefc; -webkit-border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px; } table.projects-table thead th { background-color: #cd9d63; padding: .8rem 1.25rem; border: 0; color: #ffffff; } table.projects-table td { padding: .5rem 1rem; vertical-align: middle; border-top: 0; } table.projects-table .project-details { display: flex; flex-direction: row; align-items: center; } table.projects-table .project-details img.avatar { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; height: 40px; width: 40px; margin: 0 .5rem 0 0; } table.projects-table .project-details .project-info { display: flex; flex-direction: column; } table.projects-table .project-details .project-info p { line-height: 150%; margin: 0; font-size: .8rem; font-weight: 600; } table.projects-table .project-details .project-info p:last-of-type { font-size: .725rem; font-weight: 400; color: gray; } table.projects-table .project-details .project-info .progress { margin: 0; height: 6px; } table.projects-table .project-details .project-info .status { display: flex; align-items: center; } table.projects-table .project-details .project-info .status i { display: inline-block; margin-right: 5px; font-size: 1.2rem; vertical-align: middle; color: #cd9d63; } table.projects-table .member figure, table.projects-table .member .member-info { display: inline-block; vertical-align: top; margin: 0; } table.projects-table .member img { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; height: 40px; width: 40px; } .draggable-events { margin: 50px 0 0 0; } .draggable-events h6 { line-height: 100%; margin: 0 0 10px 0; } .draggable-events #externalDraggableEvents { margin: 0 0 .5rem 0; } .draggable-events .fc-event { padding: .2rem .5rem; margin: 0 0 1px 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; cursor: move; } .custom-btn-group { display: flex; flex-wrap: wrap; } .custom-btn-group.right-align { justify-content: flex-end; } .custom-btn-group .btn { margin: .3rem; } .custom-btn-group .btn-sm { margin: .2rem .1rem; } .custom-icon-group { display: flex; flex-wrap: wrap; } .custom-icon-group.right-align { justify-content: flex-end; } .custom-icon-group .btn { margin: .3rem; } .custom-icon-group .btn i { margin: 0; } .custom-icon-group .btn-sm { margin: .2rem .1rem; } .custom-icon-group .btn-sm i { margin: 0; } .custom-actions-btns { margin: auto; display: flex; justify-content: flex-end; } .custom-actions-btns .btn { margin: .3rem 0 .3rem .3rem; } .custom-dropdown-group .dropdown { margin: 0 .3rem .3rem 0; display: inline-block; } .custom-dropdown-group .btn-toolbar { margin: 0 .3rem .3rem 0; display: inline-block; } .todo-container { margin: 0 0 0 10px; } .todo-container .todo-body { margin: 0; padding: 0; border-left: 1px solid #e4dacd; } .todo-container .todo-body li.todo-list { position: relative; display: block; cursor: pointer; } .todo-container .todo-body li.todo-list .dot { position: absolute; top: 4px; left: -10px; color: #cd9d63; } .todo-container .todo-body li.todo-list .dot:before { font-size: 1.2rem; content: "\e836"; font-family: 'icomoon'; background: #fffefc; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .todo-container .todo-body li.todo-list .todo-info { line-height: 100%; margin: 0 0 0 20px; padding-bottom: 20px; } .todo-container .todo-body li.todo-list .todo-info p { line-height: 100%; margin-bottom: .5rem; } .todo-container .todo-body li.todo-list .todo-info p span.time { float: right; font-size: .8rem; } .todo-container .todo-body li.todo-list .todo-info p.dt { color: #777b82; font-size: .775rem; } .todo-container .todo-body li.todo-list .todo-info .todo-type { color: #777b82; font-size: .825rem; } .todo-container .todo-body li.todo-list.done { text-decoration: line-through; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: rgba(0, 0, 0, 0.4); } .todo-container .todo-body li.todo-list.done .dot:before { content: "\e86c"; font-family: 'icomoon'; } .todo-container .todo-body li.todo-list:last-child .todo-info { padding-bottom: 0; } ul.recent-links { margin: 0; } ul.recent-links li a { padding: .7rem 0 .7rem 0; position: relative; color: #333333; display: flex; align-items: center; } ul.recent-links li a:before { content: '\e968'; font-family: 'icomoon' !important; margin: 0 10px 0 0; color: #cd9d63; font-size: 1.2rem; } ul.recent-links li a:hover { text-decoration: underline; } ul.recent-links li:first-child a { padding-top: 0; } ul.recent-links li:last-child a { padding-bottom: 0; } ul.bookmarks { margin: 0; } ul.bookmarks li a { padding: .7rem 0 .7rem 0; position: relative; color: #333333; display: flex; align-items: center; } ul.bookmarks li a:before { content: '\e838'; font-family: 'icomoon' !important; margin: 0 10px 0 0; color: #cd9d63; font-size: 1rem; } ul.bookmarks li a:hover { text-decoration: underline; } ul.bookmarks li:first-child a { padding-top: 0; } ul.bookmarks li:last-child a { padding-bottom: 0; } ul.statistics { margin: 0; } ul.statistics li { display: flex; align-items: center; margin: 0 0 15px 0; } ul.statistics li .stat-icon { background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; margin: 0 10px 0 0; } ul.statistics li .stat-icon i { font-size: 1rem; color: #ffffff; } .social-tile { position: relative; padding: 1.2rem 1rem; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: 0 0 1rem 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .social-tile .social-icon { height: 60px; width: 60px; display: flex; align-items: center; justify-content: center; margin: 0 0 15px 0; background: #f1eae1; /* Old browsers */ background: -moz-linear-gradient(top, #f1eae1 0%, #f8f4ee 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f1eae1), color-stop(100%, #f8f4ee)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f1eae1 0%, #f8f4ee 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f1eae1 0%, #f8f4ee 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f1eae1 0%, #f8f4ee 100%); /* IE10+ */ background: linear-gradient(to bottom, #f1eae1 0%, #f8f4ee 100%); /* W3C */ -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; border: 1px solid #e4dacd; } .social-tile .social-icon i { font-size: 1.5rem; color: #cd9d63; } .social-tile h2 { margin: 0; } .social-tile p { color: #777b82; } .share-thoughts-container .form-control { margin: 0 0 .3rem 0; } .share-thoughts-container .share-thoughts-footer { display: flex; align-items: center; justify-content: space-between; } .share-thoughts-container .share-thoughts-footer .share-icons { display: flex; } .share-thoughts-container .share-thoughts-footer .share-icons a { width: 32px; height: 32px; margin: 0 .3rem 0 0; display: flex; align-items: center; justify-content: center; background: #f8f4ee; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .share-thoughts-container .share-thoughts-footer .share-icons a i { color: #333333; font-size: .9rem; } .info-stats { text-align: center; margin: 1rem 0 0 0; } .info-stats span.info-label { width: 8px; height: 8px; border: 2px solid #cd9d63; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; display: inline-block; } .info-stats span.info-label.secondary { border: 2px solid #615f5f; } .info-stats h3.info-total { margin: 0; } .info-stats h2.info-total { margin: 0; } .info-stats p.info-title { margin: .3rem 0; line-height: 100%; color: #777b82; text-transform: uppercase; } .info-stats2 { background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 1rem; display: flex; align-items: center; flex-direction: row; padding: 1rem; height: calc(100% - 1rem); } .info-stats2 .info-icon { width: 50px; display: flex; align-items: center; justify-content: center; margin-right: 15px; text-align: center; } .info-stats2 .info-icon i { font-size: 2.5rem; color: #cd9d63; } .info-stats2 .sale-num h2 { margin: 0; } .info-stats2 .sale-num p { margin: 0; padding: 0; color: #ad6c14; font-weight: bold; } .timeline-activity { margin: 0; } .timeline-activity .activity-log { padding-left: 1.8rem; padding-bottom: 1.5rem; position: relative; display: flex; flex-direction: column; } .timeline-activity .activity-log:before { content: ""; position: absolute; top: 5px; left: 0px; background: #cd9d63; border: 4px solid #f3e7da; width: 15px; height: 15px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; z-index: 1; } .timeline-activity .activity-log:after { content: ""; position: absolute; left: 7px; top: 10px; border-left: 1px dashed #d2b999; height: 100%; width: 1px; } .timeline-activity .activity-log .log-name { font-weight: 600; } .timeline-activity .activity-log .log-details { font-size: .8rem; color: #777b82; } .timeline-activity .activity-log .log-time { color: #777b82; margin-left: .5rem; } .timeline-activity .activity-log:last-child { padding-bottom: 0; } .stacked-images { display: flex; } .stacked-images img { display: flex; align-items: center; justify-content: center; text-align: center; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; overflow: hidden; margin-right: -10px; margin-right: -10px; border: 3px solid #ffffff; background: #fffefc; letter-spacing: .03rem; } .stacked-images img.sm { width: 36px; height: 36px; } .stacked-images .plus { display: flex; align-items: center; justify-content: center; text-align: center; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; overflow: hidden; margin-right: -10px; margin-right: -10px; border: 3px solid #ffffff; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ letter-spacing: .03rem; font-weight: 700; font-size: .8rem; } .stacked-images .plus.sm { width: 36px; height: 36px; color: #ffffff; } ul.recent-orders li { margin-bottom: 25px; display: flex; align-items: center; flex-direction: row; } ul.recent-orders li .order-img { position: relative; } ul.recent-orders li .order-img img { height: 75px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } ul.recent-orders li .order-img .badge { position: absolute; top: 10px; left: 0px; font-weight: 400; -webkit-border-radius: 0 3px 3px 0; -moz-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0; font-size: .7rem; padding: 3px 4px 4px 4px; } ul.recent-orders li .order-details { margin-left: 15px; } ul.recent-orders li .order-details h5.order-title { margin: 0 0 10px 0; line-height: 120%; font-size: .9rem; } ul.recent-orders li .order-details p.order-desc { line-height: 120%; font-size: .8rem; } ul.recent-orders li .order-details span.order-date { color: #cd9d63; font-size: .7rem; } .income-stats-container .income-stats { margin: 0 0 1px 0; display: flex; align-items: center; flex-direction: row; } .income-stats-container .income-stats .income-graph { width: 78px; height: 78px; } .income-stats-container .income-stats .income-graph .circliful { margin: 0; } .income-stats-container .income-stats .income-info h3 { margin: 0; font-weight: 600; padding: 0; } .income-stats-container .income-stats .income-info h3 i { font-size: 1.3rem; margin-left: .3rem; } .income-stats-container .income-stats p { color: #777b82; margin: 0; } .income-stats-container .income-stats:last-child { margin-bottom: 0; } .top-agents-container { margin: 0; } .top-agents-container .top-agent { margin: 0 0 1rem 0; padding-bottom: .5rem; display: flex; align-items: flex-start; } .top-agents-container .top-agent img.avatar { -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; width: 40px; height: 40px; margin: 0 10px 0 0; } .top-agents-container .top-agent .agent-details { flex-direction: column; flex: 1; } .top-agents-container .top-agent .agent-details h6 { margin: 0 0 .5rem 0; font-size: .825rem; } .top-agents-container .top-agent .agent-details .agent-score .progress { height: 4px; margin: 0 0 .4rem 0; } .top-agents-container .top-agent .agent-details .agent-score .points { display: flex; justify-content: space-between; } .top-agents-container .top-agent .agent-details .agent-score .points .left { color: #777b82; } .top-agents-container .top-agent:last-child { margin-bottom: 0; padding-bottom: 0; } #creditCardType { display: flex; align-items: center; flex-direction: row; } #creditCardType .credit-card { margin: 5px 5px 0 0; display: inline-block; } #creditCardType .credit-card img { max-width: 36px; filter: grayscale(100%); } #creditCardType .credit-card.highlight img { filter: grayscale(10%); } /************************************************ ************************************************ Vendor Css ************************************************ ************************************************/ .wizard { margin: 0; } .btn-bs-select { padding: .375rem 1rem !important; } .bs-actionsbox, .bs-donebutton, .bs-searchbox { padding: 4px 0px; } .bootstrap-select .dropdown-menu { box-shadow: none; border: 1px solid #e4dacd; border-radius: 0; margin: 0; border-top: 0; width: inherit; padding: 3px; } .bootstrap-select .dropdown-menu.inner li.selected { background: #2f71c1; } .bootstrap-select .dropdown-menu.inner li.selected a { color: #ffffff; } .bootstrap-select .dropdown-menu.inner li.selected a:hover { pointer-events: none; background: #2f71c1; color: #ffffff; } .bootstrap-select .dropdown-menu.inner li.selected:hover { pointer-events: none; } .bootstrap-select .dropdown-menu.inner li.selected .text-muted { color: rgba(255, 255, 255, 0.7) !important; } .bootstrap-select .dropdown-menu .dropdown-header { padding: 0.5rem 0.5rem; } .bootstrap-select > .dropdown-toggle { height: 34px; line-height: 18px; font-size: .825rem; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .bootstrap-select .dropdown-item.active { background: #2f71c1; color: #ffffff; } .bootstrap-select .dropdown-item:focus { outline: none; } .bootstrap-select .dropdown-item.bg-success { color: #ffffff; } .bootstrap-select .dropdown-item.bg-success:hover { background: #778f34 !important; } .bootstrap-select .dropdown-item.bg-danger { color: #ffffff; } .bootstrap-select .dropdown-item.bg-danger:hover { background: #ef4c32 !important; } .bootstrap-select .dropdown-item.bg-info { color: #ffffff; } .bootstrap-select .dropdown-item.bg-info:hover { background: #2a65ac !important; } .bootstrap-select .dropdown-item.bg-warning { color: #ffffff; } .bootstrap-select .dropdown-item.bg-warning:hover { background: #e6af00 !important; } .gallery { margin: 0 auto; } .gallery a { border: 1px solid #fff6e3; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; position: relative; overflow: hidden; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; display: block; margin: 0 0 15px 0; opacity: 1; padding: 3px; } .gallery a img { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .gallery a .overlay { top: 0; bottom: 0; left: 0; right: 0; opacity: 0; position: absolute; z-index: 20; background: rgba(0, 0, 0, 0.7); overflow: hidden; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } .gallery a .expand { position: absolute; top: 50%; left: 50%; z-index: 100; border: 2px solid #ffc200; text-align: center; color: #ffc200; line-height: 32px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; font-size: 20px; margin-left: -18px; margin-top: -18px; width: 36px; height: 36px; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } .gallery a:hover { opacity: 1; } .gallery a:hover .overlay { opacity: 1; } .gallery a:hover span.expand { width: 36px; height: 36px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .photo-gallery img { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin: 0 0 .8rem 0; } .jvectormap-container { width: 100%; height: 100%; position: relative; overflow: hidden; touch-action: none; } .jvectormap-tip { position: absolute; display: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; background: #000000; color: #ffffff; font-size: .75rem; padding: 6px 12px; } @keyframes showHideDot { 0% { opacity: 0; } 50% { opacity: 1; } 60% { opacity: 1; } 100% { opacity: 0; } } .jvectormap-marker { opacity: 0; animation: showHideDot 1.5s ease-in-out infinite; } .dataTables_paginate .pagination .page-item.disabled .page-link { background: transparent; } .dataTables_paginate .pagination .page-item .page-link { font-size: .75rem; } .dataTables_paginate .pagination .page-item .page-link:hover { background: #f3e7da; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .dataTables_paginate .pagination .page-item.active .page-link { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } button.dt-button, div.dt-button, a.dt-button { border-radius: 30px !important; border: 0 !important; color: #ffffff !important; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ } /************************************************ ************************************************ Bootstrap Overwrite Css ************************************************ ************************************************/ .accordion .accordion-container { padding: 0; margin: 0 0 .3rem 0; background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .accordion .accordion-container .accordion-header { padding: .8rem 1rem; } .accordion .accordion-container .accordion-header a { color: #ad6c14; cursor: pointer; font-weight: 600; } .accordion .accordion-container .accordion-header a.collapsed { color: #333333; } .accordion .accordion-container .accordion-header a:hover { color: #cd9d63; } .accordion .accordion-container .accordion-header a i.icon { margin-right: .5rem; font-size: 1.3rem; vertical-align: middle; } .accordion .accordion-container .accordion-body { padding: 0 1.5rem 1.5rem 1.5rem; } .accordion .accordion-container:last-child .accordion-header { border-radius: 0 0 5px 5px; } .accordion .accordion-container:first-child .accordion-header { border-radius: 5px 5px 0 0; } .accordion.toggle-icons a { position: relative; display: block; } .accordion.toggle-icons a[aria-expanded="true"]:before { position: absolute; right: 0; top: 0; font-size: 1.3rem; content: "\e916"; font-family: 'icomoon' !important; } .accordion.toggle-icons a[aria-expanded="false"]:before { position: absolute; right: 0; top: 0; font-size: 1.3rem; content: "\e90f"; font-family: 'icomoon' !important; } .accordion.lg .accordion-container { padding: 0; } .accordion.lg .accordion-container .accordion-header { padding: 1.25rem 1.5rem; } .alert { margin-bottom: .5rem; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; border: 0; padding: .75rem 1rem; font-size: .8rem; color: #ffffff; display: flex; align-items: center; } .alert .alert-link { color: #ffffff; font-weight: 600; margin-left: 5px; } .alert.alert-primary { color: #ffffff; background: #cd9d63; } .alert.alert-primary hr { border-top-color: #d3a976; } .alert.alert-secondary { color: #ffffff; background: #615f5f; } .alert.alert-secondary hr { border-top-color: #6e6c6c; } .alert.alert-success { background: #86a23b; } .alert.alert-success hr { border-top-color: #95b542; } .alert.alert-danger { background: #f1614a; } .alert.alert-danger hr { border-top-color: #f37662; } .alert.alert-info { background: #2f71c1; } .alert.alert-info hr { border-top-color: #3a7ecf; } .alert.alert-warning { background: #ffc200; } .alert.alert-warning hr { border-top-color: #ffc81a; } .alert i { font-size: 1.1rem; margin-right: 10px; vertical-align: middle; } .alert .alert-link { text-decoration: underline; font-weight: 400; } .alert .alert-heading { font-weight: 600; margin-bottom: 1rem; } .alert.alert-dismissible .close { padding: .6rem 1rem; font-weight: 600; } .alert.alert-dismissible .close:hover { color: #ffffff; } .badge { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-weight: 600; padding: .35rem .7rem; line-height: 100%; vertical-align: middle; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ } .badge.badge-primary { background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ } .badge.badge-primary:hover { background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ } .badge.badge-secondary { background: #212020; /* Old browsers */ background: -moz-linear-gradient(top, #212020 0%, #615f5f 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #212020), color-stop(100%, #615f5f)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #212020 0%, #615f5f 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #212020 0%, #615f5f 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #212020 0%, #615f5f 100%); /* IE10+ */ background: linear-gradient(to bottom, #212020 0%, #615f5f 100%); /* W3C */ } .badge.badge-secondary:hover { background: #212020; /* Old browsers */ background: -moz-linear-gradient(top, #212020 0%, #615f5f 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #212020), color-stop(100%, #615f5f)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #212020 0%, #615f5f 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #212020 0%, #615f5f 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #212020 0%, #615f5f 100%); /* IE10+ */ background: linear-gradient(to bottom, #212020 0%, #615f5f 100%); /* W3C */ } .badge.badge-success { background: #86a23b; /* Old browsers */ background: -moz-linear-gradient(top, #86a23b 0%, #335113 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #86a23b), color-stop(100%, #335113)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #86a23b 0%, #335113 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #86a23b 0%, #335113 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #86a23b 0%, #335113 100%); /* IE10+ */ background: linear-gradient(to bottom, #86a23b 0%, #335113 100%); /* W3C */ } .badge.badge-success:hover { background: #86a23b; /* Old browsers */ background: -moz-linear-gradient(top, #86a23b 0%, #335113 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #86a23b), color-stop(100%, #335113)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #86a23b 0%, #335113 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #86a23b 0%, #335113 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #86a23b 0%, #335113 100%); /* IE10+ */ background: linear-gradient(to bottom, #86a23b 0%, #335113 100%); /* W3C */ } .badge.badge-info { background: #2f71c1; /* Old browsers */ background: -moz-linear-gradient(top, #2f71c1 0%, #043679 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2f71c1), color-stop(100%, #043679)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2f71c1 0%, #043679 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #2f71c1 0%, #043679 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #2f71c1 0%, #043679 100%); /* IE10+ */ background: linear-gradient(to bottom, #2f71c1 0%, #043679 100%); /* W3C */ } .badge.badge-info:hover { background: #2f71c1; /* Old browsers */ background: -moz-linear-gradient(top, #2f71c1 0%, #043679 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2f71c1), color-stop(100%, #043679)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2f71c1 0%, #043679 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #2f71c1 0%, #043679 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #2f71c1 0%, #043679 100%); /* IE10+ */ background: linear-gradient(to bottom, #2f71c1 0%, #043679 100%); /* W3C */ } .badge.badge-danger { background: #f1614a; /* Old browsers */ background: -moz-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f1614a), color-stop(100%, #ab1d07)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* IE10+ */ background: linear-gradient(to bottom, #f1614a 0%, #ab1d07 100%); /* W3C */ } .badge.badge-danger:hover { background: #f1614a; /* Old browsers */ background: -moz-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f1614a), color-stop(100%, #ab1d07)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* IE10+ */ background: linear-gradient(to bottom, #f1614a 0%, #ab1d07 100%); /* W3C */ } .badge.badge-warning { background: #ffc200; /* Old browsers */ background: -moz-linear-gradient(top, #ffc200 0%, #af8100 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffc200), color-stop(100%, #af8100)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ffc200 0%, #af8100 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ffc200 0%, #af8100 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ffc200 0%, #af8100 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffc200 0%, #af8100 100%); /* W3C */ color: #ffffff; } .badge.badge-warning:hover { background: #ffc200; /* Old browsers */ background: -moz-linear-gradient(top, #ffc200 0%, #af8100 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffc200), color-stop(100%, #af8100)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ffc200 0%, #af8100 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ffc200 0%, #af8100 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ffc200 0%, #af8100 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffc200 0%, #af8100 100%); /* W3C */ } .badge.badge-orange { background: #f18024; /* Old browsers */ background: -moz-linear-gradient(top, #f18024 0%, #f18024 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f18024), color-stop(100%, #f18024)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f18024 0%, #f18024 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f18024 0%, #f18024 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f18024 0%, #f18024 100%); /* IE10+ */ background: linear-gradient(to bottom, #f18024 0%, #f18024 100%); /* W3C */ color: #ffffff; } .badge.badge-orange:hover { background: #f18024; /* Old browsers */ background: -moz-linear-gradient(top, #f18024 0%, #f18024 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f18024), color-stop(100%, #f18024)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f18024 0%, #f18024 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f18024 0%, #f18024 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f18024 0%, #f18024 100%); /* IE10+ */ background: linear-gradient(to bottom, #f18024 0%, #f18024 100%); /* W3C */ } .badge.badge-light { background: #d2d0cd; } .badge.badge-light:hover { background: #d2d0cd; } .badge.badge-dark { background: #1b1b1b; } .badge.badge-dark:hover { background: #1b1b1b; } .badge.badge-white { background: #ffffff; color: #333333; } .badge.badge-white:hover { background: #ffffff; } .badge.badge-pill { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .blockquote { font-size: .9rem; margin-bottom: 2rem; } .blockquote .blockquote-footer { font-size: 95%; } .breadcrumb { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; background: transparent; margin: 0; padding: .5rem 0; font-size: 1.4rem; align-items: center; } .breadcrumb .breadcrumb-item { color: #333333; } .breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: #333333; } .breadcrumb .breadcrumb-item a { color: #333333; } .breadcrumb .breadcrumb-item.active { color: #cd9d63; } button:focus { outline: none; } .btn { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: 0; } .btn .badge { top: 0; } .btn i { vertical-align: middle; } .btn-rounded { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .btn.disabled, .btn:disabled { pointer-events: none; } .btn-primary { color: #ffffff; background: #ad6c14; /* Old browsers */ background: -moz-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ad6c14), color-stop(100%, #cd9d63)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ad6c14 0%, #cd9d63 100%); /* IE10+ */ background: linear-gradient(to bottom, #ad6c14 0%, #cd9d63 100%); /* W3C */ } .btn-primary:hover { color: #ffffff; background: #cd9d63; /* Old browsers */ background: -moz-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cd9d63), color-stop(100%, #ad6c14)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #cd9d63 0%, #ad6c14 100%); /* IE10+ */ background: linear-gradient(to bottom, #cd9d63 0%, #ad6c14 100%); /* W3C */ } .btn-primary:focus, .btn-primary.focus { box-shadow: 0 0 0 0.2rem rgba(205, 157, 98, 0.3); background-color: #c79150; } .btn-primary.disabled, .btn-primary:disabled { color: #ffffff; background-color: #cd9d63; } .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active { color: #ffffff; background-color: #c79150; } .show > .btn-primary.dropdown-toggle { color: #ffffff; background-color: #c79150; } .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus { box-shadow: 0 0 0 0.2rem rgba(205, 157, 98, 0.3); } .show > .btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(205, 157, 98, 0.3); } .btn-secondary { color: #ffffff; background: #212020; /* Old browsers */ background: -moz-linear-gradient(top, #212020 0%, #615f5f 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #212020), color-stop(100%, #615f5f)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #212020 0%, #615f5f 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #212020 0%, #615f5f 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #212020 0%, #615f5f 100%); /* IE10+ */ background: linear-gradient(to bottom, #212020 0%, #615f5f 100%); /* W3C */ } .btn-secondary:hover { color: #ffffff; background: #615f5f; /* Old browsers */ background: -moz-linear-gradient(top, #615f5f 0%, #212020 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #615f5f), color-stop(100%, #212020)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #615f5f 0%, #212020 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #615f5f 0%, #212020 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #615f5f 0%, #212020 100%); /* IE10+ */ background: linear-gradient(to bottom, #615f5f 0%, #212020 100%); /* W3C */ } .btn-secondary:focus, .btn-secondary.focus { box-shadow: 0 0 0 0.2rem rgba(43, 42, 41, 0.2); background-color: #545252; } .btn-secondary.disabled, .btn-secondary:disabled { color: #ffffff; background-color: #615f5f; } .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active { color: #ffffff; background-color: #545252; } .show > .btn-secondary.dropdown-toggle { color: #ffffff; background-color: #545252; } .btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus { box-shadow: 0 0 0 0.2rem rgba(43, 42, 41, 0.2); } .show > .btn-secondary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(43, 42, 41, 0.2); } .btn-success { color: #ffffff; background: #335113; /* Old browsers */ background: -moz-linear-gradient(top, #335113 0%, #86a23b 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #335113), color-stop(100%, #86a23b)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #335113 0%, #86a23b 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #335113 0%, #86a23b 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #335113 0%, #86a23b 100%); /* IE10+ */ background: linear-gradient(to bottom, #335113 0%, #86a23b 100%); /* W3C */ } .btn-success:hover { color: #ffffff; background: #86a23b; /* Old browsers */ background: -moz-linear-gradient(top, #86a23b 0%, #335113 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #86a23b), color-stop(100%, #335113)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #86a23b 0%, #335113 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #86a23b 0%, #335113 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #86a23b 0%, #335113 100%); /* IE10+ */ background: linear-gradient(to bottom, #86a23b 0%, #335113 100%); /* W3C */ } .btn-success:focus, .btn-success.focus { box-shadow: 0 0 0 0.2rem rgba(134, 162, 59, 0.3); background-color: #335113; } .btn-success.disabled, .btn-success:disabled { color: #ffffff; background-color: #86a23b; } .btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active { color: #ffffff; background-color: #335113; } .show > .btn-success.dropdown-toggle { color: #ffffff; background-color: #335113; } .btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus { box-shadow: 0 0 0 0.2rem rgba(134, 162, 59, 0.3); } .show > .btn-success.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(134, 162, 59, 0.3); } .btn-info { color: #ffffff; background: #043679; /* Old browsers */ background: -moz-linear-gradient(top, #043679 0%, #2f71c1 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #043679), color-stop(100%, #2f71c1)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #043679 0%, #2f71c1 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #043679 0%, #2f71c1 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #043679 0%, #2f71c1 100%); /* IE10+ */ background: linear-gradient(to bottom, #043679 0%, #2f71c1 100%); /* W3C */ } .btn-info:hover { color: #ffffff; background: #2f71c1; /* Old browsers */ background: -moz-linear-gradient(top, #2f71c1 0%, #043679 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2f71c1), color-stop(100%, #043679)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2f71c1 0%, #043679 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #2f71c1 0%, #043679 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #2f71c1 0%, #043679 100%); /* IE10+ */ background: linear-gradient(to bottom, #2f71c1 0%, #043679 100%); /* W3C */ } .btn-info:focus, .btn-info.focus { box-shadow: 0 0 0 0.2rem rgba(10, 58, 116, 0.3); background-color: #043679; } .btn-info.disabled, .btn-info:disabled { color: #ffffff; background-color: #2f71c1; } .btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active { color: #ffffff; background-color: #043679; } .show > .btn-info.dropdown-toggle { color: #ffffff; background-color: #043679; } .btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus { box-shadow: 0 0 0 0.2rem rgba(10, 58, 116, 0.3); } .show > .btn-info.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(10, 58, 116, 0.3); } .btn-danger { color: #ffffff; background: #ab1d07; /* Old browsers */ background: -moz-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ab1d07), color-stop(100%, #f1614a)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* IE10+ */ background: linear-gradient(to bottom, #ab1d07 0%, #f1614a 100%); /* W3C */ } .btn-danger:hover { color: #ffffff; background: #f1614a; /* Old browsers */ background: -moz-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f1614a), color-stop(100%, #ab1d07)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f1614a 0%, #ab1d07 100%); /* IE10+ */ background: linear-gradient(to bottom, #f1614a 0%, #ab1d07 100%); /* W3C */ } .btn-danger:focus, .btn-danger.focus { box-shadow: 0 0 0 0.2rem rgba(214, 76, 54, 0.25); background-color: #ab1d07; } .btn-danger.disabled, .btn-danger:disabled { color: #ffffff; background-color: #f1614a; } .btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active { color: #ffffff; background-color: #ab1d07; } .show > .btn-danger.dropdown-toggle { color: #ffffff; background-color: #ab1d07; } .btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus { box-shadow: 0 0 0 0.2rem rgba(214, 76, 54, 0.25); } .show > .btn-danger.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(214, 76, 54, 0.25); } .btn-warning { color: #ffffff; background: #af8100; /* Old browsers */ background: -moz-linear-gradient(top, #af8100 0%, #ffc200 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #af8100), color-stop(100%, #ffc200)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #af8100 0%, #ffc200 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #af8100 0%, #ffc200 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #af8100 0%, #ffc200 100%); /* IE10+ */ background: linear-gradient(to bottom, #af8100 0%, #ffc200 100%); /* W3C */ } .btn-warning:hover { color: #ffffff; background: #ffc200; /* Old browsers */ background: -moz-linear-gradient(top, #ffc200 0%, #af8100 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffc200), color-stop(100%, #af8100)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ffc200 0%, #af8100 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ffc200 0%, #af8100 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ffc200 0%, #af8100 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffc200 0%, #af8100 100%); /* W3C */ } .btn-warning:focus, .btn-warning.focus { box-shadow: 0 0 0 0.2rem rgba(193, 145, 13, 0.3); background-color: #af8100; } .btn-warning.disabled, .btn-warning:disabled { color: #ffffff; background-color: #ffc200; } .btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active { color: #ffffff; background-color: #af8100; } .show > .btn-warning.dropdown-toggle { color: #ffffff; background-color: #af8100; } .btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus { box-shadow: 0 0 0 0.2rem rgba(193, 145, 13, 0.3); } .show > .btn-warning.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(193, 145, 13, 0.3); } .carousel { margin-bottom: 2rem; } .carousel-caption { color: #333333; } .card { background: #fffefc; border: 1px solid #e4dacd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 1rem; } .card .card-header { background: transparent; border: 0; font-size: 1rem; font-weight: 600; padding: 1rem 1.25rem 1rem 1.25rem; } .card .card-header .card-title { margin: 0; font-size: 1rem; font-weight: 600; line-height: 100%; } .card .card-header .card-sub-title { margin-top: 1rem; font-size: .8rem; font-weight: 400; color: #777b82; line-height: 150%; } .card.primary { background: #cd9d63; color: #ffffff; } .card.secondary { background: #615f5f; color: #ffffff; } .card .card-body { padding: 1.25rem 1.25rem; position: relative; } .card .card-body .card-title { margin-bottom: .7rem; font-size: 1rem; font-weight: 700; line-height: 100%; } .card .card-body .card-sub-title { margin-bottom: 1rem; font-size: .8rem; color: #777b82; line-height: 140%; } .card .card-body .card-text { margin-bottom: 1rem; line-height: 180%; } .card .card-footer { background: transparent; border-top: 0; padding: 1rem 1.25rem; } .card .card-footer .view-all { color: rgba(0, 0, 0, 0.4); font-size: .8rem; } .card .card-footer .view-all i { font-size: 1.2rem; vertical-align: middle; } .card .card-footer .view-all:hover { color: #cd9d63; } .card .card-footer a.view { color: rgba(0, 0, 0, 0.4); font-size: .825rem; color: #cd9d63; font-weight: 700; } .card .card-footer a.view i { font-size: 1.5rem; margin: 0 10px; vertical-align: middle; } .card .card-link { color: #cd9d63; font-weight: 600; } .card .card-link.primary { color: #cd9d63; } .card .card-link.secondary { color: #615f5f; } .card .card-img-bottom { border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; border-top-right-radius: 0; border-top-left-radius: 0; } .card .card-img-top { border-top-right-radius: 10px; border-top-left-radius: 10px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .card.highlight { border: 1px solid #cd9d63; background: #cd9d63; } @media (max-width: 767px) { .card .card-header { padding: 1rem .75rem .5rem .75rem; } .card .card-body { padding: .75rem; } } .card-deck { margin-right: -10px; margin-left: -10px; } .card-deck .card { margin-right: 10px; margin-left: 10px; margin-bottom: 1.25rem; } .custom-checkbox .custom-control-label::before { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .custom-control-label::before { top: 0; border-color: #d2b999; background: #fffcf7; } .custom-control-label::after { top: 0; } .custom-control-input:checked ~ .custom-control-label::before { background: #cd9d63; border-color: #ad6c14; } .custom-control.custom-switch .custom-control-label::after { top: 2px; background: #d2b999; } .custom-control-input:focus ~ .custom-control-label::before { box-shadow: none; } .custom-control-input:disabled ~ .custom-control-label::before { background-color: #eff1f5; border-color: #e4dacd; } .dropdown-menu { border: 0; -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; box-shadow: 20px 30px 30px rgba(0, 0, 0, 0.2); width: 11rem; font-size: .75rem; } .dropdown-menu:before { position: absolute; top: -9px; left: 12px; content: ''; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 9px solid #ffffff; } .dropdown-menu.dropdown-menu-right:before { right: 15px; left: auto; top: -9px; } .dropdown-menu.sm { width: 10rem; min-width: auto; } .dropdown-menu.lrg { width: 18rem; } .dropdown-menu .dropdown-item { padding: .5rem 1rem .5rem 1rem; font-size: .8rem; line-height: 100%; position: relative; color: #333333; } .dropdown-menu .dropdown-item:hover { background: #cd9d63; } .dropdown-menu .dropdown-item:first-child { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .dropdown-menu .dropdown-item:last-child { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .dropdown-menu .dropdown-item.active-page { color: #cd9d63; background: #f4f5fb; pointer-events: none; cursor: not-allowed; } .dropdown-menu .dropdown-menu-header { padding: .7rem 1rem; margin-bottom: .5rem; background: #f8f4ee; font-size: .8rem; font-weight: 700; } .dropdown-toggle::after { vertical-align: middle; } .dropdown-toggle.sub-nav-link::after { float: right; margin: .15rem 0 0 0; border-right: 0; border-left: 5px solid; border-top: 4px solid transparent; border-bottom: 4px solid transparent; } .dropdown-divider { margin: .3rem 0; } .dropdown-toggle-split { padding-right: .8rem; padding-left: .8rem; } .form-group { margin: 0 0 1rem 0; } .form-control { border: 1px solid #e4dacd; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-size: .825rem; background: #fffcf7; } .form-control:hover { border: 1px solid #b5bbc5; } .form-control:focus { border-color: #cd9d63; box-shadow: none; } .form-control:disabled, .form-control[readonly] { background-color: #f8f4ee; } .input-group-text { border: 1px solid #e4dacd; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-size: .825rem; background: #fffcf7; color: #333333; } .input-group-sm > .input-group-prepend > .input-group-text { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .input-group-lg > .input-group-prepend > .input-group-text { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .custom-select { font-size: .825rem; } .custom-file-input { font-size: .825rem; } .custom-file-label { font-size: .825rem; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .custom-file-label::after { background: #fffcf7; -webkit-border-radius: 0 2px 2px 0; -moz-border-radius: 0 2px 2px 0; border-radius: 0 2px 2px 0; } label { margin-bottom: .1rem; font-weight: 600; } .form-control.is-invalid, .was-validated .form-control:invalid { border-color: #f1614a; } .form-control.is-valid, .was-validated .form-control:valid { border-color: #86a23b; } .jumbotron { background: #fffefc; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: 1px solid #e4dacd; margin-bottom: 1rem; } .lead { margin: 0 0 1rem 0; } .list-group { margin-bottom: 2rem; background: #fffefc; border: 1px solid #e4dacd; border: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-bottom: 1rem; } .list-group .list-group-item { background: #fffefc; font-size: .825rem; padding: .5rem .75rem; border: 1px solid #e4dacd; } .list-group .list-group-item:first-child { -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; } .list-group .list-group-item:last-child { -webkit-border-radius: 0 0 6px 6px; -moz-border-radius: 0 0 6px 6px; border-radius: 0 0 6px 6px; } .list-group .list-group-item.active { background-color: #f8f4ee; color: #333333; } .list-group .list-group-item.disabled { color: #666666; } .list-group .list-group-item-default { background: #eff1f5; border: 0; margin: 0; color: #333333; } .list-group .list-group-item-default.active { background: #e6e9ef; } .list-group a.list-group-item-default:hover { background: #e6e9ef; } .list-group .list-group-item-primary { background: #cd9d63; border: 0; margin: 0; color: rgba(255, 255, 255, 0.8) !important; } .list-group .list-group-item-primary.active { background: #c99657; } .list-group a.list-group-item-primary:hover { background: #c99657; } .list-group .list-group-item-secondary { background: #615f5f; border: 0; margin: 0; color: rgba(255, 255, 255, 0.8) !important; } .list-group .list-group-item-secondary.active { background: #595757; } .list-group a.list-group-item-secondary:hover { background: #595757; } .list-group .list-group-item-success { background: #86a23b; border: 0; margin: 0; color: rgba(255, 255, 255, 0.8); } .list-group .list-group-item-success.active { background: #7d9737; } .list-group a.list-group-item-success:hover { background: #7d9737; } .list-group .list-group-item-danger { background: #f1614a; border: 0; margin: 0; color: rgba(255, 255, 255, 0.8); } .list-group .list-group-item-danger.active { background: #f0553c; } .list-group a.list-group-item-danger:hover { background: #f0553c; } .list-group .list-group-item-warning { background: #ffc200; border: 0; margin: 0; color: #ffffff; } .list-group .list-group-item-warning.active { background: #f0b600; } .list-group a.list-group-item-warning:hover { background: #f0b600; } .list-group .list-group-item-info { background: #2f71c1; border: 0; margin: 0; color: #ffffff; } .list-group .list-group-item-info.active { background: #2c6ab5; } .list-group a.list-group-item-info:hover { background: #2c6ab5; } .modal { text-align: left; } .modal .modal-content { -webkit-border-radius: 3pxpx; -moz-border-radius: 3pxpx; border-radius: 3pxpx; } .modal .modal-dialog { margin-top: 5rem; } .modal .modal-dialog.modal-dialog-centered { margin: 0 auto; } .modal .modal-header { background: #cd9d63; color: #ffffff; border: 0; -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } .modal .modal-footer { border-top: 1px solid #e4dacd; } .modal .modal-footer.custom { padding: 0; display: flex; align-items: center; justify-content: center; text-align: center; } .modal .modal-footer.custom .left-side, .modal .modal-footer.custom .right-side { width: 48%; margin: 0; } .modal .modal-footer.custom .divider { background-color: #e4dacd; width: 1px; height: 60px; margin: 0; } .modal .modal-footer.custom .btn-link { padding: 1rem; font-size: .9rem; text-transform: uppercase; font-weight: 700; color: #333333; } .modal-backdrop.show { opacity: 0.8; } .close { color: #ffffff; text-shadow: 0 1px 0 #000000; } .nav-link { color: #333333; } .nav-link.active { color: #cd9d63; } .nav-link.disabled { color: #777b82; } .nav-pills .nav-link { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .nav-pills .nav-link:hover { background: #eff1f5; color: #333333; } .nav-pills .nav-link.active { background-color: #cd9d63; pointer-events: none; } .nav-pills.primary .nav-link.active { background-color: #cd9d63; } .nav-pills.secondary .nav-link.active { background-color: #615f5f; } .nav-pills.danger .nav-link.active { background-color: #f1614a; } .nav-pills.info .nav-link.active { background-color: #2f71c1; } .nav-pills.success .nav-link.active { background-color: #86a23b; } .nav-pills.warning .nav-link.active { background-color: #ffc200; } .navbar-toggler { display: none; padding: 0; border: 0; width: 36px; height: 36px; margin: 4px; vertical-align: top; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; background: #cd9d63; position: relative; } .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon { width: auto; height: auto; } .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon i { position: absolute; display: block; height: 2px; background: #ffffff; width: 25px; left: 6px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon i:nth-child(1) { top: 11px; } .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon i:nth-child(2) { top: 17px; } .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon i:nth-child(3) { top: 24px; } .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon { width: auto; height: auto; } .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon i { position: absolute; display: block; height: 2px; background: #ffffff; width: 25px; left: 6px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon i:nth-child(1) { top: 18px; -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); } .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon i:nth-child(2) { background: transparent; } .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon i:nth-child(3) { top: 18px; -webkit-transform: rotateZ(-45deg); transform: rotateZ(-45deg); } @media (max-width: 992px) { .navbar-toggler { display: inline-block; } } .custom-navbar { margin-bottom: 0; background: #2e343c; padding: 0; -webkit-border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; } .custom-navbar ul.navbar-nav li.nav-item .nav-link { position: relative; padding: .7rem 1rem .7rem 1rem; color: #dfe5ec; font-size: .725rem; text-transform: uppercase; background: transparent; min-width: 100px; text-align: center; border-right: 1px solid #39414a; border-left: 1px solid #23272e; } .custom-navbar ul.navbar-nav li.nav-item .nav-link i.nav-icon { font-size: 1.2rem; display: block; margin: 0 auto 3px auto; text-align: center; } .custom-navbar ul.navbar-nav li.nav-item .nav-link.active-page { position: relative; color: #ffffff; background: #cd9d63; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .custom-navbar ul.navbar-nav li.nav-item .nav-link.active-page:hover { color: #ffffff !important; background: #cd9d63 !important; } .custom-navbar ul.navbar-nav li.nav-item .nav-link:hover { color: #333333; background: #ffffff; } .custom-navbar ul.navbar-nav li.nav-item:first-child .nav-link { border-left: 0; -webkit-border-radius: 4px 0 0 0; -moz-border-radius: 4px 0 0 0; border-radius: 4px 0 0 0; } .custom-navbar ul.navbar-nav li.nav-item:first-child .nav-link:hover { -webkit-border-radius: 4px 0 0 0; -moz-border-radius: 4px 0 0 0; border-radius: 4px 0 0 0; } .custom-navbar ul.navbar-nav li.nav-item:first-child:hover { -webkit-border-radius: 4px 0 0 0; -moz-border-radius: 4px 0 0 0; border-radius: 4px 0 0 0; } .custom-navbar ul.navbar-nav li.nav-item:first-child ul.dropdown-menu { margin: 0 0 0 0; } .custom-navbar ul.navbar-nav li.nav-item:last-child .nav-link { border-right: 1px solid #2e343c; } .custom-navbar ul.navbar-nav li.nav-item:hover, .custom-navbar ul.navbar-nav li.nav-item.show { color: #333333; background: #ffffff; } .custom-navbar ul.navbar-nav li.nav-item:hover > a, .custom-navbar ul.navbar-nav li.nav-item.show > a { color: #333333; } .custom-navbar ul.navbar-nav li.nav-item:hover .nav-link.active-page, .custom-navbar ul.navbar-nav li.nav-item.show .nav-link.active-page { color: #ffffff; background: #cd9d63; } .custom-navbar ul.navbar-nav li.nav-item:hover .nav-link.active-page > a, .custom-navbar ul.navbar-nav li.nav-item.show .nav-link.active-page > a { color: #ffffff; } .custom-navbar ul.navbar-nav ul.dropdown-menu { margin: 0 0 0 1px; -webkit-border-radius: 0 4px 4px 4px; -moz-border-radius: 0 4px 4px 4px; border-radius: 0 4px 4px 4px; -webkit-animation-name: slideInUp; animation-name: slideInUp; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .custom-navbar ul.navbar-nav ul.dropdown-menu a.dropdown-item { padding: .7rem 1rem .7rem 1rem; } .custom-navbar ul.navbar-nav ul.dropdown-menu a.dropdown-item:hover { background: #cd9d63; color: #ffffff; } .custom-navbar ul.navbar-nav ul.dropdown-menu li { position: relative; } .custom-navbar ul.navbar-nav ul.dropdown-menu li a.sub-nav-link { padding: .7rem 1rem .7rem 1rem; display: block; font-size: .8rem; line-height: 100%; color: #333333; } .custom-navbar ul.navbar-nav ul.dropdown-menu li a.sub-nav-link:hover { background: #cd9d63; } .custom-navbar ul.navbar-nav ul.dropdown-menu li a.sub-nav-link.active-page { color: #cd9d63; background: #f4f5fb; } .custom-navbar ul.navbar-nav ul.dropdown-menu li ul.dropdown-menu { -webkit-border-radius: 4px 0 4px 4px; -moz-border-radius: 4px 0 4px 4px; border-radius: 4px 0 4px 4px; margin: 0; } .custom-navbar ul.navbar-nav ul.dropdown-menu li ul.dropdown-menu-right { -webkit-border-radius: 0 4px 4px 4px; -moz-border-radius: 0 4px 4px 4px; border-radius: 0 4px 4px 4px; margin: 0; } .custom-navbar ul.navbar-nav ul.dropdown-menu li:hover > a.sub-nav-link { background: #cd9d63; color: #ffffff; } .custom-navbar ul.navbar-nav ul.dropdown-menu-right { margin: 0 1px 0 0; -webkit-border-radius: 4px 0 4px 4px; -moz-border-radius: 4px 0 4px 4px; border-radius: 4px 0 4px 4px; } @media (max-width: 991px) { .custom-navbar { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-bottom: .5rem; } .custom-navbar ul.navbar-nav li.nav-item a.nav-link { padding: .8rem 1rem; font-size: .9rem; text-align: left; border: 0; margin: 0; } .custom-navbar ul.navbar-nav li.nav-item a.nav-link img.nav-icon { max-width: 21px; max-height: 21px; display: inline-block; margin: 0 10px 0 0; vertical-align: text-bottom; } .custom-navbar ul.navbar-nav li.nav-item a.nav-link i.nav-icon { font-size: 1.2rem; display: inline-block; margin: 0 10px 0 0; vertical-align: bottom; } .custom-navbar ul.navbar-nav li.nav-item a.nav-link.dropdown-toggle::after { float: right; margin-top: 8px; } .custom-navbar ul.navbar-nav li.nav-item a.nav-link.active-page { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .custom-navbar ul.navbar-nav li.nav-item a.nav-link.active-page:before { background: none !important; } .custom-navbar ul.navbar-nav ul.dropdown-menu { position: relative; width: auto; margin: 0 10px 0 10px; top: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .custom-navbar ul.navbar-nav ul.dropdown-menu li { position: relative; } .custom-navbar ul.navbar-nav ul.dropdown-menu li ul.dropdown-menu { left: 0 !important; background: #eff1f5; } .custom-navbar ul.navbar-nav ul.dropdown-menu li ul.dropdown-menu:before { border-bottom: 9px solid #eff1f5; } } @media (min-width: 992px) { .custom-navbar ul.navbar-nav li.nav-item:hover > ul.dropdown-menu { display: block; } .custom-navbar ul.navbar-nav ul.dropdown-menu li ul.dropdown-menu { display: none; } .custom-navbar ul.navbar-nav ul.dropdown-menu li:hover ul.dropdown-menu { top: 0; left: 11rem; display: block; } .custom-navbar ul.navbar-nav ul.dropdown-menu li:hover ul.dropdown-menu:before { position: absolute; top: 10px; left: -17px; right: 100%; content: ''; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right: 9px solid #ffffff; } .custom-navbar ul.navbar-nav ul.dropdown-menu li.open-left:hover ul.dropdown-menu { top: 0; left: -11rem !important; display: block; } .custom-navbar ul.navbar-nav ul.dropdown-menu li.open-left:hover ul.dropdown-menu:before { position: absolute; top: 10px; right: -9px; left: 100%; content: ''; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 9px solid #ffffff; border-right: 0; } } .nav-tabs-container { background: #ffffff; border: 1px solid #e4dacd; border: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-bottom: 1rem; } .nav-tabs { padding: 1.25rem 1.25rem 0 1.25rem; border-bottom: 1px solid #fff2d8; } .nav-tabs .nav-item .nav-link { position: relative; border: 0; font-weight: 600; display: flex; align-items: center; justify-content: center; padding: .6rem 1.8rem; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; border-top: 1px solid transparent; } .nav-tabs .nav-item .nav-link i { font-size: 1rem; margin: 0 .3rem 0 0; } .nav-tabs .nav-item .nav-link i.block { display: block; text-align: center; margin: 0 .3rem 0 0; } .nav-tabs .nav-item .nav-link.active { color: #cd9d63; border: 1px solid #fff6e3; border-bottom: 0; border-top: 3px solid #cd9d63; pointer-events: none; } .nav-tabs .nav-item .nav-link:hover { color: #cd9d63; border: 0; border-top: 1px solid transparent; } .nav-tabs.light .nav-item .nav-link { color: rgba(255, 255, 255, 0.8); } .nav-tabs.light .nav-item .nav-link.active { color: #000000; border-top: 3px solid rgba(0, 0, 0, 0.5); } .nav-tabs.primary .nav-item .nav-link { color: rgba(255, 255, 255, 0.8); } .nav-tabs.primary .nav-item .nav-link.active { color: #000000; border-top: 3px solid #d9b58a; } .nav-tabs.danger .nav-item .nav-link { color: rgba(255, 255, 255, 0.8); } .nav-tabs.danger .nav-item .nav-link.active { color: #000000; border-top: 3px solid #f58a79; } .nav-tabs.info .nav-item .nav-link { color: rgba(255, 255, 255, 0.8); } .nav-tabs.info .nav-item .nav-link.active { color: #1b416f; border-top: 3px solid #1b416f; } .tab-content { padding: 1.25rem; } .pagination .page-item .page-link { background: transparent; color: #333333; margin: 0; border: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; min-width: 28px; text-align: center; display: flex; align-items: center; justify-content: center; } .pagination .page-item .page-link:hover { background: #f3e7da; color: #333333; } .pagination .page-item .page-link i { font-weight: 700; vertical-align: middle; font-size: .95rem; } .pagination .page-item.active .page-link { background: #cd9d63; color: #ffffff; pointer-events: none; box-shadow: 0 0 0 0.2rem rgba(205, 157, 98, 0.3); } .pagination .page-item.disabled .page-link { background: #f3e7da; color: #777b82; } .pagination.primary .page-item.active .page-link { background: #cd9d63; box-shadow: 0 0 0 0.2rem rgba(205, 157, 98, 0.3); } .pagination.secondary .page-item.active .page-link { background: #615f5f; box-shadow: 0 0 0 0.2rem rgba(56, 55, 55, 0.2); } .pagination.success .page-item.active .page-link { background: #86a23b; box-shadow: 0 0 0 0.2rem rgba(134, 162, 59, 0.3); } .pagination.info .page-item.active .page-link { background: #2f71c1; box-shadow: 0 0 0 0.2rem rgba(10, 58, 116, 0.3); } .pagination.warning .page-item.active .page-link { background: #ffc200; box-shadow: 0 0 0 0.2rem rgba(193, 145, 13, 0.3); } .pagination.danger .page-item.active .page-link { background: #f1614a; box-shadow: 0 0 0 0.2rem rgba(214, 76, 54, 0.25); } .pagination.rounded .page-item .page-link { -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .pagination.rounded .page-item .page-link:hover { -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .pagination.rounded .page-item.active .page-link { -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .popover { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .progress { margin-bottom: 1rem; border: 0; background: #e4dacd; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .progress .progress-bar { background-color: #cd9d63; } .progress.md { height: .9rem; } .progress.sm { height: .6rem; } .progress.xs { height: .3rem; } .progress.xsl { height: .15rem; } .table-container { padding: .6rem; background: #fffefc; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: 1px solid #e4dacd; margin-bottom: 1rem; } .table-container h5.table-title { font-size: .9rem; padding: 10px 15px; margin: 0; } .table-container .t-header { margin: -10px -.6rem 0 -.6rem; padding: 12px 10px; font-weight: 700; } .table { background: #fffefc; color: #333333; } .table thead th { padding: .8rem 1rem; font-weight: 600; border-bottom: 2px solid #e4dacd; } .table tr { -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } .table td { border-top: 1px solid #e4dacd; vertical-align: middle; padding: .65rem 1rem; } .table th { border-top: 1px solid #e4dacd; } .table .td-actions { display: flex; align-items: center; justify-content: flex-end; flex-direction: row; } .table .td-actions a.icon { margin: 0 3px; display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; color: #ffffff; } .table .td-actions a.icon i { font-size: .7rem; } .table .td-actions a.icon.red { background: #ab1d07; /* Old browsers */ background: -moz-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ab1d07), color-stop(100%, #f1614a)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ab1d07 0%, #f1614a 100%); /* IE10+ */ background: linear-gradient(to bottom, #ab1d07 0%, #f1614a 100%); /* W3C */ } .table .td-actions a.icon.green { background: #335113; /* Old browsers */ background: -moz-linear-gradient(top, #335113 0%, #86a23b 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #335113), color-stop(100%, #86a23b)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #335113 0%, #86a23b 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #335113 0%, #86a23b 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #335113 0%, #86a23b 100%); /* IE10+ */ background: linear-gradient(to bottom, #335113 0%, #86a23b 100%); /* W3C */ } .table .td-actions a.icon.blue { background: #043679; /* Old browsers */ background: -moz-linear-gradient(top, #043679 0%, #2f71c1 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #043679), color-stop(100%, #2f71c1)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #043679 0%, #2f71c1 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #043679 0%, #2f71c1 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #043679 0%, #2f71c1 100%); /* IE10+ */ background: linear-gradient(to bottom, #043679 0%, #2f71c1 100%); /* W3C */ } .table a.link { color: #cd9d63; font-weight: 600; text-decoration: underline; } .table .flag-img { width: 18px; height: 18px; margin: 0 10px 0 0; } .table-hover tbody tr:hover { background: #f8f4ef; } .table-striped tbody tr:nth-of-type(odd) { background: #f8f4ef; } .table-bordered { border: 1px solid #e4dacd; } .table-bordered td, .table-bordered th { border: 1px solid #e4dacd; } .table-sm th { padding: .5rem .7rem; } .table-sm td { padding: .3rem .7rem; } .table-dark { background: #2e343c; color: #ffffff; } .table-dark thead th { border-color: #3a424c; } .table-dark th { border-color: #3a424c; } .table-dark td { border-color: #3a424c; } .table-primary { background: #cd9d63; color: #ffffff; } .table-primary thead th { border-color: #c79150; } .table-primary th { border-color: #c79150; } .table-primary td { border-color: #c79150; } .custom-table { border: 1px solid #e4dacd; } .custom-table thead { background: #f8f4ef; } .custom-table thead th { border: 0; } .custom-table > tbody tr:hover { background: #fffbf2; } .custom-table > tbody tr:nth-of-type(even) { background-color: #fffefc; } .custom-table > tbody td { border: 1px solid #e8dfd4; } .tooltip { font-size: .7rem; } .tooltip-inner { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .gutters { margin-right: -8px; margin-left: -8px; } .gutters > .col, .gutters > [class*="col-"] { padding-right: 8px; padding-left: 8px; } .less-gutters { margin-right: -1px; margin-left: -1px; } .less-gutters > .col, .less-gutters > [class*="col-"] { padding-right: 1px; padding-left: 1px; } code { color: #af772b; word-break: break-word; } .custom-control-label i img { max-width: 24px; }