/*------ Normalise CSS ------*/
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

body {
    line-height: 1
}

ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

/*------ fonts ------*/
@font-face {
    font-family: 'Roboto';
    src: url('../../../../assets/fonts/Roboto-Thin.woff2') format('woff2'),
        url('../../../../assets/fonts/Roboto-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../../../../assets/fonts/Roboto-Light.woff2') format('woff2'),
        url('../../../../assets/fonts/Roboto-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../../../../assets/fonts/Roboto-Regular.woff2') format('woff2'),
        url('../../../../assets/fonts/Roboto-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../../../../assets/fonts/Roboto-Medium.woff2') format('woff2'),
        url('../../../../assets/fonts/Roboto-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../../../../assets/fonts/Roboto-Bold.woff2') format('woff2'),
        url('../../../../assets/fonts/Roboto-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../../../../assets/fonts/SourceSansPro-Light.woff2') format('woff2'),
        url('../../../../assets/fonts/SourceSansPro-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../../../../assets/fonts/SourceSansPro-Regular.woff2') format('woff2'),
        url('../../../../assets/fonts/SourceSansPro-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../../../../assets/fonts/SourceSansPro-ExtraLight.woff2') format('woff2'),
        url('../../../../assets/fonts/SourceSansPro-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../../../../assets/fonts/SourceSansPro-Black.woff2') format('woff2'),
        url('../../../../assets/fonts/SourceSansPro-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../../../../assets/fonts/SourceSansPro-SemiBold.woff2') format('woff2'),
        url('../../../../assets/fonts/SourceSansPro-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../../../../assets/fonts/SourceSansPro-Bold.woff2') format('woff2'),
        url('../../../../assets/fonts/SourceSansPro-Bold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-Thin.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-ExtraLight.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-Light.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-Regular.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-Medium.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-SemiBold.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-Bold.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-Black.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-Black.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../../../../assets/fonts/Poppins-ExtraBold.woff2') format('woff2'),
        url('../../../../assets/fonts/Poppins-ExtraBold.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cormorant Upright';
    src: url('../../../../assets/fonts/CormorantUpright-Light.woff2') format('woff2'),
        url('../../../../assets/fonts/CormorantUpright-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cormorant Upright';
    src: url('../../../../assets/fonts/CormorantUpright-Regular.woff2') format('woff2'),
        url('../../../../assets/fonts/CormorantUpright-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cormorant Upright';
    src: url('../../../../assets/fonts/CormorantUpright-Medium.woff2') format('woff2'),
        url('../../../../assets/fonts/CormorantUpright-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cormorant Upright';
    src: url('../../../../assets/fonts/CormorantUpright-SemiBold.woff2') format('woff2'),
        url('../../../../assets/fonts/CormorantUpright-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url('../../../../assets/fonts/FuturaPT-Light.woff2') format('woff2'),
        url('../../../../assets/fonts/FuturaPT-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT Book';
    src: url('../../../../assets/fonts/FuturaPT-Book.woff2') format('woff2'),
        url('../../../../assets/fonts/FuturaPT-Book.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url('../../../../assets/fonts/FuturaPT-Medium.woff2') format('woff2'),
        url('../../../../assets/fonts/FuturaPT-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-Thin.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-ExtraLight.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-Light.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-Regular.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-Medium.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-SemiBold.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-Bold.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-ExtraBold.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Franklin';
    src: url('../../../../assets/fonts/LibreFranklin-Black.woff2') format('woff2'),
        url('../../../../assets/fonts/LibreFranklin-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-Thin.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-ExtraLight.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-Light.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-Regular.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-Medium.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-SemiBold.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-Bold.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-ExtraBold.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Public Sans';
    src: url('../../../../assets/fonts/PublicSans-Black.woff2') format('woff2'),
        url('../../../../assets/fonts/PublicSans-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Philosopher';
    src: url('../../../../assets/fonts/Philosopher-Regular.woff2') format('woff2'),
        url('../../../../assets/fonts/Philosopher-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/*------ Main ------*/

* {
    box-sizing: border-box;
}

body {
    font-family: 'Public Sans' !important;
    font-weight: 400;
    background: #ecf0f1;
    padding: 0px !important;
}

input::placeholder,
textarea::placeholder {
    color: #bdbdbd !important;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #bdbdbd !important;
    opacity: 1;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #bdbdbd !important;
    opacity: 1;
}

input:focus {
    outline: none !important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

button:focus,
textarea:focus,
div:focus {
    outline: 0 !important;
}

select:focus {
    outline: none;
}

a,
a:hover {
    text-decoration: none;
    color: inherit;
}

.grey-cl {
    color: var(--default-grey);
}

.black-cl {
    color: var(--default-text);
}

.light-grey-cl {
    color: #bdbdbd;
}

.dark-cl {
    color: #333333;
}

.dark-grey-cl {
    color: #595959;
}

.form-control:focus,
button:focus,
textarea:focus {
    box-shadow: none !important;
}

.content-area {
    height: 100vh;
    display: flex;
    align-items: stretch;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: stretch;
    -ms-align-items: stretch;
    overflow: hidden;
}

.right-content-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.Loader-holder {
    float: left;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.3);
    z-index: 99999999;
}

.icon-in {
    width: 22px;
    height: 22px;
    display: inline-block;
    background: var(--sprite-one) no-repeat;
}

.ico-lib:before {
    content: "";
    background: var(--sprite-one) no-repeat;
    display: inline-block;
}

.ico-lib-v1:before {
    content: "";
    background: var(--sprite-two) no-repeat;
    display: inline-block;
}

.ico-lib-v2:before {
    content: "";
    background: var(--sprite-three) no-repeat;
    display: inline-block;
}

.ico-lib-list {
    background: var(--sprite-one) no-repeat;
    display: inline-block;
}

.float-button-box {
    float: left;
    position: fixed;
    right: 35px;
    bottom: 35px;
    width: 62px;
    height: 62px;
    background: var(--btn-color);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.15);
    transition: .4s ease-out;
    display: flex;
    align-items: center;
    justify-content: center;
}

.float-add:before {
    background-position: -34px -122px;
    width: 25px;
    height: 25px;
    left: calc(50% - 12.5px);
    top: calc(50% - 12.5px);
}

.float-button-box:hover {
    background: var(--hover-color);
}

.icon-in.icon-plus {
    width: 25px;
    height: 25px;
    background-position: -34px -122px;
}

.float-button-block {
    float: left;
    position: fixed;
    right: 35px;
    bottom: 35px;
    z-index: 9;
}

.float-button {
    float: left;
    width: 62px;
    height: 62px;
    background: var(--btn-color);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    line-height: 0;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, .15);
    position: relative;
    transition: .4s ease-out;
}

.float-button:hover {
    background: var(--hover-color);
}

.version-text {
    font-size: 9px;
    color: var(--version-color);
    position: absolute;
    right: -7px;
    bottom: -5px;
}

.version-text-container {
    float: left;
    width: 22px;
    height: 24px;
    position: relative;
}

.version-text-container img {
    width: 20px;
    height: 20px;
}

.logo-brand img {
    width: 174px;
}

.version-brand {
    float: left;
    width: 20px;
    height: 20px;
    background: var(--version-brand) no-repeat center;
    background-size: contain;
}

.svg-loader {
    fill: var(--btn-color);
}

/*------ Sidebar ------*/

.side-menu-wrapper {
    width: auto;
    height: 100%;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    float: left;
}

.side-menu-left {
    height: 100%;
    background: var(--theme-first);
    position: relative;
    transition: max-width .4s ease, min-width .4s ease;
}

.side-menu-left.skew {
    transition: .4s ease-out;
    transition: max-width .4s ease, min-width .4s ease;
}

.navbar {
    cursor: pointer;
}

.side-nav-in {
    height: 60px;
    padding-left: 0;
}

.side-menu-right.w-pad .side-nav-in {
    padding: 0px 0px 0px 20px;
    height: 60px;
    font-weight: 100;
}

.side-menu-right.w-pad .side-nav-in:hover {
    background: transparent;
}

.skew .side-nav-in {
    padding: 0;
}

.side-nav-in:hover,
.side-nav-in.active-in {
    background: var(--theme-third);
}

.navbar-toggler-button,
.side-left-click {
    height: 60px;
    width: 100%;
    display: flex;
    align-items: center;
    margin: 0px;
    padding-left: 14px;
}

.icon-in.icon-menu-toggler {
    width: 22px;
    height: 12px;
    background-position: -9px -70px;
}

.icon-in.icon-dashboard {
    background: var(--sprite-two) no-repeat -28px -6px;
    width: 20px;
    height: 20px;
}

.side-nav-in:hover .icon-in.icon-dashboard,
.side-nav-in.active-in .icon-in.icon-dashboard {
    background-position: -28px -33px;
}

.icon-in.icon-task,
.icon-in.icon-tasks {
    background: var(--sprite-two) no-repeat -54px -6px;
    width: 20px;
    height: 20px;
}

.side-nav-in:hover .icon-in.icon-task,
.side-nav-in.active-in .icon-in.icon-task,
.side-nav-in:hover .icon-in.icon-tasks,
.side-nav-in.active-in .icon-in.icon-tasks {
    background-position: -54px -33px;
}

.icon-in.icon-forms {
    background: var(--sprite-two) no-repeat -356px -5px;
    width: 19px;
    height: 19px;
}

.side-nav-in:hover .icon-in.icon-forms,
.side-nav-in.active-in .icon-in.icon-forms {
    background-position: -356px -32px;
}

.icon-in.icon-collections {
    background: var(--sprite-two) no-repeat -154px -6px;
    width: 19px;
    height: 19px;
}

.side-nav-in:hover .icon-in.icon-collections,
.side-nav-in.active-in .icon-in.icon-collections {
    background-position: -154px -33px;
}

.icon-in.icon-entity,
.icon-in.icon-entities {
    background: var(--sprite-two) no-repeat -301px -6px;
    width: 18px;
    height: 19px;
}

.side-nav-in:hover .icon-in.icon-entity,
.side-nav-in.active-in .icon-in.icon-entity,
.side-nav-in:hover .icon-in.icon-entities,
.side-nav-in.active-in .icon-in.icon-entities {
    background-position: -301px -33px;
}

.icon-in.icon-project,
.icon-in.icon-projects {
    background: var(--sprite-two) no-repeat -225px -5px;
    width: 16px;
    height: 21px;
}

.side-nav-in:hover .icon-in.icon-project,
.side-nav-in.active-in .icon-in.icon-project,
.side-nav-in:hover .icon-in.icon-projects,
.side-nav-in.active-in .icon-in.icon-projects {
    background-position: -225px -32px;
}

.icon-in.icon-class {
    background: var(--sprite-two) no-repeat -225px -5px;
    width: 16px;
    height: 21px;
}

.side-nav-in:hover .icon-in.icon-class,
.side-nav-in.active-in .icon-in.icon-class {
    background-position: -225px -32px;
}

.icon-in.icon-workflow,
.icon-in.icon-workflows {
    background: var(--sprite-two) no-repeat -201px -7px;
    width: 19px;
    height: 18px;
}

.side-nav-in:hover .icon-in.icon-workflow,
.side-nav-in.active-in .icon-in.icon-workflow,
.side-nav-in:hover .icon-in.icon-workflows,
.side-nav-in.active-in .icon-in.icon-workflows {
    background-position: -201px -34px;
}

.icon-in.icon-pool,
.icon-in.icon-task.pool {
    background: var(--sprite-two) no-repeat -326px -5px;
    width: 23px;
    height: 20px;
}

.side-nav-in:hover .icon-in.icon-pool,
.side-nav-in.active-in .icon-in.icon-pool,
.side-nav-in:hover .icon-in.icon-task.pool,
.side-nav-in.active-in .icon-in.icon-task.pool {
    background-position: -326px -32px;
}

.icon-in.icon-chat {
    background: var(--sprite-two) no-repeat -80px -7px;
    width: 18px;
    height: 18px;
}

.side-nav-in:hover .icon-in.icon-chat,
.side-nav-in.active-in .icon-in.icon-chat {
    background-position: -80px -34px;
}

.icon-in.icon-team {
    background: var(--sprite-two) no-repeat -104px -6px;
    width: 17px;
    height: 21px;
}

.side-nav-in:hover .icon-in.icon-team,
.side-nav-in.active-in .icon-in.icon-team {
    background-position: -104px -33px;
}

.icon-in.icon-resources {
    background: var(--sprite-two) no-repeat -128px -6px;
    width: 19px;
    height: 20px;
}

.side-nav-in:hover .icon-in.icon-resources,
.side-nav-in.active-in .icon-in.icon-resources {
    background-position: -128px -33px;
}

.icon-in.icon-schedule,
.icon-in.icon-schedules {
    background: var(--sprite-two) no-repeat -433px -3px;
    width: 23px;
    height: 21px;
}

.side-nav-in:hover .icon-in.icon-schedule,
.side-nav-in.active-in .icon-in.icon-schedule,
.side-nav-in:hover .icon-in.icon-schedules,
.side-nav-in.active-in .icon-in.icon-schedules {
    background-position: -433px -30px;
}

.icon-board,
.icon-boards {
    background: var(--sprite-two) no-repeat -460px -5px;
    width: 17px;
    height: 17px;
}

.side-nav-in:hover .icon-board,
.side-nav-in.active-in .icon-board,
.side-nav-in:hover .icon-boards,
.side-nav-in.active-in .icon-boards {
    background-position: -460px -32px;
}

.icon-page.builder {
    background: var(--sprite-two) no-repeat -482px -6px;
    width: 18px;
    height: 16px;
}

.side-nav-in:hover .icon-in.icon-page.builder,
.side-nav-in.active-in .icon-in.icon-page.builder {
    background-position: -482px -33px;
}

.icon-in.icon-webinar,
.icon-in.icon-webinars {
    background: var(--sprite-two) no-repeat -504px -5px;
    width: 19px;
    height: 19px;
}

.side-nav-in:hover .icon-in.icon-webinar,
.side-nav-in.active-in .icon-in.icon-webinar,
.side-nav-in:hover .icon-in.icon-webinars,
.side-nav-in.active-in .icon-in.icon-webinars {
    background-position: -504px -32px
}

.icon-in.icon-learn {
    background: var(--sprite-two) no-repeat -179px -5px;
    width: 16px;
    height: 22px;
}

.side-nav-in:hover .icon-in.icon-learn,
.side-nav-in.active-in .icon-in.icon-learn {
    background-position: -179px -32px;
}

.icon-in.icon-certificate {
    background: var(--sprite-two) no-repeat -573px -6px;
    width: 19px;
    height: 19px;
}

.side-nav-in.active-in .icon-in.icon-certificate,
.side-nav-in:hover .icon-in.icon-certificate {
    background-position: -573px -33px;
}

.icon-in.icon-batch {
    background: var(--sprite-two) no-repeat -596px -5px;
    width: 21px;
    height: 20px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-in.icon-batch,
.side-nav-in:hover .icon-in.icon-batch {
    background-position: -596px -32px;
}

.icon-in.icon-calendar {
    background: var(--sprite-two) no-repeat -876px -7px;
    width: 17px;
    height: 18px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-in.icon-calendar,
.side-nav-in:hover .icon-in.icon-calendar {
    background-position: -876px -31px;
}

.icon-attendance {
    background: var(--sprite-two) no-repeat -768px -6px;
    width: 19px;
    height: 20px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-attendance,
.side-nav-in:hover .icon-attendance {
    background-position: -768px -31px;
}

.icon-in.icon-sector {
    background: var(--sprite-two) no-repeat -383px -5px;
    width: 19px;
    height: 19px;
}

.side-nav-in:hover .icon-in.icon-sector,
.side-nav-in.active-in .icon-in.icon-sector {
    background-position: -383px -32px;
}

.icon-in.icon-vertical {
    background: var(--sprite-two) no-repeat -410px -4px;
    width: 19px;
    height: 19px;
}

.side-nav-in:hover .icon-in.icon-vertical,
.side-nav-in.active-in .icon-in.icon-vertical {
    background-position: -410px -31px;
}

.side-nav-in .icon-in.icon-settings {
    background: var(--sprite-two) no-repeat -272px -6px;
    width: 21px;
    height: 21px;
}

.side-nav-in:hover .icon-in.icon-settings,
.side-nav-in.active-in .icon-in.icon-settings {
    background-position: -272px -33px;
}

.icon-in.icon-dashboard.builder {
    background: var(--sprite-two) no-repeat -178px -5px;
    width: 18px;
    height: 24px;
}

.side-nav-in:hover .icon-in.icon-dashboard.builder,
.side-nav-in.active-in .icon-in.icon-dashboard.builder {
    background-position: -178px -33px;
}

.icon-in.icon-dashboard.builder:before {
    content: none;
}

.icon-in.icon-dashboard.builder+.brand-indicator {
    flex-shrink: 0;
    word-break: break-word;
    display: block;
    max-width: 78px;
    white-space: pre-line;
}

.icon-book.resources {
    background: var(--sprite-two) no-repeat -837px -7px;
    width: 15px;
    height: 18px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-book.resources,
.side-nav-in:hover .icon-book.resources {
    background-position: -837px -32px;
}

.icon-events {
    background: var(--sprite-two) no-repeat -855px -7px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-events,
.side-nav-in:hover .icon-events {
    background-position: -855px -32px;
}

.icon-visitors {
    background: var(--sprite-two) no-repeat -791px -6px;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-visitors,
.side-nav-in:hover .icon-visitors {
    background-position: -791px -32px;
}

.icon-booking {
    background: var(--sprite-two) no-repeat -699px -6px;
    width: 18px;
    height: 19px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-booking,
.side-nav-in:hover .icon-booking {
    background-position: -699px -31px;
}

.icon-in.icon-broadcast {
    background: var(--sprite-two) no-repeat -504px -5px;
    width: 19px;
    height: 19px;
}

.side-nav-in:hover .icon-in.icon-broadcast,
.side-nav-in.active-in .icon-in.icon-broadcast {
    background-position: -504px -32px;
}

.icon-in.icon-organization {
    background: var(--sprite-two) no-repeat -527px -5px;
    width: 19px;
    height: 20px;
}

.side-nav-in:hover .icon-in.icon-organization,
.side-nav-in.active-in .icon-in.icon-organization {
    background-position: -527px -32px
}

.icon-in.icon-whatsapp {
    background: var(--sprite-two) no-repeat -621px -6px;
    width: 19px;
    height: 19px;
}

.side-nav-in.active-in .icon-in.icon-whatsapp,
.side-nav-in:hover .icon-in.icon-whatsapp {
    background-position: -621px -33px;
}

.icon-call {
    background: var(--sprite-two) no-repeat -646px -4px;
    width: 21px;
    height: 21px;
}

.side-nav-in:hover .icon-call,
.side-nav-in.active-in .icon-call {
    background-position: -646px -30px;
}

.icon-patients {
    background: var(--sprite-two) no-repeat -746px -6px;
    width: 17px;
    height: 19px;
}

.side-nav-in:hover .icon-patients,
.side-nav-in.active-in .icon-patients {
    background-position: -746px -31px;
}

.icon-leads {
    background: var(--sprite-two) no-repeat -723px -6px;
    width: 19px;
    height: 19px;
}

.side-nav-in:hover .icon-leads,
.side-nav-in.active-in .icon-leads {
    background-position: -723px -31px;
}

.icon-bulk.messages {
    background: var(--sprite-two) no-repeat -897px -6px;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-bulk.messages,
.side-nav-in:hover .icon-bulk.messages {
    background-position: -897px -32px;
}

.icon-services {
    background: var(--sprite-two) no-repeat -922px -6px;
    width: 19px;
    height: 19px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-services,
.side-nav-in:hover .icon-services {
    background-position: -922px -32px;
}

.icon-course {
    background: var(--sprite-two) no-repeat -837px -7px;
    width: 15px;
    height: 18px;
    flex-shrink: 0;
}

.side-nav-in.active-in .icon-course,
.side-nav-in:hover .icon-course {
    background-position: -837px -32px;
}

.icon-page.builder:before {
    content: none;
}

.brand-indicator {
    font-size: 13px;
    line-height: normal;
    font-weight: 300;
    color: var(--default-nav);
    margin-left: 10px;
}

.skew .brand-indicator {
    font-size: 0;
}

.side-nav-in:hover .brand-indicator,
.side-nav-in.active-in .brand-indicator {
    color: var(--default-active-text-color);
}

.icon-menu {
    /* background: var(--sprite-two) no-repeat -4px -10px;
    width: 18px;
    height: 12px; */
    width: 22px;
    height: 13px;
    background: url(https://d22znjc9y9upyw.cloudfront.net/assets/bsynapse/images/zynapse-ham.png) no-repeat;
    background-size: cover;
}

.side-nav-in.home-menu:hover .brand-indicator {
    color: #fff;
}

.side-nav-in.home-menu:hover {
    background: var(--theme-first);
}

.min-tab {
    float: left;
    width: 100%;
    height: 50px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 13px 0;
    position: absolute;
    bottom: 0;
    left: 0;
}

.side-menu-right {
    min-width: 275px;
    max-width: 275px;
    height: 100%;
    background: var(--theme-second);
    position: relative;
    padding: 0 20px 0 35px;
}

.side-menu-right.w-pad {
    padding: 0;
}

.task-button-block {
    float: left;
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.w-pad .task-button-block {
    padding: 0 20px;
}

.list-all-head {
    background: transparent;
    border: 0;
    padding: 0;
    font-size: 19px;
    text-transform: uppercase;
    color: var(--page-head);
    font-weight: 100;
    cursor: pointer;
    /* text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.50); */
}

.no-ev {
    pointer-events: none;
}

.sub-menu-right-block {
    float: left;
    width: 100%;
    margin-top: 23px;
    margin-bottom: 113px;
}

.w-pad .sub-menu-right-block {
    margin-bottom: 0;
    max-height: calc(100% - 114px);
    margin-top: 0;
}

.menu-section {
    float: left;
    width: 100%;
    padding: 20px 0 10px 20px;
}

.menu-section.active {
    background: var(--theme-third);
}

.menu-section h5 {
    float: left;
    width: 100%;
    color: var(--category-head);
    font-size: 11px;
    line-height: 14px;
    margin-bottom: 10px;
    text-transform: uppercase;
    cursor: pointer;
}

.ind-menu-section {
    float: left;
    width: 100%;
    padding-left: 15px;
}

.ind-menu-section li {
    float: left;
    width: 100%;
}

.ind-menu-section li nav {
    float: left;
    color: var(--sub-category-head);
    font-size: 12px;
    font-weight: 300;
    line-height: 32px;
    padding: 0;
    position: relative;
    transition: .3s ease-out;
}

.ind-menu-section li nav.active {
    color: var(--side-submenu-active);
}

.left-filter-count {
    margin-left: 3px;
}

.left-filter-count img {
    position: relative;
    top: 5px;
}

.menu-sec-click:before {
    content: "";
    width: 0;
    height: 1px;
    background: var(--sub-category-active);
    position: absolute;
    left: 0;
    bottom: 0;
    transition: .3s ease-out;
}

.menu-sec-click.active:before {
    width: 100%;
}

.menu-sec-click.active:before {
    width: 100%;
}

.ind-menu-section li:hover .menu-sec-click:before {
    width: 100%;
    color: var(--sub-category-active);
}

.side-menu-footer {
    float: left;
    width: 100%;
    background: transparent;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    color: var(--page-footer);
    font-size: 12px;
    line-height: 30px;
    text-align: center;
}

.side-menu-footer span {
    font-size: 12px;
}

.ind-menu-section li:hover .menu-sec-click {
    color: var(--side-submenu-active);
}

.filter-accord {
    float: left;
    width: 100%;
    margin-top: 7px;
}

.filter-accord .card {
    background: transparent;
    box-shadow: none;
    border: 1px solid transparent;
    float: left;
    width: 100%;
}

.filter-accord .card-header {
    padding: 0;
    border: 0;
    background: transparent;
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    margin-bottom: 5px;
}

.card-header:first-child {
    border-radius: 0;
}

.label-menu-right-block h5 {
    float: left;
    width: 100%;
    font-size: 11px;
    font-weight: 500;
    color: #909090;
    text-transform: uppercase;
}

.filter-accord .card .btn-link {
    float: left;
    width: 100%;
    padding: 0;
    font-size: 14px;
    color: #b6bad5;
    font-weight: 500;
    text-align: left;
    position: relative;
}

.filter-accord .card .btn-link.focus,
.filter-accord .card .btn-link:focus {
    text-decoration: none;
}

.label-menu-right-block.filter-top {
    height: calc(100% - 133px);
    padding: 0 20px 0 20px;
}

.arrow-ico:after {
    content: "";
    float: left;
    background: var(--sprite-one) no-repeat -356px -190px;
    width: 10px;
    height: 6px;
    position: absolute;
    right: 0;
    top: calc(50% - 3px);
    transition: .2s ease-out;
}

.arrow-ico.collapsed:after {
    transform: rotate(180deg);
}

.filter-accord .card-body {
    padding: 10px 0;
    float: left;
    width: 100%;
}

.filter-accord .select-chk-block {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0;
    display: block;
}

.filter-accord .card .btn-link:hover {
    text-decoration: none;
}

.filter-accord .control {
    color: #fff;
    font-size: 12px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    line-height: normal;
    font-weight: 400;
}

.label-menu-right-block .control .inp-chk {
    width: 100%;
    height: 100%;
}

.label-menu-right-block .control-indicator {
    width: 11px;
    height: 11px;
    top: calc(50% - 6.5px);
    background: #323030;
    border-color: #fff;
}

.label-menu-right-block .control-checkbox .control-indicator:after {
    background-position: -9px -359px;
    width: 8px;
    height: 6px;
    left: calc(50% - 4px);
    top: calc(50% - 3px);
}

.sub-menu-right {
    float: left;
    width: 100%;
    position: relative;
}

.sub-menu-right li {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 26px;
}

.sub-menu-right li .sub-menu {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--sub-category-head);
    font-weight: 300;
    cursor: pointer;
}

.sub-menu-right li .sub-menu:hover,
.sub-menu-right .sub-menu.active {
    color: #fff;
}

.sub-menu:before {
    position: absolute;
    left: 0;
    top: calc(50% - 8px);
}

.sub-menu {
    padding-left: 30px;
}

.label-menu-right-block.filter-top {
    margin-top: 23px;
}

.pj-ov-ico:before {
    background-position: -6px -280px;
    width: 19px;
    height: 15px;
}

.pj-board-ico:before {
    background-position: -32px -278px;
    width: 18px;
    height: 18px;
}

.pj-task-ico:before {
    background-position: -58px -279px;
    width: 19px;
    height: 16px;
}

.pj-team-ico:before {
    background-position: -83px -281px;
    width: 19px;
    height: 14px;
}

.pj-chat-ico:before {
    background-position: -108px -279px;
    width: 19px;
    height: 17px;
}

.pj-file-ico:before {
    background-position: -158px -280px;
    width: 17px;
    height: 15px;
}

.pj-note-ico:before {
    background-position: -181px -280px;
    width: 19px;
    height: 14px;
}

.pj-info-ico:before {
    background-position: -206px -278px;
    width: 18px;
    height: 18px;
}

.pj-issue-ico:before {
    background-position: -230px -278px;
    width: 19px;
    height: 18px;
}

.pj-dm-ico:before {
    background-position: -133px -278px;
    width: 18px;
    height: 18px;
}

.pj-ml-ico:before {
    background-position: -257px -277px;
    width: 18px;
    height: 19px;
}

.pj-ov-ico:hover:before,
.sub-menu-right .pj-ov-ico.active:before {
    background-position: -6px -303px;
}

.pj-board-ico:hover:before,
.sub-menu-right .pj-board-ico.active:before {
    background-position: -32px -301px;
}

.pj-task-ico:hover:before,
.sub-menu-right .pj-task-ico.active:before {
    background-position: -58px -302px;
}

.pj-team-ico:hover:before,
.sub-menu-right .pj-team-ico.active:before {
    background-position: -83px -304px;
}

.pj-chat-ico:hover:before,
.sub-menu-right .pj-chat-ico.active:before {
    background-position: -108px -302px;
}

.pj-file-ico:hover:before,
.sub-menu-right .pj-file-ico.active:before {
    background-position: -158px -303px;
}

.pj-note-ico:hover:before,
.sub-menu-right .pj-note-ico.active:before {
    background-position: -181px -303px;
}

.pj-info-ico:hover:before,
.sub-menu-right .pj-info-ico.active:before {
    background-position: -206px -301px;
}

.pj-issue-ico:hover:before,
.sub-menu-right .pj-issue-ico.active:before {
    background-position: -230px -301px;
}

.pj-dm-ico:hover:before,
.sub-menu-right .pj-dm-ico.active:before {
    background-position: -133px -301px;
}

.pj-ml-ico:hover:before,
.sub-menu-right .pj-ml-ico.active:before {
    background-position: -257px -300px;
}

.toggle-btn {
    background: transparent;
    border: 0;
    padding: 0;
    font-size: 19px;
    color: var(--page-head);
    font-weight: 100;
    cursor: pointer;
    text-transform: uppercase;
    /* text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.50); */
}

.no-ev {
    pointer-events: none;
}

.ijsc .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 14px;
}

.ijsc .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    flex-direction: column;
    align-items: flex-start;
    height: auto;
    padding: 2.5px 15px 2.5px;
}

.ijsc .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .attached-file {
    width: 100%;
    margin-bottom: 0px;
}

.ijsc .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .attached-file .file-tag {
    width: 100%;
}

.menu-section h5 .loader-span {
    position: relative;
}

.menu-section h5 .loader-span img {
    position: absolute;
    left: 0;
    top: -1px;
}

.demosg .icon-menu,
.svjs2 .icon-menu,
.stratonboard .icon-menu {
    width: 22px;
    height: 13px;
    background: url(https://d22znjc9y9upyw.cloudfront.net/assets/bsynapse/images/zynapse-ham.png) no-repeat;
    background-size: cover;
}

.ibt .icon-menu {
    width: 22px;
    height: 23px;
    background: url(https://d22znjc9y9upyw.cloudfront.net/assets/bsynapse/images/ibt-ham.png) no-repeat;
    background-size: cover;
}

.ijsc .side-menu-footer {
    display: none;
}

.side-menu-footer.powered {
    flex-direction: column;
    align-items: flex-start;
    padding: 0 15px;
    display: none;
}

.ijsc .side-menu-footer.powered {
    display: flex;
}

.inline-powered {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.inline-powered img:first-child {
    width: 71px;
    margin-right: 15px;
    object-fit: contain;
}

.inline-powered img:last-child {
    width: 88px;
    object-fit: contain;
}

.side-menu-footer.powered p {
    font-size: 10px;
    color: var(--white);
    line-height: normal;
    margin-bottom: 3px;
}

/*------ Sidebar End ------*/

/*------ Header ------*/

.top-sticky-bar {
    float: left;
    width: 100%;
    height: 60px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    position: relative;
    z-index: 8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 20px;
}

.search-block {
    float: left;
    width: 350px;
    height: 40px;
    position: relative;
}

.search-box {
    float: left;
    width: 100%;
    height: 40px;
    border: 0;
    background: #fff;
    font-size: 15px;
    padding: 0 30px;
    color: var(--default-text);
    line-height: normal;
}

.search-box-icon {
    position: absolute;
    left: 0;
    top: calc(50% - 8px);
}

.icon-in.icon-search {
    background-position: -402px -70px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top: calc(50% - 7px);
}

.user-othe-info {
    float: left;
}

.user-info-click {
    float: left;
    width: 64px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    border-right: 1px solid #e2e5e7;
    position: relative;
    cursor: pointer;
}

.user-prof {
    float: left;
    width: 30px;
    height: 30px;
    border: 2px solid var(--default-grey);
    border-radius: 50%;
}

.user-prof:hover {
    border-color: var(--default-color);
}

.user-prof img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.icon-in.icon-notification {
    width: 23px;
    height: 24px;
    background-position: -187px -121px;
    position: relative;
}

.icon-in.icon-notification:hover,
.icon-in.icon-notification.active-in {
    background-position: -267px -121px;
}

.icon-in.icon-question {
    width: 31px;
    height: 30px;
    background-position: -219px -117px;
}

.icon-in.icon-question:hover,
.icon-in.icon-question.active-in {
    background-position: -299px -117px;
}

.not-count {
    color: #fff;
    width: auto;
    min-width: 16px;
    height: 16px;
    background: #e14745;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    border-radius: 4px;
    top: -5px;
    right: -9px;
    font-size: 11px;
    font-weight: 400;
    line-height: 13px;
    padding: 1px 3px 0 3px;
}

.not-ico:before {
    background-position: -187px -121px;
    width: 23px;
    height: 24px;
}

.not-ico {
    position: relative;
}

.on-hover .not-ico:before,
.not-ico:hover:before {
    background-position: -267px -121px;
}

.qa-ico:before {
    background-position: -219px -117px;
    width: 31px;
    height: 30px;
}

.on-hover .qa-ico:before,
.qa-ico:hover:before {
    background-position: -299px -117px;
}

.side-bar-panel {
    float: left;
    width: 420px;
    background: #fff;
    height: 100vh;
    position: fixed;
    right: 0px;
    top: 61px;
    transition: .4s ease-out;
    box-shadow: -2px 2px 5px 0px rgba(0, 0, 0, 0.05);
    z-index: 10;
    overflow: hidden;
}

.float-panel-header {
    float: left;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #dfe0e4;
    padding: 0 20px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
}

.float-panel-header .subheader {
    float: left;
    font-weight: 600;
    color: var(--default-text);
    font-size: 15px;
    letter-spacing: 0.5px;
    line-height: normal;
    text-transform: uppercase;
}

.fly-close {
    float: left;
    background-color: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
}

.float-panel-content-holder {
    float: left;
    width: 100%;
    height: calc(100vh - 121px);
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
}

.auto-stretch {
    padding: 20px;
}

.user-profile-info {
    float: left;
    width: 100%;
}

.user-profile-image {
    float: left;
    width: 100%;
    border-radius: 5px;
    margin-bottom: 16px;
}

.user-profile-image img {
    float: left;
    width: 360px;
    height: 320px;
    object-fit: cover;
    border-radius: 5px;
}

.user-profile-details {
    float: left;
    width: 100%;
}

.user-profile-details .subheader {
    float: left;
    width: 100%;
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 14px;
    color: #2a2f35;
}

.user-profile-det-list {
    float: left;
    width: 100%;
    margin-bottom: 5px;
}

.user-profile-det-list li {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    position: relative;
    padding-left: 25px;
    margin-bottom: 10px;
    letter-spacing: 0.6px;
}

.mail-ico:before {
    background-position: -119px -73px;
    width: 12px;
    height: 9px;
    position: absolute;
    left: 0;
    top: calc(50% - 4.5px);
}

.phone-ico:before {
    background-position: -138px -74px;
    width: 9px;
    height: 9px;
    position: absolute;
    left: 0;
    top: calc(50% - 4.5px);
}

.loc-ico:before {
    background-position: -153px -71px;
    width: 10px;
    height: 13px;
    position: absolute;
    left: 2px;
    top: calc(50% - 7.5px);
}

.profile-other-opt {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
}

.trans-button {
    float: left;
    height: 40px;
    font-size: 15px;
    background: #fff;
    color: var(--default-grey);
    border: 1px solid #e3e5e8;
    padding: 0 19px;
    border-radius: 3px;
    cursor: pointer;
}

.trans-button:hover {
    border-color: var(--default-color);
    color: var(--default-color);
}

.pro-edit-ico:before {
    background-position: -122px -251px;
    width: 15px;
    height: 13px;
    margin-right: 8px;
}

.logout-ico:before {
    background-position: -143px -252px;
    width: 14px;
    height: 11px;
    margin-right: 7px;
}

.pro-edit-ico:hover:before {
    background-position: -122px -279px;
}

.logout-ico:hover:before {
    background-position: -143px -280px;
}

.fly-close {
    float: left;
    background-color: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
}

.fly-close:before {
    background-position: -379px -71px;
    width: 13px;
    height: 13px;
}

.ind-not-panel {
    float: left;
    width: 100%;
    height: 62px;
    border-bottom: 1px solid #f3f3f3;
    position: relative;
}

.ind-not-panel-click {
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 20px;
    float: left;
    width: 100%;
    height: 100%;
    transition: .4s ease-out;
    cursor: pointer;
}

.ind-not-left {
    float: left;
    width: 100%;
    padding-right: 66px;
}

hide-over {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    display: inline-block;
    color: var(--default-text);
}

.ind-not-left p {
    float: left;
    width: 100%;
    font-size: 12px;
    line-height: normal;
    margin-bottom: 5px;
}

.font-bold {
    font-weight: 600;
}

.item-tag {
    height: 15px;
    background: #ccc;
    padding: 0 3px;
    font-size: 11px;
    color: #fff;
    border-radius: 3px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 4px;
}

.item-tag.task {
    background: #d5b610;
}

.item-tag.project {
    background: #e37329;
}

.item-tag.read {
    background: #F5A623;
}

.item-tag.comments {
    background: #E14745;
}

.item-tag.verify {
    background: #03B86E;
}

.item-tag.done {
    background: var(--default-color);
}

.descript-text {
    color: var(--default-grey);
    line-height: 14px;
    font-weight: 300;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ind-not-left p:last-child {
    margin: 0;
}

.ind-not-right {
    float: right;
    position: absolute;
    right: 20px;
    top: 15px;
    height: 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ind-not-right p {
    float: left;
    color: #bdbdbd;
    font-size: 11px;
    font-weight: 500;
    line-height: 13px;
    text-align: right;
}

.ind-not-panel-click:hover {
    background: #f3f3f3;
}

.viewed .ind-not-left {
    opacity: .4;
}

.float-panel-search {
    float: left;
    width: 100%;
    height: 81px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid #f3f3f3;
    position: relative;
}

.float-search {
    float: left;
    width: 100%;
    height: 45px;
    border: 1px solid #e4e5ea;
    border-radius: 3px;
    padding: 0 50px 0 18px;
    font-size: 14px;
}

.fl-search-ico:before {
    background-position: -186px -72px;
    width: 11px;
    height: 11px;
    position: absolute;
    right: 39px;
    top: calc(50% - 5.5px);
}

.float-panel-content {
    float: left;
    width: 100%;
    height: calc(100vh - 60px);
    overflow: auto;
    max-height: calc(100vh - 202px);
}

.ind-content {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: 63px;
    border-bottom: 1px solid #f3f3f3;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.ind-content .qa-click {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: var(--default-text);
    line-height: 20px;
    max-height: 40px;
    overflow: hidden;
    transition: .4s ease-out;
    word-break: break-word;
    cursor: pointer;
}

.float-panel-slider {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    background: #fff;
    right: -100%;
    top: 0;
    transition: .4s ease-out;
}

.float-panel-slider.active {
    right: 0;
}

.panel-slider-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid #f3f3f3;
}

.qa-back-button {
    float: left;
    font-size: 16px;
    color: #2e3142;
    font-weight: 500;
    position: relative;
    padding-left: 23px;
}

.less-ico:before {
    background-position: -229px -92px;
    width: 8px;
    height: 14px;
    position: absolute;
    left: 0;
    top: calc(50% - 7px);
}

.panel-slider-content {
    float: left;
    width: 100%;
    padding: 15px 19px;
    overflow-y: auto;
    max-height: calc(100vh - 171px);
}

.panel-slider-content .subheader {
    float: left;
    width: 100%;
    font-size: 16px;
    color: var(--default-text);
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 22px;
    word-break: break-word;
}

.panel-slider-content p {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 33px;
    word-break: break-word;
}

.qa-click:hover {
    color: var(--default-color);
}

.report-issue-block {
    float: left;
    display: flex;
    align-items: center;
}

.faq-info-img {
    float: left;
    width: 100%;
}

.report-issue,
.report-issue:hover {
    height: 25px;
    width: auto;
    min-width: 125px;
    border: 1px solid var(--default-color);
    border-radius: 0;
    background-color: #FFFFFF;
    color: var(--default-color);
    font-size: 12px;
    line-height: normal;
    padding: 0;
    cursor: pointer;
    transition: .3s ease-out;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
}

.report-issue:before {
    content: "";
    background: var(--sprite-two) no-repeat -128px -264px;
    width: 11px;
    height: 11px;
    margin-right: 6px;
    display: inline-block;
}

.report-issue-block .fly-close {
    float: right;
    margin-left: 19px;
}

.chat-side-bar {
    float: left;
    width: 100%;
    height: calc(100% - 62px);
    overflow-y: auto;
}

.ind-chat-section {
    float: left;
    width: 100%;
    margin-bottom: 28px;
}

.chat-item-header-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    padding: 0 20px 0 20px;
}

.chat-item-header-block h5 {
    float: left;
    color: #646B88;
    font-size: 14px;
    line-height: 16px;
    text-shadow: 0px 1px 4px rgba(0, 0, 0, .2);
}

.chat-item-block {
    float: left;
    width: 100%;
}

.chat-item-block li {
    float: left;
    width: 100%;
    padding: 0 20px 0 20px;
}

.chat-item-block li a {
    float: left;
    width: 100%;
    height: 27px;
    position: relative;
    color: #b1becd;
    font-size: 12px;
    padding-left: 21px;
    display: flex;
    align-items: center;
}

.pool-side .chat-item-block li a {
    padding-left: 0;
}

.name-pen:before {
    background-position: -8px -325px;
    width: 16px;
    height: 12px;
    margin-right: 7px;
}

.private-data:before {
    background-position: -30px -325px;
    width: 13px;
    height: 12px;
    margin-right: 10px;
}

.analytics-reports:before {
    background-position: -151px -325px;
    width: 13px;
    height: 12px;
    margin-right: 10px;
}

.event-schedules:before {
    background-position: -131px -324px;
    width: 12px;
    height: 14px;
    margin-right: 10px;
}

.server-details:before {
    background-position: -109px -325px;
    width: 16px;
    height: 12px;
    margin-right: 8px;
}

.legal-notes:before {
    background-position: -88px -325px;
    width: 15px;
    height: 12px;
    margin-right: 8px;
}

.confidential-notes:before {
    background-position: -71px -324px;
    width: 11px;
    height: 14px;
    margin-right: 10px;
}

.project-notes:before {
    background-position: -49px -325px;
    width: 16px;
    height: 12px;
    margin-right: 8px;
}

.chat-item-block li.active-note a {
    color: var(--default-color);
    font-weight: 600;
}

.chat-list-right-bottom .pj-added-user {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.active-nt .name-pen:before,
.chat-item-block li:hover .name-pen:before {
    background-position: -8px -344px;
}

.active-nt .private-data:before,
.chat-item-block li:hover .private-data:before {
    background-position: -30px -344px;
}

.active-nt .analytics-reports:before,
.chat-item-block li:hover .analytics-reports:before {
    background-position: -151px -344px;
}

.active-nt .event-schedules:before,
.chat-item-block li:hover .event-schedules:before {
    background-position: -131px -343px;
}

.active-nt .server-details:before,
.chat-item-block li:hover .server-details:before {
    background-position: -109px -344px;
}

.active-nt .legal-notes:before,
.chat-item-block li:hover .legal-notes:before {
    background-position: -88px -344px;
}

.active-nt .confidential-notes:before,
.chat-item-block li:hover .confidential-notes:before {
    background-position: -71px -343px;
}

.active-nt .project-notes:before,
.chat-item-block li:hover .project-notes:before {
    background-position: -49px -344px;
}

.chat-item-block .active-nt,
.chat-item-block .active-nt:hover {
    background: var(--default-color);
}

.chat-item-block .active-nt a {
    color: #fff;
}

.chat-item-block li:hover {
    background: rgba(28, 30, 43, 0.35);
}

.chat-item-block li:hover a {
    color: #fff;
}

.add-chat-button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    cursor: pointer;
}

.add-chat-button:before {
    background-position: -447px -378px;
    width: 17px;
    height: 17px;
}

.add-chat-button:hover:before {
    background-position: -469px -378px;
}

.toaster-notification {
    top: 75px;
    right: 36px;
    z-index: 10;
    position: absolute;
    float: right;
}

.fade.toast {
    background: rgba(47, 150, 180, 0.75);
    border: 1px solid transparent !important;
    display: block;
    opacity: 1;
}

.toast-header {
    background: transparent !important;
    color: #fff;
    height: 50px;
    padding: 0 44px;
    position: relative;
    line-height: 16px;
    font-size: 14px;
}

.toast-header strong {
    white-space: nowrap;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    font-weight: 400 !important;
}

.toast-header .close {
    color: #fff;
    font-weight: 100;
    position: absolute;
    right: 15px;
    top: 13px;
    margin: 0;
    opacity: 1;
}

.toast-header:before {
    content: "";
    background: var(--sprite-one) no-repeat -198px -182px;
    width: 17px;
    height: 18px;
    position: absolute;
    left: 13px;
    top: calc(50% - 9px);
}

.hide-large {
    display: none;
}

.float-panel-content .Loader-holder {
    position: absolute;
}

.user-info-click.mob-area,
.show-mob,
.mobile-toggle-search {
    display: none;
}

.ind-not-left p .font-bold {
    margin-right: 5px;
}

.search-result {
    float: left;
    width: 100%;
    height: 350px;
    min-height: 350px;
    max-height: 350px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 61px;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    border-radius: 0 0 15px 15px;
    padding: 20px 25px;
    background-color: #FFFFFF;
    box-shadow: 0 8px 16px 0 rgba(39, 39, 39, 0.3);
    overflow-y: auto;
}

.result-subhead {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.result-subhead h5 {
    float: left;
    color: rgba(0, 0, 0, 0.38);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 14px;
    text-transform: uppercase;
}

.show-all-btn {
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--default-color);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 14px;
    text-transform: uppercase;
    cursor: pointer;
}

.result-container {
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 30px;
    padding-left: 30px;
}

.result-container:last-child {
    margin-bottom: 0;
}

.result-item {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    position: relative;
    cursor: pointer;
    padding-right: 25px;
}

.result-item:after {
    content: '';
    width: 8px;
    height: 14px;
    background: var(--sprite-two) no-repeat -359px -141px;
    position: absolute;
    top: calc(50% - 7px);
    right: 0;
}

.result-item:last-child {
    margin-bottom: 0;
}

.left-icon {
    float: left;
    width: 35px;
    height: 35px;
    border-radius: 8px;
    margin-right: 15px;
    display: none;
}

.left-icon img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.right-description {
    float: left;
    width: 100%;
}

.right-description h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0;
    margin-bottom: 5px;
    line-height: 19px;
    transition: .3s ease-out;
}

.right-description p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 14px;
}

.result-item:hover .right-description h5 {
    color: var(--default-color);
}

.search-progress .right-description h5 {
    height: 19px;
    width: 352px;
    opacity: 0.8;
    border-radius: 2px;
    background-color: #D8D8D8;
    margin-bottom: 7px;
}

.search-progress .right-description p {
    height: 14px;
    width: 471px;
    opacity: 0.5;
    border-radius: 2px;
    background-color: #D8D8D8;
}

.search-progress .right-description {
    display: flex;
    flex-direction: column;
}

.search-progress .left-icon {
    background-color: #D8D8D8;
}

.search-progress .result-item {
    opacity: 0.54;
}

.search-progress .result-item:before {
    content: "";
    width: 25px;
    height: 35px;
    background: rgba(255, 255, 255, 0.25);
    position: absolute;
    z-index: 9;
    -webkit-animation: linear infinite alternate;
    -webkit-animation-name: run;
    -webkit-animation-duration: 2s;
}

@-webkit-keyframes run {
    0% {
        left: 0;
    }

    50% {
        left: 50%;
    }

    100% {
        left: 0;
    }
}

.recently .left-icon {
    display: none;
}

.recently .right-description {
    width: 100%;
}

.matching-text {
    color: var(--default-text);
    background: rgba(129, 194, 241, 0.35);
}

.right-description p span {
    color: var(--default-color);
    font-size: 12px;
    letter-spacing: 0;
    line-height: 14px;
    padding-left: 12px;
    position: relative;
}

.right-description p span:before {
    content: "";
    height: 3px;
    width: 3px;
    background-color: var(--default-color);
    border-radius: 50%;
    position: absolute;
    left: 4px;
    top: calc(50% - 1.5px);
}

.search-task {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--default-color);
    opacity: .5;
}

.search-task:before {
    background-position: -205px -383px;
    width: 20px;
    height: 20px;
}

.search-project {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--default-color);
    opacity: .5;
}

.search-project:before {
    background-position: -267px -384px;
    width: 16px;
    height: 18px;
}

.search-forms {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--default-color);
    opacity: .5;
}

.search-forms:before {
    background-position: -287px -383px;
    width: 19px;
    height: 19px;
}

.search-user {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--default-color);
    opacity: .5;
}

.search-user:before {
    background-position: -230px -383px;
    width: 17px;
    height: 19px;
}

.result-subhead:last-child {
    margin-bottom: 0;
}

.schedule-icon.active .fa.fa-phone {
    background: #4caf50;
    color: white;
    width: 37px;
    height: 37px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    animation: shake-animation 4.71s ease infinite;
    transform-origin: 50% 50%;
}

.schedule-icon.active .fa.fa-phone:after {
    content: "";
    width: 10px;
    height: 10px;
    background: red;
    border: 2px solid white;
    border-radius: 50%;
    position: absolute;
    right: 0;
    top: 0;
}

@keyframes shake-animation {
    0% {
        transform: translate(0, 0)
    }

    1.78571% {
        transform: translate(5px, 0)
    }

    3.57143% {
        transform: translate(0, 0)
    }

    5.35714% {
        transform: translate(5px, 0)
    }

    7.14286% {
        transform: translate(0, 0)
    }

    8.92857% {
        transform: translate(5px, 0)
    }

    10.71429% {
        transform: translate(0, 0)
    }

    100% {
        transform: translate(0, 0)
    }
}

/*------ Header End ------*/

/*------ Modal ------*/

.modal-header .close {
    opacity: 1;
    position: absolute;
    right: 27px;
    top: calc(50% - 8px);
    padding: 0;
    margin: 0;
    line-height: 0;
    cursor: pointer !important;
}

.modal-header .close:before {
    content: "";
    background: var(--sprite-one) no-repeat -252px -333px;
    width: 17px;
    height: 16px;
    display: inline-block;
}

.full-width .modal-lg {
    max-width: 100%;
    margin: 0;
}

.full-width .modal-content {
    border: 0;
    border-radius: 0;
}

.full-width .modal-header {
    float: left;
    width: 100%;
    height: 70px;
    background: var(--theme-second);
    display: flex;
    align-items: center;
    position: relative;
    border-radius: 0;
}

.full-width .modal-title {
    float: left;
    color: #2e3243;
    font-size: 18px;
    font-weight: 700;
    line-height: 21px;
}

.full-width .modal-body {
    height: calc(100vh - 150px);
    padding: 24px 15px;
    overflow-y: auto;
}

.full-width .modal-footer {
    float: left;
    width: 100%;
    height: 80px;
    background: #ecf0f1;
    border-top: 0;
}

.modal-xlg {
    max-width: 60%;
}

.modal-xlg .modal-body {
    height: calc(100vh - 255px) !important;
}

/*------ Modal End ------*/

/*------ Bs modal ------*/

.bs-modal {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    padding: 15px;
    background: rgba(0, 0, 0, .5);
    left: 0;
    top: 0;
    z-index: 9999999;
}

.bs-modal .bs-modal-dialog {
    width: 100%;
    max-width: 660px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
}

.bs-modal .bs-modal-content {
    position: relative;
    float: left;
    width: 100%;
    background: #ffffff;
    border: 1px solid #e3e3e3;
    box-shadow: 0 0 20px 0px rgba(0, 0, 0, .3);
}

.bs-modal .bs-modal-content .bs-modal-title {
    position: relative;
    float: left;
    width: 100%;
    border-bottom: 1px solid #e3e3e3;
    padding: 23px 15px 19px;
}

.bs-modal .bs-modal-content .bs-modal-title h3 {
    font-size: 20px;
    line-height: 15px;
    padding-bottom: 4px;
    margin: 0;
    color: #999999;
}

.bs-modal .bs-modal-content .bs-modal-body {
    position: relative;
    float: left;
    width: 100%;
    padding: 20px;
}

.bs-modal .btn {
    padding: 9px 35px;
    margin: 10px 6px;
}

.bs-modal .btn.btn-default {
    border-color: #cbcbcb;
    background: #ecf0f1;
}

.bs-modal .btn.btn-danger {
    background: #da5566;
}

.bs-modal .btn.btn-info {
    background: var(--default-color);
}

.bs-modal .bs-modal-content .bs-modal-footer {
    position: relative;
    float: left;
    width: 100%;
    padding: 10px 15px;
    border-top: 1px solid #e3e3e3;
}

.bs-modal .bs-modal-content .bs-modal-body .bs-modal-form {
    position: relative;
    float: left;
    width: 100%;
}

.bs-modal .bs-modal-content .bs-modal-body .bs-modal-form label {
    width: 100%;
    color: #4b4b4b;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 15px;
}

.bs-modal-close {
    background: url(images/bs-modal/bsmodal-close.png) no-repeat center;
    position: absolute;
    width: 12px;
    height: 12px;
    right: 15px;
    top: calc(50% - 4px);
}

.bs-modal-close:hover {
    opacity: .5;
}

.bs-modal .modal-option-button .icon-in.icon-close-in {
    background-position: -11px -125px;
    width: 16px;
    height: 16px;
}

.bs-modal .modal-option-button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: absolute;
    right: -30px;
    top: -30px;
}

.bs-modal.bs-conformation .bs-modal-content .bs-modal-title {
    width: auto;
    border-bottom: 0;
    padding: 0;
}

.bs-modal.bs-conformation .bs-modal-content .bs-modal-body {
    padding: 0;
    width: auto;
}

.bs-modal.bs-conformation .bs-modal-content {
    float: left;
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
    border: 0;
    border-radius: 10px;
    background-color: #FFFFFF;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
}

.bs-modal.bs-conformation .bs-modal-content .bs-modal-title h3 {
    float: left;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 20px;
    display: flex;
    padding: 0;
}

.bs-modal.bs-conformation .bs-modal-body button {
    margin: 0;
    padding: 0;
    height: 40px;
    width: auto;
    border: 1px solid #C4C4C4;
    border-radius: 5px;
    background-color: #FFFFFF;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 19px;
    color: var(--default-text);
    padding: 0 15px;
    margin-left: 10px;
}

.bs-modal.bs-conformation .bs-modal-body button.btn-default {
    background: #fff;
}

.bs-modal.bs-conformation .bs-modal-body button.btn-success {
    background: #03B86E;
    color: #fff;
    border-color: #03B86E;
}

.bs-modal.bs-conformation .bs-modal-content .bs-modal-title h3:before {
    content: "";
    background: var(--sprite-two) no-repeat -653px -136px;
    width: 26px;
    height: 25px;
    display: inline-block;
    margin-right: 12px;
}

/*------ Bs modal End ------*/

/*------ Login ------*/

.login-area {
    float: left;
    width: 100%;
    height: 100vh;
    background: url(./images/bg.jpg) no-repeat;
    background-size: cover;
}

.login-bg {
    float: left;
    width: 100%;
    height: 100%;
    background: url(./images/art.png) no-repeat;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-block {
    width: 370px;
    min-height: 340px;
    border-radius: 10px;
    background-color: #FFFFFF;
    box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.05);
    padding: 30px;
    margin: 0 auto;
    position: relative;
}

.login-block h1 {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 36px;
    font-weight: 300;
    line-height: 42px;
    position: absolute;
    left: 0;
    top: -119px;
    color: #43566B;
}

.logo-brand {
    float: left;
    width: 100%;
    height: 64px;
    margin-bottom: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-input-block {
    float: left;
    width: 100%;
    position: relative;
}

.login-input {
    float: left;
    width: 100%;
    height: 55px;
    border: 1px solid #ECF0F2;
    border-radius: 0 0 3px 3px;
    background-color: #FFFFFF;
    padding: 20px 45px 20px 25px;
    font-size: 14px;
    color: var(--default-text);
}

.int .login-input {
    border-bottom: 0;
    border-radius: 3px 3px 0 0;
}

.login-button-block {
    float: left;
    width: 100%;
    margin-top: 15px;
}

.login-button {
    float: left;
    width: 100%;
    height: 55px;
    background: var(--default-color);
    color: #FFFFFF;
    border: 0;
    border-radius: 3px;
    letter-spacing: 0.5px;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
    transition: .4s ease-out;
}

.login-button:hover {
    background: rgba(74, 144, 226, 0.85);
}

.forgot {
    color: #B1BECD;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: .5px;
    line-height: 16px;
    text-align: center;
    margin-top: 25px;
    float: left;
    width: 100%;
}

.forgot a {
    font-weight: 600;
    color: var(--default-color);
}

.highlight,
.highlight:hover {
    color: var(--default-color);
}

.capitalize {
    text-transform: CAPITALIZE;
}

/*------ Login End ------*/

/*------ Dashboard ------*/

.dash-wrapper {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.dash-wrapper-left {
    float: left;
    width: 435px;
    height: 100%;
    background: #fff;
    border-right: 1px solid #e4e5e9;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.task-dash-top {
    float: left;
    width: 100%;
    height: 50%;
}

.task-dash-bottom {
    float: left;
    width: 100%;
    height: 50%;
}

.dash-wrapper-left .task-list-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.task-split-header {
    float: left;
    width: 100%;
    height: 45px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e4e5e9;
    border-bottom: 1px solid #e4e5e9;
}

.task-split-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.task-split-header p {
    float: left;
    color: var(--default-grey);
    font-size: 13px;
    line-height: 15px;
}

.task-split-bottom {
    float: left;
    width: 100%;
    height: calc(100% - 45px);
    overflow-y: auto;
}

.ind-task-list-click {
    float: left;
    width: 100%;
    padding: 9px 18px;
    position: relative;
}

.select-chk-block {
    float: left;
    margin-right: 10px;
    display: none;
}

.task-priority-block {
    float: left;
    position: relative;
}

.dash-wrapper-left .task-priority-block {
    height: 19px;
}

.progress--circle {
    position: relative;
    display: inline-block;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background-color: #EBEDED;
}

.dash-wrapper-left .progress--circle {
    background-color: var(--default-grey);
    margin-right: 15px;
    width: 19px;
    height: 19px;
}

.progress--circle:before {
    content: '';
    position: absolute;
    top: calc(50% - 6.5px);
    left: calc(50% - 6.5px);
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background-color: white;
}

.dash-wrapper-left .progress--circle:before {
    width: 17px;
    height: 17px;
    top: calc(50% - 8.5px);
    left: calc(50% - 8.5px);
}

.toper {
    position: absolute;
    color: var(--default-grey);
    font-size: 8px;
    line-height: 9px;
    text-align: center;
    top: 5px;
    left: 1px;
    width: 17px;
    height: 17px;
    border-radius: 60%;
}

.progress--circle:after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: var(--default-color);
}

.progress--bar.progress--0:after {
    width: 0%;
}

.progress--circle.progress--0:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(90deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--5:after {
    width: 5%;
}

.progress--circle.progress--5:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(108deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--10:after {
    width: 10%;
}

.progress--circle.progress--10:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(126deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--15:after {
    width: 15%;
}

.progress--circle.progress--15:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(144deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--20:after {
    width: 20%;
}

.progress--circle.progress--20:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(162deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--25:after {
    width: 25%;
}

.progress--circle.progress--25:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(180deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--30:after {
    width: 30%;
}

.progress--circle.progress--30:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(198deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--35:after {
    width: 35%;
}

.progress--circle.progress--35:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(216deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--40:after {
    width: 40%;
}

.progress--circle.progress--40:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(234deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--45:after {
    width: 45%;
}

.progress--circle.progress--45:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(252deg, var(--default-color) 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--50:after {
    width: 50%;
}

.progress--circle.progress--50:after {
    background-image: linear-gradient(-90deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--55:after {
    width: 55%;
}

.progress--circle.progress--55:after {
    background-image: linear-gradient(-72deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--60:after {
    width: 60%;
}

.progress--circle.progress--60:after {
    background-image: linear-gradient(-54deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--65:after {
    width: 65%;
}

.progress--circle.progress--65:after {
    background-image: linear-gradient(-36deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--70:after {
    width: 70%;
}

.progress--circle.progress--70:after {
    background-image: linear-gradient(-18deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--75:after {
    width: 75%;
}

.progress--circle.progress--75:after {
    background-image: linear-gradient(0deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--80:after {
    width: 80%;
}

.progress--circle.progress--80:after {
    background-image: linear-gradient(18deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--85:after {
    width: 85%;
}

.progress--circle.progress--85:after {
    background-image: linear-gradient(36deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--90:after {
    width: 90%;
}

.progress--circle.progress--90:after {
    background-image: linear-gradient(54deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--95:after {
    width: 95%;
}

.progress--circle.progress--95:after {
    background-image: linear-gradient(72deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--100:after {
    width: 100%;
}

.progress--circle.progress--100:after {
    background-image: linear-gradient(90deg, #63B8FF 50%, transparent 52%, transparent), linear-gradient(270deg, #63B8FF 50%, #ddd 50%, #ddd);
}

.progress--circle.intiate.progress--0:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(90deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--5:after {
    width: 5%;
}

.progress--circle.intiate.progress--5:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(108deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--10:after {
    width: 10%;
}

.progress--circle.intiate.progress--10:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(126deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--15:after {
    width: 15%;
}

.progress--circle.intiate.progress--15:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(144deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--20:after {
    width: 20%;
}

.progress--circle.intiate.progress--20:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(162deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--25:after {
    width: 25%;
}

.progress--circle.intiate.progress--25:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(180deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--30:after {
    width: 30%;
}

.progress--circle.intiate.progress--30:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(198deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--35:after {
    width: 35%;
}

.progress--circle.intiate.progress--35:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(216deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--40:after {
    width: 40%;
}

.progress--circle.intiate.progress--40:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(234deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--45:after {
    width: 45%;
}

.progress--circle.intiate.progress--45:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(252deg, var(--default-color) 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--50:after {
    width: 50%;
}

.progress--circle.intiate.progress--50:after {
    background-image: linear-gradient(-90deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--55:after {
    width: 55%;
}

.progress--circle.intiate.progress--55:after {
    background-image: linear-gradient(-72deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--60:after {
    width: 60%;
}

.progress--circle.intiate.progress--60:after {
    background-image: linear-gradient(-54deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--65:after {
    width: 65%;
}

.progress--circle.intiate.progress--65:after {
    background-image: linear-gradient(-36deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--70:after {
    width: 70%;
}

.progress--circle.intiate.progress--70:after {
    background-image: linear-gradient(-18deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--75:after {
    width: 75%;
}

.progress--circle.intiate.progress--75:after {
    background-image: linear-gradient(0deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--80:after {
    width: 80%;
}

.progress--circle.intiate.progress--80:after {
    background-image: linear-gradient(18deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--85:after {
    width: 85%;
}

.progress--circle.intiate.progress--85:after {
    background-image: linear-gradient(36deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--90:after {
    width: 90%;
}

.progress--circle.intiate.progress--90:after {
    background-image: linear-gradient(54deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--95:after {
    width: 95%;
}

.progress--circle.intiate.progress--95:after {
    background-image: linear-gradient(72deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--100:after {
    width: 100%;
}

.progress--circle.intiate.progress--100:after {
    background-image: linear-gradient(90deg, #f5a721 50%, transparent 52%, transparent), linear-gradient(270deg, #f5a721 50%, #ddd 50%, #ddd);
}

.progress--circle.issues.progress--0:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(90deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--5:after {
    width: 5%;
}

.progress--circle.issues.progress--5:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(108deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--10:after {
    width: 10%;
}

.progress--circle.issues.progress--10:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(126deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--15:after {
    width: 15%;
}

.progress--circle.issues.progress--15:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(144deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--20:after {
    width: 20%;
}

.progress--circle.issues.progress--20:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(162deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--25:after {
    width: 25%;
}

.progress--circle.issues.progress--25:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(180deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--30:after {
    width: 30%;
}

.progress--circle.issues.progress--30:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(198deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--35:after {
    width: 35%;
}

.progress--circle.issues.progress--35:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(216deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--40:after {
    width: 40%;
}

.progress--circle.issues.progress--40:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(234deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--45:after {
    width: 45%;
}

.progress--circle.issues.progress--45:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(252deg, var(--default-color) 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--50:after {
    width: 50%;
}

.progress--circle.issues.progress--50:after {
    background-image: linear-gradient(-90deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--55:after {
    width: 55%;
}

.progress--circle.issues.progress--55:after {
    background-image: linear-gradient(-72deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--60:after {
    width: 60%;
}

.progress--circle.issues.progress--60:after {
    background-image: linear-gradient(-54deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--65:after {
    width: 65%;
}

.progress--circle.issues.progress--65:after {
    background-image: linear-gradient(-36deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--70:after {
    width: 70%;
}

.progress--circle.issues.progress--70:after {
    background-image: linear-gradient(-18deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--75:after {
    width: 75%;
}

.progress--circle.issues.progress--75:after {
    background-image: linear-gradient(0deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--80:after {
    width: 80%;
}

.progress--circle.issues.progress--80:after {
    background-image: linear-gradient(18deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--85:after {
    width: 85%;
}

.progress--circle.issues.progress--85:after {
    background-image: linear-gradient(36deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--90:after {
    width: 90%;
}

.progress--circle.issues.progress--90:after {
    background-image: linear-gradient(54deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--95:after {
    width: 95%;
}

.progress--circle.issues.progress--95:after {
    background-image: linear-gradient(72deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--100:after {
    width: 100%;
}

.progress--circle.issues.progress--100:after {
    background-image: linear-gradient(90deg, #f162d4 50%, transparent 52%, transparent), linear-gradient(270deg, #f162d4 50%, #ddd 50%, #ddd);
}

.progress--circle.deliver.progress--0:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(90deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--5:after {
    width: 5%;
}

.progress--circle.deliver.progress--5:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(108deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--10:after {
    width: 10%;
}

.progress--circle.deliver.progress--10:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(126deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--15:after {
    width: 15%;
}

.progress--circle.deliver.progress--15:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(144deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--20:after {
    width: 20%;
}

.progress--circle.deliver.progress--20:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(162deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--25:after {
    width: 25%;
}

.progress--circle.deliver.progress--25:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(180deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--30:after {
    width: 30%;
}

.progress--circle.deliver.progress--30:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(198deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--35:after {
    width: 35%;
}

.progress--circle.deliver.progress--35:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(216deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--40:after {
    width: 40%;
}

.progress--circle.deliver.progress--40:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(234deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--45:after {
    width: 45%;
}

.progress--circle.deliver.progress--45:after {
    background-image: linear-gradient(90deg, #ddd 50%, transparent 52%, transparent), linear-gradient(252deg, var(--default-color) 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--50:after {
    width: 50%;
}

.progress--circle.deliver.progress--50:after {
    background-image: linear-gradient(-90deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--55:after {
    width: 55%;
}

.progress--circle.deliver.progress--55:after {
    background-image: linear-gradient(-72deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--60:after {
    width: 60%;
}

.progress--circle.deliver.progress--60:after {
    background-image: linear-gradient(-54deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--65:after {
    width: 65%;
}

.progress--circle.deliver.progress--65:after {
    background-image: linear-gradient(-36deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--70:after {
    width: 70%;
}

.progress--circle.deliver.progress--70:after {
    background-image: linear-gradient(-18deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--75:after {
    width: 75%;
}

.progress--circle.deliver.progress--75:after {
    background-image: linear-gradient(0deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--80:after {
    width: 80%;
}

.progress--circle.deliver.progress--80:after {
    background-image: linear-gradient(18deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--85:after {
    width: 85%;
}

.progress--circle.deliver.progress--85:after {
    background-image: linear-gradient(36deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--90:after {
    width: 90%;
}

.progress--circle.deliver.progress--90:after {
    background-image: linear-gradient(54deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--95:after {
    width: 95%;
}

.progress--circle.deliver.progress--95:after {
    background-image: linear-gradient(72deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.progress--bar.progress--100:after {
    width: 100%;
}

.progress--circle.deliver.progress--100:after {
    background-image: linear-gradient(90deg, #36b449 50%, transparent 52%, transparent), linear-gradient(270deg, #36b449 50%, #ddd 50%, #ddd);
}

.bsy-table tbody tr:hover td .pj-first-left-section h5 {
    color: var(--default-color);
}

.dash-wrapper-left .ind-task-list-center {
    width: calc(100% - 145px);
}

.dash-wrapper-left .ind-task-list-center .task-text {
    padding-left: 0;
}

.dash-wrapper-right {
    float: left;
    width: calc(100% - 435px);
    height: 100%;
    padding: 20px;
    overflow-y: auto;
}

.content-left {
    float: left;
    width: 402px;
    background: #fff;
    border: 1px solid rgba(64, 83, 100, 0.15);
    padding: 15px 20px 15px 20px;
    margin-right: 20px;
    margin-bottom: 20px;
}

.small-tab {
    height: 200px;
}

.content-bl-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.content-bl-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.content-left .select-box {
    width: auto;
}

.dash-wrapper-right-center .content-left .select-box select {
    height: 35px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    color: var(--default-text);
    font-size: 12px;
    line-height: 14px;
    width: 100%;
}

.content-left .select-box select {
    width: auto;
    border: 0;
    height: 19px;
    padding: 0 20px 0 20px;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
}

.content-left .select-box:after {
    background: var(--sprite-one) no-repeat -9px -451px;
    width: 14px;
    height: 7px;
    right: 0;
    top: calc(50% - 3.5px);
}

.dash-wrapper-right-center .content-left .select-box:after {
    background: var(--sprite-one) no-repeat -468px -189px;
    width: 10px;
    height: 6px;
    position: absolute;
    right: 17px;
    top: calc(50% - 2.5px);
}

.static-mode-block {
    float: left;
    width: 100%;
}

.ind-static-md {
    float: left;
    width: calc((100% / 3) - 10px);
    margin-right: 15px;
    margin-bottom: 13px;
}

.ind-static-md:nth-child(3n) {
    margin-right: 0;
}

.ind-static-md p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 10px;
    letter-spacing: normal;
    white-space: nowrap;
}

.progress {
    height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.ind-static-md .progress {
    float: left;
    width: 100%;
    box-shadow: none;
    border-radius: 0;
    position: relative;
    margin-bottom: 5px;
    height: 4px;
    border-radius: 5px;
    background-color: #E6EEF9;
}

.progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #007bff;
    transition: width .6s ease;
}

.green {
    background-color: #0F9D58;
}

.ind-static-md .progress-bar {
    height: 4px;
    background: linear-gradient(270deg, #288DD6 0%, var(--default-color) 100%);
    border-radius: 2px;
}

.ind-static-md h5 {
    color: var(--default-text);
    font-size: 24px;
    font-weight: 500;
    line-height: 28px;
    float: left;
    width: 100%;
}

.content-left {
    float: left;
    width: 360px;
    background: #fff;
    border: 1px solid rgba(64, 83, 100, 0.15);
    padding: 15px 20px 15px 20px;
    margin-right: 20px;
    margin-bottom: 20px;
    position: relative;
}

.lg-tab {
    width: calc(100% - 380px);
    margin-right: 0;
    height: 200px;
    padding-bottom: 0;
}

.static-counter {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.static-counter li {
    float: left;
    width: calc((100% / 4) - 15px);
    height: 65px;
    padding: 12px 18px;
    margin-right: 20px;
    border: 1px solid #E5EBF2;
    border-radius: 5px;
    background-color: #FFFFFF;
}

.static-counter li:last-child {
    margin-right: 0;
}

.static-counter .shaded {
    background-color: #FFF7F7;
}

.static-block {
    float: left;
    width: 100%;
}

.static-block p {
    float: left;
    width: 100%;
    color: #bdbdbd;
    font-size: 12px;
    line-height: 14px;
}

.static-block h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
}

.sm-text {
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 300;
    line-height: 16px;
}

.graph-wrapper {
    float: left;
    width: 100%;
    text-align: center;
    margin-left: 0 !important;
}

.dash-wrapper-right-center .small-tab {
    height: 420px;
}

.calendar-block {
    float: left;
    width: 100%;
}

.calendar-selection-block {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.calendar-selection-block .select-box:first-child {
    width: calc(100% - 129px);
}

.calendar-selection-block .select-box:last-child {
    width: 112px;
    margin-left: 17px;
}

.calendar-block .rbc-toolbar {
    display: none;
}

.dash-wrapper-right-center .calendar-wrap {
    float: left;
    width: 100%;
    margin-bottom: 14px;
}

.rbc-month-view {
    display: block !important;
}

.calendar-block .rbc-month-header {
    border-bottom: 1px solid #dee2e6;
}

.calendar-block .rbc-header {
    padding: 16px;
    text-overflow: unset;
    white-space: normal;
    padding-top: 0;
    border: 0;
    color: var(--default-grey);
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0.28px;
    line-height: 10px;
    text-align: center;
}

.calendar-block .rbc-day-bg {
    padding: 16px;
    float: left;
}

.calendar-block .rbc-date-cell {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.31px;
    line-height: 13px;
    text-align: center;
    background: #fff;
    border-left: 0;
    border-right: 1px solid #dee2e6;
    height: 46px;
}

.calendar-block .rbc-off-range {
    color: #D1D1D1;
}

.calendar-block .rbc-row .rbc-date-cell:first-child {
    border-left: 1px solid #dee2e6;
}

.calendar-block .rbc-month-row+.rbc-month-row {
    border-color: #dee2e6;
}

.calendar-block .rbc-month-row {
    height: 46px !important;
}

.calendar-block .rbc-row-segment {
    padding: 0;
}

.calendar-block .rbc-event {
    width: 100%;
    height: 46px;
    border-radius: 0;
    background-color: transparent;
    padding: 0;
    cursor: text;
    float: left;
}

.calendar-block .rbc-event:before {
    content: "";
    width: 20px;
    height: 20px;
    background: #ccc;
}

.calendar-block .rbc-event-content {
    float: left;
    width: 100%;
    height: 3px;
    transition: .3s ease-out;
}

.calendar-block .task-nums {
    background: transparent;
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0.25px;
    line-height: 10px;
    transition: .3s ease-out;
    font-size: 0;
}

.calendar-block .rbc-row-segment:hover .rbc-event-content {
    height: 46px;
}

.calendar-block .rbc-row-segment:hover .rbc-event-content .task-nums {
    font-size: 9px;
}

.calendar-block .rbc-row-content .rbc-row:nth-child(2n) {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 46px;
    padding: 0;
}

.calendar-block .rbc-month-view {
    border-color: #dee2e6;
    border: 0;
}

.calendar-block .rbc-month-view {
    border: 0;
    border-bottom: 1px solid #dee2e6;
}

.calendar-block .task-nums.ontime-tasks {
    background: #3fa9f6;
}

.calendar-block .task-nums.overdue-tasks {
    background: #ca2700;
}

.dash-tab {
    float: left;
    width: 100%;
    margin: 0;
}

.dash-tab thead tr th {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    border-bottom: 0;
    border-top: 0;
    padding: 14px 20px;
    text-transform: uppercase;
}

.dash-tab thead tr th:first-child {
    width: 60%;
}

.dash-tab tbody tr td {
    color: var(--default-grey);
    font-size: 12px;
    letter-spacing: 0.33px;
    line-height: 14px;
    border-top: 1px solid #F3F3F3;
    padding: 12px 20px;
}

.progress-wrapper {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.progress-wrapper h5 {
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0.39px;
    line-height: 16px;
    float: left;
    margin-right: 20px;
}

.progress-wrapper .progress {
    float: left;
    margin: 0;
    width: 117px;
    height: 4px;
    background-color: #E6EEF9;
    box-shadow: none;
    border-radius: 2px;
}

.progress-wrapper .progress-bar {
    background: linear-gradient(270deg, #288DD6 0%, var(--default-color) 100%);
    height: 4px;
    border-radius: 2px;
}

.progress-wrapper p {
    color: #9a9a9a;
    font-size: 9.6px;
    font-weight: 500;
    letter-spacing: 0.27px;
    line-height: 11px;
    margin-left: 8px;
}

.expand-click {
    color: #B1BECD;
    font-size: 13px;
    line-height: 15px;
    transition: .3s ease-out;
    border: 0;
    padding: 0;
    line-height: 0;
}

.expand-click:hover {
    color: var(--default-color)
}

.md-ls-tab {
    height: 255px;
    padding: 0;
}

.lg-tab .content-bl-header {
    margin-bottom: 12px;
}

.md-ls-tab .content-bl-header {
    padding: 15px 20px 0 20px;
    margin-bottom: 13px;
}

.task-counter {
    float: left;
    width: 100%;
}

.dash-wrapper-right-center .task-counter {
    padding-left: 28px;
}

.dash-wrapper-right-center .task-counter-text {
    float: left;
    width: auto;
    margin-right: 58px;
    display: flex;
    align-items: center;
    padding-left: 18px;
    position: relative;
    margin-bottom: 0;
}

.dash-wrapper-right-center .task-counter-text:last-child {
    margin-right: 0;
}

.dash-wrapper-right-center .task-counter-text:before {
    content: "";
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #b7c7cb;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.dash-wrapper-right-center .task-counter-text.upcoming:before {
    background: var(--default-color);
}

.dash-wrapper-right-center .rbc-header+.rbc-header {
    border-left: 0;
}

.task-text-small {
    opacity: 0.5;
    color: var(--default-text);
    font-size: 12px;
    line-height: 14px;
}

.task-text-large {
    color: var(--default-text);
    font-size: 24px;
    font-weight: 600;
    line-height: 28px;
    margin-left: 13px;
}

.dash-wrapper-right-center .task-counter-text {
    float: left;
    width: auto;
    margin-right: 40px;
    display: flex;
    align-items: center;
    padding-left: 18px;
    position: relative;
    margin-bottom: 0;
}

.dash-wrapper-right-center .task-counter-text:before {
    content: "";
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #b7c7cb;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.dash-wrapper-right-center .task-counter-text.overdue:before {
    background: #CA2700;
}

.md-tab {
    height: 145px;
}

.content-left .Loader-holder {
    position: absolute;
}

.rbc-date-cell>a,
.rbc-date-cell>a:active,
.rbc-date-cell>a:visited {
    cursor: text;
}

.dash-wrapper-right-bottom .content-left {
    background: #1C1F2B;
    padding-bottom: 0;
}

.dash-wrapper-right-bottom .content-bl-header h5 {
    color: #fff;
}

.dash-wrapper-right-bottom .ind-static-md p {
    color: #fff;
    opacity: .3;
}

.dash-wrapper-right-bottom .content-left .select-box select {
    background: transparent;
    color: #fff;
    opacity: .3;
}

.dash-wrapper-right-bottom .ind-static-md h5 {
    color: #fff;
}

.dash-wrapper-right-bottom .static-counter li {
    background: #151721;
    border-color: rgba(229, 235, 242, 0.3);
}

.dash-wrapper-right-bottom .static-block p {
    color: #fff;
    opacity: .3;
}

.dash-wrapper-right-bottom .static-block h5 {
    color: #fff;
}

.dash-wrapper-right-bottom .sm-text {
    color: #fff;
    opacity: .3;
}

.dash-wrapper-right-bottom .static-counter .shaded {
    background: #151721;
    border-color: rgba(202, 39, 0, 0.3);
}

.dash-wrapper-right-bottom .small-tab .graph-wrapper {
    width: calc(66% - 5px);
    margin-top: -9px;
}

.dash-wrapper-left .task-list-wrapper .Loader-holder {
    position: absolute;
}

.calendar-today h5 {
    color: var(--default-grey);
    font-size: 18px;
    font-weight: 300;
    line-height: 21px;
}

.calendar-today h5 span {
    color: var(--default-text);
    font-weight: 400;
}

.normal {
    height: 60px;
    width: auto;
    float: left;
    padding: 0 24px;
    display: flex;
    align-items: center;
    color: #e14745;
    font-weight: 300;
    position: absolute;
    z-index: 99;
    right: 185px;
    top: 0px;
    font-size: 14px;
}

.normal p:before {
    content: "";
    background: var(--sprite-one) no-repeat -308px -357px;
    width: 16px;
    height: 14px;
    position: absolute;
    left: 0;
    top: 0;
}

.report-iframe {
    float: left;
    width: 100%;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 999;
}

.reportissue-iframe,
.reprot-iframe-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.reprot-iframe-wrapper .close:before {
    content: "";
    background: var(--sprite-one) no-repeat -252px -333px;
    width: 17px;
    height: 16px;
    display: inline-block;
}

.reprot-iframe-wrapper .close {
    position: absolute;
    right: 20px;
    top: 21px;
    opacity: 1;
    z-index: 999;
}

.reportissue-iframe iframe {
    border: 0 !important;
}

.recharts-tooltip-wrapper {
    z-index: 999999;
}

.dash-wrapper-right-bottom.select-white .content-left .select-box select {
    background: transparent;
    color: #B9BFC4;
    opacity: 1;
}

.dash-wrapper-right-bottom .content-left .ind-overview-status h5 {
    color: #FFFFFF;
    font-size: 24px;
    font-weight: 500;
}

.dash-wrapper-right-bottom .content-left .ind-performence-rate {
    background: rgb(28, 31, 43);
    border: 1px solid #B9BFC4;
}

.dash-wrapper-right-bottom .content-left .ind-performence-rate p .rate-ratio {
    color: #fff;
}

.rater-ratio {
    float: left;
    display: flex;
    align-items: center;
}

.rater-ratio p {
    display: flex;
    align-items: center;
}

.rater-ratio .text-label {
    line-height: normal;
}

.rater-ratio .rate-ratio {
    margin-left: 10px;
}

.rater-ratio .text-by {
    margin-left: 6px;
}

.empty-data {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #bdbdbd;
    font-weight: 300;
}

.system-task-holder-heading {
    float: left;
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.system-task-holder-heading h5 {
    width: 50%;
}

.system-task-holder-heading p {
    float: left;
    width: 50%;
    font-size: 12px;
    color: #d2d2d2;
    text-align: right;
}

.system-task-holder-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.system-task-holder-body .new-task-input input {
    padding: 0 20px;
}

.system-task-holder-body .new-task-input.text-input textarea {
    padding: 20px;
}

.task-tg .system-task-holder-body .task-input-container .task-input-block .form-type-input {
    padding-right: 0;
}

.task-tg .system-task-holder-body .task-input-container .eq-width {
    width: calc((100% / 2));
    margin-right: 15px;
}

.task-tg .system-task-holder-body .task-input-container .eq-width:last-child {
    margin-right: 0;
}

.task-tg .system-task-holder-body .task-input-container .task-input-block .form-type-input .form-control {
    padding-left: 20px;
    height: 45px;
}

.task-tg .system-task-holder-body .task-input-container .task-input-block .form-type-input:after {
    right: 15px;
}

.date-wrapper {
    float: left;
    width: 100%;
    padding-top: 20px;
}

.date-wrapper h5 {
    float: left;
    width: 100%;
    padding: 0 20px;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 10px;
    font-weight: 500;
    line-height: 19px;
}

.task-tg .system-task-holder-body .date-wrapper .new-task-input {
    height: 45px;
}

.system-task-holder-body .checkbox-wrapper .select-chk-block {
    width: calc((100% / 4));
}

.system-task-separator-wrapper .checkbox-wrapper {
    float: left;
    width: 100%;
    padding: 20px;
    border-bottom: 1px solid #ECEFF1;
}

.system-task-separator-wrapper .checkbox-wrapper {
    padding: 0;
}

.system-task-date-picker h5 {
    padding-left: 20px;
    margin-top: 20px;
    float: left;
    width: 100%;
    margin-bottom: 5px;
}

.recharts-tooltip-wrapper {
    z-index: 999999;
    background: #fff;
    padding: 10px;
    border: 1px solid #d7d7d7;
    border-radius: 5px;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    width: 50%;
}

.custom-tooltip label {
    font-size: 14px;
    margin-bottom: 4px;
    float: left;
    width: 100%;
}

.custom-tooltip .label {
    float: left;
    margin-bottom: 5px;
    font-weight: 600;
    color: var(--default-text);
    font-size: 13px;
}

.custom-tooltip .intro {
    float: left;
    width: 100%;
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 600;
}

.custom-tooltip .intro:last-child {
    margin-bottom: 0;
}

.float-button-new {
    float: left;
    width: 62px;
    height: 62px;
    background: #00B35C;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    line-height: 0;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.15);
    position: relative;
    transition: .4s ease-out;
}

.float-close:before {
    background-position: -307px -217px;
    width: 28px;
    height: 21px;
    left: calc(50% - 12.5px);
    top: calc(50% - 12.5px);
}

.chart-container {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.form-table.coll-full-height.full-view-tabel {
    max-width: 100%;
}

.toggle-button {
    float: left;
    width: 35px;
    height: 35px;
    border: 0;
    padding: 0;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    position: absolute;
    right: 0;
    top: 18px;
    right: 65px;
}

.toggle-button:before {
    background-position: -291px -403px;
    width: 20px;
    height: 16px;
}

.modal-header-left {
    float: left;
}

.usr-profile .modal-header .modal-header-left h5 {
    padding-left: 0;
    margin-bottom: 3px;
}

.chart-holder {
    float: left;
    width: 100%;
    padding: 20px 0;
}

.modal-header-left p {
    font-size: 14px;
    color: var(--default-grey);
}

.recharts-cartesian-grid-horizontal line:nth-last-child(2) {
    stroke: transparent !important;
}

.small-overflow {
    float: left;
}

.flex-center {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.error-block {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.error-block h1 {
    font-size: 100px;
    font-weight: 600;
    color: #bfbfbf;
    margin-bottom: 10px;
}

.error-block p {
    font-size: 30px;
    font-weight: 400;
    color: #bfbfbf;
}

.brand-sub-logo {
    float: left;
    width: 105px;
}

.brand-sub-logo img {
    float: left;
    width: 105px;
}

.add-new-ico {
    display: flex;
    align-items: center;
}

.add-new-ico:before {
    content: "";
    background: var(--sprite-two) no-repeat -25px -228px;
    width: 13px;
    height: 13px;
    display: inline-block;
    margin-right: 10px;
}

.general-btn.dark {
    background: var(--default-text);
    border-color: var(--default-text);
}

.general-btn.dark:hover {
    background: #6a6a6a;
    border-color: #6a6a6a;
}

.select-box.max-200 {
    max-width: 200px;
    margin-left: 20px;
}

.alert-task-holder {
    float: left;
    width: 100%;
    height: 55px;
    position: absolute;
    left: 0;
    top: 1px;
    background: #e14745;
    z-index: 7;
    transition: .3s ease-out;
    border-radius: 0;
}

.alert-task-inner {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 50px 0 20px;
}

.alert-msg-content {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.alert-msg-content p {
    float: left;
    color: #FFFFFF;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    position: relative;
    padding-left: 24px;
    margin-right: 20px;
}

.alert-msg-bold {
    font-weight: 600;
    font-size: 18px;
}

.alert-msg-content p:before {
    content: "";
    background: var(--sprite-two) no-repeat -50px -182px;
    width: 14px;
    height: 14px;
    display: inline-block;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: calc(50% - 7px);
}

.alert-task-vew {
    float: left;
    height: 30px;
    width: auto;
    min-width: 110px;
    border: 1px solid #FFFFFF;
    color: #ffffff;
    font-size: 14px;
    border-radius: 5px;
    background: transparent;
}

.task-alert-close {
    float: left;
    background: transparent;
    width: 20px;
    height: 20px;
    border: 0;
    padding: 0;
    line-height: 0;
    position: absolute;
    right: 16px;
    top: calc(50% - 10px);
}

.task-alert-close:before {
    background-position: -358px -72px;
    width: 11px;
    height: 11px;
}

/*------ Dashboard End ------*/

/*------ Task ------*/

.filter-all-wrapper {
    width: 100%;
    float: left;
    padding: 15px 20px 0px 20px;
    background: #ecf0f1;
    position: relative;
}

.filter-holder {
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    width: 100%;
    margin-bottom: 10px;
    position: relative;
}

.select-box-holder {
    margin: 0px 7px;
    float: left;
    line-height: 0;
}

.select-box-holder:first-child {
    margin-left: 0;
}

.auto-complete-wrapper {
    position: relative;
}

.filter-right-block {
    float: left;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.button-anchor {
    float: left;
    width: 60px;
    height: 40px;
    border-radius: 3px;
    background: #fff;
    border: 1px solid #e4e5e9;
    cursor: pointer;
    position: relative;
    padding: 0;
    transition: .4s ease-out;
}

.button-settings-icon {
    position: absolute;
    left: calc(50% - 8px);
    top: calc(50% - 8px);
}

.icon-in.icon-settings {
    width: 16px;
    height: 16px;
    background-position: -9px -92px;
}

.settings-button {
    float: left;
    width: 60px;
    height: 40px;
    border-radius: 3px;
    background: #fff;
    border: 1px solid #e4e5e9;
    cursor: pointer;
    position: relative;
    padding: 0;
    transition: .4s ease-out;
}

.settings-button.filter-close {
    background: var(--default-color);
    border-color: var(--default-color);
    transition: .4s ease-out;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

.settings-ico:before {
    background-position: -9px -92px;
    width: 16px;
    height: 16px;
    position: absolute;
    left: calc(50% - 8px);
    top: calc(50% - 8px);
}

.filter-close:before {
    background-position: -11px -125px;
    width: 16px;
    height: 16px;
}

.filter-left-wrapper li {
    float: left;
    margin-right: 14px;
    /* margin-bottom: 10px; */
}

.checkbox-st {
    float: left;
    border: 1px solid #e4e5e9;
    background: #fff;
    height: 40px;
    padding: 0 18px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    border-radius: 3px;
}

.control {
    display: block;
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    font-size: 18px;
    margin: 0;
}

.control .inp-chk {
    position: absolute;
    z-index: -1;
    opacity: 0;
    left: 0;
    top: 0;
    width: 15px;
    height: 15px;
}

.control-indicator {
    position: absolute;
    top: calc(50% - 7.5px);
    left: 0;
    height: 15px;
    width: 15px;
    background: #fff;
    border: 1px solid #b6c5ca;
}

.control-indicator:after {
    content: '';
    position: absolute;
    display: none;
}

.control-checkbox .control-indicator:after {
    background: var(--sprite-one) no-repeat;
    background-position: -274px -73px;
    width: 9px;
    height: 7px;
    left: calc(50% - 4.5px);
    top: calc(50% - 3.5px);
    border-color: #b6c5ca;
}

.control .inp-chk:checked~.control-indicator:after,
.control .inp-chk.active+.control-indicator:after {
    display: block;
}

.control .inp-chk:checked~.control-indicator,
.control .inp-chk.active+.control-indicator {
    background: var(--default-color);
    border-color: var(--checkbox-active-border);
}

.checkbox-st label {
    font-size: 14px;
    line-height: normal;
    color: var(--default-text);
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    height: 40px;
    position: relative;
    margin: 0;
}

.filter-button {
    float: left;
    width: 100%;
    border: 1px solid #e4e5e9;
    background: #fff;
    height: 40px;
    font-size: 14px;
    color: #405364;
    border-radius: 3px;
    padding: 0;
    padding: 13px 20px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    cursor: pointer;
}

.fil-archv-ico:before {
    background-position: -32px -94px;
    width: 13px;
    height: 13px;
    margin-right: 9px;
    top: 0px;
    position: relative;
}

.c-select-in {
    display: inline-block;
    margin-bottom: 0;
    position: relative;
}

.c-select-in:after {
    content: "";
    background: var(--sprite-one) no-repeat -468px -189px;
    width: 10px;
    height: 6px;
    position: absolute;
    right: 17px;
    top: calc(50% - 2.5px);
}

.c-select-in select {
    float: left;
    border: 1px solid #e4e5e9;
    background: #fff;
    height: 40px;
    width: 100%;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 32.5px 0 20px;
    font-size: 14px;
    line-height: normal;
    color: var(--default-text);
    border-radius: 3px;
    -webkit-appearance: none;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.filter-input-assign,
.form-group .form-control.filter-input-assign {
    height: 40px;
    min-height: auto;
    border: 1px solid #e4e5e9;
    float: left;
    font-size: 14px;
    color: #405364;
    padding: 0 15px;
}

.auto-complete-list {
    position: absolute;
    z-index: 9;
    width: 100%;
    top: 42px;
    padding: 10px 0px;
    border-radius: .3em;
    margin: .2em 0 0;
    background: hsla(0, 0%, 100%, .9);
    background: linear-gradient(to bottom right, white, hsla(0, 0%, 100%, .8));
    border: 1px solid rgba(0, 0, 0, .3);
    box-shadow: 0.05em 0.2em 0.6em rgba(0, 0, 0, .2);
    text-shadow: none;
    transition: .3s cubic-bezier(.4, .2, .5, 1.4);
    transform-origin: 1.43em -.43em;
}

.auto-complete-list:before {
    content: "";
    position: absolute;
    top: -.43em;
    left: 1em;
    width: 0;
    height: 0;
    padding: .4em;
    background: white;
    border: inherit;
    border-right: 0;
    border-bottom: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.select-box-holder .auto-complete-list li {
    padding: 3px 8px;
    cursor: pointer;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 25px;
    transition: 0.3s ease;
}

.select-box-holder .auto-complete-list li:hover {
    background: #fafafa;
    transition: 0.3s ease;
    color: var(--default-color);
}

.select-box-holder .auto-complete-list {
    border: 1px solid #e4e5e9;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
}

.main-panel-holder {
    width: 100%;
    float: left;
    background: #ecf0f1;
    padding: 20px;
    height: calc(100vh - 60px);
    overflow: auto;
    position: relative;
}

.main-panel-holder.has-filter {
    height: calc(100vh - 125px);
    padding-top: 0;
}

.main-panel-head {
    font-size: 12px;
    font-weight: 600;
    height: 14px;
    width: 141px;
    color: var(--default-text);
    font-size: 11px;
    line-height: 14px;
    margin-bottom: 0;
    float: left;
    width: 100%;
    margin: 12px 0;
    text-transform: uppercase;
}

.ind-task-list {
    float: left;
    width: 100%;
    height: 40px;
    background: #fff;
    border: 1px solid #e4e5e9;
    border-bottom: 0;
    cursor: pointer;
    border-radius: 0;
}

.ind-task-list-left {
    float: left;
    display: flex;
    width: 145px;
    height: 20px;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.ind-task-list-center {
    float: left;
    width: calc(100% - 400px);
    height: 20px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    position: relative;
}

.ind-task-list-right {
    float: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: flex-end;
    -ms-justify-content: flex-end;
    height: 20px;
}

.task-priority {
    float: left;
    width: 20px;
    height: 20px;
    background: #b6c5c8;
    border-radius: 50%;
    font-size: 10px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    text-transform: uppercase;
    margin-right: 15px;
    cursor: pointer;
}

.urgent {
    background: #f34d4b;
}

.high {
    background: #d0690d;
}

.low {
    background: #e2c83a;
}

.medium {
    background: #dea235;
}

.ind-task-list-click.card-body {
    float: left;
    width: 100%;
    padding: 9px 18px;
}

.task-user-block {
    float: left;
    height: 18px;
    position: relative;
}

.task-user {
    float: left;
    line-height: 18px;
    font-size: 13px;
    color: var(--default-text);
    align-items: center;
    transition: .4s ease-out;
    cursor: pointer;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 85px;
    white-space: nowrap;
    text-transform: capitalize;
}

.mobile-com-count {
    display: none;
}

.user-popover-block {
    float: left;
    width: 355px;
    height: 140px;
    background: #fff;
    border: 1px solid #c4c4c4;
    border-radius: 5px;
    position: absolute;
    left: -45px;
    top: 24px;
    z-index: 9;
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.15);
    display: none;
}

.user-popover-block:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 5.5px 6px 5.5px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    top: -6px;
    left: 54px;
    z-index: 2;
}

.user-popover-block:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #c4c4c2 transparent;
    position: absolute;
    top: -8px;
    left: 52px;
    z-index: 1;
}

.user-popover-left {
    float: left;
    width: 100px;
    height: 100%;
    border-right: 1px solid #ccc;
    padding: 18px 15px;
    display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    display: -ms-flexbox;
    display: -webkit-flex;
}

.user-popover-img {
    float: left;
    width: 67px;
    height: 67px;
    border: 2px solid var(--default-color);
    border-radius: 50%;
    padding: 1px;
    position: relative;
}

.online:before {
    content: "";
    width: 12px;
    height: 12px;
    background: #60AD6C;
    position: absolute;
    border-radius: 50%;
    border: 3px solid #fff;
    right: 2px;
    top: 2px;
}

.user-popover-img img {
    float: left;
    width: 61px;
    height: 61px;
    border-radius: 50%;
    object-fit: cover;
}

.user-popover-btn-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.commun-button {
    float: left;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-grey);
    position: relative;
    padding-left: 30px;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.chat-ico:before {
    background-position: -204px -73px;
    width: 12px;
    height: 11px;
    position: absolute;
    z-index: 9;
    left: 6px;
    top: calc(50% - 4.5px);
}

.commun-button:after {
    content: "";
    width: 24px;
    height: 24px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    border-radius: 50%;
    top: calc(50% - 12px);
    z-index: 8;
}

.user-popover-right {
    float: left;
    width: calc(100% - 100px);
    height: 100%;
    padding: 18px 10px;
}

.user-profile-details {
    float: left;
    width: 100%;
}

.user-profile-details .subheader {
    float: left;
    width: 100%;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 14px;
    color: var(--default-text);
}

.user-popover-right .user-profile-details .subheader {
    font-size: 18px;
    margin-bottom: 10px;
}

.prof-user-ico:before {
    background-position: -104px -72px;
    width: 9px;
    height: 10px;
    position: absolute;
    left: 0;
    top: calc(50% - 5px);
}

.mail-ico:before {
    background-position: -119px -73px;
    width: 12px;
    height: 9px;
    position: absolute;
    left: 0;
    top: calc(50% - 4.5px);
}

.phone-ico:before {
    background-position: -138px -74px;
    width: 9px;
    height: 9px;
    position: absolute;
    left: 2px;
    top: calc(50% - 4.5px);
}

.loc-ico:before {
    background-position: -153px -71px;
    width: 10px;
    height: 13px;
    position: absolute;
    left: 2px;
    top: calc(50% - 7.5px);
}

.subtask-ico {
    position: absolute;
    left: 0;
    top: calc(50% - 6px);
}

.subtask-ico:before {
    background-position: -292px -71px;
    width: 13px;
    height: 12px;
}

.task-text {
    text-overflow: ellipsis;
    overflow: hidden;
    max-height: 18px;
    line-height: 18px;
    font-size: 14px;
    font-weight: 600;
    float: left;
    padding-right: 15px;
    color: var(--default-text);
}

.ind-task-list-center .task-text {
    padding-left: 25px;
    height: 20px;
}

.task-more-block {
    float: left;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.comment-info {
    float: left;
    position: relative;
}

.task-more-block .more-ico {
    margin-left: 20px;
}

.task-more-block .more-ico:first-child {
    margin-left: 0;
}

.comment-ico {
    float: left;
    height: 17px;
}

.comment-ico:before {
    background-position: -76px -69px;
    width: 20px;
    height: 17px;
}

.counter {
    float: left;
    width: 16px;
    height: 16px;
    background: #e14745;
    color: #fff;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    border-radius: 50%;
    position: absolute;
    right: -7px;
    top: -7px;
}

.task-more-block .more-ico {
    margin-left: 20px;
}

.task-attach:before {
    background-position: -168px -70px;
    width: 13px;
    height: 15px;
}

.due-block {
    float: right;
    text-align: right;
    font-size: 12px;
    color: #777777;
    margin-left: 30px;
    min-width: 35px;
}

.icon-attachment {
    background-position: -168px -70px;
    width: 13px;
    height: 15px;
}

.absolute-holder {
    float: left;
    width: 100%;
    height: 100%;
    background: #ecf0f1;
}

.center-box {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 35px;
    font-weight: 300;
    color: #6f7478;
    font-weight: 100;
    color: #838488;
}

.center-box img {
    width: 260px;
    height: 260px;
}

.center-box .tile-image {
    margin-bottom: 20px;
}

.ind-task-list:hover {
    border: 1px solid var(--btn-color);
}

.ind-task-list:hover .task-text {
    color: var(--default-color);
}

.main-panel-holder .main-panel-head:first-child {
    margin-top: 0;
}

.ind-task-list:last-child {
    border-bottom: 1px solid #e4e5e9;
}

.ind-task-list:hover:last-child {
    border-bottom: 1px solid var(--btn-color);
}

.icon-in.icon-forward {
    width: 13px;
    height: 12px;
    background-position: -292px -71px;
    position: absolute;
    left: 0;
    top: calc(50% - 6px);
}

.due-block.due {
    color: #e14745;
}

.task-toggler-wrapper.task-tg {
    float: left;
    width: 750px;
    background: #ecf0f1;
    position: fixed;
    right: 20px;
    bottom: 0px;
    height: 565px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .2);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    z-index: 9;
}

.task-header {
    float: left;
    width: 100%;
    height: 50px;
    padding: 15px;
    border-radius: 5px 5px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    background: var(--theme-second);
}

.task-toggler-header .task-head-text {
    color: #fff;
    float: left;
    font-size: 16px;
    font-weight: 300;
}

.task-header-options {
    display: flex;
    align-items: center;
    height: 100%;
}

.task-option-button {
    background: transparent;
    border: 0;
    float: left;
    padding: 0;
    margin-left: 20px;
    position: relative;
    width: 14px;
    height: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.task-toggler-wrapper.maximized .icon-in.icon-expand-toggler {
    background: var(--sprite-two) no-repeat -5px -90px;
    width: 15px;
    height: 15px;
}

.icon-in.icon-close-in {
    background-position: -358px -72px;
    width: 11px;
    height: 12px;
}

.icon-in.icon-minimize {
    background-position: -315px -77px;
    width: 16px;
    height: 2px;
}

.task-content-block {
    float: left;
    width: 100%;
    height: calc(100% - 40px);
    padding: 15px;
    background: #ecf0f1;
    border-right: 1px solid #d3d4d6;
    border-left: 1px solid #d3d4d6;
    overflow-y: auto;
}

.task-tg .task-content-block {
    max-height: none;
}

.task-tg .task-content-block {
    height: calc(100% - 50px);
    background: #FFFFFF;
    padding: 0;
}

.task-toggler-header {
    float: left;
    width: 100%;
    height: 50px;
    padding: 15px;
    border-radius: 5px 5px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    background: var(--theme-second);
}

.icon-in.icon-expand-toggler {
    background-position: -339px -72px;
    width: 13px;
    height: 12px;
}

.persitant-top {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    padding: 8px 20px;
    position: relative;
    overflow-y: auto;
}

.persitant-footer {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-top: 1px solid #ECEFF1;
}

.group-row {
    float: left;
    height: 40px;
    display: flex;
    align-items: center;
}

.group-row h5 {
    float: left;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 15px;
    margin-right: 10px;
}

.attach-lister {
    float: left;
    display: flex;
    align-items: center;
}

.attach-lister li {
    float: left;
    margin-right: 21px;
}

.attach-lister li button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: relative;
    cursor: pointer;
}

.form-at:before {
    background-position: -31px -181px;
    width: 15px;
    height: 16px;
}

.attach-at:before {
    background-position: -291px -182px;
    width: 14px;
    height: 16px;
}

.attach-lister li button input {
    float: left;
    width: 14px;
    height: 16px;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 8;
}

.general-btn {
    margin: 0;
    background: var(--btn-color);
    border: 1px solid var(--btn-color);
    color: #fff;
    height: 40px;
    min-width: 90px;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin-left: 0;
    /* box-shadow: 0 2px 10px 0 rgba(0,0,0,0.16), 0 2px 5px 0 rgba(0,0,0,0.26); */
    transition: .3s ease-out;
}

.general-btn:hover {
    background: var(--hover-color);
    border-color: var(--hover-color);
}

.task-inp-container {
    float: left;
    width: 100%;
    border-bottom: 1px solid #ECEFF1;
    position: relative;
}

.ind-task-input .lb-tx {
    float: left;
    color: #bdbdbd;
    font-size: 14px;
    line-height: 16px;
    position: absolute;
    left: 0;
    top: calc(50% - 8px);
}

.task-tg .ind-task-input .lb-tx {
    position: relative;
    top: 5px;
    left: 0;
    margin-right: 10px;
    text-transform: uppercase;
    font-size: 12px;
}

.task-tg .ind-task-input.selectize-custom .lb-tx {
    top: 10px;
}

.tag-wrapper-bl {
    float: left;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.tag-wrapper-bl input {
    float: left;
    height: 25px;
    max-width: 250px;
    min-width: 190px;
    border: 1px solid transparent;
    color: var(--default-text);
    font-size: 14px;
    line-height: 15px;
}

.select-drop {
    float: left;
    width: 100%;
    height: auto;
    max-height: 310px;
    background: #fff;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    overflow-y: auto;
    overflow-x: hidden;
}

.select-drop li {
    float: left;
    width: 100%;
    height: 40px;
    border-bottom: 1px solid #F2F2F2;
}

.select-drop li:hover {
    background: #fafafa;
}

.select-drop li:hover .select-drop-click-right h5 {
    color: var(--default-color);
}

.select-drop-click {
    font-size: large;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 18px;
}

.select-drop-click-left {
    float: left;
    width: 17px;
    height: 17px;
    margin-right: 7px;
}

.select-drop-click-left img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #F2F2F2;
}

.select-drop-click-right {
    float: left;
    width: calc(100% - 24px);
    display: flex;
    align-items: center;
}

.select-drop-click-right h5 {
    float: left;
    color: var(--default-text);
    font-size: 13px;
    font-weight: 600;
    line-height: 14px;
    margin-right: 10px;
}

.select-drop-click-right p {
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
}

.select-drop-click:hover {
    text-decoration: none;
}

.sl-tag {
    float: left;
    height: 25px;
    display: flex;
    align-items: center;
    background-color: #E0E0E0;
    border-radius: 100px;
    position: relative;
    padding-right: 30px;
    margin-right: 5px;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    max-width: 100%;
}

.tag-left {
    float: left;
    width: 25px;
    height: 25px;
    background: #F57C00;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.87);
    font-size: 14px;
    letter-spacing: -0.03px;
    line-height: 19px;
    text-align: center;
    margin-right: 8px;
    flex-shrink: 0;
}

.tag-right {
    float: left;
    width: auto;
    color: var(--default-text);
    font-size: 13px;
    line-height: 15px;
    max-width: 85%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.tag-cl {
    float: left;
    width: 16px;
    height: 16px;
    color: #fff;
    border-radius: 50%;
    border: 0;
    background: transparent;
    padding: 0;
    line-height: 0;
    background: #666;
    position: absolute;
    right: 6px;
    top: calc(50% - 8px);
    cursor: pointer;
}

.task-tg .tag-wrapper-bl input {
    margin-bottom: 5px;
}

.create-button-block {
    float: left;
    position: absolute;
    right: 0;
    top: 6px;
}

.trans-cr-button {
    float: left;
    background: transparent;
    border: 0;
    color: #bdbdbd;
    font-size: 14px;
    line-height: 16px;
    text-align: right;
    padding: 0;
    margin-left: 5px;
    cursor: pointer;
    text-transform: uppercase;
}

.new-task-input {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid #ECEFF1;
}

.task-tg .new-task-input {
    height: 50px;
}

.task-tg .new-task-input.text-input {
    height: 120px;
    margin-bottom: 0;
}

.new-task-input input {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    font-size: 14px;
    color: var(--default-text);
    padding-left: 0px;
}

.task-textarea {
    float: left;
    width: 100%;
    height: 150px;
    border: 1px solid #e4e5e9;
    padding: 15px;
    font-size: 14px;
    border-radius: 3px;
    resize: none;
}

.new-task-input.text-input textarea {
    float: left;
    width: 100%;
    height: 100%;
    padding: 15px 0;
    border: 0;
    line-height: 19px;
}

.task-toggler-wrapper.task-tg.maximized {
    width: 100%;
    height: 100%;
    right: 0;
    padding: 5% 10%;
    border-radius: 0;
    background: rgba(0, 0, 0, 0.5);
}

.task-toggler-wrapper.minimized {
    height: 50px;
}

.ind-task-input {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    position: relative;
    padding-left: 30px;
}

.task-tg .ind-task-input {
    height: auto;
    min-height: 36px;
    padding-left: 0;
    align-items: flex-start;
    padding-right: 20px;
    margin-top: 5px;
}

.react-datepicker__input-container input {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    height: 100%;
    font-size: 16px;
    position: relative;
    z-index: 8;
    background: transparent;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    padding: 0;
}

.select-box {
    float: left;
    width: 100%;
    position: relative;
}

.select-box select {
    float: left;
    border: 1px solid #e4e5e9;
    background: #fff;
    height: 40px;
    width: 100%;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 32.5px 0 20px;
    font-size: 14px;
    line-height: normal;
    color: var(--default-text);
    border-radius: 3px;
    -webkit-appearance: none;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.task-tg .select-box select {
    border: 1px solid transparent;
    border-bottom: 1px solid #ECEFF1;
    padding: 0;
    height: 36px;
}

.select-box:after {
    content: "";
    background: var(--sprite-one) no-repeat -468px -189px;
    width: 10px;
    height: 6px;
    position: absolute;
    right: 17px;
    top: calc(50% - 2.5px);
}

.task-tg .select-box:after {
    background-position: -278px -472px;
    width: 12px;
    height: 8px;
}

.task-input-container {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.task-input-block {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    position: relative;
}

.task-input-container .eq-width {
    width: calc((100% / 3));
    margin-right: 15px;
}

.task-tg .task-input-container .eq-width {
    width: 100%;
    margin-right: 0;
}

.task-tg .task-input-container .task-input-block {
    margin-bottom: 0;
}

.react-datepicker-wrapper {
    float: left;
    width: 100%;
    height: 36px;
    padding-right: 10px;
}

.row-list .react-datepicker-wrapper {
    height: 50px;
}

.react-datepicker__input-container {
    float: left;
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #ECEFF1;
}

.task-tg .selectize-custom .sl-tag {
    height: 25px;
    border-radius: 3px;
    background: var(--default-color);
    color: #fff;
    padding-right: 20px;
    margin: 5px 5px 5px 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 160px;
}

.task-tg .selectize-custom .sl-tag .tag-right {
    color: #fff;
    padding: 0 5px;
    line-height: 25px;
    font-size: 12px;
    max-width: 100%;
    white-space: unset;
}

.selectize-custom .tag-cl {
    background: transparent;
    height: 25px;
    width: 25px;
    top: 0;
    right: 0;
}

.selectize-custom .select-drop-click-left {
    display: none;
}

.task-tg .selectize-custom .tag-wrapper-bl input {
    height: 25px;
    margin: 5px 0;
    font-size: 14px;
    line-height: 15px;
}

.selectize-custom .select-drop-click-right {
    width: 100%;
}

.bsy-modal {
    position: fixed;
    width: 100%;
    height: 100%;
    padding: 15px;
    background: rgba(0, 0, 0, .5);
    left: 0;
    top: 0;
    z-index: 9999;
}

.modal-lg--x {
    max-width: 900px;
}

.bsy-modal .modal-content {
    border-radius: 0;
    border: 0;
    border-radius: 6px;
}

.bsy-modal .modal-header {
    border-radius: 0;
    height: 50px;
    align-items: center;
    border-bottom: 1px solid #e3e3e3;
    background: var(--theme-second);
    border-radius: 5px 5px 0 0;
    float: left;
    width: 100%;
    padding: 0 15px;
    display: flex;
    align-items: center;
}

.bsy-modal .modal-title {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    line-height: 19px;
}

.bsy-modal .modal-title {
    line-height: 19px;
}

.bsy-modal .modal-close {
    background-position: -358px -72px;
    width: 13px;
    height: 13px;
    background-color: transparent;
    border: 0;
    cursor: pointer;
    padding: 0;
}

.modal-body-heighted {
    padding-bottom: 0px;
    max-height: calc(100vh - 250px);
    overflow: auto;
}

.bsy-modal .modal-in-colored {
    background: #ecf0f1;
}

.mang-lbl-block-mod-in {
    display: inline-block;
    width: 100%;
}

.mang-lbl-block {
    float: left;
    width: 100%;
    height: 100%;
}

.mang-lbl-block-mod-in {
    display: inline-block;
    width: 100%;
}

.lbl-panel-search-block {
    float: left;
    width: 100%;
    height: auto;
    position: relative;
    margin-bottom: 13px;
}

.lbl-search-box {
    float: left;
    width: 100%;
    height: 35px;
    border: 1px solid #e4e5e9;
    border-radius: 3px;
    padding: 0 30px 0 16px;
    font-size: 14px;
}

.mang-lbl-block .lbl-search-box {
    height: 45px;
}

.lbl-search-ico:before {
    background-position: -187px -72px;
    width: 11px;
    height: 11px;
    position: absolute;
    right: 12px;
    top: calc(50% - 5.5px);
}

.content-main-in {
    display: inline-block;
    width: 100%;
}

.content-section {
    float: left;
    width: calc((100% / 4) - 14px);
    margin-right: 18px;
    margin-bottom: 18px;
    transition: .4s ease-out;
    cursor: pointer;
}

.mang-lbl-block-mod-in .content-section {
    border: 0;
}

.content-click {
    float: left;
    width: 100%;
    height: 100%;
}

.section-image {
    float: left;
    width: 100%;
    height: 150px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mang-lbl-block-mod-in .section-image {
    height: 100px;
}

.section-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 3px 3px 0 0;
}

.section-image .checkbox-wrap {
    position: absolute;
    left: 20px;
    top: 15px;
    display: none;
}

.chk-txt-opt {
    float: left;
    width: 14px;
    height: 14px;
}

.section-info-main {
    float: left;
    width: 100%;
    height: 130px;
    background: #fff;
    padding: 13px 20px;
    border-radius: 0 0 3px 3px;
}

.mang-lbl-block-mod-in .section-info-main {
    padding: 10px 15px;
    height: 50px;
}

.section-info {
    float: left;
    width: 100%;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ECEFF2;
    min-height: 73px;
}

.mang-lbl-block-mod-in .section-info {
    min-height: unset;
}

.mang-lbl-block-mod-in .section-info {
    padding-bottom: 0;
    margin-bottom: 5px;
    border-bottom: 0;
}

.section-info h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    margin-bottom: 5px;
    color: var(--default-text);
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 90%;
    transition: .4s ease-out;
}

.section-info-icon {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.section-info-icon span {
    font-size: 12px;
    line-height: 14px;
    color: var(--default-grey);
    display: flex;
    align-items: center;
}

.section-info-icon .icon-style {
    margin-left: 50px;
}

.content-section .section-info-icon .icon-style {
    margin: 0;
}

.icon-form-task:before {
    background-position: -126px -332px;
    width: 12px;
    height: 12px;
    margin-right: 6px;
}

.icon-form-share:before {
    background-position: -148px -332px;
    width: 13px;
    height: 13px;
    margin-right: 6px;
}

.content-section.form-list-item:nth-child(4n) {
    margin-right: 0;
}

.content-section:hover {
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.content-click.selected:before {
    content: "\f00c";
    font-family: 'FontAwesome';
    position: absolute;
    width: 23px;
    height: 23px;
    color: var(--white);
    font-size: 12px;
    background-color: var(--default-color);
    z-index: 9;
    /* background-image: url(images/selected-tick.png); */
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-image:before {
    content: "";
    background-color: rgba(0, 0, 0, 0.17);
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px 3px 0 0;
}

.general-btn.grey {
    background: #ecf0f1;
    border: 1px solid #e2e2e2;
    color: var(--default-text);
}

.task-user-block.__usercard:hover .user-popover-block {
    display: block;
}

.select-box-holder .c-select-in select {
    max-width: 250px;
}

.form-control:focus {
    outline: none;
    border-color: #e4e5e9;
}

.attachment-task-group {
    float: left;
    width: 100%;
    margin-top: 15px;
    display: flex;
    flex-direction: column;
}

.ind-attach-list {
    float: left;
    width: 448px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 448px;
    position: relative;
    background: #efefef;
    border: 1px solid rgba(204, 204, 204, 0.33);
    font-size: 13px;
    color: #6a7476;
    padding: 0 14px;
    border-radius: 10px;
    padding-left: 35px;
    margin-bottom: 10px;
    margin-right: 10px;
}

.ind-attach-list.file:before {
    content: "";
    background: var(--sprite-one) no-repeat -291px -182px;
    width: 14px;
    height: 16px;
    position: absolute;
    left: 11px;
    top: calc(50% - 8px);
}

.ind-attach-list.form:before {
    content: "";
    background: var(--sprite-one) no-repeat -31px -181px;
    width: 15px;
    height: 16px;
    position: absolute;
    left: 11px;
    top: calc(50% - 8px);
}

.ind-attach-list.project:before {
    content: "";
    background: var(--sprite-one) no-repeat -503px -91px;
    width: 11px;
    height: 13px;
    position: absolute;
    left: 11px;
    top: calc(50% - 6.5px);
}

.ind-attach-list h5 {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 90%;
    line-height: 17px;
    color: var(--default-grey);
    font-weight: 600;
}

.cl-fl {
    width: 16px;
    height: 16px;
    padding: 0;
    line-height: 0;
    border: 0;
    background: #a5a5a5;
    border-radius: 50%;
    position: absolute;
    right: 6px;
    cursor: pointer;
}

.attachment-task-group .cl-fl {
    position: relative;
    right: 0;
    top: 0;
}

.cl-fl:before {
    background-position: -422px -188px;
    width: 8px;
    height: 8px;
}

.form-right-portion {
    display: flex;
    align-items: center;
}

.select-drop li.selected {
    background: #fafafa;
}

.select-drop li.selected .select-drop-click-right h5 {
    color: var(--default-text);
}

.val-error {
    border-bottom: 1px solid #ff9393 !important;
    color: #e14745 !important
}

.btn-disable {
    opacity: .5;
    pointer-events: none;
}

.task-tg .task-input-container .task-input-block .form-type-input {
    height: 100%;
    float: left;
    width: 100%;
    padding-right: 20px;
}

.task-tg .task-input-container .task-input-block .form-type-input .form-control {
    height: 36px;
    padding: 0;
    border: 1px solid transparent;
    font-size: 14px;
    line-height: normal;
    color: var(--default-text);
    border-bottom: 1px solid #ECEFF1;
    padding-right: 38px;
}

.task-tg .task-input-container .task-input-block .form-type-input:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    position: absolute;
    width: 12px;
    height: 8px;
    right: 34px;
    top: calc(50% - 2.5px);
}

.tab-scroll .discuss-inner {
    height: auto;
}

.tab-scroll .discuss-inner .assigned-block:last-child {
    margin-bottom: 0;
}

.remark-block {
    float: left;
    width: 100%;
    height: 100%;
    padding: 15px;
    overflow-y: auto;
    background: #ecf0f1;
    border-radius: 0 0 5px 5px;
}

.remark-block p {
    float: left;
    width: 100%;
    word-break: break-word;
    font-size: 14px;
    line-height: normal;
    color: var(--default-grey);
}

.remarks-list {
    float: left;
    width: 100%;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}

.remarks-list:last-child {
    border-bottom: 0;
    margin-bottom: 0;
}

.remarks-list p {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.remarks-attachment-list {
    float: left;
    width: 100%;
}

.rdr-Day.is-inRange {
    background: rgba(92, 196, 239, .1) !important;
}

rdr-Day.is-selected.is-inRange,
.rdr-Day.is-selected {
    color: #fff !important;
    background: var(--default-color) !important;
}

.date-mod .modal-body {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quick-edit {
    float: left;
    width: auto;
    height: 40px;
    background: var(--btn-color);
    position: relative;
    right: -18px;
    border-radius: 50px 0 0 50px;
    transition: .3s ease-out;
    opacity: 0;
    padding-right: 5px;
    display: none;
}

.ind-task-list:hover .quick-edit {
    opacity: 1;
    display: flex;
    align-items: center;
}

.quick-edit li {
    float: left;
    width: 22px;
    height: 22px;
    background: #fff;
    border-radius: 50%;
    margin-left: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quick-edit li button {
    float: left;
    width: 100%;
    height: 100%;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
    border-radius: 50%;
}

.edited-task-ico:before {
    background-position: -456px -158px;
    width: 12px;
    height: 12px;
}

.dlete-task-ico:before {
    background-position: -473px -159px;
    width: 10px;
    height: 12px;
}

.attach-item-name {
    width: 100%;
    display: inline-block;
    font-size: 10px;
    color: #000;
    line-height: 16px;
    text-align: center;
}

.system-task-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.system-task-left {
    float: left;
    width: 200px;
    height: 100%;
    background: rgba(236, 240, 241, 0.3);
    padding: 7px 20px 20px 20px;
}

.system-task-right {
    float: left;
    width: calc(100% - 200px);
    height: 100%;
}

.system-task-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.system-task-right-footer {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.step-flow {
    float: left;
    width: 100%;
}

.step-flow li {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 16px;
    line-height: 50px;
    position: relative;
}

.step-flow li nav {
    float: left;
    width: 100%;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
}

.step-flow li nav:before {
    content: "";
    width: 20px;
    height: 20px;
    border: 1px solid var(--default-grey);
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    left: 0;
    top: 14px;
}

.step-flow li nav:after {
    content: '';
    width: 6px;
    height: 10px;
    border: solid var(--default-grey);
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);
    position: absolute;
    left: 7px;
    top: 17px;
}

.step-flow li nav:hover,
.step-flow li .current {
    color: #394A59;
    font-weight: 600;
}

.step-flow li .active:hover {
    font-weight: 400;
}

.step-flow li nav:hover:before,
.step-flow li .current:before {
    border: 1px solid #394A59;
}

.step-flow li nav:hover:after,
.step-flow li .current:after {
    border-color: #394A59;
}

.step-flow li .active {
    color: #394A59;
}

.step-flow li .active:before,
.step-flow li .active:hover:before {
    background: var(--default-color);
    border-color: var(--default-color);
}

.step-flow li .active:after,
.step-flow li .active:hover:after {
    border-color: #fff;
}

.system-task-holder {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.task-tg .system-task-holder .task-inp-container .ind-task-input {
    padding: 8px 40px 0 20px;
    margin-top: 0;
}

.system-task-holder .task-inp-container .create-button-block {
    right: 20px;
    top: 12px;
}

.system-task-wrapper .check-tick:before {
    background-position: -162px -384px;
    width: 19px;
    height: 19px;
}

.system-task-wrapper .form-at:before {
    background-position: -108px -383px;
    width: 21px;
    height: 21px;
}

.system-task-wrapper .project-at:before {
    background-position: -137px -385px;
    width: 18px;
    height: 18px;
}

.system-task-wrapper .attach-at:before {
    background-position: -83px -383px;
    width: 21px;
    height: 18px;
}

.system-task-wrapper .tag-at:before {
    background-position: -186px -385px;
    width: 17px;
    height: 17px;
}

.system-task-wrapper .attach-lister li {
    margin-right: 30px;
    position: relative;
}

.task-tg .new-task-input.with-persistant-lbl {
    height: 40px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.persistant-label {
    color: #bdbdbd;
    font-size: 14px;
    line-height: 16px;
}

.system-task-holder-body .new-task-input.with-persistant-lbl input {
    padding-right: 0;
    padding-left: 12px;
}

.itemcount {
    float: left;
    height: 16px;
    width: 16px;
    background-color: var(--default-color);
    font-size: 10px;
    font-weight: bold;
    line-height: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    position: absolute;
    right: -8px;
    top: -10px;
}

.system-task-holder-body .radio-wrapper {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0 20px;
    border-bottom: 1px solid #ECEFF1;
}

.system-task-holder-body .radio-wrapper .radio-block {
    width: auto;
    margin-bottom: 27px;
}

.system-task-holder-body .radio-wrapper .radio-block label {
    color: #2E3243;
    font-size: 14px;
}

.system-task-holder-body .checkbox-wrapper {
    margin: 0;
    padding: 20px;
}

.system-task-holder-body .checkbox-wrapper h5 {
    color: #2D4B5D;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    margin-bottom: 20px;
}

.system-task-holder-body .checkbox-wrapper .select-chk-block .control {
    overflow: visible;
}

.system-task-holder-body .checkbox-wrapper .select-chk-block {
    margin-right: 30px;
    padding-right: 0;
    margin-bottom: 20px;
}

.system-task-holder-body .input-block.date {
    border-bottom: 1px solid #ECEFF1;
}

.system-task-holder-body .radio-wrapper.no-line {
    border-bottom: 0;
}

.button-footer-block {
    float: left;
}

.button-footer-block button {
    float: left;
    margin-left: 10px;
}

.system-task-right-footer .group-row {
    width: auto;
}

.task-tg .task-input-container .task-input-block .form-type-input .form-control:disabled,
.task-tg .task-input-container .task-input-block .form-type-input .form-control[readonly] {
    background-color: #fff;
    opacity: 1;
}

.dynamic-creation .persitant-top {
    padding: 0;
}

.task-tg .dynamic-creation .ind-task-input {
    padding: 8px 40px 4px 15px;
    margin-top: 0;
}

.dynamic-creation .create-button-block {
    right: 15px;
    top: 18px;
}

.dynamic-creation .new-task-input input {
    padding: 0 15px;
}

.dynamic-creation .new-task-input.text-input {
    height: calc(100% - 116px);
}

.dynamic-creation .new-task-input.text-input textarea {
    padding: 10px 15px 15px;
    padding-right: 65px;
}

.group-container {
    float: left;
    display: flex;
    width: 100%;
}

.group-container .input-log-time {
    padding-left: 0;
    height: 50px;
}

.group-container .eq-wid {
    float: left;
    width: 30%;
    margin-right: 20px;
}

.group-row.major-area {
    width: 85%;
}

.group-container .input-log-time.date:after {
    right: 0;
}

.task-tg .group-container .select-box:after {
    right: 0;
}

.task-tg .group-container .select-box select {
    border-bottom: 0;
    padding-right: 20px;
}

.task-tg .group-container .select-box select {
    border-bottom: 0;
}

.task-tg .group-container .multi-select-block .selectize-input {
    border-bottom: 0;
}

.dynamic-creation .persitant-footer {
    border-top: 0;
    position: relative;
}

.persitant-footer-header {
    float: left;
    width: 100%;
    position: absolute;
    right: 0;
    top: -45px;
}

.persitant-footer-header .attach-lister {
    float: right;
}

.persitant-footer-header .attach-at:before {
    background-position: -83px -383px;
    width: 21px;
    height: 18px;
}

.persitant-footer-header .form-at:before {
    background-position: -108px -383px;
    width: 21px;
    height: 21px;
}

.persitant-footer-header .attach-lister li {
    margin-right: 30px;
    position: relative;
}

.group-container .multi-select-block .selectize-input>input {
    min-width: 100px !important;
}

.wf-task-ico,
.task-board-ico,
.task-systask-ico,
.task-pool-ico,
.notf-task-ico {
    position: absolute;
    left: 2px;
    top: calc(50% - 6px);
}

.notf-task-ico:before {
    background-position: -397px -116px;
    width: 10px;
    height: 12px;
}

.wf-task-ico:before {
    background-position: -335px -471px;
    width: 11px;
    height: 11px;
}

.task-pool-ico:before {
    background-position: -368px -471px;
    width: 13px;
    height: 12px;
}

.task-systask-ico:before {
    background-position: -421px -472px;
    width: 12px;
    height: 11px;
}

.task-board-ico:before {
    background-position: -352px -471px;
    width: 12px;
    height: 12px;
}

.task-tg .dynamic-creation .persitant-footer .ind-task-input {
    margin-top: 0;
    padding-left: 0;
    padding-top: 0;
}

.task-tg .dynamic-creation .persitant-footer .input-log-time.date {
    padding-left: 0;
    height: 40px;
    width: 33.33%;
}

.task-tg .dynamic-creation .persitant-footer .input-log-time.date .rdt {
    float: left;
    width: 100%;
    height: 100%;
}

.task-tg .dynamic-creation .persitant-footer .input-log-time.date .rdt input {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    padding: 0;
    border-radius: 10px;
}

.task-tg .dynamic-creation .persitant-footer .input-log-time.date .rdt input.val-error {
    border-radius: 0;
}

.task-tg .dynamic-creation .persitant-footer .task-inp-container {
    border-bottom: 0;
    width: 33.33%;
}

.task-tg .dynamic-creation .persitant-footer .select-drop {
    top: unset;
    bottom: 100%;
}

.task-tg .dynamic-creation .persitant-footer .ind-task-input .select-drop {
    overflow-x: hidden;
}

.task-tg .dynamic-creation .persitant-footer .selectize-custom .sl-tag {
    max-width: 135px;
}

.attach-toggler {
    float: left;
    width: 200px;
    background: #fff;
    border: 1px solid #EAEAEA;
    position: absolute;
    right: -12px;
    bottom: 35px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    padding: 10px 0;
}

.attach-toggler li {
    float: left;
    width: 100%;
    margin-right: 0;
}

.attach-toggler li nav {
    float: left;
    width: 100%;
    padding: 10px;
    color: var(--default-grey) !important;
    font-size: 16px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    cursor: pointer;
    padding-left: 50px;
    position: relative;
}

.toggle-icon:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
}

.toggle-file-ico:before {
    background-position: -189px -406px;
    width: 17px;
    height: 14px;
    left: 20px;
    top: calc(50% - 7px);
    transform: rotate(180deg);
}

.toggle-checklist-ico:before {
    background-position: -382px -448px;
    width: 18px;
    height: 18px;
    left: 20px;
    top: calc(50% - 9px);
}

.toggle-form-ico:before {
    background-position: -357px -449px;
    width: 18px;
    height: 18px;
    left: 20px;
    top: calc(50% - 9px);
}

.toggle-form-ico:before {
    background-position: -357px -449px;
    width: 18px;
    height: 18px;
    left: 20px;
    top: calc(50% - 9px);
}

.toggle-resourc-ico:before {
    background-position: -330px -448px;
    width: 19px;
    height: 19px;
    left: 20px;
    top: calc(50% - 9.5px);
}

.toggle-product-ico:before {
    background-position: -429px -449px;
    width: 18px;
    height: 18px;
    left: 20px;
    top: calc(50% - 9px);
}

.toggle-project-ico:before {
    background-position: -407px -448px;
    width: 14px;
    height: 20px;
    left: 20px;
    top: calc(50% - 11px);
}

.toggle-file-ico:hover:hover:before {
    background-position: -189px -381px;
}

.toggle-checklist-ico:hover:before {
    background-position: -382px -492px;
}

.toggle-form-ico:hover:before {
    background-position: -357px -493px;
}

.toggle-resourc-ico:hover:before {
    background-position: -330px -492px;
}

.toggle-product-ico:hover:before {
    background-position: -429px -493px;
}

.toggle-project-ico:hover:before {
    background-position: -407px -492px;
}

.attach-toggler li:hover nav {
    color: var(--default-color) !important;
}

.attach-toggler li:hover {
    background: #fafafa;
}

.attach-toggler:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    bottom: -10px;
    right: 11px;
    z-index: 10;
    transform: rotateX(180deg);
}

.attach-toggler:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 12px 12px 12px;
    border-color: transparent transparent #eaeaea transparent;
    position: absolute;
    bottom: -12px;
    right: 9px;
    z-index: 9;
    transform: rotateX(180deg);
}

.attach-toggler li nav input {
    position: absolute;
    left: 0;
    float: left;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.dynamic-creation .attachment-task-group {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.small-height.modal-body-heighted {
    height: 200px;
}

.small-height .tag-wrapper-bl {
    padding-left: 0;
}

.small-height .select-drop {
    float: left;
    width: 100%;
    height: auto;
    max-height: 310px;
    background: #fff;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    overflow-y: auto;
    overflow-x: hidden;
}

.lbl-text-sys {
    float: left;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 16px;
    padding: 0 20px;
    margin-bottom: 10px;
}

.lbl-text-sys span {
    font-size: 12px;
}

.system-task-wrapper .task-inp-container .new-task-input {
    border-bottom: 0;
}

.pad-20-top {
    border-bottom: 0;
    padding-top: 20px;
}

.attach-button-container .options-button {
    position: relative;
    bottom: 0;
    right: 0;
    margin-bottom: 10px;
}

.attach-button-container {
    position: absolute;
    right: 20px;
    top: 110px;
}

.attach-button-container .attach-toggler {
    right: -6px;
    bottom: unset;
    top: 42px;
}

.attach-button-container .attach-toggler:before {
    transform: rotateX(0deg);
    bottom: unset;
    top: -10px;
}

.attach-button-container .attach-toggler:after {
    transform: rotateX(0deg);
    bottom: unset;
    top: -12px;
}

.dynamic-creation .group-container .input-log-time.date:after {
    right: unset;
    left: 12px;
}

.task-tg .dynamic-creation .persitant-footer .input-log-time.date {
    padding-right: 0;
    padding-left: 40px;
    border: 1px solid #ECEFF1;
    border-radius: 10px;
    margin-right: 15px;
}

.label-flex-container.eq-wid {
    display: flex;
    align-items: center;
    border: 1px solid #ECEFF1;
    padding-left: 15px;
    border-radius: 10px;
    width: 35%;
    height: 40px;
    max-width: 206px;
    margin-right: 0;
}

.group-container .label-flex-container .eq-wid {
    width: 135px;
    margin-right: 15px;
}

.select-label {
    float: left;
    font-size: 14px;
    color: var(--default-grey);
    margin-right: 5px;
}

.group-container .label-flex-container .select-box select {
    color: var(--default-text);
}

.group-container.align-equal {
    width: 100%;
    padding-right: 15px;
}

.task-tg .dynamic-creation .persitant-footer .group-container.align-equal .input-log-time.date {
    width: 38%;
    max-width: 230px;
}

.right-sys-full .system-task-holder-body {
    height: 100%;
}

.right-sys-full .tag-wrapper-bl {
    padding-left: 0;
}

.right-sys-full .attachment-task-group {
    padding: 0 20px;
}

.same-line-option .task-inp-container {
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 10px 0 20px;
    width: 50%;
}

.same-line-option .lbl-text-sys {
    margin-bottom: 0;
    padding: 0;
    flex-shrink: 0;
    color: var(--default-grey);
}

.system-task-holder-body .same-line-option .radio-wrapper .radio-block {
    margin-bottom: 0;
    margin-right: 14px;
}

.system-task-holder-body .same-line-option .radio-wrapper.no-line {
    margin: 0;
    padding-right: 0;
}

.same-line-option {
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
}

.task-tg .system-task-holder-body .new-task-input.text-input textarea {
    padding: 10px 20px 20px;
}

.task-tg .system-task-holder-body .new-task-input.text-input {
    height: 240px;
}

.item-same-line .eq-width {
    display: flex;
    align-items: center;
}

.task-input-container.item-same-line {
    border-bottom: 1px solid #ECEFF1;
    padding: 0 20px;
}

.task-tg .task-input-container.item-same-line .task-input-block .form-type-input .form-control {
    border-bottom: 0;
}

.task-tg .task-input-container.width-same-line .task-input-block .form-type-input {
    width: auto;
}

.item-same-line .select-label-text {
    flex-shrink: 0;
    font-size: 14px;
    color: var(--default-grey);
}

.date-wrapper.date-same-line {
    padding-top: 0;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ECEFF1;
}

.date-wrapper.date-same-line h5 {
    margin: 0;
    color: var(--default-grey);
    width: auto;
    padding-right: 0;
}

.task-tg .system-task-holder-body .date-wrapper.date-same-line .new-task-input {
    width: 50%;
}

.task-tg .system-task-holder-body .date-wrapper.date-same-line .new-task-input {
    border: 0;
}

.system-task-holder-body .checkbox-wrapper.checkbox-same-line {
    padding-top: 13px;
}

.system-task-holder-body .checkbox-wrapper.checkbox-same-line h5 {
    font-size: 14px;
    color: var(--default-grey);
}

.date-wrapper.item-same-line {
    display: flex;
    align-items: center;
    padding-top: 0;
    border-bottom: 1px solid #ECEFF1;
}

.date-wrapper.item-same-line h5 {
    margin: 0;
    width: auto;
    padding-right: 0;
}

.date-wrapper.item-same-line .new-task-input {
    border-bottom: 0;
    width: 50%;
}

.task-input-container.item-same-line .rdtOpen .rdtPicker {
    right: 0;
}

.system-task-holder-body .new-task-input.persistant-span input {
    -webkit-appearance: none;
    -moz-appearance: textfield;
    padding-left: 10px;
    padding-right: 75px;
}

.system-task-holder-body .new-task-input.persistant-span input[type=number]::-webkit-inner-spin-button,
.system-task-holder-body .new-task-input.persistant-span input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.new-task-input.persistant-span {
    display: flex;
    align-items: center;
    position: relative;
    height: 36px;
}

.day-text {
    position: absolute;
    right: 46px;
    top: 10px;
    color: #bdbdbd;
    font-size: 14px;
    line-height: 16px;
}

.mang-lbl-block-mod-in .section-info h5 {
    margin-bottom: 0;
}

.mang-lbl-block-mod-in .section-info {
    height: 18px;
    margin-bottom: 0;
}

.mang-lbl-block-mod-in .section-info-main {
    display: flex;
    align-items: center;
}

.mang-lbl-block-mod-in .content-click {
    border: 1px solid transparent;
    position: relative;
}

.mang-lbl-block-mod-in .content-click.selected {
    border: 1px solid var(--default-color);
}

.mang-lbl-block-mod-in .content-click.selected:before {
    border-radius: 50%;
    right: -8px;
    top: -8px;
}

.task-tg .input-auto-complete .ind-task-input {
    min-height: 50px;
    padding: 12px 40px 0 15px;
}

.task-tg .input-auto-complete .ind-task-input {
    margin-top: 0;
    border-top: 1px solid #ECEFF1;
}

.select-box-group .dropdown-toggle {
    float: left;
    width: 100%;
    height: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    color: var(--default-text);
    font-size: 14px;
    line-height: normal;
    padding-right: 20px;
    position: relative;
}

.select-box-group {
    float: left;
    width: 100%;
    height: 100%;
}

.select-box-group .dropdown-toggle:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 15px;
    top: calc(50% - 4px);
    border: 0;
    margin: 0;
}

.select-box-group .dropdown-item {
    padding: 0;
    font-size: 14px;
    color: var(--default-grey);
    padding: 0 20px;
    cursor: pointer;
}

.select-box-group .dropdown-item:hover {
    background: #fafafa;
    color: var(--default-color);
}

.select-box-group .dropdown-menu {
    border-color: #eaeaea;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
}

.select-box-group .dropdown-item.active {
    background: #fafafa;
    color: var(--default-color);
}

.task-duedate .rw-widget-input,
.rw-filter-input {
    box-shadow: none;
}

.task-duedate .rw-widget-container {
    border: 0;
    border-radius: 10px;
}

.task-duedate .rw-input,
.rw-dropdown-list-autofill,
.rw-filter-input {
    color: var(--default-text);
    font-size: 14px;
}

.task-duedate .rw-select-bordered {
    border: 0;
}

.task-duedate .rw-i-calendar:before {
    color: var(--default-grey);
}

.task-duedate .rw-i-clock-o:before {
    color: var(--default-grey);
}

.task-duedate .rw-select-bordered:hover,
.rw-select-bordered:active {
    background: #fff;
}

.task-duedate .rw-btn-select {
    opacity: 1;
}

.task-duedate .rw-btn-select:hover .rw-i-calendar:before {
    color: var(--default-color);
}

.task-duedate .rw-btn-select:hover .rw-i-clock-o:before {
    color: var(--default-color);
}

.task-duedate .rw-widget-container.rw-state-focus,
.task-duedate .rw-state-focus>.rw-widget-container,
.task-duedate .rw-widget-container.rw-state-focus:hover,
.task-duedate .rw-state-focus>.rw-widget-container:hover {
    border: 0;
    box-shadow: none;
}

.task-duedate .rw-select-bordered:active {
    box-shadow: none;
}

.task-tg .dynamic-creation .persitant-footer .input-log-time.date.task-duedate {
    padding-left: 0;
}

.task-tg .dynamic-creation .persitant-footer .input-log-time.date.task-duedate:after {
    content: none;
}

.task-duedate .rw-head-cell {
    font-size: 14px;
    vertical-align: middle;
    color: #FF9A19;
    border-bottom: 0;
    padding: 10px;
}

.task-duedate .rw-cell {
    font-size: 14px;
    vertical-align: middle;
    padding: 0;
    color: var(--default-text);
}

.task-duedate .rw-cell.rw-state-selected,
.rw-cell.rw-state-selected:hover {
    background-color: var(--default-color);
    border-color: var(--default-color);
}

.task-duedate .rw-cell-off-range {
    color: #bdbdbd;
}

.task-duedate .rw-calendar-footer {
    border-top: 0;
    min-height: 32px;
    padding: 4px;
    font-size: 14px;
}

.task-duedate .rw-calendar-header {
    border-bottom: 1px solid #efefef;
    padding: 4px;
    min-height: 32px;
}

.task-duedate .rw-dropup .rw-popup {
    border-radius: 5px;
    border: 1px solid #efefef;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
}

.task-duedate .rw-popup-container {
    padding: 0;
}

.task-duedate .rw-dropup>.rw-popup-transition {
    padding: 5px;
}

.task-duedate .rw-cell {
    padding: 0px 0;
    height: 32px;
}

.task-duedate .rw-btn-primary:hover {
    border-radius: 5px;
    background-color: #eaeaea;
}

.task-duedate .rw-cell:hover {
    background-color: #eaeaea;
    border-color: #eaeaea;
    color: var(--default-text);
}

.task-duedate .rw-calendar-body {
    padding: 4px;
}

.task-duedate .rw-widget {
    padding-left: 10px;
}

.task-duedate .rw-input {
    padding: 0px;
}

.user-count-text {
    color: var(--default-grey);
    font-size: 14px;
}

.react-datepicker-popper {
    z-index: 9 !important;
}

.task-tg .dynamic-creation .persitant-footer .group-container.align-equal .date-container-block.single-block .input-log-time.date {
    width: calc(100% - 15px);
}

.task-tg .dynamic-creation .persitant-footer .group-container.align-equal .date-container-block.single-block .input-log-time.date.val-error {
    border: 1px solid #ff9393 !important;
}

.input-block.expandable-textarea {
    float: left;
    width: 100%;
    height: auto;
    min-height: 165px;
}

.input-block.expandable-textarea textarea {
    padding: 10px 15px 15px;
    float: left;
    width: 100%;
    min-height: 165px;
    padding-right: 65px;
    border: 1px solid transparent;
    background: #fff;
    resize: none;
    line-height: 19px;
    font-size: 14px;
    overflow: hidden;
}

.quill {
    float: left;
    width: 100%;
    min-height: 165px;
}

.ql-editor {
    float: left;
    width: 100%;
    height: 100%;
    font-family: 'Source Sans Pro';
    color: var(--default-text);
    padding-right: 65px;
    min-height: 165px;
}

.ql-editor p {
    float: left;
    width: 100%;
    line-height: 19px;
    font-size: 16px;
}

.ql-container.ql-bubble {
    float: left;
    width: 100%;
    height: 100%;
    min-height: 165px;
}

.ql-editor strong {
    font-weight: 600;
}

.ql-editor em {
    font-style: italic;
}

.ql-container.ql-bubble:not(.ql-disabled) a {
    white-space: normal;
    word-break: break-word;
    color: var(--default-color);
}

.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
    margin-bottom: 12px;
}

.ql-editor ul li:last-child {
    margin-bottom: 0;
}

.ql-editor ol,
.ql-editor ul {
    float: left;
    width: 100%;
    padding-top: 1.5em !important;
}

.ql-editor ul li,
.ql-editor ol li {
    position: relative;
    font-size: 14px;
}

.ql-editor ol:first-child,
.ql-editor ul:first-child {
    padding-top: 0;
}

task-detail-panel-content-area-left p strong {
    font-weight: 600;
}

.task-detail-panel-content-area-left strong {
    font-weight: 600;
}

.task-detail-panel-content-area-left em {
    font-style: italic;
}

.task-detail-panel-content-area-left ul,
.task-detail-panel-content-area-left ol {
    float: left;
    width: 100%;
    padding-left: 1.5em;
    padding-top: 1.5em;
    list-style: unset;
}

.task-detail-panel-content-area-left ul li,
.task-detail-panel-content-area-left ol li {
    float: left;
    width: 100%;
    margin-bottom: 12px;
    position: relative;
}

.task-detail-panel-content-area-left ol {
    list-style: decimal;
}

.task-detail-panel-content-area-left ul:first-child,
.task-detail-panel-content-area-left ol:first-child {
    padding-top: 0;
}

.toggle-resource-ico:before {
    background-position: -330px -448px;
    width: 19px;
    height: 19px;
    left: 20px;
    top: calc(50% - 9.5px);
}

.toggle-resource-ico:hover:before {
    background-position: -330px -492px;
}

.section-info.video h5:before {
    content: "";
    background: var(--sprite-two) no-repeat -480px -386px;
    width: 19px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 3px;
}

.section-info.secured-video h5:before {
    content: "";
    background: var(--sprite-two) no-repeat -456px -386px;
    width: 19px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 3px;
}

.section-info.document h5:before {
    content: "";
    background: var(--sprite-two) no-repeat -432px -386px;
    width: 19px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 3px;
}

.section-info.image h5:before {
    content: "";
    background: var(--sprite-two) no-repeat -502px -386px;
    width: 19px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 3px;
}

.section-info.audio h5:before {
    content: "";
    background: var(--sprite-two) no-repeat -524px -386px;
    width: 20px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 3px;
}

.modal-body.padding-zero {
    padding: 0;
    overflow: hidden;
    height: calc(100vh - 250px);
}

.resource-filter-modal-header {
    float: left;
    width: 100%;
    padding: 15px 20px;
    display: flex;
    align-items: center;
}

.resource-filter-modal-header .lbl-panel-search-block {
    margin: 0;
}

.resource-filter-modal-header .select-box {
    border: 1px solid #e4e5e9;
    width: 40%;
    margin-left: 15px;
}

.resource-filter-modal-header .select-box select {
    height: 45px;
    padding-left: 15px;
    padding-right: 35px;
    border-bottom: 0;
}

.resource-filter-modal-body {
    float: left;
    width: 100%;
    height: calc(100% - 75px);
    padding: 0 20px;
    overflow-y: auto;
}

.resource-filter-modal-body .content-main-in {
    padding-top: 7px;
}

.read .ind-task-list-center .task-text {
    font-weight: 400;
    color: #a9a9a9;
}

.read:hover .ind-task-list-center .task-text {
    color: var(--default-color);
}

.overdue-task-alert {
    float: left;
    width: auto;
    height: 40px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid #e4e5e9;
    color: var(--default-grey);
    padding: 0 10px;
    border-radius: 5px;
    background: var(--white);
    margin-right: 10px;
    position: relative;
    display: flex;
    align-items: center;
}

.overdue-task-alert:before {
    content: "";
    background: var(--sprite-two) no-repeat -84px -363px;
    width: 14px;
    height: 14px;
    display: inline-block;
    margin-right: 8px;
}

.overdue-task-alert:after {
    content: "";
    width: 10px;
    height: 10px;
    background: #f44336;
    border-radius: 50%;
    position: absolute;
    right: -3px;
    top: -3px;
}

.filter-left-block .select-box-holder {
    width: 105px;
    margin: 0 10px 0 0;
}

.filter-left-block .c-select-in {
    width: 100%;
}

.filter-left-block .select-box-holder .c-select-in select {
    padding-left: 15px;
    font-size: 13px;
}

.task-submit-block .btn-section-left button {
    box-shadow: none;
}

.side-menu-right .menu-section .control .inp-chk:checked~.control-indicator,
.side-menu-right .menu-section .control .inp-chk.active+.control-indicator {
    background: var(--white);
    border-color: var(--white);
}

.side-menu-right .menu-section .control-checkbox .control-indicator:after {
    background: none;
    left: calc(50% - 2.5px);
    top: calc(50% - 5.5px);
    width: 5px;
    height: 9px;
    border: solid var(--sidemenu-checkbox);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/*------ Task End ------*/

/*------ Task Details ------*/

.task-wrapper.task-detail-stand {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    padding: 20px;
}

.task-left {
    float: left;
    width: calc(100% - 465px);
    height: 100%;
}

.task-right {
    float: left;
    width: 450px;
    height: 100%;
    margin-left: 15px;
}

.task-wrapper.task-detail-stand .task-detail-wrapper {
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
}

.task-wrapper.task-detail-stand .task-detail-wrapper {
    height: 100%;
    max-height: 100%;
}

.task-detail-panel {
    float: left;
    width: 100%;
    border: 1px solid rgba(64, 83, 100, 0.15);
    background: #fff;
    margin-bottom: 20px;
    position: relative;
}

.task-detail-panel:last-child {
    margin-bottom: 0;
}

.task-detail-panel-header {
    float: left;
    width: 100%;
    height: 50px;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    padding: 0 20px;
    position: relative;
}

.task-detail-panel-header-left {
    float: left;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.task-prior {
    float: left;
}

.task-prior p {
    font-size: 12px;
    text-transform: uppercase;
}

.task-prior.t-medium p {
    color: #D4AE2D;
}

.t-high:before {
    background: #EE6B46;
}

.task-prior.t-high p {
    color: #EE6B46;
}

.t-medium:before {
    background: #D4AE2D;
}

.t-low:before {
    background: #D5B610;
}

.task-prior.t-low p {
    color: #D5B610;
}

.t-urgent:before {
    background: #E14745;
}

.task-prior.t-urgent p {
    color: #E14745;
}

.task-date {
    float: left;
    margin-left: 15px;
    text-transform: uppercase;
}

.task-date p {
    float: left;
    font-size: 12px;
    color: #777777;
}

.task-detail-panel-header-right {
    float: left;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.task-status-ifo {
    float: left;
    width: 100%;
}

.task-status-ifo.done p {
    float: left;
    font-size: 12px;
    color: #36B449;
}

.task-status-ifo.done p {
    color: #36B449;
}

.task-other-opt {
    float: left;
    margin-left: 20px;
    position: relative;
}

.option-button {
    background: transparent;
    padding: 0;
    border: 0;
    cursor: pointer;
}

.option-button:before {
    background-position: -67px -123px;
    width: 4px;
    height: 20px;
}

.panel-option {
    float: left;
    width: 200px;
    background: #fff;
    padding: 10px 0;
    border: 1px solid #EAEAEA;
    border-radius: 4px;
    position: absolute;
    right: -20px;
    top: 25px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
    z-index: 10;
}

.panel-option.active {
    display: block;
}

.task-other-opt .panel-option {
    top: 20px;
    right: -20px;
}

.panel-option li {
    float: left;
    width: 100%;
}

.panel-option-click {
    float: left;
    width: 100%;
    position: relative;
}

.panel-option:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    top: -10px;
    right: 11px;
    z-index: 10;
}

.panel-option:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 12px 12px 12px;
    border-color: transparent transparent #eaeaea transparent;
    position: absolute;
    top: -12px;
    right: 9px;
    z-index: 9;
}

.panel-option li:hover {
    background: #fafafa;
}

.panel-option li a:hover,
.panel-option li nav:hover {
    color: var(--default-color) !important;
    text-decoration: none;
    cursor: pointer;
}

.panel-option li a,
.panel-option li nav {
    float: left;
    width: 100%;
    padding: 10px;
    color: var(--default-grey) !important;
    font-size: 14px;
    line-height: normal;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    cursor: pointer;
}

.panel-option li .panel-option-click {
    padding-left: 50px;
    cursor: pointer;
}

.panel-option-click:before {
    position: absolute;
    left: 20px;
}

.re-open-ico:before {
    background-position: -199px -208px;
    width: 22px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    top: calc(50% - 10px);
}

.archieve-ico:before {
    background-position: -152px -208px;
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    top: calc(50% - 9px);
}

.share-ico:before {
    background-position: -109px -354px;
    width: 17px;
    height: 17px;
    display: inline-block;
    margin-right: 7px;
    top: calc(50% - 10px);
}

.sub-task-ico:before {
    background-position: -177px -209px;
    width: 18px;
    height: 16px;
    display: inline-block;
    margin-right: 7px;
    top: calc(50% - 7px);
}

.delete-task-ico:before {
    background-position: -195px -353px;
    width: 16px;
    height: 19px;
    display: inline-block;
    margin-right: 7px;
    top: calc(50% - 10px);
}

.edit-task-ico:before {
    background-position: -50px -353px;
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    top: calc(50% - 10px);
}

.edit-milestone-ico:before {
    background-position: -459px -88px;
    width: 16px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 9px);
}

.add-task-ico:before {
    background-position: -479px -88px;
    width: 16px;
    height: 19px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 9.5px);
}

.delete-task-ico:hover:before {
    background-position: -180px -491px;
}

.share-ico:hover:before {
    background-position: -94px -492px;
}

.edit-task-ico:hover:before {
    background-position: -35px -491px;
}

.re-open-ico:hover:before {
    background-position: -253px -492px;
}

.archieve-ico:hover:before {
    background-position: -206px -492px;
}

.sub-task-ico:hover:before {
    background-position: -231px -493px;
}

.edit-milestone-ico:hover:before {
    background-position: -459px -64px;
}

.add-task-ico:hover:before {
    background-position: -479px -64px;
}

.task-detail-panel-project {
    float: left;
    width: 100%;
    height: 35px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    font-size: 14px;
    padding: 0 20px;
}

.project-ico {
    position: relative;
    line-height: 14px;
    padding-left: 20px;
}

.task-detail-panel-project p {
    color: var(--default-text);
    line-height: normal;
    font-size: 14px;
}

.project-ico:before {
    background-position: -340px -126px;
    width: 11px;
    height: 14px;
    position: absolute;
    left: 0;
    top: calc(50% - 7px);
}

.faded {
    color: #B1BECD;
    font-size: 12px;
    text-transform: uppercase;
}

.task-detail-panel-content {
    float: left;
    width: 100%;
    padding: 20px;
    position: relative;
}

.done-mark {
    display: none;
}

.task-all-done .done-mark {
    display: block;
}

.done-mark:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 30px 0 0;
    border-color: #60AD6C transparent transparent transparent;
    position: absolute;
    left: 0;
    top: 0;
}

.cleared:after {
    content: "";
    background: var(--sprite-two) no-repeat -353px -118px;
    width: 12px;
    height: 9px;
    display: inline-block;
    position: absolute;
    left: 4px;
    top: 5px;
}

.task-detail-user-info {
    float: left;
    width: 100%;
    display: flex;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    margin-bottom: 10px;
    position: relative;
}

.task-detail-user-info-left {
    float: left;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
}

.task-detail-user-info-left .task-detail-user {
    width: auto;
    min-width: 235px;
}

.task-detail-user-thumb {
    float: left;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-right: 12px;
    position: relative;
}

.task-detail-user-thumb {
    margin-right: 7px;
}

.task-detail-user-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.task-detail-user-det {
    float: left;
    height: 100%;
    width: calc(100% - 62px);
}

.task-detail-user-det h5 {
    float: left;
    width: 100%;
    margin-bottom: 2px;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
}

.assign-line {
    float: left;
    display: flex;
}

.to-ico:before {
    background-position: -429px -252px;
    width: 12px;
    height: 12px;
    margin-right: 3px;
}

.tau {
    float: left;
    min-width: 20px;
    border-radius: 15px;
    display: flex;
    font-size: 12px;
    margin-bottom: 5px;
    align-items: center;
    position: relative;
}

.assigned-tau-block .tau {
    margin-left: -6px;
}

.assigned-tau-block .tau:first-child {
    margin-left: 0;
}

.tau-img {
    float: left;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 0;
    border: 1px solid #fff;
}

.tau-img img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.tau-name {
    font-size: 0;
    color: var(--default-text);
    font-weight: 600;
    background: #e0e0e0;
    line-height: 20px;
    padding: 0;
    border-radius: 21px;
}

.task-detail-user-info-right {
    float: left;
    text-align: right;
    flex-shrink: 0;
}

.due-date-block {
    float: left;
    width: 100%;
    transition: .4s ease-out;
}

.due-date-block p {
    float: left;
    width: 100%;
    line-height: normal;
    font-size: 12px;
    color: var(--default-grey);
    margin-bottom: 2px;
}

.f-b {
    font-weight: 600;
}

.task-detail-panel-content-area {
    float: left;
    width: 100%;
    height: 100%;
}

.task-detail-panel-content-area-left {
    float: left;
    width: calc(100% - 130px);
    padding-left: 60px;
}

.task-detail-panel-content-area h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    color: var(--default-text);
    font-weight: 600;
    line-height: 22px;
    margin-bottom: 10px;
}

.task-detail-panel-content-area p {
    float: left;
    width: 100%;
    font-size: 15px;
    color: var(--default-grey);
    line-height: 22px;
    word-break: break-word;
}

.task-detail-panel-content-area p>img {
    max-width: 100%;
    margin: 15px 0;
}

.due-date-block {
    float: left;
    width: 100%;
    transition: .4s ease-out;
}

.task-detail-panel-content-area .due-date-block {
    float: left;
    width: 130px;
}

.task-detail-panel-content-area .due-date-block p {
    text-align: right;
    color: #9AA7B5;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.task-submit-block {
    float: left;
    width: 100%;
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    padding-left: 60px;
}

.general-btn-green {
    margin: 0;
    background: #60ad6c;
    border: 1px solid #60ad6c;
    color: #fff;
    height: 36px;
    min-width: 90px;
    padding: 0 13px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin-left: 0;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    transition: .3s ease-out;
}

.verify-button.disable {
    background: #bdbdbd;
    border-color: #bdbdbd;
    pointer-events: none;
}

.verify-button:before {
    background-position: -458px -212px;
    width: 14px;
    height: 11px;
    margin-right: 5px;
}

.task-detail-panel-attachment {
    float: left;
    width: 100%;
    background: #fafafa;
    padding: 20px;
    border-top: 1px solid #dfe0e4;
}

.attachment-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    margin-bottom: 15px;
}

.attachment-header-left {
    float: left;
}

.attachment-header-left h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
}

.attachment-header-right {
    float: left;
    text-align: right;
}

.download-button {
    float: left;
    color: var(--default-color);
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    cursor: pointer;
}

.download-button:hover {
    color: var(--default-color);
}

.attachment-list-wrapper {
    float: left;
    width: 100%;
}

.attachment-list {
    float: left;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    max-width: 70%;
}

.attachment-list li {
    float: left;
    width: 50px;
    height: 50px;
    margin-right: 10px;
    color: #6B7577;
    position: relative;
    margin-bottom: 10px;
}

.attach-click {
    position: relative;
    float: left;
    line-height: 20px;
    transition: .4s ease-out;
    font-size: 12px;
    color: #6B7577;
    width: 100%;
    height: 100%;
}

.attach-attach-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.attach-attach-thumb {
    float: left;
    width: 100%;
    height: 100%;
}

.attach-attach-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.task-detail-panel-attachment .attach-attach-thumb img {
    object-fit: cover;
    border: 1px solid rgba(64, 83, 100, .15);
}

.individual-assigners {
    float: left;
    width: 100%;
    border-top: 1px solid rgba(64, 83, 100, 0.15);
}

.ind-div-assign {
    float: left;
    width: 100%;
    height: 60px;
    padding: 0 20px;
    border-top: 1px solid rgba(64, 83, 100, 0.15);
    position: relative;
}

.ind-div-assign:first-child {
    border-top: 0;
}

.info-contianer {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ind-div-assign .task-detail-user-det {
    height: auto;
}

.task-detail-user-info-right.jus-btn-block {
    display: flex;
    align-items: center;
    min-width: 285px;
    justify-content: space-between;
}

.remark-btn {
    float: left;
    width: 20px;
    height: 20px;
    border: 0;
    background: #B1BECD;
    line-height: 0;
    padding: 0;
    border-radius: 50%;
    color: #FFFFFF;
    font-size: 12px;
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 25px;
    cursor: pointer;
    transition: .3s ease-out;
}

.remark-btn:hover {
    background: var(--default-color);
}

.due-date-block {
    float: left;
    width: 100%;
    transition: .4s ease-out;
}

.jus-btn-block .due-date-block {
    width: auto;
    display: flex;
    flex-direction: column;
}

.jus-btn-block .due-date-block p {
    width: auto;
}

.task-detail-user-thumb {
    margin-right: 7px;
}

.ind-div-assign .task-detail-user-thumb {
    width: 37px;
    height: 37px;
}

.ind-div-assign:before {
    content: "";
    width: 2px;
    height: 100%;
    background: transparent;
    position: absolute;
    left: 0;
    top: 0;
}

.ind-div-assign.t-p-st:before {
    background: #F5A623;
}

.ind-div-assign.t-o-st:before {
    background: #E14745;
}

.ind-div-assign.t-d-st:before {
    background: #60AD6C;
}

.ind-div-assign.t-n-st:before {
    background: #B1BECD;
}

.task-wrapper.task-detail-stand .task-detail-wrapper:focus {
    outline: none;
}

.task-detail-user-det p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
}

.chat-tab-block {
    float: left;
    width: 100%;
    height: calc(100% - 45px);
}

.task-right .chat-tab-block {
    height: 100%;
}

.chat-tab-block .nav-tabs .nav-item {
    float: left;
    height: 50px;
    margin-left: 4px;
}

.chat-tab-block .nav-tabs .nav-item:first-child {
    margin-left: 0;
}

.chat-tab-block .nav-tabs .nav-link {
    padding: 0;
    height: 100%;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    border-radius: 0;
    border: 1px solid #e1e1e1;
    background: #f6f7f9;
    cursor: pointer;
}

.chat-tab-block .nav-tabs .nav-link.active {
    background: #fff;
    border: 1px solid #e4e4e4;
    border-bottom: 1px solid #fff;
}

.chat-tab-block .nav-tabs .nav-item:first-child .nav-link {
    border-left: 1px solid #e1e1e1;
}

.chat-tab-block .nav-tabs .nav-item:first-child .nav-link.active {
    border-left: 1px solid #e4e4e4;
}

.disscussion:before {
    background-position: -74px -92px;
    width: 24px;
    height: 19px;
    position: relative;
    top: 2px;
}

.nav-link.active .disscussion:before {
    background-position: -53px -209px;
}

.chat-tab-block .tab-text {
    margin-left: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-text);
    line-height: 17px;
}

.chat-tab-block .nav-tabs .tab-text {
    display: none;
}

.chat-tab-block .nav-link.active .tab-text {
    display: block;
}

.user:before {
    background-position: -105px -91px;
    width: 16px;
    height: 17px;
    top: 2px;
    position: relative;
}

.nav-link.active .user:before {
    background-position: -84px -208px;
}

.file:before {
    background-position: -128px -92px;
    width: 17px;
    height: 14px;
    top: 2px;
    position: relative;
}

.nav-link.active .file:before {
    background-position: -107px -209px;
}

.act:before {
    background-position: -151px -90px;
    width: 17px;
    height: 17px;
    top: 2px;
    position: relative;
}

.nav-link.active .act:before {
    background-position: -130px -207px;
}

.chat-tab-block .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    background: #fff;
    border: 1px solid #e4e4e4;
    border-top: 0;
}

.chat-tab-block .tab-content .tab-pane {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.discuss-inner {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
    overflow-y: auto;
}

.fixed-chat-bottom {
    float: left;
    width: 100%;
    height: 50px;
    border-top: 1px solid rgba(64, 83, 100, 0.15);
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 5px 15px;
    background: #fff;
}

.ind-disscussion {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    background: #fafafa;
    padding: 10px;
    border: 1px solid #EEEEEE;
    border-radius: 5px;
    background-color: #FAFAFA;
    box-shadow: 0 0.5px 2px 0 rgba(0, 0, 0, 0.1);
}

.ind-disscussion-user {
    float: left;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin-right: 10px;
    border: 1px solid #e4e4e4;
}

.ind-disscussion-user img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.ind-disscussion-content {
    float: left;
    width: calc(100% - 42px);
}

.ind-disscussion-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
}

.ind-disscussion-header h5 {
    float: left;
    margin-bottom: 2px;
    font-size: 13px;
    font-weight: 600;
    line-height: 15px;
}

.purple {
    color: var(--purple-col) !important;
}

.ind-disscussion-content p {
    color: #000000;
    font-size: 14px;
    line-height: 16px;
    word-break: break-word;
}

.ind-disscussion-content .disscussion-time {
    float: left;
    font-size: 12px !important;
    color: rgba(0, 0, 0, 0.5);
    font-size: 11px;
    line-height: 13px;
    text-align: right;
}

.sub-disscussion .ind-disscussion-content {
    width: 100%;
}

.user-tab-head {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    font-size: 14px;
    font-weight: 500;
}

.user-tab-head h5 {
    font-weight: 600;
    text-transform: uppercase;
    color: var(--default-text);
}

.tab-scroll {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
    overflow-y: auto;
}

.assigned-block {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.ind-assigned-user-thumb {
    float: left;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 10px;
    border: 1px solid #e4e4e4;
}

.ind-assigned-user-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.ind-assigned-desc {
    float: left;
    width: calc(100% - 40px);
}

.ind-assigned-desc h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-text);
    margin-bottom: 0;
    line-height: 16px;
}

.ind-assigned-desc p {
    float: left;
    width: 100%;
    font-size: 12px;
    color: var(--default-grey);
    line-height: 15px;
}

.file-div {
    display: flex;
    justify-content: space-between;
    margin-top: 7px;
    color: #777;
}

.ind-file-list {
    float: left;
    width: 100%;
    margin: 0;
    margin-bottom: 18px;
    font-size: 14px;
}

.discuss-inner .ind-file-list.file-div {
    justify-content: space-between;
}

.attach-click.attachlink {
    position: relative;
    float: left;
    line-height: 20px;
    transition: .4s ease-out;
    font-size: 12px;
    color: var(--default-text);
    width: 80%;
    height: 100%;
    font-weight: 600;
}

.ind-file-list .attach-click {
    margin-right: 5px;
}

.attach-click.attachlink .attach-click-thumb {
    float: left;
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.attach-click-thumb img {
    float: left;
    width: 100% !important;
    height: 100%;
    object-fit: cover;
}

.attach-click.attachlink:hover {
    text-decoration: none;
}

.task-activities-new li {
    margin-bottom: 16px;
    text-align: center;
    width: 100%;
    float: left;
}

.task-activities-items p {
    font-size: 11px;
    color: #fff;
    color: #FFFFFF;
    font-size: 11px;
    line-height: 13px;
    text-align: center;
    float: left;
    width: 100%;
}

.task-activities-items p span {
    padding: 2px 4px;
    border-radius: 2px;
    position: relative;
    height: 20px;
}

.task-activities-items p span.newtask-assign {
    background-color: var(--default-color);
}

.task-activities-items h5 {
    float: left;
    width: 100%;
    min-height: 40px;
    line-height: 40px;
    margin-top: 17px;
    color: #A3A6AA;
    font-size: 14px;
    position: relative;
}

.newtask-assign h5 {
    border: 1px solid rgba(63, 169, 245, .5);
}

.task-activities-items h5:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 5px 5px 5px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    top: -5px;
    left: calc(50% - 5px);
    z-index: 10;
}

.task-activities-items h5:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 6px 6px 6px;
    border-color: transparent transparent #e4e4e4 transparent;
    position: absolute;
    top: -6px;
    z-index: 9;
    left: calc(50% - 6px);
}

.task-activities-items.newtask-assign h5:after {
    border-color: transparent transparent rgba(63, 169, 245, 0.5) transparent;
}

.task-activities-items p span:after {
    content: "";
    width: 1px;
    height: 10px;
    color: #00000059;
    position: absolute;
    bottom: -10px;
    left: calc(50% - .5px);
    border-right: 1px solid #e4e4e4;
}

.task-activities-items.newtask-assign p span:after {
    opacity: 0.25;
    border-color: var(--default-color);
}

.task-activities-items h5 .font-bold {
    color: var(--default-text);
}

.newtask-assign-highlight {
    color: var(--default-color);
    font-weight: 500;
}

.task-activities-items p span.task-markdone {
    background-color: #44C072;
}

.task-activities-items.task-markdone p span:before {
    opacity: 0.25;
    border-color: #44C072;
}

.task-activities-items.task-markdone p span:after {
    opacity: 0.25;
    border-color: #44C072;
}

.task-markdone h5 {
    border: 1px solid rgba(68, 192, 114, 0.25);
}

.attach-click-toggle {
    float: left;
    width: 115px;
    background: #fafafa;
    height: 25px;
    border: 1px solid #AAB7C4;
    border-radius: 4px;
    position: absolute;
    z-index: 9;
    left: -19px;
    top: -20px;
    display: none;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.20);
}

.attachment-list li:hover .attach-click-toggle {
    display: block;
}

.attach-click-toggle button {
    width: 43%;
    height: 100%;
    color: #777;
    background: transparent;
    border: 0;
    font-size: 12px;
    cursor: pointer;
    transition: .4s ease-out;
    padding: 0 2px;
}

.attach-click-toggle button:hover {
    color: var(--default-color);
}

.attach-click-toggle:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 5px 0 5px;
    border-color: #ffffff transparent transparent transparent;
    position: absolute;
    bottom: -5px;
    left: 36px;
    z-index: 10;
}

.attach-click-toggle:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 6px 0 6px;
    border-color: #aab8c5 transparent transparent transparent;
    position: absolute;
    bottom: -7px;
    left: 35px;
    z-index: 9;
}

.backto-list {
    float: left;
    padding: 0 14px;
    height: 30px;
    background: #fff;
    font-size: 10px;
    font-weight: 500;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    position: relative;
    line-height: normal;
    color: var(--default-text);
}

.bg-back .backto-list {
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 15px;
}

.top-sticky-bar .task-nav-left .backto-list {
    border: 0;
    padding: 0;
}

.backto-list:before {
    content: "";
    background: var(--sprite-one) no-repeat -482px -187px;
    width: 10px;
    height: 9px;
    position: relative;
    left: 0;
    margin-right: 8px;
}

.bg-back .backto-list:before {
    background: var(--sprite-two) no-repeat -61px -141px;
    width: 14px;
    height: 13px;
    margin-right: 10px;
}

.subtask-detail-panel {
    float: left;
    width: 100%;
    padding-left: 26px;
    position: relative;
    margin-bottom: 20px;
}

.subtask-detail-panel:before {
    content: "";
    width: 4px;
    height: 100%;
    background: #B6C5C9;
    opacity: .3;
    position: absolute;
    left: 8px;
    top: 0;
}

.sub-icon {
    float: left;
    width: 20px;
    height: 20px;
    background: #B6C5C9;
    border-radius: 50%;
    position: absolute;
    left: 0px;
    top: calc(50% - 10px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sub-icon:before {
    background-position: -22px -266px;
    width: 8px;
    height: 7px;
}

.to-sub-ico:before {
    background-position: -320px -118px;
    width: 13px;
    height: 9px;
    margin-right: 3px;
}

.single-user .tau-name {
    padding: 0 7px 0 25px;
    font-size: 12px;
}

.general-btn.working-time-btn {
    background: #6a6a6a;
    border: 1px solid #6a6a6a;
    min-width: 45px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.working-time-btn:before {
    background-position: -6px -141px;
    width: 12px;
    height: 13px;
}

.general-btn-green:hover {
    background: #50bc61;
    border-color: #50bc61;
}

.modal-time-log {
    width: 100%;
    height: 350px;
    float: left;
}

.time-log-top {
    float: left;
    width: 100%;
    height: 300px;
    overflow-y: auto;
}

.addmore-top {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid #f1f1f1;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.addmore-top h5 {
    float: left;
    width: 100%;
    color: #2E3243;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
}

.addmore-top h5 a {
    color: var(--default-color);
}

.time-log-sub-list-select {
    width: 100%;
    height: 50px;
    float: left;
}

.time-log-items {
    float: left;
    display: flex;
    align-items: center;
}

.time-log-items.one-third {
    width: calc((100% / 3) - 14px);
    height: 100%;
    border-bottom: 1px solid #f3f1f1;
    margin-left: 20px;
    position: relative;
}

.time-log-items.one-third:first-child {
    margin-left: 0;
}

.input-log-time {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.input-log-time.date {
    padding: 0 40px 0 20px;
}

.log-time-input {
    float: left;
    width: 100%;
    border: 1px solid transparent;
    height: 100%;
    font-size: 16px;
    position: relative;
    z-index: 8;
    background: transparent;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
}

.time-log-items.one-third .input-log-time.date {
    padding-left: 0;
}

.input-log-time.date:after {
    content: "";
    background: var(--sprite-two) no-repeat -308px -61px;
    width: 17px;
    height: 18px;
    position: absolute;
    right: 10px;
    top: calc(50% - 10.5px);
}

.input-log-time.addition {
    width: calc(100% - 78px);
}

.log-addition {
    float: left;
    position: absolute;
    right: 20px;
    top: calc(50% - 12.5px);
}

.log-addition-link {
    float: left;
    height: 25px;
    width: 25px;
    border-radius: 5px;
    background-color: #FFFFFF;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    font-size: 24px;
    padding: 0;
    line-height: 0;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--default-color);
    margin-left: 5px;
}

.row-list {
    width: 100%;
    height: 50px;
    float: left;
    position: relative;
}

.modal-body.time-log {
    padding: 0;
}

.bsy-modal .modal-footer .general-btn {
    margin-left: 10px;
    border-radius: 5px;
    box-shadow: none;
}

.time-log-sub-list-remark {
    padding: 20px;
    width: 100%;
    float: left;
    border-bottom: 1px solid #f3f1f1;
}

.log-time-remark {
    width: 100%;
    height: 65px;
    border: 1px transparent;
    background: #fff;
    resize: none;
    font-size: 14px;
    line-height: 16px;
    padding: 5px 0 0 0;
}

.time-log-items {
    float: left;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0 20px;
}

.file-upload {
    float: left;
    position: relative;
}

.file-upload input {
    float: left;
    width: 100%;
    height: 100%;
    line-height: 0;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9;
    opacity: 0;
    cursor: pointer;
}

.file-upload label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    padding-left: 28px;
}

.time-log-bottom .file-upload label:before {
    content: "";
    background: var(--sprite-two) no-repeat -23px -140px;
    width: 14px;
    height: 16px;
    position: absolute;
    left: 0;
    top: calc(50% - 8px);
}

.time-log-sub-list {
    float: left;
    width: 100%;
    margin: 20px 0;
}

.working-time-section {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.working-time-section p {
    font-size: 12px;
    margin-right: 15px;
    font-weight: 400;
    color: var(--default-grey);
    margin-bottom: 0;
}

.working-time-section p span {
    font-weight: 500;
    color: #848488;
}

.s-modal .modal-body {
    min-height: 200px;
    max-height: 500px;
    overflow-y: auto;
}

.s-modal .modal-body {
    height: 370px;
    padding: 0;
}

.task-detail-user-info-right .general-btn-green {
    margin-right: 15px;
}

.task-detail-panel-parent {
    float: left;
    width: 100%;
    height: 40px;
    background: rgb(3 169 244 / .05);
    border-top: 1px solid rgba(64, 83, 100, 0.15);
    ;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task-detail-panel-parent .angle-right-ico a {
    float: left;
    width: 100%;
    color: var(--default-color);
    font-size: 14px;
    font-weight: 600;
}

.task-detail-panel-parent .angle-right-ico a:after {
    content: "";
    background: var(--sprite-two) no-repeat -670px -119px;
    width: 12px;
    height: 8px;
    display: inline-block;
    margin-left: 5px;
}

.task-all-done .done-mark {
    display: block;
}

.done-mark:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 30px 0 0;
    border-color: #60AD6C transparent transparent transparent;
    position: absolute;
    left: 0;
    top: 0;
}

.cleared:after {
    content: "";
    background: var(--sprite-two) no-repeat -353px -118px;
    width: 12px;
    height: 9px;
    display: inline-block;
    position: absolute;
    left: 4px;
    top: 5px;
}

.preview-slash {
    margin: 0 5px;
    color: var(--default-text);
}

.time-log-count {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: space-between;
    padding: 0px 20px;
    line-height: 50px;
    border-bottom: 1px solid #f1f1f1;
}

.time-log-count p {
    height: 16px;
    color: var(--default-text);
    font-size: 14px;
}

.forms-header {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 14px;
    display: flex;
    align-items: center;
    transition: .4s ease-out;
}

.forms-header:before {
    background-position: -395px -277px;
    width: 18px;
    height: 18px;
    margin-right: 8px;
}

.attachment-list.attach_forms li {
    height: auto;
    width: calc((100% / 3) - 10px);
}

.forms-header:hover {
    color: var(--default-color);
}

.att-preview .modal-body {
    float: left;
    width: 100%;
    height: 350px;
    display: flex;
    justify-content: center;
}

.att-preview .modal-body img {
    float: left;
    width: auto !important;
    height: auto;
    object-fit: contain;
    max-width: 460px;
    max-height: 460px;
}

.bsy-modal .modal-footer {
    background: #fff;
    padding: 0 20px;
    height: 71px;
    border-top: 1px solid #E3E3E3;
}

.general-btn-a {
    margin: 0;
    background: var(--default-color);
    border: 1px solid var(--default-color) !important;
    color: #fff;
    height: 40px;
    min-width: 90px;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin-left: 0;
    -webkit-appearance: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s ease-out;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

.general-btn-a:hover {
    color: #fff;
    background: var(--hover-color);
    border-color: var(--hover-color) !important;
}

.ind-attach-list .progress {
    float: left;
    width: 100px;
    height: 12px;
    margin: 0;
    background: #fff;
    box-shadow: none;
    border: 1px solid #ccc;
}

.ind-attach-list .progress .progress-bar {
    background-color: var(--default-color);
}

.attachment-task-group .cl-fl {
    position: relative;
    right: 0;
    top: 0;
}

.slider-button-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* position: fixed;
    left: 0;
    top: calc(50% - 20px); */
    transition: .4s ease-out;
    opacity: 1;
    pointer-events: auto;
    z-index: 8;
}

.slider-button {
    float: left;
    background: 0 0;
    border: 0;
    padding: 0;
    line-height: 0;
    height: 40px;
    width: 40px;
    background-color: #fff;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
    position: fixed;
    top: calc(50% - 20px);
    z-index: 5;
    cursor: pointer;
}

.slide-left {
    border-radius: 0 5px 5px 0;
    left: 0;
}

.slide-right {
    border-radius: 5px 0 0 5px;
    right: 0;
}

.slide-left:before {
    background-position: -468px -357px;
    width: 8px;
    height: 12px;
}

.slide-right:before {
    background-position: -483px -357px;
    width: 8px;
    height: 12px;
}

.slide-left:hover:before {
    background-position: -495px -357px;
}

.slide-right:hover:before {
    background-position: -510px -357px;
}

.slide-right:focus,
.slide-left:focus {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26) !important;
}

.fixed-bottom-left {
    float: left;
    position: relative;
}

.chat-menu {
    float: left;
    width: 18px;
    height: 16px;
    background-color: transparent;
    border: 0;
    border-top: 2px solid #6B7577;
    position: relative;
    cursor: pointer;
    transition: .4s ease-out;
}

.chat-menu:before {
    content: "";
    width: 18px;
    height: 2px;
    background: #6B7577;
    position: absolute;
    left: 0;
    top: 5px;
    transition: .4s ease-out;
}

.chat-menu:after {
    content: "";
    width: 18px;
    height: 2px;
    background: #6B7577;
    position: absolute;
    left: 0;
    bottom: 0;
    transition: .4s ease-out;
}

.chat-menu:hover,
.chat-menu.active {
    border-top: 2px solid var(--default-color);
}

.chat-menu:hover:before,
.chat-menu:hover:after,
.chat-menu.active:before,
.chat-menu.active:after {
    background: var(--default-color);
}

.chat-menu:hover:before,
.chat-menu:hover:after,
.chat-menu.active:before,
.chat-menu.active:after {
    background: var(--default-color);
}

.fixed-bottom-center {
    float: left;
    width: 100%;
    margin: 0 10px;
}

.input-block {
    float: left;
    width: 100%;
    position: relative;
}

.input-box {
    float: left;
    width: 100%;
    height: 45px;
    border: 1px solid #e4e5e9;
    border-radius: 3px;
    padding: 0 20px;
    font-size: 14px;
}

.fixed-bottom-center .input-box {
    height: 35px;
    border: 1px solid transparent;
    padding: 0;
    color: var(--default-text);
}

.chat-submit {
    float: left;
    width: 19px;
    height: 16px;
    background-color: transparent;
    border: 0;
    background: var(--sprite-two) no-repeat -293px -117px;
    padding: 0;
    cursor: pointer;
    transition: .4s ease-out;
}

.chat-menu-options {
    position: absolute;
    float: left;
    width: 285px;
    background: #fff;
    bottom: 30px;
    left: -15px;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
    display: block;
    z-index: 9;
}

.ind-menu {
    float: left;
    width: 100%;
    height: 50px;
    color: var(--default-grey);
    border-bottom: 1px solid #e4e4e4;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 20px;
    position: relative;
}

.chat-menu-options .ind-menu:hover {
    color: var(--default-color);
}

.attach-menu:before {
    content: "";
    width: 17px;
    height: 14px;
    background: var(--sprite-one) no-repeat -128px -92px;
    margin-right: 10px;
}

.attach-menu:hover:before {
    background: var(--sprite-two) no-repeat -221px -141px;
}

.invite-menu:before {
    content: "";
    width: 16px;
    height: 17px;
    background: var(--sprite-one) no-repeat -105px -91px;
    margin-right: 10px;
}

.invite-menu:hover:before {
    background: var(--sprite-two) no-repeat -197px -140px;
}

.chat-attach-file-type {
    cursor: pointer;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 9;
}

.attach-click.attachlink .attach-click-thumb .format {
    font-size: 7px;
    width: 24px;
}

.attach-click.attachlink:hover .file-click-title {
    color: var(--default-color);
}

.attach-click.attachlink .attach-click-thumb .format:before {
    border-width: 8px 0 0 8px;
}

.attach-click.attachlink .attach-click-thumb .format:after {
    border-width: 8px 0 0 8px;
}

.attach-click.attachlink .attach-click-thumb {
    width: 28px;
    height: 28px;
}

.attach-click.attachlink {
    display: flex;
}

.file-size {
    color: #bdbdbd;
}

.file-click-title {
    flex-shrink: 0;
    max-width: 80%;
    display: inline-block;
    word-break: break-word;
}

.discuss-inner .ind-file-list.file-div {
    margin-bottom: 10px;
    font-size: 12px;
    color: #9DA8B4;
}

.task-detail-panel-header .panel-option {
    display: block;
}

.mdone-attach-bg {
    float: left;
    width: 100%;
}

.mdone-attach-bg {
    height: 37px;
    background: #ecf0f1;
    clear: both;
    padding: 9px 0px 4px;
    border: 1px solid #e4e5e9;
    border-top: 0;
    border-radius: 0 0 5px 5px;
    margin-bottom: 20px;
    padding: 9px 20px;
}

.mdone-attach-bg:last-child {
    margin-bottom: 0px;
}

.mdone-attach-bg ul {
    padding: 0px;
    margin: 0px;
}

.mdone-attach-bg li {
    list-style-type: none;
    position: relative;
    padding-left: 23px;
    float: left;
    width: 100%;
}

.attach-upload:before {
    content: "";
    position: absolute;
    display: inline-block;
    top: -1px;
    left: 0;
    background-position: -290px -182px;
    width: 16px;
    height: 16px;
}

.attach-upload div {
    font-weight: 400;
    color: #6b7577;
    font-size: 14px;
}

.attach-upload input[type="file"] {
    position: absolute;
    left: 0;
    opacity: 0;
    top: 0;
    bottom: 0;
    width: 100%;
}

.add-lb-nem .ind-attach-list {
    width: 100%;
    max-width: none;
}

.task-right .file-bl-wrap {
    padding-left: 0;
    width: 100%;
}

.task-right .attach-chat-block {
    width: 100%;
}

.chat-tab-block .tab-content .split {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.chat-tab-block .tab-content .split .discuss-inner {
    height: 100%;
}

.ind-disscussion-sub .disscussion-time {
    position: absolute;
    right: 0;
    top: 1px;
}

.ind-disscussion-sub .disscussion-time {
    position: absolute;
    right: 0;
    top: 1px;
}

.attach-click-thumb {
    float: left;
    width: 20px;
    margin-right: 8px;
    height: 20px;
}

.ind-disscussion-content .file-div {
    color: rgba(0, 0, 0, 0.5);
    font-size: 12px;
    line-height: 14px;
}

.ind-disscussion-content a {
    color: var(--default-color) !important;
    font-size: 14px;
    line-height: 19px;
}

.ind-disscussion-content .attach-click {
    font-size: 14px;
    margin-right: 5px;
    text-overflow: ellipsis;
    overflow: hidden;
    width: auto;
    max-width: 80%;
    white-space: nowrap;
}

.ind-disscussion-content .attach-click {
    display: flex;
    align-items: center;
}

.file-div .format {
    font-size: 8px;
    padding-bottom: 3px;
}

.file-div .format:before {
    border-width: 8px 0 0 8px;
}

.file-div .format:after {
    border-width: 8px 0 0 8px;
}

.file-div .attach-click-thumb {
    width: 24px;
    height: 28px;
}

.workflow-addon .discuss-inner {
    max-height: 350px;
}

.form-error-text {
    font-size: 14px;
    color: #f14c4c;
    margin-bottom: 10px;
}

.addon-footer {
    padding: 0;
}

.task-mob-back {
    display: none;
}

.time-log-bottom .attachment-task-group {
    float: left;
    width: 100%;
    padding: 0 15px;
}

.ind-disscussion-next-day {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    margin-bottom: 10px;
}

.day-div {
    background: #d4eaf5;
    height: 25px;
    font-size: 12px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    text-transform: uppercase;
    border-radius: 5px;
    color: #777;
}

.workflow-addon-left .tab-content .chat-panel .ind-task-wf {
    height: 100%;
    margin-bottom: 0;
}

.workflow-addon-left .tab-content .chat-panel .discuss-inner {
    max-height: none;
}

.custom-image {
    float: left;
    width: 55px;
    height: 100%;
    max-width: 100%;
}

.done-mark-sm:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 30px 0 0;
    border-color: #60AD6C transparent transparent transparent;
    position: absolute;
    left: 0;
    top: 0;
}

.done-mark-sm:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 30px 0 0;
    border-color: #60AD6C transparent transparent transparent;
    position: absolute;
    left: 0;
    top: 0;
}

.task-details-inside {
    float: left;
    width: 100%;
    border: 1px solid #E3E5E8;
    margin-bottom: 20px;
}

.task-details-wrapper {
    float: left;
    width: 100%;
    max-height: 100%;
    overflow-y: auto;
}

.task-details-header-block {
    float: left;
    width: 100%;
    height: 60px;
    background: #F2F5F5;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #E3E5E8;
}

.task-details-header-block:first-child {
    border-top: 0;
}

.task-detail-header-left {
    float: left;
}

.task-details-info-wrap {
    float: left;
    height: 60px;
    display: flex;
    align-items: center;
}

.due-mount {
    float: left;
    width: 70px;
    height: 50px;
    background: #E6AB00;
    padding: 5px 10px 15px 10px;
    margin-right: 23px;
    position: relative;
}

.due-mount:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 35px 10px 35px;
    border-color: transparent transparent #f2f5f5 transparent;
    position: absolute;
    left: 0;
    bottom: 0;
}

.due-mount p {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
    text-align: center;
}

.task-details-info-wrap li {
    float: left;
    margin-right: 50px;
}

.task-details-info-wrap li p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 2px;
    text-transform: uppercase;
}

.task-details-info-wrap li h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 202px;
    overflow: hidden;
}

.task-detail-header-right {
    float: left;
    display: flex;
    align-items: center;
}

.task-detail-header-right .control-checkbox {
    color: #60AD6C;
    font-size: 13px;
    font-weight: 500;
    line-height: 17px;
}

.task-detail-header-right .control-indicator {
    border-color: #60AD6C;
    border-radius: 3px;
}

.task-detail-header-right .control .inp-chk:checked~.control-indicator {
    background: #60AD6C;
    border-color: #60AD6C;
}

.task-details-body-block {
    float: left;
    width: 100%;
    background: #FFFFFF;
    padding: 20px;
}

.task-details-body-block:last-child {
    border-bottom: 0;
}

.task-details-body-header {
    float: left;
    width: 100%;
    margin-bottom: 35px;
}

.task-details-body-header-top {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.task-details-body-header-top-left {
    float: left;
}

.task-current-user-info {
    float: left;
    position: relative;
    display: flex;
    align-items: center;
}

.task-current-user-image {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
    position: relative;
}

.task-current-user-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.task-current-user-details {
    float: left;
    width: calc(100% - 50px);
}

.task-current-user-details h5 {
    float: left;
    width: 100%;
    color: #2E3243;
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    margin-bottom: 3px;
}

.task-current-user-details p {
    float: left;
    width: 100%;
    color: #AAB7C4;
    font-size: 12px;
    line-height: 14px;
}

.task-current-user-image:after {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid #FFFFFF;
    background-color: #b1becd;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 50%;
}

.task-current-user-image.user-online:after {
    background-color: #60AD6C;
}

.task-details-body-header-top-right {
    float: left;
    display: flex;
    align-items: center;
}

.task-details-body-header-top-right .option-button:before {
    background: var(--sprite-two) no-repeat -7px -113px;
    width: 4px;
    height: 18px;
    display: inline-block;
}

.calendar-info {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.task-details-body-header-bottom {
    float: left;
    width: 100%;
    padding-left: 28px;
}

.added-task-user-block {
    float: left;
    width: calc(100% - 25px);
}

.task-details-body-header-bottom .to-ico {
    margin-right: 8px;
    float: left;
}

.added-task-user-image {
    float: left;
    width: 21px;
    height: 21px;
    border-radius: 50%;
}

.added-task-user-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.ind-added-task-user {
    float: left;
    display: flex;
    align-items: center;
    background: #E0E0E0;
    border-radius: 14px;
    margin-right: 10px;
    margin-bottom: 5px;
    cursor: pointer;
}

.added-task-user-details {
    float: left;
    line-height: 21px;
    height: 21px;
    padding: 0 9px 0 6px;
}

.added-task-user-details h5 {
    float: left;
    width: 100%;
    color: rgba(0, 0, 0, 0.87);
    font-size: 11px;
    font-weight: 600;
    line-height: 21px;
}

.task-details-body-container {
    float: left;
    width: 100%;
}

.task-details-body-container h5 {
    color: #2E3243;
    font-size: 24px;
    font-weight: 600;
    line-height: 36px;
    margin-bottom: 17px;
}

.task-details-body-container p {
    float: left;
    width: 100%;
    color: #8F8F91;
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 23px;
}

.task-details-body-container p:last-child {
    margin-bottom: 0;
}

.task-extra-tab-block {
    float: left;
    width: 100%;
    height: 100%;
}

.task-extra-tab-block .nav-tabs .nav-item {
    float: left;
    height: 100%;
}

.task-extra-tab-block .nav-tabs .nav-link {
    margin-right: 5px;
    display: flex;
    align-items: center;
    height: 100%;
    border-radius: 0;
    background: #F2F5F5;
    border: 1px solid #E3E5E8;
    border-bottom: 1px solid #E3E5E8;
    border-bottom: 0;
    cursor: pointer;
}

.task-extra-tab-block .nav-tabs .nav-link .tab-text {
    color: var(--default-text);
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
    margin-left: 9px;
    display: none;
}

.task-extra-tab-block .nav-tabs .nav-link.active .tab-text {
    display: inline-block;
}

.task-extra-tab-block .nav-tabs .nav-item {
    float: left;
    height: 60px;
}

.task-extra-tab-block .nav-tabs .nav-link {
    padding: 0;
    height: 100%;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    border-radius: 0;
    border: 1px solid #E3E5E8;
    background: #f2f5f5;
}

.task-extra-tab-block .nav-tabs .nav-link.active {
    background: #f2f5f5;
    border: 1px solid #E3E5E8;
    border-bottom: 1px solid #f2f5f5;
}

.task-extra-tab-block .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    background: #f2f5f5;
    border: 1px solid #E3E5E8;
    border-top: 0;
}

.task-extra-tab-block .nav-tabs {
    border-color: #E3E5E8;
}

.task-extra-tab-block .tab-content>.tab-pane {
    float: left;
    width: 100%;
    height: 100%;
}

.chat-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.chat-content-wrapper {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
    overflow-y: auto;
}

.chat-bottom-nav {
    float: left;
    width: 100%;
    height: 50px;
}

.ind-chat-module {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.chat-user-block {
    float: left;
    width: 100%;
}

.chat-user {
    float: left;
    padding-left: 10px;
    margin-bottom: 5px;
    position: relative;
}

.chat-thumb {
    float: left;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin-right: 10px;
}

.chat-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.chat-user-info {
    float: left;
}

.chat-user-info h5 {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    margin-right: 8px;
}

.chat-user-info p {
    float: left;
    color: var(--default-grey);
    font-size: 11px;
    line-height: 22px;
}

.chat-user-message {
    float: left;
    width: 100%;
    border: 1px solid #E3E5E8;
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 20px 18px;
    position: relative;
    border-top-left-radius: 0;
}

.chat-user-message:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 0 9.5px;
    border-color: transparent transparent transparent #ffffff;
    position: absolute;
    z-index: 9;
    top: -5px;
    left: 0;
    border-top-left-radius: 2px;
}

.chat-user-message:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 0 13px;
    border-color: transparent transparent transparent #e3e5e8;
    position: absolute;
    z-index: 8;
    top: -6px;
    left: -1px;
    border-top-left-radius: 3px;
}

.chat-user-message h5 {
    float: left;
    width: 100%;
    color: #000000;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
}

.reciever .chat-user-message {
    background: var(--col-active);
    border-top-left-radius: 5px;
    border-bottom-right-radius: 0;
}

.reciever .chat-user-message:before {
    border-color: transparent transparent transparent var(--col-active);
    transform: rotate(180deg);
    top: unset;
    left: unset;
    bottom: -5px;
    right: 0;
}

.reciever .chat-user-message:after {
    border-color: transparent transparent transparent var(--col-active);
    left: 0;
    transform: rotate(180deg);
    top: unset;
    left: unset;
    bottom: -6px;
    right: 0px;
}

.reciever .chat-user-message h5 {
    color: var(--black);
}

.reciever .chat-user {
    float: right;
}

.reciever .chat-user {
    float: right;
    padding-left: 0;
    padding-right: 10px;
    margin-bottom: 0px;
    margin-top: 5px;
}

.chat-bottom-nav {
    float: left;
    width: 100%;
    background: #fff;
    border-top: 1px solid #E3E5E8;
    padding: 0 20px;
}

.chat-bottom-nav-block {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.chat-bottom-nav-left {
    float: left;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    margin-right: 15px;
}

.chat-bottom-nav-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.chat-attach-block {
    float: left;
    position: relative;
    width: 17px;
    height: 14px;
    margin-right: 10px;
    cursor: pointer;
}

.chat-attach-block:before {
    content: "";
    background: var(--sprite-two) no-repeat -269px -118px;
    width: 17px;
    height: 14px;
    display: inline-block;
}

.chat-attach-block input {
    float: left;
    width: 17px;
    height: 14px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
}

.chat-text-block {
    float: left;
    width: calc(100% - 27px);
}

.chat-bottom-nav-center {
    float: left;
    width: calc(100% - 80px);
    display: flex;
    align-items: center;
}

.chat-text-block input {
    float: left;
    width: 100%;
    border: 1px solid transparent;
    color: var(--default-text);
    font-size: 14px;
    line-height: 15px;
}

.chat-bottom-nav-right {
    float: left;
    margin-left: 15px;
}

.chat-text-block input::placeholder {
    color: #B9BFC4;
    font-size: 14px;
    line-height: 15px;
}

.user-list-block {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
    margin-bottom: 10px;
    overflow-y: auto;
}

.ind-task-added-user-list {
    float: left;
    width: 100%;
    height: auto;
    min-height: 80px;
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 20px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.ind-added-user-list-left {
    float: left;
}

.ind-added-user-list-left-thumb {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

.ind-added-user-list-left-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.ind-added-user-list-left-info {
    float: left;
    width: calc(100% - 50px);
}

.ind-added-user-list-left-info h5 {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 2px;
    font-weight: 600;
}

.ind-added-user-list-left-info p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 11px;
    line-height: 13px;
    margin-bottom: 4px;
}

.ind-added-user-list-left-info .progress {
    float: left;
    width: 100%;
    max-width: 50px;
    height: 5px;
    border-radius: 2.5px;
    box-shadow: none;
    background-color: #E5E9ED;
    margin-bottom: 0;
}

.ind-added-user-list-left-info .progress-bar {
    background-color: #60AD6C;
}

.ind-added-user-list-right {
    float: right;
}

.date-user-task h5 {
    color: #8B97A2;
    font-size: 11px;
    line-height: 13px;
    text-align: right;
    margin-bottom: 3px;
}

.date-user-task p {
    float: left;
    color: #000000;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.chat-ico-task {
    display: none;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    float: right;
    cursor: pointer;
}

.chat-ico-task:before {
    background-position: -311px -364px;
    width: 14px;
    height: 14px;
}

.ind-task-added-user-list:hover .date-user-task {
    display: none;
}

.ind-task-added-user-list:hover .chat-ico-task {
    display: block;
}

.task-status-meter p {
    float: left;
    color: var(--default-grey);
    font-size: 8px;
    line-height: 5px;
    margin-left: 5px;
}

.task-status-meter {
    float: left;
    display: flex;
    width: 100%;
}

.spliter-task-user {
    float: left;
    width: 100%;
}

.spliter-task-user .split-task-header {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 17px;
    font-weight: 600;
}

.ind-task-added-user-list:last-child {
    margin-bottom: 17px;
}

.ind-added-file-list-left-thumb .format {
    color: #FFFFFF;
    font-size: 11.2px;
    font-weight: 600;
    line-height: 13px;
    text-align: center;
}

.ind-added-file-list-left-thumb .format:before {
    border-width: 12px 0 0 12px;
}

.ind-added-file-list-left-thumb .format:after {
    border-width: 12px 0 0 12px;
}

.ind-added-file-list-left {
    float: left;
    display: flex;
    align-items: center;
}

.ind-added-file-list-left-thumb {
    float: left;
    width: 35px;
    height: 41px;
    margin-right: 12px;
}

.ind-added-file-list-left-info {
    float: left;
}

.ind-added-file-list-left-info h5 {
    float: left;
    color: #000000;
    font-size: 14px;
    line-height: 16px;
}

.ind-added-file-list-left-info p {
    color: #8B97A2;
    font-size: 11px;
    line-height: 13px;
}

.download-ico-file {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    cursor: pointer;
}

.download-ico-file:before {
    background-position: -291px -364px;
    width: 14px;
    height: 14px;
}

.task-alert {
    float: left;
    width: 100%;
    height: 35px;
    background: var(--default-grey);
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.task-alert h5 {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    display: flex;
    align-items: center;
    position: relative;
}

.status-icon-changer:before {
    content: "";
    height: 16px;
    width: 16px;
    border-radius: 3px;
    background-color: #FFFFFF;
    display: inline-block;
    margin-right: 10px;
}

.task-alert.task-done {
    background: #60AD6C;
}

.task-alert.task-done .status-icon-changer:after {
    content: "";
    display: block;
    width: 5px;
    height: 8px;
    border: solid #60ad6c;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    position: absolute;
    left: 6px;
    top: 3px;
}

.task-alert.task-overdue {
    background: #E14745;
}

.task-alert.task-overdue .status-icon-changer:after {
    content: "!";
    border: 0;
    color: #e14745;
    transform: none;
    top: 0;
    left: 6px;
    font-size: 12px;
}

.disscussion-tab-ico:before {
    background-position: -47px -405px;
    width: 24px;
    height: 19px;
}

.nav-link.active .disscussion-tab-ico:before {
    background-position: -47px -426px;
}

.user-tab-ico:before {
    background-position: -78px -406px;
    width: 16px;
    height: 17px;
}

.nav-link.active .user-tab-ico:before {
    background-position: -78px -427px;
}

.file-tab-ico:before {
    background-position: -101px -408px;
    width: 17px;
    height: 14px;
}

.nav-link.active .file-tab-ico:before {
    background-position: -101px -429px;
}

.activities-tab-ico {
    background-position: -8px -406px;
    width: 15px;
    height: 18px;
}

.activities-tab-ico:before {
    background-position: -8px -406px;
    width: 15px;
    height: 18px;
}

.nav-link.active .activities-tab-ico:before {
    background-position: -8px -427px;
}

.act-tab-ico:before {
    background-position: -124px -406px;
    width: 17px;
    height: 17px;
}

.nav-link.active .act-tab-ico:before {
    background-position: -124px -427px;
}

.activities-log-wrapper {
    float: left;
    width: 100%;
}

.ind-activities-log {
    float: left;
    width: 100%;
    position: relative;
}

.activities-log-left {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

.activities-log-left img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.activities-log-right {
    float: left;
    width: calc(100% - 50px);
}

.activities-log-right-top {
    float: left;
    width: 100%;
    height: 40px;
    padding: 6px 0;
    margin-bottom: 20px;
}

.activities-log-right-top p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 11px;
    line-height: 13px;
    margin-bottom: 2px;
}

.activities-log-right-top h5 {
    float: left;
    width: 100%;
    color: #8B97A2;
    font-size: 14px;
    line-height: 16px;
    border: 0;
}

.activities-log-right-top h5 .user-highlight {
    color: var(--default-text);
    font-weight: 500;
    margin-right: 5px;
}

.activities-log-right-box {
    float: left;
    width: 100%;
    min-height: 65px;
    height: auto;
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 15px 20px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}

.activities-log-right-box p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 11px;
    line-height: 13px;
    margin-bottom: 5px;
}

.activities-log-right-box h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    margin-bottom: 5px;
    border: 0;
    word-break: break-word;
}

.ind-activities-log:before {
    content: "";
    width: 2px;
    height: 100%;
    opacity: 0.4;
    background-color: #AEBECF;
    position: absolute;
    left: 18px;
    top: 40px;
}

.ind-activities-log:last-child:before {
    content: none;
}

.log-panel .ind-added-user-list-left {
    display: flex;
}

.log-panel .ind-added-user-list-left-info h5 {
    margin-bottom: 6px;
}

.log-panel .ind-added-user-list-left-info p {
    font-size: 12px;
}

.log-panel .ind-added-user-list-left-info .user-highlight {
    color: #000;
    font-weight: 500;
}

.split-task-header-container {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 17px;
}

.split-task-header-container .split-task-header {
    margin: 0;
}

.split-task-header-container a {
    color: var(--default-color);
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
    text-align: right;
}

.ind-added-task-user:hover {
    background: var(--default-color);
}

.ind-added-task-user:hover .added-task-user-details h5 {
    color: #fff;
}

.task-details-wrapper .task-detail-panel {
    border: 1px solid #E3E5E8;
}

.individual-assigners {
    border-top: 1px solid #E3E5E8;
}

.task-details-wrapper .task-detail-panel-content-area p {
    color: #848488;
}

.task-details-wrapper .task-detail-user-det p {
    color: #848488;
}

.task-detail-header-left .task-detail-user-info-left {
    width: auto;
    height: 100%;
    display: flex;
    align-items: center;
}

.task-details-wrapper .task-detail-user-thumb {
    width: 35px;
    height: 35px;
}

.task-details-wrapper .task-detail-user-det h5 {
    margin-bottom: 4px;
}

.task-details-wrapper .task-detail-user-info-left .task-detail-user-det p {
    color: #AAB7C4;
}

.task-details-wrapper .task-detail-header-left .task-detail-user-info-left .task-detail-user-det {
    height: auto;
}

.task-detail-header-right .to-verify .control-checkbox {
    color: var(--default-color);
}

.task-detail-header-right .to-verify .control-indicator {
    border-color: var(--default-color);
}

.task-detail-header-right .to-open .control-checkbox {
    color: #DC9D36;
}

.task-detail-header-right .to-open .control-indicator {
    color: #DC9D36;
}

.remark-tag {
    background: #A7B7C5;
    color: #fff;
    font-size: 10px;
    height: 15px;
    line-height: 15px;
    padding: 0 5px;
    float: left;
    border-radius: 3px;
    margin-right: 10px;
    position: relative;
    top: 2px;
}

.remark-text {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.remark-text:last-child {
    margin-bottom: 0;
}

.remark-text p {
    float: left;
    width: 100%;
    color: #6B7577;
    font-size: 14px;
    line-height: 22px;
}

.task-alert-right a,
.task-alert-right span {
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    display: flex;
    align-items: center;
}

.reopen-ico:before {
    background-position: -396px -364px;
    width: 12px;
    height: 11px;
    margin-right: 8px;
}

.task-completed {
    background: #60AD6C;
}

.task-verified {
    background: #00ABFC;
}

.task-not-completed {
    background: #E14745;
}

.task-reopened {
    background: #DC9D36;
}

.task-alert.task-markasdone h5:before,
.task-alert.task-not-completed h5:before,
.task-alert.task-verify h5:before {
    content: "";
    height: 16px;
    width: 16px;
    border-radius: 3px;
    background-color: #FFFFFF;
    margin-right: 10px;
    position: relative;
    top: -1px;
}

.task-alert.task-markasdone h5:after,
.task-alert.task-verify h5:after {
    content: "";
    display: inline-block;
    background: var(--sprite-two) no-repeat -413px -366px;
    width: 8px;
    height: 7px;
    position: absolute;
    left: 4px;
    top: 4px;
}

.task-alert.task-not-completed h5:after {
    content: "";
    display: inline-block;
    background: var(--sprite-two) no-repeat -425px -366px;
    width: 2px;
    height: 8px;
    position: absolute;
    left: 7px;
    top: 3px;
}

.task-remark-attchment .ind-added-file-list-left-info h5 {
    margin-bottom: 4px;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
}

.task-remark-attchment .ind-added-file-list-left-info p {
    color: #8B97A2;
    font-size: 11px;
    line-height: 13px;
}

.task-detail-header-right .to-verify .control .inp-chk:checked~.control-indicator {
    background: var(--default-color);
    border-color: var(--default-color);
}

.task-detail-header-right .to-open .control .inp-chk:checked~.control-indicator {
    background: #DC9D36;
    border-color: #DC9D36;
}

.sub-user-block .task-details-body-header {
    margin-bottom: 0;
}

.sub-user-block .task-current-user-image {
    width: 35px;
    height: 35px;
}

.sub-user-block .task-details-body-header-top-left h5 {
    color: #2E3243;
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    margin-bottom: 4px;
}

.sub-user-block .task-current-user-details p {
    color: #AAB7C4;
    font-size: 12px;
    line-height: 14px;
}

.task-split {
    float: left;
    width: 100%;
    position: relative;
    border-bottom: 1px solid #E3E5E8;
}

.task-split:last-child {
    border-bottom: 0;
}

.task-current-status:before {
    content: "";
    width: 2px;
    height: 100%;
    background: #A7B7C5;
    position: absolute;
    left: 0px;
    top: 0px;
}

.task-cleared:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 30px 0 0;
    border-color: #a3b8c7 transparent transparent transparent;
    position: absolute;
    left: 0;
    top: 0;
}

.task-cleared:before {
    content: "";
    background-position: -353px -118px;
    width: 12px;
    height: 9px;
    display: inline-block;
    position: absolute;
    left: 4px;
    top: 5px;
    z-index: 9;
}

.task-comp:before {
    background: #60ad6c;
}

.task-prog:before {
    background: #dc9d36;
}

.task-ovr:before {
    background: #e14745;
}

.task-comp .task-cleared:after {
    border-color: #60ad6c transparent transparent transparent;
}

.task-prog .task-cleared:after {
    border-color: #dc9d36 transparent transparent transparent;
}

.task-ovr .task-cleared:after {
    border-color: #e14745 transparent transparent transparent;
}

.reopened-ico:before {
    background-position: -413px -246px;
    width: 13px;
    height: 11px;
    margin-right: 10px;
    position: relative;
    top: -1px;
}

.white-modal .modal-header {
    height: 60px;
    background: #fff;
    border-bottom-color: #E2E8EF;
}

.white-modal .modal-title {
    color: #2B2A2A;
    font-size: 20px;
    line-height: 24px;
}

.white-modal .modal-content {
    border-radius: 0;
}

.white-modal .modal-footer {
    border-radius: 0;
    border-top-color: transparent;
    height: 80px;
}

.white-modal .modal-dialog {
    max-width: 640px;
}

.white-modal .modal-footer .general-btn.grey {
    border: 1px solid #E2E2E2;
    border-radius: 5px;
    background-color: #ECF0F1;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.white-modal .modal-footer .general-btn {
    padding: 0 44px;
}

.modal-tag-block .sl-tag {
    margin-right: 12px;
}

.task-inp-container.modal-tag-block {
    border-bottom: 0;
}

.white-modal .new-task-input.text-input textarea {
    height: 100%;
    width: 100%;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 18px 20px;
}

.white-modal .modal-body {
    height: 370px;
    overflow-y: auto;
}

.white-modal .new-task-input.text-input {
    height: 245px;
    border-bottom: 0;
    margin-bottom: 10px;
}

.white-modal .input-block input[type=file] {
    float: left;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.white-modal .att:before {
    position: relative;
    top: 1px;
}

.yellow-btn {
    background-color: #DC9D36;
    border-color: #DC9D36;
}

.green-btn {
    background-color: #00B35C;
    border-color: #00B35C;
}

.sub-header {
    float: left;
    width: 100%;
    margin-bottom: 18px;
}

.sub-header h5 {
    float: left;
    width: 100%;
    color: #6B7577;
    font-size: 18px;
    line-height: 27px;
}

.mg-top-20 {
    margin-top: 20px;
}

.white-modal .time-log-items.one-third {
    border-color: #E4E6E9;
}

.white-modal .time-log-count {
    border-color: #E4E6E9;
}

.profile-sm-modal .modal-body {
    background: #ffffff;
    padding: 0;
}

.profile-sm-modal .modal-dialog {
    max-width: 212px;
}

.profile-preview-block {
    float: left;
    width: 100%;
}

.profile-preview-header {
    float: left;
    width: 100%;
    height: 120px;
    background: linear-gradient(180deg, #B8C7CB 0%, #A2A2A2 100%);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    padding-top: 25px;
    text-align: center;
}

.profile-preview-body {
    float: left;
    width: 100%;
    height: 220px;
    position: relative;
    padding-top: 68px;
}

.user-profiles-image {
    float: left;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    position: absolute;
    left: calc(50% - 55px);
    top: -55px;
    border: 5px solid #ffffff;
}

.user-profiles-image img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.user-profile-det {
    float: left;
    width: 100%;
    margin-bottom: 23px;
}

.user-profile-det h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    text-align: center;
    margin-bottom: 3px;
}

.user-profile-det p {
    float: left;
    width: 100%;
    color: #BDBDBD;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
}

.user-profile-det .pnone-numb {
    color: var(--default-text);
    font-size: 12px;
    line-height: 18px;
    text-align: center;
    margin-top: 16px;
}

.profile-preview-header h5 {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 300;
    line-height: 17px;
    text-align: center;
}

.user-profile-button-block {
    float: left;
    width: 100%;
    padding: 0 15px;
}

.user-profile-button-block button {
    float: left;
    width: 100%;
}

.chat-prof:before {
    background-position: -191px -452px;
    width: 14px;
    height: 14px;
    margin-right: 7px;
    position: relative;
    top: 3px;
}

.pop-close {
    float: left;
    height: 20px;
    width: 20px;
    border: 1px solid #FFFFFF;
    background-color: var(--default-text);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: -8px;
    top: -8px;
    padding: 0;
    cursor: pointer;
}

.pop-close:before {
    content: "";
    background: var(--sprite-one) no-repeat -422px -188px;
    width: 8px;
    height: 8px;
}

.task-details-wrapper .task-detail-user-thumb {
    width: 35px;
    height: 35px;
}

.task-details-inside .task-detail-header-left {
    width: 50%;
}

.task-details-inside .task-detail-header-left .task-detail-user-info-left {
    width: 100%;
}

.remark-text:last-child {
    margin-bottom: 0;
}

.tab-content .split {
    float: left;
    width: 100%;
    height: 100%;
}

.ramarks-last-file-border {
    padding: 0px;
}

.ramarks-last-file-border:last-child {
    border-bottom: 1px solid #eee;
    border-radius: 0;
}

.reopen-highlight {
    color: #F5A623;
}

.markdone-highlight {
    color: #44C072;
}

.task-activities-items p span.task-reopen {
    background-color: #F5A623;
}

.task-reopen h5 {
    border: 1px solid #f5a6235e;
}

.task-activities-items.task-reopen h5:after {
    border-color: transparent transparent rgba(245, 166, 35, .5) transparent;
}

.task-activities-items.task-reopen p span:before {
    opacity: 0.25;
    border-color: #F5A623;
}

.attach-click-toggle.single-opt {
    width: auto;
    left: -3px;
}

.attach-click-toggle.single-opt:before {
    left: 20px;
}

.attach-click-toggle.single-opt:after {
    left: 19px;
}

.task-detail-panel .individual-assigners .task-detail-user-info-left {
    width: 50%;
}

.task-tg .new-task-input.text-input {
    border-bottom: 0;
}

.rdtTime,
.rdtMonths {
    border: 1px solid;
    background: #fff;
}

.disabled {
    opacity: .5;
    pointer-events: none;
}

.workflow-task .task-detail-header-right .control-checkbox {
    color: #AAB7C4;
}

.workflow-task .task-detail-header-right .control-indicator {
    border-color: #AAB7C4;
}

.due-in {
    background: #EE6B46;
}

.task-details-body-header .subheader {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    color: #2E3243;
    font-size: 24px;
    font-weight: 600;
    line-height: 36px;
}

.stage-tag {
    float: left;
    width: auto;
    height: 25px;
    border-radius: 2px;
    margin-right: 10px;
}

.task-details-body-header-top-left h5 {
    float: left;
}

.stage-tag-left {
    float: left;
    height: 25px;
    border: 1px solid var(--default-color);
    border-radius: 0;
    color: var(--default-color);
    font-size: 12px;
    font-weight: 500;
    line-height: 25px;
    padding: 0 5px;
    border-radius: 2px 0 0 2px;
}

.stage-tag-right {
    float: left;
    width: 30px;
    height: 25px;
    background: var(--default-color);
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
    line-height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 2px 2px 0;
}

.task-details-body-header-top-left h5 {
    float: left;
    color: #2E3243;
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
}

.workflow-task .task-details-body-header {
    margin-bottom: 20px;
    padding: 20px;
    border-bottom: 1px solid #E3E5E8;
}

.workflow-task-body-container {
    float: left;
    width: 100%;
    padding: 0 20px 20px;
}

.workflow-task .task-details-body-block {
    padding: 0;
    border: 1px solid #E3E5E8;
    margin-bottom: 20px;
}

.workflow-task-body-container h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 36px;
    position: relative;
}

.workflow-task-body-container p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 22px;
}

.readmore-link {
    color: var(--default-color);
    font-weight: 500;
}

.workflow-task .task-details-wrapper {
    border: 0;
}

.workflow-task .task-details-header-block {
    border: 1px solid #E3E5E8;
    border-bottom: 0;
}

.indvidual-point.verified-tick:before {
    background: var(--sprite-three) no-repeat -214px -217px;
    width: 22px;
    height: 22px;
}

.indvidual-point:before {
    background: var(--sprite-three) no-repeat -185px -216px;
    width: 22px;
    height: 22px;
    position: absolute;
    left: 0;
    top: 8px;
}

.sub-block .workflow-task-body-container {
    padding: 20px;
}

.sub-block .workflow-task-body-container h5 {
    padding-left: 30px;
    margin-bottom: 10px;
}

.nested-sub-block {
    float: left;
    width: 100%;
    padding-left: 30px;
    cursor: pointer;
}

.nested-form {
    float: left;
    background: var(--sprite-three) no-repeat -245px -203px;
    width: 31px;
    height: 40px;
    margin-right: 16px;
}

.nested-form-content {
    float: left;
    display: flex;
    flex-direction: column;
}

.sub-block .workflow-task-body-container .nested-form-content h5 {
    float: left;
    padding-left: 0;
    color: #2E3243;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    margin-bottom: 3px;
}

.sub-block .workflow-task-body-container .input-block h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    padding-left: 0;
    margin-bottom: 13px;
    text-transform: capitalize;
}

.nested-sub-block .input-block label {
    line-height: 15px;
    color: var(--default-grey);
}

.nested-sub-block .control-indicator {
    border-color: #AAB7C4;
    border-radius: 2px;
}

.nested-sub-block .control .inp-chk:checked~.control-indicator:after {
    border-radius: 2px;
}

.nested-sub-block .radio-block label:before {
    border-color: #AAB7C4;
}

.nested-sub-block .radio-block input:checked+label:after {
    top: 4px;
}

.nested-sub-block .textarea {
    border-color: #E4E6E9;
    height: 85px;
    border-radius: 2px;
    padding: 20px;
}

.nested-sub-block .textarea::placeholder {
    color: #AAB7C4;
}

.attach-block .att:before {
    content: "";
    background: var(--sprite-two) no-repeat -101px -408px;
    width: 17px;
    height: 14px;
    position: relative;
    margin-right: 10px;
    top: 2px;
}

.attach-block .att {
    padding-left: 0;
    color: var(--default-grey);
}

.attached-file.round-edge .file-tag {
    display: flex;
    align-items: center;
    padding-right: 30px;
    font-size: 13px;
    color: #6a7476;
    border-radius: 34px;
}

.nested-sub-block .input-block input[type="file"] {
    float: left;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.nested-sub-block .input-block .att {
    float: left;
    display: flex;
    align-items: center;
    line-height: 15px;
    margin-bottom: 0;
    position: relative;
}

.nav-link .file-stage-ico:before {
    background-position: -29px -407px;
    width: 14px;
    height: 16px;
}

.nav-link.active .file-stage-ico:before {
    background-position: -29px -428px;
}

.stage-accordion {
    float: left;
    width: 100%;
}

.stage-accordion .card {
    margin-bottom: 20px;
    border: 1px solid #E5EAF0;
    border-radius: 5px;
    background-color: #FFFFFF;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.05);
    overflow: unset;
}

.stage-accordion .card:first-of-type {
    border-bottom: 1px solid #E5EAF0;
    border-radius: 5px;
}

.stage-accordion .card:not(:first-of-type):not(:last-of-type) {
    border-bottom: 1px solid #E5EAF0;
    border-radius: 5px;
}

.stage-accordion .card-header {
    float: left;
    width: 100%;
    height: 70px;
    border-radius: 5px;
}

.stage-accordion .card-header:first-child {
    border-radius: 5px;
}

.stage-accordion .card:not(:first-of-type) .card-header:first-child {
    border-radius: 5px;
}

.stage-accordion .card:last-of-type {
    border-radius: 5px;
}

.stage-accord-header {
    float: left;
    width: 100%;
    height: 70px;
    padding: 14px 20px;
    display: flex;
    align-items: center;
}

.stage-accord-header-left {
    float: left;
    width: 38px;
    height: 42px;
    margin-right: 15px;
}

.stage-accord-header-right {
    float: left;
    width: calc(100% - 53px);
    padding-right: 15px;
}

.stage-accord-header-left p {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-align: center;
    background: #A7B7C5;
    border-radius: 2px;
}

.stage-accord-header-left h5 {
    float: left;
    width: 100%;
    color: #a7b7c5;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 2px;
}

.stage-accord-header-right h5 {
    float: left;
    width: 100%;
    height: 16px;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 16px;
    margin-bottom: 7px;
    max-height: 16px;
    overflow: hidden;
}

.stage-accord-header-right p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
}

.stage-accord-header:after {
    content: "";
    background: var(--sprite-two) no-repeat -359px -141px;
    width: 8px;
    height: 14px;
    transform: rotate(90deg);
    transition: .3s ease-out;
}

.collapsed .stage-accord-header:after {
    transform: rotate(0deg);
}

.select-lister.rejection-lister {
    margin-bottom: 25px;
}

.select-lister.rejection-lister:last-child {
    margin-bottom: 0;
}

.nested-sub-block .rejection-lister .radio-block label:before {
    background: url(images/blue-round.png) no-repeat;
    width: 22px;
    height: 22px;
    border: 0
}

.nested-sub-block .rejection-lister .radio-block input:checked+label:after {
    content: "";
    width: 22px;
    height: 22px;
    background: url(images/blue-tick-round.png) no-repeat;
    position: absolute;
    left: 1px;
    top: 1px;
    border-radius: 0;
}

.rejection-lister .radio-block label {
    line-height: 22px;
    padding-left: 32px;
    color: var(--default-grey);
}

.nested-sub-block .rejection-lister .radio-block input:checked+label:before {
    content: none;
}

.select-lister.rejection-lister li {
    margin-right: 50px;
}

.mandatory {
    color: #D0021B;
}

.nested-sub-block .textarea.lg-height {
    height: 195px;
}

.workflow-task .task-details-body-block:last-child {
    margin-bottom: 0;
}

.stage-accordion .card-body {
    border-top: 1px solid #E3E5E8;
    float: left;
    width: 100%;
    padding: 0;
}

.workflow-task-check-block {
    float: left;
    width: 100%;
    padding: 20px;
}

.task-check-header {
    float: left;
    width: 100%;
}

.task-check-header h5 {
    float: left;
    width: 100%;
    position: relative;
}

.checkpoint:before {
    content: "";
    width: 16px;
    height: 16px;
    background: url(images/grey-tick.png) no-repeat;
    background-size: 100%;
    position: absolute;
    left: 0;
    top: 10px;
    background-color: #ccc;
}

.checkpoint {
    padding-left: 25px;
    line-height: 17px;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 36px;
    margin-bottom: 4px;
}

.checkpoint.checked:before {
    background-size: 100%;
    background: var(--sprite-three) no-repeat -284px -221px;
    width: 16px;
    height: 16px;
}

.task-check-body {
    float: left;
    width: 100%;
    padding-left: 24px;
}

.task-check-body h5 {
    float: left;
    width: 100%;
    color: #4D5867;
    font-size: 14px;
    line-height: 17px;
    display: flex;
    align-items: center;
    position: relative;
    margin-bottom: 7px;
}

.form-small-icon:before {
    content: "";
    width: 13px;
    height: 17px;
    background: url(images/form-table.png) no-repeat;
    position: absolute;
    left: 0;
    top: 0;
}

.form-small-icon {
    padding-left: 25px;
}

.ind-task-check {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.ind-task-check:last-child {
    margin-bottom: 0;
}

.task-check-body p {
    float: left;
    width: 100%;
    color: #AAB7C4;
    font-size: 14px;
    line-height: 18px;
}

.split-data {
    float: left;
    width: 100%;
    margin-top: 20px;
}

.split-data-row {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.split-data-left {
    float: left;
    color: #4D5867;
    font-size: 13px;
    line-height: 15px;
}

.split-data-right {
    float: right;
    color: #AAB7C4;
    font-size: 14px;
    line-height: 16px;
    text-align: right;
}

.split-data-right span {
    cursor: pointer;
}

.split-data-row:last-child {
    margin-bottom: 0;
}

.workflow-user-wrapper {
    float: left;
    width: 100%;
    padding: 15px 20px;
    border-top: 1px solid #E3E5E8;
}

.workflow-user-row {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.workflow-user-img {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

.workflow-user-img img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.workflow-user-details {
    float: left;
    width: calc(100% - 50px);
}

.workflow-user-details h5 {
    float: left;
    width: 100%;
    color: #000000;
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 2px;
}

.workflow-user-details p {
    float: left;
    width: 100%;
    color: #AAB7C4;
    font-size: 14px;
    line-height: 16px;
}

.stage-accordion .card:last-child {
    margin-bottom: 0;
}

.side-tab .tab-content .setting-pane {
    padding: 0;
}

.setting-pane .settings-loungue-content {
    height: calc(100% - 90px);
    padding-bottom: 15px;
}

.main-settings-loungue {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid #E3E5E8;
}

.copy-data-panel {
    width: 100%;
    float: left;
    max-width: 250px;
}

.assigned-tau-block.single-user .tau {
    margin-right: 6px;
    margin-left: 0;
}

.edit-time-ico:before {
    background: var(--sprite-two) no-repeat -333px -364px;
    width: 9px;
    height: 10px;
}

.edit-time-ico {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: relative;
    top: 1px;
    margin-left: 10px;
}

.modal-sm .rdtPicker {
    width: 300px;
    margin: 0;
    border: 0 !important;
}

.modal-sm .rdtPicker td.rdtActive,
.modal-sm .rdtPicker td.rdtActive:hover {
    background: var(--default-color) !important;
    border-radius: 3px !important;
    color: #fff;
}

.print-holder {
    float: left;
    height: 100%;
}

.workflow-task .react-datepicker__input-container {
    border-bottom: 0px;
}

.nested-sub-block .input-block .form-error-text {
    font-size: 14px;
    color: #f14c4c;
    margin-bottom: 10px;
}

.workflow-task .date-box {
    height: 100%;
    margin-bottom: 20px;
}

.attach-block .form-error-text {
    font-size: 14px;
    color: #f14c4c;
    margin-bottom: 10px;
    padding: 0;
}

.file-upload-wf {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.workflow-task .input-block .input-box {
    margin-bottom: 20px;
}

.print-ico:before {
    background-position: -482px -450px;
    width: 20px;
    height: 19px;
}

.print-ico:hover:before {
    background-position: -506px -450px;
}

.fixed-chat-bottom {
    background: #fff;
}

.btn-section-left button {
    margin-right: 15px;
}

.quit-button {
    background: #e14745;
    border-color: #e14745;
}

.quit-button:hover {
    background: rgba(225, 71, 69, 0.5);
    border-color: rgba(225, 71, 69, 0);
}

.attach-click-toggle.extended-attatch {
    min-width: 350px;
    width: auto;
    height: 45px;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    background: #fff;
    border: 1px solid #e3e5e8;
    position: absolute;
    top: -40px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, .15);
}

.attachment-list li:hover .attach-click-toggle.extended-attatch {
    display: flex;
}

.file-info-previewer {
    float: left;
    height: 100%;
    margin-right: 15px;
}

.file-info-name {
    float: left;
    height: 100%;
    font-size: 10px;
    width: 250px;
    max-width: 250px;
    color: var(--default-grey);
    word-break: break-word;
    display: flex;
    align-items: center;
}

.file-info-option {
    float: left;
    height: 100%;
    display: flex;
    align-items: center;
}

.file-info-option button {
    float: left;
    width: 25px;
    height: 25px;
    border: 0;
    padding: 0;
    line-height: 0;
    background: transparent;
    border-radius: 50%;
    margin-left: 5px;
}

.preview-file:before {
    background-position: -112px -137px;
    width: 18px;
    height: 12px;
    margin-right: 20px;
}

.preview-file:hover:before {
    background-position: -112px -177px;
}

.download-file:before {
    background-position: -83px -135px;
    width: 16px;
    height: 16px;
}

.download-file:hover:before {
    background-position: -83px -175px;
}

.print-ico:before {
    background-position: -482px -450px;
    width: 20px;
    height: 19px;
}

.print-ico:hover:before {
    background-position: -506px -450px;
}

.attachment-block-left.non-download:before {
    content: none;
}

.without-left-info .stage-accord-header-left {
    display: none;
}

.without-left-info .stage-accord-header-right {
    width: 100%;
    position: relative;
}

.without-left-info .stage-accord-header-left h5 {
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 3px;
}

.without-left-info .stage-accord-header-right h5 {
    font-size: 14px;
    margin-bottom: 5px;
}

.without-left-info .stage-accord-header-left p {
    font-size: 12px;
    line-height: 14px;
}

.milestone-type {
    padding-left: 20px;
    position: relative;
}

.stage-accord-header.without-left-info {
    position: relative;
    cursor: pointer;
}

.stage-accord-header.without-left-info:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 8px 6px 0;
    border-color: transparent #ffffff transparent transparent;
    position: absolute;
    left: -8px;
    top: 28px;
    z-index: 8;
}

.stage-accord-header.without-left-info:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 10px 8px 0;
    border-color: transparent #E5EAF0 transparent transparent;
    position: absolute;
    left: -10px;
    top: 26px;
    z-index: 7;
    background: none;
    transform: rotate(0deg);
}

.milestone-type:before {
    content: "";
    width: 2px;
    height: calc(100% - 71px);
    background: #c3c3c3;
    position: absolute;
    left: 0;
    top: 35.5px;
    border-radius: 5px;
}

.milestone-type .card {
    position: relative;
}

.milestone-type .card:before {
    content: "";
    height: 10px;
    width: 10px;
    background-color: #c3c3c3;
    border-radius: 50%;
    position: absolute;
    left: -25px;
    top: 29.5px;
}

.milestone-type .checkpoint.checked:before,
.milestone-type .checkpoint:before {
    content: none;
}

.milestone-type .task-check-header h5 {
    padding-left: 0;
    line-height: 16px;
    margin-bottom: 10px;
    width: auto;
}

.milestone-type .task-check-body {
    padding-left: 0;
}

.milestone-type .task-check-container {
    float: left;
    width: 100%;
    position: relative;
}

.milestone-type .task-check-container:before {
    content: none;
    width: 1px;
    height: 100%;
    border-radius: 5px;
    background-color: #CED3D9;
    position: absolute;
    left: 0;
    top: 0;
}

.milestone-type .ind-task-check:before {
    content: none;
    height: 7px;
    width: 7px;
    background-color: #CED3D9;
    border-radius: 50%;
    position: absolute;
    left: -19px;
    top: 4px;
}

.milestone-type .ind-task-check {
    position: relative;
}

.task-check-body h5 {
    font-size: 13px;
    line-height: 22px;
    margin-bottom: 1px;
}

.task-check-body p {
    font-size: 12px;
    line-height: 18px;
}

.milestone-type .split-data-row {
    margin-bottom: 0;
}

.milestone-type .split-data-left {
    line-height: 16px;
}

.milestone-type .split-data-right {
    line-height: 16px;
    font-size: 12px;
}

.milestone-type .task-check-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.milestone-type .task-check-header p {
    color: #AAB7C4;
    font-size: 10px;
    line-height: 16px;
    margin-bottom: 10px;
}

.wf-task-left .workflow-task-body-container {
    padding-top: 20px;
}

.workflow-task-body-container .subheader {
    font-size: 24px;
    font-weight: 600;
    line-height: 36px;
    margin-bottom: 2px;
}

.workflow-task-footer {
    float: left;
    width: 100%;
    padding: 15px;
    border-top: 1px solid #E3E5E8;
}

.workflow-task-footer-top {
    float: left;
    width: 100%;
    margin-bottom: 6px;
}

.workflow-task-footer-top h5 {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
}

.workflow-task-footer-bottom {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.workflow-task-footer-bottom h5 {
    float: left;
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
}

.workflow-task-footer-bottom p {
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
}

.wf-task-left .sub-block .workflow-task-body-container h5 {
    font-weight: 400;
}

.sub-block .workflow-task-body-container .nested-form-content h5 {
    font-weight: 600;
}

.wf-task-left .sub-block .workflow-task-body-container h5 span {
    height: 18px;
    background: var(--default-grey);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    font-size: 12px;
    line-height: 14px;
    padding: 0 5px;
    position: relative;
    top: -2px;
    margin-right: 8px;
    text-transform: uppercase;
}

.stage-accord-header-right:after {
    content: "";
    background: var(--sprite-two) no-repeat -359px -141px;
    width: 8px;
    height: 14px;
    transform: rotate(90deg);
    transition: .3s ease-out;
    position: absolute;
    right: 0;
    top: 10px;
}

.collapsed .stage-accord-header-right:after {
    transform: rotate(0deg);
}

.wf-task-next .workflow-task-body-container h5 {
    line-height: normal;
    margin-bottom: 3px;
    font-size: 18px;
}

.wf-task-next .workflow-task-footer-bottom h5 {
    font-size: 12px;
    color: var(--default-text);
    margin-bottom: 15px;
    text-transform: uppercase;
}

.wf-task-next .workflow-task-body-container p {
    font-size: 14px;
}

.wf-task-next .sub-block .workflow-task-body-container h5 {
    padding-left: 0;
    font-size: 12px;
    color: var(--default-grey);
    text-transform: uppercase;
}

.wf-task-next .sub-block .workflow-task-body-container .input-block h5 {
    color: var(--default-text);
}

.wf-task-next .wf-task-left .sub-block .workflow-task-body-container h5 span {
    background: transparent;
    font-size: 14px;
    text-transform: uppercase;
    color: var(--default-grey);
    top: 0;
    margin-right: 5px;
    padding: 0;
}

.wf-task-next .wf-task-left .sub-block .workflow-task-body-container h5 {
    font-size: 14px;
    text-transform: uppercase;
    color: var(--default-grey);
    top: 0;
}

.wf-task-next .nested-form {
    float: left;
    background: var(--sprite-three) no-repeat -341px -211px;
    width: 20px;
    height: 26px;
    margin-right: 16px;
}

.stage-name {
    float: left;
    height: 55px;
    border: 1px solid #60ad6c;
    border-radius: 5px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.wf-task-next .sub-block .workflow-task-body-container .nested-form-content h5 {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    color: var(--default-text);
    line-height: 21px;
}

.wf-task-next .workflow-task-body-container .nested-form-content p {
    font-size: 14px;
    line-height: 14px;
}

.wf-task-next .nested-sub-block {
    margin-top: 10px;
    padding-left: 15px;
}

.wf-task-next .select-lister.rejection-lister li .radio-block {
    border: 1px solid #60ad6c;
    height: 55px;
    border-radius: 5px;
}

.wf-task-next .select-lister.rejection-lister li .radio-block label {
    height: 53px;
    display: flex;
    align-items: center;
    padding-left: 0;
    padding: 0 42px;
    font-size: 16px;
    color: var(--default-text);
    text-transform: capitalize;
}

.wf-task-next .nested-sub-block .rejection-lister .radio-block label:before {
    content: none;
}

.wf-task-next .nested-sub-block .rejection-lister .radio-block input:checked+label:after {
    content: none;
}

.wf-task-next .select-lister.rejection-lister li .radio-block input {
    height: 55px;
}

.wf-task-next .select-lister.rejection-lister li {
    margin-right: 20px;
}

.wf-task-next .attach-block .att:before {
    content: "";
    background: var(--sprite-two) no-repeat -101px -408px;
    width: 17px;
    height: 14px;
    position: relative;
    margin-right: 10px;
    top: 2px;
    transform: rotate(180deg);
}

.wf-task-next .select-lister.rejection-lister li .radio-block.active {
    background: #60ad6c;
}

.wf-task-next .select-lister.rejection-lister li .radio-block.active label {
    color: #fff;
}

.task-right .split-data {
    margin-top: 0;
}

.task-right .task-check-header {
    border-bottom: 0;
}

.task-right .textarea-block .split-data-left {
    width: 100%;
    color: var(--default-grey);
}

.task-right .textarea-block .split-data-right {
    float: left;
    width: 100%;
    text-align: left;
    color: #444;
    font-weight: 600;
}

.task-right .split-data-row {
    border-bottom: 1px solid #E3E5E8;
    padding-bottom: 7px;
    padding-top: 7px;
}

.task-right .milestone-type .split-data-right {
    width: 50%;
    text-align: left;
    color: #444;
    font-weight: 600;
    font-size: 14px;
}

.task-right .milestone-type .split-data-left {
    text-transform: uppercase;
    font-size: 12px;
    color: var(--default-grey);
    position: relative;
    width: 50%;
    padding-right: 19px;
}

.task-right .milestone-type .task-check-header h5 {
    font-size: 16px;
    float: left;
    width: 100%;
    text-align: center;
    background: #AFABAB;
    border-radius: 3px;
    color: #fff;
    line-height: 21px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 400;
}

.task-right .textarea-block .split-data-left {
    width: 100%;
    color: var(--default-grey);
    margin-bottom: 3px;
    padding-right: 0;
}

.task-right .textarea-block .split-data-right {
    width: 100%;
}

.task-right .milestone-type .split-data-left:after {
    content: ":";
    position: absolute;
    right: 8px;
    top: 0;
}

.task-right .milestone-type .textarea-block .split-data-left:after {
    content: none;
}

.brand-logo img {
    width: 100px;
}

.task-time-label {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.task-time-label h5 {
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.task-time-label h5 span {
    float: left;
}

.task-time-label h5 .task-date {
    margin-left: 0;
    margin-right: 12px;
}

.task-time-label p {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    text-transform: uppercase;
}

.task-time-label p span {
    float: left;
}

.task-time-label p .task-date {
    margin-left: 0;
    margin-right: 12px;
}

.task-tg .new-task-input.label-perst {
    display: flex;
    align-items: center;
    padding: 0 15px;
    padding-right: 55px;
}

.new-task-input.label-perst label {
    float: left;
    color: #bdbdbd;
    font-size: 12px;
    line-height: 16px;
    flex-shrink: 0;
    text-transform: uppercase;
}

.task-tg .input-auto-complete .ind-task-input:first-child {
    margin-top: 0;
    border-top: 0;
}

.time-log-top.full-hgt-log {
    height: 100%;
    overflow: unset;
}

.time-log-top .options-button {
    right: 20px;
    bottom: 20px;
}

.log-label-block {
    float: left;
    width: 100%;
    padding: 0 20px;
    margin: 18px 0 7px 0;
}

.time-log-sub-list-remark label,
.log-label-block label {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    text-transform: uppercase;
}

.log-container .time-log-items.one-third {
    border-bottom: 0;
}

.log-container .react-datepicker__input-container {
    border-bottom: 0;
}

.modal-footer .options-button {
    right: unset;
    left: 20px;
    top: 17px;
}

.full-hgt-log .log-time-remark {
    margin-top: 3px;
}

.bsy-modal .modal-footer {
    position: relative;
}

.full-side-down .date-drop .form-control {
    padding: 0 15px;
    height: 50px;
}

.full-side-down .width-adjust.date-drop {
    width: 100%;
    margin: 0;
}

.full-side-down .width-adjust.task-inline.no-margin {
    width: 100%;
}

.full-side-down .width-adjust.task-inline.no-margin .task-input-box--new {
    height: 50px;
    padding: 0 15px;
    border-bottom: 0;
}

.task-input-block.width-adjust.task-inline.label-perst label {
    float: left;
    color: #bdbdbd;
    font-size: 12px;
    line-height: 16px;
    flex-shrink: 0;
    text-transform: uppercase;
}

.task-input-block.width-adjust.date-drop.label-perst {
    display: flex;
    align-items: center;
    padding: 0 15px;
    border-bottom: 1px solid #ECEFF1;
}

.task-input-block.width-adjust.date-drop.label-perst label {
    float: left;
    color: #bdbdbd;
    font-size: 12px;
    line-height: 16px;
    flex-shrink: 0;
    text-transform: uppercase;
}

.full-side-down .date-drop.label-perst .form-control {
    border-bottom: 0;
}

.task-input-block.width-adjust.task-inline.no-margin.label-perst .code-block {
    display: flex;
    align-items: center;
    padding: 0 15px;
    border-bottom: 1px solid #ECEFF1;
}

.task-tg .dynamic-creation .assign-user-validation-err {
    padding: 0 20px;
}

.task-input-flex-block {
    float: left;
    width: 100%;
    padding: 0 15px;
    border-bottom: 1px solid #ECEFF1;
}

.task-input-flex-block .task-input-block {
    float: left;
    width: 50%;
}

.task-input-block.label-perst {
    display: flex;
    align-items: center;
}

.task-input-block.label-perst label {
    flex-shrink: 0;
    float: left;
    color: #bdbdbd;
    font-size: 12px;
    line-height: 16px;
    flex-shrink: 0;
    text-transform: uppercase;
}

.label-perst .task-input-box--new {
    border-bottom: 0;
    padding: 0 15px;
    height: 49px;
}

.task-input-block.text-input.label-perst {
    padding: 0 15px;
}

.task-tg .task-input-block.text-input.label-perst textarea {
    padding: 10px 15px 15px 15px;
    border-bottom: 0;
}

.task-input-block.text-input.label-perst {
    align-items: baseline;
    border-bottom: 1px solid #ECEFF1;
}

.date-same-line .date-drop .form-control {
    height: 50px;
}

.date-same-line .date-drop.label-perst .form-control {
    border-bottom: 0;
    padding: 0 15px;
}

.input-same-line .width-adjust.date-drop.label-perst {
    margin: 0;
    width: 50%;
}

.input-same-line .width-adjust.date-drop.label-perst .form-type-input {
    width: 100%;
}

.input-auto-complete .tag-wrapper-bl {
    padding-left: 0;
}

.task-left.full-width-task.task-left-full {
    float: left;
    width: 100%;
    height: 100%;
}

.task-left-full .task-details-inside {
    margin-bottom: 0;
    height: 100%;
}

.task-left-full .task-details-wrapper {
    height: 100%;
}

.task-left-full .task-split {
    height: 100%;
}

.task-split.task-split-full .task-details-body-block {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task-split.task-split-full .task-details-body-block .task-details-body-container h5 {
    font-weight: 100;
    font-size: 34px;
    color: var(--default-color);
    width: auto;
}

.task-split.task-split-full .task-details-body-block .task-details-body-container {
    width: auto;
}

.task-detail-user-info-right.jus-btn-block.jus-right-btn-block {
    justify-content: flex-end;
}

.remarks-text-btn {
    float: left;
    background: transparent;
    border: 0;
    font-size: 10px;
    font-weight: 600;
    color: var(--default-color);
    text-align: right;
    margin-top: 4px;
}

.general-btn-green.trans-border {
    border: 1px solid #60ad6c;
    background: #fff;
    color: #60ad6c;
    box-shadow: none;
    height: 30px;
    min-width: auto;
    padding: 0 15px;
}

.general-btn-green.trans-border:hover {
    background: #60ad6c;
    color: #fff;
}

.text-area-expandable {
    font-size: 14px;
    line-height: 21px;
    color: var(--default-text);
    max-height: 84px;
    overflow-y: auto;
    word-break: break-word;
    overflow-x: hidden;
    float: left;
    width: 100%;
    border: 1px solid transparent;
    resize: none;
    overflow: hidden;
}

.expand-text .fixed-chat-bottom {
    height: auto;
    min-height: 50px;
}

.task-extra-tab-block.expand-text .tab-content>.tab-pane {
    display: flex;
    flex-direction: column;
}

.hint-box {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.hint-box h5 {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    font-size: 14px;
}

.hint-box ul {
    float: left;
    width: 100%;
    margin-top: 10px;
}

.hint-box ul li {
    float: left;
    margin-bottom: 10px;
    font-size: 14px;
}

.submit-data-page .container-full .med-migrate iframe {
    padding-top: 70px;
}

.submit-block {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.submit-block h5 {
    font-size: 35px;
    font-weight: 300;
    color: #6ba446;
}

.ind-task-list:hover .due-block.activeduedate {
    display: block;
}

.dropzone {
    border: 1px solid #e4e6e9;
}

.upload-container-panel {
    float: left;
    width: 260px;
    background: rgba(0, 0, 0, 0.60);
    position: absolute;
    left: 20px;
    bottom: 70px;
    padding: 15px;
    border-radius: 18px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

.upload-container-panel-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.upload-container-panel-bottom {
    float: left;
    width: 100%;
    margin: 15px 0 0 0;
    height: 20px;
}

.upload-container-panel-bottom .progress {
    border-radius: 19px;
}

.upload-container-panel-header h5 {
    color: #fff;
    font-size: 14px;
}

.upload-container-panel-header p {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

.expand-text .fixed-chat-bottom {
    position: relative;
}

.chat-type-panel .upload-container-panel {
    bottom: 90px;
}

.assigned-user-task {
    float: left;
    background: var(--sprite-two) no-repeat -410px -112px;
    width: 20px;
    height: 20px;
    border: 0;
    padding: 0;
    line-height: 0;
}

.btn-section-left .select-box-group {
    width: auto;
    min-width: 120px;
    height: 36px;
    background: #4990e1;
    border-radius: 5px;
    padding-left: 16px;
    color: #fff;
    position: relative;
}

.btn-section-left .select-box-group .dropdown-toggle:after {
    background: var(--sprite-one) no-repeat -385px -474px;
    width: 14px;
    height: 8px;
}

.btn-section-left .select-box-group .dropdown-toggle {
    color: #fff;
}

.task-done-wrapper {
    float: left;
    width: 100%;
}

.task-done-wrapper .label-header {
    float: left;
    width: 100%;
    margin-bottom: 8px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
}

.btn-section-left .select-box-group.in-progress-status {
    background: #f5a523;
}

.btn-section-left .select-box-group.completed-status {
    background: #5fa213;
}

.btn-section-left .select-box-group.admin-view {
    min-width: auto;
    pointer-events: none;
}

.btn-section-left .select-box-group.admin-view .dropdown-toggle {
    color: #fff;
    margin-right: 0;
}

.btn-section-left .select-box-group.admin-view .dropdown-menu {
    display: none !important;
}

.btn-section-left .select-box-group.admin-view .dropdown-toggle:after {
    content: none;
}

.task-complete-panel {
    float: left;
    width: 100%;
    height: 90px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 5px;
}

.task-done-wrapper {
    float: left;
    width: 100%;
}

.btn-section-left {
    float: left;
    width: 100%;
}

.task-complete-panel-left {
    float: left;
    width: 125px;
    height: 100%;
    background: #5fa213;
    border-radius: 5px 0 0 5px;
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 12px 17px;
    justify-content: space-between;
}

.task-complete-panel-left h5 {
    color: #fff;
    line-height: normal;
    font-size: 14px;
    text-align: center;
}

.task-complete-panel-left p {
    color: #fff;
    line-height: normal;
    font-size: 14px;
    text-align: center;
}

.task-complete-panel-right {
    float: left;
    width: calc(100% - 125px);
    height: 100%;
    padding: 12px 17px;
}

.task-complete-panel-right-header {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.task-complete-panel-button-block button {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    height: 35px;
    border: 1px solid #ccc;
    padding: 0 25px;
    border-radius: 5px;
    transition: .3s ease-out;
}

.task-complete-panel-button-block button.accept {
    border-color: #5fa213;
    color: #5fa213;
}

.task-complete-panel-button-block button.reject {
    border-color: #d0021b;
    color: #d0021b;
}

.task-complete-panel-button-block button.accept:hover {
    background: #5fa213;
    color: #fff;
}

.task-complete-panel-button-block button.reject:hover {
    background: #d0021b;
    color: #fff;
}

.task-complete-panel-right-header h5 {
    color: var(--default-text);
    width: calc(100% - 235px);
    line-height: normal;
    font-size: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.task-duedate .datetimepicker-control-section {
    padding: 0;
    height: 39px;
    margin: 0;
}

.task-duedate .e-input-group.e-control-wrapper {
    height: 39px;
    padding: 0 10px;
}

.task-duedate .e-input-group-icon.e-date-icon::before,
.task-duedate .e-control-wrapper .e-input-group-icon.e-date-icon::before,
.task-duedate .e-datetime-wrapper .e-time-icon.e-icons::before {
    font-size: 16px;
    color: var(--default-grey);
}

.task-duedate .error-label {
    position: absolute;
    left: 0;
    top: -27px;
    font-size: 12px;
}

.reschedule-wrapper {
    float: left;
    width: 100%;
    margin: 30px 20px;
}

.reschedule-wrapper .task-duedate.input-log-time.date:after {
    content: none;
}

.reschedule-wrapper .eq-wid.input-log-time.date.task-duedate {
    border: 1px solid #E3E3E3;
    padding: 0;
    border-radius: 3px;
}

.reschedule-wrapper .task-duedate .datetimepicker-control-section {
    margin: 0;
    max-width: 101%;
}

.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before,
.e-input-group:not(.e-float-icon-left):not(.e-float-input)::after,
.e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before,
.e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after,
.e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before,
.e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after,
.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before,
.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after {
    background: none !important;
}

.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before,
.e-input-group:not(.e-float-icon-left):not(.e-float-input)::after,
.e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before,
.e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after,
.e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before,
.e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after,
.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before,
.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after {
    content: none;
}

.e-input-group:not(.e-float-icon-left),
.e-input-group.e-success:not(.e-float-icon-left),
.e-input-group.e-warning:not(.e-float-icon-left),
.e-input-group.e-error:not(.e-float-icon-left),
.e-input-group.e-control-wrapper:not(.e-float-icon-left),
.e-input-group.e-control-wrapper.e-success:not(.e-float-icon-left),
.e-input-group.e-control-wrapper.e-warning:not(.e-float-icon-left),
.e-input-group.e-control-wrapper.e-error:not(.e-float-icon-left) {
    border: 0 !important;
    ;
}

.reschedule-wrapper .task-duedate .error-label {
    top: unset;
    bottom: -27px;
}

.with-expand .text-area-expandable {
    padding-right: 25px;
}

.expand-btn {
    float: left;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: calc(50% - 10px);
    border-radius: 50%;
    border: 0;
    cursor: pointer;
    padding: 0;
    line-height: 0;
    background: transparent;
}

.chat-send-emoji {
    float: left;
    width: 60px;
    height: 20px;
    position: absolute;
    right: 0;
    top: calc(50% - 10px);
    border-radius: 50%;
    border: 0;
    cursor: pointer;
    padding: 0;
    line-height: 0;
    background: transparent;
}



.fixed-chat-bottom.popover-text {
    width: 600px;
    height: 350px;
    position: fixed;
    left: calc(50% - 300px);
    top: calc(50% - 175px);
    align-items: flex-start;
    padding: 20px;
    border: 0;
    z-index: 99999;
}

.popover-text .fixed-bottom-left {
    top: 6px;
}

.popover-text .fixed-bottom-right {
    top: 6px;
    position: relative;
}

.popover-text .fixed-bottom-center {
    height: 100%;
}

.discuss-inner.full-height-discuss {
    height: 100%;
}

.popover-text .input-block.with-expand {
    height: 100%;
}

.popover-text .input-block.with-expand .text-area-expandable {
    height: 100% !important;
    max-height: none;
}

.expand-btn:before {
    content: "";
    background: var(--sprite-one) no-repeat -499px -69px;
    width: 11px;
    height: 12px;
    display: inline-block;
}

.popover-text .expand-btn:before {
    background-position: -512px -69px;
    width: 12px;
    height: 12px;
}

.task-detail-panel-content-area p a {
    word-break: break-word;
    color: var(--default-color);
    margin: 7px 0;
    font-weight: 600;
    float: left;
    width: 100%;
}

.task-time-label p:last-child .task-date {
    margin-right: 0;
}

.popover-text .input-block .text-area-expandable {
    height: 100% !important;
    max-height: 100%;
    overflow: auto;
}

.popover-text .input-block {
    height: 100% !important;
}

.fixed-bottom-center .input-block {
    padding-right: 20px;
}

.popover-text .expand-btn {
    top: 4px;
}

.expand-close {
    background: var(--sprite-one) no-repeat -11px -125px;
    width: 16px;
    height: 16px;
    position: absolute;
    right: -25px;
    top: -25px;
    border: 0;
    padding: 0;
    line-height: 0;
    cursor: pointer;
}

.fixed-chat-bottom .expand-close {
    display: none;
}

.fixed-chat-bottom.popover-text .expand-close {
    display: block;
}

.attachment-list.attach_forms li .forms-header:before {
    flex-shrink: 0;
}

.ind-file-list.file-div .file-size {
    font-size: 12px;
}

.tab-content .ind-task-added-user-list .ind-added-user-list-left {
    float: left;
    width: 100%;
}

.attachment-list.attach_forms {
    max-width: 100%;
}

.full-width .modal-body.inner-modal .modal {
    position: relative;
    padding: 0;
}

.full-width .modal-body.inner-modal {
    padding: 0;
}

.modal-title-header {
    float: left;
    font-size: 20px;
    color: #444;
    font-weight: 600;
}

.record-slider {
    float: left;
}

.record-slider button {
    float: left;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 0;
    background: var(--default-color);
    margin-left: 8px;
}

.prevButton:before {
    content: "";
    background: var(--sprite-one) no-repeat -385px -474px;
    width: 14px;
    height: 8px;
    display: inline-block;
    transform: rotate(90deg);
    position: relative;
    top: -2px;
    left: -1px;
}

.nextButton:before {
    content: "";
    background: var(--sprite-one) no-repeat -385px -474px;
    width: 14px;
    height: 8px;
    display: inline-block;
    transform: rotate(-90deg);
    position: relative;
    top: -2px;
    left: 1px;
}

.record-slider button.disable {
    background: var(--default-grey);
    opacity: .3;
    pointer-events: none;
}

.stage-flow .active:hover {
    color: #fff;
}

.task-complete-panel-button-block button.accept.disable,
.task-complete-panel-button-block button.reject.disable {
    opacity: .5;
    color: #bdbdbd;
    border-color: #bdbdbd;
    pointer-events: none;
}

.nested-sub-block textarea[disabled=""] {
    background: #fafafa;
}

.preview-area.chat-panel .player-area {
    width: auto;
    height: auto;
}

.mark-as-done-mod .modal-body {
    padding: 0;
    height: 524px;
}

.mark-as-done-mod .modal-dialog-centered {
    height: calc(100% - 60px);
}

.mark-as-done-mod .log-container .time-log-items.one-third {
    padding: 0;
    margin-left: 10px;
    width: calc((100% / 3) - 7px);
}

.mark-as-done-mod .log-container .time-log-items.one-third:first-child {
    margin-left: 0;
}

.mark-as-done-mod .log-container .row-list {
    padding: 0 20px;
    padding-right: 89px;
}

.mark-as-done-mod .input-log-time.date {
    padding-right: 0;
}

.mark-as-done-mod .input-log-time.date:after {
    right: unset;
    left: 0;
}

.mark-as-done-mod .input-log-time.date .react-datepicker__input-container input {
    padding-left: 25px;
}

.mark-as-done-mod .modal-body .modal-body.time-log {
    height: calc(100% - 71px);
    overflow-y: auto;
}

.mark-as-done-mod .modal-time-log {
    height: 100%;
}

.form-download {
    width: 30px;
    height: 30px;
    background: var(--default-color);
    border: 0;
    border-radius: 5px;
    font-size: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 20px;
    bottom: 10px;
    cursor: pointer;
}

.form-download:before {
    content: "";
    background: var(--sprite-two) no-repeat -70px -182px;
    width: 14px;
    height: 14px;
    display: inline-block;
}

.expandable-textarea .ql-toolbar.ql-snow {
    border: 0;
}

.expandable-textarea .ql-container.ql-snow {
    border: 1px solid #eceff1;
}

.clap-btn {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    filter: grayscale(1);
    display: flex;
    align-items: center;
    font-size: 12px;
    color: var(--default-grey);
}

.clap-btn:before {
    content: "";
    background: var(--sprite-two) no-repeat -660px -184px;
    width: 15px;
    height: 16px;
    display: inline-block;
}

.clap-btn.active {
    filter: none;
}

.clap-btn span {
    display: none;
}

.clap-btn.active span {
    display: block;
    margin-left: 5px;
    font-weight: 600;
}

.clap-reaction {
    float: left;
    margin-right: 20px;
    position: relative;
}

.reaction-box {
    position: absolute;
    width: 228px;
    background: #fff;
    border-radius: 11px;
    background: #fff;
    padding: 0 22px;
    height: 52px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08), 0 2px 2px rgba(0, 0, 0, 0.15);
    border-radius: 40px;
    right: calc(50% - 114px);
    bottom: 25px;
    opacity: 1;
    transition: opacity 0.15s;
    display: flex;
    align-items: center;
}

.reaction-box button {
    zoom: 1.5;
    margin-right: 12px;
    filter: grayscale(1);
}

.reaction-box button:last-child {
    margin-right: 0;
}

.reaction-box button:hover {
    filter: none;
}

.reaction-box button.active {
    filter: none;
}

.center-placeholder {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.center-placeholder h5 {
    font-size: 20px;
    font-weight: 300;
    color: #a9a9a9;
    margin-bottom: 12px;
}

.center-placeholder p {
    text-align: center;
    font-size: 12px;
    line-height: 17px;
    padding: 0 20px;
    color: #a9a9a9;
}

.ind-file-list.file-div .format:after {
    border-color: #f2f5f5 transparent transparent transparent;
}

.file-details {
    float: left;
    width: calc(100% - 36px);
    display: flex;
    flex-direction: column;
}

.file-details .file-size {
    color: var(--default-grey);
    font-weight: 400;
}

.file-details .file-click-title {
    line-height: normal;
}

.ind-file-list.file-div .attach-click-thumb {
    margin-top: 3px;
}

.attachment-option-tab {
    display: flex;
    align-items: center;
}

.attachment-option-tab button {
    background: transparent;
    border: 0;
    padding: 0;
    position: relative;
    margin-left: 8px;
}

.attachment-option-tab button:before {
    zoom: .75;
}

.attachment-option-tab .preview:before {
    background-position: -112px -137px;
    width: 18px;
    height: 12px;
}

.attachment-option-tab .preview:hover:before {
    background-position: -112px -177px;
}

.attachment-option-tab .download:before {
    background-position: -83px -135px;
    width: 16px;
    height: 16px;
}

.attachment-option-tab .download:hover:before {
    background-position: -83px -175px;
}

.common-tab-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.common-tab-header .split-task-header {
    margin-bottom: 0;
}

.add-option-button {
    float: left;
    width: 20px;
    height: 20px;
    border: 0;
    padding: 0;
    background: var(--default-color);
    border-radius: 5px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    color: #fff;
}

.tab-wrap-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.tab-wrap-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 0 20px 20px 20px;
    overflow-y: auto;
}

.tab-wrap-header h5 {
    font-weight: 600;
    font-size: 14px;
}

.each-task-tag {
    float: left;
    width: 100%;
    height: 40px;
    border-radius: 5px;
    background: #fff;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    padding: 0 15px;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, 0.1);
}

.each-task-tag p {
    font-size: 13px;
    display: flex;
    align-items: center;
    font-weight: 600;
}

.each-task-tag p:before {
    content: "";
    background: var(--sprite-two) -147px -364px;
    width: 16px;
    height: 16px;
    display: inline-block;
    margin-right: 10px;
    zoom: .8;
}

.select-chk-block.task-select {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.select-chk-block.task-select label {
    font-size: 14px;
    color: var(--default-grey);
}

.m-modal.preview-task-at .modal-dialog {
    max-width: 63%;
}

.preview-task-at .preview-area {
    height: 100%;
    padding: 10px;
}

.preview-task-at .preview-area img {
    object-fit: scale-down;
}

.task-chat-container {
    float: left;
    width: 100%;
    background: #ECF0F1;
    padding: 20px;
    border-radius: 5px;
}

.chat-selection-container .wa-each-chat-list-content p {
    color: var(--default-text);
}

.dynamic-creation .persitant-top.with-schedule {
    height: calc(100% - 125px);
}

.schedule-wrapper {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
}

.schedule-panel {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.schedule-wrapper .input-log-time.date:after {
    content: none;
}

.schedule-wrapper .task-duedate .datetimepicker-control-.section {
    margin: 0;
    max-width: none;
}

.schedule-wrapper .input-log-time.date {
    width: 222px;
    padding: 0;
    border: 1px solid #eceff1;
    border-radius: 10px;
}

.schedule-wrapper .select-chk-block.task-select {
    width: auto;
    padding: 0;
}

.schedule-wrapper .task-duedate .datetimepicker-control-section {
    max-width: none;
}

.submit-group .general-btn {
    box-shadow: none;
}

.submit-group .general-btn:focus {
    box-shadow: none;
}

.submit-group {
    box-shadow: 0 2px 10px 0 rgb(0 0 0 / 16%), 0 2px 5px 0 rgb(0 0 0 / 26%);
    border-radius: 5px;
}

.submit-group .btn-primary:not(:disabled):not(.disabled).active,
.submit-group .btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
    background: var(--hover-color);
    border-color: var(--hover-color);
}

.split-bsy {
    background: var(--btn-color);
    border-color: var(--btn-color);
    border-left: 1px solid rgb(255 255 255 / 20%);
}

.submit-group .btn-primary:hover {
    background: var(--hover-color);
    border-color: var(--hover-color);
}

.custom-drop-menu {
    float: left;
    background: #fff;
    padding: 10px 0;
    border: 1px solid #EAEAEA;
    border-radius: 4px;
    position: absolute;
    box-shadow: 0 5px 7px 0 rgb(0 0 0 / 15%);
}

.custom-drop-menu .dropdown-item.active,
.custom-drop-menu .dropdown-item:active {
    background: #fafafa;
    color: var(--default-color);
}

.custom-drop-menu .dropdown-item {
    color: var(--default-grey);
}

.custom-drop-menu .dropdown-item:hover {
    color: var(--default-color);
}

.custom-drop-menu .dropdown-item:focus {
    outline: none;
}

.default-times {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.default-times li {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
}

.default-times li nav {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 19px;
    transition: .3s ease-out;
    cursor: pointer;
    position: relative;
}

.default-times li nav:hover {
    color: var(--default-color);
}

.default-times li nav:before {
    content: "";
    background: var(--sprite-two) no-repeat -131px -324px;
    width: 12px;
    height: 13px;
    position: absolute;
    left: 0;
    top: 0;
}

.schedule-modal .modal-sm {
    max-width: 420px;
}

#resourceCount {
    color: var(--default-grey);
    font-size: 14px;
}

.modal-time-log .react-datepicker-popper[data-placement^="bottom"] {
    margin-top: 0;
}

.preview-task-at .plugin-preview .react-pdf__Page {
    height: 100%;
}

.preview-task-at .preview-area.chat-panel.plugin-preview {
    align-items: flex-start;
    padding: 20px;
    height: auto;
}

/*------ Task Details End ------*/

/*------ User ------*/

.card-holder {
    float: left;
    width: 100%;
    height: 100%;
}

.team-card {
    float: left;
    width: calc((100%/4) - 12px);
    height: 95px;
    background: #fff;
    padding: 10px;
    margin-right: 15px;
    margin-bottom: 15px;
    border-radius: 3px;
    border: -2px;
    transition: .4s ease-out;
    cursor: pointer;
    position: relative;
}

.team-card:nth-child(4n) {
    margin-right: 0;
}

.user-thumb {
    float: left;
    width: 75px;
    height: 75px;
    margin-right: 10px;
    border-radius: 50%;
    position: relative;
    cursor: pointer;
}

.user-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.hover-in-button {
    width: 75px;
    height: 75px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.5);
    transition: 0.4s linear;
    opacity: 0;
}

.button-in {
    display: flex;
    align-items: center;
    justify-content: center;
    background: 0 0;
    border: 0;
    padding: 0;
    color: #fff;
    cursor: pointer;
    line-height: normal;
}

.icon-in.icon-chat-sm {
    background-position: -451px -186px;
    width: 12px;
    height: 12px;
}

.botton-text {
    padding-left: 6px;
}

.team-card:hover .hover-in-button {
    opacity: 1;
    transition: 0.4s linear;
}

.team-card:hover {
    box-shadow: 0 0 7px 0 rgba(0, 0, 0, .15);
}

.user-description {
    width: calc(100% - 90px);
    float: left;
    padding: 0;
}

.card-user-head {
    float: left;
    width: 100%;
    font-weight: 600;
    margin: 0;
    margin-bottom: 3px;
    transition: .2s ease-out;
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: -.2px;
    line-height: 16px;
}

.user-description p {
    float: left;
    width: 100%;
    font-weight: 400;
    margin-bottom: 5px;
    position: relative;
    padding-left: 16px;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
}

.designation-in:before {
    content: "";
    background: var(--sprite-one) no-repeat -372px -188px;
    width: 10px;
    height: 8px;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.mail-in:before {
    content: "";
    background: var(--sprite-one) no-repeat -387px -188px;
    width: 10px;
    height: 8px;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.contant-no-in:before {
    content: "";
    background: var(--sprite-one) no-repeat -138px -74px;
    width: 9px;
    height: 9px;
    position: absolute;
    left: 0;
    top: calc(50% - 4.5px);
}

.team-card:hover .card-user-head {
    color: var(--default-color);
}

.user-image-panel {
    float: left;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    position: relative;
}

.user-image-panel img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.user-content-panel {
    width: calc(100% - 140px);
    float: right;
}

.user-profile-thumb-updater {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
}

.user-profile-thumb-updater input {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    opacity: 0;
}

.thumb-update-text {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.43);
    border-radius: 50%;
    color: #fff;
}

.form-group input {
    float: left;
    width: 100%;
    height: 50px;
    border: 0;
    border-bottom: 1px solid #E4E6E9;
    padding: 0;
    font-size: 14px;
}

.change-password-opt {
    float: left;
    width: 100%;
    font-size: 14px;
    margin: 20px 0 0 0;
    color: #3fa8f4;
}

.group-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.ind-group-list {
    float: left;
    width: calc((100% / 4) - 15px);
    margin-right: 20px;
    margin-bottom: 20px;
    padding: 16px;
    height: 130px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 5px;
    background-color: #FFFFFF;
    transition: .3s ease-out;
}

.ind-group-list:nth-child(4n) {
    margin-right: 0;
}

.ind-group-list:hover {
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
}

.ind-group-list .pj-added-user {
    float: left;
    width: 100%;
}

.group-block-wrap {
    float: left;
    width: 100%;
}

.group-block-wrap h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 7px;
    transition: .3s ease-out;
}

.group-block-wrap p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 7px;
}

.group-block-wrap p:last-child {
    margin-bottom: 0;
}

.group-list-header {
    float: left;
    width: 100%;
    position: relative;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

.group-list-header .option-button:before {
    transform: rotate(90deg);
}

.group-list-header .option-button {
    width: 20px;
    position: relative;
    top: -13px;
}

.group-list-header .task-other-opt .panel-option {
    top: 7px;
    right: -12px;
}

.group-list-header .task-other-opt {
    opacity: 0;
    pointer-events: none;
}

.ind-group-list:hover .group-list-header .task-other-opt {
    opacity: 1;
    pointer-events: auto;
}

.ind-group-list:hover .group-block-wrap h5 {
    color: var(--default-color);
}

.mention-class {
    color: #999999;
}

.menu-section.no-pad-filter {
    padding: 8px 0 10px 38px;
}

.no-pad-filter .ind-menu-section {
    padding-left: 0;
}

.label-menu-right-block.filter-top h4 {
    color: #222330;
    font-size: 18px;
    line-height: 21px;
    padding: 0 38px;
    margin-top: 16px;
    margin-bottom: 5px;
}

.main-panel-holder.with-tag {
    height: calc(100vh - 116px);
}

.group-block-wrap h5 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.team-card.selected {
    border-color: var(--default-color);
    box-shadow: 0 0 7px 0 rgba(0, 0, 0, .15);
}

.team-card .select-chk-block.team-check {
    position: absolute;
    left: 15px;
    top: 10px;
    opacity: 0;
    pointer-events: none;
}

.select-chk-block.team-check .checkbox-indicator {
    width: 20px;
    height: 20px;
    border-radius: 50%;
}

.select-chk-block.team-check .checkbox-indicator:after {
    left: 4px;
    top: 5px;
}

.team-card:hover .select-chk-block.team-check {
    opacity: 1;
    pointer-events: auto;
}

.team-card.selected .select-chk-block.team-check {
    opacity: 1;
    pointer-events: auto;
}

.layer-btn {
    float: left;
    width: auto;
    height: 40px;
    background: var(--default-color);
    color: #fff;
    border-radius: 5px;
    padding: 0 20px;
    margin: 0 10px;
    border: 1px solid var(--default-color);
}

/*------ User End ------*/

/*------ User Details ------*/

.details-wrapper {
    width: 100%;
    display: inline-block;
    padding: 20px;
    height: calc(100% - 60px);
}

.details-in-holder {
    width: 100%;
    display: flex;
    margin-bottom: 20px;
    float: left;
    border: 1px solid #e4e4e4;
    align-items: center;
    justify-content: space-between;
    background: #fff;
}

.pintile-thumb {
    width: 160px;
    height: 160px;
    float: left;
}

.pintile-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pintile-description {
    width: calc(100% - 160px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 65px 5px 20px;
    position: relative;
}

.user-description-in {
    width: calc(100% - 200px);
    float: left;
}

.user-name-in {
    float: left;
    width: 100%;
    margin-bottom: 12px;
    color: var(--default-text);
    font-size: 20px;
    font-weight: 600;
    line-height: 21px;
}

.user-detail-list {
    float: left;
    width: 100%;
    position: relative;
}

.user-detail-list-items {
    padding-left: 20px;
    margin-bottom: 8px;
    font-size: 13px;
    line-height: 15px;
    color: var(--default-grey);
    position: relative;
}

.icon-in.icon-user-in {
    background-position: -303px -213px;
    width: 12px;
    height: 11px;
}

.icon-in.icon-map-in {
    background-position: -257px -212px;
    width: 12px;
    height: 12px;
}

.icon-in.icon-mail-in {
    background-position: -277px -213px;
    width: 12px;
    height: 10px;
}

.user-detail-list-items .icon-in {
    position: absolute;
    left: 0;
    top: 3px;
}

.user-task-indicator {
    width: 100%;
}

.task-indic-box {
    float: left;
    width: auto;
    height: 55px;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    background: #fff;
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    display: -webkit-flex;
    -webkit-justify-content: space-between;
}

.task-count-text {
    float: left;
    width: auto;
    color: #9ca0a4;
    font-size: 14px;
    line-height: 27px;
    border-bottom: 1px solid #f3f3f3;
    padding: 0 12px;
}

.task-count-in {
    font-weight: 600;
    font-size: 16px;
    color: #333;
    margin-right: 3px;
}

.indic-box-text {
    float: left;
    width: auto;
    font-size: 12px;
    line-height: 24px;
    padding: 0 12px;
}

.task-indic-box.task-indic-box--in-progress {
    border-color: #f5a623;
}

.task-indic-box.task-indic-box--in-progress .indic-box-text {
    color: #f5a623;
}

.task-indic-box.task-indic-box--pending {
    border-color: #c92700;
}

.task-indic-box.task-indic-box--completed {
    border-color: #7db248;
}

.task-indic-box.task-indic-box--new .indic-box-text {
    color: #63b8ff;
}

.task-indic-box.task-indic-box--completed .indic-box-text {
    color: #7db248;
}

.task-indic-box--new {
    border-color: #63b8ff;
}

.description-options {
    width: 30px;
    height: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 13px;
    top: 10px;
    cursor: pointer;
}

.icon-in.icon--optionsbullet {
    background-position: -419px -69px;
    width: 33px;
    height: 15px;
}

.description-options-box {
    float: left;
    width: 150px;
    background: #fff;
    padding: 10px 0;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    position: absolute;
    right: 6px;
    top: 27px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, .15);
    display: none;
    z-index: 9;
}

.description-options-box.fly-in {
    display: block;
}

.description-options-box:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    top: -10px;
    right: 11px;
    z-index: 10;
}

.description-options-box:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 12px 12px;
    border-color: transparent transparent #eaeaea transparent;
    position: absolute;
    top: -12px;
    right: 9px;
    z-index: 9;
}

.options-list-items {
    padding: 10px 10px 10px 50px;
    font-size: 16px;
    color: var(--default-grey);
    font-size: 16px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.icon-in.icon-edit {
    background-position: -50px -353px;
    width: 18px;
    height: 18px;
}

.icon-in.icon-delete {
    background-position: -195px -353px;
    width: 16px;
    height: 19px;
}

.options-list-items .icon-in {
    position: absolute;
    left: 20px;
}

.options-list .options-list-items:hover {
    background: #fafafa;
    color: var(--default-color);
}

.options-list-items:hover .icon-delete {
    background-position: -180px -491px;
}

.options-list-items:hover .icon-edit {
    background-position: -35px -491px;
}

.tab-holder {
    width: 100%;
    display: inline-block;
    background: #ffffff;
    height: calc(100% - 182px);
    border: 1px solid #e4e4e4;
    border-radius: 4px;
}

.tab-list {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #dee2e6;
}

.tab-list-items {
    display: flex;
    height: 50px;
    align-items: center;
    justify-content: center;
    padding: 0px 25px;
    font-size: 15px;
    line-height: 14px;
    color: var(--default-grey);
    position: relative;
    cursor: pointer;
}

.tab-list-items:hover,
.tab-list-items.active-in {
    color: var(--default-color);
}

.icon-in.icon-recent {
    background-position: -11px -250px;
    width: 14px;
    height: 14px;
}

.icon-in.icon-statics {
    background-position: -54px -250px;
    width: 14px;
    height: 14px;
}

.tab-list-items .icon-in {
    margin-right: 10px;
}

.tab-list-items:hover .icon-in.icon-statics,
.tab-list-items.active-in .icon-in.icon-statics {
    background-position: -54px -277px;
}

.tab-list-items:hover .icon-in.icon-recent,
.tab-list-items.active-in .icon-in.icon-recent {
    background-position: -11px -277px;
}

.tab-list-items:hover .icon-in.icon-permissions,
.tab-list-items.active-in .icon-in.icon-permissions {
    background-position: -77px -277px;
}

.icon-in.icon-recent {
    background-position: -11px -250px;
    width: 14px;
    height: 14px;
}

.icon-in.icon-permissions {
    background-position: -77px -250px;
    width: 12px;
    height: 14px;
}

.tab-in-content {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.tab-pane {
    float: left;
    width: 100%;
    height: 100%;
}

.tab-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
    overflow-y: auto;
}

.user-button-block {
    float: right;
    border: 1px solid #e3e5e8;
    border-radius: 3px;
}

.graph-in-block {
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: 25px;
}

.table-scrollable-in tr th {
    color: #565656;
    font-size: 12px;
    line-height: 25px;
    font-weight: 600;
    border-top: 0;
    border-bottom: 0;
    padding-left: 15px;
    text-transform: uppercase;
}

.has-checkbox {
    display: flex;
    align-items: center;
}

.checkbox-in {
    width: 15px;
    height: 15px;
    position: relative;
    margin-right: 10px;
}

.cs-checkbox {
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 0;
    padding: 0;
    margin: 0;
    opacity: 0;
    transition: 0.3s linear;
}

.cs-checkbox-pl {
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 0;
    border: 1px solid #b6c5ca;
    cursor: pointer;
}

.cs-checkbox:checked+span {
    background: var(--default-color);
    border-color: var(--default-color);
    transition: 0.3s linear;
}

.cs-checkbox:checked+span:after {
    content: '';
    background: var(--sprite-one) no-repeat;
    background-position: -274px -73px;
    width: 9px;
    height: 7px;
    left: calc(50% - 4.5px);
    top: calc(50% - 3.5px);
    border-color: #b6c5ca;
    position: absolute;
}

.checkbox-in .cs-checkbox:disabled~.cs-checkbox-pl {
    background: #e6e6e6;
    opacity: 0.6;
    pointer-events: none;
}

.table-scrollable-in tr td {
    color: #24292f;
    font-size: 13px;
    line-height: 15px;
    font-weight: 400;
    border-top: 0;
    border-bottom: 0;
    padding-left: 15px;
}

.table-scrollable-in tbody tr td {
    border-top: 1px solid #e3e5e8;
}

.submit-button {
    margin: 0;
    background: var(--default-color);
    border: 1px solid var(--default-color);
    color: #fff;
    height: 40px;
    min-width: 90px;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin-left: 0;
    padding: 0 25px;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .16), 0 2px 5px 0 rgba(0, 0, 0, .26);
    float: right;
    transition: .3s ease-out;
}

.submit-button:hover {
    background: var(--hover-color);
    border-color: var(--hover-color);
}

.tab-list-items:after {
    content: "";
    height: 2px;
    width: 100%;
    background: transparent;
    position: absolute;
    left: 0;
    bottom: -1px;
    z-index: 9;
}

.tab-list-items.active-in:after {
    background: var(--default-color);
}

.tab-wrapper .user-button-block {
    float: right;
    display: flex;
    align-items: center;
    border-color: #DBDBDB;
    border-radius: 4px;
}

.user-button-block .filter-button {
    float: left;
    padding: 8px 20px;
    border-radius: 0;
    border: 0;
    border-left: 1px solid #DBDBDB;
}

.user-button-block .filter-button:first-child {
    border-left: 0;
    border-radius: 4px 0 0 4px;
}

.user-button-block .filter-button:last-child {
    border-radius: 0 4px 4px 0;
}

.user-button-block .filter-button.active {
    background: var(--default-color);
    color: #fff;
}

.project-summary-block {
    float: left;
    width: 100%;
    padding: 0 20px;
    margin-bottom: 25px;
}

.tab-wrapper .project-summary-block {
    padding: 0;
}

.tab-head-in {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.tab-head-text {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.project-status {
    float: left;
    width: 100%;
}

.project-status-block {
    float: left;
    width: 100%;
    padding-left: 25px;
    position: relative;
    margin-bottom: 24px;
}

.project-status-block.status-finish:before {
    content: '';
    background: var(--sprite-one) no-repeat -265px -359px;
    width: 14px;
    height: 10px;
    position: absolute;
    left: 0;
    top: 0;
}

.project-status-block.status-message:before {
    content: '';
    background: var(--sprite-one) no-repeat -286px -356px;
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 0;
}

.status-text {
    float: left;
    width: 100%;
    color: #061826;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .39px;
    line-height: 16px;
    margin-bottom: 4px;
}

.highlight-in {
    font-size: 12px;
    letter-spacing: .33px;
    line-height: 16px;
    color: #898989;
}

.project-status-block:after {
    content: '';
    height: 12px;
    width: 2px;
    border-radius: 2.5px;
    background-color: #e6eef9;
    position: absolute;
    left: 5px;
    top: 20px;
}

.graph-in-block {
    height: calc(100% - 67px);
    font-size: 12px;
}

.recharts-legend-item-text {
    line-height: 20px;
    font-weight: 400;
    font-size: 14px;
}

.recharts-tooltip-wrapper .chart-tooltip {
    border: 1px solid rgb(125, 178, 72);
    padding: 10px;
    line-height: 14px;
    color: #000000;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: #FFFFFF;
}

.recharts-tooltip-wrapper p.title {
    font-weight: 600;
}

.user-detail-graph-block {
    font-size: 12px;
}

.leg-per {
    display: block;
    width: 10px;
    height: 8px;
    float: left;
    margin: 7px 0 0 0;
}

.leg-icon {
    width: 100%;
}

.leg-label {
    display: block;
    float: left;
    margin: 0 6px;
}

.leg-val {
    display: block;
    float: right;
    font-size: 14px;
    font-weight: 600;
}

.recharts-legend-wrapper li {
    display: flex;
    padding: 0 0 8px 0;
}

.recharts-radial-bar-label {
    font-size: 14px;
}

.pj-added-user .ind-added-user-list .assigned-user-task {
    background-color: #fff;
    border-radius: 50%;
}

.pj-added-user .ind-added-user-list {
    display: flex;
    align-items: center;
}

.ind-group-list .form-option-block.nav-option {
    right: 0;
    top: 10px;
}

.ind-group-list .form-option-block .panel-option {
    top: 8px;
    right: -12px;
}

.user-detail-card {
    float: left;
    width: 100%;
    border-radius: 15px;
    padding: 20px;
    background-color: #FFFFFF;
    box-shadow: 0 0.5px 3px 0 rgb(0 0 0 / 10%);
    margin-bottom: 20px;
}

.user-detail-card-top {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 22px;
}

.previous-stage {
    float: left;
    color: var(--default-text);
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 22px;
    border: transparent;
    background: transparent;
    padding: 0;
    margin-right: 30px;
}

.previous-stage:before {
    content: "";
    background: var(--sprite-two) no-repeat -61px -141px;
    width: 14px;
    height: 13px;
    margin-right: 20px;
    display: inline-block;
}

.communication-panel {
    float: left;
}

.communication-panel li {
    float: left;
    margin-right: 35px;
    line-height: 24px;
}

.communication-panel li nav {
    float: left;
    color: var(--default-text);
    font-size: 13px;
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.communication-panel li nav:before {
    margin-right: 10px;
    position: relative;
    top: -1px;
}

.user-text-chat:before {
    background-position: -328px -210px;
    width: 13px;
    height: 13px;
}

.user-voice-call:before {
    background-position: -353px -210px;
    width: 12px;
    height: 12px;
}

.user-video-call:before {
    background-position: -381px -212px;
    width: 16px;
    height: 9px;
}

.user-assign-task:before {
    background-position: -467px -279px;
    width: 14px;
    height: 14px;
}

.user-detail-card-top .description-options {
    right: -6px;
    top: 5px;
}

.user-detail-card-top .description-options-box.fly-in {
    right: -12px;
    top: 22px;
}

.user-detail-card-center {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.user-detail-card-center .user-detail-list {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
}

.user-detail-card-center-left {
    float: left;
    width: 105px;
    height: 105px;
    margin-right: 12px;
}

.user-detail-card-center-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.user-detail-card-center-right {
    float: left;
    width: calc(100% - 117px);
    height: 105px;
}

.user-detail-list .user-detail-list-items {
    color: var(--default-grey);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 16px;
    margin-bottom: 12px;
}

.user-detail-list .user-detail-list-items :last-child {
    margin-bottom: 0;
}

.user-detail-list .user-detail-list-items .phone-text:before {
    top: 1px;
    left: 1px;
}

.user-detail-list .user-detail-list-items:last-child {
    margin-bottom: 0;
}

.user-detail-card-bottom {
    float: left;
    width: 100%;
}

.user-statistics-each {
    float: left;
    height: 60px;
    width: calc((100% / 7) - 16px);
    margin-right: 18px;
    border: 1px solid #E5EBF2;
    background-color: #FFFFFF;
    border-radius: 10px;
    padding: 12px 17px;
}

.user-statistics-each:last-child {
    margin-right: 0;
}

.user-statistics-each p,
.user-statistics-each h5 {
    float: left;
    width: 100%;
    font-size: 13px;
    letter-spacing: 0;
    line-height: 17px;
}

.user-statistics-each p {
    color: var(--default-grey);
    margin-bottom: 2px;
}

.user-statistics-each h5 {
    color: var(--default-text);
    font-weight: 600;
}

.grid-row {
    float: left;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.each-grid {
    float: left;
    border-radius: 15px;
    height: 325px;
    background-color: #FFFFFF;
    box-shadow: 0 0.5px 3px 0 rgb(0 0 0 / 10%);
    display: flex;
    flex-direction: column;
    justify-content: stretch;
}

.grid-text-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding: 15px 20px 0 20px;
}

.grid-col-12 {
    width: 100%;
}

.grid-col-3 {
    margin-right: 20px;
    width: calc((100% / 3) - 14px);
}

.grid-col-3:nth-child(3n) {
    margin-right: 0;
}

.grid-text-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 21px;
}

.grid-col-12 {
    width: 100%;
}

.grid-col-6 {
    width: calc((100% / 2) - 10px);
    margin-right: 20px;
}

.grid-col-6:nth-child(2n) {
    margin-right: 0;
}

.grid-col-4 {
    width: calc((100% / 4) - 15px);
    margin-right: 20px;
}

.grid-col-4:nth-child(4n) {
    margin-right: 0;
}

.grid-col-2 {
    width: calc((100% / 5) - 16px);
    margin-right: 20px;
}

.grid-col-2:nth-child(5n) {
    margin-right: 0;
}

.grid-body-table {
    float: left;
    width: 100%;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.grid-body-table-left {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 80%;
}

.grid-body-table-right {
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
    text-align: right;
}

.user-st-completed {
    color: #00B35C;
}

.user-st-progress {
    color: #F5A623;
}

.tab-holder.user-ui {
    border-radius: 15px;
    background-color: #FFFFFF;
    box-shadow: 0 0.5px 3px 0 rgb(0 0 0 / 10%);
}

.details-wrapper.user-full {
    overflow-y: auto;
}

.pj-ra-ico:before {
    background-position: -451px -277px;
    width: 19px;
    height: 19px;
}

.pj-permission-ico:before {
    background-position: -474px -277px;
    width: 15px;
    height: 18px;
}

.pj-ra-ico:hover:before,
.sub-menu-right .pj-ra-ico.active:before {
    background-position: -451px -301px;
}

.pj-permission-ico:hover:before,
.sub-menu-right .pj-permission-ico.active:before {
    background-position: -474px -301px;
}

.details-wrapper.user-full {
    height: 100%;
}

.grid-body img {
    float: left;
    width: 100%;
}

.user-detail-card-center-right .user-detail-list-items {
    white-space: normal;
    text-overflow: unset;
    width: 100%;
    max-width: 100%;
}

.icon-in.phone-text {
    width: auto;
}

.grid-body {
    float: left;
    width: 100%;
    height: calc(100% - 48px);
    padding: 0 20px 20px;
    position: relative;
}

.grid-body .recharts-surface,
.grid-body .recharts-wrapper {
    width: 100% !important;
    height: 100% !important;
}

.filter-graph-button {
    float: left;
    border: 1px solid #DBDBDB;
    border-radius: 12.5px;
}

.filter-graph-button button:first-child {
    border-radius: 12.5px 0 0 12.5px;
}

.filter-graph-button button:last-child {
    border-radius: 0 12.5px 12.5px 0;
    border-right: 0;
}

.filter-graph-button button {
    float: left;
    border: 0;
    line-height: 0;
    padding: 0;
    height: 25px;
    color: var(--default-text);
    font-size: 12px;
    letter-spacing: 0;
    padding: 0 15px;
    background: #fff;
    border-right: 1px solid #DBDBDB;
}

.filter-graph-button .active {
    background: var(--default-color);
    color: #fff;
}

.grid-task-runrate {
    float: left;
    width: 100%;
    height: 100%;
}

.grid-body .grid-task-runrate .recharts-responsive-container {
    float: left;
    width: 100% !important;
    height: 100% !important;
}

.grid-body.grid-overflow {
    overflow: hidden;
    overflow-y: auto;
    border-radius: 0 0 30px 30px;
}

.task-stat .recharts-responsive-container {
    height: 100% !important;
}

.graph-note-panel li {
    float: left;
    line-height: 27px;
    color: var(--default-grey);
    font-size: 12px;
    letter-spacing: -0.34px;
    text-transform: CAPITALIZE;
    margin-left: 25px;
}

.graph-note-panel {
    float: left;
    margin-right: 40px;
}

.graph-note:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid var(--default-grey);
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 10px;
}

.graph-note.done:before {
    border-color: #04B287;
}

.graph-note.inprogress:before {
    border-color: #F5A623;
}

.graph-note.new:before {
    border-color: var(--default-color);
}

.graph-note.pending:before {
    border-color: #D0021B;
    ;
}

.graph-note.timelog:before {
    border-color: #B6BBD3;
}

.grid-body.full-graph {
    height: calc(100% - 54px);
}

.chart-left {
    float: left;
    width: calc(100% - 110px);
    height: 100%;
}

.chart-right {
    float: left;
    width: 90px;
    margin-left: 20px;
    height: 100%;
}

.chart-target {
    float: left;
    width: 100%;
    height: 100%;
}

.chart-target li {
    float: left;
    width: 100%;
    padding-left: 15px;
    margin-bottom: 30px;
    position: relative;
}

.chart-target li h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 2px;
}

.chart-target li p {
    float: left;
    width: 100%;
    font-size: 14px;
    color: #a9a9a9;
    line-height: 17px;
}

.chart-target li:last-child {
    margin-bottom: 0px;
}

.chart-target li:before {
    content: "";
    width: 9px;
    height: 9px;
    background: var(--default-grey);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 5px;
}

.chart-target .chart-target-new:before {
    background: var(--default-color);
}

.chart-target .chart-target-completed:before {
    background: #1BB188;
}

.chart-target .chart-target-progress:before {
    background: #F5A623;
}

.chart-target .chart-target-due:before {
    background: #D0021B;
}

.grid-body .static-mode-block {
    height: 100%;
}

.tab-holder.user-ui.user-height {
    height: calc(100% - 291px);
}

.user-height .tab-wrapper .project-summary-block {
    margin-bottom: 0;
}

.icon-in.icon-teams {
    background-position: -98px -250px;
    width: 15px;
    height: 14px;
}

.user-height .tab-list-items:hover,
.user-height .tab-list-items.active-in {
    color: var(--default-grey);
    cursor: text;
}

.user-height .tab-list-items:hover .icon-in.icon-permissions,
.user-height .tab-list-items.active-in .icon-in.icon-permissions {
    background-position: -77px -250px;
}

.user-height .tab-list-items:hover .icon-in.icon-recent,
.user-height .tab-list-items.active-in .icon-in.icon-recent {
    background-position: -11px -250px;
}

.tab-wrapper.user-no-pad {
    padding: 0;
}

.user-table-wrapper {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.user-table-btn-wrapper {
    float: left;
    width: 100%;
    height: 70px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.user-table {
    float: left;
    width: 100%;
    height: 100%;
}

.user-table-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.user-th {
    width: 20%;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    color: #565656;
    font-size: 13px;
    line-height: 15px;
    text-transform: uppercase;
    font-weight: 600;
}

.user-table-body {
    float: left;
    width: 100%;
    height: calc(100% - 40px);
}

.user-tr {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.user-tr .user-td {
    padding: 0 20px;
    width: 20%;
    height: 40px;
    display: flex;
    align-items: center;
    border-top: 1px solid #E3E5E8;
    font-size: 14px;
    color: var(--default-grey);
}

.user-tr .user-td:first-child {
    color: var(--default-text);
}

.user-tr:last-child .user-td {
    border-bottom: 1px solid #E3E5E8;
}

.user-table-wrapper.full-height-table {
    height: 100%;
}

.wid-40 .user-th:first-child {
    width: 40%;
}

.wid-40 .user-th {
    width: 15%;
}

.wid-40 .user-tr .user-td:first-child {
    width: 40%;
}

.wid-40 .user-tr .user-td {
    width: 15%;
}

.user-tr .user-td .member-image-in {
    width: 20px;
    height: 20px;
}

.user-tr .user-td .members-info-in {
    width: calc(100% - 20px);
}

.tab-wrapper.no-overflow {
    overflow-y: unset;
}

.padding-0 {
    padding: 0;
}

.permission-settings-panel {
    float: left;
    width: 100%;
    height: calc(100% - 20px);
    margin-top: 20px;
    background: #ffff;
    border-top: 1px solid rgba(64, 83, 100, .15);
}

.permission-settings-panel-header {
    float: left;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid rgba(64, 83, 100, .15);
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.permission-settings-panel-header h5 {
    float: left;
    font-size: 18px;
    color: var(--default-text);
    font-weight: 600;
}

.permission-settings-panel-header .submit-button {
    height: 30px;
    padding: 0 20px;
    min-width: auto;
}

.permission-settings-panel-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    overflow: hidden;
}

.scroll-table-setting-panel {
    float: left;
    width: 100%;
    height: 100%;
}

.table-setting-panel {
    float: left;
    width: 100%;
    height: 100%;
    overflow: auto;
    max-width: 100%;
    max-width: calc(100vw - 270px);
}

.table-setting-panel-header {
    float: left;
    width: 100%;
    height: 50px;
}

.table-row {
    float: left;
    width: 100%;
    display: flex;
}

.table-row .table-column:first-child {
    width: 290px;
    min-width: 290px;
}

.setting-each-user {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.each-user-thumb {
    float: left;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 10px;
}

.each-user-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.each-user-details {
    float: left;
    width: calc(100% - 40px);
}

.grid-container {
    display: grid;
    overflow: auto;
    width: calc(100vw - 270px);
    height: 100%;
}

.grid {
    display: flex;
    flex-wrap: nowrap;
}

.grid-col {
    width: 200px;
    min-width: 200px;
}

.grid-item--header {
    height: 50px;
    min-height: 50px;
    position: sticky;
    position: -webkit-sticky;
    background: #fff;
    top: 0;
    z-index: 9;
}

.grid-col--fixed-left {
    position: sticky;
    position: -webkit-sticky;
    left: 0;
    z-index: 9998;
    background: white;
    width: 290px;
    min-width: 290px;
    border-right: 1px solid rgba(64, 83, 100, .15);
}

.grid-col--fixed-right {
    position: sticky;
    right: 0;
    z-index: 9998;
    background: white;
}

.grid-item {
    height: 50px;
    border: 0;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(64, 83, 100, .15);
    padding: 0 15px;
    background: #fff;
}

.setting-each-user {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.grid-item p {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
}

.grid-col--fixed-left .grid-item p {
    text-transform: none;
    font-size: 16px;
    font-weight: 400;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
}

.grid-body-table-left.full-list {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
    display: block;
    -webkit-line-clamp: unset;
    -webkit-box-orient: unset;
    overflow: unset;
    max-width: 100%;
    width: 100%;
    padding-left: 25px;
    position: relative;
    word-break: break-word;
}

.grid-body-table-left.full-list .InProgress:before {
    content: "";
    background: var(--sprite-two) no-repeat -228px -362px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
    top: 0;
}

.grid-body-table-left.full-list .New:before {
    content: "";
    background: var(--sprite-two) no-repeat -208px -362px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
    top: 0;
}

.grid-body-table-left.full-list .Done:before {
    content: "";
    background: var(--sprite-two) no-repeat -188px -362px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
    top: 0;
}

.tool-tip {
    position: absolute;
    left: 25px;
    top: -3px;
    height: 25px;
    background: #fff;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    padding: 0;
    z-index: 9;
    display: flex;
    align-items: center;
    border: 1px solid #EAEAEA;
    padding: 0 20px;
    display: none;
}

.tool-tip:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 10px 5px 0;
    border-color: transparent #ffffff transparent transparent;
    position: absolute;
    left: -10px;
    top: 7px;
    z-index: 9;
}

.grid-body-table-left.full-list span:hover+.tool-tip {
    display: flex;
}

.grid-body-table-left.full-list .Done:hover+.tool-tip {
    background: #0eb58c;
    border: 0;
    color: #fff;
}

.grid-body-table-left.full-list .Done:hover+.tool-tip:before {
    border-color: transparent #0eb58c transparent transparent
}

.grid-body-table-left.full-list .InProgress:hover+.tool-tip {
    background: #f5a92c;
    border: 0;
    color: #fff;
}

.grid-body-table-left.full-list .InProgress:hover+.tool-tip:before {
    border-color: transparent #f5a92c transparent transparent
}

.grid-body-table-left.full-list .New:hover+.tool-tip {
    background: var(--default-color);
    border: 0;
    color: #fff;
}

.grid-body-table-left.full-list .New:hover+.tool-tip:before {
    border-color: transparent var(--default-color) transparent transparent
}

.statics-loader {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
    background: #ffffff;
    z-index: 9;
}

.permission-settings-panel .user-table-header .user-th {
    width: 150px;
    flex-shrink: 0;
}

.permission-settings-panel .user-table-body .user-td {
    width: auto;
    min-width: 150px;
    flex-shrink: 0;
}

.permission-settings-panel .user-table-header .user-th:first-child {
    width: 240px;
    flex-shrink: 0;
}

.permission-settings-panel .user-table-body .user-td:first-child {
    width: 240px;
    flex-shrink: 0;
}

.permission-settings.permission-main {
    max-width: calc(100vw - 270px);
    float: left;
    width: 100%;
    height: 100%;
}

.permission-settings-panel-body {
    overflow: auto;
}

.permission-settings-panel-body .user-table-wrapper {
    height: 100%;
}

.permission-main .permission-settings-panel {
    height: calc(100% - 80px);
}

.permission-settings-panel .user-tr:first-child .user-td {
    border-top: 0;
}

.permission-settings-panel .user-tr .user-td {
    height: 50px;
}

.permission-checkbox {
    float: left;
    height: 30px;
    min-width: 100px;
    border: 1px solid #E3E5E8;
    padding: 0 10px;
    position: relative;
    background: #fff;
    display: flex;
    align-items: center;
    border-radius: 19px;
    justify-content: center;
}

.permission-checkbox input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 9;
}

.permission-checkbox.active {
    border: 1px solid var(--default-color);
    color: #fff;
    background: var(--default-color);
}

.permission-checkbox:hover {
    border: 1px solid var(--default-color);
    color: var(--default-color);
}

.permission-checkbox.active:hover {
    border: 1px solid var(--default-color);
    color: #fff;
    background: var(--default-color);
}

.permission-checkbox.active label:before {
    content: "";
    width: 15px;
    height: 15px;
    background: #fff;
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
}

.permission-checkbox label {
    float: left;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 8;
}

.permission-checkbox.active label:after {
    content: "";
    background: var(--sprite-two) no-repeat -6px -265px;
    width: 10px;
    height: 7px;
    position: absolute;
    left: 2px;
    top: 4px;
}

.each-user-details p {
    word-break: break-word;
}

.permission-settings-panel-body .user-table-body {
    height: 100%;
}

.permission-settings-panel .user-tr .user-td:first-child {
    position: sticky;
    position: -webkit-sticky;
    left: 0;
    top: 0;
    z-index: 9998;
    background: #fff;
}

.permission-settings-panel .user-tr {
    width: auto;
}

.project-content-wrapper.group-height {
    height: calc(100vh - 130px);
}

.modal-body.small-height-mod {
    height: 350px;
    overflow-y: auto;
}

.has-submodule-container {
    float: left;
    width: 100%;
}

.has-submodule-container .user-tr .user-td:first-child {
    padding-left: 45px;
}

.has-submodule-container .user-tr .user-td:first-child:before {
    content: "";
    background: var(--sprite-one) no-repeat -429px -252px;
    width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 8px;
}

.has-submodule-container .user-tr:last-child .user-td {
    border-bottom: 0;
}

.wid-33 .user-th {
    width: 33.33%;
}

.wid-33 .user-tr .user-td {
    width: 33.33%;
}

.icon-groups {
    background-position: -135px -407px;
    width: 19px;
    height: 14px;
}

.selective-mail-box {
    float: left;
    width: 100%;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.selective-mail-box .layer-btn {
    margin: 0;
    background: transparent;
    color: var(--default-color);
    height: 35px;
    font-size: 14px;
}

.bsy-table.bsy-team-set tbody tr td:first-child {
    font-size: 14px;
    color: var(--default-text);
    font-weight: 600;
    width: 3%;
    cursor: auto;
}

.bsy-team-set tbody tr td .select-chk-block .control {
    font-size: 14px;
}

.bsy-table.bsy-team-set {
    border-collapse: separate;
    border-spacing: 0 10px;
    margin-top: -10px;
}

.bsy-table.bsy-team-set tbody tr td {
    border-bottom: 1px solid #e4e4e4;
    height: 75px;
}

.bsy-table tbody tr td.sm-wid {
    width: 1%;
}

.bsy-table.bsy-team-set tbody tr td .select-box {
    max-width: 250px;
    float: right;
}

.bsy-table.bsy-team-set tbody tr td .select-box select {
    height: 35px;
}

.form-set-container {
    float: right;
    display: flex;
    align-items: center;
}

.form-set-container .task-input-block {
    margin-bottom: 0;
    margin-left: 9px;
}

.form-set-container .task-input-block .form-control {
    height: 35px;
    font-size: 14px;
    border: 1px solid #e4e5e9;
}

.general-btn.sm-btn {
    min-width: auto;
}

.bsy-table.bsy-team-set tbody tr td:first-child .select-box {
    float: left;
}

.bsy-table.bsy-team-set tbody tr td .form-set-container .select-box {
    margin-left: 10px;
}

.roles {
    background: var(--sprite-two) no-repeat -320px -301px;
    width: 18px;
    height: 18px;
}

.permission {
    background-position: -77px -250px;
    width: 12px;
    height: 14px;
}

.permission-settings.permission-main.full-width {
    width: 100%;
    max-width: calc(100vw - 50px);
}

/*------ User Details End ------*/

/*------ Chat ------*/

.chat-option-section-holder {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.chat-option-section {
    float: left;
    width: 100%;
    margin-bottom: 28px;
}

.chat-header-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    padding: 0 20px 0 20px;
}

.chat-type-head {
    float: left;
    color: var(--category-head);
    font-size: 11px;
    line-height: 17px;
    /* text-shadow: 0 1px 4px rgba(0,0,0,.2); */
    display: flex;
    text-transform: uppercase;
}

.loader-span {
    margin-left: 5px;
    width: 16px;
    height: 16px;
}

.loader-span img {
    width: 16px;
    height: 16px;
}

.chat-option-list {
    float: left;
    width: 100%;
}

.chat-option-list-items {
    float: left;
    width: 100%;
    padding: 0 20px 0 20px;
    cursor: pointer;
}

.chat-list-user {
    float: left;
    width: 100%;
    position: relative;
    color: var(--sub-category-head);
    font-size: 14px;
    line-height: 31px;
    padding-left: 21px;
    display: flex;
    align-items: center;
}

.chat-list-user.new-message-in {
    color: #ffffff;
    font-weight: 500;
}

.chat-option-group .chat-list-user:before {
    content: '';
    background: var(--sprite-one) no-repeat;
    background-position: -316px -470px;
    width: 13px;
    height: 13px;
    position: absolute;
    left: 0;
    top: calc(50% - 7.5px);
    opacity: .5;
}

.chat-option-group .chat-option-list-items:hover .chat-list-user:before,
.chat-option-group .chat-option-list-items.chat-selected .chat-list-user:before,
.chat-option-group .chat-option-list-items .chat-list-user.new-message-in:before,
.chat-option-group .chat-option-list-items.chat-selected .chat-list-user.new-message-in:before {
    background-position: -316px -470px;
    opacity: 1;
}

.add-button {
    border: 0;
    padding: 0;
    line-height: 0;
    cursor: pointer;
}

.icon-in.icon-add-in {
    background-position: -469px -378px;
    width: 17px;
    height: 17px;
    opacity: .5;
}

.chat-option-user .chat-list-user:before {
    content: '';
    width: 9px;
    height: 9px;
    border: 2px solid var(--sub-category-head);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: calc(50% - 4.5px);
}

.chat-option-user .chat-option-list-items.user-active .chat-list-user:before {
    background-color: #0f9d58;
    border-color: #0f9d58;
}

.noti_count {
    position: relative;
    top: -1px;
}

.chat-new-count {
    height: 16px;
    width: 16px;
    border-radius: 4px;
    background-color: var(--chat-notify);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-notify-color);
    margin-left: 10px;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 600;
}

.task-head-text {
    color: #fff;
    float: left;
    font-size: 16px;
}

.modal-option-button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.full-panel.form-group {
    width: 100%;
    margin-bottom: 0;
}

.search-input-all {
    width: 100%;
    position: relative;
    display: inline-block;
}

.modal-text-field {
    float: left;
    width: 100%;
    height: 40px;
    border: 1px solid #e4e5e9;
    padding: 0 15px;
    font-size: 14px;
    border-radius: 3px;
}

.full-panel .form-group .form-control {
    min-height: 50px;
    border-radius: 0;
    padding: 0;
    border: 1px solid #eceff1;
    font-size: 14px;
    color: var(--default-text);
    box-shadow: none;
}

.search-text-field,
.form-group .form-control.search-text-field {
    padding-right: 30px;
}

.full-panel.form-group .form-control {
    padding: 0 40px 0 20px;
}

.icon-in.icon-search-in {
    background-position: -187px -72px;
    width: 11px;
    height: 11px;
    position: absolute;
    right: 12px;
    top: calc(50% - 5.5px);
}

.scrollable-panel-holder {
    float: left;
    width: 100%;
    height: calc(100% - 58px);
}

.scrollable-panel {
    height: 300px;
    max-height: 100%;
    width: 100%;
    float: left;
    overflow-y: auto;
}

.member-each {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    border: 1px solid #eaeaea;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    float: left;
    width: 100%;
    cursor: pointer;
}

.members-details {
    width: auto;
    float: left;
    display: flex;
    align-items: center;
}

.members-details {
    position: relative;
}

.member-image-in {
    width: 30px;
    height: 30px;
    float: left;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    object-fit: cover;
    position: relative;
}

.member-image-in img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.selected-user .member-image-in:before {
    content: "";
    width: 100%;
    height: 100%;
    background: #60AD6C;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    z-index: 7;
}

.selected-user .member-image-in:after {
    content: "";
    background: var(--sprite-one) no-repeat -458px -212px;
    width: 14px;
    height: 11px;
    position: absolute;
    left: calc(50% - 7px);
    top: 10px;
    z-index: 8;
}

.selected-user .member-name {
    color: #60AD6C;
}

.members-info-in {
    width: calc(100% - 30px);
    padding-left: 10px;
    float: left;
}

.member-name {
    float: left;
    width: 100%;
    font-size: 14px;
    transition: .3s ease-out;
    color: var(--default-text);
    font-weight: 600;
    line-height: 15px;
    margin-bottom: 3px;
}

.member-role {
    float: left;
    width: 100%;
    font-size: 12px;
    color: var(--default-grey);
    font-weight: 400;
}

.member-each:hover .chat-date-indic:before {
    content: "";
    width: 16px;
    height: 16px;
    background: url(images/enter-arrow.png) no-repeat;
    background-size: 100%;
    display: inline-block;
}

.chat-option-list-items:hover {
    background: var(--chat-hover);
}

.chat-option-list-items.chat-selected {
    background-color: var(--chat-hover);
}

.chat-option-list-items:hover .chat-list-user,
.chat-option-list-items.chat-selected .chat-list-user {
    color: #ffffff;
}

.mobile-header-hide {
    display: block;
}

.chat-profile-img.userImage {
    float: left;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    padding: 2px;
    border: 1px solid var(--default-color);
    margin-right: 10px;
}

.chat-profile-img.userImage img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.chat-profile-description {
    float: left;
    width: calc(100% - 47px);
}

.userName {
    float: left;
    width: 100%;
    opacity: 0.9;
    color: #333333;
    font-size: 16px;
    font-weight: 600;
    line-height: 21px;
    margin-bottom: 2px;
}

.designation {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 15px;
    max-width: 255px;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.chat-com {
    cursor: pointer;
}

.info-ico:before {
    background-position: -240px -404px;
    width: 18px;
    height: 18px;
}

.ico-lib.info-ico:hover:before {
    background-position: -240px -379px;
}

.chat-option-user .chat-selected .chat-list-user:before {
    border-color: #fff;
}

.chat-option-user .chat-option-list-items.chat-selected.user-active .chat-list-user:before {
    background-color: #ffffff;
    border-color: #ffffff;
}

.side-panel-active-header {
    float: left;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #dfe0e4;
    padding: 0 20px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
}

.side-panel-active-header .subheader {
    float: left;
    font-weight: 600;
    color: var(--default-text);
    font-size: 16px;
    letter-spacing: 0.5px;
    line-height: 19px;
    text-transform: uppercase;
}

.side-bar-panel .card.side-panel {
    padding: 0;
    text-align: left;
    width: 100%;
    height: auto;
    color: #85999D;
    font-size: 14px;
    border-radius: 0;
}

.side-bar-panel .accordion {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.side-bar-panel .card.side-panel {
    border: 1px solid #dfe0e4;
    border-left: 0;
    border-right: 0;
    border-top: 0;
}

.side-bar-panel .card.side-panel:first-child {
    border-top: 0;
}

.side-bar-panel .card.side-panel .card-header {
    border-bottom: 1px solid #dfe0e4;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
    color: var(--default-grey);
    letter-spacing: .2px;
    position: relative;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.side-bar-panel .card.side-panel .card-body {
    float: left;
    width: 100%;
    padding: 20;
}

.title-bl {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.title-bl p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    color: #bdbdbd;
}

.title-bl:last-child {
    margin-bottom: 0;
}

.title-bl h5 {
    float: left;
    width: 100%;
    font-weight: 500;
    margin-bottom: 5px;
    color: var(--default-text);
}

.side-bar-panel .card.side-panel .card-header:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 4px 0;
    border-color: var(--default-grey) transparent transparent transparent;
    position: absolute;
    top: calc(50% - 3px);
    right: 20px;
    transition: .4s ease-out;
    transform: rotate(-90deg);
}

.chat-click {
    float: left;
    width: 100%;
    border: 1px solid transparent;
    border-right: 0;
    display: flex;
    align-items: center;
    position: relative;
    transition: .4s ease-out;
    padding: 12px;
}

.side-bar-panel .card-body .chat-click {
    padding: 0;
}

.chat-list-left {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.chat-user-thumb {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 12px;
    position: relative;
}

.chat-user-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.chat-content-det {
    float: left;
    width: calc(100% - 52px);
    padding-right: 50px;
}

.chat-content-det {
    padding-right: 80px;
}

.chat-content-det h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    color: #2E3243;
    font-size: 14px;
    line-height: 19px;
    margin-bottom: 3px;
}

.chat-content-det p {
    float: left;
    width: 100%;
    font-size: 12px;
    color: var(--default-grey);
}

.side-bar-panel .card-body .ind-chat-list {
    margin-bottom: 13px;
    float: left;
    width: 100%;
}

.side-bar-panel .side-panel.card .collapse.show {
    float: left;
    width: 100%;
    height: calc(100vh - 200px);
}

.side-bar-panel .side-panel-active {
    float: left;
    width: 100%;
    height: 100%;
}

.side-bar-panel .side-panel-active>div:first-child {
    float: left;
    width: 100%;
    height: 100%;
}

.side-bar-panel .card-body .ind-chat-list:last-child {
    margin-bottom: 0;
}

.side-panel.general-btn.btn.btn-primary {
    margin: 0;
    background: var(--default-color);
    border: 1px solid var(--default-color);
    color: #fff;
    height: 30px;
    min-width: 90px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    margin-left: 0;
    padding: 0 10px;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

.side-panel.general-btn.btn.btn-primary:hover {
    background: var(--hover-color);
    border-color: var(--hover-color);
}

.title-bl .fa-pencil {
    color: #F89A00;
}

.general-btn-sm {
    margin: 0;
    background: var(--default-color);
    border: 1px solid var(--default-color);
    color: #fff;
    height: 30px;
    min-width: 90px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    margin-left: 0;
    padding: 0 10px;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    transition: .3s ease-out;
}

.remove-button-block {
    position: absolute;
    right: 0;
    top: calc(50% - 15px);
}

.general-btn-sm:hover {
    background: var(--hover-color);
    border-color: var(--hover-color);
}

.chat-panel-holder {
    float: left;
    width: 100%;
    height: calc(100vh - 60px);
}

.chat-all-wrapper {
    height: 100%;
}

.chat-in-panel {
    height: calc(100% - 90px);
    display: flex;
    align-items: flex-end;
    overflow: auto;
    float: left;
    width: 100%;
    padding: 20px;
}

.def-text {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.def-text h5 {
    float: left;
    width: 100%;
    color: #bdbdbd;
    font-size: 40px;
    font-weight: 100;
    line-height: 48px;
    text-align: center;
}

.def-text h5 span {
    font-weight: 600;
}

.def-text p {
    color: #bdbdbd;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    font-weight: 300;
}

.chat-in-content {
    height: auto;
    width: 100%;
    max-height: 100%;
}

.chat-start-box,
.chat-date-indicator {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 5px 0px;
    float: left;
}

.chat-starter-text,
.chat-date-in {
    background: var(--chat-time);
    height: 25px;
    font-size: 12px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    color: var(--default-grey);
    box-shadow: var(--chat-time-shadow);
}

.message-in-box {
    float: right;
    width: calc(100% - 50px);
    margin: 5px 0px;
    background: var(--white);
    padding: 10px;
    border-radius: 3px;
    background-color: var(--white);
    border: 1px solid #e3e5e9;
    /* background-color: #C4D1FB; */
}

.user-image-holder {
    float: left;
    margin-right: 10px;
}

.chat-user-image-in {
    width: 32px;
    height: 32px;
    float: left;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
    object-fit: cover;
}

.chat-message-detail {
    width: calc(100% - 32px);
    float: left;
    padding: 0px 0px 0px 10px;
}

.chat-user-name {
    float: left;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
    color: #333333;
}

.chat-time-in {
    float: right;
    font-size: 12px !important;
    color: #bdbdbd;
    line-height: 13px;
    text-align: right;
    margin-left: 10px;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.chat-message-in {
    color: var(--default-text);
    font-size: 16px;
    line-height: 22px;
    width: 100%;
    display: inline-block;
    word-break: break-word;
}

.brown {
    color: #C27132 !important;
}

.chat-type-panel {
    float: left;
    width: 100%;
    padding: 20px;
    position: relative;
}

.chat-text-area {
    padding: 5px 15px;
    background: #fff;
    border: 1px solid #dee0e3;
    border-radius: 4px;
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.chat-attach-button {
    float: left;
    width: 18px;
    height: 16px;
    background-color: transparent;
    border: 0;
    border-top: 2px solid #6b7577;
    position: relative;
    cursor: pointer;
    transition: .4s ease-out;
    padding: 0;
}

.chat-attach-button:before {
    content: "";
    width: 18px;
    height: 2px;
    background: #6b7577;
    position: absolute;
    left: 0;
    top: 5px;
    transition: .4s ease-out;
}

.chat-attach-button:after {
    content: "";
    width: 18px;
    height: 2px;
    background: #6b7577;
    position: absolute;
    left: 0;
    bottom: 0;
    transition: .4s ease-out;
}

.chat-attach-button:hover:before,
.chat-attach-button:hover:after {
    background: var(--default-color);
}

.chat-attach-button:hover {
    border-top: 2px solid var(--default-color);
}

.message-input-in {
    width: calc(100% - 40px);
    height: 35px;
    border: 1px solid transparent;
    padding: 0 10px;
    border-radius: 3px;
    font-size: 14px;
}

.chat-send-btn-emoji {
    float: left;
    width: 20px;
    height: 20px;
    background-color: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
    transition: .4s ease-out;
    margin-right: 10px;
}

.chat-send-btn {
    float: left;
    width: 19px;
    height: 16px;
    background-color: transparent;
    border: 0;
    background: var(--sprite-two) no-repeat -293px -117px;
    padding: 0;
    cursor: pointer;
    transition: .4s ease-out;
}

.sub-disscussion .chat-message-detail {
    width: 100%;
}

.chat-mob-header {
    display: none;
}

.message-in-box.url-panel {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0px;
}

.ind-disscussion-sub {
    float: left;
    width: 100%;
    position: relative;
    padding-right: 62px;
}

.url-block {
    float: left;
    width: 100%;
    padding-left: 9px;
    position: relative;
    display: flex;
    align-items: center;
    padding-right: 0;
    margin-bottom: 10px;
}

.ind-disscussion-sub.url-lk {
    padding-right: 0;
    margin-bottom: 10px;
    padding: 15px;
    background-color: #fafafa;
    border: 1px solid #e3e5e9;
    border-left: 5px solid green;
    border-radius: 3px;
}

.url-block:before {
    content: "";
    width: 3px;
    height: 100%;
    background: var(--default-color)40;
    position: absolute;
    top: 0;
    left: 0;
}

.url-details {
    float: left;
    width: calc(100% - 85px);
}

.url-img {
    float: left;
    width: 70px;
    height: 70px;
    margin-left: 15px;
    border-radius: 3px;
    border: 2px solid #cde6f8;
    background-color: #fff;
}

.url-details p {
    color: #595959;
    font-size: 14px;
    margin-bottom: 5px;
    line-height: normal;
}

.ind-disscussion-sub .site_name {
    font-weight: 500;
    color: var(--default-color);
    margin-bottom: 5px;
    font-size: 14px;
}

.ind-disscussion-sub .site_name {
    font-weight: 500;
    color: var(--default-color);
    margin-bottom: 5px;
    font-size: 14px;
}

.url-img img {
    width: 100%;
    float: left;
    width: 100% !important;
    height: 100%;
    object-fit: cover;
    border-radius: 3px;
}

.url-details p a {
    transition: .3s ease-out;
    font-weight: 600;
}

.url-details .description {
    color: var(--default-grey);
    font-size: 12px;
    margin-bottom: 5px;
}

.url-details .time {
    color: #adadad;
}

.chat-message-in a {
    color: var(--default-color);
    font-size: 16px;
    line-height: 19px;
}

.file-bl-wrap {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    /* padding-left: 50px; */
}

.attach-chat-block {
    float: left;
    width: 555px;
    display: block;
    border: 1px solid #eee;
    border-radius: 3px;
    height: auto;
    min-height: 77px;
    padding: 15px;
    background: #fafafa;
    margin: 5px 0px;
    cursor: pointer;
    position: relative;
    border: 1px solid #e3e5e9;
}

.attachment-block-left {
    float: left;
    width: 45px;
    height: 45px;
    border: 1px solid #dedede;
    padding: 7px;
    border-radius: 3px;
    margin-right: 15px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.attachment-block-left:before {
    content: "";
    width: 25px;
    height: 25px;
    position: absolute;
    right: -5px;
    bottom: -5px;
    background: var(--default-color);
    border-radius: 50%;
    border: 2px solid #fff;
    opacity: 0;
    z-index: 6;
}

.attachment-block-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 3px;
}

.attachment-block-right {
    float: left;
    width: calc(100% - 60px);
    height: 100%;
    position: relative;
}

.attachment-block-right h5 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 7px;
    line-height: normal;
    color: var(--default-text);
    display: block;
    max-width: 100%;
    word-break: break-word;
}

.attachment-block-right p {
    font-size: 12px;
    color: var(--default-grey);
}

.attachment-block-right p span {
    margin-left: 5px;
}

.format-span {
    text-transform: uppercase;
}

.format-view {
    display: none;
}

.attachment-block-left:after {
    content: "";
    background: url(images/download-arrow.png) no-repeat;
    width: 11px;
    height: 11px;
    position: absolute;
    bottom: 2px;
    right: 2px;
    opacity: 0;
    background-size: 100%;
    z-index: 7;
}

.attach-chat-block:hover .attachment-block-left:after {
    opacity: 1;
}

.attach-chat-block:hover .attachment-block-left:before {
    opacity: 1;
}

.attach-chat-block:hover .format-view {
    display: inline-block;
}

.attach-chat-block.pdf-block {
    height: 300px;
}

.pdf-preview-holder {
    float: left;
    width: 100%;
    padding-bottom: 10px;
}

.pdf-preview-wrapper {
    float: left;
    width: 100%;
    border: 1px solid #dedede;
    max-height: 212px;
    height: 212px;
    overflow: hidden;
    border-radius: 5px;
    padding: 10px;
    font-size: 14px;
    color: var(--default-text);
}

.attachment-pdf-block,
.react-pdf__Document {
    float: left;
    width: 100%;
}

.react-pdf__Page__canvas {
    float: left;
    width: 100% !important;
    height: 100% !important;
}

.preview-btn-block {
    position: absolute;
    right: 0;
    top: 11px;
    display: none;
}

.attach-chat-block:hover .preview-btn-block {
    display: block;
}

.preview-ico,
.down-ico {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    border: 1px solid #dedede;
    border-radius: 5px;
    width: 28px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
    margin-left: 5px;
}

.down-ico:before {
    background-position: -142px -162px;
    width: 14px;
    height: 14px;
}

.format {
    width: 100%;
    height: 100%;
    background: rgba(177, 190, 205, 0.75);
    border-radius: 3px;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
    max-width: 43px;
    padding-bottom: 12px;
}

.format:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 0 15px;
    border-color: transparent transparent transparent #b1becd;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 0 0 0 3px;
}

.format:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 0 15px;
    border-color: #fafafa transparent transparent transparent;
    position: absolute;
    right: 0;
    top: 0;
}

.pdf:before {
    border-color: transparent transparent transparent #c64542;
}

.format.pdf {
    background-color: rgba(198, 69, 66, .75);
}

.xlx:before,
.xlsx:before,
.xls:before {
    border-color: transparent transparent transparent #3d7f47;
}

.format.xlx,
.format.xlsx,
.format.xls {
    background-color: rgba(61, 127, 71, .75);
}

.jpg:before,
.jpeg:before,
.png:before {
    border-color: transparent transparent transparent #3a9ab9;
}

.format.jpg,
.format.jpeg,
.format.png {
    background-color: rgba(58, 154, 185, .75);
}

.mp4:before,
.m4v:before,
.avi:before,
.mpg:before,
.flv:before {
    border-color: transparent transparent transparent #b5466c;
}

.format.mp4,
.format.m4v,
.format.avi,
.format.mpg,
.format.flv {
    background-color: rgba(181, 70, 108, .75);
}

.mp3:before,
.ogg:before,
.wav:before,
.wma:before {
    border-color: transparent transparent transparent #3d6546;
}

.format.mp3,
.format.ogg,
.format.wav,
.format.wma {
    background-color: #60ad6c;
}

.bmp:before {
    border-color: transparent transparent transparent #ae7d2d;
}

.format.bmp {
    background-color: rgba(174, 125, 45, .75);
}

.docx:before,
.doc:before {
    border-color: transparent transparent transparent #3d699b;
}

.format.docx,
.format.doc {
    background-color: rgba(61, 105, 155, .75);
}

.attachment-block-left .format {
    width: 25px;
    font-size: 7px;
    padding-bottom: 9px;
}

.attachment-block-left .format:before {
    border-width: 10px 0 0 10px;
}

.attachment-block-left .format:after {
    border-width: 10px 0 0 10px;
}

.upload-comment {
    float: left;
    width: 100%;
    height: 85px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    padding: 15px;
    font-size: 14px;
    resize: none;
    margin-bottom: 20px;
}

.dropzone {
    background-color: #fafafa;
    outline: none;
    transition: border .24s ease-in-out;
    border-radius: 2px;
    padding: 60px;
    flex: 1;
    display: flex;
    flex-direction: column;
    color: #bdbdbd;
    border: 1px dashed #E4E6E9;
    color: var(--default-color);
    font-size: 28px;
    font-weight: 100;
    padding: 0;
    min-height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 20px;
    text-align: center;
}

.button-block {
    float: left;
    width: 100%;
    margin-top: 20px;
}

.preview-area {
    float: left;
    width: 100%;
    height: 350px;
    display: flex;
    align-items: center;
}

.preview-area.chat-panel {
    justify-content: center;
}

.preview-area img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.preview-area video {
    float: left;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}

.preview-area .chat-image-panel {
    width: auto;
    height: auto;
    max-width: 350px;
    max-height: 350px;
}

.preview-options {
    float: left;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.resources-filters-icons {
    float: left;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 10px;
    margin-right: 10px;
}

.preview-options .resources-filters-icons {
    border: 1px solid rgba(255, 255, 255, 0.1);
    opacity: 0;
    transition: .3s ease-out;
}

.resources-filters-icons li {
    float: left;
    border-left: 1px solid rgba(64, 83, 100, 0.15);
}

.resources-filters-icons li:first-child,
.resources-filters-icons li:first-child a,
.resources-filters-icons li:first-child nav {
    border-radius: 10px 0 0 10px;
    border-left: 0;
}

.preview-options .resources-filters-icons li {
    border-left: 1px solid #424242;
}

.resources-filters-icons li a,
.resources-filters-icons li nav {
    float: left;
    height: 38px;
    width: 60px;
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.preview-options .resources-filters-icons li a,
.preview-options .resources-filters-icons li nav {
    background: #2E3243;
}

.resources-filters-icons li:last-child,
.resources-filters-icons li:last-child a,
.resources-filters-icons li:last-child nav {
    border-radius: 0 10px 10px 0;
}

.resources-filters-icons li:first-child,
.resources-filters-icons li:first-child a,
.resources-filters-icons li:first-child nav {
    border-left: 0;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.rc-arrow:before {
    background-position: -123px -162px;
    width: 14px;
    height: 14px;
}

.rc-download:before {
    background-position: -142px -162px;
    width: 14px;
    height: 14px;
}

.rc-chain:before {
    background-position: -50px -162px;
    width: 14px;
    height: 14px;
}

.rc-delete:before {
    background-position: -72px -162px;
    width: 12px;
    height: 14px;
}

.preview-options .rc-arrow:before {
    background-position: -50px -182px;
}

.preview-options .rc-download:before {
    background-position: -70px -182px;
}

.preview-options .rc-chain:before {
    background-position: -92px -182px;
}

.preview-options .rc-delete:before {
    background-position: -112px -182px;
}

.modal-body:hover .preview-options .resources-filters-icons {
    opacity: 1;
}

.file-upload-lister {
    float: left;
    width: 100%;
    display: flex;
    max-width: 100%;
    overflow: hidden;
    overflow-x: auto;
}

.file-upload-lister .attach-chat-block {
    display: inline-block;
    width: auto;
    flex-shrink: 0;
    margin-right: 20px;
}

.attach-close-pop {
    background: var(--sprite-one) no-repeat -244px -183px;
    width: 17px;
    height: 17px;
    padding: 0;
    line-height: 0;
    border: 0;
    position: absolute;
    right: 20px;
    top: 29px;
    cursor: pointer;
    z-index: 99;
}

.member-each:hover .member-name {
    color: var(--default-color);
}

.chat-user {
    display: block;
    max-width: 90%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.chat-selected .chat-new-count {
    background: var(--chat-notify-hover);
    color: var(--chat-notify-color-hover);
}

.pin-cl:before {
    background-position: -215px -249px;
    width: 14px;
    height: 15px;
}

.audio-cl:before {
    background-position: -241px -249px;
    width: 14px;
    height: 14px;
}

.video-cl:before {
    background-position: -266px -251px;
    width: 18px;
    height: 10px;
}

.add-us:before {
    background-position: -187px -249px;
    width: 18px;
    height: 14px;
}

.chat-list-user .chat-user {
    margin: 0;
    padding-left: 0;
}

.general-remove-sm:before {
    content: "";
    background: var(--sprite-one) no-repeat -442px -123px;
    width: 13px;
    height: 15px;
    display: inline-block;
    background-color: transparent;
    border: 0;
}

.general-remove-sm {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 8px;
}

.side-panel-active-header.chat-detail-header .subheader {
    float: left;
    font-weight: 600;
    color: var(--default-text);
    font-size: 16px;
    letter-spacing: 0.5px;
    line-height: 19px;
    text-transform: uppercase;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 200px;
    white-space: nowrap;
}

.trova-header {
    float: left;
    width: 100%;
    height: 40px;
    background: #191B26;
    padding: 0 17px;
}

.trova-widget-div {
    border-radius: 0;
}

.trova-chat-header-brand img {
    display: none;
}

.trova-chat-header-brand:before {
    content: "";
    background: url(../images/sprite-v1.svg) no-repeat -466px -141px;
    width: 21px;
    height: 15px;
    margin-right: 8px;
}

.chat-text-area .emoji-mart-scroll {
    overflow-x: hidden;
}

.side-menu-right .full-panel.form-group .form-control {
    padding: 15px;
}

.side-menu-right .full-panel.form-group textarea.form-control {
    min-height: 115px;
    resize: none;
}

.pdf-preview-holder .attachment-block-right {
    padding-right: 66px;
}

.drop-cont .attachment-block-right {
    padding-right: 66px;
}

.buisiness-reply-box {
    float: left;
    width: 100%;
    display: flex;
    margin-top: 15px;
    border-top: 1px solid #E3E5E8;
    padding-top: 15px;
}

.buisiness-reply-box p {
    margin-right: 11px;
}

.icon-task-assign:before {
    background-position: -334px -159px;
    width: 14px;
    height: 14px;
}

.user-image-holder {
    margin-bottom: 10px;
}

.buisiness-reply-box.reply-box {
    padding-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.buisiness-reply-box.reply-box p {
    font-size: 14px;
    color: var(--default-grey);
    display: flex;
    align-items: center;
    margin: 0;
}

.buisiness-reply-box.reply-box p:before {
    margin-right: 7px;
}

.reply-cl:before {
    background-position: -38px -66px;
    width: 13px;
    height: 11px;
}

.message-in-box.reply-msg .message-in-box {
    box-shadow: none;
    border: 1px solid #e3e5e8;
    border-left: 5px solid #d4eaf5;
    background: #ecf0f142;
    width: 100%;
    margin-top: 12px;
    margin-bottom: 10px;
    position: relative;
}

.message-in-box.reply-msg {
    margin-left: 53px;
    width: calc(100% - 50px);
    background: var(--col-active);
}

.message-in-box.reply-msg>.user-image-holder {
    margin-bottom: 0;
}

.message-in-box.reply-msg .message-in-box>.chat-message-in {
    padding-left: 50px;
}

.drop-cont .dropzone {
    border: 1px dashed #E4E6E9 !important;
}

.board-modal-body-right-container .board-modal-body-right.group-entity {
    height: 100%;
}

.group-entity-container {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0 20px 20px;
    overflow-y: auto;
}

.group-entity-container table {
    float: left;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 4px;
    position: relative;
    top: -4px;
}

.group-entity-container table thead tr th {
    padding: 12px 15px;
    text-transform: uppercase;
    color: #565656;
    font-size: 14px;
    line-height: 15px;
    font-weight: 600;
    position: sticky;
    top: 0;
    left: 0;
    background: #ecf0f1;
}

.group-entity-container table tbody tr td {
    padding: 12px 15px;
    border: 1px solid #e4e5e9;
    border-right: 0;
    border-left: 0;
    background: #fff;
    color: #555;
    font-size: 14px;
    vertical-align: middle;
}

.group-entity-container table tbody tr td:first-child {
    border-left: 1px solid #e4e5e9;
    border-radius: 10px 0 0 10px;
}

.group-entity-container table tbody tr td:last-child {
    border-right: 1px solid #e4e5e9;
    border-radius: 0 10px 10px 0;
}

.group-entity-container table tbody tr:hover td .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.reply-textbox {
    float: left;
    width: 100%;
    position: relative;
}

.reply-textbox textarea {
    float: left;
    width: 100% !important;
    min-height: 100px;
    margin: 0;
    resize: auto;
    max-width: 100%;
    color: var(--default-text);
    font-size: 16px;
    padding: 0 30px 0 0;
    background: transparent;
    border: 0;
}

.message-in-box.reply-msg .message-in-box:first-child {
    margin-top: 0;
}

.reply-close {
    float: left;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 5px;
    top: 5px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.reply-close:before {
    content: "";
    background: var(--sprite-two) no-repeat -267px -410px;
    width: 11px;
    height: 11px;
    display: inline-block;
    zoom: 1.5
}

.attach-res {
    float: left;
    width: 20px;
    height: 20px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.attach-res:before {
    content: "";
    background: var(--sprite-two) no-repeat -221px -118px;
    width: 17px;
    height: 14px;
    display: inline-block;
}

.reply-complete-area {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 15px 0 0 0;
}

.white-modal.full-modal-res {
    padding: 0;
}

.white-modal.full-modal-res .modal-dialog {
    max-width: 100%;
    margin: 0;
    height: 100%;
}

.white-modal.full-modal-res .modal-content {
    height: 100%;
}

.white-modal.full-modal-res .modal-body {
    height: calc(100% - 60px);
    padding: 0;
    overflow: hidden;
}

.full-modal-res .modal-body .resources-list {
    height: calc(100% - 78px);
}

.full-modal-res .bsy-modal.large-modal .modal-lg {
    max-width: 1000px;
    margin: 1.75rem auto;
    height: auto;
}

.full-modal-res .bsy-modal.large-modal .modal-body {
    overflow-y: auto;
}

.chat-set-ico:before {
    background-position: -374px -449px;
    width: 17px;
    height: 17px;
}

.group-entity-container table tbody tr td:first-child {
    border-left: 1px solid #e4e5e9;
    border-radius: 10px 0 0 10px;
}

.group-entity-container table tbody tr td .select-box select {
    height: 30px;
}

.value-box {
    float: left;
    width: 100%;
}

.value-box p {
    font-size: 16px;
}

.info-ico-layer {
    width: 13px;
    height: 13px;
    background-color: transparent;
    background: url(images/info-click.png) no-repeat;
    background-size: cover;
    display: inline-block;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-left: 5px;
    margin-top: 6px;
}

.info-layer {
    float: left;
    position: absolute;
    left: 4px;
    top: 25px;
    background: #fff;
    width: 330px;
    border: 1px solid #EAEAEA;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    padding: 10px 0;
    z-index: 9;
    padding: 15px;
}

.info-text-block {
    float: left;
    position: relative;
}

.info-layer p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 5px;
}

.info-layer p span {
    font-weight: 600;
}

.info-layer-details {
    float: left;
    width: calc(100% - 37px);
    padding-left: 10px;
}

.connected-fields {
    float: left;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 5px;
    position: relative;
    padding: 15px;
    margin-top: 20px;
}

.connected-fields>h5 {
    float: left;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
    background: #ecf0f1;
    position: absolute;
    left: 9px;
    top: -8px;
    color: var(--default-grey);
    padding: 0 5px;
}

.connected-fields .new-task-input {
    float: left;
    width: calc(25% - 12px);
    margin-right: 15px;
    height: auto;
}

.connected-fields .new-task-input.text-input label {
    margin-bottom: 5px;
}

.connected-fields .new-task-input:last-child {
    margin-right: 0;
}

.sepalika .chat-option-group .chat-list-user:before {
    background-position: -316px -470px;
    opacity: .5;
}

.sepalika .chat-option-group .chat-option-list-items:hover .chat-list-user:before,
.sepalika .chat-option-group .chat-option-list-items.chat-selected .chat-list-user:before,
.sepalika .chat-option-group .chat-option-list-items .chat-list-user.new-message-in:before,
.sepalika .chat-option-group .chat-option-list-items.chat-selected .chat-list-user.new-message-in:before {
    background-position: -316px -470px;
    opacity: 1;
}

.sepalika .icon-in.icon-add-in {
    background-position: -469px -378px;
    opacity: .5;
}

.sepalika .chat-option-user .chat-option-list-items:hover .chat-list-user:before {
    border-color: #ffffff;
}

.sepalika .chat-option-user .chat-option-list-items.user-active:hover .chat-list-user:before {
    background-color: #ffffff;
    border-color: #ffffff;
}

.ijsc .chat-option-group .chat-list-user:before {
    background-position: -316px -470px;
    opacity: .5;
}

.ijsc .chat-option-group .chat-option-list-items:hover .chat-list-user:before,
.ijsc .chat-option-group .chat-option-list-items.chat-selected .chat-list-user:before,
.ijsc .chat-option-group .chat-option-list-items .chat-list-user.new-message-in:before,
.ijsc .chat-option-group .chat-option-list-items.chat-selected .chat-list-user.new-message-in:before {
    background-position: -316px -470px;
    opacity: 1;
}

.ijsc .icon-in.icon-add-in {
    background-position: -469px -378px;
    opacity: .5;
}

.ijsc .chat-option-user .chat-option-list-items:hover .chat-list-user:before {
    border-color: #ffffff;
}

.ijsc .chat-option-user .chat-option-list-items.user-active:hover .chat-list-user:before {
    background-color: #ffffff;
    border-color: #ffffff;
}

.demosg .chat-option-group .chat-list-user:before,
.svjs2 .chat-option-group .chat-list-user:before,
.stratonboard .chat-option-group .chat-list-user:before {
    background-position: -316px -470px;
    opacity: .5;
}

.demosg .chat-option-group .chat-option-list-items:hover .chat-list-user:before,
.demosg .chat-option-group .chat-option-list-items.chat-selected .chat-list-user:before,
.demosg .chat-option-group .chat-option-list-items .chat-list-user.new-message-in:before,
.demosg .chat-option-group .chat-option-list-items.chat-selected .chat-list-user.new-message-in:before,
.svjs2 .chat-option-group .chat-option-list-items:hover .chat-list-user:before,
.svjs2 .chat-option-group .chat-option-list-items.chat-selected .chat-list-user:before,
.svjs2 .chat-option-group .chat-option-list-items .chat-list-user.new-message-in:before,
.svjs2 .chat-option-group .chat-option-list-items.chat-selected .chat-list-user.new-message-in:before,
.stratonboard .chat-option-group .chat-option-list-items:hover .chat-list-user:before,
.stratonboard .chat-option-group .chat-option-list-items.chat-selected .chat-list-user:before,
.stratonboard .chat-option-group .chat-option-list-items .chat-list-user.new-message-in:before,
.stratonboard .chat-option-group .chat-option-list-items.chat-selected .chat-list-user.new-message-in:before {
    background-position: -316px -470px;
    opacity: 1;
}

.demosg .icon-in.icon-add-in,
.svjs2 .icon-in.icon-add-in,
.stratonboard .icon-in.icon-add-in {
    background-position: -469px -378px;
    opacity: .5;
}

.demosg .chat-option-user .chat-option-list-items:hover .chat-list-user:before,
.svjs2 .chat-option-user .chat-option-list-items:hover .chat-list-user:before,
.stratonboard .chat-option-user .chat-option-list-items:hover .chat-list-user:before {
    border-color: #ffffff;
}

.demosg .chat-option-user .chat-option-list-items.user-active:hover .chat-list-user:before,
.svjs2 .chat-option-user .chat-option-list-items.user-active:hover .chat-list-user:before,
.stratonboard .chat-option-user .chat-option-list-items.user-active:hover .chat-list-user:before {
    background-color: #ffffff;
    border-color: #ffffff;
}

.icon-task-assign.with-text {
    font-size: 14px;
    color: var(--default-grey);
    display: flex;
    align-items: center;
}

.icon-task-assign.with-text:before {
    margin-right: 8px;
}

.chat-right-tab {
    float: left;
    width: 350px;
    height: 100%;
    background: var(--white);
    border-left: 1px solid #e2e5e7;
    display: none;
}

.with-tab chat-all-wrapper {
    width: calc(100% - 350px);
}

.chat-panel-holder.with-tab .chat-all-wrapper {
    float: left;
    width: calc(100% - 350px);
}

.chat-right-tab .nav-tabs {
    height: 45px;
    border-bottom-color: #e2e5e7;
}

.chat-right-tab .nav-tabs .nav-link {
    border-radius: 0;
    height: 45px;
    min-width: 110px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
}

.chat-right-tab .nav-tabs .nav-item.show .nav-link,
.chat-right-tab .nav-tabs .nav-link.active {
    border-color: #e2e5e7 #e2e5e7 #ffffff;
}

.chat-right-tab .nav-tabs .nav-item.show .nav-link,
.chat-right-tab .nav-tabs .nav-link.active {
    font-weight: 600;
    background: var(--white);
}

.chat-right-tab .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 45px);
    background: var(--white);
}

.chat-file-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.chat-file-header {
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #e2e5e7;
}

.chat-file-header p {
    font-size: 14px;
    color: var(--default-grey);
}

.chat-file-filter nav {
    float: left;
    font-size: 14px;
    color: var(--default-grey);
    margin-left: 10px;
    cursor: pointer;
}

.chat-file-filter nav.active {
    color: var(--default-color);
    font-weight: 600;
}

.chat-file-body {
    float: left;
    width: 100%;
    height: calc(100% - 40px);
}

.each-chat-file {
    float: left;
    width: 100%;
    padding: 20px;
    border-bottom: 1px solid #e2e5e7;
}

.each-chat-file .format {
    float: left;
    width: 25px;
    height: 31px;
    font-size: 10px;
    padding: 0 0 7px 0;
    margin: 0 10px 0 0;
}

.each-chat-file .format:after {
    border-width: 10px 0 0 10px;
    border-color: #ffffff transparent transparent transparent;
}

.each-chat-file .format:before {
    border-width: 10px 0 0 10px;
}

.chat-file-details {
    float: left;
    width: calc(100% - 35px);
    padding-right: 40px;
    position: relative;
}

.chat-file-details h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    margin-bottom: 3px;
    font-weight: 600;
}

.chat-file-details ul li {
    font-size: 12px;
    color: var(--default-grey);
    margin-bottom: 8px;
    position: relative;
}

.chat-file-details ul li:last-child {
    margin-bottom: 0;
}

.file-version {
    font-size: 12px;
    text-transform: capitalize;
    position: absolute;
    right: 0;
    top: 2px;
    color: var(--default-grey);
}

.chat-file-details ul {
    float: left;
    width: 100%;
}

.chat-file-details .approved-status li {
    padding-left: 20px;
}

.chat-file-details .approved-status li:before {
    content: "";
    width: 5px;
    height: 5px;
    background: var(--default-color);
    position: absolute;
    left: 3px;
    top: 4px;
    border-radius: 50%;
}

.chat-file-details .approved-status li:after {
    content: "";
    width: 1px;
    height: 100%;
    background: var(--default-color);
    position: absolute;
    left: 5px;
    top: 9px;
}

.chat-file-details .approved-status li.approved:before {
    width: 11px;
    height: 11px;
    left: 0;
    top: 1px;
    background: #fff;
    border: 1px solid var(--default-color);
}

.chat-file-details .approved-status li.approved:after {
    content: none;
}

.chat-file-details .approved-status li span {
    color: var(--default-color);
}

.chat-file-details .approved-status li.approved:after {
    content: "";
    width: 5px;
    height: 5px;
    background: var(--default-color);
    border-radius: 50%;
    position: absolute;
    left: 3px;
    top: 4px;
}

.chat-file-details .approved-status li.approved {
    margin-bottom: 0;
}

.with-tab .chat-right-tab {
    display: block;
}

.attach-chat-block.pdf-block.auto-height {
    height: auto;
    min-height: 300px;
}

.approve-block {
    float: left;
    width: 100%;
    margin-top: 15px;
    display: flex;
    justify-content: flex-end;
    padding-top: 15px;
    border-top: 1px solid #dedede;
}

.approve-block .general-btn {
    height: 32px;
    box-shadow: none;
    float: left;
    margin-left: 8px;
    padding: 0 15px;
    min-width: auto;
}

.chat-message-in p {
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 22px;
    margin-bottom: 15px;
}

.chat-message-in p:last-child {
    margin-bottom: 0px;
}

.chat-message-in p strong {
    font-weight: 600 !important;
}

.chat-message-in p img {
    max-width: 400px;
    border: 1px solid #f1f1f1;
}

.chat-message-in iframe {
    width: 400px !important;
    height: 225px;
    margin-bottom: 15px;
}

.chat-message-in p br {
    display: none;
}

.chat-message-in ol {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    list-style-type: decimal;
    padding-left: 15px;
}

.chat-message-in ol li {
    float: left;
    width: 100%;
    line-height: 22px;
    margin-bottom: 5px;
}

.chat-message-in ol li:last-child {
    margin: 0;
}

.chat-message-in ul {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    list-style-type: disc;
    padding-left: 18px;
}

.chat-message-in ul li {
    float: left;
    width: 100%;
    line-height: 22px;
    margin-bottom: 5px;
}

.chat-message-in ul li:last-child {
    margin: 0;
}

.chat-message-in em {
    font-style: italic;
}

.chat-message-in ul:last-child,
.chat-message-in ol:last-child {
    margin: 0;
}

.rich-editor-chat .wa-chat-main-body {
    height: calc(100% - 219px);
    padding-bottom: 0;
}

.rich-editor-chat .chat-in-panel {
    height: 100%;
    padding: 0;
}

.rich-editor-chat .chat-panel-holder {
    height: 100%;
}

.rich-editor-chat .chat-all-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.rich-editor-chat .chat-in-content {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
    overflow-y: auto;
}

.rich-editor-chat .chat-in-content>div {
    float: left;
    width: 100%;
}

.rich-editor-chat .wa-chat-main-footer {
    height: 150px;
    padding: 0;
}

.rich-editor-chat .chat-text-area {
    height: 100%;
    align-items: normal;
    padding: 18px 15px;
    bottom: 0;
    border: 0;
    border-radius: 0;
}

.rich-editor-chat .wa-chat-submit-area {
    height: 100%;
    border: 0;
    border-top: 1px solid #dee0e3;
}

.rich-editor-chat .chat-attach-button {
    margin-right: 20px;
}

.rich-editor-chat .quill {
    margin-right: 15px;
    min-height: auto;
}

.rich-editor-chat .ql-container.ql-snow {
    height: auto;
    border: 0;
}

.rich-editor-chat .ql-toolbar.ql-snow {
    border: 0;
    padding: 0;
    position: relative;
    top: -4px;
    left: -6px;
}

.rich-editor-chat .ql-editor {
    min-height: auto;
    height: 89px;
    border: 1px solid #dee0e3;
    border-radius: 5px;
    background: #fbfbfb;
}

.rich-editor-chat .message-in-box {
    padding: 15px 20px 20px;
}

.rich-editor-chat .chat-message-in {
    margin-top: 5px;
}

.wa-chat-main-footer .chat-send-btn {
    width: 21px;
    height: 16px;
    position: relative;
    top: 3px;
}

.wa-chat-main-footer .expand-close {
    display: none;
}

.wa-chat-main-footer .expand-btn {
    left: auto;
    right: 15px;
    top: auto;
    bottom: 15px;
}

.wa-chat-main-footer.popover-layer {
    position: fixed;
    width: 600px;
    height: 400px;
    left: calc(50% - 300px);
    top: calc(50% - 200px);
}

.popover-layer:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 50%);
    position: fixed;
    left: 0;
    top: 0;
}

.popover-layer .wa-chat-submit-area {
    border: 0;
}

.rich-editor-chat .popover-layer .ql-container.ql-snow {
    height: calc(100% - 24px);
}

.rich-editor-chat .popover-layer .ql-editor {
    height: 100%;
}

.popover-layer .expand-close {
    display: block;
}

.popover-layer .expand-btn:before {
    background-position: -512px -69px;
    width: 12px;
    height: 12px;
}

.wa-chat-main.rich-editor-chat {
    width: calc(100% - 370px);
}

.file-bl-wrap .attach-chat-block {
    max-width: calc(100% - 50px);
    width: 100%;
    border-left: 5px solid var(--default-color);
}

.chat-right-tab .nav-tabs .nav-link:first-child {
    border-left-color: transparent;
}

/*------ Chat End ------*/

/*------ Collection ------*/

.collection-form-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.collection-form-left {
    float: left;
    width: calc(100% - 400px);
    height: 100%;
    padding: 34px 0px 0px 48px;
}

.collection-form-right {
    float: left;
    width: 400px;
    height: 100%;
    background: #F2F5F6;
    padding: 30px;
}

.collection-form-right-header {
    float: left;
    width: 100%;
}

.collection-form-right-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 20px;
}

.collection-form-right-header p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 30px;
}

.collection-form-right-header p:last-child {
    margin-bottom: 0;
}

.collection-form-right-header {
    float: left;
    width: 100%;
}

.collection-form-right-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 20px;
}

.collection-form-right-header p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 30px;
}

.collection-form-right-header p:last-child {
    margin-bottom: 0;
}

.collection-form-left-body {
    float: left;
    width: 100%;
    height: calc(100% - 91px);
    overflow-y: auto;
}

.col-back {
    float: left;
    color: #2C3137;
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
}

.col-back:before {
    content: "";
    background: var(--sprite-one) no-repeat -59px -158px;
    width: 14px;
    height: 13px;
    display: inline-block;
    margin-right: 20px;
}

.collection-form-left-header {
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.step-block {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.step-analyze {
    float: left;
    height: 25px;
    width: auto;
    border-radius: 3px;
    background-color: #646667;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
}

.form-input-block {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    padding-right: 72px;
}

.form-input-block-left {
    float: left;
    width: 100%;
}

.form-input-block-right {
    float: left;
    width: 410px;
    padding-left: 20px;
    padding-top: 24px;
}

.form-input-block-left label {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 8px;
}

.form-input-block-left textarea {
    float: left;
    width: 100%;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF;
    resize: none;
    padding: 17px 19px;
    font-size: 14px;
    line-height: 16px;
    transition: .3s ease-out;
}

.small-area {
    height: 75px;
}

.large-area {
    height: 135px;
}

.form-input-block-right label {
    float: left;
    width: 100%;
    color: #868686;
    font-size: 14px;
    line-height: 18px;
}

.form-input-block-left .form-type-input {
    float: left;
    width: 100%;
    height: auto;
    min-height: 50px;
    font-size: 14px;
    line-height: 16px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 17px 19px;
}

.form-input-block-left textarea::placeholder,
.form-input-block-left .form-type-input::placeholder {
    color: #bdbdbd;
}

.optional-field {
    color: #9A9898;
    font-size: 14px;
    font-style: italic;
    line-height: 16px;
}

.form-radio-box {
    float: left;
    position: relative;
    margin-right: 15px;
    margin-bottom: 10px;
}

.form-radio-box input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 8;
}

.form-radio-box label {
    float: left;
    width: 100%;
    color: var(--default-grey);
    padding-left: 25px;
    margin-bottom: 0;
}

.form-radio-box label:before {
    content: "";
    width: 15px;
    height: 15px;
    background: #fff;
    position: absolute;
    border-radius: 50%;
    border: 1px solid #C4C9CD;
    left: 0;
    top: 0;
}

.form-radio-box input:checked+label:after {
    content: "";
    width: 7px;
    height: 7px;
    background: var(--default-color);
    position: absolute;
    left: 4px;
    top: 4px;
    z-index: 8;
    border-radius: 50%;
}

.form-select-box {
    float: left;
    position: relative;
    margin-right: 10px;
    margin-bottom: 10px;
}

.form-select-box input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 8;
}

.form-select-box label {
    float: left;
    width: 100%;
    margin-bottom: 0;
    padding-left: 25px;
    color: #868686;
}

.form-select-box label:before {
    content: "";
    width: 15px;
    height: 15px;
    border: 1px solid #C4C9CD;
    border-radius: 2px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
}

.form-select-box input:checked+label:after {
    content: "";
    width: 15px;
    height: 15px;
    position: absolute;
    left: 3px;
    top: 4px;
    background: var(--sprite-one) no-repeat -274px -73px;
    width: 9px;
    height: 7px;
}

.form-select-box input:checked+label:before {
    background: var(--default-color);
    border-color: var(--default-color);
}

.form-drop-box {
    float: left;
    width: calc((100% / 3) - 10px);
    margin-right: 15px;
}

.form-drop-box:last-child {
    margin-right: 0;
}

.form-drop-box .select-box:after {
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
}

.form-input-block-left .attach-block label {
    color: #868686;
    margin-bottom: 0;
}

.form-input-block-left .attach-block {
    width: auto;
}

.form-input-block-left .file-tag {
    display: flex;
    align-items: center;
    padding-right: 30px;
    font-size: 13px;
    color: #6a7476;
    border-radius: 34px;
}

.form-input-block-left .general-btn {
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);
}

.collection-form-body {
    float: left;
    width: 100%;
    height: calc(100% - 90px);
    position: relative;
}

.collection-form-footer {
    float: left;
    width: 100%;
    height: 90px;
    border-top: 1px solid #D9DDDE;
}

.form-input-block-left textarea:focus {
    border-color: var(--default-color);
}

.info-clicker {
    float: left;
    width: 12px;
    height: 12px;
    background: url(images/info-click.png) no-repeat;
    background-size: cover;
    border: 0;
    padding: 0;
    line-height: 0;
    cursor: pointer;
}

.label-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.clicker-toggle {
    float: left;
    width: 300px;
    background: #7EADE3;
    padding: 8px;
    border-radius: 3px;
    position: absolute;
    right: -4px;
    bottom: 20px;
    color: #fff !important;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.clicker-toggle p {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 11px;
    line-height: 14px;
    color: #fff !important;
}

.info-clicker-wrap {
    float: left;
    position: relative;
    display: none;
}

.clicker-toggle:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 5px 5px 5px;
    border-color: transparent transparent #7eade3 transparent;
    position: absolute;
    bottom: -5px;
    right: 5px;
    transform: rotate(180deg);
}

.info-clicker-wrap:hover .clicker-toggle {
    opacity: 1;
    pointer-events: auto;
}

.form-input-block-left .error-fields {
    float: left;
    width: 100%;
    font-size: 12px;
    color: #e14745;
    margin: 5px 0 0 0;
}

.form-input-block-left .red-alert {
    border-color: #e14745;
}

.red-alert {
    color: #e14745 !important;
}

.form-input-container {
    float: left;
    width: 100%;
    position: relative;
}

.form-input-container h5 {
    float: left;
    width: 100%;
    color: #2B2A2A;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    margin-bottom: 10px;
}

.form-input-container-inner {
    float: left;
    width: 100%;
    position: relative;
    padding-right: 72px;
}

.form-input-container-inner .form-input-block {
    float: left;
    width: calc((100% / 3) - 7px);
    margin-right: 10px;
    margin-bottom: 10px;
    padding-right: 0;
}

.form-input-container-inner .form-input-block:nth-child(3n) {
    margin-right: 0;
}

.form-input-container-outer {
    float: left;
    width: 100%;
    position: relative;
    padding-right: 72px;
    margin-bottom: 15px;
}

.rightButtons {
    float: left;
    position: absolute;
    right: 22px;
    top: 43px;
    width: 40px;
}

.form-drop-box {
    width: 100%;
}

.fieldset-form {
    float: left;
    width: 100%;
    padding-left: 20px;
    position: relative;
    margin-bottom: 15px;
}

.form-input-block h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    margin-bottom: 3px;
}

.fieldset-form .form-input-block p {
    float: left;
    width: 100%;
    color: #999999;
    font-size: 12px;
    line-height: 14px;
}

.fieldset-form:before {
    content: "";
    height: 100%;
    border-left: 5px solid rgba(63, 169, 245, 0.1);
    position: absolute;
    left: 0;
    top: 0;
}

.fieldset-form .form-input-block:last-child {
    margin-bottom: 0;
}

.collection-form-footer-left {
    float: left;
    width: calc(100% - 400px);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 72px 0 48px;
}

.stage-flow {
    float: left;
    width: 100%;
}

.stage-flow li {
    float: left;
    width: 25px;
    height: 25px;
    border: 1px solid #E3E5E8;
    background-color: rgba(255, 255, 255, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #B6BBD3;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    margin-right: 30px;
    position: relative;
    cursor: pointer;
}

.stage-flow li:after {
    content: "";
    width: 30px;
    height: 2px;
    background: #E3E5E8;
    position: absolute;
    right: -31px;
    top: calc(50% - 1px);
    z-index: 4;
}

.stage-flow li:last-child:after {
    content: none;
}

.stage-flow li[title="Hidden"] {
    pointer-events: none;
}

.stage-flow .active {
    background: var(--default-color);
    color: #fff;
}

.stage-flow .active:after {
    background: var(--default-color);
}

.stage-flow li:hover {
    border-color: var(--default-color);
    color: var(--default-color);
}

.btnsubIconsadd {
    float: left;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
}

.btnsubIconsadd:before {
    background-position: -267px -183px;
    width: 17px;
    height: 17px;
}

.leftInputaddIcons {
    float: left;
    width: 38px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
}

.btnsubIcon {
    float: left;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
    margin-right: 6px;
}

.btnsubIcon:before {
    background-position: -244px -183px;
    width: 17px;
    height: 17px;
}

.layover-bg:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.65);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 99999;
}

.collection-form-modal .modal-dialog {
    max-width: 100%;
    height: 100%;
    margin: 0;
}

.collection-form-modal .modal-body {
    height: 100%;
    max-height: 100%;
    padding: 0;
}

.collection-form-modal {
    padding: 0;
}

.collection-form-modal .modal-content {
    float: left;
    width: 100%;
    height: 100%;
}

.attach-block {
    float: left;
    width: 100%;
    position: relative;
}

.attach-block input {
    float: left;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 8;
}

.att:before {
    background-position: -231px -449px;
    width: 16px;
    height: 14px;
    position: absolute;
    left: 0;
    top: calc(50% - 7px);
}

.attach-block label {
    margin: 0;
    font-size: 14px;
    line-height: 16px;
    padding-left: 22px;
    color: #6a7476;
}

.tile-main-panel {
    padding: 20px;
    width: 100%;
    float: left;
    height: calc(100vh - 60px);
    overflow: auto;
}

.tile-each {
    float: left;
    width: calc((100% / 4) - 14px);
    margin-right: 18px;
    margin-bottom: 18px;
    transition: .4s ease-out;
    cursor: pointer;
}

.tile-each:nth-child(4n) {
    margin-right: 0;
}

.tile-all-holder {
    float: left;
    width: 100%;
    /* height: 100%; */
    display: flex;
    flex-wrap: wrap;
}

.tile-head-all {
    width: 100%;
    height: 150px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tile-head-all:before {
    content: "";
    background-color: rgba(0, 0, 0, .17);
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px 3px 0 0;
    z-index: 1;
}

.tile-head-all img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
}

.option-toppper {
    position: absolute;
    right: 10px;
    top: 13px;
    width: 28px;
    height: 16px;
}

.option-toppper button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    float: left;
    width: 26px;
    height: 16px;
    cursor: pointer;
    position: relative;
    z-index: 8;
}

.image-option:before {
    background-position: -220px -361px;
    width: 16px;
    height: 4px;
    position: absolute;
    top: 5px;
    left: 4px;
}

.option-toppper .panel-option {
    top: 20px;
    right: -6px;
}

.form-dup-ico:before {
    background-position: -81px -137px;
    width: 16px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
}

.form-dup-ico:hover:before {
    background: var(--sprite-two) no-repeat -391px -138px;
}

.form-share-ico:before {
    background-position: -109px -354px;
    width: 17px;
    height: 17px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
}

.form-share-ico:hover:before {
    background-position: -94px -492px;
}

.export-ico-absolute:before {
    background-position: -177px -209px;
    width: 17px;
    height: 16px;
}

.export-ico-absolute:before {
    position: absolute;
    top: calc(50% - 8px);
    left: 20px;
}

.export-ico-absolute:hover:before {
    background-position: -231px -493px;
}

.form-embed-ico:before {
    background: var(--sprite-one) no-repeat -79px -354px;
    width: 20px;
    height: 18px;
}

.form-embed-ico:hover:before {
    background-position: -64px -492px;
}

.tile-info-all {
    float: left;
    width: 100%;
    height: auto;
    background: var(--white);
    border-radius: 0 0 3px 3px;
    padding: 15px 20px 18px;
}

.tile-description-box {
    float: left;
    width: 100%;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eceff2;
}

.tile-description-box h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    margin-bottom: 5px;
    color: #222330;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 90%;
    transition: .4s ease-out;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tile-description-box p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 19px;
    color: var(--default-grey);
    letter-spacing: normal;
    max-height: 38px;
    min-height: 38px;
    overflow: hidden;
}

.tile-options-in {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.span-box-in {
    display: flex;
    align-items: center;
}

.icon-in.icon-stack-filled {
    background-position: -126px -332px;
    width: 12px;
    height: 12px;
}

.item-count-in {
    font-size: 12px;
    line-height: 14px;
    color: var(--default-grey);
    margin-left: 6px;
}

.icon-in.icon-share-in {
    background-position: -148px -332px;
    width: 13px;
    height: 13px;
}

.tile-each:hover {
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.tile-each:hover .tile-description-box h5 {
    color: var(--btn-color);
}

.select-wrap {
    float: left;
    width: 100%;
    margin-top: 10px;
}

.menu-section .select-chk-block {
    padding-left: 15px;
    color: var(--sub-category-head);
    padding-right: 2px;
    margin-bottom: 12px;
    width: 100%;
}

.menu-section .select-chk-block .control {
    font-size: 13px;
    font-weight: 200;
    line-height: normal;
}

.side-menu-right .menu-section .control-indicator {
    width: 13px;
    height: 13px;
    border-color: var(--sub-category-head);
    border-radius: 2px;
    top: 1px;
    background: var(--sidemenu-checkbox);
}

.side-menu-right .menu-section .select-chk-block:hover .control:hover .inp-chk~.control-indicator,
.side-menu-right .menu-section .select-chk-block:hover .control .inp-chk:focus~.control-indicator {
    border-color: #fafafa;
}

.menu-section .select-chk-block:hover .control {
    color: #fafafa;
}

.side-menu-right .menu-section .select-chk-block:hover .control:hover .inp-chk:checked~.control-indicator {
    background: var(--white);
    border-color: var(--white);
}

.list-viewer .tile-each {
    width: calc((100% / 2) - 9px);
    border-radius: 5px;
    background: var(--white);
    min-height: 106px;
}

.list-viewer .tile-each:nth-child(4n) {
    margin-right: 18px;
}

.list-viewer .tile-each:nth-child(2n) {
    margin-right: 0;
}

.list-viewer .tile-each .tile-info-all {
    border-radius: 3px;
}

.list-viewer .tile-info-all h5 {
    /* font-size: 20px; */
    font-size: 18px;
    color: var(--btn-color);
    font-weight: 600;
}

.list-viewer .tile-info-all p {
    color: var(--default-grey);
    min-height: auto;
    font-size: 14px;
    line-height: 18px;
}

.list-viewer .tile-description-box {
    min-height: auto;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
    position: relative;
}

.list-viewer .tile-options-in {
    height: 47px;
    display: none;
}

.sig-button-block {
    float: left;
    width: 100%;
    display: flex;
}

.sig-button-block button {
    margin-right: 14px;
}

.sig-preview {
    float: left;
    width: 300px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #E4E6E9;
    background: #ffffff;
    border-radius: 5px;
    position: relative;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.sig-preview:before {
    content: "Preview";
    position: absolute;
    right: 15px;
    top: -9px;
    padding: 0 5px;
    background: #ffffff;
    color: #2B2A2A;
    font-size: 14px;
    line-height: 16px;
}

.sig-preview img {
    width: 40%;
}

.signature-canvas canvas {
    width: 500px !important;
    padding: 10px;
}

.input-text-area {
    float: left;
    width: 100%;
    height: 100px;
    border: 1px solid #e4e4e4;
    border-radius: 3px;
    resize: none;
    padding: 10px;
    line-height: normal;
    font-size: 14px;
    font-weight: 500;
}

.task-tg .radio-wrapper {
    margin-top: 10px;
    margin-bottom: 0;
}

.task-tg .task-input-block {
    margin-bottom: 0;
}

.data-holder-right .form-table .table thead th:first-child {
    width: 1%;
}

.data-holder-right .form-table .table thead .width-less {
    width: 1%;
}

.inner-content-area {
    float: left;
    width: 100%;
    padding: 20px;
}

.filter-wrapper {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.filter-wrapper .subhead {
    font-weight: 600;
    color: var(--default-text);
}

.inner-content-area .filter-left-wrapper li {
    margin: 0;
}

.tile-main-panel.with-filter {
    height: calc(100vh - 140px);
    padding-top: 0;
}

.tile-main-panel.with-filter .tile-all-holder {
    height: auto;
}

.date-data {
    font-size: 14px;
    color: var(--default-grey);
}

.other-info {
    float: left;
}

.other-info span {
    font-size: 12px;
    line-height: 14px;
    color: var(--default-grey);
    display: flex;
    align-items: center;
}

.other-info span {
    float: left;
    margin-left: 15px !important;
}

.content-section .section-info-icon .icon-style {
    margin: 0;
}

.float-panel-header-option {
    float: left;
    display: flex;
    align-items: center;
}

.float-panel-header-option .general-btn {
    height: 25px;
    margin-right: 20px;
    border: 1px solid var(--default-color);
    background: #fff;
    color: var(--default-color);
    box-shadow: none;
    min-width: auto;
    padding: 0 8px;
    font-size: 12px;
}

.float-panel-header-option .general-btn:hover {
    background: var(--default-color);
    color: #fff;
}

.collection-list-icon:before {
    content: "";
    background: var(--sprite-two) no-repeat -457px -165px;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 0;
    top: 5px;
}

.rightdateinput .radio-wrapper-new .radio-block {
    margin-bottom: 12px;
}

.list-viewer.board-listing .tile-each {
    min-height: 124px;
}

.list-viewer.board-listing .tile-each .tile-info-all {
    height: 124px;
}

.list-viewer.pool-listing .tile-each {
    min-height: 82px;
}

.list-viewer.pool-listing .tile-each .tile-info-all {
    height: 82px;
}

.display-component {
    float: left;
    width: 100%;
}

.display-inner {
    float: left;
    width: 100%;
    display: flex;
}

.display-img img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border: 1px solid #f1f1f1;
}

.display-component .display-inner>.display-text-content {
    float: left;
    width: 50%;
    padding: 0 0 0 20px;
}

.display-component .pg-viewer-wrapper .video-container {
    float: left;
    width: 100% !important;
    height: 350px;
}

.display-component .pg-viewer-wrapper .video-container video {
    float: left;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}

.display-component .display-inner>div {
    float: left;
    width: 100%;
}

.display-component .pg-viewer-wrapper {
    overflow: hidden;
}

.template-1 .display-component {
    padding: 20px;
    margin-top: 35px;
}

.template-2 .display-img img {
    border: 1px solid #e0e0e0;
}

.template-3 .display-component {
    margin-top: 65px;
    margin-bottom: 20px;
}

.template-3 .ind-form-field .displayvideo .anim-text {
    top: 0;
}

.template-3 .ind-form-field .displayimage .anim-text {
    top: 0;
}

.template-5 .ind-form-field .display-text h2 {
    color: var(--white);
}

.template-5 .displayimage .label-title-block,
.template-5 .displayvideo .label-title-block {
    margin-bottom: 15px;
}

.template-5 .display-component .display-inner>.display-img {
    background: var(--white);
}

.template-5 .display-component .display-inner>.display-text-content * {
    color: var(--white);
}

.template-5 .ind-form-field .display-text .typeform-display-text {
    margin-top: 0;
}

.template-5 .ind-form-field .display-text p {
    font-weight: 300;
}

.template-6 .display-img img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border: 1px solid #eaeaea;
}

.template-7 .displayimage .label-title-block,
.template-7 .displayvideo .label-title-block {
    margin-bottom: 15px;
}

.template-7 .display-component .display-inner>.display-img {
    background: var(--white);
}

.template-7 .ind-form-field .display-text .typeform-display-text {
    margin-top: 0;
}

.template-7 .ind-form-field .display-text p {
    font-weight: 300;
}

.template-11 .typeform-display-text *,
.template-11 .display-component {
    font-family: 'Futura PT Book';
}

.template-11 .typeform-display-text h2 {
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 5px;
}

.template-11 .typeform-display-text p {
    line-height: normal;
}

.template-11 .displayimage .label-title-block,
.template-11 .displayvideo .label-title-block {
    display: none;
}

.template-11 .type-form-input.displayvideo {
    width: 100%;
}

.right-panel-white-box .table.form-preview-table tbody tr td h2 {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 20px;
    line-height: normal;
}

.right-panel-white-box .table.form-preview-table tbody tr td p {
    line-height: normal;
}

.form-single-value-box .display-component .display-inner>.display-img img {
    width: 100%;
    max-width: 100%;
    object-fit: cover;
}

.form-single-value-box .display-component {
    margin-top: 5px;
}

.form-single-value-box .pg-viewer-wrapper {
    margin-top: 0;
}

/*------ Collection End ------*/

/*------ Collection Details ------*/

.form-detail-container {
    float: left;
    width: 100%;
    height: calc(100vh - 85px);
}

.form-detail-container.data-view {
    height: 100vh;
}

.form-detail-panel {
    float: left;
    width: 100%;
    height: 160px;
    background: #fff;
    border: 1px solid rgba(64, 83, 100, 0.15);
    margin-bottom: 20px;
}

.data-view .form-detail-panel {
    height: auto;
}

.form-detail-left {
    float: left;
    width: 230px;
    height: 100%;
    border-right: 1px solid rgba(64, 83, 100, 0.15);
}

.data-view .form-detail-left {
    display: none;
}

.form-detail-right {
    float: left;
    width: calc(100% - 230px);
    height: 100%;
}

.data-view .form-detail-right {
    width: 100%;
}

.form-detail-top {
    float: left;
    width: 100%;
    padding: 18px 20px;
    height: 103px;
    border-bottom: 1px solid #E3E5E8;
    position: relative;
}

.data-view .form-detail-top {
    height: 100%;
    max-height: 55px;
}

.form-detail-top.project-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.common-align .form-detail-top.project-top {
    height: 75px;
    max-height: none;
    display: block;
    padding: 15px 20px;
}

.form-detail-top-left {
    float: left;
    display: flex;
    align-items: center;
}

.common-bk-button {
    position: relative;
}

.common-align .form-detail-top-left {
    display: block;
    padding-left: 32px !important;
}

.common-bk-button:before {
    content: "";
    background: var(--sprite-two) no-repeat -61px -141px;
    width: 14px;
    height: 13px;
    position: absolute;
    left: 0;
    top: 3px;
}

.form-detail-top h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
    margin-bottom: 8px;
}

.form-detail-top.project-top h5 {
    margin: 0;
}

.common-align .form-detail-top.project-top h5 {
    margin-bottom: 5px;
    word-break: break-word;
}

.form-detail-top p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 20px;
}

.data-view .common-align .form-detail-top p {
    max-height: 20px;
    overflow: hidden;
    display: block;
}

.form-option-block {
    float: left;
    position: absolute;
    right: 20px;
    top: 25px;
}

.opt-form-ico {
    background: transparent;
    border: 0;
    padding: 0;
    width: 25px;
    height: 21px;
    float: left;
    line-height: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: -5px;
    top: -18px;
}

.common-align .opt-form-ico {
    right: -3px;
    top: -11px;
}

.opt-form-ico:before {
    background-position: -426px -75px;
    width: 15px;
    height: 4px;
    position: absolute;
    left: calc(50% - 7.5px);
    top: calc(50% - 1.5px);
}

.common-align .form-option-block .panel-option {
    top: 10px;
    right: -13px;
}

.form-assign-ico:before {
    background-position: -24px -354px;
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.form-assign-ico:hover:before {
    background-position: -9px -492px;
}

.embed-ico:before {
    background-position: -79px -354px;
    width: 20px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.embed-ico:hover:before {
    background-position: -64px -492px;
}

.form-edit-ico:before {
    background-position: -50px -353px;
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.form-edit-ico:hover:before {
    background-position: -35px -491px;
}

.form-set-ico:before {
    background-position: -139px -353px;
    width: 17px;
    height: 19px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.form-set-ico:hover:before {
    background-position: -124px -491px;
}

.form-rule-ico:before {
    background-position: -169px -354px;
    width: 18px;
    height: 17px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.form-rule-ico:hover:before {
    background-position: -154px -492px;
}

.form-detail-bottom-left {
    float: left;
}

.detail-tab {
    float: left;
    width: auto;
}

.detail-tab li {
    float: left;
}

.detail-tab-click {
    float: left;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 16px;
}

.detail-tab li a,
.detail-tab li nav {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    padding: 0 22px;
    position: relative;
    font-weight: 500;
}

.detail-tab-click.active,
.detail-tab-click:hover {
    color: var(--default-color);
    font-weight: 500;
}

.detail-tab-click.active,
.detail-tab-click:hover {
    color: var(--default-color);
}

.builder:before {
    content: "";
    background: var(--sprite-one) no-repeat -41px -327px;
    width: 19px;
    height: 20px;
    display: inline-block;
    margin-right: 10px;
}

.builder.active:before,
.builder:hover:before {
    background-position: -99px -327px;
}

.detail-tab-click.active:after {
    content: "";
    width: 100%;
    height: 3px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    bottom: 0;
}

.wf-set:before {
    content: "";
    background: var(--sprite-one) no-repeat -128px -466px;
    width: 16px;
    height: 16px;
    margin-right: 10px;
}

.detail-tab-click.wf-set.active:before,
.detail-tab-click.wf-set:hover:before {
    background-position: -31px -466px;
}

.form-detail-bottom-right {
    float: left;
}

.section-info-icon {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.section-info-icon span {
    font-size: 12px;
    line-height: 14px;
    color: var(--default-grey);
    display: flex;
    align-items: center;
}

.section-info-icon .icon-style {
    margin-left: 50px;
}

.form-detail-bottom-right .section-info-icon span {
    margin-left: 30px;
    color: #B1BECD;
}

.icon-form-notify:before {
    background-position: -172px -333px;
    width: 11px;
    height: 12px;
    margin-right: 6px;
}

.form-detail-bottom {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px 0 0;
}

.data-holder {
    float: left;
    width: 100%;
    height: calc(100% - 265px);
}

.form-wrap {
    padding: 0 20px 20px;
}

.data-view .data-holder {
    height: calc(100vh - 218px);
}

.data-view.field-form .data-holder {
    height: calc(100vh - 132px);
}

.data-view.field-form .data-holder {
    height: calc(100% - 152px);
}

.form-field-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.form-field-left {
    float: left;
    width: 282px;
    height: 100%;
    margin-right: 18px;
}

.form-page-container {
    float: left;
    width: 100%;
    margin-bottom: 4px;
    max-height: calc(100% - 56px);
    overflow-y: auto;
    margin-bottom: 20px;
}

.form-page-container li {
    float: left;
    width: 100%;
    position: relative;
    padding-right: 20px;
}

.form-page-container li:before {
    content: "";
    height: 7px;
    width: 7px;
    background-color: #A6D4F2;
    position: absolute;
    left: 4px;
    top: calc(50% - 3.5px);
    border-radius: 50%;
    z-index: 9;
}

.ind-page-form {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    line-height: 35px;
    padding-left: 26px;
    transition: .4s ease-out;
}

.form-page-container li:after {
    content: "";
    height: 100%;
    border: .5px dashed #A6D4F2;
    position: absolute;
    left: 7px;
    top: 19px;
    z-index: 8;
}

.form-page-container .active .ind-page-form {
    color: var(--default-color);
    font-weight: 500;
}

.form-page-container li.active:before {
    height: 15px;
    width: 15px;
    border: 2px solid var(--default-color);
    background-color: #ECF0F1;
    left: 0;
    top: calc(50% - 7.5px);
}

.form-page-container li:hover:before {
    height: 15px;
    width: 15px;
    border: 2px solid var(--default-color);
    background-color: #ECF0F1;
    left: 0;
    top: calc(50% - 7.5px);
}

.trans-dash-button {
    float: left;
    width: 100%;
    height: 35px;
    width: 100%;
    border: .5px dashed var(--default-color);
    background-color: #E2EBF0;
    color: var(--default-color);
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    cursor: pointer;
}

.form-field-center {
    float: left;
    width: calc(100% - 718px);
    height: 100%;
    margin-right: 18px;
}

.form-field-top {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    margin-bottom: 20px;
    overflow-y: auto;
}

.ind-input-form-build {
    float: left;
    width: 100%;
    height: 55px;
    border: .5px dashed rgba(74, 74, 74, 0.2);
    background: #ECF0F1;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    transition: .3s ease-out;
    cursor: pointer;
    position: relative;
    padding-right: 45px;
}

.ind-input-form-build {
    flex-wrap: wrap;
}

.ind-input-form-build p {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
}

.ind-input-form-build .shaded-text {
    color: #B1BECD;
    font-size: 12px;
    line-height: 14px;
}

.ind-input-form-build:after {
    content: "";
    background: var(--sprite-one) no-repeat -233px -334px;
    width: 8px;
    height: 13px;
    position: absolute;
    right: 20px;
    top: calc(50% - 6.5px);
}

.ind-input-form-build.fieldset {
    padding: 22px 20px;
    height: auto;
    position: relative;
}

.ind-input-form-build.fieldset {
    background: url(images/line-texture.png);
    border: 1px solid rgba(177, 190, 205, 0.3);
}

.field-add-block {
    float: left;
    width: 100%;
    position: relative;
}

.field-add-block .trans-dash-button {
    height: 55px;
    width: 100%;
    color: var(--default-color);
    font-size: 14px;
    line-height: 16px;
}

.field-add-block .dropdown-menu {
    float: left;
    width: 380px;
    left: calc(50% - 190px) !important;
    top: -8px !important;
    padding: 20px;
    border: 1px solid #EAEAEA;
    background-color: #FFFFFF;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
}

.ind-field-button-type {
    float: left;
    width: calc((100% / 4) - 15px);
    margin-right: 20px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-bottom: 18px;
    cursor: pointer;
}

.ind-field-button-type:hover .field-shade {
    border: 1px solid var(--default-color);
}

.field-shade-text {
    float: left;
    width: 100%;
    color: #9698A1;
    font-size: 12px;
    line-height: 14px;
}

.field-shade {
    float: left;
    width: 100%;
    height: 40px;
    border: 1px solid #F3F3F3;
    border-radius: 3px;
    background-color: #F6F8F9;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s ease-out;
}

.fs-ico:before {
    background-position: -287px -430px;
    width: 14px;
    height: 13px;
}

.tx-ico:before {
    background-position: -306px -431px;
    width: 12px;
    height: 12px;
}

.ta-ico:before {
    background-position: -323px -430px;
    width: 14px;
    height: 13px;
}

.rb-ico:before {
    background-position: -343px -432px;
    width: 14px;
    height: 9px;
}

.cb-ico:before {
    background-position: -363px -430px;
    width: 14px;
    height: 14px;
}

.dp-ico:before {
    background-position: -383px -429px;
    width: 14px;
    height: 15px;
}

.dt-ico:before {
    background-position: -403px -429px;
    width: 14px;
    height: 15px;
}

.nm-ico:before {
    background-position: -423px -429px;
    width: 14px;
    height: 15px;
}

.rt-ico:before {
    background-position: -443px -430px;
    width: 14px;
    height: 13px;
}

.dd-ico:before {
    background-position: -9px -451px;
    width: 14px;
    height: 7px;
}

.fu-ico:before {
    background-position: -482px -431px;
    width: 12px;
    height: 12px;
}

.pg-ico:before {
    background-position: -463px -430px;
    width: 13px;
    height: 13px;
}

.hd-ico:before {
    background-position: -31px -449px;
    width: 15px;
    height: 13px;
}

.ind-field-button-type:nth-child(4n) {
    margin-right: 0;
}

.field-add-block .dropdown-menu:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 11px 12px 11px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    left: calc(50% - 11px);
    top: -11px;
    z-index: 9;
}

.field-add-block .dropdown-menu:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0px 12px 14px 12px;
    border-color: transparent transparent #eaeaea transparent;
    position: absolute;
    left: calc(50% - 12px);
    top: -13px;
}

.ind-field-button-type:hover .field-shade-text {
    color: var(--default-color);
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
}

.form-field-bottom .general-btn {
    float: left;
    padding: 0 16px;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    margin-right: 15px;
}

.preview-button {
    background: var(--default-text);
    border-color: var(--default-text);
}

.preview-button:before {
    background-position: -54px -449px;
    width: 12px;
    height: 12px;
    margin-right: 7px;
}

.preview-button:hover {
    background: #6a6a6a;
    border-color: #6a6a6a;
}

.form-field-right {
    float: left;
    width: 400px;
    height: 100%;
    border: 1px solid rgba(64, 83, 100, 0.15);
    background-color: #FFFFFF;
}

.form-field-header {
    float: left;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #E3E5E8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.bottom-button {
    float: left;
    height: 30px;
    width: 30px;
    border: 0;
    padding: 0;
    line-height: 0;
    border-radius: 5px;
    background-color: #E14745;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    transition: .3s ease-out;
}

.bottom-button {
    cursor: pointer;
}

.bottom-button:hover {
    background-color: #eb6e6c;
}

.bottom-button:before {
    content: "";
    background: var(--sprite-one) no-repeat -279px -333px;
    width: 13px;
    height: 15px;
    display: inline-block;
}

.form-field-details {
    float: left;
    width: 100%;
    padding: 0px;
    height: calc(100% - 60px);
    overflow: auto;
}

.form-field-details-split {
    float: left;
    width: 100%;
}

.form-field-details-split-header {
    float: left;
    height: 35px;
    width: 100%;
    border-bottom: 1px solid #E3E5E8;
    background-color: #F9FCFE;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.form-field-details-split-header h5 {
    float: left;
    width: 100%;
    color: #98A2A4;
    font-size: 12px;
    line-height: 14px;
}

.form-field-details-split-body {
    float: left;
    width: 100%;
    padding: 20px;
    border-bottom: 1px solid #E1E8E9;
}

.ind-panel-options {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 16px;
}

.ind-panel-options label {
    float: left;
    width: 100%;
    color: #9698A1;
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 13px;
}

.panel-drop {
    float: left;
    width: 100%;
    cursor: pointer;
}

.panel-drop .type-selection {
    float: left;
    width: 100%;
    color: #3D576D !important;
    font-size: 14px;
    font-weight: 500;
    padding-bottom: 16px;
    border-bottom: 1px solid #E3E5E8;
    display: flex;
    align-items: center;
    position: relative;
}

.type-selection:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 6px;
    top: 5px;
}

.panel-drop .dropdown-menu {
    width: 100%;
    top: -4px !important;
}

.panel-drop .dropdown-menu {
    transform: none !important;
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.dropdown-item {
    float: left;
    color: #6B7577;
    font-size: 15px;
    line-height: 36px;
    position: relative;
    padding: 0 0 0 47px;
}

.panel-drop .dropdown-item {
    float: left;
    width: 100%;
    padding: 7px 15px;
    display: flex;
    align-items: center;
    color: #3D576D;
    font-size: 14px;
    font-weight: 500;
}

.panel-drop .dropdown-item {
    line-height: 24px;
}

.panel-drop .dropdown-item {
    line-height: 14px;
}

.panel-drop .dropdown-item:before {
    margin-right: 10px;
    left: 0;
}

.split-input {
    float: left;
    width: 100%;
    position: relative;
}

.ind-panel-options.split-input .field-common {
    float: left;
    width: calc((100% / 2));
    padding-right: 10px;
}

.field-common label {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 15px;
}

.btn-toggle {
    height: 25px;
    width: 62px;
    border-radius: 12.5px;
    background-color: #BDC1C8;
    border: 0;
    position: relative;
    padding: 0;
    cursor: pointer;
}

.ind-panel-options.split-input .btn-toggle {
    background: #E5E9ED;
}

.btn-toggle:before {
    content: "Yes";
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    position: absolute;
    left: 13px;
    top: calc(50% - 7px);
    transition: .2s ease-out;
    opacity: 0;
}

.btn-toggle.active {
    background: var(--default-color);
}

.handle {
    width: 23px;
    height: 23px;
    background: #fff;
    border-radius: 50%;
    position: absolute;
    left: 1px;
    top: 1px;
    border: 1px solid rgba(74, 74, 74, 0.05);
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.05);
    transition: .2s ease-out;
}

.btn-toggle:after {
    content: "No";
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    position: absolute;
    right: 13px;
    top: calc(50% - 7px);
    transition: .2s ease-out;
}

.btn-toggle.active:before {
    opacity: 1;
}

.btn-toggle.active:after {
    opacity: 0;
}

.btn-toggle.active .handle {
    left: 38px;
}

.ind-panel-options.split-input .btn-toggle.active {
    background: var(--default-color);
}

.builder-input {
    float: left;
    width: 100%;
}

.builder-input input {
    float: left;
    width: 100%;
    padding-bottom: 16px;
    border: 0;
    border-bottom: 1px solid #E3E5E8;
    color: #3D576D;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
}

.builder-input input::placeholder {
    font-weight: 400;
}

.check-field-wrap {
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.form-field-details .check-field-wrap {
    margin-bottom: 0;
    margin-top: 10px;
}

.form-field-details .check-field-wrap {
    margin-top: 20px;
}

.check-field-wrap .control {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    display: flex;
    align-items: center;
}

.form-field-details .check-field-wrap .control {
    margin: 0;
    color: #9698A1;
}

.check-field-wrap .select-chk-block {
    margin-right: 60px;
}

.form-field-details .select-chk-block {
    margin-bottom: 24px;
}

.form-field-details .check-field-wrap .select-chk-block {
    float: left;
    margin: 0;
    width: calc((100% / 2));
    margin-bottom: 24px;
}

.panel-mult-option {
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.external-entity-block {
    float: left;
    width: 100%;
}

.external-entity-block .ind-input-form-build {
    background: #fff;
}

.ind-input-form-build:hover,
.ind-input-form-build.active {
    float: left;
    border: .5px solid var(--default-color);
    transition: .3s ease-out;
    background-color: rgba(255, 255, 255, 0.4);
    color: var(--default-color);
}

.external-entity-block .ind-input-form-build {
    background: #fff;
}

.ind-input-form-build:hover p {
    color: var(--default-color);
}

.ind-input-form-build:hover .shaded-text {
    color: #B1BECD;
}

.option-builder-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.link-ext {
    height: 25px;
    width: auto;
    min-width: 120px;
    border: 1px solid #E3E5E8;
    border-radius: 12.5px;
    background-color: #FFFFFF;
    color: var(--default-color);
    font-size: 12px;
    line-height: 14px;
    padding: 0;
    cursor: pointer;
    transition: .3s ease-out;
}

.link-ext:before {
    content: "+";
    margin-right: 6px;
}

.link-ext:hover {
    border-color: var(--default-color);
}

.divider-option {
    float: left;
}

.divider-option button {
    float: left;
    background: transparent;
    line-height: 0;
    padding: 0;
    border: 0;
    margin-left: 10px;
    cursor: pointer;
}

.divider-sub-button:before {
    background-position: -328px -333px;
    width: 17px;
    height: 17px;
}

.divider-add-button:before {
    background-position: -355px -333px;
    width: 17px;
    height: 17px;
}

.ind-input-form-build.active p {
    color: var(--default-color);
}

.type-selection.fs-ico:before {
    margin-right: 8px;
}

.form-page-container li:last-child:after {
    border: 0;
}

.form-table .table tbody tr:hover td .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.remove-txt-gp {
    float: left;
    width: 100%;
    margin-bottom: 5px;
    color: #828483;
    font-size: 14px;
    line-height: 19px;
}

.modal-open .full-wid-mod {
    float: left;
    width: 100%;
    height: 100vh;
    overflow: hidden !important;
}

.full-wid-mod .modal-dialog {
    max-width: 100%;
    margin: 0;
    height: 100%;
}

.full-wid-mod .modal-content {
    border-radius: 0;
    border: 0;
}

.full-wid-mod .modal-header {
    float: left;
    width: 100%;
    padding: 0;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-radius: 0;
    border-bottom: 1px solid #E4E6E9;
}

.full-wid-mod .modal-body {
    float: left;
    width: 100%;
    height: calc(100vh - 70px);
    padding: 22px 60px;
    overflow-y: auto;
    background: #c7c7c7;
}

.full-wid-mod .modal-body:hover .slider-button-block {
    opacity: 1;
    pointer-events: auto;
}

.preview-table {
    margin: 0;
}

.preview-table tbody tr td {
    border: 1px solid #E4E6E9;
    background-color: #f5f5f5;
    border-left: 0;
    border-right: 0;
    color: #828483;
    font-size: 18px;
    line-height: 40px;
    padding: 12px 15px;
    vertical-align: middle;
}

.preview-table tbody tr td:first-child {
    border-left: 1px solid #E4E6E9;
    color: #2C3137;
    font-size: 18px;
    font-weight: 600;
    line-height: 40px;
    width: 20%;
    text-transform: uppercase;
    padding-left: 30px;
}

.full-wid-mod .modal-header-right {
    float: left;
    display: flex;
    align-items: center;
}

.modal-header-right .general-btn {
    margin-left: 14px;
    padding: 0 21px;
    border: 0;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    display: flex;
    align-items: center;
}

.modal-header-right .ex-cel-ico {
    border-radius: 5px;
    background-color: #16517F;
    border-color: #16517F;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

.modal-header-right .ex-cel-ico:hover {
    color: #fff !important;
}

.modal-header-right .ex-pdf-ico {
    border-radius: 5px;
    background-color: #fff;
    border: 1px solid #831C04;
    box-shadow: none;
    color: #831C04;
}

.modal-header-right .ex-pdf-ico:hover {
    background-color: #831C04;
    border-color: #831C04;
    color: #fff;
}

.ex-cel-ico:before {
    background-position: -463px -332px;
    width: 15px;
    height: 14px;
    margin-right: 10px;
}

.ex-pdf-ico:before {
    background-position: -501px -332px;
    ;
    width: 15px;
    height: 14px;
    margin-right: 10px;
}

.ex-pdf-ico:hover:before {
    background-position: -482px -332px;
    width: 15px;
    height: 14px;
    margin-right: 10px;
}

.full-wid-mod .modal-header .close {
    position: relative;
    right: 0;
    top: 0;
    margin-left: 34px;
}

.task-input-box {
    float: left;
    width: 100%;
    height: 40px;
    border: 1px solid #e4e5e9;
    padding: 0 15px;
    font-size: 14px;
    border-radius: 3px;
}

.task-tg .task-input-block .task-input-box {
    border: 1px solid transparent;
    border-bottom: 1px solid #ECEFF1;
    padding: 0;
    height: 36px;
}

.selectize-control {
    clear: both;
}

.multi-select-block .selectize-input {
    border: 1px solid #e4e5e9;
    box-shadow: none !important;
}

.selectize-control.multi .selectize-input.has-items,
.selectize-control.multi .selectize-input {
    min-height: 40px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    padding: 5px 15px;
}

.task-tg .multi-select-block .selectize-input {
    border: 1px solid transparent;
    border-bottom: 1px solid #ECEFF1;
    padding: 0;
}

.task-tg .selectize-control.multi .selectize-input.has-items,
.task-tg .selectize-control.multi .selectize-input {
    min-height: 50px;
    padding: 5px 0;
}

.multi-select-block .selectize-input>input {
    font-size: 14px;
    color: #333;
    border: 0;
}

.task-tg .new-task-input.text-input {
    border-bottom: 0;
}

.task-input-container .select-box {
    float: left;
    width: 100%;
    margin-right: 15px;
}

.cat-add {
    float: left;
    width: 17px;
    height: 17px;
}

.cat-add:before {
    background-position: -267px -183px;
    width: 17px;
    height: 17px;
}

.cat-add {
    float: left;
    width: 17px;
    height: 17px;
}

.cat-add:before {
    background-position: -267px -183px;
    width: 17px;
    height: 17px;
}

.filter-top-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.data-holder-left .label-menu-right-block .filter-top-header .search-text {
    width: auto;
    text-transform: capitalize;
    line-height: 20px;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
}

.clear-all {
    float: right;
    font-size: 12px;
    color: #B1BECD;
    border: 1px solid #b1becd;
    border-radius: 3px;
    padding: 2px 4px;
}

.filter-top-header .clear-all {
    margin: 0;
    transition: .3s ease-out;
    cursor: pointer;
}

.filter-top-header .clear-all:hover {
    background: var(--default-color);
    border-color: var(--default-color);
    color: #fff;
}

.small-no-tab .data-holder-left .filter-accord {
    margin: 0;
    height: calc(100% - 40px);
    overflow-y: auto;
}

.small-no-tab .data-holder-left .filter-accord .card-header {
    height: auto;
    margin-bottom: 16px;
}

.small-no-tab .data-holder-left .filter-accord .card .btn-link {
    color: var(--default-text);
    font-size: 11px;
    font-weight: 600;
    line-height: 14px;
    text-transform: uppercase;
    padding-right: 15px;
}

.small-no-tab .data-holder-left .filter-accord .select-chk-block {
    margin-bottom: 0;
}

.small-no-tab .data-holder-left .filter-accord .control {
    color: var(--default-text);
    font-size: 14px;
    line-height: 28px;
    margin-bottom: 0;
    padding-left: 25px;
}

.small-no-tab .data-holder-left .control-indicator {
    width: 13px;
    height: 13px;
    top: 7px;
    border-radius: 0;
}

.small-no-tab .label-menu-right-block.filter-top {
    height: 100%;
}

.data-view.field-form.small-no-tab .data-holder {
    height: calc(100% - 77px);
}

.small-no-tab .project-top {
    border-bottom: 0;
}

.data-view.small-no-tab .form-detail-top p {
    display: none;
}

.small-no-tab .project-top {
    border-bottom: 0;
}

.data-view .form-detail-top {
    height: 100%;
    max-height: 55px;
}

.form-detail-top.project-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.small-no-tab .common-bk-button {
    display: block;
    padding-left: 25px !important;
    cursor: pointer;
    word-break: break-word;
    max-width: 40%;
}

.small-no-tab .common-bk-button:before {
    top: calc(50% - 5.5px);
}

.small-no-tab .form-detail-top h5 {
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 21px;
    max-height: 21px;
    overflow: hidden;
}

.form-detail-top-right {
    padding-right: 35px;
    display: flex;
    align-items: center;
    height: 35px;
    float: left;
}

.form-detail-top-right .data-search-box {
    height: 35px;
    border-radius: 3px;
    width: 350px;
}

.form-detail-top-right .data-search {
    border-radius: 5px;
}

.form-detail-top-right .data-search-button .general-btn,
.form-detail-top-right .general-btn {
    height: 35px;
}

.form-detail-top-right .data-search-button .general-btn:hover,
.form-detail-top-right .general-btn:hover {
    color: #fff !important;
}

.form-detail-top-right .general-btn {
    display: flex;
    align-items: center;
    padding: 0 20px;
    margin-left: 15px;
    float: left;
}

.form-detail-top-right .delete-ico:before {
    top: 0px;
}

.form-table.coll-full-height {
    height: 100%;
}

.data-holder-right .form-table .table thead th {
    line-height: 30px;
}

.data-holder-right .form-table .table tbody tr td {
    line-height: 23px;
}

.filter-ico {
    float: left;
    padding: 0;
    background: 0;
    line-height: 0;
    border: 0;
    display: none;
}

.filter-ico:before {
    content: "";
    background: var(--sprite-four) no-repeat -10px -35px;
    width: 16px;
    height: 16px;
    display: inline-block;
}

.data-search-left {
    float: left;
    display: flex;
    align-items: center;
}

.filter-ico,
.mob-filter-header,
.mob-filter-footer {
    display: none;
}

.small-no-tab .form-option-block {
    float: left;
    position: absolute;
    right: 25px;
    top: 33px;
}

.sig-button-block {
    float: left;
    width: 100%;
    display: flex;
}

.sig-button-block button {
    margin-right: 14px;
}

.sig-preview:before {
    content: "Preview";
    position: absolute;
    right: 15px;
    top: -9px;
    padding: 0 5px;
    background: #ffffff;
    color: #2B2A2A;
    font-size: 14px;
    line-height: 16px;
}

.sig-preview img {
    width: 40%;
}

.sig-button-block {
    float: left;
    width: 100%;
    display: flex;
}

.sig-button-block button {
    margin-right: 14px;
}

.signature-canvas {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    border: 1px solid #E4E6E9;
    background: #fff;
    padding: 0 20px;
    border-radius: 5px;
}

.sig-preview:before {
    content: "Preview";
    position: absolute;
    right: 15px;
    top: -9px;
    padding: 0 5px;
    background: #ffffff;
    color: #2B2A2A;
    font-size: 14px;
    line-height: 16px;
}

.sig-preview img {
    width: 40%;
}

.form-set {
    background: #fff;
    border-top: 1px solid #DEE1E4;
}

.tab-wrap-block .form-table .table tbody tr td .team-perform-thumb img {
    max-width: 100%;
}

.tab-wrap-block .form-table .table.set-permission tbody tr td .select-chk-block {
    margin-top: 0;
}

.tab-wrap-block .form-table .table.set-permission {
    margin: 20px 0;
}

.team-perform-thumb {
    float: left;
    width: 30px;
    height: 30px;
    margin-right: 8px;
}

.team-perform-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #f3f3f3;
}

.team-perform-det {
    float: left;
    width: calc(100% - 38px);
}

.team-perform-left {
    float: left;
    width: 60%;
    display: flex;
    align-items: center;
}

.form-table .table tbody tr td .team-perform-det h6 {
    font-size: 14px;
    font-weight: 600;
}

.tab-wrap-block .form-table .table tbody tr td {
    padding-left: 0;
}

.form-detail-top-right .data-search-button .ex-cel-ico:before,
.form-detail-top-right .ex-cel-ico:before,
.modal-header-right .ex-cel-ico:before {
    background: var(--sprite-one) no-repeat -468px -305px;
    width: 15px;
    height: 14px;
    margin-right: 10px;
}

.form-detail-top-right .data-search-button .ex-cel-ico,
.form-detail-top-right .ex-cel-ico,
.modal-header-right .ex-cel-ico {
    background: #fff;
    color: var(--default-color) !important;
    box-shadow: none;
    transition: none;
    border: 1px solid var(--default-color);
}

.form-detail-top-right .data-search-button .ex-cel-ico:hover,
.form-detail-top-right .ex-cel-ico:hover,
.modal-header-right .ex-cel-ico:hover {
    background: var(--default-color);
}

.form-detail-top-right .data-search-button .ex-cel-ico:hover:before,
.form-detail-top-right .ex-cel-ico:hover:before,
.modal-header-right .ex-cel-ico:hover:before {
    background: var(--sprite-one) no-repeat -463px -332px;
}

.user-assigned-ico:before {
    background-position: -34px -428px;
    width: 21px;
    height: 15px;
}

.bg-back.bread-crumb .backto-list {
    border: 0;
}

.small-no-tab .data-holder-left .filter-accord.create-date {
    height: auto;
    margin-bottom: 20px;
}

.create-date .radio-wrapper {
    margin-top: 0;
}

.create-date .radio-wrapper .radio-block label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 18px;
}

.create-date .radio-wrapper .radio-block label:before {
    top: 1px;
}

.create-date .radio-wrapper .radio-block label:after {
    top: 5px;
}

.create-date .radio-wrapper .task-input-block.eq-width {
    width: calc((100% / 2) - 5px);
    margin-right: 10px;
    margin-top: 10px;
    height: 25px;
}

.create-date .radio-wrapper .task-input-block.eq-width:last-child {
    margin-right: 0;
}

.create-date .task-inout-box {
    height: 30px;
}

.create-date .task-input-box {
    height: 100%;
    font-size: 12px;
}

.create-date .radio-wrapper .radio-block:last-child {
    margin-bottom: 10px;
}

.create-date .radio-wrapper .radio-block {
    margin-bottom: 10px;
}

.small-no-tab .data-holder-left .filter-accord.create-date .card-body {
    padding-bottom: 15px;
}

.data-holder-left .rdtPicker {
    position: fixed;
    left: calc(50% - 125px);
    top: calc(50% - 113px);
    bottom: unset !important;
    z-index: 999999 !important;
}

.form-table-edit {
    float: left;
    display: flex;
}

.with-pj-sidebar .form-table {
    max-width: calc(100vw - 310px);
}

.data-holder-right .form-table .table thead th:first-child {
    width: 1%;
}

.data-holder-right .form-table .table thead .width-less {
    width: 1%;
}

.ind-form-field .input-block {
    border: 1px solid #E4E6E9;
}

.ind-form-field .anim-text {
    padding: 0;
    margin: 0;
    color: var(--default-grey);
    font-size: 14px;
    position: absolute;
    left: 21px;
    top: calc(50% - 7px);
    transition: .3s ease-out;
    z-index: 8;
    color: #bdbdbd;
}

.ind-form-field .fiels-inp-box {
    z-index: 9;
    background: transparent !important;
    font-size: 16px;
}

.ind-form-field .fiels-inp-box::placeholder {
    opacity: 0;
}

.ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    top: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.ind-form-field .input-block textarea {
    padding-top: 25px;
    position: relative;
    z-index: 9;
    background: transparent;
    resize: none;
}

.ind-form-field .input-block textarea+.anim-text {
    top: 27px;
}

.ind-form-field .radio-wrapper {
    border: 1px solid #E4E6E9;
    margin: 0;
    padding: 10px 20px;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}

.ind-form-field .checkbox-wrapper {
    margin: 0;
    padding: 10px 20px;
    border: 1px solid #E4E6E9;
    position: relative;
}

.ind-form-field .fieldset {
    float: left;
    width: 100%;
    padding-left: 20px;
    margin-bottom: 35px;
    position: relative;
}

.ind-form-field .fieldset:before {
    content: "";
    width: 5px;
    height: 100%;
    background-color: rgba(63, 169, 245, 0.1);
    position: absolute;
    left: 0;
    top: 0;
}

.ind-form-field .fieldset .input-block:last-child {
    margin-bottom: 0;
}

.ind-form-field .control-indicator {
    border-color: #C4C9CD;
}

.ind-form-field .radio-wrapper .radio-block label {
    color: var(--default-text);
    font-size: 14px;
}

.ind-form-field .checkbox-wrapper .select-chk-block .control {
    color: var(--default-text);
    overflow: visible;
    font-size: 14px;
    white-space: normal;
    line-height: normal;
}

.ind-form-field .form-header-block h5 {
    float: left;
    width: 100%;
    margin-top: 0;
    padding-left: 0;
}

.ind-form-field .checkbox-wrapper .select-chk-block {
    padding-right: 20px;
    margin: 0;
    margin-bottom: 10px;
    display: block;
}

.ind-form-field .radio-wrapper .radio-block {
    margin-bottom: 10px;
    padding-right: 20px;
    margin-right: 0;
}

.footer-options,
.header-options {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-options .stage-flow {
    width: auto;
}

.footer-options .button-block {
    width: auto;
    margin: 0;
}

.full-width .modal-lg,
.full-width .modal-content {
    height: 100%;
}

.ind-form-field .radio-wrapper h5,
.ind-form-field .checkbox-wrapper h5 {
    font-size: 12px;
    color: var(--default-grey);
    font-weight: 400;
}

.ind-form-field .react-datepicker-wrapper {
    height: 65px;
}

.ind-form-field .react-datepicker__input-container input {
    border: 0;
    padding: 0 20px;
    z-index: 9;
    font-size: 16px;
}

.ind-form-field .react-datepicker__input-container:after {
    content: none;
}

.ind-form-field .react-datepicker__input-container input::placeholder {
    opacity: 0;
}

.ind-form-field .react-datepicker__input-container {
    border: 0;
}

.ind-form-field .react-datepicker-popper {
    z-index: 99;
}

.ind-form-field .fieldset:last-child {
    margin-bottom: 0;
}

.style-view {
    float: left;
    width: 100%;
    margin-top: 20px;
}

.ind-form-field .react-datepicker__input-container input:focus+.anim-text,
.ind-form-field .react-datepicker__input-container.active .anim-text {
    top: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.cs-modal.fade.bsy-modal.lg-mod.in.show {
    padding: 0;
}

.lg-mod .modal-body {
    padding: 0;
    height: 549px;
}

.form-container {
    align-self: left;
    float: left;
    width: 100%;
    height: 100%;
}

.lg-mod .modal-body {
    padding: 0;
}

.form-option-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(221, 221, 221, 0.867);
    padding: 0 20px;
}

.form-option-header .radio-wrapper {
    margin: 0;
}

.container-right .select-box {
    margin-bottom: 20px;
}

.container-left .task-inp-container {
    border-bottom: 1px solid rgba(221, 221, 221, 0.867);
}

.ind-form-field .input-block .ind-task-input.selectize-custom {
    height: 67px;
    padding: 0 20px;
}

.ind-form-field .input-block.drop .ind-task-input.selectize-custom {
    border: 1px solid #E4E6E9;
    border-radius: 5px;
}

.ind-form-field .select-drop {
    z-index: 99;
}

.ind-form-field .selectize-custom .sl-tag {
    height: 25px;
    border-radius: 3px;
    background: var(--default-color);
    color: #fff;
    padding-right: 20px;
    margin: 5px 5px 5px 0;
}

.ind-form-field .selectize-custom .sl-tag .tag-right {
    color: #fff;
    padding: 0 5px;
    line-height: 25px;
    font-size: 12px;
    max-width: 100%;
    white-space: unset;
}

.ind-form-field .tag-wrapper-bl input {
    margin: 5px 5px 5px 0;
}

.ind-form-field .tag-wrapper-bl {
    padding: 5px 0;
}

.ind-form-field .upload-wrapper.sm-line {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    height: 67px;
    border: 1px solid #E4E6E9;
    margin-top: 0;
    padding: 0 20px;
    position: relative;
    margin-bottom: 0;
}

.ind-form-field .upload-wrapper .file-tag {
    display: flex;
    align-items: center;
    padding-right: 30px;
    font-size: 13px;
    color: #6a7476;
    border-radius: 34px;
    height: 25px;
    margin-top: 3px;
}

.ind-form-field .upload-wrapper.sm-line .attached-file {
    width: auto;
    margin: 0;
}

.ind-form-field .upload-wrapper.sm-line .upload-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 10px;
    justify-content: center;
}

.ind-form-field .upload-wrapper.sm-line .upload-progress .progress {
    box-shadow: none;
    border-radius: 0;
    height: 10px;
}

.ind-form-field .input-block.drop select {
    float: left;
    width: 100%;
    height: 67px;
    padding-top: 25px;
    border: 0;
    -webkit-appearance: none;
    padding: 0 40px 0 20px;
    color: var(--default-text);
    font-size: 16px;
    line-height: 17px;
    background: transparent;
    position: relative;
    z-index: 9;
}

.ind-form-field .input-block.drop:before {
    content: "";
    background: var(--sprite-one) no-repeat -196px -310px;
    width: 14px;
    height: 7px;
    position: absolute;
    right: 20px;
    top: calc(50% - 3.5px);
}

.input-block .mce-tinymce {
    box-shadow: none;
    border: 0;
}

.ind-form-field .input-block .mce-btn-group:not(:first-child) {
    border-left: 0;
}

.ind-form-field .input-block .mce-panel {
    border: 0;
    border-width: 0;
}

.ind-form-field .mce-stack-layout-item {
    display: block;
    border-bottom: .5px solid #E4E6E9;
}

.ind-form-field .input-block .mce-top-part::before {
    box-shadow: none;
}

.ind-form-field .heading {
    float: left;
    height: auto;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 35px;
}

.ind-form-field .heading h4 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 8px;
}

.ind-form-field .heading p {
    color: var(--default-grey);
    font-size: 12px;
}

.ind-form-field .signature-canvas {
    border: 0;
    padding: 20px;
    margin-bottom: 0;
}

.ind-form-field .signature-canvas canvas {
    padding: 0;
    border: 1px solid #E4E6E9;
    border-radius: 3px !important;
    cursor: crosshair;
}

.ind-form-field .sig-button-block {
    padding: 0 20px 20px;
}

.ind-form-field .signature-left label {
    margin-bottom: 8px;
}

.ind-form-field .file-upload label {
    color: var(--default-grey);
    word-break: break-word;
    font-size: 16px;
    text-transform: capitalize;
}

.ind-form-field .rightButtons {
    float: left;
    position: absolute;
    right: -31px;
    bottom: -8px;
    z-index: 99;
    top: unset;
}

.ind-form-field .btnsubIconsadd:before {
    background-position: -354px -333px;
    width: 17px;
    height: 17px;
}

.ind-form-field .btnsubIcon:before {
    background-position: -328px -333px;
    width: 17px;
    height: 17px;
}

.ind-form-field .error-fields {
    display: none;
}

.ind-form-field .react-datepicker__input-container input::placeholder {
    opacity: 1 !important;
    font-size: 14px !important;
}

.ind-form-field .radio-wrapper:last-child,
.ind-form-field .radio-wrapper:last-child,
.ind-form-field .input-block:last-child {
    border-bottom: 1px solid #E4E6E9;
}

.ind-form-field.fieldset.flex-box .style-view {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #E4E6E9;
}

.ind-form-field.fieldset.flex-box .style-view .input-block {
    min-height: 67px;
    width: 25%;
    border-left: 0;
    border-top: 0;
}

.ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: 25%;
    height: 67px;
    border-left: 0;
    border-bottom: 0;
}

.ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: 25%;
    height: 67px;
    border-left: 0;
    border-bottom: 0;
}

.ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: 25%;
    height: 67px;
    border-left: 0;
}

.ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 25%;
    margin-bottom: 0;
    border-left: 0;
}

.ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 0;
    line-height: 15px;
}

.ind-form-field .mandatory-box .fiels-inp-box {
    border-bottom: 1px solid #e14745;
}

.ind-form-field .radio-wrapper.mandatory-box:before,
.ind-form-field .checkbox-wrapper.mandatory-box:before {
    content: "";
    width: 100%;
    height: 1px;
    background: red;
    position: absolute;
    bottom: 0px;
    left: 0;
    z-index: 9;
}

.ind-form-field .upload-wrapper.sm-line.mandatory-box {
    border-bottom: 1px solid #e14745;
}

.input-block.mandatory-box .react-datepicker-wrapper {
    border-bottom: 1px solid #e14745;
}

.input-block.drop.mandatory-box select {
    border-bottom: 1px solid #e14745;
}

.ind-form-field .mandatory-box .field-common.field-req-block,
.ind-form-field .mandatory-box .ind-task-input.selectize-custom {
    border-bottom: 1px solid #e14745;
}

.ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper.mandatory-box:before {
    bottom: -1px;
}

.ind-form-field .input-block.date-field .form-type-input .form-control {
    border: 0;
}

.template-1 .modal-header {
    background: transparent;
    border-bottom: 0;
}

.template-2 .modal-header {
    background: #ecf0f1;
    border: 0;
}

.template-2 .modal-body {
    background: #ECF0F1;
}

.template-2 .ind-form-field .input-block {
    border: 0;
}

.template-2 .ind-form-field .input-block {
    overflow: unset;
    display: flex !important;
    flex-direction: column;
    margin-bottom: 13px;
}

.template-2 .ind-form-field .input-block .fiels-inp-box,
.template-2 .ind-form-field .react-datepicker__input-container input {
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF !important;
    height: 50px;
    order: 1;
}

.template-2 .ind-form-field .input-block .anim-text {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 8px;
}

.template-2 .ind-form-field .input-block:after,
.template-2 .ind-form-field .radio-wrapper:after,
.template-2 .ind-form-field .checkbox-wrapper:after {
    content: none;
}

.template-2 .ind-form-field .radio-wrapper,
.template-2 .ind-form-field .checkbox-wrapper {
    padding: 0;
    border: 0;
    margin-bottom: 13px;
}

.template-2 .ind-form-field .radio-wrapper h5,
.template-2 .ind-form-field .checkbox-wrapper h5 {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 14px;
    font-weight: 400;
}

.template-2 .ind-form-field .upload-wrapper.sm-line {
    padding: 00;
    height: 50px;
    border: 0;
    margin-bottom: 15px;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view {
    border: 0;
}

.template-2 .ind-form-field .signature-canvas {
    padding: 0;
    background: transparent;

}

.template-2 .ind-form-field .signature-canvas canvas {
    background: #fff;
    margin-bottom: 20px;
}

.template-2 .ind-form-field .sig-button-block {
    padding: 0;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc((100% / 4) - 15px);
    margin-right: 15px;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    margin-top: 23px;
    height: 43px;
}

.template-2 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-2 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 8px;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .input-block textarea {
    height: 50px;
    resize: auto;
    min-height: 50px;
    width: 100% !important;
    padding: 17px 20px;
}

.template-2 .ind-form-field.fieldset.flex-box .checkbox-wrapper .select-chk-block {
    width: 100%;
}

.template-2 .modal-footer {
    border-top: 1px solid #D9DDDE;
}

.template-2 .ind-form-field.fieldset.flex-box .react-datepicker-wrapper {
    height: 50px;
    margin-top: 24px;
}

.template-2 .ind-form-field .mandatory-box .fiels-inp-box {
    border-color: #e14745;
}

.template-2 .ind-form-field .radio-wrapper.mandatory-box:before,
.template-2 .ind-form-field .checkbox-wrapper.mandatory-box:before {
    content: none;
}

.template-2 .ind-form-field .upload-wrapper.sm-line.mandatory-box {
    border-bottom: 0;
}

.template-2 .input-block.mandatory-box .react-datepicker-wrapper {
    border: 0;
}

.template-2 .input-block.mandatory-box .react-datepicker__input-container input {
    border-color: #e14745;
}

.template-2 .input-block.drop.mandatory-box select {
    border-color: #e14745;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper.mandatory-box:before {
    bottom: -1px;
}

.template-2 .radio-wrapper.mandatory-box .error-fields {
    display: block;
    float: left;
    width: 100%;
    font-size: 12px;
    margin: 0;
}

.template-2 .checkbox-wrapper.mandatory-box .error-fields {
    display: block;
    float: left;
    width: 100%;
    font-size: 12px;
    margin: 0;
}

.template-2 .ind-form-field .upload-wrapper.sm-line.mandatory-box .error-fields {
    display: block;
    font-size: 12px;
    position: absolute;
    left: 0;
    bottom: -9px;
}

.template-2 .ind-form-field .input-block .ind-task-input.selectize-custom {
    order: 1;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF !important;
    height: 50px;
}

.template-3 .ind-form-field .input-block {
    border: 0;
    border-bottom: 1px solid #E4E6E9;
}

.template-3 .ind-form-field .input-block:after,
.template-3 .ind-form-field .radio-wrapper:after,
.template-3 .ind-form-field .checkbox-wrapper:after {
    content: none;
}

.template-3 .ind-form-field .fiels-inp-box {
    padding-left: 0;
}

.template-3 .ind-form-field .anim-text {
    left: 0;
}

.template-3 .ind-form-field .radio-wrapper {
    padding: 10px 0;
    border: 0;
}

.template-3 .ind-form-field .checkbox-wrapper {
    padding: 10px 0;
    border: 0;
}

.template-3 .ind-form-field .upload-wrapper.sm-line {
    padding: 0;
    border: 0;
}

.template-3 .ind-form-field .react-datepicker__input-container input {
    padding: 0;
}

.template-3 .ind-form-field .signature-canvas {
    padding: 20px 0;
}

.template-3 .ind-form-field .sig-button-block {
    padding: 0 0 20px;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view {
    border: 0;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    border-bottom: 1px solid #E4E6E9;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    border-bottom: 1px solid #E4E6E9;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    border-bottom: 1px solid #E4E6E9;
}

.template-3 .checkbox-wrapper .select-chk-block {
    width: 100%;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .input-block,
.template-3 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line,
.template-3 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-3 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc((100% / 4) - 15px);
    margin-right: 15px;
}

.template-3 .ind-form-field .upload-wrapper.sm-line.mandatory-box,
.template-3 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line.mandatory-box {
    border-bottom: 1px solid #e14745;
}

.template-4 .modal-header {
    background: #ECF0F1;
    border-bottom: 0;
}

.template-4 .modal-body {
    background: #ECF0F1;
}

.template-4 .form-preview-container {
    float: left;
    width: 100%;
    padding: 20px 25px;
    background: #fff;
    box-shadow: 0 0 11px rgba(0, 0, 0, .12);
}

.template-4 .ind-form-field .input-block {
    overflow: unset;
    display: flex !important;
    flex-direction: column;
    margin-bottom: 35px;
    border: 0;
}

.template-4 .ind-form-field .input-block .anim-text {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: var(--default-text);
    font-size: 15px;
    line-height: 1.3;
    margin-bottom: 5px;
}

.template-4 .ind-form-field .input-block .fiels-inp-box {
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF !important;
    height: 50px;
    order: 1;
}

.template-4 .ind-form-field .input-block.active .anim-text,
.template-4 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-4 .ind-form-field .input-block.active .fiels-inp-box+.anim-text,
.template-4 .ind-form-field .input-block textarea:focus+.anim-text,
.template-4 .ind-form-field .input-block.active textarea+.anim-text,
.template-4 .ind-form-field .input-block.drop:focus-within select+.anim-text,
.template-4 .ind-form-field .input-block.drop.active select+.anim-text {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: var(--default-text);
    font-size: 15px;
    line-height: 1.3;
    margin-bottom: 5px;
}

.template-4 .ind-form-field .input-block:after,
.template-4 .ind-form-field .radio-wrapper:after,
.template-4 .ind-form-field .checkbox-wrapper:after {
    content: none;
}

.template-4 .ind-form-field .input-block textarea.fiels-inp-box {
    height: 135px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 17px 20px;
    order: 1;
    width: 100% !important;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .input-block.mandatory-box textarea.fiels-inp-box {
    height: 50px;
    resize: auto;
    min-height: 50px;
}

.template-4 .ind-form-field .radio-wrapper,
.template-4 .ind-form-field .checkbox-wrapper {
    padding: 0;
    border: 0;
    margin-bottom: 35px;
}

.template-4 .checkbox-wrapper .select-chk-block {
    width: 100%;
}

.template-4 .ind-form-field .radio-wrapper h5,
.template-4 .ind-form-field .checkbox-wrapper h5 {
    font-size: 17px;
    line-height: 1.3;
    color: var(--default-text);
    margin-bottom: 20px;
    font-weight: 400;
}

.template-4 .ind-form-field .upload-wrapper.sm-line {
    border: 0;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    height: 50px;
    margin-bottom: 20px;
}

.template-4 .ind-form-field .react-datepicker__input-container input {
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    height: 50px;
}

.template-4 .ind-form-field .react-datepicker__input-container {
    height: 50px;
}

.template-4 .ind-form-field .react-datepicker-wrapper {
    height: 50px;
    margin-top: 43px;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .input-block,
.template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line,
.template-4 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-4 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc((100% / 4) - 15px);
    margin-right: 15px;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view {
    border: 0;
    align-items: flex-start;
}

.template-4 .ind-form-field .input-block .mce-container {
    border: 1px solid #E4E6E9;
}

.template-4 .ind-form-field .input-block .mce-container .mce-container {
    border: 0;
}

.template-4 .ind-form-field .input-block .mce-container .mce-edit-area {
    border-top: 1px solid #E4E6E9;
}

.template-4 .ind-form-field .signature-canvas {
    padding: 20px 0;
}

.template-4 .ind-form-field .sig-button-block {
    padding: 0 0 20px;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    height: 50px;
    margin-top: 0;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    padding: 0 15px;
    width: 100%;
}

.template-4 .ind-form-field .input-block.mandatory-box .fiels-inp-box {
    border-color: #e14745;
}

.template-4 .ind-form-field .radio-wrapper.mandatory-box:before,
.template-4 .ind-form-field .checkbox-wrapper.mandatory-box:before {
    content: none;
}

.template-4 .ind-form-field .upload-wrapper.sm-line.mandatory-box {
    border-bottom: 0;
}

.template-4 .input-block.mandatory-box .react-datepicker-wrapper {
    border: 0;
}

.template-4 .input-block.mandatory-box .react-datepicker__input-container input {
    border-color: #e14745;
}

.template-4 .input-block.drop.mandatory-box select {
    border-color: #e14745;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper.mandatory-box:before {
    bottom: -1px;
}

.template-4 .radio-wrapper.mandatory-box .error-fields {
    display: block;
    float: left;
    width: 100%;
    font-size: 12px;
    margin: 0;
}

.template-4 .checkbox-wrapper.mandatory-box .error-fields {
    display: block;
    float: left;
    width: 100%;
    font-size: 12px;
    margin: 0;
}

.template-4 .ind-form-field .upload-wrapper.sm-line.mandatory-box .error-fields {
    display: block;
    font-size: 12px;
    position: absolute;
    left: 0;
    bottom: -9px;
}

.template-4 .ind-form-field .input-block.date-field .form-control {
    height: 50px;
    border: 1px solid #E4E6E9;
    font-size: 16px;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field {
    padding-top: 27px;
}

.ind-form-field .input-block.hide {
    display: none !important;
}

.form-table-edit {
    float: left;
    display: flex;
}

.radio-wrapper.filter-block {
    margin: 0;
}

.filter-accord .radio-wrapper .radio-block {
    margin-right: 0;
    margin-bottom: 10px;
    width: 100%;
}

.filter-block .eq-width {
    width: 47%;
}

.filter-accord .task-input-block.eq-width {
    margin-bottom: 10px;
    margin-right: 10px;
}

.filter-accord .task-input-block.eq-width:last-child {
    margin-right: 0;
}

.filter-block .form-control {
    font-size: 12px;
}

.radio-wrapper .radio-block label {
    color: var(--default-text);
    font-size: 16px;
    line-height: 18px;
}

.build-form-ico:before {
    background-position: -351px -449px;
    width: 17px;
    height: 17px;
}

.build-form-ico:hover:before {
    background-position: -351px -427px;
}

.data-holder-right .form-table .table thead tr th:last-child,
.data-holder-right .form-table .table tbody tr td:last-child {
    text-align: left;
}

.att-file img {
    float: left;
    width: 20px;
    height: 20px;
    object-fit: cover;
    margin-right: 15px;
}

.att-text {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 160px;
    float: left;
}

.preview-table tbody tr td .attach-click .format {
    margin: 0;
    font-size: 10px;
    padding-top: 10px;
    padding-bottom: 0;
    width: 25px;
}

.preview-table tbody tr td .attach-click .format:before,
.preview-table tbody tr td .attach-click .format:after {
    border-width: 8px 0 0 8px;
}

.ind-collection-card {
    float: left;
    width: 100%;
    height: 223px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 3px;
    background: #FFFFFF;
    padding: 20px;
    margin-bottom: 20px;
    position: relative;
}

.collection-card-left {
    float: left;
    width: 100px;
    padding-right: 0px;
    margin-right: 30px;
    position: relative;
}

.collection-card-right {
    float: left;
    width: calc(100% - 135px);
    height: 100%;
    display: flex;
    flex-direction: column;
}

.collection-card-left p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 10px;
    line-height: 11px;
    text-transform: uppercase;
}

.collection-card-left h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    line-height: 19px;
    color: var(--default-text);
    max-height: 57px;
    overflow: hidden;
}

.collection-card-right-header {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.collection-card-right-header p,
.collection-card-right-content p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 0;
}

.collection-card-right-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.collection-card-right-content {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    padding-bottom: 30px;
    margin-bottom: 13px;
}

.collection-card-right-footer {
    float: left;
    width: 100%;
}

.collection-card-right-footer ul li {
    float: left;
    margin-right: 40px;
    margin-bottom: 15px;
}

.collection-card-right-footer ul li p {
    float: left;
    width: 100%;
    font-size: 15px;
    color: var(--default-grey);
    margin-bottom: 5px;
    text-transform: uppercase;
}

.collection-card-right-footer ul li h5 {
    float: left;
    width: 100%;
    font-size: 13px;
    line-height: 17px;
    color: var(--default-text);
    text-transform: uppercase;
    max-height: 17px;
}

.collection-card-right-content h5 {
    float: left;
    width: 100%;
    font-size: 15px;
    line-height: 17px;
    color: var(--default-text);
    max-height: 34px;
    overflow: hidden;
}

.collection-card-right-footer ul li:last-child {
    margin-right: 0;
}

.switch-header {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    justify-content: flex-end;
}

.grid-view .ind-collection-card {
    width: calc((100% / 3) - 14px);
    margin-right: 20px;
    height: auto;
    min-height: 406px;
}

.grid-view .ind-collection-card:nth-child(3n) {
    margin-right: 0;
}

.grid-view .collection-card-left {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.grid-view .collection-card-right {
    float: left;
    width: 100%;
    justify-content: flex-start;
    height: auto;
}

.grid-view .collection-card-right-header,
.grid-view .collection-card-right-content {
    margin-bottom: 20px;
}

.grid-view .collection-card-right-footer ul li {
    width: 100%;
    display: flex;
    margin-right: 0;
    margin-bottom: 7px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    padding-bottom: 7px;
}

.grid-view .collection-card-right-footer ul li:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
}

.grid-view .collection-card-right-footer ul li p {
    font-size: 15px;
    line-height: 17px;
    margin-bottom: 0;
    padding-right: 15px;
}

.grid-view .collection-card-right-content h5 {
    font-size: 15px;
    line-height: 20px;
    overflow: hidden;
    max-height: 80px;
    word-break: break-word;
}

.list-view .collection-card-right-header h5 {
    max-height: 19px;
    overflow: hidden;
    max-width: 95%;
}

.grid-view .collection-card-right-footer ul li:last-child {
    margin-bottom: 0;
}

.fixed-card-area {
    float: left;
    width: 100%;
    height: 110px;
    max-width: calc(100% - 310px);
    padding: 20px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 5px 5px 0 0;
    background: #fff;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
    position: fixed;
    bottom: 0;
    right: 20px;
}

.fixed-card-area-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.fixed-card-area-body {
    float: left;
    width: 100%;
}

.fixed-card-content li {
    float: left;
    margin-right: 60px;
}

.fixed-card-area-header h5 {
    float: left;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.card-toggle {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    font-size: 12px;
    line-height: 17px;
    cursor: pointer;
}

.fixed-card-content li p {
    color: #999999;
    font-size: 14px;
    margin-bottom: 5px;
}

.fixed-card-content li h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    line-height: 20px;
}

.fixed-card-area.minimize {
    height: 36px;
    width: 160px;
}

.minimize .fixed-card-area-body {
    display: none;
}

.minimize .fixed-card-area-header h5 {
    display: none;
}

.fixed-card-area.minimize {
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0px 17px;
}

.fixed-card-area.minimize .fixed-card-area-header {
    margin-bottom: 0;
    display: flex;
    align-items: center;
}

.fixed-card-area.minimize .card-toggle {
    width: 100%;
    height: 35px;
}

.card-toggle:after {
    content: "";
    background: url(../images/sprite-v1.svg) no-repeat -373px -144px;
    width: 14px;
    height: 8px;
    display: inline-block;
    margin-left: 10px;
}

.minimize .card-toggle:after {
    transform: rotate(180deg);
}

.fixed-card-area.no-bg-area {
    background: transparent;
    box-shadow: none;
    border: 0;
    padding: 0;
    z-index: 99;
    bottom: -100px;
    height: auto;
    transition: .3s ease-out;
}

.tns-controls {
    display: none;
}

.itemed {
    float: left;
    width: 100%;
    height: 90px;
    background: #fff;
    border-radius: 5px;
}

.item-header {
    float: left;
    width: 100%;
    height: 45px;
    border-bottom: 1px solid #EEEEEE;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.item-footer {
    float: left;
    width: 100%;
    height: 45px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.item-header h5 {
    float: left;
    width: 100%;
    color: #686868;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
}

.item-footer h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: bold;
    line-height: 21px;
}

.right-content-wrapper.lay-white:before {
    content: "";
    width: 100%;
    height: 60px;
    background: linear-gradient(180deg, rgba(85, 85, 85, 0.01) 0%, rgba(255, 255, 255, 0.6) 100%);
    position: fixed;
    z-index: 9;
    bottom: 0;
}

.right-content-wrapper.lay-black:before {
    content: "";
    width: 100%;
    height: 60px;
    background: linear-gradient(180deg, rgba(85, 85, 85, 0.01) 0%, rgba(69, 69, 69, 0.6) 100%);
    position: fixed;
    z-index: 9;
    bottom: 0;
    transition: .3s ease-out;
}

.right-content-wrapper.lay-black.activate-layer:before {
    height: 180px;
}

.tns-inner {
    cursor: grab;
}

.fixed-card-nav {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 18px;
}

.tns-outer {
    float: left;
    width: 100%;
}

.fixed-card-nav h5 {
    float: left;
    color: #2C3137;
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
}

.card-arrow {
    float: left;
    height: 31px;
    width: 31px;
    border: 0.5px solid #49A7EA;
    background-color: var(--default-color);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    margin-left: 15px;
}

.tns-outer {
    float: left;
    width: 100%;
}

.fixed-card-nav h5 {
    float: left;
    color: #2C3137;
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
}

.card-arrow {
    float: left;
    height: 31px;
    width: 31px;
    border: 0.5px solid #49A7EA;
    background-color: var(--default-color);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    position: relative;
    padding: 0;
    cursor: pointer;
}

.card-arrow:before {
    content: "";
    height: 10px;
    width: 10px;
    border-style: solid;
    border-color: white;
    border-width: 0px 1.5px 1.5px 0px;
    transform: rotate(45deg);
    transition: border-width 150ms ease-in-out;
    position: absolute;
    left: calc(50% - 5px);
    top: 11px;
    transform: rotate(225deg);
}

.switch .card-arrow:before {
    content: "";
    height: 10px;
    width: 10px;
    border-style: solid;
    border-color: white;
    border-width: 0px 1.5px 1.5px 0px;
    transform: rotate(45deg);
    transition: border-width 150ms ease-in-out;
    position: absolute;
    left: calc(50% - 6px);
    top: 8px;
}

.fixed-card-area.no-bg-area.switch {
    bottom: 20px;
}

.card-container {
    float: left;
    width: 100%;
}

.edit-template .task-input-box {
    height: 25px;
    width: 100%;
    font-size: 10px;
    text-transform: uppercase;
}

.grid-view .edit-template .task-input-box {
    height: 25px;
    width: 100%;
    font-size: 10px;
    text-transform: uppercase;
}

.edit-template .task-input-block {
    margin-bottom: 5px;
}

.edit-template .select-box select {
    height: 35px;
    font-size: 14px;
    line-height: 19px;
    color: var(--default-text);
    padding-left: 14px;
    padding-right: 27px;
}

.edit-template .select-box:after {
    right: 12px;
}

.grid-view .edit-template .select-box {
    width: 100%;
}

.edit-template .select-box {
    width: 100%;
}

.collection-card-right-footer ul li .task-input-block {
    width: 50%;
}

.edit-template .collection-card-right-footer ul li .task-input-box {
    width: calc(100% - 20px);
    height: 35px;
}

.edit-template .collection-card-right-footer ul li .select-box {
    width: 50%;
}

.list-view .edit-template .collection-card-right-header {
    width: 150px;
}

.list-view .edit-template .collection-card-right-content {
    width: 150px;
}

.list-view .edit-template .collection-card-right-footer ul li {
    display: flex;
    flex-direction: column;
    margin-right: 40px;
}

.list-view .edit-template .collection-card-right-footer ul li .task-input-block {
    width: 100%;
}

.list-view .edit-template .collection-card-right-footer ul li .select-box {
    width: 100%;
}

.list-view .edit-template .collection-card-right-footer ul li .task-input-box {
    width: 100%;
}

.list-view .ind-collection-card.edit-template {
    height: auto;
}

.list-view .edit-template .collection-card-left {
    margin-right: 15px;
}

.list-view .edit-template .collection-card-right {
    width: calc(100% - 109px);
    align-items: normal;
}

.side-tab .tab-content .tab-pane .ind-collection-card.edit-template.list-view {
    height: auto;
    margin: 20px 0;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.06);
    background: #ecf0f1;
    padding: 0;
}

.side-tab .tab-content .tab-pane .collection-card-left {
    width: 130px;
    margin-right: 20px;
}

.side-tab .tab-content .tab-pane .collection-card-right {
    width: calc(100% - 150px);
}

.side-tab .tab-content .tab-pane .collection-card-right-footer ul li .task-input-block {
    width: 100%;
}

.side-tab .tab-content .tab-pane .edit-template .collection-card-right-footer ul li .select-box {
    width: 100%;
}

.side-tab .tab-content .tab-pane .edit-template .collection-card-right-footer ul li .task-input-box {
    width: 100%;
}

.side-tab .tab-content .tab-pane .collection-card-right-footer ul {
    float: left;
    width: 100%;
    display: flex;
}

.side-tab .tab-content .tab-pane .collection-card-right-content {
    margin-bottom: 20px;
}

.side-tab .tab-content .tab-pane .collection-card-right-header {
    margin-bottom: 20px;
}

.side-tab .tab-content .tab-pane .edit-template .task-input-box {
    height: 35px;
}

.side-tab .tab-content .tab-pane .collection-card-right-footer ul li {
    margin-right: 20px;
}

.side-tab .tab-content .tab-pane .edit-template .task-input-block {
    margin-bottom: 10px;
}

.side-tab .tab-content .tab-pane .grid-view .ind-collection-card {
    width: 100%;
    background: #ecf0f1;
    margin: 20px 0;
    padding: 0;
}

.side-tab .grid-view .collection-card-left {
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-left {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    padding: 20px 20px 0 20px;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right-footer ul li {
    width: 100%;
    display: flex;
    margin-right: 0;
    margin-bottom: 10px;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right-footer ul li .task-input-block {
    width: 50%;
}

.side-tab .tab-content .tab-pane .grid-view .edit-template .collection-card-right-footer ul li .task-input-box {
    width: calc(100% - 20px);
    height: 35px;
}

.side-tab .tab-content .tab-pane .grid-view .edit-template .collection-card-right-footer ul li .select-box {
    width: 50%;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right {
    width: 100%;
}

.side-tab .tab-content .tab-pane .grid-view .edit-template .select-box:after {
    top: 17px;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right-footer ul {
    flex-wrap: wrap;
}

.stage-default-block {
    float: left;
    width: 300px;
    height: 60px;
    display: flex;
    align-items: center;
    border: 1px solid #DEE1E4;
    padding: 0 20px;
    position: relative;
    border-radius: 3px;
    margin-bottom: 20px;
}

.stage-default-block .select-chk-block {
    margin: 0;
}

.tab-wrap-block .next-stage-selector .stage-default-block .select-chk-block {
    margin: 0;
}

.stage-default-block .radio-block {
    position: absolute;
    right: 20px;
    top: -8px;
    background: #fff;
    padding: 0 6px;
    display: flex;
    align-items: center;
    color: var(--default-grey);
}

.stage-default-block .radio-block label {
    position: relative;
    color: var(--default-grey);
}

.next-stage-selector.block-line {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.ind-form-field .form-type-input .form-control {
    height: 68px;
    border: 0;
    padding: 0 20px;
    color: var(--default-text);
}

.ind-form-field .rdtPicker td.rdtActive,
.ind-form-field .rdtPicker td.rdtActive:hover,
.ind-form-field .rdtPicker td.rdtDay:hover {
    background-color: var(--default-color) !important;
    border-radius: 5px;
    color: #fff;
}

.data-holder-left .filter-tag {
    margin: 5px 5px 0 0;
}

.settings-loungue-header {
    float: left;
    width: 100%;
    height: 70px;
    padding: 0;
    padding: 15px 20px;
}

.tab-wrap-block.full-width-tab {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tab-wrap-block-right .general-btn {
    height: 30px;
    padding: 0 15px;
    box-shadow: none;
}

.form-set .side-tab .tab-content .tab-pane {
    padding: 0;
}

.bg-back.bread-crumb .backto-list {
    border: 0;
}

.set-container {
    float: left;
    width: 100%;
    padding: 0 20px 20px 20px;
    height: calc(100% - 70px);
    overflow-y: auto;
}

.form-set .tab-wrap-block {
    float: left;
    width: 100%;
    height: 100%;
}

.form-set .tab-wrap-block .next-stage-selector {
    margin-top: 0;
}

.form-set .side-tab .tab-content {
    border: 0;
}

.form-set .form-table .table tbody tr td:first-child {
    padding-left: 0;
}

.form-set .form-table .table tbody tr td .select-chk-block {
    margin: 0;
}

.form-set .next-stage-selector .select-chk-block {
    margin: 0;
}

.form-set .set-container .next-stage-selector.block-line {
    margin-top: 10px;
}

.form-set .next-stage-selector .select-box-container .select-chk-block {
    margin-bottom: 20px;
}

.form-table .table tbody tr td:first-child .user-assigned-ico {
    position: absolute;
    right: 0;
    top: 16px;
}

.form-table .table tbody tr td:first-child {
    position: relative;
}

.inactive-assign {
    opacity: .3;
}

.data-holder-right .card-container.template-collection {
    height: 100%;
    overflow-y: auto;
    display: flex;
    flex-wrap: wrap;
}

.grid-view .collection-card-right-header h5 {
    max-height: 76px;
    overflow: hidden;
    min-height: 38px;
}

.form-set .set-container .next-stage-selector.block-line {
    margin-top: 10px;
}

.template-tab {
    float: left;
    width: 100%;
    height: 100%;
    border-top: 0;
}

.template-anchor {
    float: left;
    width: 100%;
    height: 55px;
    border-bottom: 1px solid #DEE1E4;
}

.template-anchor li {
    float: left;
    height: 100%;
    border-right: 1px solid #DEE1E4;
    border-top: 1px solid #DEE1E4;
}

.template-anchor li nav {
    float: left;
    padding: 0 50px;
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
    font-size: 14px;
    color: #444;
    font-weight: 600;
    cursor: pointer;
    background: #ecf0f1;
}

.template-anchor li nav.active:before {
    content: "";
    width: 100%;
    height: 5px;
    background: #ffffff;
    position: absolute;
    left: 0;
    bottom: -2px;
}

.template-content-block {
    float: left;
    width: 100%;
    height: calc(100% - 55px);
    border: 1px solid #DEE1E4;
    border-top: 0;
}

.template-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
    overflow-y: auto;
}

.template-tab-header {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: 50px;
    border-bottom: 1px solid #DEE1E4;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.template-tab-header h5 {
    float: left;
    font-weight: 600;
    color: var(--default-text);
    font-size: 16px;
}

.template-tab-header .control {
    font-size: 14px;
    color: var(--default-grey);
}

.template-anchor li:first-child {
    border-left: 1px solid #DEE1E4;
}

.template-anchor li nav.active {
    background: #fff;
    color: var(--default-color);
}

.radio-wrap {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.radio-wrap .radio-block {
    margin-right: 20px;
}

.form-preview-header {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}

.form-preview-header .preview-subheader {
    font-size: 25px;
    float: left;
    width: 100%;
    font-size: 25px;
    color: var(--default-text);
    margin-bottom: 8px;
    font-weight: 600;
    word-break: break-word;
}

.form-preview-header p {
    float: left;
    width: 100%;
    line-height: normal;
    font-size: 16px;
    color: var(--default-grey);
}

.collection-card-image {
    float: left;
    width: 100%;
    height: 105px;
    display: none;
    position: relative;
}

.collection-card-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.with-image .collection-card-image {
    display: block;
}

.without-image .collection-card-image {
    display: none;
}

.grid-view.with-image .collection-card-image img {
    height: 100%;
    border-radius: 3px 3px 0 0;
}

.grid-view.with-image .collection-card-image {
    height: 262px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.grid-view.with-image .ind-collection-card {
    padding: 0;
}

.grid-view.with-image .ind-collection-card .collection-card-left h5,
.grid-view.with-image .ind-collection-card .collection-card-left p {
    display: none;
}

.grid-view.with-image .collection-card-right {
    padding: 0 20px 20px 20px;
    min-height: 280px;
}

.list-view.with-image .collection-card-left h5,
.list-view.with-image .collection-card-left p {
    display: none;
}

.width-540 .container {
    max-width: 540px;
}

.width-720 .container {
    max-width: 720px;
}

.width-960 .container {
    max-width: 960px;
}

.width-1140 .container {
    max-width: 1140px;
}

.template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 50%;
}

.template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 33.33%;
}

.template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 25%;
}

.template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 50%;
}

.template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 33.33%;
}

.template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 25%;
}

.input-block.date-field .form-type-input {
    padding-top: 24px;
}

.input-block.date-field .form-type-input .form-control {
    border: 1px solid #E4E6E9;
}

.template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc((100% / 2) - 15px);
}

.template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc((100% / 3) - 15px);
}

.template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc((100% / 2) - 15px);
    margin-right: 15px;
}

.template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc((100% / 3) - 15px);
    margin-right: 15px;
}

.template-3 .input-block.date-field .form-type-input .form-control {
    border: 0;
    border-bottom: 1px solid #E4E6E9;
    padding: 0;
}

.template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc((100% / 2) - 15px);
}

.template-4.width-540 .ind-form-field .input-block textarea.fiels-inp-box {
    height: 50px;
    min-height: 50px;
    resize: auto;
}

.template-4.width-540 .input-block.date-field .form-type-input {
    padding: 0;
}

.template-4.width-540 .ind-form-field .input-block.date-field .form-control {
    padding: 0 20px;
}

.template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc((100% / 3) - 15px);
}

.template-4.width-720 .input-block.date-field .form-type-input {
    padding: 0;
}

.template-4.width-720 .ind-form-field .input-block.date-field .form-control {
    padding: 0 20px;
}

.template-1 .input-block.date-field .form-type-input {
    padding-top: 0;
}

.template-1.width-540 .ind-form-field .signature-canvas canvas {
    width: 270px !important;
}

.template-1.width-540.sig-preview {
    margin-top: 29px;
    height: 99px;
    margin-left: 25px;
}

.template-1.width-720 .ind-form-field .signature-canvas canvas {
    width: 400px !important;
}

.template-1.width-720 .sig-preview {
    margin-top: 22px;
    height: 108px;
    margin-left: 25px;
}

.template-2.width-540 .ind-form-field .signature-canvas canvas {
    width: 270px !important;
}

.template-2.width-540 .sig-preview {
    margin-top: 16px;
    height: 95px;
    margin-left: 25px;
}

.template-2.width-720 .ind-form-field .signature-canvas canvas {
    width: 400px !important;
}

.template-2.width-720 .sig-preview {
    margin-top: 22px;
    height: 108px;
    margin-left: 25px;
}

.template-3.width-540 .ind-form-field .signature-canvas canvas {
    width: 270px !important;
}

.template-3.width-540 .sig-preview {
    margin-top: 16px;
    height: 95px;
    margin-left: 25px;
}

.template-3.width-720 .ind-form-field .signature-canvas canvas {
    width: 400px !important;
}

.template-3.width-720 .sig-preview {
    margin-top: 22px;
    height: 108px;
    margin-left: 25px;
}

.template-4.width-540 .ind-form-field .signature-canvas canvas {
    width: 270px !important;
}

.template-4.width-540 .sig-preview {
    margin-top: 16px;
    height: 95px;
    margin-left: 25px;
}

.template-4.width-720 .ind-form-field .signature-canvas canvas {
    width: 400px !important;
}

.template-4.width-720 .sig-preview {
    margin-top: 22px;
    height: 108px;
    margin-left: 25px;
}

.radio-container {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.radio-container .radio-wrap {
    width: auto;
    margin-bottom: 0;
}

.radio-container .general-btn {
    height: 35px;
}

.modal-body .card-container.list-view .ind-collection-card {
    height: auto;
}

.modal-body .card-container.list-view .ind-collection-card {
    width: 100%;
    background: #ecf0f1;
    margin: 20px 0;
}

.card-container {
    float: left;
    width: 100%;
}

.grid-view .ind-collection-card {
    width: calc((100% / 3) - 14px);
    margin-right: 20px;
    height: auto;
    min-height: 406px;
}

.side-tab .tab-content .tab-pane .grid-view .ind-collection-card {
    width: 100%;
    background: #ecf0f1;
    margin: 20px 0;
    padding: 0;
}

.edit-template-left {
    float: left;
    width: 240px;
    padding: 20px;
    border-right: 1px solid rgba(64, 83, 100, 0.15);
}

.edit-template-right {
    float: left;
    width: calc(100% - 240px);
    height: 100%;
    padding: 0px;
}

.collection-card-left {
    float: left;
    width: 100px;
    padding-right: 0px;
    margin-right: 30px;
}

.grid-view .collection-card-left {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.side-tab .grid-view .collection-card-left {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    min-height: 20px;
}

.side-tab .tab-content .tab-pane .collection-card-left {
    width: 130px;
    margin-right: 20px;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-left {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    padding: 20px 20px 0 20px;
}

.side-tab .tab-content .tab-pane .edit-template-left .select-box {
    margin-bottom: 20px;
}

.side-tab .tab-content .tab-pane .edit-template-left .select-box:last-child {
    margin-bottom: 0;
}

.side-tab .tab-content .tab-pane .collection-card-left .select-box,
.side-tab .tab-content .tab-pane .collection-card-left .select-box:last-child {
    margin-bottom: 15px;
}

.side-tab .tab-content .tab-pane .edit-template-left .collection-card-left {
    width: 100%;
    padding: 0;
}

.edit-template-right-header {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: 50px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.edit-template-right-header h5 {
    font-weight: 600;
}

.edit-template-right-body {
    float: left;
    width: 100%;
    padding: 20px;
    height: calc(100% - 50px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.side-tab .tab-content .tab-pane .grid-view .ind-collection-card .edit-template-right-body .ind-collection-card.side-tab .tab-content .tab-pane .grid-view .ind-collection-card .edit-template-right-body .ind-collection-card {
    background: #fff;
    margin: 0;
}

.collection-card-right {
    float: left;
    width: calc(100% - 135px);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.collection-card-right-header p,
.collection-card-right-content p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 10px;
}

.collection-card-right-content h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 15px;
    color: var(--default-text);
    margin-top: 4px;
    max-height: 30px;
    overflow: hidden;
}

.collection-card-right-footer ul li p {
    float: left;
    width: 100%;
    font-size: 10px;
    color: var(--default-grey);
    margin-bottom: 5px;
}

.collection-card-right-footer ul li h5 {
    float: left;
    width: 100%;
    font-size: 13px;
    line-height: 17px;
    color: var(--default-text);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 200px;
    word-break: break-word;
}

.collection-card-right-content {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right {
    width: 100%;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right {
    width: 100%;
    padding: 0 20px;
}

.collection-card-right-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
}

.grid-view .collection-card-right-content h5 {
    font-size: 14px;
    line-height: 22px;
    overflow: hidden;
    max-height: 88px;
    min-height: 88px;
    width: 100%;
    word-break: break-word;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right-footer ul {
    flex-wrap: wrap;
}

.grid-view .collection-card-right-footer ul li p {
    font-size: 12px;
    line-height: 17px;
    margin-bottom: 0;
    width: 50%;
}

.side-tab .tab-content .tab-pane .grid-view .edit-template-left .select-box:last-child {
    margin: 0;
}

.form-type-input .form-control {
    border-color: #E3E5E8;
    font-size: 14px;
}

.side-tab .tab-content .tab-pane .grid-view .edit-template-left .select-box:last-child {
    margin: 0;
}

.side-tab .tab-content .tab-pane .grid-view .collection-card-right {
    width: 100%;
    padding: 0 20px 20px;
}

.side-tab .tab-content .tab-pane .edit-template-left .collection-card-left .collection-card-left {
    padding: 0;
}

.edit-template-right-body .card-container.grid-view.template-collection {
    width: 400px;
}

.template-body .form-table .table thead tr th:last-child,
.template-body .form-table .table tbody tr td:last-child {
    text-align: left;
}

.template-body .form-table .table thead th:first-child {
    width: 1%;
}

.form-set .template-body .form-table .table tbody tr td:first-child {
    padding: 12px 25px;
}

.form-set .template-body .form-table .table tbody tr td .select-chk-block .control {
    display: block;
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    font-size: 18px;
    margin: 0;
    height: 15px;
    width: 15px;
}

.collection-card-image .format {
    position: absolute;
    left: calc(50% - 21.5px);
    top: calc(50% - 25px);
    height: 50px;
    cursor: pointer;
}

.with-image .collection-card-left {
    padding: 0;
    /* background: #fafafa; */
    border-radius: 5px 5px 0 0;
}

.edit-template-right-body .card-container.grid-view.template-collection.with-image .ind-collection-card {
    min-height: 533px;
}

.side-tab .tab-content .tab-pane .grid-view.with-image .collection-card-left {
    padding: 0;
    border-radius: 5px 5px 0 0;
    border-bottom: 1px solid #eaeaea;
}

.side-tab .tab-content .tab-pane .grid-view.with-image .collection-card-left img {
    padding: 0;
    border-radius: 5px 5px 0 0;
}

.inline-flex-box {
    display: flex;
}

.side-tab .grid-view .collection-card-left .form-option-block {
    right: 0px;
    top: 10px;
}

.side-tab .grid-view.with-image .collection-card-left .form-option-block {
    right: 20px;
    top: 30px;
}

.template-1 .input-block.date-field .form-type-input.red-alert {
    border-bottom: 1px solid #e14745 !important;
}

.template-2 .input-block.date-field .form-type-input.red-alert .form-control {
    border: 1px solid #e14745 !important;
}

.template-3 .input-block.date-field .form-type-input.red-alert {
    border-bottom: 1px solid #e14745 !important;
}

.template-4 .input-block.date-field .form-type-input.red-alert .form-control {
    border: 1px solid #e14745 !important;
}

.template-1 .ind-form-field .upload-wrapper.sm-line.hide {
    display: none !important;
}

.template-2 .ind-form-field .upload-wrapper.sm-line.hide {
    display: none !important;
}

.template-3 .ind-form-field .upload-wrapper.sm-line.hide {
    display: none !important;
}

.template-4 .ind-form-field .upload-wrapper.sm-line.hide {
    display: none !important;
}

.ind-form-field .heading.hide {
    display: none !important;
}

.template-4.usr-profile .modal-body {
    padding: 0;
    height: calc(100vh - 70px);
    overflow: hidden;
    /* overflow-y: auto; */
}

.usr-profile .modal-header h5 {
    font-size: 18px;
    font-weight: 600;
    color: #444;
    padding: 0 35px;
}

.side-tab .grid-view.with-image .collection-card-left .collection-card-image:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .3);
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 3px 3px 0 0;
}

.side-tab .grid-view.with-image .collection-card-left .opt-form-ico:before {
    background-position: -220px -361px;
    width: 16px;
    height: 4px;
}

.collection-card-image .format:after {
    border-color: #b2b2b2 transparent transparent transparent;
}

.side-tab .tab-content .tab-pane .grid-view .ind-collection-card .edit-template-right-body .ind-collection-card .collection-card-image .format:after {
    border-color: #fafafa transparent transparent transparent;
}

.list-view .collection-card-image .format:after {
    border-color: #fafafa transparent transparent transparent;
}

.grid-view.with-image .collection-card-image audio:focus {
    outline: none;
}

.modal-body .collection-card-image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.create-date .radio-wrapper.eq-height-filter .task-input-block.eq-width {
    height: 35px;
    font-size: 14px;
}

.create-date .radio-wrapper.eq-height-filter .task-input-block.eq-width .task-input-box {
    font-size: 14px;
}

.list-view .collection-card-right {
    align-items: center;
    justify-content: space-between;
}

.form-table .table tbody tr:last-child td {
    border-bottom: 1px solid #E3E5E8;
}

.form-table .table thead th:first-child .share-text {
    position: absolute;
    right: -11px;
    top: 12px;
}

.form-table .table thead th:first-child {
    position: relative;
}

.data-holder.form-wrap.template-container-view {
    padding: 0 0 0 20px;
}

.template-container-view .data-holder-right .card-container.template-collection {
    padding-right: 10%;
}

.grid-view .collection-card-right-content {
    border: 0;
    padding: 0;
}

.template-container-view.vertical-list .data-holder-right .card-container.template-collection {
    padding-right: 20px;
}

.template-4 .input-block.date-field .form-type-input {
    padding-top: 0;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 13px;
    line-height: 15px;
    position: absolute;
    right: -5px;
    top: -39px;
    font-size: 0;
}

.template-4 .ind-form-field.fieldset.flex-box .input-block textarea.fiels-inp-box {
    height: 50px;
    resize: auto;
    min-height: 50px;
}

.template-3 .ind-form-field.fieldset.flex-box .input-block textarea.fiels-inp-box {
    height: 50px;
    resize: auto;
    min-height: 50px;
    max-width: 100%;
}

.template-1 .ind-form-field.fieldset.flex-box .input-block textarea.fiels-inp-box {
    height: 50px;
    resize: auto;
    min-height: 50px;
    max-width: 100%;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    margin-top: 23px;
    height: 50px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF !important;
    width: calc((100% / 4) - 15px);
    margin-right: 15px;
    padding: 0 15px;
}

.template-1 .ind-form-field .upload-wrapper.sm-line {
    height: 68px;
    border-top: 0;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 13px;
    line-height: 15px;
    position: absolute;
    right: -5px;
    top: -39px;
}

.template-2 .ind-form-field .input-block {
    margin-bottom: 30px;
}

.ind-form-field .rightButtons {
    left: -17px;
    right: unset;
    transform: rotate(270deg);
    bottom: 0;
}

.ind-form-field.fieldset .rightButtons .btnsubIcon {
    transform: rotate(-270deg);
}

.ind-form-field .input-block .rightButtons,
.ind-form-field .upload-wrapper.sm-line .rightButtons {
    left: unset;
    right: -31px;
    bottom: -8px;
    transform: rotate(0deg);
}

.ind-form-field .input-block .rightButtons .btnsubIcon {
    transform: rotate(0deg);
}

.template-4 .ind-form-field .fieldset .input-block:last-child {
    margin-bottom: 35px;
}

.template-4 .info-clicker-wrap,
.template-2 .info-clicker-wrap,
.template-6 .info-clicker-wrap {
    display: block;
    position: absolute;
    right: 0;
    top: 2px;
    z-index: 99;
}

.form-table .table tbody tr .edited-field {
    max-width: none;
}

.ind-form-field .fieldset:last-child .rdtPicker {
    position: absolute;
    left: 0;
    top: unset;
    bottom: 50px !important;
}

.ind-form-field.fieldset .upload-wrapper .rightButtons .btnsubIcon {
    transform: rotate(0deg);
}

.limit-text {
    float: left;
    width: 100%;
    white-space: nowrap;
    max-width: 160px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.input-block.date-field:last-child .rdtPicker {
    top: unset;
    bottom: 50px !important;
}

.template-4 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-4 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    top: 0px;
    font-size: 17px;
    color: var(--default-text);
}

.template-4 .ind-form-field .input-block .fiels-inp-box::-webkit-input-placeholder {
    color: #bdbdbd !important;
    opacity: 0;
}

.modal-body .close {
    opacity: 1;
    position: absolute;
    right: 15px;
    top: 11px;
    padding: 0;
    margin: 0;
    line-height: 0;
    cursor: pointer !important;
}

.modal-body .close:before {
    content: "";
    background: var(--sprite-one) no-repeat -252px -333px;
    width: 17px;
    height: 16px;
    display: inline-block;
}

.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 50%;
    font-size: 12px;
}

.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .att {
    font-size: 12px;
}

.task-tg .new-task-input.with-persistant-lbl.font-12 .persistant-label {
    font-size: 12px;
    flex-shrink: 0;
}

.task-input-container.item-same-line.font-12 {
    padding: 0 15px;
    padding-right: 0;
}

.task-tg .task-input-container.font-12 .task-input-block .form-type-input {
    padding-left: 10px;
    padding-right: 0;
}

.date-wrapper.date-same-line.font-12 .new-task-input {
    height: 36px;
    border-bottom: 0;
}

.date-wrapper.date-same-line.font-12 h5 {
    padding-left: 15px;
}

.template-4 .ind-form-field .autofill h5 {
    width: auto;
    font-size: 13px;
    margin-bottom: 0;
    line-height: 14px;
}

.template-4 .ind-form-field .input-block.autofill .ind-task-input.selectize-custom {
    border: 1px solid #E4E6E9;
    border-radius: 5px;
}

.template-4 .ind-form-field .autofill h5.autofill-label {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.3;
    color: var(--default-text);
    /* margin-bottom: 20px; */
}

.task-tg .new-task-input.with-persistant-lbl.font-12 {
    padding: 0 15px;
}

.date-wrapper.date-same-line.font-12 h5 {
    flex-shrink: 0;
}

.task-tg .task-input-container.font-12 .task-input-block .form-type-input:after {
    right: 14px;
}

.font-12.date-wrapper h5 {
    padding: 0;
}

.date-wrapper.item-same-line.font-12 {
    padding: 0 15px;
}

.date-wrapper.item-same-line.font-12 .new-task-input {
    height: 36px;
}

.inline-row {
    float: left;
    width: 100%;
    display: flex;
}

.date-wrapper.item-same-line.font-12 .new-task-input.perst-text {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.date-wrapper.item-same-line.font-12 .new-task-input.perst-text input {
    width: 150px;
    padding-right: 5px;
}

.day-text-persistant {
    font-size: 14px;
    color: #bdbdbd;
}

.instruction-model {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.instruction-model h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    color: var(--default-text);
    margin-bottom: 10px;
}

.instruction-model p {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: var(--default-grey);
    margin-bottom: 15px;
}

.instruction-model p:last-child {
    margin-bottom: 0;
}

.instruction-model ol {
    list-style-type: decimal;
    float: left;
    width: 100%;
    padding-left: 15px;
}

.instruction-model ol li {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 15px;
}

.instruction-model ol li:last-child {
    margin-bottom: \0;
}

.more-button-panel button {
    margin-left: 20px;
}

.drag-drop-area {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.drag-drop-container {
    float: left;
    width: 100%;
    height: 200px;
    border: 1px dashed var(--default-color);
    border-radius: 10px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s ease-out;
}

.drag-drop-container input {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
}

.drag-drop-container:hover {
    background: var(--default-color);
    box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.08);
}

.drag-drop-container label {
    font-size: 28px;
    font-weight: 300;
    color: var(--default-grey);
}

.drag-drop-container:hover label {
    color: #fff;
}

.dynamic-creation .drag-drop-area .attachment-task-group {
    padding: 0;
}

.upload-csv:before {
    background-position: -514px -247px;
    width: 20px;
    height: 20px;
    position: relative;
    top: 1px;
    margin-right: 10px;
}

.drag-drop-container:hover .upload-csv:before {
    background-position: -536px -247px;
    width: 20px;
    height: 20px;
}

.task-map-holder {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.task-map-holder .switch-button {
    float: left;
    display: flex;
    flex-direction: column;
    margin-right: 20px;
}

.switch-button label {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 16px;
    margin-bottom: 9px;
}

.task-map-label .input-box {
    height: 50px;
    width: 300px;
    border-radius: 5px;
}

.task-settings-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.switch-button .btn-toggle:before {
    content: "Enable";
}

.switch-button .btn-toggle:after {
    content: "Disable";
}

.switch-button .btn-toggle {
    width: 82px;
}

.switch-button .btn-toggle.active .handle {
    left: 57px;
}

.task-setting-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.task-setting-body-left {
    float: left;
    width: 540px;
    height: 100%;
    width: 50%;
    padding-right: 20px;
}

.task-setting-body-right {
    float: left;
    width: 50%;
    height: 100%;
}

.task-setting-body-panel {
    float: left;
    width: 100%;
    height: auto;
}

.task-field-each {
    float: left;
    width: 100%;
    height: 55px;
    border: 1px solid #ECEFF1;
    border-top: 0;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.task-field-each:first-child {
    border-radius: 5px 5px 0 0;
    border-top: 1px solid #ECEFF1;
}

.task-field-each:last-child {
    border-radius: 0 0 5px 5px;
}

.ind-field-list {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    cursor: move;
}

.counter-field {
    float: left;
    width: 21px;
    height: 21px;
    background-color: #B8C7CB;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.38px;
    line-height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.field-type-name {
    float: left;
    width: auto;
    min-height: 21px;
    border: 1px solid #B8C7CB;
    color: #94A0A3;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.38px;
    padding: 3px 8px;
    margin-left: -1px;
}

.task-field-each-left {
    line-height: 55px;
    min-width: 117px;
}

.task-field-each-left label {
    float: left;
    width: 100%;
    color: rgba(0, 0, 0, 0.5);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
}

.task-field-each-right .ind-field-list {
    margin-bottom: 0;
    height: 34px;
    border-radius: 22px;
    position: relative;
}

.task-field-each-right .ind-field-list .counter-field {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    position: absolute;
    left: -1px;
    top: 0px;
    background-color: var(--default-color);
    font-size: 16px;
}

.task-field-each-right .ind-field-list .field-type-name {
    min-height: auto;
    height: 32px;
    padding: 0 31px 0 39px;
    border-radius: 28px;
    background-color: #E1E4E6;
    border-color: #E1E4E6;
}

.task-field-each-right .ind-field-list .field-type-name p {
    line-height: 30px;
    font-size: 13px;
    letter-spacing: 0;
    color: var(--default-text);
}

.set-container.no-pad-right-bottom {
    padding-right: 0;
    padding-bottom: 0;
}

.task-setting-body-right-panel {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.task-tg.max-250 {
    float: left;
    width: 100%;
    height: 250px;
    overflow-y: auto;
}

.radio-container .select-chk-block label {
    font-size: 14px;
    color: var(--default-grey);
}

.template-1 .ind-form-field .input-block.drop .ind-task-input.selectize-custom {
    border: 0;
}

.template-1 .ind-form-field .input-block.drop.mandatory-box .ind-task-input.selectize-custom {
    border-bottom: 1px solid #e14745;
    border-radius: 0;
}

.template-2 .ind-form-field .input-block.drop.mandatory-box .ind-task-input.selectize-custom {
    border: 1px solid #e14745;
}

.template-3 .ind-form-field .input-block.drop .ind-task-input.selectize-custom {
    border: 0;
}

.template-3 .ind-form-field .input-block.drop.mandatory-box .ind-task-input.selectize-custom {
    border-bottom: 1px solid #e14745;
    border-radius: 0;
}

.template-4 .ind-form-field .input-block.drop.mandatory-box .ind-task-input.selectize-custom {
    border: 1px solid #e14745;
}

.form-set .side-tab .nav-pills {
    border-right: 1px solid #DEE1E4;
}

.with-opt .form-set .absolute-holder {
    background: #fff;
}

.ind-form-field .checkbox-wrapper .select-chk-block .control .checkbox-indicator {
    top: 3px;
}

.template-4 .ind-form-field .selectize-custom .tag-wrapper-bl input {
    max-width: unset;
    min-width: 250px;
}

.template-1 .input-block.autofill .autofill-label {
    padding: 0 20px;
    margin-top: 15px;
    margin-bottom: 0;
}

.template-1 .field-set .ind-form-field.fieldset {
    margin-bottom: 30px;
}

.template-1 .ind-form-field .input-block textarea {
    height: 200px;
}

.template-1 .limit-text {
    line-height: normal;
}

.width-540 .sig-preview {
    margin-top: 15px;
    width: 185px;
}

.template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: 50%;
}

.template-1 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-1 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    height: 69px;
    border-bottom: 1px solid #E4E6E9;
    border-top: 0;
}

/* .template-1 .ind-form-field.fieldset.flex-box .input-block textarea.fiels-inp-box {
    height: 68px;
    min-height: 68px;
} */
.template-1 .ind-form-field.fieldset.flex-box .input-block textarea.fiels-inp-box {
    height: 44px;
    min-height: 44px;
    padding-top: 0;
    margin-top: 25px;
}

.template-1 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    height: 70px;
}

.template-1 .ind-form-field.fieldset.flex-box .input-block.drop select {
    height: 69px;
}

.template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
.template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 33.343%;
}

.template-2 .ind-form-field .input-block.drop:before {
    z-index: 98;
    top: 47px;
}

.template-2 .ind-form-field .radio-wrapper .radio-block label,
.template-2 .ind-form-field .checkbox-wrapper .select-chk-block .control {
    color: var(--default-grey);
}

.template-2 .toggle .field-common.field-req-block {
    padding: 0;
    border-bottom: 0;
}

.template-2 .toggle .field-common label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 8px;
}

.template-2 .ind-form-field .upload-wrapper.sm-line {
    border: 1px solid #E4E6E9;
    margin-top: 0;
    padding: 0 20px;
    background-color: #fff;
    border-radius: 5px;
}

.template-2 .autofill-label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
}

.template-2 .input-block.date-field .form-type-input {
    padding-top: 0;
}

.template-2 .limit-text {
    line-height: normal;
}

.template-2 .field-set .ind-form-field.fieldset {
    margin-bottom: 30px;
}

.template-2 .ind-form-field .input-block textarea.fiels-inp-box {
    height: 200px;
}

.template-2 .ind-form-field .upload-wrapper.sm-line,
.template-2 .ind-form-field .radio-wrapper,
.template-2 .ind-form-field .checkbox-wrapper {
    margin-bottom: 30px;
}

.template-2 .ind-form-field .input-block.date-field .form-type-input .form-control {
    height: 50px;
    border: 1px solid #E4E6E9;
}

.template-2 .radio-wrapper.mandatory-box .error-fields,
.template-2 .checkbox-wrapper.mandatory-box .error-fields {
    margin: 10px 0;
}

.template-2 .ind-form-field .upload-wrapper.sm-line.mandatory-box .error-fields {
    position: relative;
    left: 0;
    bottom: 0px;
}

.template-2 .ind-form-field .upload-wrapper.sm-line.mandatory-box {
    border: 1px solid #E4E6E9;
}

.template-2 .ind-form-field .upload-wrapper.sm-line.mandatory-box {
    border-color: #e14745;
}

.template-2.width-720 .sig-preview {
    margin-top: 0px;
}

.template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc((100% / 2) - 15px);
    margin-right: 15px;
}

.template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
.template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: calc((100% / 3) - 15px);
    margin-right: 15px;
}

.template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line:last-child {
    margin-right: 0;
}

.template-2 .flex-box .toggle .field-common.field-req-block .btn-toggle {
    margin: 12px 0;
}

.template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field,
.template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field,
.template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field {
    margin-top: 23px;
}

.template-2 .ind-form-field.flex-box .upload-wrapper.sm-line.mandatory-box .error-fields {
    display: none;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line.mandatory-box {
    border-color: #e14745;
}

.template-3 .ind-form-field .input-block.drop select {
    padding-left: 0;
}

.template-3 .toggle .field-common.field-req-block {
    padding-left: 0;
}

.template-3 .ind-form-field .input-block textarea.fiels-inp-box {
    height: 200px;
}

.template-3 .ind-form-field .upload-wrapper.sm-line {
    border-bottom: 1px solid #E4E6E9;
}

.template-3 .limit-text {
    line-height: normal;
}

.template-3 .ind-form-field .input-block .ind-task-input.selectize-custom {
    padding-left: 0;
    height: auto;
    min-height: 67px;
}

.template-3 .autofill-label,
.template-3 .ind-form-field .signature-left label {
    margin: 10px 0;
    font-size: 12px;
    color: var(--default-grey);
    font-weight: 400;
}

.template-3.width-540 .sig-preview {
    margin-top: 25px;
}

.template-3 .ind-form-field .input-block.date-field {
    border: 0;
}

.template-3 .input-block.date-field .form-type-input .form-control {
    border-radius: 0;
}

.template-3 .ind-form-field .input-block {
    margin-bottom: 10px;
}

.template-3 .ind-form-field .radio-wrapper {
    margin-bottom: 10px;
}

.template-3 .ind-form-field .checkbox-wrapper {
    margin-bottom: 10px;
}

.template-3 .ind-form-field .upload-wrapper.sm-line {
    margin-bottom: 10px;
}

.template-3 .field-set .ind-form-field.fieldset {
    margin-bottom: 30px;
}

.template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc((100% / 2) - 15px);
}

.template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
.template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: calc((100% / 3) - 15px);
}

.template-3 .ind-form-field.fieldset.flex-box .input-block.drop select {
    height: 68px;
}

.template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line:last-child {
    margin-right: 0;
}

.template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field .form-type-input,
.template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field .form-type-input,
.template-3.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field .form-type-input {
    padding-top: 0;
}

/* .template-3 .ind-form-field.fieldset.flex-box .input-block textarea.fiels-inp-box {
    min-height: 68px;
} */
.template-3 .ind-form-field.fieldset.flex-box .input-block textarea.fiels-inp-box {
    margin-top: 25px;
    padding-top: 0;
    height: 44px;
    min-height: 44px;
}

.template-3 .ind-form-field .anim-text {
    top: 21px;
}

.template-4 .ind-form-field .input-block textarea.fiels-inp-box,
.template-4.width-540 .ind-form-field .input-block textarea.fiels-inp-box {
    height: 200px;
    resize: none;
}

.template-4 .ind-form-field .input-block.drop:before {
    z-index: 98;
    top: 47px;
}

.template-4 .toggle .field-common.field-req-block {
    padding: 0;
    height: auto;
}

.template-4 .toggle .field-common label {
    color: var(--default-text);
    font-size: 15px;
    line-height: 1.3;
    margin-bottom: 20px;
}

.template-4 .limit-text {
    line-height: normal;
}

.template-4 .field-set .ind-form-field.fieldset {
    margin-bottom: 35px;
}

.template-4 .radio-wrapper.mandatory-box .error-fields,
.template-4 .checkbox-wrapper.mandatory-box .error-fields {
    margin: 10px 0;
}

.template-4 .ind-form-field .upload-wrapper.sm-line.mandatory-box {
    border: 1px solid #E4E6E9;
}

.template-4 .ind-form-field .upload-wrapper.sm-line.mandatory-box {
    border-color: #e14745;
}

.template-4 .ind-form-field .upload-wrapper.sm-line.mandatory-box .error-fields {
    position: relative;
    left: 0;
    bottom: 0px;
}

.template-4 .ind-form-field .upload-wrapper.sm-line {
    margin-bottom: 0;
}

.template-4 .flex-box .toggle .field-common.field-req-block .btn-toggle {
    margin: 12px 0;
}

.template-4 .ind-form-field.flex-box .upload-wrapper.sm-line.mandatory-box .error-fields {
    display: none;
}

.template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc((100% / 2) - 15px);
}

.template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line:last-child {
    margin-right: 0;
}

.template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
.template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
.template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: calc((100% / 3) - 15px);
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line.mandatory-box {
    border-color: #e14745;
}

.full-width.template-5 .modal-header {
    background: transparent;
    border-bottom: 1px solid transparent;
}

.full-width.template-5 .modal-content {
    background: url(images/template-bg.jpg) center no-repeat;
    background-size: cover;
    background-color: #3f51b5;
}

.full-width.template-5 .modal-footer {
    background: transparent;
}

.template-5 .form-preview-header .preview-subheader {
    font-size: 40px;
    line-height: 50px;
    color: #fff;
    margin-bottom: 10px;
}

.template-5 .form-preview-header p {
    color: #9FD4FF;
    font-size: 19px;
    letter-spacing: 0;
    line-height: 23px;
}

.template-5 .form-preview-header {
    margin-bottom: 70px;
}

.template-5 .modal-body {
    padding: 68px 15px;
}

.template-5 .ind-form-field .input-block {
    margin-bottom: 70px;
}

.template-5 .ind-form-field .anim-text,
.template-5 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-5 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-5 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 0px;
}

.template-5 .ind-form-field .input-block textarea+.anim-text {
    top: 0;
}

.template-5 .ind-form-field .input-block {
    overflow: unset;
    display: flex !important;
    flex-direction: column;
    margin-bottom: 35px;
    border: 0;
    padding-left: 55px;
}

.template-5 .ind-form-field .input-block .fiels-inp-box {
    border: 0px solid #E4E6E9;
    border-radius: 5px;
    background-color: transparent !important;
    height: 70px;
    order: 1;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 0;
    padding: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    line-height: 23px;
}

.template-5 .ind-form-field .input-block textarea.fiels-inp-box {
    height: 150px;
    padding-top: 0;
}

.template-5 .ind-form-field .checkbox-wrapper {
    border: 0;
    margin-bottom: 10px;
    border: 0;
    padding-left: 55px;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
}

.template-5 .ind-form-field .radio-wrapper {
    border: 0;
    margin-bottom: 20px;
    border: 0;
    padding-left: 55px;
    padding-top: 0;
    padding-bottom: 0;
}

.template-5 .ind-form-field .upload-wrapper.sm-line {
    border: 0;
    border: 0;
    padding-left: 0px;
    height: 70px;
    padding-right: 0;
}

.template-5 .ind-form-field .radio-wrapper h5,
.template-5 .ind-form-field .checkbox-wrapper h5 {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
}

.template-5 .ind-form-field .checkbox-wrapper .select-chk-block {
    height: 90px;
    width: auto;
    min-width: 140px;
    border: 1px solid #FFFFFF;
    margin-right: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.template-5 .input-check-box {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
}

.template-5 .ind-form-field .checkbox-wrapper .select-chk-block .control {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    color: #FFFFFF;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 23px;
    text-align: center;
    z-index: 9;
    padding: 0 15px;
}

.template-5 .checkbox-indicator {
    height: 20px;
    width: 20px;
    left: 5px;
    top: 5px;
    background: transparent;
    border: 2px solid #ffffff;
    border-radius: 5px;
    opacity: 0;
}

.template-5 .input-check-box.active+.checkbox-indicator {
    background: rgba(0, 145, 255, 0.4);
    border: 0;
    border-radius: 5px;
    opacity: 1;
    float: left;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -2;
}

.template-5 .checkbox-indicator:after {
    left: 12px;
    top: 13px;
    background: var(--sprite-two) no-repeat -502px -118px;
    width: 12px;
    height: 9px;
    z-index: 9;
}

.template-5 .ind-form-field .input-block.date-field .form-type-input .form-control {
    background: transparent;
    padding: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 0;
    font-size: 18px;
    font-weight: 300;
    line-height: 23px;
    color: #fff;
    height: 70px;
}

.template-5 .ind-form-field .input-block.date-field .form-type-input .form-control::placeholder {
    color: #9FD4FF !important;
}

/* .template-5 .ind-form-field .input-block .fiels-inp-box::placeholder {
    opacity: 1;
    color: #9FD4FF !important;
} */
.template-5 .ind-form-field .radio-wrapper .radio-block {
    float: left;
    width: auto;
    min-width: 140px;
    height: 90px;
    margin-right: 20px;
    padding: 0;
    border: 1px solid #FFFFFF;
    border-radius: 5px;
}

.template-5 .ind-form-field .radio-wrapper .radio-block label {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 18px;
    color: #fff;
    line-height: 23px;
    padding: 0 15px;
}

.template-5 .radio-block label:before {
    top: 5px;
    left: 5px;
    width: 25px;
    height: 25px;
    background: #192C54;
    border: 2px solid #0091ff;
    opacity: 0;
}

.template-5 .radio-block input:checked+label:before {
    opacity: 1
}

.template-5 .radio-block input:checked+label:after {
    width: 9px;
    height: 9px;
    top: 13px;
    left: 13px;
    background-color: #0091ff;
}

.template-5 .file-upload {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed #FFFEFE;
    opacity: 0.4;
    border-radius: 5px;
}

.template-5 .file-upload label:before {
    content: none;
}

.template-5 .ind-form-field .file-upload label {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    color: #9FD4FF;
    padding: 0;
}

.template-5 .ind-form-field .upload-wrapper .file-tag {
    position: absolute;
    right: 20px;
    top: 23px;
    background: rgba(0, 145, 255, 0.4);
    border: 1px solid #0091ff;
    margin: 0;
}

.template-5 .limit-text {
    line-height: normal;
    color: #fff;
}

.template-5 .radio-block input:checked+label {

    background: rgba(0, 145, 255, 0.4);
}

.template-5 .input-check-box.active+.checkbox-indicator:before {
    content: "";
    width: 25px;
    height: 25px;
    border: 2px solid #0091ff;
    position: absolute;
    border-radius: 5px;
    left: 5px;
    top: 5px;
    background-color: #192C54;
    z-index: 9;
}

.template-5 .ind-form-field .upload-wrapper.sm-line .upload-progress {
    width: 100%;
    left: unset;
    right: 0;
}

.template-5 .cl-fl {
    background: #0091ff;
}

.template-5 .ind-form-field .input-block .fiels-inp-box option {
    background-color: var(--default-text);
}

.template-5 .ind-form-field .ind-form-field.fieldset .form-header-block h5 {
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 5px;
}

.template-5 .ind-form-field .ind-form-field.fieldset .form-header-block p {
    color: #9FD4FF;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 6px;
    float: left;
}

.template-5 .ind-form-field .fieldset:before {
    content: none;
}

.template-5 .ind-form-field .fieldset {
    padding-left: 55px;
}

.template-5 .style-view {
    border: 1px dashed #FFFEFE;
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.1);
    padding: 30px;
    margin-top: 24px;
}

.template-5 .ind-form-field .radio-wrapper.single-col .radio-block {
    width: auto;
    height: 40px;
    display: block;
}

.template-5 .ind-form-field .radio-wrapper.single-col .radio-block label {
    justify-content: flex-start;
    padding: 0 15px;
}

.template-5 .ind-form-field .radio-wrapper.single-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.template-5 .single-col .radio-block-container {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.template-5 .single-col .radio-block label:before {
    position: relative;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    margin-right: 10px;
    display: none;
}

.template-5 .single-col .radio-block input:checked+label:before {
    position: relative;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    margin-right: 10px;
    display: inline-block;
}

.template-5 .single-col .radio-block input:checked+label:after {
    top: 15px;
    left: 22px;
    width: 8px;
    height: 8px;
}

.template-5 .ind-form-field .input-block:before,
.template-5 .ind-form-field .checkbox-wrapper:before,
.template-5 .ind-form-field .radio-wrapper:before,
.template-5 .ind-form-field .fieldset:before {
    content: "";
    background: var(--sprite-two) no-repeat -467px -107px;
    width: 30px;
    height: 30px;
    position: absolute;
    left: 0;
    top: 0;
}

.template-5 .ind-form-field .input-block.drop:after {
    content: "";
    background: var(--sprite-two) no-repeat -519px -115px;
    width: 19px;
    height: 12px;
    position: absolute;
    right: 0;
    bottom: 28px;
}

.template-5 .ind-form-field .input-block.date-field:after {
    content: "";
    background: var(--sprite-two) no-repeat -542px -111px;
    width: 18px;
    height: 19px;
    position: absolute;
    right: 0;
    bottom: 28px;
}

.template-5 .ind-form-field .checkbox-wrapper .select-chk-block .control .checkbox-indicator {
    top: 0;
}

.template-5 .modal-header .close:before {
    background: var(--sprite-one) no-repeat -11px -125px;
    width: 16px;
    height: 16px;
}

.template-4 .ind-form-field .input-block .field-header {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: var(--default-text);
    font-size: 15px;
    line-height: 1.3;
    margin-bottom: 5px;
    font-weight: 400;
    float: left;
    width: 100%;
}

.template-4 .ind-form-field .file-upload label {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.template-4 .input-block.date-field .form-type-input:before {
    content: "";
    background: var(--sprite-one) no-repeat -375px -159px;
    width: 14px;
    height: 14px;
    position: absolute;
    right: 20px;
    top: calc(50% - 7px);
}

.template-5 .field-header,
.template-5 .toggle .field-common label {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
}

.template-5 .ind-form-field .heading h4 {
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 5px;
}

.template-5 .ind-form-field .heading p {
    color: #9FD4FF;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 23px;
}

.template-5 .toggle .field-common.field-req-block {
    padding: 0;
    height: auto;
}

.template-5 .input-block.date-field .form-type-input {
    padding-top: 0;
}

.template-5 .ind-form-field .rightButtons {
    left: unset;
    right: -20px;
    bottom: 4px;
}

.template-5 .signature-canvas {
    background: transparent;
    padding-top: 0;
    padding-left: 0;
    padding-bottom: 15px;
}

.template-5 .signature-left .label-header {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
    width: 100%;
}

.template-5 .ind-form-field .signature-canvas canvas {
    background-color: rgba(0, 145, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.4);
}

.template-5 .sig-preview {
    background-color: rgba(0, 145, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.4);
    margin-top: 55px;
}

.template-5 .sig-preview:before {
    border-radius: 3px;
}

.template-5 .ind-form-field .sig-button-block {
    padding-left: 0;
    padding-bottom: 0;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 25%;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc(25% - 20px);
    margin-right: 0px;
    padding-left: 0;
    margin-right: 20px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line label {
    padding: 0;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .input-block textarea.fiels-inp-box {
    min-height: 70px;
    resize: auto;
    max-width: 100%;
    min-width: 100%;
    height: 70px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper .select-chk-block {
    height: 70px;
    max-width: 100%;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc(25% - 20px);
    padding-left: 0;
    margin-right: 20px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper .select-chk-block .control {
    white-space: nowrap;
    justify-content: end;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 22px 36px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .upload-progress {
    width: calc(100% - 20px);
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    top: -4px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    top: -54px;
    right: 13px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line label {
    padding: 0 10px;
}

.template-5.width-720 .sig-preview {
    margin-top: 60px;
    height: 108px;
    margin-left: 25px;
}

.template-5.width-720 .sig-preview {
    margin-top: 60px;
    height: 108px;
    margin-left: 25px;
}

.template-5.width-720 .ind-form-field .signature-canvas canvas {
    width: 400px !important;
}

.template-5.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 50%;
}

.template-5.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc(50% - 20px);
    height: auto;
    margin-bottom: 20px;
}

.template-5.width-540 .ind-form-field .signature-canvas canvas {
    width: 270px !important;
}

.template-5.width-540 .sig-preview {
    margin-top: 64px;
    height: 95px;
    margin-left: 25px;
}

.template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 100%;
}

.template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: 100%;
    height: auto;
}

.template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .att {
    font-size: 18px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: calc(25% - 20px);
    height: 126px;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    margin-right: 20px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper .radio-block {
    height: 70px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper .radio-block label {
    white-space: nowrap;
    justify-content: end;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 22px 36px;
}

.template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: 100%;
}

.template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
}

.template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .att {
    font-size: 16px;
}

.template-3 .field-header {
    display: none;
}

.template-3 .ind-form-field .checkbox-wrapper h5 {
    font-size: 12px;
    color: var(--default-grey);
    font-weight: 400;
    text-transform: capitalize;
    margin-bottom: 10px;
    line-height: 20px;
}

.template-3 .ind-form-field .fieldset {
    margin-top: 25px;
}

.template-3 .ind-form-field .upload-wrapper.sm-line {
    border-bottom: 0;
    margin-bottom: 0;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
    border-bottom: 0;
    margin-bottom: 0;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .input-block {
    height: 69px;
}

.template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line,
.template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
}

.template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .att {
    font-size: 16px;
}

.template-3 .input-block.date-field .form-type-input:before {
    content: "";
    background: var(--sprite-one) no-repeat -375px -159px;
    width: 14px;
    height: 14px;
    position: absolute;
    right: 20px;
    top: 51px;
}

.template-2 .ind-form-field .input-block .field-header {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 8px;
    font-weight: 400;
}

.template-2 .input-block.date-field .form-type-input:before {
    content: "";
    background: var(--sprite-one) no-repeat -375px -159px;
    width: 14px;
    height: 14px;
    position: absolute;
    right: 20px;
    top: calc(50% - 7px);
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line,
.template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line,
.template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
    margin-top: 0;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 0;
}

.template-2 .ind-form-field .upload-wrapper.sm-line {
    margin-bottom: 0;
}

.template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .att {
    font-size: 16px;
}

.template-1 .ind-form-field .checkbox-wrapper h5 {
    font-size: 12px;
    color: var(--default-grey);
    font-weight: 400;
    margin-bottom: 8px;
    line-height: 20px;
}

.template-1 .field-header {
    display: none;
}

.template-1 .ind-form-field .fieldset {
    margin-top: 35px;
}

.template-1 .ind-form-field .upload-wrapper.sm-line {
    border: 0;
}

.template-1 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
}

.template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
}

.template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    height: 71px;
}

.template-5 .autofill-label {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
}

.template-5 .ind-form-field .input-block .ind-task-input.selectize-custom {
    padding: 0;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    height: auto;
    min-height: 70px;
    border-radius: 0;
    order: 1;
}

.template-5 .ind-form-field .input-block.drop .ind-task-input.selectize-custom+.anim-text {
    display: block !important;
    order: 0;
}

.template-5 .field-set .ind-form-field {
    margin-bottom: 35px;
}

.template-5 .ind-form-field .tag-wrapper-bl input {
    background: transparent;
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    line-height: 23px;
}

.template-5 .ind-form-field .tag-wrapper-bl input::placeholder {
    opacity: 1;
    color: #9FD4FF !important;
    text-transform: Capitalize;
}

.template-5 .signature-left .label-header label {
    margin-bottom: 0;
}

.template-5 .ind-form-field .ind-form-field.fieldset .checkbox-wrapper h5 {
    margin-bottom: 24px;
}

.template-5 .field-set .checkbox-wrapper.ind-form-field {
    margin-bottom: 15px;
}

.template-5 .ind-form-field .ind-form-field.fieldset .radio-wrapper h5 {
    margin-bottom: 24px;
}

.template-5 .ind-form-field .ind-form-field.fieldset .input-block .field-header {
    margin-bottom: 24px;
}

.template-4 .radio-block label:before {
    top: 1px;
}

.template-4 .radio-block input:checked+label:after {
    top: 5px;
}

.template-4 .ind-form-field .radio-wrapper .radio-block {
    width: 100%;
    margin-bottom: 20px;
}

.template-4 .ind-form-field .radio-wrapper .radio-block:last-child {
    margin-bottom: 0;
}

.template-4 .ind-form-field .fieldset .style-view .input-block:last-child {
    margin-bottom: 0;
}

.template-4 .ind-form-field .signature-left label {
    color: var(--default-text);
    font-size: 15px;
    line-height: 1.3;
    margin-bottom: 5px;
}

.template-4 .ind-form-field .signature-canvas {
    padding-top: 0;
}

.template-4 .ind-form-field .sig-button-block {
    padding-bottom: 0;
}

/* .template-4 .ind-form-field .autofill h5.autofill-label {
    margin-bottom: 5px;
} */
.template-4 .ind-form-field .input-block.autofill .ind-task-input.selectize-custom {
    height: auto;
    min-height: 50px;
}

.template-4 .ind-form-field .input-block.drop:before {
    top: 48px;
}

.template-4 .form-preview-container .ind-form-field:last-child {
    margin-bottom: 0;
}

.full-width.template-3 .modal-header {
    background: transparent;
    border-bottom: 0;
}

.template-3 .form-preview-container {
    float: left;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 11px rgba(0, 0, 0, .12);
    padding: 40px;
}

.template-3 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    top: 11px;
}

.template-3 .radio-block label:before {
    top: 1px;
}

.template-3 .radio-block input:checked+label:after {
    top: 5px;
}

.template-3 .ind-form-field .radio-wrapper .radio-block {
    width: 100%;
    margin-bottom: 21px;
}

.template-3 .ind-form-field .radio-wrapper .radio-block label {
    line-height: 17px;
}

.template-3 .ind-form-field .radio-wrapper .radio-block:last-child {
    margin-bottom: 0;
}

.template-3 .ind-form-field .radio-wrapper {
    padding: 0;
}

.template-3 .ind-form-field .checkbox-wrapper {
    padding: 0;
}

.template-3 .ind-form-field .checkbox-wrapper h5 {
    margin-bottom: 8px;
}

.template-3 .checkbox-wrapper .select-chk-block:last-child {
    margin-bottom: 0;
}

.template-3 .input-block.date-field .form-type-input {
    padding-top: 0;
}

.template-3 .input-block.date-field .form-type-input:before {
    content: "";
    background: var(--sprite-one) no-repeat -286px -302px;
    width: 20px;
    height: 21px;
    position: absolute;
    right: 24px;
    top: calc(50% - 10.5px);
}

.template-3 .input-block.date-field .form-type-input .form-control::placeholder {
    text-transform: capitalize;
}

.template-3 .ind-form-field .fieldset {
    margin: 15px 0px;
}

.template-3 .ind-form-field .signature-canvas {
    padding-top: 0;
}

.template-3 .ind-form-field .signature-canvas .label-header label {
    line-height: 16px;
    margin: 0;
    margin-bottom: 8px;
}

.template-3 .ind-form-field .anim-text {
    top: 27px;
}

.template-3 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-3 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    top: 13px;
}

.template-3 .input-block.date-field .form-type-input .form-control {
    font-size: 16px;
}

.template-3 .ind-form-field .input-block.date-field .field-header {
    display: block;
    position: absolute;
    left: 0;
    top: 9px;
    z-index: 9;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
}

.template-3 .ind-form-field .input-block.date-field {
    position: relative;
}

.template-3 .ind-form-field .upload-wrapper .file-tag {
    margin-right: 0;
}

.template-3 .autofill-label {
    margin-top: 0;
    margin-bottom: 0;
    display: none;
}

.template-3 .input-block.date-field .form-type-input .form-control::placeholder {
    opacity: 0;
}

.template-2 .radio-block label:before {
    top: 2px;
}

.template-2 .radio-block input:checked+label:after {
    top: 6px;
}

.template-2 .ind-form-field .fieldset {
    margin-bottom: 30px;
}

.template-2 .ind-form-field .signature-left label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 8px;
}

.template-2 .ind-form-field .upload-wrapper .file-tag {
    margin-right: 0;
}

.template-1 .ind-form-field .fiels-inp-box {
    height: 67px;
}

.template-1 .radio-block label:before {
    top: 2px;
}

.template-1 .radio-block input:checked+label:after {
    top: 6px;
}

.template-1 .input-block.autofill .autofill-label {
    display: none;
}

.template-1 .ind-form-field .input-block.date-field .form-type-input .form-control::placeholder {
    text-transform: capitalize;
}

.ind-form-field .photo-capture .radio-wrapper .radio-block {
    width: auto;
}

.ind-form-field .photo-capture .radio-wrapper {
    margin-bottom: 0;
}

.capture-mode-1 {
    float: left;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.shot_preview {
    float: left;
}

.shot_preview video {
    float: left;
    padding: 10px;
    width: 300px;
    border: 1px solid #E4E6E9;
    margin-bottom: 20px;
    border-radius: 5px;
    background: #fff;
}

.cam-preview {
    float: left;
    width: 300px;
    height: 300px;
    padding: 17px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    position: relative;
    background: #fff;
}

.cam-preview img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.cam-preview:before {
    content: "Preview";
    position: absolute;
    right: 16px;
    top: -12px;
    background: #fff;
    padding: 0px 5px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    font-size: 15px;
    line-height: 22px;
}

.capture-mode-2 {
    float: left;
    width: 100%;
}

.capture-mode-2 .cam-preview {
    margin-top: 30px;
    width: 100%;
    height: auto;
    object-fit: contain;
    display: flex;
    align-items: center;
    justify-content: center;
}

.capture-mode-2 .cam-preview img {
    max-width: 300px;
}

.data-holder-right.filter-strech {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    align-items: stretch;
}

.filter-tag-add-block {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 5px;
    min-height: 25px;
    flex-shrink: 0;
}

.filter-tag-block-left {
    float: left;
    width: 100%;
    display: flex;
    padding-right: 50px;
}

.filter-tag-block-left .filter-tag-block {
    margin-right: 5px;
    margin-bottom: 5px;
}

.filter-tag-block-left .filter-tag-block .filter-tag {
    margin: 0;
    background: var(--btn-color);
}

.filter-tag-block-right {
    position: absolute;
    right: 12px;
    top: 0;
}

.filter-tag-block-left .search-text {
    flex-shrink: 0;
    margin-right: 10px;
}

.filter-tag-block-right .clear-all {
    cursor: pointer;
    background: #fff;
    height: 20px;
    display: flex;
    align-items: center;
    padding: 2px 10px;
}

.tag-list {
    padding-right: 20px;
}

.checbox-with-image-text {
    float: left;
    width: 100%;
}

.checbox-with-image-text img {
    float: left;
    width: 100%;
    max-width: 600px;
}

.template-5 .checbox-with-image-text p {
    float: left;
    width: 100%;
    color: #9FD4FF;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 20px;
    margin-bottom: 24px;
}

.template-4 .checbox-with-image-text p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 20px;
    margin-bottom: 24px;
}

.template-3 .checbox-with-image-text p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.template-2 .checbox-with-image-text p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.template-1 .checbox-with-image-text p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 0 !important;
}

.template-5 .ind-form-field .photo-capture .radio-wrapper {
    padding-left: 0;
    margin-bottom: 25px;
}

.template-5 .ind-form-field .photo-capture .radio-wrapper:before {
    content: none;
}

.template-5 .shot_preview video,
.template-5 .cam-preview {
    background: rgba(0, 145, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.4) !important;
}

.template-5 .cam-preview:before {
    background: rgb(13, 92, 169);
    border-color: rgba(255, 255, 255, 0.4) !important;
    color: #fff;
}

.template-3 .ind-form-field .input-block.photo-capture-block .field-header {
    font-size: 12px;
    color: var(--default-grey);
    font-weight: 400;
    display: block;
}

.template-3 .ind-form-field .input-block.photo-capture-block {
    border-bottom: 0;
}

.template-3 .ind-form-field .capture-mode-2 .upload-wrapper.sm-line {
    border-bottom: 1px solid #e4e6e9;
}

.template-3 .cam-preview:before {
    color: var(--default-grey)
}

.template-1 .ind-form-field .input-block.photo-capture-block .field-header {
    font-size: 12px;
    color: var(--default-grey);
    font-weight: 400;
    display: block;
    padding: 0 20px;
    margin-top: 10px;
}

.template-1 .ind-form-field .photo-capture .radio-wrapper {
    border: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}

.template-1 .photo-capture {
    float: left;
    width: 100%;
    padding: 0 20px 20px;
}

.template-1 .ind-form-field .capture-mode-2 .upload-wrapper.sm-line {
    border: 1px solid #e4e6e9;
}

.template-1.width-540 .shot_preview video {
    width: 100%;
}

.template-1.width-540 .cam-preview {
    width: 100%;
}

.template-1.width-540 .capture-mode-1 {
    flex-direction: column;
}

.template-1.width-540 .shot_preview {
    margin-bottom: 20px;
}

.template-2.width-540 .shot_preview video {
    width: 100%;
}

.template-2.width-540 .cam-preview {
    width: 100%;
}

.template-2.width-540 .capture-mode-1 {
    flex-direction: column;
}

.template-2.width-540 .shot_preview {
    margin-bottom: 20px;
}

.template-3.width-540 .shot_preview video {
    width: 100%;
}

.template-3.width-540 .cam-preview {
    width: 100%;
}

.template-3.width-540 .capture-mode-1 {
    flex-direction: column;
}

.template-3.width-540 .shot_preview {
    margin-bottom: 20px;
}

.template-4.width-540 .shot_preview video {
    width: 100%;
}

.template-4.width-540 .cam-preview {
    width: 100%;
}

.template-4.width-540 .capture-mode-1 {
    flex-direction: column;
}

.template-4.width-540 .shot_preview {
    margin-bottom: 20px;
}

.template-5.width-540 .shot_preview video {
    width: 100%;
}

.template-5.width-540 .cam-preview {
    width: 100%;
}

.template-5.width-540 .capture-mode-1 {
    flex-direction: column;
}

.template-5.width-540 .shot_preview {
    margin-bottom: 20px;
}

.form-table-edit.text-number {
    float: right;
}

.collection-dashboard {
    float: left;
    width: auto;
    height: 35px;
    padding: 0 20px;
    margin-left: 14px;
    background: #fff;
    border: 1px solid var(--default-color);
    border-radius: 3px;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.collection-dashboard:hover {
    background: var(--default-color);
}

.side-bar-panel.collection-clik-panel {
    top: 57px;
}

.collection-dashboard-item-container {
    float: left;
    width: 100%;
    height: 100%;
}

.collection-dashboard-item {
    float: left;
    width: calc((100% / 2) - 10px);
    border-radius: 5px;
    background-color: #FFFFFF;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    margin-right: 20px;
    margin-bottom: 20px;
    border: 1px solid #EEEEEE;
}

.collection-dashboard-item .title {
    float: left;
    width: 100%;
    height: 45px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.collection-dashboard-item .item-detail {
    float: left;
    width: 100%;
    height: 45px;
    border-top: 1px solid #EEEEEE;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.collection-dashboard-item:nth-child(2n) {
    margin-right: 0;
}

.collection-dashboard-item .title h5 {
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 19px;
}

.collection-dashboard-item .item-detail p {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 21px;
}

.collection-dashboard-item .item-detail h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 21px;
}

.collection-dashboard:before {
    content: "";
    background: var(--sprite-two) no-repeat -412px -91px;
    width: 14px;
    height: 15px;
    display: inline-block;
}

.collection-dashboard:hover:before {
    background-position: -431px -91px;
}

.input-block.date-field:first-child .rdtPicker {
    bottom: unset !important;
}

.col-table {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    background: #fff;
    padding: 0;
    border-radius: 5px;
    border: 1px solid #e4e6e9;
    box-shadow: 0 1px 13px 2px rgba(0, 0, 0, 0.05);
    margin-bottom: 15px;
    margin-top: 15px;
}

.col-table:first-child {
    margin-top: 0px;
}

.col-tr {
    float: left;
    width: 100%;
    display: flex;
}

.col-th {
    float: left;
    width: 50%;
    border-bottom: 1px solid #e4e6e9;
    padding: 0;
    border-top: 0;
    padding: 12px 10px 12px 15px;
    color: var(--default-grey);
    font-size: 14px;
    min-height: 45px;
    word-break: break-word;
}

.col-td {
    float: left;
    width: 50%;
    border-bottom: 1px solid #e4e6e9;
    padding: 0;
    border-top: 0;
    padding: 12px 15px 12px 0;
    color: var(--default-text);
    font-weight: 600;
    font-size: 16px;
    min-height: 45px;
    word-break: break-word;
}

.col-header {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 0px;
    text-transform: uppercase;
    border-bottom: 1px solid #e4e6e9;
    padding: 0;
    border-top: 0;
    padding: 12px 15px 12px 15px;
    color: var(--default-grey);
    font-weight: 600;
    min-height: 45px;
}

.col-table:last-child {
    margin-bottom: 0;
}

.col-tr:last-child .col-th,
.col-tr:last-child .col-td {
    border-bottom: 0;
}

.col-table.sub-child {
    margin: 15px;
    max-width: calc(100% - 30px);
}

.form-single-value-box .custom-image {
    margin-top: 11px;
}

.photo-capture-wrapper {
    float: left;
    width: 100%;
    height: 80px;
    border: 1px dashed var(--photo-border);
    border-radius: 5px;
}

.photo-capture-button-block {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.photo-capture-btn {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 14px;
    color: var(--default-grey);
    cursor: pointer;
}

.photo-capture-btn.take:before {
    content: "";
    background: var(--sprite-two) -589px -360px;
    width: 26px;
    height: 22px;
    margin-bottom: 6px;
}

.photo-capture-btn.upload:before {
    content: "";
    background: var(--sprite-two) -618px -358px;
    width: 29px;
    height: 25px;
    margin-bottom: 6px;
}

/* .template-4 .ind-form-field .input-block.photo-capture-block:last-child {
    margin-bottom: 0;
} */
.photo-modal {
    background: rgba(0, 0, 0, 0.5);
    padding: 20px;
}

.photo-modal .modal-dialog {
    height: 100%;
    margin-top: 0;
    margin-bottom: 0;
    padding: 20p;
}

.photo-modal .capture-mode-1 {
    float: left;
    width: 100%;
    height: 100%;
}

.photo-modal .shot_preview {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.photo-modal .shot_preview video {
    width: 100%;
    height: calc(100% - 80px);
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    border-radius: 0;
}

.photo-modal .shot-preview-button-block {
    float: left;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
}

.photo-modal .modal-body {
    background: transparent;
    padding: 0;
}

.photo-modal .modal-content {
    background: var(--theme-second);
}

.photo-modal .shot-preview-button-block .general-btn {
    background: rgba(255, 255, 255, .1);
    box-shadow: none;
    font-weight: 400;
    padding: 0;
    border-radius: 30px;
}

.photo-modal .shot-preview-button-block .general-btn.grey {
    color: #fff;
}

.photo-modal .modal-header {
    background: var(--theme-second);
    padding: 0 20px;
    border-bottom: 1px solid transparent;
}

.photo-modal .modal-header h5 {
    color: #fff;
    font-weight: 600;
}

.photo-modal .modal-body .close {
    top: 22px;
}

.photo-modal .modal-header .close {
    top: 24px;
    right: 20px;
}

.retake {
    background: var(--sprite-two) no-repeat -526px -350px;
    width: 44px;
    height: 40px;
    border: 0;
    display: block;
}

.capture {
    float: left;
    width: 56px;
    height: 56px;
    border: 5px solid #fff;
    background: #dadbed;
    border-radius: 50%;
}

.flipIcon {
    width: 40px;
    height: 40px;
    border: 1px solid var(--white);
    border-radius: 50%;
    display: block;
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flipIcon:before {
    content: "";
    background: var(--sprite-two) no-repeat -502px -364px;
    width: 20px;
    height: 15px;
    border: 0;
    display: inline-block;
}

.image-container {
    float: left;
    width: 100%;
    max-width: 300px;
    position: relative;
}

.image-container img {
    float: left;
    width: 100%;
    border-radius: 5px;
}

.sub-image-option {
    position: absolute;
    top: calc(50% - 15px);
    right: calc(50% - 95px);
    display: none;
}

.template-4 .form-preview-container {
    padding: 40px;
}

.photo-modal .modal-header .close:before {
    content: "";
    background: var(--sprite-one) no-repeat -11px -125px;
    width: 16px;
    height: 16px;
    display: inline-block;
}

.template-5 .photo-capture-btn {
    color: #9FD4FF;
}

.photo-modal .template-5 .modal-content {
    background: var(--theme-second);
}

.full-width.template-5 .photo-modal .modal-content {
    background: var(--theme-second);
}

.template-3 .photo-capture-wrapper {
    border-color: #E4E6E9;
}

.template-2 .photo-capture-wrapper {
    background: #fff;
    border: 1px solid #E4E6E9;
}

.template-1 .photo-capture-wrapper {
    padding: 0;
    border: 0;
}

.captured-image {
    float: left;
    width: 100%;
    height: calc(100% - 80px);
    display: flex;
    align-items: center;
}

.captured-image img {
    float: left;
    width: 100%;
}

.sub-image-option .general-btn {
    height: 30px;
    background: transparent;
    border-radius: 18px;
    margin-left: 10px;
}

.sub-image-option .general-btn:first-child {
    margin-left: 0;
}

.image-container:hover:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 5px;
    z-index: 9;
}

.image-container:hover .sub-image-option {
    display: block;
    z-index: 10;
}

.general-btn.removeBtn {
    border-color: #e14745;
    background: #e14745;
}

.general-btn.reBtn {
    border-color: var(--default-color);
    background: var(--default-color);
}

.infom-msg {
    float: left;
    width: 100%;
    color: var(--default-grey);
    display: flex;
    align-items: center;
}

.infom-msg:before {
    content: "";
    width: 20px;
    height: 20px;
    background: url(images/small-loader.gif);
    display: inline-block;
    margin-right: 10px;
}

.infom-msg.error {
    color: #e14745;
}

.infom-msg.error:before {
    background: var(--sprite-one) no-repeat -308px -357px;
    width: 16px;
    height: 14px;
}

.infom-msg.sucess {
    color: #31b089;
}

.infom-msg.sucess:before {
    background: var(--sprite-one) no-repeat -8px -181px;
    width: 16px;
    height: 16px;
    margin-right: 10px;
}

.template-4 .ind-form-field .heading h4 {
    font-size: 20px;
    margin-bottom: 5px;
}

.ind-form-field .display-text p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    color: #444;
    margin-bottom: 10px;
    word-break: break-word;
}

.ind-form-field .display-text p:last-child {
    margin-bottom: 0;
}

.custom-check {
    float: left;
    width: 100%;
    display: flex;
    margin-bottom: 15px;
}

.custom-check:last-child {
    margin-bottom: 0px;
}

.custom-checkbox {
    float: left;
    width: 15px;
    height: 15px;
    position: relative;
    margin-right: 10px;
    top: 3px;
}

.custom-checkbox input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    z-index: 9;
    cursor: pointer;
}

.custom-checkbox label {
    float: left;
    width: 15px;
    height: 15px;
    border: 1px solid #ccc;
}

.ind-form-field .agreement {
    float: left;
    width: 100%;
    margin-bottom: 35px !important;
}

.agreement h5 {
    float: left;
    width: 100%;
    font-size: 17px;
    line-height: 1.3;
    color: var(--default-text);
    margin-bottom: 20px;
    text-transform: CAPITALIZE;
    font-weight: 400;
}

.ind-form-field .custom-checkbox-text p {
    float: left;
    width: 100%;
    font-size: 16px;
    line-height: normal;
    color: var(--default-grey);
}

.ind-form-field .custom-checkbox-text p a {
    color: var(--default-color);
}

.custom-checkbox input:checked+label:before,
.custom-checkbox input.active+label:before {
    content: "";
    width: 15px;
    height: 15px;
    background: var(--sprite-one) no-repeat -271px -69px;
    left: 0;
    top: 0;
    border-color: #b6c5ca;
    background-color: var(--default-color);
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ind-form-field .input-block .agreement {
    margin-bottom: 0 !important;
}

.ind-form-field .display-text strong {
    font-weight: 600;
}

.ind-form-field .display-text .marker {
    background: yellow;
}

.ind-form-field .display-text p em {
    font-style: italic;
}

.ind-form-field .display-text ul {
    list-style: disc;
    padding-left: 20px;
}

.ind-form-field .display-text ul li {
    padding-left: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: normal;
    color: #444;
}

.ind-form-field .display-text ol {
    list-style: decimal;
    padding-left: 20px;
}

.ind-form-field .display-text ol li {
    padding-left: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: normal;
    color: #444;
}

.ind-form-field .display-text h1 {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 15px;
}

.ind-form-field .display-text h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 15px;
}

.ind-form-field .display-text h3 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 15px;
}

.ind-form-field .display-text pre {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
}

.ind-form-field .display-text div {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    color: #444;
    margin-bottom: 15px;
}

.ind-form-field .display-text blockquote {
    float: left;
    width: calc(100% - 30px);
    margin-bottom: 15px;
    position: relative;
    padding-left: 20px;
    border-left: 5px solid #eee;
    margin-left: 20px;
    font-style: italic;
}

.ind-form-field .display-text p big {
    font-size: 18px;
}

.ind-form-field .display-text p tt {
    font-family: monospace;
}

.ind-form-field .display-text p small {
    font-size: 12px;
}

.ind-form-field .display-text p cite {
    font-style: italic;
}

.agree-modal .modal-body {
    background: #fff;
}

.agree-modal .modal-header {
    background: var(--theme-second);
}

.terms-text-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.terms-text p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    color: #444;
    margin-bottom: 10px;
}

.terms-text strong {
    font-weight: 600;
}

.terms-text .marker {
    background: yellow;
}

.terms-text p em {
    font-style: italic;
}

.terms-text ul {
    list-style: disc;
    padding-left: 20px;
}

.terms-text ul li {
    padding-left: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: normal;
    color: #444;
}

.terms-text ol {
    list-style: decimal;
    padding-left: 20px;
}

.terms-text ol li {
    padding-left: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: normal;
    color: #444;
}

.terms-text h1 {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 15px;
}

.terms-text h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 15px;
}

.terms-text h3 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 15px;
}

.terms-text pre {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
}

.terms-text div {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    color: #444;
    margin-bottom: 15px;
}

.terms-text blockquote {
    float: left;
    width: calc(100% - 30px);
    margin-bottom: 15px;
    position: relative;
    padding-left: 20px;
    border-left: 5px solid #eee;
    margin-left: 20px;
    font-style: italic;
}

.terms-text p big {
    font-size: 18px;
}

.terms-text p tt {
    font-family: monospace;
}

.terms-text p small {
    font-size: 12px;
}

.terms-text p cite {
    font-style: italic;
}

.form-update-all-ico:before {
    background-position: -449px -447px;
    width: 23px;
    height: 21px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 17px;
    top: calc(50% - 10.5px);
}

.form-update-all-ico:hover:before {
    background-position: -449px -423px;
}

.form-update-ico:before {
    background-position: -475px -447px;
    width: 23px;
    height: 21px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 17px;
    top: calc(50% - 10.5px);
}

.form-update-ico:hover:before {
    background-position: -475px -423px;
}

.right-panel-white-box.header {
    background: transparent;
    box-shadow: none;
    border: 0;
    padding: 0;
    margin: 15px 0 20px 0;
}

.right-panel-white-box.header .form-single-value-box p {
    font-size: 18px;
    font-weight: 600;
    color: #444;
}

.right-panel-white-box.header:first-child {
    margin-top: 0;
}

.right-panel-white-box.header .form-single-value-box td {
    display: none;
}

.template-1 .ind-form-field .mandatory-box .upload-wrapper.sm-line {
    border-bottom: 1px solid #e14745;
}

.template-2 .ind-form-field .mandatory-box .upload-wrapper.sm-line {
    border-color: #e14745;
}

.template-3 .ind-form-field .mandatory-box .upload-wrapper.sm-line {
    border-bottom: 1px solid #e14745;
}

.template-4 .ind-form-field .mandatory-box .upload-wrapper.sm-line {
    border-color: #e14745;
}

.template-1 .image-container {
    margin-left: 20px;
    margin-bottom: 20px;
    margin-top: 20px;
}

.photo-modal .shot_preview {
    height: 100%;
}

.form-input-container-outer .form-input-block-left .form-type-input img {
    float: left;
    width: 100%;
    object-fit: contain;
    border-radius: 5px;
}

.ind-form-field .upload-wrapper .file-tag .form-download {
    width: 20px;
    height: 20px;
    position: relative;
    left: 0;
    top: 0;
    background: transparent;
    margin: 0 0 0 5px;
}

.ind-form-field .upload-wrapper .file-tag .form-download:before {
    content: "\f019";
    background: none;
    font-family: 'FontAwesome';
    font-size: 16px;
    color: #a5a5a5;
}

.ind-form-field .upload-wrapper .file-tag .form-download:hover:before {
    color: var(--default-color);
}

.template-1 .form-input-container-outer {
    margin-bottom: 0;
    padding: 11px 72px 20px 20px;
    border: 1px solid #E4E6E9;
}

.template-1 .form-input-container-outer .form-input-block-left .form-type-input {
    border: 0;
    padding: 0;
}

.template-1 .form-input-container-outer .form-input-block-left .label-header label {
    font-size: 12px;
    color: #898989;
    text-transform: CAPITALIZE;
}

.template-2 .form-input-container-outer .form-input-block-left .label-header label {
    text-transform: CAPITALIZE;
}

.template-3 .form-input-container-outer .form-input-block-left .label-header label {
    font-size: 12px;
    color: #898989;
    text-transform: CAPITALIZE;
}

.template-3 .form-input-container-outer .form-input-block-left .form-type-input {
    border: 0;
    padding: 0;
    text-transform: CAPITALIZE;
}

.template-4 .form-input-container-outer .form-input-block-left .label-header label {
    font-size: 17px;
    color: var(--default-text);
}

.template-3 .form-input-container-outer {
    padding-bottom: 20px;
    border-bottom: 1px solid #E4E6E9;
}

.template-1 .form-input-container-outer .form-download {
    bottom: 20px;
}

.template-2 .form-input-container-outer .form-download {
    bottom: 0px;
}

.template-3 .form-input-container-outer .form-download {
    bottom: 20px;
}

.template-4 .form-input-container-outer .form-download {
    bottom: 0px;
}

.filter-accord .input-range {
    float: left;
    width: 100%;
    height: 40px;
}

.filter-accord .input-range .input-range__label--min {
    left: 8px;
    bottom: -8px;
}

.filter-accord .input-range .input-range__label--max {
    right: 8px;
    bottom: -8px;
}

.filter-accord .input-range .input-range__track--background {
    left: 8px;
    right: 8px;
}

.filter-accord .input-range .input-range__slider:active {
    transform: scale(1);
}

.filter-accord .input-range .input-range__slider {
    background: #fff;
    border-color: var(--default-color);
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.05);
}

.filter-accord .input-range .input-range__label--value {
    font-family: Source Sans Pro;
    color: var(--default-text);
    font-size: 13px;
}

.filter-accord .input-range .input-range__track--active {
    background: var(--default-color);
}

.modal-header-right .general-btn.print-ico {
    background: transparent;
    border: 1px solid var(--default-grey);
    box-shadow: none;
    color: var(--default-grey);
    transition: none;
}

.modal-header-right .general-btn.print-ico:before {
    margin-right: 10px;
}

.modal-header-right .general-btn.print-ico:hover {
    border-color: var(--default-color);
    color: var(--default-color);
}

.form-table.fixed-header .table thead th {
    background: #ffffff;
    position: sticky;
    top: 0;
    z-index: 8;
}

.form-table.fixed-header .table thead th:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #e3e5e8;
    display: block;
    bottom: 0;
}

.data-holder-right .form-table.fixed-header .table thead th:first-child {
    min-width: 107px;
}

.form-table.fixed-header .table tbody tr td:first-child .user-assigned-ico {
    right: 10px;
}

.form-table.fixed-header .table thead th:first-child .share-text {
    right: 0;
}

.form-table.fixed-header .table tbody tr td {
    border-top: 0;
    border-bottom: 1px solid #e3e5e8;
}

.data-holder-right .form-table.fixed-header .table thead th:first-child .control .inp-chk,
.data-holder-right .form-table.fixed-header .table thead th:first-child .control-indicator {
    z-index: 99;
}

.side-tab .grid-view .collection-card-left h5 {
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
}

.side-tab .grid-view .collection-card-left p {
    margin-bottom: 2px;
}

.side-tab .grid-view .collection-card-right p {
    margin-bottom: 4px;
}

.side-tab .grid-view .collection-card-right-content p {
    margin-bottom: 0;
}

.side-tab .grid-view .collection-card-right-content h5 {
    margin-top: 1px;
}

.data-holder-right .card-container.template-collection .ind-collection-card {
    cursor: pointer;
}

.one-line-stretch {
    float: left;
    width: 100%;
    display: flex;
    padding-right: 20px;
    justify-content: space-between;
}

.one-line-stretch .filter-tag-add-block {
    width: calc(100% - 16px);
}

.action-button-panel {
    float: left;
    position: relative;
}

.action-set {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.action-set:before {
    background-position: -128px -466px;
    width: 16px;
    height: 16px;
    position: relative;
    top: 2px;
}

.action-button-panel {
    float: left;
}

.action-popover-panel {
    float: left;
    width: 200px;
    background: #fff;
    padding: 10px 0;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    position: absolute;
    right: 0px;
    top: 25px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, .15);
    z-index: 9;
}

.action-popover-panel li {
    float: left;
    width: 100%;
}

.action-popover-panel li nav {
    padding: 10px;
    color: var(--default-grey) !important;
    font-size: 16px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    cursor: pointer;
}

.action-popover-panel li:hover {
    background: #fafafa;
}

.action-popover-panel li:hover nav {
    color: var(--default-color) !important;
}

.action-popover-panel li.active nav {
    color: var(--default-color) !important;
}

.action-popover-panel li.active {
    background: #fafafa;
}

.custom-template-view .form-input-container-outer {
    margin-bottom: 35px;
}

.custom-template-view .form-input-block-left .form-type-input {
    font-size: 16px;
    padding: 17px 20px;
}

.custom-template-view .form-input-block-left .label-header label {
    margin-bottom: 5px;
}

.custom-template-view .form-input-block-left.no-action .form-type-input {
    pointer-events: none;
}

.custom-template-view .form-input-block-left .label-header.fieldset-title label {
    color: #444;
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 28px;
}

.custom-template-view .form-input-container-outer:last-child {
    margin-bottom: 0;
}

.no-action .radio-block {
    pointer-events: none;
}

.input-block.drop.no-action .fiels-inp-box {
    pointer-events: none;
}

.input-block.no-action .fiels-inp-box {
    pointer-events: none;
}

.input-block.date-field.no-action .form-type-input {
    pointer-events: none;
}

.create-date .radio-wrapper .task-input-block.eq-width .form-type-input .form-control {
    padding: 6px 8px;
}

.filter-accord .input-range__slider-container .input-range__label--value {
    left: 0px;
    top: -30px;
}

.filter-accord .input-range__slider-container .input-range__label--value .input-range__label-container {
    left: 0;
}

.filter-accord .input-range__slider-container:last-child .input-range__label--value {
    left: auto;
    right: 0px;
    top: -30px;
}

.filter-accord .input-range__slider-container:last-child .input-range__label--value .input-range__label-container {
    left: auto;
    right: 0;
}

.filter-accord .input-range .input-range__label--min {
    left: 0;
    bottom: -9px;
}

.filter-accord .input-range .input-range__label--min .input-range__label-container {
    left: 0;
    font-family: Source Sans Pro;
}

.filter-accord .input-range .input-range__label--max {
    left: auto;
    right: 0px;
    bottom: -9px;
}

.filter-accord .input-range .input-range__label--max .input-range__label-container {
    left: auto;
    right: 0px;
    font-family: Source Sans Pro;
}

.filter-accord .input-range__track {
    width: 100%;
    background: #e3e5e8;
}

.filter-accord .input-range .input-range__track--background {
    left: 0;
}

.filter-accord .input-range .input-range__slider-container .input-range__slider {
    left: 8px;
}

.filter-accord .input-range .input-range__slider-container:last-child .input-range__slider {
    left: auto;
    right: 0px
}

.side-bar-panel .grey-bg-panel {
    background: #e7e7e7;
}

.grey-bg-panel .float-panel-header {
    background: var(--white);
    border: 0;
}

.grey-bg-panel .float-panel-content-holder {
    background: #ecf0f1;
    height: calc(100vh - 197px)
}

.grey-bg-panel .float-panel-header .subheader {
    font-size: 18px;
    text-transform: none;
}

.list-view-panel .collection-dashboard-item {
    width: 100%;
    margin-bottom: 0;
    background: transparent;
    box-shadow: none;
    border: 0;
    border-bottom: 1px solid #dddbdb;
    padding-bottom: 7.5px;
    margin-bottom: 7.5px;
    border-radius: 0;
}

.list-view-panel .collection-dashboard-item .title {
    width: 45%;
    padding: 0;
    height: auto;
}

.list-view-panel .collection-dashboard-item .item-detail {
    width: 55%;
    padding: 0;
    border: 0;
    height: auto;
}

.list-view-panel .collection-dashboard-item .title h5 {
    font-size: 12.52px;
    color: var(--default-grey);
    line-height: 24px;
    font-weight: 400;
    text-transform: uppercase;
}

.list-view-panel .collection-dashboard-item .item-detail h5 {
    font-size: 16px;
    font-weight: 600;
    color: var(--default-text);
}

.side-bar-panel.list-view-panel {
    z-index: 9;
}

.tab-wrap-block-right .select-box {
    width: auto;
    min-width: 115px;
}

.propogation-container {
    float: left;
    width: 100%;
    height: 100%;
}

.propogation-wrap {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    margin-top: 20px;
}

.propogation-wrap:first-child {
    margin-top: 0px;
}

.propogation-block {
    float: left;
    width: 100%;
    height: calc(100% - 29px);
    border: 1px solid #e4e5e9;
    border-radius: 5px;
    overflow-y: auto;
    max-height: 100%;
}

.propogation-header {
    float: left;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #e4e5e9;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    left: 0;
    top: 0;
    background: #fff;
    z-index: 9;
}

.ind-propogation-header {
    float: left;
    width: 50%;
    height: 100%;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ind-propogation-header:last-child {
    border-left: 1px solid #e4e5e9;
}

.ind-propogation-header h5 {
    float: left;
    font-size: 16px;
    color: #444;
    font-weight: 600;
}

.add-cl {
    float: left;
    width: 30px;
    height: 30px;
    background: var(--default-color);
    border: 0;
    border-radius: 50%;
    position: relative;
}

.add-cl:before {
    content: "";
    background: var(--sprite-two) no-repeat -25px -228px;
    width: 13px;
    height: 13px;
    display: inline-block;
}

.propogation-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.propogation-row {
    float: left;
    width: 100%;
    height: 70px;
    border-bottom: 1px solid #e4e5e9;
    background: rgba(249, 249, 249, 0.70);
}

.ind-prop-list {
    float: left;
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    position: relative;
}

.ind-prop-list:after {
    content: "";
    background: var(--sprite-one) no-repeat -53px -150px;
    zoom: .7;
    width: 30px;
    height: 30px;
    position: absolute;
    right: -15px;
    top: 10.5;
    display: inline-block;
    z-index: 8;
    border: 1px solid #e4e5e9;
    border-radius: 50%;
    background-color: #fff;
    transform: rotate(180deg);
}

.ind-prop-list:last-child:after {
    content: none;
}

.ind-prop-list:last-child {
    border-left: 1px solid #e4e5e9;
}

.ind-prop-list h5 {
    float: left;
    font-size: 14px;
    color: var(--default-grey);
}

.prop-row-option button {
    float: left;
    width: 17px;
    height: 17px;
    border: 0;
    padding: 0;
    line-height: 0;
    background: transparent;
    margin-left: 5px
}

.prop-add:before {
    content: "";
    background: var(--sprite-one) no-repeat -355px -333px;
    width: 17px;
    height: 17px;
    display: inline-block;
}

.prop-remove:before {
    content: "";
    background: var(--sprite-one) no-repeat -328px -333px;
    width: 17px;
    height: 17px;
    display: inline-block;
}

.prop-edit:before {
    content: "";
    background: var(--sprite-one) no-repeat -93px -451px;
    width: 11px;
    height: 11px;
    display: inline-block;
}

.prop-delete:before {
    content: "";
    background: var(--sprite-one) no-repeat -473px -159px;
    width: 10px;
    height: 12px;
    display: inline-block;
}

.propogation-footer {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.prop-right {
    width: 40%;
    display: flex;
    align-items: cccccce;
}

.prop-row-option {
    display: flex;
    align-items: center;
    margin-left: 5px;
}

.select-box.validation-error select {
    border-color: #e14845;
}

.refresh-btn {
    float: left;
    width: 30px;
    height: 30px;
    font-size: 0;
    border: 0;
    background: var(--default-color);
    border-radius: 50%;
    margin: 35px 0 0 0;
}

.refresh-btn:before {
    content: "";
    background: var(--sprite-two) no-repeat -382px -409px;
    width: 13px;
    height: 12px;
    display: inline-block;
}

.rc-tab-map:before {
    background-position: -381px -186px;
    width: 14px;
    height: 14px;
}

.rc-tab-map.active:before {
    background-position: -381px -164px;
}

.one-line-stretch .filter-tag-add-block {
    width: calc(100% - 261px);
    min-height: 35px;
    padding-top: 5px;
}

.one-line-stretch .resources-filters-icons {
    margin-right: 0;
    max-height: 30px;
    border-radius: 5px;
}

.one-line-stretch .resources-filters-icons li a,
.one-line-stretch .resources-filters-icons li nav {
    height: 28px;
    padding: 0 12px;
    width: auto;
}

.one-line-stretch .filter-tag-block-right {
    top: 5px;
}

.vertical-list .one-line-stretch .filter-tag-add-block {
    width: 100%;
}

.vertical-list .one-line-stretch .filter-tag-block-right {
    right: 0;
}

.template-4 .ind-form-field .unique-field.mandatory-box .error-fields {
    display: block;
    order: 2;
    margin-top: 8px;
}

.template-3 .ind-form-field .unique-field.mandatory-box .error-fields {
    display: block;
    position: absolute;
    bottom: -21px;
}

.template-3 .ind-form-field .unique-field.input-block {
    margin-bottom: 28px;
}

.template-2 .ind-form-field .unique-field.mandatory-box .error-fields {
    display: block;
    order: 2;
    margin-top: 8px;
}

.template-1 .ind-form-field .unique-field.mandatory-box .error-fields {
    display: block;
    float: left;
    margin: 10px 21px;
}

.ind-form-field .input-block.drop.auto-complete:before {
    content: none;
}

.propogation-wrap .checkbox-container {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    justify-content: flex-end;
}

.propogation-wrap .checkbox-container .select-chk-block {
    margin-right: 15px;
}

.propogation-wrap .checkbox-container .select-chk-block:last-child {
    margin-right: 0;
}

.propogation-wrap .checkbox-container .select-chk-block .control {
    font-size: 14px;
    color: var(--default-grey);
}

.full-width.detailed-form-view .modal-body {
    padding: 0;
}

.detailed-form-view-container {
    float: left;
    width: 100%;
    height: 100%;
}

.detailed-form-view-left {
    float: left;
    width: 270px;
    height: 100%;
    background: var(--form-nav-bg);
    padding: 92px 30px 30px;
    overflow-y: auto;
}

.detailed-form-view-right {
    float: left;
    width: calc(100% - 270px);
    height: 100%;
}

.detailed-form-view .form-preview-header {
    padding-right: 0;
    position: relative;
    padding-right: 30px;
    margin-bottom: 0;
}

.detailed-form-view .modal-body .form-preview-header .close {
    right: 0;
}

.detailed-form-view-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 173px);
    overflow-y: auto;
}

.detailed-form-view-right-bottom {
    float: left;
    width: 100%;
    height: 80px;
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.detailed-form-view-right-bottom .button-block {
    width: auto;
    margin: 0;
}

.detailed-form-view-right-top {
    float: left;
    width: 100%;
    height: 93px;
    padding: 20px 40px;
}

.detailed-form-view-right-body .form-preview-container {
    width: calc(100% - 80px);
    margin: 8px 40px;
}

.card-container.globe-container.full-height-globe {
    height: 100%;
    position: relative;
}

.record-counter {
    float: left;
    width: auto;
    padding: 0 20px;
    height: 40px;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 8;
    background: #fff;
    display: flex;
    align-items: center;
}

.current-count {
    color: var(--default-text);
}

.total-count {
    color: var(--default-color);
}

.record-counter h5 {
    font-size: 18px;
    font-weight: 600;
    color: var(--default-grey);
}

.collection-map-right {
    float: left;
    width: 261px;
    display: flex;
    justify-content: flex-end;
    max-height: 30px;
}

.collection-map-right .select-box {
    width: 170px;
    margin-right: 10px;
}

.collection-map-right .select-box select {
    height: 30px;
    border-radius: 5px;
}

.one-line-stretch .resources-filters-icons li:first-child,
.one-line-stretch .resources-filters-icons li:first-child a,
.one-line-stretch .resources-filters-icons li:first-child nav {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.one-line-stretch .resources-filters-icons li:last-child,
.one-line-stretch .resources-filters-icons li:last-child a,
.one-line-stretch .resources-filters-icons li:last-child nav {
    border-radius: 0 5px 5px 0;
}

.no-action .ind-task-input.selectize-custom {
    pointer-events: none;
}

.template-1 .refresh-btn {
    margin: 20px;
}

.template-1 .form-input-block-left .form-type-input {
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid #E4E6E9;
}

.template-3 .refresh-btn {
    margin: 20px 0;
}

.template-3 .form-input-block-left .form-type-input {
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid #E4E6E9;
}

.no-action .select-chk-block {
    pointer-events: none;
}

.no-action .btn-toggle {
    pointer-events: none;
}

.no-action .signature-canvas {
    pointer-events: none;
}

.no-action .sig-button-block {
    pointer-events: none;
}

.no-action .refresh-btn {
    pointer-events: none;
}

.no-action .form-download {
    pointer-events: none;
}

.clustor-point {
    float: left;
    width: auto;
    min-width: 28px;
    height: 28px;
    background: rgba(248, 204, 203, 0.70);
    border: 3px solid rgba(157, 31, 31, .70);
    font-weight: bold;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.65);
    border-radius: 7px;
    padding: 0 5px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 11px;
}

.clustor-point:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 4px 0 4px;
    border-color: #b1575a transparent transparent transparent;
    position: absolute;
    bottom: -7px;
    left: calc(50% - 4px);
}

.clustor-hover {
    position: absolute;
    left: 28px;
    background: rgba(255, 255, 255, 0.7);
    padding: 7px 5px;
    border-radius: 5px;
    text-shadow: none;
    width: auto;
    min-width: 71px;
    height: 28px;
    box-shadow: rgba(0, 0, 0, .3) 0 1px 4px -1px;
    border: 1px solid rgba(157, 31, 31, .7);
}

.record-counter .mile-progress {
    max-width: 90px;
    margin-right: 15px;
}

.upload-image-container {
    float: left;
    width: 100%;
    max-width: 300px;
    position: relative;
    margin: 35px 0 0 0;
    padding: 15px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background: #fff;
}

.upload-image-container img {
    float: left;
    width: 100%;
    border-radius: 5px;
}

.upload-image-container:before {
    content: "Preview";
    position: absolute;
    left: 15px;
    top: -10px;
    background: #fff;
    border: 1px solid #E4E6E9;
    padding: 1px 7px;
    font-size: 14px;
    border-radius: 5px;
}

.template-3 .upload-image-container {
    margin: 35px 0;
}

.template-1 .upload-image-container {
    margin: 20px;
}

.detailed-form-view-right-bottom-wrap {
    float: left;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.template-5 .modal-body .close:before {
    background-position: -11px -125px;
    width: 16px;
    height: 16px;
}

.template-4 .ind-form-field .input-block.question-head .anim-text {
    font-weight: 600;
}

.template-1 .ind-form-field .input-block.question-head.active .fiels-inp-box+.anim-text {
    font-weight: 600;
}

.template-2 .ind-form-field .input-block.question-head .anim-text {
    font-weight: 600;
}

.template-3 .ind-form-field .input-block.question-head.active .fiels-inp-box+.anim-text {
    font-weight: 600;
}

.template-4 .ind-form-field .input-block.question-head .anim-text {
    font-weight: 600;
}

.template-1 .ind-form-field .input-block .agreement {
    height: auto;
    min-height: 67px;
    padding: 10px 20px;
    display: flex;
    align-items: center;
}

.template-3 .ind-form-field .input-block .agreement {
    height: auto;
    min-height: 67px;
    padding: 10px 0px;
    display: flex;
    align-items: center;
}

.template-1 .input-block.display-text {
    height: auto;
    min-height: 67px;
    padding: 10px 20px;
    display: flex;
    align-items: center;
}

.template-3 .input-block.display-text {
    height: auto;
    min-height: 67px;
    padding: 10px 0px;
    display: flex;
    align-items: center;
}

.template-1 .input-block.display-text div {
    margin-bottom: 0;
}

.template-3 .input-block.display-text div {
    margin-bottom: 0;
}

.detailed-form-view-right-body .container .form-preview-container {
    width: 100%;
    margin: 10px 0;
}

.date-clear {
    float: left;
    width: 9px;
    height: 10px;
    padding: 0;
    line-height: 0;
    background: transparent;
    border: 0;
    zoom: 1.2;
    position: absolute;
    right: 35px;
    bottom: 15px;
    z-index: 8;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease;
}

.date-clear:before {
    background-position: -348px -365px;
    width: 9px;
    height: 10px;
}

.input-block.date-field:hover .date-clear {
    opacity: 1;
    pointer-events: auto;
}

.template-3 .date-clear {
    right: 45px;
    bottom: 22px;
}

.template-1 .date-clear {
    right: 30px;
    bottom: 22px;
}

.map-properties {
    float: left;
    width: 100%;
    border-bottom: 1px solid rgba(64, 83, 100, .15);
    margin-bottom: 20px;
}

.map-properties h5 {
    margin-bottom: 15px;
}

.form-single-value-box h5 p {
    text-transform: none;
    font-size: 14px;
    font-weight: 400;
    margin-top: 5px;
    line-height: 18px;
}

.form-single-value-box.with-check-instruction {
    padding-left: 25px;
    position: relative;
}

.with-check-instruction .select-chk-block {
    position: absolute;
    left: 0;
    top: 0;
}

.with-check-instruction .select-chk-block .control-indicator {
    top: 2px;
}

.template-extra-proprties {
    float: left;
    width: 100%;
    border: 1px solid #DEE1E4;
    border-radius: 5px;
    height: calc(100% - 197px);
    background: #fff;
}

.template-extra-proprties-head {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-bottom: 1px solid #DEE1E4;
}

.template-extra-proprties .task-input-container {
    height: calc(100% - 60px);
}

.template-extra-proprties .task-input-container {
    height: calc(100% - 60px);
    align-items: normal;
    padding: 20px;
    overflow-y: auto;
}

.template-extra-proprties .settings-panel select {
    margin-left: 0;
}

.template-extra-proprties .selective-panel {
    float: left;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.template-extra-proprties-body {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.template-extra-proprties-head h5 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 5px;
}

.template-extra-proprties-head p {
    font-size: 12px;
    color: var(--default-grey);
}

.collection-template-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.collection-template-header {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid #E3E5E8;
    padding: 0 20px;
    display: flex;
    align-items: center;
}

.collection-template-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 18px;
}

.collection-template-body {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    padding: 0px;
}

.each-template-type {
    float: left;
    width: calc((100% / 4) - 15px);
    margin-right: 20px;
    margin-bottom: 20px;
    border: 1px solid #DEE1E4;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
}

.each-template-type:before {
    content: "";
    width: 100%;
    height: 100%;
    border: 2px solid var(--default-color);
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 5px;
    opacity: 0;
    transition: .3s ease-out;
}

.each-template-type:hover:before,
.each-template-type.active:before {
    opacity: 1;
}

.each-template-type:nth-child(4n) {
    margin-right: 0;
}

.each-template-preview {
    float: left;
    width: 100%;
    height: 140px;
    background: #ecf0f1;
}

.each-template-preview img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.each-template-head {
    float: left;
    width: 100%;
    height: 35px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #DEE1E4;
}

.each-template-head h5 {
    float: left;
    color: var(--default-text);
    font-size: 12px;
    letter-spacing: 0;
    line-height: 16.92px;
    font-weight: 600;
    text-transform: uppercase;
    transition: .3s ease-out;
}

.each-template-type:hover .each-template-head h5,
.each-template-type.active .each-template-head h5 {
    color: var(--default-color);
}

.collection-summary-item {
    float: left;
    width: 100%;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .1);
    margin-bottom: 20px;
    border: 1px solid #eee;
    padding: 20px;
}

.dash-summary-panel-header h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    line-height: 21px;
    font-weight: 600;
    color: var(--default-text);
}

.dash-summary-panel-header {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.dash-summary-panel-body {
    float: left;
    width: 100%;
}

.dash-summary-panel-body p {
    font-size: 14px;
    line-height: 18px;
    color: var(--default-text);
    margin-bottom: 5px;
}

.dash-summary-panel-body ul {
    float: left;
    width: 100%;
}

.dash-summary-panel-body ul li {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 18px;
    color: var(--default-text);
    margin-bottom: 5px;
    padding-left: 12px;
    position: relative;
}

.dash-summary-panel-body ul li:before {
    content: "";
    width: 5px;
    height: 5px;
    background: var(--default-text);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 7px;
}

.dash-user-summary {
    float: left;
    width: 100%;
}

.dash-user-summary-left {
    float: left;
    width: 95px;
    height: 95px;
    border-radius: 5px;
    margin-right: 15px;
}

.dash-user-summary-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.side-tab .grid-view .map-properties h5 {
    font-weight: 400;
    font-size: 16px;
}

.side-tab .tab-content .tab-pane .grid-view .edit-template-left .map-properties .select-box:last-child {
    margin-bottom: 20px;
}

.sig-preview {
    box-shadow: none;
}

.sig-preview:before {
    border: 1px solid #E4E6E9;
    border-radius: 0px;
}

.template-1 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    height: 68px;
}

.template-1 .ind-form-field .anim-text {
    top: 27px;
}

.template-1 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    height: 70px;
}

.template-1 .ind-form-field .heading {
    margin: 20px 0;
}

.template-1 .field-set .ind-form-field.fieldset {
    margin-top: 20px;
}

.template-1 .ind-form-field .unique-field.mandatory-box .error-fields {
    font-size: 12px;
}

.template-2 .ind-form-field .input-block,
.template-2 .ind-form-field .upload-wrapper.sm-line {
    margin-bottom: 20px;
}

.template-2 .ind-form-field .radio-wrapper,
.template-2 .ind-form-field .checkbox-wrapper {
    margin-bottom: 10px;
}

.template-2 .toggle .field-common.field-req-block {
    height: auto;
}

.template-2 .refresh-btn {
    margin-top: 20px;
}

.template-2 .radio-block label:before {
    border: 1px solid #b6c5ca;
}

.template-2 .ind-form-field .heading {
    margin: 20px 0;
}

.template-2 .ind-form-field .unique-field.mandatory-box .error-fields {
    font-size: 12px;
}

.template-2 .sig-button-block .general-btn.grey {
    box-shadow: none;
    background: #fafafa;
}

.template-3 .ind-form-field .input-block {
    margin-bottom: 20px;
}

.template-3 .ind-form-field .radio-wrapper,
.template-3 .ind-form-field .checkbox-wrapper {
    margin-bottom: 20px;
}

.template-3 .ind-form-field .radio-wrapper .radio-block {
    margin-bottom: 10px;
}

.template-3 .ind-form-field .heading {
    margin: 20px 0;
}

.template-3 .radio-block label:before {
    border: 1px solid #b6c5ca;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .mandatory-box .upload-wrapper.sm-line {
    border-bottom: 1px solid #e14745;
}

.template-3 .ind-form-field .unique-field.mandatory-box .error-fields {
    font-size: 12px;
}

.template-4 .ind-form-field .input-block {
    margin-bottom: 20px;
}

.template-4 .ind-form-field .radio-wrapper,
.template-4 .ind-form-field .checkbox-wrapper {
    margin-bottom: 20px;
}

.template-4 .ind-form-field .heading {
    margin-bottom: 20px;
}

.template-4 .radio-block label:before {
    border: 1px solid #b6c5ca;
}

.template-4 .flex-box .toggle .field-common.field-req-block .btn-toggle {
    margin: 0;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field {
    padding-top: 0;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper.mandatory-box .error-fields {
    margin: 0;
}

.template-4 .ind-form-field .mandatory-box .error-fields {
    font-size: 12px;
    display: block;
    order: 1;
    margin-top: 10px;
}

.template-5 .detailed-form-view-left {
    background: rgba(0, 145, 255, 0.4);
    border-right: 1px solid rgba(0, 145, 255, 0.4);
}

.template-5 .linked-collection-record li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

.template-5 .ind-form-field .input-block {
    margin-bottom: 30px;
}

.template-5 .ind-form-field .anim-text,
.template-5 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    margin-bottom: 0
}

.template-5 .ind-form-field .input-block textarea.fiels-inp-box {
    padding-top: 10px;
}

.template-5 .field-header {
    margin-bottom: 15px;
}

.template-5 .ind-form-field .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-5 .ind-form-field .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-5 .ind-form-field .checkbox-wrapper h5 {
    margin-bottom: 15px;
}

.template-5 .toggle .field-common label {
    margin-bottom: 15px;
}

.template-5 .date-field .field-header {
    margin-bottom: 0;
}

.template-5 .signature-left .label-header {
    margin-bottom: 15px;
}

.template-5 .sig-preview:before {
    background: #0d5ca9;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.4);
}

.template-5 .photo-capture-wrapper {
    background: rgba(255, 255, 255, 0.1);
    border-color: #fff;
}

.template-5 .autofill-label {
    margin-bottom: 0;
}

.template-5 .style-view {
    margin-top: 20px;
}

.template-5 .ind-form-field .ind-form-field.fieldset .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-5 .ind-form-field .ind-form-field.fieldset .checkbox-wrapper h5 {
    margin-bottom: 15px;
}

.template-5 .field-set .checkbox-wrapper.ind-form-field {
    margin-bottom: 0;
}

.template-5 .ind-form-field .ind-form-field.fieldset .input-block .field-header {
    margin-bottom: 15px;
}

.template-5 .file-upload {
    opacity: 1;
}

.template-5 .ind-form-field .mandatory-box .fiels-inp-box {
    border-bottom: 1px solid #e14745;
}

.template-5 .ind-form-field .radio-wrapper.mandatory-box .error-fields {
    display: block;
    width: 100%;
    margin: 10px 0;
    float: left;
}

.template-5 .ind-form-field .checkbox-wrapper.mandatory-box .error-fields {
    display: block;
    width: 100%;
    margin: 0 0 10px;
    float: left;
}

.template-5 .ind-form-field .input-block.date-field.mandatory-box .form-type-input .form-control {
    border-bottom: 1px solid #e14745;
}

.template-5 .unique-field.mandatory-box .error-fields {
    display: block;
    float: left;
    width: 100%;
    margin: 15px 0 0 0;
    order: 1;
}

.template-5 .input-block.mandatory-box .upload-wrapper.sm-line .file-upload {
    border-color: #e14745;
}

.template-5 .style-view .signature-left {
    padding-right: 20px;
}

.template-5.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: calc(50% - 20px);
}

.template-5.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    margin-right: 15px;
    width: calc(50% - 20px);
}

.template-5 .ind-form-field .heading {
    margin-bottom: 30px;
}

.template-5.width-720 .ind-form-field .signature-canvas canvas {
    width: 100% !important;
}

.template-5.width-540 .ind-form-field .ind-form-field.fieldset .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    height: auto;
}

.template-5.width-540 .ind-form-field .signature-canvas canvas {
    width: 100% !important;
}

.template-5 .ind-form-field .mandatory-box .error-fields {
    font-size: 12px;
}

.template-5 .ind-form-field.fieldset.field-set.false.flex-box .mandatory-box .error-fields {
    margin: 10px 0 0 0;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper .select-chk-block {
    margin-bottom: 0;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper .radio-block {
    margin-bottom: 0;
}

.form-set.side-set-scroll .side-tab .nav-pills .nav-link-side {
    float: left;
    width: 100%;
}

.form-set.side-set-scroll .side-tab .nav-pills .nav-link-side.active,
.form-set.side-set-scroll .side-tab .nav-pills .show>.nav-link-side {
    border-right: 0;
}

.form-set.side-set-scroll .side-tab .nav-pills .nav-link-side.active:after {
    content: none;
}

.left-panel .grid-view .collection-card-right.card-top-block {
    padding: 20px;
}

.right-panel-white-box .format {
    height: 50px;
    float: left;
}

.left-panel .right-panel-white-box .format:after {
    border-color: #ffffff transparent transparent transparent;
}

.left-panel .grid-view.with-image .collection-card-image tr {
    float: left;
    width: 100%;
    height: 100%;
}

.left-panel .grid-view.with-image .collection-card-image tr th {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    color: #fff;
}

.grid-view.with-image .collection-card-image tr td img {
    float: left;
    width: 100%;
    height: 100%;
}

.left-panel .grid-view.with-image .collection-card-image tr td {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.left-panel .grid-view.with-image .collection-card-image tr td:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    border-radius: 5px 5px 0 0;
}

.left-panel .grid-view.with-image .card-top-block .collection-card-image tr td:before {
    content: none;
}

.left-panel .grid-view.with-image .card-top-block .collection-card-image tr th {
    width: auto;
    height: auto;
    position: relative;
    top: 0;
    left: 0;
    display: block;
    text-align: center;
    order: 1;
    margin-top: 8px;
    color: var(--default-text);
    padding: 0 15px;
}

.left-panel .grid-view.with-image .card-top-block .collection-card-image tr td {
    width: 100%;
    height: 50px;
}

.left-panel .grid-view.with-image .card-top-block .collection-card-image tr {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.template-extra-proprties .settings-panel select {
    min-width: 200px;
}

.photo-capture-cam {
    float: left;
    width: 100% !important;
    height: 100% !important;
}

.photo-capture-cam video {
    float: left;
    width: 100% !important;
    height: calc(100% - 80px) !important;
}

.photo-capture-cam canvas {
    float: left;
    width: 100% !important;
    height: calc(100% - 80px) !important;
    object-fit: contain;
}

.input-block.display-text table {
    float: left;
    width: 100%;
    margin: 0;
    margin-bottom: 15px;
    border: 1px solid #E4E6E9;
}

.input-block.display-text table thead tr th {
    padding: 13px 15px;
    border-top: 1px solid #E4E6E9;
    text-transform: uppercase;
    color: #565656;
    font-size: 13px;
    line-height: 15px;
    text-transform: uppercase;
    font-weight: 600;
    background: #ffffff;
}

.input-block.display-text table tbody tr td {
    padding: 15px;
    border-top: 1px solid #E4E6E9;
    font-size: 14px;
    color: var(--default-grey);
    background: #ffffff;
}

.input-block.display-text table tbody tr:first-child td:first-child {
    border-radius: 5px 0 0 0;
}

.input-block.display-text table tbody tr:first-child td:last-child {
    border-radius: 0 5px 0 0;
}

.input-block.display-text table tbody tr:last-child td:first-child {
    border-radius: 0 0 0 5px;
}

.input-block.display-text table tbody tr:last-child td:last-child {
    border-radius: 0 0 5px 0;
}

.input-block.display-text table tbody tr:last-child td {
    border-bottom: 1px solid #E4E6E9;
}

.alone-page .detailed-form-view-left {
    display: none;
}

.alone-page .detailed-form-view-right {
    width: 100%;
}

.form-full-height.alone-page .detailed-form-view-right-bottom {
    left: 0;
    width: 100%;
}

.detailed-form-view.direct-flow .modal-body .form-preview-header .close {
    position: fixed;
    right: 30px;
    top: 30px;
}

.detailed-form-view-right-flow-top {
    float: left;
    width: 100%;
    height: calc(100% - 80px);
    overflow: hidden;
    overflow-y: auto;
}

.detailed-form-view-right-flow-top .detailed-form-view-right-top {
    height: auto;
}

.detailed-form-view-right-flow-top .detailed-form-view-right-body {
    height: auto;
}

.detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    margin-top: 0;
}

.detailed-form-view .detailed-form-view-right-flow-top .form-preview-header {
    padding-right: 0;
}

.template-3.direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    margin: 5px 0;
}

.detailed-form-view.direct-flow.embedded-form .modal-body .detailed-form-view-right-top {
    display: none;
}

.template-5 .custom-check {
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    color: #fff;
}

.template-5 .custom-checkbox label {
    content: "";
    float: left;
    width: 25px;
    height: 25px;
    border: 2px solid #0091ff;
    position: relative;
    border-radius: 5px;
    left: 0;
    top: 0;
    background-color: #192C54;
}

.template-5 .custom-checkbox {
    width: 25px;
    height: 25px;
}

.template-5 .custom-checkbox .input-check-box {
    z-index: 10;
}

.template-5 .ind-form-field .custom-checkbox-text p {
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
}

.template-5 .custom-checkbox input:checked+label:before {
    background-color: transparent;
    background: var(--sprite-two) no-repeat -502px -118px;
    width: 12px;
    height: 9px;
    z-index: 9;
    margin: 0;
    top: 6px;
    left: 4px;
    position: relative;
}

.template-6 .modal-content {
    /* background: #fafafa; */
    background: var(--white);
}

.template-6 .ind-form-field .input-block {
    border: 0;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
}

.template-6 .ind-form-field .heading {
    margin-bottom: 20px;
}

.template-6 .ind-form-field h5 {
    font-weight: 400;
    color: #005aa1;
    font-size: 13px;
    line-height: 23px;
    margin-bottom: 8px;
}

.template-6 .ind-form-field .anim-text {
    display: block;
    position: relative;
    left: 0;
    top: 0;
    order: 0;
    font-weight: 400;
    color: #005aa1;
    font-size: 13px;
    line-height: 23px;
    margin-bottom: 5px;
}

.template-6 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-6 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    top: 0;
    left: 0;
    color: #005aa1;
    font-size: 16px;
    line-height: 23px;
}

.template-6 .ind-form-field .fiels-inp-box {
    float: left;
    width: 100%;
    height: 45px;
    border: 1px solid #e7e7e7;
    background: var(--white) !important;
    padding: 0 15px;
    border-radius: 0px;
    color: #005AA1;
    font-size: 16px;
    font-weight: 400;
    line-height: 40px;
    order: 1;
}

.template-6 .ind-form-field .input-block textarea {
    min-height: 135px;
    resize: auto;
    padding: 7px 15px;
    max-width: 100%;
    min-width: 100%;
}

.template-6 .ind-form-field .input-block textarea+.anim-text {
    top: 0;
}

.template-6 .ind-form-field .tag-wrapper-bl input {
    background: transparent;
    font-size: 16px;
}

.template-6 .ind-form-field .tag-wrapper-bl input::placeholder {
    opacity: 0;
}

.template-6 .ind-form-field .radio-wrapper {
    border: 0;
    padding: 0;
    margin-bottom: 10px;
}

.template-6 .ind-form-field .radio-wrapper .radio-block label {
    color: var(--default-text);
    line-height: 24px;
}

.template-6 .ind-form-field .radio-wrapper .radio-block label:before {
    border-color: #979797;
    background-color: transparent;
    width: 18px;
    height: 18px;
    top: 3px;
}

.template-6 .ind-form-field .radio-wrapper .radio-block input:checked+label:after {
    background-color: #ffffff;
    width: 18px;
    height: 18px;
    border: 5px solid #005AA1;
    left: 0;
    top: 3px;
}

.template-6 .ind-form-field .radio-wrapper .radio-block input:checked+label:before {
    border-color: #005AA1;
}

.template-6 .ind-form-field .checkbox-wrapper {
    border: 0;
    padding: 0;
    margin-bottom: 10px;
}

.template-6 .ind-form-field .radio-wrapper h5,
.template-6 .ind-form-field .checkbox-wrapper h5 {
    color: #005AA1;
    font-size: 15px;
    line-height: 23px;
    margin-bottom: 5px;
}

.template-6 .ind-form-field .checkbox-wrapper .select-chk-block .control .checkbox-indicator {
    border-color: #979797;
    width: 18px;
    height: 18px;
    border-radius: 3px;
    top: 2px;
}

.template-6 .ind-form-field .checkbox-wrapper .select-chk-block .input-check-box.active+.checkbox-indicator {
    background: #005aa1;
    border: 1px solid #005aa1;
}

.template-6 .ind-form-field .checkbox-wrapper .select-chk-block .input-check-box.active+.checkbox-indicator:after {
    left: 2px;
    top: 3px;
    zoom: 1.2;
}

.template-6 .ind-form-field .checkbox-wrapper .select-chk-block .input-check-box.active+.checkbox-indicator {
    border-color: #005aa1;
}

.template-6 .ind-form-field .checkbox-wrapper .select-chk-block .control .input-check-box.active+.checkbox-indicator {
    border-color: #005aa1;
}

.template-6 .ind-form-field .checkbox-wrapper .select-chk-block .control {
    line-height: 24px;
}

.template-6 .ind-form-field .radio-wrapper:last-child,
.template-6 .ind-form-field .radio-wrapper:last-child,
.template-6 .ind-form-field .input-block:last-child {
    border: 0;
}

.template-6 .ind-form-field .upload-wrapper.sm-line {
    border: 1px solid #e7e7e7;
    height: 45px;
    background: #ffffff !important;
    padding: 0 15px;
    border-radius: 0px;
    color: #005AA1;
    font-size: 16px;
    font-weight: 400;
    line-height: 40px;
}

.template-6 .custom-template-view .form-input-block-left .form-type-input {
    border: 1px solid #e7e7e7;
    background: #fbfbfb;
    border-radius: 10px;
    min-height: 45px;
    padding: 12px 20px;
}

.template-6 .ind-form-field .input-block.drop:before {
    width: 14px;
    height: 14px;
    background: url(images/down.svg) no-repeat;
    background-size: cover;
    z-index: 88;
    right: 20px;
    top: 44px;
}

.template-6 .ind-form-field .input-block.drop select {
    height: 45px;
    font-size: 15px;
    color: #005aa1;
    border: 1px solid #e7e7e7;
}

.template-6 .ind-form-field .signature-canvas {
    background: transparent;
    padding: 0;
    margin-bottom: 15px;
}

.template-6 .ind-form-field .signature-left label {
    font-weight: 400;
    color: #005aa1;
    font-size: 15px;
    line-height: 23px;
    margin-bottom: 5px;
}

.template-6 .ind-form-field .signature-canvas canvas {
    background: #ffffff !important;
    color: #005AA1;
    border: 1px solid #e7e7e7;
    border-radius: 0px !important;
}

.template-6 .sig-preview {
    background: #ffffff;
    border-color: #e7e7e7;
}

.template-6 .sig-preview:before {
    background: #fbfbfb;
    color: #005aa1;
}

.template-6 .sig-button-block .general-btn.grey {
    box-shadow: none;
    background: #fff;
    border-color: #eaebeb;
}

.template-6 .ind-form-field .sig-button-block {
    padding: 0;
}

.template-6 .toggle .field-common.field-req-block {
    padding: 0;
    height: auto;
}

.template-6 .btn-toggle.active {
    background: #005aa1;
}

.template-6 .toggle .field-common label {
    color: #005aa1;
    font-size: 15px;
    line-height: 23px;
    margin-bottom: 5px;
}

.template-6 .ind-form-field .input-block .mce-container.mce-panel {
    padding-left: 0;
    float: left;
    width: 100%;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .2);
    padding: 0;
    overflow: hidden;
}

.template-6 .ind-form-field .input-block .mce-container.mce-panel .mce-panel {
    background: transparent;
    box-shadow: none;
    padding: 0;
}

.template-6 .ind-form-field .mce-stack-layout-item {
    border-top: 0px;
}

.template-6 .input-block.date-field .form-type-input {
    padding-top: 0;
}

.template-6 .ind-form-field .input-block.date-field .form-type-input .form-control {
    height: 45px;
    border: 1px solid #e7e7e7;
    background: #ffffff !important;
    padding: 0 15px;
    border-radius: 0px;
    color: #005AA1;
    font-size: 15px;
    font-weight: 400;
    line-height: 40px;
}

.template-6 .ind-form-field .input-block.date-field .form-type-input .form-control::placeholder {
    opacity: 0;
}

.template-6 .ind-form-field .input-block .ind-task-input.selectize-custom {
    border: 1px solid #e7e7e7;
    background: var(--white);
    border-radius: 0px;
    height: auto;
    min-height: 45px;
    order: 1;
    cursor: text;
}

.template-6 .photo-modal .modal-content {
    background: var(--theme-second);
}

.template-6 .photo-modal .modal-header {
    border-bottom: 0;
}

.template-6 .photo-capture-wrapper {
    border: 0;
    border-radius: 10px;
}

.template-6 .photo-capture-btn {
    background: #ffffff;
    /* box-shadow: 0 1px 6px 0 rgba(0,0,0,.2); */
    border: 1px solid #e7e7e7;
    border-radius: 0px;
    color: var(--default-text);
}

.template-6 .refresh-btn {
    margin-top: 15px;
    background: #005aa1;
}

.template-6 .ind-form-field .file-upload label {
    font-size: 15px;
    color: #5E6165;
}

.template-6 .ind-form-field .fieldset {
    padding-left: 0;
    float: left;
    width: 100%;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .2);
    padding: 20px;
    margin-bottom: 20px;
}

.template-6 .ind-form-field .fieldset:before {
    content: none;
}

.template-6 .ind-form-field .field-set .form-header-block h5 {
    margin-bottom: 15px;
    font-size: 13px;
    line-height: 23px;
}

.template-6 .ind-form-field .field-set .form-header-block p {
    font-size: 16px;
}

.template-6 .ind-form-field .field-set .style-view .heading h4 {
    margin-bottom: 5px;
    font-size: 18px;
    line-height: 23px;
    color: #005aa1;
    font-weight: 400;
    text-transform: capitalize;
}

.template-6 .style-view {
    margin-top: 10px;
}

.template-6 .ind-form-field .fieldset .style-view {
    border: 0;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .input-block {
    padding-right: 0;
    margin-right: 20px;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    margin-right: 20px;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    margin-right: 20px;
}

.template-6 .detailed-form-view-right-flow-top .detailed-form-view-right-body {
    padding-top: 12px;
}

.template-6 .detailed-form-view-right-flow-top .detailed-form-view-right-top {
    background: #fff;
}

.template-6 .ind-form-field .heading h4 {
    font-size: 18px;
    color: #005AA1;
}

.template-6 .ind-form-field .heading p {
    font-size: 16px;
    line-height: normal;
    color: #000;
}

.template-6 .ind-form-field .input-block.drop .ind-task-input.selectize-custom+.anim-text {
    display: block !important;
    order: 0;
}

.template-6 .ind-form-field .radio-wrapper.mandatory-box:before,
.template-6 .ind-form-field .checkbox-wrapper.mandatory-box:before {
    content: none;
}

.template-6 .ind-form-field .radio-wrapper.mandatory-box .error-fields,
.template-6 .ind-form-field .checkbox-wrapper.mandatory-box .error-fields {
    display: block;
    float: left;
    width: 100%;
    font-size: 12px;
    margin-bottom: 5px;
}

.template-6 .ind-form-field .mandatory-box .fiels-inp-box,
.template-6 .ind-form-field .input-block.date-field.mandatory-box .form-type-input .form-control {
    border: 1px solid #e14745;
}

.template-6 .ind-form-field .unique-field.mandatory-box .error-fields {
    display: block;
    order: 2;
    font-size: 12px;
    margin: 10px 0 0;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
    border-left: 1px solid #e7e7e7;
}

.template-6 .custom-checkbox-text {
    color: #000;
    line-height: 24px;
}

.template-6 .ind-form-field .custom-checkbox-text p {
    line-height: 24px;
    color: #000;
}

.template-6 .custom-checkbox {
    width: 18px;
    height: 18px;
    border-radius: 5px;
}

.template-6 .custom-checkbox label {
    width: 18px;
    height: 18px;
    border-radius: 5px;
    border-color: #000;
}

.template-6 .custom-checkbox input:checked+label:before,
.template-6 .custom-checkbox input.active+label:before {
    background-color: #005aa1;
    width: 15px;
    height: 15px;
    left: 0;
    top: 0;
    zoom: 1.2;
    border-radius: 5px;
}

.each-template-type.active:after {
    content: "";
    width: 20px;
    height: 20px;
    background-color: var(--default-color);
    border-radius: 50%;
    position: absolute;
    left: 15px;
    top: 15px;
    background-image: var(--sprite-two);
    background-position: -349px -112px;
}

.template-4 .ind-form-field .input-block .ind-task-input.selectize-custom {
    height: auto;
    min-height: 50px;
    order: 1;
}

.template-4 .ind-form-field .input-block.drop .ind-task-input.selectize-custom+.anim-text {
    display: block !important;
    order: 0;
}

.template-2 .ind-form-field .input-block .ind-task-input.selectize-custom {
    height: auto;
    min-height: 50px;
    order: 1;
}

.template-2 .ind-form-field .input-block.drop .ind-task-input.selectize-custom+.anim-text {
    display: block !important;
    order: 0;
}

.terms-text-wrapper-block {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
    overflow-y: auto;
}

.terms-text-wrapper-block h1 {
    font-size: 2em;
    line-height: 1.2;
    margin-bottom: 15px;
}

.terms-text-wrapper-block h2 {
    font-size: 1.5em;
    line-height: 1.2;
    margin-bottom: 15px;
}

.terms-text-wrapper-block h3 {
    font-size: 1.17em;
    margin-bottom: 15px;
}

.terms-text-wrapper-block pre {
    font-size: 13px;
    line-height: 1.6;
    margin-bottom: 1em;
}

.terms-text-wrapper-block p {
    font-size: 16px;
    line-height: 1.6;
    margin: 1em 0;
}

.terms-text-wrapper-block strong {
    font-weight: 600;
}

.terms-text-wrapper-block em {
    font-style: italic;
}

.terms-text-wrapper-block .marker {
    background-color: Yellow;
}

.terms-text-wrapper-block big {
    font-size: larger;
}

.terms-text-wrapper-block small {
    font-size: smaller;
}

.terms-text-wrapper-block small big {
    font-size: 13px;
}

.terms-text-wrapper-block tt {
    font-family: monospace;
}

.terms-text-wrapper-block q:before {
    content: "'''";
    display: inline-block;
    font-style: italic;
}

.terms-text-wrapper-block q:after {
    content: "''";
    display: inline-block;
    font-style: italic;
}

.terms-text-wrapper-block kbd {
    background-color: #fff;
    color: #000;
}

.terms-text-wrapper-block ol {
    padding: 0 40px;
    list-style-type: decimal;
    margin: 1em 0;
}

.terms-text-wrapper-block ol li {
    padding: 0px;
    font-size: 16px;
    line-height: 1.6;
    margin: 1em 0;
}

.terms-text-wrapper-block ul {
    padding: 0 40px;
    list-style-type: disc;
    margin: 1em 0;
}

.terms-text-wrapper-block ul li {
    padding: 0px;
    font-size: 16px;
    line-height: 1.6;
    margin: 1em 0;
}

.bsy-modal.fixed-md .modal-body {
    height: 520px;
    padding: 0;
}

.bsy-modal.fixed-md {
    padding: 0;
}

.collection-project-settings-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.collection-project-settings-container {
    float: left;
    width: 100%;
    height: 100%;
}

.collection-project-settings-header {
    float: left;
    width: 100%;
    margin-bottom: 18px;
}

.collection-project-settings-header .ind-task-input {
    height: auto;
    min-height: 50px;
    padding: 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #DEE1E4;
}

.collection-project-settings-header .ind-task-input .sl-tag {
    background: var(--default-color);
    color: #fff;
}

.collection-project-settings-header .ind-task-input .sl-tag .tag-left {
    display: none;
}

.collection-project-settings-header .ind-task-input .sl-tag .tag-right {
    padding-left: 8px;
    color: #fff;
    max-width: 100%;
}

.collection-project-settings-header .ind-task-input .sl-tag .tag-right .tag-cl {
    background: transparent;
    font-size: 15px;
}

.collection-project-settings-body {
    float: left;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.collection-project-settings-body .settings-panel {
    font-size: 14px;
    font-weight: 600;
}

.collection-project-settings-body .panel-each {
    width: auto;
    float: left;
    margin-right: 10px;
    border-radius: 5px;
}

.grid-view.with-image .collection-card-image video {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-1 .ind-form-field .heading:first-child {
    margin-top: 0;
}

.template-1 .ind-form-field .heading h4 {
    font-size: 16px;
    margin-bottom: 5px;
}

.template-1 .ind-form-field .heading p {
    font-size: 14px;
    line-height: normal;
}

.template-1 .radio-block label:before {
    border-color: #b6c5ca;
}

.template-1 .input-block.date-field .field-header {
    display: block;
    position: absolute;
    left: 20px;
    top: 9px;
    z-index: 9;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
    line-height: 14px;
}

.template-1 .input-block.date-field {
    position: relative;
}

.template-1 .ind-form-field .input-block.date-field .form-type-input .form-control {
    font-size: 16px;
}

.template-1 .ind-form-field .form-header-block h5 {
    margin-bottom: 5px;
}

.template-1 .ind-form-field .signature-left label {
    font-size: 12px;
    color: #898989;
}

.template-1 .sig-preview:before {
    font-size: 12px;
    color: #898989;
}

.template-1 .ind-form-field .sig-button-block .general-btn.grey {
    box-shadow: none;
}

.template-1 .ind-form-field .upload-wrapper .file-tag {
    padding-left: 27px;
}

.template-1 .ind-form-field .input-block.computed .field-header {
    display: block;
    padding-left: 20px;
    padding-top: 9px;
    font-size: 12px;
    font-weight: 400;
    color: #898989;
}

.template-1 .refresh-btn {
    position: absolute;
    right: 15px;
    top: 9px;
    margin: 0;
}

.template-1 .computed .form-input-block-left .form-type-input {
    padding-right: 60px;
}

.template-1 .ind-form-field .display-text p {
    font-size: 16px;
}

.template-1 .ind-form-field .custom-checkbox-text p {
    color: var(--default-text);
}

.template-2 .ind-form-field .heading:first-child {
    margin-top: 0;
}

.template-2 .ind-form-field .heading h4 {
    font-size: 16px;
    margin-bottom: 5px;
}

.template-2 .ind-form-field .heading p {
    font-size: 14px;
    line-height: normal;
}

.template-2 .radio-block label:before {
    border-color: #b6c5ca;
}

.template-2 .ind-form-field .form-header-block h5 {
    margin-bottom: 5px;
}

.template-2 .sig-preview:before {
    font-size: 12px;
}

.template-2 .ind-form-field .upload-wrapper .file-tag {
    padding-left: 27px;
}

.template-2 .ind-form-field .upload-wrapper.sm-line {
    margin-bottom: 0;
}

.template-2 .ind-form-field .display-text p {
    font-size: 16px;
}

.template-2 .ind-form-field .custom-checkbox-text p {
    color: var(--default-text);
}

.template-2 .custom-checkbox label {
    background: #fff;
}

.template-2 .ind-form-field .input-block.date-field .form-type-input .form-control {
    font-size: 16px;
}

.template-2 .ind-form-field .form-header-block .radio-wrapper h5 {
    margin-bottom: 14px;
}

.template-2 .ind-form-field .form-header-block .checkbox-wrapper h5 {
    margin-bottom: 14px;
}

.template-3 .ind-form-field .heading:first-child {
    margin-top: 0;
}

.template-3 .ind-form-field .heading h4 {
    font-size: 16px;
    margin-bottom: 5px;
}

.template-3 .ind-form-field .heading p {
    font-size: 14px;
    line-height: normal;
}

.template-3 .radio-block label:before {
    border-color: #b6c5ca;
}

.template-3 .sig-preview:before {
    font-size: 12px;
    color: var(--default-grey)
}

.template-3 .ind-form-field .sig-button-block .general-btn.grey {
    box-shadow: none;
}

.template-3 .ind-form-field .input-block.computed .field-header {
    display: block;
    padding-left: 0;
    padding-top: 0;
    font-size: 12px;
    font-weight: 400;
    color: #898989;
}

.template-3 .refresh-btn {
    position: absolute;
    right: 0;
    top: 9px;
}

.template-3 .computed .form-input-block-left .form-type-input {
    padding-right: 60px;
}

.template-3 .ind-form-field .display-text p {
    font-size: 16px;
}

.template-3 .ind-form-field .custom-checkbox-text p {
    color: var(--default-text);
}

.template-3 .ind-form-field .form-header-block h5 {
    margin-bottom: 5px;
}

.template-3 .ind-form-field .radio-wrapper.mandatory-box:before,
.template-3 .ind-form-field .checkbox-wrapper.mandatory-box:before {
    content: none;
}

.template-3 .ind-form-field .radio-wrapper.mandatory-box .error-fields,
.template-3 .ind-form-field .checkbox-wrapper.mandatory-box .error-fields {
    display: block;
    width: 100%;
    font-size: 12px;
    margin: 5px 0;
}

.template-4 .ind-form-field .heading p {
    font-size: 14px;
    line-height: normal;
}

.template-4 .ind-form-field .radio-wrapper h5,
.template-4 .ind-form-field .checkbox-wrapper h5 {
    margin-bottom: 15px;
}

.template-4 .ind-form-field .radio-wrapper .radio-block {
    margin-bottom: 10px;
}

.template-4 .ind-form-field .form-header-block h5 {
    margin-bottom: 5px;
}

.template-4 .ind-form-field .fieldset {
    margin-bottom: 20px;
}

.template-4 .ind-form-field .sig-button-block .general-btn.grey {
    box-shadow: none;
}

.template-4 .refresh-btn {
    margin-top: 20px
}

.template-4 .ind-form-field .display-text p {
    font-size: 16px;
}

.template-4 .ind-form-field .custom-checkbox-text p {
    color: var(--default-text);
}

.template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
}

.template-5 .ind-form-field .heading h4 {
    font-weight: 500;
}

.template-5 .refresh-btn {
    margin-top: 20px;
}

.template-5 .ind-form-field .display-text p {
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
}

.template-5 .ind-form-field .upload-wrapper .file-tag .form-download:before {
    color: #0091ff;
}

.template-5 .ind-form-field .rightButtons {
    right: -32px;
    bottom: -8px;
}

.template-5 .ind-form-field.fieldset .rightButtons {
    right: -20px;
    bottom: 4px;
}

.template-6 .ind-form-field .form-header-block>h5 {
    font-weight: 600;
    margin-bottom: 5px;
}

.template-6 .ind-form-field .field-set .form-header-block>h5 {
    font-weight: 700;
    margin-bottom: 5px;
}

.template-6 .ind-form-field .display-text p {
    font-size: 16px;
    line-height: 24px;
}

.template-6 .ind-form-field .custom-checkbox-text p {
    color: var(--default-text);
}

.template-6 .ind-form-field .upload-wrapper .file-tag .form-download:before {
    position: relative;
    top: -12px;
}

.template-6 .form-preview-header p {
    color: #000000;
}

.template-6.width-720 .sig-preview,
.template-6.width-540 .sig-preview {
    width: 35%;
}

.template-6.width-720 .ind-form-field .signature-canvas canvas,
.template-6.width-540 .ind-form-field .signature-canvas canvas {
    width: 100% !important;
}

.template-6.width-720 .signature-left,
.template-6.width-540 .signature-left {
    width: 60%;
}

.template-6 .photo-modal .modal-header h5 {
    color: #fff;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc(25% - 20px);
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: calc(25% - 20px);
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc(25% - 20px);
}

.template-6 .ind-form-field.field-set .upload-wrapper .file-tag .form-download:before {
    top: 0;
}

.template-6.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc(50% - 20px);
}

.template-6.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: calc(50% - 20px);
}

.template-6.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 100%;
    margin-right: 0;
}

.template-6.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: 100%;
    margin-right: 0;
}

.template-6.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: 100%;
    margin-right: 0;
}

.rc-tab-cluster:before {
    background-position: -635px -116px;
    width: 14px;
    height: 14px;
}

.rc-tab-cluster.active:before {
    background-position: -635px -142px
}

.form-preview-header.header-component {
    display: flex;
    padding: 20px !important;
    border-radius: 5px;
}

.form-preview-header-image {
    display: inline-block;
    width: 130px;
    border-radius: 5px;
}

.form-preview-header-image img {
    float: left;
    width: 100%;
    object-fit: contain;
    border-radius: 5px;
}

.form-preview-header-content {
    display: inline-block;
    width: calc(100% - 150px);
}

.header-order-0 .form-preview-header-image {
    order: 0;
    margin-right: 20px;
}

.header-order-1 .form-preview-header-image {
    order: 1;
    margin-left: 20px;
}

.preview-form .close {
    display: none;
}

.preview-form .detailed-form-view-right-flow-top {
    height: 100%;
}

.preview-form .detailed-form-view-right-body .container .form-preview-container {
    margin-bottom: 20px;
}

.header-component-top .detailed-form-view-right-top {
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 25px;
}

.header-persistent .detailed-form-view-right-top {
    position: sticky;
    position: -webkit-sticky;
    left: 0;
    top: 0;
    z-index: 10;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.header-full-width .detailed-form-view-right-top .container {
    max-width: none;
    padding: 0;
}

.header-full-width .detailed-form-view-right-top {
    padding: 0;
}

.header-full-width .detailed-form-view-right-top .container .form-preview-header.header-component {
    border-radius: 0;
}

.header-component-top .form-preview-header-image {
    width: 60px;
}

.header-component-top .form-preview-header-content {
    display: inline-block;
    width: calc(100% - 105px);
    padding-right: 34px;
}

.header-full-width .header-component.header-order-1 {
    padding-right: 65px !important;
}

.header-full-width .header-component.header-order-0 {
    padding-right: 30px !important;
}

.footer-block {
    float: left;
    width: 100%;
    margin-top: 25px;
}

.footer-wrap {
    float: left;
    width: 100%;
    display: flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    padding: 20px 0 0;
    border-radius: 5px;
}

.footer-column {
    padding: 0 20px;
    margin-bottom: 20px;
}

.footer-col-1 .footer-column {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.footer-col-2 .footer-column {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

.footer-col-3 .footer-column {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

.footer-col-4 .footer-column {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

.footer-col-5 .footer-column {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.footer-col-6 .footer-column {
    -ms-flex: 0 0 16.66%;
    flex: 0 0 16.66%;
    max-width: 16.66%;
}

.footer-col-7 .footer-column {
    -ms-flex: 0 0 14.28%;
    flex: 0 0 14.28%;
    max-width: 14.28%;
}

.footer-col-8 .footer-column {
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
}

.footer-col-9 .footer-column {
    -ms-flex: 0 0 11.11%;
    flex: 0 0 11.11%;
    max-width: 11.11%;
}

.footer-col-10 .footer-column {
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
}

.footer-col-11 .footer-column {
    -ms-flex: 0 0 9.09%;
    flex: 0 0 9.09%;
    max-width: 9.09%;
}

.footer-col-12 .footer-column {
    -ms-flex: 0 0 8.33%;
    flex: 0 0 8.33%;
    max-width: 8.33%;
}

.footer-full-width .footer-block .container {
    max-width: none;
    padding: 0;
}

.footer-full-width .footer-wrap {
    border-radius: 0;
}

.footer-persistent .footer-block {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 10;
}

.footer-icon-content {
    float: left;
    width: 100%;
    display: flex;
    margin-bottom: 10px;
}

.footer-icon-content:last-child {
    margin-bottom: 0;
}

.footer-icon-image {
    float: left;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    margin-right: 10px;
}

.footer-icon-image img {
    float: left;
    width: 30px;
    height: 30px;
    object-fit: cover;
    border-radius: 5px;
}

.footer-icon-text {
    float: left;
    width: calc(100% - 40px);
}

.footer-bullettext .footer-icon-text p {
    position: relative;
    padding-left: 10px;
}

.footer-bullettext .footer-icon-text p:before {
    content: "\2022";
    position: absolute;
    left: 0;
    top: -1px;
}

.footer-bullettext {
    margin-bottom: 10px;
    float: left;
    width: 100%;
}

.footer-bullettext:last-child {
    margin-bottom: 0;
}

.footer-icon-text p {
    word-break: break-word;
}

.form-full-height .detailed-form-view-right-flow-top {
    height: 100%;
    padding-bottom: 80px;
}

.form-full-height .detailed-form-view-right-bottom {
    position: fixed;
    left: 270px;
    bottom: 0;
    width: calc(100% - 270px);
}

.form-full-height .detailed-form-view-right-flow-top.footer-component {
    padding-bottom: 0;
}

.form-full-height .footer-component .detailed-form-view-right-bottom {
    position: relative;
}

.footer-bullettext .footer-icon-text p a {
    cursor: pointer;
    transition: .3s ease-out;
}

.detailed-form-view.direct-flow.embedded-form .modal-body .header-component-top .detailed-form-view-right-top {
    display: block;
}

.starred {
    float: left;
    width: 14px;
    height: 14px;
    border: 0;
    padding: 0;
    line-height: 0;
    background: transparent;
    position: absolute;
    left: 64.5px;
    top: calc(50% - 7px);
}

.starred:before {
    content: "";
    background: var(--sprite-two) no-repeat -461px -185px;
    width: 14px;
    height: 14px;
    display: inline-block;
}

.starred.active:before {
    background-position: -443px -185px;
}

.data-holder-right .form-table.fixed-header.starred-field .table thead th:first-child {
    min-width: 190px;
}

.data-holder-right .form-table.fixed-header.starred-field .table thead th:first-child .starred {
    z-index: 8;
}

.terms-text-wrapper-block b {
    font-weight: 600;
}

.terms-text-wrapper-block i {
    font-style: italic;
}

.left-panel.multi-card-record .card-container {
    width: 65%;
    padding-left: 20px;
    padding-right: 0
}

.multi-card-record.card-container .right-panel-white-box {
    width: 100%;
}

.left-panel.multi-card-record .card-container .right-panel-white-box {
    width: 100%;
    margin-right: 0;
}

.multi-card-record-fieldset-header {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.multi-card-record-fieldset-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
}

.left-panel.multi-card-record .card-container .right-panel-white-box .form-single-value-box {
    margin-bottom: 20px;
}

.left-panel.multi-card-record .card-container .right-panel-white-box .form-single-value-box:last-child {
    margin-bottom: 0;
}

.left-panel.multi-card-record .card-container .right-panel-white-box:last-child {
    margin-bottom: 30px;
}

.fixed-container {
    float: left;
    width: 35%;
}

.template-body .form-table.starred-field .table thead th:first-child {
    width: auto;
    min-width: 190px;
}

.grid-view.card-view-fixed.with-image .collection-card-right {
    min-height: auto;
    position: relative;
}

.grid-view.card-view-fixed .collection-card-right-header {
    margin-bottom: 0;
}

.left-panel .grid-view.card-view-fixed .collection-card-right-header h5 {
    margin-bottom: 0;
}

.grid-view.card-view-fixed .ind-collection-card {
    min-height: auto;
}

.left-panel .grid-view.with-image.card-view-fixed .collection-card-left {
    margin-right: 0;
}

.left-panel .grid-view.with-image.card-view-fixed .collection-card-left:last-child {
    margin-bottom: 0;
}

.header-component-top.header-only .form-preview-header-image {
    display: none;
}

.header-component-top.header-only .form-preview-header-content {
    width: 100%;
}

.sort-panel {
    float: left;
    position: absolute;
    right: 10px;
    top: calc(50% - 7px);
}

.sort-panel span {
    float: left;
    display: flex;
    flex-direction: column;
}

.sort-panel span:before {
    background-position: -420px -164px;
    width: 8px;
    height: 5px;
    transform: rotate(180deg);
    margin-bottom: 4px;
    opacity: .5;
}

.sort-panel span:after {
    content: "";
    background: var(--sprite-two) no-repeat -420px -164px;
    width: 8px;
    height: 5px;
    display: inline-block;
    opacity: .5;
}

.sorting-ascend .sort-panel span:before {
    opacity: 1;
}

.sorting-descend .sort-panel span:after {
    opacity: 1;
}

.form-table.fixed-header .table thead th {
    cursor: pointer;
}

.template-6 .ind-form-field .field-set .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-6 .ind-form-field .field-set .checkbox-wrapper h5 {
    margin-bottom: 15px;
}

.template-6 .ind-form-field .field-set .input-block .field-header {
    margin-bottom: 15px;
    font-size: 13px;
    line-height: 23px;
    margin-bottom: 8px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .input-block:before,
.template-5 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper:before,
.template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:before {
    content: none;
}

.template-5 .ind-form-field .anim-text,
.template-5 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    margin-bottom: 0px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view {
    border: 1px dashed #ffffff;
}

.full-width.template-7 .modal-header {
    background: transparent;
    border-bottom: 1px solid transparent;
}

.full-width.template-7 .modal-content {
    background: #FFFFFF;
}

.full-width.template-7 .modal-footer {
    background: transparent;
}

.template-7 .form-preview-header .preview-subheader {
    font-size: 40px;
    line-height: 50px;
    color: #262626;
    margin-bottom: 10px;
}

.template-7 .form-preview-header p {
    color: #6D7278;
    font-size: 19px;
    letter-spacing: 0;
    line-height: 23px;
}

.template-7 .form-preview-header {
    margin-bottom: 0;
}

.template-7 .modal-body {
    padding: 68px 15px;
}

.template-7 .ind-form-field .input-block {
    margin-bottom: 70px;
}

.template-7 .ind-form-field .anim-text,
.template-7 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-7 .ind-form-field .input-block .fiels-inp-box:focus+.anim-text,
.template-7 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #262626;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 0px;
}

.template-7 .ind-form-field .input-block textarea+.anim-text {
    top: 0;
}

.template-7 .ind-form-field .input-block {
    overflow: unset;
    display: flex !important;
    flex-direction: column;
    margin-bottom: 35px;
    border: 0;
    padding-left: 55px;
}

.template-7 .ind-form-field .input-block .fiels-inp-box {
    border: 0px solid #E4E6E9;
    border-radius: 5px;
    background-color: transparent !important;
    height: 70px;
    order: 1;
    border-bottom: 1px solid rgb(109 114 120 / .4);
    border-radius: 0;
    padding: 0;
    color: #262626;
    font-size: 18px;
    font-weight: 400;
    line-height: 23px;
}

.template-7 .ind-form-field .input-block textarea.fiels-inp-box {
    height: 150px;
    padding-top: 0;
}

.template-7 .ind-form-field .checkbox-wrapper {
    border: 0;
    margin-bottom: 10px;
    border: 0;
    padding-left: 55px;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
}

.template-7 .ind-form-field .radio-wrapper {
    border: 0;
    margin-bottom: 20px;
    border: 0;
    padding-left: 55px;
    padding-top: 0;
    padding-bottom: 0;
}

.template-7 .ind-form-field .upload-wrapper.sm-line {
    border: 0;
    border: 0;
    padding-left: 0px;
    height: 70px;
    padding-right: 0;
}

.template-7 .ind-form-field .radio-wrapper h5,
.template-7 .ind-form-field .checkbox-wrapper h5 {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #262626;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
}

.template-7 .ind-form-field .checkbox-wrapper .select-chk-block {
    height: 90px;
    width: auto;
    min-width: 140px;
    border: 0;
    margin-right: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.template-7 .input-check-box {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
}

.template-7 .ind-form-field .checkbox-wrapper .select-chk-block .control {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    color: #6D7278;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 23px;
    text-align: center;
    z-index: 9;
    padding: 0 15px;
}

.template-7 .checkbox-indicator {
    height: 100%;
    width: 100%;
    left: 5px;
    top: 5px;
    background: transparent;
    border: 1px solid #6D7278;
    border-radius: 5px;
    /* opacity:0; */
}

.template-7 .input-check-box.active+.checkbox-indicator {
    background: transparent;
    border: 0;
    border-radius: 5px;
    opacity: 1;
    float: left;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -2;
}

.template-7 .checkbox-indicator:after {
    left: 12px;
    top: 13px;
    background: var(--sprite-two) no-repeat -502px -118px;
    width: 12px;
    height: 9px;
    z-index: 9;
}

.template-7 .ind-form-field .input-block.date-field .form-type-input .form-control {
    background: transparent;
    padding: 0;
    border-bottom: 1px solid rgb(109 114 120 / 40%);
    border-radius: 0;
    font-size: 18px;
    font-weight: 400;
    line-height: 23px;
    color: #262626;
    height: 70px;
}

.template-7 .ind-form-field .input-block.date-field .form-type-input .form-control::placeholder {
    color: rgb(109 114 120 / 50%) !important;
}

.template-7 .ind-form-field .input-block .fiels-inp-box::placeholder {
    opacity: 1;
    color: rgb(109 114 120 / 50%) !important;
}

.template-7 .ind-form-field .radio-wrapper .radio-block {
    float: left;
    width: auto;
    min-width: 140px;
    height: 90px;
    margin-right: 20px;
    padding: 0;
    border: 0;
    border-radius: 5px;
}

.template-7 .ind-form-field .radio-wrapper .radio-block label {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 18px;
    color: #6D7278;
    line-height: 23px;
    padding: 0 15px;
    border: 1px solid #6D7278;
    border-radius: 5px;
}

.template-7 .radio-block label:before {
    top: 5px;
    left: 5px;
    width: 25px;
    height: 25px;
    background: #fff;
    border: 2px solid #0091ff;
    opacity: 0;
}

.template-7 .radio-block input:checked+label:before {
    opacity: 1
}

.template-7 .radio-block input:checked+label:after {
    width: 9px;
    height: 9px;
    top: 13px;
    left: 13px;
    background-color: #0091ff;
}

.template-7 .file-upload {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed rgb(109 114 120 / 40%);
    opacity: 0.4;
    border-radius: 5px;
}

.template-7 .file-upload label:before {
    content: none;
}

.template-7 .ind-form-field .file-upload label {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    color: #6D7278;
    padding: 0;
}

.template-7 .ind-form-field .upload-wrapper .file-tag {
    position: absolute;
    right: 20px;
    top: 23px;
    background: #FFFFFF;
    border: 1px solid #0091ff;
    margin: 0;
}

.template-7 .limit-text {
    line-height: normal;
    color: #0091ff;
}

.template-7 .ind-form-field .radio-wrapper .radio-block input:checked+label {
    border: 1px solid #0091FE;
}

.template-7 .input-check-box.active+.checkbox-indicator:before {
    content: "";
    width: 25px;
    height: 25px;
    border: 2px solid #0091ff;
    position: absolute;
    border-radius: 5px;
    left: 5px;
    top: 5px;
    background-color: white;
    z-index: 9;
}

.template-7 .ind-form-field .upload-wrapper.sm-line .upload-progress {
    width: 100%;
    left: unset;
    right: 0;
}

.template-7 .cl-fl {
    background: #0091ff;
}

.template-7 .ind-form-field .input-block .fiels-inp-box option {
    background-color: #FFFFFF;
}

.template-7 .ind-form-field .ind-form-field.fieldset .form-header-block h5 {
    color: #262626;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 5px;
}

.template-7 .ind-form-field .ind-form-field.fieldset .form-header-block p {
    color: #6D7278;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 6px;
    float: left;
}

.template-7 .ind-form-field .fieldset:before {
    content: none;
}

.template-7 .ind-form-field .fieldset {
    padding-left: 55px;
}

.template-7 .style-view {
    border: 1px dashed rgb(109 114 120 / .4);
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.1);
    padding: 30px;
    margin-top: 24px;
}

.template-7 .ind-form-field .radio-wrapper.single-col .radio-block {
    width: auto;
    height: 40px;
    display: block;
}

.template-7 .ind-form-field .radio-wrapper.single-col .radio-block label {
    justify-content: flex-start;
    padding: 0 15px;
}

.template-7 .ind-form-field .radio-wrapper.single-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.template-7 .single-col .radio-block-container {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.template-7 .single-col .radio-block label:before {
    position: relative;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    margin-right: 10px;
    display: none;
}

.template-7 .single-col .radio-block input:checked+label:before {
    position: relative;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    margin-right: 10px;
    display: inline-block;
}

.template-7 .single-col .radio-block input:checked+label:after {
    top: 15px;
    left: 22px;
    width: 8px;
    height: 8px;
}

.template-7 .ind-form-field .input-block:before,
.template-7 .ind-form-field .checkbox-wrapper:before,
.template-7 .ind-form-field .radio-wrapper:before,
.template-7 .ind-form-field .fieldset:before {
    content: "";
    background: var(--sprite-two) no-repeat -598px -107px;
    width: 30px;
    height: 30px;
    position: absolute;
    left: 0;
    top: 0;
}

.template-7 .ind-form-field .input-block.drop:after {
    content: "";
    background: var(--sprite-two) no-repeat -678px -185px;
    width: 19px;
    height: 12px;
    position: absolute;
    right: 0;
    bottom: 28px;
}

.template-7 .ind-form-field .input-block.date-field:after {
    content: "";
    background: var(--sprite-two) no-repeat -701px -182px;
    width: 18px;
    height: 19px;
    position: absolute;
    right: 0;
    bottom: 28px;
}

.template-7 .ind-form-field .checkbox-wrapper .select-chk-block .control .checkbox-indicator {
    top: 0;
    left: 0;
}

.template-7 .modal-header .close:before {
    background: var(--sprite-one) no-repeat -11px -125px;
    width: 16px;
    height: 16px;
}

.template-7 .field-header,
.template-7 .toggle .field-common label {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #262626;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
}

.template-7 .ind-form-field .heading h4 {
    color: #262626;
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 5px;
}

.template-7 .ind-form-field .heading p {
    color: #6D7278;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 23px;
}

.template-7 .toggle .field-common.field-req-block {
    padding: 0;
    height: auto;
}

.template-7 .input-block.date-field .form-type-input {
    padding-top: 0;
}

.template-7 .ind-form-field .rightButtons {
    left: unset;
    right: -20px;
    bottom: 4px;
}

.template-7 .signature-canvas {
    background: transparent;
    padding-top: 0;
    padding-left: 0;
    padding-bottom: 15px;
}

.template-7 .signature-left .label-header {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #262626;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
    width: 100%;
}

.template-7 .ind-form-field .signature-canvas canvas {
    background-color: #fff;
    border-color: rgb(109 114 120 / .4);
}

.template-7 .sig-preview {
    background-color: #fff;
    border-color: rgb(109 114 120 / .4);
    margin-top: 55px;
}

.template-7 .sig-preview:before {
    border-radius: 3px;
}

.template-7 .ind-form-field .sig-button-block {
    padding-left: 0;
    padding-bottom: 0;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 25%;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: calc(25% - 20px);
    margin-right: 0px;
    padding-left: 0;
    margin-right: 20px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    width: 100%;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line label {
    padding: 0;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .input-block textarea.fiels-inp-box {
    min-height: 70px;
    resize: auto;
    max-width: 100%;
    min-width: 100%;
    height: 70px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper .select-chk-block {
    height: 70px;
    max-width: 100%;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc(25% - 20px);
    padding-left: 0;
    margin-right: 20px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper .select-chk-block .control {
    white-space: nowrap;
    justify-content: end;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 22px 36px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .upload-progress {
    width: calc(100% - 20px);
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    top: -4px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    top: -54px;
    right: 13px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line label {
    padding: 0 10px;
}

.template-7.width-720 .sig-preview {
    margin-top: 60px;
    height: 108px;
    margin-left: 25px;
}

.template-7.width-720 .sig-preview {
    margin-top: 60px;
    height: 108px;
    margin-left: 25px;
}

.template-7.width-720 .ind-form-field .signature-canvas canvas {
    width: 400px !important;
}

.template-7.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 50%;
}

.template-7.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc(50% - 20px);
    height: auto;
}

.template-7.width-540 .ind-form-field .signature-canvas canvas {
    width: 270px !important;
}

.template-7.width-540 .sig-preview {
    margin-top: 64px;
    height: 95px;
    margin-left: 25px;
}

.template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
    width: 100%;
}

.template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

.template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .att {
    font-size: 18px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: calc(25% - 20px);
    height: 126px;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    margin-right: 20px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper .radio-block {
    height: 70px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper .radio-block label {
    white-space: nowrap;
    justify-content: end;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 22px 36px;
}

.template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: 100%;
}

.template-7 .autofill-label {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #262626;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 24px;
}

.template-7 .ind-form-field .input-block .ind-task-input.selectize-custom {
    padding: 0;
    border: 0;
    border-bottom: 1px solid rgb(109 114 120 / .4);
    height: auto;
    min-height: 70px;
    border-radius: 0;
    order: 1;
}

.template-7 .ind-form-field .input-block.drop .ind-task-input.selectize-custom+.anim-text {
    display: block !important;
    order: 0;
}

.template-7 .field-set .ind-form-field {
    margin-bottom: 35px;
}

.template-7 .ind-form-field .tag-wrapper-bl input {
    background: transparent;
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    line-height: 23px;
}

.template-7 .ind-form-field .tag-wrapper-bl input::placeholder {
    opacity: 1;
    color: rgb(109 114 120 / 50%) !important;
    text-transform: Capitalize;
}

.template-7 .signature-left .label-header label {
    margin-bottom: 0;
}

.template-7 .ind-form-field .ind-form-field.fieldset .checkbox-wrapper h5 {
    margin-bottom: 24px;
}

.template-7 .field-set .checkbox-wrapper.ind-form-field {
    margin-bottom: 15px;
}

.template-7 .ind-form-field .ind-form-field.fieldset .radio-wrapper h5 {
    margin-bottom: 24px;
}

.template-7 .ind-form-field .ind-form-field.fieldset .input-block .field-header {
    margin-bottom: 24px;
}

.template-7 .checbox-with-image-text p {
    float: left;
    width: 100%;
    color: #9FD4FF;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    margin-top: 20px;
    margin-bottom: 24px;
}

.template-7 .ind-form-field .photo-capture .radio-wrapper {
    padding-left: 0;
    margin-bottom: 25px;
}

.template-7 .ind-form-field .photo-capture .radio-wrapper:before {
    content: none;
}

.template-7 .shot_preview video,
.template-7 .cam-preview {
    background: rgba(0, 145, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.4) !important;
}

.template-7 .cam-preview:before {
    background: rgb(13, 92, 169);
    border-color: rgba(255, 255, 255, 0.4) !important;
    color: #fff;
}

.template-7.width-540 .shot_preview video {
    width: 100%;
}

.template-7.width-540 .cam-preview {
    width: 100%;
}

.template-7.width-540 .capture-mode-1 {
    flex-direction: column;
}

.template-7.width-540 .shot_preview {
    margin-bottom: 20px;
}

.template-7 .photo-capture-btn {
    color: #6D7278;
}

.photo-modal .template-7 .modal-content {
    background: var(--theme-second);
}

.full-width.template-7 .photo-modal .modal-content {
    background: var(--theme-second);
}

.template-7 .detailed-form-view-left {
    background: rgb(109 114 120 / .4);
    border-right: 1px solid rgb(109 114 120 / .4);
}

.template-7 .linked-collection-record li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

.template-7 .ind-form-field .input-block {
    margin-bottom: 30px;
}

.template-7 .ind-form-field .anim-text,
.template-7 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    margin-bottom: 0;
}

.template-7 .ind-form-field .input-block textarea.fiels-inp-box {
    padding-top: 10px;
}

.template-7 .field-header {
    margin-bottom: 15px;
}

.template-7 .ind-form-field .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-7 .ind-form-field .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-7 .ind-form-field .checkbox-wrapper h5 {
    margin-bottom: 15px;
}

.template-7 .toggle .field-common label {
    margin-bottom: 15px;
}

.template-7 .date-field .field-header {
    margin-bottom: 0;
}

.template-7 .signature-left .label-header {
    margin-bottom: 15px;
}

.template-7 .sig-preview:before {
    background: #fff;
    color: #6D7278;
    border-color: rgb(109 114 120 / .4);
}

.template-7 .photo-capture-wrapper {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgb(109 114 120 / .4);
}

.template-7 .autofill-label {
    margin-bottom: 0;
}

.template-7 .style-view {
    margin-top: 20px;
}

.template-7 .ind-form-field .ind-form-field.fieldset .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-7 .ind-form-field .ind-form-field.fieldset .checkbox-wrapper h5 {
    margin-bottom: 15px;
}

.template-7 .field-set .checkbox-wrapper.ind-form-field {
    margin-bottom: 0;
}

.template-7 .ind-form-field .ind-form-field.fieldset .input-block .field-header {
    margin-bottom: 15px;
}

.template-7 .file-upload {
    opacity: 1;
}

.template-7 .ind-form-field .mandatory-box .fiels-inp-box {
    border-bottom: 1px solid #e14745;
}

.template-7 .ind-form-field .radio-wrapper.mandatory-box .error-fields {
    display: block;
    width: 100%;
    margin: 10px 0;
    float: left;
}

.template-7 .ind-form-field .checkbox-wrapper.mandatory-box .error-fields {
    display: block;
    width: 100%;
    margin: 0 0 10px;
    float: left;
}

.template-7 .ind-form-field .input-block.date-field.mandatory-box .form-type-input .form-control {
    border-bottom: 1px solid #e14745;
}

.template-7 .unique-field.mandatory-box .error-fields {
    display: block;
    float: left;
    width: 100%;
    margin: 15px 0 0 0;
    order: 1;
}

.template-7 .input-block.mandatory-box .upload-wrapper.sm-line .file-upload {
    border-color: #e14745;
}

.template-7 .style-view .signature-left {
    padding-right: 20px;
}

.template-7.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    width: calc(50% - 20px);
}

.template-7.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
    margin-right: 15px;
    width: calc(50% - 20px);
}

.template-7 .ind-form-field .heading {
    margin-bottom: 30px;
}

.template-7.width-720 .ind-form-field .signature-canvas canvas {
    width: 100% !important;
}

.template-7.width-540 .ind-form-field .ind-form-field.fieldset .radio-wrapper h5 {
    margin-bottom: 15px;
}

.template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
    height: auto;
}

.template-7.width-540 .ind-form-field .signature-canvas canvas {
    width: 100% !important;
}

.template-7 .ind-form-field .mandatory-box .error-fields {
    font-size: 12px;
}

.template-7 .ind-form-field.fieldset.field-set.false.flex-box .mandatory-box .error-fields {
    margin: 10px 0 0 0;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper .select-chk-block {
    margin-bottom: 0;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper .radio-block {
    margin-bottom: 0;
}

.template-7 .custom-check {
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    color: #fff;
}

.template-7 .custom-checkbox label {
    content: "";
    float: left;
    width: 25px;
    height: 25px;
    border: 2px solid #0091ff;
    position: relative;
    border-radius: 5px;
    left: 0;
    top: 0;
    background-color: #192C54;
}

.template-7 .custom-checkbox {
    width: 25px;
    height: 25px;
}

.template-7 .custom-checkbox .input-check-box {
    z-index: 10;
}

.template-7 .ind-form-field .custom-checkbox-text p {
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
}

.template-7 .custom-checkbox input:checked+label:before {
    background-color: transparent;
    background: var(--sprite-two) no-repeat -502px -118px;
    width: 12px;
    height: 9px;
    z-index: 9;
    margin: 0;
    top: 6px;
    left: 4px;
    position: relative;
}

.template-7 .ind-form-field .heading h4 {
    font-weight: 500;
}

.template-7 .refresh-btn {
    margin-top: 20px;
}

.template-7 .ind-form-field .display-text p {
    color: #262626;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
}

.template-7 .ind-form-field .upload-wrapper .file-tag .form-download:before {
    color: #0091ff;
}

.template-7 .ind-form-field .rightButtons {
    right: -32px;
    bottom: -8px;
}

.template-7 .ind-form-field.fieldset .rightButtons {
    right: -20px;
    bottom: 4px;
}

.template-7 .btn-toggle.active {
    background: #0091ff;
}

.template-7 .ind-form-field .checkbox-wrapper .select-chk-block .input-check-box.active+.checkbox-indicator {
    border: 1px solid #0091ff;
}

.template-7 .ind-form-field .input-block .mce-container.mce-panel {
    border: 1px solid rgb(109 114 120 / .4);
}

.template-7 .ind-form-field .mce-stack-layout-item {
    border: 0;
}

.template-7 .ind-form-field .input-block .mce-container.mce-panel .mce-toolbar-grp.mce-panel {
    border: 0;
}

.template-7 .form-input-block-left .form-type-input {
    border: 0;
    border-bottom: 1px solid rgb(109 114 120 / 40%);
    border-radius: 0;
    min-height: 55px;
}

.template-7 .sig-button-block .general-btn {
    box-shadow: none;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .input-block:before,
.template-7 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper:before,
.template-7 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:before {
    content: none;
}

.template-7 .ind-form-field .anim-text,
.template-7 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    margin-bottom: 15px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
    width: calc(25% - 20px);
    padding-left: 0;
    margin-right: 20px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view {
    border: 1px dashed #c5c7c9;
}

.weightage-tag {
    padding: 2px 5px;
    background: var(--default-color);
    margin-left: 7px;
    margin-right: 7px;
    border-radius: 5px;
    font-size: 13px;
    color: #FFFFFF;
}

.image-tag {
    margin-right: 0px;
    border-radius: 5px;
    display: inline-block;
}

.image-tag img {
    float: left;
    width: 100%;
    height: 100%;
    max-width: 100px;
    object-fit: contain;
    border-radius: 5px;
    position: relative;
    top: 3px;
}

.precise-val:before {
    background-position: -337px -92px;
    width: 13px;
    height: 13px;
    margin-right: 5px;
    position: relative;
    top: 2px;
}

.precise-val {
    display: inline-block;
    font-size: 14px;
    color: #3db590;
}

.type-form-button-block {
    padding-left: 55px;
    float: left;
    width: 100%;
    animation: slide-up 0.4s ease;
}

.or-text {
    line-height: 40px;
    margin-left: 20px;
    color: rgb(255 255 255 / .5);
}

.type-form-button {
    float: left;
    width: auto;
    padding: 0 20px;
    height: 40px;
    min-width: 100px;
    border: 0;
    border-radius: 5px;
    background: var(--default-color);
    border: 1px solid var(--default-color);
    color: #fff;
    height: 40px;
    min-width: 90px;
}

.template-5 .type-form-button {
    background: rgba(0, 145, 255, .4);
    border-color: rgba(255, 255, 255, .4);
}

.template-5 .or-text {
    color: #9fd4ff;
}

.template-7 .type-form-button {
    background: rgb(0 145 255);
    border-color: rgb(0 145 255);
}

.template-7 .or-text {
    color: #6d7278;
}

.detailed-form-view-right-flow-top .detailed-form-view-right-body.type-form {
    display: flex;
    align-items: center;
    height: calc(100% - 123px);
}

.template-5 .ind-form-field .sig-button-block .general-btn {
    box-shadow: none;
}

.type-form .ind-form-field .input-block,
.type-form .ind-form-field .radio-wrapper,
.type-form .ind-form-field .checkbox-wrapper {
    animation: slide-up 0.4s ease;
}

@keyframes slide-up {
    0% {
        opacity: 0;
        transform: translateY(180px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.form-single-value-box h5 img {
    float: left;
    width: 100%;
    max-width: 35px;
    object-fit: contain;
}

.weightage {
    margin-left: 10px;
    background: transparent;
    border: 1px solid var(--default-color);
    padding: 5px;
    color: var(--default-color);
    border-radius: 5px;
    font-size: 12px;
    font-weight: 400;
    max-height: 25px;
    display: flex;
    align-items: center;
}

.template-5 .image-tag {
    position: absolute;
    left: 0;
    top: -3px;
    width: 100%;
    height: 88px;
}

.template-5 .image-tag img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 100%;
    object-position: top;
}

.template-5 .radio-block.option-with-img input:checked+label .image-tag:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 145, 255, 0.4);
    position: absolute;
    left: 0;
    top: 3px;
    border-radius: 5px;
    z-index: 8;
}

.template-5 .radio-block.option-with-img input:checked+label:before {
    z-index: 9;
}

.template-5 .radio-block.option-with-img input:checked+label:after {
    z-index: 9;
}

.template-5 .ind-form-field .checkbox-wrapper .select-chk-block.option-with-img .control .checkbox-indicator {
    z-index: 8;
}

.template-7 .image-tag {
    position: absolute;
    left: 0;
    top: -2px;
    width: 100%;
    height: 88px;
    padding: 1px;
}

.template-7 .image-tag img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 100%;
    object-position: top;
}

.template-7 .radio-block.option-with-img input:checked+label .image-tag:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgb(255 255 255 / 40%);
    position: absolute;
    left: 0;
    top: 3px;
    border-radius: 5px;
    z-index: 8;
}

.template-7 .radio-block.option-with-img input:checked+label:before {
    z-index: 9;
}

.template-7 .radio-block.option-with-img input:checked+label:after {
    z-index: 9;
}

.template-7 .ind-form-field .checkbox-wrapper .select-chk-block.option-with-img .control .checkbox-indicator {
    z-index: 8;
}

.template-7 .option-with-img .input-check-box.active+.checkbox-indicator {
    background: rgb(255 255 255 / 40%);
}

.collection-clik-panel .discuss-inner {
    background: #f0f0f0;
    height: calc(100vh - 167px);
}

.collection-chat {
    float: left;
    width: auto;
    height: 35px;
    padding: 0 20px;
    margin-left: 14px;
    background: #fff;
    border: 1px solid var(--default-color);
    border-radius: 3px;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
}

.collection-chat:hover {
    background: var(--default-color);
}

.collection-chat:before {
    content: "";
    background: var(--sprite-two) no-repeat -311px -364px;
    width: 14px;
    height: 14px;
    display: inline-block;
}

.collection-chat:hover:before {
    content: "";
    background: var(--sprite-one) no-repeat -451px -186px;
    width: 12px;
    height: 12px;
    zoom: 1.18;
}

.collection-chat-container .message-in-box {
    padding: 0;
    box-shadow: none;
    background: transparent;
}

.collection-chat-container .file-bl-wrap {
    padding-left: 0;
    width: 100%;
}

.collection-chat-container .file-bl-wrap .attach-chat-block {
    width: 100%;
    border: 1px solid #E3E5E8;
}

.collection-chat.active:after {
    content: "";
    width: 8px;
    height: 8px;
    background: #e14745;
    border-radius: 50%;
    box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.21);
    position: absolute;
    right: 17px;
    top: 7px;
}

.option-score-container {
    float: left;
    width: 100%;
    margin-bottom: 5px;
}

.option-with-score {
    float: left;
    display: flex;
    align-items: center;
}

.option-score-container:last-child {
    margin-bottom: 0;
}

.form-single-value-box .custom-image {
    max-width: 55px;
    margin-top: 0;
    height: 100%;
}

.form-single-value-box h5 .option-score-container:first-child {
    margin-top: 10px;
}

.otp-button-block {
    float: left;
    width: 100%;
    padding: 0 20px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.otp-button-block .general-btn,
.field-button-block .general-btn {
    margin-left: 12px;
    height: 30px;
    box-shadow: none;
    background: var(--default-color);
    border-color: var(--default-color);
}

.template-2 .otp-button-block {
    padding: 0;
    order: 1;
    margin-top: 15px;
}

.template-3 .otp-button-block {
    padding: 0;
    padding-bottom: 20px;
    border-bottom: 1px solid #e4e6e9;
}

.template-4 .otp-button-block {
    padding: 0;
    order: 1;
    margin-top: 15px;
}

.template-5 .otp-button-block {
    padding: 15px 0px 15px;
    order: 1;
}

.template-6 .otp-button-block {
    padding: 15px 0px 0px;
    order: 1;
}

.template-6 .otp-button-block .general-btn {
    background: #005aa1;
    border-color: #005aa1;
    color: #FFFFFF;
    border-radius: 10px;
}

.template-6 .otp-button-block .general-btn:hover {
    background: rgb(0 90 161 / .75);
    border-color: rgb(0 90 161 / .75);
}

.template-7 .otp-button-block {
    padding: 15px 0px 15px;
    order: 1;
}

.template-7 .otp-button-block .general-btn {
    background: #0091ff;
    border-color: #0091ff;
}

.template-7 .otp-button-block .general-btn:hover {
    background: rgb(0 145 255 / .75);
    border-color: #0091ff;
}

.otp-button-block .general-btn.verify {
    background: #03B86E;
    border-color: #03B86E;
}

.otp-button-block .general-btn.verify:hover {
    background: rgb(3 184 110 / 0.75);
    border-color: rgb(3 184 110 / 0.75);
}

.detailed-form-view .input-block .quill {
    border: 1px solid #e4e6e9;
    background: #ffffff;
}

.detailed-form-view .input-block .ql-toolbar.ql-snow {
    border: 0 !important;
}

.detailed-form-view .input-block .ql-container.ql-snow {
    border-color: #e4e6e9 !important;
}

.detailed-form-view .input-block .ql-editor p {
    font-size: 16px;
    color: var(--default-text);
    line-height: normal;
}

.template-1.detailed-form-view .input-block .quill {
    border: 0;
}

.template-6.detailed-form-view .input-block .quill {
    background: #ffffff;
    border-radius: 5px;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .2);
    border: 1px solid #e7e7e7;
}

.template-7.detailed-form-view .input-block .quill {
    border-color: rgb(109 114 120 / .4);
}

.template-7.detailed-form-view .input-block .ql-container.ql-snow {
    border-color: rgb(109 114 120 / .4) !important;
}

.form-single-value-box h5 div * {
    font-size: 16px;
    font-weight: 400;
}

.form-single-value-box h5 div strong {
    font-weight: 600;
}

.form-single-value-box h5 div em {
    font-style: italic;
}

.form-single-value-box h5 div p {
    line-height: normal;
    color: var(--default-text);
}

.form-single-value-box h5 div p a {
    color: var(--default-color);
    text-decoration: underline;
}

.form-single-value-box h5 div ol {
    float: left;
    width: 100%;
    margin: 15px 0;
    list-style: decimal;
    padding-left: 15px;
}

.form-single-value-box h5 div ul {
    float: left;
    width: 100%;
    margin: 15px 0;
    list-style: disc;
    padding-left: 18px;
}

.template-cortiza .detailed-form-view-right-flow-top .detailed-form-view-right-top {
    padding: 20px;
}

.template-cortiza .detailed-form-view-right-flow-top .detailed-form-view-right-top .container {
    max-width: none;
    padding: 0;
}

.detailed-form-view.direct-flow.template-cortiza .modal-body .form-preview-header .close {
    position: absolute;
    right: 0;
    top: 0;
}

.form-full-height.template-cortiza .detailed-form-view-right-bottom {
    padding: 0 20px;
}

.form-full-height.template-cortiza .detailed-form-view-right-bottom .container {
    max-width: none;
    padding: 0;
}

.template-cortiza .multiple-form-container {
    padding: 0 20px;
}

.with-card-preview .table.form-preview-table tbody tr th {
    width: 50%;
    text-transform: uppercase;
    line-height: 24px;
}

.with-card-preview .table.form-preview-table tbody tr td {
    width: 50%;
    line-height: 24px;
}

.with-card-preview.left-panel .grid-view.card-view-fixed .collection-card-right-header h5 {
    font-size: 16px;
}

.with-card-preview .grid-view.card-view-fixed .collection-card-right-header {
    margin-bottom: 15px;
}

.otp-button-block button {
    border: 0;
    height: 30px;
    border-radius: 5px;
    padding: 0 15px;
    font-size: 14px;
    background: transparent;
}

.ind-form-field .otp-button-block p {
    font-size: 14px;
    line-height: 30px;
}

.template-4 .ind-form-field .input-block.generate-otp {
    order: 2;
    margin-bottom: 0;
    margin-top: 20px;
}

.template-4 .otp-button-block.generate-otp {
    order: 3;
}

.template-1 .input-block.generate-otp {
    border: 0;
    border-top: 1px solid #E4E6E9;
}

.template-2 .ind-form-field .input-block.generate-otp {
    order: 2;
    margin-bottom: 0;
    margin-top: 20px;
}

.template-2 .otp-button-block.generate-otp {
    order: 3;
}

.template-3 .ind-form-field .input-block.otp-field {
    border-bottom: 0;
}

.template-3 .ind-form-field .input-block.generate-otp {
    border-bottom: 0;
}

.template-5 .ind-form-field .input-block.generate-otp {
    order: 1;
    margin-bottom: 0;
    padding-left: 0;
}

.template-5 .ind-form-field .input-block.generate-otp:before {
    content: none;
}

.template-5 .ind-form-field .otp-button-block p {
    color: #fff;
}

.template-6 .ind-form-field .input-block.generate-otp {
    order: 2;
    margin-bottom: 0;
    margin-top: 20px;
}

.template-6 .otp-button-block.generate-otp {
    order: 3;
}

.template-7 .ind-form-field .input-block.generate-otp {
    order: 1;
    margin-bottom: 0;
    padding-left: 0;
}

.template-7 .ind-form-field .input-block.generate-otp:before {
    content: none;
}

.ind-form-field .input-block .rightButtons,
.ind-form-field .upload-wrapper.sm-line .rightButtons {
    right: -8px;
    display: flex;
    justify-content: flex-end;
}

.ind-form-field .input-block .rightButtons button:last-child,
.ind-form-field .upload-wrapper.sm-line .rightButtons button:last-child {
    margin-right: 0;
}

.ind-form-field .fieldset .rightButtons {
    left: -18px;
    transform: rotate(-270deg);
    display: flex;
    justify-content: flex-end;
}

.template-5 .ind-form-field.fieldset .rightButtons {
    right: -8px;
    left: unset;
    bottom: -8px;
    transform: rotate(0deg);
    display: flex;
    justify-content: flex-end;
}

.template-5 .ind-form-field.fieldset .rightButtons .btnsubIcon {
    transform: rotate(0deg);
}

.template-5 .ind-form-field.fieldset .rightButtons .btnsubIcon:last-child {
    margin-right: 0;
}

.template-6 .ind-form-field .field-set .rightButtons {
    left: unset;
    right: -8px;
    transform: rotate(0deg);
    bottom: -8px;
}

.template-6 .ind-form-field.fieldset .rightButtons .btnsubIcon {
    transform: rotate(0deg);
}

.template-6 .ind-form-field .field-set .rightButtons button:last-child {
    margin-right: 0;
}

.template-7 .ind-form-field.fieldset .rightButtons {
    right: -8px;
    left: unset;
    bottom: -8px;
    transform: rotate(0deg);
    display: flex;
    justify-content: flex-end;
}

.template-7 .ind-form-field.fieldset .rightButtons .btnsubIcon {
    transform: rotate(0deg);
}

.template-7 .ind-form-field.fieldset .rightButtons .btnsubIcon:last-child {
    margin-right: 0;
}

.template-7 .ind-form-field.fieldset .rightButtons .btnsubIcon:last-child {
    margin-right: 0;
}

.detailed-form-view-right-flow-top>div>div:first-child {
    margin-bottom: 0px !important;
    overflow-x: auto !important;
}

.input-block.autofill .select-drop li .select-drop-click-right h5 {
    width: auto;
}

.input-block.autofill .select-drop li .select-drop-click-right h5 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 50%;
}

.input-block.autofill .select-drop li .select-drop-click-right p {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.input-block.autofill .select-drop {
    z-index: 100;
}

.ind-form-field .selectize-custom .sl-tag .tag-right {
    max-width: 150px;
    white-space: nowrap;
}

.input-block.date-field .rdtTime {
    border: 0;
    box-shadow: none;
}

.input-block.date-field .rdtCounter .rdtBtn {
    color: var(--default-color);
}

.template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block.date-field {
    margin-top: 0;
}

.template-5 .ind-form-field .ind-form-field.fieldset .input-block.date-field .field-header {
    margin-bottom: 0;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .upload-progress {
    width: 100%;
}

.template-7 .ind-form-field .ind-form-field.fieldset .input-block.date-field .field-header {
    margin-bottom: 0;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .upload-progress {
    width: 100%;
}

.template-7 .ind-form-field .anim-text,
.template-7 .ind-form-field .input-block.active .fiels-inp-box+.anim-text {
    margin-bottom: 0;
}

.ind-form-field .otp-button-block .success-label {
    color: #03b86e;
}

.ind-form-field .otp-button-block .error-label {
    color: #e3165b;
    margin: 0;
    width: auto;
}

.template-1 .input-block.otp-field .field-header {
    display: block;
    position: absolute;
    top: 10px;
    left: 20px;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
    margin: 0;
    line-height: 12px;
    width: auto;
}

.template-3 .input-block.otp-field .field-header {
    display: block;
    position: absolute;
    top: 10px;
    left: 0px;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
    margin: 0;
    line-height: 12px;
    width: auto;
}

.template-5 .input-block.otp-field .field-header {
    position: relative;
    top: 0;
    left: 0;
    order: 0;
    color: #FFFFFF;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    margin-bottom: 0;
}

.template-5 .ind-form-field .otp-button-block .success-label {
    color: #03b86e;
}

.template-5 .ind-form-field .otp-button-block .error-label {
    color: #e3165b;
    margin: 0;
}

.template-7 .ind-form-field .input-block.otp-field .field-header {
    margin-bottom: 0;
}

.template-1 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-wrapper-bl {
    float: left;
    width: 100%;
    padding: 0;
}

.template-1 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom {
    padding-right: 20px;
    min-height: 67px;
    height: auto;
}

.template-1 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container {
    float: left;
    width: 100%;
}

.template-1 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 80px;
}

.template-1 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input::placeholder {
    color: var(--default-grey);
    opacity: 1;
}

.template-1 .ind-form-field .input-block.drop:before {
    top: 30px;
}

.template-1 .ind-form-field .fieldset.flex-box .form-input-block-left .form-type-input {
    border-bottom: 0;
}

.template-2 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom {
    padding-right: 40px;
}

.template-2 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-wrapper-bl {
    float: left;
    width: 100%;
    padding: 0;
}

.template-2 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container {
    float: left;
    width: 100%;
}

.template-2 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 120px;
}

.template-3 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-wrapper-bl {
    float: left;
    width: 100%;
    padding: 0;
}

.template-3 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom {
    padding-right: 40px;
    min-height: 69px;
    height: auto;
    border-bottom: 1px solid #e4e6e9;
    border-radius: 0;
}

.template-3 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container {
    float: left;
    width: 100%;
}

.template-3 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 120px;
}

.template-3 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input::placeholder {
    color: var(--default-grey);
    opacity: 1;
}

.template-3 .ind-form-field .input-block.drop:before {
    top: 30px;
}

.template-3 .ind-form-field .fieldset.flex-box .form-input-block-left .form-type-input {
    border-bottom: 0;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view .input-block.drop {
    border-bottom: 0;
    height: auto;
}

.template-3 .ind-form-field.fieldset.flex-box .input-block.drop select {
    border-bottom: 1px solid #E4E6E9;
}

.template-4 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom {
    padding-right: 40px;
}

.template-4 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-wrapper-bl {
    float: left;
    width: 100%;
}

.template-4 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container {
    float: left;
    width: 100%;
}

.template-4 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 120px;
}

.template-5 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-wrapper-bl {
    float: left;
    width: 100%;
    padding: 0;
}

.template-5 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom {
    padding-right: 25px;
    height: auto;
}

.template-5 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container {
    float: left;
    width: 100%;
}

.template-5 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 120px;
}

.template-5 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input::placeholder {
    color: var(--default-grey);
    opacity: 1;
}

.template-5 .ind-form-field .input-block.drop:after {
    bottom: auto;
    top: 60px;
}

.template-5 .form-input-block-left .form-type-input {
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 0;
    min-height: 55px;
    background: transparent;
}

.template-5 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom+.anim-text {
    padding-right: 25px;
}

.template-6 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-wrapper-bl {
    float: left;
    width: 100%;
    padding: 0;
}

.template-6 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom {
    padding-right: 30px;
    padding-left: 12px;
    min-height: 45px;
    height: auto;
}

.template-6 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container {
    float: left;
    width: 100%;
}

.template-6 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 80px;
    margin-right: 0;
}

.template-6 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input::placeholder {
    color: var(--default-grey);
    opacity: 1;
}

.template-6 .ind-form-field .selectize-custom .sl-tag {
    background: #005aa0;
}

.template-6 .ind-form-field .fieldset.flex-box .input-block textarea {
    min-height: 40px;
    padding-top: 0;
}

.template-7 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-wrapper-bl {
    float: left;
    width: 100%;
    padding: 0;
}

.template-7 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom {
    padding-right: 25px;
    height: auto;
}

.template-7 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container {
    float: left;
    width: 100%;
}

.template-7 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 120px;
}

.template-7 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input::placeholder {
    color: var(--default-grey);
    opacity: 1;
}

.template-7 .ind-form-field .input-block.drop:after {
    bottom: auto;
    top: 60px;
}

.template-7 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom+.anim-text {
    padding-right: 25px;
}

.template-7 .linked-collection-record li nav h5 {
    color: #6D7278;
}

.template-7 .linked-collection-record li nav.active h5 {
    color: #fff;
}

.otp-button-block>.general-btn {
    margin-left: 0;
}

.otp-button-block a {
    font-size: 14px;
    color: var(--default-color) !important;
    cursor: pointer;
    line-height: 30px;
}

.custom-template-view .style-view {
    position: relative;
}

.field-set.singlepanel-fieldset .style-view .rightButtons {
    left: -38px;
}

.template-5 .ind-form-field.fieldset.singlepanel-fieldset .style-view .rightButtons {
    left: unset;
    bottom: -9px;
}

.template-6 .ind-form-field.fieldset.singlepanel-fieldset .style-view .rightButtons {
    left: unset;
    bottom: -29px;
    right: -29px;
}

.template-7 .ind-form-field.fieldset.singlepanel-fieldset .style-view .rightButtons {
    left: unset;
    bottom: -9px;
}

.feedback-block {
    float: left;
    width: 100%;
    height: 60px;
    position: relative;
}

.feedback-block .rate-star {
    margin-left: 0;
}

.feedback-block .rate-star li {
    zoom: 1.5;
    cursor: pointer;
}

.template-1 .feedback-field .field-header {
    display: block;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
    margin: 0;
    line-height: 12px;
    width: auto;
    order: 0;
    padding-left: 20px;
    padding-top: 10px;
}

.template-1 .feedback-block {
    order: 1;
    padding: 0 20px;
    margin-left: 0;
    display: flex;
    align-items: center;
}

.template-2 .feedback-block {
    order: 1;
    height: 50px;
    margin-left: 0;
    display: flex;
    align-items: center;
}

.template-3 .feedback-field .field-header {
    display: block;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
    margin: 0;
    line-height: 12px;
    width: auto;
    margin-bottom: 10px;
}

.template-3 .feedback-block {
    display: flex;
    align-items: center;
    height: 68px;
}

.template-4 .feedback-block {
    order: 1;
    height: 50px;
    margin-left: 0;
    display: flex;
    align-items: center;
}

.template-5 .feedback-block {
    display: flex;
    align-items: center;
    height: 68px;
}

.template-6 .feedback-block {
    display: flex;
    align-items: center;
    height: 40px;
}

.template-7 .feedback-block {
    display: flex;
    align-items: center;
    height: 68px;
}

.feedback-block .btnsubIcon {
    margin-right: 10px;
}

.rate-star.bulb li {
    background-position: -179px -54px;
    width: 12px;
    height: 17px;
}

.rate-star.bulb .active {
    background-position: -163px -55px;
}

.template-1 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.toggle .field-common.field-req-block>label {
    display: none;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block {
    min-height: auto;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.drop:before {
    top: 22px;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.toggle .field-common.field-req-block>label {
    display: none;
}

.template-3 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.toggle .field-common.field-req-block>label {
    display: none;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block {
    min-height: auto;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.drop:before {
    top: 22px;
}

.template-4 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.toggle .field-common.field-req-block>label {
    display: none;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.drop:after {
    top: 32px;
}

.template-5 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.toggle .field-common.field-req-block>label {
    display: none;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block {
    min-height: auto;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.drop:before {
    top: 15px;
    content: none;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.drop .selectize-custom:before {
    content: "";
    width: 14px;
    height: 14px;
    background: url(images/down.svg) no-repeat;
    background-size: cover;
    z-index: 88;
    position: absolute;
    right: 16px;
    top: 15px;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.toggle .field-common.field-req-block>label {
    display: none;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.drop:after {
    top: 32px;
}

.template-7 .ind-form-field.fieldset.flex-box .style-view.style-view-fieldset-new .input-block.toggle .field-common.field-req-block>label {
    display: none;
}

.collection-detail-edit .form-table-edit .rate-star {
    margin: 0;
}

.form-single-value-box h5>.rate-star {
    margin-left: 0;
    margin-top: 10px;
}

.note-text {
    position: absolute;
    right: 60px;
    top: 12px;
}

.notes {
    float: left;
    width: 16px;
    height: 16px;
    background: transparent;
    border: 0;
    padding: 0;
    position: absolute;
    left: 106px;
    top: calc(50% - 8px);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: .40;
}

.notes:before {
    content: "";
    background: var(--sprite-two) no-repeat -8px -325px;
    width: 16px;
    height: 12px;
    display: inline-block;
}

.notes.added {
    opacity: 1;
}

.bsy-modal.note-trans-mod .modal-content {
    background: linear-gradient(#F9EFAF, #F7E98D);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: box-shadow 0.5s ease;
    -webkit-font-smoothing: subpixel-antialiased;
    border-radius: 0;
    max-width: 325px;
}

.bsy-modal.note-trans-mod .modal-lg {
    max-width: 325px;
}

.bsy-modal.note-trans-mod .modal-header {
    background: transparent;
    border: 0;
    border-radius: 0;
}

.bsy-modal.note-trans-mod .modal-header .task-head-text {
    color: var(--default-text);
    font-weight: 600;
}

.bsy-modal.note-trans-mod .modal-header .icon-in.icon-close-in {
    background-position: -212px -335px;
    width: 12px;
    height: 12px;
}

.bsy-modal.note-trans-mod .modal-body {
    height: 275px;
    padding: 0;
    padding: 0;
}

.bsy-modal.note-trans-mod .modal-body textarea {
    float: left;
    width: 100%;
    height: 100%;
    min-height: 100%;
    max-height: 100%;
    border: 0;
    background: transparent;
    color: var(--default-text);
    font-size: 14px;
    padding: 0 15px 15px;
    line-height: normal;
}

.bsy-modal.note-trans-mod .modal-body textarea::placeholder {
    color: var(--default-text) !important;
    opacity: .4;
}

.bsy-modal.note-trans-mod .modal-footer {
    border: 0;
    background: transparent;
    height: 50px;
    display: none;
}

.bsy-modal.note-trans-mod .modal-footer .general-btn {
    margin: 0 0 0 15px;
    box-shadow: none;
    background: transparent;
    border: 0;
    padding: 0;
    min-width: auto;
    color: var(--default-text);
}

.bsy-modal.note-trans-mod .modal-footer .general-btn.grey {
    opacity: .5;
}

.ind-form-field .input-block.feedback-field.mandatory-box .error-fields {
    display: block;
    order: 4;
    margin-top: 10px;
}

.template-1 .ind-form-field .input-block.feedback-field.mandatory-box .error-fields {
    padding-left: 20px;
    margin: 10px 0 15px;
}

.template-3 .ind-form-field .input-block.feedback-field.mandatory-box .error-fields {
    margin: 10px 0 15px;
}

.payment .otp-button-block .general-btn {
    margin-left: 0;
}

.template-1 .input-block.payment .field-header {
    display: block;
    padding-left: 20px;
    display: block;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
    margin: 0;
    line-height: 12px;
    width: auto;
    order: 0;
    padding-left: 20px;
    padding-top: 10px;
}

.template-1 .input-block.payment .otp-button-block {
    padding-top: 15px;
}

.template-3 .input-block.payment .field-header {
    display: block;
    padding-left: 20px;
    display: block;
    font-size: 12px;
    color: #898989;
    outline: 0;
    font-weight: 400;
    margin: 0;
    line-height: 12px;
    width: auto;
    order: 0;
    padding-left: 00px;
    padding-top: 10px;
}

.template-3 .input-block.payment .otp-button-block {
    padding-top: 15px;
}

.template-6 .input-block.payment .otp-button-block {
    padding-top: 0px;
}

.login-area.form-login {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9999;
    background: rgb(0 0 0 / 0.65);
}

.login-area.form-login .login-bg {
    background: transparent;
}

.login-area.form-login .login-block {
    min-height: auto;
}

.set-container .settings-loungue-header {
    padding: 0;
    height: auto;
    margin-bottom: 10px;
}

.side-page-link {
    display: none;
}

.mob-close {
    display: none;
}

.max-350 .modal-body {
    max-height: 350px;
    overflow-y: auto;
}

.csv-validation {
    float: left;
    width: 100%;
}

.csv-validation h5 {
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 15px;
}

.csv-validation p {
    float: left;
    width: 100%;
    font-size: 14px;
    margin-bottom: 10px;
}

.csv-validation ul {
    float: left;
    width: 100%;
    padding-left: 0px;
    margin-bottom: 15px;
}

.csv-validation ul:last-child {
    margin-bottom: 0px;
}

.csv-validation ul h5 {
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 10px;
    color: var(--default-color);
}

.csv-validation ul li {
    float: left;
    width: 100%;
    font-size: 14px;
    margin-bottom: 10px;
    position: relative;
    padding-left: 15px;
}

.csv-validation ul li:before {
    content: "";
    width: 5px;
    height: 5px;
    background: var(--default-text);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 6px;
}

.right-preview-options .coll-task-ico {
    color: var(--default-color) !important;
    border: 1px solid var(--default-color);
    background: #fff;
    box-shadow: none;
}

.right-preview-options .coll-task-ico:hover {
    background: var(--default-color);
    color: #fff !important;
}

.web-view .detailed-form-view-right-flow-top .detailed-form-view-right-body {
    overflow-y: unset;
}

.builder-added-options {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.builder-added-options .layout-header-block {
    margin: 0;
}

.builder-added-options select {
    background: transparent;
    border: 1px solid #E3E5E8;
    background: #fff;
    margin-left: 15px;
    padding: 0px 20px 0 10px;
    height: 30px;
}

.table.bsy-table.settings-table tbody tr td:first-child {
    width: auto;
}

.bsy-table.settings-table tr td,
.bsy-table tr th {
    width: auto;
}

.bsy-table.settings-table tbody tr td:last-child {
    text-align: left;
}

.table.bsy-table.settings-table tbody tr td:first-child .control {
    color: var(--default-text);
    font-weight: 600;
}

.bsy-table.settings-table {
    margin-bottom: 0;
}

.collection-drop .icon-in.icon-plus {
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    height: 20px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    z-index: 9;
}

.collection-drop .icon-in.icon-plus:before {
    content: "";
    background: var(--sprite-one) no-repeat -355px -333px;
    width: 17px;
    height: 17px;
    display: inline-block;
}

.general-btn.small-set-btn {
    height: 30px;
    box-shadow: none;
    float: right;
    background: #fff;
    color: var(--default-color);
    min-width: auto;
    padding: 0 15px;
}

.resource-filter-modal-body.collection-calendar-mod {
    padding: 20px;
    height: 100%;
}

.template-1.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    padding-top: 45px;
}

.template-2.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    padding-top: 45px;
}

.template-3.direct-flow.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    margin-top: 45px;
}

.template-4.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    margin-top: 45px;
}

.template-5.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    padding-top: 45px;
}

.template-6.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    padding-top: 45px;
}

.template-7.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
    padding-top: 45px;
}

.template-6.embedded-form .modal-content {
    background: #ffffff;
}

.template-6.embedded-form .ind-form-field .fiels-inp-box {
    border: 1px solid #e6e6e6;
}

.template-6.embedded-form .ind-form-field .input-block.drop select {
    border: 1px solid #e6e6e6;
}

.thankyou-modal {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.thankyou-modal h4 font {
    font-weight: 400;
    color: #005aa1;
    font-family: Source Sans Pro !important;
}

.thankyou-modal h4 {
    margin-bottom: 0;
}

.thankyou-modal p font {
    font-size: 14px;
    color: #005aa1;
    font-family: Source Sans Pro !important;
}

.field-button-block .general-btn {
    margin-left: 0;
    padding: 0 15px;
}

.form-resource-preview {
    float: left;
    width: 100%;
    margin-top: 20px;
}

.ind-form-field .form-resource-preview h5 {
    margin-bottom: 15px;
}

.form-resource-preview .file-each image-type {
    width: auto;
}

.form-resource-block {
    float: left;
    width: 100%;
}

.form-resource-block .file-each {
    float: left;
    width: 90px;
    background: #ffffff;
    border: 1px solid #e4e6e9;
    box-shadow: none;
}

.form-resource-block .file-each:nth-child(3n) {
    margin-right: 20px;
}

.form-resource-block .file-each .format:after {
    border-color: #ffffff transparent transparent transparent;
}

.form-resource-block .file-each-opt .opt-file-each.delete {
    background: #E14845;
}

.form-resource-block .file-each .opt-file-each.delete:before {
    content: "";
    background: var(--sprite-one) no-repeat -279px -333px;
    width: 16px;
    height: 14px;
    display: inline-block;
    zoom: .7;
}

.form-resource-preview.preview-mode .file-each .format {
    padding-bottom: 5px;
}

.form-resource-preview.preview-mode .file-each.image-type img {
    max-width: 100%
}

.template-1 .input-block.resources,
.template-1 .input-block.payment {
    padding: 20px;
}

.template-3 .field-button-block {
    margin-bottom: 20px;
}

.template-5 .form-resource-preview h5 {
    color: #fff;
}

.h-view .ind-collection-card {
    height: auto;
    min-height: 223px;
}

.h-view .collection-card-right-header h5 {
    overflow: unset;
    max-height: none;
}

.h-view .collection-card-right-content h5 {
    max-height: none;
    overflow: unset;
}

.h-view .collection-card-right-header {
    margin-bottom: 15px;
}

.h-view .collection-card-right-footer ul li {
    margin-right: .0;
    max-width: 25%;
    padding-right: 20px;
    margin-bottom: 20px;
}

.h-view .collection-card-right-footer ul li h5 {
    max-width: none;
    -webkit-line-clamp: unset;
}

.h-view .collection-card-right-footer ul {
    display: flex;
    flex-wrap: wrap;
}

.thankyou-modal .modal-content {
    height: 460px;
    width: 560px;
    overflow: hidden;
}

.thankyou-modal .modal-dialog {
    max-width: 560px;
}

.thankyou-content-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    padding: 40px 20px 40px 20px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.thankyou-image {
    margin: 0 0 30px 0;
    float: left;
    min-height: 150px;
    display: flex;
    align-items: flex-end;
}

.thankyou-image img {
    max-height: 150px;
}

.thankyou-modal .modal-body .modal-option-button {
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 1;
    width: 30px;
    height: 30px;
    background: rgb(255 255 255 / 40%);
    border-radius: 50%;
}

.thankyou-modal .modal-body .modal-option-button .icon-in.icon-close-in {
    background-position: -379px -71px;
    width: 13px;
    height: 13px;
}

.thankyou-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.thankyou-content ol *,
.thankyou-content * {
    color: #848484 !important;
    font-size: 16px !important;
    font-family: Source Sans Pro !important;
}

.thankyou-content ol li,
.thankyou-content * {
    text-align: center !important;
    font-size: 16px;
    color: #848484;
    line-height: 24px;
}

.thankyou-content b {
    font-weight: 600;
    font-family: 'Futura PT Book' !important;
    font-size: 16px !important;
    color: var(--default-text) !important;
}

.thankyou-content i {
    font-style: italic;
}

.thankyou-modal .modal-body {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0;
}

.bsy-table.settings-table tr td .wf-btn-block {
    height: 30px;
    opacity: 1;
}

.bsy-table.settings-table tr td .first-header {
    font-size: 14px;
    color: var(--default-text);
    font-weight: 600;
}

.full-width .modal-body .fl-pv .modal-body,
.full-wid-mod .modal-body .fl-pv .modal-body {
    height: auto;
    padding: 1rem;
    border-radius: 0 0 6px 6px;
}

.full-wid-mod .modal-body .fl-pv .modal-body {
    background: #fff;
}

.full-width .modal-lg .fl-pv .modal-lg,
.full-width .modal-content .fl-pv .modal-content {
    height: auto;
}

.full-width .modal-lg .fl-pv .modal-lg,
.full-wid-mod .fl-pv .modal-lg {
    max-width: 800px;
    margin: 1.75rem auto;
}

.full-width .modal-body .fl-pv .modal-header,
.full-wid-mod .modal-body .fl-pv .modal-header {
    background: var(--theme-second);
    height: 50px;
}

.full-wid-mod .fl-pv .modal-header {
    border-radius: 6px 6px 0 0;
}

.full-wid-mod .fl-pv .modal-content {
    border-radius: 6px;
}

.full-wid-mod .fl-pv .modal-content .resources-filters-icons {
    float: left;
    width: auto;
    margin: 0;
    list-style: none;
    padding-left: 0;
}

.container-split {
    float: left;
    width: 100%;
    border: 1px solid #e3e5e8;
    border-radius: 5px;
    margin-bottom: 20px;
}

.container-split-left {
    float: left;
    width: 50%;
    height: 100%;
    padding: 20px;
    padding: 20px;
}

.container-split-right {
    float: left;
    width: 50%;
    height: 100%;
    padding: 20px;
    border-left: 1px solid #e3e5e8;
    position: relative;
}

.container-split-left h5 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
}

.container-split-left .radio-wrap {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.container-split-left .radio-wrap .radio-block {
    margin-bottom: 10px;
}

.container-split-left .radio-block label:before {
    top: 1px;
}

.container-split-left .radio-block input:checked+label:after {
    top: 5px;
}

.container-split-right .ind-panel-options>label {
    text-transform: uppercase;
}

.container-split-right .ind-panel-options .radio-wrap {
    margin-bottom: 0;
}

.container-split-right .ind-panel-options .radio-wrap .radio-block>label {
    margin: 0;
}

.container-split-right .general-btn {
    padding: 0 14px;
    box-shadow: none;
    height: 35px;
    float: right;
}

.container-split-right .rightButtons {
    right: -9px;
    top: auto;
    bottom: -9px;
}

.container-split-right .btnsubIconsadd:before {
    background-position: -355px -333px;
    width: 17px;
    height: 17px;
}

.container-split-right .btnsubIcon:before {
    background-position: -328px -333px;
    width: 17px;
    height: 17px;
}

.container-split-right .rightButtons .btnsubIcon,
.container-split-right .rightButtons .btnsubIconsadd {
    float: right;
    margin: 0;
}

.label-title-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.label-title-block .prev-version {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.prev-version:before {
    background-position: -480px -161px;
    width: 20px;
    height: 20px;
    zoom: .8;
}

.template-1 .ind-form-field .input-block .fiels-inp-box:focus+.label-title-block .anim-text,
.template-1 .ind-form-field .input-block.active .fiels-inp-box+.label-title-block .anim-text {
    top: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.template-1 .label-title-block .prev-version {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 11;
}

.template-3 .ind-form-field .input-block .fiels-inp-box:focus+.label-title-block .anim-text,
.template-3 .ind-form-field .input-block.active .fiels-inp-box+.label-title-block .anim-text {
    top: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.template-3 .label-title-block .prev-version {
    position: absolute;
    right: 10px;
    top: 10px;
}

.template-5 .prev-version:before {
    background-position: -505px -161px;
}

.template-5 .ind-form-field .radio-wrapper {
    padding-right: 0;
}

.template-7 .prev-version:before {
    background-position: -530px -161px;
}

.template-5 .ind-form-field .radio-wrapper {
    padding-right: 0;
}

.version-modal .modal-body {
    height: 350px;
    overflow-y: auto;
}

.each-value-set {
    float: left;
    width: 100%;
}

.each-value-set>h5 {
    float: left;
    width: 100%;
    font-weight: 600;
    margin-bottom: 10px;
}

.each-value-set ul {
    float: left;
    width: 100%;
}

.each-value-set ul li {
    float: left;
    width: 100%;
    height: 40px;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 1px solid #e3e5e8;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.each-value-set ul li h5 {
    font-size: 14px;
    color: var(--default-grey);
}

.each-value-set ul li p {
    font-weight: 600;
    font-size: 14px;
}

.each-value-set ul li img {
    max-width: 40px;
    object-fit: contain;
}

.collection-detail-edit .form-table-edit .rate-star {
    min-width: 85px;
}

.signature-left .label-title-block {
    justify-content: normal;
}

.signature-left .label-title-block .prev-version {
    margin-left: 10px;
    margin-bottom: 8px;
}

.photo-capture-block .label-title-block {
    justify-content: normal;
}

.photo-capture-block .label-title-block .field-header {
    width: auto !important;
}

.photo-capture-block .label-title-block .prev-version {
    margin-left: 10px;
    margin-bottom: 8px;
}

.bsy-table.result-table tbody tr td:first-child {
    font-weight: 600;
    color: var(--default-text);
    font-size: 14px;
}

.bsy-table.result-table tbody tr td,
.bsy-table.result-table tbody tr th {
    padding: 10px 15px;
}

.bsy-table.result-table tbody tr th:last-child {
    text-align: right;
}

.bsy-table.result-table tbody tr td img {
    max-width: 30px;
    max-height: 20px;
    object-fit: contain;
}

.popover-card {
    max-width: none;
    width: 250px;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.4);
}

.popover-card .popover-body {
    padding: 0;
    float: left;
    width: 100%;
    height: 125px;
}

.popover-card .popover-body textarea {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    border-radius: 5px;
    padding: 10px 15px;
    resize: none;
}

.form-single-value-box p .label-title-block {
    float: right;
    width: auto;
}

.parent-button-block {
    float: left;
    width: 100%;
}

.parent-button-block button {
    margin-left: 8px;
}

.record-version .modal-body {
    padding: 0;
    height: 600px;
    background: #ECF0F1;
}

.version-panel-container {
    float: left;
    width: 100%;
    height: 100%;
}

.left-content-scroll {
    float: left;
    width: 175px;
    height: 100%;
    overflow-y: auto;
    padding: 20px 0 20px 20px;
}

.right-content-scroll {
    float: left;
    width: calc(100% - 175px);
    height: 100%;
    padding: 20px;
    overflow-y: auto;
}

.left-content-scroll p {
    float: left;
    width: 100%;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e3e5e8;
    font-size: 14px;
    cursor: pointer;
}

.left-content-scroll p.active {
    font-weight: 600;
    color: var(--default-color);
}

.right-preview-options .version-ico {
    color: var(--default-color) !important;
    border: 1px solid var(--default-color);
    background: #fff;
    box-shadow: none;
}

.right-preview-options .version-ico:hover {
    background: var(--default-color);
    color: #fff !important;
}

.version-ico:before {
    background-position: -530px -161px;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    zoom: .8;
}

.version-ico:hover:before {
    background-position: -505px -161px;
}

.prev-version-highlight {
    float: left;
    width: 16px;
    height: 11px;
    position: absolute;
    right: 2px;
    bottom: 0;
}

.prev-version-highlight:before {
    content: "";
    width: 1px;
    height: 14px;
    background: var(--default-active-color);
    display: inline-block;
    transform: rotate(45deg);
    position: relative;
    top: -3px;
    right: -11px;
}

.prev-version-highlight:after {
    content: "";
    width: 1px;
    height: 7px;
    background: var(--default-active-color);
    display: inline-block;
    transform: rotate(45deg);
    position: relative;
    top: -4px;
    right: -12px;
}

.left-panel.multi-card-record .card-container .right-panel-white-box .form-single-value-box {
    position: relative;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .input-block .label-title-block {
    min-height: 22px;
    margin-bottom: 8px;
    padding-right: 15px;
}

.template-6 .ind-form-field.fieldset.flex-box .style-view .input-block .label-title-block .anim-text,
.template-6 .ind-form-field.fieldset.flex-box .style-view .input-block .label-title-block .field-header {
    margin-bottom: 0;
    margin-right: 10px;
}

.template-6 .info-clicker-wrap {
    top: 8px;
}

.ind-collection-card.full-content {
    height: auto;
    min-height: 223px;
}

.list-view .full-content .collection-card-right-header h5 {
    word-break: break-word;
    max-height: unset;
}

.full-content .collection-card-right-content h5 {
    max-height: unset;
    overflow: unset;
    word-break: break-word;
}

.full-content .collection-card-right-footer ul li {
    margin-right: .0;
    max-width: 25%;
    padding-right: 20px;
    margin-bottom: 20px;
}

.data-holder-right .form-table .table thead th .select-chk-block {
    position: relative;
}

.all-option {
    float: left;
    width: 10px;
    height: 10px;
    cursor: pointer;
    position: absolute;
    right: -4px;
    top: -4px;
    background: transparent;
    opacity: .7;
    z-index: 2;
}

.all-option:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    border-color: var(--default-grey) transparent transparent transparent;
    position: absolute;
    top: 3px;
    left: 1px;
}

.all-option:hover:before {
    border-color: var(--default-color) transparent transparent transparent;
}

.option-trigger {
    padding: 0;
    float: left;
    width: 160px;
}

.option-trigger ul li {
    float: left;
    width: 100%;
}

.option-trigger ul li nav {
    float: left;
    width: 100%;
    padding: 8px 15px;
    color: var(--default-grey);
    font-size: 16px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    cursor: pointer;
}

.option-trigger ul li nav:hover {
    background: #FAFAFA;
    color: var(--default-color);
}

.more-option-card {
    background: #fff;
    padding: 10px 0;
    border: 1px solid #EAEAEA;
    border-radius: 4px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
}

.option-trigger ul li.active nav {
    background: #fafafa;
    color: var(--default-color);
}

.form-table.fixed-header .table tbody .selected-row td {
    background: var(--col-active);
}

.template-2 .ind-form-field .input-block.autofill.lbl-hidden {
    padding-top: 27px;
}

.template-4 .ind-form-field .input-block.autofill.lbl-hidden {
    padding-top: 27px;
}

.template-6 .ind-form-field .input-block.autofill.lbl-hidden {
    padding-top: 27px;
}

.width-1280 .container {
    max-width: 78%;
}

.width-1280 .detailed-form-view-right-top {
    padding-left: 0;
    padding-right: 0;
}

.width-1280 .detailed-form-view-right-bottom {
    padding: 0;
}

.width-1440 .container {
    max-width: 88%;
}

.width-1440 .detailed-form-view-right-top {
    padding-left: 0;
    padding-right: 0;
}

.width-1440 .detailed-form-view-right-bottom {
    padding: 0;
}

.width-1536 .container {
    max-width: 93%;
}

.width-1536 .detailed-form-view-right-top {
    padding-left: 0;
    padding-right: 0;
}

.width-1536 .detailed-form-view-right-bottom {
    padding: 0;
}

.thankyou-content-wrapper.text-only {
    justify-content: center;
}

.cover-wrapper-block {
    float: left;
    width: 100%;
    height: 100%;
    padding: 295px 20px 40px 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.cover-img {
    float: left;
    width: 100%;
    height: 270px;
    position: absolute;
    left: 0;
    top: 0;
}

.cover-img img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cover-wrapper-block .thankyou-content h5 {
    font-family: 'Cormorant Upright' !important;
    color: var(--default-text) !important;
    font-size: 30px !important;
    margin-bottom: 20px;
    line-height: normal;
}

.cover-wrapper-block .thankyou-content p {
    font-family: 'Futura PT Book' !important;
    font-size: 16px !important;
    color: var(--default-text) !important;
    max-width: 63%;
}

.thankyou-modal .modal-body.cover-template .modal-option-button {
    z-index: 1;
}

.thankyou-modal .modal-body.cover-template .modal-option-button .icon-in.icon-close-in {
    background-position: -358px -72px;
    width: 11px;
    height: 11px;
}

.attachment-wrap {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.attachment-wrap .upload-wrapper {
    width: 400px;
    margin-right: 15px;
}

.attachment-wrap .upload-wrapper .limit-text {
    max-width: 100px;
}

.template-5 .ind-form-field .attachment-wrap .upload-wrapper {
    width: 70%;
}

.template-7 .ind-form-field .attachment-wrap .upload-wrapper {
    width: 70%;
}

.template-6 .ind-form-field .label-title-block .field-header {
    display: block;
    position: relative;
    left: 0;
    top: 0;
    order: 0;
    font-weight: 400;
    color: #005aa1;
    font-size: 13px;
    line-height: 23px;
    margin-bottom: 5px;
}

.multi-upload-wrapper {
    float: left;
    width: 100%;
}

.multi-upload-wrapper .field-button-block {
    float: left;
    width: 100%;
}

.multi-upload-block .file-upload {
    float: left;
    width: auto;
    height: 45px;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    padding: 0 20px;
}

.multi-upload-block .file-upload label {
    height: 45px;
    line-height: 45px;
    position: relative;
}

.multi-upload-block {
    float: left;
    display: flex;
    align-items: center;
}

.multi-upload-block .general-btn {
    margin-left: 15px;
}

.multi-upload-block .attached-file-wrap {
    float: left;
    width: 100%;
}

.attached-file-wrap .attached-file .file-tag {
    display: flex;
    align-items: center;
    padding-right: 30px;
    font-size: 13px;
    color: #6a7476;
    border-radius: 34px;
    height: 25px;
    margin-top: 3px;
}

.attached-file-wrap .attached-file .file-tag .form-download {
    float: left;
    width: 20px;
    height: 20px;
    position: relative;
    left: 0;
    top: 0;
    background: transparent;
    margin: 0 4px;
    padding: 0;
}

.attached-file-wrap .attached-file .file-tag .form-download:before {
    content: "\f019";
    background: none;
    font-family: 'FontAwesome';
    font-size: 16px;
    color: #a5a5a5;
}

.attached-file-wrap .attached-file .file-tag .form-download:hover:before {
    color: var(--default-color);
}

.form-preview {
    width: 20px;
    height: 20px;
    position: relative;
    left: 0;
    top: 0;
    background: transparent;
    border: 0;
    margin: 0 4px;
    padding: 0;
}

.attached-file-wrap .attached-file .file-tag .form-preview:before {
    content: "\f06e";
    background: none;
    font-family: 'FontAwesome';
    font-size: 16px;
    color: #a5a5a5;
}

.attached-file-wrap .attached-file .file-tag .form-preview:hover:before {
    color: var(--default-color);
}

.side-tab .grid-view .collection-card-right-footer ul li h5 {
    width: 50%;
}

.each-inp-box {
    float: left;
    width: calc((100% / 2) - 8px);
    margin-right: 15px;
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

.each-inp-box>label {
    font-size: 14px;
    color: var(--default-grey);
    margin-bottom: 5px;
}

.each-inp-box input {
    float: left;
    width: 100%;
    height: 40px;
    border: 1px solid #dee1e4;
    border-radius: 5px;
    padding: 0 20px;
    font-size: 14px;
}

.each-inp-box:nth-child(2n) {
    margin-right: 0;
}

.record-edit {
    float: left;
    width: 23px;
    height: 23px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #555;
    display: flex;
    align-items: center;
    justify-content: center;
}

.record-edit:before {
    content: "";
    background: var(--sprite-one) no-repeat -93px -451px;
    width: 11px;
    height: 11px;
    display: inline-block;
}

.data-holder-right .form-table.fixed-header.starred-field .table thead th.edit-record {
    min-width: 73px;
    left: 0;
    z-index: 9;
    background: var(--white);
}

.form-table.fixed-header .table thead th.highlight-td {
    min-width: 165px;
    padding-left: 0;
    width: 1%;
}

.form-table.fixed-header .table thead th.highlight-td .share-text {
    position: absolute;
    right: 0;
    top: 12px;
}

.form-table.fixed-header .table tbody tr td.highlight-td {
    position: relative;
    padding-left: 0;
}

.form-table.fixed-header .table tbody tr td.highlight-td .user-assigned-ico {
    position: absolute;
    right: 10px;
    top: 16px;
}

.form-table.fixed-header .table thead th.highlight-td .starred {
    left: 39.5px;
}

.form-table.fixed-header .table tbody tr td.highlight-td .starred {
    left: 39.5px;
}

.form-table.fixed-header .table tbody tr td.highlight-td .notes {
    left: 81px;
}

.form-table.fixed-header .table tbody tr td.edit-record {
    background: var(--white);
    position: sticky;
    left: 0;
    z-index: 8;
}

.form-table.fixed-header .table tbody .selected-row td.edit-record {
    background: var(--col-active);
}

.template-body .form-table.starred-field .table thead th.edit-record {
    min-width: 73px;
    width: 1%;
    background: var(--white);
    z-index: 9;
    left: 0;
}

.template-body .form-table.starred-field .table thead th.highlight-td .select-chk-block {
    position: relative;
}

.each-flag-settings {
    float: left;
    width: calc((100% / 2) - 10px);
    border: 1px solid #E3E5E8;
    border-radius: 5px;
    padding: 20px;
    margin-bottom: 20px;
    margin-right: 20px;
    position: relative;
}

.each-flag-settings:nth-child(2n) {
    margin-right: 0;
}

.each-flag-settings h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    color: var(--default-text);
    margin-bottom: 10px;
}

.each-flag-settings p {
    float: left;
    width: 100%;
    color: var(--default-text);
    line-height: normal;
    font-size: 14px;
    margin-bottom: 10px;
}

.each-flag-settings p:last-child {
    margin-bottom: 0;
}

.flag-options {
    position: absolute;
    right: 20px;
    top: 20px;
    transition: .3s ease-out;
    opacity: 0;
    pointer-events: none;
}

.flag-options button {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 5px;
}

.flag-options .delete-ico:before {
    background-position: -442px -123px;
    width: 13px;
    height: 15px;
    margin: 0;
}

.each-flag-settings:hover .flag-options {
    opacity: 1;
    pointer-events: auto;
}

.flag-area {
    float: left;
    width: 100%;
    min-height: 104px;
    border-radius: 0 0 5px 5px;
    padding: 20px;
    border-top: 1px solid rgba(64, 83, 100, .15);
    background: #f5f5f5;
}

.flag-area .select-chk-block .control {
    font-size: 14px;
}

.flag-area .select-chk-block {
    width: 50%;
    margin: 10px 0;
    padding-right: 15px;
}

.form-table.fixed-header .table tbody tr:hover td {
    background: var(--col-active);
}

.select-chk-block.flag-tag {
    position: relative;
}

.flag-tag .flag-color {
    float: left;
    width: 10px;
    height: 10px;
    position: absolute;
    right: 0;
    top: 10px;
    border-radius: 50%;
}

.small-no-tab .data-holder-left .filter-accord .select-chk-block.flag-tag {
    padding-right: 15px;
}

.flag-area .select-chk-block .control-checkbox .control-indicator:after {
    background-image: none;
}

.flag-add-block {
    float: left;
    height: 23px;
    display: flex;
    align-items: center;
}

.each-added-flag {
    float: left;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
}

.float-panel-content-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    background: var(--white);
}

.float-panel-content-body-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.float-panel-content-body-inner .each-flag-settings {
    width: 100%;
    margin-right: 0;
    background: var(--white);
    margin-bottom: 10px;
}

.float-panel-content-body-inner .each-flag-settings {
    position: relative;
}

.float-panel-content-body-inner .each-flag-settings .select-chk-block {
    position: absolute;
    right: -5px;
    top: 25px;
}

.float-panel-content-body-inner .each-flag-settings .select-chk-block .control-indicator {
    border-radius: 50%;
}

.flag-ico {
    float: left;
    width: 23px;
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-right: 5px;
}

.flag-ico:before {
    background-position: -33px -403px;
    width: 17px;
    height: 17px;
    opacity: .5;
    zoom: .9;
}

.grid-view .ind-collection-card.without-img-flag {
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.side-tab .grid-view .without-img-flag .collection-card-left .form-option-block {
    right: 20px;
    top: 30px;
}

.grid-view .ind-collection-card.without-img-flag .collection-card-right {
    padding: 20px;
    min-height: 280px;
}

.flag-area .select-chk-block .control-indicator {
    top: 0;
}

.flag-settings-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.flag-settings-header h5 {
    margin: 0;
}

.flag-settings-header nav {
    font-size: 14px;
    color: var(--default-color);
    cursor: pointer;
}

.flag-settings-content {
    float: left;
    width: 100%;
}

.flag-settings-content ul li {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #E3E5E8;
}

.flag-settings-content ul li .select-chk-block {
    display: block;
    float: left;
    width: 100%;
    padding-right: 20px;
    position: relative !important;
    right: 0 !important;
    top: 0 !important;
    margin: 0;
}

.flag-settings-content ul li .select-chk-block.flag-tag .flag-color {
    top: 3px;
}

.flag-settings-content ul li .select-chk-block .control-indicator {
    border-radius: 0 !important;
}

.flag-settings-content ul li .select-chk-block .control {
    font-size: 14px;
    line-height: 15px;
}

.flag-settings-content ul li:last-child {
    margin-bottom: 0;
    padding: 0;
    border: 0;
}

.settings-group-link {
    float: left;
    width: 100%;
}

.each-setting-group {
    float: left;
    width: 100%;
    border-bottom: 1px solid #DEE1E4;
}

.each-setting-child-block {
    float: left;
    width: 100%;
    padding: 0 20px 20px 35px;
    display: none;
}

.each-setting-group.active {
    background: var(--white);
}

.each-setting-group.active .each-setting-child-block {
    display: block;
}

.each-setting-child-block li {
    float: left;
    width: 100%;
    margin: 0 0 10px 0;
}

.each-setting-child-block li:last-child {
    margin-bottom: 0;
}

.each-setting-group>nav {
    font-size: 14px;
    height: auto;
    min-height: 55px;
    display: flex;
    align-items: center;
    font-weight: 600;
    line-height: 24px;
    padding: 15px 35px 15px 20px;
    cursor: pointer;
    position: relative;
}

.each-setting-child-block li nav {
    float: left;
    width: auto;
    font-size: 14px;
    line-height: 22px;
    color: var(--default-grey);
    /* padding-bottom: 5px;
    margin-bottom: 5px; */
    cursor: pointer;
    position: relative;
}

.each-setting-child-block li.active nav {
    color: var(--default-color);
}

.each-setting-child-block li nav:before {
    content: "";
    width: 0;
    height: 1px;
    background: var(--sub-category-active);
    position: absolute;
    left: 0;
    bottom: -2.5px;
    transition: .3s ease-out;
}

.each-setting-child-block li:hover nav {
    color: var(--default-color);
}

.each-setting-child-block li.active nav:before,
.each-setting-child-block li:hover nav:before {
    width: 100%;
}

.summery-editable {
    float: left;
    width: 100%;
}

.summery-editable textarea {
    float: left;
    width: 100%;
    margin-top: 10px;
    height: 150px;
    border: 1px solid #E3E5E8;
    resize: none;
    border-radius: 5px;
    font-size: 14px;
    padding: 10px;
}

.each-setting-group>nav:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 20px;
    top: 28px;
    zoom: .9;
    transition: .3s ease-out;
}

.each-setting-group.active>nav:after {
    transform: rotate(180deg);
}

.template-4.simpleForm * {
    font-family: 'Futura PT Book';
}

.template-4.simpleForm .form-preview-header .preview-subheader {
    font-family: 'Cormorant Upright';
}

.template-4.simpleForm .form-preview-header p {
    font-family: 'Cormorant Upright';
}

.template-4.simpleForm .ind-form-field .radio-wrapper .radio-block label {
    padding-left: 35px;
    line-height: 26px;
}

.template-4.simpleForm .ind-form-field .checkbox-wrapper .select-chk-block .control {
    padding-left: 35px;
    left: line;
    line-height: 26px;
}

.template-4.simpleForm .radio-block label:before {
    border: 1px solid #ffc7af;
    width: 26px;
    height: 26px;
    top: 0;
}

.template-4.simpleForm .radio-block input:checked+label:after {
    background-color: #ffc7af;
    width: 16px;
    height: 16px;
    top: 5px;
    left: 5px;
}

.template-4.simpleForm .ind-form-field .checkbox-wrapper .select-chk-block .control .checkbox-indicator {
    border: 1px solid #ffc7af;
    width: 26px;
    height: 26px;
    border-radius: 4px;
    top: 0;
}

.template-4.simpleForm .ind-form-field .checkbox-wrapper .input-check-box.active+.checkbox-indicator {
    background: transparent;
}

.template-4.simpleForm .ind-form-field .checkbox-wrapper .checkbox-indicator:after {
    background: var(--sprite-form) no-repeat -125px -5px;
    width: 14px;
    height: 13px;
    left: 5px;
    top: 5px;
}

.template-4.simpleForm .btn-toggle.active {
    background: #ffc7af;
}

.template-4.simpleForm .detailed-form-view-right-bottom .button-block .general-btn {
    background: #FF7A72;
    font-family: 'Cormorant Upright';
    border-color: #FF7A72;
    text-transform: uppercase;
    font-size: 13px;
}

.template-4.simpleForm .detailed-form-view-right-bottom .button-block .general-btn.dark {
    background: var(--default-text);
    border-color: var(--default-text);
}

.template-4.simpleForm .otp-button-block .general-btn,
.template-4.simpleForm .field-button-block .general-btn,
.template-4.simpleForm .ind-form-field .sig-button-block .general-btn.grey {
    font-weight: 400;
}

.input-text-box {
    float: left;
    width: 100%;
    margin-top: 20px;
}

.input-text-box input {
    float: left;
    width: 100%;
    height: 40px;
    border: 1px solid #e4e6e9;
    border-radius: 5px;
    padding: 0 12px;
}

.form-set .user-settings-cont .form-table .table tbody tr td .select-chk-block .control {
    font-size: 14px;
}

.side-bar-panel.list-view-panel {
    height: calc(100vh - 57px);
}

.form-table.fixed-header .table tbody tr td.select-record {
    padding: 0;
    position: sticky;
    left: 73px;
    background: var(--white);
    z-index: 8;
}

.form-table.fixed-header .table thead th.select-record {
    width: 1%;
    padding: 0;
    position: sticky;
    left: 73px;
    background: var(--white);
    z-index: 9;
}

.form-table.fixed-header .table thead th.highlight-td.ht-left {
    min-width: 136px;
}

.form-table.fixed-header .table thead th.highlight-td.ht-left .starred {
    left: 8px;
}

.form-table.fixed-header .table tbody tr td.highlight-td.ht-left .starred {
    left: 8px;
}

.form-table.fixed-header .table thead th.highlight-td.ht-left .note-text {
    right: auto;
    left: 40px;
}

.form-table.fixed-header .table tbody tr td.highlight-td.ht-left .notes {
    left: 49px;
}

.form-table.fixed-header .table tbody tr:hover td.select-record {
    background: var(--col-active);
}

.form-table.fixed-header .table tbody .selected-row td.select-record {
    background: var(--col-active);
}

.data-holder-right .form-table .table thead th.select-record .select-chk-block {
    z-index: 1;
}

.form-table.fixed-header .table thead th.select-record .select-chk-block {
    position: relative;
    z-index: 1;
}

.form-table.fixed-header .table thead th.col-star {
    width: 1%;
    padding: 0;
}

.form-table.fixed-header .table thead th.col-notes {
    width: 1%;
    padding: 0 15px;
}

.form-table.fixed-header .table thead th.col-notes .note-text {
    position: relative;
    left: 0;
    top: 0;
}

.form-table.fixed-header .table thead th.col-share {
    width: 1%;
    padding: 0;
    text-align: center;
}

.form-table.fixed-header .table thead th.col-star .starred {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 1;
}

.form-table.fixed-header .table tbody tr td.col-star {
    width: 1%;
}

.form-table.fixed-header .table tbody tr td.col-star .starred {
    position: relative;
    left: 0;
}

.form-table.fixed-header .table tbody tr td.col-star {
    padding: 0 10px;
}

.form-table.fixed-header .table tbody tr td.col-notes .notes {
    position: relative;
    left: 0;
}

.form-table.fixed-header .table tbody tr td.col-share {
    padding: 0;
    text-align: center;
    width: 1%;
}

.invoice-wrapper.auto-wid {
    text-align: center;
}

.invoice-wrapper.auto-wid a {
    width: 100%;
    font-size: 14px;
    color: var(--default-color);
    cursor: pointer;
}

.float-panel-content-body-inner .each-setting-entry {
    border: 1px solid #E3E5E8;
    border-radius: 5px;
}

.inline-select {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.inline-select .select-box select {
    height: 40px;
    border: 1px solid #dee1e4;
    padding: 0 40px 0 20px;
}

.inline-select .select-box {
    margin-right: 10px;
}

.label-title-block .clicker-toggle {
    right: auto;
    left: -6px;
}

.label-title-block .clicker-toggle:before {
    right: auto;
}

.template-1 .label-title-block .anim-text .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

/* .template-1 .ind-form-field .active .anim-text {
    z-index: 9;
} */
.template-1 .ind-form-field .input-block textarea+.label-title-block .anim-text .info-clicker-wrap {
    top: 2px;
}

.template-1 .ind-form-field .radio-wrapper .label-title-block h5 {
    width: auto;
}

.template-1 .ind-form-field .radio-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 4px;
}

.template-1 .ind-form-field .checkbox-wrapper .label-title-block h5 {
    width: auto;
}

.template-1 .ind-form-field .checkbox-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 4px;
}

.template-1 .ind-form-field .input-block.drop select+.label-title-block .anim-text .info-clicker-wrap {
    top: 0px;
}

.template-1 .input-block.toggle .label-title-block label {
    width: auto;
}

.template-1 .input-block.toggle .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-1 .input-block.date-field .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-1 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-1 .photo-capture-block .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-2 .label-title-block .anim-text .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

.template-2 .ind-form-field .input-block textarea+.label-title-block .anim-text .info-clicker-wrap {
    top: 2px;
}

.template-2 .ind-form-field .radio-wrapper .label-title-block h5 {
    width: auto;
}

.template-2 .ind-form-field .radio-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 4px;
}

.template-2 .ind-form-field .checkbox-wrapper .label-title-block h5 {
    width: auto;
}

.template-2 .ind-form-field .checkbox-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 4px;
}

.template-2 .ind-form-field .input-block.drop select+.label-title-block .anim-text .info-clicker-wrap {
    top: 3px;
}

.template-2 .input-block.toggle .label-title-block label {
    width: auto;
}

.template-2 .input-block.toggle .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

.template-2 .input-block.date-field .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

.template-2 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-2 .photo-capture-block .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

.template-2 .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

.template-2 .feedback-field .label-title-block .field-header {
    width: auto;
}

.template-2 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

.template-2 .ind-form-field .input-block .label-title-block .anim-text {
    z-index: 10;
}

.template-3 .photo-capture-block .label-title-block {
    margin-bottom: 15px;
}

.template-3 .label-title-block .anim-text .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-3 .ind-form-field .anim-text {
    z-index: 9;
}

.template-3 .ind-form-field .input-block textarea+.label-title-block .anim-text .info-clicker-wrap {
    top: 2px;
}

.template-3 .ind-form-field .radio-wrapper .label-title-block h5 {
    width: auto;
}

.template-3 .ind-form-field .radio-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 4px;
}

.template-3 .ind-form-field .checkbox-wrapper .label-title-block h5 {
    width: auto;
}

.template-3 .ind-form-field .checkbox-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 4px;
}

.template-3 .ind-form-field .input-block.drop select+.label-title-block .anim-text .info-clicker-wrap {
    top: 0px;
}

.template-3 .input-block.toggle .label-title-block label {
    width: auto;
}

.template-3 .input-block.toggle .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-3 .input-block.date-field .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-3 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-3 .photo-capture-block .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-4 .label-title-block .anim-text .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-4 .ind-form-field .input-block textarea+.label-title-block .anim-text .info-clicker-wrap {
    top: 6px;
}

.template-4 .ind-form-field .radio-wrapper .label-title-block h5 {
    width: auto;
    font-size: 15px;
}

.template-4 .ind-form-field .radio-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 4px;
}

.template-4 .ind-form-field .checkbox-wrapper .label-title-block h5 {
    width: auto;
    font-size: 15px;
}

.template-4 .ind-form-field .checkbox-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-4 .ind-form-field .autofill h5.autofill-label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-4 .ind-form-field .input-block.drop select+.label-title-block .anim-text .info-clicker-wrap {
    top: 6px;
}

.template-4 .input-block.toggle .label-title-block label {
    width: auto;
    margin-bottom: 0;
}

.template-4 .input-block.toggle .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-4 .input-block.date-field .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-4 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-4 .photo-capture-block .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-4 .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-4 .feedback-field .label-title-block .field-header {
    width: auto;
}

.template-4 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-4 .ind-form-field .input-block .label-title-block .anim-text {
    z-index: 10;
}

.template-4 .input-block.date-field .label-title-block .field-header {
    width: auto;
}

.template-4 .ind-form-field .input-block .label-title-block .field-header {
    width: auto;
    margin-bottom: 0;
}

.template-5 .label-title-block .anim-text .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 11px;
}

.template-5 .ind-form-field .input-block textarea+.label-title-block .anim-text .info-clicker-wrap {
    top: 13px;
}

.template-5 .ind-form-field .radio-wrapper .label-title-block h5 {
    width: auto;
}

.template-5 .ind-form-field .radio-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-5 .ind-form-field .checkbox-wrapper .label-title-block h5 {
    width: auto;
}

.template-5 .ind-form-field .checkbox-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-5 .ind-form-field .input-block.drop select+.label-title-block .anim-text .info-clicker-wrap {
    top: 13px;
}

.template-5 .input-block.toggle .label-title-block label {
    width: auto;
}

.template-5 .input-block.toggle .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-5 .input-block.date-field .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-5 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 1px;
}

.template-5 .photo-capture-block .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-5 .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-5 .feedback-field .label-title-block .field-header {
    width: auto;
}

.template-5 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-5 .ind-form-field .input-block .label-title-block .anim-text {
    z-index: 10;
    margin-bottom: 10px;
}

.template-5 .input-block.date-field .label-title-block .field-header {
    width: auto;
}

.template-6 .label-title-block .anim-text .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-6 .ind-form-field .input-block textarea+.label-title-block .anim-text .info-clicker-wrap {
    top: 6px;
}

.template-6 .ind-form-field .radio-wrapper .label-title-block h5 {
    width: auto;
}

.template-6 .ind-form-field .radio-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-6 .ind-form-field .checkbox-wrapper .label-title-block h5 {
    width: auto;
}

.template-6 .ind-form-field .checkbox-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-6 .ind-form-field .input-block.drop select+.label-title-block .anim-text .info-clicker-wrap {
    top: 6px;
}

.template-6 .input-block.toggle .label-title-block label {
    width: auto;
}

.template-6 .input-block.toggle .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-6 .input-block.date-field .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-6 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 1px;
}

.template-6 .photo-capture-block .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-6 .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-6 .feedback-field .label-title-block .field-header {
    width: auto;
}

.template-6 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 7px;
}

.template-6 .ind-form-field .input-block .label-title-block .anim-text {
    z-index: 10;
}

.template-6 .input-block.date-field .label-title-block .field-header {
    width: auto;
}

.template-7 .label-title-block .anim-text .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .ind-form-field .input-block textarea+.label-title-block .anim-text .info-clicker-wrap {
    top: 13px;
}

.template-7 .ind-form-field .radio-wrapper .label-title-block h5 {
    width: auto;
}

.template-7 .ind-form-field .radio-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .ind-form-field .checkbox-wrapper .label-title-block h5 {
    width: auto;
}

.template-7 .ind-form-field .checkbox-wrapper .label-title-block h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .ind-form-field .input-block.drop select+.label-title-block .anim-text .info-clicker-wrap {
    top: 13px;
}

.template-7 .input-block.toggle .label-title-block label {
    width: auto;
}

.template-7 .input-block.toggle .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .input-block.date-field .label-title-block .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 1px;
}

.template-7 .photo-capture-block .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .feedback-field .label-title-block .field-header {
    width: auto;
}

.template-7 .feedback-field .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-7 .ind-form-field .input-block .label-title-block .anim-text {
    z-index: 10;
    margin-bottom: 10px;
}

.template-7 .input-block.date-field .label-title-block .field-header {
    width: auto;
}

.template-11 .type-form-input>label {
    width: auto;
    display: inline-flex;
}

.template-11 .type-form-input>label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-11 .type-form-radio-container>h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-11 .type-form-checkbox-container>h5 {
    width: auto;
    display: inline-flex;
}

.template-11 .type-form-checkbox-container>h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-11 .type-form-input .field-common.field-req-block .label-title-block label {
    width: auto;
}

.template-11 .type-form-input .field-common.field-req-block .label-title-block label .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.template-11 .type-form-input.rating .label-title-block .field-header .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 5px;
    position: relative;
    top: 6px;
}

.type-form-input .clicker-toggle,
.type-form-radio-container .clicker-toggle,
.type-form-checkbox-container .clicker-toggle {
    right: auto;
    left: -6px;
    bottom: 28px;
}

.type-form-input .clicker-toggle:before,
.type-form-radio-container .clicker-toggle:before,
.type-form-checkbox-container .clicker-toggle:before {
    right: auto;
}

.template-12 .type-question-left>h5 .info-clicker-wrap {
    display: block;
    float: right;
    margin-left: 10px;
    position: relative;
    top: 13px;
}

.template-12 .type-question-left>h5 {
    width: auto;
}

.type-question-left .clicker-toggle {
    right: auto;
    left: -6px;
    bottom: 20px;
}

.type-question-left .clicker-toggle:before {
    right: auto;
}

.wa-chat-reply-btn {
    cursor: pointer;
}

.wa-task-chat-reply {
    float: left;
    width: 100%;
    margin: 15px 0 0 0;
}

.wa-task-chat-reply textarea {
    float: left;
    width: 100%;
    height: 125px;
    border: 1px solid #e3e5e8;
    border-radius: 5px;
    resize: none;
}

.wa-task-btn-block {
    float: left;
    width: 100%;
    margin: 15px 0 0 0;
}

.wa-task-btn-block .general-btn {
    float: right;
    height: 35px;
}

.task-detail-panel-content-area-left .task-chat-container {
    margin: 15px 0 0 0;
}

#bsy-tooltip {
    z-index: 9999;
}

#bsy-tooltip .tooltip-inner {
    background-color: #7eade3 !important;
    font-size: 12px;
    line-height: 14px;
}

#bsy-tooltip .arrow:before {
    border-top-color: #7eade3;
}

.flag-mod .modal-body {
    padding: 0;
}

.flag-mod .modal-body .task-tg.max-250 {
    padding: 20px;
    height: 315px;
}

.float-panel-content-body-inner .profile-entry-body {
    padding: 0;
    margin-bottom: 20px;
}

.float-panel-content-body-inner .each-details-entry {
    background: var(--white);
}

.float-panel-content-body-inner .each-details-entry {
    border-color: #e3e5e9;
}

.float-panel-content-body-inner .each-details-entry .details-entry-right {
    border-color: #e3e5e9;
}

.float-panel-content-body-inner .profile-entry-body .general-btn {
    margin: 10px 0 0;
    height: 35px;
    float: right;
}

.right-btn-wrap nav {
    float: left;
    margin-left: 10px;
    position: relative;
}

.right-btn-wrap .task-ico:before {
    background-position: -467px -279px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top: 5px;
}

.right-btn-wrap .task-ico {
    padding-left: 20px;
    margin-left: 15px;
}

.flag-settings-content ul li .radio-wrap {
    margin: 0;
    padding-right: 20px;
    position: relative;
}

.flag-settings-content ul li .radio-block label:before {
    top: 2px;
}

.flag-settings-content ul li .radio-block input:checked+label:after {
    top: 6px;
}

.each-flag-category {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.each-flag-category h5 {
    color: var(--default-color);
    margin-bottom: 15px;
}

.flag-settings-content ul li .radio-wrap.flag-tag .flag-color {
    top: 4px;
}

.overlay-drop {
    float: left;
    width: 200px;
    background: #fff;
    padding: 10px 0;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    box-shadow: 0 5px 7px 0 rgb(0 0 0 / 15%);
}

.overlay-drop .popover-body .panel-option {
    border: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
    float: left;
    width: 100%;
    position: relative;
    right: 0;
    top: 0;
}

.overlay-drop .popover-body {
    float: left;
    width: 100%;
    padding: 0;
}

.overlay-drop .popover-body .panel-option:before,
.overlay-drop .popover-body .panel-option:after {
    content: none;
}

.form-call-ico:before {
    background-position: -241px -249px;
    width: 14px;
    height: 14px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
}

.float-panel-content-body-inner .profile-entry-body .general-btn {
    margin: 10px 0 0;
    height: 35px;
    float: right;
    border-radius: 15px;
}

.form-call-ico:hover:before {
    background: url("https://d22znjc9y9upyw.cloudfront.net/assets/bsynapse/images/call-ico.svg") no-repeat 0 0;
    width: 14px;
    height: 14px;
    background-size: cover;
}

.each-flag-settings.perisitent {
    padding: 0;
}

.each-flag-settings.perisitent .flag-settings-header {
    margin: 0;
    height: 55px;
    padding: 0 20px;
    display: flex;
    align-items: center;
}

.each-flag-settings.perisitent .flag-settings-content {
    height: 350px;
    padding-bottom: 15px;
}

.flag-settings-content-inner {
    float: left;
    width: 100%;
    padding: 0 20px 20px 20px;
}

.each-flag-category:last-child {
    margin-bottom: 0;
    border-bottom: 0;
    padding-bottom: 0;
}

.each-call-list {
    float: left;
    width: 100%;
    border: 1px solid #e3e5e8;
    padding: 10px;
    color: var(--default-text);
    font-size: 14px;
    border-radius: 5px;
    margin-bottom: 10px;
}

.each-call-list:last-child {
    margin-bottom: 0;
}

.each-call-list p {
    float: left;
    width: 100%;
    margin-bottom: 5px;
}

.each-call-list p:last-child {
    margin-bottom: 0;
}

.grey-txt {
    color: var(--default-grey);
}

.tx-heading {
    float: left;
}

.each-category-filter {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #b6c5ca;
}

.each-category-filter>.category-filter-header {
    float: left;
    width: 100%;
    font-size: 12px !important;
    color: var(--default-text) !important;
    font-weight: 600 !important;
    text-transform: none;
    margin-bottom: 5px;
    display: none;
}

.each-category-filter:last-child {
    margin-bottom: 0;
    border: 0;
    padding-bottom: 0;
}

.quickform-container {
    float: left;
    width: 100%;
    height: 100%;
}

.quickform-left {
    float: left;
    width: 50%;
    height: 100%;
    border-right: 1px solid #e3e5e8;
}

.quickform-right {
    float: left;
    width: 50%;
    height: 100%;
    padding: 20px;
    overflow-y: auto;
}

.quickForm-list {
    float: left;
    width: 100%;
}

.quickform-header {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 20px;
}

.quickform-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 4px;
    font-weight: 600;
}

.quickform-header p {
    float: left;
    width: 100%;
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 20px;
}

.quickform-content {
    float: left;
    width: 100%;
    height: calc(100% - 135px);
    padding: 1px 20px 20px;
    overflow-y: auto;
}

.quickform-footer {
    float: left;
    width: 100%;
    height: 65px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.quickform-footer .error-fdls {
    width: auto;
}

.quickform-content .select-box-container {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.quickform-content .select-box-container .select-chk-block {
    margin-bottom: 20px;
}

.quickform-content .select-chk-block label {
    color: #9698a1;
    font-size: 14px;
}

.quickform-footer .general-btn {
    padding: 0 15px;
    height: 35px;
    box-shadow: none;
}

.set-container.overflow-hidden {
    padding: 0;
    border-top: 1px solid #e3e5e8;
}

.quickform-right .each-flag-settings p {
    word-break: break-word;
}

.quickform-right .clipboard-footer button {
    border-radius: 5px;
    width: auto;
    padding: 0 15px;
}

.quickform-right .each-flag-settings p a {
    color: var(--default-color);
}

.each-category-setting {
    float: left;
    width: 100%;
    padding: 20px;
    background: #fafafa;
    border: 1px solid #e3e5e8;
    border-radius: 5px;
    margin-bottom: 20px;
}

.each-category-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.category-header-right .general-btn {
    height: 30px;
    padding: 0 15px;
    min-width: auto;
    margin-left: 10px;
}

.each-category-header h5 {
    font-weight: 600;
    color: var(--default-color);
}

.category-header-right {
    float: left;
    display: flex;
    align-items: center;
}

.category-header-right .delete-ico:before {
    background-position: -473px -159px;
    width: 10px;
    height: 12px;
    margin: 0;
}

.category-header-right .wf-ed {
    background: transparent;
    border: 0;
    padding: 0;
    width: 20px;
    height: 20px;
}

.category-header-right .delete-ico {
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}

.onHover {
    float: left;
    display: flex;
    transition: .3s ease-out;
    opacity: 0;
    pointer-events: none;
}

.each-category-setting:hover .onHover {
    opacity: 1;
    pointer-events: auto;
}

.flag-list-table .table {
    float: left;
    width: 100%;
    margin: 0;
    table-layout: fixed;
}

.flag-list-table .table thead tr th {
    border-bottom: 1px solid #e3e5e8;
    font-size: 14px;
    font-weight: 600;
    background: var(--white);
}

.flag-list-table .table tbody tr td {
    border-bottom: 1px solid #e3e5e8;
    background: var(--white);
    color: var(--default-grey);
    position: relative;
}

.flag-list-table .table thead tr th:first-child {
    border-left: 1px solid #e3e5e8;
}

.flag-list-table .table thead tr th:last-child {
    border-right: 1px solid #e3e5e8;
}

.flag-list-table .table tbody tr td:first-child {
    border-left: 1px solid #e3e5e8;
}

.flag-list-table .table tbody tr td:last-child {
    border-right: 1px solid #e3e5e8;
}

.flag-list-table .table tbody tr td .flag-options {
    top: 0;
    right: 0;
    position: relative;
    float: left;
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.flag-list-table .table tbody tr:hover td .flag-options {
    opacity: 1;
    pointer-events: auto;
}

.flag-category-header {
    float: left;
    width: 100%;
    position: relative;
}

.flag-category-header .clear-all {
    position: absolute;
    right: 0;
    top: 2px;
}

.flag-category-header h5 {
    padding-right: 46px;
}

.with-card-preview .table.form-preview-table tbody tr td p {
    line-height: normal;
}

.with-card-preview .table.form-preview-table tbody tr td p img {
    float: left;
    width: 100%;
    object-fit: contain;
}

.with-card-preview .table.form-preview-table tbody tr td iframe {
    float: left;
    width: 100% !important;
    height: 250px;
}

.collection-card-left .select-chk-block {
    position: absolute;
    top: 7px;
    left: 0;
    z-index: 1;
}

.with-image .collection-card-left .select-chk-block {
    left: 20px;
    top: 23px;
}

.left-panel .grid-view.with-image .collection-card-image .attachment-list {
    max-width: 100%;
    height: 100%;
}

.left-panel .grid-view.with-image .collection-card-image .attachment-list li {
    width: 100%;
    height: 100%;
    margin: 0;
}

.filter-view .form-detail-panel {
    margin-bottom: 0;
}

.filter-view-panel {
    float: left;
    width: 100%;
    height: 60px;
    background: var(--col-active);
    display: flex;
    align-items: center;
    padding: 0 20px;
    margin-bottom: 20px;
}

.filter-view-panel h5 {
    font-size: 14px;
    color: var(--default-text);
    text-transform: uppercase;
    margin-right: 20px;
    display: none;
}

.filter-view-tab {
    float: left;
}

.filter-view-tab .general-btn {
    height: 35px;
    background: var(--white);
    color: var(--default-color);
    margin-right: 10px;
    box-shadow: none;
    padding: 0 10px;
    border-radius: 3px;
}

.filter-view-tab .general-btn.active {
    background: var(--btn-color);
    color: var(--white);
}

.data-view.field-form.small-no-tab.filter-view .data-holder {
    height: calc(100% - 137px);
}

.data-view.field-form.small-no-tab.filter-view .data-holder.form-set {
    margin-top: 20px;
    height: calc(100% - 77px);
}

.each-sub-section .wf-btn-block button {
    position: relative;
    pointer-events: auto;
    opacity: 1;
}

.each-sub-section .wf-btn-block {
    position: absolute;
    right: 0;
    top: 21px;
}

.each-sub-section:hover .wf-btn-block {
    pointer-events: all;
    opacity: 1;
    pointer-events: auto;
}

.learn-section-body.full-width>div {
    float: left;
    width: 50% !important;
}

.learn-section-body.full-width>div>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.learn-section-body.full-width>div>div .select-chk-block {
    margin-right: 35px;
}

.learn-section-body.full-width>div>div .select-chk-block .control {
    font-size: 16px;
    color: var(--default-grey);
}

.inline-container {
    float: left;
    width: 30%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.inline-container .select-box {
    width: 280px;
}

.tab-wrap-block-right .select-box.filter-set {
    margin-right: 15px;
}

.tab-wrap-block-right .select-box.filter-set select {
    height: 30px;
    padding: 0 35px 0 15px;
}

.right-switch {
    float: left;
    display: flex;
    align-items: center;
    margin-right: 20px;
    flex-shrink: 0;
}

.tab-wrap-block-right.rt-switch {
    float: left;
    display: flex;
    align-items: center;
}

.right-switch>label {
    font-size: 14px;
    margin-right: 10px;
    color: var(--default-grey);
}

.accordian-inner-block .filter-accord .control {
    color: var(--default-grey);
    font-size: 14px;
    line-height: 15px;
}

.accordian-inner-block .filter-accord .card .btn-link {
    color: var(--default-grey);
}

.accordian-inner-block .filter-accord {
    width: 100%;
    margin: 0;
    border: 1px solid #dee1e4;
    padding: 0 20px;
    border-radius: 5px;
    margin-bottom: 15px;
    float: left;
}

.accordian-inner-block .filter-accord .card-body {
    padding: 5px 0;
}

.accordian-inner-block {
    float: left;
    width: 100%;
}

.template-5 .form-input-block-left.cf-field .form-type-input {
    background: transparent;
    padding: 17px 0;
    font-size: 18px;
    font-weight: 300;
    line-height: 23px;
    color: #fff;
}

.section-wrap-box {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.section-wrap-box:last-child {
    margin-bottom: 0;
}

.section-wrap-box .select-chk-block {
    margin-bottom: 0px;
}

.section-wrap-box .select-chk-block .control {
    font-size: 14px;
    color: var(--default-grey);
}

.section-wrap-box .flex-contain-box {
    padding-left: 25px;
    margin-top: 20px;
}

.section-wrap-box .csv-validation.flex-contain-box .each-inp-box {
    margin-bottom: 0;
}

.section-wrap-box .csv-validation.flex-contain-box .each-inp-box .inline-select {
    margin-bottom: 0 !important;
}

.section-wrap-box .radio-wrap {
    margin-bottom: 15px;
}

.post-param-panel {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    position: relative;
}

.custom-auto-complete {
    float: left;
    width: 100%;
    border: 1px solid #dee1e4;
    border-radius: 5px;
    padding: 6px 20px;
    position: relative;
}

.add-multiple-box {
    position: absolute;
    right: -10px;
    bottom: -8px;
}

.ac-text-box {
    float: left;
    width: 100%;
}

.ac-text-box>span {
    float: left;
    font-size: 14px;
    color: var(--default-grey);
    line-height: 26px;
    margin-right: 5px;
}

.ac-text-box input {
    float: left;
    height: 26px;
    font-size: 14px;
    border: transparent;
    padding: 0;
}

.custom-auto-complete .panel-option {
    right: 0;
    top: 36px;
    max-height: 200px;
    overflow-y: auto;
    list-style-type: none;
}

.custom-auto-complete .panel-option li {
    margin-bottom: 0;
}

.custom-auto-complete .panel-option li:before {
    content: none;
}

.custom-auto-complete .panel-option li nav {
    font-size: 14px;
}

.detailed-form-view-right-bottom .button-block .general-btn {
    min-width: auto;
    padding: 0 20px;
    margin-left: 11px;
}

.inline-box {
    float: left;
    width: 100%;
    display: flex;
    position: relative;
}

.inline-box .custom-auto-complete {
    width: calc((100% / 2) - 30px);
    margin-right: 15px;
}

.inline-box .add-multiple-box {
    top: calc(50% - 7.5px);
}

.template-1 .ind-form-field .input-block {
    border-top: 0;
}

.template-1 .ind-form-field .radio-wrapper {
    border-top: 0;
}

.template-1 .ind-form-field .checkbox-wrapper {
    border-top: 0;
}

.template-1 .ind-form-field .input-block:first-child,
.template-1 .ind-form-field .radio-wrapper:first-child,
.template-1 .ind-form-field .checkbox-wrapper:first-child,
.template-1 .ind-form-field .form-header-block.page-title+.input-block {
    border-top: 1px solid #E4E6E9;
}

.template-1 .ind-form-field .fieldset+.input-block,
.template-1 .ind-form-field .fieldset+.radio-wrapper,
.template-1 .ind-form-field .fieldset+.checkbox-wrapper {
    border-top: 1px solid #E4E6E9;
}

.template-3 .modal-body {
    background: #ECF0F1;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td .rc-download {
    position: relative;
    top: 3px;
    margin-left: 8px;
}

.form-version-ico:before {
    background: var(--sprite-two) no-repeat -480px -161px;
    width: 20px;
    height: 20px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.form-version-ico:hover:before {
    background-position: -530px -161px;
}

.print-ico.dropdown-item:before {
    top: 9px;
}

.more-btn {
    background: transparent;
    color: var(--default-color);
    border-color: var(--default-color);
    font-size: 14px;
    display: flex;
    align-items: center;
}

.more-btn:hover {
    background: var(--default-color);
    border-color: var(--default-color);
}

.more-panel {
    float: left;
    width: 200px;
    background: #fff;
    padding: 10px 0;
    border: 1px solid #EAEAEA;
    border-radius: 4px;
    box-shadow: 0 5px 7px 0 rgb(0 0 0 / 15%);
}

.more-panel a {
    color: var(--default-grey);
}

.more-panel a:hover {
    background: #fafafa;
    color: var(--default-color);
}

.more-panel a.dropdown-item.active,
.more-panel a.dropdown-item:active {
    background: #fafafa;
    color: var(--default-color);
}

.more-btn.btn-primary:not(:disabled):not(.disabled).active,
.more-btn.btn-primary:not(:disabled):not(.disabled):active,
.show>.more-btn.btn-primary.dropdown-toggle {
    background: var(--default-color);
    border-color: var(--default-color);
}

.table.form-preview-table.v-align tbody tr th {
    width: 100%;
    border: 0;
    line-height: 24px;
    padding-bottom: 5px;
}

.table.form-preview-table.v-align tbody tr {
    display: flex;
    flex-direction: column;
    border: 0;
}

.table.form-preview-table.v-align tbody tr td {
    padding-top: 0;
    padding-bottom: 12px;
    line-height: 22px;
    width: 100%;
}

.table.form-preview-table.v-align tbody tr td .rate-star {
    margin: 0 0 7px;
}

.table.form-preview-table.v-align tbody tr .template-heading {
    border-bottom: 0;
    margin: 25px 0 15px;
    padding: 0;
}

.collection-card-left .select-chk-block .control-indicator {
    background: rgb(255 255 255 / 12%);
    border: 1px solid rgb(182 197 202 / 40%);
}

.role-tab .nav-tabs .nav-link {
    float: left;
    height: 50px;
    padding: 0 20px;
    background: #ecf0f1;
    font-size: 14px;
    color: #444;
    font-weight: 600;
    border-radius: 0;
    display: flex;
    align-items: center;
}

.role-tab .nav-tabs {
    border-color: #dee2e6;
}

.role-tab .nav-tabs .nav-link.active {
    background: var(--white);
    border-color: #dee2e6;
    border-bottom-color: #fff;
    color: var(--default-color);
}

.form-set .side-tab .role-tab .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    border: 1px solid #dee2e6;
    border-top: 0;
}

.form-set .role-tab .form-table .table tbody tr td:first-child {
    padding-left: 25px;
    font-size: 14px;
}

.form-set .role-tab .form-table .table tbody tr:first-child td {
    border-top: 0;
}

.setting-pane .role-tab .settings-loungue-content {
    height: 100%;
}

.role-tab .scrollable-table table thead tr th:first-child {
    border-left: 0;
}

.role-tab .scrollable-table table thead tr:first-child th {
    border-top: 0;
}

.role-tab .settings-loungue-content .scrollable-table table tr td:first-child {
    border-left: 0;
}

.set-container.role-tab {
    position: relative;
}

.form-set .side-tab .tab-content .tab-pane .tab-pane .tab-wrap-block-right {
    position: absolute;
    right: 20px;
    top: 0;
}

.with-more-option .wa-aside-option-block {
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.with-more-option {
    position: relative;
}

.with-more-option .chat-time-in {
    transition: .3s ease-out;
}

.message-in-box:hover .with-more-option .wa-aside-option-block {
    opacity: 1;
    pointer-events: auto;
}

.message-in-box:hover .with-more-option .chat-time-in {
    margin-right: 23px;
}

.message-in-box .wa-aside-option-menu {
    top: 25px;
}

.message-in-box {
    float: left;
    transition: .3s ease-out;
}

.file-bl-wrap {
    transition: .3s ease-out;
}

.chat-add-opt .message-in-box {
    margin-left: 50px;
    width: calc(100% - 50px);
    position: relative;
}

.chat-add-opt .file-bl-wrap {
    padding-left: 100px;
}

.message-in-box .select-chk-block {
    position: absolute;
    left: -45px;
    top: calc(50% - 2px);
    border-radius: 3px;
}

.message-in-box .select-chk-block .control-indicator {
    width: 20px;
    height: 20px;
    border-radius: 3px;
}

.chat-add-opt .chat-text-area {
    position: relative;
}

.message-in-box .select-chk-block .control-checkbox .control-indicator:after {
    zoom: 1.2;
}

.with-more-option.option-sticky .wa-aside-option-block {
    pointer-events: auto;
    opacity: 1;
}

.with-more-option.option-sticky .chat-time-in {
    margin-right: 23px;
}

.message-in-box:after {
    content: "";
    width: calc(100% + 90px);
    height: 100%;
    background: rgb(204 204 204 / 37%);
    position: absolute;
    left: -70px;
    top: 0;
    opacity: 0;
    transition: .3s ease-out;
    z-index: -1;
}

.message-in-box.selected:after {
    opacity: 1;
}

.v-align .select-chk-block {
    width: 100% !important;
}

.h-align .select-chk-block {
    width: auto !important;
}

.v-align .radio-block {
    width: 100% !important;
}

.h-align .radio-block {
    width: auto !important;
}

.form-table .table.set-permission tbody tr td .select-box {
    min-width: 200px;
}

.alone-page .form-header-block.page-title {
    display: none;
}

.preview-with-tab .left-panel {
    width: calc(100% - 350px);
    margin-right: 30px;
}

.preview-with-tab .right-panel {
    width: 320px;
    position: sticky;
    right: 0;
    top: 0;
}

.preview-tab {
    float: left;
    width: 100%;
    height: calc(100vh - 115px);
    margin-bottom: 30px;
}

.preview-tab .nav-tabs {
    border-radius: 0;
}

.preview-tab .nav-tabs .nav-link {
    border-radius: 5px 5px 0 0;
    height: 45px;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.preview-tab .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 45px);
}

.preview-tab .tab-pane {
    background: var(--white);
    border: 1px solid #e4e6e9;
    border-top: 0;
    padding: 0px;
    border-radius: 0 05px 5px;
}

.preview-tab .tab-pane-inner {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.preview-tab .nav-tabs .nav-item.show .nav-link,
.preview-tab .nav-tabs .nav-link.active {
    color: var(--default-color);
}

.form-table.fixed-header .table tbody tr td.column-word-wrap {
    white-space: normal;
    max-width: none;
    min-width: 450px;
}

.form-table.fixed-header.top-align .table tbody tr td {
    vertical-align: top;
}

.form-table.fixed-header.top-align .table tbody tr td.select-record {
    padding-top: 23px;
}

.form-table.fixed-header.top-align .table tbody tr td.col-star {
    padding-top: 17px;
}

.form-table.fixed-header.top-align .table tbody tr td.col-notes {
    padding-top: 17px;
}

.form-table.fixed-header.top-align .table tbody tr td.col-share {
    padding-top: 15px;
}

.preview-tab .tab-content .sub-block .workflow-task-body-container.padding-0 {
    padding: 0;
}

.preview-tab .tab-content .wf-task-next .nested-sub-block.padding-0 {
    padding: 0;
    margin-top: 20px;
    margin-bottom: 30px;
}

.preview-tab .tab-content .nested-sub-block .textarea {
    height: 150px;
    margin-bottom: 0;
}

.preview-tab .tab-content .nested-sub-block .input-block {
    margin-bottom: 15px;
}

.preview-tab .tab-content .wf-task-next .select-lister.rejection-lister li {
    margin-bottom: 20px;
    margin-right: 0;
    width: 100%;
}

.preview-tab .tab-content .wf-task-next .select-lister.rejection-lister li:last-child {
    margin-bottom: 0;
}

.form-schedule-ico:before {
    background-position: -501px -446px;
    width: 22px;
    height: 22px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.form-schedule-ico:hover:before {
    background-position: -501px -422px;
}

.inline-capture .photo-capture-wrapper {
    height: 472px;
    padding-bottom: 72px;
}

.inline-capture .photo-capture-wrapper .capture-mode-1 {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.inline-capture .photo-capture-wrapper .photo-capture-cam video {
    height: 100% !important;
    object-fit: cover;
    border-radius: 5px 5px 0 0;
    border: 0 !important;
}

.inline-capture .photo-capture-wrapper .shot-preview-button-block {
    float: left;
    width: 100%;
    height: 72px;
    padding: 8px 20px;
    background: var(--theme-second);
    border-radius: 0 0 5px 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    left: 0;
    bottom: -72px;
}

.inline-capture .photo-capture-wrapper .capture-mode-1 .close {
    position: absolute;
    right: 20px;
    top: 20px;
    padding: 9px;
    background: #ffffffb0;
    border-radius: 50%;
    zoom: .7;
    z-index: 1;
}

.inline-capture .image-container {
    max-width: 100%;
    height: 456px;
}

.inline-capture .image-container img {
    height: 100%;
    object-fit: cover;
}

.inline-capture .shot-preview-button-block .general-btn {
    background: rgba(255, 255, 255, .1);
    box-shadow: none;
    font-weight: 400;
    padding: 0;
    border-radius: 30px;
}

.inline-capture .shot-preview-button-block .general-btn.grey {
    color: #fff;
}

.inline-capture .photo-capture-cam canvas {
    height: 100% !important;
    object-fit: cover;
}

.inline-capture .photo-capture-btn {
    position: absolute;
    left: 0;
    top: 0;
}

.template-4 .ind-form-field .input-block.autofill.mandatory-box .ind-task-input.selectize-custom {
    border-color: #e14745;
}

.phonenumber .phone-number-field {
    float: left;
    width: 100%;
    display: flex;
    order: 1;
}

.phone-number-field .select-box {
    width: 115px;
}

.phone-number-field .select-box select {
    height: 50px;
    border-radius: 5px 0 0 5px;
    border-right: 0;
    font-size: 16px;
    font-weight: 600;
}

.phone-number-field .fiels-inp-box {
    border-radius: 0 5px 5px 0 !important;
}

.template-1 .phone-number-field .select-box select {
    height: 67px;
    border: 0;
    border-right: 1px solid #e4e5e9;
}

.template-1 .ind-form-field .phonenumber .anim-text {
    left: 122px;
}

.template-1 .phonenumber.active .anim-text {
    top: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.template-3 .phone-number-field .select-box select {
    height: 67px;
    border: 0;
    padding-left: 0;
}

.template-3 .ind-form-field .phonenumber .anim-text {
    left: 122px;
}

.template-3 .phonenumber.active .anim-text {
    top: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.template-3 .phone-number-field .fiels-inp-box {
    padding: 0 20px;
}

.template-5 .phone-number-field .select-box select {
    height: 70px;
    background: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    padding: 0;
    color: var(--white);
}

.template-5 .phone-number-field .fiels-inp-box {
    padding-left: 20px;
    border-radius: 0 !important;
}

.template-6 .phone-number-field .select-box select {
    height: 45px;
    font-size: 14px;
    background: #ffffff;
    border: 1px solid #e7e7e7;
    border-right: 0;
    color: #005AA1;
    border-radius: 0;
}

.template-7 .phone-number-field .select-box select {
    height: 70px;
    background: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid rgb(196 198 201);
    padding: 0;
    color: #262626;
}

.template-7 .phone-number-field .fiels-inp-box {
    padding-left: 20px !important;
    border-radius: 0 !important;
}

.template-11 .phone-number-field .select-box,
.template-12 .phone-number-field .select-box {
    width: 135px;
}

.template-11 .phone-number-field .select-box select,
.template-12 .phone-number-field .select-box select {
    height: 45px;
    border: 1px solid transparent;
    transition: .3s ease-out;
}

.template-11 .phone-number-field .select-box select:focus,
.template-12 .phone-number-field .select-box select:focus {
    border-color: #FFC7AF;
}

.template-11 .phone-number-field .fiels-inp-box,
.template-12 .phone-number-field .fiels-inp-box {
    float: left;
    width: 100%;
    height: 45px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
}

.template-11 .phone-number-field .fiels-inp-box:focus,
.template-12 .phone-number-field .fiels-inp-box:focus {
    border-color: #FFC7AF;
}

.template-13 .phone-number-field .select-box select,
.template-14 .phone-number-field .select-box select,
.template-16 .phone-number-field .select-box select {
    height: 67px;
    border: 0;
    border-right: 1px solid #e4e5e9;
}

.template-13 .ind-form-field .phonenumber .anim-text,
.template-14 .ind-form-field .phonenumber .anim-text,
.template-16 .ind-form-field .phonenumber .anim-text {
    left: 122px;
}

.template-13 .phonenumber.active .anim-text,
.template-14 .phonenumber.active .anim-text,
.template-16 .phonenumber.active .anim-text {
    top: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.form-api-ico:before {
    background-position: -89px -427px;
    width: 18px;
    height: 16px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 8px);
}

.form-api-ico:hover:before {
    background-position: -199px -427px;
}

.flag-options.non-hover {
    opacity: 1;
    pointer-events: auto;
}

.flag-options.non-hover .opt-form-ico {
    top: 0;
    right: 0;
}

.flag-options.non-hover .panel-option {
    right: -13px;
}

.template-body .form-table {
    max-width: calc(100vw - 237px);
}

.summary-panel-settings {
    float: left;
    width: 100%;
    height: 70px;
}

.summary-panel-settings .propogation-row {
    border-top: 1px solid #e4e5e9;
}

.summary-panel-settings .ind-prop-list .each-inp-box {
    width: 100%;
    margin: 0;
}

.summary-fields-content {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    padding: 20px;
    overflow-y: auto;
}

.summary-data {
    display: flex;
    align-items: center;
}

.summary-data input {
    margin-right: 10px;
    border: 1px solid #e4e5e9;
    padding: 0 15px;
    font-size: 14px;
    height: 35px;
    line-height: 35px;
    border-radius: 3px;
}

.summary-data .select-box {
    margin-left: 10px;
}

.summary-data .select-box select {
    height: 35px;
    min-width: 150px;
    padding: 0 15px;
    padding-right: 35px;
}

.wf-task-next .select-lister.collection-record-approve li .radio-block input {
    height: 33px;
}

.wf-task-next .select-lister.collection-record-approve li .radio-block label {
    height: 32px;
    font-size: 14px;
    padding: 0 20px;
}

.wf-task-next .select-lister.collection-record-approve li .radio-block {
    height: 35px;
}

.preview-tab .tab-content .wf-task-next .select-lister.collection-record-approve li {
    width: auto;
    margin-right: 10px;
    margin-bottom: 10px;
}

.select-lister.collection-record-approve {
    margin-bottom: 10px;
}

.template-4 .ind-form-field .input-block .label-title-block {
    order: 0;
    margin-bottom: 5px;
}

.template-4 .ind-form-field .input-block .label-title-block .anim-text {
    margin-bottom: 0;
}

.template-4 .ind-form-field .radio-wrapper h5,
.template-4 .ind-form-field .checkbox-wrapper h5 {
    margin-bottom: 0;
}

.template-4 .ind-form-field .checkbox-wrapper .label-title-block {
    margin-bottom: 10px;
}

.template-4 .ind-form-field .radio-wrapper .label-title-block {
    margin-bottom: 10px;
}

.stage-block {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.stage-block h5 {
    font-size: 16px;
    color: var(--default-color);
    font-weight: 600;
}

.height-100 {
    height: 100%;
}

.summary-card-tab {
    float: left;
    width: 100%;
    height: 100%;
}

.summary-card-tab .nav-tabs {
    height: 40px;
    border-bottom: 2px solid #f1f1f1;
}

.summary-card-tab .nav-tabs .nav-link {
    height: 40px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0;
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 600;
}

.summary-card-tab .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 40px);
    background: var(--white);
    /* border: 1px solid #e3e5e8; */
    border-top: 0;
}

.summary-card-tab .nav-tabs .nav-item.show .nav-link,
.summary-card-tab .nav-tabs .nav-link.active {
    color: var(--black);
    border-bottom: 2px solid #000 !important;
}

.summary-card-tab .tab-content>.tab-pane {
    float: left;
    width: 100%;
    height: 100%;
}

.summary-card-tab .profile-entry-body {
    margin-bottom: 15px;
    position: relative;
}

.summary-card-tab .profile-entry-body .each-details-entry {
    margin-bottom: 0;
}

.summary-card-tab-inner {
    float: left;
    width: 100%;
    /* height: 100%; */
    padding: 30px 0px;
}

.summary-card-tab .persitant-top {
    padding: 30px 20px;
}

.summary-card-tab .quill {
    border: 1px solid #dee1e4;
    border-radius: 5px;
}

.summary-card-tab .ind-task-input.rich-area {
    height: auto;
    margin-bottom: 15px;
}

.summary-card-tab .ind-task-input.rich-area .lb-tx {
    top: 5px;
}

.summary-card-tab .each-inp-box {
    width: 100%;
}

.summary-card-tab .expandable-textarea .ql-container.ql-snow {
    border-color: #dee1e4;
}

.summary-card-tab .input-block.expandable-textarea textarea {
    padding: 10px 15px 15px 15px;
    border: 1px solid #dee1e4;
    height: 300px;
}

.summary-card-tab .tag-right {
    max-width: 100%;
    padding-left: 7px;
}

.summary-switching {
    float: left;
    width: 100%;
    height: 60px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e4e5e9;
}

.summary-switching .radio-wrapper .radio-block {
    margin-right: 15px;
}

.summary-switching .radio-wrapper {
    margin: 0;
    width: auto;
}

.summary-switching .radio-wrapper .radio-block label {
    font-size: 14px;
    color: var(--default-grey)
}

.summary-switching .radio-block label:before {
    top: 1px;
}

.summary-switching .radio-block input:checked+label:after {
    top: 5px;
}

.summary-switching .select-box {
    width: 285px;
}

.with-summary-switch .summary-fields-content {
    height: calc(100% - 130px);
}

.summary-fields-content div[data-react-beautiful-dnd-droppable="0"] {
    float: left;
    width: 100%;
    height: auto !important;
    /* margin-bottom: 20px; */
}

.summary-field-category {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.summary-field-category h5 {
    font-size: 14px;
    font-weight: 600;
    color: var(--default-color);
}

.summary-field-content {
    float: left;
    width: 100%;
}

.each-sub-section p {
    font-size: 14px;
}

.taskdescsection .mentions__control .mentions__input {
    background: var(--white) !important;
    border-radius: 5px;
    font-size: 14px !important;
    padding: 0 15px;
}

.taskdescsection .mentions.mentions--singleLine {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.taskdescsection .mentions__control textarea.mentions__input {
    height: 200px !important;
    margin-bottom: 20px !important;
    float: left;
    width: 100% !important;
}

.taskdescsection .mentions__suggestions {
    width: 185px;
    border-radius: 5px;
    box-shadow: 0 0 6px 1px rgb(0 0 0 / 18%);
    overflow: hidden;
}

.taskdescsection .mentions__suggestions__item {
    float: left;
    width: 100%;
    height: 35px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    color: var(--default-grey);
}

.taskdescsection .mentions__suggestions__item:hover,
.taskdescsection .mentions__suggestions__item--focused {
    background: #FAFAFA;
    color: var(--default-color);
}

.mention-textarea .mentions__suggestions {
    width: 185px;
    border-radius: 5px;
    box-shadow: 0 0 6px 1px rgb(0 0 0 / 18%);
    overflow: hidden;
}

.mention-textarea .mentions__suggestions__item {
    float: left;
    width: 100%;
    height: 35px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    color: var(--default-grey);
}

.mention-textarea .mentions__suggestions__item:hover,
.mention-textarea .mentions__suggestions__item--focused {
    background: #FAFAFA;
    color: var(--default-color);
}

.each-sepration {
    float: left;
    width: 100%;
    padding: 20px;
    border: 1px dashed #d7d7d7;
    margin-bottom: 20px;
    background: #FAFAFA;
}

.summary-field-category {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.each-summary-drop {
    display: inline-block;
    width: 100%;
    margin-bottom: 20px;
    padding: 20px;
    border: 1px dashed #ccc;
    background: var(--col-active);
}

.each-summary-drop:hover>.summary-field-category>.wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.each-sepration:hover .summary-field-category .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.clear-field:before {
    background-position: -348px -365px;
    width: 9px;
    height: 10px;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td p em {
    font-style: italic;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td ol {
    float: left;
    width: 100%;
    list-style-type: decimal;
    padding-left: 15px;
    margin: 0 0 20px 0;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td ol li {
    font-size: 14px;
    color: var(--default-grey);
    margin-bottom: 5px;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td ol li:last-child {
    margin-bottom: 0;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td p {
    margin-bottom: 20px;
    float: none;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td p br {
    display: none;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td ul {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    list-style: disc;
    padding-left: 20px;
    color: var(--default-grey);
}

.read-or-hide {
    color: var(--default-grey) !important;
    font-weight: 600;
}

.col-setting-ico:before {
    background-position: -128px -466px;
    width: 16px;
    height: 16px;
}

.col-calendar-ico:before {
    background-position: -220px -156px;
    width: 15px;
    height: 16px;
}

.col-setting-ico,
.col-calendar-ico {
    display: flex;
    align-items: center;
}

.rich-selectize .ind-task-input {
    height: auto;
    min-height: 30px;
}

.rich-selectize .tag-wrapper-bl input {
    margin-bottom: 5px;
}

.rich-selectize .ind-task-input .lb-tx {
    top: 5px;
}

.rich-selectize {
    margin-bottom: 15px;
}

.user-table.drag-table {
    border: 1px solid #e3e5e8;
}

.drag-table .user-tr:last-child .user-td {
    border-bottom: 0;
}

.drag-table .user-tr .user-td {
    background: var(--white);
}

.drag-table .user-th {
    background: var(--white);
}

.drag-table .user-tr {
    float: none;
}

.auto-height {
    height: auto !important;
}

.auto-height .each-category-setting {
    float: none;
    display: inline-block;
}

.ac-text-box.email-sub input {
    background: var(--white) !important;
    border-radius: 5px;
    font-size: 14px !important;
    height: 40px;
    border: 1px solid #dee1e4;
    padding: 0 15px;
}

.drag-table .user-tr .user-td {
    height: auto;
    min-height: 40px;
    align-items: normal;
    padding: 12px 20px;
    line-height: normal;
}

.drag-table .user-tr {
    align-items: normal;
}

.collection-meta-note {
    float: left;
    width: 100%;
    background: var(--white);
    height: 200px;
    border-radius: 5px;
    overflow: hidden;
}

.collection-meta-note textarea {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    resize: none;
    padding: 15px;
}

.modal-header-right.align-right-option .collection-chat {
    margin: 0;
}

.modal-header-right.align-right-option .collection-note {
    float: left;
    width: auto;
    height: 35px;
    padding: 0 20px;
    margin-left: 14px;
    background: #fff;
    border: 1px solid var(--default-color);
    border-radius: 3px;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    margin-right: 15px;
}

.modal-header-right.align-right-option .collection-note:before {
    content: "";
    background: var(--sprite-two) no-repeat -6px -384px;
    width: 20px;
    height: 17px;
    zoom: .8;
}

.modal-header-right.align-right-option .collection-chat:hover {
    background: transparent;
}

.modal-header-right.align-right-option .collection-chat:hover:before {
    background: var(--sprite-two) no-repeat -311px -364px;
    width: 14px;
    height: 14px;
    zoom: 0;
}

.collection-headers {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.collection-headers h5 {
    font-size: 14px;
    color: var(--default-grey);
    font-weight: 600;
}

.collection-headers .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.iframe-wrap {
    float: left;
    width: 100%;
    height: 100%;
}

.iframe-wrap .close:before {
    content: "";
    background: var(--sprite-one) no-repeat -252px -333px;
    width: 17px;
    height: 16px;
    display: inline-block;
}

.iframe-wrap .close {
    opacity: 1;
    position: absolute;
    right: 20px;
    top: 20px;
    background: #0000000d;
    padding: 10px;
    border-radius: 50%;
    margin: 0;
    line-height: 0;
    cursor: pointer !important;
}

.summary-field-category-right {
    justify-content: flex-end;
    display: flex;
    align-items: center;
}

.summary-field-category-right .radio-wrapper {
    display: flex;
    align-items: center;
    margin: 0 10px 0 0;
    width: auto;
}

.summary-field-category-right .radio-wrapper .radio-block {
    width: auto;
    margin-right: 10px;
    flex-shrink: 0;
}

.summary-field-category-right .select-box {
    width: 250px;
}

.profile-entry-body .collection-headers {
    width: auto;
    position: absolute;
    right: 14px;
    bottom: 0;
    zoom: .8;
}

.profile-entry-body .details-entry-right input {
    border-radius: 0;
    padding: 0 10px;
}

.profile-entry-body .details-entry-right:last-child input {
    border-radius: 0 3px 3px 0;
    padding: 0 24px 0 18px;
}

.form-table.fixed-header .table tbody tr td.col-setting,
.form-table.fixed-header .table tbody tr td.col-calendar {
    width: 1%;
}

.each-inp-box .radio-wrap {
    margin: 0;
    margin-top: 10px;
}

.growth-content-body .form-table .table.entity-dashboard-table tbody tr td {
    font-size: 14px;
    color: var(--default-grey);
}

/* .category-tag {
    width: auto !important;
    font-size: 12px !important;
    text-transform: uppercase;
    background: var(--default-color);
    padding: 0 6px;
    margin-top: 8px;
    border-radius: 4px;
    color: var(--white) !important;
} */
.category-tag {
    width: auto !important;
    font-size: 12px !important;
    margin-top: 5px;
    border-radius: 2px;
    color: var(--default-grey) !important;
}

.quick-form .radio-wrapper .radio-block {
    width: 100%;
}

.invoke-ico:before {
    background-position: -192px -405px;
    width: 16px;
    height: 18px;
    position: absolute;
    top: calc(50% - 9px);
    left: 20px;
}

.invoke-ico:hover:before {
    background-position: -192px -427px;
}

.ml-15 {
    margin-left: 15px !important;
}

/* .list-view .collection-card-left {
    background: #fafafa;
} */
.ijsc .template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload {
    min-height: 40px;
}

.ijsc .template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload label {
    line-height: 40px;
}

.ijsc .template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    padding: 2.5px 15px 2.5px;
    flex-direction: column;
    align-items: flex-start;
    height: auto;
}

.ijsc .template-2 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 14px;
    position: relative;
    left: 0;
    top: 0;
}

.ijsc .template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload {
    min-height: 40px;
}

.ijsc .template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload label {
    line-height: 40px;
}

.ijsc .template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    padding: 2.5px 15px 2.5px;
    flex-direction: column;
    align-items: flex-start;
    height: auto;
}

.ijsc .template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 14px;
    position: relative;
    left: 0;
    top: 0;
}

.ijsc .template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload {
    min-height: 40px;
}

.ijsc .template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload label {
    line-height: 40px;
}

.ijsc .template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    padding: 0;
    flex-direction: column;
    align-items: flex-start;
    height: auto;
}

.ijsc .template-5 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 14px;
    position: relative;
    left: 0;
    top: 0;
}

.ijsc .template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .attached-file {
    margin-bottom: 5px;
    margin-top: 10px;
}

.ijsc .template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload {
    min-height: 40px;
}

.ijsc .template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-upload label {
    line-height: 40px;
}

.ijsc .template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
    padding: 0;
    flex-direction: column;
    align-items: flex-start;
    height: auto;
}

.ijsc .template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .file-tag {
    font-size: 14px;
    position: relative;
    left: 0;
    top: 0;
}

.ijsc .template-7 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line .attached-file {
    margin-bottom: 5px;
    margin-top: 10px;
}

.template-2 .ind-form-field.fieldset.flex-box .style-view .input-block,
.template-4 .ind-form-field.fieldset.flex-box .style-view .input-block,
.template-5 .ind-form-field.fieldset.flex-box .style-view .input-block,
.template-6 .ind-form-field.fieldset.flex-box .style-view .input-block,
.template-7 .ind-form-field.fieldset.flex-box .style-view .input-block {
    justify-content: flex-start;
}

.ijsc .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 70px;
}

.panel-option-click.infos:before {
    top: calc(50% - 8.5px);
}

.drop-chat-ico:before {
    content: "";
    background: var(--sprite-one) no-repeat -376px -126px;
    width: 14px;
    height: 14px;
    zoom: 1.3;
    position: absolute;
    left: 16px;
    top: calc(50% - 7px);
}

.drop-chat-ico:hover:before {
    background: var(--sprite-two) no-repeat -311px -364px;
}

.show-sm {
    display: none;
}

.template-4 .ind-form-field .checkbox-wrapper.h-align,
.template-4 .ind-form-field .radio-wrapper.h-align {
    flex-direction: initial;
}

.ind-form-field.fieldset.flex-box .style-view .input-block:last-child {
    margin-bottom: 20px;
}

.template-4 .ind-form-field .field-set .autofill h5.autofill-label {
    margin-bottom: 0;
}

.template-1 .ind-form-field.fieldset.flex-box .style-view .input-block:last-child {
    margin-bottom: 0;
}

.ssmetals .ind-form-field.fieldset.flex-box .style-view .input-block.autofill .select-drop li {
    height: auto;
}

.ssmetals .ind-form-field.fieldset.flex-box .style-view .input-block.autofill .select-drop li .select-drop-click {
    padding: 10px 18px;
}

.ssmetals .ind-form-field.fieldset.flex-box .style-view .input-block.autofill .select-drop li .select-drop-click h5 {
    display: block;
    max-width: 100%;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    color: var(--default-color);
}

.ssmetals .ind-form-field.fieldset.flex-box .style-view .input-block.autofill .select-drop li .select-drop-click p {
    font-size: 14px;
}

.ssmetals .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 90px;
}

.ssmetals .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .select-drop-click-right {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
}

.quick-form .ind-form-field.fieldset.flex-box .style-view .input-block.autofill .select-drop li {
    height: auto;
}

.quick-form .ind-form-field.fieldset.flex-box .style-view .input-block.autofill .select-drop li .select-drop-click {
    padding: 10px 18px;
}

.quick-form .ind-form-field.fieldset.flex-box .style-view .input-block.autofill .select-drop li .select-drop-click h5 {
    display: block;
    max-width: 100%;
    font-size: 16px;
    line-height: normal;
    color: var(--default-color);
}

.quick-form .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .select-drop-click-right p {
    font-size: 14px;
}

.quick-form .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
    min-width: 90px;
}

.quick-form .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .select-drop-click-right {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
}

.filter-tag-block-left.inline-filter {
    padding: 0;
}

.one-line-stretch .inline-filter .filter-tag-block-right {
    float: left;
    position: relative;
    right: 0;
    top: 0;
}

.inline-filter .filter-tag-block-right .clear-all {
    border-color: #357bb7;
    color: #357bb7;
}

.entity-preview-record .entity-preview-wrapper {
    height: auto;
    display: flex;
}

.usr-profile .modal-header .right-panel-group-each>h5 {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12.52px;
    font-weight: 400;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 5px;
    padding: 0;
}

.usr-profile .modal-header .chat-user-info h5 {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    margin-right: 8px;
    padding: 0;
}

.usr-profile .modal-header .chat-user-message h5 {
    float: left;
    width: 100%;
    color: #000;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    padding: 0;
}

.usr-profile .modal-header .reciever .chat-user-message h5 {
    color: var(--white);
}

.usr-profile .modal-header .attachment-block-right h5 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 7px;
    line-height: normal;
    color: var(--default-text);
    display: block;
    max-width: 100%;
    word-break: break-word;
    padding: 0;
}

.usr-profile .modal-header .task-toggler-header .task-head-text {
    color: #fff;
    float: left;
    font-size: 16px;
    font-weight: 300;
    padding: 0;
}

.usr-profile .modal-header .dynamic-creation .persitant-footer .general-btn {
    margin: 0;
    min-width: auto;
    font-size: 14px;
    zoom: 1;
}

.usr-profile .modal-header .grey-bg-panel .float-panel-header .subheader {
    padding: 0;
}

.usr-profile .modal-header .select-drop-click-right h5 {
    float: left;
    color: #6b7577;
    font-size: 13px;
    font-weight: 600;
    line-height: 14px;
    margin-right: 10px;
    padding: 0;
}

.usr-profile .modal-header .ind-attach-list h5 {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 90%;
    font-size: 13px;
    line-height: 17px;
    color: var(--default-grey);
    font-weight: 600;
    padding: 0;
}

.usr-profile .modal-header .bsy-modal .modal-header {
    border-radius: 0;
    height: 50px;
    align-items: center;
    border-bottom: 1px solid #e3e3e3;
    background: var(--theme-second);
    border-radius: 5px 5px 0 0;
    float: left;
    width: 100%;
    padding: 0 15px;
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.usr-profile .modal-header .bsy-modal .modal-header .task-head-text,
.usr-profile .modal-header .bsy-modal .modal-header .modal-title {
    padding: 0;
    color: #fff;
    float: left;
    font-size: 16px;
    font-weight: 400;
}

.usr-profile .modal-header .schedule-modal .modal-sm {
    max-width: 420px;
    margin: 0 auto;
    height: auto;
}

.usr-profile .modal-header .bsy-modal .modal-footer .general-btn.grey {
    background: #ecf0f1;
    border: 1px solid #e2e2e2;
    color: var(--default-text);
}

.usr-profile .modal-header .section-info h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    margin-bottom: 5px;
    color: var(--default-text);
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 90%;
    transition: .4s ease-out;
    padding: 0;
}

.usr-profile .modal-header .bsy-modal .modal-body {
    padding: 1rem;
    overflow-y: auto
}

.usr-profile .modal-header .schedule-modal .modal-content,
.usr-profile .modal-header .schedule-modal .modal-body {
    background-color: #FFF;
    border-radius: 6px;
    padding: 0;
    overflow: unset !important;
}

.usr-profile .modal-header .modal-content {
    height: auto;
    border-radius: 6px;
}

.usr-profile .modal-header .modal-body.padding-zero {
    padding: 0;
}

.usr-profile .modal-header .bsy-modal .modal-footer .general-btn {
    font-size: 14px;
    min-width: auto;
    zoom: 1;
}

.full-wid-mod .collection-clik-panel .discuss-inner.note-tab {
    height: calc(100vh - 131px);
}

.usr-profile .modal-header .bsy-modal .modal-body.small-height.modal-body-heighted {
    height: 200px;
    background: white;
}

.usr-profile .modal-header .modal-dialog {
    max-width: 500px;
    margin: 0 auto;
    height: auto;
}

.usr-profile .modal-header .modal-dialog.modal-lg {
    max-width: 800px;
}

.spv-article-content .growth-collection-record-header {
    flex-direction: column !important;
}

.spv-article-content .growth-record-image {
    width: 100% !important;
    height: 145px !important;
    margin-right: 0 !important;
    margin-bottom: 13px !important;
}

.growth-collection-record-header h5 {
    font-weight: 400 !important;
    font-size: 16px !important;
}

.without-filter .form-table {
    max-width: calc(100vw - 71px) !important;
}

.template-body .radio-container .radio-block label {
    color: var(--default-grey)
}

.version-modal .radio-wrapper.createdatefilter .radio-block label {
    color: var(--default-grey);
    font-weight: 200;
}

.container-split-left .radio-block label,
.container-split-right .radio-block label {
    color: var(--default-grey);
}

.setting-pane .settings-loungue-content .radio-block label {
    color: var(--default-grey);
    line-height: 20px;
}

.propogation-footer .general-btn {
    box-shadow: none;
}

.resource-filter-modal-body.collection-calendar-mod .ind-panel-options label {
    font-size: 13px;
    margin-bottom: 5px;
}

.mang-lbl-block .radio-block label {
    color: var(--default-grey);
}

.set-container .chart-settings-splitter .each-settings-panel-wrap {
    box-shadow: none;
    border: 1px solid #e4e5e9;
    border-radius: 0;
}

.set-container .chart-settings-splitter .each-inp-field label {
    color: var(--default-grey);
}

.set-container .each-settings-panel-wrap-header .each-settings-panel-header {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--default-text);
}

.entity-preview .entity-preview-wrapper {
    display: flex;
}

.width-100 {
    display: block;
    width: 100%;
    min-height: 16px;
}

.list-view .ind-collection-card .select-chk-block {
    position: absolute;
    right: 0;
    bottom: 25px;
}

/*------ Collection Details End ------*/

/*------ Forms ------*/

.form-btn.form-build {
    float: left;
    height: 30px;
    color: #fff;
    height: 30px;
    border: 1px solid #fff;
    border-radius: 5px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    display: flex;
    align-items: center;
    padding: 0 20px;
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.20);
    background: var(--default-color);
    cursor: pointer;
    transition: .4s ease-out;
    position: absolute;
    top: calc(50% - 15px);
    z-index: 3;
}

.form-btn.form-build:hover {
    background: var(--hover-color);
}


/*------ Forms End ------*/

/*------ Forms Details ------*/

.flds:before {
    content: "";
    background: var(--sprite-one) no-repeat -7px -426px;
    width: 19px;
    height: 18px;
    display: inline-block;
    margin-right: 10px;
    color: black;
}

.usrs:before {
    content: "";
    background: var(--sprite-one) no-repeat -34px -428px;
    width: 21px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    color: black;
}

.apps:before {
    content: "";
    background: var(--sprite-one) no-repeat -65px -428px;
    width: 15px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    color: black;
}

.api:before {
    content: "";
    background: var(--sprite-one) no-repeat -89px -427px;
    width: 18px;
    height: 16px;
    display: inline-block;
    margin-right: 10px;
    color: black;
}

.builder:before {
    content: "";
    background: var(--sprite-one) no-repeat -41px -327px;
    width: 19px;
    height: 20px;
    display: inline-block;
    margin-right: 10px;
}

.rules:before {
    content: "";
    background: var(--sprite-two) no-repeat -339px -163px;
    width: 15px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    color: black;
}

.flds.active:before,
.flds:hover:before {
    background-position: -117px -426px;
}

.usrs.active:before,
.usrs:hover:before {
    background-position: -144px -428px;
}

.api.active:before,
.api:hover:before {
    background-position: -199px -427px;
}

.apps.active:before,
.apps:hover:before {
    background-position: -175px -428px;
}

.builder.active:before,
.builder:hover:before {
    background-position: -99px -327px;
}

.rules.active:before,
.rules:hover:before {
    background-position: -339px -184px;
}

.data-holder-left {
    float: left;
    width: 200px;
    height: 100%;
    margin-right: 20px;
}

.data-holder-right {
    float: left;
    width: calc(100% - 220px);
    height: 100%;
}

.data-holder-left .label-menu-right-block.filter-top {
    margin: 0;
    padding: 0;
    padding-right: 20px;
}

.data-holder-left .label-menu-right-block h5 {
    font-size: 16px;
    font-weight: 500;
    color: #B1BECD;
    line-height: 19px;
}

.data-holder-left .filter-accord .card .btn-link {
    color: var(--default-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
}

.data-holder-left .filter-accord .card-body {
    padding: 0;
    padding-bottom: 21px;
}

.data-holder-left .filter-accord .select-chk-block {
    margin-bottom: 0;
}

.data-holder-left .filter-accord .control {
    color: var(--default-text);
    font-size: 12px;
    line-height: 21px;
    margin-bottom: 0;
    padding-left: 19px;
}

.data-holder-left .control-checkbox .control-indicator:after {
    background-position: -9px -360px;
    width: 8px;
    height: 6px;
    left: calc(50% - 4px);
    top: 3px;
}

.data-holder-left .label-menu-right-block .control-indicator {
    background: #fff;
    border: 1px solid #b6c5ca;
}

.data-holder-filter-wrap {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.data-holder-filter-left {
    float: left;
}

.search-text {
    color: #222330;
    font-size: 14px;
    font-weight: 500;
    line-height: 19px;
}

.data-holder-filter-right {
    float: left;
    display: flex;
    width: 50%;
    justify-content: flex-end;
}

.data-search-box {
    float: left;
    width: calc(100% - 260px);
    height: 40px;
    position: relative;
}

.data-search {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 2px;
    padding: 0 20px 0 43px;
    font-size: 14px;
}

.data-search-box .search-ico {
    float: left;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 20px;
    top: calc(50% - 8px);
}

.search-ico:before {
    background-position: -402px -70px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top: calc(50% - 7px);
}

.data-search-button .general-btn {
    background: #16517F;
    border-color: #16517F;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    padding: 0 20px;
    display: flex;
    align-items: center;
    float: left;
    margin-left: 15px;
}

.data-search-button .coll-assign-ico {
    border-color: #0f9d58;
    background: #fff;
    color: #0f9d58;
    box-shadow: none;
    transition: none;
}

.coll-assign-ico:before {
    background: var(--sprite-one) no-repeat -479px -253px;
    width: 14px;
    height: 12px;
    margin-right: 10px;
}

.coll-assign-ico:hover:before {
    background: var(--sprite-one) no-repeat -498px -253px;
}

.data-search-button .coll-assign-ico:hover {
    border-color: #0f9d58;
    background: #0f9d58;
    color: #fff;
}

.data-search-button .general-btn.delete-ico {
    background-color: #E14745;
    border-color: #E14745;
}

.delete-ico:before {
    background-position: -279px -333px;
    width: 13px;
    height: 15px;
    margin-right: 8px;
    position: relative;
    top: -1px;
}

.export-ico:before {
    content: "";
    width: 21px;
    height: 20px;
    background: url(images/excel.png) no-repeat;
    display: inline-block;
    vertical-align: middle;
    margin-right: 13px;
    position: relative;
    top: -2px;
}

.form-table {
    float: left;
    width: 100%;
    background: #fff;
    border: 1px solid rgba(64, 83, 100, 0.15);
    overflow-y: auto;
    max-height: 100%;
    height: calc(100% - 55px);
    max-width: calc(100vw - 150px);
}

.form-table .table {
    margin-bottom: 0;
}

.form-table .table thead th {
    color: #565656;
    font-size: 13px;
    line-height: 15px;
    font-weight: 600;
    border-top: 0;
    border-bottom: 0;
    padding: 12px 25px;
    white-space: nowrap;
    vertical-align: middle;
    text-transform: uppercase;
}

.form-table .table tbody tr td {
    color: #555;
    font-size: 14px;
    line-height: 16px;
    border-top: 1px solid #E3E5E8;
    padding: 12px 25px;
    vertical-align: middle;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 160px;
    white-space: nowrap;
    max-width: 260px;
    max-height: 16px;
    overflow: hidden;
    word-break: break-word;
}

.form-table .table tbody tr td:first-child {
    color: #24292F;
    font-size: 13px;
    line-height: 15px;
}

.form-table .table tbody tr td .select-chk-block {
    width: 15px;
    height: 15px;
    margin-right: 0;
    margin-top: 10px;
}

.data-holder-right .form-table .table tbody tr td .select-chk-block {
    width: auto;
    height: auto;
    margin-top: 0;
}

.form-table .table thead tr th:last-child,
.form-table .table tbody tr td:last-child {
    text-align: left;
    padding-right: 20px;
}

.data-view.field-form.infinte-scroll .data-holder {
    height: auto;
}

.form-detail-bottom.fixed-scroll {
    position: fixed;
    background: #fff;
    border: 1px solid rgba(64, 83, 100, 0.15);
    top: -1px;
    left: 0;
    z-index: 9;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    margin-left: 50px;
    padding-right: 87px;
}

.form-detail-container.data-view.infinte-scroll {
    overflow-y: auto;
}

.no-data-found {
    width: 100%;
    float: left;
    position: relative;
    text-align: center;
    padding-top: 100px;
    background: #ecf0f1;
}

.empty-data .no-data-found {
    padding: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.no-data-found h2 {
    font-size: 35px;
    margin-top: 10px;
    font-weight: 100;
    color: #c4c9cd;
}

.ind-form-field {
    float: left;
    width: 100%;
    margin-bottom: 35px;
}

.ind-form-field h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
}

.ind-form-field h5 {
    margin-bottom: 8px;
}

.ind-form-field p {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
}

.closed-box {
    float: left;
    width: 100%;
    margin-top: 20px;
    border: 1px solid #E4E6E9;
    position: relative;
}

.closed-box .input-block {
    border-bottom: 1px solid #E4E6E9;
}

.fiels-inp-box {
    float: left;
    width: 100%;
    border: 1px solid transparent;
    height: 67px;
    padding: 0 20px;
    font-size: 14px;
    position: relative;
    z-index: 9;
    background: transparent;
}

.closed-box .input-block label {
    float: left;
    width: 100%;
    color: #B1BECD;
    font-size: 14px;
    line-height: 14px;
    padding: 0 20px;
    margin: 11px 0 3px 0;
}

.closed-box .input-block .anim-text {
    padding: 0;
    margin: 0;
    color: #B1BECD;
    font-size: 14px;
    position: absolute;
    left: 21px;
    top: calc(50% - 7px);
    transition: .3s ease-out;
    z-index: 8;
}

.closed-box .input-block.active .anim-text {
    top: 10px;
    font-size: 12px;
    color: #b1becd;
}

.fiels-inp-box:focus+.anim-text {
    top: 10px;
    font-size: 12px;
    outline: 0;
}

.closed-box .input-block textarea {
    float: left;
    width: 100%;
    min-height: 63px;
    border: 1px solid transparent;
    padding: 0 20px;
    font-size: 14px;
    line-height: 16px;
    color: var(--default-text);
    resize: none;
}

.field-set {
    float: left;
    width: 100%;
    padding-left: 20px;

    margin-bottom: 35px;
    position: relative;
}

.field-set:before {
    content: "";
    width: 5px;
    height: 100%;
    background-color: rgba(63, 169, 245, 0.1);
    position: absolute;
    left: 0;
    top: 0;
}

.field-set .ind-form-field {
    margin-bottom: 0;
}

.fieldset-option {
    float: left;
    position: absolute;
    right: -9px;
    bottom: -8px;
    z-index: 9;
}

.fieldset-opt-button {
    padding: 0;
    background: transparent;
    line-height: 0;
    border: 0;
    margin-left: 5px;
    vertical-align: middle;
}

.delete-plus:before {
    background-position: -328px -333px;
    width: 17px;
    height: 17px;
}

.add-plus:before {
    background-position: -355px -333px;
    width: 17px;
    height: 17px;
}

.input-select {
    float: left;
    width: 100%;
    position: relative;
}

.input-select select {
    float: left;
    width: 100%;
    height: 55px;
    border: 0;
    -webkit-appearance: none;
    padding: 0 40px 0 20px;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    background: #fff;
}

.input-select:after {
    content: "";
    background: var(--sprite-one) no-repeat -196px -310px;
    width: 14px;
    height: 7px;
    position: absolute;
    right: 20px;
    top: calc(50% - 3.5px);
}

.checkbox-wrapper {
    float: left;
    width: 100%;
    margin-top: 32px;
}

.checkbox-wrapper .select-chk-block .control {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.checkbox-wrapper .select-chk-block .control .control-indicator {
    top: 0;
}

.radio-block {
    float: left;
    position: relative;
}

.radio-block label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    padding-left: 25px;
}

.radio-block label:before {
    content: "";
    width: 15px;
    height: 15px;
    border: 1px solid #C4C9CD;
    border-radius: 50%;
    background-color: #FFFFFF;
    position: absolute;
    left: 0;
    top: 0;
}

.radio-block input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    opacity: 0;
    cursor: pointer;
}

.radio-block input:checked+label:after {
    content: "";
    width: 7px;
    height: 7px;
    background-color: var(--default-color);
    position: absolute;
    left: 4px;
    top: 5px;
    border-radius: 50%;
}

.radio-wrapper .radio-block {
    display: flex;
}

.radio-wrapper .radio-block {
    margin-right: 32px;
}

.checkbox-wrapper .select-chk-block {
    margin-right: 52px;
}

.split-input fiels-inp-box {
    width: 50%;
    float: left;
}

.closed-box .input-select {
    border-bottom: 1px solid #e4e6e9;
}

.closed-box .input-select select:first-child {
    color: #b1becd;
}

.closed-box-slt .radio-wrapper {
    margin: 20px 0;
    padding: 0 20px;
    position: relative;
}

.closed-box-slt .ind-form-field h5 {
    float: left;
    width: 100%;
    color: #b1becd;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    margin-bottom: 5px;
}

.closed-box-slt {
    float: left;
    width: 100%;
    border-bottom: 1px solid #e4e6e9;
    position: relative;
}

.closed-box-slt .checkbox-wrapper {
    padding: 0 20px;
    margin: 20px 0;
    position: relative;
}

.closed-box div:last-child .input-block:last-child,
.closed-box div:last-child .input-select:last-child,
.closed-box div:last-child .closed-box-slt:last-child {
    border-bottom: 0;
}

.closed-box-slt .collection-image {
    padding: 0 20px;
}

.upload-wrapper {
    float: left;
    width: 100%;
    margin-top: 22px;
    margin-bottom: 24px;
}

.upload-wrapper.sm-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.closed-box-slt .upload-wrapper {
    margin: 20px 0;
    padding: 0 20px;
}

.file-upload label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    padding-left: 28px;
}

.closed-box-slt .upload-wrapper .file-upload label {
    color: #b1becd;
    margin-bottom: 0 !important;
}

.file-upload label:before {
    content: "";
    background: var(--sprite-one) no-repeat -341px -305px;
    width: 18px;
    height: 16px;
    position: absolute;
    left: 0;
    top: calc(50% - 8px);
}

.file-upload input[type=file] {
    display: block;
}

.closed-box-slt .attached-file {
    padding: 0;
    margin: 0;
    padding-top: 0;
    width: auto;
}

.closed-box-slt .file-tag {
    display: flex;
    align-items: center;
    padding-right: 30px;
    font-size: 13px;
    color: #6a7476;
    border-radius: 34px;
    margin: 0;
}

.closed-box-slt .file-upload-per {
    position: absolute;
    left: 0;
    bottom: 0;
    margin: 0;
    height: 10px;
    width: 100%;
    border-radius: 0;
}

.closed-box-slt .file-upload-per .progress-bar {
    background: var(--default-color);
}

.preview-table tbody tr td .attach-click {
    margin-bottom: 10px;
}

.preview-table tbody tr td .attach-click:last-child {
    margin-bottom: 0;
}

.radio-wrapper {
    float: left;
    width: 100%;
    margin-top: 32px;
}

.ind-form-field .form-type-input .form-control {
    height: 68px;
    border: 0;
    padding: 0 20px;
    color: var(--default-text);
}

.input-block .rdtPicker {
    bottom: auto !important;
}

.toggle .field-common.field-req-block {
    padding: 9px 20px;
    height: 69px;
}

.toggle .field-common label {
    margin-bottom: 10px;
    font-size: 12px;
    color: #898989;
    outline: 0;
}

.toggle .input-block.toggle {
    display: flex;
    align-items: center;
}

.full-wid-mod.with-footer .modal-body.without-footer {
    height: calc(100vh - 70px);
    padding: 22px 75px;
}

.full-wid-mod .modal-body.grey-bcg {
    background: #ecf0f1;
}

.form-preview-wrapper {
    float: left;
    width: 100%;
    margin-bottom: 50px;
}

.form-preview-wrapper:last-child {
    margin-bottom: 0px;
}

.form-preview-header {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.form-preview-header h5 {
    float: left;
    width: 100%;
    font-size: 25.9px;
    font-weight: 600;
    line-height: normal;
}

.form-preview-holder {
    float: left;
    width: 100%;
}

.left-panel {
    float: left;
    width: calc(100% - 330px);
    margin-right: 50px;
}

.right-panel {
    float: left;
    width: 270px;
}

.right-panel-white-box {
    float: left;
    width: 100%;
    background: #fff;
    padding: 25px 30px;
    border-radius: 5px;
    border: 1px solid #e4e6e9;
    box-shadow: 0 1px 13px 2px rgba(0, 0, 0, 0.05);
    margin-bottom: 15px;
    position: relative;
}

.right-panel-white-box:last-child {
    margin-bottom: 0px;
}

.table.form-preview-table tbody tr td,
.table.form-preview-table tbody tr th {
    border-bottom: 1px solid #e4e6e9;
    padding: 0;
    border-top: 0;
    padding: 12px 10px 12px 0;
    font-size: 14px;
}

.table.form-preview-table tbody tr th {
    color: var(--default-grey);
    width: 30%;
    line-height: 19px;
}

.table.form-preview-table tbody tr td {
    color: var(--default-text);
    font-weight: 400;
    font-size: 16px;
}

.right-panel ul {
    float: left;
    width: 100%;
}

.right-panel ul li {
    float: left;
    width: 100%;
    margin-bottom: 40px;
}

.right-panel-group-each {
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.right-panel-group-each h5 {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12.52px;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 7px;
}

.right-panel-group-each p {
    float: left;
    width: 100%;
    font-size: 16px;
}

.right-panel-group-each:last-child {
    margin-bottom: 0;
}

.right-panel-group-each ol li {
    float: left;
    width: 100%;
    margin: 0;
    font-size: 18px;
    margin-bottom: 5px;
}

.right-panel-group-each ol {
    float: left;
    width: 100%;
    padding-left: 19px;
    list-style: decimal;
}

.form-single-value-box {
    float: left;
    width: 100%;
}

.form-single-value-box p {
    float: left;
    width: 100%;
    font-size: 12.52px;
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 2px;
    text-transform: uppercase;
}

.form-single-value-box h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    color: var(--default-text);
    line-height: 22px;
    word-break: break-word;
}

.right-panel-white-box.fieldset {
    padding: 0;
    display: flex;
}

.right-panel-white-box.fieldset .form-single-value-box {
    padding: 25px 30px;
    border-right: 1px solid #e4e6e9;
    display: flex;
    flex-direction: column;
}

.right-panel-white-box.fieldset .form-single-value-box:last-child {
    border-right: 0;
}

.right-panel-white-box.fieldset.address-field .form-single-value-box:first-child {
    width: 20%;
}

.left-panel .card-container {
    width: 360px;
    padding-right: 20px;
}

.left-panel .grid-view .ind-collection-card {
    width: 100%;
    padding: 0;
    margin-bottom: 0;
    box-shadow: 0 1px 13px 2px rgba(0, 0, 0, 0.05);
}

.left-panel .grid-view.with-image .collection-card-left {
    padding: 0;
    border-radius: 5px 5px 0 0;
    border-bottom: 1px solid #eaeaea;
    background: #e9e9e9;
}

.left-panel .grid-view.with-image .collection-card-image {
    height: 262px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.left-panel .collection-card-image .format {
    position: absolute;
    left: calc(50% - 21.5px);
    top: calc(50% - 25px);
    height: 50px;
    cursor: pointer;
}

.left-panel .format:after {
    border-color: #e9e9e9 transparent transparent transparent;
}

.left-panel .grid-view .collection-card-right {
    padding: 0 20px 20px;
}

.left-panel.with-card {
    display: flex;
}

.left-panel.with-card .right-panel-white-box {
    width: calc(100% - 360px);
}

.left-panel .collection-card-right-header p,
.left-panel .collection-card-right-content p {
    font-size: 14px;
    margin-bottom: 5px;
    color: var(--default-grey);
}

.left-panel .grid-view .collection-card-right-header h5 {
    font-size: 18px;
    line-height: normal;
    max-height: 138px;
    margin-bottom: 25px;
}

.left-panel .grid-view .collection-card-right-footer ul li p {
    font-size: 14px;
    width: 75%;
    float: left;
}

.left-panel .grid-view .collection-card-right-footer ul li h5 {
    width: 25%;
}

.full-wid-mod .modal-title.coll-header {
    color: var(--default-grey);
    text-transform: uppercase;
}

.form-single-value-box h5 .attach-click {
    width: 43px;
    height: 50px;
    margin-top: 11px;
}

.form-single-value-box h5 .attach-click .format:after {
    border-color: #ffffff transparent transparent transparent;
}

.toggle-ico:before {
    background-position: -597px -246px;
    width: 17px;
    height: 8px;
}

.em-ico:before {
    background-position: -165px -450px;
    width: 14px;
    height: 12px;
}

.sign-ico:before {
    background-position: -533px -243px;
    width: 17px;
    height: 14px;
}

.editor-ico:before {
    background-position: -514px -244px;
    width: 16px;
    height: 13px;
}

.photo-capture-ico:before {
    background-position: -632px -244px;
    width: 15px;
    height: 12px;
}

.unid-ico:before {
    background-position: -552px -244px;
    width: 13px;
    height: 13px;
}

.cf-ico:before {
    background-position: -568px -243px;
    width: 10px;
    height: 14px;
}

.dl-ico:before {
    background-position: -581px -243px;
    width: 13px;
    height: 14px;
}

.af-ico:before {
    background-position: -617px -244px;
    width: 12px;
    height: 12px;
}

.logged-in-ico:before {
    background-position: -685px -242px;
    width: 15px;
    height: 15px;
}

.lat-ico:before {
    background-position: -496px -244px;
    width: 15px;
    height: 13px;
}

.pan-ico:before {
    background-position: -473px -244px;
    width: 20px;
    height: 13px;
}

.otp-ico:before {
    background-position: -734px -243px;
    width: 8px;
    height: 14px;
}

.display-text-ico:before {
    background-position: -666px -243px;
    width: 16px;
    height: 13px;
}

.form-icon:before {
    content: "";
    background: var(--sprite-two) no-repeat -435px -164px;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 0;
    top: 5px;
}

.data-holder.form-build-container {
    padding: 0 20px 20px 20px;
}

.form-build-tab-block {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 15px;
    background: #FFFFFF;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.form-build-tab-nav {
    float: left;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    display: flex;
    align-items: stretch;
}

.form-build-tab-nav nav {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    transition: .3s ease-out;
    cursor: pointer;
    position: relative;
}

.form-build-tab-nav nav:hover {
    color: var(--default-color);
}

.form-build-tab-nav nav.active {
    color: var(--default-color);
}

.form-build-tab-nav nav.active:after {
    content: "";
    width: 100%;
    height: 3px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    bottom: -2px;
}

.form-build-tab-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    position: relative;
}

.form-build-tab {
    float: left;
    width: 100%;
    height: 100%;
    display: none;
}

.form-build-inside-container {
    float: left;
    width: 100%;
    height: 100%;
}

.form-build-inside-left {
    float: left;
    width: 282px;
    height: 100%;
    margin-right: 18px;
    padding: 20px 0 0px 20px;
}

.form-build-inside-right {
    float: left;
    width: calc(100% - 300px);
    height: 100%;
    overflow-y: auto;
}

.form-build-inside-left .form-page-container {
    max-height: calc(100% - 75px);
}

.form-build-inside-left .trans-dash-button {
    background: rgba(74, 144, 226, 0.1);
}

.form-build-inside-right .form-list-wrap {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    overflow-y: auto;
    padding: 20px 0 20px 0;
}

.form-build-inside-right .form-list-wrap .ind-field-list {
    width: auto;
    cursor: grab;
}

.form-build-inside-right .ind-field-list .counter-field {
    display: none;
}

.form-build-inside-right .field-type-name {
    margin-left: 0;
    background: #ffffff;
}

.form-build-inside-right .fieldset-list .field-type-name {
    border: 1px dashed #B8C7CB;
    padding: 10px;
    background: url(images/line-texture.png);
}

.form-build-inside-right .field-nested-type-name {
    border: 1px solid #B8C7CB;
    background: #ffffff;
    color: #94A0A3;
    height: 21px;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.38px;
    line-height: 14px;
    padding: 3px 8px;
    margin-bottom: 10px;
    display: table;
}

.form-build-inside-right .field-type-name .nested-wrap {
    margin-top: 10px;
}

.form-build-inside-right .field-type-name .nested-wrap:first-child {
    margin: 0;
}

.form-build-inside-right .field-nested-type-name:last-child {
    margin-bottom: 0;
}

.form-build-inside-right .form-list-wrap .ind-field-list .field-type-name:hover {
    border-color: var(--default-color);
    color: var(--default-color);
}

.form-build-inside-right .fieldset-list .field-type-name .field-nested-type-name:hover {
    border-color: var(--default-color);
    color: var(--default-color);
}

.fieldset-add-field {
    float: left;
    background: rgba(74, 144, 226, 0.1);
    border: 1px dashed var(--default-color);
    color: var(--default-color);
    height: 21px;
    font-size: 12px;
    font-weight: 500;
}

.form-list-footer {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px 0 0;
}

.form-float-button-block {
    float: left;
    display: flex;
    align-items: center;
}

.form-list-footer-right button,
.form-list-footer-left button {
    margin-left: 12px;
    float: left;
    width: auto;
    min-width: 60px;
    height: 40px;
    border-radius: 40px;
    padding: 0 20px;
    border: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    background: var(--default-color);
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, .15);
    display: flex;
    align-items: center;
    transition: .3s ease-out;
}

.form-list-footer-left button:last-child {
    margin: 0;
}

.form-list-footer-right .preview-form-field {
    background: var(--default-text);
}

.add-form-field:hover {
    background: rgb(63 169 245 / 0.75);
}

.preview-form-field:hover {
    background: rgb(68 68 68 / .75);
}

.form-list-footer-right .update-form-field {
    background: #03B86E;
}

.update-form-field:hover {
    background: rgb(3 184 110 / .75);
}

.add-form-field:before {
    content: "";
    background: var(--sprite-one) no-repeat -34px -122px;
    width: 25px;
    height: 25px;
    display: inline-block;
    margin-right: 10px;
    zoom: .5
}

.preview-form-field:before {
    content: "";
    background: var(--sprite-one) no-repeat -54px -449px;
    width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 5px;
}

.update-form-field:before {
    content: "";
    background: var(--sprite-one) no-repeat -71px -451px;
    width: 14px;
    height: 11px;
    display: inline-block;
    margin-right: 8px;
}

.properties-side-panel {
    float: left;
    width: 650px;
    height: 100%;
    background-color: #FFFFFF;
    box-shadow: -5px 2px 4px 3px rgba(0, 0, 0, 0.07);
    position: absolute;
    right: 0;
    top: 0;
}

.properties-side-panel-header {
    float: left;
    width: 100%;
    height: 60px;
    padding: 0 20px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.properties-side-panel-header-left h5 {
    float: left;
    font-size: 16px;
    line-height: 19px;
}

.properties-side-panel-header-right {
    display: flex;
    align-items: center;
}

.properties-side-panel-header-right .bottom-button {
    margin-right: 15px;
}

.properties-side-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    overflow-y: auto;
}

.properties-side-body-tab {
    float: left;
    width: 100%;
    height: 100%;
}

.properties-side-body-tab-nav {
    float: left;
    width: 100%;
    height: 35px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    display: flex;
    align-items: center;
    justify-content: stretch;
}

.properties-side-body-tab-nav nav {
    float: left;
    height: 35px;
    width: 400px;
    background-color: rgba(74, 144, 226, 0.1);
    font-size: 12px;
    color: var(--default-grey);
    letter-spacing: 0;
    line-height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
}

.properties-side-body-tab-nav nav.active:before {
    content: "";
    width: 100%;
    height: 2px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    bottom: 0;
}

.properties-side-body-tab-nav nav.active {
    color: var(--default-color);
}

.properties-side-body-tab-body {
    float: left;
    width: 100%;
    height: calc(100% - 35px);
    padding: 20px;
    overflow-y: auto;
}

.properties-side-body-tab-body .builder-input input {
    font-weight: 600;
}

.properties-side-body-tab-body .ind-panel-options label {
    text-transform: uppercase;
}

.properties-side-body-tab-body .panel-drop .type-selection {
    font-weight: 600;
}

.properties-side-body-tab-body .panel-drop .dropdown-menu {
    top: 20px !important;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, .15);
    border: 1px solid #f1f1f1;
    border-radius: 10px;
    max-height: 350px;
    overflow-y: auto;
}

.properties-side-body-tab-body .panel-drop .dropdown-item:active,
.properties-side-body-tab-body .panel-drop .dropdown-item:focus {
    background: #f8f9fa;
}

.properties-side-body-tab-body .panel-drop .dropdown-item:hover {
    font-weight: 600;
}

.properties-side-body-tab-body .inp-panel-options .select-chk-block .control-checkbox {
    font-size: 14px;
    color: #3D576D;
}

.section-seprator {
    float: left;
    width: 100%;
    border: 1px solid #E3E5E8;
    border-radius: 5px;
    margin-bottom: 20px;
}

.section-seprator-header {
    float: left;
    width: 100%;
    height: 40px;
    border-top: 0;
    border-bottom: 1px solid #E3E5E8;
    background: #F9FCFE;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-radius: 5px 5px 0 0;
}

.section-seprator-header h5 {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
}

.section-seprator-body {
    float: left;
    width: 100%;
    padding: 20px 20px 0 20px;
}

.one-line-split {
    float: left;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.one-line-split .ind-panel-options {
    width: calc(50% - 10px);
    margin-right: 20px;
}

.one-line-split .ind-panel-options:nth-child(2n) {
    margin-right: 0;
}

.properties-side-body-tab-body .ind-panel-options .select-chk-block .control {
    color: #3D576D;
    text-transform: none;
    margin-bottom: 0;
    font-size: 14px;
}

.properties-side-body-tab-body .ind-panel-options {
    margin-bottom: 20px;
}

.properties-side-body-tab-body .ind-panel-options .radio-block label {
    color: #3D576D;
    text-transform: none;
    margin-bottom: 0;
}

.properties-side-body-tab-body .ind-panel-options .radio-wrap {
    margin-bottom: 0;
}

.ind-panel-options.single-row {
    width: 100%;
    margin-right: 0;
}

.ind-panel-options.single-row .select-box select {
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid #E3E5E8;
    padding: 0;
    color: #3D576D;
    font-weight: 600;
}

.ind-panel-options.equal-width-selectbox {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0;
}

.ind-panel-options.equal-width-selectbox .select-chk-block {
    width: calc(33.33% - 14px);
    margin-right: 20px;
    margin-bottom: 20px;
}

.ind-panel-options.equal-width-selectbox .select-chk-block:nth-child(3n) {
    margin-right: 0;
}

.form-build-properties-container {
    float: left;
    width: 100%;
    height: 100%;
}

.form-build-properties-left {
    float: left;
    width: 400px;
    height: 100%;
    border-right: 1px solid rgba(64, 83, 100, 0.15);
    background: #F1F2F3;
}

.form-build-properties-right {
    float: left;
    width: calc(100% - 400px);
    height: 100%;
}

.form-build-properties-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.form-build-properties-right-footer {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.form-build-properties-body-split {
    float: left;
    width: 50%;
    height: 100%;
    border-right: 1px solid rgba(64, 83, 100, 0.15);
}

.form-build-properties-left-header {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: 50px;
    display: flex;
    align-items: center;
}

.form-build-properties-left-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 23px;
}

.form-build-properties-left-body {
    float: left;
    width: 100%;
    padding: 10px 20px;
}

.form-build-properties-left-body .ind-panel-options .select-box select {
    background: transparent;
}

.ind-panel-options.single-row .radio-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.ind-panel-options.single-row .radio-wrap .radio-block label {
    margin-bottom: 0;
}

.ind-panel-options.single-row .radio-wrap .radio-block {
    margin-bottom: 15px;
}

.form-build-properties-container .ind-panel-options>label {
    text-transform: uppercase;
}

.form-build-properties-body-split-head {
    float: left;
    width: 100%;
    height: 50px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-build-properties-body-split-head h5 {
    float: left;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 23px;
}

.form-build-properties-body-split-head .select-chk-block {
    margin: 0;
}

.form-build-properties-body-split-head .select-chk-block label {
    font-size: 14px;
    color: var(--default-grey);
}

.split-content-row {
    float: left;
    width: 100%;
}

.split-content-row-header {
    float: left;
    width: 100%;
    height: 35px;
    background-color: rgba(74, 144, 226, 0.1);
    border-top: 1px solid rgba(64, 83, 100, 0.15);
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.split-content-row-header h5 {
    font-size: 12px;
    letter-spacing: 0;
    line-height: 14px;
    color: var(--default-color);
}

.split-content-row-body {
    float: left;
    width: 100%;
    padding: 20px;
}

.form-build-properties-container .ind-panel-options .radio-wrap {
    margin-bottom: 0;
}

.builder-components-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.65);
    z-index: 10;
}

.builder-components-block {
    float: left;
    width: 100%;
    height: 700px;
    background: #FFFFFF;
    max-width: 750px;
    position: absolute;
    left: calc(50% - 350px);
    top: calc(50% - 375px);
    border-radius: 10px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
}

.dropdown-menu-cont {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.form-field-categories {
    float: left;
    width: 100%;
    margin-bottom: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.form-field-categories h5 {
    float: left;
    font-size: 12px;
    background: var(--default-color);
    color: #FFFFFF;
    padding: 5px 10px;
    border-radius: 10px;
}

.form-field-categories .ind-field-button-type {
    width: calc((100% / 8) - 14px);
    margin-right: 16px;
    margin-bottom: 15px;
}

.form-field-categories .ind-field-button-type:nth-child(8n) {
    margin-right: 0;
}

.form-field-categories-block {
    float: left;
    width: 100%;
    margin: 15px 0 5px 0;
}

.close-panel {
    position: absolute;
    right: 0;
    top: -30px;
    right: -30px;
    width: 30px;
    height: 30px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.close-panel:before {
    background-position: -11px -125px;
    width: 16px;
    height: 16px;
    zoom: 1.2;
}

.section-seprator-header .btnsubIconsadd:before {
    background: var(--sprite-one) no-repeat -355px -333px;
    width: 17px;
    height: 17px;
}

.each-fields-list {
    float: left;
    width: 100%;
    border-radius: 5px;
    background: #ffffff;
    margin-bottom: 20px;
    padding: 20px 20px 0;
    position: relative;
    /* box-shadow: 0 1px 6px 0 rgba(0,0,0,0.2); */
    border: 1px solid #e4e6e9;
}

.each-fields-list-option {
    position: absolute;
    right: -14px;
    bottom: -8px;
}

.each-fields-list-extras .btnsubIcon:before {
    background: var(--sprite-one) no-repeat -328px -333px;
    width: 17px;
    height: 17px;
}

.each-fields-list .select-chk-block.default-checker {
    position: absolute;
    right: 20px;
    top: -8px;
    background: #ffffff;
    padding: 0;
    margin: 0;
}

.each-fields-list .select-chk-block.default-checker label {
    font-size: 14px;
    color: var(--default-grey);
}

.ind-panel-options.selectbox .select-box select {
    padding: 0;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid #E3E5E8;
}

.ind-panel-options.selectbox>label {
    margin-bottom: 5px;
}

.properties-side-body-tab-body .panel-drop ul.dropdown-menu li {
    float: left;
    width: 100%;
    height: auto;
    min-height: 40px;
    display: flex;
    align-items: center;
    padding: 5px 20px;
}

.properties-side-body-tab-body .panel-drop ul.dropdown-menu li nav .select-chk-block.default-checker {
    margin-right: 0;
}

.properties-side-body-tab-body .panel-drop ul.dropdown-menu li:hover {
    background: #fafafa;
}

.tag-task-container.tag-properties .tag-right {
    max-width: 425px;
    padding-left: 7px;
    color: #fff;
}

.tag-task-container.tag-properties .sl-tag {
    background: var(--default-color);
}

.tag-task-container.tag-properties .sl-tag .tag-cl {
    background: transparent;
}

.col-three .ind-panel-options {
    width: calc(33.33% - 14px);
}

.col-three .ind-panel-options:nth-child(2n) {
    margin-right: 20px;
}

.col-three .ind-panel-options:nth-child(3n) {
    margin-right: 0;
}

.upload-selector-container {
    float: left;
    position: absolute;
    right: 0;
    top: 0;
}

.upload-selector-container button {
    float: left;
    width: 25px;
    height: 25px;
    background: #fff;
    border: 1px solid #ccc;
    margin-left: 5px;
    border-radius: 5px;
    padding: 0;
    line-height: 0;
    position: relative;
    overflow: hidden;
    transition: .3s ease-out;
    cursor: pointer;
}

.upload-img:before {
    background-position: -74px -90px;
    width: 16px;
    height: 14px;
    zoom: .8;
}

.select-img:before {
    background-position: -505px -388px;
    width: 13px;
    height: 10px;
}

.upload-selector-container button input {
    float: left;
    width: 25px;
    height: 25px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 8;
    opacity: 0;
    cursor: pointer;
}

.upload-selector-container button:hover {
    box-shadow: 0 0px 4px 1px rgb(0 0 0 / 0.15);
}

.properties-side-body-tab-body .image-path .builder-input input {
    padding-right: 32px;
}

.properties-side-body-tab-body .ind-panel-options .builder-input {
    position: relative;
}

.custom-accordion-wrapper {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.custom-accordion-wrapper .accordian-api-block .card .card-header {
    padding: 0 20px;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
    height: 40px;
    background: #F9FCFE;
}

.custom-accordion-wrapper .accordian-api-block .card:first-of-type,
.custom-accordion-wrapper .accordian-api-block .card:not(:first-of-type):not(:last-of-type) {
    border-color: #E3E5E8;
    border-radius: 5px;
}

.custom-accordion-wrapper .accordian-api-block .card-body {
    padding-bottom: 0;
}

.tag-task-container.tag-properties.white-tag .sl-tag {
    background: transparent;
    border: 1px solid #E0E0E0;
    padding: 0 7px;
    transition: .3s ease-out;
}

.tag-task-container.tag-properties.white-tag .sl-tag:hover {
    padding-right: 20px;
}

.tag-task-container.tag-properties.white-tag .tag-right {
    color: var(--default-grey);
    padding-left: 0;
}

.tag-task-container.tag-properties.white-tag .sl-tag .tag-cl {
    width: 10px;
    height: 12px;
    top: calc(50% - 6px);
    font-size: 0;
    background: transparent;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
    cursor: pointer;
}

.tag-task-container.tag-properties.white-tag .sl-tag .tag-cl:before {
    content: "";
    background: var(--sprite-one) no-repeat -473px -159px;
    width: 10px;
    height: 12px;
    display: inline-block;
}

.tag-task-container.tag-properties.white-tag .sl-tag:hover .tag-cl {
    opacity: 1;
    pointer-events: auto;
}

.calculator-area {
    float: left;
    width: 100%;
    border: 1px solid #e3e5e8;
    border-radius: 5px;
    margin-bottom: 20px;
    overflow: hidden;
    display: flex;
    max-height: 333px;
}

.calculator-area-left {
    float: left;
    width: 90px;
}

.calculator-area-right {
    float: left;
    width: calc(100% - 90px);
    border-left: 1px solid #e3e5e8;
}

.calculator-area-header {
    float: left;
    width: 100%;
    height: 30px;
    display: flex;
    align-items: center;
    padding: 0 15px;
    border-bottom: 1px solid #e3e5e8;
    background: #f9fcfe;
}

.calculator-area-header h5 {
    float: left;
    font-size: 12px;
    text-transform: uppercase;
    color: var(--default-grey);
}

.calculator-area-body {
    float: left;
    width: 100%;
    height: calc(100% - 30px);
    padding: 15px;
    overflow-y: auto;
}

.calculator-option-block {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.calculator-option-block button {
    float: left;
    height: 30px;
    width: 30px;
    border-radius: 5px;
    border: 0;
    background-color: var(--default-color);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    margin-bottom: 10px;
    padding: 0;
    line-height: 0;
}

.calculator-option-block button:last-child {
    margin-bottom: 0;
}

.calc-add:before {
    background-position: -283px -412px;
    width: 7px;
    height: 7px;
}

.calc-sub:before {
    background-position: -295px -415px;
    width: 4px;
    height: 2px;
}

.calc-div:before {
    background-position: -304px -410px;
    width: 5px;
    height: 11px;
}

.calc-multi:before {
    background-position: -314px -412px;
    width: 6px;
    height: 6px;
}

.calc-left-of:before {
    background-position: -325px -408px;
    width: 4px;
    height: 14px;
}

.calc-right-of:before {
    background-position: -334px -408px;
    width: 4px;
    height: 14px;
}

.calc-numb:before {
    content: "123";
    font-size: 12px;
    color: #fff;
    font-weight: 600;
}

.calculator-items {
    float: left;
    width: 100%;
}

.each-calculator-items {
    float: left;
    height: 25px;
    display: flex;
    align-items: center;
    font-size: 12px;
    font-weight: 600;
    color: #3D576D;
    border: 1px solid #e3e5e8;
    border-radius: 12px;
    padding: 0 10px;
    margin-right: 5px;
    margin-bottom: 5px;
    cursor: pointer;
    background: #f9fcfe;
}

.each-calculator-items:hover {
    border-color: var(--default-color);
    color: var(--default-color);
}

.table.form-preview-table tbody tr td,
.with-card-preview .table.form-preview-table tbody tr td,
.table.form-preview-table tbody .col-tr .col-td {
    padding-right: 25px;
    position: relative;
    word-break: break-word;
}

.with-card-preview .table.form-preview-table tbody tr td .prev-version,
.table.form-preview-table tbody tr td .prev-version,
.table.form-preview-table tbody .col-tr .col-td .prev-version {
    background: transparent;
    border: 0;
    padding: 0;
    margin: 2px 2px 2px 5px;
    position: relative;
    top: 3px;
    float: right;
    position: absolute;
    right: 0;
    top: 10px;
}

.table.form-preview-table tbody .col-tr .col-td {
    line-height: normal;
}

/*------ Forms Details End ------*/

/*------ Workflow ------*/

.table-all-wrapper {
    float: left;
    width: 100%;
    padding: 0px 20px 20px;
    background: #ecf0f1;
    height: calc(100vh - 60px);
    overflow: auto;
}

.table-all-wrapper .bsy-table tr th {
    white-space: nowrap;
}

.bsy-table {
    width: 100%;
}

.bsy-table tr th,
.bsy-table tr td {
    width: 10%;
}

.bsy-table tr th {
    border-top: 0;
    border-bottom: 0;
    padding: 15px 20px;
    color: #565656;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    text-align: left;
    text-transform: uppercase;
}

.bsy-table tr th.high-widthed,
.bsy-table tr td.high-widthed {
    width: 60%;
}

.bsy-table tr td {
    cursor: pointer;
}

.bsy-table tbody tr td {
    border-top: 1px solid #e4e4e4;
    background: #fff;
    padding: 17px 20px;
    vertical-align: middle;
    color: var(--default-grey);
    font-size: 13px;
    line-height: 15px;
}

.bsy-table tr th.high-widthed,
.bsy-table tr td.high-widthed {
    width: 50%;
}

.bsy-table tbody tr td:first-child {
    border-left: 1px solid #e4e4e4;
}

.workflow-icon {
    margin-right: 16px;
}

.icon-in.icon-workflow-in {
    background-position: -281px -448px;
    width: 19px;
    height: 19px;
}

.project-details-in {
    width: 100%;
}

.editable-head {
    float: left;
    width: 100%;
    margin-bottom: 4px;
    transition: .4s ease-out;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 90%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
}

.bsy-table tr:hover .editable-head {
    color: var(--default-color);
}

.editable-head--middle {
    margin-bottom: 0px;
}

.project-detailbox {
    display: flex;
    align-items: center;
}

.wf-btn-block {
    float: right;
    display: flex;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.bsy-table tbody tr:hover td .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.wf-btn-block button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-left: 9px;
    cursor: pointer;
}

.wf-ed:before {
    background-position: -456px -158px;
    width: 12px;
    height: 12px;
}

.wf-dt:before {
    background-position: -473px -159px;
    width: 10px;
    height: 12px;
}

.bsy-table tr th.high-widthed,
.bsy-table tr td.high-widthed {
    width: 50%;
}

.persitant-top .task-input-block {
    margin-bottom: 0;
}

.project-name.wf-listing-ico:before {
    background-position: -281px -448px;
    width: 19px;
    height: 18px;
    left: 0;
    top: 3px;
}

/*------ Workflow End ------*/

/*------ Workflow Details ------*/

.data-view .common-align .form-detail-top .wf-detail-top-right {
    float: right;
}

.wf-detail-top-right p {
    float: left;
    font-size: 12px;
    line-height: 20px;
    color: #B1BECD;
}

.view-click {
    color: var(--default-color);
}

.wf-stages:before {
    content: "";
    background: var(--sprite-one) no-repeat -106px -466px;
    width: 14px;
    height: 16px;
    margin-right: 10px;
}

.detail-tab-click.wf-stages.active:before,
.detail-tab-click.wf-stages:hover:before {
    background-position: -9px -466px;
}

.wf-auto:before {
    content: "";
    background: var(--sprite-one) no-repeat -152px -466px;
    width: 19px;
    height: 18px;
    margin-right: 10px;
}

.detail-tab-click.wf-auto.active:before,
.detail-tab-click.wf-auto:hover:before {
    background-position: -55px -466px;
}

.wf-set:before {
    content: "";
    background: var(--sprite-one) no-repeat -128px -466px;
    width: 16px;
    height: 16px;
    margin-right: 10px;
}

.detail-tab-click.wf-set.active:before,
.detail-tab-click.wf-set:hover:before {
    background-position: -31px -466px;
}

.wf-temp:before {
    content: "";
    background: var(--sprite-one) no-repeat -179px -467px;
    width: 16px;
    height: 16px;
    margin-right: 10px;
}

.detail-tab-click.wf-temp.active:before,
.detail-tab-click.wf-temp:hover:before {
    background-position: -82px -467px;
}

.detail-tab-click.input:before {
    content: "";
    background: var(--sprite-two) no-repeat -153px -202px;
    width: 19px;
    height: 17px;
    margin-right: 10px;
}

.detail-tab-click.input.active:before,
.detail-tab-click.input:hover:before {
    background-position: -153px -225px;
}

.detail-tab-click.team:before {
    content: "";
    background: var(--sprite-one) no-repeat -135px -407px;
    width: 19px;
    height: 14px;
    margin-right: 10px;
}

.detail-tab-click.team.active:before,
.detail-tab-click.team:hover:before {
    background-position: -135px -382px;
}

.tab-in-container {
    float: left;
    width: 100%;
}

.ind-set-list {
    float: left;
    width: calc((100% / 4) - 15px);
    height: 70px;
    padding: 15px 20px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 2px;
    background-color: #FFFFFF;
    margin-right: 20px;
    margin-bottom: 20px;
    transition: .3s ease-out;
    display: flex;
    align-items: center;
    position: relative;
}

.set-count {
    float: left;
    height: 38px;
    width: 38px;
    background-color: #b1becd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    margin-right: 15px;
}

.set-desc {
    float: left;
    width: calc(100% - 53px);
}

.set-desc h5 {
    float: left;
    width: 100%;
    color: #24292F;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    transition: .3s ease-out;
    max-width: 75%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.bt-text {
    float: left;
    width: 100%;
    margin-top: 7px;
}

.bt-text li {
    float: left;
    color: #b1becd;
    font-size: 12px;
    line-height: 14px;
    margin-right: 12px;
}

.tick:before {
    background-position: -82px -265px;
    width: 11px;
    height: 8px;
    margin-right: 5px;
}

.un-tick:before {
    background-position: -98px -265px;
    width: 8px;
    height: 8px;
    margin-right: 5px;
}

.ind-set-list:hover {
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
}

.ind-set-list:hover .set-desc h5 {
    color: var(--default-color)
}

.ind-set-list:nth-child(4n) {
    margin-right: 0;
}

.nested-sub-block .input-block {
    margin-bottom: 20px;
}

.wf-rule:before {
    background-position: -488px -155px;
    width: 19px;
    height: 19px;
    margin-right: 12px;
}

.wf-detail-top {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 50px;
    margin-bottom: 8px;
}

.wf-detail.data-view .form-detail-top {
    max-height: none;
}

.wf-detail .wf-detail-top {
    padding-right: 0;
}

.wf-detail .form-detail-panel {
    border-top: 0;
    border-right: 0;
    border-left: 0;
}

.wf-detail-top .view-click {
    display: inline-block;
}

.detail-tab li nav {
    cursor: pointer;
}

.wf-detail .data-holder {
    height: calc(100vh - 132px);
    overflow-y: auto;
}

.wf-detail .data-holder.wf-hold {
    height: calc(100vh - 164px);
}

.wf-detail .wf-hold.input-wrap {
    padding: 0;
}

.imported-input-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    background: #fff;
    border-top: 1px solid #E4E6E9;
}

.imported-input-header {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #E4E6E9;
    padding: 0 20px;
}

.imported-input-header h5 {
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
}

.change-button {
    float: left;
    height: 40px;
    border-radius: 5px;
    background-color: var(--default-text);
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    border: 0;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    text-align: center;
    padding: 0 30px;
    cursor: pointer;
}

.wf-button-block .change-button {
    margin-left: 12px;
}

.imported-input-detail {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    overflow-y: auto;
    padding: 20px;
}

.project-tab-rise .data-holder.wf-hold.stage-wrap {
    float: left;
    width: 100%;
    padding: 0;
}

.stage-in-wrap {
    float: left;
    width: 100%;
    overflow: auto !important;
    max-width: calc(100vw - 48px);
    max-height: calc(100vh - 170px);
}

.stage-in-container {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: row;
    height: auto;
    width: 100%;
    border-top: 1px solid #E3E5E8;
}

.split-stage {
    float: left;
    width: 653px;
    height: auto;
    padding: 20px 40px;
    flex: 1;
    -webkit-flex: 1;
    min-width: 640px;
    min-height: calc(100vh - 188px);
}

.split-stage:nth-child(odd) {
    background: #ebebeb;
}

.split-stage:nth-child(even) {
    background: #ecf0f1;
}

.split-stage-block {
    float: left;
    width: 100%;
    position: relative;
}

.ind-stage-box {
    float: left;
    width: 100%;
    height: 165px;
    background: #fff;
    margin-bottom: 50px;
    padding: 20px 15px;
    border: 1px solid var(--default-color);
    position: relative;
    cursor: pointer;
    transition: .3s ease-out;
}

.ind-stage-box:hover {
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.split-stage-left {
    float: left;
    width: 50px;
    height: 50px;
    margin-right: 20px;
    position: relative;
}

.stage-number {
    float: left;
    width: 50px;
    height: 50px;
    background: #f4f4f4;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    color: var(--default-text);
}

.split-stage-right {
    float: left;
    width: calc(100% - 70px);
    padding-top: 15px;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding-right: 30px;
}

.split-stage-right h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 10px;
    padding-right: 35px;
    transition: .3s ease-out;
}

.ind-stage-box:hover .split-stage-right h5 {
    color: var(--default-color);
}

.split-stage-right p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 21px;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 63px;
    text-overflow: ellipsis;
}

.next-out {
    float: left;
    width: 80px;
    height: 1px;
    border: .58px dashed var(--default-color);
    position: absolute;
    left: -80px;
    top: calc(50% - .5px);
}

.next-out:after {
    content: "";
    width: 12px;
    height: 12px;
    background: #fff;
    border: 1px solid var(--default-color);
    border-radius: 50%;
    position: absolute;
    left: -7px;
    top: calc(50% - 6px);
}

.sub-out {
    float: left;
}

.sub-out:after {
    content: "";
    width: 12px;
    height: 12px;
    background: var(--default-color);
    border: 1px solid var(--default-color);
    border-radius: 50%;
    position: absolute;
    right: -6px;
    bottom: -6px;
}

.child-stage {
    padding: 0 40px 0 0;
}

.split-stage-block:before {
    content: "";
    border-right: .5px dashed var(--default-color);
    width: 1px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    max-height: calc(100% - 83px);
}

.next-in {
    float: left;
    width: 40px;
    height: 1px;
    border-top: .58px dashed var(--default-color);
    position: absolute;
    left: -40px;
    top: calc(50% - .5px);
}

.next-in:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6.5px 10px 6.5px 0;
    border-color: transparent var(--default-color) transparent transparent;
    position: absolute;
    right: 0;
    top: calc(50% - 6.5px);
    transform: rotate(180deg);
}

.child-stage .next-in {
    float: left;
    width: 40px;
    height: 1px;
    border-top: .58px dashed var(--default-color);
    position: absolute;
    left: unset;
    right: -40px;
    top: calc(50% - .5px);
}

.child-stage .next-in:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6.5px 10px 6.5px 0;
    border-color: transparent var(--default-color) transparent transparent;
    position: absolute;
    right: unset;
    left: 0;
    top: calc(50% - 6.5px);
    transform: rotate(0);
}

.child-stage .sub-out:after {
    bottom: unset;
    top: calc(50% - 6px);
}

.child-stage .sub-out {
    float: left;
    width: 40px;
    height: 1px;
    border-top: .58px dashed var(--default-color);
    position: absolute;
    left: -40px;
    top: calc(50% - .5px);
}

.split-stage-block:after {
    content: "";
    border-right: .5px dashed var(--default-color);
    width: 1px;
    height: 100%;
    position: absolute;
    left: -40px;
    top: 82px;
    max-height: calc(100% - 164px);
}

.split-stage:first-child .next-out {
    width: 0;
}

.split-stage:first-child .child-stage .sub-out {
    width: 40px;
    left: -40px;
}

.ind-stage-box:last-child {
    margin-bottom: 0;
}

.split-stage:first-child .split-stage-block:after {
    left: -40px;
}

.ind-stage-box .opt-form-ico:before {
    background: url(../images/sprite-v1.svg) no-repeat -7px -113px;
    width: 4px;
    height: 18px;
    transform: rotate(90deg);
    position: absolute;
    left: calc(50% - 2px);
    top: calc(50% - 9px);
}

.ind-stage-box .form-option-block {
    right: 20px;
    top: 28px;
}

.stage-info {
    float: left;
    width: 15px;
    height: 16px;
    background-color: var(--default-color);
    border-radius: 50%;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    position: absolute;
    right: 0;
    top: 0;
}

.stage-info.green {
    background-color: #0F9D58;
}

.stage-info.blue {
    background-color: var(--default-color);
}

.stage-info.yellow {
    background-color: #F5A623;
}

.stage-info.red {
    background-color: #E14745;
}

.time-stamp {
    float: left;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 500;
    position: absolute;
    right: 55px;
    top: 15px;
    color: var(--default-color);
    display: none;
}

.stage-info-bar {
    float: left;
    width: 100%;
    display: none;
}

.stage-info-bar li {
    float: left;
    margin-right: 25px;
    font-size: 12px;
    color: var(--default-text);
}

.stage-info-bar li:last-child {
    margin-right: 0;
}

.detail-view .ind-stage-box {
    height: 200px;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.detail-view .split-stage-block:after {
    top: 100px;
    max-height: calc(100% - 199px);
}

.detail-view .split-stage-block:before {
    max-height: calc(100% - 100px);
}

.float-close:before {
    background-position: -307px -217px;
    width: 28px;
    height: 21px;
    left: calc(50% - 12.5px);
    top: calc(50% - 12.5px);
}

.split-stage:first-child {
    padding-left: 60px;
}

.detail-view .stage-info-bar {
    display: block;
}

.detail-view .time-stamp {
    display: block;
}

.data-holder.task-wrap {
    padding: 0 20px;
}

.radio-wrapper.settings-check-margin {
    margin-top: 0;
}

.settings-loungue-content {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    overflow-y: auto;
    padding: 0 15px;
}

.setting-pane .settings-loungue-content {
    height: calc(100% - 18px);
    padding: 0;
    max-height: 100%;
}

.scrollable-table {
    float: left;
    width: 100%;
    height: 100%;
    max-width: calc(100vw - 150px);
}

.scrollable-table .table {
    float: left;
    width: 100%;
    height: 100%;
    margin: 0;
    display: block;
    overflow-x: auto;
    white-space: nowrap;
}

.settings-loungue-content table thead tr th {
    color: #24292F;
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
    border-bottom: 1px solid #E3E5E8;
    border-top: 0;
    padding: 13px 15px;
}

.scrollable-table table thead tr th {
    text-align: center;
    border-right: 1px solid #E3E5E8;
    border-top: 1px solid #E3E5E8;
    border-left: 1px solid #E3E5E8;
    padding: 7px 18px;
    min-width: 160px;
}

.scrollable-table table thead tr th:first-child {
    min-width: 210px;
}

.scrollable-table table thead tr th p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
}

.settings-loungue-content table tbody tr td {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    padding: 11px 15px;
    vertical-align: middle;
}

.settings-loungue-content .scrollable-table table tr td {
    border-right: 1px solid #E3E5E8;
    border-left: 1px solid #E3E5E8;
    vertical-align: middle;
    padding: 0;
    line-height: 50px;
    border-top: 0;
    border-bottom: 1px solid #E3E5E8;
}

.scrollable-table .priority-header {
    float: left;
    width: 100%;
    display: flex;
}

.scrollable-table .priority-header li {
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    width: 25%;
    text-align: center;
    line-height: 50px;
    min-width: 110px;
    position: relative;
}

.scrollable-table .priority-header.two-side li {
    width: 50%;
}

.scrollable-table .priority-header .active:before {
    content: "";
    width: 100%;
    height: 2px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    bottom: 0;
}

.scrollable-table .title-box {
    padding: 0 20px;
}

.scrollable-table .radio-box {
    float: left;
    width: 100%;
    position: relative;
}

.scrollable-table .radio-input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    z-index: 9;
    cursor: pointer;
}

.scrollable-table .radio-box label {
    float: left;
    width: 100%;
    height: 50px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.scrollable-table .radio-box label:before {
    content: "";
    float: left;
    width: 15px;
    height: 15px;
    border: 1px solid #AAB7C4;
    border-radius: 50%;
}

.scrollable-table .radio-box input:checked+label:after,
.scrollable-table .radio-box input.active+label:after {
    content: "";
    width: 7px;
    height: 7px;
    background-color: var(--default-color);
    position: absolute;
    left: calc(50% - 3.5px);
    top: calc(50% - 3.5px);
    border-radius: 50%;
}

.settings-loungue-content .scrollable-table table tr th:nth-child(even),
.settings-loungue-content .scrollable-table table tr td:nth-child(even) {
    background: #FBFCFC;
}

.accordian-api-block .card-header {
    display: flex;
    align-items: center;
    padding-left: 85px;
    color: var(--default-text);
    font-size: 13px;
    font-weight: 500;
    line-height: 15px;
    cursor: pointer;
    position: relative;
}

.accordian-api-block .card {
    border-color: rgba(64, 83, 100, 0.15);
    margin-bottom: 5px;
}

.accordian-api-block .card .card-header {

    margin-bottom: 0;
}

.accordian-api-block .card-body {
    float: left;
    width: 100%;
    border-top: 1px solid rgba(64, 83, 100, 0.15);
    padding: 15px 20px;
}

.type-span {
    float: left;
    width: 75px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
    text-transform: uppercase;
    border-radius: 3px 0 0 3px;
}

.get {
    background: #126AB3;
    color: #FFFFFF;
    font-size: 13px;
    line-height: 15px;
    font-weight: 400;
}

.post {
    background: #10A54B;
    color: #FFFFFF;
    font-size: 13px;
    line-height: 15px;
    font-weight: 400;
}

.accordian-api-block .card:first-of-type,
.accordian-api-block .card:not(:first-of-type):not(:last-of-type) {
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.api-body {
    float: left;
    width: 100%;
}

.accordian-api-block .card-header:after {
    content: "";
    background: var(--sprite-three) no-repeat -169px -17px;
    width: 7px;
    height: 11px;
    position: absolute;
    right: 24px;
    top: calc(50% - 5.5px);
    transition: .3s ease-out;
}

.accordian-api-block .card-header.collapsed:after {
    transform: rotate(90deg);
}

.accordian-api-block .card-header:hover .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.api-staging-list {
    float: left;
    width: 100%;
    list-style: decimal;
    padding-left: 20px;
}

.api-staging-list li {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    padding-left: 10px;
}

.api-staging-list li:last-child {
    margin-bottom: 0px;
}

.add-common {
    height: 40px;
    width: 45px;
    border-radius: 5px;
    background-color: var(--default-color);
    /* box-shadow: 0 2px 5px 0 rgba(0,0,0,0.26); */
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
    padding: 0;
    border: 0;
    position: relative;
}

.add-common:before {
    content: "";
    background: var(--sprite-two) no-repeat -25px -228px;
    width: 13px;
    height: 13px;
    font-size: 18px;
    position: absolute;
    left: calc(50% - 6px);
    top: calc(50% - 6px);
    color: var(--default-color);
}

/*------ Workflow Details End ------*/

/*------ Workflow Task Entity ------*/

.workflow-addon {
    float: left;
    width: 100%;
    height: 100%;
}

.workflow-addon-left {
    float: left;
    width: 440px;
    height: 100%;
    margin-right: 20px;
}

.workflow-addon-left .nav-tabs {
    border-bottom: 0;
}

.workflow-addon-left .nav-tabs .nav-item {
    float: left;
    height: 50px;
    margin-left: 4px;
}

.workflow-addon-left .nav-tabs .nav-item:first-child {
    margin-left: 0;
}

.workflow-addon-left .nav-tabs .nav-link {
    padding: 0;
    height: 100%;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    border-radius: 0;
    border: 1px solid #e1e1e1;
    background: #f6f7f9;
    cursor: pointer;
}

.workflow-addon-left .nav-tabs .nav-link.active {
    background: #fff;
    border: 1px solid #e4e4e4;
    border-bottom: 1px solid #fff;
}

.workflow-addon-left .nav-tabs .nav-item:first-child .nav-link.active {
    border-left: 1px solid #e4e4e4;
}

.nav-link.active .tasks:before {
    background-position: -310px -139px;
}

.ico-lib-v1.disscussion:before {
    background-position: -167px -115px;
}

.nav-link.active .ico-lib-v1.disscussion:before {
    background-position: -167px -141px;
}

.ico-lib-v1.file:before {
    background-position: -269px -118px;
}

.nav-link.active .ico-lib-v1.file:before {
    background-position: -269px -141px;
}

.tasks:before {
    background-position: -290px -139px;
    width: 22px;
    height: 19px;
}

.nav-link.active .tasks:before {
    background-position: -310px -139px;
}

.workflow-addon-left .tab-text {
    margin-left: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-color);
    line-height: 17px;
}

.workflow-addon-left .nav-tabs .tab-text {
    display: none;
}

.workflow-addon-left .nav-link.active .tab-text {
    display: block;
}

.workflow-addon-left .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 49px);
}

.workflow-addon-left .tab-content .tab-pane {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.ind-task-wf {
    float: left;
    width: 100%;
    background: #fff;
    border: 1px solid #E3E5E8;
    margin-bottom: 10px;
}

.task-wf-header {
    float: left;
    width: 100%;
    height: 40px;
    border: 0;
    padding: 0;
    background: transparent;
    text-align: left;
    border-bottom: 1px solid #E5E7EA;
    padding: 0 20px;
    position: relative;
}

.task-wf-header:before {
    content: "";
    height: 40px;
    width: 5px;
    background-color: var(--default-color);
    position: absolute;
    left: 0;
    top: 0;
}

.task-wf-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
}

.task-wf-body {
    float: left;
    width: 100%;
    padding: 10px 20px 15px 20px;
    border-bottom: 1px solid #E5E7EA;
}

.task-wf-body-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.header-left-text {
    float: left;
    color: #9AA7B5;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    text-align: right;
}

.wf-med {
    color: #D4AE2D;
}

.wf-high {
    color: #EE6B46;
}

.wf-low {
    color: #D5B610;
}

.wf-urgent {
    color: #E14745;
}

.header-right-text {
    float: left;
    color: #9AA7B5;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    text-align: right;
    text-transform: uppercase;
}

.task-wf-body h5 {
    float: left;
    width: 100%;
    color: #2E3243;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    margin-bottom: 5px;
}

.task-wf-body .body-text {
    float: left;
    width: 100%;
    color: #848488;
    font-size: 14px;
    line-height: 22px;
}

.task-wf-forms {
    float: left;
    width: 100%;
    padding: 15px 20px;
}

.task-wf-forms h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    margin-bottom: 13px;
}

.forms-list {
    float: left;
    width: 100%;
}

.forms-list li {
    float: left;
    width: calc((100% / 2) - 8px);
    margin-right: 15px;
    margin-bottom: 15px;
}

.forms-list li:nth-child(2n) {
    margin-right: 0;
}

.forms-list li a {
    float: left;
    width: 100%;
    color: #6B7577;
    font-size: 12px;
    line-height: 14px;
    display: flex;
    align-items: center;
}

.fm-ico:before {
    background-position: -334px -139px;
    width: 18px;
    height: 19px;
    margin-right: 8px;
}

.task-wf-feed {
    float: left;
    width: 100%;
    padding: 15px 20px;
    border-bottom: 1px solid #E3E5E8;
}

.feed-list {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.hide-block .task-wf-feed {
    border-bottom: 0;
}

.task-wf-feed h5 {
    float: left;
    width: 100%;
    color: #B1BECD;
    font-size: 12px;
    line-height: 14px;
}

.feed-list p {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.hide-block .task-wf-body {
    display: none;
}

.hide-block .task-wf-forms {
    display: none;
}

.with-clickable:after {
    content: "";
    background: var(--sprite-two) no-repeat -359px -141px;
    width: 8px;
    height: 14px;
    position: absolute;
    right: 15px;
    top: calc(50% - 7px);
    transition: .3s ease-out;
}

.hide-block .with-clickable:after {
    transform: rotate(90deg);
}

.task-wf-header.approved h5:before {
    content: "";
    display: inline-block;
    width: 9px;
    height: 15px;
    border: solid var(--default-color);
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
    margin-right: 18px;
    position: relative;
    left: 4px;
}

.workflow-addon-center {
    float: left;
    width: calc(100% - 850px);
    height: 100%;
    margin-right: 20px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    background-color: #FFFFFF;
    box-shadow: 0 -1px 6px 0 rgba(0, 0, 0, 0.1);
}

.addon-center-header {
    float: left;
    width: 100%;
    height: 70px;
    padding: 12px 20px;
    border-bottom: 1px solid #E3E5E8;
}

.addon-center-header h5 {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    margin-bottom: 7px;
    display: block;
    max-width: 90%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.inv-block {
    float: left;
    width: 100%;
}

.inv-block li {
    float: left;
    color: #D0D6DC;
    font-size: 12px;
    line-height: 14px;
    display: flex;
    margin-right: 22px;
}

.date-inv:before {
    background-position: -36px -262px;
    width: 11px;
    height: 12px;
    margin-right: 6px;
}

.fm-inv:before {
    background-position: -51px -263px;
    width: 12px;
    height: 12px;
    margin-right: 6px;
}

.addon-center-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    overflow-y: auto;
}

.invoke-table {
    float: left;
    width: 100%;
    margin: 0;
    border-bottom: 1px solid #E3E5E8;
}

.invoke-table {
    border-bottom: 0;
}

.invoke-table thead tr th {
    color: #24292F;
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
    border: 0;
    padding: 0 20px;
    height: 40px;
    vertical-align: middle;
}

.invoke-table thead tr th {
    background: #F7F8F9;
}

.invoke-table thead tr th {
    border-bottom: 1px solid #E3E5E8;
}

.invoke-table thead tr th:first-child {
    text-align: left;
}

.workflow-addon .invoke-table thead tr th:first-child {
    width: 25%;
}

.invoke-table thead tr th:last-child {
    text-align: right;
}

.workflow-addon .invoke-table thead tr th:last-child,
.workflow-addon .invoke-table tbody tr td:last-child {
    text-align: left;
}

.invoke-table tbody tr td {
    border-color: #E3E5E8;
    padding: 0 20px;
    height: 40px;
    vertical-align: middle;
}

.invoke-table tbody tr td {
    border-color: transparent;
}

.invoke-table tbody tr td:first-child {
    text-align: left;
    color: #2C3137;
    font-size: 14px;
    line-height: 16px;
}

.invoke-table tbody tr td:last-child {
    text-align: right;
    font-size: 14px;
    line-height: 16px;
    color: #828483;
}

.workflow-addon .invoke-table thead tr th:last-child,
.workflow-addon .invoke-table tbody tr td:last-child {
    text-align: left;
}

.workflow-addon-right {
    float: left;
    width: 370px;
    height: 100%;
}

.addon-right-header {
    float: left;
    width: 100%;
    height: 40px;
    border-bottom: 1px solid #D8DCE1;
    padding-top: 5px;
}

.addon-right-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    line-height: 19px;
    font-weight: 500;
    padding-bottom: 15px;
}

.right-header-small {
    color: #A0A2A5;
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
}

.addon-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 120px);
    overflow-y: auto;
    padding: 20px 0;
}

.select-lister {
    float: left;
    width: 100%;
    margin-bottom: 24px;
}

.select-lister li {
    float: left;
    margin-right: 20px;
}

.addon-right-body .input-block .control {
    color: #73797F;
    font-size: 14px;
    line-height: 19px;
    margin-bottom: 0;
}

.addon-right-body .input-block h5 {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 15px;
}

.radio-block {
    float: left;
    position: relative;
}

.radio-block input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    opacity: 0;
    cursor: pointer;
}

.radio-block label {
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    padding-left: 25px;
}

.addon-right-body .radio-block label {
    line-height: 18px;
    color: #73797F;
}

.radio-block label:before {
    content: "";
    width: 15px;
    height: 15px;
    border: 1px solid #C4C9CD;
    border-radius: 50%;
    background-color: #FFFFFF;
    position: absolute;
    left: 0;
    top: 0;
}

.radio-block input:checked+label:after {
    content: "";
    width: 7px;
    height: 7px;
    background-color: var(--default-color);
    position: absolute;
    left: 4px;
    top: 4px;
    border-radius: 50%;
}

.addon-right-body .input-box {
    height: 40px;
    margin-bottom: 20px;
}

.addon-right-body .select-box {
    margin-bottom: 20px;
}

.attached-file {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 10px;
}

.file-tag {
    width: auto;
    border: 1px solid #ccc;
    position: relative;
    border-radius: 3px;
    background: #e3e7e8;
    border-radius: 5px;
    float: left;
    font-size: 14px;
    padding: 5px;
    padding-left: 24px;
    margin: 5px 5px 2.5px 0;
}

.workflow-addon-right .file-tag {
    display: flex;
    align-items: center;
    padding-right: 30px;
    font-size: 13px;
    color: #6a7476;
    border-radius: 34px;
}

.file-tag:before {
    content: "";
    background: url(images/at-ico.png) no-repeat;
    width: 13px;
    height: 15px;
    display: inline-block;
    position: absolute;
    left: 6px;
    top: calc(50% - 7.5px);
}

.workflow-addon-right .attached-file {
    margin-top: 0;
    margin-bottom: 20px;
}

.addon-right-body .attach-block {
    margin-bottom: 20px;
}

.textarea {
    float: left;
    width: 100%;
    height: 150px;
    border: 1px solid #e4e5e9;
    background-color: #FFFFFF;
    resize: none;
    padding: 15px 20px;
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 20px;
}

.addon-footer {
    float: left;
    width: 100%;
    padding: 20px 0;
}

.addon-footer .dropdown.invoke-pop {
    float: left;
}

.invoke-pop .general-btn {
    min-width: 200px;
}

.invoke-pop .dropdown-menu {
    padding: 0;
    width: 100%;
    border: 1px solid #EAEAEA;
    background-color: #FFFFFF;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
}

.stage-button {
    float: left;
    border: 0;
    padding: 0;
    line-height: 0;
    height: 30px;
    width: 130px;
    border-radius: 5px;
    background-color: var(--default-color);
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    margin-left: 10px;
    cursor: pointer;
}

.invoke-pop .stage-button {
    float: left;
    width: 100%;
    margin: 0;
    float: left;
    width: 100%;
    height: 40px;
    background: transparent;
    color: #fff;
    box-shadow: none;
    color: #6B7577;
    font-size: 16px;
    font-weight: 400;
    line-height: 40px;
    text-align: left;
    padding: 0 20px;
    border-bottom: 1px solid #E3E5E8;
    position: relative;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
    border-radius: 0;
}

.invoke-pop .dropdown-menu:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 11px 0 11px;
    border-color: #ffffff transparent transparent transparent;
    position: absolute;
    bottom: -10px;
    left: calc(50% - 11px);
    z-index: 9;
}

.invoke-pop .dropdown-menu:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 12px 0 12px;
    border-color: #eaeaea transparent transparent transparent;
    position: absolute;
    bottom: -12px;
    left: calc(50% - 12px);
    z-index: 8;
}

.invoke-pop .stage-button:last-child {
    border: 0;
}

/*------ Workflow Task Entity End ------*/

/*------ Entity ------*/

.entity-content-block {
    float: left;
    width: calc((100% / 4) - 17px);
    height: 150px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 2px;
    background-color: #FFFFFF;
    margin-right: 22px;
    margin-bottom: 22px;
    padding: 15px 20px;
    transition: .3s ease-out;
}

.entity-content-block:hover {
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
}

.entity-main-box {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.entity-box-head {
    float: left;
}

.entity-box-head h5 {
    float: left;
    color: #24292F;
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
}

.entity-box-form {
    float: left;
    position: relative;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.entity-content-block:hover .entity-box-form {
    opacity: 1;
    pointer-events: auto;
}

.entity-box-form .form-option-block {
    top: 0;
    right: 0;
}

.entity-box-content {
    float: left;
    width: 100%;
}

.entity-box-content p {
    float: left;
    width: 100%;
    color: #B1BECD;
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 10px;
}

.entity-box-content .category-class {
    float: left;
    height: 20px;
    width: auto;
    border-radius: 3px;
    background-color: #7FAE94;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    padding: 0 7px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dark-text {
    color: #999999;
}

.entity-content-block:nth-child(4n) {
    margin-right: 0;
}

.form-option-block .panel-option {
    top: 3px;
    right: -15px;
}

.block-separator {
    float: left;
    width: 100%;
    border: 1px solid #ECEFF1;
    border-radius: 5px;
    padding: 15px 20px 20px 20px;
    margin-top: 20px;
    position: relative;
}

.tag-block-separator {
    position: absolute;
    left: 8px;
    top: -8px;
    background: #fff;
    padding: 0 8px;
    color: var(--default-grey);
    font-size: 14px;
}

.block-separator .radio-wrapper .radio-block {
    width: 100%;
}

.block-separator .radio-wrapper .radio-block:last-child label {
    margin-bottom: 0;
}

.tile-description-box .form-option-block {
    right: 0px;
    top: 0px;
    float: left;
    width: 26px;
    height: 20px;
}

.tile-description-box .form-option-block .opt-form-ico {
    right: -5px;
    top: 0;
}

.tile-each .form-option-block .panel-option {
    top: 22px;
    right: -14px;
}

.icon-in.icon-sys-task {
    background-position: -361px -300px;
    background: var(--sprite-two) no-repeat -361px -300px;
    width: 21px;
    height: 17px;
    margin-right: 16px;
}

.list-viewer .entity-info .section-info {
    padding-left: 30px;
    position: relative;
}

.tile-entity-description-box {
    float: left;
    width: 100%;
    padding-left: 30px;
    position: relative;
}

.list-viewer .entity-info .sys_entity:before,
.tile-entity-description-box.sys_entity:before {
    content: "";
    background: var(--sprite-two) no-repeat -300px -300px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
    top: 5px;
}

.list-viewer .entity-info .gen_entity:before,
.tile-entity-description-box.gen_entity:before {
    content: "";
    background: var(--sprite-two) no-repeat -280px -300px;
    width: 16px;
    height: 17px;
    position: absolute;
    left: 0;
    /* top: 5px; */
    top: 2px;
}

.board-cont {
    float: left;
    width: 92%;
    display: flex;
    align-items: center;
}

.board-cont h5 {
    float: left;
    pointer-events: none;
}

.board-cont .board-count {
    float: left;
    margin-left: 5px;
}

.board-header-top .list-edit-ico {
    opacity: 1;
}

.list-save-ico {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-left: 4px;
    opacity: 1;
    pointer-events: none;
    cursor: pointer;
}

.list-save-ico:before {
    background-position: -8px -181px;
    width: 16px;
    height: 16px;
}

.board-header-top button {
    float: left;
    margin-left: 10px;
}

.active .board-cont h5 {
    pointer-events: auto;
    border: 1px solid #e4e5e9;
    background: #fff;
    padding: 0 5px;
    width: 100%;
}

.active .board-cont h5:focus {
    outline: none;
}

.board-header-top.active button {
    pointer-events: auto;
}

.board-header-top.align-button-right {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.non-project .ibt-header-back-btn {
    max-width: 550px;
}

.comment-content-body .file-bl-wrap {
    padding-left: 0;
    width: 100%;
}

.comment-content-body .file-bl-wrap .attach-chat-block {
    width: 100%;
}

/*------ Entity End ------*/

/*------ Entity Details ------*/

.data:before {
    content: "";
    background: var(--sprite-one) no-repeat -11px -329px;
    width: 21px;
    height: 16px;
    display: inline-block;
    margin-right: 10px;
    color: black;
}

.data.active:before,
.data:hover:before {
    background-position: -69px -329px;
}

.lnkd:before {
    content: "";
    background: var(--sprite-two) no-repeat -60px -361px;
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 10px;
    color: black;
}

.lnkd.active:before,
.lnkd:hover:before {
    background-position: -60px -383px;
}

.infos:before {
    content: "";
    background: var(--sprite-two) no-repeat -6px -362px;
    width: 20px;
    height: 17px;
    display: inline-block;
    color: black;
}

.infos.active:before,
.infos:hover:before {
    background-position: -6px -384px;
}

.ent-form .form-detail-bottom {
    padding: 0;
}

.data-view.ent-form .data-holder {
    height: calc(100vh - 152px);
}

.entity-data-table {
    float: left;
    width: 100%;
    border: 1px solid rgba(64, 83, 100, 0.15);
    background: #ffff;
    padding: 0 20px;
}

.entity-data-table table thead tr th {
    color: #24292F;
    font-size: 13px;
    font-weight: 500;
    line-height: 14px;
    padding: 15px 0;
}

.entity-data-table table thead tr:first-child th {
    border-top: 0;
    border-bottom: 0;
}

.entity-data-table table tbody tr td {
    color: #828483;
    font-size: 12px;
    line-height: 14px;
    padding: 12px 0;
    line-height: 15px;
}

.entity-data-table table tbody tr td:first-child {
    color: #2C3137;
}

.entity-data-table table {
    margin-bottom: 0;
}

.entity-data-table table thead tr th:last-child {
    text-align: right;
}

.entity-data-table table tbody tr td:last-child {
    text-align: right;
}

.linked-accordion .card {
    border-color: rgba(64, 83, 100, 0.15);
}

.linked-accordion .card {
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15) !important;
}

.linked-accordion .accordion .card:first-of-type {
    border-bottom: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.card-clicker {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0 40px;
    display: flex;
    align-items: center;
    color: #24292F;
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    position: relative;
    cursor: pointer;
}

.clicker-sub {
    float: left;
    color: #828483;
    font-size: 13px;
    line-height: 15px;
    font-weight: 400;
    margin-left: 10px;
}

.blk-txt {
    color: #24292F;
    font-size: 14px;
    line-height: 16px;
}

.linked-accordion .card-body {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.linked-accordion .card-body .entity-data-table {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    padding: 0;
}

.card-clicker:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 4px;
    border-color: transparent transparent transparent #b8c7cb;
    position: absolute;
    left: 20px;
    top: calc(50% - 4px);
    transform: rotate(90deg);
    transition: .3s ease-out;
}

.card-clicker.collapsed:before {
    transform: rotate(0deg);
}

.entity-table {
    float: left;
    width: 100%;
    background: #fff;
    border-top: 1px solid #E3E5E8;
    border-bottom: 1px solid #E3E5E8;
    padding: 0 20px;
}

.entity-table table tbody tr:first-child td {
    border-top: 0;
}

.entity-table table tbody tr td {
    color: #9CA0A4;
    font-size: 14px;
    line-height: 16px;
    border-color: #F3F3F3;
    padding: 14px 0;
    vertical-align: middle;
}

.entity-table table tbody tr td:last-child {
    color: #2C3137;
    font-size: 14px;
    line-height: 16px;
}

.entity-table table {
    margin-bottom: 0;
}

.entity-tp-modal .modal-body {
    background: transparent;
    padding: 0;
    height: calc(100vh - 130px);
}

.entity-tp-modal .modal-content {
    background: transparent;
}

.entity-tp-modal .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 64px);
    background: #fff;
}

.entity-tp-modal .modal-lg {
    min-width: 1170px;
    min-height: 100vh;
    margin: 0 auto;
}

.entity-tp-modal .nav>li>a {
    text-decoration: none;
    background-color: #ecf0f1;
    border-radius: 0px;
    font-size: 18px;
    font-weight: 600;
    color: #6b7577;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 64px;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    cursor: pointer;
}

.g-rule:before {
    background-position: -273px -155px;
    width: 21px;
    height: 20px;
    margin-right: 12px;
}

.b-rule:before {
    background-position: -302px -159px;
    width: 23px;
    height: 18px;
    margin-right: 12px;
}

.bsy-modal.entity-tp-modal {
    padding: 0;
}

.bsy-modal .modal-close.md-close {
    float: left;
    width: 35px;
    height: 35px;
    background: #000;
    border: 2px solid #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 0;
    top: 15px;
    cursor: pointer;
}

.bsy-modal .modal-close.md-close:before {
    background-position: -379px -71px;
    width: 13px;
    height: 13px;
}

.tab-main-container {
    float: left;
    width: 100%;
    height: 100%;
}

.entity-tp-modal .nav-tabs .nav-item {
    margin-right: 2px;
}

.tab-main-header {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.tab-main-header h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    color: var(--default-text);
    margin: 0;
}

.tab-main-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    background: #fff;
    padding: 20px;
    overflow-y: auto;
}

.tab-main-body .section-info-main {
    float: left;
    border-radius: 5px;
}

.thumb-card {
    float: left;
    width: 100%;
    height: 100%;
}

.data-view .form-detail-top.wf-with-desc {
    max-height: unset;
}

.proj-back {
    float: left;
    width: 14px;
    height: 21px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: relative;
    margin-right: 20px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.proj-back:before {
    content: "";
    background: var(--sprite-two) no-repeat -61px -141px;
    width: 14px;
    height: 13px;
    display: inline-block;
}

.wf-detail-bottom {
    float: left;
    width: 100%;
    padding-left: 35px;
}

.wf-detail-top-left h5 {
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
}

.wf-detail-top-left {
    float: left;
    display: flex;
}

.data-view .form-detail-top .wf-detail-bottom p {
    display: block;
    max-height: 20px;
    overflow: hidden;
    color: var(--default-grey);
}

.form-detail-bottom.wf-bottom {
    padding: 0;
}

.project-tab-rise .data-holder.wf-hold.align-max-height {
    height: calc(100vh - 163px);
    padding: 20px;
}

.pool-task-ico:before {
    content: "";
    background: var(--sprite-two) no-repeat -199px -203px;
    width: 20px;
    height: 18px;
    margin-right: 10px;
}

.tab-main-body .content-section {
    width: 100%;
    border: 1px solid #e4e5ea;
    border-radius: 5px;
    box-shadow: none;
    background: #ECEFF2;
    position: relative;
}

.tab-main-body .content-section:hover {
    box-shadow: none;
}

.tab-main-body .section-info h5 {
    float: left;
    width: 100%;
    font-size: 20px;
}

.tab-main-body .section-info p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    min-height: auto;
    font-size: 16px;
    max-height: 19px;
}

.tab-main-body .section-info {
    padding-right: 50px;
}

.rulesRightContent {
    float: left;
    width: 444px;
    height: 100%;
    background: #F1F4F5;
}

.rulesLeftContent {
    float: left;
    width: calc(100% - 444px);
    height: 100%;
}

.leftContenthead {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid #E3E5E8;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.leftContenthead h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    line-height: 19px;
}

.wf-bottom .detail-tab li a,
.wf-bottom .detail-tab li nav {
    justify-content: center;
    cursor: pointer;
}

.icon-in.icon-project-in {
    background-position: -350px -403px;
    width: 13px;
    height: 17px;
}

.project-icon {
    margin-right: 22px;
}

.leftbottomsection {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    overflow-y: auto;
    padding: 20px;
}

.rightbodycontent {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
    overflow-y: auto;
}

.leftContentboxbody {
    float: left;
    width: 100%;
    background: #F1F4F5;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 2px;
    padding: 20px;
}

.leftContentbox {
    float: left;
    width: 100%;
    margin-bottom: 32px;
    position: relative;
}

.leftContentHead {
    float: left;
    width: 100%;
    margin-bottom: 18px;
}

.leftContentHead p {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    line-height: normal;
    display: flex;
    align-items: center;
}

.txtboxHead:before {
    background-position: -24px -247px;
    width: 12px;
    height: 12px;
    margin-right: 10px;
}

.leftInputSection {
    float: left;
    width: 100%;
    padding-right: 48px;
    position: relative;
    margin-bottom: 10px;
}

.split-rule-block {
    float: left;
    width: calc((100% / 2) - 8px);
    margin-right: 15px;
}

.split-rule-block:last-child {
    margin-right: 0;
}

.rule-select-box {
    float: left;
    width: 100%;
    height: 40px;
    position: relative;
}

.rule-select-box select {
    float: left;
    width: 100%;
    height: 100%;
    -webkit-appearance: none;
    border: 1px solid #E3E5E8;
    border-radius: 2px;
    background-color: #FFFFFF;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    padding: 0 40px 0 15px;
}

.rule-input-block {
    float: left;
    width: 100%;
    height: 40px;
}

.rule-input-block input {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid #E3E5E8;
    border-radius: 2px;
    background-color: #FFFFFF;
    padding: 0 20px;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
}

.rule-select-box:after {
    content: "";
    background: var(--sprite-one) no-repeat -468px -189px;
    width: 10px;
    height: 6px;
    position: absolute;
    right: 20px;
    top: calc(50% - 3px);
}

.btnsubIconsadd {
    float: left;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
}

.btnsubIconsadd:before {
    background-position: -267px -183px;
    width: 17px;
    height: 17px;
}

.leftInputaddIcons {
    float: left;
    width: 38px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
}

.btnsubIcon {
    float: left;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
    margin-right: 6px;
}

.btnsubIcon:before {
    background-position: -244px -183px;
    width: 17px;
    height: 17px;
}

.lefttext {
    float: left;
    width: 60px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f4f5;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-top: 1px solid #f1f4f5;
    border-bottom: 1px solid #f1f4f5;
    position: absolute;
    bottom: -33px;
    left: calc(50% - 30px);
    z-index: 9;
}

.lefttext p {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
}

.rule-field-btn-block {
    float: left;
    width: 100%;
    height: 40px;
    background: #f1f4f5;
    border: 1px solid rgba(64, 83, 100, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
}

.rule-field-btn-block .dropdown-toggle {
    float: left;
    -webkit-appearance: none;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
    color: var(--default-text);
    font-size: 15px;
    font-weight: 400;
    line-height: 16px;
    text-align: center;
    display: flex;
    align-items: center;
    text-shadow: none;
    cursor: pointer;
}

.rule-field-btn-block .dropdown-toggle:after {
    border: 0;
    background: var(--sprite-one) no-repeat -468px -189px;
    width: 10px;
    height: 6px;
    margin-left: 5px;
}

.blue-bold {
    color: var(--default-color);
    font-weight: 600;
    margin-left: 3px;
}

.rule-field-btn-block .dropdown-menu {
    min-width: 350px;
    left: calc(50% - 175px) !important;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
    border: 1px solid #EAEAEA;
    top: 24px !important;
}

.rule-field-btn-block .dropdown-menu .dropdown-item {
    padding: 0;
    float: left;
    width: 100%;
    padding: 0 20px;
    font-size: 14px;
    color: var(--default-text);
    cursor: pointer;
}

.rule-field-btn-block .dropdown-menu .dropdown-item:hover {
    background: #f1f4f5;
}

.rule-field-btn-block .dropdown-menu:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 12px 10px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    left: calc(50% - 10px);
    top: -12px;
    z-index: 7;
}

.rule-field-btn-block .dropdown-menu:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 12px 14px 12px;
    border-color: transparent transparent #e2e2e2 transparent;
    position: absolute;
    left: calc(50% - 12px);
    top: -14px;
    z-index: 6;
}

.rightdateinput {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.rightdateinput label {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 15px;
    line-height: 15px;
    margin-bottom: 15px;
}

.inputdatefield {
    float: left;
    width: 100%;
}

.inputdatefield .datefieldright {
    float: left;
    width: calc((100% / 2) - 8px);
    margin-right: 15px;
    margin-bottom: 0;
}

.inputdatefield .datefieldright:last-child {
    margin-right: 0;
}

.inputdate:before {
    background-position: -220px -156px;
    width: 15px;
    height: 16px;
}

.inputdate {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: absolute;
    right: 18px;
    top: calc(50% - 8px);
}

.datefieldright .task-input-box {
    padding-right: 40px;
}

.weekmarkarea .select-chk-block label {
    color: var(--default-text);
    font-size: 15px;
    line-height: 15px;
    margin-bottom: 0;
}

.weekmarkarea .select-chk-block {
    margin-bottom: 17px;
    width: calc((100% / 4) - 8px);
    display: block;
}

.weekmarkarea .select-chk-block:nth-child(4n) {
    margin-right: 0;
}

.rightdateinput .radio-block label {
    margin-bottom: 0;
    color: #6B7577;
    font-size: 13px;
    line-height: 17px;
}

.rightdateinput .radio-block label {
    margin-bottom: 0;
    color: #6B7577;
    font-size: 13px;
    line-height: 17px;
}

.assignSection {
    float: left;
    width: 100%;
    margin-bottom: 14px;
}

.rightdateinput .radio-wrapper-new {
    margin-bottom: 0;
}

.assignsectionTitle {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.assignsectionTitle p,
.prioritysection p {
    float: left;
    color: var(--default-grey);
    font-size: 15px;
    line-height: 15px;
}

.assignImport {
    float: left;
    color: var(--default-color) !important;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.assignInputuser {
    float: left;
    width: 100%;
    height: 50px;
}

.assignInputuser input {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF;
    color: var(--default-text);
    padding: 0 20px;
    font-size: 14px;
    line-height: 16px;
}

.assignInputuser input::placeholder,
.rule-input-block input::placeholder,
.assignInputdesc textarea::placeholder {
    color: #AAB7C4;
}

.assignInputdesc {
    float: left;
    width: 100%;
    height: 90px;
    margin-bottom: 14px;
}

.assignInputdesc textarea {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid #E4E6E9;
    border-radius: 5px;
    background-color: #FFFFFF;
    resize: none;
    padding: 20px;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
}

.prioritysection {
    float: left;
    width: 100%;
}

.rule-wrap {
    background: #fff;
    border: 1px solid rgba(64, 83, 100, 0.15);
}

.rule-wrap .form-field-wrapper {
    height: 100%;
}

.rule-wrap .form-field-wrapper-left-block.rule {
    height: 100%;
}

.rule-tab-content {
    overflow-y: auto;
}

.tab-main-body.no-pad-main {
    padding: 0;
    border-top: 1px solid #ECEFF2;
}

.tab-main-right {
    float: left;
    width: 444px;
    height: 100%;
    background: #ecf0f1;
    border-left: 1px solid #ECEFF2;
    padding: 20px;
    overflow-y: auto;
}

.tab-main-left {
    float: left;
    width: calc(100% - 444px);
    height: 100%;
    padding: 20px;
}

.rightdateinput .radio-block label {
    padding-left: 25px;
    margin-right: 15px;
    font-size: 16px;
    color: var(--default-text);
}

.rightdateinput .radio-block label:before {
    width: 17px;
    height: 17px;
}

.rightdateinput .radio-block input:checked+label:after {
    left: 5px;
    top: 5px;
}

.tab-main-footer {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 20px;
    border-top: 1px solid #ECEFF2;
}

.with-footer .tab-main-body.no-pad-main {
    height: calc(100% - 140px);
}

.tab-main-footer .general-btn {
    margin-left: 15px;
}

.tab-main-body .ind-task-input {
    margin-bottom: 20px;
    border-bottom: 1px solid #E4E6E9;
    height: auto;
    min-height: 50px;
}

.tab-main-body .tag-wrapper-bl input {
    margin-bottom: 5px;
}

.tab-main-body .ind-task-input .lb-tx {
    top: 13px;
    font-size: 16px;
}

.rightdateinput .control-indicator {
    position: absolute;
    top: calc(50% - 7.5px);
    left: 0;
    height: 17px;
    width: 17px;
    background: #fff;
    border: 1px solid #b6c5ca;
}

.rule-select-opt-block {
    float: left;
    width: 100%;
}

.rule-select-opt-block li {
    float: left;
    font-size: 15px;
    color: var(--default-grey);
    margin-right: 35px;
    display: flex;
    align-items: center;
}

.notf-ico:before {
    background-position: -353px -159px;
    width: 14px;
    height: 15px;
    position: relative;
    top: 1px;
    margin-right: 8px;
}

.date-rule-ico:before {
    background-position: -375px -159px;
    width: 14px;
    height: 14px;
    margin-right: 8px;
}

.rule-select-opt-block li span {
    font-weight: 600;
    margin-right: 5px;
    font-size: 15px;
}

.form-control[readonly] {
    background: #fff;
}

.tab-main-right .task-inp-container input {
    background: transparent;
    border: 0;
    padding: 0;
}

.error-label {
    float: left;
    width: 100%;
    margin: 10px 0;
    font-size: 14px;
    color: #e3165b;
}

.data-search-button .coll-task-ico {
    color: var(--default-color) !important;
    border: 1px solid var(--default-color);
    background: #fff;
    box-shadow: none;
}

.coll-task-ico:before {
    background-position: -467px -279px;
    width: 14px;
    height: 14px;
    margin-right: 8px;
}

.data-search-button .coll-task-ico:hover {
    background: var(--default-color);
}

.coll-task-ico:hover:before {
    background: var(--sprite-two) no-repeat -50px -182px;
    width: 14px;
    height: 14px;
}

.checkbox-indicator {
    content: "";
    height: 15px;
    width: 15px;
    background: #fff;
    border: 1px solid #b6c5ca;
    position: absolute;
    left: 0;
    top: 0px;
}

.checkbox-indicator:after {
    content: "";
    background: var(--sprite-one) no-repeat;
    background-position: -274px -73px;
    width: 9px;
    height: 7px;
    left: 2px;
    top: 3px;
    border-color: #b6c5ca;
    position: relative;
}

.input-check-box.active+.checkbox-indicator {
    background: var(--default-color);
    border: 1px solid var(--default-color);
}

.input-check-box.active+.checkbox-indicator:after {
    display: block;
}

.input-check-box {
    float: left;
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 8;
    opacity: 0;
    cursor: pointer;
}

.entity-preview-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    /* overflow: hidden; */
}

.entity-preview-left {
    float: left;
    width: 270px;
    height: 100%;
    background: var(--side-panel);
    padding: 30px;
    overflow-y: auto;
}

.entity-preview-center {
    float: left;
    width: calc(100% - 540px);
    height: 100%;
    padding: 30px 40px;
    overflow-y: auto;
}

.entity-preview-right {
    float: left;
    width: 270px;
    height: 100%;
    background: #f1f5f6;
    padding: 30px;
}

.linked-collection-record {
    float: left;
    width: 100%;
}

.linked-collection-record li {
    float: left;
    width: 100%;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 0 !important;
}

.linked-collection-record li nav {
    float: left;
    width: 100%;
    cursor: pointer;
}

.linked-collection-record li nav p {
    float: left;
    width: 100%;
    font-size: 12px;
    text-transform: uppercase;
    color: #cfd0d4;
    line-height: normal;
    margin-bottom: 5px;
}

.linked-collection-record li nav h5 {
    float: left;
    width: 100%;
    color: #a4c1ee;
    font-size: 14px;
    FONT-WEIGHT: 400;
    line-height: 18px;
    transition: .3s ease-out;
}

.linked-collection-record li:hover nav p,
.linked-collection-record li nav.active p {
    color: #fff;
}

.linked-collection-record li:hover nav h5,
.linked-collection-record li nav.active h5 {
    color: var(--white);
    /*
     */
}

.step3 .entity-preview-right {
    display: none;
}

.step3 .entity-preview-center {
    width: calc(100% - 270px);
}

.entity-preview-center.center-full {
    float: left;
    width: calc(100% - 270px);
}

.main-entity-info {
    float: left;
    width: 100%;
    display: flex;
    margin-bottom: 20px;
}

.main-entity-info .right-panel-white-box {
    background: transparent;
    border: 1px solid #dee2e6;
    margin-right: 15px;
    width: calc((100% / 4) - 11px);
    margin-bottom: 0;
    background: #ffffff;
    box-shadow: none;
}

.main-entity-info .right-panel-white-box:nth-child(4n) {
    margin-right: 0;
}

.remain-entity-info {
    float: left;
    width: 100%;
    height: calc(100% - 166px);
}

.remain-entity-info .form-table {
    height: 100%;
}

.step4 .entity-preview-left {
    display: none;
}

.step4 .entity-preview-center {
    width: calc(100% - 270px);
}

.modal-body.without-footer.grey-bcg.entity-preview {
    padding: 0;
}

.entity-preview-right .right-panel-group-each:last-child {
    margin-bottom: 25px;
}

.credential-panel .form-preview-header h5 {
    width: auto;
}

.credential-panel .form-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.other-credential {
    float: left;
    width: 31px;
    height: 31px;
    border: 0;
    border-radius: 5px;
    padding: 0;
    background: transparent;
    cursor: pointer;
}

.other-credential:before {
    content: "";
    background: var(--sprite-two) no-repeat -6px -362px;
    width: 20px;
    height: 17px;
    display: inline-block;
}

.other-credential:hover:before {
    background-position: -6px -384px;
    width: 20px;
    height: 17px;
}

.credential-side-panel {
    float: left;
    width: 400px;
    background: #ecf0f1;
    height: calc(100vh - 70px);
    position: fixed;
    right: -400px;
    top: 70px;
    border-left: 1px solid #e4e6e933;
    transition: .4s ease-out;
    box-shadow: -2px 2px 5px 0 rgba(0, 0, 0, .05);
    z-index: 10;
    overflow: hidden;
}

.credential-panel-header {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.credential-panel-header h5 {
    font-size: 18px;
    font-weight: 600;
}

.credential-panel-close:before {
    content: "";
    background: var(--sprite-one) -379px -71px no-repeat;
    display: inline-block;
    width: 13px;
    height: 13px;
}

.credential-panel-close {
    border: 0;
    padding: 0;
    cursor: pointer;
}

.credential-panel-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    padding: 20px;
}

.credential-panel-body .main-entity-info {
    display: block;
}

.credential-panel-body .main-entity-info .right-panel-white-box {
    width: 100%;
    padding: 0;
    background: transparent;
    border: 0;
}

.credential-panel-body .form-single-value-box p {
    width: 45%;
    margin: 0;
    line-height: 24px;
    flex-shrink: 0;
}

.credential-panel-body .form-single-value-box h5 {
    width: 55%;
    flex-shrink: 0;
}

.credential-panel-body .form-single-value-box {
    border-bottom: 1px solid #dddbdb;
    padding-bottom: 7.5px;
    margin-bottom: 7.5px;
}

.credential-side-panel.fly-in {
    right: 0;
}

.credential-panel .remain-entity-info {
    height: calc(100% - 52px);
}

.mobile-only-button {
    display: none;
}

.common-modal-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
}

.right-preview-options {
    float: left;
}

.right-preview-options .general-btn {
    float: left;
}

.carousel__back-button,
.carousel__next-button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    float: left;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    background-color: var(--default-color);
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.carousel__back-button {
    position: absolute;
    left: 10px;
    top: calc(50% - 15px)
}

.carousel__next-button {
    position: absolute;
    right: 10px;
    top: calc(50% - 15px)
}

.carousel__back-button svg,
.carousel__next-button svg {
    display: none;
}

.carousel__back-button:before {
    content: "";
    background: var(--sprite-one) no-repeat -385px -474px;
    width: 14px;
    height: 8px;
    display: inline-block;
    zoom: .7;
    transform: rotate(90deg);
}

.carousel__next-button:before {
    content: "";
    background: var(--sprite-one) no-repeat -385px -474px;
    width: 14px;
    height: 8px;
    display: inline-block;
    zoom: .7;
    transform: rotate(-90deg);
}

.floating-summary-user-left .floating-boiler-plate .carousel__back-button,
.floating-summary-user-left .floating-boiler-plate .carousel__next-button {
    zoom: .7
}

.task-content-block.DashBuilder.with-db-header.entity-builder-modal-height {
    height: 100%;
}

.canvas-container.col-sm-6 {
    padding: 0;
}

.canvas-container .floating-side-panel {
    border: 0;
    box-shadow: none;
    border-left: 1px solid #E3E5E8;
}

.canvas-container .floating-side-panel-header {
    border: 0;
}

.DashBuilder .left-container select {
    background: transparent;
    border: 1px solid #E3E5E8;
    background: #fff;
    margin-left: 15px;
    padding: 0 6px;
}

.growth-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px 15px;
    overflow-y: auto;
}

.growth-container {
    float: left;
    width: 100%;
    height: 100%;
}

.growth-main-wrap {
    float: left;
    width: 100%;
    height: 100%;
}

.growth-main-wrap .mt-3 {
    margin: 0 !important;
    float: left;
    width: 100%;
    height: 100%;
}

.growth-main-wrap .mt-3>.row {
    height: 100%;
}

.growth-nav {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid #EBEDF4;
    background-color: #FFFFFF;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.05);
    border-radius: 0 8px 0 0;
    padding-top: 30px;
    overflow-y: auto;
}

.growth-main-wrap .mt-3>.row .col-sm-3 {
    float: left;
    width: 100%;
    height: 100%;
}

.growth-main-wrap .mt-3>.row .col-sm-9 {
    float: left;
    width: 100%;
    height: 100%;
}

.growth-content-body {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0 0 0;
    overflow-y: auto;
}

.padding-r-20 {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.growth-nav .nav-link {
    float: left;
    width: 100%;
    height: 40px;
    background: transparent !important;
    color: var(--default-text) !important;
    padding: 0 15px;
    font-size: 14px;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
}

.growth-nav .nav-link.active {
    color: var(--default-color) !important;
    font-weight: 600;
    background: rgb(63 169 245 / 7%) !important;
    border-radius: 0;
}

.growth-nav .nav-link.active:after {
    content: "";
    width: 5px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    background: var(--default-color);
}

.growth-enabled .growth-nav {
    padding-top: 0;
}

.growth-enabled .growth-nav .floating-summary-body {
    margin: 0;
    padding: 20px;
}

.growth-enabled .growth-nav .floating-boiler-image img {
    width: 215px;
    height: 215px;
    /* border: 3px solid var(--default-color); */
    border-radius: 50%;
    padding: 3px;
}

.growth-enabled .floating-boiler-image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.growth-enabled .growth-nav .nav.flex-column.nav-pills {
    float: left;
    width: 100%
}

.full-width.growth-mod .modal-header {
    background: #ffffff;
    border-radius: 0 0 0;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.05);
    margin-bottom: 10px;
}

.full-width.growth-mod .modal-content {
    background: #ecf0f1;
}

.template-4.growth-mod .modal-body {
    height: calc(100% - 80px)
}

.growth-enable-table {
    float: left;
    width: 100%;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td {
    padding: .75rem .75rem .75rem 0;
    width: 85%;
    overflow: unset;
    white-space: normal;
    max-height: none;
}

.growth-enable-table .table.entity-dashboard-table tbody tr td:first-child {
    color: var(--default-text);
    font-size: 14px;
    line-height: 17px;
    font-weight: 600;
    width: 20%;
}

.growth-enable-table .table.entity-dashboard-table tbody tr:last-child td {
    border-bottom: 0;
}

.form-table .table.entity-dashboard-table tbody tr td:first-child {
    color: #555;
    font-size: 16px;
}

.form-table .table.entity-dashboard-table tbody tr:last-child td {
    border-bottom: 0;
}

.growth-collection-record-footer.full-width-card ul li {
    justify-content: normal;
}

.growth-collection-record-footer.full-width-card ul li h5 {
    width: 80%;
    text-align: left;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
}

.growth-collection-record-footer.full-width-card ul li p {
    width: 20%;
}

.tile-main-panel .growth-wrapper {
    padding-top: 0;
}

.bsy-modal.entity-rules {
    padding: 0;
}

.entity-rules .modal-close.ico-lib.md-close {
    right: -19px;
    top: -19px;
    background: #fff;
    border: 2px solid #767878;
    z-index: 2;
}

.entity-rules .modal-lg {
    min-width: 1170px;
    min-height: 100vh;
    margin: 0 auto;
}

.entity-rule-container {
    float: left;
    width: 100%;
    height: 100%;
}

.entity-rules .modal-body {
    border-radius: 0 0;
    padding: 0;
    height: calc(100vh - 130px);
}

.entity-rule-container>.row {
    height: 100%;
    margin: 0;
}

.entity-rule-left {
    float: left;
    width: 300px;
    height: 100%;
    padding: 0;
    margin: 0;
    background: #ecf0f1;
    border-right: 1px solid rgba(64, 83, 100, .15);
    border-radius: 6px 0 0 6px;
}

.entity-rule-left .nav-item {
    float: left;
    width: 100%;
    height: 60px;
}

.entity-rule-left .nav-pills .nav-link {
    float: left;
    width: 100%;
    height: 100%;
    color: var(--default-grey);
    display: flex;
    align-items: center;
    background: transparent;
    border-radius: 0;
    border-bottom: 1px solid rgba(64, 83, 100, .15);
    padding-right: 40px;
    position: relative;
}

.entity-rule-left .nav-pills .nav-link:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 20px;
    top: 28px;
    zoom: .9;
    transform: rotate(-90deg);
    transition: .3s ease-out;
}

.entity-rule-left .nav-pills .nav-link.active,
.entity-rule-left .nav-pills .show>.nav-link {
    background: var(--col-active);
    color: var(--default-color);
    font-weight: 600;
}

.entity-rule-left .nav-item:first-child a {
    border-radius: 6px 0 0 0;
}

.entity-rule-right {
    width: 100%;
    height: 100%;
    padding: 0;
}

.entity-rule-right-inner {
    float: left;
    width: 100%;
    height: 100%;
}

.entity-rule-right-header {
    float: left;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid rgba(64, 83, 100, .15);
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.entity-rule-right-header h5 {
    font-weight: 600;
}

.entity-rule-right-header .general-btn {
    height: 35px;
}

.entity-rule-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.entity-rule-right .tab-content {
    width: 100%;
    height: 100%;
}

.rule-right-body-inner {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.each-list-added {
    float: left;
    width: 100%;
    background: #fafafa;
    border: 1px solid #e2e5e8;
    border-radius: 5px;
    margin-bottom: 20px;
}

.each-list-head {
    float: left;
    width: 100%;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid #e2e5e8;
}

.each-list-head h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    padding-right: 35px;
    margin-bottom: 7px;
}

.each-list-head p {
    float: left;
    width: 100%;
    color: grey;
    line-height: normal;
}

.new-modal {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    background: var(--white);
    left: 0;
    top: 0;
    border-radius: 6px;
}

.new-modal-header {
    float: left;
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #e2e5e8;
}

.new-modal-header .backto-list {
    padding: 0;
    border: 0;
}

.new-modal-header .general-btn {
    height: 35px;
}

.new-modal-body {
    float: left;
    width: 100%;
    height: calc(100% - 130px);
}

.new-modal-footer {
    float: left;
    width: 100%;
    height: 70px;
    border-top: 1px solid #e2e5e8;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 20px;
}

.new-modal-left {
    float: left;
    width: calc(100% - 550px);
    height: 100%;
    border-right: 1px solid #e2e5e8;
}

.new-modal-left-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.new-modal-right {
    float: left;
    width: 550px;
    height: 100%;
    background: #ecf0f1;
    border-radius: 0 0 6px 0;
}

.new-modal-right-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.new-modal-right-inner .each-inp-box {
    width: 100%;
    margin-right: 0;
}

.new-modal-right-inner .each-inp-box>label {
    margin-bottom: 15px;
}

.new-modal-right-inner .radio-block label {
    font-size: 16px;
}

.each-list-added .content-section {
    width: 100%;
    margin: 0;
    padding: 20px;
    background: transparent;
    position: relative;
}

.each-list-added .content-section .section-info-main {
    background: transparent;
    padding: 0;
    height: auto;
}

.each-list-added .content-section:hover {
    box-shadow: none;
}

.each-list-added .form-option-block {
    background: #ccc;
    top: 35px;
    right: 21px;
}

.each-list-added .panel-option {
    right: 7px;
    top: 39px;
}

.new-modal-right-inner .assignSection {
    background: var(--white);
    padding-left: 20px;
    border: 1px solid #e3e5e8;
    margin-bottom: 0;
}

.new-modal-right-inner .assignSection .task-inp-container {
    border: 0;
}

.new-modal-right-inner .assignSection .task-inp-container .ind-task-input {
    height: auto;
    min-height: 55px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.new-modal-right-inner .assignSection .task-inp-container .tag-wrapper-bl input {
    float: left;
    height: 25px;
    max-width: 250px;
    min-width: 190px;
    border: 1px solid transparent;
    color: var(--default-text);
    font-size: 14px;
    line-height: 15px;
    padding: 0;
}

.new-modal-right-inner .assignSection .task-inp-container .ind-task-input .lb-tx {
    top: 19px;
}

.new-modal-right-inner .rightdateinput .assignInputdesc {
    margin-bottom: 0;
}

.new-modal-right-inner .rightdateinput .assignInputdesc {
    height: auto;
}

.entity-add-panel .select-chk-block.task-select {
    padding: 0;
    margin-top: 20px;
}

.entity-add-panel .switch-mode.radio-wrapper {
    margin-top: 30px;
    margin-bottom: 10px;
}

.entity-add-panel .select-box select {
    height: 45px;
}

.switch-mode.entity-switch .radio-block {
    margin: 0;
    height: 36px;
    display: flex;
    align-items: center;
    padding: 0 18px;
    background: #fafafa;
    border: 1px solid #e4e4e4;
    margin-right: 10px;
    border-radius: 5px;
}

.switch-mode.entity-switch .radio-block label:before {
    content: none;
}

.switch-mode.entity-switch .radio-block input:checked+label:after {
    content: none;
}

.switch-mode.entity-switch .radio-block label {
    color: var(--default-grey);
    font-size: 15px;
    padding-left: 0;
}

.switch-mode.entity-switch .radio-block.active {
    background: var(--default-color);
}

.switch-mode.entity-switch .radio-block.active label {
    color: var(--white);
}

/*------ Entity Details End ------*/

/*------ Task Pool ------*/

.content-main {
    float: left;
    width: 100%;
}

.content-section {
    float: left;
    width: calc((100% / 4) - 14px);
    margin-right: 18px;
    margin-bottom: 18px;
    transition: .4s ease-out;
    cursor: pointer;
}

.content-section:hover {
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.pool-grid .content-section {
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 2px;
    background-color: #FFFFFF;
}

.content-click {
    float: left;
    width: 100%;
    height: 100%;
}

.section-pool-image {
    float: left;
    width: 100%;
    height: 160px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-pool-image:before {
    content: "";
    background-color: rgba(0, 0, 0, 0.17);
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px 3px 0 0;
}

.section-pool-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 3px 3px 0 0;
}

.section-pool-info-main {
    float: left;
    width: 100%;
    height: 70px;
    background: #fff;
    padding: 13px 20px;
    border-radius: 0 0 3px 3px;
}

.section-pool-info h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    margin-bottom: 5px;
    color: var(--default-text);
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 90%;
    transition: .4s ease-out;
}

.content-section:hover .section-pool-info h5 {
    color: var(--default-color);
}

.section-pool-info p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 19px;
    color: var(--default-grey);
    letter-spacing: normal;
    overflow: hidden;
}

.content-section:nth-child(4n) {
    margin-right: 0;
}

/*------ Task Pool End ------*/

/*------ Pool ------*/

.pool-task-ico:before {
    content: "";
    background: var(--sprite-two) no-repeat -199px -203px;
    width: 20px;
    height: 18px;
    margin-right: 10px;
}

.pool-task-ico.active:before,
.pool-task-ico:hover:before {
    background-position: -199px -225px;
}

.pool-mem-ico:before {
    content: "";
    background: var(--sprite-two) no-repeat -265px -163px;
    width: 21px;
    height: 15px;
    margin-right: 10px;
}

.pool-mem-ico.active:before,
.pool-mem-ico:hover:before {
    background-position: -265px -185px;
}

.project-tab-rise .data-holder.wf-hold {
    height: calc(100vh - 152px);
    padding: 0 20px;
    overflow-y: auto;
}

.users-wrap .team-wrapper {
    height: 100%;
}

.wf-bottom .detail-tab li {
    width: 16.66%;
}

.wf-bottom .detail-tab li {
    width: 16.66%;
}

.wf-bottom .detail-tab {
    width: 100%;
}

.wf-bottom .form-detail-bottom-left {
    float: left;
    width: 100%;
}

.wf-bottom .detail-tab li a {
    justify-content: center;
}

.project-tab-rise .data-holder.wf-hold.align-max-height.set-pool {
    background: #fff;
    border-top: 1px solid #E3E5E8;
    padding: 0;
}

.pool-settings-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.pool-settings-wrapper .same-line-option .task-inp-container {
    float: left;
    width: 100%;
    padding: 0;
    display: block;
}

.pool-settings-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #E3E5E8;
}

.pool-settings-header h5 {
    font-size: 16px;
    font-weight: 600;
    color: var(--default-text);
}

.pool-settings-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
}

.pool-settings-body-wrapper {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.pool-settings-body-wrapper h5 {
    float: left;
    width: 100%;
    color: #444;
    margin-bottom: 20px;
}

.pool-settings-body-wrapper .radio-wrapper {
    margin-top: 0;
}

.pool-settings-body-wrapper .radio-wrapper .radio-block label {
    color: var(--default-grey);
    font-size: 14px;
}

.user-arrange-block {
    float: left;
    width: 100%;
    border: 1px solid #E3E5E8;
    background-color: rgba(63, 169, 245, 0.05);
    color: var(--default-text);
    font-size: 14px;
    font-weight: 500;
    padding: 20px;
    height: auto;
    display: block;
    min-height: auto;
    background-image: url(images/line-texture.png);
    max-height: calc(100% - 74px);
    overflow-y: auto;
}

.ind-user-arrange {
    float: left;
    width: 100%;
    background: #fff;
    border: 1px dashed rgb(29, 169, 249);
    padding: 15px 20px;
    margin-bottom: 10px;
    padding-right: 60px;
    position: relative;
}

.user-arrange-thumb {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

.user-arrange-thumb img {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}

.user-arrange-details {
    float: left;
    width: calc(100% - 50px);
    min-height: 40px;
}

.user-arrange-details h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    color: #444;
    font-weight: 600;
    margin-bottom: 4px;
}

.user-arrange-details p {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    font-weight: 400;
    margin-bottom: 4px;
}

.ind-user-arrange:after {
    content: "";
    background: var(--sprite-one) no-repeat -233px -334px;
    width: 8px;
    height: 13px;
    position: absolute;
    right: 27px;
    top: calc(50% - 6.5px);
}

.ind-user-arrange:hover {
    border: 1px solid rgb(29, 169, 249);
    cursor: grab;
}

.list-with-icon {
    padding-left: 30px;
}

.pool-icon:before {
    content: "";
    background: var(--sprite-one) no-repeat -368px -471px;
    width: 13px;
    height: 12px;
    display: inline-block;
    zoom: 1.7;
    -moz-transform: scale(1.8);
    -moz-transform-origin: 0 0;
    position: absolute;
    left: 0;
    top: 2px;
}

.pool-details .wf-detail-top-left h5 {
    margin-bottom: 0;
}

.scrollBar-pool {
    height: calc(100% - 145px) !important;
}

.set-pool .user-arrange-details p {
    margin-bottom: 0;
}

.set-pool .user-arrange-details {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.form-detail-panel.pool-details {
    border-right: 0;
    border-left: 0;
    border-top: 0;
}

.project-tab-rise .data-holder.wf-hold.align-max-height.pool-user {
    padding: 0 20px;
}

.pool-user-ico:before {
    background-position: -265px -163px;
    width: 21px;
    height: 15px;
}

.pool-user-ico.active:before,
.pool-user-ico:hover:before {
    background-position: -265px -185px;
}

.pool-settings-body-wrapper .input-block {
    float: left;
    max-width: 320px;
}

.pool-settings-body-wrapper .input-block input {
    float: left;
    width: 100%;
    height: 40px;
    border: 1px solid #E3E5E8;
    border-radius: 5px;
    padding: 0 15px;
    font-size: 14px;
}

.pool-task-listing .radio-wrapper .radio-block label {
    font-size: 14px;
}

/*------ Pool End ------*/

/*------ Project ------*/

.icon-in.icon-project-in {
    background-position: -350px -403px;
    width: 13px;
    height: 17px;
}

.project-icon {
    margin-right: 22px;
}

.icon-in.icon-task-outlined {
    background-position: -372px -355px;
    width: 17px;
    height: 17px;
}

.task-in-icon {
    margin-right: 8px;
}

.task-box {
    display: flex;
    align-items: center;
}

.project-subtext {
    float: left;
    width: 100%;
    color: #b6c5c9;
    font-size: 13px;
    line-height: 15px;
    max-height: 15px;
    overflow: hidden;
}

.task-input-box--new {
    float: left;
    width: 100%;
    height: 36px;
    border: none;
    padding: 0;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    background: #ffff;
    border-bottom: 1px solid #ECEFF1;
    border-radius: 0;
}

.task-textarea--new {
    float: left;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #ECEFF1;
    resize: none;
    min-height: 52px;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    background: #ffff;
    padding: 10px 0 0 0;
    border-radius: 0;
}

.task-tg .task-input-block.text-input {
    height: 120px;
    margin-bottom: 0;
}

.task-tg .task-input-block.text-input textarea {
    height: 100%;
}

.react-datepicker__input-container:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 0;
    top: calc(50% - 4px);
    right: 12px;
}

.pj-first-left-section {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.pj-first-left-section p {
    margin-left: 22px;
    flex-shrink: 0;
    max-width: 150px;
    min-width: 150px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.pj-first-left-section h5 {
    float: left;
    color: var(--default-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    margin-left: 85px;
    transition: .3s ease-out;
    flex-shrink: 0;
    max-width: 50%;
    max-height: 14px;
    overflow: hidden;
}

.phase-table .pj-first-left-section h5 {
    margin-left: 0px;
}

.pj-first-left-section.vertical-desc h5,
.pj-first-left-section.vertical-desc p {
    margin-left: 0px;
}

.bsy-table tbody tr:last-child td {
    border-bottom: 1px solid #e4e4e4;
}

.close-bar {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    justify-content: flex-end;
    padding: 0 20px;
}

.close-bar button {
    height: 30px;
}

.table-tab {
    padding: 0;
}

.table-tab .content-bl-header {
    padding: 0 20px;
    margin-bottom: 0;
    height: 45px;
}

.table-tab .static-mode-block {
    height: calc(100% - 45px);
    overflow-y: auto;
}

.project-name.pro-ico {
    padding-left: 35px;
}

.project-name.role-ico:before {
    background: var(--sprite-two) no-repeat -320px -301px;
    width: 18px;
    height: 18px;
    top: 5px;
}

.project-name.phase-ico:before {
    background: var(--sprite-two) no-repeat -341px -301px;
    width: 19px;
    height: 18px;
    top: 5px;
}

.project-name:before {
    content: "";
    background: var(--sprite-one) no-repeat -350px -403px;
    width: 13px;
    height: 17px;
    position: absolute;
    top: 0;
    left: 0;
}

.proj-new:before {
    content: "";
    background: var(--sprite-two) no-repeat -208px -362px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
    top: 3px;
}

.proj-in-pro:before,
.proj-inprogress:before {
    content: "";
    background: var(--sprite-two) no-repeat -228px -362px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
}

.proj-done:before {
    content: "";
    background: var(--sprite-two) no-repeat -188px -362px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
}

.proj-task {
    position: relative;
    padding-left: 25px;
}

.proj-task:before {
    background-position: -372px -355px;
    width: 17px;
    height: 17px;
    position: absolute;
    left: 0;
    top: calc(50% - 8.5px);
}

.project-name:hover h5 {
    color: var(--btn-color);
}

.pj-edit-ico {
    width: 14px;
    height: 14px;
    position: relative;
    top: 2px;
    display: none;
}

.bsy-table tbody tr:hover .high-widthed .pj-edit-ico {
    display: inline-block;
}

.pj-edit-ico:before {
    content: "";
    width: 14px;
    height: 14px;
    background: var(--sprite-one) no-repeat -419px -124px;
    display: inline-block;
    margin-left: 25px;
    position: absolute;
    left: 0;
    top: 0;
}

.ibt-drop .menu-section h5 {
    float: left;
    width: 100%;
    height: 44px;
    font-size: 14px;
    color: var(--sub-category-head);
    font-weight: 500;
    display: flex;
    align-items: center;
    margin-bottom: 0;
    position: relative;
}

.ibt-drop .menu-section h5:hover {
    color: #fff;
}

.ibt-drop .menu-section h5:after {
    content: none;
}

.pj-metrics-ico:before {
    background-position: -48px -54px;
    width: 18px;
    height: 18px;
    top: calc(50% - 9px);
    opacity: .5;
}

.pj-circle-ico:before {
    background-position: -48px -133px;
    width: 19px;
    height: 19px;
    top: calc(50% - 9.5px);
    opacity: .5;
}

.pj-phase-ico:before {
    background-position: -16px -133px;
    width: 19px;
    height: 19px;
    top: calc(50% - 9.5px);
}

.pj-dataroom-ico:before {
    background-position: -49px -214px;
    width: 17px;
    height: 17px;
    top: calc(50% - 8.5px);
    opacity: .5;
}

.pj-com-ico:before {
    background-position: -50px -256px;
    width: 16px;
    height: 16px;
    top: calc(50% - 8px);
    opacity: .5;
}

.pj-nm-ico:before {
    background-position: -18px -295px;
    width: 18px;
    height: 17px;
    top: calc(50% - 8.5px);
}

.pj-notf-ico:before {
    background-position: -49px -334px;
    width: 18px;
    height: 18px;
    top: calc(50% - 9px);
    opacity: .5;
}

.pj-set-ico:before {
    background-position: -48px -374px;
    width: 18px;
    height: 18px;
    top: calc(50% - 9px);
    opacity: .5;
}

.pj-sh-ico:before {
    background-position: -48px -175px;
    width: 19px;
    height: 16px;
    top: calc(50% - 8px);
    opacity: .5;
}

.pj-tk-ico:before {
    background-position: -16px -95px;
    width: 19px;
    height: 16px;
    top: calc(50% - 8px);
}

.ibt-drop .menu-section {
    padding: 0 0 0 20px;
    cursor: pointer;
}

.ibt-drop .menu-section.active {
    padding: 15px 0px 15px 20px;
}

.ibt-drop .menu-section.active h5 {
    height: auto;
    color: #fff;
}

.ibt-drop .ind-menu-section {
    padding-left: 30px;
    margin-top: 12px;
}

.ibt-drop .ind-menu-section li a {
    line-height: 36px;
    float: left;
    color: var(--sub-category-head);
    font-size: 14px;
    position: relative;
    transition: .3s ease-out;
}

.ibt-drop .ind-menu-section li .active {
    color: #ffffff;
}

.ibt-drop .pj-ov-ico.active:before {
    background-position: -6px -303px;
}

.ibt-drop .pj-board-ico.active:before {
    background-position: -32px -301px;
}

.ibt-drop .pj-task-ico.active:before {
    background-position: -58px -302px;
}

.ibt-drop .pj-team-ico.active:before {
    background-position: -83px -304px;
}

.ibt-drop .pj-chat-ico.active:before {
    background-position: -108px -302px;
}

.ibt-drop .pj-file-ico.active:before {
    background-position: -158px -303px;
}

.ibt-drop .pj-note-ico.active:before {
    background-position: -181px -303px;
}

.ibt-drop .pj-info-ico.active:before {
    background-position: -206px -301px;
}

.ibt-drop .pj-issue-ico.active:before {
    background-position: -230px -301px;
}

.ibt-drop .pj-metrics-ico:hover:before,
.ibt-drop .pj-metrics-ico.active:before,
.ibt-drop .menu-section.active .pj-metrics-ico:before {
    background-position: -48px -54px;
    opacity: 1;
}

.ibt-drop .pj-circle-ico:hover:before,
.ibt-drop .pj-circle-ico.active:before,
.ibt-drop .menu-section.active .pj-circle-ico:before {
    background-position: -48px -133px;
    opacity: 1;
}

.ibt-drop .pj-phase-ico:hover:before,
.ibt-drop .pj-phase-ico.active:before,
.ibt-drop .menu-section.active .pj-phase-ico:before {
    background-position: -16px -133px;
}

.ibt-drop .pj-dataroom-ico:hover:before,
.ibt-drop .pj-dataroom-ico.active:before,
.ibt-drop .menu-section.active .pj-dataroom-ico:before {
    background-position: -49px -214px;
}

.ibt-drop .pj-com-ico:hover:before,
.ibt-drop .pj-com-ico.active:before,
.ibt-drop .menu-section.active .pj-com-ico:before {
    background-position: -50px -256px;
    opacity: 1;
}

.ibt-drop .pj-nm-ico:hover:before,
.ibt-drop .pj-nm-ico.active:before,
.ibt-drop .menu-section.active .pj-nm-ico:before {
    background-position: -50px -295px;
}

.ibt-drop .pj-notf-ico:hover:before,
.ibt-drop .pj-notf-ico.active:before,
.ibt-drop .menu-section.active .pj-notf-ico:before {
    background-position: -49px -334px;
    opacity: 1;
}

.ibt-drop .pj-set-ico:hover:before,
.ibt-drop .pj-set-ico.active:before,
.ibt-drop .menu-section.active .pj-set-ico:before {
    background-position: -48px -374px;
    opacity: 1;
}

.ibt-drop .pj-sh-ico:hover:before,
.ibt-drop .pj-sh-ico.active:before,
.ibt-drop .menu-section.active .pj-sh-ico:before {
    background-position: -48px -175px;
    opacity: 1;
}

.ibt-drop .pj-tk-ico:hover:before,
.ibt-drop .pj-tk-ico.active:before,
.ibt-drop .menu-section.active .pj-tk-ico:before {
    background-position: -48px -95px;
}

.ibt-header {
    float: left;
    width: 100%;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    position: relative;
    z-index: 9;
}

.ibt-header-top {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid transparent;
}

.ibt-header-bottom {
    float: left;
    width: 100%;
    display: none;
    padding: 0px 20px 20px;
}

.ibt-header-top-left {
    float: left;
    width: 80%;
    height: 70px;
    display: flex;
    align-items: center;
}

.ibt-header-back-btn {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    color: #2C3137;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
}

.ibt-header-back-btn:before {
    background-position: -59px -158px;
    width: 14px;
    height: 13px;
    margin-right: 15px;
}

.inprog {
    height: 20px;
    width: 74px;
    float: left;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    background: #00B35C;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    margin: 0 12px;
}

.live {
    float: left;
    height: 20px;
    width: 37.83px;
    background-color: #4FD164;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    margin: 0 10px 0 15px;
}

.economy-tag {
    float: left;
    height: 20px;
    min-width: 42.04px;
    border: 1px solid #00A2F2;
    background-color: #FFFFFF;
    color: #00A2F2;
    font-size: 12px;
    line-height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    padding: 0 6px;
}

.since-date {
    color: #999999;
    font-size: 14px;
    line-height: 22px;
    margin: 0 10px;
    display: none;
}

.down-arrow-ico:before {
    background-position: -394px -17px;
    width: 22px;
    height: 13px;
}

.expands .ibt-header-bottom,
.expands .since-date {
    display: block;
}

.ibt-header-bottom-left {
    float: left;
    width: 204px;
    height: 204px;
    margin-right: 22px;
}

.ibt-header-bottom-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ibt-header-bottom-right {
    float: left;
    width: calc(100% - 226px);
}

.ibt-header-bottom-right-top {
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.ibt-header-details {
    float: left;
    height: 60px;
    display: flex;
    align-items: center;
    list-style-type: none;
    border: 1px solid #D1D1D1;
    padding: 0 23px;
}

.ibt-header-details li {
    float: left;
    margin-right: 26px;
    padding-right: 26px;
    border-right: 1px solid #D1D1D1;
}

.ibt-header-details li h5 {
    color: #2C3137;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.ibt-header-details li p {
    color: #999999;
    font-size: 14px;
    line-height: 16px;
    border: 1px;
}

.ibt-header-details li:last-child {
    border-right: 0;
    margin-right: 0;
    padding-right: 0;
}

.ibt-header-bottom-right-bottom {
    float: left;
    width: 100%;
}

.ibt-header-bottom-right-bottom-left {
    float: left;
    width: 100%;
    margin-bottom: 17px;
}

.ibt-header-bottom-right-bottom-right {
    float: left;
    width: 50%;
}

.project-source-header {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
}

.ibt-header-bottom-right-bottom-left p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    color: #999999;
}

.ibt-header-bottom-right-bottom-right .sponsor-header {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    margin-bottom: 18px;
}

.ibt-header-bottom-right-bottom-right-left {
    float: left;
    width: 100%;
}

.ibt-header-bottom-right-bottom-right-right {
    float: left;
    width: 50%;
}

.share-prop {
    float: left;
    width: 100%;
    position: relative;
    padding-left: 36px;
}

.share-prop li {
    float: left;
    width: 100%;
    margin-bottom: 9px;
    list-style-type: none;
}

.share-prop li h5 {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 5px;
}

.share-prop li p {
    float: left;
    width: 100%;
    color: #A8A8A8;
    font-size: 14px;
    line-height: 16px;
}

.share-prop-span {
    content: "";
    height: 28px;
    width: 28px;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 2px;
    border: 1px solid #00A2F2;
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00A2F2;
}

.share-prop-span.extra {
    border-color: #F8C822;
    color: #F8C822;
}

.energy:before {
    background-position: -228px -173px;
    width: 19px;
    height: 19px;
    margin-right: 7px;
    flex-shrink: 0;
}

.cook:before {
    background-position: -250px -174px;
    width: 18px;
    height: 17px;
    margin-right: 7px;
    flex-shrink: 0;
}

.dollar:before {
    background-position: -271px -174px;
    width: 18px;
    height: 17px;
    margin-right: 7px;
    flex-shrink: 0;
}

.medical:before {
    background-position: -292px -173px;
    width: 19px;
    height: 19px;
    margin-right: 7px;
    flex-shrink: 0;
}

.home:before {
    background-position: -314px -174px;
    width: 18px;
    height: 17px;
    margin-right: 7px;
    flex-shrink: 0;
}

.water:before {
    background-position: -335px -174px;
    width: 18px;
    height: 17px;
    margin-right: 7px;
    flex-shrink: 0;
}

.bev:before {
    background-position: -356px -173px;
    width: 19px;
    height: 19px;
    margin-right: 7px;
    flex-shrink: 0;
}

.expands .down-arrow-ico:before {
    transform: rotate(180deg);
}

.shw-mr {
    color: #00A2F2;
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
}

.down-arrow-ico {
    background: transparent;
    border: 0;
    padding: 0;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.ibt-header-bottom-right-left {
    float: left;
    width: 80%;
    padding-right: 20px;
}

.ibt-header-bottom-right-right {
    float: left;
    width: 20%;
}

.sponsor-header {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    margin-bottom: 17px;
}

.ibt-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    overflow-y: auto;
}

.expands .ibt-body {
    height: calc(100% - 242px);
}

.ibt-rating {
    float: left;
    width: 100%;
    margin: 20px 0;
}

.ind-ibt-rating {
    float: left;
    width: 100%;
    height: 90px;
    background-color: #FFFFFF;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    margin-right: 17px;
}

.ind-ibt-rating:last-child {
    margin-right: 0;
}

.ibt-rating-top {
    float: left;
    width: 100%;
    border-bottom: 1px solid #EEEEEE;
}

.ibt-rating-top h5 {
    float: left;
    width: 100%;
    color: #686868;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    padding: 13px 18px;
}

.ibt-rating-bottom {
    float: left;
    width: 100%;
    height: 45px;
    display: flex;
    align-items: center;
    padding: 0 18px;
}

.ibt-rating-bottom h5 {
    float: left;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
    display: flex;
    align-items: center;
}

.ibt-rate-star,
.rate-star {
    float: left;
    margin-left: 10px;
}

.ibt-rate-star li,
.rate-star li {
    float: left;
    list-style-type: none;
    background: var(--sprite-three) no-repeat -99px -15px;
    width: 15px;
    height: 15px;
    margin-right: 2px;
}

.ibt-rate-star .active,
.rate-star .active {
    background: var(--sprite-three) no-repeat -79px -16px;
}

.ibt-progress-table {
    float: left;
    width: 100%;
    background-color: #FFFFFF;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

.ibt-progress-table-header {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid #EEEEEE;
}

.ibt-progress-table-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.ibt-table thead tr th {
    color: var(--default-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 19px;
    border-bottom: 1px solid transparent;
    padding: 10px 20px;
    border-top: 0;
}

.ibt-table tbody tr td {
    color: var(--default-text);
    font-size: 14px;
    border-top: 0;
    line-height: normal;
    padding: 11px 20px;
}

.ibt-table tbody tr:nth-child(odd) td {
    background: #FAFBFC;
}

.ibt-table .progress-wrapper .progress-bar {
    background: #A4DEA1;
}

.ibt-table {
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.ibt-progress-table-body {
    float: left;
    width: 100%;
    height: calc(100% - 55px);
}

.ibt-table tbody tr td.ontime {
    color: var(--default-color);
}

.ibt-table .progress-wrapper h5 {
    min-width: 215px;
}

.ibt-table thead tr th:first-child {
    width: 30%;
}

.ibt-progress-table-body-left {
    float: left;
    width: 50%;
}

.ibt-progress-table-body-right {
    float: left;
    width: 50%;
}

.graph-tag {
    float: left;
    width: 100%;
}

.graph-tag li {
    float: left;
    color: #999FA0;
    font-size: 12px;
    line-height: 40px;
    list-style-type: none;
    margin-right: 40px;
}

.red-circle:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid #FC4850;
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 6px;
}

.yellow-circle:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid #F8C822;
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 6px;
}

.blue-circle:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid var(--default-color);
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 6px;
}

.green-circle:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid #90C418;
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 6px;
}

.ibt-graph {
    float: left;
    width: 100%;
    height: 100%;
    text-align: center;
}

.ibt-split-table {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    display: flex;
}

.ibt-split-table .ibt-progress-table {
    float: left;
    width: calc((100% / 2) - 10px);
    margin-right: 20px;
    margin-bottom: 0;
}

.ibt-split-table .ibt-progress-table:last-child {
    margin-right: 0;
}

.blue-lister {
    float: left;
    width: 100%;
    margin-right: 20px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    flex-shrink: 0;
}

.blue-lister:last-child {
    margin-right: 0;
}

.blue-list-header {
    float: left;
    width: 100%;
    height: 50px;
    background: #00A2F2;
}

.blue-list-header-left {
    float: left;
    width: 60px;
    height: 100%;
    border-right: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blue-list-header-left h5 {
    float: left;
    color: #FFFFFF;
    font-size: 30px;
    font-weight: 200;
    line-height: 19px;
}

.blue-list-header-right {
    float: left;
    width: calc(100% - 60px);
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 17px;
}

.blue-list-header-right h5 {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.blue-list-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    min-height: 265px;
    padding: 10px 20px;
}

.blue-single-list {
    float: left;
    width: 100%;
    list-style-type: none;
}

.blue-single-list li {
    float: left;
    width: 100%;
    position: relative;
    color: var(--default-text);
    font-size: 14px;
    line-height: 24px;
    padding-left: 20px;
    margin-bottom: 5px;
}

.blue-single-list li:before {
    content: "";
    height: 8px;
    width: 8px;
    background-color: #00A2F2;
    position: absolute;
    left: 0;
    top: 7px;
}

.blue-single-list li:last-child {
    margin-bottom: 0px;
}

.ibt-drop .menu-section.no-drop-val.active {
    background: var(--theme-second);
}

.ibt-drop .menu-section h5.active {
    color: #fff;
}

.ibt-graph img {
    float: left;
    width: 100%;
}

.ibt-goal-block {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.ibt-goal-block h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 2px;
    font-weight: 600;
    margin-bottom: 15px;
}

.ibt-goal-block ul li {
    float: left;
    width: 73px;
    height: 73px;
    margin-right: 20px;
}

.ibt-goal-block ul li img {
    float: left;
    width: 100%;
    height: 100%;
}

.ind-small-tab-dashboard {
    float: left;
    width: 100%;
    margin-right: 17px;
    margin-bottom: 17px;
    padding: 15px 18px 20px 18px;
    height: 90px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.filter-wrapper-ibt-metrics {
    float: left;
    width: 100%;
    padding: 18px 20px;
}

.filter-wrapper-ibt-metrics .float-panel-header {
    background: transparent;
    border: 0;
    padding: 0;
    height: auto;
}

.metric-container {
    float: left;
    width: 100%;
    height: calc(100% - 76px);
}

.metric-item {
    float: left;
    width: calc((100% / 2) - 10px);
    margin-right: 20px;
    margin-bottom: 20px;
    height: 200px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.metric-item:nth-child(2n) {
    margin-right: 0;
}

.metric-head {
    float: left;
    width: 100%;
    height: 40px;
    border-bottom: 1px solid #EEEEEE;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.metric-head .project-source-header {
    margin: 0;
    color: #999999;
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
}

.metric-content {
    float: left;
    width: 100%;
    min-height: calc(100% - 85px);
    padding: 15px 20px;
    display: flex;
    align-items: center;
}

.metric-detail {
    float: left;
    width: 70%;
}

.sdg {
    float: left;
    height: 20px;
    min-width: 48px;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    border-radius: 2px;
    margin-bottom: 12px;
    background: #b1b1cd;
    margin-right: 6px;
}

.sdg:last-child {
    margin-right: 0;
}

.metric-detail h5 {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 14px;
    font-weight: 600;
    line-height: 17px;
    margin-bottom: 5px;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 90%;
    white-space: nowrap;
}

.metric-detail p {
    float: left;
    width: 100%;
    color: #999999;
    font-size: 12px;
    line-height: 18px;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 90%;
    white-space: nowrap
}

.metric-detail-right {
    float: left;
    width: 30%;
}

.metric-detail-right h3 {
    float: left;
    width: 100%;
    color: #999999;
    font-size: 35px;
    line-height: 27px;
    text-align: right;
    font-weight: 300;
    margin-bottom: 10px;
}

.metric-detail-right h5 {
    float: left;
    width: 100%;
    float: left;
    width: 100%;
    color: #999999;
    font-size: 18px;
    line-height: 27px;
    text-align: right;
}

.metric-footer {
    font-size: large;
    width: 100%;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #EEEEEE;
    padding: 0 20px;
}

.metric-footer p {
    float: left;
    color: #2C3137;
    font-size: 12px;
    line-height: 18px;
}

.metric-footer .footer-date {
    color: #999999;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.tag-code-block {
    float: left;
    width: 100%;
}

.sdg.green {
    background: #259537;
}

.sdg.orange {
    background: #E68D3C;
}

.sdg.brown {
    background: #76481A;
    color: #fff !important;
}

.sdg.yellow {
    background: #F8C822;
}

.metric-item .graph-tag {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.metric-item .ibt-graph {
    height: calc(100% - 40px);
}

.metric-item .ibt-graph img {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0 20px;
}

.sdg.red {
    background: #E64444;
}

.split-drop-box {
    float: left;
    width: 100%;
}

.split-drop-box .select-box {
    float: left;
    width: calc((100% /2) - 10px);
    margin-right: 20px;
}

.split-drop-box .select-box:last-child {
    margin-right: 0;
}

.split-drop-box .select-box select {
    padding: 0 40px 0 20px;
}

.ind-drop-box .select-box select {
    padding: 0 40px 0 20px;
}

.date-mod .modal-body {
    padding: 0;
}

.date-mod .datepicker {
    width: 100%;
    border: 0;
}

.project-container {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    padding: 20px 0;
    overflow-y: auto;
}

.ind-project-list {
    float: left;
    width: calc((100% / 2) - 8px);
    background: #ffffff;
    margin-right: 15px;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    margin-bottom: 15px;
    cursor: pointer;
}

.ind-project-list:nth-child(2n) {
    margin-right: 0;
}

.project-list-header {
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #EEEEEE;
    padding: 0 20px;
    cursor: auto;
}

.project-list-header h5 {
    float: left;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 16px;
    display: flex;
    align-items: center;
}

.more-sym {
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
    width: 20px;
    height: 20px;
}

.more-sym:before {
    background-position: -7px -113px;
    width: 4px;
    height: 18px;
    transform: rotate(90deg);
}

.project-list-body {
    float: left;
    width: 100%;
    padding: 20px;
    border-bottom: 1px solid #EEEEEE;
}

.project-list-tag-block {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.pj-tag {
    float: left;
    width: auto;
    height: 20px;
    background: var(--default-color);
    color: #fff;
    font-size: 12px;
    line-height: 14px;
    padding: 0 10px;
    display: flex;
    align-items: center;
    border-radius: 3px;
}

.project-list-desc-block {
    float: left;
    width: 100%;
}

.project-list-desc-block h5 {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 20px;
    font-weight: 600;
    line-height: 17px;
    margin-bottom: 10px;
}

.project-list-desc-block p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 18px;
    min-height: 36px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.desc-header {
    color: #999999;
}

.project-list-footer {
    float: left;
    width: 100%;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.project-list-footer h5 {
    float: left;
    color: #2C3137;
    font-size: 12px;
    line-height: 18px;
}

.project-list-footer p {
    float: left;
    color: #999999;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.project-container .filter-wrapper-ibt-metrics {
    padding-top: 0;
}

.cycle-container {
    float: left;
    width: 100%;
    height: calc(100% - 58px);
}

.ind-cycle-block {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    border: 1px solid #E3E5E8;
    border-bottom: 0;
}

.cycle-header {
    float: left;
    width: 100%;
    height: 50px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #E3E5E8;
}

.ind-cycle-header-right {
    float: left;
    display: flex;
    align-items: center;
    margin-left: 50px;
}

.ind-cycle-header-right p {
    float: left;
    color: #686868;
    font-size: 12px;
    line-height: 19px;
}

.ind-cycle-header-right .new-tag {
    width: auto;
    height: 16px;
    color: #FFFFFF;
    font-size: 10px;
    line-height: 11px;
    padding: 0 5px;
}

.cycle-header-left h5 {
    float: left;
    width: 100%;
    color: #2E3243;
    font-size: 14px;
    line-height: 19px;
    font-weight: 600;
}

.cycle-body .ind-project-list {
    margin: 0;
    width: 50%;
    box-shadow: none;
    border-right: 1px solid #E3E5E8;
}

.cycle-body .project-list-footer {
    border-bottom: 1px solid #E3E5E8;
}

.cycle-body .project-list-header,
.cycle-body .project-list-body {
    border-color: #E3E5E8;
}

.project-container .filter-wrapper {
    margin-bottom: 20px;
    padding: 0 20px;
}

.with-pad .split-drop-box .select-box select {
    padding-left: 0;
}

.with-pad .new-task-input.text-input textarea {
    padding-top: 0;
    border-bottom: 1px solid #ECEFF1;
}

.top-bot-pad {
    padding: 20px 0;
}

.ibt-body .task-tab .card {
    border: 1px solid transparent;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

.main-head-right {
    float: left;
    width: 50%;
    display: flex;
    align-items: center;
    padding-left: 20px;
    height: 20px;
}

.head-section-mid {
    float: left;
    width: 20%;
    color: #565656;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
}

.left-head .ind-task-list-center {
    width: calc(100% - 145px);
}

.head-section-mid:last-child {
    text-align: right;
}

.right-head,
.left-head {
    float: left;
    width: 50%;
}

.right-head-data {
    float: left;
    width: 20%;
    color: #B6C5C9;
    font-size: 12px;
    line-height: 14px;
}

.right-head {
    padding-left: 20px;
}

.right-head-data .comment-info {
    margin-right: 15px;
}

.right-head-data:last-child {
    text-align: right;
}

.mob-only {
    display: none;
}

.main-head-right-block {
    float: left;
}

.project-cycle-info li {
    float: left;
    margin-left: 40px;
}

.project-cycle-info li {
    float: left;
    color: #686868;
    font-size: 12px;
    line-height: 19px;
    text-align: right;
}

.fb {
    font-weight: 600;
}

.proj-tag {
    background-color: #939393;
    color: #FFFFFF;
    font-size: 10px;
    line-height: 12px;
    padding: 2px 5px;
    border-radius: 3px;
}

.proj-prog {
    background-color: #F8C822;
}

.proj-ontrack {
    background-color: #4FD164;
}

.project-cycle-info-list .ind-task-list-left {
    width: auto;
}

.ind-task-list.project-cycle-info-list {
    border: 1px solid transparent;
}

.ind-task-list.project-cycle-info-list:before {
    content: "";
    background: var(--sprite-one) no-repeat -430px -335px;
    width: 7px;
    height: 10px;
    position: absolute;
    left: 17px;
    top: calc(50% - 5px);
}

.ind-task-list.project-cycle-info-list {
    position: relative;
}

.task-tab .card-body .project-cycle-info-list .ind-task-list-click {
    padding-left: 40px;
}

.project-cycle-info-list .ind-task-list-left .progress-wrapper h5 {
    color: var(--default-text);
    font-size: 14px;
    line-height: 40px;
}

.project-cycle-info-list .ind-task-list-left .progress-wrapper .progress {
    width: 150px;
}

.project-cycle-info-list .ind-task-list-left .progress-wrapper p {
    color: #B1C1D2;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.33px;
    line-height: 14px;
    margin-left: 6px;
}

.status-mark {
    color: var(--default-text);
    font-size: 14px;
    line-height: 40px;
}

.task-tab .card-body .project-cycle-info-list:nth-child(even) {
    background: #FAFBFC;
}

.task-tab .card-body .project-cycle-info-list.ind-task-list:hover {
    border: 1px solid transparent;
    border-left: 0;
    border-right: 0;
    box-shadow: 0 3px 8px -3px rgba(0, 0, 0, 0.1);
    position: relative;
    z-index: 9;
}

.task-tab .card-header.proj-card-header {
    padding-left: 40px;
}

.task-tab .proj-card-header .btn-link:before {
    left: -24px;
}

.task-tg .task-input-block .task-input-box::placeholder,
.task-tg .multi-select-block .selectize-input>input::placeholder,
.task-tg .select-box select {
    color: var(--default-grey);
}

.project-option-block .panel-option {
    top: 20px;
    right: -12px;
}

.project-option-block {
    position: relative;
}

.task-tab.project-cycle-tab .card-body .ind-task-list-click {
    padding: 9px 20px 0 40px;
}

.ind-task-group-header {
    float: left;
    width: 100%;
    padding: 0 20px 0 40px;
    float: left;
    height: 40px;
    background: #fff;
    border: 1px solid #e4e5e9;
    border-bottom: 0;
    cursor: pointer;
    border-right: 0;
    border-left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ind-task-group-header h5 {
    float: left;
    color: #565656;
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
}

.top-bot-pad .ind-task-group-header {
    height: 50px;
}

.top-bot-pad .ind-task-group-header {
    height: 50px;
}

.ind-task-group-header .proj-btn {
    height: 25px;
}

.dashboard-build-ico:before {
    background-position: -263px -449px;
    width: 17px;
    height: 17px;
    display: inline-block;
    margin-right: 7px;
    top: calc(50% - 8.5px);
}

.dashboard-build-ico:hover:before {
    background-position: -263px -427px;
}

.footer-info {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-info li {
    font-size: 14px;
    color: var(--default-grey);
}

.footer-info li span {
    color: var(--default-text);
}

.graph-empty .empty-data {
    background: transparent;
    position: absolute;
    top: 0;
    left: 0;
}

.project-name .pj-header-list {
    float: left;
    width: 100%;
    margin-bottom: 4px;
    transition: .4s ease-out;
    text-overflow: ellipsis;
    color: #444;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    white-space: normal;
    max-height: unset;
    overflow: unset;
}

.deliverable-box .count-in {
    white-space: nowrap;
}

.project-task-option {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.project-task-with-option .pj-team-wrapper .task-tab {
    height: calc(100% - 50px);
    float: left;
    width: 100%;
    overflow-y: auto;
}

.pj-board-container.project-task-with-option {
    overflow: hidden;
}

#mapsmeasuretext {
    display: none;
}

.project-name.build-ico:before {
    background: var(--sprite-two) no-repeat -433px -361px;
    width: 20px;
    height: 18px;
}

.pro-ico.org-ico:before {
    background: var(--sprite-two) no-repeat -494px -301px;
    width: 19px;
    height: 20px;
    left: 0;
    top: 3px;
}

.duplicate-ico:before {
    background-position: -328px -447px;
    width: 17px;
    height: 20px;
    display: inline-block;
    margin-right: 7px;
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
}

.duplicate-ico:hover:before {
    background-position: -328px -425px;
}

.table-separate .project-name p {
    line-height: 20px;
}

.project-listing-table.table-separate {
    border-collapse: separate;
    border-spacing: 0 10px;
}

.project-listing-table.table-separate tbody tr td {
    border-bottom: 1px solid #e4e4e4;
}

.table-all-wrapper.project-listing .bsy-table.table-separate tr th {
    padding: 10px 20px;
}

.hint-label.addnew-hint {
    padding: 15px;
}



.switch-list-container {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.switch-list-header {
    float: left;
    width: 100%;
    padding: 0 0 20px 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.switch-list-header .resources-filters-icons {
    margin-right: 0;
}

.switch-list-header .resources-filters-icons li a,
.switch-list-header .resources-filters-icons li nav {
    height: 30px;
    padding: 0 15px;
    width: auto;
}

.switch-list-content {
    float: left;
    width: 100%;
    height: calc(100% - 62px);
}

.switch-list-content .tile-main-panel {
    height: 100%;
    padding-top: 0;
}

.switch-list-content .table-all-wrapper.project-listing {
    height: 100%;
}

.table-separate .project-name .project-tag {
    height: auto;
    font-size: 13px;
    margin: 5px 0;
}

/*------ Project End------*/

/*------ Project Details ------*/

.accordian-mile-block .card {
    border-radius: 0;
    border-left: 0;
    border-right: 0;
}

.accordian-mile-block .card {
    border-top: 0;
    border-color: #E3E5E8;
}

.card-header {
    float: left;
    width: 100%;
    padding: 0;
    height: 45px;
    background: #fff;
    border-radius: 0;
    border-bottom: 0;
}

.accordian-mile-block .card-header {
    float: left;
    width: 100%;
    height: 50px;
    border-radius: 0;
    background: #fff;
    border-bottom: 0;
    padding: 0 20px;
    display: flex;
    align-items: center;
}

.accordian-mile-block .card-header h5 {
    float: left;
    width: 100%;
    height: 100%;
    text-align: left;
}

.accordian-mile-block .card-header .btn-link {
    float: left;
    width: 100%;
    height: 100%;
    text-align: left;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    text-decoration: none;
    padding: 0;
    position: relative;
}

.accordian-mile-block .btn-link:after {
    content: "";
    background: var(--sprite-one) no-repeat -454px -355px;
    width: 8px;
    height: 16px;
    position: absolute;
    right: 0;
    top: calc(50% - 8px);
    transition: .4s ease-out;
    transform: rotate(90deg);
}

.accordian-mile-block .btn-link.collapsed:after {
    transform: rotate(0deg);
}

.accordian-mile-block .card-body {
    min-height: 480px;
    padding: 0 20px;
}

.miles-table {
    float: left;
    width: 100%;
}

.miles-table .table {
    margin-bottom: 0;
    table-layout: fixed;
}

.miles-table .table thead th {
    border-bottom: 1px solid #F3F3F3;
    border-top: 0;
    color: var(--default-text);
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    text-transform: uppercase;
}

.miles-table .table thead tr th:first-child {
    padding-left: 0;
}

.miles-table .table tbody tr td {
    border-top: 1px solid #F3F3F3;
    color: #555;
    font-size: 14px;
    letter-spacing: 0.33px;
    line-height: 14px;
    vertical-align: middle;
}

.miles-table .table tbody tr td:first-child {
    color: #2C3137;
    font-size: 14px;
    letter-spacing: 0.39px;
    line-height: 16px;
    padding-left: 0;
}

.mile-progress {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.mile-progress .progress {
    float: left;
    width: 147px;
    height: 5px;
    border-radius: 2.5px;
    background-color: #E6EEF9;
    margin-bottom: 0;
    box-shadow: none;
}

.mile-progress .progress-bar {
    background: linear-gradient(270deg, #288DD6 26%, var(--default-color) 100%);
    border-radius: 2.5px !important;
}

.prog-count {
    color: var(--default-grey);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.33px;
    line-height: 14px;
    text-align: right;
    margin-left: 10px;
}

.miles-table .table tbody tr td:last-child,
.miles-table .table thead tr th:last-child {
    text-align: right;
}

.common-tab {
    float: left;
    width: 100%;
    height: calc(100% - 97px);
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.common-tab .nav-tabs {
    float: left;
    width: 100%;
    height: 50px;
    border-color: #E3E5E8;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.common-tab .nav-tabs .nav-item {
    float: left;
    height: 100%;
    width: 50%;
    margin-bottom: 0;
}

.common-tab .nav-tabs .nav-link {
    float: left;
    width: 100%;
    border-radius: 0;
    height: 100%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #B8C7CB;
    font-size: 14px;
    line-height: 16px;
    font-weight: 500;
    border: 0;
    position: relative;
    cursor: pointer;
}

.common-tab .nav-tabs .nav-link:focus,
.common-tab .nav-tabs .nav-link:hover {
    border: 0;
    color: var(--default-color);
    outline: 0;
}

.common-tab .nav-tabs .nav-item.show .nav-link,
.common-tab .nav-tabs .nav-link.active {
    border: 0;
    color: var(--default-color);
    font-weight: 500;
}

.common-tab .nav-tabs .nav-link.active:after {
    content: "";
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: var(--default-color);
}

.proj-ov-sum-ico:before {
    background-position: -8px -403px;
    width: 19px;
    height: 16px;
    margin-right: 7px;
}

.proj-ov-sum-ico.active:before,
.proj-ov-sum-ico:hover:before {
    background-position: -8px -378px;
}

.proj-ov-time-ico:before {
    background-position: -361px -163px;
    width: 16px;
    height: 16px;
    margin-right: 7px;
}

.proj-ov-time-ico.active:before,
.proj-ov-time-ico:hover:before {
    background-position: -361px -185px;
}

.common-tab .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.common-tab .tab-content>.tab-pane {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.summar-tab-header {
    float: left;
    width: 100%;
    padding: 25px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.project-other-info-block {
    float: left;
}

.project-other-info-block li {
    float: left;
    color: #B6C5C9;
    font-size: 13px;
    line-height: 16px;
    margin-right: 25px;
    display: flex;
    align-items: center;
}

.pj-sm-task:before {
    background-position: -372px -355px;
    width: 17px;
    height: 17px;
    margin-right: 7px;
}

.pj-sm-date:before {
    background-position: -426px -355px;
    width: 19px;
    height: 18px;
    margin-right: 7px;
}

.graph-switcher {
    float: left;
    border: 1px solid #E3E5E8;
    border-radius: 4px;
}

.graph-switcher button {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    height: 30px;
    padding: 0 20px;
    border-right: 1px solid #E3E5E8;
    color: #161616;
    font-size: 12px;
    text-align: center;
    cursor: pointer;
}

.graph-switcher button:last-child {
    border-right: 0;
}

.graph-switcher button.active {
    background-color: var(--default-color);
    color: #fff;
}

.graph-switcher button:first-child {
    border-radius: 4px 0 0 4px;
}

.graph-switcher button:last-child {
    border-radius: 0 4px 4px 0;
}

.graph-switcher button:hover {
    color: var(--default-color);
}

.graph-switcher button.active:hover {
    color: #fff;
}

.graph-block {
    float: left;
    width: 100%;
    height: 250px;
    padding: 0 20px;
}

.graph-block img {
    float: left;
    width: 100%;
}

.accordian-mile-block {
    float: left;
    width: 100%;
}

.common-tab .accordian-mile-block .card-body {
    min-height: 215px
}

.pj-board-container {
    float: left;
    width: 100%;
    height: calc(100% - 97px);
    position: relative;
    overflow-y: auto;
}

.pj-board-container .pj-team-wrapper {
    height: 100%;
}

.pj-board-container .pj-team-wrapper .team-wrapper {
    height: calc(100% - 45px);
    padding: 0 20px;
    overflow-y: auto;
}

.pj-board-container .pj-team-wrapper .task-nav {
    padding: 0 20px;
}

.pj-board-container .pj-team-wrapper .task-tab {
    padding: 0 20px;
    height: 100%;
}

.pj-board-container .pj-chat-wrapper {
    padding: 0 20px;
    overflow-y: auto;
}

.parent-right {
    display: flex;
    align-items: center;
}

.pj-detail-chat-wrapper {
    min-height: auto;
    margin-bottom: 20px;
}

.parent-chat {
    margin-bottom: 0;
}

.sub-chat:last-child {
    margin-bottom: 0;
    border-bottom: 0;
}

.note-list-wrapper {
    padding-top: 0;
}

.pj-board-container .pj-issue-wrapper {
    padding: 0 20px 20px;
    overflow-y: auto;
}

.pj-board-container .pj-issue-wrapper {
    padding: 0 20px 20px;
    overflow-y: auto;
}

.pj-issue-details-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.project-activity-sec {
    float: left;
    width: 100%;
    border: 1px solid #E3E5E8;
    background-color: #FFFFFF;
    padding: 22px 20px;
}

.board-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    overflow-y: auto;
    position: absolute;
    left: 0;
    top: 0;
    padding: 20px;
}

.board-list-wrapper {
    float: left;
    width: 268px;
    height: 100%;
    margin-right: 20px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-content: stretch;
}

.board-header {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.board-header-top {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.board-header-top h5 {
    float: left;
    width: auto;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.board-count {
    color: #B1BECD;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
}

.list-edit-ico {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-left: 4px;
    opacity: 0;
    pointer-events: none;
    cursor: pointer;
}

.list-edit-ico:before {
    background-position: -370px -116px;
    width: 11px;
    height: 12px;
}

.board-list-wrapper:hover .list-edit-ico {
    opacity: 1;
    pointer-events: auto;
}

.pj-added-user {
    float: right;
    margin-bottom: 10px;
    width: 100%;
}

.pj-added-user li {
    float: left;
    position: relative;
    margin-left: -4px;
    z-index: 7;
}

.pj-added-user li:first-child {
    margin-left: 0;
}

.ind-added-user-list {
    float: left;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    object-fit: cover;
}

.ind-added-user-list img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 1px solid #e8e8e8;
    object-fit: cover;
}

.float-add-button {
    float: left;
    height: 25px;
    width: 25px;
    background: var(--sprite-two) no-repeat -104px -134px;
    border: 0;
    padding: 0;
    line-height: 0;
    border-radius: 50%;
    cursor: pointer;
    background-color: #fff;
}

.board-body {
    float: left;
    width: 100%;
}

.pj-cat-ico:before {
    background-position: -385px -277px;
    width: 18px;
    height: 18px;
}

.pj-cat-ico:hover:before {
    background-position: -385px -300px;
    width: 18px;
    height: 18px;
}

.ind-board-list {
    float: left;
    width: 100%;
    height: auto;
    min-height: 100px;
    border: 1px solid #E3E5E8;
    border-radius: 3px;
    background-color: #FFFFFF;
    margin-bottom: 10px;
    padding: 15px;
    transition: .3s ease-out;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ind-board-list:hover {
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
}

.ind-board-list h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    margin-bottom: 18px;
    transition: .3s ease-out;
    word-break: break-word;
}

.ind-board-list:hover h5 {
    color: var(--default-color);
}

.board-option {
    float: left;
    width: 100%;
}

.board-option li {
    float: left;
    position: relative;
    margin-right: 35px;
    cursor: pointer;
}

.board-com:before {
    background-position: -266px -244px;
    width: 19px;
    height: 17px;
}

.board-com-count {
    float: left;
    background: #E14745;
    color: #fff;
    min-width: 16px;
    height: 16px;
    font-size: 11px;
    font-weight: 500;
    line-height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    position: absolute;
    right: -10px;
    top: -9px;
}

.ind-board-list:hover .int-hide {
    opacity: 1;
    pointer-events: auto;
}

.board-task-ico:before {
    background-position: -147px -364px;
    width: 16px;
    height: 16px;
}

.board-edit-ico:before {
    background-position: -169px -363px;
    width: 15px;
    height: 15px;
}

.board-list-add {
    float: left;
    width: 100%;
    height: 30px;
    border: 1px dashed var(--default-color);
    border-radius: 3px;
    background: transparent;
    color: var(--default-color);
    font-size: 12px;
    line-height: 20px;
    cursor: pointer;
}

.board-list-add:before {
    content: "";
    background: var(--sprite-two) no-repeat -68px -264px;
    width: 10px;
    height: 10px;
    display: inline-block;
    margin-right: 5px;
}

.int-hide {
    opacity: 0;
    transition: .3s ease-out;
    pointer-events: none;
}

.ind-board-list:hover .int-hide {
    opacity: 1;
    pointer-events: auto;
}

.list-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.pj-team-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.project-content-wrapper {
    float: left;
    width: 100%;
    height: calc(100vh - 125px);
    padding: 20px 20px;
    overflow-y: auto;
}

.project-content-wrapper.full-height-collection {
    height: calc(100vh - 60px);
}

.task-tab .card {
    border: 1px solid #E3E5E8;
    border-radius: 0;
    margin-bottom: 10px;
}

.task-tab .card-header {
    float: left;
    width: 100%;
    height: 50px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px 0 30px;
    background: #FBFBFB;
    border: 0;
}

.task-tab .card-header h5 {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.task-tab .card-header h5 button {
    padding: 0;
    color: #565656;
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    position: relative;
    display: flex;
    align-items: center;

}

.task-tab .btn-link:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 4px 0 4px;
    border-color: #b8c7cb transparent transparent transparent;
    position: absolute;
    top: calc(50% - 3px);
    left: -15px;
    transition: .4s ease-out;
}

.due-txt {
    float: right;
    color: #565656;
    font-size: 14px;
    line-height: 16px;
    text-align: right;
}

.task-tab .card-body {
    border: 0;
    border-radius: 0;
    padding: 0;
}

.task-tab .card-body .ind-task-list {
    border-left: 0;
    border-right: 0;
}

.task-tab .card-body .ind-task-list:first-child {
    border-radius: 0;
}

.task-tab .card-body .ind-task-list:last-child,
.task-tab .card-body .ind-task-list:hover:last-child {
    border-bottom: 0;
}

.task-tab .card-body .ind-task-list-click {
    padding: 9px 20px 0 30px;
}

.gen-tooltip {
    float: left;
    position: absolute;
    background: #b6c5c8;
    float: left;
    color: #fff;
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 3px;
    bottom: 28px;
    left: -23px;
    display: none;
    transition: .4s ease-out;
    width: 70px;
    text-align: center;
}

.gen-tooltip:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 5px 0 5px;
    border-color: #b6c5c8 transparent transparent transparent;
    position: absolute;
    bottom: -5px;
    left: 28px;
}

.task-priority:hover+.gen-tooltip {
    display: block;
}

.gen-tooltip.cl-m {
    background: #cb860a;
}

.gen-tooltip.cl-m:before {
    border-color: #cb860a transparent transparent transparent;
}

.gen-tooltip.cl-l {
    background: #d5b610;
}

.gen-tooltip.cl-l:before {
    border-color: #d5b610 transparent transparent transparent;
}

.gen-tooltip.cl-h {
    background: #ee6b46;
}

.gen-tooltip.cl-h:before {
    border-color: #ee6b46 transparent transparent transparent;
}

.gen-tooltip.cl-u {
    background: #ca2700;
}

.gen-tooltip.cl-u:before {
    border-color: #ca2700 transparent transparent transparent;
}

.section-flag:before {
    background-position: -444px -333px;
    width: 13px;
    height: 14px;
    margin-right: 10px;
    position: relative;
    top: 1px;
    left: 0;
    margin-left: 3px;
}

.task-tab .card-header h5 button:hover,
.task-tab .card-header h5 button:focus {
    text-decoration: none;
    color: var(--default-color);
}

.proj-btn {
    float: left;
    height: 30px;
    background-color: var(--default-color);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    color: #FFFFFF !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 14px;
    padding: 0 18px !important;
    margin-left: 10px;
}

.proj-btn.section {
    background: #F5A623;
    border-color: #F5A623;
}

.proj-btn.milestone {
    background: #16517F;
    border-color: #16517F;
}

.proj-btn.milestone:hover {
    background: #3c617f;
    border-color: #3c617f;
}

.proj-btn.section:hover {
    background: #f6b851;
    border-color: #f6b851;
}

.hide {
    display: none !important;
}

.task-tab .card-body .ind-task-list:hover {
    border: 1px solid #e4e5e9;
    border-left: 0;
    border-right: 0;
    border-bottom: 1px solid transparent;
}

.task-user-block:hover .user-popover-block {
    display: block;
}

.pj-team-wrapper .task-nav {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    margin-bottom: 15px;
    min-height: 30px;
}

.filter-tag-block {
    float: left;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
}

.align-cent .filter-tag-block {
    margin: 0;
}

.tab-switch {
    float: left;
    width: auto;
    height: 30px;
    background: #fff;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
}

.tabs {
    float: left;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    cursor: pointer;
    padding: 0 15px;
    font-size: 14px;
    line-height: normal;
    color: var(--default-text);
}

.tabs.active {
    background: var(--default-color);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    color: #fff;
}

.team-wrapper {
    float: left;
    width: 100%;
    height: calc(100vh - 100px);
}

.ind-team-user {
    float: left;
    width: calc((100% / 4) - 12px);
    height: 95px;
    background: #fff;
    margin-right: 15px;
    margin-bottom: 15px;
    border-radius: 5px;
    border: 1px solid rgba(64, 83, 100, 0.15);
}

.ind-team-user:hover {
    box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.15);
}

.team-user-click {
    float: left;
    width: 100%;
    padding: 10px;
}

.team-user-thumb {
    float: left;
    width: 75px;
    height: 75px;
    margin-right: 10px;
    border-radius: 50%;
    position: relative;
}

.team-user-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.user-hover {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0, 0, 0, 0.50);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    opacity: 0;
    pointer-events: none;
    z-index: 9;
    transition: .4s ease-out;
}

.ind-team-user:hover .user-hover {
    opacity: 1;
    pointer-events: auto;
}

.hover-chat {
    background: transparent;
    border: 0;
    padding: 0;
    color: #fff;
    cursor: pointer;
    line-height: normal;
}

.hover-chat:before {
    content: "";
    background: var(--sprite-one) no-repeat -451px -186px;
    width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 6px;
}

.team-user-desc {
    float: left;
    width: calc(100% - 85px);
}

.team-user-desc.status {
    display: none;
}

.project-edit-team {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 3px;
}

.team-user-desc h5 {
    float: left;
    width: 100%;
    font-weight: 500;
    margin: 0;
    margin-bottom: 3px;
    transition: .2s ease-out;
    color: #2A2F35;
    font-size: 14px;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.project-edit-team .wf-dt {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    width: 10px;
    height: 12px;
    position: relative;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.wf-dt:before {
    background-position: -473px -159px;
    width: 10px;
    height: 12px;
}

.team-user-desc p {
    float: left;
    width: 100%;
    font-weight: 400;
    margin-bottom: 5px;
    position: relative;
    padding-left: 16px;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
}

.desg-text:before {
    content: "";
    background: var(--sprite-one) no-repeat -372px -188px;
    width: 10px;
    height: 8px;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.mail-text:before {
    content: "";
    background: var(--sprite-one) no-repeat -387px -188px;
    width: 10px;
    height: 8px;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.phone-text:before {
    content: "";
    background: var(--sprite-one) no-repeat -405px -188px;
    width: 10px;
    height: 8px;
    position: absolute;
    left: 0;
    top: calc(50% - 4px);
}

.team-progress-graph {
    float: left;
    width: 100%;
    height: calc(100% - 82px);
    margin-top: 13px;
    text-align: center;
    display: none;
}

.pj-team-wrapper .team-wrapper {
    height: calc(100% - 35px);
}

.team-wrapper.status-view .ind-team-user {
    height: 250px;
}

.team-wrapper.status-view .team-user-desc.status {
    display: block;
}

.team-wrapper.status-view .team-user-desc {
    display: none;
}

.team-user-desc .progress-text {
    padding: 0;
}

.stastus-highlight {
    color: #999999 !important;
}

.completed {
    color: #0F9D58 !important;
}

.in-progress {
    color: #F5A623 !important;
}

.ind-team-user:nth-child(4n) {
    margin-right: 0;
}

.team-wrapper.status-view .team-progress-graph {
    display: block;
}

.tabs:last-child.active {
    border-radius: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.team-user-click:hover .project-edit-team .wf-dt {
    opacity: 1;
    pointer-events: auto;
}

.team-user-desc p:last-child {
    margin-bottom: 0;
}

.team-user-desc p:last-child {
    margin-bottom: 0;
}

.task-nav-right .settings-button {
    height: 30px;
    margin-left: 10px;
}

.filter-tag-header {
    float: left;
    font-size: 16px;
    font-weight: 600;
    color: #20222e;
}

.filter-tag-header {
    float: left;
    font-size: 16px;
    font-weight: 600;
    color: #20222e;
}

.filter-tag {
    float: left;
    background: #3d5265;
    color: #fff;
    font-size: 12px;
    line-height: 16px;
    padding: 2px 7px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    border-radius: 6px;
    padding-right: 20px;
    position: relative;
    margin-left: 7px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.tag-close {
    background: transparent;
    border: 0;
    padding: 0;
    position: relative;
    position: absolute;
    top: calc(50% - 8px);
    right: 7px;
    cursor: pointer;
}

.tag-close:before {
    content: "";
    background: var(--sprite-one) no-repeat -422px -188px;
    width: 8px;
    height: 8px;
    display: inline-block;
}

.note-list-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    padding-top: 20px;
}

.note-list-wrapper .nav-pills {
    float: left;
    display: block;
    width: 470px;
    height: 100%;
    border-top: 1px solid #E3E5E8;
    background: #ECF0F1;
    overflow-y: auto;
}

.note-list-wrapper .nav-pills .nav-link {
    float: left;
    width: 100%;
    height: 70px;
    border-bottom: 1px solid #E3E5E8;
    border-radius: 0;
    padding: 15px 20px;
}

.note-list-wrapper .nav-pills .nav-link.active,
.note-list-wrapper .nav-pills .show>.nav-link {
    background: #fff;
    border-radius: 0;
}

.project-note-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 7px;
}

.project-note-header h5 {
    float: left;
    color: #2C3137;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.39px;
    line-height: 16px;
    max-width: 70%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.project-note-header button {
    float: left;
    padding: 0;
    background: transparent;
    border: 0;
}

.chain-ico:before {
    background-position: -111px -263px;
    width: 13px;
    height: 13px;
}

.project-note-desc {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.project-note-desc p {
    float: left;
    color: #898989;
    font-size: 12px;
    letter-spacing: 0.33px;
    line-height: 18px;
    max-width: 70%;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.days-count {
    float: left;
    color: #b1becd;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.note-list-wrapper .tab-content {
    float: left;
    width: calc(100% - 470px);
    height: 100%;
    background: #fff;
    border: 1px solid rgba(64, 83, 100, 0.15);
}

.note-list-wrapper .tab-content .tab-pane {
    float: left;
    width: 100%;
    height: 100%;
}

.note-detailed-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.note-detailed-header {
    float: left;
    width: 100%;
    height: 70px;
    border-bottom: 1px solid #EDF0F2;
    padding: 15px 20px;
}

.note-detailed-header h5 {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.5px;
    line-height: 21px;
    margin-bottom: 3px;
}

.note-detailed-header p {
    float: left;
    width: 100%;
    color: #929DAA;
    font-size: 12px;
    line-height: 20px;
}

.user-mention {
    font-weight: 600;
    color: var(--default-text);
}

.note-detailed-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    overflow-y: auto;
}

.note-elaborate-edit {
    float: left;
    width: 100%;
    margin-bottom: 18px;
}

.cke_1.cke.cke_reset.cke_chrome.cke_editor_editor1.cke_ltr.cke_browser_webkit {
    border: none;
}

.cke_top.cke_reset_all {
    border-bottom: 1px solid #E3E5E8;
    background: #F7F8F9;
    padding: 4px 12px 2px;
    white-space: normal;
}

.cke_1.cke.cke_reset.cke_chrome.cke_editor_editor1.cke_ltr.cke_browser_webkit {
    border: none;
}

.cke_top.cke_reset_all {
    border-bottom: 1px solid #E3E5E8;
    background: #F7F8F9;
    padding: 4px 12px 2px;
    white-space: normal;
}

.cke_bottom.cke_reset_all {
    padding: 6px 16px 2px;
    position: relative;
    border-top: none;
    background: #ffffff;
}

.note-elaborate-content {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.note-attachment {
    float: left;
    width: 100%;
    height: 70px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 16px 20px;
    margin-bottom: 15px;
}

.attached-icon-img {
    float: left;
    width: 32px;
    height: 37px;
    margin-right: 15px;
    border-radius: 5px;
    background-color: #FFFFFF;
}

.attached-icon-img .format {
    font-size: 9.75px;
}

.attached-icon-img .format:before {
    border-width: 10px 0 0 10px;
}

.attached-icon-img .format:after {
    border-width: 10px 0 0 10px;
}

.note-attachment-tite {
    float: left;
    width: calc(100% - 47px);
}

.note-attachment-tite h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.note-attachment-tite p {
    float: left;
    width: 100%;
    color: #929DAA;
    font-size: 12px;
    line-height: 20px;
}

.note-elaborate-edit .mce-panel {
    border: 0;
    border-bottom: 1px solid #EDF0F2;
}

.note-elaborate-edit .mce-tinymce {
    box-shadow: none;
}

.note-elaborate-edit .mce-top-part::before {
    box-shadow: none;
    border-bottom: 1px solid #EDF0F2;
}

.note-elaborate-edit .mce-btn-group:not(:first-child) {
    border-left: 1px solid #EDF0F2;
}

.note-list-wrapper {
    padding-top: 0;
}

.pj-chat-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.ind-pj-chat-list {
    float: left;
    width: 100%;
    height: 130px;
    border: 1px solid #E3E5E8;
    border-radius: 3px;
    background-color: #FFFFFF;
    margin-bottom: 20px;
    padding: 16px 18px;
    transition: .4s ease-out;
    cursor: pointer;
}

.ind-pj-chat-list:hover .chat-list-left-top-right h5 {
    color: var(--default-color);
}

.imageRemove {
    display: none;
}

.comment-pj {
    float: right;
    text-align: right;
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    display: flex;
    align-items: center;
}

.comment-pj:before {
    background-position: -266px -244px;
    width: 19px;
    height: 17px;
    margin-right: 6px;
}

.pj-chat-list-left {
    float: left;
    width: calc(100% - 180px);
    height: 100%;
}

.chat-list-left-top {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.chat-list-left-top-left {
    float: left;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    margin-right: 10px;
}

.chat-list-left-top-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #f3f3f3;
}

.parent-left .chat-list-left-top-left {
    width: 45px;
    height: 45px;
}

.parent-left .chat-list-left-top-right {
    width: calc(100% - 60px);
}

.chat-list-left-top-right {
    float: left;
    width: calc(100% - 45px);
}

.chat-list-left-top-right h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 20px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 2px;
    transition: .4s ease-out;
}

.chat-list-left-top-right p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 20px;
}

.comm-ico:before {
    background-position: -385px -119px;
    width: 9px;
    height: 8px;
    margin-right: 5px;
}

.mention {
    color: #32373D;
    font-weight: 600;
}

.chat-list-left-bottom {
    float: left;
    width: 100%;
    padding-left: 45px;
}

.chat-list-left-bottom p {
    float: left;
    width: 100%;
    color: #595959;
    font-size: 16px;
    max-height: 20px;
    line-height: 20px;
    max-height: 40px;
    overflow: hidden;
}

.pj-chat-list-right {
    float: left;
    width: 180px;
    height: 100%;
}

.chat-list-right-top {
    float: left;
    width: 100%;
}

.chat-list-right-options {
    float: left;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    position: relative;
}

.pin-block {
    float: left;
    width: 30px;
    height: 42px;
    display: flex;
    justify-content: center;
    position: absolute;
    top: -17px;
    right: 24px;
}

.pinlock-ico {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    cursor: pointer;
}

.pinlock-ico:before {
    background-position: -332px -244px;
    width: 15px;
    height: 15px;
}

.pin-block.active {
    background: var(--default-color);
}

.pin-block.active:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 10px 15px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    bottom: 0;
    left: 0;
}

.common-align.no-bottom .form-detail-top.project-top {
    border-bottom: 0;
}

.pj-detail-chat-details {
    float: left;
    width: 100%;
    position: relative;
}

.pj-detail-chat-wrapper {
    float: left;
    width: 100%;
    height: auto;
    min-height: 100%;
    border: 1px solid #E3E5E8;
    border-radius: 3px;
    background-color: #FFFFFF;
    padding: 20px;
}

.pj-detail-chat-wrapper {
    min-height: auto;
    margin-bottom: 20px;
}

.parent-chat {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #E3E5E8;
}

.parent-left {
    float: left;
    width: 50%;
}

.parent-right {
    float: right;
}

.parent-right .pj-added-user {
    float: left;
    max-width: 350px;
}

.parent-bottom {
    float: left;
    width: 100%;
    padding-left: 55px;
}

.parent-bottom p {
    float: left;
    width: 100%;
    color: #595959;
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 20px;
    word-break: break-word;
}

.sub-chat {
    float: left;
    width: 100%;
    padding-left: 55px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #E3E5E8;
}

.sub-chat .parent-bottom {
    padding-left: 45px;
}

.sub-chat .parent-left .chat-list-left-top-left {
    width: 35px;
    height: 35px;
}

.sub-chat .parent-left .chat-list-left-top-right h5 {
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 0;
}

.click-mention {
    font-weight: 600;
    color: var(--default-color);
}

.font-bold-600 {
    font-weight: 600;
}

.font-bold-dark {
    font-weight: 800;
}

.info-accordion .card {
    border-radius: 0;
    border: 1px solid #E3E5E8;
    border-bottom: 0;
}

.info-accordion .card-header {
    float: left;
    width: 100%;
    height: 50px;
    padding: 0;
    background-color: #FFFFFF;
    border-radius: 0;
    border-bottom: 0;
}

.info-accordion .card-header h5 {
    padding: 0;
    float: left;
    width: 100%;
    height: 100%;
    padding: 0 20px;
}

.info-accordion .btn-link {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0;
    text-align: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    position: relative;
}

.info-accordion .btn-link:hover,
.info-accordion .btn-link:focus {
    text-decoration: none;
    color: var(--default-color);
}

.info-accordion .btn-link:after {
    content: "";
    background: var(--sprite-one) no-repeat -196px -310px;
    width: 14px;
    height: 7px;
    position: absolute;
    right: 0;
    top: calc(50% - 3.5px);
    transition: .4s ease-out;
}

.info-accordion .btn-link.collapsed:after {
    transform: rotate(270deg);
}

.info-accordion .card-body {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.project-status-table .table {
    margin: 0;
}

.project-status-table .table tbody tr td {
    font-size: 14px;
    line-height: 16px;
    border-top: 1px solid #F3F3F3;
}

.project-status-table .table tbody tr td:first-child {
    color: #9CA0A4;
}

.project-status-table .table tbody tr:first-child td {
    border-top: 0;
}

.info-accordion .project-status-table .table tbody tr td:first-child {
    padding-left: 0;
}

.project-status-table .table tbody tr td:last-child {
    color: #2C3137;
    font-size: 14px;
    line-height: 16px;
    text-align: right;
    padding-right: 0;
}

.proj-tab-header {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.proj-tab-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.project-status {
    float: left;
    width: 100%;
}

.act-log-container {
    float: left;
    width: 100%;
}

.ind-act-log {
    float: left;
    width: 100%;
    padding-left: 25px;
    position: relative;
    margin-bottom: 24px;
}

.finished-log:before {
    content: "";
    background: var(--sprite-one) no-repeat -265px -359px;
    width: 14px;
    height: 10px;
    position: absolute;
    left: 0;
    top: 0;
}

.ind-act-log h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.39px;
    line-height: 16px;
    margin-bottom: 4px;
}

.ind-act-log p {
    font-size: 12px;
    letter-spacing: 0.33px;
    line-height: 16px;
    color: #B1BECD;
}

.ind-act-log.finished-log:after {
    content: "";
    height: 12px;
    width: 2px;
    border-radius: 2.5px;
    background-color: #E6EEF9;
    position: absolute;
    left: 5px;
    top: 20px;
}

.ind-act-log.comment-log:after {
    content: "";
    height: 12px;
    width: 2px;
    border-radius: 2.5px;
    background-color: #E6EEF9;
    position: absolute;
    left: 5px;
    top: 20px;
}

.ind-act-log.overdue-log:after {
    content: "";
    height: 12px;
    width: 2px;
    border-radius: 2.5px;
    background-color: #E6EEF9;
    position: absolute;
    left: 7px;
    top: 20px;
}

.finished-log:before {
    content: "";
    background: var(--sprite-one) no-repeat -265px -359px;
    width: 14px;
    height: 10px;
    position: absolute;
    left: 0;
    top: 0;
}

.comment-log:before {
    content: "";
    background: var(--sprite-one) no-repeat -286px -356px;
    width: 15px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 0;
}

.overdue-log:before {
    content: "";
    background: var(--sprite-one) no-repeat -308px -356px;
    width: 17px;
    height: 15px;
    position: absolute;
    left: 0;
    top: 0;
}

.ind-act-log:last-child {
    margin-bottom: 0;
}

.table.bsy-table tbody tr td:first-child {
    width: 1%;
    word-break: break-word;
}

.project-name-wrappe {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 35px;
}

.project-name {
    float: left;
    width: 90%;
    position: relative;
}

.project-name h5 {
    float: left;
    width: 100%;
    margin-bottom: 4px;
    transition: .4s ease-out;
    text-overflow: ellipsis;
    /* overflow: hidden;
    white-space: nowrap;
    max-width: 90%; */
    color: var(--btn-color);
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
}

.project-name p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 13px;
    line-height: 17px;
    max-height: unset;
    overflow: unset;
}

.bsy-table tbody tr td:last-child {
    border-right: 1px solid #e4e4e4;
    text-align: right;
}

.com-ico {
    position: relative;
    padding-left: 20px;
    color: #B9C7CB;
    font-size: 14px;
    line-height: 16px;
}

.com-ico:before {
    background-position: -332px -359px;
    width: 13px;
    height: 13px;
    margin-right: 8px;
    position: absolute;
    left: 0;
    top: calc(50% - 6.5px);
}

.pj-chat-wrapper-main {
    float: left;
    width: 100%;
    height: 100%;
    background: #fff;
    border: 1px solid #E3E5E8;
}

.pj-issue-wrapper-header {
    float: left;
    width: 100%;
    height: 80px;
    border-bottom: 1px solid #E3E5E8;
    padding: 16px 22px;
}

.pj-issue-wrapper-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    margin-bottom: 10px;
}

.pj-issue-wrapper-bottom {
    float: left;
    width: 100%;
}

.status-tag {
    float: left;
    height: 20px;
    border-radius: 3px;
    padding: 0 8px;
    background-color: #b9c7cb;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 500;
    line-height: 14px;
    display: flex;
    align-items: center;
    margin-right: 13px;
}

.status-tag.opened {
    background: #2DA562;
}

.pj-issue-wrapper-bottom p {
    float: left;
    color: #b1becd;
    font-size: 14px;
    line-height: 20px;
}

.pj-issue-wrapper-body {
    float: left;
    width: 100%;
    height: calc(100% - 80px);
    padding: 20px 22px;
    overflow-y: auto;
}

.ind-issue-list {
    float: left;
    width: 100%;
    height: 90px;
    border: 1px solid #E3E5E8;
    border-radius: 3px;
    background-color: #FFFFFF;
    margin-bottom: 20px;
}

.issue-list-header {
    float: left;
    width: 100%;
    height: 40px;
    border-bottom: 1px solid #E3E5E8;
    border-radius: 3px 3px 0 0;
    background-color: #F7F8F9;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 20px;
}

.issue-holder {
    float: left;
    width: 40px;
    height: 40px;
    margin-right: 16px;
    border-top-left-radius: 3px;
}

.issue-holder img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-top-left-radius: 3px;
}

.issue-list-header-left h5 {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    line-height: 40px;
    font-weight: 600;
}

.issue-edit {
    float: left;
    background: transparent;
    padding: 0;
    line-height: 0;
    border: 0;
    cursor: pointer;
}

.issue-edit:before {
    background-position: -351px -358px;
    width: 12px;
    height: 13px;
}

.issue-list-bottom {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 12px;
}

.issue-box {
    float: left;
    width: 100%;
    height: 25px;
    border: 1px solid transparent;
    color: #848488;
    font-size: 14px;
    line-height: 22px;
    resize: none;
    padding: 0;
    padding: 0 10px;
    pointer-events: none;
}

.issue-box.active {
    pointer-events: auto;
    border: 1px solid #E3E5E8;
}

.pj-issue-wrapper-bottom p .com-ico {
    margin-left: 28px;
}

.select-box--new select {
    float: left;
    border: none;
    border-bottom: 1px solid #e4e5e9;
    background: #fff;
    height: 52px;
    display: flex;
    padding: 0 35px 0 0;
    align-items: center;
    display: -ms-flexbox;
    -ms-align-items: center;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    -webkit-appearance: none;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: #B1BECD;
    width: 100%;
}

.select-box--new:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 12px;
    top: calc(50% - 4px);
}

.width-adjust {
    width: calc(100% / 2 - 5px);
    margin-right: 10px;
}

.width-adjust:nth-child(odd) {
    margin-right: 0px;
}

.task-inp-container.pj-inp-container {
    margin-bottom: 15px;
}

.miles-table .table tbody tr:hover td .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.miles-table .table tbody tr td .wf-btn-block {
    float: none;
    display: inline-block;
    margin-left: 10px;
}

.persitant-top.pj-pad {
    padding: 0;
}

.new-pool-input input {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    font-size: 14px;
    padding: 0 20px;
}

.new-pool-input.text-input {
    float: left;
    width: 100%;
    height: 210px;
}

.pj-pad .new-pool-input.text-input {
    border-bottom: 0;
}

.select-options {
    float: left;
    width: 100%;
    padding: 15px;
}

.select-options .radio-block {
    float: left;
    width: 100%;
    margin-bottom: 18px;
}

.select-options .pj-added-user {
    float: left;
    padding-left: 24px;
}

.pj-remove-block {
    float: left;
    position: absolute;
    left: 0;
    top: 0;
    display: none;
}

.add-remove {
    float: left;
    height: 23px;
    width: 23px;
    background-color: #E14745;
    padding: 0;
    line-height: 0;
    border: 0;
    border-radius: 50%;
    position: relative;
    cursor: pointer;
}

.pj-added-user li:hover .pj-remove-block {
    display: block;
}

.add-remove:before {
    content: "";
    background: var(--sprite-one) no-repeat -422px -188px;
    width: 8px;
    height: 8px;
    position: absolute;
    left: calc(50% - 5px);
    top: calc(50% - 4px);
}

.pj-added-user .ind-added-user-list {
    float: left;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #fff;
}

.text-input .mce-tinymce {
    box-shadow: none;
    border-color: #ECEFF1;
}

.text-input .mce-panel {
    border-color: #ECEFF1;
    border-left: 0;
    border-right: 0;
}

.text-input .mce-btn-group:not(:first-child) {
    border-color: #ECEFF1;
}

.text-input .mce-top-part::before {
    box-shadow: none !important;
}

.add-users__list--pop-up {
    display: none;
    position: absolute;
    background: #fff;
    width: 200px;
    right: -4px;
    height: 250px;
    z-index: 1;
    border: 1px solid #dfe0e4;
    bottom: 40px;
    border-radius: 5px;
    box-shadow: 0 0 4px 0 #0000000d;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, .15);
}

.add-users__list--pop-up.milestone {
    width: 190px;
    height: auto;
}

.add-users__list--pop-up:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 5px 0 5px;
    border-color: #fff transparent transparent transparent;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #ffffff transparent transparent transparent;
    position: absolute;
    right: 25px;
    bottom: -10px;
    z-index: 11;
}

.add-users__list--pop-up:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 12px 0 12px;
    border-color: #eaeaea transparent transparent transparent;
    position: absolute;
    bottom: -12px;
    right: 23px;
    bottom: -12px;
    z-index: 10;
}

.add-users__list--pop-up.milestone ul li {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #E3E5E8;
    margin: 0;
}

.add-users__list--pop-up.milestone ul li .milestone-plus-new {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    font-size: 16px;
    color: var(--default-grey);
    cursor: pointer;
}

.ico-lib-new-task:before {
    background-position: -24px -354px;
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.ico-lib-new-sec:before {
    background-position: -213px -406px;
    width: 18px;
    height: 14px;
    margin-right: 10px;
}

.ico-lib-new-task:hover:before {
    background-position: -9px -492px;
}

.ico-lib-new-sec:hover:before {
    background-position: -213px -381px;
}

.add-users__list--pop-up.milestone ul li:hover .milestone-plus-new {
    color: var(--default-color);
}

.milestone-plus-new {
    padding: 0px 15px;
    font-size: 18px;
    color: #565656;
}

.add-users__list--pop-up.milestone ul li:last-child {
    border-bottom: 0;
}

.task-tab .btn-link.collapsed:before {
    transform: rotate(-90deg);
}

.log-user {
    color: #9529FF;
}

.assign-user-validation-err {
    float: left;
    width: 100%;
    font-size: 14px;
    color: #f44;
    margin: 10px 0;
}

.pj-board-container .rc-list-contents:hover .rc-thumb-img {
    opacity: 1;
}

.pj-board-container .resources-list {
    height: 100%;
}

.pj-board-container .rc-list-content-wrap .rc-list-contents:last-child {
    border-bottom: 1px solid #e4e5e9;
}

.pj-board-container .rc-list-content-wrap .rc-list-contents:hover {
    border: 1px solid var(--default-color);
}

.user-list-container {
    float: left;
    width: 100%;
    overflow-y: auto;
    max-height: 370px;
    min-height: 370px;
    padding: 1rem;
    padding-top: 0px;
}

.ind-user-list {
    float: left;
    width: 100%;
    border-bottom: 1px solid #e4e5e9;
    display: flex;
    align-items: center;
    justify-content: space-between;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    cursor: pointer;
}

.ind-user-list-left {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    margin: 11px 0;
    position: relative;
}

.ind-user-img {
    float: left;
    width: 25px;
    height: 25px;
    margin-right: 10px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    position: relative;
}

.ind-user-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #e4e4e4;
}

.ind-user-name {
    float: left;
    color: #6b7577;
    font-weight: 500;
    font-size: 14px;
}

.selected-user .ind-user-img:before {
    content: "";
    width: 100%;
    height: 100%;
    background: #60AD6C;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    z-index: 7;
}

.selected-user .ind-user-img:after {
    content: "";
    background: var(--sprite-one) no-repeat -458px -212px;
    width: 14px;
    height: 11px;
    position: absolute;
    left: calc(50% - 8px);
    top: 7px;
    z-index: 8;
}

.selected-user .ind-user-name {
    color: #5fad6b;
}

.new-pool-input {
    float: left;
    width: 100%;
    height: 51px;
    border-bottom: 1px solid #ECEFF1;
}

.new-pool-input.text-input textarea {
    float: left;
    width: 100%;
    height: 100%;
    padding: 15px 20px;
    border: 0;
    line-height: 19px;
}

.persitant-top.pj-pad .Loader-holder {
    position: absolute;
}

.parent-bottom ul {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.parent-bottom ul li {
    float: left;
    width: 100%;
    padding-left: 15px;
    position: relative;
    color: #525252;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 6px;
}

.parent-bottom ul li:before {
    content: "";
    width: 7px;
    height: 7px;
    background: #525252;
    position: absolute;
    left: 0;
    top: 5px;
    border-radius: 50%;
}

.parent-bottom ol {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    list-style-type: decimal;
    padding-left: 13px;
}

.parent-bottom ol li {
    float: left;
    width: 100%;
    position: relative;
    color: #525252;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 6px;
}

.pool-action-btn {
    float: left;
    width: auto;
    min-width: 67px;
    background: var(--default-color);
    border: 0;
    padding: 0;
    line-height: 0;
    height: 20px;
    padding: 0 20px;
    border-radius: 3px;
    font-size: 12px;
    color: #fff;
}

.pool-quit-btn {
    background: #e14745;
}

.pj-added-user li.active .pj-remove-block {
    display: block;
}

.sector:before {
    content: "\f0b1";
    font-family: 'FontAwesome';
    width: 10px;
    height: 10px;
    position: absolute;
    left: 0;
    top: calc(50% - 6px);
    font-size: 11px;
}

.sector {
    text-transform: capitalize;
}

.org:before {
    content: "\f0e8";
    font-family: 'FontAwesome';
    width: 14px;
    height: 16px;
    position: absolute;
    left: 0;
    top: calc(50% - 6px);
    font-size: 11px;
}

.team-progress-graph.centre-adj {
    float: left;
    margin: 10px 0px;
    margin-left: -15px;
}

.common-tab.milestone-scroll .tab-content {
    height: 100%;
}

.miles-table.addmilestone-table .select-chk-block .control {
    color: var(--default-grey);
    font-size: 16px;
    letter-spacing: 0.33px;
    line-height: 14px;
    font-weight: 400;
}

.full-no-data {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.full-no-data h5 {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 35px;
    font-weight: 300;
    color: #6f7478;
    font-weight: 100;
    color: #c4c9cd;
}

.pj-collection-container {
    float: left;
    width: 100%;
    height: calc(100% - 99px);
    padding: 0 20px;
    overflow-y: auto;
}

.form-field-wrapper-block {
    float: left;
    width: 100%;
    max-height: 350px;
    overflow-y: auto;
    padding: 20px;
}

.ind-form-field-block {
    float: left;
    width: 100%;
    border: 1px solid #E3E3E3;
    height: 50px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    transition: .3s ease-out;
    margin-bottom: 15px;
}

.ind-form-field-block .select-chk-block label {
    font-size: 14px;
    line-height: 21px;
    font-weight: 500;
    transition: .3s ease-out;
}

.ind-form-field-block:hover {
    border-color: var(--default-color);
}

.ind-form-field-block:hover .select-chk-block label {
    color: var(--default-color);
}

.no-pad-mod .modal-body {
    padding: 0;
}

.ind-form-field-block:hover .select-chk-block label .control-indicator {
    border-color: var(--default-color);
}

.m-modal .modal-content {
    height: 100%;
}

.m-modal .modal-dialog {
    max-width: calc(100% - 150px);
    height: calc(100% - 56px);
}

.m-modal .modal-body {
    float: left;
    width: 100%;
    height: calc(100% - 131px);
    padding: 0;
    overflow-y: auto;
}

.m-modal .miles-table .table tbody tr td:first-child,
.m-modal .miles-table .table thead tr th:first-child {
    padding-left: 15px;
}

.green-list {
    background: #ACCE9A;
}

.ash-list {
    background: #C5C5C5;
}

.navy-list {
    background: #D0CB87;
}

.grid-header {
    float: left;
    width: 100%;
    height: 45px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid #EEEEEE;
}

.grid-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.blue-list-body .graph-tag li {
    line-height: 19px;
}

.blue-list-body .graph-tag {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.ash-circle:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid #C5C5C5;
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 6px;
}

.orange-circle:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid #FFA960;
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 6px;
}

.graph-wrap {
    float: left;
    width: 100%;
    height: calc(100% - 29px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.graph-wrap img {
    float: left;
    width: 100%;
    object-fit: contain;
}

.ibt-graph {
    float: left;
    width: 100%;
    height: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
}

.stakeholders-header {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.ibt-body .stakeholders-header {
    padding: 0 20px;
}

.ibt-body .stakeholders-header h5 {
    color: #2B3138;
    font-size: 18px;
    font-weight: 600;
    line-height: 19px;
}

.small-tab-graph-block {
    float: left;
    width: 100%;
}

.ind-small-tab {
    float: left;
    width: calc((100% / 4) - 13px);
    margin-right: 17px;
    margin-bottom: 17px;
    padding: 15px 18px 20px 18px;
    height: 90px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.ind-small-tab-dashboard {
    float: left;
    width: 100%;
    margin-right: 17px;
    margin-bottom: 17px;
    padding: 15px 18px 20px 18px;
    height: 90px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.ind-small-tab:nth-child(4n) {
    margin-right: 0;
}

.small-tab-header {
    float: left;
    width: 100%;
    margin-bottom: 7px;
}

.small-tab-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.small-tab-footer {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.small-tab-footer h5 {
    float: left;
    width: 50%;
    color: var(--default-text);
    font-size: 24px;
    font-weight: 300;
    line-height: 28px;
}

.small-tab-graph {
    float: left;
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.small-tab-graph img {
    float: left;
    width: 100%;
    max-height: 28px;
    object-fit: contain;
}

.right-content-wrapper.fixed-height {
    min-width: calc(100% - 270px);
}

.ico-lib-v3:before {
    content: "";
    background: var(--sprite-four) no-repeat;
    display: inline-block;
}

.pj-log-ico:before {
    background-position: -10px -10px;
    width: 16px;
    height: 16px;
    top: calc(50% - 8px);
}

.ibt-drop .pj-log-ico.active:before {
    background-position: -40px -10px;
}

.ibt-drop .pj-log-ico:hover:before,
.ibt-drop .pj-log-ico.active:before,
.ibt-drop .menu-section.active .pj-log-ico:before {
    background-position: -40px -10px;
}

.list-row {
    float: left;
    width: 100%;
}

.list-common {
    float: left;
    width: 100%;
    margin-right: 20px;
}

.list-common:last-child {
    margin-right: 0;
}

.list-row-left .ibt-split-table .blue-lister {
    width: calc((100% / 2) - 10px);
    margin-bottom: 20px;
    height: 280px;
}

.list-row-left .ibt-split-table {
    flex-wrap: wrap;
    margin-bottom: 0;
}

.list-row-left .ibt-split-table .blue-lister:nth-child(4n) {
    margin-right: 20px;
}

.list-row-left .ibt-split-table .blue-lister:nth-child(2n) {
    margin-right: 0;
}

.list-row-right .ibt-progress-table-header p {
    float: left;
    color: #999FA0;
    font-size: 12px;
    line-height: 19px;
    text-align: right;
}

.list-row-right .ibt-progress-table-header h5 {
    width: auto;
}

.list-row-right .ibt-progress-table-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 45px;
}

.ibt-financial-body {
    float: left;
    width: 100%;
    padding: 20px 0;
}

.ibt-table.bs-sheet-tb tbody tr td:first-child {
    width: 75%;
}

.ibt-table.bs-sheet-tb tbody tr td {
    vertical-align: middle;
    padding: 8px 20px;
    height: 41px;
}

.ibt-table.bs-sheet-tb tbody .nested-sub-row td {
    color: #959FA0;
    font-size: 14px;
    padding-left: 50px;
}

.ibt-table.bs-sheet-tb tbody .main-row td {
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
}

.ibt-table.bs-sheet-tb tbody .sub-row td {
    color: var(--default-text);
    font-size: 14px;
    font-weight: 500;
    padding-left: 35px;
}

.list-row-left .ibt-split-table .blue-lister .graph-wrap {
    height: calc(100% - 60px);
}

.list-row-left .ibt-split-table .blue-lister .blue-list-body {
    height: calc(100% - 45px);
    min-height: auto;
    margin-bottom: 0;
}

.list-row-left .ibt-split-table .blue-lister .graph-wrap img {
    height: 100%;
}

.list-row-right .ibt-progress-table-body {
    padding-bottom: 2px;
}

.ibt-financial-body .ibt-split-table .ibt-progress-table-body {
    padding: 10px 20px;
}

.ibt-financial-body .ibt-split-table .ibt-graph img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: none;
}

.two-row .blue-lister {
    width: calc((100% / 2) - 10px);
}

.two-row .blue-lister {
    width: calc((100% / 2) - 10px);
    height: 280px;
}

.ibt-split-table.two-row .graph-wrap {
    height: calc(100% - 30px);
}

.ibt-split-table.two-row .blue-list-body {
    height: calc(100% - 45px);
    min-height: auto;
}

.ibt-split-table.two-row .graph-wrap img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: none;
}

.navy-circle:before {
    content: "";
    height: 9px;
    width: 9px;
    border: 2px solid #B8CCA3;
    background-color: #FFFFFF;
    display: inline-block;
    border-radius: 50%;
    margin-right: 6px;
}

.two-row .grid-header {
    justify-content: space-between;
}

.two-row .grid-header h5 {
    width: auto;
}

.two-row .grid-header p {
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    font-weight: 600;
}

.one-row .list-row-left .ibt-split-table {
    flex-wrap: wrap;
    width: 100%;
}

.one-row .list-row-left .ibt-split-table .blue-lister {
    width: 100%;
}

.one-row .list-row-left .grid-header h5 {
    width: auto;
}

.one-row .list-row-left .grid-header p {
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    font-weight: 600;
}

.one-row .list-row-left .grid-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.solid-graph {
    float: left;
    width: 280px;
    height: 280px;
    margin-right: 20px;
    padding: 20px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.solid-graph-wrap {
    float: left;
    width: 100%;
    height: 100%;
}

.list-row.with-solid .blue-lister {
    float: left;
    width: calc(100% - 300px);
    height: 280px;
}

.with-solid .blue-lister {
    float: left;
    width: calc(100% - 300px);
    height: 280px;
}

.with-solid .blue-list-body {
    height: calc(100% - 45px);
    min-height: auto;
}

.with-solid .graph-wrap {
    height: 100%;
}

.with-solid .graph-wrap img {
    height: 100%;
}

.list-row.with-solid {
    margin-bottom: 20px;
}

.full-row .blue-lister {
    width: 100%;
    height: 300px;
}

.full-row .graph-wrap img {
    height: 100%;
}

.full-row .graph-wrap {
    height: 100%;
}

.full-row .blue-lister .blue-list-body {
    min-height: auto;
    height: calc(100% - 45px);
}

.full-row {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.grid-header .graph-tag {
    width: auto;
}

.grid-header .graph-tag li:last-child {
    margin-right: 0;
}

.ibt-split-table.two-row .without-remark .graph-wrap {
    height: 100%;
}

.nested-sub-header {
    float: left;
    width: 100%;
    color: var(--category-head);
    font-size: 12px;
    line-height: 14px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .2);
    margin: 20px 0 0 0;
    display: none;
}

.sub-menu-right-block .menu-section.active .nested-sub-header {
    display: block;
}

.ibt-body .stakeholders-wrapper .stakeholders-header {
    padding: 0;
}

.split-dropdown {
    float: left;
    width: 100%;
}

.split-dropdown .select-box {
    float: left;
    width: calc((100% / 2) - 10px);
    margin-right: 20px;
}

.split-dropdown .select-box:last-child {
    margin-right: 0;
}

.addmore-link-block {
    float: left;
    width: 100%;
    margin: 16px 0;
}

.addmore-link-block a {
    float: left;
    color: var(--default-color);
    font-size: 14px;
    line-height: 17px;
}

.pj-data-container {
    float: left;
    width: 100%;
    padding: 20px 0 0 0;
}

.ind-pj-data {
    float: left;
    width: calc((100% / 4) - 15px);
    height: 280px;
    margin-right: 20px;
    margin-bottom: 20px;
    background-color: #FFFFFF;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    cursor: pointer;
    position: relative;
}

.ind-pj-data:nth-child(4n) {
    margin-right: 0;
}

.pj-data-image {
    float: left;
    width: 100%;
    height: 150px;
    border-bottom: 1px solid #EEEEEE;
    position: relative;
}

.pj-data-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pj-data-content {
    float: left;
    width: 100%;
    padding: 16px 20px;
    border-bottom: 1px solid #EEEEEE;
}

.pj-data-content h5 {
    float: left;
    width: 100%;
    color: #2C3137;
    font-size: 14px;
    font-weight: 600;
    line-height: 17px;
    margin-bottom: 6px;
    transition: .3s ease-out;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    white-space: nowrap;
}

.ind-pj-data:hover .pj-data-content h5 {
    color: var(--default-color);
}

.pj-data-content p {
    float: left;
    width: 100%;
    color: #999999;
    font-size: 12px;
    line-height: 18px;
    min-height: 36px;
    overflow: hidden;
}

.pj-data-footer {
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.pj-data-footer p {
    color: #999999;
    font-size: 12px;
    line-height: 14px;
}

.pj-data-content p {
    max-height: 36px;
    overflow: hidden;
}

.ibt-financial-body {
    float: left;
    width: 100%;
    padding: 20px 0;
}

.stakeholders-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
    overflow-y: auto;
}

.stakeholders-row {
    float: left;
    width: 100%;
}

.stakeholders-header {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.stakeholders-header h5 {
    float: left;
    width: 100%;
    color: #2E3243;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
}

.stakeholders-lister-block {
    float: left;
    width: 100%;
}

.ind-stakeholders-list {
    float: left;
    width: calc((100% / 4) - 15px);
    margin-right: 20px;
    margin-bottom: 20px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.profile-preview-block {
    float: left;
    width: 100%;
}

.profile-preview-header {
    float: left;
    width: 100%;
    height: 120px;
    background: linear-gradient(180deg, #B8C7CB 0%, #A2A2A2 100%);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    padding-top: 25px;
    text-align: center;
}

.profile-preview-header h5 {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 300;
    line-height: 17px;
    text-align: center;
}

.profile-preview-body {
    float: left;
    width: 100%;
    height: 220px;
    position: relative;
    padding: 10px;
    padding-top: 68px;
}

.user-profiles-image {
    float: left;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    position: absolute;
    left: calc(50% - 55px);
    top: -55px;
    border: 5px solid #ffffff;
}

.user-profiles-image img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.user-profile-det {
    float: left;
    width: 100%;
    margin-bottom: 23px;
}

.user-profile-det h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    text-align: center;
    margin-bottom: 3px;
}

.user-profile-det p {
    float: left;
    width: 100%;
    color: #BDBDBD;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
}

.user-profile-det .pnone-numb {
    color: var(--default-text);
    font-size: 12px;
    line-height: 18px;
    text-align: center;
    margin-top: 16px;
}

.ind-stakeholders-list:nth-child(4n) {
    margin-right: 0;
}

.sector-wrapper .bsy-table tr td {
    font-size: 16px;
    line-height: normal;
}

.sector-wrapper .pj-first-left-section.vertical-desc h5 {
    font-size: 16px;
    max-height: 17px;
    line-height: 17px;
}

.table-all-wrapper .bsy-table tbody tr td {
    font-size: 14px;
}

.table-all-wrapper .bsy-table tbody tr td .pj-first-left-section.vertical-desc h5 {
    font-size: 16px;
    max-height: 17px;
    line-height: 17px;
    max-width: unset;
}

.table-all-wrapper .bsy-table tbody tr td .pj-first-left-section.vertical-desc {
    width: auto;
}

.data-room-controller {
    float: left;
    width: 100%;
    height: 100%;
    padding-top: 20px;
    position: relative;
}

.data-room-left {
    float: left;
    width: 222px;
    height: 100%;
    border: 1px solid #DEE1E4;
    border-right: 0;
}

.data-room-right {
    float: left;
    width: calc(100% - 222px);
    height: 100%;
    background-color: #FFFFFF;
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.05);
}

.dataroom-accord .card {
    float: left;
    width: 100%;
    border: 0;
    background-color: transparent;
    border-bottom: 1px solid #DEE1E4;
}

.dataroom-accord .card-header {
    background: transparent;
    height: 42px;
    display: flex;
    align-items: center;
    padding: 0 50px 0 20px;
    color: #2C3137;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    position: relative;
    cursor: pointer;
}

.dataroom-accord .card-body {
    float: left;
    width: 100%;
    border-top: 1px solid #DEE1E4;
}

.dataroom-accord .card-header:after {
    content: "";
    background: var(--sprite-three) no-repeat -184px -19px;
    width: 10px;
    height: 6px;
    position: absolute;
    right: 20px;
    top: calc(50% - 3px);
    transform: rotate(180deg);
    transition: .3s ease-out;
}

card-header collapsed .dataroom-accord .card-header.collapsed:after {
    transform: rotate(0);
}

.dataroom-accord .control-indicator {
    width: 11px;
    height: 11px;
    top: calc(50% - 6.5px);
}

.dataroom-accord .control {
    padding-left: 20px;
    color: #2C3137;
    font-size: 12px;
    width: 100%;
    float: left;
}

.dataroom-accord .select-chk-block {
    width: 100%;
    margin-bottom: 21px;
}

.dataroom-accord .select-chk-block:last-child {
    margin-bottom: 0;
}

.dataroom-accord .control-checkbox .control-indicator:after {
    background: var(--sprite-two) no-repeat -43px -232px;
    width: 7px;
    height: 5px;
    left: calc(50% - 3.5px);
    top: calc(50% - 2.5px);
}

.dataroom-manager {
    float: left;
    width: 100%;
    height: 100%;
}

.dataroom-manager-header {
    float: left;
    width: 100%;
    height: 88px;
    border-bottom: 1px solid #E3E5E8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.dataroom-manager-body {
    float: left;
    width: 100%;
    height: calc(100% - 88px);
}

.dataroom-manager-header-left {
    float: left;
}

.dataroom-manager-header-left h5 {
    float: left;
    width: 100%;
    color: #2E3243;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
}

.dataroom-manager-header-left p {
    float: left;
    width: 100%;
    color: #88929A;
    font-size: 12px;
    line-height: 20px;
}

.dataroom-manager-header-center {
    float: left;
}

.search-dataroom {
    float: left;
    width: 302px;
    height: 42px;
    position: relative;
}

.search-dataroom input {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid #DEE1E4;
    padding-left: 46px;
    font-size: 14px;
    color: var(--default-text);
}

.search-dataroom:before {
    content: "";
    background: var(--sprite-three) no-repeat -203px -14px;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 20px;
    top: calc(50% - 8px);
}

.search-dataroom input::placeholder {
    color: #D0D9DB;
}

.dataroom-manager-header-right {
    float: left;
}

.dataroom-option {
    float: left;
}

.dataroom-option li {
    float: left;
    margin-left: 33px;
}

.dr-download:before {
    background-position: -83px -135px;
    width: 16px;
    height: 16px;
}

.dr-download:hover:before {
    background-position: -83px -175px;
}

.dr-preview:before {
    background-position: -112px -137px;
    width: 18px;
    height: 12px;
}

.dr-preview:hover:before {
    background-position: -112px -177px;
}

.dr-url:before {
    background-position: -143px -135px;
    width: 16px;
    height: 16px;
}

.dr-url:hover:before {
    background-position: -143px -175px;
}

.dr-delete:before {
    background-position: -174px -135px;
    width: 14px;
    height: 16px;
}

.dr-delete:hover:before {
    background-position: -174px -175px;
}

.dr-extra-opt:before {
    background-position: -208px -135px;
    width: 6px;
    height: 16px;
}

.dr-extra-opt:hover:before {
    background-position: -208px -175px;
}

.dataroom-manager-table-header {
    float: left;
    width: 100%;
    height: 57px;
    border-bottom: 1px solid #E3E5E8;
}

.dataroom-manager-table-row {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.dataroom-manager-table-data {
    float: left;
    width: 12.5%;
    padding: 0 20px;
    color: #565656;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    position: relative;
    display: flex;
    align-items: center;
}

.dataroom-manager-table-data:first-child {
    width: 50%;
    color: #2C3137;
    font-size: 16px;
    line-height: 19px;
    font-weight: 400;
}

.dataroom-manager-table-data:last-child {
    text-align: right;
    justify-content: flex-end;
}

.sort-to-top:before {
    content: "";
    height: 25px;
    width: 25px;
    border: 1px solid #F3F3F3;
    display: inline-block;
    align-items: center;
    margin-right: 18px;
    background: var(--sprite-three) no-repeat -140px -9px;
    background-color: #fff;
    border-radius: 5px;
}

.dataroom-manager-table-body .dataroom-manager-table-row {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid #F3F3F3;
    cursor: pointer;
}

.dataroom-manager-table-body .dataroom-manager-table-data:first-child {
    color: #2C3137;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
}

.dataroom-manager-table-body .dataroom-manager-table-data {
    color: #B6C5C9;
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
}

.folder-ico:before {
    background-position: -333px -12px;
    width: 25px;
    height: 20px;
    margin-right: 17px;
}

.dataroom-manager-table-data .format {
    width: 25px;
    height: 29px;
    flex-shrink: 0;
    margin: 0;
    font-size: 7.5px;
    margin-right: 17px;
    border-radius: 3px;
}

.dataroom-manager-table-data .format:before {
    border-width: 8px 0 0 8px;
    border-radius: 0 0 0 2px;
}

.dataroom-manager-table-data .format:after {
    border-width: 8px 0 0 8px;
    border-color: #fff transparent transparent transparent;
}

.file-type-view {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.file-type-view span {
    float: left;
    width: 25px;
    height: 20px;
    margin-right: 17px;
}

.dataroom-manager-table-row:hover .resources-card-check {
    opacity: 1;
    pointer-events: auto;
    top: calc(50% - 10.5px);
    left: 22px;
}

.file-type-name {
    float: left;
    line-height: 50px;
}

.dataroom-manager-table-row:hover .file-type-view span {
    opacity: 0;
    pointer-events: none;
}

.file-type-view .resources-card-check .control-indicator {
    top: -1px;
}

.dataroom-manager-table-row.active .dataroom-manager-table-data .format {
    opacity: 0;
    pointer-events: none;
}

.dataroom-manager-table-row.active .resources-card-check {
    opacity: 1;
    pointer-events: auto;
    left: 22px;
}

.dataroom-manager-table-row.active .file-type-name,
.dataroom-manager-table-row:hover .file-type-name {
    color: var(--default-color);
}

.remain-block {
    float: left;
    width: 50%;
    display: flex;
    align-items: center;
}

.remain-block .dataroom-manager-table-data {
    width: 25%;
    float: left;
}

.mob-header {
    display: none;
}

.mobi-only {
    display: none;
}

.iot-worldmap {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ind-ibt-rating.iot {
    width: calc((100% / 7) - 15px);
    height: auto;
}

.ibt-table.iot .progress-wrapper .progress-bar {
    background: #51C08A;
}

.ibt-table.iot tbody tr td {
    color: #595B62;
}

.ibt-table.iot tbody tr:nth-child(odd) td {
    background: #fff;
}

.ibt-table.iot thead tr th {
    line-height: 30px;
}

.ibt-table.iot tbody .iot-table-total td {
    line-height: 28px;
    font-weight: 600;
}

.right-aln {
    text-align: right;
}

.ibt-progress-table.iot {
    margin: 0;
    box-shadow: none;
}

.iot-days-filter {
    float: left;
    width: 100%;
    background: #fff;
    border-top: 1px solid #EEEEEE;
    border-bottom: 1px solid #EEEEEE;
    height: 70px;
    margin-bottom: 20px;
}

.iot-filter-list li {
    float: left;
    color: #6D7381;
    font-size: 14px;
    line-height: 19px;
    margin-right: 30px;
}

.iot-filter-list {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 30px;
}

.iot-filter-list .active {
    height: 40px;
    min-width: 110px;
    background-color: var(--default-color);
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    text-align: center;
    border-radius: 5px;
}

.iot-filter-list li:hover {
    color: var(--default-color);
}

.iot-filter-list .active:hover {
    color: #fff;
}

.right-content-wrapper.fit-wrapper {
    min-width: calc(100% - 395px);
}

.value {
    color: #b1becd;
    font-size: 14px;
    line-height: 16px;
}

.positive {
    color: #4FD164;
}

.negative {
    color: #FC4850;
}

.min-val {
    min-width: 65px;
    float: left;
}

.ibt-header-top-left {
    float: left;
    width: 80%;
    height: 70px;
    display: flex;
    align-items: center;
}

.ibt-header-back-btn {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    color: #444;
    font-size: 20px;
    font-weight: 600;
    line-height: normal;
    overflow: unset;
    text-align: left;
}

.ibt-header-back-btn:before {
    background-position: -61px -141px;
    margin-right: 15px;
    width: 14px;
    height: 13px;
    flex-shrink: 0;
}

.projectdata-inprogress {
    height: 20px;
    width: auto;
    float: left;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    border: 1px solid #F8C822;
    color: #F8C822;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    margin: 0px 12px;
    padding: 0 8px;
}

.projectdata-done {
    height: 20px;
    width: auto;
    float: left;
    font-size: 12px;
    line-height: 14px;
    border: 1px solid #00B35C;
    color: #00B35C;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    margin: 0px 12px;
    padding: 0 8px;
}

.projectdata-new {
    height: 20px;
    width: auto;
    float: left;
    font-size: 12px;
    line-height: 14px;
    border: 1px solid var(--default-color);
    color: var(--default-color);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    margin: 0px 12px;
    padding: 0 8px;
}

.pj-due {
    height: 20px;
    width: 74px;
    float: left;
    color: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    background: #ca2700;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    margin: 0 12px;
}

.economy-tag {
    float: left;
    height: 20px;
    min-width: 42.04px;
    border: 1px solid #00A2F2;
    background-color: #FFFFFF;
    color: #00A2F2;
    font-size: 12px;
    line-height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    padding: 0 6px;
}

.since-date {
    color: #9a9a9a;
    font-size: 14px;
    line-height: 22px;
    margin: 0 10px;
    display: none;
}

.down-arrow-ico {
    background: transparent;
    border: 0;
    padding: 0;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.down-arrow-ico:before {
    background-position: -394px -17px;
    width: 22px;
    height: 13px;
}

.expands .ibt-header-bottom,
.expands .since-date {
    display: block;
}

.ibt-header-bottom-left {
    float: left;
    width: 150px;
    height: 150px;
    margin-right: 22px;
}

.non-image .ibt-header-bottom-left {
    display: none;
}

.ibt-header-bottom-right {
    float: left;
    width: calc(100% - 226px);
}

.non-image .ibt-header-bottom-right {
    width: 100%;
}

.ibt-header-bottom-right-left {
    float: left;
    width: 80%;
    padding-right: 20px;
}

.non-image .ibt-header-bottom-right-left {
    width: 50%;
    padding-right: 22px;
}

.ibt-header-bottom-right-bottom-left {
    float: left;
    width: 100%;
    margin-bottom: 17px;
}

.ibt-header-bottom-right-bottom-left p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    color: var(--default-grey);
}

.shw-mr {
    color: #00A2F2;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
}

.ibt-header-bottom-right-top {
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.ibt-header-details {
    float: left;
    height: 60px;
    display: flex;
    align-items: center;
    list-style-type: none;
    border: 1px solid #D1D1D1;
    padding: 0 23px;
}

.non-image .ibt-header-details {
    border-color: #E5EBF2;
    margin-right: 20px;
}

.ibt-header-details li {
    float: left;
    margin-right: 26px;
    padding-right: 26px;
    border-right: 1px solid #D1D1D1;
}

.non-image .ibt-header-details li {
    border-color: #E5EBF2;
}

.ibt-header-details li p {
    color: var(--default-grey);
    font-size: 14px;
    line-height: 16px;
    border: 1px;
}

.ibt-header-bottom-right-right {
    float: left;
    width: 20%;
}

.non-image .ibt-header-bottom-right-right {
    width: 50%;
    padding-left: 22px;
}

.sponsor-header {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    margin-bottom: 17px;
}

.ibt-header-bottom-right-bottom-right-left {
    float: left;
    width: 100%;
}

.project-users {
    float: left;
    width: 100%;
}

.project-users li {
    float: left;
    width: 50%;
    margin-bottom: 28px;
    padding-left: 40px;
    position: relative;
}

.ibt-header-details li h5 {
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.responsible:before {
    content: "R";
    width: 28px;
    height: 28px;
    border: 1px solid #00A2F2;
    background-color: #FFFFFF;
    position: absolute;
    left: 0;
    top: calc(50% - 14px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00A2F2;
    font-size: 18px;
    line-height: 14px;
    text-align: center;
    border-radius: 3px;
}

.accountable:before {
    content: "A";
    width: 28px;
    height: 28px;
    border: 1px solid #63A31C;
    background-color: #FFFFFF;
    position: absolute;
    left: 0;
    top: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #63A31C;
    font-size: 18px;
    line-height: 14px;
    text-align: center;
    border-radius: 3px;
}

.consultant:before {
    content: "C";
    width: 28px;
    height: 28px;
    border: 1px solid #9013FE;
    background-color: #FFFFFF;
    position: absolute;
    left: 0;
    top: calc(50% - 14px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9013FE;
    font-size: 18px;
    line-height: 14px;
    text-align: center;
    border-radius: 3px;
}

.informed:before {
    content: "I";
    width: 28px;
    height: 28px;
    border: 1px solid #F5911E;
    background-color: #FFFFFF;
    position: absolute;
    left: 0;
    top: calc(50% - 14px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #F5911E;
    font-size: 18px;
    line-height: 14px;
    text-align: center;
    border-radius: 3px;
}

.ibt-header-bottom {
    float: left;
    width: 100%;
    display: none;
    padding: 0px 20px 20px;
}

.ibt-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    overflow-y: auto;
}

.pj-dash .dash-wrapper {
    height: 100%;
    padding-top: 20px;
}

.pj-dash .dash-wrapper-left {
    width: 350px;
}

.pj-dash .dash-wrapper-right {
    padding-top: 0;
    width: calc(100% - 350px);
}

.overview-status {
    float: left;
    width: 100%;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ind-overview-status {
    float: left;
    margin-right: 20px;
}

.ind-overview-status p {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 4px;
    position: relative;
    padding-left: 9px;
}

.ind-overview-status h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 24px;
    font-weight: 500;
    line-height: 28px;
}

.ind-overview-status p:before {
    content: "";
    width: 5px;
    height: 12px;
    background: #b1becd;
    position: absolute;
    left: 0;
    top: calc(50% - 6px);
}

.blue-st p:before {
    background: var(--default-color);
}

.green-st p:before {
    background: #0F9D58;
}

.yellow-st p:before {
    background: #F8C822;
}

.overview-status-bottom {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.overview-status-bottom img {
    text-align: center;
}

.static-mode-block {
    float: left;
    width: 100%;
    height: calc(100% - 31px);
}

.static-mode-block.flex-graph {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.performence-rate-block {
    float: left;
    width: 100%;
}

.ind-performence-rate {
    float: left;
    width: calc((100% / 2) - 10px);
    margin-right: 20px;
    margin-bottom: 20px;
    height: 55px;
    border: 1px solid #E5EBF2;
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 16px 12px;
    display: flex;
    align-items: center;
    padding-right: 40px;
    position: relative;
}

.ind-performence-rate:nth-child(2n) {
    margin-right: 0;
}

.high-val:before {
    content: "";
    background: var(--sprite-one) no-repeat -389px -248px;
    width: 11px;
    height: 17px;
    position: absolute;
    right: 20px;
    top: calc(50% - 8.5px);
}

.low-val:before {
    content: "";
    background: var(--sprite-one) no-repeat -406px -248px;
    width: 11px;
    height: 17px;
    position: absolute;
    right: 20px;
    top: calc(50% - 8.5px);
}

.small-tab-graph .high-val:before {
    background-position: -559px -248px;
    width: 11px;
    height: 17px;
    right: 0;
}

.small-tab-graph .low-val:before {
    background-position: -576px -248px;
    width: 11px;
    height: 17px;
    right: 0;
}

.rate-ratio {
    color: var(--default-text);
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
}

.text-by {
    color: var(--default-grey);
    font-size: 14px;
    line-height: 16px;
}

.ind-overview-status:last-child {
    margin-right: 0;
}

.dash-tab thead tr th:last-child {
    text-align: right;
}

.dash-tab tbody tr td:last-child {
    text-align: right;
}

.pj-dash .dash-wrapper-left .ind-task-list-center {
    width: 100%;
}

.pj-dash .ind-task-list-center .task-text {
    padding-left: 0;
}

.dash-wrapper-left .ind-task-list:first-child {
    border-top: 1px solid transparent;
}

.dash-wrapper-left .ind-task-list:hover:first-child {
    border-color: var(--default-color);
}

.ibt-header-details li:last-child {
    border-right: 0;
    margin-right: 0;
    padding-right: 0;
}

.project-users li h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 3px;
}

.project-users li p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 15px;
}

.ind-performence-rate p {
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 24px;
}

.side-tab {
    float: left;
    width: 100%;
    height: 100%;
}

.side-tab .nav-pills {
    width: 290px;
    height: 100%;
    float: left;
    background: #ecf0f1;
    flex-direction: column;
}

.side-tab .tab-content {
    float: left;
    width: calc(100% - 290px);
    height: 100%;
    border-left: 1px solid #E3E5E8;
}

.side-tab .nav-pills .nav-link-side {
    height: 60px;
    background: transparent;
    border-bottom: 1px solid #DEE1E4;
    padding: 0 22px;
    display: flex;
    align-items: center;
    color: #2E3243;
    font-size: 14px;
    line-height: 60px;
    border-radius: .0;
    position: relative;
    font-weight: 600;
}

.side-tab .nav-pills .nav-link-side.active,
.side-tab .nav-pills .show>.nav-link-side {
    background: #fff;
    color: var(--default-text);
}

.side-tab .nav-pills .nav-link-side.active:after {
    content: "";
    width: 10px;
    height: 100%;
    background: #fff;
    position: absolute;
    right: -6px;
    bottom: 0;
}

.side-tab .tab-content .tab-pane {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px 22px;
    overflow-y: auto;
}

.tab-wrap-block h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 2px;
    font-weight: 600;
}

.tab-wrap-block p {
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 20px;
}

.project-tab-rise .data-holder.wf-hold.settings-wrap {
    padding: 0;
    background: #fff;
    border-top: 1px solid #DEE1E4;
    height: calc(100vh - 132px);
}

.data-view.field-form.small-no-tab .data-holder {
    height: calc(100% - 77px);
}

.next-stage-selector {
    float: left;
    width: 100%;
}

.tab-wrap-block .next-stage-selector {
    margin-top: 24px;
}

.next-stage-selector .control {
    color: var(--default-grey);
    font-size: 14px;
}

.next-stage-selector .select-chk-block {
    float: left;
    width: 100%;
    margin: 20px 0;
}

.next-stage-selector .select-chk-block:first-child {
    margin-top: 0;
}

.tab-wrap-block .next-stage-selector .select-chk-block {
    margin: 0;
    margin-bottom: 18px;
}

.pj-dataroom-ico:before {
    background: var(--sprite-three) no-repeat -49px -214px;
    width: 17px;
    height: 17px;
    top: calc(50% - 8.5px);
    opacity: .5;
}

.ibt-drop .pj-dataroom-ico:hover:before,
.ibt-drop .pj-dataroom-ico.active:before,
.ibt-drop .menu-section.active .pj-dataroom-ico:before {
    background-position: -49px -214px;
    opacity: 1;
}

.pj-dataroom-ico:hover:before,
.sub-menu-right .pj-dataroom-ico.active:before {
    background-position: -49px -214px;
    opacity: 1;
}

.ibt-body.dash-no-pad {
    overflow: hidden;
}

.ibt-body.dash-no-pad .dash-wrapper-left .ind-task-list:hover:first-child {
    border-top: 1px solid var(--default-color);
}

.ibt-body.dash-no-pad .dash-wrapper-left .ind-task-list:hover:last-child {
    border-bottom: 1px solid var(--default-color);
}

.pj-data-image .form-btn.form-build {
    left: calc(50% - 49.52px);
}

.pj-data-image:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .3);
    position: absolute;
}

.ibt-proj .menu-section h5 {
    text-transform: capitalize;
    color: #a9a9a9;
    font-size: 16px;
}

.sector-wrapper .bsy-table tr th.high-widthed,
.sector-wrapper .bsy-table tr td.high-widthed {
    width: 1%;
}

.status-block {
    float: left;
    width: auto;
    padding: 0 5px;
    line-height: 20px;
    background: #b1becd;
    color: #fff;
    font-size: 12px;
    border-radius: 3px;
    margin-left: 15px;
}

.status-block.done {
    background: #00b35c;
}

.status-block.new {
    background: var(--btn-color);
}

.status-block.inprogress {
    background: #DC9D36;
}

.task-tab .ind-task-list-center {
    width: calc(100% - 490px);
}

.DashBuilder-modal .graph-proprties-color.modal-panel-container {
    float: left;
    width: 100%;
}

.DashBuilder-modal .graph-proprties-color.modal-panel-container .task-input-container:first-child,
.DashBuilder-modal .graph-proprties-color.modal-panel-container .task-input-container {
    width: 100%;
    margin: 0;
}

.panel-each {
    clear: both;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #E2E7EB;
    background-color: rgba(63, 169, 245, 0.05) !important;
    margin-bottom: 10px;
    padding: 10px;
}

.settings-panel-option {
    float: left;
    display: flex;
    align-items: center;
}

.settings-panel select {
    float: left;
    border: 1px solid #e4e5e9;
    background: #fff;
    height: 40px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 32.5px 0 20px;
    font-size: 14px;
    line-height: normal;
    color: #405364;
    border-radius: 3px;
    -webkit-appearance: none;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin-left: 10px;
}

.settings-panel input {
    float: left;
    float: left;
    border: 1px solid #e4e5e9;
    background: #fff;
    height: 40px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    padding: 0 32.5px 0 20px;
    font-size: 14px;
    line-height: normal;
    color: #405364;
    border-radius: 3px;
    -webkit-appearance: none;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.settings-panel-option button {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-left: 10px;
}

.settings-panel {
    float: left;
    display: flex;
}

.news-media-left {
    float: left;
    width: 222px;
    height: 100%;
    border: 1px solid #DEE1E4;
    border-right: 0;
}

.news-media-right {
    float: left;
    width: calc(100% - 222px);
    height: 100%;
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.05);
    overflow-y: auto;
}

.news-media-controller {
    float: left;
    width: 100%;
    height: 100%;
    padding-top: 20px;
    position: relative;
}

.news-media-left {
    float: left;
    width: 222px;
    height: 100%;
    border: 1px solid #DEE1E4;
    border-right: 0;
}

.news-media-right {
    float: left;
    width: calc(100% - 222px);
    height: 100%;
    box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.05);
    overflow-y: auto;
}

.ind-news-media {
    float: left;
    width: calc((100% / 3) - 10px);
    margin-right: 15px;
    margin-bottom: 15px;
    background: #fff;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.ind-news-media:nth-child(3n) {
    margin-right: 0;
}

.news-media-header {
    float: left;
    width: 100%;
    height: 55px;
    padding: 0 15px;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 9;
}

.social-header {
    float: left;
    width: 100%;
    padding-left: 42px;
    position: relative;
    padding-right: 30px;
}

.social-header h5 {
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 14px;
    margin-bottom: 2px;
}

.social-header p {
    float: left;
    width: 100%;
    color: #bdbdbd;
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
}

.social-header p span {
    color: var(--default-grey);
}

.news-media-thumb {
    float: left;
    width: 100%;
    height: 476px;
}

.news-media-thumb div {
    float: left;
    width: 100%;
    height: 100%;
}

.news-media-thumb-if iframe {
    float: left;
    width: 100% !important;
    margin: 0 !important;
    min-width: 100% !important;
}

.news-media-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-media-main {
    float: left;
    width: 100%;
    padding: 15px;
}

.news-media-main h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
    margin-bottom: 8px;
    max-height: 23px;
    overflow: hidden;
}

.news-media-main p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 18px;
    max-height: 36px;
    overflow: hidden;
    min-height: 36px;
}

.social-header.fb h5 {
    color: #3856A2;
}

.social-header.tw h5 {
    color: #3DBDF8;
}

.social-header.yt h5 {
    color: #CE2828;
}

.social-header.insta h5 {
    color: #f58755;
}

.social-header.fb:before {
    content: "";
    width: 32px;
    height: 32px;
    background: var(--sprite-three) no-repeat -85px -211px;
    position: absolute;
    left: 0;
    top: calc(50% - 16px);
}

.social-header.tw:before {
    content: "";
    width: 32px;
    height: 32px;
    background: var(--sprite-three) no-repeat -85px -251px;
    position: absolute;
    left: 0;
    top: calc(50% - 16px);
}

.social-header.yt:before {
    content: "";
    width: 32px;
    height: 32px;
    background: var(--sprite-three) no-repeat -85px -291px;
    position: absolute;
    left: 0;
    top: calc(50% - 16px);
}

.social-header.insta:before {
    content: "";
    width: 32px;
    height: 32px;
    background: var(--sprite-three) no-repeat -85px -331px;
    position: absolute;
    left: 0;
    top: calc(50% - 16px);
}

.news-media-thumb iframe {
    float: left;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    margin: 0 !important;
    border: 0 !important;
    max-width: 100% !important;
    min-width: auto !important;
}

.news-media-header .form-option-block {
    top: 36px;
}

.system-task-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.system-task-left {
    float: left;
    width: 200px;
    height: 100%;
    background: rgba(236, 240, 241, 0.3);
    padding: 7px 20px 20px 20px;
}

.system-task-right {
    float: left;
    width: calc(100% - 200px);
    height: 100%;
}

.system-task-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.system-task-right-footer {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.step-flow {
    float: left;
    width: 100%;
}

.step-flow li {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 16px;
    line-height: 50px;
    position: relative;
}

.step-flow li nav {
    float: left;
    width: 100%;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
}

.step-flow li nav:before {
    content: "";
    width: 20px;
    height: 20px;
    border: 1px solid var(--default-grey);
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    left: 0;
    top: 14px;
}

.step-flow li nav:after {
    content: '';
    width: 6px;
    height: 10px;
    border: solid var(--default-grey);
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);
    position: absolute;
    left: 7px;
    top: 17px;
}

.step-flow li nav:hover,
.step-flow li .current {
    color: #394A59;
    font-weight: 600;
}

.step-flow li .active:hover {
    font-weight: 400;
}

.step-flow li nav:hover:before,
.step-flow li .current:before {
    border: 1px solid #394A59;
}

.step-flow li nav:hover:after,
.step-flow li .current:after {
    border-color: #394A59;
}

.step-flow li .active {
    color: #394A59;
}

.step-flow li .active:before,
.step-flow li .active:hover:before {
    background: var(--default-color);
    border-color: var(--default-color);
}

.step-flow li .active:after,
.step-flow li .active:hover:after {
    border-color: #fff;
}

.system-task-holder {
    float: left;
    width: 100%;
    height: 100%;
}

.task-tg .system-task-holder .task-inp-container .ind-task-input {
    padding: 8px 40px 0 20px;
}

.system-task-holder .task-inp-container .create-button-block {
    right: 020px;
}

.ibt-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    overflow-y: auto;
}

.task-tab .card-body .due-block {
    min-width: 90px;
    margin-left: 15px;
}

.pj-team-wrapper.project-team-holder {
    padding-top: 20px;
}

.project-disscussion {
    height: calc(100% - 72px);
}

.status-view .ind-pj-data {
    width: calc((100% / 2) - 10px);
    height: 130px;
    border-radius: 5px;
}

.status-view .ind-pj-data:nth-child(4n) {
    margin-right: 20px;
}

.status-view .ind-pj-data:nth-child(2n) {
    margin-right: 0;
}

.status-view .pj-data-image {
    display: none;
}

.status-view .pj-data-content h5 {
    font-size: 20px;
    color: #444;
    margin-bottom: 5px;
    line-height: 21px;
}

.status-view .pj-data-content p {
    color: var(--default-grey);
    min-height: auto;
    font-size: 16px;
    max-height: 19px;
}

.status-view .pj-data-footer p {
    font-size: 14px;
    color: var(--default-grey);
}

.status-view .pj-data-footer {
    height: 50px;
}

.status-view .pj-data-content {
    height: calc(100% - 50px);
}

.task-inp-container.empty-label .lb-tx {
    display: none;
}

.accordian-filter .card-header .btn-link {
    padding: 0;
    background: transparent;
}

.accordian-filter.accordion>.card {
    background: transparent;
    border: 0;
    margin-bottom: 20px;
}

.accordian-filter .card-header {
    background: transparent;
    height: auto;
}

.accordian-filter .card-body {
    float: left;
    width: 100%;
    padding: 0;
}

.filter-header {
    padding: 0;
    color: #fff;
    color: var(--category-head);
    margin-bottom: 20px;
    font-size: 11px;
    text-transform: uppercase;
    line-height: 26px;
}

.project-option-block-ab {
    position: absolute;
    right: 20px;
    top: 20px;
}

.status-view .pj-data-content {
    padding-right: 55px;
}

.milestone-task-no:before {
    background-position: -372px -355px;
    width: 17px;
    height: 17px;
    margin-right: 10px;
}

.milestone-task-day:before {
    background-position: -426px -355px;
    width: 19px;
    height: 18px;
    margin-right: 10px;
}

.accord-header-right .form-option-block.nav-option {
    margin-left: 28px;
}

.accord-header-right .form-option-block.nav-option,
.accord-header-right .form-option-block.nav-option .opt-form-ico {
    position: relative;
    right: 0;
    top: 0;
}

.accord-header-right .form-option-block .panel-option {
    top: 22px;
    right: -9px;
}

.accord-header-right .form-option-block div .panel-option {
    top: 38px;
    right: -23px;
}

.cursor {
    cursor: pointer !important;
}

.socia-filter {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.socia-filter li {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 31px;
}

.socia-filter li nav {
    float: left;
    width: 100%;
    color: var(--default-text);
    cursor: pointer;
}

.fb-ico:before {
    content: "\f082 ";
    font-family: 'FontAwesome';
    margin-right: 5px;
    font-size: 16px;
}

.tw-ico:before {
    content: "\f081";
    font-family: 'FontAwesome';
    margin-right: 5px;
    font-size: 16px;
}

.insta-ico:before {
    content: "\f16d";
    font-family: 'FontAwesome';
    margin-right: 5px;
    font-size: 16px;
}

.ytb-ico:before {
    content: "\f16a";
    font-family: 'FontAwesome';
    margin-right: 5px;
    font-size: 16px;
}

.socia-filter li:hover .fb-ico,
.socia-filter .active .fb-ico {
    color: #4267b2;
}

.socia-filter li:hover .tw-ico,
.socia-filter .active .tw-ico {
    color: #1DA1F2;
}

.socia-filter li:hover .ytb-ico,
.socia-filter .active .ytb-ico {
    color: #FF0000;
}

.socia-filter li:hover .insta-ico,
.socia-filter .active .insta-ico {
    color: #FF8343;
}

.pj-team-wrapper.project-team-holder.collection-pad-top {
    padding-top: 0;
    padding: 0 20px;
}

.collection-pad-top .resources-filters-icons {
    margin: 0;
}

.form-container .form-field-wrapper-block {
    max-height: 100%;
}

.proj-btn.delete {
    background: #e14745;
    border-color: #e14745;
}

.task-tab .card-header.proj-card-header.with-milestone {
    padding-right: 60px;
    position: relative;
}

.task-tab .card-header.proj-card-header.with-milestone .form-option-block {
    right: 20px;
    top: 32px;
}

.bydate-ico:before {
    content: "\f073";
    font-family: 'FontAwesome';
    margin-right: 5px;
    font-size: 16px;
}

.socia-filter li:hover .bydate-ico,
.socia-filter .active .bydate-ico {
    color: var(--default-color);
}

.ibt-goal-block {
    float: left;
    width: 100%;
    padding: 0 20px;
}

.ibt-goal-block h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 2px;
    font-weight: 600;
    margin-bottom: 15px;
}

.ibt-goal-block ul li {
    float: left;
    width: 73px;
    height: 73px;
    margin-right: 20px;
}

.ibt-goal-block ul li img {
    float: left;
    width: 100%;
    height: 100%;
}

.equity-team .user-profile-det p {
    text-align: left;
}

.investor-category {
    width: 45%;
    float: left;
}

.investor-category-value {
    width: 55%;
    color: var(--default-text);
    float: left;
    font-weight: 600;
    padding-left: 10px;
}

.type-view .user-profile-det p {
    font-size: 14px;
    margin-bottom: 11px;
    line-height: 20px;
}

.type-view .profile-preview-body {
    height: 315px;
    margin-bottom: 0;
}

.type-view .profile-preview-body .user-profile-det {
    margin-bottom: 0;
}

.type-view .profile-preview-body {
    padding: 68px 20px 20px 20px;
}

.grid-header.with-desc-box {
    height: 60px;
    justify-content: space-between;
}

.grid-header.with-desc-box .button-anchor {
    width: 40px;
    border-radius: 50%;
    margin-left: 10px;
}

.grid-header.with-desc-box p {
    float: left;
    font-size: 12px;
    color: var(--default-grey);
}

.grid-header.with-desc-box h5 {
    margin-bottom: 5px;
}

.overlay-mode .ibt-header {
    position: absolute;
    left: 0;
    top: 0;
}

.overlay-mode .ibt-body {
    height: calc(100% - 70px);
    margin-top: 70px;
}

.ibt-header-back-btn.button-flex {
    display: flex;
    align-items: center;
}

.ibt-header-top-left .button-flex .project-source-header {
    margin: 0;
}

.overlay-mode.expands .ibt-header-top {
    border-bottom: 1px solid #EEEEEE;
}

.overlay-mode .ibt-header-bottom {
    padding: 20px;
}

.main-title-header {
    float: left;
    color: #2C3137;
    font-size: 24px;
    font-weight: 600;
    line-height: 22px;
}

.inline-flex {
    display: flex;
    align-items: center;
    position: relative;
}

.map-container {
    float: left;
    position: relative;
}

.overlay-mode .ibt-header-top {
    border-bottom: 1px solid transparent;
}

.form-detail-container.data-view.field-form.expands {
    display: flex;
    flex-direction: column;
    align-content: stretch;
}

.tab-holder.proj-set {
    height: calc(100% - 90px);
    margin-top: 20px;
}

.proj-set .table-scrollable-in tr th {
    vertical-align: middle;
    font-weight: 600;
    text-transform: uppercase;
}

.pool-action-btn {
    background: #fff;
    border: 1px solid var(--default-color);
    color: var(--default-color);
}

.pool-action-btn:hover {
    background: var(--default-color);
    color: #fff;
    border-color: var(--default-color);
}

.btn-danger.pool-action-btn {
    background: #fff;
    border-color: #c82333;
    color: #c82333;
}

.btn-danger.pool-action-btn:hover {
    color: #fff;
    background: #c82333;
}

.pool-modal .bs-modal-body p {
    color: var(--default-grey);
    margin-bottom: 15px;
}

.pool-modal.bs-modal .btn {
    height: 35px;
    line-height: 35px;
    padding: 0 25px;
}

.task-tab .card-body .card .proj-card-header {
    padding-left: 63px;
}

.task-tab .card-body .card {
    margin-bottom: 0;
    border: 0;
    float: left;
    width: 100%;
    border-top: 1px solid #E3E5E8;
}

.right-head .right-head-data:last-child {
    float: right;
}

.task-tab .card-header h5 button.flex-direct {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.accord-header-right {
    float: left;
    display: flex;
    align-items: center;
}

.milestone-task-info li {
    float: left;
    color: var(--default-grey);
    font-size: 12px;
    font-weight: 400;
    margin-left: 55px;
    display: flex;
    align-items: center;
    line-height: 14px;
}

.milestone-task-no:before {
    background-position: -372px -355px;
    width: 17px;
    height: 17px;
    margin-right: 10px;
}

.milestone-task-day:before {
    background-position: -426px -355px;
    width: 19px;
    height: 18px;
    margin-right: 10px;
}

.accord-header-right .form-option-block.nav-option,
.accord-header-right .form-option-block.nav-option .opt-form-ico {
    position: relative;
    right: 0;
    top: 0;
}

.accord-header-right .form-option-block.nav-option {
    margin-left: 55px;
}

.accord-header-right .form-option-block .panel-option {
    top: 22px;
    right: -10px;
}

.ind-task-list:hover .quick-edit {
    opacity: 1;
    display: flex;
    align-items: center;
}

/* .ind-task-list:hover .due-block {
    display: none;
} */
.quick-edit li {
    float: left;
    width: 22px;
    height: 22px;
    background: #fff;
    border-radius: 50%;
    margin-left: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quick-edit li button {
    float: left;
    width: 100%;
    height: 100%;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
}

.dlete-task-ico:before {
    background-position: -473px -159px;
    width: 10px;
    height: 12px;
}

.float-button-new {
    float: left;
    width: 62px;
    height: 62px;
    background: #00B35C;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    line-height: 0;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.15);
    position: relative;
    transition: .4s ease-out;
}

.float-close:before {
    background-position: -307px -217px;
    width: 28px;
    height: 21px;
    left: calc(50% - 12.5px);
    top: calc(50% - 12.5px);
}

.down-arrow-ico:before {
    background-position: -394px -17px;
    width: 22px;
    height: 13px;
}

.expands .ibt-header-bottom,
.expands .since-date {
    display: block;
}

.expands .arrow-up:before {
    background-position: -394px -17px;
    width: 22px;
    height: 13px;
    transform: rotate(180deg);
}

.ibt-header-top-right.btn-option {
    padding-right: 50px;
}

.form-option-block.nav-option {
    float: left;
    position: absolute;
    right: 30px;
    top: 46px;
}

.info-msg {
    color: #f5a92c;
}

.task-tg .assign-user-validation-err {
    font-size: 12px;
}

.accordian-each-header span {
    float: left;
    width: auto;
    padding: 0 10px;
    background: #a9a9a9;
    color: #fff;
    border-radius: 5px;
    line-height: 30px;
    font-size: 14px;
}

.accordian-each {
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.accordian-each-header {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.accordian-each-header h5 {
    float: left;
    font-size: 20px;
    font-weight: 600;
    color: var(--default-text);
    line-height: 30px;
    margin-left: 15px;
}

.common-align.project-header-align .form-detail-top-left {
    display: flex;
    align-items: normal;
    flex-direction: column;
    width: 30%;
}

.project-no-option .ibt-header-top-right.btn-option {
    padding-right: 0;
}

.ibt-header-top.project-no-option.cursor {
    cursor: pointer !important;
}

.dash-tab tbody tr td .progress-wrapper h5 {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 150px;
    overflow: hidden;
}

.task-tab .card-body .ind-task-list:hover .due-block {
    display: block
}

.task-inp-container.empty-label .lb-tx {
    display: none;
}

.milestone-name {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 90%;
    float: left;
}

.board-each {
    float: left;
    width: 100%;
    height: 100%;
    background: #bdbdbd;
    border-radius: 5px;
    overflow-y: auto;
}

.board-each-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    padding: 15px;
    overflow-y: auto;
}

.board-each-footer {
    float: left;
    width: 100%;
    padding: 0 15px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.board-each-footer:before {
    content: "";
    width: 100%;
    height: 60px;
    background: linear-gradient(180deg, rgba(85, 85, 85, 0.01) 0%, #bdbdbd 70%);
    position: absolute;
    z-index: 9;
    bottom: 58px;
    transition: .3s ease-out;
}

.board-list-add.fill-col {
    width: auto;
    padding: 0 15px;
    border: 0;
    background: var(--default-color);
    color: #fff;
    border-radius: 25px;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16), 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

.board-list-add.fill-col:before {
    content: "+";
    background: none;
    font-size: 14px;
}

.board-task-count {
    float: left;
    width: 15px;
    height: 14px;
    background: #E14745;
    font-size: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    color: #fff;
    position: absolute;
    left: 10px;
    top: -8px;
    padding: 2px;
}

.board-item-button {
    float: left;
    width: 100%;
    display: none;
}

.board-item-button .general-btn {
    float: left;
    height: 25px;
    padding: 0;
    font-size: 12px;
    min-width: auto;
    padding: 0 20px;
    border-color: #0f9d58;
}

.board-each-body .ind-board-list.edit h5 {
    pointer-events: auto;
    border: 1px solid #E3E5E8;
}

.board-each-body .ind-board-list.edit .board-item-button {
    display: block;
}

.board-each-body .ind-board-list.edit .board-option {
    display: none;
}

.board-item-button .general-btn:hover {
    background-color: #0f9d58;
}

.board-each-body .ind-board-list:hover h5 {
    color: #2C3137;
}

.board-each-body .ind-board-list {
    min-height: 100px;
    height: auto;
    border: 0;
}

.board-each-body .ind-board-list h5 {
    padding: 5px;
    border: 1px solid transparent;
    pointer-events: none;
    margin-bottom: 5px;
    cursor: text;
}

.board-each-body .ind-board-list h5:focus {
    border: 1px solid rgba(64, 83, 100, 0.15);
    box-shadow: none;
    outline: none;
}

.board-list-add.top-btn {
    margin-bottom: 20px;
}

.board-task-add-ico:before {
    background-position: -484px -278px;
    width: 17px;
    height: 16px;
}

.pj-board-container.board-detail-wrapper {
    height: calc(100% - 80px);
    margin-top: 20px;
}

.board-item-button .general-btn {
    float: left;
    height: 25px;
    padding: 0;
    font-size: 12px;
    min-width: auto;
    padding: 0 20px;
    border-color: #0f9d58;
}

.board-item-button .general-btn:hover {
    background-color: #0f9d58;
}

.tile-description-box .form-option-block.nav-option {
    right: 0;
    top: 0;
}

.board-each-body .ind-board-list p {
    float: left;
    width: 100%;
    padding: 5px;
    color: var(--default-grey);
    font-size: 14px;
    border: 1px solid transparent;
    pointer-events: none;
    margin-bottom: 17px;
    cursor: text;
}

.board-each-body .ind-board-list.edit p {
    pointer-events: auto;
    border: 1px solid #E3E5E8;
}

.green {
    background-color: #0F9D58;
}

.two-side-modal .modal-header-options {
    float: left;
    display: flex;
    align-items: center;
}

.two-side-modal .modal-header-options p {
    float: left;
    margin-right: 26px;
    color: #fff;
    display: flex;
}

.two-side-modal .header-task-count {
    width: 18px;
    height: 18px;
    clear: both;
    background: #e14745;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    border-radius: 50%;
    margin-left: 7px;
}

.two-side-modal .modal-body {
    padding: 0;
    height: 400px;
}

.two-side-container {
    float: left;
    width: 100%;
    height: 100%;
}

.two-side-right {
    float: left;
    width: 230px;
    height: 100%;
    background: #ecf0f1;
    position: relative;
    padding: 20px;
}

.two-side-left {
    float: left;
    width: calc(100% - 230px);
    height: 100%;
    position: relative;
}

.float-inside-btn {
    float: left;
    width: 35px;
    height: 35px;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    line-height: 0;
    background-color: var(--default-color);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    position: relative;
    transition: .4s ease-out;
    position: absolute;
    right: 20px;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.float-inside-btn:before {
    content: "+";
    color: #fff;
    font-size: 29px;
    font-weight: 300;
}

.options-button {
    height: 35px;
    width: 35px;
    border-radius: 5px;
    background-color: var(--btn-color);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    position: absolute;
    right: 20px;
    bottom: 20px;
}

.options-button.attach:before {
    content: "";
    background: var(--sprite-one) no-repeat -144px -449px;
    width: 17px;
    height: 14px;
    display: inline-block;
}

.options-button.project:before {
    content: "";
    background: url(images/projects-icon.svg) no-repeat;
    width: 12px;
    height: 16px;
    display: inline-block;
    top: -2px;
    position: relative;
}

.each-info {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.each-info h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    margin-bottom: 15px;
    font-weight: 600;
}

.each-attachment-container {
    float: left;
    width: 100%;
}

.each-attachment {
    float: left;
    width: calc((100% / 4) - 15px);
    margin-right: 15px;
    margin-bottom: 15px;
}

.each-attachment img {
    float: left;
    width: 100%;
}

.options-button input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    cursor: pointer;
    left: 0;
    top: 0;
}

.options-button input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.two-side-left .main-panel-holder.has-filter {
    height: 100%;
    padding: 20px;
}

.two-side-left .ind-task-list-center {
    width: 200px;
}

.two-side-left .ind-task-list-left {
    width: 100px;
}

.ibt-header .float-button-block {
    position: absolute;
    display: none;
    right: 15px;
    bottom: 20px;
}

.expands .ibt-header .float-button-block {
    display: block;
}

.common-align .form-detail-top.project-top.right-extra-option {
    display: flex;
}

.chart-ico {
    float: left;
    background: transparent;
    padding: 0;
    border: 0;
    line-height: 0;
    display: flex;
    align-items: center;
    color: var(--default-grey);
    font-size: 15px;
}

.chart-ico:before {
    background-position: -8px -403px;
    width: 19px;
    height: 16px;
    margin-right: 9px;
}

.chart-ico:hover:before {
    background-position: -8px -378px;
    width: 19px;
    height: 16px;
}

.chart-ico:hover {
    color: var(--default-color);
}

.form-detail-top-right .form-option-block {
    right: 20px;
    top: 36px;
}

.pj-task-heirarchy .task-tab .card-header h5 button {
    height: 50px;
    width: 80%;
}

.accord-header-right {
    width: 20%;
    justify-content: flex-end;
    padding-right: 10px;
}

.two-side-left .ind-task-list:hover .due-block {
    display: block;
}

.board-each-body .ind-board-list.edit .desc-board {
    height: 93px;
    font-weight: 400;
    color: var(--default-grey);
}

.each-attachment-container p {
    color: var(--default-grey);
}

.full-wid-mod.without-bg .modal-body {
    padding: 0;
    background: #fff;
}

.e-grid .e-gridheader tr th {
    vertical-align: middle;
}

.e-rowcell .col {
    padding-left: 0;
}

.board-wrap .board-list-wrapper {
    width: calc((100% / 4) - 15px);
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 3px;
    background-color: rgba(255, 255, 255, 0.5);
    padding: 15px 20px;
}

.gantt-container {
    float: left;
    width: 100%;
    height: 100%;
}

.gantt-header {
    float: left;
    width: calc(100% - 270px);
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    background: #fff;
    border-top: solid 1px #e0e0e0;
}

.gantt-header h5 {
    float: left;
    font-size: 16px;
    color: var(--default-text);
    font-weight: 600;
}

.close-chart {
    float: left;
    background: transparent;
    padding: 0;
    line-height: 0;
    border: 0;
    position: relative;
}

.close-chart:before {
    content: "";
    background: var(--sprite-one) no-repeat -81px -157px;
    width: 15px;
    height: 15px;
    display: inline-block;
}

.gantt-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.pj-board-container.board-wrap {
    height: calc(100% - 60px);
}

.bsy-modal.large-modal .modal-body {
    height: 520px;
    padding: 0;
}

.bsy-modal.large-modal {
    padding: 0;
}

.bsy-modal.large-modal .modal-lg {
    max-width: 1000px;
}

.board-new-container {
    float: left;
    width: 100%;
    height: 100%;
}

.board-new-left {
    float: left;
    width: calc(100% - 280px);
    height: 100%;
}

.board-new-right {
    float: left;
    width: 280px;
    height: 100%;
    background-color: #ECF0F1;
    border-radius: 0 5px 5px 0;
    border: 1px solid rgba(64, 83, 100, 0.15);
}

.board-new-left-header {
    float: left;
    width: 100%;
    height: 60px;
}

.board-new-left-header .input-block {
    float: left;
    width: 100%;
    height: 100%;
}

.board-new-left-header .input-block .input-box {
    height: 100%;
    border: 0;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 21px;
    padding-top: 24px;
    text-overflow: ellipsis;
    max-width: 100%;
    overflow: hidden;
    background: transparent;
}

.board-new-left-footer {
    float: left;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 20px;
}

.board-new-left-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.board-new-left-body .new-task-input {
    float: left;
    width: 100%;
    padding: 13px 20px;
    height: 160px;
}

.new-task-input.text-input label {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
}

.board-new-left-body .new-task-input.text-input textarea {
    color: var(--default-text);
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    padding: 3px 0;
    background: transparent;
}

.board-task-container {
    float: left;
    width: 100%;
    height: calc(100% - 160px);
}

.board-task-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.board-task-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 19px;
    height: 50px;
    display: flex;
    align-items: center;
}

.board-task-header h5 span {
    font-weight: 600;
}

.board-task-header p {
    float: left;
    color: #9698A1;
    font-size: 12px;
    line-height: 14px;
    text-align: right;
}

.board-task-body {
    float: left;
    width: 100%;
}

.ind-board-task {
    float: left;
    width: 100%;
    height: 50px;
    padding: 0 20px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.board-task-left {
    float: left;
    width: 200px;
    padding-right: 20px;
    height: 50px;
    display: flex;
    align-items: center;
}

.board-task-left p {
    float: left;
    color: var(--default-grey);
    font-size: 14px;
    line-height: 20px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 150px;
    width: 150px;
}

.board-task-center {
    float: left;
    width: calc(100% - 340px);
    height: 50px;
    display: flex;
    align-items: center;
}

.board-task-center h5 {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
    overflow: hidden;
}

.board-task-right {
    float: right;
    width: 140px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.board-task-right .due-block {
    width: 100px;
    margin-left: 0;
    color: var(--default-grey);
    font-size: 14px;
}

.board-task-cont-ico:before {
    content: "";
    background-position: -429px -141px;
    width: 13px;
    height: 13px;
    margin-right: 10px;
}

.board-new-right-header {
    float: left;
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.board-new-right-header h5 {
    float: left;
    color: #1C1F2B;
    font-size: 12px;
    font-weight: 600;
    line-height: 19px;
    text-transform: uppercase;
}

.board-new-right-header .att-ico:before {
    transform: rotate(180deg);
}

.mod-close-ico {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: relative;
}

.mod-close-ico:before {
    content: "";
    background: var(--sprite-one) no-repeat -379px -71px;
    width: 13px;
    height: 13px;
    display: inline-block;
}

.att-ico:before {
    background-position: -189px -406px;
    width: 17px;
    height: 14px;
    margin-right: 10px;
    position: relative;
    top: 0px;
}

.board-new-right-body {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: calc(100% - 60px);
}

.file-each {
    float: left;
    width: calc((100% / 3) - 14px);
    height: 66px;
    margin-right: 20px;
    background: #fff;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: .3s ease-out;
    margin-bottom: 20px;
    cursor: pointer;
}

.file-each:nth-child(3n) {
    margin-right: 0;
}

.file-each .format {
    width: 29px;
    height: 34px;
    font-size: 10px;
}

.file-each .format:before,
.file-each .format:after {
    border-width: 10px 0 0 10px;
}

.file-each.image-type img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 5px;
}

.file-each-opt button {
    float: left;
    width: 20px;
    height: 20px;
    opacity: 0.8;
    border-radius: 3px;
    background-color: #3897DC;
    border: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 5px;
}

.file-each-opt {
    float: left;
    display: flex;
    position: absolute;
    left: calc(50% - 22.5px);
    top: calc(50% - 10px);
    opacity: 0;
    pointer-events: none;
    z-index: 9;
}

.file-each-opt button:first-child {
    margin-left: 0;
}

.file-each.image-type:hover .file-each-opt {
    opacity: 1;
    pointer-events: auto;
}

.file-each.image-type:hover:before {
    content: "";
    width: 100%;
    height: 100%;
    background: #000000;
    opacity: .8;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 5px;
    transition: .3s ease-out;
    z-index: 8;
}

.file-each .preview:before {
    content: "";
    background: var(--sprite-two) no-repeat -446px -144px;
    width: 9px;
    height: 6px;
    display: inline-block;
}

.file-each .download:before {
    content: "";
    background: var(--sprite-two) no-repeat -459px -144px;
    width: 5px;
    height: 6px;
    display: inline-block;
}

.tile-options-in-bottom {
    float: left;
    width: 100%;
    height: 30px;
    display: flex;
    align-items: center;
}

.tile-description-box.box-no-board {
    border-bottom: 0;
    margin-bottom: 12px;
}

.board-deck-ico:before {
    background-position: -282px -278px;
    width: 15px;
    height: 17px;
}

.task-status {
    float: left;
    height: 15px;
    background: #ccc;
    padding: 0 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    text-transform: uppercase;
    color: #fff;
    border-radius: 3px;
    margin-left: 8px;
}

.task-status.inprogress {
    background: #F8C822;
}

.task-status.new {
    background: var(--default-color);
}

.task-status.done {
    background: #03B86E;
}

.ind-board-list textarea {
    border: 1px solid #ececec;
    padding: 7px;
    font-size: 16px;
    line-height: 18px;
}

.card-close:before {
    background-position: -212px -335px;
    width: 12px;
    height: 12px;
}

.card-close {
    float: left;
    width: 12px;
    height: 12px;
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
}

.bottom-part {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}

.bottom-part .general-btn.green {
    height: 30px;
    border: 1px solid #0f9d58;
}

.bottom-part .general-btn.green:hover {
    height: 30px;
    border: 1px solid var(--default-color);
}

.ind-board-list.newcard {
    height: auto;
    min-height: 100px;
}

.ind-board-list.added {
    height: auto;
    min-height: 70px;
}

.board-footer {
    float: left;
    width: 100%;
    padding: 15px 0;
}

input.input-box.small-box {
    height: 20px;
    border: 1px solid transparent;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    padding: 0;
    background: transparent;
}

.input-box.small-box::placeholder {
    color: var(--default-text) !important;
}

.active-header {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
    position: absolute;
    left: 20px;
    top: 15px;
}

.ibt-drop .menu-section.min-ht.active h5 {
    height: 44px;
}

.menu-section.min-ht.active {
    padding-top: 0;
}

.side-tab .tab-content .tab-pane .edit-template-left .collection-card-left:before {
    content: none;
}

.edit-template-right-body .card-container.grid-view.template-collection .collection-card-left:before {
    content: none;
}

.side-tab .tab-content .tab-pane .grid-view .ind-collection-card .edit-template-right-body .ind-collection-card .collection-card-image .format:after {
    border-color: #fafafa transparent transparent transparent;
}

.date-drop .form-control {
    border-right: 0;
    border-left: 0;
    border-top: 0;
    padding: 0;
    border-bottom: 1px solid #ECEFF1;
    height: 36px;
    padding-right: 30px;
    border-radius: 0;
}

.date-drop:before {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 0;
    top: calc(50% - 4px);
    right: 12px;
    z-index: 9;
}

.width-adjust.date-drop {
    margin-right: 0;
    width: calc(100% / 2 - 10px);
}

.input-same-line .width-adjust.date-drop {
    margin-right: 20px;
}

.input-same-line .width-adjust.date-drop:last-child {
    margin-right: 0;
}

.project-disscussion {
    width: 100%;
    float: left;
    height: calc(100% - 97px);
}

.drop-to-bottom .rdtPicker {
    bottom: unset;
    top: 34px;
    right: 0;
    background: #fff;
    height: 224px;
}

.width-adjust.task-inline.no-margin {
    margin-right: 0;
    width: calc(100% / 2 - 10px);
}

.small-height-modal .modal-body {
    overflow-y: auto;
    max-height: 305px;
}

.pj-board-container .pj-team-wrapper.with-header-hgt .task-tab {
    height: calc(100% - 50px);
}

.small-height-modal .modal-body {
    overflow-y: auto;
    max-height: 305px;
}

.bsy-table.project-listing-table tbody tr td {
    position: relative;
}

.accord-header-right .form-option-block.nav-option.outside-div .opt-form-ico {
    background: transparent;
    border: 0;
    padding: 0;
    width: 25px;
    height: 21px;
    float: left;
    line-height: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: -11px;
    top: -10px;
}

.accord-header-right .form-option-block.outside-div .panel-option {
    top: 12px;
    right: -21px;
}

.board-mod-tab {
    float: left;
    height: 50px;
    display: flex;
    align-items: center;
}

.board-mod-tab h5 {
    padding: 0 35px;
    position: relative;
    cursor: pointer;
}

.board-mod-tab h5.active:after {
    content: "";
    width: 100%;
    height: 2px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    bottom: -1px;
}

.board-discussion-cont-ico:before {
    background: var(--sprite-one) no-repeat -332px -359px;
    width: 13px;
    height: 13px;
    margin-right: 10px;
}

.board-details-cont-ico:before {
    background-position: -8px -325px;
    width: 16px;
    height: 12px;
    margin-right: 10px;
}

.board-task-body-container {
    float: left;
    width: 100%;
    height: calc(100% - 130px);
}

.board-task-body-container .board-task-body {
    height: calc(100% - 80px);
}

.board-discussion-footer .chat-attach-block:before {
    background-position: -101px -408px;
    width: 17px;
    height: 14px;
    transform: rotate(180deg);
}

.board-discussion-footer {
    float: left;
    width: 100%;
    height: 50px;
    padding: 0 20px;
    border-top: 1px solid rgba(64, 83, 100, 0.15);
}

.board-discussion-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
}

.board-discussion-container {
    float: left;
    width: 100%;
    height: calc(100% - 100px);
}

.ind-board-discussion-comment {
    float: left;
    width: 100%;
}

.board-discussion-comment-thumb {
    float: left;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 10px;
}

.board-discussion-comment-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.board-discussion-comment-content {
    float: left;
    width: calc(100% - 40px);
}

.comment-content-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5px;
}

.comment-content-header h5 {
    float: left;
    font-size: 16px;
    color: var(--default-color);
    font-weight: 600;
}

.comment-content-header p {
    float: left;
    font-size: 12px;
    color: var(--default-grey);
}

.comment-content-body {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}

.comment-content-body p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 15px;
}

.reply-link {
    float: left;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-color);
    margin-top: 5px;
}

.pj-inp-container .tag-wrapper-bl {
    padding-left: 0;
}

.full-side-down.input-same-line .width-adjust.date-drop.label-perst {
    width: 100%;
}

.full-side-down .task-input-block.width-adjust.task-inline.no-margin.label-perst .code-block {
    width: 100%;
}

text#mapsmeasuretext {
    display: none;
}

.drag-div {
    float: left;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
}

.pj-board-container.board-wrap.board-70 {
    height: calc(100% - 70px);
}

.milestone-header {
    float: left;
    width: 100%;
    display: flex;
}

.miles-table.miles-extra .table thead tr th:first-child {
    width: 35%;
}

.miles-extra .milestone-name {
    min-width: 50%;
    padding-right: 12px;
}

.miles-extra .mile-progress .progress {
    width: 90px;
}

.miles-extra .mile-progress {
    width: 116px;
}

@-moz-document url-prefix() {
    .board-task-container {
        height: calc(100% - 108px);
    }
}

.board-task-body .task-tg .ind-task-input {
    margin: 0;
    padding: 0 20px;
    min-height: 50px;
    padding-top: 10px;
}

.board-task-body .task-tg.input-auto-complete .ind-task-input {
    padding-top: 13px;
}

.board-task-body .task-input-block.date-drop {
    padding: 0 20px;
}

.board-task-body .date-same-line {
    border-bottom: 1px solid #ECEFF1;
    float: left;
    width: 100%;
}

.hint-label {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    margin-bottom: 15px;
}

.data-room-wrapper {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.control-section {
    float: left;
    width: 100%;
    height: 100%;
}

.control-section .e-filemanager {
    float: left;
    width: 100%;
    height: 100% !important;
}

.expands .ibt-body.db-full {
    height: 100%;
}

.white-modal .task-head-text {
    color: #2B2A2A;
    font-size: 20px;
    line-height: 24px;
}

.white-modal .icon-in.icon-close-in {
    background-position: -379px -71px;
    width: 13px;
    height: 13px;
}

.new-task-input.share-link h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
}

.new-task-input.share-link input {
    border: 1px solid #ECEFF1;
    border-radius: 5px;
    padding: 0 20px;
}

.white-modal .modal-sm .modal-body {
    height: 135px;
}

.board-modal-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.board-modal-header {
    float: left;
    width: 100%;
    height: 55px;
    border-bottom: 1px solid #E3E5E8;
    border-radius: 5px 5px 0 0;
    padding-right: 50px;
    background: var(--theme-second);
}

.board-modal-body {
    float: left;
    width: 100%;
    height: calc(100% - 55px);
}

.board-modal-header .input-box {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 0;
    border: 0;
    border-radius: 5px 5px 0 0;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
    background: var(--theme-second);
    color: #fff;
}

.board-modal-header .mod-close-ico {
    position: absolute;
    right: 18px;
    top: 21px;
}

.board-modal-body-left {
    float: left;
    width: 280px;
    height: 100%;
}

.board-modal-body-right {
    float: left;
    width: calc(100% - 280px);
    height: 100%;
    border-left: 1px solid #E3E5E8;
    background-color: #ECF0F1;
    border-radius: 0 0 5px 0;
}

.board-modal-body-left .new-task-input.text-input label {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 5px;
}

.board-modal-body-left .new-task-input.text-input textarea {
    padding: 0;
    color: #444;
    font-size: 18px;
    line-height: 22px;
    min-height: 120px;
    word-break: break-word;
    border-bottom: 0;
}

.board-modal-body-left .new-task-input.text-input {
    margin-bottom: 30px;
    height: auto;
    border-bottom: 0;
}

.non-edit {
    pointer-events: none;
    cursor: text;
}

.board-tag-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.board-tag-header nav {
    color: var(--default-color);
    font-family: "Source Sans Pro";
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 5px;
    cursor: pointer;
}

.board-modal-body-left .new-task-input.text-input .board-tag-header label {
    width: auto;
}

.board-tag-body {
    float: left;
    width: 100%;
}

.ind-tag-list {
    float: left;
    height: 25px;
    min-width: 92px;
    border-radius: 3px;
    background-color: #E1E4E6;
    display: flex;
    align-items: center;
    margin-right: 10px;
    margin-bottom: 10px;
    padding-right: 25px;
    padding-left: 12px;
    position: relative;
}

.close-tag {
    float: left;
    width: 16px;
    height: 16px;
    background: transparent;
    border: 0px;
    padding: 0;
    line-height: 0;
    position: absolute;
    right: 7px;
    top: calc(50% - 8px);
}

.close-tag:before {
    content: "";
    background: var(--sprite-two) no-repeat -238px -94px;
    width: 8px;
    height: 8px;
    display: inline-block;
}

.ind-tag-list h5 {
    float: left;
    color: var(--default-text);
    font-family: "Source Sans Pro";
    font-size: 12px;
    line-height: 15px;
}

.board-attachment-cont-ico:before {
    background-position: -189px -406px;
    width: 17px;
    height: 14px;
    margin-right: 10px;
    position: relative;
    top: 0px;
}

.board-modal-body-right .board-task-container {
    height: 100%;
}

.board-modal-body-right .ind-board-task {
    border: 1px solid rgba(64, 83, 100, 0.15);
    background: #fff;
    border-bottom: 0;
    cursor: pointer;
}

.board-modal-body-right .ind-board-task:last-child {
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.board-modal-body-right .board-task-body-container .board-task-body {
    padding: 20px;
}

.board-modal-body-right .board-discussion-footer {
    background: #fff;
}

.board-modal-body-right .ind-board-discussion-comment {
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 5px;
    background-color: #FFFFFF;
    padding: 12px 20px;
    margin-bottom: 20px;
}

.board-modal-body-right .comment-content-body {
    margin-bottom: 0;
}

.board-attachment-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.board-attachment-wrapper .board-new-right-body {
    padding: 0;
    height: 100%;
    padding: 20px;
}

.board-attachment-wrapper .file-each {
    width: calc((100% / 8) - 18px);
}

.board-attachment-wrapper .file-each:nth-child(3n) {
    margin-right: 20px;
}

.board-attachment-wrapper .file-each:nth-child(8n) {
    margin-right: 0;
}

.file-each-opt.single-opt {
    justify-content: center;
    align-items: center;
    width: 100%;
    left: 0;
}

.board-discussion-container.full-height-board {
    height: calc(100% - 50px);
    position: relative;
}

.board-new-left-footer .general-btn {
    padding: 0 20px;
}

.date-container-block {
    float: left;
}

.task-tg .dynamic-creation .persitant-footer .group-container.align-equal .date-container-block .input-log-time.date {
    width: 46%;
}

.task-tab .card-body .ind-task-list-click .quick-edit {
    right: -20px;
}

.accord-header-right .milestone-task-info li:last-child {
    margin-left: 0;
}

.task-tab .accordian-each .card-body .card {
    border: 1px solid #E3E5E8;
}

.task-tab .accordian-each .card-body .card:last-child {
    border-top: 0;
}

.start-block {
    font-size: 12px;
    color: #777777;
    margin-left: 10px;
}

.board-modal-body-left .date-same-line .date-drop.label-perst .form-control {
    padding: 0;
    font-size: 15px;
    height: 20px;
}

.board-modal-body-left .input-same-line.task-tg.date-same-line label {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 5px;
    text-transform: uppercase;
    float: left;
    width: 100%;
}

.board-modal-body-left .input-same-line.task-tg.date-same-line {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}

.board-modal-body-left .task-tg .ind-task-input {
    padding-right: 0;
    margin-top: 0;
}

.board-modal-body-left .task-tg.grey-tag .selectize-custom .sl-tag {
    border-radius: 3px;
    background-color: #E1E4E6;
    color: #444;
    padding-left: 7px;
}

.board-modal-body-left .task-tg.grey-tag .selectize-custom .sl-tag .tag-right {
    color: #444;
    text-transform: CAPITALIZE;
}

.board-modal-body-left .grey-tag .selectize-custom .tag-cl {
    font-size: 18px;
    color: var(--default-grey);
    font-weight: 600;
}

.board-modal-body-left-body {
    float: left;
    width: 100%;
    height: calc(100% - 80px);
    padding: 10px 20px;
    overflow-y: auto;
}

.board-modal-body-left-footer {
    float: left;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 20px;
}

.board-modal-body-left-body .select-drop-click-right {
    flex-direction: column;
    align-items: flex-start;
}

.board-modal-body-left-body .select-drop li.selected .select-drop-click-right h5 {
    white-space: nowrap;
}

.board-modal-body-left-body .select-drop-click-right h5 {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
    overflow: hidden;
}

.board-modal-body-left-body .select-drop {
    max-height: 200px;
    margin-bottom: 20px;
}

.board-modal-body-left-body .to-down .rdtPicker {
    bottom: unset !important;
    top: 100% !important;
    margin-bottom: 20px;
    left: -13px;
}

.modal-header.builder-header {
    height: 40px;
    padding: 0;
    background: var(--default-text);
    padding: 0;
}

.menu-section .non-anchor {
    cursor: unset;
}

.form-detail-top-left.common-bk-button.wid-75 {
    width: 75%;
    cursor: pointer;
}

.common-align .form-detail-top.project-top .wid-75 h5 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.project-collection-wrap .form-table {
    max-width: calc(100vw - 395px);
}

.ibt-body .accord-header-right {
    width: 30%;
}

.ibt-body .accord-header-right .milestone-task-info li {
    margin-left: 20px;
}

.ibt-body .accord-header-right .milestone-task-info li:last-child {
    margin-left: 20px;
}

.height-430 {
    height: 430px;
}

.meeting-container {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--default-color);
}

.header-text-title {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 40px;
    font-weight: 100;
    line-height: 48px;
    text-align: center;
    margin-bottom: 30px;
}

.meeting-container .general-btn {
    padding: 0 40px;
    border-radius: 23px;
    height: 50px;
    font-size: 16px;
    font-weight: 400;
    background: #5c9be5;
    position: relative;
    z-index: 9;
    font-size: 16px;
    text-transform: uppercase;
}

.meeting-container:before {
    content: "";
    width: 100%;
    height: 100%;
    background: var(--brand-pattern) no-repeat center;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 8;
}

.center-panel {
    float: left;
    width: 600px;
    height: 350px;
    background: #fff;
    border-radius: 30px;
    box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.08);
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 9;
}

.task-tg .dynamic-creation .persitant-footer .group-container.align-equal .date-container-block.double-block .input-log-time.date.val-error {
    border: 1px solid #ff9393 !important;
}

.push-right {
    float: right;
    padding: 0 25px;
    margin-right: 20px;
}

.ibt-body.db-full.dynamic-dashboard.no-header {
    margin-top: 0;
    height: 100%;
}

.ibt-body.db-full.dynamic-dashboard.no-header.dashboard-header-adj {
    height: calc(100% - 157px);
}

.pj-meeting-ico:before {
    background-position: -518px -278px;
    width: 18px;
    height: 18px;
}

.pj-meeting-ico:hover:before,
.sub-menu-right .pj-meeting-ico.active:before {
    background-position: -518px -303px;
}

.pj-board-container.board-wrap.board-full {
    height: 100%;
}

.form-detail-top-right {
    flex-shrink: 0;
}

.project-resource .resources-filters {
    padding-top: 0;
}

.project-resource .resources-list {
    height: calc(100% - 95px);
}

.main-panel-holder.project-resource {
    padding: 0;
}

.main-panel-holder.project-pool {
    height: calc(100vh - 99px);
    padding: 0 20px;
}

.board-modal-body-right-container {
    float: left;
    width: calc(100% - 280px);
    height: 100%;
    border-right: 1px solid rgba(64, 83, 100, 0.15);
}

.board-modal-body-right-container .board-modal-body-right {
    float: left;
    width: 100%;
    height: calc(100% - 120px);
    border-radius: 0;
}

.board-descriptin-box .new-task-input {
    float: left;
    width: 100%;
    height: 100%;
    padding: 10px 20px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.board-descriptin-box .new-task-input.text-input textarea {
    padding-top: 5px;
    padding-bottom: 0;
    height: calc(100% - 14px);
    background: #f6f8f8;
}

.board-descriptin-box {
    float: left;
    width: 100%;
    height: 120px;
    background: #F6F8F8;
}

.board-modal-body-left-container {
    float: left;
    width: 280px;
    height: 100%;
}

.input-same-line:hover .label-wraper button,
.new-task-input:hover .label-wraper button {
    opacity: 1;
    pointer-events: auto;
}

.board-modal-body-left .input-same-line.task-tg.date-same-line .label-wraper label {
    width: auto;
}

.label-wraper button {
    background: transparent;
    padding: 0;
    line-height: 0;
    background: transparent;
    border: 0;
    position: relative;
    top: -1px;
    margin-left: 6px;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.label-wraper .wf-ed:before {
    background-position: -93px -451px;
    width: 11px;
    height: 11px;
}

.board-modal-body-left .new-task-input.text-input .label-wraper label {
    width: auto;
}

.non-editable .task-tg .task-input-block {
    pointer-events: none;
}

.non-editable .date-drop:before {
    content: none;
}

.non-editable .tag-wrapper-bl {
    pointer-events: none;
}

.board-modal-body-left .non-editable .date-drop.label-perst .form-control {
    pointer-events: none;
}

.board-modal-body-left .non-editable .task-inp-container {
    border-bottom: 1px solid transparent;
}

.non-editable .task-tg .tag-wrapper-bl input {
    display: none;
}

.meta-edit .label-wraper button {
    display: none;
}

.board-modal-body-left-body .task-tg .task-input-block.date-drop {
    padding-bottom: 5px;
    border-bottom: 1px solid #ECEFF1;
}

.board-modal-body-left-body .task-tg.non-editable .task-input-block.date-drop {
    border-bottom: 1px solid transparent;
}

.board-task-body-container.board-task-wrap {
    height: calc(100% - 50px);
    position: relative;
}

.add-task-button {
    float: left;
    width: 40px;
    height: 40px;
    background: var(--default-color);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    line-height: 0;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.15);
    position: relative;
    transition: .4s ease-out;
    position: absolute;
    right: 20px;
    bottom: 20px;
    z-index: 9;
}

.add-task-button:before {
    background-position: -34px -122px;
    width: 25px;
    height: 25px;
    left: calc(50% - 12.5px);
    top: calc(50% - 12.5px);
    zoom: .7;
}

.back-to-list-button-block {
    float: left;
    position: relative;
    padding-left: 18px;
    display: flex;
    align-items: center;
}

.back-to-list-button {
    float: left;
    width: 14px;
    height: 13px;
    position: absolute;
    left: 0;
    top: calc(50% - 6.5px);
    background: transparent;
    padding: 0;
    border: 0;
    cursor: pointer;
}

.back-to-list-button:before {
    background-position: -61px -141px;
    width: 14px;
    height: 13px;
}

.common-align .form-detail-top.project-top .back-to-list-button-block h5 {
    margin-bottom: 0;
}

.header-edit-button {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    margin-left: 10px;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.header-edit-button:before {
    background-position: -370px -116px;
    width: 11px;
    height: 11px;
}

.back-to-list-button-block:hover .header-edit-button {
    opacity: 1;
    pointer-events: auto;
}

.back-to-list-button-block input {
    height: 28px;
    color: #444;
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
    border: 1px solid #dfdfdf;
    border-radius: 5px;
}

.header-save-button {
    float: left;
    width: 19px;
    height: 19px;
    background: transparent;
    border: 0;
    padding: 0;
    margin-left: 10px;
    transition: .3s ease-out;
}

.header-save-button:before {
    background-position: -366px -277px;
    width: 19px;
    height: 19px;
}

.modal-body.sm-body {
    padding: 0;
    min-height: 110px;
    padding: 20px;
}

.label-name-add {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.label-name-add label {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    margin-bottom: 10px;
}

.label-name-add input {
    float: left;
    width: 100%;
    height: 40px;
    border: 1px solid #dfdfdf;
    border-radius: 5px;
    padding: 0 15px;
    font-size: 16px;
}

.meeting-pj-container {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
    border-top: 1px solid #fff;
}

.meeting-pj-container #header {
    background-color: #ECF0F1;
}

.meeting-pj-container #header_img {
    max-width: 100px;
    margin: 0;
}

.meeting-pj-container #titleContent {
    margin: 0;
    background: var(--default-color);
    padding: 5px 10px;
    border-radius: 15px;
    margin-left: 10px;
    font-size: 12px;
    text-transform: uppercase;
    white-space: nowrap;
    max-width: 160px;
}

.meeting-pj-container #navSessionInfo {
    display: flex;
    align-items: center;
    margin-left: 20px;
}

.meeting-pj-container#session-title {
    font-family: 'Source Sans Pro';
}

.meeting-pj-container .bounds {
    float: left;
    width: 100%;
    height: calc(100% - 100px);
}

.meeting-pj-container .MuiSvgIcon-colorSecondary {
    color: var(--default-color);
}

.meeting-pj-container .MuiIconButton-colorSecondary {
    color: var(--default-color);
}

.meeting-pj-container #statusIcons {
    background: transparent;
    left: 20px;
    bottom: 20px;
}

.meeting-pj-container #statusIcons div {
    background: var(--default-color);
    border-radius: 50%;
    margin-top: 10px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.meeting-pj-container .MuiIconButton-colorInherit {
    color: var(--default-grey);
}

.meeting-pj-container .bounds {
    background-color: var(--default-text);
}

.meeting-pj-container .MuiIconButton-root {
    padding: 8px;
}

.meeting-pj-container .nickname {
    background: var(--default-color);
    left: 20px;
    top: 20px;
    border-radius: 2px;
    font-size: 14px;
    font-family: 'Source Sans Pro';
}

.meeting-pj-container .OT_root,
.meeting-pj-container .OT_root * {
    font-family: Source Sans Pro;
}

.meeting-pj-container #chatToolbar {
    background: var(--theme-second);
    height: 50px;
    padding: 0;
    display: flex;
    align-items: center;
    padding: 0 20px;
    position: relative;
}

.meeting-pj-container #chatComponent {
    background-color: #ecf0f1;
}

.meeting-pj-container #messageInput {
    height: 55px;
    border-top: 1px solid #e2e5e7;
}

.meeting-pj-container .MuiFab-root {
    color: #fff;
}

.meeting-pj-container #sendButton {
    background-color: #3da9f6;
    border: 0;
    margin: 0 !important;
    top: calc(50% - 18px);
    width: 36px;
    height: 36px;
}

.meeting-pj-container .MuiSvgIcon-root {
    font-size: 21px;
}

.meeting-pj-container #closeButton {
    top: calc(50% - 18px);
    right: 10px;
}

.meeting-pj-container #closeButton .MuiSvgIcon-colorSecondary {
    color: #fff;
}

.meeting-pj-container .message.right .msg-detail .msg-content {
    background: #fff;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, 0.1);
}

.meeting-pj-container .message.right .msg-detail .msg-content span.triangle {
    background: #fff;
}

.meeting-pj-container .msg-info p {
    font-style: normal;
    color: var(--default-grey);
}

.meeting-pj-container #volumeButton {
    right: 20px;
    bottom: 20px;
}

.meeting-flex-container {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--default-color);
    position: relative;
    padding: 100px 0;
    overflow-y: auto;
}

.meeting-flex-container:before {
    content: "";
    width: 100%;
    height: 100%;
    background: var(--brand-pattern) no-repeat center;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
}

.meeting-room-list-wrapper h1 {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 34px;
    letter-spacing: 0;
    line-height: 34px;
    text-align: center;
    margin-bottom: 50px;
}

.meeting-room-button {
    float: left;
    width: 100%;
    height: 75px;
    border-radius: 11px;
    background-color: #FFFFFF;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
    padding: 0 60px 0 25px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-align-items: center;
    cursor: pointer;
    position: relative;
}

.meeting-room-button:after {
    content: "";
    background: var(--sprite-one) no-repeat -389px -248px;
    width: 11px;
    height: 17px;
    position: absolute;
    right: 25px;
    top: calc(50% - 8.5px);
    transform: rotate(90deg);
}

.meeting-room-list-wrapper {
    max-width: 450px;
}

.meeting-room-list-content {
    float: left;
    width: 100%;
    height: calc(100vh - 350px);
    overflow-y: auto;
    padding: 0 20px;
}

.meet-set-button {
    background: transparent;
    border: 0;
    padding: 0;
    position: absolute;
    right: 20px;
    top: 20px;
}

.meet-set-button:before {
    background-position: -374px -449px;
    width: 17px;
    height: 17px;
}

.meet-set-button:hover:before {
    background-position: -374px -427px;
}

.without-left-tab .side-tab .nav-pills {
    display: none;
}

.form-set.without-left-tab .side-tab .tab-content {
    border: 0;
    width: 100%;
}

.meet-edit-ico:before {
    background-position: -456px -158px;
    width: 12px;
    height: 12px;
}

.meet-delete-ico:before {
    background-position: -473px -159px;
    width: 10px;
    height: 12px;
}

.meeting-list-option {
    float: left;
    position: absolute;
    right: 20px;
    opacity: 0;
    pointer-events: none;
}

.each-sub-section .meeting-list-option button {
    float: left;
    position: relative;
    opacity: 1;
    margin-left: 10px;
    right: 0;
    top: 0;
    pointer-events: auto;
}

.each-sub-section:hover .meeting-list-option {
    opacity: 1;
    pointer-events: auto;
}

.non-draggable .each-sub-section:after {
    content: none;
}

.non-draggable .each-sub-section {
    cursor: auto;
}

.task-content-blocks .upload-drag-wrapper {
    margin: 0;
}

.board-header-top.with-count {
    padding-right: 50px;
    position: relative;
}

.deck-count {
    float: left;
    width: auto;
    min-width: 20px;
    height: 20px;
    position: absolute;
    padding: 0 5px;
    right: 0;
    top: 0;
    text-align: center;
    color: var(--default-grey);
    border-radius: 5px;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s ease-out;
}

.ind-board-list:hover .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.board-delete-ico:before {
    background-position: -370px -243px;
    width: 14px;
    height: 17px;
}

.board-option .hover-point {
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.ind-board-list:hover .board-option .hover-point {
    pointer-events: auto;
    opacity: 1;
}

.meeting-pj-container .message-wrap {
    height: calc(100% - 105px);
}

.deck-span {
    float: left;
    padding: 0 20px;
    background: #ffffff;
    border: 1px solid var(--default-color);
    color: var(--default-color);
    text-transform: uppercase;
    font-size: 14px;
    line-height: 38px;
    border-radius: 5px;
    /* box-shadow: 0 1px 4px 0 rgba(0,0,0,.1); */
}

.meeting-filter {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    bottom: 14px;
    z-index: 9;
}

.meeting-filter .general-btn {
    height: 30px;
    box-shadow: none;
    font-size: 14px;
    font-weight: 400;
}

.meeting-filter .resources-filters-icons li nav {
    width: auto;
    padding: 0 14px;
    font-size: 14px;
    height: 30px;
}

.meeting-filter .resources-filters-icons li nav.active {
    color: #fff;
}

.board-cards input.input-box.small-box {
    height: 30px;
    width: 100%;
    border-radius: 0;
}

.board-cards input.input-box.small-box:focus {
    border-bottom: 1px solid #ccc;
}

.board-cards .ind-board-list h5:last-child {
    margin-bottom: 0;
}

.board-cards .ind-board-list {
    padding-right: 50px;
    position: relative;
    min-height: auto;
}

.board-cards .ind-board-list .form-option-block.nav-option {
    position: absolute;
    right: 20px;
    top: 32px;
}

.ind-board-list h5:last-child {
    margin-bottom: 0;
}

.meeting-filter .resources-filters-icons li:last-child nav.active {
    background: #e14745;
}

.meeting-filter .resources-filters-icons li:first-child nav.active {
    background: #0eb58c;
}

.schedule-block {
    float: left;
    width: 100%;
    padding: 20px;
    border: 1px solid #e4e5e9;
    border-radius: 5px;
    margin-bottom: 15px;
    position: relative;
}

.one-line-split .task-input-block {
    width: calc(50% - 10px);
    margin-right: 20px;
}

.one-line-split .task-input-block:nth-child(2n) {
    margin-right: 0;
}

.one-line-split .task-input-block.date-fld .task-input-box {
    padding-right: 40px;
}

.one-line-split .task-input-block.date-fld:before {
    content: "";
    background: var(--sprite-one) no-repeat -375px -159px;
    width: 14px;
    height: 14px;
    position: absolute;
    right: 15px;
    bottom: 13px;
}

.task-inp-container.no-texter .ind-task-input {
    padding-left: 0;
}

.mail-schedule-block {
    float: left;
    width: 100%;
}

.mail-schedule-block .panel-each .each-inp-field {
    margin-bottom: 0;
    margin-right: 10px;
    max-width: 140px;
}

.mail-schedule-block .settings-panel-option p {
    font-size: 14px;
    color: var(--default-grey);
}

.mail-schedule-block .each-inp-field .new-task-input input[type="text"],
.mail-schedule-block .each-inp-field .new-task-input input[type="number"],
.mail-schedule-block .each-inp-field .new-task-input input[type="text"]::placeholder,
.mail-schedule-block .each-inp-field .new-task-input input[type="number"]::placeholder {
    font-size: 14px;
}

.mail-schedule-block .settings-panel select {
    margin-left: 0;
}

.mail-schedule-block .settings-panel {
    width: 75%;
}

.mail-schedule-block .panel-each .select-box:after {
    right: 15px;
}

.schedule-block>.task-input-block:last-child {
    margin-bottom: 0;
}

.mail-schedule-block .panel-each:last-child {
    margin-bottom: 0;
}

.task-input-block .selectbox-wrapper {
    float: left;
    width: 100%;
    margin-top: 8px;
}

.meeting-room-body .task-input-block.auto-comp label {
    margin-bottom: 0;
}

.task-input-block.auto-comp .select-drop {
    min-width: 500px;
}

.meeting-room-body .task-input-block input.validatation-error-class {
    border: 1px solid #e14845;
}

.meeting-room-body .val-error .drop-cont .dropzone {
    border-color: #e14845 !important;
}

.meeting-room-body .val-error {
    border-bottom: 0 !important;
}

.meeting-room-body .validatation-error-class .form-type-input .form-control {
    border-color: #e14845 !important;
}

.meeting-room-body .form-type-input .form-control {
    height: 40px;
}

.mail-schedule-block .settings-panel .new-task-input.validatation-error-class input[type="text"],
.mail-schedule-block .settings-panel .new-task-input.validatation-error-class input[type="number"] {
    border-color: #e14845 !important;
}

.mail-schedule-block .settings-panel .select-box.validatation-error-class select {
    border-color: #e14845 !important;
}

.schedule-wrapper {
    float: left;
    width: 100%;
}

.schedule-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.schedule-header h5 {
    font-size: 14px;
    color: var(--default-grey);
}

.custom-add-plus {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.custom-add-plus:before {
    background-position: -355px -333px;
    width: 17px;
    height: 17px;
}

.schedule-block .task-input-block .radio-wrap {
    margin: 0;
}

.schedule-block .rightButtons {
    top: auto;
    bottom: -9px;
    right: -15px;
    width: auto;
}

.schedule-block .rightButtons button {
    margin-left: 5px;
}

.schedule-block .rightButtons .btnsubIconsadd:before {
    background-position: -355px -333px;
}

.schedule-block .rightButtons .btnsubIconsadd:before {
    background-position: -355px -333px;
}

.schedule-block .rightButtons .btnsubIcon:before {
    background-position: -328px -333px;
}

.sepalika .pj-dataroom-ico:before {
    background-position: -49px -214px;
    opacity: .5;
}

.sepalika .pj-dataroom-ico:hover:before,
.sepalika .sub-menu-right .pj-dataroom-ico.active:before {
    opacity: 1;
}

.ijsc .pj-dataroom-ico:before {
    background-position: -49px -214px;
    opacity: .5;
}

.ijsc .pj-dataroom-ico:hover:before,
.ijsc .sub-menu-right .pj-dataroom-ico.active:before {
    opacity: 1;
}

.demosg .pj-dataroom-ico:before,
.svjs2 .pj-dataroom-ico:before,
.stratonboard .pj-dataroom-ico:before {
    background-position: -49px -214px;
    opacity: .5;
}

.demosg .pj-dataroom-ico:hover:before,
.demosg .sub-menu-right .pj-dataroom-ico.active:before,
.svjs2 .pj-dataroom-ico:hover:before,
.svjs2 .sub-menu-right .pj-dataroom-ico.active:before,
.stratonboard .pj-dataroom-ico:hover:before,
.stratonboard .sub-menu-right .pj-dataroom-ico.active:before {
    opacity: 1;
}

.schedule-mode .each-sub-section {
    flex-direction: column;
    align-items: flex-start;
    height: auto !important;
    min-height: 55px !important;
}

.meeting-room-head {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.schedule-list-block {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.schedule-list {
    float: left;
    width: 100%;
    padding-left: 21px;
    position: relative;
}

.schedule-list li {
    float: left;
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    font-size: 16px;
    color: #848484;
    line-height: normal;
    margin-bottom: 10px;
}

.schedule-list li .meeting-list-option {
    position: relative;
    right: 0;
    top: 0;
    float: none;
    display: none;
}

.schedule-list li:hover .meeting-list-option {
    display: block;
}

.meeting-room-head h5 {
    font-weight: 600;
    font-size: 16px;
}

.schedule-list:before {
    content: "";
    width: 1px;
    height: calc(100% - 10px);
    background: #dadada;
    position: absolute;
    left: 0;
    top: -9px;
}

.schedule-list li:before {
    content: "";
    width: 15px;
    height: 1px;
    background: #dadada;
    position: absolute;
    left: -20px;
}

.schedule-list li:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 0 3.5px 5px;
    border-color: transparent transparent transparent #dadada;
    position: absolute;
    left: -10px;
}

.meet-add-ico:before {
    background-position: -355px -333px;
    width: 17px;
    height: 17px;
    zoom: .765;
}

.schedule-block .task-input-block.date-fld .rdtPicker {
    bottom: auto !important;
}

.added-schedule-list {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    padding: 20px;
}

.each-schedule-list {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    background: var(--white);
    border-radius: 5px;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    margin-bottom: 10px;
}

.each-schedule-list h5 {
    font-size: 18px;
    font-weight: 600;
}

.each-schedule-list .enter-button {
    color: var(--default-color);
    border: 1px solid var(--default-color);
}

.each-schedule-list .enter-button:after {
    content: none;
}

.validatation-error-class>select {
    border-color: #e14845;
}

.pj-meeting-container {
    float: left;
    width: 100%;
    height: calc(100% - 97px);
    position: relative;
}

.pj-resource-container {
    float: left;
    width: 100%;
    height: calc(100% - 77px);
}

.pj-resource-container .resources-list {
    height: calc(100% - 78px);
}

.grid-vw .rc-thumb-grid-img iframe {
    float: left;
    width: 100%;
    height: 100%;
}

.pj-pool-container {
    float: left;
    width: 100%;
    height: calc(100% - 77px);
}

.pj-pool-container .main-panel-holder.project-pool {
    height: calc(100vh - 97px);
}

.deck-right-box {
    float: left;
    height: 30px;
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
}

.deck-right-box .deck-count {
    position: relative;
    right: 0;
    top: 0;
}

.deck-delete {
    float: left;
    width: 20px;
    height: 20px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-left: 0 !important;
    display: none;
}

.deck-delete:before {
    content: "";
    background: var(--sprite-one) no-repeat -192px -333px;
    width: 12px;
    height: 13px;
    display: inline-block;
}

.board-list-wrapper:hover .deck-delete {
    display: block;
    -webkit-animation: slide-right .3s ease-out;
    -moz-animation: slide-right .3s ease-out;
}

@-webkit-keyframes slide-right {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100%);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes slide-right {
    0% {
        opacity: 0;
        -moz-transform: translateX(100%);
    }

    100% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
}

.meeting-pj-container .MuiIconButton-root:nth-child(3) {
    display: none;
}

.meeting-room-body .schedule-wrapper {
    display: block;
}

.mod-close-ico:before {
    background-position: -358px -72px;
    width: 11px;
    height: 12px;
}

.pj-collection-ico:before {
    background-position: -154px -6px;
    width: 19px;
    height: 19px;
    opacity: .5;
}

.pj-collection-ico:hover:before,
.pj-collection-ico.active:before {
    opacity: 1;
}

.pj-entity-ico:before {
    background-position: -301px -6px;
    width: 18px;
    height: 19px;
    opacity: .5;
}

.pj-entity-ico:hover:before,
.pj-entity-ico.active:before {
    opacity: 1;
}

.pj-resource-ico:before {
    background-position: -128px -6px;
    width: 19px;
    height: 20px;
    opacity: .5;
}

.pj-resource-ico:hover:before,
.pj-resource-ico.active:before {
    opacity: 1;
}

.pj-pool-ico:before {
    background-position: -326px -5px;
    width: 23px;
    height: 20px;
    opacity: .5;
}

.pj-pool-ico:hover:before,
.pj-pool-ico.active:before {
    opacity: 1;
}

.pj-dashboard-ico:before {
    background-position: -482px -6px;
    width: 18px;
    height: 16px;
    opacity: .5;
}

.pj-dashboard-ico:hover:before,
.pj-dashboard-ico.active:before {
    opacity: 1;
}

.blog .file-each-opt.single-opt {
    width: auto;
    left: auto;
    right: 20px;
    top: 20px;
}

/*------ Project Details End ------*/

/*------ Resources ------*/

.stand-page .task-content-wrapper.full-dv {
    max-height: 100%;
    min-height: auto;
    height: calc(100vh - 60px);
    padding: 0;
}

.resources-contents {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0px;
}

.resources-filters {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    padding: 20px 20px 0;
}

.resources-filters-icons.with-text li a,
.resources-filters-icons.with-text li nav {
    width: auto;
    padding: 0 15px;
    font-size: 14px;
    line-height: normal;
    color: var(--default-text);
    font-weight: 500;
    transition: .3s ease-out;
}

.resources-filters-icons li .active {
    background: var(--default-color);
}

.resources-filters-icons.with-text li .active,
.resources-filters-icons.with-text li .active:hover {
    color: #fff;
}

.rc-tab-list:before {
    background-position: -5px -182px;
    width: 16px;
    height: 14px;
}

.rc-tab-list.active:before {
    background-position: -5px -162px;
}

.rc-tab-grid:before {
    background-position: -28px -182px;
    width: 14px;
    height: 14px;
}

.rc-tab-grid.active:before {
    background-position: -28px -162px;
}

.resources-tab-wrap {
    float: left;
}

.resources-list {
    float: left;
    width: 100%;
    height: calc(100% - 80px);
    overflow-y: auto;
    padding: 0 20px;
}

.resources-list-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    padding: 0 20px;
}

.ind-header {
    float: left;
    color: #565656;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    text-transform: uppercase;
}

.res-name {
    width: 91%;
}

.res-type,
.res-size,
.res-mod,
.res-option {
    width: 15%;
}

.ind-header:last-child {
    text-align: right;
}

.rc-list-content-wrap {
    float: left;
    width: 100%;
    height: calc(100% - 26px);
}

.rc-list-contents {
    float: left;
    width: 100%;
    height: 50px;
    background: #fff;
    border: 1px solid #e4e5e9;
    border-bottom: 1px solid transparent;
    display: flex;
    align-items: center;
    padding: 0 20px;
    transition: .4s ease-out;
    position: relative;
    cursor: pointer;
}

.rc-list-contents:last-child {
    border-bottom: 1px solid #e4e5e9;
}

.first-block {
    float: left;
    display: flex;
    align-items: center;
}

.rc-thumb-grid-img {
    display: none;
}

.rc-thumb-img {
    width: 25px;
    height: 29px;
    margin-right: 20px;
}

.rc-thumb-img img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.resources-card-check {
    position: absolute;
    left: 20px;
    top: calc(50% - 10.5px);
    height: 21px;
    width: 21px;
    float: left;
    opacity: 0;
    pointer-events: none;
}

.rc-title h5 {
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 100%;
}

.default-block {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 14px;
}

.default-block:last-child {
    text-align: right;
}

.rc-list-contents:hover {
    border: 1px solid var(--default-color);
}

.rc-list-contents:hover .rc-title h5 {
    color: var(--default-color);
}

.resources-card-check {
    position: absolute;
    left: 20px;
    top: calc(50% - 10.5px);
    height: 21px;
    width: 21px;
    float: left;
    opacity: 0;
    pointer-events: none;
}

.rc-list-contents:hover .resources-card-check {
    opacity: 1;
    pointer-events: auto;
}

.rc-list-contents:hover .rc-thumb-img {
    opacity: 1;
}

.resources-card-check .control-indicator {
    top: 0;
    width: 21px;
    height: 21px;
}

.control-checkbox.list-check-rc .control-indicator:after {
    background: var(--sprite-two) no-repeat -103px -164px;
    width: 14px;
    height: 10px;
    left: calc(50% - 7px);
    top: calc(50% - 5px);
}

.grid-vw .rc-list-contents {
    width: calc((100% / 4) - 14px);
    height: 260px;
    margin-right: 18px;
    margin-bottom: 18px;
    padding: 0;
    display: block;
    border: 1px solid rgba(64, 83, 100, 0.15);
    transition: .4s ease-out;
}

.grid-vw .rc-list-contents:nth-child(4n) {
    margin-right: 0;
}

.grid-vw .default-block {
    float: left;
    width: 100%;
    height: 100%;
    display: block;
}

.grid-vw .rc-thumb-grid-img {
    width: 100%;
    height: calc(100% - 60px);
}

.grid-vw .rc-thumb-img {
    display: none;
}

.grid-vw .rc-thumb-grid-img img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.resources-list.grid-vw .resources-card-check {
    top: 16px;
    left: 16px;
}

.grid-vw .rc-title {
    float: left;
    width: 100%;
    height: 60px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    border-top: 1px solid rgba(64, 83, 100, 0.15);
    padding: 0 20px;
}

.grid-vw .default-block.res-type,
.grid-vw .default-block.res-size,
.grid-vw .default-block.res-mod {
    display: none;
}

.grid-vw .resources-list-header {
    display: none;
}

.resources-filters-icons.with-text li a:hover,
.resources-filters-icons.with-text li nav:hover {
    color: var(--default-color);
}

.rc-lg-thumb {
    float: left;
    width: 25px;
    height: 29px;
}

.rc-lg-thumb .format:before,
.rc-lg-thumb .format:after {
    border-width: 8px 0 0 8px;
}

.rc-lg-thumb .format {
    font-size: 7px;
    padding-bottom: 7px;
}

.rc-small-thumb {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.rc-small-thumb .format {
    width: 58px;
    height: 50px;
}

.progress-ctr {
    display: inline-block;
    width: 100%;
}

.rdtPicker {
    bottom: 0 !important;
}

.picker-bt .rdtPicker {
    top: 100%;
    background: #fff;
}

.picker-bt .rdtDays {
    background: #fff;
    border: 1px solid #e4e5e9;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.rdtPicker .dow {
    border-bottom: 1px solid #e4e5e9 !important;
    color: #333333;
}

.rdtPicker td {
    color: var(--default-text);
}

.rdtPicker tfoot {
    border-top: 1px solid #e4e5e9;
}

.rdtPicker {
    border: 1px solid #e4e5e9 !important;
}

.rdtPicker td.rdtToday,
.rdtPicker td.rdtToday:hover {
    background-color: var(--default-color) !important;
}

.rdtPicker td.rdtActive,
.rdtPicker td.rdtActive:hover {
    text-shadow: none !important;
}

.rdtPicker th.rdtSwitch {
    font-weight: 600 !important;
}

.rdtPicker th {
    background-color: #ecf0f1 !important;
}

.rdtPicker td.rdtDay:hover,
.rdtPicker td.rdtHour:hover,
.rdtPicker td.rdtMinute:hover,
.rdtPicker td.rdtSecond:hover,
.rdtPicker .rdtTimeToggle:hover {
    background: #ecf0f1 !important;
}

.rdtTime,
.rdtMonths {
    background: #fff;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.rdtPicker td.rdtToday,
.rdtPicker td.rdtToday:hover {
    background: var(--default-color) !important;
    border-radius: 3px !important;
}

.copy-data-panel {
    width: 100%;
    float: left;
    max-width: 250px;
}

.input-block .rdtPicker {
    bottom: auto !important;
}

.res-type,
.res-size,
.res-mod {
    text-transform: uppercase;
}

.grid-vw .rc-thumb-grid-img:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.35);
    position: absolute;
    left: 0;
    top: 0;
}

.grid-vw .rc-thumb-grid-img {
    position: relative;
}

.hint-label.marg-15 {
    margin: 15px 0;
}

.upload-drag-wrapper {
    float: left;
    width: 100%;
    margin-top: 15px;
}

.hint-area {
    float: left;
    width: 100%;
    position: relative;
}

.hint-area .hint-label:before {
    content: "i";
    width: 15px;
    height: 15px;
    background: #a9a9a9;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    font-size: 10px;
}

.hint-area .hint-label {
    display: flex;
    align-items: center;
    color: #a9a9a9;
    width: auto;
    cursor: pointer;
}

.hover-toggle {
    width: 330px;
    background: #fff;
    border: 1px solid #EAEAEA;
    position: absolute;
    left: 0;
    top: 40px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    padding: 10px 0;
    z-index: 9;
    padding: 10px 20px;
    display: none;
}

.hover-toggle ul li {
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ECEFF1;
}

.hover-toggle ul li p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: .3px;
}

.hover-toggle ul li p span {
    font-weight: 600;
    letter-spacing: normal;
}

.hover-toggle:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    top: -10px;
    left: 26px;
    z-index: 10;
}

.hover-toggle:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 12px 12px 12px;
    border-color: transparent transparent #eaeaea transparent;
    position: absolute;
    top: -12px;
    left: 24px;
    z-index: 9;
}

.hover-toggle ul li:last-child {
    border: 0;
}

.hint-area .hint-label:hover+.hover-toggle {
    display: block;
}

.grid-vw .rc-thumb-grid-img audio {
    width: calc(100% - 40px);
    position: absolute;
    left: 0;
    margin: 20px;
    top: calc(50% - 47px);
}

.grid-vw .rc-thumb-grid-img audio:focus {
    outline: none;
}

.rc-thumb-grid-img .format:after {
    border-color: #a6a6a6 transparent transparent transparent;
}

.grid-vw .rc-thumb-grid-img video {
    object-fit: cover;
}

.player-area {
    float: left;
    width: 100%;
    height: 100%;
}

.ico-lib-upload:before {
    background-position: -394px -446px;
    width: 22px;
    height: 22px;
    margin-right: 10px;
}

.ico-lib-upload:hover:before {
    background-position: -394px -422px;
}

.ico-lib-secure-upload:before {
    background-position: -423px -446px;
    width: 22px;
    height: 22px;
    margin-right: 10px;
}

.ico-lib-secure-upload:hover:before {
    background-position: -423px -422px;
}

.res-option .form-option-block.nav-option {
    right: 5px;
    top: 7px;
}

.default-block.res-option {
    position: relative;
}

.grid-vw .default-block.res-option {
    display: none;
}

.rc-thumb-grid-img .form-option-block.nav-option {
    right: 13px;
    top: 24px;
}

.rc-thumb-grid-img .opt-form-ico:before {
    background-position: -220px -361px;
    width: 16px;
    height: 4px;
    left: calc(50% - 8px);
    top: calc(50% - 2px);
}

.rstm-tree-item-group {
    float: left;
    width: 100%;
}

.rstm-tree-item {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    color: #a9a9a9;
    line-height: 31px;
}

.rstm-toggle-icon:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 4px 0 4px;
    border-color: #a9a9a9 transparent transparent transparent;
    display: block;
    margin-right: 5px;
    transform: rotate(-90deg);
}

.rstm-toggle-icon-symbol {
    display: flex;
    align-items: center;
    margin-right: 10px;
}

.rstm-toggle-icon-symbol:before {
    content: "";
    background: var(--sprite-two) no-repeat -399px -164px;
    width: 19px;
    height: 15px;
    display: inline-block;

}

.rstm-toggle-icon {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.rstm-toggle-icon-symbol {
    font-size: 0;
}

.rstm-tree-item--active {
    background: rgba(28, 30, 43, .35);
    color: #4990e2;
}

.rstm-tree-item:hover {
    background: rgba(28, 30, 43, .35);
}

.rstm-tree-item--active .rstm-toggle-icon-symbol:before {
    background-position: -399px -185px;
}

.side-menu-right .e-treeview .e-list-item.e-hover>.e-fullrow,
.side-menu-right .e-treeview .e-list-item.e-active>.e-fullrow {
    background-color: var(--chat-hover);
    border: 0;
}

.modal-body .e-treeview .e-list-item.e-hover>.e-fullrow,
.modal-body .e-treeview .e-list-item.e-active>.e-fullrow {
    background-color: #fafafa;
    border: 0;
}

.modal-body .e-treeview .e-list-text {
    padding: 0;
    font-family: Source Sans Pro;
    color: #a9a9a9;
    font-size: 16px;
    min-height: 32px;
}

.side-menu-right .e-treeview .e-list-text {
    padding: 0;
    font-family: Source Sans Pro;
    color: var(--resource-arrow);
    font-size: 16px;
    min-height: 32px;
}

.side-menu-right .e-treeview .e-text-content,
.modal-body .e-treeview .e-text-content {
    border: 0;
    padding: 0 0 0 17px;
}

.modal-body .e-treeview .e-list-item div.e-icons::before {
    content: "";
    color: #a9a9a9;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 4px;
    border-color: transparent transparent transparent #a9a9a9;
    padding: 0;
    position: absolute;
    left: calc(50% - 3px);
    top: calc(50% - 4px);
}

.side-menu-right .e-treeview .e-list-item div.e-icons::before {
    content: "";
    color: var(--resource-arrow);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 4px;
    border-color: transparent transparent transparent var(--resource-arrow);
    padding: 0;
    position: absolute;
    left: calc(50% - 3px);
    top: calc(50% - 4px);
}

.modal-body .e-treeview .e-list-item.e-active>.e-text-content .e-list-text,
.modal-body .e-treeview .e-list-item.e-active.e-animation-active>.e-text-content .e-list-text {
    color: #a9a9a9;
}

.side-menu-right .e-treeview .e-list-item.e-active>.e-text-content .e-list-text,
.side-menu-right .e-treeview .e-list-item.e-active.e-animation-active>.e-text-content .e-list-text {
    color: var(--resource-arrow);
}

.side-menu-right .e-treeview .e-list-item .e-ul,
.modal-body .e-treeview .e-list-item .e-ul {
    margin: 0;
    padding: 0 0 0 18px;
}

.side-menu-right .e-treeview .e-list-item,
.modal-body .e-treeview .e-list-item {
    padding: 0;
}

.modal-body .e-treeview .e-list-item.e-hover>.e-text-content {
    color: #a9a9a9;
}

.side-menu-right .e-treeview .e-list-item.e-hover>.e-text-content {
    color: var(--resource-arrow);
}

.side-menu-right .e-treeview .e-list-item.e-active.e-hover>.e-fullrow {
    background-color: var(--chat-hover);
    border: 0;
}

.modal-body .e-treeview .e-list-item.e-active.e-hover>.e-fullrow {
    background-color: #fafafa;
    border: 0;
}

.modal-body .e-treeview .e-list-item.e-hover>.e-text-content .e-list-text {
    color: #a9a9a9;
}

.side-menu-right .e-treeview .e-list-item.e-hover>.e-text-content .e-list-text {
    color: var(--resource-arrow);
}

.modal-body .e-treeview .e-list-item.e-active.e-hover>.e-text-content {
    color: #a9a9a9;
}

.side-menu-right .e-treeview .e-list-item.e-active.e-hover>.e-text-content {
    color: var(--resource-arrow);
}

.modal-body .e-treeview .e-list-item.e-active.e-hover>.e-text-content .e-list-text {
    color: #a9a9a9;
}

.side-menu-right .e-treeview .e-list-item.e-active.e-hover>.e-text-content .e-list-text {
    color: var(--resource-arrow);
}

.side-menu-right .e-treeview .e-ul,
.modal-body .e-treeview .e-ul {
    padding: 0 0 0 20px;
}

.side-menu-right .e-treeview .e-text-content,
.side-menu-right .e-treeview .e-fullrow,
.modal-body .e-treeview .e-text-content,
.side-menu-right .e-treeview .e-fullrow {
    border: 0;
}

.side-menu-right .e-treeview .e-icon-collapsible,
.side-menu-right .e-treeview .e-icon-expandable,
.modal-body .e-treeview .e-icon-collapsible,
.modal-body .e-treeview .e-icon-expandable {
    position: relative;
}

.side-menu-right .e-treeview .e-list-item.e-active>.e-text-content .e-icon-collapsible,
.side-menu-right .e-treeview .e-list-item.e-active>.e-text-content .e-icon-expandable,
.modal-body .e-treeview .e-list-item.e-active>.e-text-content .e-icon-collapsible,
.modal-body .e-treeview .e-list-item.e-active>.e-text-content .e-icon-expandable {
    position: relative;
}

.modal-body .e-treeview .e-list-item .e-text-content .e-list-text:before {
    content: "";
    background: var(--sprite-two) no-repeat -399px -164px;
    width: 19px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 2px;
}

.side-menu-right .e-treeview .e-list-item .e-text-content .e-list-text:before {
    content: "";
    background: var(--sprite-two) no-repeat -752px -358px;
    width: 19px;
    height: 15px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 2px;
}

.modal-body .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before {
    background-position: -399px -185px;
    width: 19px;
    height: 15px;
}

.side-menu-right .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before {
    background-position: -752px -358px;
    width: 19px;
    height: 15px;
}

.side-menu-right .e-treeview .e-list-item .e-text-content .e-list-text .e-input-group,
.modal-body .e-treeview .e-list-item .e-text-content .e-list-text .e-input-group {
    width: auto !important;
    min-width: auto !important;
    color: #fff !important;
    font-family: Source Sans Pro !important;
    color: #a9a9a9 !important;
    font-size: 16px !important;
}

.task-tg .new-task-input.browse {
    position: relative;
}

.browse-btn {
    position: absolute;
    right: 0;
    top: calc(50% - 10px);
    background: transparent;
    border: 1px solid var(--default-color);
    height: 25px;
    padding: 0 15px;
    font-size: 14px;
    border-radius: 5px;
    color: var(--default-color);
    transition: .3s ease-out;
}

.browse-btn:hover {
    background: var(--default-color);
    color: #ffffff;
}

.bsy-modal.height-520 .modal-body {
    height: 520px;
    padding: 12px 0;
    overflow-y: auto;
}

.bsy-modal.height-520 .modal-footer {
    border-top: 0;
}

.max-500 .modal-lg {
    max-width: 500px;
}

.radio-wrap .radio-label-top {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    color: var(--default-grey);
    font-size: 14px;
}

.auto-comp-pad .ind-task-input {
    padding-left: 0;
    height: auto;
    min-height: 50px;
}

.private-container .button-block {
    display: flex;
    justify-content: flex-end;
}

.private-container .button-block button {
    height: 35px;
}

.tree-table {
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.tree-table tr th {
    font-size: 14px;
}

.table.tree-table tbody tr td {
    font-size: 14px;
    padding: 10px 20px;
    vertical-align: middle;
}

.table.tree-table tbody tr td:first-child {
    width: auto;
    font-weight: 600;
    color: var(--default-grey);
}

.tree-table tbody tr td:last-child {
    width: auto;
}

.folder-option {
    float: right;
    background: transparent;
    border: 1px solid var(--default-color);
    height: 30px;
    padding: 0 20px;
    border-radius: 20px;
    margin-left: 10px;
    color: var(--default-color);
}

.folder-tree-ico {
    display: flex;
    align-items: center;
}

.folder-tree-ico:before {
    background-position: -399px -164px;
    width: 19px;
    height: 15px;
    margin-right: 6px;
    position: relative;
    top: -1px;
}

.bsy-modal.height-520.of-hide .modal-body {
    padding: 0;
}

.body-full .scrollable-panel-holder {
    height: 100%;
}

.body-full .scrollable-panel-holder .scrollable-panel {
    height: 100%;
}

.resource-set-container {
    float: left;
    width: 100%;
    height: 100%;
}

.resource-set-container-left {
    float: left;
    width: 60%;
    height: 100%;
    background: #ECF0F1;
    padding: 15px 20px;
}

.resource-set-container-right {
    float: left;
    width: 40%;
    height: 100%;
}

.resource-set-container-right .scrollable-panel-holder {
    height: 100%;
}

.resource-set-container-right .scrollable-panel-holder .scrollable-panel {
    height: 100%;
}

.resource-set-container-left .label-wraper label {
    color: var(--default-grey);
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.resource-set-container-left .task-inp-container {
    border-color: rgba(64, 83, 100, 0.15);
}

.resource-set-container-left .task-inp-container .tag-wrapper-bl input {
    background: transparent;
}

.resource-set-container-left .btn-block {
    margin: 12px 0;
    float: left;
}

.resource-set-container-left .btn-block button {
    height: 30px;
}

.remove-btn {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: absolute;
    right: 15px;
    top: calc(50% - 8.5px);
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.remove-btn:before {
    background-position: -244px -183px;
    width: 17px;
    height: 17px;
}

.resource-set-container-right .member-each {
    position: relative;
    padding-right: 40px;
}

.resource-set-container-right .member-each:hover .remove-btn {
    opacity: 1;
    pointer-events: auto;
}

.resources-tab-wrap .button-anchor {
    border-radius: 10px;
    border: 1px solid rgb(211 216 220);
}

.with-selection .rc-list-contents.active .resources-card-check {
    opacity: 1;
    pointer-events: auto;
}

.with-selection .grid-vw .rc-list-contents.active {
    border: 1px solid var(--default-color);
}

.with-selection .rc-list-contents.active .rc-title h5 {
    color: var(--default-color);
}

.with-selection .rc-list-contents:hover .rc-thumb-img {
    opacity: 0;
}

.with-selection .rc-list-contents.active .rc-thumb-img {
    opacity: 0;
}

.sepalika .side-menu-right .e-treeview .e-list-item .e-text-content .e-list-text:before,
.sepalika .modal-body .e-treeview .e-list-item .e-text-content .e-list-text:before {
    background-position: -752px -358px;
}

.sepalika .side-menu-right .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before,
.sepalika .modal-body .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before {
    background-position: -752px -358px;
}

.ijsc .side-menu-right .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before {
    background-position: -752px -358px;
}

.ijsc .modal-body .e-treeview .e-list-item .e-text-content .e-list-text:before,
.ijsc .side-menu-right .e-treeview .e-list-item .e-text-content .e-list-text:before {
    background-position: -752px -358px;
}

.demosg .modal-body .e-treeview .e-list-item .e-text-content .e-list-text:before,
.demosg .side-menu-right .e-treeview .e-list-item .e-text-content .e-list-text:before,
.svjs2 .modal-body .e-treeview .e-list-item .e-text-content .e-list-text:before,
.svjs2 .side-menu-right .e-treeview .e-list-item .e-text-content .e-list-text:before,
.stratonboard .modal-body .e-treeview .e-list-item .e-text-content .e-list-text:before,
.stratonboard .side-menu-right .e-treeview .e-list-item .e-text-content .e-list-text:before {
    background-position: -752px -358px;
}

.demosg .side-menu-right .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before,
.svjs2 .side-menu-right .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before,
.stratonboard .side-menu-right .e-treeview .e-list-item.e-active .e-text-content .e-list-text:before {
    background-position: -752px -358px;
}

.resources-filters-left .backto-list {
    height: 40px;
    font-size: 12px;
    font-weight: 600;
}

.browse-mod {
    z-index: 999999999;
}

.form-download.zoomfile {
    position: relative;
    left: 0;
    top: 0;
    background: transparent;
    width: 40px;
    height: 50px;
}

.form-download.zoomfile:before {
    zoom: 1.3;
    top: 1px;
    position: relative;
    opacity: .7;
}

.persitant-top .task-input-block .select-chk-block .control {
    font-size: 14px;
}

.preview-area.chat-panel iframe {
    height: 100%;
}

.grid-vw .rc-title ul {
    float: left;
    width: 100%;
    margin-top: 3px;
}

.grid-vw .rc-title li {
    float: left;
    margin-right: 10px;
    text-transform: uppercase;
}

.list-vw .rc-title.with-rc-desc ul {
    display: none;
}

.resources-filters-left .general-btn {
    margin-left: 12px;
    box-shadow: none;
}

/*------ Resources End ------*/

/*------ Task Print ------*/

.print-holder {
    background: #fff;
    padding: 15px 30px 30px;
}

.print-holder .task-detail-panel-content-area-left {
    padding: 0;
}

.print-holder .task-details-header-block {
    border: 0;
    background: #fff;
    padding: 0;
}

.print-holder .task-detail-panel {
    border: 0;
    margin-bottom: 60px;
}

.print-holder .task-details-header-block {
    border-bottom: 2px solid #1C1F2B;
}

.print-holder .comp-task {
    float: left;
    height: 30px;
    width: 151px;
    background-color: #2E3243;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.print-holder .task-detail-panel-content {
    padding: 20px 0;
}

.print-holder .task-detail-user-info {
    margin-bottom: 26px;
}

.print-holder .task-detail-panel-content-area h5 {
    color: var(--default-text);
    font-size: 24px;
    font-weight: 600;
    line-height: 36px;
}

.print-holder .task-detail-panel-content-area p {
    color: var(--default-grey);
}

.print-holder .subheader-task {
    float: left;
    width: 100%;
    padding-bottom: 17px;
    margin-bottom: 17px;
    border-bottom: 2px solid #1C1F2B;
}

.print-holder .subheader-task p {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
}

.print-holder .subtask-detail-panel .task-detail-panel-content-area h5 {
    color: var(--default-text);
    font-weight: 600;
    line-height: 22px;
    font-size: 16px;
    margin-bottom: 5px;
}

.print-holder .subtask-detail-panel {
    padding-left: 0;
    margin-bottom: 0;
}

.print-holder .subtask-detail-panel:before {
    content: none;
}

.print-holder .ind-div-assign {
    padding: 0;
}

.print-holder .ind-div-assign:before {
    content: none;
}

.print-holder .subtask-detail-panel .task-detail-panel-content {
    padding-top: 0;
    margin-bottom: 0;
}

.print-holder .completion-remarks-panel {
    float: left;
    width: 100%;
}

.print-holder .completion-remarks-panel .task-detail-panel-content {
    padding-top: 0;
    margin-bottom: 0;
}

.print-holder .discuss-inner {
    width: 100%;
    height: auto;
    float: left;
    padding: 20px 0;
}

.print-holder .task-detail-user-info-left {
    float: left;
}

.print-holder .task-detail-user-info-left .task-detail-user {
    width: 100%;
    margin-bottom: 25px;
}

.print-holder .task-detail-user-info-left .task-detail-user:last-child {
    margin-bottom: 0;
}

.print-holder .subtask-detail-panel .task-detail-panel {
    margin-bottom: 35px;
}

.print-holder .completion-remarks-panel .task-detail-panel {
    margin-bottom: 35px;
}

.print-holder .user-tab-head {
    padding: 0;
}

.print-holder .user-detail-panel .task-detail-panel-content {
    padding-top: 0;
    margin-bottom: 0;
    padding-bottom: 0;
}

.print-holder .ind-assigned-user-thumb img {
    object-fit: cover;
}

.print-holder .message-in-box {
    background: #fff;
    box-shadow: none;
    border: 0;
    padding: 0;
    margin: 0;
    margin-bottom: 30px;
}

.print-holder .user-image-holder {
    width: 40px;
    height: 40px;
}

.print-holder .user-image-holder img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.print-holder .chat-message-detailfalse {
    float: left;
    width: calc(100% - 50px);
}

.print-holder .chat-user-name,
.print-holder .ind-added-user-list-left-info h5 {
    color: var(--default-color);
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    margin-bottom: 3px;
}

.print-holder .message-in-box:last-child {
    margin-bottom: 0;
}

.print-holder .ind-added-user-list-left-info p {
    font-size: 14px;
    color: var(--default-grey);
}

.print-holder .ind-task-added-user-list {
    padding: 0;
    border: 0;
    box-shadow: none;
    height: 40px;
}

.print-holder .user-highlight {
    font-weight: 600;
    margin-right: 15px;
}

.print-holder .task-detail-user-det h5 {
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
}

.print-holder .task-detail-user .assign-line {
    padding-left: 27px;
    margin-top: 10px;
    width: 100%;
}

.print-holder .task-detail-user-det {
    height: auto;
}

.print-holder .user-detail-panel .task-detail-user-info-left {
    width: 100%;
}

.print-holder .subtask-detail-panel .task-detail-user .assign-line,
.print-holder .completion-remarks-panel .task-detail-user .assign-line {
    padding-left: 0;
    margin-top: 0px;
}

.print-holder .completion-remarks-panel .task-detail-user .assign-line {
    margin-bottom: 0;
}

.print-holder .completion-remarks-panel .task-detail-panel-content-area h5 {
    color: #2E3243;
    font-weight: 600;
    line-height: 22px;
    font-size: 16px;
    margin-bottom: 5px;
}

.print-holder .activities-log-right-box {
    box-shadow: 0 0 4px 0 #AEBECF;
}

.print-holder .activities-log-right-top p {
    font-size: 14px;
}

.print-holder .activities-log-right-top h5 {
    font-size: 16px;
}

.print-holder .activities-log-right-top h5 .user-highlight {
    margin-right: 0;
    font-weight: 500;
}

.print-holder .activities-log-right-box p {
    font-size: 14px;
    color: var(--default-grey);
}

.print-holder .activities-log-right-box h5 {
    color: var(--default-text);
    font-weight: 600;
    line-height: 22px;
    font-size: 16px;
    margin-bottom: 5px;
}

.print-holder .discussion-detail-panel .task-detail-user-info-left {
    width: 100%;
}

.print-holder .discussion-detail-panel .task-detail-panel-content {
    padding: 0;
}

.print-holder .activities-detail-panel .task-detail-panel-content {
    padding: 0;
    margin-bottom: 0;
}

.print-holder .completion-remarks-panel .task-detail-user-thumb {
    width: 40px;
    height: 40px;
}

.print-holder .user-detail-panel .task-detail-user-info {
    margin-bottom: 0;
}

.print-holder .discussion-detail-panel .task-detail-user-info {
    margin-bottom: 0;
}

.print-holder .activities-detail-panel .task-detail-user-info {
    margin-bottom: 0;
}

.print-holder .form-table .table thead th {
    padding: 12px 0;
}

.print-holder .form-table .table thead tr th:last-child,
.print-holder .form-table .table tbody tr td:last-child {
    padding-right: 0;
}

.print-holder .form-table .table tbody tr td {
    padding: 12px 0;
    vertical-align: top;
}

.print-holder .form-table .table tbody tr td .task-detail-user-info-left {
    display: flex;
    align-items: center;
}

.print-holder .form-table .table tbody tr td .task-detail-user-thumb {
    width: 40px;
    height: 40px;
}

.print-holder .form-table .table tbody tr td p {
    line-height: 40px;
}

.print-holder .form-table .table tbody tr td p span {
    color: var(--default-text);
    font-weight: 600;
}

.print-holder .form-table {
    border-right: 0;
    border-left: 0;
}

.print-form-slection {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    background-color: #fff;
}

.print-form {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.button-header {
    float: left;
    width: 100%;
    height: 60px;
    background: #fff;
    border-bottom: 1px solid rgba(221, 221, 221, 0.8);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    position: relative;
    z-index: 99;
}

.print-form-btn {
    float: left;
    margin: 0;
    background: #60ad6c;
    border: 1px solid #60ad6c;
    color: #fff;
    height: 35px;
    min-width: 65px;
    padding: 0 10px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    margin-left: 0;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    transition: .3s ease-out;
}

.print-form .print-holder {
    height: calc(100% - 60px);
}

.info-task {
    float: left;
    margin-right: 40px;
    color: var(--default-grey);
}

.info-task span {
    font-weight: 600;
}

.focus-resolve:focus {
    background: var(--btn-color);
    border: 1px solid var(--btn-color);
    border-radius: 3px;
}

.datetimepicker-control-section {
    max-width: 246px;
    margin: 30px auto;
    padding-top: 50px;
}

.react-pdf__Page {
    height: 300px;
}

.border-error-holder {
    border: 1px dashed red !important;
}

/*------ Task Print End ------*/

/*------ Learn ------*/

.pj-board-container .pj-team-wrapper.with-header-hgt .task-tab.with-height-full {
    height: 100%;
}

.limited-height .common-align .form-detail-top.project-top.right-extra-option {
    max-height: 55px;
}

.limited-height .common-align .form-detail-top.project-top h5 {
    margin-bottom: 0;
}

.limited-height .pj-board-container.project-task-with-option {
    height: calc(100% - 77px);
}

.limited-height .common-align.project-header-align .form-detail-top-left {
    cursor: pointer;
}

.task-input-flex-block .select-box.inc-flex {
    width: 50%;
    display: flex;
    align-items: center;
    padding-left: 15px;
}

.task-input-flex-block .select-box.inc-flex select {
    border-bottom: 0;
    height: 49px;
    padding: 0 15px;
}

.task-input-flex-block .select-box.inc-flex:after {
    right: 0;
}

.task-input-flex-block .select-box.eq-width.inc-flex.label-perst label {
    flex-shrink: 0;
    float: left;
    color: #bdbdbd;
    font-size: 12px;
    line-height: 16px;
    flex-shrink: 0;
    text-transform: uppercase;
}

.dynamic-creation .new-task-input.text-input.min-150 {
    max-height: 150px;
}

.hint-label.pad-left-15 {
    padding: 0 15px;
}

.list-viewer .entity-info .learn:before,
.tile-entity-description-box.learn:before {
    content: "";
    background: var(--sprite-two) no-repeat -540px -301px;
    width: 14px;
    height: 19px;
    position: absolute;
    left: 0;
    top: 2px;
}

.data-view .form-detail-top.learn-top {
    max-height: 102px;
    border-bottom: 0;
}

.form-detail-top.learn-top h5 {
    margin: 0;
}

.learn-course-info {
    float: left;
    width: 100%;
    margin: 10px 0 0 0;
}

.learn-course-info li {
    float: left;
    margin-right: 10px;
    padding-right: 10px;
    position: relative;
    font-size: 14px;
    color: var(--default-grey);
}

.learn-course-info li:after {
    content: "";
    width: 5px;
    height: 5px;
    background: #a9a9a9;
    display: inline-block;
    border-radius: 50%;
    position: absolute;
    right: -2.5px;
    top: 5px;
}

.learn-course-info li:last-child:after {
    content: none;
}

.data-view.field-form .data-holder.learn-holder {
    height: calc(100% - 123px);
    padding: 0 20px 20px 20px;
    overflow-y: auto;
}

.learn-section-header {
    float: left;
    width: 100%;
}

.learn-section-container {
    float: left;
    width: 100%;
    height: auto !important;
}

.each-learn-section {
    display: inline-block;
    width: 100%;
    background: #fff;
    padding: 25px 30px;
    border-radius: 5px;
    border: 1px solid #e4e6e9;
    box-shadow: 0 1px 13px 2px rgba(0, 0, 0, 0.05);
    margin-bottom: 15px;
}

.each-learn-section:last-child {
    margin-bottom: 0;
}

.learn-section-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    margin-bottom: 15px;
}

.learn-section-header h5 {
    float: left;
    font-size: 16px;
    font-weight: 600;
    color: var(--default-text);
    line-height: normal;
}

.learn-section-header .form-option-block {
    top: 17.4px;
    right: 0;
}

.learn-section-body {
    float: left;
    width: 100%;
    min-height: 60px;
}

.each-sub-section {
    float: left;
    width: 100%;
    height: 55px !important;
    background: #fff;
    border: .5px dashed rgba(74, 74, 74, .2);
    padding: 0 50px 0 20px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    cursor: pointer;
    background-image: url(images/line-texture.png);
    position: relative;
}

.each-sub-section:after {
    content: "";
    background: var(--sprite-one) no-repeat -233px -334px;
    width: 8px;
    height: 13px;
    position: absolute;
    right: 20px;
    top: calc(50% - 6.5px);
}

.each-sub-section:last-child {
    margin-bottom: 0px;
}

.each-sub-section:hover {
    border-color: var(--default-color);
}

.each-sub-section h5 {
    float: left;
    float: left;
    color: var(--default-text);
    font-size: 14px;
    line-height: 16px;
    display: flex;
    align-items: center;
}

.build-page-ico:before {
    background-position: -433px -361px;
    width: 20px;
    height: 18px;
    left: 20px;
    top: calc(50% - 9px);
}

.build-page-ico:hover:before {
    background-position: -433px -340px;
}

.skill-ico:before {
    background-position: -526px -278px;
    width: 17px;
    height: 17px;
    left: 20px;
    top: calc(50% - 8.5px);
}

.skill-ico:hover:before {
    background-position: -526px -300px;
}

.duration-ico:before {
    background-position: -504px -278px;
    width: 17px;
    height: 17px;
    left: 20px;
    top: calc(50% - 8.5px);
}

.duration-ico:hover:before {
    background-position: -504px -300px;
}

.each-learner-course {
    float: left;
    width: 100%;
    height: 145px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 5px;
    background-color: #FFFFFF;
    margin-bottom: 20px;
}

.learner-course-left {
    float: left;
    width: 150px;
    height: 100%;
    border-radius: 5px 0 0 5px;
}

.learner-course-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px 0 0 5px;
}

.learner-course-right {
    float: left;
    width: calc(100% - 150px);
    height: 100%;
    padding: 15px;
}

.course-bredcrumb {
    float: left;
    width: 100%;
    margin-bottom: 3px;
}

.course-bredcrumb h5 {
    float: left;
    color: var(--default-grey);
    font-size: 10px;
    letter-spacing: 0;
    line-height: 11px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
}

.course-module:before {
    content: "";
    width: 5px;
    height: 5px;
    background: var(--default-grey);
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
}

span.course-module {
    display: flex;
    align-items: center;
}

.course-type {
    margin-right: 5px;
}

.course-detailed-info {
    float: left;
    width: 100%;
    margin-bottom: 12px;
}

.course-detailed-info h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 21px;
    color: var(--default-text);
    margin-bottom: 9px;
    transition: .3s ease-out;
}

.each-learner-course:hover .course-detailed-info h5 {
    color: var(--default-color);
}

.course-detailed-info p {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 13px;
    letter-spacing: 0;
    line-height: 15px;
}

.course-other-info {
    float: left;
    width: 100%;
}

.other-info-list {
    float: left;
    width: 100%;
}

.other-info-list li {
    float: left;
    margin-right: 65px;
}

.other-info-list li p {
    float: left;
    font-size: 8px;
    text-transform: uppercase;
    color: var(--default-grey);
    line-height: normal;
}

.other-info-list li h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 17px;
    color: var(--default-text);
}

.raing-star-wrap {
    float: left;
    width: 100%;
}

.raing-star-wrap span {
    float: left;
    width: 14px;
    height: 14px;
    margin-right: 3px;
}

.raing-star-wrap span:before {
    content: "";
    background: var(--sprite-two) no-repeat -461px -185px;
    width: 14px;
    height: 14px;
    display: inline-block;
}

.raing-star-wrap span.active:before {
    background-position: -443px -185px;
}

.learn-detail-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.learn-detail-wrapper .each-learner-course {
    border-radius: 0;
    border-right: 0;
    border-left: 0;
    border-top: 0;
}

.learn-detail-wrapper .each-learner-course:hover .course-detailed-info h5 {
    color: var(--default-text);
}

.learn-detail-wrapper .learner-course-left {
    border-radius: 0;
    position: relative;
}

.learn-detail-wrapper .learner-course-left img {
    border-radius: 0;
}

.learn-detail-wrapper .learner-course-left:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    left: 0;
    top: 0;
}

.backtoist-course {
    float: left;
    width: 20px;
    height: 20px;
    position: relative;
    padding: 0;
    border: 0;
    line-height: 0;
    background: transparent;
    position: absolute;
    left: 15px;
    top: 15px;
    cursor: pointer;
}

.backtoist-course:before {
    content: "";
    background: var(--sprite-two) no-repeat -619px -186px;
    width: 14px;
    height: 13px;
    display: inline-block;
}

.data-learner-course {
    float: left;
    width: 100%;
    height: calc(100% - 165px);
}

.data-learner-course-left {
    float: left;
    width: 400px;
    height: 100%;
    background: #FFFFFF;
    border: 1px solid #E3E5E8;
    border-left: 0;
    margin-right: 20px;
}

.data-learner-course-right {
    float: left;
    width: calc(100% - 420px);
    height: 100%;
    background: #FFFFFF;
    border: 1px solid #E3E5E8;
    border-right: 0;
}

.data-learner-course-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.data-learner-course-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    overflow-y: auto;
}

.data-learner-course-header h5 {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 16px;
}

.learner-accordion {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
}

.learner-accordion .card {
    border: 0;
    border-bottom: 1px solid #E3E5E8 !important;
    border-radius: 0 !important;
    background: #f5f5f5;
}

.learner-accordion .card-header {
    float: left;
    width: 100%;
    height: auto;
    min-height: 60px;
    display: flex;
    align-items: center;
    background: transparent;
}

.learner-accordion .accordion-btns {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 9px 35px 9px 20px;
}

.learner-accordion .accordion-btns h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 16px;
    margin-bottom: 5px;
    font-weight: 600;
}

.learner-accordion .accordion-btns p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 10px;
    letter-spacing: 0;
    line-height: 11px;
}

.learner-accordion .accordion-btns p span:first-child {
    margin-right: 5px;
}

.course-timer:before {
    content: "";
    width: 5px;
    height: 5px;
    background: var(--default-grey);
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
    position: relative;
    top: -1px;
}

.module-completed .accordion-btns h5:before {
    content: "";
    background: var(--sprite-two) no-repeat -478px -188px;
    width: 11px;
    height: 8px;
    display: inline-block;
    margin-right: 8px;
}

.learner-accordion .card-body {
    float: left;
    width: 100%;
    padding: 0;
    border-top: 1px solid #E3E5E8;
}

.chapter-container {
    float: left;
    width: 100%;
}

.each-chapter-list {
    float: left;
    width: 100%;
    height: auto;
    min-height: 50px;
}

.each-chapter-list nav {
    float: left;
    width: 100%;
    height: auto;
    min-height: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px 20px;
    border: 1px solid transparent;
    border-left: 0;
    border-right: 0;
    cursor: pointer;
}

.each-chapter-list nav h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
    margin-bottom: 5px;
    padding-left: 20px;
    position: relative;
}

.each-chapter-list nav p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 10px;
    letter-spacing: 0;
    line-height: 11px;
}

.each-chapter-list nav p span:first-child {
    margin-right: 5px;
}

.chapter-type:before {
    content: "";
    background: var(--sprite-two) no-repeat;
    display: inline-block;
    margin-right: 5px;
}

.task-chapter:before {
    background-position: -495px -188px;
    width: 8px;
    height: 8px;
}

.doc-chapter:before {
    background-position: -507px -188px;
    width: 10px;
    height: 8px;
}

.page-chapter:before {
    background-position: -521px -188px;
    width: 10px;
    height: 8px;
}

.video-chapter:before {
    background-position: -535px -188px;
    width: 10px;
    height: 8px;
}

.audio-chapter:before {
    background-position: -549px -188px;
    width: 10px;
    height: 8px;
}

.image-chapter:before {
    background-position: -563px -188px;
    width: 10px;
    height: 8px;
}

.each-chapter-list nav.chapter-completed h5:before {
    content: "";
    background: var(--sprite-two) no-repeat -478px -188px;
    width: 11px;
    height: 8px;
    margin-right: 8px;
    position: absolute;
    left: 0;
    top: 5px;
}

.each-chapter-list nav.current-chapter h5 {
    font-weight: 600;
    padding-left: 0;
}

.each-chapter-list nav.current-chapter {
    background: rgba(74, 144, 226, 0.2);
    border-color: rgb(226 229 232);
}

.accordion-btns.collapsed:after {
    content: "";
    background: var(--sprite-two) no-repeat -577px -189px;
    width: 11px;
    height: 7px;
    position: absolute;
    right: 15px;
    top: 20px;
    transform: rotate(-90deg);
    transition: .3s ease-out;
}

.accordion-btns:after {
    content: "";
    background: var(--sprite-two) no-repeat -577px -189px;
    width: 11px;
    height: 7px;
    position: absolute;
    right: 15px;
    top: 20px;
    transform: rotate(0deg);
    transition: .3s ease-out;
}

.learner-accordion .card.current-active {
    background: #fff;
}

.data-learner-course-right-header {
    float: left;
    width: 100%;
    height: auto;
    min-height: 65px;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
}

.data-learner-course-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 65px);
    overflow-y: auto;
}

.data-learner-course-other-details-left h5 {
    float: left;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 21px;
    margin-bottom: 5px;
}

.data-learner-course-other-details-left .chapter-text-desc {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 10px;
    letter-spacing: 0;
    line-height: 11px;
    display: flex;
    align-items: center;
}

.data-learner-course-other-details-left .chapter-text-desc span:first-child {
    margin-right: 5px;
}

.data-learner-course-other-details-right .general-btn {
    height: 35px;
    min-width: auto;
    padding: 0 22px;
    margin-left: 10px;
}

.chapter-progress {
    float: left;
    height: 5px;
    margin-left: 12px;
}

.chapter-progress .progress {
    float: left;
    width: 172px;
    height: 5px;
    margin: 0;
    box-shadow: none;
    border-radius: 8px;
    background: #DFE6E6;
}

.chapter-progress .progress .progress-bar {
    background: var(--default-color);
    border-radius: 5px;
}

.chapter-progress span {
    color: #a9a9a9;
    margin-left: 5px;
    position: relative;
    top: -4px;
}

.course-preview-box {
    float: left;
    width: 100%;
    height: 410px;
    position: relative;
}

.course-preview-box img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.course-preview-box:before {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    left: 0;
    top: 0;
}

.play-content {
    float: left;
    width: 48px;
    height: 36px;
    background: transparent;
    border: 0;
    padding: 0;
    position: absolute;
    left: calc(50% - 24px);
    top: calc(50% - 18px);
    cursor: pointer;
}

.play-content:before {
    content: "";
    background: var(--sprite-two) no-repeat -651px -352px;
    width: 48px;
    height: 36px;
    display: inline-block;
}

.course-other-details {
    float: left;
    width: 100%;
    height: calc(100% - 409px);
}

.course-other-details .nav-tabs {
    float: left;
    width: 100%;
    height: 45px;
}

.course-other-details .nav-tabs .nav-item {
    float: left;
    height: 100%;
}

.course-other-details .nav-tabs .nav-link {
    float: left;
    height: 100%;
    border: 0;
    padding: 0;
    display: flex;
    align-items: center;
    padding: 0 25px;
    color: var(--default-grey);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 16px;
    font-weight: 600;
    position: relative;
}

.course-other-details .nav-tabs .nav-link.active {
    color: var(--default-color);
}

.course-other-details .nav-tabs .nav-link.active:before {
    content: "";
    width: 100%;
    height: 2px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    bottom: -1px;
}

.course-other-details .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 45px);
}

.course-other-details .tab-content .tab-pane {
    float: left;
    width: 100%;
    height: 100%;
}

.course-comment-section {
    float: left;
    width: 100%;
    height: 100%;
}

.course-comment-header {
    float: left;
    width: 100%;
    padding: 15px 20px;
}

.course-comment-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 19px;
    margin-bottom: 12px;
}

.course-comment-header-bottom {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.learner-course-status {
    float: left;
    height: 20px;
    display: flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 3px;
    background-color: var(--default-color);
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 14px;
    margin-right: 12px;
}

.course-comment-header-bottom p {
    float: left;
    font-size: 14px;
    color: var(--default-grey);
    line-height: 16px;
    margin-right: 25px;
}

.learn-comment-ico:before {
    background-position: -602px -186px;
    width: 13px;
    height: 13px;
    margin-right: 6px;
}

.learn-comment-ico {
    display: flex;
    align-items: center;
}

.course-comment-body {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: calc(100% - 81px);
    overflow-y: auto;
}

.ind-course-comment-list {
    float: left;
    width: 100%;
    border: 1px solid #E3E5E8;
    border-radius: 3px;
    margin-bottom: 15px;
}

.ind-course-comment-list:last-child {
    margin-bottom: 0;
}

.course-comment-list-header {
    float: left;
    width: 100%;
    height: 40px;
    background: #F7F8F9;
    border-bottom: 1px solid #E3E5E8;
}

.course-comment-list-header-left {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
}

.course-comment-holder {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 3px 0 0 0;
}

.course-comment-holder img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 3px 0 0 0;
}

.course-comment-list-header-left h5 {
    float: left;
    color: var(--default-text);
    font-size: 12px;
    letter-spacing: 0;
    line-height: 16px;
    padding: 0 15px;
    font-weight: 600;
}

.course-comment-list-header-left h5 .small-txt {
    color: var(--default-grey);
    font-weight: 400;
}

.course-comment-list-bottom {
    float: left;
    width: 100%;
    height: auto;
    min-height: 50px;
    padding: 12px 20px;
}

.course-comment-list-bottom p {
    float: left;
    width: 100%;
    color: #848488;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 22px;
}

.learn-task:before {
    background-position: -292px -139px;
    width: 18px;
    height: 18px;
    margin-right: 10px;
    zoom: .8;
}

.learn-resource:before {
    background-position: -96px -88px;
    width: 19px;
    height: 19px;
    margin-right: 10px;
    zoom: .8;
}

.learn-forms:before {
    background-position: -457px -165px;
    width: 16px;
    height: 16px;
    margin-right: 10px;
    zoom: .8;
}

.learn-page:before {
    background-position: -433px -361px;
    width: 20px;
    height: 18px;
    margin-right: 10px;
    zoom: .8;
}

.each-sub-section button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: absolute;
    right: 40px;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.each-sub-section:hover button {
    opacity: 1;
    pointer-events: auto;
}

.ind-draggable-item {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    position: relative;
}

.drag-block {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.loadmore-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loadmore-button {
    float: left;
    width: auto;
    height: 30px;
    border: 0;
    padding: 0;
    line-height: 0;
    background: var(--default-color);
    padding: 0 30px 0 10px;
    color: #fff;
    font-size: 13px;
    line-height: 30px;
    border-radius: 32px;
    position: relative;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, .15);
}

.loadmore-button.ico-lib:before {
    background-position: -385px -474px;
    width: 14px;
    height: 8px;
    zoom: .8;
    margin-right: 12px;
    position: absolute;
    right: 1px;
    top: calc(50% - 4px);
}

.task-wrapper .data-learner-course-right-body .course-preview-box {
    height: 100%;
}

.task-wrapper .data-learner-course-right-body .course-preview-box:before {
    content: none;
}

.task-wrapper .learn-detail-wrapper .each-learner-course {
    border: 1px solid rgba(64, 83, 100, .15);
}

.task-wrapper .data-learner-course-left {
    border: 1px solid #e3e5e8;
}

.task-wrapper .data-learner-course-right {
    border: 1px solid #e3e5e8;
}

.task-wrapper .course-preview-box img {
    object-fit: contain;
}

.task-wrapper .data-learner-course-right-body .course-preview-box video {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.task-wrapper .data-learner-course-right-body .course-preview-box.audio-box {
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task-wrapper .data-learner-course-right-body .course-preview-box iframe {
    height: 100%;
    /* min-height: 750px; */
}

.default-text {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.default-text h5 {
    font-size: 25px;
    font-weight: 300;
    color: #d0d0d0;
}

.short-header .learner-course-right {
    width: 100%;
    padding-right: 50px;
    position: relative;
}

.short-header .learner-course-right:after {
    content: "";
    background: var(--sprite-two) no-repeat -446px -244px;
    width: 22px;
    height: 13px;
    position: absolute;
    right: 30px;
    top: 30px;
    transform: rotate(180deg);
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    zoom: .8;
}

.learn-detail-wrapper .each-learner-course {
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}

.learn-detail-wrapper.short-header .each-learner-course {
    height: 75px;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    overflow: hidden;
}

.each-learner-course.media-off {
    cursor: pointer;
}

.short-header .data-learner-course {
    height: calc(100% - 97px);
}

.learn-detail-wrapper.short-header.active .each-learner-course {
    height: auto;
}

.short-header.active .data-learner-course {
    height: calc(100% - 165px);
}

.short-header.active .learner-course-right:after {
    transform: rotate(90deg);
}

.form-detail-top-inside-wrapper {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.learn-option-block {
    float: left;
    padding-left: 30px;
    margin-top: 20px;
}

.data-view .with-publish .form-detail-top.learn-top {
    max-height: 151px;
    height: 151px;
}

.learn-option-block button {
    margin-right: 15px;
    padding: 0 15px;
    height: 30px;
    background: transparent;
    color: var(--btn-color);
    box-shadow: none;
}

.learn-option-block button:hover {
    background: transparent;
    color: var(--default-color);
}

.learn-option-block .publish-btn {
    border-color: #03B86E;
    color: #03B86E;
}

.learn-option-block .publish-btn:hover {
    color: #03B86E;
}

.data-view .form-detail-panel.with-publish+.data-holder.learn-holder {
    height: calc(100% - 173px);
}

.ind-draggable-item.disable {
    pointer-events: none;
    opacity: .75;
    box-shadow: none;
}

.ind-draggable-item.disable .each-learn-section {
    box-shadow: none;
}

.learn-task-mod .modal-body .task-left {
    float: left;
    width: 100%;
}

.learn-task-mod .modal-body .task-detail-panel-content-area-left {
    padding-left: 0;
}

.learn-task-mod .modal-body .attachment-list-wrapper li {
    float: left;
    list-style-type: none;
    margin-right: 20px;
    width: 42px;
    height: 50px;
}

.course-preview-box .task-left {
    float: left;
    width: 100%;
    border: 0;
}

.course-preview-box .task-left {
    float: left;
    width: 100%;
}

.course-preview-box .task-detail-panel-content-area-left {
    padding-left: 0;
}

.course-preview-box .attachment-list-wrapper li {
    float: left;
    list-style-type: none;
    margin-right: 20px;
    width: 42px;
    height: 50px;
}

.course-preview-box .task-detail-panel {
    border: 0;
    border-bottom: 1px solid rgba(64, 83, 100, 0.15);
}

.resource-preview-mod .modal-lg {
    max-width: 100%;
    height: 100%;
    margin: 0 auto;
}

.resource-preview-mod .modal-content {
    height: 100%;
}

.resource-preview-mod .modal-body {
    max-height: 100%;
}

.rs-preview-block {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
}

.rs-preview-block .mang-lbl-block-mod-in {
    float: left;
    width: calc(100% - 400px);
}

.rs-preview-box {
    float: left;
    width: 400px;
    height: 100%;
    background: #ecf0f1;
    border-left: 1px solid #e4e5e9;
}

.rs-preview-header {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid #e4e5e9;
    background: var(--white);
    padding: 0 20px;
    display: flex;
    align-items: center;
}

.rs-preview-header h5 {
    float: left;
    font-weight: 600;
    color: var(--default-text);
}

.rs-preview-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
    overflow-y: auto;
}

.each-rs-preview {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    border-radius: 5px;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.rs-thumb-preview {
    float: left;
    width: 100%;
    height: 200px;
}

.rs-thumb-preview img,
.rs-thumb-preview video {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px 5px 0 0;
}

.rs-thumb-details {
    float: left;
    width: 100%;
    height: 50px;
    background: var(--white);
    padding: 0 20px;
    display: flex;
    align-items: center;
    border-radius: 0 0 5px 5px;
}

.rs-thumb-details .section-info {
    min-height: auto;
    border: 0;
    padding: 0;
    margin: 0;
}

.learn-tab {
    float: left;
    width: 100%;
    height: 50px;
    border-top: 1px solid #e2e5e8;
}

.each-learn-tab {
    float: left;
    width: auto;
    height: 50px;
    padding: 0 25px;
    font-size: 14px;
    color: var(--default-grey);
    border: 0;
    background: transparent;
    position: relative;
}

.each-learn-tab.active:before {
    content: "";
    width: 100%;
    height: 3px;
    background: var(--default-color);
    position: absolute;
    left: 0;
    bottom: 0;
}

.each-learn-tab.active {
    color: var(--default-color);
    font-weight: 600;
}

.data-view .form-detail-panel.with-publish.learn-tab-block+.data-holder.learn-holder {
    height: calc(100% - 224px);
}

.learn-table {
    float: left;
    width: 100%;
    margin: 0 0 20px;
    border: 1px solid #e3e5e8;
}

.learn-table thead tr th {
    padding: 12px 25px;
    background: var(--white);
    color: #565656;
    font-size: 14px;
    line-height: 30px;
    font-weight: 600;
    text-transform: uppercase;
    position: sticky;
    left: 0;
    top: 0;
}

.learn-table thead tr th:after {
    content: "";
    width: 100%;
    height: 1px;
    background: #e3e5e8;
    position: absolute;
    left: 0;
    bottom: 0;
}

.learn-table tbody tr td {
    padding: 12px 25px;
    background: var(--white);
    color: #555;
    font-size: 16px;
    line-height: 23px;
    border-bottom: 1px solid #e3e5e8;
    vertical-align: middle;
}

.learn-section-header-inner {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding-right: 40px;
    margin-bottom: 5px;
}

.learn-section-header-inner h5 {
    margin-bottom: 5px;
    width: auto;
    display: flex;
    align-items: center;
}

.learn-section-header-inner p {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    line-height: 22px;
    margin-bottom: 10px;
}

.each-learn-section:hover .learn-section-header-inner h5 .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.each-learn-section .learn-section-header-inner h5 .wf-btn-block {
    float: none;
    margin-left: 10px;
}

.each-course-field {
    float: left;
    width: 70%;
    display: flex;
    flex-direction: column;
    padding-left: 30px;
    position: relative;
}

.each-course-field:before {
    position: absolute;
    left: 0;
    top: calc(50% - 9.5px);
}

.each-course-field h5 {
    font-weight: 600;
    margin-bottom: 3px;
}

.each-course-field p {
    font-size: 14px;
    color: var(--default-grey);
    float: left;
    width: 100%;
    max-width: 90%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.section-content-ico:before {
    background-position: -213px -381px;
    width: 19px;
    height: 14px;
    zoom: .8;
}

.instruction-block {
    float: left;
    width: 100%;
    padding: 20px;
    background: var(--white);
    border-bottom: 1px solid #e2e5e8;
    position: relative;
}

.instruction-block p {
    line-height: 24px;
    color: var(--default-grey);
    margin-bottom: 15px;
    position: relative;
}

.instruction-block p:last-child {
    margin-bottom: 0px;
}

.short-details {
    float: left;
    width: 100%;
    padding: 0 20px 12px;
}

.short-details {
    font-size: 14px;
    color: var(--default-grey);
    line-height: normal;
}

.data-learner-course-other-details-right .general-btn.page-next,
.data-learner-course-other-details-right .general-btn.page-previous {
    background: transparent;
    color: var(--default-color);
    box-shadow: none;
    padding: 0 15px;
    min-width: auto;
    line-height: 33px;
}

.general-btn.page-next:after {
    content: "";
    background: var(--sprite-two) no-repeat -820px -183px;
    width: 16px;
    height: 16px;
    display: inline-block;
    transform: rotate(180deg);
    margin-left: 10px;
    zoom: .8;
    position: relative;
    top: 3px;
}

.general-btn.page-previous:before {
    content: "";
    background: var(--sprite-two) no-repeat -820px -183px;
    width: 16px;
    height: 16px;
    display: inline-block;
    margin-right: 10px;
    zoom: .8;
    position: relative;
    top: 3px;
}

.iframe-box {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.mask {
    float: left;
    width: 65px;
    height: 65px;
    background: transparent;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
}

.precallnote-textarea.learn-text .ql-toolbar.ql-snow {
    border: 1px solid #dee0e3;
    border-radius: 0;
}

.precallnote-textarea.learn-text .ql-container.ql-snow {
    border: 1px solid #dee0e3;
    border-top: 0;
    border-radius: 0;
}

.section-mod .modal-body {
    max-height: calc(100vh - 300px);
    overflow-y: auto;
}

.section-mod .modal-milestone {
    float: left;
    width: 100%;
}

.instruction-block p a {
    color: var(--default-color);
}

.instruction-block p em {
    font-style: italic;
}

.instruction-block h2 {
    font-size: 1.5rem;
    line-height: normal;
    color: var(--default-text);
    margin-bottom: 15px;
}

.instruction-block ol {
    list-style-type: decimal;
    padding-left: 13px;
    margin-bottom: 15px;
}

.instruction-block ol li {
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 5px;
}

.instruction-block ul {
    list-style-type: disc;
    padding-left: 17px;
    margin-bottom: 15px;
}

.instruction-block ul li {
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 5px;
}

.each-sub-section.auto-height {
    height: auto !important;
}

.each-sub-section.auto-height .each-course-field {
    padding: 18px 0 18px 30px;
    width: 80%;
}

.each-sub-section.auto-height .each-course-field p {
    display: block;
    overflow: unset;
    margin-bottom: 10px;
    line-height: normal;
}

.each-sub-section.auto-height .each-course-field:before {
    top: 24px;
}

.each-course-field p a {
    color: var(--default-color);
}

.each-course-field p em {
    font-style: italic;
}

.each-course-field ol,
.learn-section-header-inner ol,
.short-details ol {
    float: left;
    width: 100%;
    list-style-type: decimal;
    padding-left: 13px;
    margin-bottom: 10px;
}

.each-course-field ul,
.learn-section-header-inner ul,
.short-details ul {
    float: left;
    width: 100%;
    list-style-type: disc;
    padding-left: 17px;
    margin-bottom: 10px;
}

.each-course-field ol li,
.learn-section-header-inner ol li,
.short-details ol li {
    font-size: 14px;
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 5px;
}

.each-course-field ul li,
.learn-section-header-inner ul li,
.short-details ul li {
    font-size: 14px;
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 5px;
}

.each-course-field ol li:last-child,
.learn-section-header-inner ol li:last-child,
.short-details ol li:last-child {
    margin-bottom: 0;
}

.each-course-field h2,
.learn-section-header-inner h2,
.short-details h2 {
    font-size: 16px;
    line-height: normal;
    margin-bottom: 10px;
    margin-top: 10px;
}

.each-sub-section.auto-height:after {
    top: 21px;
}

.short-details.description {
    margin-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
}

.short-details p {
    line-height: normal;
    color: var(--default-grey);
    margin-bottom: 10px;
    position: relative;
}

.learn-section-header-inner em {
    font-style: italic;
}

.course-complete-block {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: var(--white);
}

.completed-ico:before {
    background-position: -120px -117px;
    width: 32px;
    height: 32px;
    zoom: 1.5;
    margin-bottom: 10px;
}

.course-complete-block h5 {
    font-size: 25px;
    font-weight: 300;
    color: var(--green);
    line-height: normal;
    margin-bottom: 10px;
}

.course-complete-block p {
    font-size: 18px;
    color: var(--default-grey);
}

.short-details p em {
    font-style: italic;
}

.data-learner-course-right-footer {
    float: left;
    width: 100%;
    height: 65px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.learn-footer .data-learner-course-right-body {
    height: calc(100% - 130px);
}

.disable-btn {
    pointer-events: none;
    opacity: .7;
    filter: grayscale(1);
}

.couser-index .card {
    margin-bottom: 10px;
}

.couser-index.accordion>.card:first-of-type {
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}

.couser-index .card-header {
    padding: 0 20px;
    height: 100px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, .125);
    cursor: pointer;
}

.course-index-user {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.course-user figure {
    float: left;
    width: 70px;
    height: 70px;
    margin-right: 15px;
}

.course-user figure img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.course-user {
    float: left;
    width: 50%;
    display: flex;
    align-items: center;
}

.course-user-details h5 {
    float: left;
    width: 100%;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 5px;
}

.course-user-details p {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 5px;
}

.course-user-details p:last-child {
    margin-bottom: 0;
}

.course-selected h5 {
    font-size: 14px;
    color: var(--default-color);
    border: 1px solid var(--default-color);
    line-height: 30px;
    padding: 0 10px;
    border-radius: 5px;
}

.couser-index .card-body {
    float: left;
    width: 100%;
    padding: 0;
}

.course-index-table table {
    margin: 0;
    border-bottom: 0;
    border-right: 0;
    border-left: 0;
}

.course-index-table .learn-table thead tr th {
    border-bottom: 0;
}

.course-index-table .learn-table tbody tr td {
    border-top: 0;
}

.course-index-table .learn-table tbody tr:last-child td {
    border-bottom: 0;
}

.course-index-table .status-tag.inprogress {
    background: #F8C822;
}

.new-task-input.pass-score {
    border-top: 1px solid #eceff1;
}

.assessment:before {
    background-position: -32px -362px;
    width: 21px;
    height: 17px;
}

.assessment.active:before,
.assessment:hover:before {
    background-position: -32px -384px;
}

.assessment-wrapper {
    float: left;
    width: 100%;
    padding: 30px 20px 20px 20px;
}

.each-assessment {
    float: left;
    width: 100%;
    padding: 30px 30px 45px 30px;
    border: 1px dashed #e4e6e9;
    border-radius: 5px;
    position: relative;
    background-image: url(images/line-texture.png);
    margin-bottom: 30px;
}

.each-assessment:last-child {
    margin-bottom: 0;
}

.assessment-title {
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    color: var(--default-grey);
    position: absolute;
    right: 30px;
    top: -13px;
    background: var(--white);
    border: 1px solid #dee1e4;
    padding: 0 5px;
    border-radius: 5px;
}

.each-assessment .rightButtons {
    top: auto;
    right: -10px;
    bottom: -9px;
}

.each-assessment .btnsubIconsadd:before {
    background-position: -355px -333px;
    width: 17px;
    height: 17px;
}

.each-assessment .btnsubIcon:before {
    background-position: -328px -333px;
    width: 17px;
    height: 17px;
}

.task-tg .each-assessment .select-box select {
    border: 1px solid #dee1e4;
    height: 40px;
    padding-left: 20px;
    border-radius: 5px;
}

.each-assessment .select-box {
    margin-bottom: 15px;
}

.each-assessment .each-inp-box {
    width: 100%;
}

.answer-container {
    float: left;
    width: 100%;
    position: relative;
}

.each-assessment .each-inp-box:last-child {
    margin: 0;
}

.answer-container .each-inp-box {
    padding-right: 30px;
    position: relative
}

.answer-container .rightButtons {
    right: 21px;
    z-index: 1;
    display: flex;
    justify-content: flex-end;
}

.answer-container .each-inp-box .select-chk-block {
    position: absolute;
    right: -20px;
    top: 38px;
}

.answer-container .each-inp-box .val-error {
    border: 1px solid #ff9393 !important;
}

.learn-assessment:before {
    background-position: -32px -362px;
    width: 21px;
    height: 17px;
    margin-right: 10px;
    zoom: .7;
    top: 28px !important;
}

.each-sub-section.auto-height .each-course-field>div>p:last-child {
    margin-bottom: 0;
}

.assessment-preview {
    float: left;
    width: 100%;
}

.assessment-preview>h5 {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.each-assessment-preview {
    float: left;
    width: 100%;
    border: 1px dashed #e4e6e9;
    padding: 15px;
    margin-bottom: 10px;
    background-image: url(images/line-texture.png);
}

.each-assessment-preview h5 {
    float: left;
    width: 100%;
    font-weight: 600;
    color: var(--default-color);
    line-height: normal;
    margin-bottom: 10px;
}

.each-assessment-preview ul {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    list-style-type: decimal;
    padding-left: 25px;
}

.each-assessment-preview ul li {
    float: left;
    width: 100%;
    line-height: normal;
    margin-bottom: 5px;
    font-size: 14px;
}

.each-assessment-preview>p {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: normal;
    margin-bottom: 10px;
    color: var(--default-grey);
}

.correct-answer {
    color: #4caf50 !important;
    margin-bottom: 0 !important;
}

.assessment-questions {
    float: left;
    width: 100%;
    border: 1px dashed #e2e5e8;
    padding: 0;
    background-image: url(images/line-texture.png);
    background-color: var(--white);
}

.assessment-questions-header {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.assessment-questions-header h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    line-height: normal;
    font-weight: 600;
    color: var(--default-color);
}

.assessment-options {
    float: left;
    width: 100%;
}

.assessment-options .radio-block {
    float: left;
    width: 100%;
    margin-bottom: 15px
}

.assessment-options .radio-block label {
    font-size: 16px;
    color: var(--default-grey);
}

.assess-btn-wrap .general-btn.page-next,
.assess-btn-wrap .general-btn.page-previous {
    background: 0 0;
    color: var(--default-color);
    box-shadow: none;
    padding: 0 15px;
    min-width: auto;
    line-height: 33px;
    margin-left: 10px;
}

.assess-btn-wrap {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 20px;
    border-top: 1px dashed #e2e5e8;
}

.course-preview-box.assessment {
    padding: 20px;
}

.assessment-questions-body {
    float: left;
    width: 100%;
    padding: 20px;
}

.data-learner-course-other-details-right.disable .general-btn {
    pointer-events: none;
    opacity: .5;
}

.assessment-options .radio-block label .in-correct:after {
    content: "";
    background: var(--sprite-two) no-repeat -348px -365px;
    width: 9px;
    height: 10px;
    display: inline-block;
    margin-left: 10px;
}

.assessment-options .radio-block label .correct:after {
    content: "";
    background: var(--sprite-one) no-repeat -422px -281px;
    width: 14px;
    height: 11px;
    display: inline-block;
    margin-left: 10px;
    zoom: .8;
}

.assess-correct-ans {
    float: left;
    width: 100%;
    color: #4caf50;
    margin: 5px 0 0 0;
}

.assessment-chapter:before {
    background-position: -32px -362px;
    width: 21px;
    height: 17px;
    zoom: .45;
    margin-right: 10px;
}

.assessment-options .select-chk-block {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.assessment-options .select-chk-block .control {
    font-size: 16px;
    color: var(--default-grey);
}

.error .completed-ico:before {
    background-position: -12px -205px;
    width: 32px;
    height: 32px;
}

.course-complete-block.error h5 {
    color: #f5a623;
}

.course-report-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    margin-bottom: 20px;
}

.course-report-header h5 {
    font-size: 18px;
    font-weight: 600;
    color: var(--default-text);
}

.course-report-header .data-search-box {
    width: 350px;
}

.data-view.field-form .course-report-header+.data-holder.learn-holder {
    height: calc(100% - 335px);
}

.rich-text-preview {
    float: left;
    width: 100%;
}

.rich-text-preview h1 {
    float: left;
    width: 100%;
    font-size: 25px;
    line-height: normal;
    margin-bottom: 10px;
}

.rich-text-preview p {
    width: 100%;
    line-height: 24px;
    margin-bottom: 15px;
}

.rich-text-preview ol {
    float: left;
    width: 100%;
    list-style-type: decimal;
    padding-left: 15px;
    margin-bottom: 15px;
}

.rich-text-preview ol li {
    line-height: 24px;
    margin-bottom: 5px;
}

.rich-text-preview ul {
    float: left;
    width: 100%;
    list-style-type: disc;
    padding-left: 17px;
    margin-bottom: 15px;
}

.rich-text-preview ul li {
    float: left;
    width: 100%;
    line-height: 24px;
    margin-bottom: 10px;
}

.rich-text-preview ul li:last-child {
    margin-bottom: 0px;
}

.rich-text-preview a {
    color: var(--default-color);
}

.rich-text-preview em {
    font-style: italic;
}

.learn-richtext:before {
    background-position: -514px -244px;
    width: 15px;
    height: 13px;
    margin-right: 10px;
    top: 22px !important;
}

.richtext-chapter:before {
    background-position: -514px -244px;
    width: 15px;
    height: 13px;
    zoom: .6;
    margin-right: 10px;
}

.rich-text-preview img {
    float: left;
    max-width: 100%;
    margin: 15px 0 20px 0;
}

/* .course-preview-box .rich-text-preview {
    padding: 20px;
} */
.expandable-textarea .ql-editor.ql-blank::before {
    font-style: normal;
    color: #bdbdbd;
}

.inline-text-box {
    float: left;
    width: 100%;
    margin: 20px 0 0;
    border: 0 !important;
}

.inline-text-box input {
    height: 40px;
    border: 1px solid #dee0e3;
    border-radius: 5px;
    padding: 0 10px;
    font-size: 14px;
    max-width: 60px;
    margin: 0 6px;
}

.inline-text-box p {
    color: var(--default-grey);
    font-size: 14px;
}

.form-detail-top.learn-top .published {
    display: flex;
    align-items: center;
}

.form-detail-top-left .published:after {
    content: "";
    background: var(--sprite-one) no-repeat -366px -277px;
    width: 19px;
    height: 19px;
    display: inline-block;
    margin-left: 10px;
}

.instruction-block p br {
    display: none;
}

.each-chapter-list:first-child .current-chapter {
    border-top-color: transparent;
}

.template-4 .ind-form-field .checkbox-wrapper,
.template-4 .ind-form-field .radio-wrapper {
    flex-direction: column;
}

.data-view .with-publish .form-detail-top.learn-top.height-210 {
    height: 202px;
    max-height: 202px;
}

.height-210 .learn-course-info {
    margin: 10px 0;
}

.data-view .form-detail-panel.with-publish.learn-tab-block+.data-holder.learn-holder.more-height {
    height: calc(100% - 275px);
}

.course-selected {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.course-selected p {
    font-size: 14px;
    color: var(--default-grey);
    margin-top: 10px;
}

.height-120 .card-header {
    height: 120px;
}

.task-wrapper .data-learner-course-right-body .instruction-block+.course-preview-box {
    height: calc(100% - 70px);
    padding: 20px;
}

.height-full .task-wrapper.task-detail-stand.false.learn-mb {
    height: 100%;
}

.mang-lbl-block-mod-in .resource-filter-modal-header .select-box {
    border: 0;
}

.rs-thumb-preview>iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px 5px 0 0;
}

/* .tile-all-holder.learn-list {
    height: 100%;
} */
.learn-list .absolute-holder {
    height: calc(100vh - 100px);
}

.learn-detail-panel.show-sm {
    display: none !important;
}

/*------ Learn End ------*/

/*------ Meeting Room  ------*/

.yellow-bg {
    background: #FFC542 !important;
}

.green-bg {
    background: #82C43C !important;
}

.purple-bg {
    background: #A461D8 !important;
}

.ico-lib-meeting:before {
    content: "";
    background: var(--sprite-five);
    display: inline-block
}

.meeting-wrapper-block {
    float: left;
    width: 100%;
    height: 100%;
    padding: 50px;
}

.room-container {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.grid-room {
    float: left;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.grid-room:before {
    content: "";
    width: 100%;
    height: 100%;
    border: 2px solid var(--default-color);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9;
    opacity: 0;
    transition: .5s ease-out;
}

.grid-room:after {
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.5) 100%);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 8;
}

.room-grid-row {
    float: left;
    width: 100%;
    height: 100%;
}

.grid-room {
    float: left;
    width: 50%;
    height: 50%;
}

.room-image {
    float: left;
    width: 100%;
    height: 100%;
}

.room-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-filter: brightness(100%) contrast(95%) grayscale(10%);
    filter: brightness(100%) contrast(95%) grayscale(10%);
    -o-filter: brightness(100%) contrast(95%) grayscale(10%);
    -ms-filter: brightness(100%) contrast(95%) grayscale(10%);
    -moz-filter: brightness(100%) contrast(95%) grayscale(10%);
    -webkit-filter: brightness(100%) contrast(95%) grayscale(10%);
    transition: transform .5s;
}

.grid-room:hover .room-image img {
    transform: scale(1.1);
}

.room-info {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -webkit-flex-direction: column;
    -moz-box-direction: column;
    -ms-flex-direction: column;
    position: absolute;
    left: 0;
    top: calc(50% - 21px);
    z-index: 10;
    transition: .3s ease-out;
}

.room-info h5 {
    float: left;
    color: #FFFFFF;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 30px;
    margin-bottom: 0px;
}

.room-info p {
    float: left;
    color: #FFFFFF;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 13px;
}

.room-status {
    float: left;
    height: 18px;
    width: 18px;
    border: 1px solid #FF917E;
    background-color: #FF6F54;
    border-radius: 50%;
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.25);
    position: absolute;
    right: 20px;
    top: 20px;
    transition: .3s ease-out;
    z-index: 10;
}

.active .room-status {
    border: 1px solid #26C946;
    background-color: #14B633;
}

.grid-room:hover:before {
    opacity: 1;
}

.grid-room:hover .room-status {
    right: -30px;
}

.grid-room:hover .room-people-list {
    bottom: 20px;
}

.active-button-block {
    float: left;
    position: absolute;
    right: 20px;
    top: -30px;
    z-index: 10;
    transition: .3s ease-out;
}

.active-button {
    float: left;
    width: auto;
    height: 30px;
    padding: 0 15px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 4px;
    background-color: #FF6F54;
    color: #FFFFFF;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 13px;
    display: flex;
    align-items: center;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-align-items: center;
    text-transform: uppercase;
}

.own-created .active-button {
    background-color: #14B633;
}

.grid-room:hover .active-button-block {
    top: 20px;
}

.active-button:before {
    content: "";
    background: var(--sprite-five) no-repeat -3px -3px;
    width: 8px;
    height: 12px;
    display: inline-block;
    margin-right: 10px;
}

.own-created .active-button:before {
    content: none;
}

.active-button-block p {
    float: left;
    margin-left: 13px;
    color: #FFFFFF;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 30px;
}

.room-people-list {
    float: left;
    position: absolute;
    left: 20px;
    bottom: -30px;
    z-index: 10;
    transition: .3s ease-out;
}

.room-people-list li {
    float: left;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #b1becd;
    display: flex;
    align-items: center;
    justify-content: center;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    margin-right: 10px;
    color: #FFFFFF;
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    text-transform: uppercase;
}

.room-people-list li img {
    float: left;
    width: 22px;
    height: 22px;
    object-fit: cover;
    border-radius: 50%;
}

.room-people-list li.other {
    background: transparent;
    border: 0.75px solid #E2E2EA;
    color: #FFFFFF;
    font-size: 9px;
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
}

.in-active .room-people-list li {
    display: none;
}

.in-active .room-people-list li.other {
    display: flex;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
}

.enter-button-block {
    float: left;
    position: absolute;
    right: 20px;
    bottom: -45px;
    z-index: 10;
    display: flex;
    align-items: center;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-align-items: center;
    transition: .3s ease-out;
}

.grid-room:hover .enter-button-block {
    bottom: 20px;
}

.enter-button {
    float: left;
    width: auto;
    height: 35px;
    border-radius: 4px;
    background: #ffffff;
    color: #000000;
    font-size: 11px;
    letter-spacing: 0;
    border: 0;
    padding: 0 18px;
    line-height: 13px;
    text-transform: uppercase;
    position: relative;
    cursor: pointer;
}

.enter-button:after {
    content: "";
    background: var(--sprite-five) no-repeat -95px -4px;
    width: 5px;
    height: 9px;
    display: inline-block;
    transform: rotate(180deg);
    margin-left: 15px;
}

.in-active .enter-button-block {
    display: none;
}

.grid-room.in-active .room-image img {
    filter: brightness(100%) contrast(95%) blur(3px) grayscale(10%);
    -o-filter: brightness(100%) contrast(95%) blur(3px) grayscale(10%);
    -ms-filter: brightness(100%) contrast(95%) blur(3px) grayscale(10%);
    -moz-filter: brightness(100%) contrast(95%) blur(3px) grayscale(10%);
    -webkit-filter: brightness(100%) contrast(95%) blur(3px) grayscale(10%);
}

.grid-room.in-active:nth-child(2n) .room-info {
    bottom: 67px;
}

.grid-room.in-active:nth-child(4n) .room-info {
    bottom: auto;
}

.grid-room.in-active .room-people-list {
    bottom: 20px;
}

.in-active .active-button-block {
    display: none;
}

.grid-room.in-active:hover .room-status {
    right: 20px;
}

.grid-room .webinar-top-area {
    position: absolute;
    min-width: 150px;
    left: 20px;
    top: 20px;
    z-index: 99;
    background: #fff;
    width: auto;
    padding: 10px;
    border-radius: 7px;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .2);
}

.grid-room .webinar-image-content {
    width: 33px;
    height: 33px;
    border: 1px solid #efefef;
    margin-right: 10px;
}

.grid-room .webinar-text-content h5 {
    font-size: 14px;
    color: #444;
    font-weight: 600;
    margin-bottom: 4px;
}

.grid-room .webinar-text-content p {
    font-size: 14px;
    color: var(--default-grey);
    font-weight: 600;
}

.grid-room .webinar-text-content {
    width: auto;
}

.meeting-room-body .task-input-block label {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    margin-bottom: 10px;
}

.task-content-blocks.meeting-room-body {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0 30px 0 20px;
}

/*------ Meeting Room End  ------*/

/*------ Certificate  ------*/

.certificate-container {
    float: left;
    width: 100%;
    height: 100%;
}

.ind-certificate-list {
    float: left;
    width: calc((100% / 4) - 15px);
    height: 330px;
    margin-right: 20px;
    margin-bottom: 20px;
    background: #fff;
    border: 1px solid #e4e5e9;
    border-radius: 5px;
    cursor: pointer;
}

.ind-certificate-list:nth-child(4n) {
    margin-right: 0;
}

.certificate-list-thumb {
    float: left;
    width: 100%;
    height: calc(100% - 55px);
    border-bottom: 1px solid #e4e5e9;
}

.certificate-list-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.certificate-list-details {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.certificate-list-details h5 {
    float: left;
    font-size: 16px;
    font-weight: 600;
}

.ind-certificate-list:hover .certificate-list-details h5 {
    color: var(--default-color);
}

.dynamic-creation .persitant-footer .general-btn {
    padding: 0 15px;
}

.task-tg .certificate-addition .select-box {
    margin: 0;
}

.task-tg .certificate-addition .select-box select {
    padding: 0 40px 0 15px;
    height: 50px;
}

.certificate-addition .browse-btn {
    border: 0;
    background: transparent;
    right: 20px;
    padding: 0;
}

.certificate-addition .browse-btn:hover {
    border: 0;
    background: transparent;
    right: 20px;
    color: var(--default-color);
    padding: 0;
}

.bsy-modal.template-selector .modal-body {
    padding: 0;
}

.certificate-template-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.certificate-template-left {
    float: left;
    width: 205px;
    height: 100%;
    padding: 20px;
}

.certificate-template-left .radio-wrap .radio-block {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.certificate-template-right {
    float: left;
    width: calc(100% - 205px);
    height: 100%;
    overflow-y: auto
}

.certificate-template-right .collection-template-body {
    padding: 20px;
}

.certificate-template-right .each-template-type {
    width: calc((100% / 3) - 14px);
}

.certificate-template-right .each-template-type:nth-child(4n) {
    margin-right: 20px;
}

.certificate-template-right .each-template-type:nth-child(3n) {
    margin-right: 0;
}

.certificate-template-right .each-template-preview {
    background: #fff;
    border-radius: 5px 5px 0 0;
}

.certificate-template-right .each-template-head {
    background: #F7F8F9;
    border-radius: 0 0 5px 5px;
}

.template-selector .modal-lg {
    max-width: 1000px;
}

.certificate-template-image {
    float: left;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.certificate-map-container {
    float: left;
    width: 100%;
    padding: 20px;
}

.certificate-map-container .task-setting-body-left {
    width: 70%;
}

.certificate-map-container .task-setting-body-right {
    width: 30%;
}

.certificate-map-container .task-field-each-right .ind-field-list .counter-field+div {
    padding: 0 !important;
}

.certificate-map-container .task-field-each-right .ind-field-list .field-type-name {
    position: relative;
}

.certificate-map-container .task-field-each-right .ind-field-list .counter-field {
    z-index: 7;
}

.certificate-map-container .task-setting-body-right .field-type-name {
    background: #fff;
}

.map-source {
    float: left;
    display: flex;
}

.map-source .counter-field {
    flex-shrink: 0;
    height: auto;
    min-height: 21px;
}

.cf-template-container {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    overflow-y: auto;
    position: relative;
}

.download-ico:before {
    background-position: -70px -182px;
    width: 14px;
    height: 14px;
    margin-right: 9px;
    position: relative;
    top: 2px;
}

.cf-template-container .download-ico {
    position: fixed;
    right: 40px;
    top: 80px;
    font-family: 'Source Sans Pro';
    padding: 0 20px;
}

/*------ Certificate End  ------*/

/*------ Webinar  ------*/

.tile-entity-description-box.webinar:before {
    content: "";
    background: var(--sprite-two) no-repeat -636px -182px;
    width: 19px;
    height: 19px;
    position: absolute;
    left: 0;
    top: 5px;
}

.tile-options-in .status-tag {
    margin-right: 0;
}

.tile-options-in .status-tag.active {
    background: var(--default-color);
}

.tile-options-in .status-tag.inprogress {
    background: #F8C822;
}

.tile-options-in .status-tag.closed {
    background: #00B35C;
}

.webinar-top-area {
    float: left;
    width: 100%;
}

.webinar-image-content {
    float: left;
    width: 55px;
    height: 55px;
    border-radius: 5px;
    margin-right: 15px;
}

.webinar-image-content img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.webinar-text-content {
    float: left;
    width: calc(100% - 70px);
}

/*------ Webinar End  ------*/

/*------ Settings  ------*/

.filter-right-block.form-detail-top-right {
    padding: 0;
}

.main-panel-holder.has-filter.user-lister-container {
    padding-top: 8px;
}

.count-header {
    float: left;
    line-height: 40px;
    margin-right: 10px;
    font-size: 16px;
    font-weight: 600;
}

.filter-right-block.form-detail-top-right .general-btn {
    box-shadow: none;
}

.task-input-block.filter-width {
    width: 20%;
    margin-left: 10px;
    margin-bottom: 0;
}

.task-input-block.filter-width .form-type-input .form-control {
    height: 40px;
}

.task-input-block.filter-width .rdtOpen .rdtPicker {
    bottom: auto !important;
    top: 38px;
    background: #fff;
}

.general-btn.clear {
    justify-content: center;
    background: #fafafa;
    color: var(--default-grey);
    border-color: #d4d4d4;
}

.general-btn.clear:hover {
    color: var(--default-grey);
}

.password-in:before {
    content: "";
    background: var(--sprite-two) no-repeat -71px -324px;
    width: 11px;
    height: 14px;
    position: absolute;
    left: 0;
    top: calc(50% - 8px);
    zoom: .8;
}

.filter-right-block.form-detail-top-right.align-equal-btn {
    justify-content: flex-end;
}

.user-description .mail-in {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;
}

/*------ Settings End  ------*/

/* Custom Dashboard */

.lg-modal .modal-lg {
    max-width: 100%;
    margin-top: 0;
    margin-bottom: 0;
}

.lg-modal .modal-header {
    position: relative;
}

.canvas.dropzone .lg-modal .modal-body {
    height: calc(100vh - 151px);
    padding: 1rem;
}

.canvas.dropzone .bsy-modal.lg-modal {
    padding: 15px;
}

.body-grey .modal-body {
    background: #ecf0f1;
    overflow-y: auto;
}

.chart-settings-container {
    float: left;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.each-settings-panel-wrap {
    float: left;
    width: calc(50% - 20px);
    margin-right: 20px;
    height: auto;
    padding: 20px;
    background: #fff;
    border-radius: 11px;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
    margin-bottom: 20px;
}

.each-inp-field {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 20px;
}

.each-inp-field:last-child {
    margin-bottom: 0;
}

.each-inp-field label {
    font-size: 14px;
    line-height: 1.3;
    margin-bottom: 5px;
    font-weight: 400;
    color: var(--default-text);
}

.each-inp-field .new-task-input {
    border: 0;
    height: 40px;
}

.each-inp-field .new-task-input input[type="text"],
.each-inp-field .new-task-input input[type="number"] {
    float: left;
    width: 100%;
    height: 40px;
    border-radius: 5px;
    border: 1px solid #e4e6e9;
    font-size: 16px;
    font-weight: 600;
    color: var(--default-text);
    padding: 0 20px;
}

.each-inp-field .new-task-input input[type="text"]::placeholder,
.each-inp-field .new-task-input input[type="number"]::placeholder {
    font-size: 16px;
    font-weight: 400;
}

.chart-settings-container .select-chk-block label {
    font-size: 14px;
    color: var(--default-grey);
    font-weight: 400;
}

.each-settings-panel-wrap.small-wrap {
    width: calc(25% - 20px);
}

.each-settings-panel-wrap.small-wrap .task-input-container.select-line {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.each-settings-panel-wrap.small-wrap .task-input-container.select-line .select-chk-block {
    margin-bottom: 20px;
}

.each-settings-panel-wrap.small-wrap .each-inp-field {
    margin-right: 20px;
    width: calc(50% - 20px);
}

.each-settings-panel-wrap .radio-wrap .radio-block {
    display: flex;
    align-items: center;
}

.each-settings-panel-wrap .radio-wrap .radio-block label {
    font-weight: 400;
}

.each-settings-panel-wrap .task-input-container {
    flex-wrap: wrap;
}

.each-settings-panel-wrap .task-input-container .panel-each {
    float: left;
    width: 100%;
}

.each-settings-panel-header {
    text-align: left;
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 15px;
}

.settings-panel .new-task-input {
    height: auto;
    border: 0;
}

.each-settings-panel-wrap.full-width {
    width: 100%;
}

.stakeholders-header .task-input-block.filter-width {
    width: calc(50% - 5px);
    margin-left: 0;
    margin-right: 10px;
}

.stakeholders-header .task-input-block.filter-width:last-child {
    margin-right: 0;
}

.chart-settings-splitter {
    float: left;
    width: calc(50% - 10px);
    margin-right: 20px;
}

.chart-settings-splitter .each-settings-panel-wrap {
    width: 100%;
    margin-right: 0;
    padding: 0;
}

.chart-settings-splitter:last-child {
    margin-right: 0;
}

.chart-settings-splitter-header {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.chart-settings-splitter-header h5 {
    font-size: 18px;
    font-weight: 600;
    color: #444;
    text-align: left;
}

.chart-settings-splitter .each-settings-panel-wrap.small-wrap {
    width: calc(50% - 20px);
    margin-right: 20px;
}

.chart-settings-splitter .each-settings-panel-wrap.small-wrap:nth-child(2) {
    margin-right: 0;
}

.for-small .select-chk-block {
    margin-bottom: 20px;
}

.for-small .each-settings-panel-wrap .task-input-container {
    flex-direction: column;
    align-items: flex-start;
}

.chart-settings-container.for-small {
    margin-bottom: 20px;
}

.for-small .each-settings-panel-wrap {
    height: 100%;
}

.for-small .each-settings-panel-wrap .each-inp-field {
    width: calc(50% - 10px);
    margin-right: 20px;
}

.for-small .each-settings-panel-wrap .each-inp-field:nth-child(2n) {
    margin-right: 0;
}

.each-settings-panel-wrap-header {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #e4e5e9;
}

.each-settings-panel-wrap-header .each-settings-panel-header {
    margin-bottom: 0;
}

.each-settings-panel-wrap-body {
    float: left;
    width: 100%;
    padding: 20px;
    border-bottom: 1px solid #e4e5e9;
}

.each-settings-panel-subheader {
    float: left;
    width: 100%;
    height: 40px;
    background: rgb(218 218 218 / 0.15);
    border-bottom: 1px solid #e4e5e9;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    color: var(--default-grey);
    background-image: url(images/line-texture.png);
}

.each-settings-panel-subheader h5 {
    float: left;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
}

.each-settings-panel-wrap .task-input-container .panel-each:last-child {
    margin-bottom: 0;
}

.each-inp-field .radio-wrap {
    margin-bottom: 0;
}

.each-settings-panel-wrap-body .each-inp-field {
    margin-bottom: 15px;
}

.each-settings-panel-wrap-body .each-inp-field:last-child {
    margin-bottom: 0;
}

.each-settings-panel-wrap-body:last-child {
    border-bottom: 0;
}

.color-align {
    display: flex;
    align-items: center;
    margin-left: 5px;
    margin-right: 10px;
}

.settings-panel .select-chk-block {
    flex-shrink: 0;
}

.each-settings-panel-wrap-body .settings-panel {
    align-items: center;
}

.each-settings-panel-wrap-body .each-inp-field.eq-width-line {
    width: calc(50% - 10px);
    margin-right: 20px;
    margin-bottom: 0;
}

.each-settings-panel-wrap-body .each-inp-field.eq-width-line:nth-child(2n) {
    margin-right: 0;
}

.panel-each .select-box:after {
    right: 5px;
}

.each-settings-panel-wrap-body .settings-panel .each-inp-field {
    margin-bottom: 0;
    margin-right: 10px;
}

.select-box.v-left-zero {
    margin-left: 0;
}

.ibt-body.db-full.dynamic-dashboard.no-header.dashboard-height {
    height: calc(100% - 60px);
}

/* Custom Dashboard End */

/* Multi Page Form */

.multiple-form-container {
    float: left;
    width: 100%;
    padding: 20px;
}

.multiple-form-container .each-form-container {
    float: left;
    width: calc((100% / 3) - 14px);
    margin-right: 20px;
    margin-bottom: 20px;
    background: #fff;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
    border-radius: 8px;
    height: 600px;
    overflow: hidden;
}

.multiple-form-container .each-form-container:nth-child(3n) {
    margin-right: 0;
}

.multiple-form-container .each-form-header {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 2px solid #568ba2 !important;
    padding: 0 20px;
    display: flex;
    align-items: center;
}

.multiple-form-container .each-form-header h5 {
    color: #568ba2;
    font-size: 16px;
    font-weight: 600;
}

.multiple-form-container .each-form-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    padding: 20px;
    overflow-y: auto;
}

.multiple-form-container .each-field {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.multiple-form-container .each-field label {
    float: left;
    width: 100%;
    font-size: 14px;
    margin-bottom: 8px;
}

.multiple-form-container .inputblock input {
    float: left;
    width: 100%;
    border: 1px solid #e4e6e9;
    border-radius: 5px;
    background-color: #fff !important;
    height: 40px;
    padding: 0 15px;
    font-size: 14px;
}

.multiple-form-container .each-field .control.control-checkbox {
    font-size: 14px;
}

.multiple-form-container .each-field .input-select:after {
    content: none;
}

.multiple-form-container .each-field .select-box select {
    border: 1px solid #e4e5e9;
    height: 40px;
}

.multiple-form-container .date-field {
    float: left;
    width: 100%;
    position: relative;
}

.multiple-form-container .date-field:before {
    content: "";
    background: url(../images/sprite.svg) no-repeat -375px -159px;
    width: 14px;
    height: 14px;
    position: absolute;
    right: 20px;
    top: 14px;
}

.multiple-form-container .inputblock textarea {
    float: left;
    width: 100%;
    height: 120px;
    border: 1px solid #e4e6e9;
    resize: none;
    border-radius: 5px;
    padding: 20px;
}

.template-cortiza .ind-form-field .signature-canvas {
    display: flex;
    justify-content: stretch;
}

.template-cortiza .signature-left {
    width: 100%;
    margin-right: 20px;
}

.template-cortiza .sig-preview {
    width: calc(50% - 20px);
    height: 148px;
    margin-top: 23px;
}

.template-cortiza .ind-form-field .signature-canvas canvas {
    width: 100% !important;
}

/* Multi Page Form End */

/* Batch */

.task-tg .system-task-holder .task-inp-container.right-most .ind-task-input {
    padding-right: 20px;
}

.task-tg .system-task-holder .task-inp-container.right-most .ind-task-input .lb-tx {
    flex-shrink: 0;
}

.date-wrapper.date-same-line.eq-date {
    width: 50%;
    border-bottom: 0;
}

.split-case {
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.split-case span {
    font-size: 12px;
    color: var(--default-grey);
}

.button-area-block {
    float: right;
    margin: 10px 0;
    padding: 0 20px;
}

.button-area-block a {
    font-size: 14px;
    color: var(--default-color) !important;
    font-weight: 600;
}

.task-tg .system-task-holder-body .new-task-input.text-input.medium-size {
    height: 165px;
}

.mang-lbl-block-mod-in.res-form-mod .section-info {
    width: 64%;
    min-width: 64%;
}

/* Batch End */

/* Whatsapp module */

.whatsapp-container {
    float: left;
    width: 100%;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
}

.whatsapp-top {
    float: left;
    width: 100%;
    height: 127px;
    background-color: var(--default-color);
    position: relative;
}

.whatsapp-top:before {
    content: "";
    width: 100%;
    height: 127px;
    background: var(--brand-pattern) no-repeat center;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
}

.whatsapp-bottom {
    float: left;
    width: 100%;
    height: 100%;
    background: #D9DCD6;
}

.whatsapp-main-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 1px 0px, rgba(0, 0, 0, 0.2) 0px 2px 5px 0px;
    background: #fff;
    position: relative;
    top: 0px;
}

.whatsapp-bottom>.container {
    max-width: 90%;
    width: 100%;
    position: relative;
}

.whatsapp-inside-container {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-content: stretch;
}

.aside-menu {
    float: left;
    width: 418px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    border-right: 1px solid #DADADA;
    flex-shrink: 0;
}

.aside-menu-header {
    float: left;
    width: 100%;
    height: 60px;
    background: #EDEDED;
    padding: 10px 16px;
    transition: box-shadow .18s ease-out, background-color .25s ease-out;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.aside-menu-search-box {
    float: left;
    width: 100%;
    height: 50px;
    background: #f6f6f6;
    transition: box-shadow .18s ease-out, background-color .25s ease-out;
    flex-shrink: 0;
    padding: 8px 16px;
}

.aside-chat-menu {
    float: left;
    width: 100%;
    height: 100%;
    transition: box-shadow .18s ease-out, background-color .25s ease-out;
}

.main-whatsapp-body {
    float: left;
    width: 100%;
    height: 100%;
    background: #e5ddd5;
    display: flex;
    align-items: center;
    justify-content: stretch;
}

.whatsapp-chat-body {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-self: stretch;
    position: relative;
}

.whatsapp-other-info {
    float: left;
    width: 419px;
    height: 100%;
    border-left: 1px solid #DADADA;
    flex-shrink: 0;
    background: #EDEDED;
}

.whatsapp-chat-header {
    float: left;
    width: 100%;
    height: 60px;
    background: #EDEDED;
    border-bottom: 1px solid #DADADA;
    z-index: 1;
    flex-shrink: 0;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.whatsapp-chat-texture {
    float: left;
    width: 100%;
    height: 100%;
    background: url(images/wa-bg.png);
    opacity: 0.06;
    position: absolute;
    left: 0;
    top: 0;
}

.whatsapp-chat-content-body {
    float: left;
    width: 100%;
    height: 100%;
}

.user-chat-thumb {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.user-chat-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.aside-menu-header-right {
    float: left;
    width: 80%;
    display: flex;
    justify-content: flex-end;
}

.aside-menu-header-right button {
    float: left;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .1s ease;
    margin-left: 10px;
}

.aside-menu-header-right button:focus {
    background-color: rgb(145 145 145 / 0.2);
}

.option-tog:before {
    background-position: -7px -113px;
    width: 4px;
    height: 18px;
}

.new-chat:before {
    background-position: -748px -184px;
    width: 18px;
    height: 18px;
}

.new-group:before {
    background-position: -841px -185px;
    width: 22px;
    height: 13px;
}

.aside-option-block {
    float: left;
    position: relative;
}

.aside-option-menu {
    float: left;
    width: 173px;
    padding: 9px 0;
    background: #FFFFFF;
    border-radius: 3px;
    box-shadow: rgba(0, 0, 0, 0.26) 0px 2px 5px 0px, rgba(0, 0, 0, 0.16) 0px 2px 10px 0px;
    position: absolute;
    right: 0;
    top: 44px;
    z-index: 1;
}

.aside-option-menu li {
    float: left;
    width: 100%;
    height: 40px;
}

.aside-option-menu li nav {
    font-size: 14.5px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    line-height: 40px;
    cursor: pointer;
    color: var(--default-text);
}

.aside-option-menu li nav:hover {
    background: #f5f5f5;
}

.chat-search-box {
    float: left;
    width: 100%;
    height: 35px;
    border-radius: 18px;
    position: relative;
}

.chat-search-box input {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 18px;
    padding-right: 32px;
    padding-left: 65px;
    font-size: 14px;
    line-height: 20px;
}

.search-chat-ico {
    float: left;
    width: 24px;
    height: 24px;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: absolute;
    left: 12px;
    top: 5px;
}

.search-chat-ico:before {
    background-position: -402px -70px;
    width: 14px;
    height: 14px;
}

.search-chat-ico.active:before {
    background-position: -58px -157px;
    width: 15px;
    height: 15px;
}

.chat-menu-holder {
    float: left;
    width: 100%;
    height: 100%;
}

.each-chat-list {
    float: left;
    width: 100%;
    height: 72px;
    padding: 0 0 0 15px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.each-chat-list:hover {
    background: #f5f5f5;
}

.each-chat-list.active {
    background: #ebebeb;
}

.chat-list-thumb {
    float: left;
    width: 49px;
    height: 49px;
    border-radius: 50%;
    margin-right: 13px;
}

.chat-list-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.chat-list-details {
    float: left;
    width: calc(100% - 62px);
    height: 100%;
    border-bottom: 1px solid#f2f2f2;
    padding: 0 75px 0 0;
    display: flex;
    align-items: center;
    position: relative;
}

.each-chat-list:last-child .chat-list-details {
    border-bottom: 0;
}

.chat-list-recent-box {
    float: left;
    width: 100%;
}

.chat-list-recent-box h5 {
    float: left;
    width: 100%;
    font-weight: 400;
    font-size: 17px;
    line-height: 21px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 256px;
}

.chat-list-recent-box p {
    float: left;
    width: 100%;
    font-size: 13px;
    line-height: 20px;
    min-height: 20px;
    margin-top: 2px;
    color: #969995;
}

.recent-chat-time {
    float: left;
    font-size: 12px;
    line-height: 21px;
    color: rgb(0 0 0 / 45%);
    position: absolute;
    right: 15px;
    top: 15px;
}

.unread .chat-list-recent-box h5 {
    font-weight: 600;
}

.unread .chat-list-recent-box p {
    color: #212529;
    font-weight: 600;
}

.bubble-count {
    float: left;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: #36b449;
    border-radius: 1.1em;
    font-size: 12px;
    line-height: 1em;
    color: #FFF;
    display: none;
}

.unread .bubble-count {
    display: flex;
}

.recent-box-menu .aside-option-block {
    display: none;
}

.chat-mute-ico {
    float: left;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chat-mute-ico:before {
    background-position: -724px -183px;
    width: 18px;
    height: 18px;
    zoom: .8;
    opacity: .5;
}

.recent-box-menu .aside-option-block button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.more-option-tog:before {
    background-position: -288px -67px;
    width: 12px;
    height: 8px;
}

.recent-box-menu .aside-option-menu {
    right: 3px;
    top: 25px;
}

.chat-notf-down {
    float: left;
    width: 100%;
    height: 20px;
    margin-top: 2px;
    display: flex;
    justify-content: flex-end;
}

.recent-box-menu {
    float: left;
    width: 75px;
    height: 100%;
    padding-top: 35px;
    padding-right: 15px;
    position: absolute;
    right: 0;
    top: 0;
}

.each-chat-list:hover .recent-box-menu .aside-option-block {
    display: flex;
}

.whatsapp-chat-header-left {
    float: left;
    width: 80%;
    display: flex;
    align-items: center;
}

.whatsapp-chat-header-left .user-chat-thumb {
    margin-right: 15px;
}

.whatsapp-chat-header-left .user-chat-name {
    float: left;
    width: calc(100% - 55px);
}

.user-chat-name h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    line-height: 21px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.user-chat-name p {
    float: left;
    width: 100%;
    min-height: 19px;
    color: #969995;
    font-size: 13px;
    line-height: 19px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.whatsapp-chat-inner-body {
    float: left;
    width: 100%;
    height: calc(100% - 62px);
}

.whatsapp-chat-footer {
    float: left;
    width: 100%;
    height: 62px;
    background: #f0f0f0;
    position: relative;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.chat-input-area {
    float: left;
    width: 100%;
    height: 42px;
    padding-right: 44px;
    position: relative;
}

.chat-input-area input {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    padding: 9px 12px 11px;
    border-radius: 21px;
    font-size: 15px;
    font-weight: 400;
    position: relative;
}

.text-chat-submit {
    float: left;
    width: 40px;
    height: 42px;
    background: transparent;
    border: 0;
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
}

.text-chat-submit:before {
    background-position: -293px -117px;
    width: 19px;
    height: 15px;
    zoom: 1.4;
}

.whatsapp-chat-header-right button {
    float: left;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .1s ease;
    margin-left: 10px;
}

.whatsapp-chat-header-right button:focus {
    background-color: rgb(145 145 145 / 0.2);
}

.search-header:before {
    background-position: -163px -249px;
    width: 14px;
    height: 14px;
    zoom: 1.3;
}

.whatsapp-chat-inner-body .container {
    max-width: 810px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.int-layer {
    flex: 1 1 auto;
    min-height: 12px;
}

.chat-inner-wrap {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.ind-com-each {
    float: left;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 12px;
    padding-right: 9%;
    padding-left: 9%;
}

.ind-com-each.message-out {
    align-items: flex-end;
}

.ind-com-list {
    float: left;
    width: auto;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px 0px;
    border-radius: 0 7.5px 7.5px 7.5px;
    padding: 6px 7px 8px 9px;
    position: relative;
    display: flex;
    flex-direction: column;
}

.each-chat-list-header {
    float: left;
    width: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.each-chat-list-header h5 {
    float: left;
    color: var(--default-color);
    font-weight: 600;
    font-size: 12.8px;
    line-height: 22px;
}

.each-chat-list-content {
    float: left;
    width: auto;
    margin-right: 60px;
    margin-bottom: 0px;
}

.each-chat-list-content p {
    float: left;
    width: 100%;
    word-break: break-word;
    font-size: 14.2px;
    line-height: 19px;
}

.each-chat-list-info {
    float: left;
    width: auto;
    display: flex;
    justify-content: flex-end;
    position: absolute;
    right: 8px;
    bottom: 4px;
}

.each-chat-list-info p {
    float: left;
    font-size: 11px;
    line-height: 15px;
    color: #969995;
}

.chat-pointer {
    position: absolute;
    left: -8px;
    top: -4px;
    color: #FFFFFF;
}

.message-out .ind-com-list {
    background: #DCF8C6;
    border-radius: 7.5px 0 7.5px 7.5px;
}

.message-out .chat-pointer {
    color: #DCF8C6;
    left: auto;
    right: -8px;
    transform: rotate(0);
    -moz-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

.chat-decor-area {
    float: left;
    width: 10%;
}

.chat-decor-area button {
    float: left;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 50%;
    transition: background-color .1s ease;
    margin-right: 4px;
    font-size: 22px;
}

.chat-decor-area button:last-child {
    margin-right: 0;
}

.chat-decor-area button:focus {
    background-color: rgb(145 145 145 / 0.2);
}

.smiley:before {
    background-position: -771px -181px;
    width: 20px;
    height: 20px;
}

.chat-attach:before {
    background-position: -795px -182px;
    width: 20px;
    height: 19px;
    zoom: 1;
}

.chat-reply-box {
    float: left;
    width: 100%;
    padding: 4px 12px 8px 12px;
    margin: 5px 0;
    background: #f0f0f0;
    border-radius: 7.5px;
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
}

.chat-reply-box:before {
    content: "";
    width: 4px;
    height: 100%;
    background: #6bcbef !important;
    position: absolute;
    left: 0;
    top: 0;
}

.each-chat-list-header .aside-option-block button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
}

.chat-reply-box .each-chat-list-content p {
    color: #969995;
}

.each-chat-list-header .aside-option-block .aside-option-menu {
    top: 20px;
}

.ind-com-list:hover .each-chat-list-header .aside-option-block button {
    display: flex;
}

.right-content-wrapper .whatsapp-container {
    position: relative;
}

.chat-separator {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chat-day-sep {
    float: left;
    padding: 5px 12px 6px;
    text-align: center;
    text-shadow: rgba(255, 255, 255, 0.4) 0px 1px 0px;
    background-color: rgb(225 245 254 / 92%);
    border-radius: 7.5px;
    box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 0.5px 0px;
    font-size: 12.5px;
    line-height: 21px;
    text-transform: uppercase;
}

.chat-settings-panel {
    float: left;
    width: 418px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #ffffff;
    border-right: 1px solid #DADADA;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    z-index: 10 !important;
}

.chat-panel-header {
    float: left;
    width: 100%;
    height: 87px;
    background: var(--default-color);
    padding: 0 20px 20px 20px;
    display: flex;
    flex-direction: column-reverse;
    align-items: self-start;
    flex-shrink: 0;
}

.back-nav {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    font-size: 20px;
    font-weight: 600;
    color: #FFFFFF;
}

.back-nav:before {
    background-position: -885px -183px;
    width: 16px;
    height: 16px;
    margin-right: 15px;
}

.chat-panel-body {
    float: left;
    width: 100%;
    height: calc(100% - 192px);
    padding: 20px;
}

.chat-panel-body .new-task-input {
    margin-bottom: 10px;
}

.chat-complete .ind-task-input {
    padding-left: 0;
}

.chat-panel-bottom {
    float: left;
    width: 100%;
    height: 105px;
    background: #EDEDED;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.round-submit-btn {
    float: left;
    width: 46px;
    height: 46px;
    border: 0;
    padding: 0;
    line-height: 0;
    border-radius: 50%;
    background: var(--default-color);
    box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 3px 0px;
}

.round-add-btn {
    float: left;
    width: 46px;
    height: 46px;
    border: 0;
    padding: 0;
    line-height: 0;
    border-radius: 50%;
    background: var(--default-color);
    box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 3px 0px;
}

.round-submit-btn:before {
    background-position: -885px -183px;
    width: 16px;
    height: 16px;
    transform: rotate(180deg);
}

.round-add-btn:before {
    background-position: -4px -59px;
    width: 25px;
    height: 25px;
    zoom: .8;
}

.chat-panel-body .new-task-input.fields .task-inp-container {
    margin-bottom: 0;
}

.chat-panel-body .new-task-input .task-input-box--new {
    height: 50px;
    border-bottom: 1px solid #eceff1;
}

.new-task-input.fields>label {
    font-size: 12px;
    text-transform: uppercase;
    color: var(--default-grey);
    margin-bottom: 5px;
}

.new-task-input.fields {
    border-bottom: 0;
    height: auto;
}

.fields .select-box select {
    border-radius: 0;
    border: 0;
    border-bottom: 1px solid #eceff1;
    padding: 0;
    height: 50px;
}

.fields .select-box:after {
    right: 0;
}

.new-task-input.fields .select-chk-block label {
    font-size: 15px;
    color: var(--default-grey);
}

.error-fdls {
    float: left;
    width: 100%;
    margin-top: 5px;
    font-size: 12px;
    color: #e14745;
}

.success-fdls {
    float: left;
    width: 100%;
    margin-top: 5px;
    font-size: 12px;
    color: #0f9d58;
}

.whatsapp-other-info .container {
    max-width: 100%;
    padding: 0;
}

.whatsapp-other-info .container .floating-summary {
    margin-bottom: 0;
    border-radius: 0;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid #ededed;
    padding: 0;
}

.whatsapp-other-info .container .floating-summary:last-child {
    border-bottom: 0;
}

.whatsapp-other-info .container .floating-summary .accordion-header {
    float: left;
    width: 100%;
    height: 65px;
    display: flex;
    align-items: center;
}

.whatsapp-other-info .container .accordion-body {
    float: left;
    width: 100%;
    padding: 20px;
}

.whatsapp-other-info .container .floating-summary .accordion-header h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    line-height: 65px;
    color: var(--default-text);
    padding: 0 40px 0 20px;
    cursor: pointer;
}

.whatsapp-other-info .container .floating-summary .accordion-header:before {
    content: "";
    background: var(--sprite-two) no-repeat -288px -67px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 20px;
    top: 32px;
    transform: rotate(-90deg);
    transition: .3s ease-out;
}

.whatsapp-other-info .container .floating-summary .accordion-header.active:before {
    transform: rotate(0deg);
}

.ind-com-list .aside-option-block {
    display: none;
}

.whatsapp-other-info .container .floating-summary .accordion-header.active h5 {
    color: #3fa9f7;
}

.chat-channel-box .select-box:after {
    background: var(--sprite-two) no-repeat -288px -67px;
    width: 12px;
    height: 8px;
}

.chat-channel-box {
    float: left;
    width: 100%;
    height: 60px;
    background: #f6f6f6;
}

.channel-drop {
    float: left;
    width: 100%;
    height: 60px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    font-weight: 600;
    color: var(--default-grey);
}

.chat-channel-box .dropdown-menu {
    top: 58px;
    float: left;
    width: calc(100% - 30px);
    left: 15px;
    border: 0;
    padding: 9px 0;
    background: #FFFFFF;
    border-radius: 3px;
    box-shadow: rgba(0, 0, 0, 0.26) 0px 2px 5px 0px, rgba(0, 0, 0, 0.16) 0px 2px 10px 0px;
}

.chat-channel-box .dropdown-toggle::after {
    position: absolute;
    right: 20px;
    color: var(--default-grey);
}

.chat-channel-box .dropdown-menu li nav {
    float: left;
    width: 100%;
    padding: 0 20px;
    font-size: 14.5px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    line-height: 40px;
    cursor: pointer;
    color: var(--default-text);
}

.chat-channel-box .dropdown-menu li nav:hover,
.chat-channel-box .dropdown-menu li nav.active {
    background: #f5f5f5;
}

.chat-panel-body.channel-listing {
    padding: 0;
    height: 100%;
}

.edit-chat-button {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    display: none;
}

.edit-chat-button:before {
    background-position: -312px -245px;
    width: 15px;
    height: 15px;
    zoom: .8;
}

.each-chat-list:hover .edit-chat-button {
    display: block;
}

.channel-listing .chat-list-details {
    width: 100%;
}

.wa-container {
    float: left;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
}

.wa-left {
    float: left;
    width: 275px;
    height: 100%;
    background: var(--theme-second);
}

.wa-panel-header {
    float: left;
    width: 100%;
    height: 60px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.wa-panel-header h1 {
    font-size: 19px;
    text-transform: uppercase;
    color: var(--page-head);
    font-weight: 100;
    cursor: pointer;
    /* text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.50); */
}

.chat-filter-ico {
    background: transparent;
    padding: 0;
    border: 0;
    line-height: 0;
}

.chat-filter-ico:before {
    background-position: -40px -35px;
    width: 16px;
    height: 16px;
}

.wa-panel-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.wa-chat-tab-container {
    float: left;
    width: 100%;
    height: 100%;
}

.wa-chat-tab {
    float: left;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid rgb(255 255 255 / 0.10);
    display: flex;
    justify-content: space-around;
    padding-top: 10px;
}

.wa-chat-tab nav {
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sub-category-head);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    position: relative;
    cursor: pointer;
}

.wa-chat-tab nav.active {
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
}

.wa-chat-tab nav.active:before {
    content: "";
    width: 100%;
    height: 2px;
    background: var(--sub-category-active);
    position: absolute;
    left: 0;
    bottom: -1px;
}

.wa-chat-tab-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.wa-accordion-panel {
    float: left;
    width: 100%;
    height: 100%;
}

.wa-each-accord {
    float: left;
    width: 100%;
    border-bottom: 1px solid rgb(255 255 255 / 0.10);
}

.wa-accord-header {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 23px 0 33px;
    position: relative;
    cursor: pointer;
    transition: .3s ease-out;
}

.wa-accord-header.active {
    height: 45px;
}

.wa-accord-header h5 {
    float: left;
    color: var(--category-head);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    /* text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2); */
}

.wa-accord-header.active h5 {
    color: var(--sub-category-head);
}

.wa-accord-header:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 4px;
    border-color: transparent transparent transparent var(--chat-arrow);
    position: absolute;
    right: 23px;
    top: calc(50% - 4px);
    transition: .3s ease-out;
}

.wa-accord-header.active:after {
    transform: rotate(90deg);
}

.wa-accord-body {
    float: left;
    width: 100%;
}

.wa-chat-list {
    float: left;
    width: 100%;
}

.wa-each-chat {
    float: left;
    width: 100%;
    height: 65px;
    padding-bottom: 13px;
    position: relative;
    padding: 13px 23px 13px 33px;
    cursor: pointer;
    transition: .3s ease-out;
}

.wa-each-chat:after {
    content: "";
    width: calc(100% - 33px);
    height: 1px;
    background: rgb(255 255 255 / .03);
    position: absolute;
    left: 33px;
    bottom: 0;
}

.wa-each-chat:hover,
.wa-each-chat.active {
    background: var(--sidemenu-right-active);
}

.wa-each-chat:last-child:after {
    content: none;
}

.wa-chat-thumb {
    float: left;
    width: 37px;
    height: 37px;
    border-radius: 50%;
}

.wa-chat-thumb img {
    float: left;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    object-fit: cover;
}

.wa-chat-details {
    float: left;
    width: calc(100% - 37px);
    padding-left: 15px;
    padding-right: 65px;
}

.wa-chat-details h5 {
    float: left;
    width: 100%;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 18px;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.wa-chat-details p {
    float: left;
    width: 100%;
    color: var(--sub-category-head);
    font-size: 11px;
    letter-spacing: 0;
    line-height: 15px;
}

.wa-chat-extra {
    float: left;
    width: 65px;
    position: absolute;
    right: 23px;
    bottom: 15px;
    padding-top: 22px;
}

.wa-chat-time {
    float: left;
    width: 100%;
    color: var(--sub-category-head);
    font-size: 11px;
    letter-spacing: 0;
    line-height: 15px;
    text-align: right;
}

.wa-right {
    float: left;
    width: calc(100% - 275px);
    height: 100%;
    display: flex;
    align-items: stretch;
}

.wa-chat-main {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
}

.wa-chat-main-right {
    float: left;
    width: 370px;
    height: 100%;
    flex-shrink: 0;
    border-left: 1px solid #DEE0E3;
}

.wa-chat-main-header {
    float: left;
    width: 100%;
    height: 70px;
    border-bottom: 1px solid #DEE0E3;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.wa-chat-user {
    float: left;
    width: 40%;
}

.wa-chat-user-det {
    float: left;
    width: calc(100% - 37px);
    padding-left: 13px;
}

.wa-chat-user-det h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 18px;
    margin-bottom: 2px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.wa-chat-user-det p {
    float: left;
    width: 100%;
    color: #9698A1;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 15px;
}

.wa-chat-search {
    float: left;
    width: 30%;
    position: relative;
}

.wa-chat-search input {
    float: left;
    width: 100%;
    height: 40px;
    padding: 0 20px 0 40px;
    border: 0;
    font-size: 13px;
    letter-spacing: 0;
    line-height: 17px;
}

.wa-chat-search:before {
    content: "";
    background: var(--sprite-two) no-repeat -309px -90px;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 13px;
    top: calc(50% - 8px);
}

.wa-chat-main-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    padding-bottom: 90px;
}

.wa-chat-main-footer {
    float: left;
    width: 100%;
    height: 90px;
    padding: 20px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.wa-chat-submit-area {
    float: left;
    width: 100%;
    height: 50px;
    border: 1px solid #DEE0E3;
    border-radius: 5px;
    position: relative;
}

.wa-chat-submit-area input {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    font-size: 14px;
    padding: 0 60px 0 20px;
    border-radius: 5px;
}

.wa-chat-submit {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
}

.wa-chat-submit:before {
    content: "";
    background: var(--sprite-two) no-repeat -293px -117px;
    width: 19px;
    height: 15px;
    position: absolute;
    right: 20px;
    top: calc(50% - 7.5px);
}

.wa-payment-wrap .ind-panel-options.single-row .radio-wrap {
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 0;
}

.wa-payment-wrap .ind-panel-options.single-row .radio-wrap .radio-block {
    margin-bottom: 5px;
}

.wa-payment-wrap .ind-panel-options.single-row .select-box select {
    border: 1px solid #e3e5e8;
    padding: 0 32.5px 0 20px;
    border-radius: 5px;
}

.copy-text {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    margin-top: 10px;
    font-size: 14px;
    color: var(--default-grey);
}

.pay-button-block {
    float: left;
    width: 100%;
}

.pay-button-block button {
    box-shadow: none;
    float: left;
    margin-right: 15px;
}

.wa-int-layer {
    flex: 1 1 auto;
    min-height: 12px;
}

.wa-ind-com-each {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 12px;
    padding-right: 20px;
    padding-left: 20px;
    transition: .3s ease-out;
}

.chat-selection-container {
    max-width: calc(65% + 70px);
}

.wa-ind-com-list {
    float: left;
    width: auto;
    background: #fff;
    box-shadow: 0 1px 1px 0 rgba(164, 152, 135, 0.32);
    border-radius: 0 7.5px 7.5px 7.5px;
    padding: 6px 50px 8px 9px;
    position: relative;
    display: flex;
    flex-direction: column;
}

.wa-chat-pointer {
    position: absolute;
    left: -8px;
    top: -4px;
    color: #fff;
}

.wa-each-chat-list-header {
    float: left;
    width: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.wa-each-chat-list-header h5 {
    float: left;
    color: var(--default-color);
    font-weight: 600;
    font-size: 12.8px;
    line-height: 22px;
}

.wa-each-chat-list-content {
    float: left;
    width: auto;
    margin-right: 60px;
    margin-bottom: 0;
}

.wa-each-chat-list-content p {
    float: left;
    width: 100%;
    word-break: break-word;
    font-size: 14px;
    line-height: 18px;
}

.wa-each-chat-list-info {
    float: left;
    width: auto;
    display: flex;
    justify-content: flex-end;
    position: absolute;
    right: 8px;
    bottom: 4px;
}

.wa-each-chat-list-info p {
    float: left;
    font-size: 11px;
    line-height: 16px;
    color: rgba(0, 0, 0, 0.54);
}

.wa-ind-com-each.message-out {
    align-items: flex-end;
}

.message-out .wa-ind-com-list {
    background: #DCF8C6;
    border-radius: 3px 0 3px 3px;
    padding-top: 12px;
}

.message-out .wa-chat-pointer {
    color: #DCF8C6;
    left: auto;
    right: -8px;
    transform: rotate(0);
    -moz-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

.wa-aside-option-block {
    float: left;
    position: relative;
}

.wa-more-option-tog:before {
    background-position: -288px -67px;
    width: 12px;
    height: 8px;
}

.wa-aside-option-menu {
    float: left;
    padding: 9px 0;
    width: 175px;
    border-radius: 10px;
    background: #FFFFFF;
    box-shadow: 0 2px 6px 4px rgba(0, 0, 0, 0.1);
    position: absolute;
    right: 0;
    top: 44px;
    z-index: 1;
}

.wa-aside-option-menu li {
    float: left;
    width: 100%;
    height: 40px;
}

.wa-aside-option-menu li nav {
    font-size: 16px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    line-height: 45px;
    cursor: pointer;
    color: var(--default-text);
}

.wa-aside-option-menu li nav:hover {
    background: var(--default-color);
    color: #fff;
}

.wa-more-option-tog {
    background: transparent;
    padding: 0;
    line-height: 0;
    border: 0;
    padding: 3px;
    display: none;
}

.wa-more-option-tog.active {
    display: block;
}

.wa-ind-com-list:hover .wa-more-option-tog {
    display: block;
}

.wa-ind-com-list .wa-aside-option-block {
    position: absolute;
    right: 10px;
    top: 10px;
}

.wa-ind-com-list .wa-aside-option-menu {
    right: -160px;
    top: 18px;
}

.message-out .wa-ind-com-list .wa-aside-option-menu {
    right: 0;
}

.message-out .wa-ind-com-list .wa-aside-option-block {
    top: 7px;
}

.wa-ind-com-each:last-child .wa-ind-com-list .wa-aside-option-menu {
    top: auto;
    bottom: 0;
    right: -178px;
}

.wa-ind-com-each.message-out:last-child .wa-ind-com-list .wa-aside-option-menu {
    right: 20px;
}

.take-btn {
    background: var(--inside-active);
    color: var(--inside-active-color);
    border: 0;
    padding: 0;
    font-size: 11px;
    text-transform: uppercase;
    padding: 3px 6px;
    border-radius: 5px;
    float: right;
    margin-bottom: 3px;
}

.wa-blank-chat {
    float: left;
    width: 100%;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(255 255 255 / 25%);
    font-size: 13px;
    font-weight: 300;
}

.wa-chat-option {
    position: relative;
    right: -4px;
}

.wa-chat-option .opt-form-ico {
    position: relative;
    top: 0;
    right: 0;
}

.wa-chat-option .panel-option {
    right: -10px;
}

.wa-chat-option .panel-option li .panel-option-click {
    padding-left: 15px;
}

.chat-task-section {
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: absolute;
    left: 0px;
    top: 0;
    width: 100%;
    height: 100%;
    background: var(--default-color);
    color: var(--white);
    border-radius: 4px;
    z-index: 1;
}

.chat-task-section:before {
    background-position: -50px -182px;
    width: 14px;
    height: 14px;
    margin-right: 10px;
}

.chat-selection .wa-ind-com-each {
    padding-left: 70px;
    position: relative;
}

.chat-selection .wa-ind-com-each>.select-chk-block .control-indicator {
    width: 20px;
    height: 20px;
    top: 0;
    border-radius: 4px;
    background: transparent;
    border: 2px solid #b6c5ca;
}

.chat-selection .wa-ind-com-each>.select-chk-block .control .inp-chk {
    width: 20px;
    height: 20px;
}

.chat-selection .wa-ind-com-each>.select-chk-block .control {
    width: 20px;
    height: 20px;
    padding: 0;
}

.chat-selection .wa-ind-com-each>.select-chk-block .control-checkbox .control-indicator:after {
    zoom: 1.3;
}

.chat-selection .wa-ind-com-each>.select-chk-block {
    position: absolute;
    left: 20px;
    top: calc(50% - 10px);
    display: block;
}

.chat-selection .wa-ind-com-each>.select-chk-block .control .inp-chk:checked~.control-indicator,
.chat-selection .wa-ind-com-each>.select-chk-block .control .inp-chk.active+.control-indicator {
    background: var(--default-color);
    border-color: var(--default-color);
}

.wa-ind-com-each.selected {
    background: rgb(204 204 204 / 37%);
}

.placeholder-div {
    float: left;
    width: 100%;
    height: 100%;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.placeholder-div h5 {
    font-size: 20px;
    font-weight: 300;
    margin-bottom: 15px;
    color: var(--default-grey);
}

.placeholder-div .general-btn {
    height: 35px;
    padding: 0 15px;
    min-width: auto;
}

.wa-chat-inner-wrap .ind-com-each .chat-day-sep {
    background-color: #D1DADC;
    box-shadow: 0 1px 1px 0 rgba(164, 152, 135, 0.32), 0 0 1px 0 #A8AADF;
}

.wa-ind-com-list.active .wa-aside-option-block .wa-more-option-tog {
    display: block;
}

.wa-chat-option .opt-form-ico:before {
    background-position: -220px -361px;
    width: 16px;
    height: 4px;
}

.wa-chat-main-right-header {
    float: left;
    width: 100%;
    padding: 30px 20px;
    border-bottom: 1px solid #DEE0E3;
}

.wa-chat-main-right-header .select-box select {
    border-radius: 3px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
}

.wa-chat-main-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 101px);
    padding-bottom: 100px;
}

.profile-entry-data {
    float: left;
    width: 100%;
    background: var(--white);
    border-bottom: 1px solid #DEE0E3;
    margin-bottom: 20px;
}

.profile-entry-header {
    float: left;
    width: 100%;
    padding: 0 20px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.profile-entry-header h5 {
    color: var(--default-color);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
}

.profile-entry-body {
    float: left;
    width: 100%;
    padding: 0 20px 20px;
}

.each-details-entry {
    float: left;
    width: 100%;
    height: 35px;
    margin-bottom: 10px;
    border: .5px solid #979797;
    border-radius: 3px;
    display: flex;
    align-items: center;
}

.details-entry-left {
    float: left;
    flex-shrink: 0;
    width: 130px;
    padding: 0 18px;
}

.details-entry-right {
    float: left;
    width: calc(100% - 125px);
    height: 100%;
    border-left: .5px solid #979797;
}

.details-entry-right input {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 0 25px 25px 0;
    border: 0;
    padding: 0 24px 0 18px;
    font-size: 14px;
}

.details-entry-left label {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 23px;
}

.each-setting-entry {
    float: left;
    width: 100%;
    background: var(--white);
    padding: 20px;
    border-top: 1px solid #DEE0E3;
    border-bottom: 1px solid #DEE0E3;
    background-color: #FFFFFF;
    margin-bottom: 20px;
}

.each-setting-entry:last-child {
    margin-bottom: 0;
}

.setting-entry {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.setting-entry h5 {
    float: left;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
}

.setting-entry nav {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
    cursor: pointer;
}

.setting-body {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.setting-body:last-child {
    margin-bottom: 0px;
}

.wa-switch {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.wa-switch p {
    font-size: 18px;
    letter-spacing: 0;
    margin-left: 15px;
}

.wa-switch .btn-toggle.active {
    background: #7CAE5D;
}

.wa-switch .handle {
    width: 43px;
    height: 29px;
    border-radius: 14.5px;
    border: 0;
    top: 0;
    left: 2px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1);
}

.wa-switch .btn-toggle {
    width: 88px;
    height: 29px;
    border-radius: 14.5px;
}

.wa-switch .btn-toggle.active .handle {
    left: 46px;
}

.wa-switch .btn-toggle:before,
.wa-switch .btn-toggle:after {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 400;
    line-height: normal;
    top: calc(50% - 11px);
}

.set-tag {
    float: left;
    width: auto;
    height: 35px;
    padding: 0 10px;
    border: 0.5px solid #979797;
    font-size: 14px;
    border-radius: 25px;
    display: flex;
    align-items: center;
    margin-right: 10px;
    margin-bottom: 10px;
}

.set-tag.tag-btn {
    background: var(--col-active);
    color: var(--default-color);
    border-color: var(--default-color);
}

.set-tag.goal {
    background: #F6F1FF;
}

.setting-body ul {
    float: left;
    width: 100%;
    padding-left: 0;
}

.setting-body ul li {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    position: relative;
    padding-left: 15px;
}

.setting-body ul li p {
    font-size: 14px;
    letter-spacing: 0;
}

.setting-body ul li:last-child {
    margin-bottom: 0;
}

.setting-body ul li nav {
    color: #A8A8A8;
    font-size: 14px;
    cursor: pointer;
}

.setting-body>ul li:before {
    content: "";
    width: 5px;
    height: 5px;
    background: var(--default-text);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 6px;
}

.setting-body>p {
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
}

.wa-right-button-block {
    float: left;
    width: 100%;
    padding: 0 20px;
    margin-bottom: 20px;
    position: fixed;
    right: 0;
    bottom: 0;
    max-width: 370px;
}

.wa-right-button-block .general-btn {
    width: 100%;
    height: 60px;
}

.details-entry-right .select-box {
    float: left;
    width: 100%;
    height: 100%;
    margin: 0;
    border: 0;
}

.details-entry-right .select-box select {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 0 25px 25px 0;
    padding-left: 18px;
    border: 0;
    font-size: 14px;
}

.link-block {
    float: left;
    width: 100%;
    margin-top: 18px;
}

.link-block nav,
.link-block a {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 20px;
    color: var(--default-color);
    cursor: pointer;
    float: left;
    width: auto;
}

.input-block-wrap {
    float: left;
    width: 100%;
    padding: 20px 20px 0 20px;
}

.input-block-wrap input {
    float: left;
    width: 100%;
    height: 45px;
    border: 1px solid #DEE0E3;
    border-radius: 5px;
    padding: 0 20px;
}

.payment-mode .radio-wrapper {
    margin: 0;
}

.payment-mode .radio-wrapper .radio-block {
    margin-bottom: 15px;
}

.payment-mode .radio-wrapper .radio-block:last-child {
    margin-bottom: 0;
}

.clipboard-wrap {
    float: left;
    width: 100%;
    border: 1px solid #DEE0E3;
    border-radius: 10px;
    margin: 10px 0;
}

.clipboard-header {
    float: left;
    width: 100%;
    padding: 20px;
    border-bottom: 1px solid #DEE0E3;
}

.clipboard-footer button {
    float: left;
    width: 100%;
    box-shadow: none;
    border-radius: 0 0 10px 10px;
}

.clipboard-header a,
.clipboard-header nav {
    color: var(--default-color);
    word-break: break-all;
    line-height: normal;
    cursor: pointer;
}

.set-tag {
    cursor: pointer;
    transition: .3s ease-out;
}

.invoice-wrapper {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #DEE0E3;
    border-radius: 10px;
    padding: 10px;
    margin-top: 10px;
}

.invoice-wrapper .general-btn {
    padding: 0 20px;
    border-radius: 5px;
}

.invoice-wrapper a {
    color: var(--default-color);
    font-weight: 600;
    text-transform: uppercase;
}

.details-entry-right .tag-wrapper-bl input {
    width: 110px !important;
    min-width: auto;
    height: 25px;
    margin: 5px 5px 5px 0;
    padding: 0;
}

.details-entry-right .sl-tag {
    height: 25px;
    border-radius: 3px;
    background: var(--default-color);
    color: #fff;
    padding-right: 20px;
    margin: 5px 5px 5px 0;
}

.details-entry-right .sl-tag .tag-right {
    color: #fff;
    padding: 0 5px;
    line-height: 25px;
    font-size: 12px;
    max-width: 100%;
    white-space: unset;
}

.details-entry-right .sl-tag .tag-right {
    max-width: 150px;
    white-space: nowrap;
}

.details-entry-right .tag-cl {
    background: transparent;
    height: 25px;
    width: 25px;
    top: 0;
    right: 0;
}

.task-connected {
    float: left;
    width: 100%;
}

.task-connected li {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    color: var(--default-color);
}

.task-connected li:last-child {
    margin-bottom: 0;
}

.task-connected li nav {
    float: left;
    width: 100%;
    color: var(--default-color);
    position: relative;
    padding-left: 22px;
    cursor: pointer;
}

.task-connected li nav:before {
    content: "";
    background: var(--sprite-one) no-repeat -467px -279px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top: 1px;
}

.package-date {
    float: left;
    width: 100%;
    margin: 20px 0;
}

.package-date label {
    float: left;
    width: 100%;
    margin-bottom: 0;
    color: var(--default-grey);
    font-size: 14px;
}

.package-date .react-datepicker-wrapper {
    float: left;
    width: 100%;
    height: 50px;
}

.package-date .react-datepicker-wrapper input {
    font-weight: 600;
    font-size: 16px;
}

.divide-block {
    float: left;
    width: 100%;
    display: flex;
}

.divide-block .package-date {
    margin: 0;
    margin-right: 20px;
}

.divide-block .package-date:last-child {
    margin-right: 0;
}

.package-date .select-box {
    position: relative;
}

.package-date .select-box select {
    height: 50px;
    border-radius: 0;
    border: 0;
    padding: 0;
    border-bottom: 1px solid #e4e5e9;
    font-weight: 600;
    font-size: 16px;
}

.package-date .select-box:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 0;
    top: calc(50% - 4px);
    right: 12px;
}

.height-195 .modal-body {
    height: 195px;
}

.comp-box {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.comp-box:last-child {
    margin-bottom: 0;
}

.comp-box-title {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
    line-height: 21px;
}

.comp-box-ans .radio-wrap .radio-block {
    width: 100%;
    margin: 0 0 10px;
}

.comp-box-ans .radio-wrap .radio-block>label {
    font-size: 16px;
    color: var(--default-grey);
    line-height: 21px;
}

.comp-box-ans .radio-wrap {
    margin-bottom: 0;
}

.comp-box-ans .radio-wrap .radio-block:last-child {
    margin-bottom: 0;
}

.comp-box-ans .radio-wrap .radio-block>label:before {
    top: 3px;
}

.comp-box-ans .radio-wrap .radio-block input:checked+label:after {
    top: 7px;
}

.comp-box-ans .select-box-container .select-chk-block {
    width: 100%;
    margin-bottom: 10px;
}

.comp-box-ans .select-box-container .select-chk-block .control {
    font-size: 16px;
    line-height: 21px;
    color: var(--default-grey);
}

.set-tag.hot {
    background: rgb(255 119 112 / 50%);
}

.set-tag.warm {
    background: rgb(255 191 131 / .5);
}

.set-tag.cold {
    background: rgb(120 110 185 / 0.4);
}

.set-tag.new {
    background: rgb(236 240 241);
}

.setting-body .form-resource-preview {
    margin: 0;
}

.setting-body .form-resource-block .file-each {
    width: calc((100% / 4) - 15px);
}

.setting-body .form-resource-block .file-each:nth-child(4n) {
    margin-right: 0;
}

.chat-note-block {
    float: left;
    width: 100%;
    height: 200px;
    background: var(--white);
    border-radius: 10px;
    border-color: #dee0e3;
    border: 0;
    border: 1px solid #dee0e3;
}

.chat-note-block textarea {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    font-size: 14px;
    border-radius: 10px;
    padding: 10px 15px;
    resize: none;
}

.ind-attach-record {
    float: left;
    width: 100%;
    border: 1px solid #DEE0E3;
    border-radius: 3px;
    margin-bottom: 10px;
    padding: 10px;
}

.ind-attach-record .file-each {
    width: 36px !important;
    height: 36px;
    border: 0;
    margin: 0;
}

.attach-record-details {
    float: left;
    width: calc(100% - 36px);
    padding-left: 10px;
    padding-right: 40px;
    position: relative;
}

.attach-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 7px;
}

.attach-type {
    font-size: 12px;
    line-height: normal;
    color: var(--default-grey);
    text-transform: uppercase;
}

.attach-size {
    font-size: 11px;
    color: var(--default-grey);
    position: absolute;
    right: 0;
    top: 0;
}

.setting-body.summary>p {
    font-size: 14px;
    margin-bottom: 10px;
}

.setting-body.summary>p:last-child {
    margin-bottom: 0px;
}

.chat-counter {
    padding: 0 5px;
    background: var(--default-color);
    color: var(--white);
    border-radius: 4px;
    font-size: 12px;
    margin-left: 5px;
}

.reschedule-wrapper .chat-note-block {
    margin-top: 15px;
    border-radius: 3px;
    height: 135px;
}

.reschedule-wrapper .chat-note-block textarea {
    border-radius: 3px;
}

.each-help-text {
    float: left;
    width: 100%;
    border: 1px solid #dee0e3;
    border-radius: 10px;
    margin-bottom: 15px;
    padding: 20px;
    background: var(--col-active);
}

.helptext-wrapper {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.helptext-wrapper h5 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
}

.helptext-wrapper p {
    font-size: 14px;
    word-break: break-word;
    color: var(--default-grey);
    line-height: normal;
}

.help-button-block {
    float: left;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    padding-top: 15px;
    margin-top: 5px;
    border-top: 1px solid #dee0e3;
}

.help-button-block button {
    height: 30px;
    margin: 0 5px;
    padding: 0 15px;
    min-width: auto;
}

.helptext-wrapper p a {
    color: var(--default-color) !important;
    font-weight: 600;
    cursor: pointer;
}

.helptext-wrapper p.col-black {
    color: var(--default-text);
}

.help-button-block .action-link {
    margin: 0 5px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.copy:before {
    content: "";
    background: var(--sprite-two) no-repeat -328px -425px;
    width: 17px;
    height: 20px;
    display: inline-block;
    zoom: .8;
}

.send:before {
    content: "";
    background: var(--sprite-two) no-repeat -293px -117px;
    width: 19px;
    height: 15px;
    display: inline-block;
    zoom: .9;
}

.default-accord {
    float: left;
    width: 100%;
    margin-bottom: 15px;
}

.default-accord .card {
    background-color: var(--col-active);
    border: 1px solid #dee0e3 !important;
    border-radius: 3px !important;
}

.default-accord .card-header {
    background-color: var(--col-active);
    font-size: 14px;
    font-weight: 600;
    color: var(--default-text);
    padding: 13px 40px 013px 15px;
    cursor: pointer;
    border-radius: 10px 9px 0 0;
    height: auto;
    position: relative;
}

.default-accord .card-header:after {
    content: "";
    background: var(--sprite-two) no-repeat -288px -67px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 13px;
    top: 19px;
}

.default-accord .card-header .helptext-wrapper {
    margin: 0;
}

.default-accord .card-body {
    float: left;
    width: 100%;
    padding: 0 15px 15px;
    border-radius: 0 0 10px 10px;
}

.wa-reply-box {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    background: #f0f0f0;
    padding: 4px 12px 8px 8px;
    border-radius: 5px;
    border-left: 4px solid var(--default-color);
    margin-bottom: 6px;
}

.chat-selection-container .wa-reply-box .wa-each-chat-list-content p {
    color: rgb(68 68 68 / 60%);
}

.task-link {
    float: left;
    width: 100%;
    height: 30px;
    position: absolute;
    bottom: -30px;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.wa-ind-com-list.task-linked {
    margin-bottom: 30px;
}

.link-task {
    font-size: 14px;
    color: var(--default-color);
    position: relative;
    padding-left: 20px;
}

.link-task:before {
    background-position: -467px -279px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top: 0;
}

.linked-tasks {
    float: left;
    width: 100%;
    padding-top: 10px;
    margin-top: 10px;
    border-top: 1px solid #dee0e3;
}

.linked-tasks li {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    margin-bottom: 5px;
    position: relative;
    padding-left: 15px;
}

.linked-tasks li:last-child {
    margin-bottom: 0;
}

.linked-tasks li:before {
    content: "";
    background: var(--sprite-one) no-repeat -334px -159px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top: 2px;
    zoom: .8;
}

.message-out .wa-reply-box {
    background: #cfe9ba;
}

.each-setting-entry.border-less {
    padding: 0;
}

.border-less .setting-entry {
    height: 60px;
    margin-bottom: 0;
    padding: 0 20px;
}

.border-less .chat-note-block {
    border: 0;
}

.border-less .chat-note-block textarea {
    border-radius: 0;
    border: 0;
    border-top: 1px solid #dee0e3;
    line-height: normal;
}

.with-notf .wa-chat-extra {
    min-height: 37px;
}

.with-notf .wa-chat-extra .noti_count {
    position: absolute;
    right: 0;
}

.pick-location .btnsubIconsadd {
    position: absolute;
    right: 9px;
    top: 9px;
}

.pick-location {
    position: relative;
}

.pick-location input[type="text"] {
    padding-right: 30px;
    pointer-events: none;
    cursor: none;
}

.pick-location .btnsubIconsadd:before {
    background-position: -355px -333px;
}

.pick-location-block.ind-form-field {
    margin: 20px 0;
}

.pick-location .btnsubIconsadd.edit:before {
    background-position: -453px -156px;
    width: 17px;
    height: 17px;
}

.pick-location.auto-comp-pad .ind-task-input {
    border-bottom: 1px solid #e4e6e9;
}

.persistent-header .chat-header-block {
    height: 35px;
    margin-bottom: 0;
}

.wa-chat-tab-body.full-height {
    height: 100%;
}

.chat-message-detailfalse img {
    max-width: 100%;
}

.rich-editor-pop .wa-chat-main-right {
    position: relative;
    z-index: -1;
}

.wa-chat-main-right.white-texture {
    background: var(--white);
}

.white-texture .wa-chat-main-right-header {
    padding: 14px 20px;
    border: 0;
    display: flex;
    align-items: center;
}

.white-texture .wa-chat-main-right-header .select-box select {
    height: 41px;
}

.white-texture .profile-entry-data {
    margin-bottom: 0;
}

.white-texture .each-setting-entry {
    border-top: 0;
    margin-bottom: 0;
}

.white-texture .wa-chat-main-right-body {
    height: calc(100% - 70px);
    padding-bottom: 0;
}

.white-texture .wa-right-button-block {
    bottom: auto;
    top: 90px;
}

.white-texture .each-details-entry {
    border: .5px solid #dee0e3;
    border-radius: 3px;
}

.white-texture .details-entry-right {
    border-left: .5px solid #dee0e3;
}

.white-texture .set-tag {
    border-color: #dee0e3;
    border-radius: 3px;
}

.white-texture .profile-entry-header h5 {
    color: var(--default-text);
}

.white-texture .setting-entry h5 {
    color: var(--default-text);
}

.white-texture .wa-chat-main-right-header .general-btn {
    border-radius: 3px;
    margin-left: 10px;
    box-shadow: none;
}

.demosg .take-btn {
    background: transparent;
    border: 1px solid var(--white);
    color: var(--white);
}

/* Whatsapp module End */

/* Sepalika payment */

.payment-conainer>* {
    font-family: Poppins;
}

.payment-conainer {
    float: left;
    width: 100%;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
}

.payment-header {
    float: left;
    width: 100%;
    height: 70px;
    background-color: #FFFFFF;
}

.payment-header .container {
    height: 100%;
}

.payment-header-wrap {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notifications-count {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    position: relative;
}

.notifications-count:before {
    content: "";
    width: 18px;
    height: 20px;
    background: url(images/bell.png) no-repeat;
    display: block;
}

.notifications-count span {
    float: left;
    height: 17px;
    width: 17px;
    font-size: 9px;
    letter-spacing: 0.29px;
    line-height: 12px;
    background-color: #E95482;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: absolute;
    left: -8.5px;
    top: -5.5px;
}

.payment-content {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.payment-content-nav {
    float: left;
    width: 100%;
    height: 80px;
    padding-top: 40px;
}

.payment-nav-back {
    float: left;
    width: auto;
    height: 40px;
    background: transparent;
    border: 0;
    padding: 0;
    position: relative;
    color: var(--default-text);
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 30px;
}

.payment-nav-back .container {
    height: 100%;
}

.payment-nav-back:before {
    content: "";
    width: 23px;
    height: 15px;
    background: url(images/back.png) no-repeat;
    display: inline-block;
    margin-right: 20px;
}

.payment-content-body {
    float: left;
    width: 100%;
    height: calc(100% - 80px);
    padding-top: 40px;
    padding-bottom: 40px;
    overflow-y: auto;
}

.payment-content-body .container {
    height: 100%;
    max-width: 715px;
}

.complete-payment-items {
    float: left;
    width: 100%;
}

.item {
    float: left;
    width: 100%;
    height: 95px;
    background: #FFFFFF;
    border-radius: 11px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.07);
    margin-bottom: 20px;
    cursor: pointer;
}

.payment-items-thumb {
    float: left;
    width: 95px;
    height: 95px;
}

.payment-items-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 11px 0 0 11px;
    object-fit: cover;
}

.payment-items-details {
    float: left;
    width: calc(100% - 95px);
    padding: 13px 20px;
}

.payment-items-title-wrap {
    float: left;
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1px;
}

.payment-items-title h3 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.5px;
    line-height: 16px;
    margin-bottom: 5px;
}

.payment-items-title p {
    float: left;
    width: 100%;
    color: #595CA1;
    font-size: 11px;
    letter-spacing: 0.39px;
    line-height: 17px;
}

.payment-items-description {
    float: left;
    width: 100%;
}

.payment-items-description p {
    float: left;
    width: 100%;
    color: rgba(0, 0, 0, 0.5);
    font-size: 11px;
    letter-spacing: 0.39px;
    line-height: 30px;
}

.payment-items-amount h3 {
    float: left;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    line-height: 16px;
}

.payment-btn-holder {
    float: left;
    width: 100%;
    margin-top: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.payment-btn-holder button {
    float: left;
    width: auto;
    height: 54px;
    padding: 0 40px;
    border: 0;
    border-radius: 3px;
    background-color: #595CA1;
    color: #ffffff;
    box-shadow: 0 2px 7px 0 rgba(120, 137, 149, 0.25);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 21px;
    text-align: center;
}

.payment-btn-holder button:hover {
    box-shadow: 0px 0px 10px 4px rgb(120, 137, 149, 0.35);
    transition: 0.2s;
}

/* Sepalika payment End */

/* Call module */

.call-container {
    float: left;
    width: 100%;
    height: 100%;
    padding-right: 20px;
}

.call-left {
    float: left;
    width: calc(100% - 435px);
    height: 100%;
    padding: 20px;
}

.call-right {
    float: left;
    width: 435px;
    height: calc(100% - 40px);
    margin: 20px 0;
    border-radius: 10px;
    background-color: #F2F2F6;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, .1);
}

.call-header {
    float: left;
    width: calc(100% - 20px);
    height: 110px;
    background: #FFFFFF;
    padding: 0 20px 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    border-radius: 10px;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, .1);
}

.call-body {
    float: left;
    width: 100%;
    height: calc(100% - 110px);
}

.call-user {
    float: left;
    margin-right: 25px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.call-user-thumb {
    float: left;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-right: 15px;
}

.call-user-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.call-user-details {
    float: left;
    display: flex;
    flex-direction: column;
}

.call-user-details h5 {
    float: left;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
}

.call-user-details p {
    float: left;
    color: var(--default-text);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
}

.call-stats {
    float: left;
    margin-right: 45px;
    flex-shrink: 0;
}

.call-stats li {
    float: left;
    margin-right: 15px;
    display: flex;
    flex-direction: column;
}

.call-stats li p {
    float: left;
    font-size: 14px;
    color: var(--default-grey);
    text-transform: uppercase;
    line-height: 18px;
    margin-bottom: 8px;
}

.call-stats li h5 {
    float: left;
    font-size: 18px;
    color: var(--default-text);
    font-weight: 600;
    line-height: 23px;
    text-transform: uppercase;
}

.call-details-info {
    float: left;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.call-details-info h5 {
    float: left;
    font-size: 14px;
    letter-spacing: 0;
    color: var(--default-text);
    line-height: 18px;
    margin-bottom: 8px;
}

.week-round {
    padding-top: 5px
}

.week-round li {
    float: left;
    height: 18.5px;
    width: 18.5px;
    border: 0.5px solid #979797;
    border-radius: 50%;
    margin-right: 10px;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.week-round li:nth-child(2n) {
    margin-right: 20px;
}

.week-round li:last-child {
    margin-right: 0px;
}

.week-round .default {
    border-color: var(--default-color);
    background: var(--default-color);
    color: #FFFFFF;
}

.week-round .process {
    border-color: #F7944A;
    background: #F7944A;
    color: #FFFFFF;
}

.call-search-box {
    float: right;
    width: 100%;
    height: 90px;
    padding: 20px;
    background: #FFFFFF;
    position: absolute;
    left: 0;
    bottom: -91px;
    border-bottom: 1px solid #DEE0E3;
    transition: .3s ease-out;
    bottom: 0;
    z-index: -1;
    display: none;
}

.call-search-box.active {
    z-index: 0;
    bottom: -91px;
}

.call-search {
    float: left;
    width: 21px;
    height: 21px;
    background: transparent;
    padding: 0;
    border: 0;
    position: absolute;
    right: 20px;
    top: calc(50% - 10.5px);
    display: none;
}

.call-search:before {
    content: "";
    background: var(--sprite-two) no-repeat -309px -90px;
    width: 16px;
    height: 16px;
    display: inline-block;
    zoom: 1.2;
}

.call-search-box {
    float: right;
    width: 350px;
    height: 50px;
}

.call-search-box input {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(64, 83, 100, 0.15);
    border-radius: 5px;
    padding: 0 20px;
}

.call-body-filter {
    float: left;
    width: 100%;
    padding: 20px 20px 20px 0;
    margin-bottom: 20px;
}

.call-body-filter .select-box {
    max-width: 380px;
    width: auto;
    border-radius: 10px;
}

.call-body-filter .select-box select {
    border-radius: 10px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 31px;
    height: 50px;
}

.main-search {
    float: left;
    width: calc(100% - 400px);
    height: 60px;
    margin-left: 20px;
    border: 1px solid #e4e5e9;
    background: #fff;
    border-radius: 10px;
    padding: 0 20px 0 50px;
    position: relative;
}

.main-search .icon-in.icon-search {
    left: 18px;
}

.main-search input {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
}

.call-body-content {
    float: left;
    width: 100%;
    height: calc(100% - 110px);
}

.call-note-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    /* padding: 20px 0 0 0; */
}

.call-note-left {
    float: left;
    width: calc(100% - 380px);
    height: 100%;
}

.call-note-right {
    float: left;
    width: 360px;
    height: 100%;
    margin-left: 20px;
}

.call-note-tab-block {
    float: left;
    width: 230px;
    height: 100%;
    margin-right: 20px;
    overflow-y: auto;
}

.call-note-tab-block-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.call-note-tab-block ul li {
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.call-note-tab-block ul li>nav {
    float: left;
    width: 100%;
    font-size: 15px;
    color: var(--default-text);
    letter-spacing: 0;
    line-height: 20px;
    cursor: pointer;
    position: relative;
    padding-left: 25px;
}

.call-note-tab-block ul .active>nav {
    color: var(--default-color);
    font-weight: 600;
}

.call-note-tab-block ul li>nav:before {
    content: "";
    width: 15.5px;
    height: 15.5px;
    border: 0.5px solid #dee0e3;
    background-color: #FFFFFF;
    position: absolute;
    left: 0;
    top: 1px;
    border-radius: 50%;
}

.call-note-tab-block ul .active>nav:before {
    background: var(--default-color);
    border-color: var(--default-color);
}

.call-note-card-block {
    float: left;
    width: calc(100% - 250px);
    height: 100%;
}

.call-note-card-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.call-note-card-header h5 {
    float: left;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
}

.call-note-card-header p {
    float: left;
    font-size: 15px;
    letter-spacing: 0;
    line-height: 19px;
}

.call-note-card {
    float: left;
    width: 100%;
    height: calc(100% - 43px);
    border: 1px solid #DEE0E3;
    border-radius: 10px;
    background-color: #FFFFFF;
    overflow-y: auto;
}

.call-note-card-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.recommendation-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
    padding-right: 20px;
}

.recommendation-header h5 {
    float: left;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
}

.recommendation-header .general-btn {
    height: 28px;
    min-width: auto;
    font-size: 12px;
    padding: 0 10px;
    font-weight: 300;
}

.recommendation-header p {
    float: left;
    font-size: 15px;
    letter-spacing: 0;
    line-height: 19px;
}

.recommendation-content {
    float: left;
    width: 100%;
    height: calc(100% - 63px);
    overflow-y: auto;
}

.recommendation-content-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.each-recomment-list {
    float: left;
    width: 100%;
    height: 56px;
    border: 1px solid #DEE0E3;
    border-radius: 5px;
    background-color: #FFFFFF;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    padding-right: 40px;
    position: relative;
}

.recomment-tag {
    float: left;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--default-color);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    text-transform: uppercase;
    margin-right: 10px;
    flex-shrink: 0;
}

.recomment-tag.default {
    background: #F08D06;
}

.recomment-tag.process {
    background: #559614;
}

.each-recomment-list h5 {
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
    color: var(--default-text);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.call-note-card ul li {
    float: left;
    width: 100%;
    padding-left: 22px;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
    position: relative;
    margin-bottom: 20px;
}

.call-note-card ul li:before {
    content: "";
    width: 10px;
    height: 10px;
    background: var(--default-text);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 4px;
}

.call-note-card p {
    float: left;
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 20px;
}

.call-note-card b,
.call-note-card strong {
    font-weight: 600;
}

.call-note-card i,
.call-note-card b,
.call-note-card em {
    font-style: italic;
}

.call-note-block {
    float: left;
    width: 100%;
    height: 50%;
    padding: 20px;
}

.call-note-block>h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    margin-bottom: 20px;
    color: var(--default-color);
}

.call-note-block textarea {
    float: left;
    width: 100%;
    height: calc(100% - 48px);
    padding: 12px 20px;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    background: var(--white);
    border-radius: 5px;
    resize: none;
}

.recommend-add-block {
    float: left;
    width: 100%;
    height: 50%;
}

.recommend-add-block .recommendation-header {
    padding: 20px;
    margin-bottom: 0;
}

.recommend-add-block .recommendation-header h5 {
    margin-bottom: 0;
}

.recommend-add {
    float: left;
    height: 25px;
    width: 25px;
    border-radius: 5px;
    background-color: var(--white);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    border: 0;
    color: var(--default-color);
    font-size: 22px;
    display: flex;
    justify-content: center;
}

.recommend-add-block .recommendation-content {
    padding: 0 0px 0px 20px;
}

.call-note-wrapper.lab-block .call-note-left {
    float: left;
    width: 100%;
}

.presc-content,
.excersice-content,
.period-content {
    float: left;
    width: calc(100% - 250px);
    height: 100%;
    overflow-y: auto;
}

.intake-content {
    float: left;
    width: calc(100% - 250px);
    height: 100%;
    overflow-y: auto;
}

.lab-content {
    float: left;
    width: calc(100% - 250px);
    height: 100%;
    overflow-y: auto;
}

.photo-content {
    float: left;
    width: calc(100% - 250px);
    height: 100%;
    overflow-y: auto;
}

.presc-content-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.intake-content-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.lab-content-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.photo-content-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.lab-content .table {
    border-spacing: 0 10px;
    border-collapse: separate;
    float: left;
    width: 100%;
    margin-top: -10px;
}

.lab-content .table thead tr th {
    background: rgba(255, 255, 255, 0.4);
    padding: 22px 20px;
    border-bottom: 1px solid #DEE0E3;
    border-top: 1px solid #DEE0E3;
    color: #565656;
    font-size: 14px;
    line-height: 15px;
    font-weight: 600;
    text-transform: uppercase;
}

.lab-content .table thead tr th:first-child {
    border-left: 1px solid #DEE0E3;
    border-radius: 6px 0 0 6px;
    width: 30%;
}

.lab-content .table thead tr th:last-child {
    border-right: 1px solid #DEE0E3;
    border-radius: 0 6px 6px 0;
    text-align: right;
}

.lab-content .table tbody tr td {
    background: #FFFFFF;
    border-top: 1px solid #DEE0E3;
    border-bottom: 1px solid #DEE0E3;
    padding: 22px 20px;
    font-size: 16px;
    color: var(--default-text);
}

.lab-content .table tbody tr td:first-child {
    border-left: 1px solid #DEE0E3;
    border-radius: 5px 0 0 5px;
}

.lab-content .table tbody tr td:last-child {
    border-right: 1px solid #DEE0E3;
    border-radius: 0 5px 5px 0;
    text-align: right;
}

.each-intake-list,
.each-highlight-list {
    float: left;
    width: 100%;
    height: auto;
    min-height: 80px;
    background: #FFFFFF;
    border: 1px solid #DEE0E3;
    margin-bottom: 10px;
    padding: 10px 20px;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    cursor: pointer;
    position: relative;
}

.each-intake-list:after {
    content: "";
    background: var(--sprite-two) no-repeat -617px -165px;
    width: 10px;
    height: 16px;
    position: absolute;
    right: 20px;
    top: 20px;
}

.each-intake-list.active:before {
    background-position: -632px -165px;
}

.each-intake-list p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    margin-bottom: 5px;
}

.each-intake-list h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-text);
}

.each-intake-list h6 {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 22px;
}

.each-intake-list.active {
    background: var(--default-color);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    border-color: var(--default-color);
}

.each-intake-list.active h5 {
    color: #FFFFFF;
}

.each-intake-list.active p {
    color: rgb(255 255 255 / 0.5);
}

.photo-content-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.photo-content-header h5 {
    float: left;
    color: var(--default-color);
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 20px;
}

.photo-content-body {
    float: left;
    width: 100%;
}

.photo-card-list {
    float: left;
    width: calc((100% / 3) - 14px);
    margin: 0 20px 20px 0;
    border: 1px solid #DEE0E3;
    background: #FFFFFF;
    padding: 20px;
}

.photo-card-list:nth-child(3n) {
    margin-right: 0;
}

.photo-card {
    float: left;
    width: 100%;
    height: 165px;
    margin-bottom: 12px;
}

.photo-card img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
}

.photo-content {
    float: left;
}

.photo-text-content {
    float: left;
    width: 100%;
}

.photo-text-content h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 18px;
    color: var(--inside-active);
    margin-bottom: 30px;
}

.photo-footer {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.photo-footer p {
    float: left;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 15px;
    text-transform: uppercase;
    color: var(--default-grey);
}

.sub-menu-tab {
    float: left;
    width: 100%;
    padding-left: 45px;
    margin-top: 12px;
}

.sub-menu-tab nav {
    float: left;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0;
    line-height: 30px;
    cursor: pointer;
}

.sub-menu-tab nav.active {
    color: var(--default-color);
}

.presc-content .each-intake-list {
    padding-left: 55px;
    position: relative;
}

.presc-content .each-intake-list:after {
    content: none;
}

.presc-content .each-intake-list .numbering {
    position: absolute;
    left: 20px;
    top: 10px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-text);
}

.presc-content .each-intake-list h5 {
    margin-bottom: 5px;
}

.presc-content .each-intake-list p {
    margin-bottom: 5px;
}

.presc-content .each-intake-list p:last-child {
    margin-bottom: 0;
}

.presc-content .each-intake-list p span,
.presc-content .each-intake-list p a {
    color: var(--default-color);
}

.each-intake-list.inactive {
    background: rgb(255 255 255 / 0.5);
}

.call-note-wrapper.diet-block .call-note-left {
    float: left;
    width: 100%;
}

.diet-content {
    float: left;
    width: calc(100% - 170px);
    height: 100%;
}

.diet-header-block {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.diet-header-block .select-box {
    width: auto;
}

.diet-header-block .select-box select {
    background: transparent;
    border: 0;
    padding: 0 40px 0 0;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    height: auto;
}

.diet-content-block {
    float: left;
    width: 100%;
    height: calc(100% - 35px);
    overflow-y: auto;
}

.each-diet-list {
    float: left;
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #dee0e3;
    margin-bottom: 20px;
}

.each-diet-list:last-child {
    margin-bottom: 0px;
}

.diet-single-pick {
    float: left;
    width: 100%;
    padding: 20px;
}

.diet-single-pick h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
    margin-bottom: 5px;
}

.diet-single-pick h6 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    margin-bottom: 5px;
    color: var(--default-text);
}

.diet-single-pick p {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    color: var(--default-grey);
}

.tip-block {
    float: left;
    width: 100%;
    border-top: 1px solid #dee0e3;
    padding: 14px 20px;
}

.tip-block p {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
}

.plan-details-header {
    float: left;
    width: 100%;
    padding: 20px 20px 0 20px;
}

.plan-details-header h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
}

.plan-details-header h5 span {
    font-weight: 400;
    color: var(--default-grey);
}

.diet-multiple-pick {
    float: left;
    width: 100%;
    padding: 20px;
    display: flex;
}

.each-diet-pick {
    float: left;
    width: 50%;
    position: relative;
}

.each-diet-pick:first-child {
    padding-right: 90px;
}

.each-diet-pick:first-child:before {
    content: "";
    background: var(--sprite-two) no-repeat -725px -355px;
    width: 22px;
    height: 23px;
    position: absolute;
    right: 35px;
    top: 25px;
}

.each-diet-pick h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    color: var(--default-grey);
    margin-bottom: 5px;
}

.each-diet-pick ul {
    float: left;
    width: 100%;
    padding-left: 17px;
}

.each-diet-pick ul li {
    float: left;
    width: 100%;
    padding-left: 0;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 22px;
    list-style: disc;
    margin-bottom: 2px;
    color: var(--default-text);
}

.each-diet-pick p {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 22px;
}

.journal-block {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.journal-block-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.each-journal-list {
    float: left;
    width: 100%;
}

.journal-day-card {
    float: left;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}

.journal-header-day {
    float: left;
    margin-right: 40px;
}

.journal-header-day h5 {
    float: left;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
    text-transform: uppercase;
}

.journal-header-day h5 span {
    font-size: 14px;
    font-weight: 400;
    color: var(--default-grey);
}

.journal-time-day {
    float: left;
    margin-right: 40px;
}

.journal-time-day p {
    float: left;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    color: var(--default-grey);
}

.journal-time-day p span {
    font-weight: 600;
    color: var(--default-color);
}

.each-journal-list .each-intake-list>h5 {
    margin-bottom: 15px;
}

.each-journal-list .each-intake-list ul {
    float: left;
    width: 100%;
    display: flex;
}

.each-journal-list .each-intake-list ul li {
    padding-right: 25px;
    width: 20%;
}

.each-journal-list .each-intake-list ul li h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--default-color);
    margin-bottom: 5px;
}

.each-journal-list .each-intake-list.active ul li p {
    color: #FFFFFF;
}

.each-journal-list .each-intake-list.active ul li h5 {
    color: rgb(255 255 255 / 0.5);
}

.call-note-left.diet-wrap {
    float: left;
    width: 100%;
}

.diet-plan-content {
    float: left;
    width: calc(100% - 170px);
}

.each-diet-plan {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.each-diet-plan .each-intake-list:after {
    content: none;
}

.each-diet-plan>h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
    margin-bottom: 10px;
}

.each-diet-plan>h5 span {
    font-weight: 400;
    color: var(--default-grey);
}

.each-diet-plan .each-intake-list:last-child {
    margin-bottom: 0;
}

.call-dashboard-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.call-dashboard-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.dashboard-row {
    float: left;
    width: 100%;
    height: 100%;
}

.dashboard-child {
    float: left;
    width: calc((100% / 2) - 10px);
    margin-right: 20px;
    margin-bottom: 20px;

}

.dashboard-box {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    background-color: var(--white);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
    padding: 20px;
}

.dashboard-child:nth-child(2n) {
    margin-right: 0;
}

.status-calendar-block>h5 {
    float: left;
    width: 100%;
    margin-bottom: 23px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
}

.status-calendar {
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
}

.status-calendar-body {
    float: left;
    width: 100%;
    display: flex;
}

.each-status-row {
    float: left;
    width: 100%;
}

.each-status-row li {
    width: 45px;
    height: 18px;
    border: 0.5px solid rgb(151 151 151 / .5);
    border-top: 0;
    background: var(--white);
    margin-right: 15px;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 14px;
    text-transform: uppercase;
    position: relative;
}

.each-status-row:first-child li {
    margin-right: 0;
    border: 0;
    text-align: right;
    padding-right: 7px;
}

.each-status-row:first-child li {
    border: 0;
}

.each-status-row:first-child li:first-child {
    border: 0;
}

.each-status-row li.default {
    background: var(--default-color);
}

.each-status-row li.process {
    background: #FF7A72;
}

.each-status-row li.complete {
    background: #85BF19;
}

.each-status-row li.complete:before {
    content: "";
    background: var(--sprite-two) -600px -167px;
    width: 12px;
    height: 11px;
    position: absolute;
    left: calc(50% - 6px);
    top: calc(50% - 6px);
}

.each-status-row li:last-child {
    border: 0;
    padding: 6px 0 0 0;
    text-align: center;
}

.each-status-row li:first-child {
    border: 0.5px solid rgb(151 151 151 / .5);
}

.multi-dashboard-box {
    float: left;
    width: 100%;
}

.multi-dashboard-box .dashboard-box {
    margin-bottom: 20px;
    padding: 12px 20px;
    position: relative;
}

.multi-dashboard-box .dashboard-box:last-child {
    margin-bottom: 0;
}

.addon-block {
    float: left;
    width: 100px;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    padding: 0px 18px;
    background: var(--inside-active);
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 0 10px 10px 0;
}

.dashboard-attribute {
    float: left;
    width: 100%;
    padding-right: 100px;
    display: flex;
    align-items: center;
}

.each-attribute {
    float: left;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-right: 25px;
}

.each-attribute:last-child {
    margin-right: 0;
}

.attribute-graph {
    padding-bottom: 7px;
}

.attribute-graph img {
    width: 65px;
}

.attribute-info p {
    float: left;
    width: 100%;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 20px;
    color: var(--default-text);
    word-break: break-word;
}

.attribute-info p span {
    color: #2B7712;
    font-weight: 300;
}

.attribute-info h5 {
    float: left;
    font-size: 36px;
    font-weight: 300;
    color: var(--default-text);
    letter-spacing: 0;
    line-height: 42px;
}

.addon-block p {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    color: rgb(255 255 255 / .7);
    margin-bottom: 2px;
}

.addon-block h5 {
    font-size: 25px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 32px;
    color: var(--white);
}

.dashboard-accordion {
    float: left;
    width: 100%;
    border-radius: 10px;
    background-color: #FFFFFF;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
}

.dashboard-accordion>.card:first-of-type {
    border-bottom: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-radius: 10px 10px 0 0;
}

.dashboard-accordion>.card:last-of-type {
    border-radius: 0 0 10px 10px;
}

.dashboard-accordion .card {
    border-color: #DEE0E3;
    border-radius: 0;
}

.dashboard-accordion>.card .card-header button {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: transparent;
    color: var(--default-text);
    border: 0;
    padding: 11px 20px;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
}

.dashboard-accordion>.card .card-header {
    height: 40px;
}

.dashboard-accordion>.card .card-header button .week-round {
    padding: 0;
}

.dashboard-accordion>.card .card-header button .week-round li {
    margin: 0;
}

.dashboard-accordion>.card .card-body {
    float: left;
    width: 100%;
    border-top: 1px solid #DEE0E3;
    padding: 15px 20px;
}

.period-box-header {
    float: left;
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    padding: 20px 20px 0;
}

.period-box-header-left h5 {
    font-size: 18px;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-text);
}

.period-box-header-right ul li {
    float: left;
    margin-left: 25px;
}

.period-box-header-right ul li p {
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 19px;
    color: var(--default-text);
}

.period-box-header-right ul li h5 {
    font-size: 36px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 45px;
    color: var(--default-text);
}

.period-box-body {
    float: left;
    width: 100%;
    padding: 0 20px 20px;
    border-bottom: 1px solid #DEE0E3;
}

.period-box-body p {
    float: left;
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
    color: var(--default-text);
}

.dashboard-box.padding-0 {
    padding: 0 !important;
}

.period-box-footer {
    float: left;
    width: 100%;
    height: 55px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.period-box-footer ul {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.period-box-footer ul li {
    float: left;
}

.period-box-footer ul li p {
    color: var(--default-text);
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 19px;
}

.alone-box {
    float: left;
    width: 100%;
}

.alone-box h6 {
    float: left;
    width: 100%;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-grey);
    margin-bottom: 10px;
}

.alone-box h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    letter-spacing: 0;
    line-height: normal;
    color: var(--default-color);
}

.alone-box p {
    float: left;
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
}

.progress-block .call-note-left {
    width: 100%;
}

.progress-content {
    float: left;
    width: calc(100% - 250px);
    height: 100%;
    overflow-y: auto;
}

.progress-content-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
    position: relative;
}

.progress-table {
    float: left;
    width: 100%;
}

.progress-table-header {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.progress-table-header-col {
    float: left;
    min-width: calc((100% / 7) - 51px);
    margin-right: 10px;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    text-transform: uppercase;
    color: var(--default-grey);
    padding: 10px 0 0 10px;
}

.progress-table-header-col:first-child {
    min-width: 285px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--inside-active);
    text-transform: none;
    padding: 0;
}

.progress-table-header-col:last-child {
    margin-right: 0;
}

.progress-table-body-row {
    float: left;
    width: 100%;
    border: 1px solid #DEE0E3;
    background-color: #FFFFFF;
    margin-bottom: 20px;
    padding: 15px 20px;
    display: flex;
    align-items: center;
}

.progress-table-body-col {
    float: left;
    min-width: calc((100% / 7) - 46px);
    margin-right: 10px;
    padding: 0 0 0 10px;
    position: relative;
}

.progress-table-body-col:first-child {
    min-width: 265px;
    max-width: 265px;
    padding-right: 15px;
    padding: 0;
}

.progress-table-body-col:last-child {
    margin-right: 0;
}

.progress-table-body-col>h5 {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 23px;
    color: var(--default-color);
}

.progress-table-body-col>p {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    text-transform: uppercase;
    color: var(--default-grey);
}

.progress-tag {
    float: left;
    width: auto;
    height: 30px;
    padding: 0 15px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 20px;
    border-radius: 5px;
    background: var(--default-grey);
    color: var(--white);
    display: flex;
    align-items: center;
    margin-top: 7px;
}

.progress-tag.Very.Severe {
    background: #FF7A72;
}

.progress-tag.Severe {
    background: #FFBF83;
}

.progress-tag.Moderate {
    background: #786EB9;
}

.progress-tag.Mild {
    background: #968FCB;
}

.rec-mod .modal-body.padding-zero {
    padding: 20px;
}

.recomend-tab {
    float: left;
    width: 100%;
}

.recomend-tab a {
    height: 45px;
    display: flex;
    align-items: center;
    padding: 0 15px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--default-grey);
}

.recomend-tab .nav-link.active {
    color: var(--default-color);
}

.rec-mod .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 45px);
    background: var(--white);
    border: 1px solid #dee2e6;
    border-top: 0;
    border-radius: 0 0 5px 5px;
}

.rec-mod .tab-pane {
    float: left;
    width: 100%;
    height: 100%;
}

.rec-content-header {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #dee2e6;
}

.rec-search {
    float: left;
    width: 350px;
    height: 35px;
    position: relative;
}

.rec-search input {
    float: left;
    width: 100%;
    height: 100%;
    border: 1px solid #e3e5e8;
    font-size: 14px;
    border-radius: 5px;
    padding-left: 40px;
}

.rec-search:before {
    content: "";
    background: var(--sprite-one) no-repeat -402px -70px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 12px;
    top: calc(50% - 7px);
}

.rec-content-header button {
    box-shadow: none;
    height: 35px;
}

.rec-content-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.rec-content-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.rec-content-body-left {
    float: left;
    width: 275px;
    height: 100%;
}

.rec-filter-header {
    float: left;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.rec-filter-header h5 {
    float: left;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
}

.rec-filter-body {
    float: left;
    width: 100%;
    height: calc(100% - 40px);
    padding: 0 20px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.rec-content-body-right {
    float: left;
    width: calc(100% - 275px);
    border-left: 1px solid #dee2e6;
    height: 100%;
    padding: 40px 20px 20px 20px;
    overflow-y: auto;
}

.rec-content-body-right .select-chk-block {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.rec-content-body-right .select-chk-block label {
    color: var(--default-grey);
    font-size: 16px;
    line-height: 21px;
    word-break: break-word;
}

.rec-filter-body .select-chk-block .control-checkbox {
    font-size: 14px;
    color: var(--default-grey);
    line-height: 18px;
}

.rec-filter-body .select-chk-block {
    margin-bottom: 10px;
    margin-right: 0;
}

.rec-filter-body .control-indicator {
    top: 1px;
}

.rec-content-body-right .select-chk-block .control-indicator {
    top: 3px;
}

.call-note-block .recommendation-header {
    padding-right: 0;
}

.call-right .recommendation-content {
    height: calc(100% - 65px);
}

.magnet-content {
    float: left;
    width: calc(100% - 250px);
    height: 100%;
    overflow-y: auto;
}

.magnet-wrapper {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.each-magnet {
    float: left;
    width: 100%;
    border: 1px solid #dee0e3;
    background: var(--white);
    margin-bottom: 20px;
    border-radius: 5px;
}

.magnet-image {
    float: left;
    width: 100%;
    height: 351px;
    background: #fafafa;
    border-radius: 5px 5px 0 0;
}

.magnet-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 5px 5px 0 0;
}

.magnet-details {
    float: left;
    width: 100%;
    padding: 20px 20px;
}

.magnet-details h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    color: var(--default-text);
    letter-spacing: 0;
    line-height: 23px;
    margin-bottom: 10px;
}

.magnet-details p {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    color: var(--default-grey);
    margin-bottom: 10px;
}

.magnet-details .button-block {
    margin-top: 10px;
    display: flex;
    justify-content: flex-end;
}

.magnet-details .button-block button.general-btn {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    font-weight: 400;
    padding: 0 15px;
}

.play-ico:before {
    content: "";
    background: var(--sprite-two) no-repeat -393px -64px;
    width: 12px;
    height: 12px;
    margin-right: 5px;
    display: inline-block;
}

.remove-rec {
    position: absolute;
    right: 16px;
    top: calc(50% - 7px);
    padding: 0;
    border: 0;
    background: transparent;
    opacity: 0;
    transition: .3s ease-out;
    pointer-events: none;
}

.remove-rec:before {
    background-position: -197px -157px;
    width: 12px;
    height: 14px;
}

.each-recomment-list:hover .remove-rec {
    opacity: 1;
    pointer-events: auto;
}

.call-body-filter.flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.call-body-filter-option .general-btn {
    padding: 0 15px;
    margin-left: 15px;
}

.call-body-filter-option .general-btn.green {
    border-color: #0f9d58;
}

.call-body-filter-option .general-btn.green:hover {
    border-color: var(--hover-color);
}

.each-recomment-list .select-chk-block {
    position: absolute;
    right: 8px;
    top: 23px;
}

.each-recomment-list .select-chk-block .control-indicator {
    width: 25px;
    height: 25px;
    border-radius: 50%;
}

.each-recomment-list .select-chk-block .control-checkbox .control-indicator:after {
    zoom: 1.2;
}

.add-rec {
    float: left;
    width: 25px;
    height: 25px;
    border: 0;
    padding: 0;
    position: absolute;
    right: 13px;
    top: calc(50% - 12.5px);
    background: var(--default-color);
    border-radius: 50px;
    zoom: .8;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.add-rec:before {
    background-position: -34px -122px;
    width: 25px;
    height: 25px;
    zoom: .5;
}

.each-recomment-list:hover .add-rec {
    opacity: 1;
    pointer-events: auto;
}

.active-toggler-block {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(255 255 255 / 75%);
    transition: .5s ease-out;
    opacity: 0;
    pointer-events: none;
    cursor: auto;
}

.toggle-active {
    float: left;
    height: 25px;
    border: 0;
    background: var(--default-color);
    border-radius: 16.5px;
    margin: 0 5px;
    padding: 0 10px;
    font-size: 14px;
    color: var(--white);
}

.presc-content .each-intake-list:hover .active-toggler-block {
    opacity: 1;
    pointer-events: auto;
}

.toggle-active.cancel {
    border: 0.5px solid var(--default-grey);
    background: var(--white);
    color: var(--default-grey);
}

.presc-content .each-intake-list.inactive .numbering {
    opacity: .5;
}

.presc-content .each-intake-list.inactive h5 {
    opacity: .5;
}

.presc-content .each-intake-list.inactive p {
    opacity: .5;
}

.table-handle-overlay {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.offset-block {
    float: left;
    width: 285px;
    height: 100%;
    margin-right: 10px;
}

.overlay-block {
    float: left;
    width: calc(100% - 314px);
    height: 100%;
    position: relative;
}

.col-overlay {
    float: left;
    width: calc((100% / 7) - 9px);
    margin-right: 10px;
    height: 100%;
    border-radius: 10px;
    position: relative;
    cursor: move;
}

.col-overlay:before {
    content: "";
    width: 100%;
    height: 100%;
    border: 2px solid var(--default-color);
    border-radius: 10px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all .3s ease-out;
}

.col-overlay.active:before {
    opacity: 1;
}

.col-overlay.active.secondry:before {
    opacity: .5;
}

.col-overlay:last-child {
    margin-right: 0;
}

.difference-panel {
    float: left;
    width: auto;
    min-width: 63px;
    border-radius: 0 10px 10px 0;
    background: var(--default-color);
    color: var(--white);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 24px;
    padding: 0 16px 0 7px;
    position: absolute;
    right: -62px;
    top: -2px;
    z-index: 1;
    text-align: center;
}

.difference-panel.decrement:after {
    content: "";
    width: 7px;
    height: 9px;
    background: url(images/arrow-down-ico.svg) no-repeat;
    position: absolute;
    right: 7px;
    top: calc(50% - 3.5px);
    background-size: cover;
}

.difference-panel.increment:after {
    content: "";
    width: 7px;
    height: 9px;
    background: url(images/arrow-down-ico.svg) no-repeat;
    position: absolute;
    right: 7px;
    top: calc(50% - 3.5px);
    background-size: cover;
    transform: rotate(180deg);
    right: 5px;
}

.wa-each-accord-search-bar {
    float: left;
    width: 100%;
    height: 65px;
    background: var(--sidemenu-right-active);
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid rgb(255 255 255 / 0.10);
    position: relative;
}

.wa-each-accord-search-bar input {
    float: left;
    width: 100%;
    height: 35px;
    background: transparent;
    border: 0;
    color: var(--white);
    padding: 0 20px 0 40px;
}

.wa-each-accord-search-bar input::placeholder {
    color: var(--placeholder) !important;
    opacity: .5;
}

.wa-each-accord-search-bar:before {
    content: "";
    background: var(--sprite-two) no-repeat -309px -90px;
    width: 16px;
    height: 16px;
    position: absolute;
    left: 30px;
    top: calc(50% - 8px);
    opacity: .5;
}

.search-in .wa-each-accord {
    height: calc(100% - 60px);
}

.sticky-filter-header {
    float: left;
    width: 100%;
    height: 40px;
    margin-bottom: 20px;
    padding-right: 20px;
    display: flex;
    justify-content: flex-end;
}

.sticky-filter-header .select-box {
    max-width: 185px;
}

.sticky-filter-header .select-box select {
    border: 1px solid #e4e5e9;
    border-radius: 10px;
}

.excersice-body {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.excersice-body-inner {
    float: left;
    width: 100%;
    padding-right: 20px;
}

.each-exercise {
    float: left;
    width: 100%;
    height: 150px;
    padding: 20px;
    background: var(--white);
    border-radius: 10px;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, .1);
    margin-bottom: 20px;
}

.exercise-thumb {
    float: left;
    width: 110px;
    height: 100%;
    margin-right: 20px;
}

.exercise-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.exercise-details {
    float: left;
    width: calc(100% - 135px);
    max-height: 110px;
    overflow: hidden;
}

.exercise-details h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    margin-bottom: 5px;
    line-height: 23px;
    color: var(--default-text);
}

.exercise-details p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    margin-bottom: 5px;
}

.bs-dropdown.dropdown .btn-primary {
    background: var(--white);
    border: 1px solid #e4e5e9;
    border-radius: 10px;
    height: 45px;
    color: var(--default-grey);
    padding-right: 45px;
    padding-left: 20px;
}

.bs-dropdown.dropdown .btn-primary:after {
    border: 0;
    background: var(--sprite-one) no-repeat -468px -357px;
    width: 7px;
    height: 12px;
    position: absolute;
    right: 21px;
    top: calc(50% - 6px);
    transform: rotate(-90deg);
}

.bs-dropdown.dropdown .btn-primary:not(:disabled):not(.disabled).active:focus,
.bs-dropdown.dropdown .btn-primary:not(:disabled):not(.disabled):active:focus,
.bs-dropdown.dropdown .show>.btn-primary.dropdown-toggle:focus {
    background: var(--white);
    color: var(--default-grey);
    border: 1px solid #e4e5e9;
}

.bs-dropdown.dropdown .dropdown-menu {
    float: left;
    width: 200px;
    background: #fff;
    padding: 10px 0;
    border: 1px solid #EAEAEA;
    border-radius: 4px;
    box-shadow: 0 5px 7px 0 rgba(0, 0, 0, 0.15);
}

.bs-dropdown.dropdown .dropdown-item {
    padding: 0 20px;
    float: left;
    width: 100%;
    height: 40px;
    padding: 0 20px;
    color: var(--default-grey) !important;
    font-size: 16px;
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: -webkit-flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    cursor: pointer;
}

.bs-dropdown.dropdown .dropdown-item:hover {
    background: #fafafa;
    color: var(--default-color) !important;
}

.bs-dropdown.dropdown .dropdown-item.active,
.bs-dropdown.dropdown.dropdown-item:active {
    background: #fafafa;
    color: var(--default-color) !important;
}

.week-round .Very.Severe {
    background: #FF7A72;
    border-color: #FF7A72;
    color: var(--white);
}

.week-round .Severe {
    background: #FFBF83;
    border-color: #FFBF83;
    color: var(--white);
}

.week-round .Moderate {
    background: #786EB9;
    border-color: #786EB9;
    color: var(--white);
}

.week-round .Mild {
    background: #968FCB;
    border-color: #968FCB;
    color: var(--white);
}

.call-note-card-header-left .edited-task-ico {
    background: transparent;
    border: 0;
    margin-left: 5px;
}

.call-note-card-header-left {
    display: flex;
}

.wa-chat-details p .wa-dt {
    margin-left: 4px;
}

.precallnote-textarea {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.precallnote-textarea textarea {
    float: left;
    width: 100%;
    height: 200px;
    border: 1px solid #e4e6e9;
    border-radius: 5px;
    padding: 20px;
}

.precallnote-textarea .quill {
    float: left;
    width: 100%;
    height: 90%;
    background: var(--white);
    border-radius: 10px;
    margin-bottom: 15px;
}

.precallnote-textarea .ql-container {
    float: left;
    width: 100%;
    height: 100%;
    background: var(--white);
}

.precallnote-textarea {
    height: 100%;
}

.precallnote-textarea .ql-toolbar.ql-snow {
    border-color: #DEE0E3;
    border-radius: 10px 10px 0 0;
    border: 0;
}

.precallnote-textarea .ql-container.ql-snow {
    height: calc(100% - 40px);
    border-color: #DEE0E3;
    border-radius: 0 0 10px 10px;
    border: 0;
    border-bottom: 1px solid #DEE0E3;
}

.recommendation-textarea {
    float: left;
    width: 100%;
    height: calc(100% - 40px);
}

.recommendation-textarea .quill {
    height: 100%;
    border-radius: 10px;
}

.recommendation-textarea .ql-container.ql-snow {
    height: calc(100% - 42px);
    background: var(--white);
    border-radius: 0 0 10px 10px;
    border-color: #DEE0E3;
    border: 0;
    border-bottom: 1px solid #DEE0E3;
}

.recommendation-textarea .ql-toolbar.ql-snow {
    background: var(--white);
    border-radius: 10px 10px 0 0;
    border-color: #DEE0E3;
    border: 0;
}

.sticky-message {
    position: fixed;
    right: 25px;
    bottom: 0;
    min-width: 155px;
    border-radius: 10px 10px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sticky-message:before {
    content: "";
    background: var(--sprite-one) no-repeat -436px -11px;
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 10px;
    zoom: .8;
}

.modal-footer.message-footer .general-btn {
    padding: 0 20px;
}

.msg-ico:before {
    background-position: -376px -126px;
    width: 14px;
    height: 14px;
    margin-right: 5px;
}

.msg-ico {
    font-size: 14px;
    color: var(--default-grey);
    display: flex;
    align-items: center;
    cursor: pointer;
}

.message-content,
.highlight-content {
    float: left;
    width: 100%;
    height: 100%;
}

.each-message-list {
    float: left;
    width: auto;
    min-width: 285px;
    max-width: 100%;
    padding: 12px 20px 30px 15px;
    background: var(--chat-shade);
    border-radius: 0 10px 10px 10px;
    margin-bottom: 20px;
    position: relative;
    box-shadow: 0 1px 1px 0 rgba(164, 152, 135, 0.32);
}

.message-content-inner {
    float: left;
    width: 100%;
    padding-left: 10px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-right: 20px;
}

.highlight-content-inner {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-right: 20px;
}

.msg-pointer {
    position: absolute;
    left: -7px;
    top: -4px;
    color: var(--chat-shade);
}

.each-message-list p {
    color: var(--chat-inner);
    line-height: normal;
    font-size: 14px;
}

.each-message-list p.date-time {
    font-size: 10px;
    text-transform: uppercase;
    position: absolute;
    position: absolute;
    right: 12px;
    bottom: 8px;
    margin: 0;
}

.call-note-tab-block ul li .select-chk-block {
    float: left;
    width: 100%;
    height: 26px;
    position: relative;
}

.call-note-tab-block ul li .select-chk-block .control-indicator {
    top: 5px;
    border: 0.5px solid #dee0e3;
}

.call-note-tab-block ul li p {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 15px;
}

.flag-icon:before {
    content: "";
    background: var(--sprite-two) no-repeat -632px -165px;
    width: 10px;
    height: 16px;
    display: inline-block;
}

.flag-icon {
    float: left;
    width: auto;
    padding: 5px 10px;
    border-radius: 5px;
    background: var(--default-color);
    display: flex;
    align-items: center;
}

.call-note-tab {
    float: left;
    width: 100%;
    height: calc(100% - 43px);
}

.call-note-tab .nav-tabs .nav-item.show .nav-link,
.call-note-tab .nav-tabs .nav-link.active {
    border-color: #DEE0E3;
    border-bottom-color: var(--white);
    color: var(--default-color);
}

.call-note-tab .nav-tabs {
    border-color: #DEE0E3;
}

.call-note-tab .tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 34px);
    background: var(--white);
    border: 1px solid #DEE0E3;
    border-top: 0;
    border-radius: 0 0 10px 10px;
}

.call-note-tab .tab-pane {
    float: left;
    width: 100%;
    height: 100%;
}

.call-note-tab-inner {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.call-note-tab .nav-tabs .nav-link {
    color: var(--default-grey);
    font-weight: 400;
}

.call-note-tab p {
    /* float: left; */
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
    margin-bottom: 20px;
}

.call-note-tab strong {
    font-weight: 600 !important;
}

.each-highlight-list .edited-task-ico {
    position: absolute;
    right: 10px;
    top: 10px;
    background: transparent;
    border: 0;
    opacity: 0;
    pointer-events: none;
    transition: .3s ease-out;
}

.each-highlight-list:hover .edited-task-ico {
    opacity: 1;
    pointer-events: auto;
}

.each-message-list p.created-by {
    font-size: 10px;
    text-transform: uppercase;
    position: absolute;
    left: 15px;
    bottom: 8px;
    margin: 0;
}

.precallnote-textarea.textarea.rec textarea {
    resize: none;
    height: 100%;
}

.week-round li.mode-1 {
    background: #968FCB;
    border-color: #968FCB;
    color: var(--white);
}

.week-round li.mode-2 {
    background: #786EB9;
    border-color: #786EB9;
    color: var(--white);
}

.week-round li.mode-3 {
    background: #FFBF83;
    border-color: #FFBF83;
    color: var(--white);
}

.week-round li.mode-4 {
    background: #FF7A72;
    border-color: #FF7A72;
    color: var(--white);
}

.each-status-row li.mode-1 {
    background: #968FCB;
}

.each-status-row li.mode-2 {
    background: #786EB9;
}

.each-status-row li.mode-3 {
    background: #FFBF83;
}

.each-status-row li.mode-4 {
    background: #FF7A72;
}

.call-module .wa-chat-details h5 {
    line-height: 16px;
    margin-bottom: 0;
}

.call-module .wa-each-chat {
    height: 70px;
}

.each-highlight-list {
    padding-right: 30px;
}

.each-highlight-list p {
    font-size: 16px;
    line-height: normal;
}

.multi-dashboard-box .dashboard-box .alone-box h6 {
    color: var(--default-text);
}

.call-note-tab-block ul li>nav .edited-task-ico {
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0 0 0 10px;
}

.event-info p {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    font-size: 14px;
    color: var(--default-grey);
}

.published-date {
    float: left;
    width: 100%;
    margin: 0 0 20px 0;
}

.published-date p {
    font-weight: 600;
    color: var(--default-text);
}

.question-wrap {
    float: left;
    width: 100%;
    margin: 10px 0 20px;
}

.question-wrap p {
    color: var(--default-text);
    line-height: 22px;
}

.question-wrap p strong {
    font-weight: 600 !important;
}

.question-wrap p p {
    margin-bottom: 5px;
}

.question-wrap p p:last-child {
    margin-bottom: 0;
}

.intake-rate-wrapper {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 10px;
}

.intake-rate-wrapper .rate-star {
    width: auto;
    margin: 0;
}

.intake-rate-text span {
    font-size: 10px;
    color: var(--default-grey);
}

.intake-rate-text {
    float: left;
    width: 70px;
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
}

.magnet-box {
    float: left;
    width: calc(100% - 20px);
    background: var(--white);
    border-radius: 5px;
    padding: 15px 40px 15px 20px;
    margin-bottom: 20px;
    position: relative;
}

.data-learner-course-right-body .info-ico {
    float: left;
    width: 20px;
    height: 20px;
    background: transparent;
    padding: 0;
    border: 0;
    position: absolute;
    right: 16px;
    top: 16px;
}

.data-learner-course-right-body .info-ico:before {
    content: "";
    background: var(--sprite-two) no-repeat -147px -430px;
    width: 12px;
    height: 12px;
    display: inline-block;
}

.magnet-description {
    float: left;
    width: 100%;
    font-family: 'Futura PT Book';
}

.magnet-description p:first-child {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
}

.magnet-description p {
    font-size: 14px;
    line-height: normal;
}

.magnet-content-body {
    float: left;
    width: 100%;
    height: calc(100% - 154px);
}

.magnet-content-body .each-magnet {
    float: left;
    width: calc((100% / 2) - 10px);
    margin-right: 20px;
}

.magnet-content-body .each-magnet:nth-child(2n) {
    margin-right: 0;
}

.call-note-tab p ul,
.call-note-tab-inner p ul {
    list-style-type: disc;
    padding-left: 18px;
}

.call-note-tab p ol,
.call-note-tab-inner p ol {
    list-style: decimal;
    padding-left: 18px;
}

.lab-content.lab-full {
    width: 100%;
}

.lab-full .lab-content-inner {
    padding-right: 0;
}

.each-message-list p ol {
    list-style-type: decimal;
    padding-left: 13px;
}

.each-message-list p ul {
    list-style-type: disc;
    padding-left: 17px;
}

.call-note-block.border-align {
    padding: 0;
}

.border-align .recommendation-header {
    height: 60px;
    margin: 0;
    padding: 0 20px;
}

.border-align .recommendation-textarea .quill {
    border-radius: 0;
}

.border-align .recommendation-textarea {
    height: calc(100% - 60px);
}

.border-align .recommendation-textarea .ql-toolbar.ql-snow {
    border-radius: 0;
}

.border-align .recommendation-textarea .ql-container.ql-snow {
    border-radius: 0;
}

.form-option-block.call-module {
    right: 5px;
    top: 27px;
}

.form-option-block.call-module .panel-option {
    right: -2px;
    top: 17px;
}

.form-option-block.call-module .panel-option li .panel-option-click {
    padding-left: 20px;
}

.symptom-status {
    float: left;
    font-size: 16px;
    line-height: 20px;
    margin-top: 5px;
    color: var(--default-grey);
}

.call-note-tab p br {
    display: none;
}

.lab-content .table tbody tr.lab-section.active td {
    background: var(--default-color);
    color: var(--white);
}

.each-intake-list.edited-list {
    display: block;
    padding: 15px 20px;
}

.edited-textarea {
    float: left;
    width: 100%;
    height: 100px;
    padding: 15px;
    border: 1px solid #dee0e3;
    border-radius: 5px;
    background: #fafafa;
    resize: none;
}

.each-intake-list p {
    margin-bottom: 10px;
}

.edited-input {
    float: left;
    width: 100%;
    height: 35px;
    padding: 0 15px;
    border: 1px solid #dee0e3;
    border-radius: 5px;
    background: #fafafa;
}

.each-intake-list.edited-list:after {
    content: none;
}

.general-btn.sticky-message.start-fix {
    right: 195px;
    min-width: auto;
    padding: 0 20px;
    background: #4caf50;
    border-color: #4caf50;
}

.general-btn.sticky-message.end-fix {
    right: 195px;
    min-width: auto;
    padding: 0 20px;
    background: #e14745;
    border-color: #e14745;
}

.general-btn.sticky-message.start-fix:before,
.general-btn.sticky-message.end-fix:before {
    content: none;
}

.magnet-box .info-clicker {
    position: absolute;
    right: 20px;
    top: 20px;
}

.fixed-btn-bottom {
    float: left;
    position: fixed;
    right: 25px;
    bottom: 0;
}

.fixed-btn-bottom .sticky-message {
    float: left;
    min-width: auto;
    padding: 0 20px;
    position: relative;
    right: 0;
    bottom: 0;
    margin-left: 10px;
}

.fixed-btn-bottom .general-btn.sticky-message.start-fix,
.fixed-btn-bottom .general-btn.sticky-message.end-fix {
    right: 0;
}

.fixed-btn-bottom .task-btn:before {
    content: "";
    background: var(--sprite-two) no-repeat -50px -182px;
    width: 14px;
    height: 14px;
}

.fixed-btn-bottom .general-btn.sticky-message.end-fix:hover {
    background: rgb(225 73 71 / 85%);
    border-color: rgb(225 73 71 / 85%);
}

.call-note-card-header-left:hover .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.lab-content .table tbody tr td:last-child .flag-icon:before {
    background-position: -617px -165px;
}

.lab-content .table tbody tr td:last-child .flag-icon {
    background: transparent;
}

.lab-content .table tbody tr.lab-section.active td:last-child .flag-icon:before {
    background-position: -632px -165px;
}

.sub-menu-tab nav .wf-btn-block {
    float: unset;
    display: inline-block;
}

.sub-menu-tab nav:hover .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

/* Call module end */

/* Calendar */

.calendar-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.calendar-header {
    float: left;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--white);
    border: 1px solid #DEE0E3;
    border-bottom: 0;
    padding: 0 30px;
}

.calendar-inner-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.control-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.calendar-header h5 {
    color: var(--default-text);
    font-size: 30px;
    letter-spacing: 0;
    line-height: 38px;
}

.calendar-header p {
    color: var(--default-grey);
    font-size: 30px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 38px;
}

.active .attendee-image:before {
    content: "";
    width: 100%;
    height: 100%;
    background: var(--default-color);
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    opacity: 0.7;
}

.active .attendee-image:after {
    content: "";
    width: 14px;
    height: 11px;
    background: var(--sprite-two) no-repeat -108px -116px;
    position: absolute;
    left: calc(50% - 7px);
    top: calc(50% - 5.5px);
}

.pt-delete {
    position: absolute;
    right: 0;
    top: calc(50% - 7px);
    background: transparent;
    border: 0;
    padding: 0;
}

.pt-delete:before {
    content: "";
    background: var(--sprite-one) no-repeat -197px -157px;
    width: 12px;
    height: 14px;
    display: inline-block;
}

.event-editor-block-2 .react-datepicker__navigation--previous:before {
    content: "";
    background: var(--sprite-one) no-repeat -495px -357px;
    width: 7px;
    height: 12px;
    display: block;
    zoom: 1.5;
}

.event-editor-block-2 .react-datepicker__navigation--next:before {
    content: "";
    background: var(--sprite-one) no-repeat -510px -357px;
    width: 7px;
    height: 12px;
    display: block;
    zoom: 1.5;
}

.event-editor-block-2 .react-datepicker__input-container:after {
    background: var(--sprite-one) no-repeat -375px -159px;
    width: 14px;
    height: 14px;
    top: calc(50% - 7px);
    right: auto;
    left: 20px;
}

.editor-section-details.select-box select {
    border-left: 0;
    border-right: 0;
    border-top: 0;
    padding-left: 0;
    font-size: 18px;
}

.editor-section-details.select-box:after {
    right: 0;
}

.calendar-title-cntr {
    display: flex;
    align-items: center;
}

.calendar-title-cntr .meet-set-button {
    position: relative;
    left: 0;
    top: 4px;
    margin-left: 20px;
}

.e-schedule .e-month-view .e-work-cells.e-disableCell {
    pointer-events: none;
    cursor: not-allowed !important;
    background: #ffebeb;
    color: #ED3A2C;
}

.event-editor-block-2 .react-datepicker__day.e-disableCell {
    color: #ED3A2C;
    pointer-events: none;
    cursor: not-allowed;
}

.cal-set .nav-link:hover {
    border-color: transparent;
}

.cal-set .nav-item.show .nav-link,
.cal-set .nav-link.active:hover {
    border-color: #dee2e6 #dee2e6 #fff;
}

.recomend-tab.cal-set+.tab-content {
    float: left;
    width: 100%;
    height: calc(100% - 65px);
    border: 1px solid #dee2e6;
    border-top: 0;
    border-radius: 0 0 5px 5px;
}

.recomend-tab.cal-set+.tab-content>.tab-pane {
    float: left;
    width: 100%;
    height: 100%;
    padding: 0px;
}

.tabpane-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.settings-section {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e3e3e3;
}

.settings-title {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--default-color);
}

.settings-section ul li {
    float: left;
    width: calc((100% / 4) - 9px);
    margin-right: 9px;
    margin-bottom: 15px;
}

.settings-section ul li .select-chk-block label {
    color: var(--default-grey);
    font-size: 14px;
}

.split-calendar-block {
    float: left;
    width: 100%;
    display: flex;
    margin-bottom: 13px;
}

.each-calendar-picker {
    float: left;
    margin-right: 15px;
    width: calc((100% / 2) - 7px);
}

.each-calendar-picker:last-child {
    margin-right: 0;
}

.each-calendar-picker>label {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-grey);
    text-transform: uppercase;
}

.sf-calendar-picker {
    float: left;
    width: 100%;
    border: 1px solid #e3e3e3;
    border-radius: 5px;
    padding: 0 20px;
}

.each-calendar-picker .sf-calendar-picker .e-input-group {
    float: left;
    width: 100%;
    height: 40px;
    margin: 0 !important;
}

.settings-section:last-child {
    margin: 0;
    padding: 0;
    border: 0;
}

.settings-section:last-child .split-calendar-block {
    margin: 0;
}

.empty-placeholder {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
    font-weight: 300;
    text-transform: capitalize;
    color: var(--default-grey);
}

.e-schedule .e-vertical-view .e-date-header-wrap table tbody td.e-header-cells.e-disableCell {
    pointer-events: none;
    cursor: not-allowed !important;
}

.e-schedule .e-month-view .e-work-cells.e-inactiveCell {
    background: #fafafa;
    pointer-events: none;
    cursor: not-allowed !important;
    color: rgb(37 43 62 / 0.5);
}

.e-schedule .e-vertical-view .e-work-cells.e-inactiveCell {
    background: #fafafa;
    pointer-events: none;
    cursor: not-allowed !important;
    color: rgb(37 43 62 / 0.5);
}

.e-schedule .e-vertical-view .e-work-cells.e-disableCell,
.e-schedule .e-month-view .e-work-cells.e-disableCell.e-inactiveCell {
    pointer-events: none;
    cursor: not-allowed !important;
    background: #ffebeb;
    color: #ED3A2C;
}

.set-input-block {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.set-input-block>label {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-grey);
    text-transform: uppercase;
}

.set-input-block input {
    float: left;
    width: 100%;
    height: 42px;
    border: 1px solid #e3e3e3;
    border-radius: 5px;
    padding: 0 20px;
}

.split-calendar-block .set-input-block {
    width: 75%;
}

.split-calendar-block .select-chk-block {
    margin-top: 24px;
    line-height: 42px;
    margin-left: 20px;
}

.split-calendar-block .select-chk-block label {
    color: var(--default-grey);
    font-size: 14px;
}

.settings-section .button-block {
    margin: 0 0 10px;
    display: flex;
    justify-content: flex-end;
}

.settings-section .button-block .general-btn.green {
    height: 30px;
    border-color: #0F9D58;
}

.settings-section .button-block .general-btn.green:hover {
    background: #13b667;
}

.set-table {
    float: left;
    width: 100%;
    border: 1px solid #dee2e6;
}

.set-table .table {
    margin: 0;
}

.set-table .table thead tr th {
    border: 0;
    color: #565656;
    font-size: 14px;
    line-height: 15px;
    font-weight: 600;
    padding: 12px 12px;
    line-height: 20px;
    background: var(--white);
    vertical-align: middle;
    text-transform: uppercase;
}

.set-table .table tbody tr td {
    font-size: 16px;
    color: #555;
    padding: 12px 12px;
    line-height: 20px;
    border-color: rgba(64, 83, 100, 0.15);
    vertical-align: middle;
    position: relative;
}

.set-table .table tbody tr td .remove-rec {
    opacity: 1;
    pointer-events: auto;
}

.holiday-cell-title {
    font-size: 16px;
    padding: 15px;
}

.e-schedule .e-vertical-view .e-work-cells.e-disableCell.e-holidayCell {
    vertical-align: middle;
}

.white-modal .modal-dialog.modal-lg-xl {
    max-width: 800px;
}

.calendar-header .select-box {
    max-width: 300px;
}

/* Calendar End */

/* sepalika form */

.type-form-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.type-form-header {
    float: left;
    width: 100%;
    height: 65px;
    background: var(--white);
    box-shadow: inset 0 -1px 0 0 #E8E8E8, 0 2px 50px 0 rgba(0, 0, 0, 0.25);
    position: relative;
}

.type-form-body {
    float: left;
    width: 100%;
    height: calc(100% - 65px);
    background: #c9c9c9;
    overflow-y: auto;
    background-repeat: no-repeat;
    background-size: cover;
}

.type-form-container {
    float: left;
    width: 100%;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: stretch;
}

.type-form-container button {
    background: transparent;
    border: 0;
    line-height: 0;
    padding: 0;
    width: 50px;
    height: 65px;
    cursor: pointer;
    position: relative;
}

.form-prev-btn:before {
    content: "";
    background: var(--sprite-form) no-repeat -3px -4px;
    width: 30px;
    height: 12px;
    display: inline-block;
    position: absolute;
    left: 0;
    top: calc(50% - 6px);
}

.form-close-btn:before {
    content: "";
    background: var(--sprite-form) no-repeat -38px -1px;
    width: 18px;
    height: 18px;
    display: inline-block;
    position: absolute;
    right: 0;
    top: calc(50% - 9px);
}

.type-form-details {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.type-form-details .progress {
    margin-bottom: 0;
    border-radius: 0;
    box-shadow: none;
    height: 7px;
    background: #E1E1E1;
}

.type-form-details .progress .progress-bar {
    background: var(--default-color);
}

.type-form-details h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    text-align: center;
    margin-bottom: 15px;
    font-family: 'Cormorant Upright';
    font-weight: 400;
}

.type-form-bg {
    float: left;
    width: 100%;
    height: 100%;
}

.type-form-inner {
    float: left;
    width: 100%;
    height: 100%;
    padding: 70px 0;
}

.type-form-inner>p {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: 18px;
    color: var(--white);
    position: relative;
    padding-left: 22px;
}

.type-form-inner>p:before {
    content: "i";
    width: 13px;
    height: 13px;
    border: 1px solid var(--white);
    font-size: 10px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.type-form-inner-form {
    float: left;
    width: 100%;
    height: 610px;
    margin-bottom: 25px;
    background: #F6F6F6;
}

.type-form-left {
    float: left;
    width: 435px;
    height: 100%;
}

.type-form-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.type-form-right {
    float: left;
    width: calc(100% - 435px);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.type-form-right-body-wrap {
    float: left;
    width: 100%;
    height: 100%;
}

.type-form-right-body {
    float: left;
    width: 100%;
    height: calc(100% - 105px);
}

.type-form-right-body-inner {
    float: left;
    width: 100%;
    /* height: 100%; */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 60px 50px 0;
}

.type-main-header {
    float: left;
    width: 100%;
    font-family: 'Cormorant Upright';
    font-weight: 500;
    font-size: 34px;
    letter-spacing: 0;
    line-height: 34px;
    margin-bottom: 30px;
}

.type-small-header {
    float: left;
    width: 100%;
    font-family: 'Cormorant Upright';
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 34px;
    margin-bottom: 30px;
}

.type-form-input {
    float: left;
    width: 295px;
    display: flex;
    flex-direction: column;
    margin-bottom: 25px;
}

.type-form-input>label {
    float: left;
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: normal;
    color: var(--default-text);
    margin-bottom: 10px;
}

.form-input-box {
    float: left;
    width: 100%;
    position: relative;
}

.form-input-box input {
    float: left;
    width: 100%;
    height: 45px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
}

.form-input-box input:focus {
    border: 1px solid #FFC7AF;
}

.form-input-box .unit {
    position: absolute;
    right: 15px;
    top: 15px;
    font-family: 'Futura PT Book';
    font-size: 12px;
    letter-spacing: 0;
    line-height: 15px;
}

.type-form-right-footer {
    float: left;
    width: 100%;
    padding: 30px 50px;
    display: flex;
    justify-content: flex-end;
}

.type-form-btn {
    float: left;
    min-width: 165px;
    text-align: left;
    padding: 0 25px;
    height: 45px;
    border-radius: 4px;
    border: 0;
    background: #FF7A72;
    font-family: 'Cormorant Upright';
    color: var(--white);
    font-size: 13px;
    letter-spacing: 1px;
    line-height: 16px;
    box-shadow: -5px 5px 10px 0 rgba(0, 0, 0, 0.25);
    transition: .3s ease-out;
    text-transform: uppercase;
    cursor: pointer;
    position: relative;
}

.type-form-right-footer .type-form-btn {
    margin-left: 15px;
    min-width: 135px;
}

.multi-form-btn {
    float: left;
    min-width: 165px;
    padding: 0 25px;
    height: 45px;
    border-radius: 4px;
    border: 0;
    background: #FF7A72;
    font-family: 'Cormorant Upright';
    color: var(--white);
    font-size: 13px;
    letter-spacing: 1px;
    line-height: 16px;
    box-shadow: -5px 5px 10px 0 rgba(0, 0, 0, 0.25);
    transition: .3s ease-out;
    text-transform: uppercase;
    cursor: pointer;
    position: relative;
}

.type-form-right-footer .multi-form-btn {
    margin-left: 15px;
}

.multi-form-btn.submit {
    background: #769144;
}

.type-form-btn:before {
    content: "";
    background: var(--sprite-form) no-repeat -87px -4px;
    width: 20px;
    height: 12px;
    position: absolute;
    right: 20px;
    top: calc(50% - 6px);
}

.type-form-btn:hover {
    box-shadow: none;
}

.multi-form-btn:hover {
    box-shadow: none;
}

.type-form-checkbox {
    float: left;
    margin-bottom: 15px;
    position: relative;
}

.type-form-checkbox input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
}

.chk-indicator {
    float: left;
    height: 26px;
    width: 26px;
    border: 1px solid #FFC7AF;
    border-radius: 4px;
    background-color: var(--white);
    position: absolute;
    left: 0;
    top: 0;
}

.type-form-checkbox>label {
    float: left;
    width: auto;
    padding-left: 35px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 26px;
    margin: 0;
}

.type-form-checkbox input:checked+.chk-indicator:before,
.type-form-checkbox input.active+.chk-indicator:before {
    content: "";
    background: var(--sprite-form) no-repeat -125px -5px;
    width: 14px;
    height: 13px;
    position: absolute;
    left: 6px;
    top: calc(50% - 6.5px);
}

.form-input-box textarea {
    float: left;
    width: 100%;
    height: 105px;
    border-radius: 4px;
    padding: 10px 18px;
    font-size: 18px;
    font-family: 'Futura PT Book';
    letter-spacing: 0;
    line-height: 21px;
    background: var(--white);
    border: 1px solid transparent;
    transition: .3s ease-out;
    resize: none;
}

.form-input-box textarea:focus {
    border: 1px solid #FFC7AF;
}

.type-form-input.text {
    width: 100%;
    margin-top: 0px;
}

.inline-type-form-box {
    float: left;
    width: 100%;
    display: flex;
    margin-bottom: 25px;
}

.inline-type-form-box .type-form-input {
    margin-right: 12px;
    margin-bottom: 0;
}

.inline-type-form-box .type-form-input.small {
    max-width: 65px;
}

.form-select {
    float: left;
    width: 100%;
    height: 45px;
    position: relative;
}

.form-select select {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid #E8E8E8;
    padding: 0 50px 0 20px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
    cursor: pointer;
    transition: .3s ease-out;
}

.form-select:before {
    content: "";
    background: var(--sprite-form) no-repeat -111px -7px;
    width: 10px;
    height: 7px;
    position: absolute;
    right: 20px;
    top: calc(50% - 3.5px);
}

.form-select select:focus {
    border: 1px solid #FFC7AF;
}

.type-form-checkbox.agreement>label {
    font-size: 12px;
    letter-spacing: 0;
    line-height: 20px;
}

.agreement .chk-indicator {
    width: 20px;
    height: 20px;
}

.type-form-checkbox.agreement input:checked+.chk-indicator:before {
    left: 5px;
    zoom: .8;
}

.type-form-radio {
    float: left;
    margin-bottom: 15px;
    position: relative;
}

.type-form-radio>label {
    float: left;
    width: auto;
    padding-left: 35px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 26px;
    margin: 0;
}

.type-form-radio input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
    z-index: 1;
}

.rd-indicator {
    float: left;
    height: 26px;
    width: 26px;
    border: 1px solid #FFC7AF;
    border-radius: 50%;
    background-color: var(--white);
    position: absolute;
    left: 0;
    top: 0;
}

.type-form-radio input:checked+.rd-indicator:before,
.type-form-radio input.active+.rd-indicator:before {
    content: "";
    width: 16px;
    height: 16px;
    background: #FFC7AF;
    border-radius: 50%;
    position: absolute;
    left: 4px;
    top: calc(50% - 8px);
}

.type-form-input.files {
    width: 100%;
}

.form-upload-box {
    float: left;
    width: 100%;
    height: 115px;
    border-radius: 4px;
    border: 1px solid #E8E8E8;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 40px 0 20px;
    position: relative;
}

.form-upload-box input {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
    opacity: 0;
    z-index: 1;
}

.form-upload-box>label {
    font-size: 16px;
    letter-spacing: 0;
    line-height: 21px;
    font-family: 'Futura PT Book';
    margin: 0;
    position: relative;
}

.form-upload-box>label:before {
    content: "";
    background: var(--sprite-form) no-repeat -57px -23px;
    width: 13px;
    height: 13px;
    display: inline-block;
    margin-right: 10px;
}

.attached-group {
    float: left;
    width: 100%;
    margin-top: 10px;
    position: relative;
}

.tf-each-attach {
    float: left;
    display: flex;
    align-items: center;
    background: var(--white);
    border: 1px solid #ffc7af;
    border-radius: 4px;
}

.tf-attach-icon {
    float: left;
    width: 25px;
    height: 25px;
    background: #fff;
    border-right: 1px solid #ffc7af;
    border-radius: 4px 0 0 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tf-each-attach h5 {
    float: left;
    margin: 0 5px;
    font-size: 14px;
    font-weight: 400;
    font-family: 'Futura PT Book';
    line-height: 25px;
}

.tf-close {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    line-height: 0;
    margin-right: 8px;
    cursor: pointer;
}

.tf-close:before {
    content: "";
    background: var(--sprite-form) no-repeat -38px -1px;
    width: 18px;
    height: 18px;
    display: inline-block;
    zoom: .4;
}

.tf-attach-icon:before {
    content: "";
    background: var(--sprite-form) no-repeat -57px -23px;
    width: 13px;
    height: 13px;
    display: inline-block;
}

.type-form-header.finished {
    background: var(--default-color);
    box-shadow: inset 0 0px 0 0 #E8E8E8, 0 2px 50px 0 rgba(0, 0, 0, 0.25);
}

.finished .progress .progress-bar {
    width: 100% !important;
}

.finished .type-form-details h5 {
    color: var(--white);
}

.finished .form-prev-btn:before {
    background-position: -3px -21px;
}

.small .form-input-box input {
    padding: 0 10px 0 10px;
}

.type-form-container .form-finished-btn {
    float: left;
    height: 35px;
    width: 132px;
    border: 1px solid var(--white);
    color: var(--white);
    font-family: 'Cormorant Upright';
    font-size: 13px;
    letter-spacing: 2px;
    line-height: 16px;
    display: none;
}

.finished .type-form-container .form-finished-btn {
    display: block;
}

.finished .type-form-details h5:before {
    content: "";
    background: var(--sprite-form) no-repeat -39px -24px;
    width: 14px;
    height: 13px;
    display: inline-block;
    margin-right: 10px;
}

.type-form-inner.question-mode {
    padding: 30px 0;
}

.each-type-question {
    float: left;
    width: 100%;
    height: auto;
    border-radius: 24px;
    margin-bottom: 10px;
    display: flex;
}

.type-question-left {
    float: left;
    width: 50%;
    background: var(--white);
    border-radius: 24px 0 0 24px;
    padding: 25px 35px;
}

.type-question-left>p {
    float: left;
    width: 100%;
    font-family: 'Cormorant Upright';
    font-size: 13px;
    letter-spacing: 1px;
    line-height: 16px;
    margin-bottom: 20px;
}

.type-question-left>h5 {
    float: left;
    width: 100%;
    font-family: 'Cormorant Upright';
    font-size: 28px;
    letter-spacing: 0;
    line-height: 32px;
}

.type-question-right {
    float: left;
    width: 50%;
    /* height: 100%; */
    background: #F6F6F6;
    border-radius: 0 24px 24px 0;
    padding: 25px 35px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.question-mode .type-form-right-footer {
    margin-top: 10px;
    justify-content: center;
}

.question-mode .type-form-right-footer button {
    margin: 0 12px;
}

.type-form-btn.previous:before {
    right: auto;
    left: 20px;
    transform: rotate(180deg);
}

.type-form-btn.previous {
    text-align: right;
}

.bg-1 {
    background-image: url(images/bg-1.jpg);
}

.bg-2 {
    background-image: url(images/bg-2.jpg);
}

.type-form-radio-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 30px;
}

.type-form-radio-container>h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: normal;
    color: var(--default-text);
    margin-bottom: 10px;
}

.type-form-radio-container .type-form-radio:last-child {
    margin-bottom: 0
}

.type-form-input .rdt.form-type-input input {
    height: 45px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
}

.type-form-checkbox-container>h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: normal;
    color: var(--default-text);
    margin-bottom: 10px;
}

.type-form-checkbox-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 30px;
}

.type-form-checkbox-container .type-form-radio:last-child {
    margin-bottom: 0
}

.type-form-input .field-common .label-title-block>label {
    float: left;
    width: 100%;
    font-size: 16px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: normal;
    color: var(--default-text);
    margin-bottom: 10px;
}

.type-form-input .form-input-box input::placeholder {
    opacity: 0;
}

.type-form-input.text .form-input-box textarea::placeholder {
    opacity: 0;
}

.type-form-input .rdt.form-type-input input::placeholder {
    opacity: 0;
}

.type-form-input .btn-toggle.active {
    background: #FFC7AF;
}

.type-form-input .photo-capture-wrapper {
    background: var(--white);
    border-color: #FFC7AF;
}

.type-form-input .photo-capture-btn.take:before {
    filter: grayscale(100%);
}

.type-form-input.signature {
    float: left;
    width: 100%;
}

.type-form-input.signature>div {
    float: left;
    width: 100%;
}

.type-form-input.signature .signature-canvas {
    padding: 0;
    background: transparent;
    border: 0;
}

.type-form-input.signature .signature-canvas canvas {
    width: calc(100% - 20px) !important;
    background: var(--white);
    padding: 0;
    border: 1px solid #E4E6E9;
    border-radius: 3px !important;
    cursor: crosshair;
}

.type-form-input.signature .sig-preview {
    height: 104.5px;
    margin-top: 13px;
}

.type-form-input.signature .signature-left .label-title-block>label {
    float: left;
    font-size: 16px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: normal;
    color: var(--default-text);
    margin-bottom: 10px;
}

.type-form-input.signature .sig-preview:before {
    font-family: 'Futura PT Book';
    color: var(--default-text);
}

.type-form-input.signature .sig-button-block .general-btn.grey {
    box-shadow: -5px 5px 10px 0 rgba(0, 0, 0, 0.15);
}

.type-form-input.editor {
    width: 100%;
}

.type-form-input.editor .ql-toolbar.ql-snow {
    background: var(--white);
    border: 0 !important;
    border-radius: 4px 4px 0 0;
}

.type-form-input.editor .ql-container.ql-snow {
    background: var(--white);
    border-color: #E4E6E9;
    border-radius: 0 0 4px 4px;
}

.type-form-input.c-field .form-input-block-left .form-type-input {
    border-color: transparent;
    min-height: 45px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.type-form-input.onetime .fiels-inp-box {
    height: 45px;
    font-family: 'Futura PT Book';
    font-size: 17px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
    margin-bottom: 15px;
}

.type-form-input.rating .label-title-block .field-header {
    float: left;
    font-size: 16px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: normal;
    color: var(--default-text);
    margin-bottom: 10px;
}

.type-form-input.rating .feedback-block {
    margin-top: 14px;
    height: auto;
    display: flex;
    align-items: center;
}

.type-form-input.l-resources .field-button-block {
    margin-top: 10px;
}

.type-form-input.auto-fill .ind-task-input.selectize-custom {
    height: auto;
    min-height: 45px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
}

.type-form-input.auto-fill {
    width: 100%;
}

.type-form-input.auto-fill .selectize-custom .sl-tag {
    height: 25px;
    border-radius: 3px;
    background: var(--default-color);
    color: #fff;
    padding-right: 20px;
    margin: 5px 5px 5px 0;
}

.type-form-input.auto-fill .selectize-custom .sl-tag .tag-right {
    max-width: 150px;
    white-space: nowrap;
}

.type-form-input.auto-fill .selectize-custom .sl-tag .tag-right {
    color: #fff;
    padding: 0 5px;
    line-height: 25px;
    font-size: 12px;
    max-width: 100%;
    white-space: unset;
}

.type-form-input.auto-fill .tag-wrapper-bl input {
    margin: 5px 5px 5px 0;
}

.type-form-input-fieldset .ind-form-field .form-header-block h5 {
    font-family: 'Futura PT Book';
    color: var(--default-text);
}

.type-form-input-fieldset .ind-form-field p {
    font-family: 'Futura PT Book';
    color: var(--default-text);
}

.type-form-input-fieldset .field-set:before {
    background-color: rgb(255 199 175 / 0.2);
}

.type-form-input .error-fields {
    color: #e14745 !important;
    margin: 8px 0px;
}

.type-form-radio-container.red-alert {
    color: var(--default-text) !important;
}

.type-form-radio-container .error-fields {
    font-size: 14px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    color: #e14745 !important;
}

.type-form-checkbox-container.red-alert {
    color: var(--default-text) !important;
}

.type-form-checkbox-container .error-fields {
    font-size: 14px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    color: #e14745 !important;
}

.type-form-input.red-alert .form-select select {
    color: var(--default-text) !important;
}

.type-form-input.editor .ql-container {
    height: calc(100% - 42px);
}

.type-form-input.files.red-alert {
    color: var(--default-text) !important;
}

.type-form-input.files .upload-image-container {
    margin-top: 25px;
}

.type-form-input.files .form-download {
    right: 0;
    top: -2px;
}

.type-form-input.payment .field-button-block {
    margin-top: 10px;
}

.type-form-input.l-resources .field-button-block .general-btn,
.type-form-input.payment .field-button-block .general-btn {
    font-family: 'Futura PT Book';
    font-weight: 400;
}

.typeform-display-text {
    float: left;
    width: 100%;
    margin-top: 10px;
}

.typeform-display-text strong {
    font-weight: 600;
}

.typeform-display-text em {
    font-style: italic;
}

.type-form-input.onetime {
    width: 100%;
}

.type-form-input.onetime .otp-button-block {
    padding: 0;
}

.type-form-input.onetime .otp-button-block>* {
    font-family: 'Futura PT Book';
    font-weight: 400;
}

.type-form-input.onetime .otp-button-block .general-btn {
    font-weight: 400;
}

.type-form-input.onetime .field-header {
    display: none;
}

.finished .form-close-btn:before {
    background-position: -74px -22px;
}

.type-form-input.auto-fill .autofill-label {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: 17px;
    color: var(--default-text);
}

.type-form-input.editor .quill {
    border: 1px solid #e4e6e9;
    background: #fff;
    border-radius: 5px;
}

.each-type-question .form-input-box input::placeholder,
.each-type-question .form-input-box textarea::placeholder {
    opacity: 0;
}

.each-type-question .btn-toggle.active {
    background: #FFC7AF;
}

.each-type-question.editor .ql-container {
    height: calc(100% - 42px);
}

.each-type-question.editor .ql-toolbar.ql-snow {
    background: var(--white);
    border-color: #E4E6E9;
    border-radius: 4px 4px 0 0;
}

.each-type-question.editor .ql-container.ql-snow {
    background: var(--white);
    border-color: #E4E6E9;
    border-radius: 0 0 4px 4px;
}

.each-type-question.signature {
    float: left;
    width: 100%;
}

.each-type-question.signature .signature-canvas {
    padding: 0;
    background: transparent;
    border: 0;
}

.each-type-question.signature .signature-canvas canvas {
    width: calc(100% - 20px) !important;
    height: 110px;
    background: var(--white);
    padding: 0;
    border: 1px solid #E4E6E9;
    border-radius: 3px !important;
    cursor: crosshair;
}

.each-type-question.signature .sig-preview {
    height: 104.5px;
    margin-top: 0px;
}

.each-type-question.signature .signature-left .label-title-block>label {
    float: left;
    font-size: 14px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: 17px;
    color: var(--default-text);
    display: none;
}

.each-type-question.signature .sig-preview:before {
    font-family: 'Futura PT Book';
    color: var(--default-text);
}

.each-type-question.signature .sig-button-block .general-btn.grey {
    box-shadow: -5px 5px 10px 0 rgba(0, 0, 0, 0.15);
}

.each-type-question .form-type-input .form-control {
    float: left;
    width: 100%;
    height: 45px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
}

.each-type-question .form-type-input input.form-control::placeholder {
    opacity: 0;
}

.each-type-question .form-type-input input.form-control:focus {
    border: 1px solid #FFC7AF;
}

.each-type-question.dataload .fiels-inp-box {
    float: left;
    width: 100%;
    height: 45px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
}

.each-type-question.dataload .fiels-inp-box::placeholder {
    opacity: 0;
}

.each-type-question.dataload .fiels-inp-box:focus {
    border: 1px solid #FFC7AF;
}

.each-type-question.red-alert {
    color: inherit !important;
}

.type-question-right .error-fields {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: 17px;
    color: #e14745 !important;
    margin: 8px 0px;
}

.each-type-question.auto-fill .ind-task-input.selectize-custom {
    height: auto;
    min-height: 45px;
    font-family: 'Futura PT Book';
    font-size: 18px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
}

.each-type-question.auto-fill .selectize-custom .sl-tag {
    height: 25px;
    border-radius: 3px;
    background: var(--default-color);
    color: #fff;
    padding-right: 20px;
    margin: 5px 5px 5px 0;
}

.each-type-question.auto-fill .selectize-custom .sl-tag .tag-right {
    max-width: 150px;
    white-space: nowrap;
}

.each-type-question.auto-fill .selectize-custom .sl-tag .tag-right {
    color: #fff;
    padding: 0 5px;
    line-height: 25px;
    font-size: 12px;
    max-width: 100%;
    white-space: unset;
}

.each-type-question.auto-fill .tag-wrapper-bl input {
    margin: 5px 5px 5px 0;
}

.each-type-question.photocapture .photo-capture-wrapper {
    background: var(--white);
    border-color: #FFC7AF;
}

.each-type-question.photocapture .photo-capture-btn.take:before {
    filter: grayscale(100%);
}

.each-type-question.rating .label-title-block .field-header {
    float: left;
    font-size: 14px;
    letter-spacing: 0;
    font-family: 'Futura PT Book';
    line-height: 17px;
    color: var(--default-text);
    display: none;
}

.each-type-question.rating .feedback-block {
    margin-top: 14px;
    height: auto;
    display: flex;
    align-items: center;
}

.each-type-question.l-resources .field-button-block {
    margin-top: 10px;
}

.each-type-question.l-resources .field-button-block .general-btn,
.each-type-question.payment .field-button-block .general-btn {
    font-family: 'Futura PT Book';
    font-weight: 400;
}

.each-type-question.l-resources .form-resource-preview h5 {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    font-family: 'Futura PT Book';
    font-weight: 400;
}

.each-type-question.files .upload-image-container {
    display: none;
}

.each-type-question.files .type-question-right .upload-wrapper.sm-line {
    flex-direction: column;
}

.each-type-question.onetime .otp-button-block {
    padding: 0;
}

.each-type-question.onetime .otp-button-block>* {
    font-family: 'Futura PT Book';
    font-weight: 400;
}

.each-type-question.onetime .otp-button-block .general-btn {
    font-weight: 400;
}

.each-type-question.onetime .field-header {
    display: none;
}

.each-type-question.onetime .fiels-inp-box {
    height: 45px;
    font-family: 'Futura PT Book';
    font-size: 17px;
    letter-spacing: 0;
    line-height: 21px;
    border: 1px solid transparent;
    border-radius: 4px;
    background-color: var(--white);
    padding: 0px 50px 0 20px;
    transition: .3s ease-out;
    margin-bottom: 15px;
}

.each-type-question.photocapture .image-container img {
    float: left;
    width: 100%;
    border-radius: 5px;
}

.each-type-question.files .form-download {
    right: 0;
    top: -2px;
}

.each-type-question.red-alert .form-select select {
    color: var(--default-text) !important;
}

.each-type-question.photocapture .image-container {
    max-width: 225px;
}

.period-info-wrapper {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.period-info-header {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.period-info-header h5 {
    float: left;
    width: 100%;
    font-size: 20px;
    font-weight: 600;
    color: var(--default-text);
}

.period-info-body {
    float: left;
    width: 100%;
}

.each-info-panel {
    float: left;
    width: 100%;
    min-height: 64px;
    background: var(--white);
    border-radius: 10px;
    padding: 15px 20px;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, .1);
}

.each-info-panel p {
    float: left;
    width: 100%;
    margin-bottom: 8px;
    color: var(--default-grey);
    font-size: 12px;
    text-transform: uppercase;
}

.each-info-panel h5 {
    font-weight: 600;
    color: var(--default-text);
    font-size: 14px;
}

.period-info-body .col-md-3 {
    padding-right: 15px;
}

.period-info-body .col-md-3:last-child {
    padding-right: 0;
}

.period-table {
    float: left;
    width: 100%;
    height: calc(100% - 126px);
    max-width: calc(100vw - 110px);
    background: var(--white);
    border: 1px solid rgba(64, 83, 100, 0.15);
}

.period-table .table thead th {
    border: 0;
    min-width: 130px;
    color: #565656;
    font-size: 14px;
    line-height: 15px;
    font-weight: 600;
    padding: 12px 25px;
    line-height: 30px;
    background: var(--white);
    position: sticky;
    top: 0;
    z-index: 8;
    white-space: nowrap;
    vertical-align: middle;
    text-transform: uppercase;
    text-align: center;
}

.period-table .table tbody tr td {
    font-size: 16px;
    color: #555;
    padding: 12px 25px;
    line-height: 23px;
    border-color: rgba(64, 83, 100, 0.15);
    text-align: center;
}

.period-table .table thead th:first-child {
    min-width: 155px;
    left: 0;
    z-index: 9;
    text-align: left;
}

.period-table .table thead th:after {
    content: "";
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #e3e5e8;
    display: block;
    bottom: 0;
}

.period-table .table tbody tr:first-child td {
    border-top: 0;
}

.period-table .table tbody tr td:first-child {
    position: sticky;
    left: 0;
    z-index: 8;
    background: var(--white);
    text-align: left;
}

.period-tag {
    width: auto;
    font-size: 12px;
    border: 1px solid rgba(64, 83, 100, 0.15);
    background-color: #f4f4f4;
    padding: 0 8px;
    border-radius: 10px;
    text-transform: uppercase;
}

.vsevere-tag {
    background: #FF7A72;
    border-color: #FF7A72;
    color: var(--white);
}

.severe-tag {
    background: #FFBF83;
    border-color: #FFBF83;
    color: var(--white);
}

.moderate-tag {
    background: #786EB9;
    border-color: #786EB9;
    color: var(--white);
}

.mild-tag {
    background: #968FCB;
    border-color: #968FCB;
    color: var(--white);
}

.embedded-form .type-form-details h5:before {
    content: none;
}

.embedded-form .type-form-container button {
    display: none;
}

.embedded-form .type-form-right-body>div>div {
    overflow: auto !important;
}

.embedded-form .type-form-details {
    width: 100%;
}

.type-form-input .form-select select {
    background: var(--white);
}

.type-form-input.auto-fill .form-select:before {
    z-index: 1;
}

.type-form-input .rightButtons {
    right: -9px;
    top: auto;
    bottom: -9px;
    width: auto;
}

.ind-form-field.fieldset .type-form-input .rightButtons {
    transform: rotate(0deg);
    left: auto;
}

.type-form-input.preview {
    margin: 0;
    width: 100%;
}

.type-form-input.preview-panel {
    margin-bottom: 0;
}

.ind-form-field.fieldset .type-form-input .rightButtons .btnsubIcon {
    transform: rotate(0);
}

.type-form-input .btnsubIconsadd:before {
    background-position: -355px -332px;
    width: 17px;
    height: 17px;
}

.type-form-input .btnsubIcon:before {
    background-position: -328px -333px;
    width: 17px;
    height: 17px;
}

.type-form-input.video-capture .label-title-block,
.type-form-input.preview .label-title-block {
    display: none;
}

.type-form-input.displayimage {
    width: 100%;
}

.type-form-input.dataload .fiels-inp-box {
    background: var(--white);
    height: 45px;
    border-radius: 4px;
}

.video-capture .type-question-right .label-title-block,
.preview .type-question-right .label-title-block,
.displayimage .type-question-right .label-title-block,
.displayvideo .type-question-right .label-title-block {
    display: none;
}

/* Sepalika form End */

/* Sepalika Payment */

.payment-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
}

.pay-header {
    float: left;
    width: 100%;
    height: 70px;
    background: var(--white);
}

.pay-body {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.pay-logo {
    float: left;
    width: 148px;
}

.pay-logo img {
    float: left;
    width: 100%;
}

.pay-header-inner {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pay-body-header {
    float: left;
    width: 100%;
    height: 70px;
}

.pay-body-header-inner {
    float: left;
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
}

.back-to-list {
    font-size: 22px;
    font-weight: 600;
    font-family: 'Poppins';
    color: var(--default-text);
    cursor: pointer;
}

.back-to-list:before {
    content: "";
    background: var(--sprite-form) no-repeat -3px -4px;
    width: 30px;
    height: 12px;
    display: inline-block;
    margin-right: 15px;
}

.pay-body-content {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
}

.each-payment-package {
    float: left;
    width: 100%;
    height: 95px;
    background: var(--white);
    border-radius: 10px;
    margin-bottom: 20px;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, .1);
    cursor: pointer;
}

.package-left {
    float: left;
    width: 95px;
    height: 100%;
    border-radius: 10px 0 0 10px;
}

.package-left img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px 0 0 10px;
}

.package-right {
    float: left;
    width: calc(100% - 95px);
    height: 100%;
    padding-right: 110px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 15px 110px 15px 20px;
    position: relative;
}

.pay-body-content-inner .container {
    max-width: 70%;
}

.pay-body-content-inner {
    float: left;
    width: 100%;
    padding: 20px 0 0;
}

.package-right h5 {
    float: left;
    width: 100%;
    font-size: 16px;
    font-weight: bold;
    font-family: 'Poppins';
    color: var(--default-text);
    margin-bottom: 8px;
}

.package-right h6 {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-color);
    font-family: 'Poppins';
    margin-bottom: 8px;
}

.package-right p {
    float: left;
    width: 100%;
    font-size: 14px;
    color: var(--default-grey);
    font-family: 'Poppins';
    line-height: normal;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pay-amount {
    position: absolute;
    right: 20px;
    top: 15px;
    font-size: 14px;
    color: var(--default-text);
    font-family: 'Poppins';
    font-weight: 600;
}

.pay-field-button-block {
    float: left;
    width: 100%;
    margin: 40px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pay-field-button-block .general-btn {
    height: 55px;
    min-width: 220px;
    font-size: 14px;
    font-family: 'Poppins';
}

.each-payment-package.form {
    height: auto;
    padding: 20px 5px;
}

.each-payment-package.form * {
    font-family: Poppins;
}

.each-form-section {
    float: left;
    width: 50%;
    padding: 0 15px;
}

.each-form-section .each-inp-box {
    width: 100%;
}

.each-form-section h5 {
    float: left;
    width: auto;
    font-size: 14px;
    font-weight: 600;
    color: var(--default-text);
    line-height: 22px;
    margin-bottom: 0;
    border-bottom: #dc143c;
}

.form-section-header {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.form-section-header .select-chk-block .control {
    font-size: 12px;
    color: var(--default-grey);
}

.each-form-section .each-inp-box>label {
    font-size: 12px;
}

/* Sepalika Payment End */

/* Attendance */

.attendance-container {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
}

.subpage-wrapper {
    float: left;
    width: 100%;
    height: 100%;
    padding: 20px;
}

.subpage-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.leave-dashboard {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.each-leave-card {
    float: left;
    width: calc((100% / 7) - 18px);
    height: 60px;
    border-radius: 3px;
    background: var(--white);
    margin-right: 20px;
    border: 1px solid #e4e5e9;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.each-leave-card:last-child {
    margin-right: 0;
}

.each-leave-card h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 25px;
    min-height: 25px;
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.each-leave-card h5:before {
    content: "";
    width: 20px;
    height: 15px;
    background: var(--default-grey);
    display: inline-block;
    margin-right: 10px;
}

.each-leave-card p {
    float: left;
    width: 100%;
    font-size: 11px;
    color: var(--default-grey);
    letter-spacing: 0;
    line-height: 15px;
    text-transform: uppercase;
}

.each-leave-card .paid-leave:before {
    background: #FFE0DD;
}

.each-leave-card .casual-leave:before {
    background: #FFE7CB;
}

.each-leave-card .sick-leave:before {
    background: #F0F1CD;
}

.each-leave-card .fest-leave:before {
    background: #E3F7DE;
}

.each-leave-card .national-leave:before {
    background: #D5FAF4;
}

.each-leave-card .unpaid-leave:before {
    background: #E2E7FF;
}

.each-leave-card .compo-leave:before {
    background: #FFE6F8;
}

.recent-dashboard {
    float: left;
    width: 100%;
    display: flex;
}

.profile-card {
    float: left;
    width: 372px;
    height: auto;
    border-radius: 3px;
    padding: 15px 20px;
    background-color: #FFFFFF;
    border: 1px solid #e4e5e9;
    margin-right: 20px;
}

.profile-card h5 {
    float: left;
    width: 100%;
    font-size: 20px;
    color: var(--default-text);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 25px;
    margin-bottom: 15px;
}

.profile-card-img {
    float: left;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin-right: 13px;
}

.profile-card-img img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 2px solid var(--btn-color);
    padding: 2px;
}

.profile-card-det {
    float: left;
    width: calc(100% - 93px);
}

.profile-card-det li {
    float: left;
    width: 100%;
    color: var(--text-color);
    font-size: 12px;
    letter-spacing: 0;
    line-height: 20px;
}

.profile-card-det li span {
    color: var(--default-grey);
    margin-left: 5px;
}

.date-card {
    float: left;
    width: calc(100% - 392px);
    border-radius: 3px;
    background-color: #FFFFFF;
    box-shadow: 0 0.5px 3px 0 rgba(0, 0, 0, .1);
    display: flex;
    overflow: hidden;
}

.date-card .recent-table {
    float: left;
    width: 100%;
}

.recent-table thead tr th {
    color: var(--default-grey);
    font-size: 12px;
    letter-spacing: 0;
    line-height: 20px;
    padding: 7px 20px;
    background: var(--white);
    position: sticky;
    left: 0;
    top: 0;
}

.recent-table tbody tr td {
    font-size: 12px;
    letter-spacing: 0;
    line-height: 20px;
    color: var(--default-text);
    padding: 3px 20px;
    vertical-align: middle;
}

.recent-table tbody tr:nth-child(odd) td {
    background: #FAFAFA;
}

.calendar-select-block {
    float: left;
    width: 100%;
    height: auto;
    border-radius: 3px;
    background-color: #FFFFFF;
    border: 1px solid #e4e5e9;
}

.leave-calendar-block {
    float: left;
    width: 100%;
    height: 100%;
}

.leave-calendar-left {
    float: left;
    width: 305px;
    height: 100%;
    margin-right: 20px;
    border-radius: 3px;
    background-color: #FFFFFF;
    border: 1px solid #e4e5e9;
}

.leave-calendar-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 20px;
}

.leave-calendar-header h5 {
    float: left;
    width: 100%;
    color: var(--default-text);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 25px;
}

.leave-calendar-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    overflow: hidden;
}

.list-table {
    float: left;
    width: 100%;
}

.list-table li {
    float: left;
    width: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 24px;
    color: var(--default-grey);
    padding: 6px 20px;
}

.list-table li:nth-child(odd) {
    background: #F4F4F4;
}

.leave-calendar-right {
    float: left;
    width: calc(100% - 325px);
    height: 100%;
    border-radius: 3px;
    background-color: #FFFFFF;
    border: 1px solid #e4e5e9;
}

.leave-apply-block {
    float: left;
    width: 100%;
    height: 100%;
}

.leave-apply-panel {
    float: left;
    width: 100%;
    height: calc(100% - 80px);
    background: var(--white);
    border-radius: 3px;
    border: 1px solid #e4e5e9;
}

.apply-panel-header {
    float: left;
    width: 100%;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.apply-panel-header h5 {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 25px;
    color: var(--default-text);
}

.panel-switch li {
    float: left;
}

.panel-switch li nav {
    float: left;
    padding: 0 15px;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 30px;
    border-radius: 3px;
    color: var(--default-text);
    cursor: pointer;
}

.panel-switch li.active nav {
    background: var(--default-color);
    color: var(--white);
    font-weight: 600;
}

.apply-panel-body {
    float: left;
    width: 100%;
    height: calc(100% - 65px);
    overflow: hidden;
    border-radius: 0 0 10px 10px;
}

.apply-panel {
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 0 0 10px 10px;
}

.leave-list-table .recent-table {
    float: left;
    width: 100%;
}

.leave-list-table .recent-table thead tr th {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 30px;
    color: var(--default-text);
    position: sticky;
    left: 0;
    top: 0;
    background: var(--white);
}

.leave-list-table .recent-table tbody tr td {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 30px;
    color: var(--default-grey);
}

.leave-approved:before {
    content: "";
    background: var(--sprite-two) no-repeat -437px -411px;
    width: 11px;
    height: 8px;
    display: inline-block;
    zoom: 1.3;
}

.leave-rejected:before {
    content: "";
    background: var(--sprite-two) no-repeat -348px -365px;
    width: 9px;
    height: 10px;
    display: inline-block;
    zoom: 1.3;
}

.leave-apply-form {
    float: left;
    width: 100%;
    padding: 0 20px 20px;
}

.leave-form-split {
    float: left;
    width: 65%;
    margin-bottom: 20px;
}

.each-field {
    float: left;
    width: calc((100% / 2) - 10px);
    height: 60px;
    margin-right: 20px;
    border: 1px solid #E3E5E8;
    border-radius: 3px;
    position: relative;
}

.each-field:last-child {
    margin-right: 0;
}

.each-field select {
    float: left;
    width: 100%;
    height: 100%;
    border: 0;
    padding: 8px 20px 0 19px;
    border-radius: 3px;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    color: var(--default-text);
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

.each-field>label {
    position: absolute;
    left: 20px;
    top: 10px;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 15px;
    color: var(--default-grey);
    z-index: 1;
}

.each-field .input-text {
    float: left;
    width: 100%;
    height: 100%;
}

.each-field .input-text input {
    float: left;
    width: 100%;
    height: 100%;
    padding: 8px 20px 0px;
    border: 0;
    border-radius: 10px;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    color: var(--default-text);

}

.each-field .input-text input::placeholder {
    color: var(--default-text) !important;
}

.each-field.fl-select:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 4.5px 0 4.5px;
    border-color: var(--default-grey) transparent transparent transparent;
    position: absolute;
    right: 20px;
    top: calc(50% - 2.5px);
}

.leave-form-button-block {
    float: left;
    width: 65%;
}

.leave-form-button-block .general-btn {
    float: left;
    width: calc(50% - 10px);
    height: 50px;
    border-radius: 3px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 20px;
    box-shadow: none;
}

.leave-form-button-block .general-btn:before {
    content: "";
    background: var(--sprite-two) no-repeat -108px -116px;
    width: 14px;
    height: 11px;
    display: inline-block;
    margin-right: 10px;
}

.holiday-set-block {
    float: left;
    width: 100%;
    height: 100%;
}

.holiday-panel {
    float: left;
    width: calc((100% / 2) - 10px);
    min-height: 290px;
    height: 100%;
    border-radius: 3px;
    background: var(--white);
    margin-right: 20px;
    border: 1px solid #e4e5e9;
}

.holiday-panel:last-child {
    margin-right: 0;
}

.leave-calendar-body .recent-table {
    float: left;
    width: 100%;
}

.leave-calendar-body .recent-table tbody tr td {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 30px;
    color: var(--default-grey);
    padding-top: 0;
    padding-bottom: 0;
}

.dashboard-cont {
    float: left;
    width: 100%;
    display: flex;
    margin-bottom: 20px;
}

.calendar-select-block .calendar {
    float: left;
    width: 100%;
}

.calendar-select-block .calendar .day-headers th {
    border-top: 1px solid #DEE0E3;
    border-bottom: 1px solid #DEE0E3;
    color: var(--default-text);
    text-align: center;
    padding: 10px 0;
    font-size: 11px;
    font-weight: 600;
    width: 1%;
    border-right: 1px solid #DEE0E3;
}

.calendar-select-block .calendar .day-headers th.bolder {
    color: #E14845;
    background: #F4F4F4;
}

.calendar-select-block .calendar tbody tr td {
    padding: 10px 0;
    color: var(--default-text);
    border-bottom: 1px solid #DEE0E3;
    border-right: 1px solid #DEE0E3;
    font-size: 12px;
    text-align: center;
    position: relative;
}

.calendar-select-block .calendar tbody tr td:first-child {
    text-align: left;
    padding: 5px 10px;
    font-weight: 600;
    width: 2%;
}

.calendar-select-block .calendar tbody tr td.bolder {
    color: #E14845;
    background: #F4F4F4;
}

.attendance-btn {
    float: left;
    width: 165px;
    height: 165px;
    background: #03b86e;
    border: 0;
    border-radius: 3px;
    font-weight: 600;
    color: var(--white);
    margin-left: 20px;
    padding: 0;
    flex-shrink: 0;
    box-shadow: 0 0.5px 3px 0 rgb(0 0 0 / 10%);
    transition: .3s ease-out;
}

.attendance-btn:hover {
    background: rgb(3 184 110 / 75%);
}

.attendance-btn.started {
    background: var(--default-color);
}

.attendance-btn.started:hover {
    background: rgb(63 169 245 / 75%);
}

.each-field .input-text .rdt.form-type-input {
    width: 100%;
    height: 100%;
}

.each-field .input-text .rdt.form-type-input .rdtPicker {
    bottom: auto !important;
    top: 55px;
}

.each-field .input-text.date-picker:after {
    content: "";
    background: var(--sprite-one) no-repeat -220px -156px;
    width: 15px;
    height: 16px;
    position: absolute;
    right: 20px;
    top: 20px;
}

.each-field .input-text.date-picker input {
    padding-right: 0px;
    padding-right: 0;
    background: transparent;
    z-index: 1;
    position: relative;

}

.full-width-text .each-field {
    width: 100%;
    margin: 0;
    height: 110px;
}

.full-width-text .each-field .input-text textarea {
    float: left;
    width: 100%;
    height: 100%;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    resize: none;
    border: 0;
    padding: 10px 20px;
    border-radius: 10px;
}

.each-file-upload {
    float: left;
    width: 100%;
    height: 100%;
    position: relative;
}

.each-file-upload input[type="file"] {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    cursor: pointer;
    opacity: 0;
}

.each-file-upload label {
    float: left;
    width: 100%;
    height: 100%;
    padding: 24px 20px 0px;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    position: relative;
}

.each-file-upload label:before {
    content: "";
    background: var(--sprite-one) no-repeat -189px -406px;
    width: 17px;
    height: 14px;
    display: inline-block;
    zoom: .8;
    margin-right: 6px;
    position: relative;
}

.approval-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.approval-wrapper .leave-apply-panel {
    height: 100%;
}

.new-leave {
    font-size: 14px;
    font-weight: 600;
    color: #32cd32;
}

.search-button {
    float: left;
    height: 30px;
    line-height: 29px;
    border: 1px solid var(--default-grey);
    border-radius: 15px;
    padding: 0 14px;
    color: var(--default-grey);
    font-size: 14px;
    position: relative;
    cursor: pointer;
}

.search-button:before {
    background-position: -163px -249px;
    width: 14px;
    height: 14px;
    margin-right: 5px;
    position: relative;
    top: 2px;
}

.sort-overlay {
    float: left;
    width: 270px;
    background: #fff;
    padding: 0px 0;
    border: 1px solid #EAEAEA;
    border-radius: 4px;
    box-shadow: 0 5px 7px 0 rgb(0 0 0 / 15%);
}

.each-field-input {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.each-field-input>label {
    float: left;
    width: 100%;
    font-size: 12px;
    font-weight: 600;
    color: var(--default-grey);
    margin-bottom: 5px;
}

.each-field-input input[type="text"] {
    float: left;
    width: 100%;
    height: 35px;
    border: 1px solid #e4e5e9;
    color: var(--default-text);
    border-radius: 3px;
    padding: 0 15px;
}

.each-field-input .select-box select {
    padding-left: 15px;
    height: 35px;
    font-size: 14px;
}

.each-leave-details {
    float: left;
    width: 100%;
}

.each-leave-details .profile-card {
    width: 100%;
    padding: 15px 20px 20px;
    margin: 0 0 20px 0;
    box-shadow: none;
    border-top: 1px solid #eceff2;
    border-bottom: 1px solid #eceff2;
    border-radius: 0;
    background: var(--col-active);
    position: sticky;
    top: 0;
    left: 0;
    z-index: 1;
}

.leave-application-block {
    float: left;
    width: 100%;
    padding: 0 20px 20px 20px;
}

.each-leave-application {
    float: left;
    width: 100%;
    background: #fafafa;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    border: 1px dashed var(--default-color);
}

.leave-application h5 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    color: var(--default-text);
}

.leave-application p {
    font-size: 14px;
    margin-bottom: 5px;
    color: var(--default-grey);
}

.action-btn {
    float: left;
    height: 35px;
    line-height: 35px;
    background: transparent;
    border: 0;
    padding: 0 15px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    margin-left: 10px;
    position: relative;
}

.action-btn.reject {
    background: #e14745;
    color: var(--white);
}

.action-btn.approve {
    background: #0F9D58;
    color: var(--white);
}

.approval-wrapper .leave-list-table .recent-table tbody tr td {
    cursor: pointer;
    transition: .3s ease-out;
    border-bottom: 1px solid #e4e5e9;
}

.approval-wrapper .leave-list-table .recent-table tbody tr:hover td {
    background: var(--col-active);
}

.apply-panel-header .backto-list {
    color: var(--default-grey);
    font-size: 14px;
    font-weight: 600;
    line-height: 15px;
    border: 0;
    padding: 0;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td:first-child {
    font-weight: 600;
    width: 20%;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.low-wid {
    width: 20%;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td:last-child {
    width: 40%;
}

.remark-textarea {
    float: left;
    width: 100%;
}

.remark-textarea textarea {
    float: left;
    width: 100%;
    height: 100px;
    min-height: 100px;
    max-height: 75px;
    padding: 5px 15px;
    border: 1px solid #e4e5e9;
    border-radius: 10px;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td {
    padding: 15px 20px;
    vertical-align: top;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td .select-box select {
    border-radius: 10px;
}

.calendar-select-block.muster-month .calendar .day-headers th {
    border-top: 1px solid #e4e5e9;
    cursor: pointer;
}

.calendar-select-block.muster-month .calendar .day-headers th:hover {
    background: var(--col-active);
}

.calendar-select-block.muster-month .calendar .day-headers th:first-child {
    width: 5%;
    cursor: auto;
}

.calendar-select-block.muster-month .calendar .day-headers th:first-child:hover {
    background: var(--white);
}

.row-select {
    float: left;
    width: 100%;
}

.row-select .select-box {
    margin-bottom: 15px;
}

.row-select .select-box:last-child {
    margin-bottom: 0;
}

.calendar-controls {
    float: left;
    width: 100%;
    height: 40px;
    background: var(--col-active);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px 3px 0 0;
}

.calendar-controls .control {
    padding: 0;
    font-size: 0;
    width: 20px;
    height: 20px;
    background: transparent;
    border-radius: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .3s ease-out;
}

.calendar-controls .control:hover {
    background: #e7e7e7;
}

.calendar-controls .current-year {
    font-size: 16px;
    font-weight: 600;
    margin: 0 10px;
    color: var(--default-color);
}

.calendar-controls .control:first-child:before {
    content: "";
    background: var(--sprite-two) no-repeat -423px -173px;
    width: 5px;
    height: 8px;
    display: inline-block;
    transform: rotate(180deg);
}

.calendar-controls .control:last-child:before {
    content: "";
    background: var(--sprite-two) no-repeat -423px -173px;
    width: 5px;
    height: 8px;
    display: inline-block;
}

.backto-btn {
    float: left;
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--default-text);
    font-weight: 600;
    padding-left: 22px;
    position: relative;
}

.backto-btn:before {
    content: "";
    background: var(--sprite-two) no-repeat -61px -141px;
    width: 14px;
    height: 13px;
    position: absolute;
    left: 0;
    top: 2px;
}

.apply-panel-header .ex-cel-ico {
    padding: 0 15px;
    height: 35px;
    line-height: 35px;
}

.apply-panel-header .ex-cel-ico:before {
    position: relative;
    top: 2px;
}

.calendar-select-block.report-calendar {
    box-shadow: none;
}

.calendar-select-block.report-calendar .calendar th {
    vertical-align: middle;
}

.calendar-select-block.report-calendar .calendar .day-headers th:first-child {
    text-align: left;
    padding: 10px;
    font-size: 14px;
}

.calendar-select-block.report-calendar .calendar .day-headers .month-name {
    min-width: 250px;
    padding: 10px;
}

.calendar-select-block.report-calendar .calendar .day-headers .month-name .select-box select {
    border: 0;
    padding-left: 0px;
    font-weight: 600;
    height: auto;
}

.calendar-select-block.report-calendar .calendar tbody tr td:first-child {
    font-size: 14px;
}

.calendar-select-block.report-calendar .calendar tbody tr td {
    font-size: 10px;
}

.calendar-select-block.report-calendar .calendar tbody tr .month-name {
    text-align: left;
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
}

.calendar-select-block.report-calendar {
    box-shadow: none;
}

.report-calendar .calendar-controls {
    border-top: 1px solid #DEE0E3;
    background: var(--col-active);
    border-radius: 0;
}

.leave-calendar {
    float: left;
    width: 100%;
    height: 100%;
}

.leave-calendar .form-type-input {
    float: left;
    width: 100%;
    height: 100%;
}

.leave-calendar .rdtPicker {
    display: block;
    float: left;
    width: 100%;
    height: 100%;
    border: 0 !important;
    margin: 0;
    border-radius: 10px;
}

.leave-calendar .rdtPicker .rdtDays {
    float: left;
    width: 100%;
    height: 100%;
}

.leave-calendar .rdtPicker table {
    float: left;
    width: 100%;
    height: 100%;
}

.leave-calendar .rdtPicker thead tr:first-child th:first-child {
    border-top-left-radius: 10px;
}

.leave-calendar .rdtPicker thead tr:first-child th:last-child {
    border-top-right-radius: 10px;
}

.leave-calendar .rdtPicker tbody tr td {
    border-right: 1px solid #EDF0F2;
    border-bottom: 1px solid #EDF0F2;
    font-size: 18px;
    line-height: 23px;
    text-align: right;
    vertical-align: top;
    padding: 15px;
}

.leave-calendar .rdtPicker tbody tr td:last-child {
    border-right: 0;
}

.leave-calendar .rdtPicker tbody tr:last-child td {
    border-bottom: 0;
}

.leave-calendar .rdtPicker tbody tr td.rdtToday {
    background-color: var(--col-active) !important;
    color: var(--default-color);
    font-weight: 600;
}

.leave-calendar .rdtPicker tbody tr td:hover {
    background-color: transparent !important;
}

.leave-calendar .rdtPicker td.rdtDisabled,
.rdtPicker td.rdtDisabled:hover {
    color: rgb(133 133 133 / 50%);
}

.leave-calendar .rdtPicker td.rdtOld,
.rdtPicker td.rdtNew {
    color: rgb(133 133 133 / 50%);
}

.leave-calendar .rdtPicker .dow {
    background-color: var(--default-color) !important;
    color: var(--white);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.23px;
    line-height: 18px;
    padding: 14px;
}

.calendar-select-block.muster-month {
    box-shadow: none;
    border-top: 1px solid #e4e5e9;
    border-radius: 0;
}

.calendar-select-block.muster-month .calendar-controls {
    background: var(--white);
}

.cal-month {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cal-month button {
    float: left;
    width: 14px;
    height: 14px;
    background: transparent;
    border: 0;
    padding: 0;
    font-size: 0;
    border-radius: 50%;
    margin: 0 5px;
    transition: .3s ease-out;
}

.cal-month button:hover {
    background: #e7e7e7;
}

.cal-month button:first-child:before {
    content: "";
    background: var(--sprite-two) no-repeat -423px -173px;
    width: 5px;
    height: 8px;
    display: inline-block;
    transform: rotate(180deg);
}

.cal-month button:last-child:before {
    content: "";
    background: var(--sprite-two) no-repeat -423px -173px;
    width: 5px;
    height: 8px;
    display: inline-block;
}

.current-month {
    color: var(--default-color);
}

.calendar-select-block.muster-month .calendar .day-headers th.dateSelected {
    background: var(--default-color);
    color: var(--white);
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.low-wid .select-chk-block label {
    font-size: 14px;
}

.leave-btn-block {
    float: left;
    width: 100%;
    margin: 15px 0 0 0;
    display: flex;
    justify-content: flex-end;
}

.leave-btn-block .general-btn {
    height: 35px;
    border-radius: 15px;
}

.calendar-select-block.muster-month .calendar .day-headers th.dateDisable {
    pointer-events: none;
    opacity: .3;
    background: #f5f5f5;
}

.fixed-bottom-block {
    float: left;
    width: 100%;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 20px;
    background: var(--white);
    border-top: 1px solid #e4e5e9;
    border-radius: 0 0 10px 10px;
    position: sticky;
    left: 0;
    bottom: 0;
}

.leave-list-table.with-save {
    float: left;
    width: 100%;
    height: 100%;
}

.approval-wrapper .leave-list-table.with-save .recent-table.muster tbody tr:last-child td {
    border-bottom: 0;
}

.fixed-bottom-block .general-btn {
    border-radius: 25px;
}

.leave-calendar .rdtPicker thead tr:first-child th {
    height: 45px;
    background-color: var(--col-active) !important;
}

.leave-calendar .rdtPicker thead tr:first-child th.rdtSwitch {
    font-size: 16px;
    color: var(--default-color);
    pointer-events: none;
}

.previousdate .recent-table tbody tr:nth-child(odd) td {
    background: inherit;
}

.leave-form-split .assign-user-validation-err {
    margin: 0;
}

.leave-apply-form .attachment-task-group {
    margin: 0 0 20px 0;
}

.leave-apply-form .attachment-task-group .ind-attach-list:last-child {
    margin-bottom: 0;
}

.workCompleted:after {
    content: "";
    background: var(--sprite-two) no-repeat -413px -366px;
    width: 8px;
    height: 7px;
    position: absolute;
    right: 4px;
    bottom: 4px;
}

.paid {
    background: #ffe0dd;
    cursor: pointer;
}

.casual {
    background: #ffe7cb;
    cursor: pointer;
}

.sick {
    background: #f0f1cd;
    cursor: pointer;
}

.festival {
    background: #e3f7de;
    cursor: pointer;
}

.national {
    background: #d5faf4;
    cursor: pointer;
}

.unpaid,
.UL-H,
.UL {
    background: #e2e7ff;
    cursor: pointer;
}

.UL,
.UL-H {
    color: red !important;
}

.combo {
    background: #ffe6f8;
    cursor: pointer;
}

.maternity {
    background: #CBE4E4;
    cursor: pointer;
}

/* .WH-H, .WH {
    background: #e1f5fe;
} */
.lv-rejected {
    color: #e14745;
    font-weight: 600;
}

.tag-leave {
    width: 20px;
    height: 20px;
    background: #ccc;
    border: 1px solid #e4e5e9;
    border-radius: 50%;
    display: inline-block;
    margin: 0 6px;
    position: relative;
    top: 0;
}

.co {
    background: #ffe6f8;
}

.co:before {
    content: "CO";
    width: 18px;
    height: 18px;
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cl {
    background: #ffe7cb;
}

.cl:before {
    content: "CL";
    width: 18px;
    height: 18px;
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pl {
    background: #ffe0dd;
}

.pl:before {
    content: "PL";
    width: 18px;
    height: 18px;
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sl {
    background: #f0f1cd;
}

.sl:before {
    content: "SL";
    width: 18px;
    height: 18px;
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.up {
    background: #e2e7ff;
}

.up:before {
    content: "UP";
    width: 18px;
    height: 18px;
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ml {
    background: #CBE4E4;
}

.ml:before {
    content: "ML";
    width: 18px;
    height: 18px;
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ticked {
    background: #4caf50;
    border-color: #4caf50;
    top: 5px;
}

.ticked:before {
    content: "";
    background: var(--sprite-two) no-repeat -353px -118px;
    width: 11px;
    height: 8px;
    position: absolute;
    left: calc(50% - 5.5px);
    top: calc(50% - 4px);
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td .leave-btn-block {
    margin: 0;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td .leave-btn-block .general-btn {
    padding: 0 20px;
    background: transparent;
    box-shadow: none;
    color: var(--default-color);
}

.apply-panel-body.without-hd {
    height: 100%;
}

.without-hd .calendar-controls {
    border-radius: 10px 10px 0 0;
}

.without-hd .calendar-select-block.muster-month {
    border-radius: 10px 10px 0 0;
    border-top: 0;
}

.apply-panel .loadmore-block {
    position: absolute;
    left: 0;
    bottom: 20px;
}

.calendar-select-block .calendar .day-headers th:last-child {
    border-right: 0;
}

.calendar-select-block .calendar tbody tr td:last-child {
    border-right: 0;
}

.calendar-select-block .calendar tbody tr:last-child td {
    border-bottom: 0;
}

.each-leave-application .ind-attach-list h5 {
    margin: 0;
    font-weight: 600;
    font-size: 14px;
}

.leave-application {
    width: 60%;
}

.date-leave {
    font-size: 18px;
    font-weight: 300;
    color: var(--default-grey);
    text-align: center;
    line-height: normal;
    margin-bottom: 5px;
}

.date-mod .modal-body .padding-20 {
    padding: 20px;
}

.recent-dashboard .carousel {
    float: left;
    width: calc(100% - 392px);
    border-radius: 3px;
    border: 1px solid #e4e5e9;
}

.recent-dashboard .carousel-item .date-card {
    width: 100%;
    height: 165px;
    padding-bottom: 30px;
}

.recent-dashboard .carousel-control-next,
.recent-dashboard .carousel-control-prev {
    display: none;
}

.recent-dashboard .carousel-indicators li {
    width: 10px;
    height: 10px;
    background: var(--default-color);
    border: 0;
    border-radius: 50%;
}

.recent-dashboard .carousel-indicators {
    bottom: 10px;
    z-index: 9;
}

.single-card-duration .carousel-indicators {
    display: none;
}

.leave-calendar .rbc-toolbar {
    float: left;
    width: 100%;
    height: 55px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    background: var(--col-active);
    border-radius: 3px 3px 0 0;
}

.leave-calendar .rbc-toolbar .rbc-toolbar-label {
    float: left;
    color: var(--default-color);
    font-weight: 600;
}

.leave-calendar .rbc-btn-group button {
    background: var(--col-active);
    color: var(--default-grey);
    border-color: #e6e6e6;
}

.leave-calendar .rbc-month-header {
    float: left;
    width: 100%;
    height: 45px;
}

.leave-calendar .rbc-month-view {
    display: flex !important;
}

.leave-calendar .rbc-header {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--default-color) !important;
    color: var(--white);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -.23px;
    line-height: 18px;
    padding: 14px;
    border: 0 !important;
}

.leave-calendar .rbc-off-range-bg {
    background: var(--white);
}

.leave-calendar .rbc-day-bg {
    padding: 15px;
}

.leave-calendar .rbc-date-cell {
    padding: 15px;
    font-size: 18px;
    font-weight: 700;
    line-height: 23px;
    color: var(--default-text);
}

.leave-calendar .rbc-row-segment {
    padding: 0 15px;
    width: auto;
    height: 70px;
    position: relative;
}

.leave-calendar .rbc-event {
    width: auto;
    height: auto;
    min-width: 24px;
    padding: 5px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 10px;
    position: absolute;
    left: 15px;
    bottom: 25px;
    font-size: 14px;
    background: 0 0;
    color: var(--default-grey);
}

.leave-calendar .rbc-date-cell.rbc-now.rbc-current {
    color: var(--default-color);
}

.leave-calendar .rbc-event.rbc-selected {
    background: transparent;
    color: var(--default-color);
}

.leave-calendar .rbc-toolbar button:active:hover,
.leave-calendar .rbc-toolbar button:active:focus,
.leave-calendar .rbc-toolbar button.rbc-active:hover,
.leave-calendar .rbc-toolbar button.rbc-active:focus,
.leave-calendar .rbc-toolbar button:hover,
.leave-calendar .rbc-toolbar button:active,
.leave-calendar .rbc-toolbar button.rbc-active,
.leave-calendar .rbc-toolbar button:focus {
    color: var(--default-color);
    background: var(--default-color);
}

.leave-calendar .rbc-btn-group button:first-child {
    display: none;
}

.leave-calendar .rbc-btn-group button:nth-child(even) {
    width: 25px;
    height: 25px;
    font-size: 0;
    padding: 0;
    border-radius: 50% !important;
    background: var(--default-color);
    margin-right: 10px;
    border: 0;
}

.leave-calendar .rbc-btn-group button:nth-child(odd) {
    width: 25px;
    height: 25px;
    border-radius: 0;
    font-size: 0;
    padding: 0;
    border-radius: 50% !important;
    background: var(--default-color);
    border: 0;
}

.leave-calendar .rbc-btn-group button:nth-child(odd):before {
    content: "";
    background: var(--sprite-one) no-repeat -405px -474px;
    width: 14px;
    height: 8px;
    display: inline-block;
    transform: rotate(90deg);
    zoom: .8;
}

.leave-calendar .rbc-btn-group button:nth-child(even):before {
    content: "";
    background: var(--sprite-one) no-repeat -405px -474px;
    width: 14px;
    height: 8px;
    display: inline-block;
    transform: rotate(-90deg);
    zoom: .8;
}

.leave-calendar .rbc-date-cell.rbc-off-range {
    color: #d5d5d5;
}

.single-card-duration .carousel-item .date-card {
    padding-bottom: 0;
}

.subpage-inner.full-height {
    height: 100%;
}

.white-box-panel {
    float: left;
    width: 100%;
    height: 100%;
    display: flex;
}

.white-panel-left {
    float: left;
    width: 300px;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 0.5px 3px 0 rgb(0 0 0 / 10%);
    margin-right: 20px;
}

.white-panel-right {
    float: left;
    width: calc(100% - 300px);
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 0.5px 3px 0 rgb(0 0 0 / 10%);
}

.white-panel-header {
    float: left;
    width: 100%;
    height: 50px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.white-panel-header h5 {
    font-size: 16px;
    font-weight: 600;
    color: var(--default-text);
}

.white-panel-header .add-ico:before {
    background-position: -355px -333px;
    width: 17px;
    height: 17px;
}

.white-panel-header .add-ico {
    background: transparent;
    padding: 0;
    border: 0;
    line-height: 0;
    cursor: pointer;
}

.white-panel-body-wrapper {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.white-panel-body-wrapper .wa-each-accord-search-bar {
    height: 50px;
    background: #fefefe;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea;
}

.white-panel-body-wrapper .wa-each-accord-search-bar:before {
    opacity: 1;
    left: 20px;
    z-index: 1;
}

.white-panel-body-wrapper .wa-each-accord-search-bar input {
    color: var(--default-text);
    font-size: 14px;
    padding-left: 30px;
}

.white-panel-body {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.white-panel-body-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.combo-date-listing {
    float: left;
    width: 100%;
}

.combo-date-listing li {
    float: left;
    width: 100%;
    font-size: 14px;
    line-height: 40px;
    background-image: url(images/line-texture.png);
    color: var(--default-grey);
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px dashed #ccc;
    padding: 0 15px 0 40px;
    border-radius: 0px;
    margin-bottom: 10px;
    cursor: pointer;
    position: relative;
}

.combo-date-listing li:hover .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.combo-date-listing li:before {
    content: "";
    background: var(--sprite-one) no-repeat -375px -159px;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 15px;
}

.white-panel-right-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #eaeaea;
}

.white-panel-right-header h5 {
    color: var(--default-color);
    font-weight: 600;
}

.white-panel-right-body-wrapper {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    display: flex;
}

.white-panel-right-body-left {
    float: left;
    width: 50%;
}

.white-panel-right-body-right {
    float: left;
    width: 50%;
    border-left: 1px solid #eaeaea;
}

.white-panel-right-body-left .white-panel-header {
    border-bottom: 1px solid #eaeaea;
}

.white-panel-right-body-content {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.white-panel-right-body-right .wa-each-accord-search-bar {
    height: 50px;
    background: #fefefe;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea;
}

.white-panel-right-body-right .wa-each-accord-search-bar:before {
    opacity: 1;
    left: 20px;
}

.white-panel-right-body-right .wa-each-accord-search-bar input {
    color: var(--default-text);
    font-size: 14px;
    padding-left: 30px;
}

.non-member-content {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}

.combo-date-listing li.active {
    border-color: var(--default-color);
    color: var(--default-color);
}

.combo-date-listing li:hover {
    border-color: var(--default-color);
}

.wa-each-accord-search-bar .rdtPicker {
    bottom: auto !important;
    top: 40px !important;
}

.reschedule-wrapper .rdtPicker {
    bottom: auto !important;
    top: 40px !important;
}

.wa-each-accord-search-bar .date-clear {
    right: 20px;
}

.wa-each-accord-search-bar:hover .date-clear {
    opacity: 1;
    pointer-events: auto;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.paid {
    background: #ffe0dd;
    cursor: pointer;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.maternity {
    background: #cbe4e4;
    cursor: pointer;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.combo {
    background: #ffe6f8;
    cursor: pointer;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.casual {
    background: #ffe7cb;
    cursor: pointer;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.sick {
    background: #f0f1cd;
    cursor: pointer;
}

.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.paid .leave-btn-block .general-btn,
.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.maternity .leave-btn-block .general-btn,
.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.combo .leave-btn-block .general-btn,
.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.casual .leave-btn-block .general-btn,
.approval-wrapper .leave-list-table .recent-table.muster tbody tr td.sick .leave-btn-block .general-btn {
    background: var(--white);
}

.leave-calendar-body .recent-table tbody tr:hover td .wf-btn-block {
    opacity: 1;
    pointer-events: auto;
}

.flex-column-direct .modal-body {
    flex-direction: column;
    padding: 20px;
}

.flex-column-direct .reschedule-wrapper {
    margin: 0;
}

.flex-column-direct .form-type-input .form-control {
    height: 40px;
}

.calendar-select-block.report-calendar .calendar .day-headers .month-name {
    background: var(--col-active);
}

.calendar-select-block.report-calendar .calendar .day-headers .month-name .select-box select {
    color: red;
    background: var(--col-active);
}

.calendar-select-block.report-calendar .calendar .day-headers .month-name .select-box select option {
    color: var(--default-text);
}

.calendar-select-block.report-calendar .calendar .day-headers .month-name .calendar-controls {
    height: auto;
    border: 0;
}

.calendar-select-block.report-calendar.stat .calendar .day-headers th {
    border-top: 0;
    position: sticky;
    left: 0;
    top: 0;
    z-index: 1;
    border-bottom: 0;
}

.calendar-select-block.report-calendar.stat .calendar .day-headers th:before {
    content: "";
    width: 100%;
    height: 1px;
    background: #dee0e3;
    position: absolute;
    left: 0;
    bottom: 0;
}

.calendar-select-block.report-calendar.stat .calendar .day-headers th:first-child {
    border-radius: 10px 0 0 0;
}

.calendar-select-block.report-calendar.stat .calendar tbody tr td {
    font-size: 14px;
}

.calendar-select-block.report-calendar.stat .calendar .day-headers th.sl-no {
    width: 0;
    background: var(--white);
}

.approval-wrapper .leave-apply-panel.stat-panel {
    overflow: hidden;
}

.calendar-select-block.report-calendar.stat .calendar .day-headers th.month-name {
    width: 5%;
}

.calendar-select-block.report-calendar.stat .calendar tbody td {
    cursor: pointer;
}

.work-status {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 12px;
}

.work-status span:first-child {
    color: #2196f3;
}

.work-status span:last-child {
    color: #4caf50;
}

.calendar-select-block.report-calendar .calendar tbody tr td {
    vertical-align: middle;
}

.daily-status-wrapper {
    float: left;
    width: 100%;
    height: calc(100% - 170px);
    max-width: calc(100vw - 310px);
    border-radius: 10px;
    background: var(--white);
    box-shadow: 0 0.5px 3px 0 rgb(0 0 0 / 10%);
    margin-right: 0;
    overflow: hidden;
}

.subpage-wrapper.with-header-top {
    height: calc(100% - 60px);
}

.daily-status-wrapper .table-responsive {
    float: left;
    width: 100%;
    height: 100%;
}

.status-table {
    width: 100%;
    margin: 0;
}

.status-table thead th {
    border: 0;
    border-bottom: 0;
    border-right: 1px solid #dee0e3;
    vertical-align: middle;
    text-align: center;
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    white-space: nowrap;
    min-width: 150px;
    position: sticky;
    top: 0;
    background: var(--col-active);
    color: var(--default-color);
}

.status-table thead tr:last-child th {
    top: 37px;
}

.status-table thead th:before {
    content: "";
    width: 100%;
    height: 1px;
    background: #dee0e3;
    position: absolute;
    left: 0;
    bottom: 0;
}

.status-table thead tr:first-child th:last-child {
    border-right: 0;
}

.status-table tbody tr td {
    border: 0;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    text-align: center;
    font-size: 14px;
    color: var(--default-grey);
}

.status-table tbody tr td:last-child {
    border-right: 0;
}

.leave-calendar-right .rbc-day-bg+.rbc-day-bg,
.leave-calendar-right .rbc-month-row+.rbc-month-row {
    border-color: #e4e5e9 !important;
}

.leave-calendar-right .rbc-month-view {
    border-width: 0 !important;
}

/* Attendance End */

/* Patient */

.patient-wrapper {
    float: left;
    width: 100%;
    height: 100%;
}

.patient-wrapper .side-menu-right.w-pad {
    float: left;
}

.patient-right {
    float: left;
    width: calc(100% - 220px);
    height: 100%;
}

.filter-container {
    float: left;
    width: 100%;
    height: calc(100% - 110px);
}

.filter-accordion.accordion {
    float: left;
    width: 100%;
}

.filter-accordion.accordion .card {
    background: transparent;
    border: 0;
}

.filter-accordion.accordion>.card .card-header {
    float: left;
    width: 100%;
    height: auto;
    min-height: 40px;
    color: var(--category-head);
    background: transparent;
    font-size: 11px;
    line-height: 14px;
    text-transform: uppercase;
    padding: 12px 40px 12px 20px;
    cursor: pointer;
    position: relative;
}

.filter-accordion.accordion>.card .card-header:after {
    content: "";
    background: var(--sprite-one) no-repeat -310px -96px;
    width: 5px;
    height: 8px;
    position: absolute;
    right: 25px;
    top: 17px;
    transform: rotate(-180deg);
    transition: .3s ease-out;
}

.filter-accordion.accordion>.card .card-header.active:after {
    transform: rotate(-90deg);
}

.filter-accordion.accordion .card-body {
    float: left;
    width: 100%;
    padding: 10px 20px;
}

.filter-accordion.accordion .card-body .select-wrap {
    margin: 0;
}

.filter-accordion.accordion .card-body .select-chk-block {
    color: var(--sub-category-head);
    padding-right: 2px;
    margin-bottom: 12px;
    width: 100%;
    font-size: 16px;
    line-height: normal;
    padding-left: 15px;
}

.filter-accordion.accordion .card-body .control-indicator {
    width: 13px;
    height: 13px;
    border-color: var(--sub-category-head);
    border-radius: 2px;
    top: 5px;
    background: var(--sidemenu-checkbox);
}

.filter-accordion.accordion .card-body .control .inp-chk:checked~.control-indicator,
.filter-accordion.accordion .card-body.control .inp-chk.active+.control-indicator {
    background: var(--default-color);
    border-color: var(--checkbox-active-border);
}

.patient-right-wrap {
    float: left;
    width: 100%;
    height: calc(100% - 60px);
    padding: 20px;
    overflow-y: auto;
}

.each-patient {
    float: left;
    width: calc((100% / 2) - 9px);
    height: 165px;
    background: var(--white);
    border-radius: 5px;
    padding: 20px;
    margin-right: 18px;
    margin-bottom: 18px;
    transition: .4s ease-out;
    cursor: pointer;
}

.each-patient:nth-child(2n) {
    margin-right: 0;
}

.patient-thumb {
    float: left;
    width: 80px;
    height: 80px;
    border-radius: 5px;
}

.patient-thumb img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.patient-details {
    float: left;
    width: calc(100% - 101px);
    padding-left: 20px;
}

.each-patient:hover {
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2);
}

.patient-details h5 {
    float: left;
    width: 100%;
    font-size: 20px;
    color: var(--default-text);
    font-weight: 600;
    margin-bottom: 5px;
}

.patient-details-info li {
    float: left;
    width: 100%;
    color: var(--default-grey);
    line-height: normal;
    margin-bottom: 5px;
    padding-left: 20px;
    position: relative;
}

.patient-email:before {
    background-position: -119px -73px;
    width: 12px;
    height: 9px;
    position: absolute;
    left: 0;
    top: 7px;
}

.patient-phone:before {
    background-position: -138px -74px;
    width: 9px;
    height: 9px;
    position: absolute;
    left: 0;
    top: 7px;
}

.patient-place:before {
    background-position: -153px -71px;
    width: 10px;
    height: 13px;
    position: absolute;
    left: 0;
    top: 4px;
}

.filter-accordion.accordion .card-body .radio-wrapper.eq-height-filter {
    margin: 0;
    display: flex;
}

.filter-accordion.accordion .card-body .radio-wrapper.eq-height-filter .task-input-block {
    margin: 0 10px 0 0;
}

.filter-accordion.accordion .card-body .radio-wrapper.eq-height-filter .task-input-block:last-child {
    margin-right: 0;
}

.filter-accordion.accordion .card-body .radio-wrapper.eq-height-filter .task-input-block .task-input-box {
    height: 35px;
    padding: 0 10px;
}

.patient-program:before {
    background: var(--sprite-two) no-repeat -167px -405px;
    width: 10px;
    height: 10px;
    position: absolute;
    left: 0;
    top: 5px;
}

.filter-accordion .select-chk-block .control {
    font-size: 14px;
    line-height: normal;
}

.filter-accordion .select-chk-block .control-indicator {
    top: 3px;
}

/* Patient End */

/* Grid Template */

.grid-template .modal-body {
    background: #ecf0f1;
}

.grid-container {
    float: left;
    width: 100%;
    height: calc(100% - 81px);
    overflow-y: auto;
}

.each-grid-header {
    float: left;
    width: 100%;
    background: var(--white);
    border-top: 1px solid #e4e6e9;
    padding: 0 0 0 15px;
}

.each-field-header {
    float: left;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    font-weight: 600;
    background: var(--white);
}

.each-field-header h5 {
    color: var(--default-text);
}

.each-grid-body {
    float: left;
    width: 100%;
    padding: 12px 0 12px 15px;
    border-top: 1px solid #e4e6e9;
}

.each-grid-body:nth-child(odd) {
    background: #fafafa;
}

.each-grid-body:nth-child(even) {
    background: #fff;
}

.grid-each-field {
    float: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.each-grid-body .grid-each-field {
    margin: 0;
}

.each-grid-body .grid-each-field.grid-inp-box {
    width: calc(100% - 15px);
}

.each-grid-body .grid-each-field.grid-inp-box input.fiels-inp-box {
    float: left;
    width: 100%;
    border: 1px solid #e4e6e9;
    border-radius: 5px;
    background-color: #fff !important;
    height: 40px;
    padding: 0 15px;
    font-size: 14px;
    transition: .3s ease-out;
}

.each-grid-body .grid-each-field.grid-inp-box textarea.fiels-inp-box {
    float: left;
    width: 100%;
    border: 1px solid #e4e6e9;
    border-radius: 5px;
    background-color: #fff !important;
    min-height: 40px;
    padding: 0 15px;
    font-size: 14px;
    transition: .3s ease-out;
}

.each-grid-body .grid-each-field.grid-inp-box .label-title-block {
    display: none;
}

.grid-each-field .rightButtons {
    width: auto;
    top: 30px;
    right: 8px;
    z-index: 9;
}

/* Grid Template End */

/* Booking */

.each-booking-list {
    float: left;
    width: calc((100% / 2) - 10px);
    background: var(--white);
    border-radius: 5px;
    padding: 20px;
    margin-right: 20px;
    margin-bottom: 20px;
    transition: .3s ease-out;
}

.each-booking-list:nth-child(2n) {
    margin-right: 0;
}

.each-booking-list:hover {
    box-shadow: 0 1px 6px 0 rgb(0 0 0 / 20%);
}

.event-image {
    float: left;
    width: 120px;
    height: 120px;
    margin-right: 20px;
}

.event-image img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.event-description-wrapper {
    float: left;
    width: calc(100% - 140px);
}

.booking-description {
    float: left;
    width: 100%;
    height: auto;
    min-height: 89px;
    margin-bottom: 15px;
    padding-bottom: 18px;
    border-bottom: 1px solid #eceff2;
}

.booking-description h5 {
    float: left;
    width: 100%;
    font-size: 20px;
    color: var(--default-color);
    font-weight: 600;
    line-height: normal;
    margin-bottom: 5px;
    padding-right: 35px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.booking-description p {
    float: left;
    width: 100%;
    font-size: 16px;
    line-height: normal;
    color: var(--default-grey);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.booking-footer {
    float: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.booking-footer p {
    font-size: 12px;
    text-transform: uppercase;
    color: var(--default-grey);
}

.event-modal .modal-content {
    height: 100%;
}

.event-modal .modal-lg {
    max-width: 65%;
    height: 80%;
}

.event-modal .modal-body {
    padding: 0;
}

.event-container {
    float: left;
    width: 100%;
    height: 100%;
}

.event-container {
    float: left;
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #e2e8ef;
}

.event-left {
    float: left;
    width: 60%;
    height: 100%;
    border-right: 1px solid #e2e8ef;
}

.event-inner {
    float: left;
    width: 100%;
    padding: 20px;
}

.single-line-box {
    float: left;
    width: 100%;
}

.single-line-box .each-inp-box {
    width: 100%;
    margin-right: 0;
}

.each-inp-box.text-area textarea {
    float: left;
    width: 100%;
    height: 150px;
    border: 1px solid #dee1e4;
    border-radius: 5px;
    resize: none;
    padding: 10px 20px;
}

.split-header {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    margin-top: 10px;
}

.split-header:first-child {
    margin-top: 0;
}

.split-header h5 {
    float: left;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    color: var(--default-color);
}

.event-right {
    float: left;
    width: 40%;
    height: 100%;
    background: #fafafa;
}

.room-accordion {
    float: left;
    width: 100%;
}

.room-accordion .card {
    border-color: #e2e8ef;
}

.room-accordion .card-header .btn-link {
    text-align: left;
    width: 100%;
    color: var(--default-color);
    font-weight: 600;
    position: relative;
}

.room-accordion .card-header .btn-link:after {
    content: "";
    background: var(--sprite-one) no-repeat -278px -472px;
    width: 12px;
    height: 8px;
    position: absolute;
    right: 20px;
    top: calc(50% - 0px);
    zoom: .9;
    transition: .3s ease-out;
}

.room-accordion .card-header .btn-link:hover,
.room-accordion .card-header .btn-link:focus {
    text-decoration: none;
}

.room-accordion .card-body {
    padding: 13px;
}

.each-room-select {
    float: left;
    width: 100%;
    border: 1px solid #e2e8ef;
    border-radius: 5px;
    margin-bottom: 14px;
    position: relative;
}

.each-room-select figure {
    float: left;
    width: 85px;
    height: 85px;
    border-right: 1px solid #e2e8ef;
}

.each-room-select figure img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 5px 0 0 5px;
}

.roomlist-description {
    float: left;
    width: calc(100% - 85px);
    height: 85px;
    padding: 12px 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.roomlist-description h5 {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 7px;
    padding-right: 15px;
}

.roomlist-description p {
    float: left;
    width: 100%;
    color: var(--default-grey);
    font-size: 14px;
    margin-bottom: 5px;
}

.each-room-select .radio-block {
    position: absolute;
    right: 0px;
    top: 0;
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 5px;
}

.each-room-select .radio-block label:before {
    left: auto;
    right: 10px;
    top: 10px;
}

.each-room-select .radio-block label:after {
    left: auto;
    right: 0;
}

.each-room-select .radio-block input:checked+label:after {
    left: auto;
    right: 14px;
    top: 14px;
}

.event-inner .react-datepicker__input-container {
    height: 40px;
    border: 0;
}

.event-inner .react-datepicker__input-container:after {
    background-position: -220px -156px;
    width: 15px;
    height: 16px;
    top: 12px;
}

.with-no-img .roomlist-description {
    width: 100%;
}

.event-inner .form-error-text {
    margin-top: 10px;
    margin-bottom: 0;
}

.event-inner .each-inp-box input.val-error {
    border: 1px solid #ff9393 !important;
}

.event-inner .each-inp-box textarea.val-error {
    border: 1px solid #ff9393 !important;
}

.each-room-select .select-chk-block {
    float: left;
    width: 100%;
    height: 87px;
    position: absolute;
    right: 0px;
    top: 0;
    margin: 0;
}

.each-room-select .control-indicator {
    top: 15px;
    left: auto;
    right: 15px;
}

.each-room-select .control .inp-chk {
    width: 100%;
    height: 87px;
    z-index: 1;
    cursor: pointer;
}

.three-per .each-inp-box {
    width: calc((100% / 3) - 10px);
}

.three-per .each-inp-box:nth-child(2n) {
    margin-right: 15px;
}

.three-per .each-inp-box:nth-child(3n) {
    margin-right: 0;
}

/* Booking End */

/* Bulk Message */

.bulk-generation .each-field-block {
    float: left;
    width: 100%;
    padding: 20px 15px;
    border-bottom: 1px solid #eceff1;
}

.bulk-generation .each-field-block .each-inp-box {
    width: auto;
    margin-bottom: 0;
}

.bulk-generation .each-field-block .each-inp-box>label {
    margin: 0;
}

.bulk-generation .select-wrapper .select-chk-block {
    width: auto;
    padding: 0;
    margin-right: 20px;
}

.bulk-generation .input-block.expandable-textarea {
    border-bottom: 1px solid #eceff1;
    margin-bottom: 6px;
}

.task-tg .bulk-generation .ind-task-input .lb-tx {
    flex-shrink: 0;
}

.task-tg .bulk-generation .select-box select {
    height: 50px;
    padding: 0 20px;
}

.dynamic-creation.bulk-generation .new-task-input.text-input {
    height: 165px;
    border-bottom: 1px solid #eceff1;
}

.bulk-generation .radio-wrapper .radio-block label {
    font-size: 14px;
    color: var(--default-grey);
}

/* Bulk Message End */

/* Learn Mobile */

.show-sm {
    display: none;
}

/* Learn Mobile End */

/* Organization */

.tab-holder.user-ui.user-height {
    height: 100%;
}

.workflow-task-wrapper .wid-40 .user-tr .user-td {
    width: 100%;
}

.org-table .section-wrap-box .flex-contain-box {
    padding-left: 20px;
}

.org-table .section-wrap-box {
    margin: 0;
    border-top: 1px solid #e3e5e8;
    padding: 15px 0;
}

.org-details .learn-tab {
    border-top: 0;
}

.data-view.field-form.org-block .data-holder {
    height: calc(100% - 127px);
}

/* Organization End */

/* Calendar */

.e-datepicker .e-model-header {
    background-color: var(--default-color) !important;
}

.e-calendar .e-content td.e-today.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected.e-focused-date span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-today.e-selected:hover span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-selected:hover span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
    background: var(--default-color) !important;
}

.e-calendar .e-content td.e-today span.e-day,
.e-calendar .e-content td.e-focused-date.e-today span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-today span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-focused-date.e-today span.e-day {
    border: 1px solid var(--default-color) !important;
    color: var(--default-color) !important;
}

.e-btn.e-flat.e-primary,
.e-css.e-btn.e-flat.e-primary {
    color: var(--default-color) !important;
}

.e-calendar .e-content td.e-today.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected.e-focused-date span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-today.e-selected:hover span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-selected:hover span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
    background-color: var(--default-color) !important;
}

.e-calendar .e-content td.e-today.e-selected span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-today.e-selected span.e-day {
    background-color: var(--default-color) !important;
    color: var(--white) !important;
}

.e-calendar .e-content td.e-today.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected:hover span.e-day,
.e-calendar .e-content td.e-selected.e-focused-date span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-today.e-selected:hover span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-selected:hover span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-selected.e-focused-date span.e-day {
    background-color: var(--default-color) !important;
}

.e-calendar .e-content td.e-selected span.e-day,
.e-bigger.e-small .e-calendar .e-content td.e-selected span.e-day {
    background-color: var(--default-color) !important;
}

.e-btn.e-flat.e-primary:active,
.e-btn.e-flat.e-primary.e-active,
.e-css.e-btn.e-flat.e-primary:active,
.e-css.e-btn.e-flat.e-primary.e-active {
    background-color: var(--col-active) !important;
}

.e-datetime-wrapper .e-input-group-icon.e-icons.e-active {
    color: var(--default-color) !important;
}

.e-datetimepicker.e-popup .e-list-parent.e-ul .e-list-item.e-active {
    color: var(--default-color) !important;
}

.progress-listing {
    justify-content: center !important;
    overflow-x: unset !important;
}

.progress-listing li {
    min-width: auto !important;
}

.progress-listing li:after {
    right: auto !important;
    left: 85px !important;
}

/* Calendar End */

/* Menu Logout */
.min-tab.logout {
    bottom: 35px;
    cursor: pointer;
}

.min-tab.logout:hover {
    background: var(--theme-third);
}

.icon-in.icon-logout {
    background: var(--sprite-six) no-repeat;
    background-position: -45px -5px;
    width: 18px;
    height: 18px;
}

/* Menu Logout End*/

/*------ Media Query ------*/

@media screen and (max-width: 1440px) and (min-width: 1201px) {

    /*------ Login ------*/


    /*------ Login End ------*/


    /*------ Dashboard ------*/

    .dash-wrapper-left {
        width: 300px;
    }

    .dash-wrapper-right {
        width: calc(100% - 300px);
    }

    .static-counter li {
        margin-right: 10px;
        padding: 12px 5px;
        width: calc((100% / 4) - 8px);
    }

    .static-block p {
        font-size: 10px;
    }

    .scrollable {
        overflow: auto;
        overflow-y: auto;
        width: 100%;
    }

    .table.dash-tab {
        width: 900px;
    }

    .static-mode-block .scrollable {
        height: calc(100% - 16px);
    }

    .rater-ratio .text-label {
        margin-right: 10px;
    }

    /*------ Dahboard End ------*/

    /*------ Task ------*/



    /*------ Task End ------*/

    /*------ Task Details ------*/

    .workflow-addon-left {
        width: 300px;
    }

    .workflow-addon-right {
        width: 250px;
    }

    .workflow-addon-center {
        width: calc(100% - 590px);
    }

    .forms-list li {
        width: 100%;
    }

    /*------ Task Details End ------*/

    /*------ User ------*/

    .team-card {
        width: calc((100% / 3) - 10px);
    }

    .team-card:nth-child(4n) {
        margin-right: 15px;
    }

    .team-card:nth-child(3n) {
        margin-right: 0;
    }

    /*------ User End ------*/

    /*------ User Details ------*/



    /*------ User Details End ------*/

    /*------ Chat ------*/



    /*------ Chat End ------*/

    /*------ Collection ------*/



    /*------ Collection End ------*/

    /*------ Collection Details ------*/

    .set-container.user-settings-cont {
        padding-right: 0;
        padding-bottom: 0;
    }

    .user-settings-cont .form-table,
    .user-settings-cont .next-stage-selector {
        height: 100%;
    }

    .user-settings-cont .scrollable {
        height: 100%;
    }

    .user-settings-cont .form-table table {
        min-width: 2000px;
    }

    .user-settings-cont .form-table table .with-card-preview .table.form-preview-table tbody tr td,
    .with-card-preview .table.form-preview-table tbody tr th {
        width: 50%;
        word-break: break-word;
    }

    .fixed-container {
        width: 50%;
    }

    .left-panel.multi-card-record .card-container {
        width: 50%;
    }

    .with-card-preview .table.form-preview-table.v-align tbody tr td,
    .with-card-preview .table.form-preview-table.v-align tbody tr th {
        width: 100%;
    }


    /*------ Collection Details End ------*/

    /*------ Forms ------*/


    /*------ Forms End ------*/

    /*------ Forms Details ------*/


    /*------ Forms Details End ------*/

    /*------ Workflow ------*/



    /*------ Workflow End ------*/

    /*------ Workflow Details ------*/



    /*------ Workflow Details End ------*/

    /*------ Workflow Task Entity ------*/



    /*------ Workflow Task Entity End ------*/

    /*------ Entity ------*/


    /*------ Entity End ------*/

    /*------ Entity Details ------*/


    /*------ Entity Details End ------*/

    /*------ Task Pool ------*/


    /*------ Task Pool End ------*/

    /*------ Pool ------*/



    /*------ Pool End ------*/

    /*------ Project ------*/



    /*------ Project End------*/

    /*------ Project Details ------*/

    .pj-first-left-section h5 {
        max-width: 44%;
    }

    .ind-team-user {
        width: calc((100% / 3) - 10px);
    }

    .ind-team-user:nth-child(4n) {
        margin-right: 15px;
    }

    .ind-team-user:nth-child(3n) {
        margin-right: 0;
    }

    .ibt-rating-top h5 {
        font-size: 12px;
    }

    .small-tab-header h5 {
        font-size: 14px;
    }

    .dataroom-manager-header-left {
        float: left;
        width: 40%;
    }

    .dataroom-manager-header-center {
        float: left;
        width: 30%;
    }

    .dataroom-manager-header-right {
        float: left;
        width: 30%;
    }

    .dataroom-option li {
        margin-left: 29px;
    }

    .search-dataroom {
        width: 250px;
    }

    .dataroom-option {
        float: left;
        display: flex;
        justify-content: flex-end;
        width: 100%;
    }

    .pj-dash .dash-wrapper-left {
        width: 225px;
    }

    .pj-dash .dash-wrapper-right {
        width: calc(100% - 225px);
    }

    .ind-overview-status p {
        font-size: 12px;
    }

    .ind-overview-status p:before {
        top: 3px;
    }

    .overview-status {
        margin-bottom: 5px;
    }

    .dash-wrapper-right-center .task-counter {
        padding-left: 0;
    }

    .dash-wrapper-right-center .task-counter-text {
        margin-right: 25px;
    }

    .ind-stakeholders-list {
        width: calc((100% / 3) - 14px);
    }

    .ind-stakeholders-list:nth-child(4n) {
        margin-right: 20px;
    }

    .ind-stakeholders-list:nth-child(3n) {
        margin-right: 0px;
    }

    .ibt-body .content-left {
        width: 333px;
    }

    .ibt-body .lg-tab {
        width: calc(100% - 353px);
    }

    .ibt-body .rater-ratio {
        flex-direction: column;
        align-items: normal;
    }

    .ibt-body .rater-ratio .rate-ratio {
        margin-left: 0;
    }

    .content-left {
        float: left;
        width: 333px;
    }

    .lg-tab {
        width: calc(100% - 353px);
        margin-right: 0;
        height: 200px;
        padding-bottom: 0;
    }

    .content-left {
        float: left;
        width: 333px;
    }

    .lg-tab {
        width: calc(100% - 353px);
        margin-right: 0;
        height: 200px;
        padding-bottom: 0;
    }

    .rater-ratio .rate-ratio {
        margin-left: 0;
    }

    .text-by {
        font-size: 12px;
    }

    .ind-performence-rate p {
        font-size: 10px;
    }

    .project-collection-wrap .form-detail-top-right .data-search-box {
        width: 250px;
    }

    /*------ Project Details End ------*/

    /*------ Resources ------*/


    /*------ Resources End ------*/

    /* Call Module */

    .call-right {
        width: 290px;
    }

    .call-note-block {
        height: 50%;
    }

    .recommend-add-block {
        height: 50%;
    }

    .call-left {
        width: calc(100% - 290px);
    }

    .call-note-right {
        width: 280px;
    }

    .call-note-left {
        width: calc(100% - 300px);
    }

    .week-round li {
        margin-right: 5px;
    }

    .week-round li:nth-child(2n) {
        margin-right: 15px;
    }

    .call-header {
        height: 75px;
    }

    .call-body {
        height: calc(100% - 75px)
    }

    .call-note-tab-block {
        width: 230px;
    }

    .call-note-divide .call-note-tab-block {
        width: 165px;
    }

    .call-note-card-block {
        width: calc(100% - 185px);
    }

    .each-recomment-list {
        padding-left: 15px;
    }

    .intake-content,
    .lab-content,
    .photo-content,
    .presc-content,
    .progress-content,
    .period-content {
        width: calc(100% - 250px);
    }

    .progress-block .call-note-left .call-note-tab-block {
        width: 165px;
    }

    .progress-block .call-note-left .progress-content {
        width: calc(100% - 185px);
    }

    .progress-table-header-col:first-child {
        min-width: 195px;
    }

    .progress-table-body-col:first-child {
        min-width: 179px;
        max-width: 179px;
    }

    .attribute-info p {
        font-size: 14px;
    }

    .attribute-info h5 {
        font-size: 34px;
    }

    .each-status-row li {
        width: 40px;
    }

    .progress-content-inner {
        padding-right: 15px;
    }

    .offset-block {
        width: 193px;
    }

    .progress-table-body-col {
        min-width: calc((100% / 7) - 31px);
        margin-right: 8px;
    }

    .progress-table-header-col {
        min-width: calc((100% / 7) - 36px);
        padding: 5px 0 0 5px;
        margin-right: 8px;
    }

    .overlay-block {
        width: calc(100% - 218px);
    }

    .progress-table-body-row {
        padding: 15px;
    }

    .col-overlay {
        width: calc((100% / 7) - 7px);
        margin-right: 8px;
    }

    .call-body-filter {
        margin-bottom: 0;
    }

    .call-body-content {
        height: calc(100% - 90px);
    }

    .ql-snow.ql-toolbar button,
    .ql-snow .ql-toolbar button {
        width: auto;
        padding: 3px;
    }

    .ql-toolbar.ql-snow .ql-formats {
        margin: 0 !important;
    }

    .recommendation-textarea .ql-container.ql-snow {
        height: calc(100% - 23px);
    }


    /* Call Module End */

    /* Booking */

    .event-modal .modal-lg {
        max-width: 80%;
        height: 80%;
    }

    /* Booking End */

}

@media screen and (max-width: 1300px) and (min-width: 1201px) {


    /*------ Login ------*/

    /*------ Login End ------*/

    /*------ Dashboard ------*/

    /*------ Dahboard End ------*/

    /*------ Task ------*/

    /*------ Task End ------*/

    /*------ Task Details ------*/

    /*------ Task Details End ------*/

    /*------ User ------*/

    .ind-group-list {
        width: calc((100% / 3) - 14px);
    }

    .ind-group-list:nth-child(4n) {
        margin-right: 20px;
    }

    .ind-group-list:nth-child(3n) {
        margin-right: 0;
    }

    /*------ User End ------*/

    /*------ User Details ------*/

    .user-statistics-each {
        float: left;
        height: 60px;
        width: calc((100% / 7) - 9px);
        margin-right: 10px;
        border: 1px solid #E5EBF2;
        background-color: #FFFFFF;
        border-radius: 10px;
        padding: 12px 17px;
    }

    .user-statistics-each p {
        font-size: 12px;
    }

    /*------ User Details End ------*/

    /*------ Chat ------*/

    /*------ Chat End ------*/

    /*------ Collection ------*/

    /*------ Collection End ------*/

    /*------ Collection Details ------*/

    .template-6 .ind-form-field .fieldset.flex-box .ind-task-input.selectize-custom .tag-task-container input {
        min-width: 60px;
        margin-right: 0;
    }

    .quickform-right .each-flag-settings {
        width: 100%;
        margin-right: 0;
    }

    .bsy-modal.height-520 .modal-body {
        height: 400px;
    }

    .grid-view .collection-card-right-header h5 {
        max-height: 38px;
    }

    /*------ Collection Details End ------*/

    /*------ Forms ------*/

    /*------ Forms End ------*/

    /*------ Forms Details ------*/

    /*------ Forms Details End ------*/

    /*------ Workflow ------*/

    /*------ Workflow End ------*/

    /*------ Workflow Details ------*/

    /*------ Workflow Details End ------*/

    /*------ Workflow Task Entity ------*/

    /*------ Workflow Task Entity End ------*/

    /*------ Entity ------*/

    /*------ Entity End ------*/

    /*------ Entity Details ------*/


    /*------ Entity Details End ------*/

    /*------ Task Pool ------*/


    /*------ Task Pool End ------*/

    /*------ Pool ------*/

    /*------ Pool End ------*/

    /*------ Project ------*/

    /*------ Project End------*/

    /*------ Project Details ------*/

    .dataroom-manager-header-left {
        width: 100%;
        margin-bottom: 10px;
    }

    .dataroom-manager-header {
        flex-wrap: wrap;
        height: 110px;
        padding: 10px 20px;
    }

    .search-dataroom {
        height: 33px;
    }

    .dataroom-manager-body {
        height: calc(100% - 110px);
    }

    .dataroom-option li {
        float: left;
        margin-left: 22px;
    }

    .dataroom-option {
        display: flex;
        justify-content: flex-end;
        width: 100%;
    }

    .graph-empty .empty-data {
        font-size: 12px;
    }

    .ibt-header-details {
        padding: 0;
    }

    .ibt-header-details li {
        padding: 0 10px;
        margin-right: 0;
    }

    .ibt-header-details li:last-child {
        padding: 0 10px;
    }

    .ibt-body .task-split-header h5 {
        font-size: 14px;
    }

    .ibt-body .content-bl-header h5 {
        font-size: 14px;
    }

    .project-collection-wrap .form-detail-top-right .data-search-box {
        width: 200px;
    }

    /*------ Project Details End ------*/

    /*------ Resources ------*/

    .grid-vw .rc-list-contents {
        width: calc((100% / 3) - 13px);
    }

    .grid-vw .rc-list-contents:nth-child(4n) {
        margin-right: 20px;
    }

    .grid-vw .rc-list-contents:nth-child(3n) {
        margin-right: 0px;
    }

    /*------ Resources End ------*/

    /* Attendance */

    .leave-calendar .rbc-event {
        top: auto;
        bottom: 15px;
    }

    /* Attendance End */

    /* Learn */

    .other-info-list li {
        margin-right: 10px;
    }

    /* Learn End */

}

@media(max-width: 1200px) {

    /*------ Login ------*/

    .login-bg {
        background-size: 95%;
    }

    /*------ Login End ------*/

    /*------ Dashboard ------*/

    .content-left {
        width: 100%;
    }

    .static-counter li {
        padding: 12px 11px;
    }

    /*------ Dahboard End ------*/

    /*------ Task ------*/

    .filter-left-block .select-box-holder {
        margin: 0;
        margin-right: 10px;
        width: calc((100% / 5) - 15px);
    }

    .select-box-holder .c-select-in select {
        width: 100%;
        max-width: 100% !important;
    }

    .filter-left-block .select-box-holder .c-select-in {
        width: 100%;
    }

    .task-details-info-wrap {
        width: calc(100% - 93px);
    }

    /*------ Task End ------*/

    /*------ Task Details ------*/

    .task-right {
        width: 350px;
    }

    .task-left {
        width: calc(100% - 365px);
    }

    .attachment-list.attach_forms li {
        width: 100%;
    }

    .workflow-addon-left {
        width: 300px;
    }

    .workflow-addon-right {
        width: 250px;
    }

    .workflow-addon-center {
        width: calc(100% - 590px);
    }

    .forms-list li {
        width: 100%;
    }

    .workflow-addon-left .tab-content .chat-panel .ind-task-wf {
        height: 100%;
        margin-bottom: 0;
    }

    .workflow-addon .chat-panel .ind-task-wf .discuss-inner {
        max-height: none;
    }

    .workflow-addon-left .tab-content .chat-panel .ind-task-wf .task-wf-body {
        height: 100%;
    }

    .workflow-addon-left .tab-content .chat-panel .ind-task-wf .task-wf-body .file-size {
        font-size: 11px;
    }

    .tasktab-scroll-div .nav-tabs {
        padding: 0;
        margin: 0;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: unset;
        border-bottom: 0;
        height: auto;
        width: 100%;
        border-bottom: 0;
    }

    /*------ Task Details End ------*/

    /*------ User ------*/

    .team-card {
        width: calc((100% / 2) - 8px);
    }

    .team-card:nth-child(4n) {
        margin-right: 15px;
    }

    .team-card:nth-child(3n) {
        margin-right: 15px;
    }

    .team-card:nth-child(2n) {
        margin-right: 0px;
    }

    .ind-group-list {
        width: calc((100% / 2) - 10px);
    }

    .ind-group-list:nth-child(4n) {
        margin-right: 20px;
    }

    .ind-group-list:nth-child(2n) {
        margin-right: 0;
    }

    /*------ User End ------*/

    /*------ User Details ------*/

    .user-name-in {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        max-width: 200px;
    }

    .user-detail-list-items {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        max-width: 200px;
    }

    .previous-stage {
        font-size: 18px;
    }

    .communication-panel li {
        margin-right: 25px;
    }

    .user-statistics-each {
        width: calc((100% / 4) - 16px);
        margin-bottom: 20px;
    }

    .user-statistics-each:nth-child(4n) {
        margin-right: 0;
    }

    .user-detail-card-bottom {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

    /*------ User Details End ------*/

    /*------ Chat ------*/



    /*------ Chat End ------*/

    /*------ Collection ------*/

    .tile-each {
        width: calc((100% / 3) - 12px);
    }

    .tile-each:nth-child(4n) {
        margin-right: 18px;
    }

    .tile-each:nth-child(3n) {
        margin-right: 0;
    }

    .list-viewer .tile-each:nth-child(4n) {
        margin-right: 18px;
    }

    .list-viewer .tile-each:nth-child(3n) {
        margin-right: 18px;
    }

    .list-viewer .tile-each:nth-child(2n) {
        margin-right: 0;
    }

    /*------ Collection End ------*/

    /*------ Collection Details ------*/

    .left-panel .card-container {
        width: 100%;
        padding: 0;
        margin-bottom: 20px;
    }

    .left-panel.with-card {
        display: block;
    }

    .left-panel.with-card .right-panel-white-box {
        width: 100%;
    }

    .fixed-container {
        width: 100%;
        margin-bottom: 20px;
    }

    .left-panel.multi-card-record .card-container {
        width: 100%;
        padding: 0;
    }

    /*------ Collection Details End ------*/

    /*------ Forms ------*/


    /*------ Forms End ------*/

    /*------ Forms Details ------*/


    /*------ Forms Details End ------*/

    /*------ Workflow ------*/



    /*------ Workflow End ------*/

    /*------ Workflow Details ------*/



    /*------ Workflow Details End ------*/

    /*------ Workflow Task Entity ------*/



    /*------ Workflow Task Entity End ------*/

    /*------ Entity ------*/


    /*------ Entity End ------*/

    /*------ Entity Details ------*/


    /*------ Entity Details End ------*/

    /*------ Task Pool ------*/

    .content-section {
        width: calc((100% / 3) - 12px);
    }

    .content-section:nth-child(4n) {
        margin-right: 0px;
    }

    .content-section:nth-child(2n) {
        margin-right: 18px;
    }

    .content-section:nth-child(3n) {
        margin-right: 0px;
    }

    /*------ Task Pool End ------*/

    /*------ Pool ------*/



    /*------ Pool End ------*/

    /*------ Project ------*/

    .right-content-wrapper {
        min-width: calc(100% - 395px);
    }

    .table-scrollable {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
        height: 100%;
    }

    .table-scrollable .bsy-table {
        min-width: 1200px;
    }

    .ind-stakeholders-list {
        width: calc((100% / 2) - 10px);
    }

    .ind-stakeholders-list:nth-child(4n) {
        margin-right: 20px;
    }

    .ind-stakeholders-list:nth-child(2n) {
        margin-right: 0px;
    }

    .table-all-wrapper.project-listing {
        padding: 0 0 0 20px;
    }

    .table-all-wrapper.project-listing .table-scrollable {
        height: 100% !important;
    }

    /*------ Project End------*/

    /*------ Project Details ------*/

    .pj-first-left-section h5 {
        max-width: 60%;
    }

    .ind-team-user {
        width: calc((100% / 2) - 8px);
    }

    .ind-team-user:nth-child(4n) {
        margin-right: 15px;
    }

    .ind-team-user:nth-child(2n) {
        margin-right: 0;
    }

    .note-list-wrapper .nav-pills {
        width: 50%;
    }

    .note-list-wrapper .tab-content {
        width: 50%;
    }

    .pj-dash .dash-wrapper-left {
        width: 250px;
    }

    .pj-dash .dash-wrapper-right {
        width: calc(100% - 250px);
    }

    .ibt-body.dash-no-pad {
        overflow: hidden;
    }

    .data-holder-filter-right .data-search-box {
        width: 300px;
    }

    .blue-lister {
        width: calc((100% / 2) - 10px);
    }

    .ibt-split-table {
        flex-wrap: wrap;
    }

    .blue-lister:nth-child(4n) {
        margin-right: 0;
    }

    .blue-lister:nth-child(2n) {
        margin-right: 0;
    }

    .ind-small-tab {
        width: calc((100% / 2) - 9px);
    }

    .ind-small-tab:nth-child(4n) {
        margin-right: 20px;
    }

    .ind-small-tab:nth-child(2n) {
        margin-right: 0;
    }

    .list-common {
        width: 100%;
    }

    .two-row .blue-lister {
        width: 100%;
    }

    .ibt-header-bottom-left {
        width: 150px;
        margin-bottom: 20px;
        position: absolute;
        left: 20px;
        top: 20px;
    }

    .ibt-header-bottom-right {
        width: 100%;
        padding-left: 170px;
    }

    .ibt-header-bottom-right-left {
        width: 100%;
        margin-bottom: 20px;
    }

    .ibt-header-bottom-right-right {
        width: 100%;
    }

    .ind-ibt-rating {
        width: 100%;
        margin-bottom: 20px;
    }

    .ind-ibt-rating:nth-child(3n) {
        margin-right: 0;
    }

    .remain-block {
        float: left;
        width: 50%;
        display: flex;
        align-items: center;
    }

    .remain-block .dataroom-manager-table-data {
        width: 25%;
        float: left;
    }

    .ibt-body.file-data-wrap {
        padding: 0;
    }

    .data-room-controller {
        padding: 0;
    }

    .data-room-left {
        position: absolute;
        left: -100%;
        top: 0;
        background: #ecf0f1;
        transition: .3s ease-out;
        z-index: 9;
        box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.05);
        border-right: 1px solid #DEE1E4;
        border-bottom: 0;
    }

    .data-room-left.active {
        left: 0%;
    }

    .data-room-right {
        width: 100%;
    }

    .dataroom-manager-header {
        float: left;
        width: 100%;
        height: auto;
        display: block;
        padding: 15px;
    }

    .dataroom-manager-header-left {
        width: 100%;
    }

    .dataroom-manager-header-center {
        width: 100%;
        margin: 15px 0;
    }

    .search-dataroom {
        width: 100%;
    }

    .dataroom-manager-header-right {
        width: 100%;
    }

    .dataroom-option {
        width: 100%;
        display: flex;
        justify-content: flex-end;
        margin-bottom: 20px;
        padding: 0 20px;
    }

    .dataroom-manager-table-header {
        display: none;
    }

    .dataroom-manager-body {
        height: calc(100% - 164px);
        overflow-y: auto;
    }

    .dataroom-manager-table-body {
        float: left;
        width: 100%;
    }

    .dataroom-manager-table-row {
        height: auto;
        display: block;
    }

    .dataroom-manager-table-body .dataroom-manager-table-data {
        width: auto;
        padding: 0;
    }

    .remain-block {
        width: 100%;
        padding-left: 42px;
    }

    .dataroom-manager-table-body .dataroom-manager-table-row {
        height: 65px;
        padding: 10px 15px;
    }

    .file-type-name {
        width: calc(100% - 42px);
        line-height: 28px;
    }

    .remain-block .dataroom-manager-table-data:first-child {
        color: #B6C5C9;
        font-size: 12px;
        line-height: 14px;
        font-weight: 400;
    }

    .dataroom-manager-table-body .remain-block .dataroom-manager-table-data {
        margin-right: 15px;
        line-height: 16px;
    }

    .dataroom-manager-table-body .dataroom-manager-table-data:first-child {
        width: 100%;
    }

    .dataroom-manager-table-body .remain-block .dataroom-manager-table-data:first-child {
        width: auto;
    }

    .file-type-view span {
        position: absolute;
        top: 8px;
        left: 0;
    }

    .file-type-view span {
        height: 29px;
    }

    .file-type-view {
        padding-left: 42px;
    }

    .folder-ico:before {
        position: relative;
        top: 4px;
    }

    .dataroom-manager-table-row .resources-card-check,
    .dataroom-manager-table-row.active .resources-card-check,
    .dataroom-manager-table-row:hover .resources-card-check {
        left: 2px;
        top: 13px;
    }

    .mob-header {
        float: left;
        width: 100%;
        height: 40px;
        background: #fff;
        border-bottom: 1px solid #DEE1E4;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 20px;
    }

    .close-filter {
        background: transparent;
        padding: 0;
        line-height: 0;
        border: 0;
    }

    .close-filter:before {
        background-position: -98px -265px;
        width: 8px;
        height: 8px;
    }

    .mob-header h5 {
        float: left;
        font-size: 12px;
        font-weight: 600;
    }

    .dr-filter:before {
        background-position: -10px -35px;
        width: 16px;
        height: 16px;
    }

    .dr-filter:hover:before {
        background-position: -40px -35px;
    }

    .data-room-controller.layover:before {
        top: 0;
    }

    .mobi-only {
        display: block;
    }

    .overlay-mode .ibt-header-bottom {
        max-height: 350px;
        overflow-y: auto;
        position: relative;
    }

    .ibt-header-details li {
        width: 33.33%;
        border-bottom: 1px solid #D1D1D1;
        padding: 5px 20px;
        margin: 0;
        min-height: 47px;
    }

    .ibt-header-details {
        flex-wrap: wrap;
        height: auto;
        padding: 0;
        border-bottom: 0;
        position: relative;
    }

    .ibt-header-details li:nth-child(3n) {
        margin-right: 0;
        border-right: 0;
    }

    .ibt-header-details li:last-child {
        border-right: 1px solid #D1D1D1;
    }

    .ibt-header-details:before {
        content: "";
        width: 100%;
        height: 1px;
        background: #d1d1d1;
        position: absolute;
        left: 0;
        bottom: 0;
    }

    .news-media-left {
        left: -100%;
        position: absolute;
        background: #fff;
        top: 0;
        z-index: 999;
        transition: .3s ease;
        border-right: 1px solid #DEE1E4;
    }

    .form-detail-top-right .data-search-box {
        width: 200px;
    }

    .project-collection-wrap .form-detail-top-right .general-btn {
        font-size: 0;
        min-width: auto;
    }

    .project-collection-wrap .form-detail-top-right .general-btn:before {
        margin-right: 0;
    }

    /*------ Project Details End ------*/

    /*------ Resources ------*/

    .grid-vw .rc-list-contents {
        width: calc((100% / 2) - 9px);
    }

    .grid-vw .rc-list-contents:nth-child(4n) {
        margin-right: 20px;
    }

    .grid-vw .rc-list-contents:nth-child(2n) {
        margin-right: 0;
    }

    /*------ Resources End ------*/

    /* Call Module */

    .call-right {
        width: 290px;
    }

    .call-note-block {
        height: 50%;
    }

    .recommend-add-block {
        height: 50%;
    }

    .call-left {
        width: calc(100% - 290px);
    }

    .call-note-right {
        width: 280px;
    }

    .call-note-left {
        width: calc(100% - 300px);
    }

    .week-round li {
        margin-right: 5px;
    }

    .week-round li:nth-child(2n) {
        margin-right: 15px;
    }

    .call-header {
        height: 75px;
    }

    .call-body {
        height: calc(100% - 75px)
    }

    .call-note-tab-block {
        width: 165px;
    }

    .call-note-card-block {
        width: calc(100% - 185px);
    }

    .each-recomment-list {
        padding-left: 15px;
    }

    .intake-content,
    .lab-content,
    .photo-content,
    .presc-content,
    .progress-content {
        width: calc(100% - 185px);
    }

    .progress-table-header-col:first-child {
        min-width: 195px;
    }

    .progress-table-body-col:first-child {
        min-width: 179px;
        max-width: 179px;
    }

    .attribute-info p {
        font-size: 14px;
    }

    .attribute-info h5 {
        font-size: 34px;
    }

    .each-status-row li {
        width: 40px;
    }

    .progress-content-inner {
        padding-right: 15px;
    }

    .offset-block {
        width: 193px;
    }

    .progress-table-body-col {
        min-width: calc((100% / 7) - 31px);
        margin-right: 8px;
    }

    .progress-table-header-col {
        min-width: calc((100% / 7) - 36px);
        padding: 5px 0 0 5px;
        margin-right: 8px;
    }

    .overlay-block {
        width: calc(100% - 218px);
    }

    .progress-table-body-row {
        padding: 15px;
    }

    .col-overlay {
        width: calc((100% / 7) - 7px);
        margin-right: 8px;
    }

    /* Call Module End */

    /* Sepalika Payment */

    .pay-body-content-inner .container {
        max-width: 75%;
    }

    /* Sepalika Payment End */

    /* Attendance */

    .each-leave-card {
        width: calc((100% / 4) - 15px);
        margin-bottom: 20px;
    }

    .each-leave-card:last-child {
        margin-right: 20px;
    }

    .each-leave-card:nth-child(4n) {
        margin-right: 0;
    }

    .leave-dashboard {
        margin-bottom: 0;
    }

    .leave-form-split {
        width: 100%;
    }

    .leave-form-button-block {
        width: 100%;
    }

    .leave-calendar .rbc-event {
        top: auto;
        bottom: 15px;
    }

    /* Attendance End */

    /* Sepalika Payment */

    .pay-body-content-inner .container {
        max-width: 70%;
    }

    /* Sepalika Payment End */


}

@media(max-width: 1024px) {

    /*------ Login ------*/

    .login-bg {
        background: 0 0;
    }

    /*------ Login End ------*/


    /*------ Dashboard ------*/

    .dash-wrapper-left {
        width: 40%;
    }

    .dash-wrapper-right {
        width: 60%;
    }

    .content-left {
        width: 100%;
        height: auto;
    }

    .ind-static-md {
        width: calc((100% / 2) - 8px);
    }

    .ind-static-md:nth-child(3n) {
        margin-right: 15px;
    }

    .ind-static-md:nth-child(2n) {
        margin-right: 0px;
    }

    .static-counter li {
        width: 100%;
        margin-bottom: 20px;
    }

    .dash-wrapper-right-center .task-counter {
        padding: 0;
    }

    .dash-wrapper-right-center .task-counter-text {
        margin-right: 25px;
    }

    .dash-wrapper-left .ind-task-list-center {
        width: 100%;
    }

    .error-block h1 {
        font-size: 80px;
    }

    .error-block p {
        font-size: 25px;
    }

    /*------ Dashboard End ------*/

    /*------ Task ------*/

    .search-block {
        max-width: 180px;
    }

    .ind-task-list {
        height: 70px;
    }

    .task-priority {
        width: 22px;
        height: 22px;
        margin-right: 9px;
        font-size: 10px;
        flex-shrink: 0;
    }

    .task-user-block.__usercard {
        width: 100%;
        padding-right: 90px;
    }

    .ind-task-list-center {
        width: 100%;
        height: 31px;
        padding-left: 31px;
        position: relative;
        display: block;
        margin-top: 0;
    }

    .ind-task-list-center .task-text {
        padding-left: 0;
        height: 28px;
        color: var(--default-grey);
    }

    .task-user {
        font-size: 14px;
        border: 0;
        color: var(--default-text);
        font-weight: 600;
        padding: 0;
        width: auto;
        float: left;
        line-height: 17px;
        max-width: 150px;
    }

    .task-text {
        font-size: 12px;
        font-weight: 400;
        max-height: 28px;
        line-height: 14px;
        padding-right: 0;
        color: #777;
        word-break: break-word;
    }

    .ind-task-list-left {
        width: 100%;
        align-items: end;
        height: 17px;
    }

    .ind-task-list-right {
        position: absolute;
        right: 18px;
        top: 10px;
        height: auto;
    }

    .icon-attachment {
        transform: rotate(48deg);
        position: relative;
        top: 0px;
    }

    .due-block {
        min-width: auto;
        margin-left: 10px;
        color: #a5afb9;
        line-height: 15px;
    }

    .select-chk-block {
        margin-right: 8px;
    }

    .icon-in.icon-forward {
        position: absolute;
        left: 5px;
        bottom: 0;
        top: unset;
    }

    .ind-task-list-left .select-chk-block {
        width: 23px;
        height: 22px;
    }

    .ind-task-list-left .control-indicator {
        top: 4px;
        left: 0;
    }

    .filter-holder {
        display: block;
        width: 100%;
    }

    .filter-left-block {
        float: left;
        /* width: calc(100% - 70px); */
    }

    .filter-left-block .select-box-holder {
        float: left;
        width: calc((100% / 4) - 8px);
        margin-left: 0;
    }

    .filter-left-block .select-box-holder {
        float: left;
        width: calc((100% / 2) - 5px);
        margin-left: 0;
        margin-bottom: 10px;
    }

    .filter-left-block .select-box-holder:last-child {
        margin-right: 0;
    }

    .filter-left-block .select-box-holder:nth-child(2n) {
        margin-right: 0;
    }

    .select-box-holder .c-select-in select {
        width: 100%;
        max-width: none;
    }

    .filter-left-block .select-box-holder .c-select-in.form-group {
        float: left;
        width: 100%;
    }

    .filter-right-block {
        float: right;
    }

    .task-toggler-wrapper.task-tg {
        width: 457px;
        height: 520px;
    }

    .project-code {
        display: none;
    }

    .main-panel-holder.has-filter {
        height: calc(100vh - 225px);
    }

    .filter-all-wrapper {
        min-height: 125px;
    }

    .quick-edit {
        top: 4px;
    }

    .ind-task-list-left .select-chk-block {
        width: 23px;
        height: 22px;
        position: relative;
    }

    .ind-task-list-left .control-indicator {
        top: 4px;
        left: 0;
    }

    .general-btn.button-lg {
        min-width: 90px;
    }

    .select-label {
        margin-right: 5px;
    }

    .task-tg .dynamic-creation .persitant-footer .group-container.align-equal .input-log-time.date {
        margin-right: 10px;
    }

    .label-flex-container.eq-wid,
    .task-tg .dynamic-creation .persitant-footer .group-container.align-equal .input-log-time.date {
        width: 80%;
    }

    .ind-attach-list {
        width: 100%;
    }

    .ind-task-list-left .task-user {
        padding-left: 0;
        height: 20px;
        color: var(--default-grey);
        font-weight: 400;
        font-size: 12px;
        position: relative;
        top: 18px;
        max-width: 78%;
    }

    .ind-task-list-center .task-text {
        font-size: 14px;
        color: var(--default-text);
        font-weight: 600;
        height: 15px;
        white-space: nowrap;
        text-overflow: ellipsis;
        max-width: 65%;
    }

    .ind-task-list-center {
        height: 17px;
        top: -15px;
        padding-right: 15px;
    }

    .ind-task-list-right {
        top: 27px;
    }

    .wf-task-ico,
    .task-board-ico,
    .task-systask-ico,
    .task-pool-ico,
    .notf-task-ico {
        top: unset;
        left: unset;
        bottom: -24px;
        right: 0;
    }

    .ind-task-list-click.card-body {
        padding: 18px;
    }

    .icon-in.icon-forward {
        position: absolute;
        left: 5px;
        bottom: -23px;
        top: unset;
    }

    .ind-task-list:hover .quick-edit {
        position: absolute;
        right: -18px;
        top: -13px;
    }

    .ind-task-list:hover .wf-task-ico,
    .ind-task-list:hover .task-board-ico,
    .ind-task-list:hover .task-systask-ico,
    .ind-task-list:hover .task-pool-ico,
    .ind-task-list:hover .notf-task-ico {
        display: none;
    }

    .main-panel-holder.has-filter {
        background: #ecf0f1 !important;
    }

    .main-panel-head {
        color: var(--default-text) !important;
    }

    .icon-attachment {
        position: absolute;
        right: 0;
        top: -16px;
    }

    .ind-task-list-left .select-chk-block {
        z-index: 99;
    }

    .dash-wrapper-left .ind-task-list-center .task-text {
        max-width: 100%;
    }

    .dash-wrapper-left .task-user-block {
        width: 100%;
        left: -2px;
    }

    .dash-wrapper-left .ind-task-list {
        height: 53px;
    }

    .dash-wrapper-left .ind-task-list:hover:first-child {
        border: 1px solid var(--default-color);
    }

    .bsy-modal.large-modal {
        padding: 15px;
    }

    .wf-task-left .task-detail-header-right .task-other-opt {
        float: left;
        margin-left: 20px;
        position: relative;
        top: 0px;
    }

    .task-detail-panel-content-area h5,
    .task-detail-panel-content-area p {
        word-break: break-word;
    }

    .pj-dash .dash-wrapper-left .ind-task-list {
        height: 40px;
    }

    .pj-dash .ind-task-list-center {
        top: 0;
    }

    .pj-team-wrapper .status-block {
        position: absolute;
        right: 0;
        top: 19px;
        font-size: 10px;
        height: 13px;
        display: flex;
        align-items: center;
    }

    .pj-team-wrapper .task-user-block {
        width: 100%;
    }

    .task-tab .ind-task-list-center {
        width: 100%;
    }

    .task-attach {
        position: absolute;
        right: 0;
        top: -16px;
    }

    .time-log-items {
        padding: 0 15px;
    }

    .system-task-left {
        float: left;
        width: 100%;
        height: 50px;
        padding: 0;
    }

    .system-task-right {
        width: 100%;
        height: calc(100% - 100px);
    }

    .step-flow {
        float: left;
        width: 100%;
        height: 50px;
        display: flex;
        align-items: center;
        overflow: hidden;
        overflow-x: auto;
        border-bottom: 1px solid #e3e3e3;
    }

    .step-flow li {
        width: auto;
        margin-right: 0;
        border-right: 1px solid #e3e3e3;
        padding: 0 20px;
    }

    .step-flow li nav {
        white-space: nowrap;
    }

    .same-line-option .task-inp-container {
        width: 100%;
    }

    .same-line-option {
        display: block;
        height: auto;
    }

    .system-task-holder-body .new-task-input.persistant-span input {
        width: auto;
        padding-right: 0;
    }

    .day-text {
        position: relative;
        right: 0;
        top: 0;
        padding-right: 0;
    }

    .system-task-right-body {
        height: calc(100% - 20px);
    }

    .date-container-block.single-block {
        float: left;
        width: 80%;
        margin-bottom: 10px;
    }

    .group-container.align-equal {
        flex-direction: column;
    }

    .ind-task-list:hover .quick-edit {
        position: absolute;
        right: 0;
        top: 0;
    }

    .quick-edit {
        background: transparent;
        width: auto;
        height: auto;
        opacity: 1;
        display: block;
        position: absolute;
        right: 0;
        bottom: 0;
    }

    .quick-edit li {
        width: auto;
        height: auto;
        background: transparent;
    }

    .quick-edit li .edited-task-ico {
        position: absolute;
        right: 0;
        bottom: -20px;
        zoom: .8;
    }

    .ind-task-list:hover .due-block {
        display: block;
    }

    /*------ Task End ------*/

    /*------ Task Details ------*/

    .task-left {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }

    .task-detail-panel-content-area-left {
        width: 100%;
    }

    .task-detail-panel-content-area .due-date-block {
        width: 100%;
    }

    .ind-div-assign {
        height: auto;
        padding: 15px 20px;
    }

    .task-wrapper.task-detail-stand {
        height: calc(100% - 60px);
        padding: 20px;
        overflow-y: auto;
    }

    .task-right {
        width: 100%;
        margin-left: 0;
        height: 540px;
    }

    .chat-tab-block .tab-scroll {
        overflow-y: auto;
    }

    .chat-tab-block .tab-scroll .discuss-inner {
        height: auto;
    }

    .workflow-addon-left {
        width: 100%;
        height: auto;
        margin: 0;
        margin-bottom: 20px;
    }

    .workflow-addon-center {
        width: 100%;
        height: auto;
        min-height: 350px;
        margin-bottom: 20px;
    }

    .workflow-addon-right {
        width: 100%;
        height: auto;
    }

    .ind-task-wf:last-child {
        margin-bottom: 0;
    }

    .task-details-info-wrap li h5 {
        float: left;
        width: 100%;
        color: var(--default-text);
        font-size: 14px;
        font-weight: 600;
        line-height: 16px;
        text-overflow: ellipsis;
        overflow: hidden;
        width: auto;
        white-space: nowrap;
    }

    .ind-added-user-list-left {
        width: 50%;
    }

    .ind-added-user-list-right {
        width: 50%;
    }

    .ind-file-list {
        justify-content: space-between;
    }

    .time-log-sub-list-select .input-log-time.date:after {
        right: -18px;
    }

    .time-log-sub-list-select .input-log-time.date {
        padding-right: 0;
    }

    .time-log-sub-list-select .input-log-time.addition {
        width: 100%;
    }

    .attachment-list.attach_forms li {
        height: auto;
        width: calc((100% / 4) - 9px);
    }

    .wf-task-left .task-details-info-wrap {
        width: calc(100% - 93px);
    }

    .wf-task-left .task-details-info-wrap li {
        display: flex;
        flex-direction: column;
    }

    .wf-task-left .task-details-info-wrap li h5 {
        width: auto;
        display: block;
    }

    .wf-task-left .task-details-info-wrap li p {
        width: auto;
    }

    .mark-as-done-mod .modal-dialog {
        max-width: 650px;
    }

    .drop-cont .dropzone p {
        font-size: 18px;
    }

    .task-extra-tab-block .nav-tabs .nav-link.active .tab-text {
        white-space: nowrap;
    }

    .wf-task-next .nested-sub-block {
        padding-left: 0;
    }

    /*------ Task Details End ------*/

    /*------ User ------*/

    .team-card {
        width: 100%;
    }

    .ind-group-list {
        width: 100%;
    }

    /*------ User End ------*/

    /*------ User Details ------*/

    .user-task-indicator {
        display: none;
    }

    .previous-stage {
        margin-bottom: 20px;
    }

    .communication-panel li {
        margin-right: 20px;
    }

    .user-statistics-each {
        width: calc((100% / 2) - 9px);
        margin-bottom: 20px;
    }

    .user-statistics-each:nth-child(2n) {
        margin-right: 0;
    }

    .grid-col-3,
    .grid-col-2,
    .grid-col-4,
    .grid-col-6 {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .user-table-wrapper {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
    }

    .user-table {
        width: 100%;
        min-width: 1200px !important;
    }

    .grid-container {
        width: 100%;
    }

    .grid-col--fixed-left {
        width: 150px;
        min-width: 150px;
    }

    .filter-all-wrapper.team-settings {
        min-height: auto;
    }

    .team-settings+.main-panel-holder.has-filter.user-lister-container {
        height: calc(100vh - 125px);
    }

    .team-settings .filter-holder {
        display: flex;
    }

    .team-settings .filter-right-block.form-detail-top-right.align-equal-btn {
        width: auto;
        margin: 0;
        height: auto;
    }

    .team-settings .filter-left-block {
        width: auto;
    }

    .team-settings .filter-right-block.form-detail-top-right .general-btn {
        margin: 0;
        color: #fff;
        font-size: 14px;
    }

    /*------ User Details End ------*/

    /*------ Chat ------*/

    .def-text h5 {
        font-size: 25px;
    }

    .chat-profile {
        float: left;
        max-width: 205px;
    }

    .userName {
        max-width: 100%;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }

    .designation {
        max-width: 100%;
    }

    .file-bl-wrap {
        padding: 0;
    }

    .attach-chat-block {
        width: 100%;
    }

    .message-in-box.url-panel {
        padding-left: 0;
    }

    .attachment-block-right h5 {
        max-width: 90%;
        max-height: 17px;
        overflow: hidden;
        word-break: break-word;
        padding-right: 18px;
        white-space: normal;
    }

    .chat-panel-holder.with-tab .chat-all-wrapper {
        width: 100%;
    }

    .with-tab .chat-right-tab {
        display: none;
    }

    /*------ Chat End ------*/

    /*------ Collection ------*/

    .tile-each {
        width: calc((100% / 2) - 9px);
    }

    .tile-each:nth-child(4n) {
        margin-right: 18px;
    }

    .tile-each:nth-child(3n) {
        margin-right: 18px;
    }

    .tile-each:nth-child(2n) {
        margin-right: 0;
    }

    .list-viewer .tile-each {
        width: 100%;
        margin-right: 0;
    }

    .list-viewer .tile-each:nth-child(3n) {
        margin-right: 0;
    }

    /*------ Collection End ------*/

    /*------ Collection Details ------*/

    .form-table {
        overflow: scroll;
        overflow-y: hidden;
        width: 100%;
        margin-bottom: 20px;
    }

    .form-table .table {
        width: 100%;
        min-width: 675px !important;
    }

    .detail-tab li a {
        font-size: 0;
    }

    .form-detail-bottom-right {
        flex-shrink: 0;
    }

    .data-search-box {
        width: 250px;
    }

    .data-holder-filter-right {
        width: auto;
    }

    .data-search-button .general-btn {
        font-size: 0;
        min-width: auto;
    }

    .data-search-button .general-btn:before {
        margin-right: 0;
    }

    .form-detail-top-right .data-search-box {
        width: 200px;
    }

    .fixed-card-area {
        max-width: calc(100% - 90px);
    }

    .grid-view .ind-collection-card {
        width: calc((100% / 2) - 10px);
    }

    .grid-view .ind-collection-card:nth-child(3n) {
        margin-right: 20px;
    }

    .grid-view .ind-collection-card:nth-child(2n) {
        margin-right: 0;
    }

    .form-detail-top-right .data-search-button .ex-cel-ico,
    .form-detail-top-right .ex-cel-ico,
    .modal-header-right .ex-cel-ico {
        font-size: 0;
        min-width: auto;
    }

    .form-detail-top-right .data-search-button .ex-cel-ico:before,
    .form-detail-top-right .ex-cel-ico:before {
        margin-right: 0;
    }

    .form-table.coll-full-height {
        overflow-y: auto;
        margin-bottom: 0;
    }

    .small-no-tab .form-detail-top h5 {
        padding-right: 20px;
    }

    .side-tab .nav-pills {
        flex-direction: unset;
        padding: 0;
        margin: 0;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: unset;
        border-bottom: 0;
        height: auto;
        width: 100%;
        border-bottom: 0;
    }

    .side-tab .nav-pills .nav-link-side {
        flex: 0 0 27%;
    }

    .side-tab .tab-content {
        width: 100%;
    }

    .set-container {
        height: calc(100% - 70px);
    }

    .edit-template-left {
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid rgba(64, 83, 100, 0.15);
    }

    .edit-template-right {
        width: 100%;
    }

    .side-tab .tab-content .tab-pane .grid-view .ind-collection-card {
        flex-direction: column;
    }

    .side-tab .tab-content .tab-pane .collection-card-left {
        width: 100;
    }

    .ind-collection-card {
        min-height: 223px;
        height: auto;
    }

    .template-5 .signature-canvas {
        display: block;
    }

    .template-5 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 250px;
    }

    .template-5 .sig-preview {
        margin-top: 31px;
    }

    .template-5 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 50%;
    }

    .template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 50%;
    }

    .template-1 .ind-form-field .signature-canvas,
    .template-1.width-720 .ind-form-field .signature-canvas,
    .template-1.width-540 .ind-form-field .signature-canvas {
        display: block;
    }

    .template-1 .ind-form-field .signature-canvas canvas,
    .template-1.width-720 .ind-form-field .signature-canvas canvas,
    .template-1.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 200px;
        margin-bottom: 20px;
    }

    .template-1 .sig-preview,
    .template-1.width-960 .sig-preview,
    .template-1.width-720 .sig-preview,
    .template-1.width-540 .sig-preview {
        margin: 0px;
    }

    .template-1 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 50%;
    }

    .template-1 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 50%;
    }

    .template-1 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 50%;
    }

    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        height: 69px;
    }

    .template-2 .ind-form-field .signature-canvas,
    .template-2.width-720 .ind-form-field .signature-canvas,
    .template-2.width-540 .ind-form-field .signature-canvas {
        display: block;
    }

    .template-2 .ind-form-field .signature-canvas canvas,
    .template-2.width-720 .ind-form-field .signature-canvas canvas,
    .template-2.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 200px;
        margin-bottom: 20px;
    }

    .template-2 .sig-preview,
    .template-2.width-960 .sig-preview,
    .template-2.width-720 .sig-preview,
    .template-2.width-540 .sig-preview {
        margin: 0px;
        margin-bottom: 20px;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 50%;
        margin-right: 0;
        padding-right: 15px;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 50%;
        margin-right: 0;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 50%;
        padding-right: 15px;
        margin-right: 0;
    }

    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        height: 69px;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n),
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n),
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n),
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n) {
        padding-right: 0;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n),
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n),
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n),
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n) {
        padding-right: 0;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n),
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n),
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n),
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n) {
        padding-right: 0;
    }

    .template-3 .ind-form-field .signature-canvas,
    .template-3.width-720 .ind-form-field .signature-canvas,
    .template-3.width-540 .ind-form-field .signature-canvas {
        display: block;
    }

    .template-3 .ind-form-field .signature-canvas canvas,
    .template-3.width-720 .ind-form-field .signature-canvas canvas,
    .template-3.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 200px;
        margin-bottom: 20px;
    }

    .template-3 .sig-preview,
    .template-3.width-960 .sig-preview,
    .template-3.width-720 .sig-preview,
    .template-3.width-540 .sig-preview {
        margin: 0px;
        margin-bottom: 20px;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-3.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 50%;
        margin-right: 0;
        padding-right: 15px;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 50%;
        margin-right: 0;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 50%;
        padding-right: 15px;
        margin-right: 0;
    }

    .template-4 .ind-form-field .signature-canvas,
    .template-4.width-720 .ind-form-field .signature-canvas,
    .template-4.width-540 .ind-form-field .signature-canvas {
        display: block;
    }

    .template-4 .ind-form-field .signature-canvas canvas,
    .template-4.width-720 .ind-form-field .signature-canvas canvas,
    .template-4.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 200px;
        margin-bottom: 20px;
    }

    .template-4 .sig-preview,
    .template-4.width-960 .sig-preview,
    .template-4.width-720 .sig-preview,
    .template-4.width-540 .sig-preview {
        margin: 0px;
        margin-bottom: 20px;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 50%;
        margin-right: 0;
        padding-right: 15px;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 50%;
        margin-right: 0;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 50%;
        padding-right: 15px;
        margin-right: 0;
    }

    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        height: 69px;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n),
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n),
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n),
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block:nth-child(2n) {
        padding-right: 0;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n),
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n),
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n),
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapperk:nth-child(2n) {
        padding-right: 0;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n),
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n),
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n),
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper:nth-child(2n) {
        padding-right: 0;
    }

    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line {
        width: 100%;
    }

    .template-5.width-720 .ind-form-field .signature-canvas canvas,
    .template-5.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .template-5 .signature-canvas {
        padding-right: 0;
    }

    .template-5.width-720 .sig-preview,
    .template-5.width-540 .sig-preview {
        margin: 0;
    }

    .template-5.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-5.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 50%;
    }

    .filter-tag-block-left {
        flex-direction: column;
        padding-right: 0
    }

    .tag-list {
        padding-top: 5px;
    }

    .form-preview-holder {
        display: flex;
        flex-direction: column;
    }

    .left-panel {
        order: 0;
        width: 100%;
        margin-right: 0;
    }

    .right-panel {
        width: 100%;
        margin-top: 20px;
    }

    .modal-body .slider-button-block {
        position: fixed;
    }

    .detailed-form-view.direct-flow .modal-body .form-preview-header .close {
        position: absolute;
        right: 0;
        top: 0px;
    }

    .detailed-form-view.direct-flow .detailed-form-view-right-flow-top .form-preview-header {
        padding-right: 30px;
    }

    .template-1.direct-flow .detailed-form-view-right-body .form-preview-container {
        margin: 0;
        width: 100%;
    }

    .template-1.direct-flow .detailed-form-view-right-top {
        padding: 20px;
    }

    .template-2.direct-flow .detailed-form-view-right-body .form-preview-container {
        margin: 0;
        width: 100%;
    }

    .template-2.direct-flow .detailed-form-view-right-top {
        padding: 20px;
    }

    .template-3.direct-flow .detailed-form-view-right-body .form-preview-container {
        margin: 0 10px;
        width: 100%;
        margin: 5px 0;
        padding: 20px;
    }

    .template-4.direct-flow .form-preview-container {
        padding: 20px;
    }

    .direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px;
    }

    .direct-flow .detailed-form-view-right-bottom {
        padding: 0px;
    }

    .direct-flow.width-540 .container {
        max-width: 100%;
    }

    .template-3.direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px 0;
    }

    .template-2.direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px 5px;
    }

    .template-1.direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px 0;
    }

    .template-6 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
    }

    .template-6 .ind-form-field .signature-canvas {
        flex-direction: column;
    }

    .template-6 .signature-left {
        margin-bottom: 20px;
        float: left;
        width: 100%;
    }

    .template-6 .ind-form-field .signature-canvas {
        flex-direction: column;
        align-items: self-end;
    }

    .template-6.width-720 .signature-left,
    .template-6.width-540 .signature-left {
        width: 100%;
    }

    .template-5.direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px 0;
    }

    .template-5.detailed-form-view.direct-flow .detailed-form-view-right-flow-top .form-preview-header {
        margin: 0;
    }

    .template-5.direct-flow .form-preview-header .preview-subheader {
        line-height: normal;
        margin: 0;
    }

    .template-6.direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px 0;
    }

    .header-component-top .detailed-form-view-right-top {
        margin-bottom: 0;
    }

    .detailed-form-view.direct-flow .modal-body .header-component-top .form-preview-header .close {
        right: 20px;
        top: 20px;
    }

    .direct-flow .header-component-top .detailed-form-view-right-flow-top .detailed-form-view-right-top .container {
        padding: 0;
    }

    .direct-flow .header-full-width .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 0;
        margin-bottom: 25px;
    }

    .header-component-top .header-order-1 .form-preview-header-content {
        padding-right: 0;
    }

    .header-full-width .header-component.header-order-0 {
        padding-right: 20px !important;
    }

    .left-panel.multi-card-record .right-panel-white-box {
        width: 100%;
    }

    .left-panel.multi-card-record .card-container {
        padding: 0;
        width: 100%;
    }

    .template-7 .signature-canvas {
        display: block;
    }

    .template-7 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 250px;
    }

    .template-7 .sig-preview {
        margin-top: 31px;
    }

    .template-7 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 50%;
    }

    .template-7 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 50%;
    }

    .template-7.width-720 .ind-form-field .signature-canvas canvas,
    .template-7.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .template-7 .signature-canvas {
        padding-right: 0;
    }

    .template-7.width-720 .sig-preview,
    .template-7.width-540 .sig-preview {
        margin: 0;
    }

    .template-7.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-7.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 50%;
    }

    .template-7.direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px 0;
    }

    .template-7.detailed-form-view.direct-flow .detailed-form-view-right-flow-top .form-preview-header {
        margin: 0;
    }

    .template-7.direct-flow .form-preview-header .preview-subheader {
        line-height: normal;
        margin: 0;
    }

    .multiple-form-container .each-form-container {
        width: calc((100% / 2) - 14px);
    }

    .multiple-form-container .each-form-container:nth-child(3n) {
        margin-right: 20px;
    }

    .multiple-form-container .each-form-container:nth-child(2n) {
        margin-right: 0;
    }

    .right-panel-white-box.fieldset .form-single-value-box .scrollable .table {
        min-width: auto !important;
    }

    .right-panel-white-box.fieldset .form-single-value-box .scrollable {
        overflow: auto;
    }

    .right-panel-white-box.fieldset .form-single-value-box .scrollable .table .col-tr {
        flex-direction: column;
        width: 100%;
    }

    .right-panel-white-box.fieldset .form-single-value-box .scrollable .table .col-tr .col-th {
        padding: 0;
        min-height: auto;
        border-bottom: 0;
        padding-top: 15px;
        float: left;
        width: 100%;
    }

    .right-panel-white-box.fieldset .form-single-value-box .scrollable .table .col-tr .col-td {
        padding: 0;
        min-height: auto;
        padding-top: 7px;
        padding-bottom: 15px;
        font-weight: 400;
        width: 100%;
    }

    .mobile-top .side-tab .nav-pills {
        flex-direction: column;
        width: 245px;
        height: 100%;
    }

    .mobile-top .side-tab .tab-content {
        width: calc(100% - 245px);
    }

    .mobile-top .set-container {
        height: calc(100% - 70px);
    }

    .mobile-top .template-anchor li nav {
        padding: 0 25px;
    }

    .each-flag-settings {
        width: 100%;
        margin-right: 0;
    }

    .preview-with-tab .left-panel {
        width: 100%;
    }

    .preview-with-tab .right-panel {
        width: 100%;
    }

    .preview-tab .nav-tabs .nav-link {
        flex: 0 0 33%;
    }

    .filter-view-panel {
        padding: 0;
    }

    .filter-view-tab {
        width: 100%;
        height: 60px;
        display: flex;
        align-items: center;
        padding: 0 20px;
        overflow-x: auto;
    }

    .filter-view-tab .general-btn {
        height: 35px;
    }

    .each-template-type {
        width: 100%;
    }

    /* .grid-view .ind-collection-card {
        width: 100%;
        margin-right: 0;
    } */
    .template-container-view .data-holder-right .card-container.template-collection {
        padding-right: 20px;
    }

    /* .grid-view .ind-collection-card:nth-child(3n) {
        margin-right: 0;
    } */
    .data-search-button .general-btn {
        padding: 0 15px;
    }

    .collection-chat {
        padding: 0 15px;
    }

    .entity-rules .modal-lg {
        max-width: 100%;
        min-width: 100%;
    }

    .bsy-modal.entity-rules {
        padding: 15px;
    }

    .new-modal-left {
        width: 50%;
    }

    .new-modal-right {
        width: 50%;
    }

    .side-tab {
        display: flex;
    }

    .side-tab .nav-pills {
        width: 60%;
    }

    /*------ Collection Details End ------*/

    /*------ Forms ------*/


    /*------ Forms End ------*/

    /*------ Forms Details ------*/


    /*------ Forms Details End ------*/

    /*------ Workflow ------*/



    /*------ Workflow End ------*/

    /*------ Workflow Details ------*/



    /*------ Workflow Details End ------*/

    /*------ Workflow Task Entity ------*/



    /*------ Workflow Task Entity End ------*/

    /*------ Entity ------*/


    /*------ Entity End ------*/

    /*------ Entity Details ------*/

    .modal-header-right.align-right-option .general-btn {
        font-size: 0;
        min-width: auto;
    }

    .modal-header-right.align-right-option .general-btn:before {
        margin-right: 0 !important;
    }

    .entity-preview-right {
        width: 100%;
        height: auto;
    }

    .entity-preview-left {
        width: 230px;
    }

    .entity-preview-center {
        width: calc(100% - 230px);
    }

    .entity-preview-center.center-full {
        width: calc(100% - 230px);
    }

    /*------ Entity Details End ------*/

    /*------ Task Pool ------*/


    /*------ Task Pool End ------*/

    /*------ Pool ------*/

    .content-section {
        width: calc((100% / 2) - 9px);
    }

    .content-section:nth-child(4n) {
        margin-right: 18px;
    }

    .content-section:nth-child(3n) {
        margin-right: 18px;
    }

    .content-section:nth-child(2n) {
        margin-right: 0;
    }

    .pool-tasks .task-user-block {
        width: 100%;
    }

    .subtask-ico:before {
        position: absolute;
        top: 29px;
    }

    .pool-details .wf-bottom .detail-tab li {
        width: 33.33%;
    }

    /*------ Pool End ------*/

    /*------ Project ------*/

    .table-all-wrapper.project-listing {
        padding: 0;
    }

    .table-all-wrapper.project-listing .table-scrollable {
        padding: 0 20px 10px;
    }

    /*------ Project End------*/

    /*------ Project Details ------*/

    .summar-tab-header {
        display: block;
    }

    .summar-tab-header-left {
        float: left;
        width: 100%;
    }

    .project-other-info-block li {
        width: calc((100% / 2) - 13px);
        margin-bottom: 10px;
    }

    .project-other-info-block li:nth-child(2n) {
        margin-right: 0;
    }

    .summar-tab-header-right {
        float: right;
    }

    .recharts-legend-wrapper {
        padding-left: 0 !important;
    }

    .miles-table {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
        height: 100%;
    }

    .miles-table .table {
        width: 100%;
        min-width: 1200px !important;
    }

    .note-list-wrapper .nav-pills {
        width: 100%;
        width: 100%;
        margin: 0;
        height: auto;
        padding: 0;
        width: 100%;
        margin: 0;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: unset;
        border-bottom: 0;
        height: auto;
        width: 100%;
    }

    .note-list-wrapper .nav-pills .nav-link {
        flex: 0 0 60%;
        border-bottom: 0;
        height: 45px;
        border-left: 1px solid #E3E5E8;
    }

    .project-note-header {
        margin-bottom: 0;
    }

    .note-list-wrapper .nav-pills .nav-link.active .project-note-header h5 {
        color: var(--default-color);
    }

    .project-note-header h5 {
        max-width: 97%;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }

    .project-note-header button {
        display: none;
    }

    .project-note-desc {
        display: none;
    }

    .note-list-wrapper .tab-content {
        width: 100%;
        height: calc(100% - 46px);
    }

    .ind-team-user {
        width: 100%;
    }

    .ind-pj-chat-list {
        height: auto;
        position: relative;
    }

    .pj-chat-list-left {
        width: 100%;
        margin-bottom: 15px;
        padding-bottom: 15px;
        border-bottom: 1px solid #E3E5E8;
    }

    .pj-chat-list-left {
        width: 100%;
        margin-bottom: 15px;
    }

    .chat-list-left-top {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .chat-list-left-top-left {
        margin-bottom: 10px;
        margin-right: 0;
    }

    .chat-list-left-top-right {
        width: 100%;
    }

    .chat-list-left-top-right h5 {
        text-align: center;
    }

    .chat-list-left-top-right p {
        text-align: center;
    }

    .pj-chat-list-right {
        width: 100%;
    }

    .chat-list-right-bottom {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .chat-list-left-bottom p {
        text-align: center;
    }

    .chat-list-right-bottom .pj-added-user {
        width: unset;
        flex-wrap: wrap;
    }

    .parent-left {
        width: 100%;
        margin-bottom: 15px;
        padding-bottom: 15px;
        border-bottom: 1px solid #E3E5E8;
    }

    .parent-right {
        width: 100%;
    }

    .parent-right .pj-added-user {
        justify-content: center;
        display: flex;
        flex-wrap: wrap;
    }

    .parent-bottom p {
        text-align: justify;
    }

    .sub-chat {
        float: left;
        width: 100%;
    }

    .detail-tab {
        padding: 0;
        width: 100%;
        margin: 0;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: unset;
        border-bottom: 0;
        height: auto;
        width: 100%;
    }

    .form-detail-bottom-left .detail-tab {
        max-width: 100%;
        overflow-x: auto;
    }

    .common-align .form-detail-bottom-left {
        width: 55%;
    }

    .ind-small-tab {
        width: 100%;
    }

    .graph-wrap img {
        width: 100%;
    }

    .solid-graph {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .solid-graph-wrap {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .list-row.with-solid .blue-lister {
        width: 100%;
    }

    .list-row.with-solid {
        margin-bottom: 0;
    }

    .stakeholders-wrapper {
        padding: 20px 0;
    }

    .ibt-body.no-pad {
        padding: 0;
    }

    .ind-stakeholders-list:nth-child(3n) {
        margin-right: 20px;
    }

    .ind-stakeholders-list:nth-child(5n) {
        margin-right: 20px;
    }

    .ind-stakeholders-list:nth-child(2n) {
        margin-right: 0;
    }

    .ind-stakeholders-list {
        width: calc((100% / 2) - 10px);
    }

    .ind-pj-data {
        width: 100%;
        height: auto;
    }

    .ibt-body {
        padding: 0;
        height: calc(100% - 70px);
    }

    .ibt-header-top {
        position: relative;
    }

    .ibt-header-back-btn {
        font-size: 17px;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 82%;
        white-space: nowrap;
        display: flex;
        align-items: center;
    }

    .live {
        font-size: 8px;
        padding: 0 8px;
    }

    .since-date {
        width: 100%;
        float: left;
        margin: 0;
        padding-left: 29px;
    }

    .expands .ibt-header-bottom {
        height: calc(100% - 70px);
        overflow-y: auto;
    }

    .ibt-header-bottom-left {
        width: 150px;
        height: 150px;
        margin-bottom: 20px;
        position: relative;
        top: 0;
        left: 0;
    }

    .ibt-header-bottom-right {
        width: 100%;
        padding-left: 0;
    }

    .ibt-header-bottom-right-left {
        width: 100%;
        padding: 0;
    }

    .ibt-header-bottom-right-top {
        margin-bottom: 20px;
    }

    .ibt-header-details {
        display: block;
        height: auto;
        padding: 0;
        border: 0;
    }

    .ibt-header-details li {
        width: 50%;
        margin-right: 0;
        border-bottom: 1px solid #D1D1D1;
        padding: 6px 20px 6px 0;
        border: 0;
    }

    .ibt-header-bottom-right-right {
        width: 100%;
    }

    .expands .ibt-header-top-left {
        padding: 14px 0px;
    }

    .expands .ibt-header-bottom {
        height: calc(100% - 70px);
        overflow-y: auto;
    }

    .expands .ibt-header {
        height: 100%;
    }

    .ibt-rating {
        margin: 0px 0;
    }

    .ind-ibt-rating {
        width: 100%;
        margin-bottom: 20px;
    }

    .ibt-body {
        padding: 0 20px;
        height: calc(100% - 70px);
    }

    .blue-lister {
        width: 100%;
        margin-bottom: 20px;
    }

    .ibt-split-table .ibt-progress-table {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .ibt-split-table .ibt-progress-table:last-child {
        margin-bottom: 0;
    }

    .ibt-header-top-left {
        width: 100%;
    }

    .ibt-header-back-btn {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: normal;
        width: 100%;
        display: block;
        max-height: 20px;
    }

    .ibt-header-back-btn {
        line-height: normal;
    }

    .ibt-header-top {
        padding: 0 60px 0 20px;
    }

    .ibt-header-top-right {
        position: absolute;
        right: 22px;
        top: 23px;
    }

    .expands .ibt-header {
        height: calc(100%);
    }

    .expands .ibt-header-top-left {
        padding: 14px 0px;
    }

    .since-date {
        width: 100%;
        float: left;
        margin: 0;
        padding-left: 30px;
    }

    .projectdata-inprogress,
    .projectdata-done,
    .pj-due,
    .projectdata-new {
        position: relative;
        top: 0px;
    }

    .inprog {
        position: relative;
        top: 0px;
    }

    .expands .ibt-header-bottom {
        height: calc(100% - 70px);
        overflow-y: auto;
    }

    .non-image .ibt-header-bottom-right-left {
        width: 100%;
        padding-right: 0;
        margin-bottom: 20px;
    }

    .non-image .ibt-header-details {
        width: 100%;
        border: 0;
        padding: 0;
    }

    .non-image .ibt-header-details li {
        width: 100%;
    }

    .non-image .ibt-header-bottom-right-right {
        width: 100%;
        padding-left: 0;
    }

    .project-users li {
        width: 100%;
        margin-bottom: 15px;
    }

    .expands .projectdata-inprogress,
    .expands .projectdata-done,
    .expands .pj-due,
    .expands .projectdata-new {
        top: 0px;
    }

    .expands .inprog {
        top: 0px;
    }

    .pj-dash .dash-wrapper-left {
        width: 100%;
        margin-bottom: 20px;
    }

    .pj-dash .dash-wrapper-right {
        width: 100%;
        padding: 0;
        height: auto;
    }

    .ind-overview-status {
        width: 100%;
        margin-bottom: 20px;
    }

    .ind-performence-rate {
        width: 100%;
    }

    .dash-wrapper-right-top {
        margin-bottom: 20px;
    }

    .pj-dash .dash-wrapper {
        padding: 20px;
        overflow-y: auto;
    }

    .scrollable {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
        height: 100%;
    }

    .table.dash-tab {
        width: 900px;
    }

    .ind-project-list {
        width: 100%;
    }

    .task-tab.project-cycle-tab .card-body.project-cycle-body {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
        height: 100%;
    }

    .task-tab.project-cycle-tab .card-body.project-cycle-body .task-list-wrapper {
        width: 900px;
    }

    .task-tab.project-cycle-tab .card-body.project-cycle-body .task-list-wrapper .ind-task-list {
        height: 50px;
    }

    .task-tab.project-cycle-tab .card-body .ind-task-list-click {
        padding: 0;
        padding-left: 40px;
        height: 100%;
    }

    .task-tab.project-cycle-tab .project-cycle-info-list .ind-task-list-left {
        height: 100%;
    }

    .task-tab.project-cycle-tab .project-cycle-info-list .ind-task-list-left {
        align-items: center;
    }

    .task-tab.project-cycle-tab .project-cycle-info-list .ind-task-list-right {
        position: relative;
        top: 0;
        left: 0;
        height: 50px;
    }

    .overlay-mode .ibt-header-top-left .button-flex .project-source-header {
        padding-left: 30px;
    }

    .button-flex .ibt-header-back-btn:before {
        position: absolute;
        left: 0;
        top: 0;
    }

    .overlay-mode .ibt-header-back-btn:before {
        position: absolute;
        left: 0;
        top: 3px;
    }

    .overlay-mode .ibt-header-back-btn.button-flex {
        display: block;
        position: relative;
        width: 100%;
    }

    .overlay-mode .ibt-header-top-left {
        display: flex;
        align-items: center;
    }

    .overlay-mode .ibt-header-back {
        width: 100%;
    }

    .overlay-mode .energy:before {
        flex-shrink: 0;
    }

    .ibt-header-details li:last-child {
        border: 0;
    }

    .top-bot-pad {
        padding: 20px;
    }

    .task-tab .card-header h5 button .button-text {
        white-space: nowrap;
        max-width: 166px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .pj-team-wrapper.project-team-holder.collection-pad-top {
        padding: 0;
    }

    .status-view .ind-pj-data {
        width: 100%;
    }

    .ind-news-media {
        width: 100%;
    }

    .ibt-header-top-right.btn-option {
        padding-right: 25px;
        top: 27px;
    }

    .ibt-header-top-right.btn-option .form-option-block.nav-option {
        position: absolute;
        right: 0;
        top: 18px;
    }

    .ibt-body.dash-no-pad {
        padding: 0;
    }

    .empty-data {
        padding: 20px 0;
    }

    .graph-empty .empty-data {
        position: relative;
    }

    .pj-dash .dash-wrapper-left .ind-task-list-center {
        width: 100%;
        padding: 0;
    }

    .task-tab .card-body .card .proj-card-header {
        padding-left: 30px;
    }

    .accordian-each-header h5 {
        text-overflow: ellipsis;
        overflow: hidden;
        width: 50%;
        white-space: nowrap;
    }

    .resources-list.mob-scroll {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
    }

    .wrapper-able-aliker {
        width: 100%;
        min-width: 1200px !important;
    }

    .grid-vw .wrapper-able-aliker {
        min-width: unset !important;
    }

    .full-no-data h5 {
        font-size: 18px;
    }

    .board-wrap .board-list-wrapper {
        width: calc((100% / 2) - 10px);
    }

    .investor-category {
        width: 45%;
    }

    .investor-category-value {
        width: 55%;
        padding-left: 10px;
    }

    .common-align.project-header-align .form-detail-top-left {
        width: 100%;
    }

    .persitant-footer.align-small {
        height: 115px;
    }

    .dynamic-creation .persitant-top {
        height: calc(100% - 115px);
    }

    .group-row.major-area.mob-row-align {
        width: 75%;
    }

    .align-small .mob-row-align .group-container.align-equal {
        max-width: 100%;
        flex-direction: row;
        align-items: center;
        padding: 0;
    }

    .mob-row-align .date-container-block {
        margin-right: 0;
        width: 50%;
    }

    .mob-row-align .align-small .group-container.align-equal {
        flex-direction: column;
        width: 100%;
        max-width: 235px;
    }

    .task-tg .dynamic-creation .persitant-footer .mob-row-align .group-container.align-equal .date-container-block .input-log-time.date {
        width: 90%;
        margin-bottom: 11px;
    }

    .label-flex-container.eq-wid,
    .task-tg .dynamic-creation .persitant-footer .mob-row-align .group-container.align-equal .input-log-time.date {
        height: 40px;
    }

    .start-block {
        display: none;
    }

    .task-tab .subtask-ico {
        top: 30px;
        left: 5px;
    }

    .pj-task-heirarchy .task-tab .card-header h5 button {
        width: 65%;
    }

    .pj-task-heirarchy .task-tab .card-header .accord-header-right {
        width: auto;
    }

    .board-task-header {
        overflow-x: auto;
        overflow-y: hidden;
        height: 54px;
    }

    .board-discussion-container.full-height-board {
        height: calc(100% - 54px);
    }

    .board-modal-body-right .ind-board-task {
        height: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .board-task-left {
        width: 100%;
        justify-content: space-between;
        padding-right: 0;
        height: auto;
        margin-bottom: 5px;
    }

    .board-task-center {
        float: left;
        width: 100%;
        height: auto;
        padding-left: 30px;
        margin-bottom: 5px;
    }

    .board-task-right {
        width: 100%;
        height: auto;
    }

    .board-attachment-wrapper .file-each {
        width: calc((100% / 4) - 15px);
    }

    .board-attachment-wrapper .file-each:nth-child(8n) {
        margin-right: 20px;
    }

    .board-attachment-wrapper .file-each:nth-child(4n) {
        margin-right: 0;
    }

    .grid-room {
        float: left;
        width: 100% !important;
        height: 25% !important;
    }

    .grid-room:nth-child(2n) .room-info {
        width: 100%;
        left: 20px;
        top: calc(50% - 21px);
        bottom: auto;
        left: 0;
    }

    .chat-list-left-bottom {
        padding-left: 0;
    }

    /*------ Project Details End ------*/

    /*------ Resources ------*/

    /* .resources-filters-right .resources-filters-icons {
        margin: 0;
    } */
    .grid-vw .rc-list-contents {
        width: calc((100% / 2) - 9px);
    }

    .grid-vw .rc-list-contents:nth-child(4n) {
        margin-right: 20px;
    }

    .grid-vw .rc-list-contents:nth-child(2n) {
        margin-right: 0;
    }


    /*------ Resources End ------*/

    /*------ Meeting Room ------*/

    .grid-room:nth-child(1n) {
        width: 302px;
    }

    .grid-room:nth-child(2n) {
        width: calc(100% - 302px);
    }

    .grid-room:nth-child(3n) {
        width: calc((100% - 302px) / 2);
    }

    .grid-room:nth-child(4n) {
        width: calc((100% - 302px) / 2);
    }

    .room-people-list {
        display: none;
    }

    .grid-room:hover:nth-child(2n) .room-info {
        width: auto;
        left: 20px;
        top: auto;
        bottom: 20px;
    }

    .grid-room:hover:nth-child(4n) .room-image img {
        transform: scale(1);
    }

    .grid-room:nth-child(4n) .room-info,
    .grid-room:hover:nth-child(4n) .room-info {
        bottom: auto;
        width: 100%;
        top: calc(50% - 21px);
        left: 0;
    }

    /*------ Meeting Room End ------*/

    /*------ Certificate  ------*/

    .dynamic-creation.certificate-addition .persitant-top {
        height: calc(100% - 70px);
    }

    .ind-certificate-list {
        width: calc((100% / 2) - 10px);
    }

    .ind-certificate-list:nth-child(4n) {
        margin-right: 20px;
    }

    .ind-certificate-list:nth-child(2n) {
        margin-right: 0;
    }

    /*------ Certificate End  ------*/

    /* Call module */

    .call-container {
        padding: 20px;
        height: calc(100% - 60px);
        overflow-y: auto;
    }

    .call-left {
        width: 100%;
        height: auto;
        padding: 0;
    }

    .call-header {
        width: 100%;
        height: auto;
        padding: 20px;
        align-items: flex-start;
        flex-direction: column;
    }

    .call-user {
        width: 100%;
        margin: 0 0 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid #e6e6e6;
    }

    .call-stats {
        width: 100%;
        margin: 0 0 20px 0;
        padding-bottom: 20px;
        border-bottom: 1px solid #e6e6e6;
    }

    .call-body-filter {
        padding-right: 0;
        margin-bottom: 0;
    }

    .call-body-filter .select-box {
        max-width: 60%;
    }

    .call-body-content {
        height: 1000px;
    }

    .call-note-left {
        width: 100%;
        height: 750px;
        margin-bottom: 20px;
    }

    .call-note-tab-block {
        width: 100%;
        height: 210px;
        margin: 0;
        margin-bottom: 20px;
    }

    .call-note-card-block {
        width: 100%;
        height: 520px;
    }

    .call-note-tab .nav-tabs {
        flex-wrap: nowrap;
        overflow: hidden;
        overflow-x: auto;
    }

    .call-note-right {
        width: 100%;
        height: 250px;
        margin: 0;
    }

    .recommendation-content-inner {
        padding: 0;
    }

    .call-right {
        width: 100%;
        height: 600px;
    }

    .recommend-add-block .recommendation-content {
        padding-right: 20px;
    }

    .intake-content-inner {
        padding: 0;
    }

    .intake-content,
    .lab-content,
    .photo-content,
    .presc-content,
    .progress-content {
        width: 100%;
    }

    .lab-content-inner {
        padding: 0;
    }

    .lab-content .table {
        min-width: 900px;
    }

    .call-dashboard-inner {
        padding: 0;
    }

    .dashboard-child {
        width: 100%;
    }

    .status-calendar {
        zoom: .7;
    }

    .journal-block-inner {
        padding: 0;
    }

    .each-journal-list {
        min-width: 900px;
    }

    .photo-content-inner {
        padding: 0;
    }

    .photo-card-list {
        width: 100%;
    }

    .presc-content-inner {
        padding: 0;
    }

    .progress-content-inner {
        padding: 0;
    }

    .progress-table {
        min-width: 1200px;
    }

    .table-handle-overlay {
        min-width: 1200px;
    }

    .presc-content,
    .excersice-content,
    .period-content {
        width: 100%;
    }

    .period-info-body .col-md-3 {
        padding: 0;
        margin-bottom: 15px;
    }

    .period-info-body .col-md-3:last-child {
        margin: 0;
    }

    .period-table {
        width: 100%;
        max-width: 100%;
    }

    .message-content-inner {
        padding: 0;
    }

    .fixed-btn-bottom .sticky-message {
        padding: 0 9px;
    }

    /* Call module End */

    /* Sepalika Payment */

    .pay-body-header .container {
        max-width: 100%;
    }

    .pay-body-content-inner .container {
        max-width: 100%;
    }

    .pay-header .container {
        max-width: 100%;
    }

    .each-form-section {
        width: 100%;
        margin-bottom: 15px;
    }

    /* Sepalika Payment End */

    /* Sepalika Form */

    .type-form-inner {
        padding: 0;
    }

    .type-form-inner-form {
        height: 100%;
    }

    .type-form-left {
        display: none;
    }

    .type-form-right {
        width: 100%;
    }

    .type-form-bg .container,
    .type-form-bg .row {
        height: 100%;
    }

    .type-form-right-body-inner {
        padding: 30px 20px;
        height: auto;
    }

    .type-form-input {
        width: 100%;
    }

    .type-form-inner>p {
        display: none;
    }

    .type-form-right-footer {
        padding: 30px 20px;
    }

    /* Sepalika Form End */

    /* Attendance */

    .each-leave-card {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .leave-dashboard {
        margin-bottom: 0;
    }

    .profile-card {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .profile-card-img {
        width: 40px;
        height: 40px;
    }

    .profile-card-det {
        width: calc(100% - 53px);
    }

    .calendar-select-block {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
        height: 100%;
    }

    .calendar-select-block .calendar {
        width: 100%;
        min-width: 1500px !important;
    }

    .calendar-select-block .calendar-control-wrapper {
        min-width: 1500px;
    }

    .leave-calendar-block {
        display: flex;
        flex-direction: column;
    }

    .leave-calendar-left {
        width: 100%;
        height: 400px;
        margin: 0;
        margin-top: 20px;
        order: 1;
    }

    .leave-calendar-right {
        float: left;
        width: 100%;
        height: 600px;
    }

    .leave-calendar {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
        height: 100%;
    }

    .leave-calendar .rdtPicker table {
        min-width: 900px;
    }

    .leave-calendar .form-type-input {
        min-width: 900px;
    }

    .subpage-wrapper {
        height: auto;
    }

    .leave-apply-panel {
        height: 650px;
    }

    .apply-panel-body {
        height: 441px;
        height: calc(100% - 90px);
    }

    .apply-panel-header {
        flex-direction: column;
        height: 90px;
        justify-content: center;
    }

    .apply-panel-header h5 {
        margin-bottom: 10px;
    }

    .leave-form-split {
        width: 100%;
        margin: 0;
    }

    .each-field {
        width: 100%;
    }

    .leave-form-split .each-field {
        margin-bottom: 15px;
    }

    .leave-apply-form {
        padding-top: 20px;
    }

    .leave-form-button-block {
        width: 100%;
    }

    .leave-apply-form .attachment-task-group {
        margin: 0;
    }

    .leave-form-button-block .general-btn {
        width: 100%;
        height: 40px;
    }

    .leave-list-table {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
        height: 100%;
    }

    .leave-list-table .recent-table {
        min-width: 1200px;
    }

    .holiday-panel {
        width: 100%;
        height: 350px;
        margin-bottom: 20px;
        margin-right: 0;
    }

    .dashboard-cont {
        flex-direction: column;
    }

    .attendance-btn {
        width: 100%;
        height: 100px;
        margin: 20px 0 0 0;
    }

    .date-card {
        width: 100%;
        height: 217px;
    }

    .recent-dashboard {
        flex-direction: column;
    }

    .approval-wrapper .leave-apply-panel {
        height: calc(100vh - 100px);
    }

    .calendar-select-block.muster-month {
        height: auto;
    }

    .apply-panel-header .ex-cel-ico:before {
        margin-right: 10px;
    }

    .backto-btn {
        margin-bottom: 15px;
    }

    .each-field select {
        background: var(--white);
    }

    .recent-dashboard .carousel {
        width: 100%;
    }

    .leave-calendar .rbc-event {
        top: auto;
        bottom: 50px;
        left: 17px;
    }

    /* Attendance End */

    /* learn */

    .short-header .data-learner-course {
        width: 100%;
        display: flex;
        flex-direction: column;
        height: auto;
    }

    .data-learner-course-left {
        width: 100%;
        margin-bottom: 20px;
    }

    .data-learner-course-right.learn-footer {
        width: 100%;
        order: 0;
        margin-bottom: 20px;
    }

    .data-learner-course-other-details-left h5 {
        font-size: 16px;
        margin: 0;
    }

    .other-info-list li {
        width: 100%;
        margin-bottom: 15px;
        margin-right: 0;
    }

    .other-info-list li:last-child {
        margin-bottom: 0;
    }

    .course-complete-block h5 {
        text-align: center;
    }

    .other-info-list li p {
        font-size: 10px;
        margin-bottom: 0;
    }

    .learn-detail-wrapper.short-header.active .each-learner-course {
        height: auto;
    }

    .course-detailed-info h5 {
        white-space: nowrap;
        max-width: 100%;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .short-details {
        padding-bottom: 0;
    }

    .course-complete-block {
        min-height: 350px;
    }

    .task-wrapper .data-learner-course-right-body .course-preview-box iframe {
        height: 400px;
    }

    .rs-preview-block .mang-lbl-block-mod-in {
        width: 50%;
    }

    .rs-preview-box {
        width: 50%;
    }

    .resource-filter-modal-body .content-section {
        width: 100%;
    }

    /* Learn End */

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

    .wf-block .wf-btn-block {
        opacity: 1;
        pointer-events: auto;
    }
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

    .filter-left-block .select-box-holder {
        float: left;
        width: calc((100% / 4) - 8px);
        margin-left: 0;
    }

    .filter-left-block .select-box-holder:nth-child(2n) {
        margin-right: 10px;
    }

    .filter-left-block .select-box-holder:nth-child(4n) {
        margin-right: 0px;
    }

    .filter-all-wrapper {
        min-height: auto;
    }

    .main-panel-holder.has-filter {
        height: calc(100vh - 175px);
    }

    .wf-block .wf-btn-block {
        opacity: 1;
        pointer-events: auto;
    }

}

@media(max-height: 767px) {

    /* Project Details */

    .bsy-modal.height-520.project-add-mod .modal-body {
        height: calc(100vh - 179px);
    }

    .bsy-modal.project-add-mod {
        padding: 0;
    }

    /* Project Details End */

    /* Collection details */

    .bsy-modal.fixed-md .modal-body {
        height: calc(100vh - 177px);
        padding: 0;
    }

    /* Collection details end */

    /* Attendance */

    .leave-calendar .rbc-date-cell {
        padding: 15px;
        font-size: 16px;
    }

    .leave-calendar .rbc-event {
        font-size: 12px;
        top: -36px;
        max-height: 30px;
    }

    /* Attendance End */

}

@media(max-width: 767px) {

    /*------ Login ------*/

    .login-area {
        padding: 15px 25px;
    }

    .login-block {
        padding: 25px;
    }

    .login-bg {
        background: none;
    }

    .login-block h1 {
        font-size: 25px;
        top: -95px;
    }

    .sepalika .qa-ico:before {
        background-position: -386px -87px;
        width: 22px;
        height: 22px;
    }

    .ijsc .qa-ico:before {
        background-position: -386px -87px;
        width: 22px;
        height: 22px;
    }

    .zynapse .qa-ico:before {
        background-position: -386px -87px;
        width: 22px;
        height: 22px;
    }

    .layover-bg:before {
        z-index: 9999;
    }

    /*------ Login End ------*/

    /*------ Bs modal ------*/

    .bs-modal.bs-conformation .bs-modal-content {
        flex-wrap: wrap;
        height: auto;
        padding: 22px 20px;
    }

    .bs-modal.bs-conformation .bs-modal-content .bs-modal-title h3 {
        margin-bottom: 20px;
        text-align: left;
    }

    .bs-modal.bs-conformation .bs-modal-content .bs-modal-body {
        float: left;
        width: 100%;
        display: flex;
        justify-content: flex-end;
    }

    .bs-modal.bs-conformation .bs-modal-body button {
        height: 35px;
    }

    .show-sm {
        display: block !important;
    }

    .show-lg {
        display: none !important;
    }

    /*------ Bs modal End ------*/

    /*------ Dashboard ------*/

    .dash-wrapper-right {
        float: left;
        width: 100%;
        height: auto;
        padding: 20px 0 0 0;
    }

    .dash-wrapper {
        float: left;
        width: 100%;
        height: calc(100% - 60px);
        overflow-y: auto;
        padding: 20px;
    }

    .dash-wrapper-right-top {
        float: left;
        width: 100%;
    }

    .content-left {
        float: left;
        width: 100%;
        height: auto;
        margin-right: 0;
    }

    .ind-static-md {
        width: calc((100% / 2) - 10px);
    }

    .ind-static-md:nth-child(3n) {
        margin-right: 15px;
    }

    .ind-static-md:nth-child(2n) {
        margin-right: 0px;
    }

    .static-counter li {
        width: 100%;
        margin-bottom: 15px;
    }

    .static-counter li:last-child {
        margin: 0;
    }

    .dash-wrapper-right-center .small-tab {
        height: auto;
    }

    .dash-wrapper-right-center .task-counter {
        padding: 0;
    }

    .dash-wrapper-right-center .task-counter-text {
        margin-right: 44px;
    }

    .dash-wrapper-right-center .task-counter-text:last-child {
        margin-right: 0;
    }

    .scrollable {
        overflow: scroll;
        overflow-y: auto;
        width: 100%;
    }

    .scrollable table {
        width: 100%;
        min-width: 900px !important;
    }

    .content-left:last-child {
        margin: 0;
    }

    .dash-wrapper-left {
        float: left;
        width: 100%;
    }

    .calendar-today {
        display: none;
    }

    .task-split-header {
        padding: 0 15px;
    }

    .table-tab {
        margin-bottom: 20px;
    }

    .task-tg .task-input-container .task-input-block .form-type-input {
        padding-right: 0;
    }

    .task-tg .task-input-container .task-input-block .form-type-input:after {
        right: 15px;
    }

    .search-block .icon-in.icon-search.search-box-icon {
        left: 24px;
    }

    .dash-wrapper-right-center {
        float: left;
        width: 100%;
        margin-bottom: 0px;
    }

    .small-overflow {
        float: left;
        max-width: 82%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .brand-sub-logo {
        display: none;
    }

    .alert-task-inner {
        padding-right: 28px;
        height: auto;
    }

    .alert-msg-content p {
        font-size: 12px;
        max-width: 100%;
        display: flex;
        flex-direction: column;
    }

    .alert-msg-bold {
        font-size: 14px;
    }

    .alert-msg-content {
        flex-direction: column;
        align-items: flex-start;
    }

    .alert-task-holder {
        height: 80px;
        padding-top: 6px;
    }

    .alert-task-vew {
        height: 25px;
        font-size: 12px;
        min-width: auto;
        margin-left: 24px;
        margin-top: 3px;
    }

    .attach-button-container {
        position: absolute;
        right: 20px;
        top: 160px;
    }

    .input-block.expandable-textarea .ql-editor {
        padding-right: 65px;
    }

    /*------ Dahboard End ------*/

    /*------ Task ------*/

    .mobile-header-hide {
        display: none;
    }

    .top-sticky-bar {
        background: transparent;
        position: relative;
        box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.12), 0 4px 4px 0 rgba(0, 0, 0, 0.24);
        z-index: 9999;
        background: var(--theme-second);
        padding: 0;
        display: flex;
    }

    .ind-task-list {
        border-right: 1px solid transparent;
        border-left: 1px solid transparent;
    }

    .side-menu-wrapper {
        position: fixed;
        left: -475px;
        z-index: 11;
        transition: .4s ease-out;
        top: 60px;
        z-index: 999;
        height: calc(100% - 60px);
    }

    .side-menu-wrapper.active {
        left: 0;
    }

    .side-menu-wrapper {
        z-index: 999;
    }

    .side-bar-panel {
        width: 100%;
    }

    .user-othe-info {
        display: flex;
        align-items: center;
        justify-content: space-between;
        display: -ms-flexbox;
        display: -webkit-flex;
        -webkit-align-items: center;
        -ms-align-items: center;
        -webkit-justify-content: space-between;
        -ms-justify-content: space-between;
        float: left;
        width: 100%;
        position: relative;
        z-index: 2;
        background: var(--theme-second);
    }

    .user-info-click {
        border: 0;
    }

    .user-info-click.mob-area {
        display: flex;
        display: -ms-flexbox;
        display: -webkit-flex;
    }

    .mobile-toggle {
        float: left;
    }

    .toggle-mnu {
        display: block;
        width: 27px;
        height: 20px;
        margin: 8px 0;
    }

    .toggle-mnu span {
        position: relative;
        display: block;
    }

    .toggle-mnu span,
    .toggle-mnu span:after,
    .toggle-mnu span:before {
        width: 100%;
        height: 3px;
        background-color: #ffffff;
        transition: all 0.3s;
        backface-visibility: hidden;
    }

    .toggle-mnu span:after,
    .toggle-mnu span:before {
        content: "";
        position: absolute;
        left: 0;
        top: 9px;
    }

    .toggle-mnu span:after,
    .toggle-mnu span:before {
        content: "";
        position: absolute;
        left: 0;
        top: 9px;
    }

    .toggle-mnu span:after {
        top: 18px;
    }

    .toggle-mnu.on span:before {
        transform: rotate(45deg) translate(-1px, 0px);
    }

    .toggle-mnu.on span:after {
        transform: rotate(-45deg) translate(6px, -7px);
    }

    .toggle-mnu.on span {
        background-color: transparent;
    }

    .mob-search-ico:before {
        background-position: -148px -182px;
        width: 18px;
        height: 18px;
    }

    .mob-filter-ico:before {
        background-position: -172px -182px;
        width: 18px;
        height: 17px;
    }

    .task-home .task-content-wrapper {
        height: calc(100% - 230px);
    }

    .search-block {
        position: absolute;
        top: 0px;
        width: 100%;
        padding: 0 15px;
        transition: .4s ease-out;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        display: -ms-flexbox;
        display: -webkit-flex;
        -webkit-align-items: center;
        -ms-align-items: center;
        -webkit-justify-content: center;
        -ms-justify-content: center;
        background: var(--theme-second);
        z-index: 1;
        max-width: 100%;
    }

    .search-block.active {
        top: 60px;
        border-top: 1px solid rgb(255 255 255 / 17%);
    }

    .not-ico:before,
    .on-hover .not-ico:before,
    .not-ico:hover:before {
        background-position: -198px -182px;
        width: 17px;
        height: 18px;
    }

    .not-count {
        top: -7px;
        right: -10px;
    }

    .user-prof {
        width: 20px;
        height: 20px;
        border: 1px solid var(--default-grey);
    }

    .user-profile-image img {
        float: left;
        width: 100%;
        height: 250px;
    }

    .filter-all-wrapper.task-home {
        float: left;
        display: block;
        position: fixed;
        right: -100%;
        top: 60px;
        padding: 0;
        height: 100%;
        background: #fff;
        transition: .4s ease-out;
        z-index: 10;
    }

    .filter-left-block {
        float: left;
        width: 100%;
    }

    .filter-holder {
        display: block;
        float: left;
        width: 100%;
        height: calc(100vh - 120px);
        padding: 15px;
        overflow-y: auto;
    }

    .filter-left-block .select-box-holder {
        float: left;
        width: 100%;
        margin: 0;
        margin-bottom: 15px;
    }

    .filter-left-block .select-box-holder .c-select-in.form-group,
    .filter-left-block .select-box-holder .c-select-in.form-group select {
        float: left;
        width: 100%;
        max-width: 100%;
    }

    .filter-right-block {
        width: 100%;
        float: right;
        justify-content: flex-end;
        -webkit-justify-content: flex-end;
        -ms-justify-content: flex-end;
        margin-top: 20px;
    }

    .main-panel-holder.has-filter {
        height: calc(100% - 60px);
        padding: 0;
        background: #fff;
    }

    .main-panel-head {
        padding: 0 18px;
        color: var(--default-color);
    }

    .center-box {
        font-size: 25px;
        padding: 15px;
        text-align: center;
    }

    .task-toggler-wrapper.task-tg {
        width: 100%;
        border-radius: 0;
        box-shadow: none;
        right: 0;
        height: 100%;
        z-index: 99999;
    }

    .task-toggler-header {
        border-radius: 0;
    }

    .task-input-container {
        display: block;
    }

    .persitant-top {
        padding: 8px 15px;
    }

    .selectize-custom .select-drop-click-right {
        display: block;
    }

    .selectize-custom .select-drop-click-right h5 {
        margin-bottom: 2px;
    }

    .selectize-custom .select-drop li {
        height: 45px;
    }

    .icon-in.icon-expand-toggler {
        display: none;
    }

    .icon-in.icon-minimize {
        display: none;
    }

    .bsy-modal {
        padding: 0;
    }

    .bsy-modal .modal-dialog {
        margin: 0;
        height: 100%;
        max-width: 100%;
    }

    .bsy-modal .modal-content {
        border-radius: 0;
        height: 100%;
    }

    .bsy-modal .modal-header {
        border-radius: 0;
    }

    .content-section {
        width: 100%;
    }

    .ind-attach-list {
        width: 100%;
    }

    .bsy-modal .modal-body {
        max-height: calc(100vh - 121px);
    }

    .task-tg .task-content-block {
        border-right: 0;
        border-left: 0;
    }

    .Loader-holder {
        background: #fff;
    }

    .task-user-block.__usercard:hover .user-popover-block {
        display: none;
    }

    .mobile-toggle-search {
        float: left;
        padding: 0;
        line-height: 0;
        background: 0 0;
        border: 0;
        width: 22px;
        height: 22px;
        background: var(--default-color);
        border: 1px solid var(--white);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 20px;
        flex-shrink: 0;
    }

    .mobile-toggle-search:before {
        background-position: -422px -188px;
        width: 8px;
        height: 8px;
    }

    .search-box {
        height: 40px;
        border-radius: 5px;
        padding: 0 10px 0 35px;
    }

    .search-box::-webkit-input-placeholder {
        line-height: normal !important;
    }

    .search-box-icon {
        position: absolute;
        left: 24px;
        top: calc(50% - 8px);
    }

    .show-mob {
        display: flex;
    }

    .filter-all-wrapper.task-home.filter-mob-active {
        right: 0;
        z-index: 100;
    }

    .menu-layover:after {
        content: "";
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.75);
        position: absolute;
    }

    .qa-ico:before {
        background: var(--sprite-two) no-repeat -388px -241px;
        ;
        width: 20px;
        height: 20px;
    }

    .on-hover .qa-ico:before,
    .qa-ico:hover:before {
        background: var(--sprite-two) no-repeat -388px -241px;
        ;
        width: 20px;
        height: 20px;
    }

    .user-info-click .qa-ico:before {
        background: var(--sprite-two) no-repeat -386px -87px;
        width: 22px;
        height: 22px;
        zoom: .9;
    }

    .ijsc .user-info-click .qa-ico:before {
        background: var(--sprite-two) no-repeat -386px -86px;
    }

    .align-small .group-container.align-equal {
        flex-direction: column;
        width: 100%;
        max-width: 235px;
    }

    .align-small .group-row.major-area {
        height: 100px;
        width: 70%;
    }

    .persitant-footer.align-small {
        height: 115px;
    }

    .task-tg .dynamic-creation .persitant-footer.align-small .group-container.align-equal .input-log-time.date {
        width: 100%;
        margin-bottom: 10px;
    }

    .align-small .label-flex-container.eq-wid {
        width: 100%;
        height: 40px;
        max-width: 100%;
    }

    .align-small .general-btn.button-lg {
        min-width: 80px;
    }

    .dynamic-creation .persitant-top {
        height: calc(100% - 115px);
    }

    .assigned-tau-block.single-user .tau {
        margin-bottom: 5px;
    }

    .task-details-info-wrap li h5 {
        width: 90%
    }

    #collectionCount {
        font-size: 14px;
    }

    .float-button-box {
        width: 50px;
        height: 50px;
        right: 20px;
        bottom: 20px;
    }

    .float-button-box .icon-in.icon-plus {
        zoom: .8;
    }

    .main-panel-holder .main-panel-head:first-child {
        margin-top: 12px;
    }

    .rdt.form-type-input.rdtStatic {
        border: 1px solid #E3E3E3;
    }

    .rdtTime,
    .rdtMonths {
        border: 1px solid #e3e3e3e3;
        box-shadow: none;
    }

    .task-time-label {
        flex-direction: column;
        align-items: flex-start;
    }

    .task-time-label p {
        text-align: center;
        font-size: 12px;
    }

    .info-contianer .task-detail-user-info-left:last-child {
        padding: 0;
        margin: 0;
        border: 0;
    }

    .bs-modal .bs-modal-content .bs-modal-title h3 {
        font-size: 14px;
    }

    .bs-modal .btn {
        padding: 0 20px;
        height: 40px;
        font-size: 14px;
    }

    .rdr-DateRange {
        border: 1px solid #e3e3e3;
    }

    .center-box img {
        width: 150px;
        height: 150px;
    }

    .bsy-modal .modal-dialog.modal-sm {
        max-width: 100%;
    }

    .invite-user-form {
        float: left;
        width: 100%;
        height: calc(100% - 24px);
        position: absolute;
        left: 0;
        top: 0;
    }

    .invite-user-form .input-group {
        padding: 15px;
        margin-bottom: 0 !important;
    }

    .invite-user-form .scrollable-panel {
        height: 100%;
    }

    .log-panel .ind-added-user-list-left {
        width: 100%;
    }

    .time-log-sub-list-select .input-log-time.date:after {
        right: 0;
    }

    .wf-task-left .task-detail-header-right .task-other-opt {
        top: 15px;
        right: 0;
    }

    .without-high-footer .persitant-top {
        height: calc(100% - 70px);
    }

    .task-tg .dynamic-creation .persitant-footer .group-container.align-equal .date-container-block.single-block .input-log-time.date {
        width: 100%;
    }

    .date-container-block.single-block {
        margin-right: 0;
        width: 100%;
        margin-bottom: 0;
    }

    .search-result {
        top: 118px;
        padding: 20px 15px;
    }

    /*------ Task End ------*/

    /*------ Task Details ------*/

    .top-sticky-bar .task-nav {
        display: none;
    }

    .top-sticky-bar .task-nav {
        display: none;
    }

    .task-detail-user-info {
        display: block;
        margin-bottom: 15px;
    }

    .task-detail-user-info-left {
        width: 100%;
        display: block;
        width: 100%;
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-bottom: 1px solid #e4e4e4;
    }

    .task-detail-panel .individual-assigners .task-detail-user-info-left {
        width: 100%;
    }

    .task-detail-user-info-right {
        float: left;
        width: 100%;
        text-align: center;
        justify-content: space-between;
    }

    .task-submit-block {
        padding: 0;
        display: block;
    }

    .chat-tab-block .nav-tabs .nav-item {
        flex: 0 0 60%;
    }

    .scroll-div .nav-tabs {
        padding: 0;
        margin: 0;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: unset;
        border-bottom: 0;
        height: auto;
        width: 100%;
        border-bottom: 0;
    }

    .btn-section-left {
        float: left;
        width: 100%;
        margin-bottom: 15px;
    }

    .working-time-section {
        float: left;
        width: 100%;
        align-items: center;
        justify-content: flex-end;
    }

    .task-detail-panel-attachment .attachment-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .info-contianer {
        display: block;
    }

    .time-log-items.one-third .react-datepicker__input-container:after {
        content: none;
    }

    .time-log-sub-list-select {
        height: 100%;
    }

    .row-list {
        height: auto;
    }

    .time-log-items.one-third {
        width: 100%;
        margin: 0;
        height: 50px;
    }

    .modal-time-log {
        height: 100%;
    }

    .time-log-top {
        height: 100%;
    }

    .time-log-sub-list-select form {
        float: left;
        width: 100%;
        height: 100%;
    }

    .task-mob-back:before {
        content: "";
        background: var(--sprite-one) no-repeat -482px -187px;
        width: 10px;
        height: 9px;
        display: inline-block;
    }

    .task-mob-back {
        float: left;
        width: 22px;
        height: 16px;
        padding: 0;
        border: 0;
        background: transparent;
        line-height: 0;
        margin-right: 4px;
        display: flex;
    }

    .attachment-list.attach_forms li {
        width: 100%;
    }

    .task-details-info-wrap {
        display: block;
        height: auto;
        width: 100%;
    }

    .task-details-info-wrap li {
        width: 100%;
        float: left;
        margin: 0;
        margin-bottom: 18px;
    }

    .task-details-info-wrap li:last-child {
        margin-bottom: 0;
    }

    .task-alert-right a,
    .task-alert-right span {
        font-size: 11px;
    }

    .task-alert h5 {
        font-size: 11px;
    }

    .task-details-wrapper .info-contianer .task-detail-user-info-left:last-child {
        padding: 0;
        margin: 0;
        border-bottom: 0;
    }

    .profile-sm-modal .modal-dialog {
        margin: 1.75rem auto;
    }

    .task-details-header-block {
        height: auto;
        position: relative;
        min-height: 60px;
        padding: 20px;
    }

    .task-detail-header-right {
        align-items: flex-start;
    }

    .task-detail-header-laeft {
        display: flex;
    }

    .nav-item {
        flex: 0 0 60%;
    }

    .task-extra-tab-block .nav-tabs .nav-item {
        margin-bottom: 0;
    }

    .task-tg .task-input-block .task-input-box {
        width: 100%;
    }

    .task-detail-panel-content-area-left {
        width: 100%;
        padding: 0;
    }

    .task-submit-block {
        padding-left: 0;
    }

    .wf-task-left .task-details-info-wrap {
        margin-top: 15px;
    }

    .modal {
        z-index: 9999;
    }

    .form-detail-top-right .data-search-button .ex-cel-ico,
    .form-detail-top-right .ex-cel-ico,
    .modal-header-right .ex-cel-ico,
    .modal-header-right .ex-pdf-ico {
        font-size: 0;
        min-width: auto;
    }

    .form-detail-top-right .data-search-button .ex-cel-ico:before,
    .form-detail-top-right .ex-cel-ico:before,
    .modal-header-right .ex-cel-ico:before,
    .modal-header-right .ex-pdf-ico:before {
        margin-right: 0;
    }

    .wf-task-next .select-lister.rejection-lister li {
        margin-bottom: 10px;
    }

    .wf-task-next .select-lister.rejection-lister li .radio-block {
        min-width: 157px;
    }

    .workflow-task .task-details-header-block {
        padding-top: 0;
    }

    .wf-task-next .sub-block .workflow-task-body-container .nested-form-content h5,
    .wf-task-next .workflow-task-body-container .nested-form-content p {
        white-space: nowrap;
        max-width: 160px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .task-extra-tab-block .nav-tabs .nav-item {
        flex: 0 0 16%;
    }

    .mark-as-done-mod .modal-body {
        max-height: 100%;
    }

    .mark-as-done-mod .log-container .time-log-items.one-third {
        width: 100%;
        margin-left: 0;
    }

    .mark-as-done-mod .log-container .row-list {
        border-bottom: 1px solid #f3f1f1;
    }

    .attachment-list {
        max-width: 100%;
        /* justify-content: center; */
    }

    .task-wrapper.task-detail-stand.workflow-task-wrapper {
        padding: 0;
    }

    .workflow-task-wrapper .task-extra-tab-block .nav-tabs .nav-item {
        flex: 0 0 25%;
    }

    .workflow-task-wrapper .task-detail-header-left {
        float: left;
        width: 95%;
        display: flex;
    }

    .workflow-task-wrapper .due-mount {
        order: 1;
        margin-right: 0;
    }

    .workflow-task-wrapper .wf-task-left .task-details-info-wrap {
        width: calc(100% - 70px);
    }

    .workflow-task-wrapper .wf-task-left .task-details-info-wrap li {
        width: 50%;
    }

    .workflow-task-wrapper .wf-task-left .task-details-info-wrap li:last-child {
        width: 100%;
    }

    .workflow-task-wrapper .task-right {
        margin-bottom: 20px;
    }

    .fixed-chat-bottom.popover-text {
        left: 15px;
        width: calc(100% - 30px);
    }

    .fixed-chat-bottom.popover-text .expand-close {
        top: -30px;
        right: 0;
    }

    .bsy-modal .modal-body.time-log {
        height: 100%;
    }

    .time-log .log-addition {
        z-index: 9;
        right: 5px;
    }

    .time-log .time-log-items.one-third {
        padding: 0 5px;
    }

    .task-chat-container {
        float: left;
        width: 100%;
        background: #ECF0F1;
        padding: 20px 0;
        border-radius: 5px;
    }

    .task-detail-user-thumb {
        width: 37px;
        height: 37px;
    }

    .task-detail-header-right .task-other-opt {
        position: absolute;
        right: 20px;
        top: 20px;
    }

    .resource-filter-modal-header .lbl-panel-search-block,
    .resource-filter-modal-header .select-box {
        width: 50%;
    }

    .bsy-modal .modal-footer .general-btn {
        padding: 0 16px;
        min-width: auto;
        height: 35px;
        margin-left: 10px;
    }

    .m-modal.preview-task-at .modal-dialog {
        max-width: 100%;
    }

    .drop-cont .dropzone p {
        font-size: 21px;
        line-height: 36px;
    }

    .center-placeholder h5 {
        text-align: center;
        font-size: 17px;
    }

    .center-placeholder p {
        padding: 0;
    }

    .ind-task-list:hover .notf-task-ico,
    .ind-task-list:hover .task-board-ico,
    .ind-task-list:hover .task-pool-ico,
    .ind-task-list:hover .task-systask-ico,
    .ind-task-list:hover .wf-task-ico {
        display: block;
    }

    .search-progress .right-description h5 {
        width: 80%;
    }

    .search-progress .right-description p {
        width: 100%;
    }

    .workflow-task .task-details-body-block {
        margin-bottom: 10px;
    }

    .workflow-task-wrapper .task-right:last-child {
        margin-bottom: 0;
    }

    .task-input-flex-block+.select-chk-block.task-select {
        margin-top: 20px;
    }

    /*------ Task Details End ------*/

    /*------ User ------*/

    .team-card {
        float: left;
        width: 100%;
    }

    .collection-form-left {
        width: 100%;
        padding: 20px;
    }

    .collection-form-right {
        display: none;
    }

    .collection-form-footer-left {
        width: 100%;
        padding: 0 20px;
    }

    .collection-form-footer-right {
        display: none;
    }

    .main-panel-holder .bsy-modal .modal-body {
        max-height: 100%;
    }

    .form-input-container-outer {
        padding-right: 0;
    }

    .form-input-block-left .ind-task-input {
        padding-left: 0;
    }

    .collection-form-left-body {
        height: calc(100% - 45px);
    }

    .main-panel-holder.has-filter.user-lister-container {
        padding: 20px;
    }

    .main-panel-holder.has-filter.user-lister-container .card-holder {
        height: auto;
    }

    .h-align .radio-block {
        width: 100% !important;
    }

    .project-content-wrapper.group-height.group-top {
        height: calc(100vh - 196px);
        padding-top: 0;
    }

    /*------ User End ------*/

    /*------ User Details ------*/

    .user-detail-content {
        display: block;
        height: auto;
    }

    .details-in-holder {
        display: block;
        height: auto;
        padding: 15px;
        display: block;
    }

    .pintile-thumb {
        float: left;
        width: 90px;
        height: 90px;
        margin-bottom: 20px;
    }

    .pintile-description {
        padding: 0;
        width: 100%;
        display: block;
        float: left;
    }

    .user-description-in {
        width: 100%;
        margin-bottom: 25px;
    }

    .user-task-indicator {
        float: left;
        width: 100%;
        margin-bottom: 25px;
    }

    .task-indic-box {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .user-detail-graph-block {
        float: left;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .task-count-text {
        text-align: center;
    }

    .indic-box-text {
        text-align: center;
    }

    .description-options {
        float: left;
        position: absolute;
        right: 0;
        top: 0;
    }

    .details-wrapper {
        overflow-y: auto;
    }

    .tab-holder .tab-list {
        width: 100%;
        width: 100%;
        margin: 0;
        height: auto;
        padding: 0;
        width: 100%;
        margin: 0;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: unset;
        height: auto;
        width: 100%;
    }

    .tab-holder .tab-list-items {
        flex: 0 0 60%;
    }

    .user-button-block .filter-button {
        height: 30px;
        font-size: 12px;
    }

    .tab-wrapper .user-button-block {
        margin-bottom: 15px;
    }

    .description-options-box {
        right: -7px;
        top: 17px;
    }

    .user-task-indicator {
        display: block;
    }

    .scrollable-in {
        overflow: scroll;
        overflow-y: hidden;
        width: 100%;
        margin-bottom: 20px;
    }

    .scrollable-in .permission-table {
        width: 100%;
        min-width: 900px !important;
    }

    .user-name-in {
        max-width: 220px;
    }

    .user-detail-list-items {
        max-width: 220px;
    }

    .previous-stage {
        text-align: left;
        font-size: 16px;
        width: 100%;
        margin-bottom: 15px;
        margin-right: 0;
        padding-right: 29px;
    }

    .previous-stage:before {
        margin-right: 10px;
    }

    .communication-panel li {
        width: 50%;
        margin-right: 0;
        display: flex;
        align-items: center;
        border-radius: 5px;
        margin-bottom: 5px;
    }

    .user-detail-card-top {
        margin-bottom: 14px;
    }

    .user-statistics-each {
        width: 100%;
        margin-bottom: 10px;
        margin-right: 0;
    }

    .details-wrapper.user-full {
        height: calc(100% - 60px);
    }

    .right-panel-header {
        display: none;
    }

    .tab-holder.user-ui.user-height {
        height: 400px;
    }

    .tab-holder.user-height .tab-list-items {
        flex: unset;
    }

    .user-detail-card-center-right {
        width: 100%;
    }

    .user-detail-card-center-left {
        margin-bottom: 12px;
        width: 75px;
        height: 75px;
    }

    .user-detail-card-top {
        padding-bottom: 14px;
        border-bottom: 1px solid #e4e5e9;
    }

    .filter-all-wrapper.team-settings .filter-holder {
        height: 40px;
        padding: 0;
    }

    .team-settings+.main-panel-holder.has-filter.user-lister-container {
        padding: 0 20px 0 20px;
        max-width: 100%;
    }

    .communication-panel {
        width: 100%;
    }

    .communication-panel li {
        width: auto;
        margin-right: 13px;
    }

    .user-detail-card-center .user-detail-list {
        height: auto;
    }

    .user-detail-card-center-right {
        height: auto;
    }

    .each-grid:last-child {
        margin-bottom: 0;
    }

    /*------ User Details End ------*/

    /*------ Chat ------*/

    .chat-starter-text,
    .chat-date-in {
        padding: 4px 12px;
        height: auto;
        line-height: normal;
        text-align: center;
    }

    .chat-mob-header {
        float: left;
        width: 100%;
        height: 97px;
        background: #fff;
        display: flex;
        flex-direction: column;
    }

    .chat-mob-header .chat-profile {
        height: 55px;
        display: flex;
        align-items: center;
        padding: 0 15px;
        width: 100%;
    }

    .chat-profile-img {
        float: left;
        width: 37px;
        height: 37px;
        border-radius: 50%;
        padding: 2px;
        border: 1px solid #1370BE;
        margin-right: 10px;
    }

    .chat-profile-img img {
        float: left;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 50%;
    }

    .chat-profile-description h5 {
        float: left;
        width: 100%;
        opacity: 0.9;
        color: #2E3243;
        font-size: 16px;
        font-weight: 600;
        line-height: 21px;
        margin-bottom: 2px;
        display: block;
        max-width: 90%;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }

    .chat-profile-description p {
        float: left;
        width: 100%;
        color: #B9BFC4;
        font-size: 12px;
        line-height: 14px;
        display: block;
        max-width: 90%;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }

    .communication-block {
        float: left;
        width: 100%;
        border: 1px solid #e4e4e4;
        border-right: 0;
        border-left: 0;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
    }

    .communication-block .user-info-click {
        height: 40px;
    }

    .chat-com {
        cursor: pointer;
    }

    .chat-in-panel {
        height: calc(100% - 187px) !important;
        max-height: none !important;
        min-height: calc(100% - 187px) !important;
        overflow-y: scroll !important;
    }

    .ind-disscussion-sub.url-lk {
        align-items: normal;
    }

    .small-hide {
        display: none;
    }

    .dropzone {
        font-size: 18px;
        text-align: center;
    }

    /*------ Chat End ------*/

    /*------ Collection ------*/

    .tile-each {
        width: 100%;
    }

    .append-icn-area {
        float: left;
        height: 50px;
        display: flex;
        align-items: center;
    }

    .create-button-block {
        top: 0;
    }

    #to_list {
        float: left;
        width: 100%;
    }

    .ind-panel-options.radio-wrapper {
        padding-top: 15px;
    }

    /*------ Collection End ------*/

    /*------ Collection Details ------*/

    .form-detail-left {
        float: left;
        width: 100%;
    }

    .form-detail-right {
        float: left;
        width: 100%;
    }

    .common-align .form-detail-top.project-top {
        height: auto;
    }

    .data-view.field-form .form-detail-top-left {
        float: left;
        width: 100%;
        padding: 0;
        margin: 0;
        border: 0;
    }

    .form-detail-bottom {
        display: block;
        height: auto;
        padding-right: 0;
    }

    .form-detail-bottom-left {
        width: 100%;
        border-bottom: 1px solid #E3E5E8;
    }

    .detail-tab {
        padding: 0;
        width: 100%;
        margin: 0;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: unset;
        border-bottom: 0;
        height: auto;
    }

    .detail-tab li a {
        font-size: 0;
    }

    .form-detail-bottom-right {
        height: 55px;
        width: 100%;
    }

    .section-info-icon {
        padding: 0 20px;
    }

    .form-detail-bottom-right .section-info-icon span {
        height: 55px;
        margin: 0;
    }

    .data-view.field-form .data-holder {
        height: calc(100vh - 270px);
        max-height: 100%;
        overflow-y: auto;
    }

    .data-view.field-form.infinte-scroll .data-holder {
        height: calc(100% - 270px);
    }

    .data-holder-left {
        width: 100%;
        height: auto;
        margin: 0;
    }

    .data-holder-right {
        width: 100%;
        height: auto;
    }

    .data-holder-filter-wrap {
        display: block;
        margin-bottom: 0;
    }

    .data-holder-filter-left {
        width: 100%;
        margin-bottom: 20px;
    }

    .data-holder-filter-right {
        width: 100%;
        display: block;
    }

    .data-search-box {
        width: 100%;
        margin-bottom: 15px;
    }

    .data-search-button {
        float: left;
        width: 100%;
        display: block;
        justify-content: flex-end;
        margin-bottom: 20px;
    }

    .data-search-button .general-btn:first-child {
        margin-left: 0;
    }

    .data:before {
        margin-right: 0;
    }

    .common-align .form-detail-top.project-top h5 {
        word-break: break-word;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 90%;
        white-space: nowrap;
    }

    .data-view .form-detail-top {
        height: auto;
        display: block;
        max-height: none;
    }

    .data-view .form-detail-top-left {
        float: left;
        width: 100%;
        padding-bottom: 15px;
        margin-bottom: 15px;
        border-bottom: 1px solid #E3E5E8;
    }

    .data-view.field-form .form-detail-top-left {
        padding: 0;
        margin: 0;
        border: 0;
        padding-right: 25px;
    }

    .form-detail-top-right {
        float: left;
        width: 100%;
        padding: 0;
    }

    .form-detail-top-right {
        display: block;
        height: auto;
    }

    .data-search-box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
        margin-top: 20px;
        float: left;
        width: 100%;
    }

    .form-detail-top-right .data-search-box {
        width: 100%;
        margin-bottom: 0;
        margin-top: 0px;
    }

    .data-search-button {
        float: left;
        width: 100%;
        display: flex;
        justify-content: flex-end;
    }

    .data-search-button {
        margin-top: 20px;
        margin-bottom: 0;
    }

    .form-detail-top-right .form-option-block {
        top: 35px;
    }

    .data-holder-left {
        float: left;
        width: 100%;
        height: 100%;
        position: absolute;
        left: -100%;
        top: 0;
        background: #fff;
        z-index: 9999;
        transition: .3s ease-out;
    }

    .data-holder-left.active {
        left: 0;
    }

    .data-holder-left .label-menu-right-block.filter-top {
        float: left;
        width: 100%;
        height: calc(100% - 180px);
        padding: 20px;
        overflow-y: auto;
    }

    .mob-filter-footer {
        float: left;
        width: 100%;
        height: 70px;
        border-top: 1px solid rgba(64, 83, 100, 0.15);
        padding: 0 20px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .mob-filter-footer .general-btn {
        height: 30px;
    }

    .mob-filter-header {
        float: left;
        width: 100%;
        height: 50px;
        border-bottom: 1px solid rgba(64, 83, 100, 0.15);
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 20px;
    }

    .mob-filter-header h5 {
        font-weight: 600;
    }

    .close-ico {
        float: left;
        padding: 0;
        line-height: 0;
        background-color: transparent;
        border: 0;
    }

    .close-ico:before {
        content: "";
        background: var(--sprite-one) no-repeat -379px -71px;
        width: 13px;
        height: 13px;
        display: inline-block;
    }

    .filter-ico {
        display: block;
    }

    .data-search-left {
        margin-top: 20px;
        width: 100%;
    }

    .data-view.field-form.small-no-tab .data-holder {
        height: calc(100% - 194px);
        overflow-y: hidden;
    }

    .data-holder-right .form-table {
        max-width: 100%;
        overflow-y: auto;
    }

    .small-no-tab .data-holder-right {
        height: 100%;
    }

    .data-view.field-form.small-no-tab.with-opt .data-holder {
        height: calc(100% - 249px);
    }

    .form-detail-top-right .general-btn {
        font-size: 0;
        min-width: auto;
        margin-top: 20px;
    }

    .ex-cel-ico:before {
        margin-right: 0;
    }

    .form-detail-top-right .general-btn {
        margin-left: 0;
    }

    .data-search-button .general-btn {
        font-size: 0;
        min-width: auto;
        margin-top: 0;
        margin-left: 15px;
    }

    .data-search-button .general-btn:first-child {
        margin-left: 0;
    }

    .data-search-button .general-btn:before {
        margin-right: 0;
    }

    .form-detail-top-right .data-search-box {
        margin-right: 20px;
    }

    .ind-collection-card {
        height: auto;
    }

    .collection-card-right-footer ul li {
        width: 33.33%;
        margin-bottom: 12px;
    }

    .data-view.ent-form .data-holder {
        height: calc(100vh - 290px);
        overflow-y: auto;
    }

    /* .grid-view .ind-collection-card {
        width: 100%;
        margin-right: 0px;
    } */
    .fixed-card-area {
        max-width: calc(100% - 40px);
        height: auto;
    }

    .fixed-card-content li {
        margin-bottom: 15px;
    }

    .fixed-card-content li:last-child {
        margin-bottom: 0;
    }

    .fixed-card-area {
        max-width: calc(100% - 40px);
    }

    .data-holder-left .radio-wrapper .radio-block {
        width: 100%;
    }

    .collection-card-right-footer ul li {
        width: 50%;
        margin-right: 0;
        padding-right: 20px;
    }

    .data-holder.form-wrap.template-container-view {
        padding: 0 20px;
    }

    .template-container-view .data-holder-right .card-container.template-collection {
        padding: 0;
    }

    .grid-view .ind-collection-card:nth-child(3n) {
        width: 100%;
        margin-right: 0;
    }

    .form-table {
        max-width: 100%
    }

    .side-tab .tab-content {
        width: 100%;
    }

    .template-anchor {
        width: 100%;
        display: inline-block;
        overflow-x: auto;
        overflow-y: hidden;
        border-radius: 5px;
        white-space: nowrap;
        display: flex;
    }

    .set-container {
        height: calc(100% - 70px);
    }

    .tab-wrap-block p {
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 205px;
        overflow: hidden;
    }

    .edit-template-left {
        width: 100%;
        border-right: 0;
    }

    .edit-template-right {
        width: 100%;
    }

    .side-tab .tab-content .tab-pane .grid-view .ind-collection-card {
        flex-direction: column;
    }

    .side-tab .tab-content .tab-pane .collection-card-left {
        width: 100%;
        margin-bottom: 20px;
    }

    .side-tab .tab-content .tab-pane .collection-card-right {
        width: 100%;
    }

    .side-tab .tab-content .tab-pane .collection-card-right-footer ul li {
        width: 100%;
    }

    .side-tab .tab-content .tab-pane .collection-card-right-footer ul {
        flex-direction: column;
    }

    .template-anchor {
        border-radius: 0;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-4 .ind-form-field.fieldset.flex-box .style-view .upload-wrapper.sm-line,
    .template-4 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .task-setting-body-left {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
        padding: 0;
    }

    .task-setting-body-right {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }

    .task-field-each {
        flex-direction: column;
        align-items: start;
        height: auto;
        min-height: 50px;
        padding: 10px 20px;
    }

    .task-field-each-left label {
        margin-bottom: 10px;
    }

    .set-container.no-pad-right-bottom {
        padding-right: 20px;
        padding-bottom: 0;
    }

    .task-map-label .input-box {
        width: 100%;
    }

    .template-5 .signature-canvas {
        display: block;
        padding-right: 0;
    }

    .template-5 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 150px;
    }

    .template-5 .sig-preview {
        width: 100%;
        margin-top: 20px;
    }

    .template-5 .ind-form-field .file-upload label {
        padding: 0;
    }

    .template-5 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-5 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }

    .template-5 .ind-form-field .input-block {
        padding-left: 0;
    }

    .template-5 .ind-form-field .input-block:before,
    .template-5 .ind-form-field .checkbox-wrapper:before,
    .template-5 .ind-form-field .radio-wrapper:before,
    .template-5 .ind-form-field .fieldset:before {
        content: none;
    }

    .template-5 .ind-form-field .radio-wrapper {
        padding-left: 0;
    }

    .template-5 .ind-form-field .checkbox-wrapper {
        padding-left: 0;
    }

    .template-5 .ind-form-field .fieldset {
        padding-left: 0;
        margin-bottom: 30px;
    }

    .template-5 .modal-body {
        padding-top: 15px;
    }

    .template-5 .form-preview-header {
        margin-bottom: 50px;
    }

    .template-3 .ind-form-field .signature-canvas {
        display: block;
    }

    .template-3.width-540 .sig-preview {
        margin-left: 0;
        width: 100%;
    }

    .template-3.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
    }

    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-1 .signature-canvas {
        display: block;
    }

    .template-1.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
    }

    .template-1 .sig-preview {
        width: 100%;
        margin-top: 0;
    }

    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-1 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-1 .signature-canvas canvas {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-1.width-720 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
    }

    .template-1.width-720 .sig-preview {
        margin-left: 0;
    }

    .template-2 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
    }

    .template-2 .ind-form-field .signature-canvas {
        display: block;
    }

    .template-2 .sig-preview {
        width: 100%;
        margin-bottom: 20px;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-2.width-720 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
    }

    .template-2.width-720 .sig-preview {
        width: 100% !important;
        margin-left: 0;
    }

    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view {
        width: 100%;
    }

    .template-2.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
    }

    .template-2.width-540 .sig-preview {
        margin-left: 0;
        margin-top: 0;
    }

    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-3 .ind-form-field .signature-canvas canvas,
    .template-3.width-720 .ind-form-field .signature-canvas canvas,
    .template-3.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .template-3 .sig-preview,
    .template-3.width-720 .sig-preview,
    .template-3.width-540 .sig-preview {
        width: 100%;
        margin-left: 0;
        margin-top: 0;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-4 .signature-canvas {
        display: block;
    }

    .template-4 .ind-form-field .signature-canvas canvas,
    .template-4.width-720 .ind-form-field .signature-canvas canvas,
    .template-4.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .template-4 .sig-preview,
    .template-4.width-720 .sig-preview,
    .template-4.width-540 .sig-preview {
        width: 100%;
        margin-left: 0;
        margin-top: 0;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-5.width-720 .sig-preview,
    .template-5.width-540px .sig-preview {
        margin: 0;
    }

    .template-5.width-720 .ind-form-field .signature-canvas canvas,
    .template-5.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .template-5.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-5.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-5.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
        height: auto;
    }

    .template-5.width-540 .sig-preview {
        margin: 0;
    }

    .template-4 .ind-form-field .input-block .fiels-inp-box {
        width: 100%;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
        padding: 0;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-4 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-4.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-3.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-3 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-3.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
        padding-right: 0;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-2 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-2.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-2.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-2.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .template-1 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper,
    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .radio-wrapper {
        width: 100%;
    }

    .template-1 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-1.width-960 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-1.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-1.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
    }

    .shot_preview video {
        width: 100%;
    }

    .cam-preview {
        width: 100%;
    }

    .capture-mode-1 {
        flex-direction: column;
    }

    .shot_preview {
        margin-bottom: 20px;
    }

    .cam-preview img {
        object-fit: contain;
    }

    .collection-dashboard {
        margin-top: 20px;
        margin-left: 0;
        margin-right: 10px;
    }

    .template-4 .modal-body .container {
        padding: 0;
        margin-left: 0;
        margin-right: 0;
        float: left;
    }

    .template-4 .modal-body {
        padding: 0;
        max-width: 100%;
        overflow-x: hidden;
    }

    .template-4 .modal-body .form-preview-header {
        padding: 0 25px;
    }

    .photo-modal {
        padding: 0;
    }

    .photo-modal .modal-dialog {
        margin: 0
    }

    .photo-modal .shot_preview {
        height: 100%;
        margin-bottom: 0;
    }

    .right-panel-white-box.fieldset.address-field .form-single-value-box:first-child {
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid #e4e6e9;
    }

    .right-panel-white-box.fieldset {
        flex-direction: column;
    }

    .right-panel ul li {
        margin-bottom: 25px;
    }

    .full-wid-mod .modal-body {
        padding: 1rem;
    }

    .template-4 .ind-form-field .upload-wrapper .file-tag {
        max-width: 100px;
    }

    .template-4 .ind-form-field .file-upload label {
        -webkit-line-clamp: 2;
        line-height: normal;
    }

    .collection-card-right-footer ul li h5 {
        width: 100%;
        max-height: none;
        overflow: revert;
        display: block;
    }

    .template-2 .detailed-form-view-right-body .form-preview-container {
        margin: 0 25px;
        width: calc(100% - 50px);
    }

    .template-1 .detailed-form-view-right-body .form-preview-container {
        margin: 0 25px;
        width: calc(100% - 50px);
    }

    .template-1 .detailed-form-view-right-top {
        padding: 20px 25px;
    }

    .template-2 .detailed-form-view-right-top {
        padding: 20px 25px;
    }

    .template-12 .detailed-form-view-right-bottom {
        padding: 0px 25px;
    }

    .template-2 .detailed-form-view-right-bottom {
        padding: 0px 25px;
    }

    .template-4.direct-flow .modal-body .form-preview-header {
        padding: 0;
        padding-right: 30px;
    }

    .direct-flow .form-preview-header .preview-subheader {
        font-size: 18px;
    }

    .direct-flow .form-preview-header p {
        font-size: 16px;
    }

    .direct-flow .detailed-form-view-right-flow-top .detailed-form-view-right-top {
        padding: 20px;
    }

    .template-4.direct-flow .modal-body .detailed-form-view-right-bottom .container {
        padding-right: 20px;
        padding-left: 20px;
        margin-right: auto;
        margin-left: auto;
        overflow: initial;
    }

    .template-6 .sig-preview {
        width: 100%;
    }

    .template-6.width-720 .sig-preview,
    .template-6.width-540 .sig-preview {
        width: 100%;
    }

    .template-5.direct-flow .form-preview-header .preview-subheader {
        font-size: 28px;
    }

    .template-6.direct-flow .form-preview-header .preview-subheader {
        font-size: 22px;
    }

    .footer-column {
        -ms-flex: 0 0 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .footer-block {
        margin-top: 0;
    }

    .template-7 .signature-canvas {
        display: block;
        padding-right: 0;
    }

    .template-7 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        height: 150px;
    }

    .template-7 .sig-preview {
        width: 100%;
        margin-top: 20px;
    }

    .template-7 .ind-form-field .file-upload label {
        padding: 0;
    }

    .template-7 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-7 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }

    .template-7 .ind-form-field .input-block {
        padding-left: 0;
    }

    .template-7 .ind-form-field .input-block:before,
    .template-7 .ind-form-field .checkbox-wrapper:before,
    .template-7 .ind-form-field .radio-wrapper:before,
    .template-7 .ind-form-field .fieldset:before {
        content: none;
    }

    .template-7 .ind-form-field .radio-wrapper {
        padding-left: 0;
    }

    .template-7 .ind-form-field .checkbox-wrapper {
        padding-left: 0;
    }

    .template-7 .ind-form-field .fieldset {
        padding-left: 0;
        margin-bottom: 30px;
    }

    .template-7 .modal-body {
        padding-top: 15px;
    }

    .template-7 .form-preview-header {
        margin-bottom: 50px;
    }

    .template-7.width-720 .sig-preview,
    .template-7.width-540px .sig-preview {
        margin: 0;
    }

    .template-7.width-720 .ind-form-field .signature-canvas canvas,
    .template-7.width-540 .ind-form-field .signature-canvas canvas {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .template-7.width-720 .ind-form-field.fieldset.flex-box .style-view .input-block,
    .template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
    }

    .template-7.width-720 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper,
    .template-7.width-540 .ind-form-field.fieldset.flex-box .style-view .checkbox-wrapper {
        width: 100%;
        height: auto;
    }

    .template-7.width-540 .sig-preview {
        margin: 0;
    }

    .template-7.direct-flow .form-preview-header .preview-subheader {
        font-size: 28px;
    }

    .type-form-button-block {
        padding-left: 0;
    }

    .multiple-form-container .each-form-container {
        width: 100%;
        margin-right: 0;
    }

    .form-detail-top-right .collection-chat {
        margin-left: 0;
        margin-right: 20px;
        margin-top: 20px;
    }

    .template-4 .ind-form-field .selectize-custom .tag-wrapper-bl input {
        min-width: 150px;
    }

    .table.form-preview-table tbody tr th {
        float: left;
        width: 100%;
        display: block;
        padding-bottom: 0;
        border-bottom: 0;
        padding-top: 15px;
    }

    .table.form-preview-table tbody tr td {
        float: left;
        width: 100%;
        display: block;
        font-weight: 400;
        padding-top: 7px;
        padding-bottom: 15px;
    }

    .full-wid-mod .modal-content {
        height: 100%;
    }

    .modal-header-right.align-right-option .general-btn {
        min-width: 30px;
        justify-content: center;
        zoom: .8;
    }

    .modal-header-right.align-right-option a.general-btn:before {
        zoom: 1.2;
    }

    .collection-view .one-line-stretch .filter-tag-add-block {
        width: calc(100% - 81px);
    }

    .collection-view .data-search-left {
        margin-top: 15px;
    }

    .collection-view .form-detail-top-right {
        display: flex;
    }

    .collection-view .form-detail-top-right .ex-cel-ico {
        display: none;
    }

    .collection-view .form-detail-top-right .collection-chat {
        margin: 15px 0 0 20px;
    }

    .collection-view .data-view.field-form .form-detail-top-left {
        max-width: 90%;
        padding-left: 25px !important;
    }

    .collection-view .data-view.field-form.small-no-tab.with-opt .data-holder {
        padding: 0;
        height: calc(100% - 129px);
    }

    .collection-view .one-line-stretch {
        padding: 0 20px;
    }

    .collection-view .template-container-view .data-holder-right .card-container.template-collection {
        padding: 0 20px;
    }

    .template-4 .ind-form-field .radio-wrapper h5,
    .template-4 .ind-form-field .checkbox-wrapper h5 {
        margin-bottom: 10px;
    }

    .template-4 .ind-form-field .radio-wrapper .radio-block {
        margin-left: 20px;
    }

    .template-4 .checkbox-wrapper .select-chk-block {
        padding-left: 20px;
    }

    .fixed-container {
        width: 100%;
    }

    .common-left-header .common-modal-header {
        /* width: 100%; */
        margin-left: 0;
    }

    .with-card-preview .table.form-preview-table tbody tr th {
        float: left;
        width: 100%;
    }

    .with-card-preview .table.form-preview-table tbody tr td {
        float: left;
        width: 100%;
    }

    .side-page-link-button {
        float: left;
        height: 40px;
        background: transparent;
        border: 0;
        padding: 0;
        line-height: 0;
        display: flex;
        align-items: center;
        color: var(--default-grey);
    }

    .side-page-link-button:before {
        content: "";
        background: var(--sprite-two) no-repeat -185px -162px;
        width: 21px;
        height: 17px;
        display: inline-block;
        margin-right: 10px;
    }

    .detailed-form-view-left.active {
        display: flex;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 100;
        width: 100%;
    }

    .side-page-link {
        display: flex;
    }

    .mob-close {
        position: fixed;
        right: 10px;
        top: 10px;
        width: 20px;
        height: 20px;
        background: transparent;
        border: 0;
        line-height: 0;
        padding: 0;
        display: block;
    }

    .mob-close:before {
        content: "";
        background: var(--sprite-two) no-repeat -377px -65px;
        width: 11px;
        height: 11px;
        display: inline-block;
    }

    .alone-page .side-page-link {
        display: none;
    }

    .form-full-height.web-view .detailed-form-view-right-bottom {
        position: relative;
        left: 0;
    }

    .form-full-height.web-view .detailed-form-view-right-flow-top {
        padding-bottom: 0;
    }

    .web-view .detailed-form-view-right-flow-top .detailed-form-view-right-body {
        overflow-y: unset;
    }

    .custom-template-view .form-input-block-left.no-action .form-type-input {
        word-break: break-word;
    }

    .float-button-block {
        right: 20px;
        bottom: 20px;
    }

    .float-button {
        width: 50px;
        height: 50px;
    }

    .float-button .icon-in.icon-plus {
        zoom: .8;
    }

    .mobile-top .side-tab .nav-pills {
        width: 100%;
        height: 60px;
        border-radius: 0;
        border-right: 0;
    }

    .mobile-top .side-tab .nav-pills .nav-small {
        float: left;
        display: flex;
        width: auto;
    }

    .mobile-top .side-tab .nav-pills .nav-small .nav-link-side {
        width: auto !important;
        flex: auto;
        border-right: 1px solid #E3E5E8 !important;
    }

    .mobile-top .side-tab .tab-content {
        width: 100%;
    }

    .mobile-top .set-container {
        height: calc(100% - 70px);
    }

    .small-header .task-nav-left.bg-back.bread-crumb {
        position: absolute;
        right: 5px;
        bottom: 20px;
    }

    .small-header .bg-back.bread-crumb .backto-list {
        height: 35px;
    }

    .mobile-top .edit-template-right-body .map-container {
        float: left;
        width: 100%;
        height: 315px !important;
    }

    .mobile-top .template-body .radio-container {
        flex-direction: column;
        align-items: end;
    }

    .mobile-top .template-body .radio-container .radio-wrap .radio-block {
        margin-bottom: 15px;
        width: 100%;
        margin-right: 0;
    }

    .template-6 .ind-form-field.fieldset.flex-box .style-view .input-block {
        width: 100%;
        margin-right: 0;
    }

    .template-1.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
        padding: 60px 5px 0 5px;
    }

    .template-2.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
        padding: 60px 5px 0 5px;
    }

    .template-4.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
        margin: 0;
        padding: 60px 20px 0 20px;
    }

    .template-5.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
        padding: 60px 5px 0 5px;
    }

    .template-6.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
        padding: 60px 5px 0 5px;
    }

    .template-7.embedded-form .detailed-form-view-right-flow-top .detailed-form-view-right-body .container .form-preview-container {
        padding: 60px 5px 0 5px;
    }

    .template-1.form-full-height.embedded-form .detailed-form-view-right-bottom .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .template-2.form-full-height.embedded-form .detailed-form-view-right-bottom .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .template-5.form-full-height.embedded-form .detailed-form-view-right-bottom .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .template-6.form-full-height.embedded-form .detailed-form-view-right-bottom .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .template-7.form-full-height.embedded-form .detailed-form-view-right-bottom .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .wf-btn-block {
        opacity: 1;
        pointer-events: auto;
    }

    .thankyou-modal .modal-content {
        width: 100%;
    }

    .cover-wrapper-block .thankyou-content p {
        max-width: 100%;
    }

    .cover-wrapper-block .thankyou-content h5 {
        font-size: 28px !important;
    }

    .growth-mod .growth-wrapper {
        height: auto;
        padding-top: 0;
        padding-right: 0;
    }

    .growth-container,
    .growth-main-wrap,
    .growth-main-wrap .mt-3 {
        height: auto;
    }

    .growth-main-wrap .mt-3>.row {
        height: auto;
        margin-bottom: 0 !important;
        margin: 0;
    }

    .growth-main-wrap .mt-3>.row .col-sm-3 {
        height: auto;
        padding: 0;
    }

    .growth-main-wrap .mt-3>.row .col-sm-9 {
        height: auto;
        padding: 0;
    }

    .growth-main-wrap .mt-3>.row .col-sm-9 .col-sm-6 {
        padding: 0;
    }

    .growth-nav {
        height: auto;
        margin-bottom: 20px;
        border-radius: 15px;
    }

    .growth-nav>div>div {
        position: relative !important;
    }

    .growth-content-body {
        height: auto;
    }

    .growth-content-body>div>div {
        position: relative !important;
    }

    .template-4.growth-mod .modal-body {
        float: left;
        width: 100%;
        padding: 0 15px;
        overflow-y: auto;
    }

    .padding-r-20 {
        padding-right: 0;
    }

    .growth-enabled .growth-nav .floating-boiler-image img {
        width: 100px;
        height: 100px;
    }

    .growth-enabled .floating-boiler-image {
        height: auto;
    }

    .collection-view .collection-more-block .form-detail-top-right {
        flex-direction: column;
    }

    .form-detail-top-right .data-search-button #invokeWorkflow {
        font-size: 14px;
        padding: 0 10px;
    }

    .collection-view .collection-more-block .form-detail-top-right .collection-chat {
        display: none;
    }

    .collection-view .data-view.field-form.small-no-tab.with-opt.collection-more-block .data-holder {
        height: calc(100% - 243px);
    }

    .form-detail-top-right .data-search-button .general-btn,
    .form-detail-top-right .general-btn {
        padding: 0 10px;
    }

    .collection-view .form-detail-top-right .collection-chat {
        padding: 0 10px;
    }

    .dev-app-view .data-view.field-form.small-no-tab.with-opt .data-holder {
        height: calc(100% - 129px);
    }

    .form-detail-top-right .data-search-button #invokeWorkflow.invoke-ico {
        font-size: 16px;
        line-height: 36px;
        position: relative;
        padding: 0 0 0 47px;
    }

    .entity-rule-left.col-sm-3 {
        width: 100%;
        height: auto;
        border: 0;
        border-bottom: 1px solid rgba(64, 83, 100, .15);
        border-radius: 0;
    }

    .entity-rules .modal-lg {
        min-width: auto;
    }

    .entity-rule-left .nav-item {
        width: auto;
        flex: 0 0 35%;
    }

    .entity-rule-left .nav-pills {
        flex-direction: unset !important;
    }

    .entity-rules .modal-close.ico-lib.md-close {
        right: 10px;
        top: 12px;
    }

    .entity-rule-left .nav-pills .nav-link {
        border-bottom: 0;
        height: 50p;
    }

    .entity-rules .modal-body {
        max-height: 100%;
    }

    .entity-rule-right {
        height: calc(100% - 61px);
    }

    .new-modal-body {
        display: flex;
        flex-direction: column;
    }

    .new-modal-right {
        order: 0;
        width: 100%;
        border-radius: 0;
        border-bottom: 1px solid #e3e5e8;
    }

    .new-modal-left {
        order: 1;
        width: 100%;
    }

    .entity-rule-right-header {
        padding-right: 55px;
    }

    .collection-view .data-view.field-form.small-no-tab.filter-view .data-holder {
        height: calc(100% - 188px);
    }

    .each-leave-application {
        flex-direction: column;
    }

    .leave-application {
        width: 100%;
    }

    .application-action {
        display: flex;
        justify-content: flex-end;
        margin-top: 15px;
    }

    .bsy-modal.entity-rules {
        padding: 0px;
    }

    .inline-container {
        width: 100%;
    }

    .inline-container .right-switch {
        margin: 0;
    }

    .full-wid-mod .collection-clik-panel .discuss-inner.note-tab {
        height: calc(100vh - 131px);
    }

    .left-content-scroll {
        width: 100%;
        height: 50px;
        display: flex;
        padding: 0;
    }

    .left-content-scroll p {
        white-space: nowrap;
        padding: 0;
        margin: 0;
        display: flex;
        align-items: center;
        padding: 0 20px;
        position: relative;
    }

    .left-content-scroll p.active:after {
        content: "";
        width: 100%;
        height: 2px;
        background: var(--default-color);
        position: absolute;
        left: 0;
        bottom: 0;
    }

    .right-content-scroll {
        float: left;
        width: 100%;
        height: calc(100% - 50px);
    }

    .record-version .modal-body {
        height: calc(100% - 50px);
        max-height: calc(100% - 50px);
    }

    .form-single-value-box h5 div * {
        width: 100%;
    }

    .rule-select-opt-block li {
        margin-bottom: 10px;
        width: 100%;
    }

    .rule-select-opt-block li:last-child {
        margin-bottom: 0;
    }

    .rule-right-body-inner .section-info-icon {
        padding: 0;
    }

    .ind-form-field .checkbox-wrapper .select-chk-block {
        width: 100% !important;
    }

    .collection-settings .side-tab {
        flex-direction: column;
        overflow-y: auto;
    }

    .collection-settings .side-tab .nav-pills {
        flex-shrink: 0;
        height: 515px;
        border-radius: 0;
    }

    .form-set.collection-settings .side-tab .tab-content {
        flex-shrink: 0;
        height: 700px;
    }

    .template-body .form-table {
        max-width: 100%;
    }

    .container-split-left {
        width: 100%;
    }

    .container-split-right {
        width: 100%;
        border: 0;
        border-top: 1px solid #e3e5e8;
    }

    .collection-view .data-view.field-form.small-no-tab.filter-view .data-holder.collection-settings {
        height: calc(100% - 129px);
    }

    .grid-view .ind-collection-card {
        width: 100%;
        margin-right: 0;
    }

    .summary-card-tab .nav-tabs .nav-link {
        flex: 0 0 12%;
    }

    .growth-wrapper .col-sm-3,
    .growth-wrapper .col-sm-4,
    .growth-wrapper .col-sm-6,
    .growth-wrapper .col-sm-8 {
        padding: 0;
    }

    .growth-row .each-growth-block.unique-block {
        left: 0;
        max-width: 100%;
    }

    .growth-nav .growth-row .each-growth-block.unique-block {
        left: 20px;
        max-width: calc(100% - 40px);
    }

    /*------ Collection Details End ------*/

    /*------ Forms ------*/


    /*------ Forms End ------*/

    /*------ Forms Details ------*/


    /*------ Forms Details End ------*/

    /*------ Workflow ------*/



    /*------ Workflow End ------*/

    /*------ Workflow Details ------*/



    /*------ Workflow Details End ------*/

    /*------ Workflow Task Entity ------*/



    /*------ Workflow Task Entity End ------*/

    /*------ Entity ------*/


    /*------ Entity End ------*/

    /*------ Entity Details ------*/

    .entity-preview-left {
        position: absolute;
        left: -100%;
        top: 0;
        z-index: 9;
    }

    /* .entity-preview-left.active {
        left: 0;
    } */
    .entity-preview-center {
        width: 100%;
        height: auto;
    }

    .entity-preview-right {
        width: 100%;
        height: auto;
        background: transparent;
    }

    .entity-preview-center.center-full {
        width: 100%;
        height: 100%;
    }

    .credential-side-panel {
        width: 100%;
    }

    .entity-preview .slider-button {
        width: 30px;
    }

    .mobile-only-button {
        display: block;
    }

    .mobile-only-button {
        float: left;
        width: 20px;
        height: 20px;
        background: transparent;
        border: 0;
        padding: 0;
        line-height: 0;
        position: absolute;
        right: 8px;
        top: 8px;
    }

    .mobile-only-button:before {
        content: "";
        background: var(--sprite-one) no-repeat -358px -72px;
        width: 11px;
        height: 11px;
        display: inline-block;
    }

    .credential-panel .form-preview-header h5 {
        font-size: 14px;
    }

    .mobile-menu-header .toggle-mnu span,
    .mobile-menu-header .toggle-mnu span:after,
    .mobile-menu-header .toggle-mnu span:before {
        background-color: var(--default-grey);
    }

    .mobile-menu-header {
        float: left;
    }

    .mobile-menu-header .toggle-mnu.on span {
        background: transparent;
    }

    .modal-header-right .general-btn.print-ico {
        font-size: 0;
        min-width: auto;
        padding: 0 15px;
    }

    .modal-header-right .general-btn.print-ico:before {
        margin: 0;
    }

    .modal-header-right .ex-cel-ico,
    .modal-header-right .ex-pdf-ico {
        padding: 0 15px;
    }

    .common-modal-header {
        float: left;
        line-height: 36px;
        margin-left: 10px;
    }

    .right-preview-options .general-btn {
        padding: 5px !important;
        margin-left: 0px !important;
        border: 0 !important;
    }

    .common-modal-header h5 {
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .common-left-header {
        float: left;
        width: 48%;
    }

    .common-left-header .common-modal-header {
        width: 80%;
        margin-left: 0;
    }

    .full-wid-mod .modal-header .modal-header-right.align-right-option .close {
        margin-left: 10px;
    }

    .right-preview-options .general-btn:hover {
        background: transparent;
    }

    .right-preview-options .ex-pdf-ico:hover:before {
        background-position: -501px -332px;
    }

    .modal-header-right .ex-cel-ico:hover:before {
        background-position: -468px -305px;
    }

    .right-preview-options .modal-header-right .ex-cel-ico:hover:before {
        background-position: -468px -305px;
    }

    .modal-header-left.common-left-header .mobile-menu-header {
        display: none;
    }

    /*------ Entity Details End ------*/

    /*------ Task Pool ------*/


    /*------ Task Pool End ------*/

    /*------ Pool ------*/

    .pool-details .wf-bottom .detail-tab li nav {
        font-size: 0;
    }

    .pool-details .wf-bottom .detail-tab li nav:before {
        margin-right: 0;
    }

    .pool-details .wf-bottom .detail-tab li {
        width: 16.66%;
    }

    /*------ Pool End ------*/

    /*------ Project ------*/

    .table-scrollable {
        width: auto;
    }

    .input-same-line .width-adjust.date-drop.label-perst {
        width: 100%;
    }

    .task-input-flex-block .task-input-block {
        width: 100%;
        padding: 0 20px;
        border-bottom: 1px solid #ECEFF1;
    }

    .task-input-flex-block {
        padding: 0;
    }

    /*------ Project End------*/

    /*------ Project Details ------*/

    .summar-tab-header {
        display: block;
    }

    .project-other-info-block {
        margin-bottom: 20px;
    }

    .project-other-info-block li {
        width: 100%;
        margin-bottom: 10px;
        margin-right: 0;
    }

    .graph-switcher {
        float: right;
    }

    .summar-tab-header-right {
        float: left;
        width: 100%;
    }

    .graph-block {
        float: left;
        width: 100% !important;
        height: 300px;
    }

    .miles-table {
        width: auto;
    }

    .common-tab {
        height: calc(100% - 157px);
    }

    .common-tab {
        height: calc(100% - 157px);
    }

    .recharts-legend-wrapper {
        padding-left: 0 !important;
        height: auto !important;
    }

    .task-attach {
        transform: rotate(48deg);
        position: relative;
        top: 0px;
    }

    .proj-btn.section,
    .proj-btn.milestone,
    .proj-btn.add-tsk {
        font-size: 0 !important;
        height: auto;
        padding: 0 !important;
        min-width: 0;
        height: auto;
        line-height: normal;
        background: transparent;
        border: 0;
        box-shadow: none;
        display: flex;
        align-items: center;
        margin-left: 15px;
    }

    .proj-btn.section:before {
        content: "";
        background: var(--sprite-one) no-repeat -456px -158px;
        width: 12px;
        height: 12px;
        display: inline-block;
    }

    .proj-btn.milestone:before {
        content: "";
        background: var(--sprite-one) no-repeat -444px -333px;
        width: 13px;
        height: 14px;
        display: inline-block;
    }

    .proj-btn.add-tsk:before {
        content: "";
        background: var(--sprite-one) no-repeat -467px -279px;
        width: 14px;
        height: 14px;
        display: inline-block;
    }

    .section-flag {
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 140px;
        white-space: nowrap;
        display: inline-block;
    }

    .pj-board-container {
        height: calc(100% - 157px);
    }

    .task-tab .card-body .ind-task-list-click {
        padding: 9px 20px 0 15px;
    }

    .ind-team-user {
        width: 100%;
    }

    .project-status-table {
        overflow: scroll;
        overflow-y: hidden;
        width: 100%;
    }

    .project-status-table .table {
        width: 100%;
        min-width: 500px !important;
    }

    .data-view .form-detail-panel,
    .info-accordion .card,
    .project-activity-sec {
        border-left: 1px solid transparent;
        border-right: 1px solid transparent;
    }

    .pj-dash .dash-wrapper {
        height: calc(100%);
        padding: 20px;
    }

    .expands .ibt-header {
        height: 100%;
    }

    .ibt-body.dash-no-pad .dash-wrapper-left .ind-task-list {
        height: 40px;
    }

    .common-align .form-detail-top.project-top h5 {
        max-height: 42px;
        overflow: hidden;
        padding-right: 30px;
    }

    .data-view .common-align .form-detail-top p {
        max-height: 40px;
        overflow: hidden;
    }

    .common-align .form-detail-bottom-left {
        width: 100%;
    }

    .ind-small-tab {
        width: 100%;
    }

    .blue-lister {
        width: 100%;
    }

    .list-row-left .ibt-split-table {
        width: 100%;
    }

    .list-common.list-row-left {
        width: 100%;
    }

    .list-row-left .ibt-split-table .blue-lister {
        width: 100%;
    }

    .list-common {
        width: 100%;
    }

    .two-row .blue-lister {
        width: 100%;
        height: auto;
        min-height: 280px;
    }

    .ibt-split-table.two-row {
        margin-bottom: 0;
    }

    .ibt-body {
        padding: 0;
        height: calc(100% - 130px);
    }

    .ibt-card {
        height: 100% !important;
    }

    .ind-stakeholders-list {
        width: 100%;
    }

    .stakeholders-wrapper {
        padding: 20px;
    }

    .data-room-left {
        width: 100%;
    }

    .width-adjust {
        width: 100%;
    }

    .economy-tag {
        flex-shrink: 0;
        display: none;
    }

    .project-cycle-info li {
        float: left;
        margin-left: 15px;
    }

    .overlay-mode .ibt-header {
        top: 60px;
    }

    .main-title-header {
        width: 100%;
        padding-right: 99px;
        margin-bottom: 5px;
        font-size: 20px;
    }

    .inline-flex .inprog {
        position: absolute;
        right: 0;
        top: 0;
    }

    .footer-info li {
        float: left;
        width: 100%;
        margin-bottom: 5px;
    }

    .footer-info {
        display: block;
    }

    .project-list-footer {
        height: auto;
        min-height: 45px;
        padding: 10px 20px;
    }

    .footer-info li:last-child {
        margin-bottom: 0;
    }

    .template-4 .flex-box .field-scroll {
        width: 100%;
    }

    .flex-box {
        flex-wrap: wrap;
    }

    .milestone-task-info {
        display: none;
    }

    .side-tab .nav-pills {
        width: 100%;
        display: inline-block;
        height: auto;
        overflow-x: auto;
        overflow-y: hidden;
        border-radius: 5px;
        white-space: nowrap;
    }

    .side-tab .nav-pills .nav-link-side.active,
    .side-tab .nav-pills .show>.nav-link-side {
        border-right: 1px solid #E3E5E8;
        border-left: 1px solid #E3E5E8;
    }

    .side-tab .nav-pills .nav-link-side {
        display: inline-block;
    }

    .recharts-wrapper {
        padding: 2px;
    }

    text#mapsmeasuretext {
        display: none;
    }

    .pj-board-container.board-wrap.board-70 {
        height: calc(100% - 130px);
    }

    .board-wrap .board-list-wrapper {
        width: 100%;
    }

    .common-align .form-detail-top.project-top.right-extra-option {
        display: block;
    }

    .data-view .common-align .form-detail-top p {
        max-height: 20px;
        overflow: hidden;
    }

    .overlay-mode .ibt-body {
        height: calc(100% - 130px);
    }

    .group-row.major-area.mob-row-align {
        width: 75%;
    }

    .align-small .mob-row-align .group-container.align-equal {
        max-width: 100%;
        flex-direction: row;
        align-items: center;
        padding: 0;
    }

    .date-container-block {
        margin-right: 15px;
    }

    .center-panel {
        width: 100%;
    }

    .meeting-container {
        padding: 15px;
    }

    .header-text-title {
        font-size: 30px;
    }

    .board-modal-body {
        overflow-y: auto;
    }

    .board-modal-body-left {
        width: 100%;
        height: auto;
    }

    .board-modal-body-right {
        width: 100%;
    }

    .bsy-modal.large-modal.without-footer .modal-body {
        height: 100%;
        max-height: 100%;
    }

    .meeting-wrapper-block {
        padding: 0;
        height: calc(100% - 61px);
        padding-top: 36px;
    }

    .meet-set-button {
        top: 70px;
    }

    .pj-task-heirarchy .quick-edit li .edited-task-ico {
        right: 72px;
        bottom: -22px;
    }

    .form-detail-container.data-view {
        height: calc(100% - 60px);
    }

    .data-view.field-form.small-no-tab.with-opt .data-holder.set-pool {
        height: calc(100% - 78px);
    }

    .pool-settings-body-wrapper .radio-wrapper .radio-block {
        width: 100%;
        margin-bottom: 10px;
    }

    .pool-settings-body-wrapper .radio-wrapper .radio-block:last-child {
        margin-bottom: 0;
    }

    .data-view.field-form.small-no-tab .data-holder.pool-task-listing {
        padding: 0;
        height: calc(100% - 78px);
    }

    .board-modal-body-right-container {
        width: 100%;
        height: 500px;
    }

    .board-modal-body-left-container {
        width: 100%;
        height: auto;
    }

    .bsy-modal.large-modal {
        padding: 0;
        border-radius: 0;
    }

    .board-modal-header {
        border-radius: 0;
    }

    .board-modal-body-left-body {
        border-top: 1px solid #d1d8dc;
    }

    .pj-dash .ibt-body.dash-no-pad {
        height: calc(100% - 70px);
    }

    .data-view.field-form.small-no-tab .data-holder.meeting-room-set {
        height: calc(100% - 79px);
    }

    .meeting-room-set .set-container {
        height: calc(100% - 70px);
    }

    .meet-set-button {
        top: 0;
    }

    .grid-room {
        height: 200px !important;
    }

    .meeting-wrapper-block {
        height: 100%;
    }

    .meet-set-button {
        top: 0;
    }

    .grid-room {
        height: 200px !important;
    }

    .meeting-wrapper-block {
        height: 100%;
    }

    .select-options .pj-added-user {
        padding-left: 0;
    }

    .project-header-align+.common-tab {
        height: calc(100% - 98px);
    }

    .pj-board-container.project-task-with-option {
        height: calc(100% - 98px);
    }

    .pj-board-container.project-team {
        height: calc(100% - 98px);
    }

    .pj-board-container.project-resource {
        height: calc(100% - 98px);
    }

    .project-resource .resources-list.mob-scroll {
        height: 100%;
    }

    .pj-board-container.project-board {
        height: calc(100% - 98px);
    }

    .pj-board-container.project-board .team-wrapper.list-viewer {
        height: 100%;
    }

    .resources-filters-left .backto-list {
        display: none;
    }

    .resources-filters-left .select-box-holder {
        margin: 0;
    }

    .pj-board-container.project-information {
        height: calc(100% - 98px);
    }

    .project-information .project-activity-sec {
        height: 100%;
    }

    .project-collection .tile-main-panel {
        height: calc(100% - 98px);
    }

    .pj-board-container.project-discussion {
        height: calc(100% - 98px);
    }

    .pj-resource-container .resources-list {
        height: calc(100% - 152px);
    }

    .persitant-footer.three-btn.align-small {
        height: 170px;
    }

    .dynamic-creation .persitant-top.with-three {
        height: calc(100% - 170px);
    }

    .meeting-pj-container #header_img {
        max-width: 80px;
    }

    .meeting-pj-container #navChatButton {
        display: block;
        right: 30px;
    }

    .three-btn .date-container-block {
        margin: 0;
    }

    .board-wrap .board-list-wrapper:last-child {
        margin-right: 0;
    }

    .pj-board-container.board-wrap.project-board {
        height: calc(100% - 60px);
    }

    .list-wrapper.project-chat {
        height: calc(100% - 60px);
    }

    .project-chat .form-detail-container.data-view {
        height: 100%;
    }

    /*------ Project Details End ------*/

    /*------ Resources ------*/

    .resources-filters-icons.with-text li a,
    .resources-filters-icons.with-text li nav {
        padding: 0 10px;
        font-size: 13px;
    }

    .resources-filters-icons li a,
    .resources-filters-icons li nav {
        width: auto;
        padding: 0 13px;
        height: 35px;
    }

    /* .resources-filters-icons {
        margin-right: 0;
    } */
    .resources-filters {
        padding: 15px 15px 0;
        margin-bottom: 16px;
    }

    .resources-list {
        padding: 0 15px;
        height: calc(100% - 64px);
    }

    .grid-vw .rc-list-contents {
        width: 100%;
    }

    .bsy-modal.fl-pv .modal-title {
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-width: 90%;
    }

    .preview-area {
        height: 100%;
    }

    .preview-area iframe {
        height: 100%;
    }

    .resource-pv-mod .modal-body {
        max-height: calc(100vh - 50px);
    }

    .resource-pv-mod .preview-area {
        height: calc(100% - 36px);
    }

    .resource-set-container-left {
        width: 100%;
        height: auto;
    }

    .resource-set-container-right {
        width: 100%;
        height: auto;
    }

    .bsy-modal.without-footer .modal-body {
        max-height: calc(100vh - 50px);
    }

    /*------ Resources End ------*/

    /*------ Learn ------*/

    .task-input-flex-block .select-box.inc-flex {
        width: 100%;
    }

    .task-input-flex-block .select-box.inc-flex:after {
        right: 12px;
    }

    .data-view .form-detail-panel.with-publish+.data-holder.learn-holder {
        height: calc(100% - 233px);
    }

    .limited-height .common-align.project-header-align .form-detail-top-left p:last-child {
        display: none;
    }

    .limited-height .common-align.project-header-align .form-detail-top-left p:nth-child(3) {
        display: none;
    }

    .learn-option-block button {
        padding: 0 10px;
        font-size: 14px;
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .learn-option-block {
        margin-top: 10px;
    }

    .form-detail-top.learn-top h5 {
        margin-bottom: 5px;
        padding-right: 25px;
    }

    .form-detail-top-left .published:after {
        position: absolute;
        right: 26px;
        top: 2px;
    }

    .height-210 .learn-course-info {
        margin: 5px 0;
    }

    .each-learn-section {
        padding: 20px;
    }

    .course-report-header h5 {
        flex-shrink: 0;
        margin-right: 10px;
    }

    .course-report-header {
        margin-bottom: 0;
    }

    .data-view.field-form .course-report-header+.data-holder.learn-holder {
        height: calc(100% - 349px);
    }

    .log-wrapper {
        height: auto !important;
    }

    .each-sub-section {
        padding: 0 50px 0 15px;
    }

    .each-sub-section.auto-height .each-course-field {
        padding: 15px 0 15px 30px;
        width: 100%;
    }

    .each-sub-section .wf-btn-block {
        position: relative;
        top: 0;
        right: auto;
        left: 0;
        padding-left: 24px;
        margin-bottom: 15px;
    }

    .each-sub-section button {
        position: relative;
        top: 0;
        right: auto;
        left: 0;
    }

    .each-sub-section.auto-height {
        align-items: flex-start;
        flex-direction: column;
        padding-right: 38px;
    }

    .ind-draggable-item:last-child {
        margin-bottom: 0;
    }

    .rs-preview-box {
        display: none;
    }

    .mang-lbl-block.mang-lbl-block-mod-in {
        width: 100%;
    }

    .learn-tab {
        display: flex;
        overflow-y: auto;
    }

    .learn-permission-wrapper .form-table {
        margin-bottom: 0;
        height: 100%;
    }

    .learn-detail-panel.show-sm {
        display: flex !important;
    }

    /*------ Learn End ------*/

    /*------ Meeting Room  ------*/

    .grid-room:nth-child(1n),
    .grid-room:nth-child(2n),
    .grid-room:nth-child(3n),
    .grid-room:nth-child(4n) {
        width: 100%;
        height: 25%;
    }

    .room-info {
        width: auto;
        align-items: flex-start;
        -webkit-align-items: flex-start;
        -moz-box-align: flex-start;
        -ms-align-items: flex-start;
        left: 15px;
        top: 15px;
    }

    .grid-room:nth-child(2n) .room-info {
        bottom: auto;
        top: 15px;
        left: 15px;
    }

    .grid-room:hover:nth-child(2n) .room-info {
        bottom: auto;
        top: 15px;
        left: 15px;
    }

    .grid-room:nth-child(4n) .room-info,
    .grid-room:hover:nth-child(4n) .room-info {
        top: 15px;
        left: 15px;
        width: auto;
    }

    .grid-room:hover .active-button-block {
        top: 15px;
        right: 15px;
    }

    .grid-room:hover .enter-button-block {
        bottom: 15px;
        right: 15px;
    }

    .room-info h5 {
        font-size: 18px;
        line-height: normal;
    }

    .room-people-list {
        display: block;
    }

    /*------ Meeting Room End  ------*/

    /*------ Certificate  ------*/

    .ind-certificate-list {
        width: 100%;
    }

    .certificate-template-left {
        float: left;
        width: 100%;
        height: auto;
    }

    .certificate-template-right {
        width: 100%;
        height: calc(100% - 57px);
    }

    .certificate-template-left .radio-wrap .radio-block {
        width: auto;
        margin-bottom: 0;
    }

    .certificate-template-left .radio-wrap {
        margin-bottom: 0;
    }

    .certificate-template-right .each-template-type {
        width: 100%;
        margin-right: 0;
    }

    /*------ Certificate End  ------*/

    /* Sepalika payment */

    .payment-content-body .container {
        max-width: 540px;
    }

    .payment-items-description p {
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .payment-items-amount {
        flex-shrink: 0;
    }

    .payment-content-nav {
        padding-top: 10px;
        height: 50px;
    }

    .payment-nav-back {
        font-size: 16px;
    }

    .payment-nav-back:before {
        margin-right: 15px;
    }

    .payment-content-body {
        height: calc(100% - 50px);
        padding: 15px 0;
    }

    /* Sepalika payment End */

    /* Learn */

    .course-index-user {
        flex-direction: column;
        justify-content: normal;
        align-items: flex-end;
    }

    .course-user {
        width: 100%;
        margin-bottom: 20px;
        align-items: flex-start;
    }

    .course-user figure {
        width: 40px;
        height: 40px;
        flex-shrink: 0;
    }

    .couser-index .card-header {
        padding: 20px;
        height: auto;
    }

    /* Learn End */

    /* Attendance */

    .leave-calendar .rbc-event {
        top: auto;
        bottom: 50px;
        left: 10px;
    }

    .leave-calendar .rbc-toolbar {
        padding: 10px;
    }

    .leave-calendar .rbc-date-cell {
        font-size: 16px;
    }

    /* Attendance End */

    /* Learn Mobile */

    .hide-sm {
        display: none !important;
    }

    .show-sm {
        display: block !important;
    }

    .task-wrapper.task-detail-stand.learn-mb {
        padding: 20px 0 0 0;
    }

    .learn-responsive-wrapper {
        float: left;
        width: 100%;
        height: 100%;
        background: var(--white);
        border-radius: 25px 25px 0 0;
    }

    .learn-responsive-header {
        float: left;
        width: 100%;
        height: 60px;
        padding: 0 15px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid #e4e5e9;
    }

    .learn-responsive-header h5 {
        font-size: 14px;
        font-weight: 600;
        padding-left: 24px;
        position: relative;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 200px;
        line-height: 20px;
    }

    .learn-responsive-header h5:before {
        content: "";
        background: var(--sprite-one) no-repeat -434px -208px;
        width: 20px;
        height: 20px;
        position: absolute;
        left: 0;
        top: 3px;
        zoom: .8;
    }

    .course-menu-mb {
        float: left;
        width: 20px;
        height: 14px;
        background: transparent;
        padding: 0;
        border: 0;
        line-height: 0;
        margin: 0;
        position: relative;
    }

    .course-menu-mb span,
    .course-menu-mb span:after,
    .course-menu-mb span:before {
        background-color: #9c9897;
        height: 2px;
    }

    .course-menu-mb span:after,
    .course-menu-mb span:before {
        top: -6px;
    }

    .course-menu-mb span:after {
        top: 6px;
    }

    .course-menu-mb.on span:before {
        transform: rotate(42deg) translate(3px, 5px);
        width: 22px;
        left: 0px;
    }

    .course-menu-mb.on span:after {
        transform: rotate(-46deg) translate(4px, -4px);
        width: 21.5px;
        left: -1px;
    }

    .learn-responsive-body {
        float: left;
        width: 100%;
        height: calc(100% - 60px);
    }

    .learn-body-section-list {
        float: left;
        width: 100%;
        height: 100%;
    }

    .learn-body-section-list .data-learner-course-body {
        height: 100%;
    }

    .learn-body-section-list .learner-accordion .card {
        background: var(--white);
    }

    .learn-body-section-list .learner-accordion .accordion-btns h5 {
        font-size: 16px;
        font-weight: 600;
        line-height: 21px;
    }

    .learn-body-section-list .learner-accordion .accordion-btns p {
        font-size: 14px;
        line-height: normal;
    }

    .learn-body-section-list .learner-accordion .card-header {
        height: auto;
        min-height: auto;
    }

    .learn-body-section-list .learner-accordion .accordion-btns {
        padding: 14px 33px 14px 15px;
    }

    .learn-body-section-list .accordion-btns.collapsed:after {
        top: 34px;
    }

    .learn-body-section-list .short-details {
        padding: 0 15px;
    }

    .learn-body-section-list .each-chapter-list nav {
        padding-left: 15px;
    }

    .learn-body-section-list .accordion-btns:after {
        top: 33px;
    }

    .learn-body-section-preview {
        float: left;
        width: 100%;
        height: 100%;
    }

    .learn-body-section-preview .data-learner-course-right-footer {
        height: 50px;
    }

    .learn-body-section-preview .data-learner-course-right-body {
        height: calc(100% - 95px);
        padding: 0;
    }

    .learn-body-section-preview .data-learner-course-right-header {
        min-height: 45px;
    }

    .task-wrapper .learn-body-section-preview .data-learner-course-right-body .course-preview-box video {
        object-fit: contain;
        height: auto;
    }

    .learn-body-section-preview .data-learner-course-other-details-right .general-btn.page-next,
    .learn-body-section-preview .data-learner-course-other-details-right .general-btn.page-previous {
        border: 0;
        line-height: normal;
        height: auto;
        margin: 0 0 0 20px;
        padding: 0;
    }

    .learn-body-section-preview .general-btn.page-next:after {
        content: none;
    }

    .learn-body-section-preview .general-btn.page-previous:before {
        content: none;
    }

    .task-wrapper .learn-body-section-preview .data-learner-course-right-body .course-preview-box {
        height: 100%;
    }

    .task-wrapper .learn-body-section-preview .data-learner-course-right-body .course-preview-box iframe {
        height: 100%;
    }

    .task-wrapper .learn-body-section-preview .data-learner-course-right-body .instruction-block+.course-preview-box {
        height: calc(100% - 65px);
    }

    .data-learner-course-other-details-right .general-btn.dark {
        background: transparent;
        height: auto;
        border: 0;
        box-shadow: none;
        padding: 0;
        margin-left: 20px;
        color: #6a6a6a;
    }

    /* Learn Mobile End */


    .progress-listing {
        justify-content: left !important;
        overflow-x: auto !important;
    }

    .progress-listing li {
        min-width: 90px !important;
    }

    .progress-listing li:after {
        left: auto !important;
        right: -30px !important;
    }

}


@media only screen and (min-device-width: 414px) and (max-device-height: 896px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3) {

    .task-toggler-wrapper.task-tg {
        width: 100%;
        height: 100%;
        right: 0;
        box-shadow: none;
    }

    .task-toggler-header {
        border-radius: 0;
    }

    .persitant-footer.align-small {
        height: 70px;
    }

    .date-container-block.single-block {
        width: auto;
        margin: 0;
        min-width: 174px;
        margin-right: 10px;
    }

    .dynamic-creation .persitant-top {
        height: calc(100% - 70px);
    }

    .align-small .group-container.align-equal {
        flex-direction: row;
        max-width: none;
        width: auto;
    }

    .task-tg .dynamic-creation .persitant-footer .group-container.align-equal .date-container-block.single-block .input-log-time.date {
        margin-bottom: 0;
        margin-right: 0;
        width: 100%;
    }

    .meeting-wrapper-block {
        padding: 0;
        height: 100%;
        padding-top: 36px;
    }

    .grid-room {
        height: 215px !important;
    }

    .meet-set-button {
        right: 20px;
        top: 0;
    }

}

@media(max-width: 690px) {

    /*------ Collection Details  ------*/

    .detailed-form-view-left {
        display: none;
    }

    .detailed-form-view-right {
        width: 100%;
    }

    .template-4 .modal-body .detailed-form-view-right-top .form-preview-header {
        padding-left: 0;
    }

    .detailed-form-view-right-body .form-preview-container {
        margin: 0;
        width: 100%;
    }

    .detailed-form-view-right-top {
        padding: 20px;
    }

    .detailed-form-view-right-bottom {
        padding: 0 20px;
    }

    .direct-flow .detailed-form-view-right-bottom {
        padding: 0 0px;
    }

    .template-5.direct-flow .detailed-form-view-right-bottom {
        padding: 0;
    }

    .template-7.direct-flow .detailed-form-view-right-bottom {
        padding: 0;
    }

    .form-full-height .detailed-form-view-right-bottom {
        left: 0;
        width: 100%;
    }

    /*------ Collection Details End ------*/

    /*------ Learn ------*/

    .ind-panel-options.switch-mode.radio-wrapper {
        padding-top: 0;
        padding: 0 15px;
    }

    .task-input-flex-block .task-input-block {
        padding: 0 15px;
    }

    /*------ Learn End ------*/

}

@media(max-width: 320px) {

    /*------ Meeting Room  ------*/

    .room-people-list {
        display: none;
    }

    /*------ Meeting Room End  ------*/

}

/*------ Media Query End ------*/