html, body {margin: 0px !important; padding: 0px !important;}
body {font-family: 'Open Sans', sans-serif !important; font-size: 14px !important; background: #F4F4FC !important; color: #333333 !important;}
body.noscroll {overflow: hidden;}
body.img-bg {background-repeat: no-repeat !important; background-position: center !important; background-size: cover !important;}
::-webkit-scrollbar {width: 8px; height: 8px;}
::-webkit-scrollbar-track {background-color: transparent;}
::-webkit-scrollbar-thumb {-webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.3); background: #AAAAAA; border-radius: 10px;}
.preload * {-webkit-transition: none !important; -moz-transition: none !important; -ms-transition: none !important; -o-transition: none !important;}
#progress {position: fixed; z-index: 999999; top: 0; left: -6px; width: 1%; height: 3px; background-color: #4A49F1; -moz-border-radius: 1px; -webkit-border-radius: 1px; border-radius: 1px; -moz-transition: width 600ms ease-out,opacity 500ms linear; -ms-transition: width 600ms ease-out,opacity 500ms linear; -o-transition: width 600ms ease-out,opacity 500ms linear; -webkit-transition: width 600ms ease-out,opacity 500ms linear; transition: width 1000ms ease-out,opacity 500ms linear;}
#progress b, #progress i {position: absolute; top: 0; height: 3px; -moz-box-shadow: #777777 1px 0 6px 1px; -ms-box-shadow: #777777 1px 0 6px 1px; -webkit-box-shadow: #777777 1px 0 6px 1px; box-shadow: #777777 1px 0 6px 1px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%;}
#progress b {clip: rect(-6px, 22px, 14px, 10px); opacity: .6; width: 20px; right: 0;}
#progress i {clip: rect(-6px, 90px, 14px, -6px); opacity: .6; width: 180px; right: -80px;}    
a, button, .btn {outline: none !important; text-decoration: none !important;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type=number] {-moz-appearance: textfield;}
input[name=pan] {text-transform: uppercase;}
ul {margin: 0 !important; padding: 0 !important; list-style: none !important;}
ol {margin: 0 !important; padding: 10px 15px !important;}
ol li {margin-bottom: 10px;}
img {max-width: 100%;}
.btn {padding: 8px 30px !important; font-size: 14px !important; font-weight: 500 !important; background: #5B5B5B; border-radius: 3px !important; border: 1px solid #DCDCDC !important; color: #FFFFFF !important; margin: 0; text-transform: uppercase; outline: none !important; box-shadow: none !important;}
.primary-btn {background: #EF3E2D !important; color: #FFFFFF !important;}
.primary-1-btn {background: #FDFDFD !important; color: #EF3E2D !important;}
.primary-2-btn {background: #FDFDFD !important; color: #555555 !important;}
.secondary-btn {background: #ACBCCC !important; color: #FFFFFF !important;}
.icon-btn {background-color: #FDFDFD !important; color: #EF3E2D !important; width: 50px; height: 50px; position: relative; padding: 0 !important;}
.icon-btn.highlighted {background-color: #67E4BB !important;}
.icon-btn.inactive {opacity: 0.65; cursor: not-allowed;}
.icon-btn:after {content: ""; background: no-repeat center/contain; height: 25px; width: 25px; position: absolute; top: 12.5px; left: 12.5px; filter: opacity(0.60) invert(0); image-rendering: -webkit-optimize-contrast;}
.icon-btn.small {width: 41px; height: 41px;}
.icon-btn.small:after {height: 20px; width: 20px; top: 10px; left: 10px;}
.icon-btn:hover:after {filter: opacity(1);}
.primary-btn:hover, .primary-1-btn:hover, .primary-2-btn:hover, .secondary-btn:hover, .icon-btn:hover {filter: brightness(0.9);}
.inverse-btn {background: #FFFFFF !important; color: #1D002C !important;}
.inverse-btn::before {background: #FFFFFF !important; filter: brightness(0.65);}
.small-btn {padding: 5px 15px !important; margin-top: 0px !important; width: auto !important;}

.show-tooltip {position: relative;}
.tooltip1 {visibility: hidden; background-color: black; color: #fff; text-align: center; padding: 5px 0; border-radius: 6px; width: auto; top: 115%; left: 50%; margin-left: -50%; position: absolute; z-index: 1; font-size: 12px; padding: 5px 8px; text-transform: capitalize;}
.show-tooltip:hover .tooltip1 {visibility: visible;}

.solid-text-color-1 {color: #338cf0;}
.solid-text-color-2 {color: #465DAF;}
.solid-text-color-3 {color: #D87230;}
.solid-text-color-4 {color: #A09019;}
.solid-text-color-5 {color: #1A936A;}
.solid-text-color-6 {color: #ff9999;}
.solid-text-color-7 {color: #00868C;}
.solid-bg-color-1 {background: #88BCF6;}
.solid-bg-color-2 {background: #A4B0DB;}
.solid-bg-color-3 {background: #EBB794;}
.solid-bg-color-4 {background: #E0CC38;}
.solid-bg-color-5 {background: #67E4BB;}
.solid-bg-color-6 {background: #ED0707;}
.solid-bg-color-7 {background: #00C2CC;}

.form-group {margin-bottom: 15px;}
.modal-body .form-group {margin-bottom: 25px;}
.blog-post .form-group {margin-bottom: 30px;}
.form-check-input {margin-right: 5px;}

.toggle-switch {position: relative;display: inline-block;width: 60px; height: 30px; left: 10px; top: 0;}
.toggle-slider {position: absolute;cursor: pointer;top: 0; left:-15px; right: 25px; bottom: 8px; background-color: #ccc;-webkit-transition: .4s;transition: .4s;}
.toggle-slider:before {position: absolute;content: ""; height: 14px;width: 14px;left: 5px; bottom: 4px;background-color: white;-webkit-transition: .4s;transition: .4s;}
input:checked + .toggle-slider {background-color: #2196F3;}
input:checked + .toggle-slider:before {-webkit-transform: translateX(26px);-ms-transform: translateX(26px);transform: translateX(26px);}

.toggle-slider.round {border-radius: 30px;}

.toggle-slider.round:before {border-radius: 50%;}

.icon-btn.edit:after {background-image: url(../img/edit-1-icon.png);}
.icon-btn.delete:after {background-image: url(../img/delete-1-icon.png);}
.icon-btn.associate:after {background-image: url(../img/associate-candidate-icon.png);}
.icon-btn.associate-job:after {background-image: url(../img/associate-job-icon.png);}
.icon-btn.send-email:after {background-image: url(../img/send-email-icon.png);}
.icon-btn.clone:after {background-image: url(../img/clone-icon.png);}
.icon-btn.schedule:after {background-image: url(../img/schedule-icon.png);}
.icon-btn.reschedule:after {background-image: url(../img/reschedule-icon-1.png);}
.icon-btn.evaluation:after {background-image: url(../img/evaluation-icon.png);}
.icon-btn.submit-candidate:after {background-image: url(../img/submit-candidate-icon.png);}
.icon-btn.publish:after {background-image: url(../img/publish-icon.png);}
.icon-btn.settings:after {background-image: url(../img/setting-lines-icon.png);}

.form-btn-wrapper {text-align: right;}
.img-upload-container {text-align: center;}
.img-preview {width: 100%; height: 150px; background: #EAEDF0; border: 1px solid #CED4DA; border-radius: 4px; overflow: hidden; display: flex; align-items: center; justify-content: center; padding: 2px;}
.upload-btn-wrapper {position: relative; overflow: hidden; display: inline-block; margin-top: 20px; text-align: center;}
.upload-btn-wrapper .upload-btn {border: 1px solid #DCDCDC; color: #333333; background-color: #EFEFEF; padding: 8px 20px; border-radius: 3px; font-size: 14px; font-weight: 500; text-transform: uppercase;}
.upload-btn-wrapper .upload-btn:hover {filter: brightness(0.9);}
.upload-btn-wrapper input[type=file] {font-size: 22px; position: absolute; left: 0; top: 0; opacity: 0; width: 100%;}
.align-left {text-align: left !important;}
.align-center {text-align: center !important;}
.align-right {text-align: right !important;}
.inline {display: inline-block !important;}
.float-right {float: right !important;}
.float-left {float: left !important;}
.uppercase {text-transform: uppercase !important;}
.lowercase {text-transform: lowercase !important;}
.capitalize {text-transform: capitalize !important;}
.header-msg h5 {margin: 0; padding: 0;}
.content-msg {text-align: center; margin: 50px; font-size: 16px;}
form .input-group .req {color: #FC2D42;}
.background-white {background: #FFFFFF;}
.error {color: #FF0000; margin: -5px 0 10px;}
.form-alert {margin-bottom: 15px; padding: 10px; border-radius: 3px; font-size: 13px;}
.form-alert.error {background: #FDEDEE; border: 1px solid #F8A9AD;}
.form-alert.success {background: #E9FFF6; border: 1px solid #3ACC74;}

.container .row .va-center {display: flex; align-items: center; justify-content: center;}

.popup-modal .modal-dialog {max-width: 950px !important;}
.popup-modal .modal-dialog .pre-table.up .col-md-6 {margin-top: 0 !important;}
.popup-modal .modal-dialog .content.table {max-height: 450px; padding-top: 0 !important;}
.popup-modal .modal-dialog .content.table thead {background: #FFFFFF; position: sticky; top: 0; height: 50px;}
.popup-modal .modal-dialog .content.table tbody tr {position: static;}

.modal-dialog {max-width: 650px !important;}

header {width: 100%; padding: 35px 0 25px; z-index: 999;}
header .header-search {/*width: 450px;*/ position: relative;}
header .header-search .search-input-icon {background: url("../img/icons/search-icon.png") no-repeat center center / contain; position: absolute; width: 15px; height: 15px; margin: 12px;}
header .header-search input {border-radius: 6px; border: none; padding-left: 35px; box-shadow: 0 7px 14px 0 rgb(200 200 200 / 10%), 0 3px 6px 0 rgb(200 200 200 / 10%);}
header .header-search select {width: auto; position: absolute; top: 0; right: 0; border: none; border-left: 1px solid #DCDCDC; border-bottom-left-radius: 0; border-top-left-radius: 0; color: #888888; font-size: 15px; margin-top: 1px;}
header .header-search .search-results {display: none; position: absolute; z-index: 999999; background: #FFFFFF; width: 100%; margin-top: 5px; padding: 10px 0px; border-radius: 6px; box-shadow: 0 7px 14px 0 rgb(200 200 200 / 10%), 0 3px 6px 0 rgb(200 200 200 / 10%);}
header .header-search .search-results ul .search-msg {padding: 50px; text-align: center;}
header .header-search .search-results ul li {position: relative; padding: 5px 15px;}
header .header-search .search-results ul li.background {background: #555555;}
header .header-search .search-results ul li:hover {background: #F5F5F5;}
header .header-search .search-results ul li img {width: 50px; height: 50px; margin-right: 15px;}
header .header-search .search-results ul li .type {font-size: small; color: #678678; line-height: 100%; position: absolute; right: 15px; top: 50%; transform: translateY(-50%);}
header .header-search .search-results ul li.selected {background: #908FE5; color: #FFFFFF;}
header .header-search .search-results ul li.selected .type {color: #FFFFFF;}
header .mobile-logo {display: none;}
header .mobile-logo img {filter: invert(0.8); width: auto; height: 30px;}
header .mobile-logo .menu-toggle {display: inline-block; width: 20px; height:20px; background: url(../img/icons/menu-icon.png) no-repeat center / cover; margin: 5px 20px 0; margin-right: 20px; vertical-align: middle;}
header .header-options-container {float: right;}
header .header-options-container .header-options {}
header .header-options-container .header-options li {width: 20px; height: 20px; cursor: pointer; display: inline-block; margin: 0 20px; position: relative;}
header .header-options-container .header-options li span {width: auto; height: 100%; display: block; background: no-repeat center center / contain;}
header .header-options-container .header-options li.active span {filter: invert(41%) sepia(73%) saturate(7263%) hue-rotate(237deg) brightness(95%) contrast(100%);}
header .header-options-container .header-options li.search-toggle {display: none;}
header .header-options-container .header-options li.search-toggle span {background-image: url("../img/icons/search-icon.png");}
header .header-options-container .header-options li.add-new span {background-image: url("../img/icons/add-new-icon.png");}
header .header-options-container .header-options li.chat span {background-image: url("../img/icons/chat-icon.png");}
header .header-options-container .header-options li.notification span {background-image: url("../img/icons/notification-icon.png");}
header .header-options-container .header-options li.notification .notification-count {position: absolute; top: -12px; left: 12px; background: #EF3E2D; min-width: 18px; height: 18px; text-align: center; border-radius: 5px; color: #FFFFFF; padding: 0 3px; font-size: small; font-weight: bold;}
header .header-options-container .header-options li.user {width: auto; position: relative; margin-right: 45px;}
header .header-options-container .header-options li.user img {width: 50px; height: 50px; top: -5px;position: relative; border-radius: 50%; border: 1px solid #DCDCDC; padding: 2px;}
header .header-options-container .header-options li.user span {margin-left: 5px; max-width: 135px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
header .header-options-container .header-options li.user:before {width: 18px; height: 18px; background: url("../img/down-arrow.png") no-repeat center center / contain; content: ""; display: block; position: absolute; right: -35px; top: 11px;}
header .header-options-container .header-options li.user.active:before {background: url("../img/up-arrow.png") no-repeat center center / contain;}
header .header-options-container .header-options li .header-dd {display: none; position: absolute; background: #FFFFFF; top: 50px; right: -35px; width: 500px; border-radius: 6px; box-shadow: 0 7px 14px 0 rgb(200 200 200 / 10%), 0 3px 6px 0 rgb(200 200 200 / 10%); transform: translateY(-20px); transition: all 300ms ease; opacity: 0; visibility: hidden; z-index: 9999;}
header .header-options-container .header-options li .header-dd .header-dd-msg {padding: 100px; text-align: center; font-size: 18px}
header .header-options-container .header-options li .header-dd .header-dd-title {padding: 10px 20px; border-bottom: 1px solid #dedede; font-size: 15px; font-weight: 700; text-align: left; color: #666666; letter-spacing: .3px; cursor: auto;}
header .header-options-container .header-options li .header-dd .quick-add-list {padding: 20px;}
header .header-options-container .header-options li .header-dd .quick-add-list .add-item {margin-bottom: 15px;}
header .header-options-container .header-options li .header-dd .quick-add-list .add-item a {color: #555555;}
header .header-options-container .header-options li .header-dd .quick-add-list .add-item a:hover {color: #4A49F1;}
header .header-options-container .header-options li .header-dd .header-dd-bottom {text-align: center; border-top: 1px solid #DEDEDE;}
header .header-options-container .header-options li .header-dd .header-dd-bottom a {display: block; padding: 10px; background: #EFEFEF; color: #888888; border-radius: 0 0 6px 6px;}
header .header-options-container .header-options li .header-dd .header-dd-bottom a:hover {color: #333333;}
header .header-options-container .header-options li.user .header-dd {width: 250px;}
header .header-options-container .header-options li.add-new .header-dd {height: 300px;}
header .header-options-container .header-options li .header-dd.show {transform: translateY(0px); opacity: 1; visibility: visible;}
header .header-options-container .header-options li.user .header-dd .user-info {padding: 20px !important; border-bottom: 1px solid #DEDEDE; cursor: auto;}
header .header-options-container .header-options li .sub-options {margin: 10px 0 !important; height: 250px;}
header .header-options-container .header-options li .sub-options.scrollable {overflow-y: auto; overflow-x: hidden;}
header .header-options-container .header-options li.user .sub-options {margin: 10px 0 !important; height: auto;}
header .header-options-container .header-options li .sub-options li.sub-option {display: block; width: 100%; margin: 0; height: auto;}
header .header-options-container .header-options li .sub-options li.sub-option a, table tbody tr td a.target-link {display: block; color: #888888; padding: 15px 20px;}
table tbody tr td a.target-link {overflow: auto; padding: 10px 20px;}
header .header-options-container .header-options li .sub-options li.sub-option:hover a {color: #333333; background: #F5F5F5;}
header .header-options-container .header-options li .sub-options li.sub-option a .notification-list .note-img, table tbody tr td a .notification-list .note-img, a .notification-list .note-img {width: 50px; height: 50px; float: left; margin-right: 15px; padding: 10px; border-radius: 50%; background: #EFEFEF;}
table tbody tr td a .notification-list .note-text {text-align: left; font-size: 15px; position: relative; top: 12px;}
table tbody tr td a .notification-list .note-text p {float: left;}
table tbody tr td a .notification-list .note-text .note-time {float: right;}
header .header-options-container .header-options li .sub-options li.sub-option a .notification-list .note-text .note-time, table tbody tr td a .notification-list .note-text .note-time {font-size: smaller; text-align: right;}
header .menu-btn-container {position: relative; float: right;}
header .menu-btn-container .toggle-menu-btn .menu-text {text-transform: uppercase; color: #FFFFFF; position: absolute; top: 0; right: 35px; transition: all 0.1s ease-in-out; opacity: 0;}
header .menu-btn-container .toggle-menu-btn:hover .menu-text {opacity: 1; right: 50px;}
header .toggle-menu-btn {display: block; position: relative; width: 35px; height: 20px; transition: .25s; z-index: 15;}
header .toggle-menu-btn:hover {cursor: pointer;}
header .toggle-menu-btn .menu-bar {position: absolute; border-radius: 2px; width: 80%; transition: .5s;}
header .toggle-menu-btn .menu-bar-top {border: 3px solid #FFFFFF; border-bottom: none; top: 0;}
header .toggle-menu-btn .menu-bar-middle {height: 3px; background-color: #FFFFFF; margin-top: 5px; margin-bottom: 5px; top: 3px;}
header .toggle-menu-btn .menu-bar-bottom {border: 3px solid #FFFFFF; border-top: none; top: 16px;}
header .btn-open .menu-bar-top {transform: rotate(45deg) translate(4px, 4px); transition: .5s;}
header .btn-open .menu-bar-middle {transform: translate(230px); transition: .1s ease-in; opacity: 0;}
header .btn-open .menu-bar-bottom {transform: rotate(-45deg) translate(8px, -7px); transition: .5s;}
header.fixed {position: fixed; background: transparent; z-index: 9999;}
header.fixed .site-logo img {filter: invert(41%) sepia(39%) saturate(6838%) hue-rotate(343deg) brightness(94%) contrast(100%);}
header.fixed .toggle-menu-btn .menu-bar-top {border: 3px solid #333333; border-bottom: none;}
header.fixed .toggle-menu-btn .menu-bar-middle {background-color: #333333;}
header.fixed .toggle-menu-btn .menu-bar-bottom {border: 3px solid #333333; border-top: none;}
.menu-container {}
.menu-container nav ul.menu {position: relative; float: right;}
.menu-container nav ul.menu li.menu-item {display: inline-block; display: inline-block; font-size: 14px; font-weight: 600; margin: 0 15px;}
.menu-container nav ul.menu li.menu-item a {position: relative; color: #000 !important;}
.menu-container nav ul.menu li.view-site a, .menu-container nav ul.menu li.logout a {padding-left: 25px;}
.menu-container nav ul.menu li a:before {display: inline-block; top: 2px; left: 0; position: absolute; background-size: contain !important; background-repeat: no-repeat !important; width: 16px; height: 16px; content: '';}
.menu-container nav ul.menu li.view-site a:before {background: url(../img/view-site.svg);}
.menu-container nav ul.menu li.logout a:before {background: url(../img/logout.svg);}
.menu-container nav ul.menu li.menu-item a:hover {color: #555 !important; text-decoration: none;}

footer .footer-copyright {padding: 20px;}
footer .footer-copyright .copyright-text {color: #333333; text-align: center; font-size: 13px;}

.content-tab-links-container {position: relative; z-index: 1;}
.content-tab-links-container.fixed {position: fixed; background: #F4F4FC; z-index: 99;}
.content-tab-links-container.fixed .content-tab-links {margin-bottom: 0 !important;}
.content-tab-links-container .content-tab-links {border-bottom: 1px solid #DCDCDC; margin-bottom: 30px !important;}
.content-tab-links-container .content-tab-links li.tab-link {display: inline-block; margin-right: 10px; position: relative; padding: 12px; cursor: pointer; font-size: 18px; font-weight: 600; color: #555555;}
.content-tab-links-container .content-tab-links li.tab-link:hover {background: #EEEEEE;}
.content-tab-links-container .content-tab-links li.tab-link.active {color: #4A49F1;}
.content-tab-links-container .content-tab-links li.tab-link.active:after {content: " "; position: absolute; width: 100%; height: 3px; bottom: 0; left:0; background: #4A49F1;}
.content-tab-links-container span {position: absolute; top: 15px; right: 15px; color: #666768;}
.content.tab {display: none;}
.content.tab.active {display: block;}

.side-tabs .side-tab {padding: 10px 15px; cursor: pointer;}
.side-tabs .side-tab.active {background: #EFEFEF; font-weight: bold;}

.input-popup span.block {padding: 10px 25px; background: #EFEFEF; margin: 5px; display: inline-block; border-radius: 25px;}
.input-popup span.block span.remove-block {width: 1em; height: 1em; padding: 0.50rem 0.50rem; color: #000; background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/0.75em auto no-repeat; border: 0; border-radius: 0.25rem; opacity: .5; margin-left: 15px; cursor: pointer;}
.input-popup span.block span.remove-block:hover {opacity: 0.8;}

.login-page {text-align: center; margin: 0px auto;}
.login-page .row {min-height: 100vh;}
.login-page .login-logo {position: absolute; top: 50px; left: 30px;}
.login-page .login-logo img {width: 200px; filter: invert(0.8);}
.login-page .login-logo span {display: inline-block; margin-left: 25px; font-size: 25px; font-weight: 300; position: relative; top: 10px; letter-spacing: 0.35px;}
.login-page .login-logo span:before {content: ""; background: #555555;  position: absolute; width: 1px; height: 100%; left: -13px;}
.login-page .login-form-container {max-width: 400px; width: 400px; margin: 30px auto 0; text-align: left; float: right;}
.login-page .login-form-container .login-text {margin: 0 0 30px; color: #555555; font-weight: 300;}
.login-page .login-form-container .login-sub-text {margin: 0 0 5px; color: #666666; font-weight: 300;}
.login-page .login-form-container form .form-group {margin-bottom: 20px;}
.login-page .login-form-container form .form-group input[type=text], .login-page .login-form-container form .form-group input[type=password] {height: 50px;}
.login-page .login-form-container form .form-group input[type=checkbox] {margin-right: 5px;}
.login-page .login-form-container form .form-group label {color: #555555; font-weight: 500;}
.login-page .login-form-container form .form-error {background: #CDCDCD; padding: 10px; font-size: small; margin: 15px 0;}
.login-page .login-form-container form .btn {width: 100%; margin-top: 10px; padding: 14px !important;}
.login-page .login-illustration-container .login-illustration {background: no-repeat center center / cover; height: 500px;}
.login-page .login-illustration-container .login-illustration.users {background-image: url("../img/login-illustration.png");}
.login-page .login-illustration-container .login-illustration.clients {background-image: url("../img/clients-login-illustration.png");}
.login-page .login-illustration-container .login-illustration.candidates {background-image: url("../img/candidates-login-illustration.png");}
.login-page .login-links {position: absolute; top: 60px; right: 30px;}
.login-page .login-links li {display: inline-block; margin-left: 15px;}
.login-page .login-links li a {color: #555555; font-size: 18px;}

section {overflow: hidden;}
section.main {padding: 0; position: relative;}
section.main .popup-msg {position: fixed; display: none; width: 600px; margin: 0 auto; left: 0; right: 0; text-align: center; padding: 20px; top: 30px; background: #EFEFEF; border: 1px solid #DCDEDF; border-radius: 6px; z-index: 99999; font-size: 16px;}
section.main .popup-msg.compact {width: 300px;}
section.main .popup-msg.success {background: #D6F9d5;}
section.main .popup-msg.failure {background: #F9D5D5;}
section.main .popup-msg.alert {background: #EFDEFD;}
section.main .left {background: #FFFFFF; position: fixed; height: 100vh;  overflow-y: auto; overflow-x: hidden;}
section.main .left::-webkit-scrollbar {display: none;}
section.main .left .app-logo {padding: 30px; margin: 0 -12px; text-align: left; position: sticky; top: 0; background: #FFFFFF; z-index: 999;}
section.main .left .app-logo img {filter: invert(0.8); width: auto; height: 30px;}
section.main .left .app-logo img.logo {margin-left: 3px;}
section.main .left .app-logo span.sidebar-action {width: 25px; height: 25px; background: no-repeat center / cover; display: inline-block; bottom: 30px; right: 15px; position: absolute; opacity: 0.5; cursor: pointer;}
section.main .left .app-logo span.sidebar-action:hover {opacity: 0.8;}
section.main .left .app-logo span.sidebar-action.collapse {background-image: url(../img/collapse-icon.png);}
section.main .left .app-logo span.sidebar-action.reveal {background-image: url(../img/reveal-icon.png);}
section.main .left ul.nav {max-height: 100%; position: relative; color: #000; margin-top: 10px !important; padding-left: 15px !important; margin-right: -12px !important;}
section.main .left ul.nav > li {width: 100%; position: relative; cursor: pointer;}
section.main .left ul.nav > li.has-sub-nav:after {display: block; top: 15px; right: 20px; position: absolute; background-image: url(../img/down-arrow.png); background-repeat: no-repeat; background-position: center; background-size: contain; width: 15px; height: 15px; content: ''; opacity: 0.50; image-rendering: -webkit-optimize-contrast; transition: transform 300ms;}
section.main .left ul.nav > li.has-sub-nav:hover:after {opacity: 0.80;}
section.main .left ul.nav > li.has-sub-nav.active:after, section.main .left ul.nav > li.has-sub-nav.hovered:after {transform: rotate(-180deg); /*background-image: url(../img/up-arrow.png);*/}
section.main .left ul.nav > li.has-sub-nav.active.hovered:after {background-image: url(../img/down-arrow.png); transform: none;}
section.main .left ul.nav > li > a {display: block; padding: 10px 15px 10px 35px; position: relative; font-weight: 600; font-size: 15px; color: #9998A5; margin-bottom: 10px;}
section.main .left ul.nav > li > a:before {display: inline-block; left: 0; position: absolute; background-size: contain !important; background-repeat: no-repeat !important; width: 20px; height: 20px; content: ''; filter: invert(0.60); image-rendering: -webkit-optimize-contrast;}
section.main .left ul.nav > li:hover > a {color: #555555;}
section.main .left ul.nav > li:hover > a:before {filter: invert(32%) sepia(0%) saturate(63%) hue-rotate(179deg) brightness(89%) contrast(79%);}
section.main .left ul.nav > li.active > a, section.main .left ul.nav > li.hovered > a {color: #4A49F1;}
section.main .left ul.nav > li.active > a:before, section.main .left ul.nav > li.hovered > a:before {filter: invert(41%) sepia(73%) saturate(7263%) hue-rotate(237deg) brightness(95%) contrast(100%);}
section.main .left ul.nav > li.active > a:after {content: ""; position: absolute; height: 100%; top: 0; right: 0; border-left: 4px solid #4A49F1;}
section.main .left ul.nav > li.dashboard > a:before {background: url(../img/icons/dashboard-icon.png);}
section.main .left ul.nav > li.jobs > a:before {background: url(../img/icons/jobs-icon.png);}
section.main .left ul.nav > li.candidates > a:before {background: url(../img/icons/candidates-icon.png);}
section.main .left ul.nav > li.applications > a:before {background: url(../img/icons/applications-icon.png);}
section.main .left ul.nav > li.interviews > a:before {background: url(../img/icons/interviews-icon.png);}
section.main .left ul.nav > li.assessments > a:before {background: url(../img/icons/assessments-icon.png);}
section.main .left ul.nav > li.tasks > a:before {background: url(../img/icons/tasks-icon.png);}
section.main .left ul.nav > li.contacts > a:before {background: url(../img/icons/contacts-icon.png);}
section.main .left ul.nav > li.campaigns > a:before {background: url(../img/icons/campaigns-icon.png);}
section.main .left ul.nav > li.reports > a:before {background: url(../img/icons/reports-icon.png);}
section.main .left ul.nav > li.clients > a:before {background: url(../img/icons/clients-icon.png);}
section.main .left ul.nav > li.invoicing > a:before {background: url(../img/icons/invoicing-icon.png);}
section.main .left ul.nav > li.agreements > a:before {background: url(../img/icons/agreements-icon.png);}
section.main .left ul.nav > li.users > a:before {background: url(../img/icons/users-icon.png);}
section.main .left ul.nav > li.timeline > a:before {background: url(../img/icons/timeline-icon.png);}
section.main .left ul.nav > li.trashcan > a:before {background: url(../img/icons/recently-deleted-icon.png);}
section.main .left ul.nav > li.file-manager > a:before {background: url(../img/icons/file-manager-icon.png);}
section.main .left ul.nav > li.settings > a:before {background: url(../img/icons/settings-icon.png);}
section.main .left ul.nav > li.online-interviews > a:before {background: url(../img/icons/online-interview-icon.png);}
section.main .left ul.nav > li.blog > a:before {background: url(../img/icons/blog-icon.png);}

section.main .left ul.nav > li.has-sub-nav.active.hovered > ul.sub-nav {max-height: 0;}
section.main .left ul.nav > li.has-sub-nav > ul.sub-nav {max-height: 0; overflow: hidden; border-left: 4px solid #EDEDED; margin-left: 6px !important; transition: max-height 300ms ease-out;}
section.main .left ul.nav > li.has-sub-nav.active > ul.sub-nav, section.main .left ul.nav > li.has-sub-nav.hovered > ul.sub-nav {max-height: 600px;}
section.main .left ul.nav > li.has-sub-nav > ul.sub-nav > li > a {display: block; padding: 10px 15px 10px 30px; position: relative; font-weight: 600; font-size: 14px; color: #9998A5; margin-bottom: 10px;}
section.main .left ul.nav > li.has-sub-nav > ul.sub-nav > li:hover > a {color: #555555;}
section.main .left ul.nav > li.has-sub-nav > ul.sub-nav > li.active > a {color: #555555;}

section.main .right.fixed {position: relative;}
section.main .right.fixed header {display: none;}
section.main .right .section-header-view {position: relative; margin-top: 10px; z-index: 999;}
section.main .right .section-header-view.fixed {position: fixed; top: -10px;}
section.main .right .section-header-view.fixed .content {border-radius: 0; padding: 10px 25px; margin-bottom: 0;}
section.main .right .section-header-view .img-container img:before {content: ""; background: #ECC73C;}
section.main .right .section-header-view .img-container.job img {padding: 10px;}
section.main .right .section-header-view .img-container img {width: 100%; border-radius: 6px; border: 1px solid #DCDCDC; padding: 3px;}
section.main .right .section-header-view .section-title {color: #333333 !important;}
section.main .right .section-header-view .link-container {display: flex; align-items: center; flex-direction: row-reverse;}
section.main .right .section-header {position: relative; margin: 10px 0 5px; z-index: 9;}
section.main .right .section-header.fixed {position: fixed; top: 0; background: #FFFFFF; padding-top: 10px; margin-top: 0; box-shadow: 0 7px 14px 0 rgb(200 200 200 / 10%), 0 3px 6px 0 rgb(200 200 200 / 10%);}
section.main .right .section-header .section-title, section.main .right .section-header-view .section-title {font-size: 28px; font-weight: 600; text-align: left; margin-top: 10px; color: #4A49F1; display: flex; align-items: center;}
section.main .right .section-header .section-title-container .section-title, section.main .right .section-header-view .section-title-container .section-title {margin-top: 0;}
section.main .right .section-header .section-title-container .status, section.main .right .section-header-view .section-title-container .status {margin-top: 0;}
section.main .right .section-header .section-title-container .status .text, section.main .right .section-header-view .section-title-container .status .text {background: #90ED8F; padding: 4px 10px; border-radius: 6px; font-weight: 600;}
section.main .right .section-header .section-title-container .status .change-status-btn, section.main .right .section-header-view .section-title-container .status .change-status-btn {background: url(../img/change-status-icon.png) no-repeat center / contain; padding: 8px; margin-left: 10px; cursor: pointer;}
section.main .right .section-header .headerMsg {position: absolute; width: 70%; top: 15px; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center;}
section.main .right .section-header .btn-container, section.main .right .section-header .link-container {text-align: right;}
section.main .right .section-header .btn-container button, section.main .right .section-header .link-container a, section.main .right .section-header-view .link-container a {margin-left: 10px;}
section.main .right .section-header .btn-container button.has-options {position: relative; margin-right: 25px; border-radius: 3px 0 0 3px;}
section.main .right .section-header .btn-container button .button-options {display: block; background: #EF3E2D; position: absolute; right: -25px; top: 0; width: 25px; height: 100%; border-left: 1px solid #FFFFFF; border-radius: 0 3px 3px 0 !important;}
section.main .right .section-header .btn-container button .button-options:before {width: 12px; height: 12px; background: url("../img/down-arrow.png") no-repeat center center / contain; content: ""; position: absolute; left: 6px; top: 12px; filter: invert(1); image-rendering: -webkit-optimize-contrast;}
section.main .right .section-header .btn-container button .button-options.active:before {background: url("../img/down-up.png");}
section.main .right .section-header .btn-container .button-dd {display: none; position: absolute; right: 12px; top: 50px; background: #FFFFFF; border-radius: 6px; box-shadow: 0 7px 14px 0 rgb(200 200 200 / 30%), 0 3px 6px 0 rgb(200 200 200 / 30%); padding: 10px 0;}
section.main .right .section-header .btn-container .button-dd.show {display: block;}
section.main .right .section-header .btn-container .button-dd button, section.main .right .section-header .btn-container .button-dd a {display: block; width: 100%; border-bottom: 1px solid #dedede !important; border-radius: 0 !important; border: none !important; margin: 0;}
section.main .right .section-title .section-sub-title {font-size: 20px; margin-left: 10px; color: #676767; margin-top: 7px;}
section.main .right .section-title .section-sub-title a {margin: 0 0 0 5px;}
section.main .right .section-title form {float: right;}
section.main .right .section-title form label {padding: 12px; margin: 0; font-weight: 500;}
section.main .right .section-title form select {width: auto;}
section.main .right .section-title form button {margin-left: 10px;}
section.main .right .section-title button, section.main .right .section-title a {float: right; margin: 7px 15px 0 0;}
section.main .right .section-content#dashboard {margin-top: 15px;}
section.main .right .section-content .content {width: 100%; background: #fff; border-radius: 6px; box-shadow: 0 7px 14px 0 rgb(200 200 200 / 10%), 0 3px 6px 0 rgb(200 200 200 / 10%); /* box-shadow: /*0 7px 14px 0 rgb(60 66 87 / 10%), 0 3px 6px 0 rgb(0 0 0 / 10%) */ padding: 20px 25px; margin-bottom: 25px;}
section.main .right .section-content .content.fixed {height: 100vh; position: fixed; overflow-x: hidden; overflow-y: auto;}
section.main .right .section-content .content .content-title {font-size: 15px; font-weight: 600; margin: 10px 0 20px; border-bottom: 1px solid #CCCCCC; padding-bottom: 10px;}
section.main .right .section-content .content .content-title button {position: relative; top: -10px; float: right;}
section.main .right .section-content .content .content-body {margin-bottom: 40px;}
section.main .right .section-content .content .content-body .merge-fields-container {background: #F0F0F0; margin: 30px 12px -25px; padding: 30px 0 10px; width: 98%; border: 1px solid rgb(0 0 0 / 20%); border-bottom: none;}
section.main .right .section-content .content#stats .content-body {margin-bottom: 10px;}
section.main .right .section-content .content .section-msg {margin: 150px; text-align: center;}
section.main .right .section-content .content .section-msg.no-record {background: url(../img/no-record-found-img.png) no-repeat center/contain; height: 300px; width: 300px; margin: 50px auto;}
.modal-msg.no-record {background: url(../img/no-record-found-img.png) no-repeat center/contain; height: 200px; width: 300px; margin: 50px auto;}
section.main .right .section-content .content.card {border: none; padding: 15px;}
section.main .right .section-content .content.card.report-card {min-height: 350px;}
section.main .right .section-content .content.card.welcome {background: #4A49F1; color: #FFFFFF; padding: 30px 50px;}
section.main .right .section-content .content.card.welcome .user-illustration {background: no-repeat center/contain; height: 250px; width: 375px; position: absolute; top: 0; right: 0;}
section.main .right .section-content .content.card.welcome .user-illustration.female {background-image: url(../img/welcome-female-illustration.png); top: -11px;}
section.main .right .section-content .content.card.welcome .user-illustration.male {background-image: url(../img/welcome-male-illustration.png); top: -15px;}
section.main .right .section-content .content.card .card-title {font-size: 18px; border-bottom: 1px solid #DEDEDE; padding-bottom: 10px; font-weight: 600;}
section.main .right .section-content .content.card.welcome .card-title {font-size: 25px; padding: 0; border: none;}
section.main .right .section-content .content.card .card-title span {font-size: 13px; display: inline-block; float: right; margin-top: 5px;}
section.main .right .section-content .content.card .card-title span a {color: #678678; }
section.main .right .section-content .content.card .card-title span a:hover {color: #333333;}
section.main .right .section-content .content.card .card-msg {text-align: center; margin: 100px 15px;}
section.main .right .section-content .content.card.welcome .card-content {font-size: 15px; margin-right: 50%; padding: 15px 0 0; letter-spacing: 0.3px;}
section.main .right .section-content .content.card.welcome .card-content .card-link {margin-top: 18px;}
section.main .right .section-content .content.card.welcome .card-content .card-link a {background: transparent; padding: 5px 10px 5px 0; border-radius: 5px; font-size: 14px; transition: all 0.3s ease;}
section.main .right .section-content .content.card.welcome .card-content .card-link a:hover {background: #FFFFFF; color: #555555 !important; padding: 5px 10px;}
section.main .right .section-content .content .list-container {}
section.main .right .section-content .content .list-container li {cursor: pointer;}
section.main .right .section-content .content .list-container li:hover {background: #F5F5F5;}
section.main .right .section-content .content .list-container li a {display: block; padding: 15px 10px; color: #555555;}
section.main .right .section-content .content .list-container li a .name {display: inline-block;}
section.main .right .section-content .content .list-container li a .options {display: none; width: 15px; height: 15px; background: url(../img/dots.png) no-repeat center / contain; float: right; margin: 3px 0; cursor: pointer; opacity: 0.65; border: none;}
section.main .right .section-content .content .list-container li:hover a .options {display: block;}
.input-range-wrapper {display: flex; flex-direction: row;}
.input-range-wrapper span {margin: 10px 15px 5px;}
.span-range-wrapper {display: flex; width: 80%;}
.span-range-wrapper span.inline-label {width: auto !important; margin: 0 15px; border: none !important; font-weight: 500 !important; color: #666768 !important;}
.span-range-wrapper span.inline-label:hover {border: none;}

/* Media Page CSS */
.section-content.media-upload {display: none; width: 100%;}
.section-content.media-upload.open {display: block;}
.section-content.media-upload form {text-align: center;}
.section-content.media-upload form h4 {font-size: 20px; font-weight: 600;}
.section-content.media-upload form p {margin: 25px 0;}
.section-content.media-upload form input {margin: 20px auto;}
.section-content.media-upload form .upload-files-container {position: relative; width: 125px; margin: 0 auto;}
.section-content.media-upload form .upload-files-container button.upload-files { border: 1px solid #CCCCCC; display: inline-block; padding: 8px 16px; cursor: pointer; width: 125px;}
.section-content.media-upload form .upload-files-container input[type="file"] {font-size: 26px; position: absolute; left: 0; top: 0; opacity: 0; width: 125px; margin: 0;}
.section-content.media-upload .file-preview img {display: inline-block; height: 150px; width: auto; overflow: hidden; border: 1px solid #CCCCCC; margin:0 0 10px 10px;}

.section-content .media-container .media-file, .media-container .media-files .media-file, .section-content .media-container .media-folder {margin-bottom: 20px; cursor: pointer; text-align: center;}
.section-content .media-container .media-file img, .media-container .media-files .media-file img {width: 100%; height: 125px; padding: 2px; border: 1px solid #CCCCCC; object-fit: contain; margin-bottom: 10px;}
.section-content .media-container .media-file img.file, .media-container .media-files .media-file img.file {background: #F0F0F0; padding: 25px;}
.section-content .media-container .media-file:hover img, .media-container .media-files .media-file:hover img {border: 1px solid #428BCA;}
.section-content .media-container .media-file .filename, .media-container .media-files .media-file .filename, .section-content .media-container .media-folder .folder-name {font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.section-content .media-container .media-folder .folder-icon {background: url(/assets/img/icons/folder-icon.png) no-repeat center / contain; height: 125px; margin-bottom: 10px;}

.popup-overlay {display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4);}
.popup-overlay.open {display: block;}
.popup-overlay .popup-container {position: relative; background-color: #FEFEFE; margin: 60px auto 0; padding: 20px; border: 1px solid #888888; width: 85%;}
.popup-overlay .popup-container .popup-title {padding: 5px;}
.popup-overlay .popup-container.preview {width: 50%;}
.popup-overlay .popup-container .close {background: url(../img/close-icon.png) no-repeat center/contain; height: 12px; width: 12px; cursor: pointer; display: block; opacity: 0.75; position: absolute; right: 30px; top: 30px;}
.popup-overlay .popup-container .close:hover,
.popup-overlay .popup-container .close:focus {opacity: 1;}
.popup-overlay .popup-container .media-display, .media-container .media-files {text-align: center; border-right: 1px solid #CCCCCC; height: 80vh; overflow-y: auto; display: flex; align-items: center;}
.popup-overlay .popup-container.preview .media-display {border-right: none;}
.popup-overlay .popup-container .media-display img, .popup-overlay .popup-container .document-viewer img {max-height: 100%; width: auto; margin: auto;}
.popup-overlay .popup-container .media-display table {align-self: flex-start;}
.popup-overlay .popup-container .media-info {padding-left: 20px;}
.popup-overlay .popup-container .media-info h3 {font-size: 18px; margin: 10px 0; border-bottom: 1px solid #CCCCCC; padding-bottom: 10px;}
.popup-overlay .popup-container .media-info .details .details-list li {margin-bottom: 10px; font-size: 13px;}
.popup-overlay .popup-container .media-info .details .details-list li input {margin-top: 10px; font-size: 13px;}
.popup-overlay .popup-container .media-info .details form,  .media-container .media-info .details button.select-media-btn {margin-top: 20px;}
.popup-overlay .popup-container .media-info .details form input[type="submit"] {color: #F00;}
.popup-overlay .popup-container .document-viewer {text-align: center; height: 80vh; overflow-y: auto; display: flex; align-items: center; justify-content: center;}

/* Navigation Page CSS */
.section-content .menu-container .page-list-container .action-btn-container, .section-content .menu-container .custom-link-container .action-btn-container {padding-top: 10px; border-top: 1px solid #DDDDDD; margin-top: 10px; overflow: hidden;}
.section-content .menu-container .page-list-container .action-btn-container button, .section-content .menu-container .custom-link-container .action-btn-container button {float: right;}
.section-content .menu-container .menu-structure {width: 60%;}
.section-content .menu-container .menu-structure li {border: 1px solid #CCCCCC; border-radius: 3px; cursor: pointer; margin-bottom: 10px;}
.section-content .menu-container .menu-structure li span {float: right; font-size: smaller; margin-top: 3px; margin-right: 10px;}
.section-content .menu-container .menu-structure li .tab-title {background: #FFFFFF; border-bottom: none;}
.section-content .menu-container .menu-structure li.open .tab-title {border-bottom: 1px solid #CCCCCC; background: #F4F4F4;}
.section-content .menu-container .menu-structure li .action-link-container {overflow: hidden; margin-top: 15px;}
.section-content .menu-container .menu-structure li .action-link-container .remove-menu {float: right; padding: 10px; color: #b32d2e;}
.create-menu-form label {margin-right: 15px;}
.create-menu-form input {width: auto;}
.create-menu-form button {float: right;}
.create-menu-form .content-title {margin-top: 30px !important;}
.tab .tab-content .page-list li {margin-bottom: 5px;}

/* Customize Page CSS */
section.customize, section.customize .container-fluid {padding: 0;}
section.customize .container-fluid .row {margin: 0;}
section.customize .customize-preview-container {position: relative;}
section.customize .customize-preview-container .customize-preview {position: absolute; top: 0; right: auto; bottom: 0; left: 0; padding: 0; width: 100%; height: 100vh;}
section.customize .customize-preview-container .customize-preview iframe {width: 100%; height: 100%; overflow-y: auto; border: none;}
section.customize .customize-options {padding: 0; border-left: 1px solid #CCCCCC; height: 100vh; overflow-y: auto;}
section.customize .customize-options .options-header {position: fixed; top: 0; padding: 0 15px; border-bottom: 1px solid #CCCCCC; height: 50px; line-height: 3.5; max-width: 25%; width: 100%; z-index: 999; background: #F3F4F5;}
section.customize .customize-options .options-header span, section.customize .customize-options .options-header h3, section.customize .customize-options .options-header button {display: inline-block;} 
section.customize .customize-options .options-header span {position: absolute; height: 49px; width: 45px; left: 0; padding: 0 15px; border-right: 1px solid #CCCCCC; cursor: pointer;}
section.customize .customize-options .options-header span:hover {background: #FFFFFF;}
section.customize .customize-options .options-header span img {height: 20px; width: 20px;}
section.customize .customize-options .options-header h3 {font-size: 18px; margin: 0; padding-bottom: 10px; margin-left: 45px;}
section.customize .customize-options .options-header button {float: right; margin: 8px 0;}
section.customize .customize-options .options-nav {padding: 10px; margin-top: 50px;}
section.customize .customize-options .options-nav ul li {border: 1px solid #CCCCCC; border-radius: 3px; margin-bottom: 10px; background: #DFDFDF; padding: 15px; cursor: pointer;}
section.customize .customize-options .options-nav ul li:before {content: ""; background: url(../img/right-arrow.svg); height: 15px; width: 15px; display: block; float: right; margin-top: 5px; background-size: contain;}
section.customize .customize-options .options-content {position: absolute; left: 0; top: 50px; width: 100%;}
section.customize .customize-options .options-content .option-container {display: none;}
section.customize .customize-options .options-content .option-container .option-title {border-bottom: 1px solid #CCCCCC; background: #FFFFFF; padding: 15px; text-align: center;}
section.customize .customize-options .options-content .option-container .option-sub-title {border-bottom: 1px solid #CCCCCC; background: #FFFFFF; padding: 15px; text-align: left; font-size: 15px;}
section.customize .customize-options .options-content .option-container .option-title span.option-back {background: url(../img/left-arrow.svg); height: 15px; width: 15px; display: block; float: left; margin-top: 5px; margin-right: 15px; background-size: contain; cursor: pointer;}
section.customize .customize-options .options-content .option-container .option-content {padding: 15px 15px 50px;}

section.customize .customize-options .options-content .option-container .option-content .logo-preview, section.customize .customize-options .options-content .option-container .option-content .hero-img-preview, section.customize .customize-options .options-content .option-container .option-content .icon-preview {height: 150px; width: 100%; text-align: center; border: 1px solid #CCCCCC; padding: 15px;}
section.customize .customize-options .options-content .option-container .option-content .logo-preview img, section.customize .customize-options .options-content .option-container .option-content .hero-img-preview img, section.customize .customize-options .options-content .option-container .option-content .icon-preview img {height: 100%; width: auto;}
section.customize .customize-options .options-content .option-container .option-content .logo-btns, section.customize .customize-options .options-content .option-container .option-content .hero-img-btns {padding: 15px 0;}
section.customize .customize-options .options-content .option-container .option-content .logo-btns .upload-btn-wrapper, section.customize .customize-options .options-content .option-container .option-content .hero-img-btns .upload-btn-wrapper {position: relative; margin: -13px 10px;}
section.customize .customize-options .options-content .option-container .option-content .logo-btns .upload-btn-wrapper input[type=file], section.customize .customize-options .options-content .option-container .option-content .hero-img-btns .upload-btn-wrapper input[type=file] {font-size: 100px; position: absolute; left: 0; top: 0; opacity: 0;}

section.customize .customize-options .options-content .option-container .option-content input, section.customize .customize-options .options-content .option-container .option-content textarea {width: 100%;}
section.customize .customize-options .options-content .option-container .option-content textarea {min-height: 150px;}

section.main .right .inline-pre-table {display: none; position: absolute; top: 10px; right: 10px; z-index: 1;}
section.main .right .inline-pre-table.show {display: block;}
section.main .right .inline-pre-table .rows-selected {display: inline-block; position: relative; top: 3px;}

section.main .right .pre-table {padding: 10px 10px 25px; height: 55px; overflow: hidden; transition: all 0.3s ease-out;}
section.main .right .pre-table.up {padding: 0 10px 25px;}

section.main .right .pre-table div.col-md-8, section.main .right .pre-table div.col-md-4 {padding: 0 15px;}
section.main .right .pre-table.up div.col-md-8, section.main .right .pre-table.up div.col-md-4 {margin-top: -55px;}
section.main .right .pre-table.fixed {position: fixed; background: #F4F4FC; z-index: 9; margin-top: 10px; padding-bottom: 0;}
section.main .right .pre-table.fixed div.col-md-8, section.main .right .pre-table.fixed div.col-md-4 {padding: 0 15px 15px;}
section.main .right .pre-table.up.fixed div.col-md-8, section.main .right .pre-table.up.fixed div.col-md-4 {padding: 0 15px 0; border-bottom: none;}
section.main .right .pre-table input, section.main .right .pre-table select {width: 20%; border: none; outline: none; border-bottom: 1px solid #CCCCCC; padding: 3px 0; background: transparent; margin-right: 15px;}
section.main .right .pre-table .filter-options span.clear-filter-input, section.main .right .pre-table .filter-options.files span.clear-files-filter-input {display: none; font-size: 13px; color: #4A49F1; cursor: pointer;}
section.main .right .pre-table .list-row-count {display: inline-block; margin-top: 5px;}
section.main .right .pre-table .list-row-count span, section.main .right .pre-table .file-count span {font-weight: 600;}
section.main .right .pre-table .action-btn-container {padding: 15px 15px 0;}
section.main .right .pre-table.fixed .action-btn-container {border-top: 1px solid #DCDCDC;}
section.main .right .pre-table.up .action-btn-container {padding: 5px 15px 0;}
section.main .right .pre-table.up.fixed .action-btn-container {padding: 0 15px 0; border-top: none; border-bottom: 1px solid #DCDCDC;}
section.main .right .pre-table .action-btn-container button {margin-top: 2px !important; margin-left: 10px;}
section.main .right .pre-table .action-btn-container button span {font-weight: bold;}
section.main .right .pre-table .action-btn-container span.rows_selected {vertical-align: middle;}
section.main .right .pre-table .table-btn {margin-right: 10px; margin-top: -3px;}
section.main .right .pre-table .table-btn a {width: 18px; height: 18px; background: no-repeat center / contain; padding: 5px; margin: 5px; cursor: pointer; filter: opacity(0.60); image-rendering: -webkit-optimize-contrast;}
section.main .right .pre-table .table-btn a:hover {filter: opacity(0.90)}
section.main .right .pre-table .table-btn a.btn-copy {background-image: url("../img/copy-file-icon.png");}
section.main .right .pre-table .table-btn a.btn-excel {background-image: url("../img/excel-file-icon.png");}
section.main .right .pre-table .table-btn a.btn-csv {background-image: url("../img/csv-file-icon.png");}
section.main .right .pre-table .table-btn a.btn-pdf {background-image: url("../img/pdf-file-icon.png");}
section.main .right .pre-table .table-btn a.btn-print {background-image: url("../img/print-file-icon.png");}


section.main .right .section-content .table-footer {text-align: right; padding: 0 15px 25px;}
section.main .right .section-content .table-footer .pagination, section.main .right .section-content .table-footer .show-row-select {display: inline-block;}
section.main .right .section-content .table-footer .pagination span {padding: 5px 10px; margin: 0 5px; border-radius: 3px; cursor: pointer;}
section.main .right .section-content .table-footer .pagination span:hover {background: #DCDDDE;}
section.main .right .section-content .table-footer .pagination span.active {background: #ACBCCC; color: #FFFFFF;}
section.main .right .section-content .table-footer .show-row-select {margin-left: 25px;}
section.main .right .section-content .table-footer .show-row-select form {display: inline-block; margin-left: 5px;}

section.main .right .section-content .content.table {padding: 20px 0 25px; overflow: auto; position: relative;}
section .section-content .table-container {margin: 0 -25px;}
section .section-content .fixed-table-container {position: fixed; z-index: 9; display: none; overflow: auto; overflow-y: hidden; -ms-overflow-style: none; scrollbar-width: none;}
section .section-content .fixed-table-container::-webkit-scrollbar {display: none;}
section .section-content table.list.fixed thead {height: 50px; vertical-align: bottom;}
section .section-content table.list, section .section-content table.list-table {width: 100%; display: table; overflow-x: auto; white-space: nowrap;}
section .section-content table.list thead, section .section-content table.list-table thead, .popup-overlay .popup-container .media-display table thead {background: #FFFFFF;}
section .section-content table.list thead tr, section .section-content table.list tbody tr, section .section-content table.list-table thead tr, section .section-content table.list-table tbody tr, .popup-overlay .popup-container .media-display table thead tr, .popup-overlay .popup-container .media-display table tbody tr {display: table-row; position: relative; border: none;}
section .section-content table.list thead tr th, section .section-content table.list tbody tr td, section .section-content table.list-table thead tr th, section .section-content table.list-table tbody tr td, .popup-overlay .popup-container .media-display table thead tr th, .popup-overlay .popup-container .media-display table tbody tr td {display: table-cell;}
section .section-content table.list thead tr th, section .section-content table.list-table thead tr th, .popup-overlay .popup-container .media-display table thead tr th {padding: 15px 10px; border-bottom: 2px solid #E9E9E9; font-size: 13px; font-weight: 500; text-transform: uppercase; text-align: center;}
section .section-content table.list thead tr th.action-btn, section .section-content table.list-table thead tr th.action-btn {display: none;}
section .section-content table.list thead tr th input[type=checkbox], section .section-content table.list-table thead tr th input[type=checkbox] {margin: 0 10px;}
section .section-content table.list thead tr th, section .section-content table.list-table thead tr th, .popup-overlay .popup-container .media-display table thead tr th {padding: 0 10px 10px;}
section .section-content table.list tbody tr:nth-child(odd), section .section-content table.list-table tbody tr:nth-child(odd), .popup-overlay .popup-container .media-display table tbody tr:nth-child(odd) {background: #FCFCFC;}
section .section-content table.list tbody tr:nth-child(even), .popup-overlay .popup-container .media-display table tbody tr:nth-child(even) {background: #FFFFFF;}
section .section-content table.list tbody tr:hover, .popup-overlay .popup-container .media-display table tbody tr:hover {background: #F5F5F5;}
section .section-content table.list tbody tr:hover .action-btn {display: table-cell;}
section .section-content table.list tbody tr td, section .section-content table.list-table tbody tr td, .popup-overlay .popup-container .media-display table tbody tr td {padding: 15px 10px; text-align: center; border-bottom: 1px solid #E9E9E9;}
section .section-content table.list-table tbody tr td .remove {background: url(../img/close-icon.png) no-repeat center/contain; height: 12px; width: 12px; cursor: pointer; display: block;}
section .section-content table.list tbody tr td .list-img-container {display: inline-block; width: 40px; height: 40px; line-height: 36px; margin-right: 10px; overflow: hidden; vertical-align: middle; border-radius: 3px;
    border: 1px solid #DCDCDC;}
section .section-content table.list tbody tr td .list-img-container img.list-img {width: 100%; height: auto; padding: 2px;}
section .section-content table.list tbody tr td .name {vertical-align: middle;}
section .section-content table.list tbody tr td.action-btn {display: none; position :sticky; position: -webkit-sticky; right: 0; padding: 15px 10px; vertical-align: middle; background: #F5F5F5; border-top: 1px solid #E9E9E9; border-bottom: 1px solid #E9E9E9;}
section .section-content table.list tbody tr td.action-btn a, section .section-content table.list tbody tr .action-container a {display: inline-block; padding: 0 20px; background: no-repeat center/contain; height: 15px; width: 15px; cursor: pointer;}
section .section-content table.list tbody tr td.action-btn a.reset-password-btn {background-image: url(../img/password-icon.png);}
section .section-content table.list tbody tr td.action-btn a.clone-btn {background-image: url(../img/clone-1-icon.png);}
section .section-content table.list tbody tr td.action-btn a.edit-btn {background-image: url(../img/edit-icon.png);}
section .section-content table.list tbody tr td.action-btn a.del-btn {background-image: url(../img/delete-icon.png);}
section .section-content table.list tbody tr td.action-btn a.restore-btn {background-image: url(../img/restore-icon.png);}
section .section-content table.list tbody tr td.action-btn a.reschedule-btn {background-image: url(../img/reschedule-icon.png);}

section .section-content table.list.hiring-pipeline tbody tr:hover td .job-stat:after {border-left-color: #F5F5F5;}
section .section-content table.list.hiring-pipeline thead tr th.job-title, section .section-content table.list.hiring-pipeline tbody tr td.job-title, section .section-content .fixed-table-container table.list.fixed thead tr th.job-title {font-size: 110%; padding-left: 25px; position: sticky; left: 0; top: 0; z-index: 1; background: #FFFFFF;}
section .section-content table.list.hiring-pipeline tbody tr td.job-title {min-width: 250px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
section .section-content table.list.hiring-pipeline tbody tr td.job-title a {display: block;}

section .section-content table.list.hiring-pipeline tbody tr td .job-stat {width: auto; min-width: 100px; height: 40px; position: relative; display: flex; align-items: center; justify-content: center; padding-left: 20px; margin: 0 20px; font-weight: 600; color: #555555; font-size: 110%;}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat:after {content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: 0; border-left: 20px solid #FFFFFF; border-top: 20px solid transparent; border-bottom: 20px solid transparent;}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat:before {content: ''; position: absolute; right: -20px; bottom: 0; width: 0; height: 0; border-left: 20px solid #32557f; border-top: 20px solid transparent; border-bottom: 20px solid transparent;}

section .section-content table.list.hiring-pipeline tbody tr td .job-stat.screening {background: rgba(136, 188, 246, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.submissions {background: rgba(164, 176, 219, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.interviewed {background: rgba(235, 183, 148, 0.3)}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.offered {background: rgba(224, 204, 56, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.hired {background: rgba(103, 228, 187, 0.3)}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.rejected {background: rgba(237, 7, 7, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.archived {background: rgba(0, 194, 204, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.screening:before {border-left-color: rgba(136, 188, 246, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.submissions:before {border-left-color: rgba(164, 176, 219, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.interviewed:before {border-left-color: rgba(235, 183, 148, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.offered:before {border-left-color: rgba(224, 204, 56, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.hired:before {border-left-color: rgba(103, 228, 187, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.rejected:before {border-left-color: rgba(237, 7, 7, 0.3);}
section .section-content table.list.hiring-pipeline tbody tr td .job-stat.archived:before {border-left-color: rgba(0, 194, 204, 0.3);}

/* Vacancies Page CSS */
.section-content.add-job {display: none; width: 100%;}
.section-content.add-job.open {display: block;}
.section-content.add-job form {width: 50%; margin: 0 auto; padding: 25px;}
.section-content.add-job form label, .section-content.add-job form input[type=text] {margin-bottom: 15px;}
.section-content.add-job-titles {display: none; width: 100%;}
.section-content.add-job-titles.open {display: block;}
.section-content.add-job-titles form {width: 50%; margin: 0 auto; padding: 25px;}
.section-content.add-job-titles form label, .section-content.add-job-titles form textarea {margin-bottom: 15px;}
.section-content.add-job-titles form small {display: block; width: 100%; margin-bottom: 10px;}
.vacancies-container {min-height: 500px;}
.vacancies-container .vacancy-item {padding: 0 10px; margin: 10px 0;} 
.vacancies-container form.edit-form {border: 1px solid #CDCDCD; width: 100%; border-radius: 3px; padding: 10px;}
.vacancies-container form.edit-form.active {border-color: #357ebd;}
.vacancies-container form.edit-form .form-group {position: relative; margin: 10px 0;}
.vacancies-container form.edit-form .form-control {width: 80%; display: inline-block; font-size: 16px; height: auto; padding: 5px 10px;}
.vacancies-container form.edit-form .form-control[readonly] {background: none; border-color: transparent; outline: none; box-shadow: none;}
.vacancies-container form.edit-form .save-btn {display: none; margin-top: -5px;}
.vacancies-container form.edit-form .action-btn {position: absolute; top: 0; right: 0; padding: 10px 15px;}
.vacancies-container form.edit-form .action-btn a {display: inline-block; padding: 0 10px;}
.vacancies-container form.edit-form .action-btn a.edit-btn {background: url(../img/edit.svg) no-repeat center; height: 15px; width: 15px; background-size: contain; cursor: pointer;}
.vacancies-container form.edit-form .action-btn a.del-btn {background: url(../img/trash.svg) no-repeat center; height: 15px; width: 15px; background-size: contain; cursor: pointer;}

.content .stats-view, #stats.row {text-align: center;}
.content .stats-view .col-md-2:nth-child(4n+1), #stats.row .col-md-3:nth-child(4n+1) {color: #648FDF;}
.content .stats-view .col-md-2:nth-child(4n+2), #stats.row .col-md-3:nth-child(4n+2) {color: #70ABAE;}
.content .stats-view .col-md-2:nth-child(4n+3), #stats.row .col-md-3:nth-child(4n+3) {color: #874CAB;}
.content .stats-view .col-md-2:nth-child(4n+4), #stats.row .col-md-3:nth-child(4n+4) {color: #BB7982;}
.content .stats-view .stat .stat-figure, #stats.row .stat .stat-figure {font-size: 30px;}
.content .stats-view .stat .stat-label, #stats.row .stat .stat-label {font-size: 16px; margin-top: 10px;}

.content .data-view, .content .data-view label, .content .data-view span {margin-bottom: 15px; position: relative;}
.content .data-view label {width: 100%; text-align: right; color: #666768;  padding: 5px 0;}
.content .data-view span {display: block; width: 80%; text-align: left; font-weight: 600; border: 1px solid transparent; border-bottom: 1px solid #EEEEEE;  padding: 4px; min-height: 31px;}
.content .data-view span.locked {cursor: not-allowed;}
.content .data-view span.locked:after {content: ""; background: url(../img/lock-icon.png) no-repeat center/contain; height: 15px; width: 15px; position: absolute; top: 7.5px; right: 7.5px; filter: opacity(0.60) invert(0); image-rendering: -webkit-optimize-contrast;}
.content .data-view span:hover {border: 1px solid #DEDEDE; border-radius: .25em;}
.content .data-view span.document-viewer {cursor: pointer; color: #4A49F1;}
.content .data-view span .file-input-mask {position: absolute; z-index: 99; padding: 7px 10px; background: #FFFFFF; margin: 1px; width: 95%;}
.content .data-view span .file-input-mask .del-doc-btn {background: url(../img/delete-icon.png) no-repeat center; height: 15px; width: 15px; background-size: contain; cursor: pointer; padding: 20px 0 0; display: inline-block; float: right; margin: 0;}
.content .data-view input[type="date"], .content .data-view input[type="datetime-local"], .content .data-view input[type="time"] {position: absolute; right: 23%; z-index: 1; border: 0; padding: 0px; margin-top: 5px; width: 18px; outline: none;}
.content .data-view input[type="time"] {width: 28px;}
.content .data-view select {border: none; position: absolute; z-index: 1; top: 6px; left: 15px; width: 72%;}
.content .data-view select:hover ~ span {border: 1px solid #DEDEDE; border-radius: .25em;} 
.content .data-view select:active ~ span
.content .data-view select:focus {outline: none;}
.content .data-view span.document-preview {position: absolute; background: #FFFFFF; z-index: 1;}
.content .data-view span.document-preview a {display: block; width: 100%;}
.content .data-view span.document-preview ~ span {opacity: 0;}

.chat-container {position: relative; right: 10px; z-index: 999999;}
.chat-window {display: none; position: fixed; bottom: 0; right: 0; margin-right: 35px; width: 300px; background: #FFFFFF; border: 1px solid #DDDEDF; border-radius: 8px 8px 0 0; box-shadow: 0 7px 14px 0 rgb(200 200 200 / 10%), 0 3px 6px 0 rgb(200 200 200 / 10%);}
.chat-window.show {display: block;}
.chat-window.enlarge {width: 500px;}
.chat-window .chat-header {height: 45px; background: #908FE5; color: #FFFFFF; border-bottom: 1px solid #DCDCDC; padding: 5px 8px; border-radius: 8px 8px 0 0; -webkit-transition: background 0.5s linear; -moz-transition: background 0.5s linear; -ms-transition: background 0.5s linear; -o-transition: background 0.5s linear; transition: background 0.5s linear;}
  .chat-window .chat-header.trigger {background: #333333;}
.chat-window .chat-header img {width: 35px; height: 35px; float:left; margin-right: 5px; border-radius: 50%; border: 1px solid #DCDCDC; padding: 1px;}
.chat-window .chat-header .name-container {float: left;}
.chat-window .chat-header .name-container div.name {font-size: 13px; font-weight: 700; width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.chat-window .chat-header .name-container div.status {font-size: 11px;}
.chat-window .chat-header .options {float: right; padding: 10px 5px !important;}
.chat-window .chat-header .options li {display: inline-block; background:#DDDDDD; height: 10px; width: 10px; margin-left: 10px; cursor: pointer; filter: invert(1); image-rendering: -webkit-optimize-contrast;}
.chat-window .chat-header .options li.minimize {background: url(../img/minimize-icon.png) no-repeat center / contain;}
.chat-window .chat-header .options li.enlarge {background: url(../img/enlarge-icon.png) no-repeat center / contain;}
.chat-window .chat-header .options li.enlarge.shrink {background: url(../img/shrink-icon.png) no-repeat center / contain;}
.chat-window.inactive .chat-header .options li.enlarge {display: none;}
.chat-window .chat-header .options li.close {background: url(../img/close-icon.png) no-repeat center / contain;}
.chat-window .chat-body {width: 100%; height: 400px; padding: 8px; overflow: hidden; margin-bottom: 10px; position: relative;}
.chat-window .chat-body .search-input {position: relative; margin-bottom: 10px;}
.chat-window .chat-body .search-input .create-group-btn {font-size: 20px; font-weight: bold; color: #678678; position: absolute; top: 0; right: 0; padding: 0 10px; display: block; cursor: pointer;}
.chat-window.enlarge .chat-body {width: 100%; height: 600px;}
.chat-window .chat-body.hide {display: none;}
.chat-window .chat-body .chat-content-search {width: 100%;}
.chat-window .chat-body .chat-msgs {height: 340px; overflow-y: auto; overflow-x: hidden; padding-bottom: 10px;}
.chat-window.enlarge .chat-body .chat-msgs {height: 540px;}
.chat-window .chat-body .chat-msgs .chat-msg {text-align: center; margin-top: 150px; opacity: 0.75;}
.chat-window .chat-body .chat-msgs .msg {margin-bottom: 10px; padding: 5px 10px; background: #EDEDED; border-radius: 4px; width: 85%;}
.chat-window .chat-body .chat-msgs .msg.from {float: right; background: #D2D2F5;}
.chat-window .chat-body .chat-msgs .msg.to {float: left;}
.chat-window .chat-body .chat-msgs .msg .name {font-size: smaller; text-align: left; font-weight: bold; margin-bottom: 3px;}
.chat-window .chat-body .chat-msgs .msg .chat-time {font-size: smaller; text-align: right; opacity: 0.75;}
.chat-window .chat-body .chat-input-container {position: absolute; bottom: 5px; left: 0; width: 95%; margin: 0 8px;}
.chat-window .chat-body .chat-input-container .chat-input {width: 100%; padding-right: 40px;}
.chat-window .chat-body .chat-input-container .chat-submit-btn {display: block; width: 22px; height: 22px; background: url(../img/chat-send-icon.png) no-repeat center / contain; position: absolute; right: 0; top: 0; margin: 8px; cursor: pointer; opacity: 0.65; border: none;}
.chat-window .chat-body .chat-input-container .chat-submit-btn:hover {opacity: 0.85;}
.chat-window .chat-body .contacts {overflow-x: hidden; overflow-y: auto; height: 100%; padding-bottom: 30px !important;}
.chat-window .chat-body .contacts li {padding: 8px; cursor: pointer;}
.chat-window .chat-body .contacts li:hover {background: #F5F5F5;}
.chat-window .chat-body .contacts li img {width: 35px; height: 35px; display: inline-block; margin-right: 5px; vertical-align: top; border-radius: 50%; border: 1px solid #DCDCDC; padding: 1px;}
.chat-window .chat-body .contacts li .name-container {display: inline-block;}
.chat-window .chat-body .contacts li .name-container div.name {font-size: 13px; font-weight: 700;}
.chat-window .chat-body .contacts li .name-container div.status {font-size: 11px;}
.chat-window .chat-body .contacts li .options {display: none; width: 15px; height: 15px; background: url(../img/dots.png) no-repeat center / contain; float: right; margin: 10px 0; cursor: pointer; opacity: 0.65; border: none;}
.chat-window .chat-body .contacts li .options:hover {opacity: 1;}
.chat-window .chat-body .contacts li:hover .options {display: block;}

/* Theme Page CSS */
.section-content .theme-container .theme-preview-wrapper {display: flex; flex-direction: column; align-items: flex-start; border: 1px solid #CCCCCC; margin-bottom: 25px;}
.section-content .theme-container .theme-preview-wrapper.active {border: 1px solid #428BCA;}
.section-content .theme-container .theme-preview-wrapper .theme-preview  { height: 225px; width: 100%; background: #EDEDED; overflow: hidden;}
.section-content .theme-container .theme-preview-wrapper .theme-preview .theme-body {width: 100%; height: 100%; margin: 0;}
.section-content .theme-container .theme-preview-wrapper .theme-preview .theme-body .theme-sidebar {background: #FFFFFF;}
.section-content .theme-container .theme-preview-wrapper .theme-preview .theme-body .theme-sidebar ul {margin-top: 30px !important;}
.section-content .theme-container .theme-preview-wrapper .theme-preview .theme-body .theme-sidebar ul li {height: 5px; font-size: 5px; color: #9998A5; margin-bottom: 10px;}
.section-content .theme-container .theme-preview-wrapper .theme-preview .theme-body {background: #F4F4FC;}
.section-content .theme-container .theme-preview-wrapper .theme-preview .theme-body .theme-main-content .theme-content-box {background: #FFFFFF; height: 60%; border-radius: 3px;}
.section-content .theme-container .theme-preview-wrapper .theme-preview .theme-body .theme-main-content .theme-page-heading {margin-top: 25px; font-size: small; margin-bottom: 15px; font-weight: 600; color: #4A49F1;}
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper {padding: 15px 10px; background: #EFEFEF; width: 100%; border-top: 1px solid #CCCCCC;}
.section-content .theme-container .theme-preview-wrapper.active .theme-name-wrapper {background: #428BCA; color: #FFFFFF; border-top: 1px solid #428BCA;}
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper h5 {margin: 0; font-size: 16px; display: block;} 
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper .action-btn {float: right;}
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper .action-btn a {display: inline-block; padding: 0 15px;}
.section-content .theme-container .theme-preview-wrapper.active .theme-name-wrapper .action-btn a {filter: brightness(0) invert(1);}
.section-content .theme-container .theme-preview-wrapper.active .theme-name-wrapper .action-btn .more-options-wrapper ul li a {filter: none;}
.section-content .theme-container .theme-preview-wrapper.active .theme-name-wrapper .action-btn a.activate-btn {filter: invert(53%) sepia(92%) saturate(1381%) hue-rotate(78deg) brightness(118%) contrast(132%);}
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper .action-btn a.activate-btn {background: url(../img/activate-icon.png) no-repeat center/contain; height: 15px; width: 15px; cursor: pointer;}
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper .action-btn a.edit-btn {background: url(../img/edit-icon.png) no-repeat center/contain; height: 15px; width: 15px; cursor: pointer;}
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper .action-btn a.del-btn {background: url(../img/delete-icon.png) no-repeat center/contain; height: 15px; width: 15px; cursor: pointer;}
.section-content .theme-container .theme-preview-wrapper .theme-name-wrapper .action-btn a.more-btn {background: url(../img/more-icon.png) no-repeat center/contain; height: 15px; width: 15px; cursor: pointer; padding: 0 5px;}

.more-options-wrapper {position: relative; display: inline;}
.more-options-wrapper ul {display: none; position: absolute; min-width: 125px; text-align: right; right: 0; top: 100%; background: #FFFFFF; border-radius: 2px; box-shadow: 2px 2px 8px #ABABAB;}
.more-options-wrapper:hover ul {display: block;}
.more-options-wrapper ul li {margin: 3px 0;}
.more-options-wrapper ul li a {padding: 5px 15px !important; color: #333333; width: 100%;}
.more-options-wrapper ul li a:hover {background: #EDEDED;}

form.theme-form .form-control.full-width, form.theme-form .form-select.full-width {width: 100% !important; font-size: 16px;}
form.theme-form .form-control, form.theme-form .form-select, form.theme-form .form-range {width: 60% !important; font-size: 14px;}
form.theme-form .form-control[type="color"] {padding: 3px !important; height: 35px;}
form.theme-form .bg-img-div {margin-bottom: -5px;}
form.theme-form .bg-img-div .upload-btn-wrapper {margin-top: 0}
form.theme-form .bg-img-div .upload-btn-wrapper .upload-btn {font-size: 14px; text-transform: none; padding: 6px 20px;}
form.theme-form .bg-img-div .upload-btn-wrapper input[type=file] {font-size: 19px;}

.input-mask-wrapper {position: relative;}
.input-mask-wrapper .input-mask {position: absolute; background: #FFFFFF; margin: 1px; width: 99%; padding: 7px; font-size: 14px; border-radius: 4px;}
.input-mask-wrapper .input-mask a {cursor: pointer; margin: 0 5px;}
.input-mask-wrapper .input-mask span {float: right; cursor: pointer; opacity: 0.75;}
.input-mask-wrapper .input-mask span:hover {opacity: 1;}
.input-mask-wrapper input {}

#questions_container .question-wrapper {position: relative;}
#questions_container .question-wrapper .remove-question-btn {display: none; background: url(../img/delete-icon.png) no-repeat center/contain; height: 15px; width: 15px; cursor: pointer; position: absolute; top: 35px; right: 15px;}
#questions_container .question-wrapper:hover .remove-question-btn {display: block;}

#evalution_modal .modal-body {padding: 30px;}
#evalution_modal .modal-subtitle {margin-bottom: 25px;}
#evalution_modal .questions-wrapper {height: 300px; overflow-x: hidden; overflow-y: auto;}
#evalution_modal .evaluation-wrapper, #evalution_modal .extra-wrapper {margin: 30px 0;}
#evalution_modal .question-row {margin-bottom: 15px; border-bottom: 1px solid #E9E9E9; padding: 15px 0;}
#evalution_modal .question-row .question-text {font-size: 16px;}
#evalution_modal .question-row .question-text .sr-no {color: #999999; margin-right: 10px;}
#evalution_modal .question-row .question-btns {float: right;}
#evalution_modal .question-row .question-btns span.question-btn {position: relative; padding: 0 !important; margin-left: 10px; border: none !important; background: #FFFFFF !important; width: 30px; height: 30px;}
#evalution_modal .question-row .question-btns span.question-btn:after {content: ""; background: no-repeat center/contain; height: 20px; width: 20px; position: absolute; top: 5px; left: 5px; filter: opacity(0.60) invert(0); image-rendering: -webkit-optimize-contrast;}
#evalution_modal .question-row .question-btns span.question-btn.active:after {filter: opacity(1);}
#evalution_modal .question-row .question-btns span.question-btn.like:after {background-image: url(../img/like-icon.png);}
    #evalution_modal .question-row .question-btns span.question-btn.like.active:after {background-image: url(../img/active-like-icon.png);}
#evalution_modal .question-row .question-btns span.question-btn.dislike:after {background-image: url(../img/dislike-icon.png);}
#evalution_modal .question-row .question-btns span.question-btn.dislike.active:after {background-image: url(../img/active-dislike-icon.png);}
#evalution_modal .question-row .question-btns span.question-btn.comment:after {background-image: url(../img/comment-icon.png);}
#evalution_modal .question-row .question-comment {display: none; margin-top: 15px;}

#review .question-row {margin: 0 0 15px 0; border-bottom: 1px solid #E9E9E9; padding: 15px 0;}
#review .question-row .question-text {color: #666768; margin-bottom: 15px;}
#review .question-row .question-text .sr-no {margin-right: 10px;}
#review .question-row .rating-icon .rating {display: block; background: no-repeat center/contain; height: 25px; width: 25px;}
#review .question-row .rating-icon .rating.like {background-image: url(../img/active-like-icon.png);}
#review .question-row .rating-icon .rating.dislike {background-image: url(../img/active-dislike-icon.png);}
#review .question-row .question-comment span {margin-left: 25px;}

.modal-body .modal-select-wrapper {text-align: center; margin: 50px 0;}
.modal-body .modal-select-wrapper .modal-select-btn {margin: 0 15px; color: #333333 !important; text-align: center; padding: 15px !important; text-transform: capitalize; font-size: 16px !important; min-width: 125px;}
.modal-body .modal-select-wrapper .modal-select-btn:hover {background: #EFEFEF;}
.modal-body .modal-select-wrapper .modal-select-btn .icon {display: block; background: no-repeat center/contain; height: 50px; width: 50px; margin: 15px auto;}
.modal-body .modal-select-wrapper .modal-select-btn .icon.telephonic {background-image: url(../img/icons/telephonic-icon.png);}
.modal-body .modal-select-wrapper .modal-select-btn .icon.in-person {background-image: url(../img/icons/interviews-icon.png);}
.modal-body .modal-select-wrapper .modal-select-btn .icon.online {background-image: url(../img/icons/online-interview-icon.png);}
.modal-body .modal-select-wrapper .modal-select-btn .icon.invoice {background-image: url(../img/icons/invoicing-icon.png);}
.modal-body .modal-select-wrapper .modal-select-btn .icon.credit-note {background-image: url(../img/icons/credit-note-icon.png);}

.modal-body .modal-information-wrapper {text-align: center; margin: 50px 0;}
.modal-body .modal-information-wrapper .col-md-6 {text-align: left;}
.modal-body .modal-information-wrapper .modal-submit-wrapper {margin-top: 30px;}

.modal-open .select2-container--open {z-index: 99999;}

@media screen and (max-width: 768px) {

    .mobile-hidden {display: none;}
    header .col-md-4 {padding: 0;}
    
    header .col-md-8 {position: absolute; top: 70px;}
    .menu-container nav ul.menu {position: fixed; background: #FFFFFF; width: 100%; height: 100vh; right: 100%;}
    .menu-container nav ul.menu li {width: 100%; display: block !important; margin-top: 0 !important;}
    .menu-container nav ul.menu li:hover {background: #DADADA;}
    .menu-container nav ul.menu li:hover ul  {display: none;}
    .menu-container nav ul.menu li a {display: block; font-size: 16px !important; padding: 15px 30px !important;}
    .menu-container nav ul.menu li a:hover::after {background: transparent !important;}
    .menu-container nav ul.menu li.menu-item.help-desk a {margin-left: 0 !important;}
    .menu-container nav ul.menu li a:hover {color: #E23744 !important;}


}

@media screen and (max-width: 480px) {
    section.main .left {display: none; z-index: 9; margin-top: 90px;}
    section.main .left .app-logo {display: none;}
    section.main .right {z-index: 1;}
    header .container-fluid {padding: 0 !important;}
    header .mobile-logo {display: inline-block;}
    header .header-options-container {text-align: right;}
    header .col-md-7, header .header-options-container .header-options li.chat, header .header-options-container .header-options li.add-new, header .header-options-container .header-options li.user span {display: none;}
    header .header-options-container .header-options li.search-toggle {display: inline-block;}
    header .col-md-7 {display: none; position: absolute; width: 100%; top: 75px; background: #FFFFFF; z-index: 9999; padding: 15px 10px;}
    header .col-md-7 .header-search {padding: 0 15px;}
    header .header-options-container .header-options li.user:before {width: 15px; height: 15px; top: 5px; right: -25px;}
    header .header-options-container .header-options li.user img {width: 40px; height: 40px;}
    header .header-options-container .header-options li.user .header-dd {text-align: left;}
}