/* Start Partner Locator  */

img {
    max-width: 100%;
}

.ucmm-open-drop ul {
    padding-right: 8px;
}

.ucmm-open-drop ul::-webkit-scrollbar {
    width: 8px;
}

.ucmm-open-drop ul::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

.ucmm-open-drop ul::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #555;
}

.ucm-bl-rootwrap .partnerlocatordiv,
.ucm-bl-rootwrap .createaccountdiv {
    font-size: 1.4rem;
    width: 100%;
    max-width: 1200px;
    padding: 20px 10px;
    margin: auto;
}

.ucm-bl-rootwrap .partnerlocatordiv .or {
    border-right: 1px solid #bbb;
    height: 250px;
    position: relative;
    width: 21px;
}

.ucm-bl-rootwrap .partnerlocatordiv .or::after {
    content: "OR";
    display: block;
    background: #ddd;
    border-radius: 50%;
    height: 40px;
    line-height: 33px;
    text-align: center;
    width: 40px;
    position: absolute;
    top: 100px;
    border: 4px solid #fff;
    color: #555;
    font-size: 0.75rem;
}

.ucm-bl-rootwrap .partnerlocatordiv .companydecs {
    height: 90px;
    overflow: auto;
    display: block;
}

.partnerlocatordiv h5 {
    font-size: 16px;
}

.ucm-bl-rootwrap .search-result-boxes {
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}

.partnerlocatordiv.code .intro-dec {
    padding-left: 0;
}

.ucm-bl-rootwrap .result-box {
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    padding: 15px;
    height: 100%;
}

.ucm-bl-rootwrap .result-box h4 {
    font-size: 18px;
}

.ucm-bl-rootwrap .result-box h5 {
    font-size: 15px;
}

.ucm-bl-rootwrap .result-box .ucm-tooltip {
    width: calc(100% - 22px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.result-box .ucmicons {
    margin-right: 5px;
}

.ucm-bl-rootwrap .partnerlocatordiv .maparea {
    height: 277px;
    width: 100%;
    border: 1px solid #b2b2b2;
    overflow: hidden;
    background: #eee;
}

@media screen and (max-width: 767px) {
    .ucm-bl-rootwrap .partnerlocatordiv .or {
        height: 50px;
        width: 100%;
        text-align: center;
        border-top: 1px solid #bbb;
        border-right: none;
        margin-top: 40px;
    }
    .ucm-bl-rootwrap .partnerlocatordiv .or:after {
        top: -20px;
        left: calc(50% - 22px);
    }
}


/* End Partner Locator */

a:hover,
a:focus {
    text-decoration: none !important;
}

button:hover,
button:focus {
    outline: none !important;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0) !important;
}

#ucmMainMenu a::after,
.PinToggel::after,
.select-attr-area::after,
.attributescroll::after,
.select-attr-area button.add-attr::after,
.ucmhorizenscroll tr th::after,
.ucm-dragndrop-area::after,
.ucmlinkgroup ul::after,
.ucm-tab ul.tabs::after,
.ucmlinkgroup::after {
    display: table;
    content: '';
    clear: both;
}


/* * UCM grid table */

.text-left {
    text-align: left;
}

.text-uppercase {
    text-transform: uppercase
}

.text-right {
    text-align: right;
}

.inline-block {
    display: inline-block;
}

.text-ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 80%;
}

.ucmlinkgroup .pagesize .block {
    display: block;
}

.inline {
    display: inline;
}

.ucm-noborder {
    border: 0px none !important;
}

.list-style-none {
    list-style: none;
    list-style-type: none
}


/*p position*/

.p-relative {
    position: relative !important;
}

.p-absolute {
    position: absolute !important;
}

.p-inherit {
    position: inherit !important;
}

.p-static {
    position: static !important;
}

i.ucmicons {
    font-style: normal;
}

i.ucmicons.xs {
    width: 10px;
    height: 10px;
}

i.ucmicons.sm {
    width: 15px;
    height: 15px;
}

i.ucmicons.twenty {
    width: 20px;
    height: 20px;
}

i.ucmicons.md {
    width: 25px;
    height: 25px;
}

i.ucmicons.lg {
    width: 40px;
}

i.ucmicons.xl {
    width: 45px;
}

i.ucmicons.xxl {
    width: 50px;
}

i.ucmicons.xxxl {
    width: 60px;
}

i.ucmicons.xxxxl {
    width: 65px;
}

.btn.focus,
.btn:focus {
    box-shadow: 0 0 0 0px rgba(0, 0, 0, 0) !important;
}

.btn-add {
    background: #ffffff;
    padding: 2px 14px;
    color: #333;
    font-size: 11px;
    line-height: 18px;
    border: 1px solid #ccc;
    margin: 0 4px 0 0;
    display: inline-block;
    vertical-align: middle;
    border-radius: 6px;
}

.btn-add:hover {
    background: #ffffff;
}

.dropdown-toggle::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .45em solid;
    border-right: .35em solid transparent;
    border-left: .35em solid transparent;
}


/*effect button*/

.effect-btn {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
    line-height: 18px;
}

.effect-btn::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.25);
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    border-radius: 3px;
}

.effect-btn:hover,
.effect-btn:focus,
.effect-btn:active {
    color: white;
}

.effect-btn:hover::before,
.effect-btn:focus::before,
.effect-btn:active::before {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
}


/*tooltip*/

.tooltip .tooltip-inner {
    background-color: #d60000;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #d60000;
}


/*customize off ucmgrid*/

@media screen and (min-width:768px) {
    .ucmgrid .col .col-sm-offset-2 {
        margin-left: 20%;
    }
}


/*pagination reset*/

.pagination {
    margin: 5px 0;
}

.pagination li a,
.pagination li span {
    color: #333;
    padding: 3px 8px;
}

.ucm-pagination .page-link {
    font-size: 12px;
    line-height: 18px;
}

.page-item.active a.page-link,
.page-item.active a:focus,
.page-item.active a:hover,
.page-item.active span,
.page-item.active span:focus,
.page-item.active span:hover {
    background-color: #cccccc;
    border-color: #DDDDDD;
}

.page-link:focus,
.page-link:hover {
    color: #0052a3;
    background-color: #cccccc;
    border-color: #DDDDDD;
}

.page-item.active .page-link {
    color: #333333;
}

.page-item:first-child .page-link {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.page-item:last-child .page-link {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}


/*panel*/

.ucm-card-accordion .card-group {
    margin-bottom: 5px;
}

.ucm-card-accordion .card-body {
    padding: 0px;
}

.ucm-card-accordion .card-body .nodatafound {
    margin-top: 5px;
    background: #fff;
}

.ucm-card-accordion .card-group .panel {
    border-radius: 0px;
}

.ucm-card-accordion .card~.card,
.additionalinfo,
.tab-pane~.tab-pane {
    margin-top: 0.25rem;
}

.ucm-card-accordion .card-header,
.ucm-card-accordion .card {
    padding: 0;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, 0);
    border: 0px solid rgba(0, 0, 0, 0);
    border-radius: 0px !important;
}

.ucm-card-accordion .card-grp {
    position: relative;
    background: #f2f2f2;
    border-radius: 5px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.ucm-card-accordion .card-grp>.ucm-abs-btn {
    display: inline-block;
    margin: 0px;
    margin-left: auto;
    position: absolute;
    z-index: 1;
    top: 50%;
    right: 6px;
    max-width: 70%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media screen and (max-width:480px) {
    .ucm-card-accordion .card-grp>.ucm-abs-btn {
        position: relative;
        z-index: 1;
        top: auto;
        right: auto;
        max-width: 100%;
        -ms-transform: inherit;
        transform: inherit;
        margin: 6px 6px;
    }
    .ucm-card-accordion .card-grp>.ucm-abs-btn .btn-add+.btn-add {
        margin-bottom: 5px;
    }
}


/*max-480px  */

.ucm-card-accordion .card-header .card-grp a {
    color: #333333;
    font-size: 15px;
    font-weight: normal;
    text-align: left;
    padding: 5px 10px;
    line-height: 22px;
    display: block;
    position: relative;
    background: #f2f2f2;
    font-family: 'open_sanssemibold', Arial, sans-serif;
    border-radius: 5px;
    transition: all 0.3s linear;
    min-width: 100%;
}

.ucm-card-accordion .card-header .card-grp a span {
    padding-left: 6px;
}

@media screen and (max-width:479px) {
    .ucm-card-accordion .card-grp .card-header {
        font-size: 13px;
        line-height: 18px;
        padding: 10px;
    }
}

.ucm-card-accordion .card-grp .card-header.collapsed {
    background: #EDEDED;
    color: #5d5d5d;
}

.ucm-card-accordion .card-grp .card-header.collapsed:hover {
    background: #DEDEDE;
    color: #636361;
}

.ucm-card-accordion .card-grp .card-header {
    border: 0px none;
}

.ucm-card-accordion .card-collapse .card-body {
    padding: 0px;
}


/*collepse*/

.accordion-toggle::before {
    padding-right: 12px;
    background-repeat: no-repeat;
    background-position: center center;
    content: '';
    width: 10px;
    height: 10px;
    display: inline-block;
    vertical-align: middle;
    transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -wbkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
}


/*  titlebreadcrumbs*/

titlebreadcrumbs {
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    display: -ms-flexbox;
    display: flex;
}

titlebreadcrumbs .ucm-alert {
    position: relative;
    display: block;
    margin: 0px auto;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
}

.content-header {
    position: relative;
    padding: 0;
}

.content-header h2 {
    color: #333333;
    margin: 0;
    font-size: 15px;
    line-height: 21px;
}

.content-header h1 {
    color: #333333;
    margin: 0;
    font-size: 18px;
    line-height: 24px;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
}

.content-header h1 span {
    font-size: 14px;
    line-height: 20px;
    color: #959595;
}

.content-header h1 small {
    font-size: 13px;
    display: inline-block;
    padding-left: 4px;
    font-weight: 300;
    letter-spacing: 1px;
}

.ucm-breadcrumbs .breadcrumb {
    background: transparent;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 12px;
    padding: 0px;
    border-radius: 0;
    position: relative;
    top: 9px;
}

@media screen and (min-width:320px) and (max-width:480px) {
    .content-header h1 span {
        display: block;
    }
    .content-header {
        flex: 0 0 100%;
    }
    .ucmradiusbtngrp.fullsceren {
        margin: 0 !important;
        top: 0 !important;
    }
}

@media screen and (min-width:481px) and (max-width:767px) {
    .content-header h1 span {
        display: block;
    }
}


/*if it is report page*/

.if_filterpage .ucm-breadcrumbs {
    position: absolute;
    top: 36px;
    width: calc(100% - 15px);
}

@media screen and (max-width:767px) {
    .if_filterpage .ucm-breadcrumbs {
        position: inherit;
        top: auto;
        width: auto;
    }
    .ucm-breadcrumbs .breadcrumb {
        margin-top: 0px;
        margin-bottom: 0;
        font-size: 12px;
        padding: 0px 5px;
        border-radius: 4px;
    }
}

.ucm-breadcrumbs .breadcrumb li a {
    color: #333333;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
}

.breadcrumb-item.active {
    color: #898989;
}

.ucm-breadcrumbs .breadcrumb li a img,
.ucm-breadcrumbs .breadcrumb li a .iconsize {
    width: 15px;
    height: 15px;
    vertical-align: top;
    margin-right: 2px;
    display: inline-block;
}

.ucm-breadcrumbs .breadcrumb li a:hover,
.ucm-breadcrumbs .breadcrumb li a:focus {
    background: none;
}

.breadcrumb-item+.breadcrumb-item::before {
    color: #898989;
    padding: 0 0.35rem;
}

@media (max-width: 991px) {
    .content-header .breadcrumb li::before {
        color: #333333;
    }
    .ucm-refmodal-page>form {
        width: 98%;
    }
}


/*  breadcrumb*/


/*UCM Icons*/

.ucmicons-ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    background: #f7f7f7;
}

.ucmicons-ul li {
    display: inline-block;
    width: 18.3%;
    vertical-align: top;
    margin: 15px 10px;
    padding: 10px 0;
    position: relative;
}

.ucmicons-ul li+li {
    margin-right: 0;
}

.ucmicons-ul li::before {
    content: "";
    position: absolute;
    top: auto;
    width: 100%;
    height: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    -webkit-box-shadow: 0px 0px 32px 0px rgba(122, 122, 122, 0.1);
    -moz-box-shadow: 0px 0px 32px 0px rgba(122, 122, 122, 0.1);
    box-shadow: 0px 0px 32px 0px rgba(122, 122, 122, 0.1);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -webkit-transition: all 500ms ease 0s;
    transition: all 500ms ease 0s;
    z-index: 1
}

.ucmicons-ul li:hover::before {
    height: 100%;
}

.ucmicons-ul li p {
    text-align: center;
    background: #ffffff;
    padding: 10px 0;
    border-radius: 4px;
    color: #717171;
    margin: 15px 0 0 0;
    font-size: 13px;
    z-index: 3;
    position: relative;
}

i.ucmicons {
    width: 35px;
    height: 35px;
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    margin: 0px auto;
    z-index: 3;
    position: relative;
}

@media screen and (min-width:320px) and (max-width:479px) {
    .ucmicons-ul li {
        width: 49%;
    }
}

@media screen and (min-width:480px) and (max-width:1169px) {
    .ucmicons-ul li {
        width: 32%;
    }
}


/* * Error Alert UCM toast for alert message*/

.ucm-toast {
    max-width: 400px;
    margin: auto;
    background-color: #545454;
    position: fixed;
    z-index: 3050;
    top: 5rem;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid #636361;
    display: none;
}

.ucm-toast .ucm-toasticon {
    width: 35px;
    background-color: #636361;
    color: #fff;
    position: relative;
}

.ucm-toasticon::before {
    content: '';
    display: block;
    position: absolute;
    background-position: center center;
    background-repeat: no-repeat;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.ucm-toasticon::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 368.01 800'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M447.88,178.75C508.48,178.75,555,130.47,555,78.32,555,36.52,528.23,0,474.64,0,404.13,0,368.9,57.42,368.9,99.18,367.49,148.75,397.1,178.75,447.88,178.75Z' transform='translate%28-193.35%29' style='fill:%23ffffff'/%3E%3Cpath d='M537.37,626.37c-40.86,32.65-82.46,48.36-95.15,48.36-9.85,0-14.1-13.05-4.22-50.9l55.58-214.06c21.14-78.32,14.07-129.18-28.2-129.18-50.74,0-169.14,51.25-272,138.67l21.13,35.23c32.46-22.19,87.35-44.72,100.08-44.72,9.84,0,8.44,13,0,45.66L266,659.06C236.4,773.91,267.41,800,309.69,800s151.56-39.22,251.68-141Z' transform='translate%28-193.35%29' style='fill:%23ffffff'/%3E%3C/svg%3E");
    width: 22px;
    height: 22px;
}

.ucm-toast.success .ucm-toasticon::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 800'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M788.85,39.93,733.94,4a24.59,24.59,0,0,0-34,7.15l-405.37,621a24.59,24.59,0,0,1-32.89,7.86L69.7,529.14a24.59,24.59,0,0,0-33.6,9L3.3,595a24.64,24.64,0,0,0,9,33.64l233,134.65q.59.34,1.16.71l48.89,32a24.59,24.59,0,0,0,34-7.15L796,74A24.64,24.64,0,0,0,788.85,39.93Z' transform='translate%280 0%29' style='fill:%23ffffff'/%3E%3C/svg%3E");
    width: 18px;
    height: 18px;
}

.ucm-toast.invalid .ucm-toasticon::before {
    color: #fff;
    content: '!';
    background-image: none;
    line-height: 32px;
    font-size: 26px;
    font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
    width: auto;
    height: auto;
    text-align: center;
}

.ucm-toast .ucm-toast-data {
    color: #333333;
    padding: 5px 10px;
    text-align: left;
    width: calc(100% - 35px);
    font-size: 12px;
    line-height: 18px;
}

.ucm-toast.show {
    -ms-display: flex;
    display: flex;
    -webkit-animation: fadein 0.5s;
    animation: fadein 0.5s;
    background: #ffffff;
    min-height: 40px;
}

.ucm-toast.success {
    border: 2px solid #8CA621;
    color: #8CA621;
}

.ucm-toast.success .ucm-toasticon {
    background-color: #8CA621;
}

.ucm-toast.invalid {
    border: 2px solid #c1362b;
    color: #c1362b;
}

.ucm-toast.invalid .ucm-toasticon {
    background: #c1362b;
}

@-webkit-keyframes fadein {
    from {
        top: 0;
        opacity: 0;
    }
    to {
        top: 5rem;
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        top: 0;
        opacity: 0;
    }
    to {
        top: 5rem;
        opacity: 1;
    }
}


/* @-webkit-keyframes expand {
    from {
        min-width: 30px
    }
    to {
        min-width: 370px
    }
}

@keyframes expand {
    from {
        min-width: 30px
    }
    to {
        min-width: 370px
    }
}

@-webkit-keyframes stay {
    from {
        min-width: 370px
    }
    to {
        min-width: 370px
    }
}

@keyframes stay {
    from {
        min-width: 370px
    }
    to {
        min-width: 370px
    }
}

@-webkit-keyframes shrink {
    from {
        min-width: 370px;
    }
    to {
        min-width: 30px;
    }
}

@keyframes shrink {
    from {
        min-width: 370px;
    }
    to {
        min-width: 30px;
    }
}

@-webkit-keyframes fadeout {
    from {
        top: 5rem;
        opacity: 1;
    }
    to {
        top: 10rem;
        opacity: 0;
    }
}

@keyframes fadeout {
    from {
        top: 5rem;
        opacity: 1;
    }
    to {
        top: 10rem;
        opacity: 0;
    }
} */


/* * ucm spiner */

.ucm-spiner {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0 3px 0 0;
    width: 18px;
}

.ucm-spiner::before {
    border: 1px solid #fff;
    border-right: 1px solid #8c8c8c;
    border-bottom: 1px solid #fff;
    border-left: 1px solid #8c8c8c;
    height: 17px;
    width: 17px;
    border-radius: 100%;
    -webkit-animation: ucm-spiner 1s infinite linear;
    -moz-animation: ucm-spiner 1s infinite linear;
    -o-animation: ucm-spiner 1s infinite linear;
    animation: ucm-spiner 1s infinite linear;
    display: block;
    content: '';
    position: absolute;
    -o-transform: translate(-50%, 50%);
    -webkit-transform: translate(-50%, 50%);
    -moz-transform: translate(-50%, 50%);
    -ms-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
    left: 50%;
    top: 50%;
}

.ucm-spiner:hover {
    color: #333;
    background: #333;
}

.ucm-spiner:hover::before {
    opacity: 1;
}

@-webkit-keyframes ucm-spiner {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes ucm-spiner {
    from {
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -moz-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes ucm-spiner {
    from {
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes ucm-spiner {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}


/*UI part icons*/


/* * Customize icon for UCM various place */

.datetimepickericon::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 791'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M676.8,80.68H600V0H480V80.68H316.67V0h-120V80.68H123.2C55.27,80.68,0,138.84,0,210.33v451C0,732.83,55.27,791,123.2,791H676.8C744.73,791,800,732.83,800,661.35v-451C800,138.84,744.73,80.68,676.8,80.68ZM720,661.35c0,25.07-19.37,45.46-43.2,45.46H123.2c-23.83,0-43.2-20.39-43.2-45.46v-451c0-25.07,19.38-45.46,43.2-45.46h73.46v73.66h120V164.87H480v73.66H600V164.87H676.8c23.83,0,43.2,20.39,43.2,45.46Z' style='fill:%23959595'/%3E%3Cpath d='M299.57,277.91h-49q-11.48,17.51-38.2,30.34a130.07,130.07,0,0,1-57,12.58q-3,0-5.86-.25v76a77.17,77.17,0,0,0,11.72.74q22,0,34.69-3.45V549H149.57v78.92h195V549h-45Z' style='fill:%23959595'/%3E%3Cpath d='M536.09,401q-43.36,0-74.77,20.72l2.81-68.07H580.63l7.73,21h55.08V284.81H403.2l-9.84,178.57,71,26.39q17.81-20.22,44.06-20.22a46.49,46.49,0,0,1,30,10.36q12.66,10.61,12.66,33.3,0,23.18-12.66,34-13.12,10.85-32.11,10.85-32.11,0-43.36-28.12l-84.84,5.67q8.44,44.4,45.94,69.8,37.73,25.65,95.39,25.65,65.63,0,102.42-33.79,36.56-33.79,36.56-84.6,0-52-34.69-81.88T536.09,401Z' style='fill:%23959595'/%3E%3C/svg%3E");
}

#topRightNav .dropdown-menu a i.w-ucmicon-power-off {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 670.98 791.36'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Crect x='287.03' width='96.91' height='449.95' rx='48.46' ry='48.46' style='fill:%23F27724'/%3E%3Cpath d='M591.49,187.37c-26-18.18-61.75.89-61.75,32.62V220a40,40,0,0,0,17.31,32.64A256.22,256.22,0,0,1,655.37,481.25C646.4,607.53,544,709.71,417.7,718.43,267.77,728.78,142.94,610.22,142.94,462.51A256.16,256.16,0,0,1,252,252.67a40,40,0,0,0,17.28-32.61v0c0-31.88-35.93-50.74-62-32.45C112.52,253.91,53.68,367.89,65.5,494.72,80.55,656.18,212.18,785.06,373.9,797,570.74,811.64,735,656.26,735,462.51,735,348.64,678.24,248,591.49,187.37Z' transform='translate%28-64 -6.64%29' style='fill:%23F27724'/%3E%3C/svg%3E");
}

.accordion-toggle::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 762.86 106.8'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Crect width='762.86' height='106.8' rx='10' ry='10' style='fill:%23959595'/%3E%3C/svg%3E");
}

.accordion-toggle.length::before {
    background-image: none;
}

.accordion-toggle.collapsed::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 762.86 762.86'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M763.36,349.91H458.22V44.77a22.89,22.89,0,0,0-22.89-22.89h-61a22.89,22.89,0,0,0-22.89,22.89V349.91H46.28A22.89,22.89,0,0,0,23.39,372.8v61a22.89,22.89,0,0,0,22.89,22.89H351.42V761.86a22.89,22.89,0,0,0,22.89,22.89h61a22.89,22.89,0,0,0,22.89-22.89V456.71H763.36a22.89,22.89,0,0,0,22.89-22.89v-61A22.89,22.89,0,0,0,763.36,349.91Z' transform='translate%28-23.39 -21.89%29' style='fill:%23959595'/%3E%3C/svg%3E");
}


/*tab to accordian && Tree view Assign to Plus minus icon*/

.ucm-tab .accordian-head::before,
.child-astree-label.collapsed span::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 762.86 762.86'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M763.36,349.91H458.22V44.77a22.89,22.89,0,0,0-22.89-22.89h-61a22.89,22.89,0,0,0-22.89,22.89V349.91H46.28A22.89,22.89,0,0,0,23.39,372.8v61a22.89,22.89,0,0,0,22.89,22.89H351.42V761.86a22.89,22.89,0,0,0,22.89,22.89h61a22.89,22.89,0,0,0,22.89-22.89V456.71H763.36a22.89,22.89,0,0,0,22.89-22.89v-61A22.89,22.89,0,0,0,763.36,349.91Z' transform='translate%28-23.39 -21.89%29' style='fill:%23959595'/%3E%3C/svg%3E");
}

.ucm-tab .accordian-head.a_active::before,
.child-astree-label span::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 762.86 106.8'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Crect width='762.86' height='106.8' rx='10' ry='10' style='fill:%23959595'/%3E%3C/svg%3E");
}


/*hidden desk hiddem-mob*/

@media screen and (min-width:768px) {
    .hidden-desk {
        display: none !important;
    }
}


/*help container*/

.ucm-notification,
.user-help {
    margin-right: 10px;
    margin-top: 5px;
    position: relative;
}

.ucm-notification .n-count {
    width: 30px;
    height: 20px;
    position: absolute;
    right: -12px;
    z-index: 5;
    background: #f27724;
    color: #fff;
    border-radius: 8px;
    top: -13px;
    font-size: 12px;
    text-align: center;
    line-height: 16px;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    border: 2px solid #fff;
}


/* notification list div */

.ucm-notifications-lists {
    width: 360px;
    transform: translate3d(-316px, 47px, 0px) !important;
    -webkit-transform: translate3d(-316px, 47px, 0px) !important;
    -moz-transform: translate3d(-316px, 47px, 0px) !important;
    -ms-transform: translate3d(-316px, 47px, 0px) !important;
    -o-transform: translate3d(-316px, 47px, 0px) !important;
}

.ucm-notifications-lists::before {
    content: '';
    border-bottom: 13px dashed #ffffff;
    border-right: 13px solid transparent;
    border-left: 13px solid transparent;
    position: absolute;
    top: -13px;
    right: 31px;
    z-index: 2;
}

.ucm-notifications-lists::after {
    content: '';
    border-bottom: 15px dashed #e2e2e2;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    position: absolute;
    top: -16px;
    right: 29px;
    z-index: 1;
}

.ucm-notifications-lists h3 {
    padding: 10px;
    border-bottom: 1px solid #ccc;
    font-size: 15px;
    color: #000;
    line-height: 21px;
}

#notiScroll {
    overflow: hidden;
    max-height: 360px;
}

#notiScroll:hover {
    overflow: auto;
}

#notiScroll::-webkit-scrollbar {
    width: 8px;
}

#notiScroll::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

#notiScroll::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #555;
}

.loop-alert {
    padding: 10px;
    border-bottom: 1px solid #f1f1f1;
    margin: 0;
}

.loop-alert:last-child {
    border-bottom: 0px none
}

.loop-alert span {
    font-size: 12px;
    line-height: 18px;
    color: #333;
    display: block;
    max-height: 46px;
    overflow: visible;
    max-width: 70%;
    white-space: pre-wrap;
    text-overflow: inherit;
}

.loop-alert span:hover {
    color: #0052a3;
    cursor: pointer;
}

.ucm-nft-detail {
    font-size: 15px;
    line-height: 20px;
    color: #262626;
}


/* ucm global search top */

.ucmglobalsearchtop {
    /* margin-right: 10px; */
    margin-top: 5px;
}

.ucmglobalsearchtop button {
    border: 0px none;
    background: none;
    padding: 0px;
    margin: 0px;
}

.ucmglobalsearchtop button i.ucmicons {
    width: 31px;
    height: 31px;
    margin-top: 0;
}

.ucmglobalsearchtop.dropdown.ucm-options-dropdown .ucm-global-search-boxtop {
    transform: translate3d(-415px, 50px, 0px) !important;
    -webkit-transform: translate3d(-415px, 50px, 0px) !important;
    -moz-transform: translate3d(-415px, 50px, 0px) !important;
    -ms-transform: translate3d(-415px, 50px, 0px) !important;
    -o-transform: translate3d(-415px, 50px, 0px) !important;
    width: 450px;
    padding: 15px;
}

.ucm-search-title {
    color: #333;
    font-size: 17px;
    line-height: 23px;
}

.ucmglobalsearchtop.dropdown.ucm-options-dropdown .ucm-ui-button {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.ucm-options-dropdown .ucm-global-search-boxtop.dropdown-menu::before {
    /* right: 68px; */
    right: 7px;
}

.ucm-options-dropdown .ucm-global-search-boxtop.dropdown-menu::after {
    /* right: 66px; */
    right: 5px;
}

.ucmhelp-top {
    margin: 0 10px 0 0;
    cursor: pointer
}

.ucmhelp-top i.ucmicons {
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.helpcontentarea .detachanchor span {
    display: inline-block;
    font-size: 27px;
    border-radius: 50%;
    background: #222;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-family: Arial;
    font-weight: normal;
    padding: 4px;
}

.helpcontentarea .detachanchor span i {
    width: 10px;
    height: 10px;
    margin: 1px 0 0 1px;
}

.helpcontentarea {
    position: fixed;
    top: 15px;
    right: -50%;
    z-index: 1060;
    width: 50%;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
}

.helpcontentarea.open {
    right: 0px;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
}

.helpcontentarea.open.expand {
    width: 85%;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
}

.helpcontentarea .helpanchor {
    display: none;
}

.helpcontentarea.open .helpanchor {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    padding: 4px;
    border: 1px solid #ddd;
    border-right: none;
    width: 36px;
    background: #ddd;
    height: 46px;
    text-align: center;
    position: absolute;
    top: 0;
    right: 100%;
    line-height: 20px;
    color: #222;
    font-size: 9px;
    display: block;
}

.helpcontentarea .helpanchor:before {
    content: '?';
    display: inline-block;
    color: #fff;
    font-size: 18px;
    background: #222;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-family: Arial;
    font-weight: bold;
}

.helpcontentarea .expandanchor {
    border-bottom-left-radius: 5px;
    border: 1px solid #ddd;
    border-right: none;
    text-align: center;
    width: 36px;
    background: #ddd;
    height: 50px;
    padding: 8px 4px 0 4px;
    position: absolute;
    display: none;
    top: 43px;
    right: 100%;
    line-height: 18px;
    color: #222;
    font-size: 9px;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
}

.helpcontentarea .expandanchor::before {
    content: '«';
    display: inline-block;
    color: #fff;
    font-size: 20px;
    background: #222;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    line-height: 17px;
    font-family: Arial;
    font-weight: bold;
}

.helpcontentarea.open .helpanchor::before {
    content: '×';
    font-weight: nomal;
    font-size: 20px;
}

.helpcontentarea.expand .expandanchor::before {
    content: '»';
}

.helpcontentarea.open .expandanchor {
    display: block;
}

.helpcontentarea .detachanchor {
    border-bottom-left-radius: 5px;
    border: 1px solid #ddd;
    border-right: none;
    text-align: center;
    width: 36px;
    background: #ddd;
    height: 48px;
    padding: 5px;
    position: absolute;
    top: 90px;
    right: 100%;
    line-height: 13px;
    color: #222;
    font-size: 9px;
    -webkit-transition: all ease .5s;
    transition: all ease .5s;
    display: none
}

.helpcontentarea .detachanchor b {
    display: inline-block;
    font-size: 27px;
    border-radius: 50%;
    background: #222;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-family: Arial;
    font-weight: normal;
    padding: 4px;
}

.helpcontentarea .detachanchor b img {
    width: 18px;
    height: 18px;
}

.helpcontentarea.open .detachanchor {
    display: block;
}

.helpcontentarea .helpcontent {
    border: 5px solid #ddd;
    width: 100%;
    border-right: none;
    background: #fff;
    height: 500px;
    padding: 15px;
    overflow: auto;
}

.helpcontentarea.open .helpcontent {
    box-shadow: -1px 2px 1px #999;
}

.helpcontentarea img {
    max-width: 100%;
    height: auto !important;
    border: 1px solid #ccc;
    padding: 5px;
    box-shadow: 3px 3px 0 #eee;
}

@media screen and (max-width: 767px) {
    .helpcontentarea {
        top: 94px;
    }
}

#HelpContent.helpcontent h2,
#HelpContent.helpcontent h2 a,
#HelpContent.helpcontent h3,
#HelpContent.helpcontent h3 a {
    color: #333;
    font-family: 'open_sanslight', Arial, sans-serif;
    font-size: 20px;
    padding-bottom: 10px;
    margin-top: 0;
    font-weight: normal;
    margin-bottom: 0;
    line-height: 1.1;
}

#HelpContent.helpcontent ol,
#HelpContent.helpcontent ul {
    margin-top: 10px;
    margin-left: 15px;
    margin-bottom: 5px;
}

#HelpContent.helpcontent ol li,
#HelpContent.helpcontent ul li {
    list-style: decimal;
    padding: 4px;
}

#HelpContent.helpcontent ol ol li,
#HelpContent.helpcontent ul ul li,
#HelpContent.helpcontent ol ul li,
#HelpContent.helpcontent ul ol li {
    list-style: lower-alpha;
    padding: 3px 4px;
}

#HelpContent.helpcontent ol ol ol li,
#HelpContent.helpcontent ul ul ul li,
#HelpContent.helpcontent ol ol ul li,
#HelpContent.helpcontent ul ul ol li,
#HelpContent.helpcontent ol ul ul li,
#HelpContent.helpcontent ul ol ol li,
#HelpContent.helpcontent ol ul ol li,
#HelpContent.helpcontent ul ol ul li {
    list-style: lower-roman;
    padding: 2px 4px;
}

#HelpContent.helpcontent ol ol ol ol li,
#HelpContent.helpcontent ul ul ul ul li,
#HelpContent.helpcontent ol ol ol ul li,
#HelpContent.helpcontent ul ul ul ol li,
#HelpContent.helpcontent ol ol ul ul li,
#HelpContent.helpcontent ul ul ol ol li,
#HelpContent.helpcontent ol ul ul ul li,
#HelpContent.helpcontent ul ol ol ol li,
#HelpContent.helpcontent ol ul ol ol li,
#HelpContent.helpcontent ul ol ul ul li,
#HelpContent.helpcontent ol ul ul ol li,
#HelpContent.helpcontent ul ol ol ul li,
#HelpContent.helpcontent ol ul ol ul li,
#HelpContent.helpcontent ul ol ul ol li,
#HelpContent.helpcontent ol ol ul ol li,
#HelpContent.helpcontent ul ul ol ul li {
    list-style: disc;
    padding: 1px 4px;
}

#HelpContent.helpcontent p {
    margin-top: 10px;
    margin-bottom: 5px;
}


/* For detouch htlp container*/

#HelpContent.helpcontent {
    padding: 15px;
}


/* * UCM UI button and Button group */

.ucm-info-button {
    width: 19px;
    height: 19px;
    border-radius: 100%;
    vertical-align: middle;
    background: #fff;
    border: 1px solid #ccc;
    padding: 0;
}

.ucm-info-button i.ucmicons.sm {
    width: 11px;
    height: 11px;
}


/* .ucm-info-button
.inputinfo {
    position: relative;
}  */

.ucm-icon-button {
    margin: 0px;
    padding: 0px;
    display: inline-block;
    background: rgba(0, 0, 0, 0);
    border: 0px none;
    font-size: 12px;
}

.inputinfo .ucm-info-button {
    position: absolute;
    right: 0px;
    top: 8px;
}

.ucm-ui-button,
.cp-cancel-button-class {
    border: 1px solid #DDDDDD !important;
    padding: 4px 20px !important;
    /*margin: 0px 0 0 5px !important;*/
    font-size: 12px !important;
    line-height: 18px !important;
    border-radius: 4px !important;
    text-transform: capitalize !important;
    display: inline-block !important;
    color: #0052a3 !important;
    background: #ffffff !important;
}

.ucm-ui-button-success {
    border: 1px solid #8ca621;
    padding: 4px 20px;
    font-size: 12px;
    line-height: 18px;
    border-radius: 4px;
    text-transform: capitalize;
    display: inline-block;
    color: #fff;
    background: #8ca621;
}

.ucm-ui-button+.ucm-ui-button {
    margin-left: 5px;
}

.ucm-ui-button:first-child {
    margin-left: 0 !important;
}

.ucm-ui-button-group {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.ucm-ui-button-group .ucm-ui-button {
    margin: 0 5px 10px;
}

.ucm-ui-button-group .ucm-ui-button+.ucm-ui-button {
    margin-left: 0;
}

.ucm-ui-button.disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.ucm-ui-block-button .ucm-ui-button {
    width: 100%;
    display: block !important;
    margin-bottom: 12px !important;
}

.ucm-ui-block-button .ucm-ui-button+.ucm-ui-button {
    margin-left: 0 !important;
}

.ucm-ui-button.sm {
    padding: 3px 10px !important;
}

.ucm-ui-link {
    background: none;
    border: 0px none;
    font-size: 12px;
    line-height: 18px;
    color: #0052a3;
    cursor: pointer;
}

.ucm-ui-link.disbaled {
    opacity: 0.5;
    cursor: not-allowed;
}

.ucmgrid {
    display: block;
    width: 100%;
}

@media screen and (min-width: 768px) {
    .ucmgrid.auto {
        overflow-x: auto;
        overflow-y: hidden;
    }
}

.ucmgrid .gridtable th a {
    color: #111111;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    font-size: 12px;
    font-weight: normal;
}

.ucmgrid .gridtable th,
.ucmgrid .gridtable .gridheader tr {
    border-bottom: 1px solid #f1f1f1;
    color: #111111;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    font-size: 12px;
    font-weight: normal;
    padding: 10px 6px;
    vertical-align: middle;
    z-index: 100;
}

.ucmgrid .gridtable td {
    padding: 6px;
    text-align: left;
    text-decoration: none;
}

.ucmgrid .gridtable tr {
    border-bottom: 0px none;
}

.ucmgrid .gridtable tr th a,
.ucmgrid .gridtable tr td a {
    cursor: pointer;
}

.ucmgrid .gridtable tr td a,
.ucm-view-detail a {
    cursor: pointer;
    color: #0052a3;
}


/*.ucmgrid .cardlabel a[href*="77"] {
     color: red;
}
*/

.ucmgrid .gridtable tr.colorize td {
    -webkit-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18);
    -moz-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18);
    -o-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18);
    -ms-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18);
    box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18);
}

.ucmgrid .gridtable tr.colorize td:first-child {
    -o-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18), inset 8px -0px 8px -5px rgba(0, 0, 0, .15), inset 0px 0px 0px 0px rgba(0, 0, 0, 0);
    -moz-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18), inset 8px -0px 8px -5px rgba(0, 0, 0, .15), inset 0px 0px 0px 0px rgba(0, 0, 0, 0);
    -webkit-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18), inset 8px -0px 8px -5px rgba(0, 0, 0, .15), inset 0px 0px 0px 0px rgba(0, 0, 0, 0);
    -ms-box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18), inset 8px -0px 8px -5px rgba(0, 0, 0, .15), inset 0px 0px 0px 0px rgba(0, 0, 0, 0);
    box-shadow: inset 0px 9px 8px -10px rgba(0, 0, 0, 0.18), inset 0px -9px 8px -10px rgba(0, 0, 0, 0.18), inset 8px -0px 8px -5px rgba(0, 0, 0, .15), inset 0px 0px 0px 0px rgba(0, 0, 0, 0);
}

.ucmgrid .gridtable tr.colorize td:last-child {
    -o-box-shadow: inset 0 -9px 8px -9px rgba(0, 0, 0, 0.18), inset -9px 0 8px -9px rgba(0, 0, 0, 0.18), inset 0 8px 8px -9px rgba(0, 0, 0, 0.18), inset 0px 0 0px 0px rgba(0, 0, 0, 0);
    /*left*/
    -ms-box-shadow: inset 0 -9px 8px -9px rgba(0, 0, 0, 0.18), inset -9px 0 8px -9px rgba(0, 0, 0, 0.18), inset 0 8px 8px -9px rgba(0, 0, 0, 0.18), inset 0px 0 0px 0px rgba(0, 0, 0, 0);
    /*left*/
    -moz-box-shadow: inset 0 -9px 8px -9px rgba(0, 0, 0, 0.18), inset -9px 0 8px -9px rgba(0, 0, 0, 0.18), inset 0 8px 8px -9px rgba(0, 0, 0, 0.18), inset 0px 0 0px 0px rgba(0, 0, 0, 0);
    /*left*/
    -webkit-box-shadow: inset 0 -9px 8px -9px rgba(0, 0, 0, 0.18), inset -9px 0 8px -9px rgba(0, 0, 0, 0.18), inset 0 8px 8px -9px rgba(0, 0, 0, 0.18), inset 0px 0 0px 0px rgba(0, 0, 0, 0);
    /*left*/
    box-shadow: inset 0 -9px 8px -9px rgba(0, 0, 0, 0.18), inset -9px 0 8px -9px rgba(0, 0, 0, 0.18), inset 0 8px 8px -9px rgba(0, 0, 0, 0.18), inset 0px 0 0px 0px rgba(0, 0, 0, 0);
    /*left*/
}

.ucmgrid .gridtable tr:nth-child(even) {
    background: #f7f7f7;
}

.ucmgrid .gridtable tr:last-of-type {
    border: 0px none;
}

@media screen and (max-width:767px) {
    .ucmgrid .gridtable tr.colorize td,
    .ucmgrid .gridtable tr.colorize td:first-child,
    .ucmgrid .gridtable tr.colorize td:last-child {
        background: #f1f1f1;
        -o-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
        -moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
        -ms-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
        -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
        box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    }
}


/*.ucmgrid .gridtable tr:hover, .ucmgrid .gridtable tr:focus {
     background: #fcfcfc;
}
*/

.ucm-radius-border {
    border-radius: 6px;
    border: 1px solid #DDDDDD;
}

@media screen and (min-width:768px) {
    .ucm-radius-table {
        border-radius: 6px;
        border: 1px solid #DDDDDD;
        margin-bottom: 15px;
    }
    .ucmgrid .gridtable tr.gridheader {
        background: none;
        border-bottom: 2px solid #DDDDDD;
    }
    .ucmgrid .gridtable {
        border: 1px solid #DDDDDD;
        border-spacing: 0;
        margin: 0 0 15px;
        width: 100%;
    }
    .ucm-radius-table .gridtable {
        border: 0px none;
        margin: 0px;
    }
    .ucmgrid .gridtable th:first-child,
    .ucmgrid .gridtable td:first-child {
        border-left: 0px none;
    }
    /*ucm radius design  */
    .ucm-radius-table tr th:first-child,
    .ucm-radius-table tr td:first-child {
        padding-left: 15px
    }
    .ucm-radius-table tr th:last-child,
    .ucm-radius-table tr td:last-child {
        padding-right: 15px;
    }
    .ucm-radius-table tr:first-child th:first-child,
    .ucm-radius-table tr:first-child th:last-child,
    .ucm-radius-table tr:last-child td:first-child,
    .ucm-radius-table tr:last-child td:last-child {
        border-radius: 0;
    }
    .ucm-radius-table tr:first-child th:first-child {
        border-top-left-radius: 6px;
    }
    .ucm-radius-table tr:first-child th:last-child {
        border-top-right-radius: 6px;
    }
    .ucm-radius-table tr:last-child td:first-child {
        border-bottom-left-radius: 6px;
    }
    .ucm-radius-table tr:last-child td:last-child {
        border-bottom-right-radius: 6px;
    }
    .ucm-radius-table table.gridtable tr.gridheader {
        border-bottom: 1px solid #DDDDDD;
    }
}

.ucmgrid .gridtable tr:last-child td {
    border-bottom: 0px none;
}

.ucmgrid .gridtable td div.cardlabel {
    font-size: 12px;
    min-width: 80px;
    color: #333333;
    text-align: left;
}

.ucmgrid .gridtable td div.cardlabel a {
    text-align: left;
}

.ucmgrid .gridtable td div.cardlabel .input-with-ucmlink {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.ucmcontent .input-with-ucmlink .ucmlinkgroup .ucmlink button {
    background: rgba(0, 0, 0, 0);
    border: 0px none !important;
    color: #00adff !important;
}


/*.gridwithoutgrid*/

.ucmgrid .gridtable.gridwithoutgrid,
.ucmgrid .gridtable.gridwithoutgrid td,
.ucmgrid .gridtable.gridwithoutgrid tr.gridheader {
    border: 0px none;
}

.ucmgrid .gridtable.gridwithoutgrid th {
    color: #7d7d7d;
    background: none;
    padding: 4px 5px;
}

.ucmgrid .gridtable.gridwithoutgrid tr:nth-child(even) {
    background: none;
}

.ucmgrid .gridtable.gridwithoutgrid tr {
    border-bottom: 1px solid #f1f1f1;
}

.ucmgrid .gridtable.gridwithoutgrid td {
    padding: 4px 5px;
    color: #333333;
}


/*grid with checkbox*/

.gridtable .custom-checkbox,
.gridtable .radiobox {
    display: inline-block;
    position: relative;
    padding-left: 0;
    cursor: pointer;
    padding-right: 0;
    margin: 0px;
    min-height: 13px;
    width: 25px;
}

.gridtable .custom-checkbox label {
    cursor: pointer;
    padding: 0 10px 0 0;
    font-weight: normal;
    width: auto;
    margin: 0;
    position: relative;
    display: block;
}

.gridtable .ifselected .custom-checkbox label {
    padding-right: 0;
}

.gridtable .custom-checkbox small {
    font-size: 12px;
    font-weight: normal;
}

.gridtable .radiobox .ripple-group {
    position: relative;
    display: inline-block;
    width: 8px;
    height: 12px;
    top: 0;
    margin: 0;
    pointer-events: none;
}


/* *flag on grif table */

.cardlabel i.ucmicons.sm {
    margin: 0
}

@media screen and (max-width:767px) {
    .mobile-margin {
        margin: 10px 0 0 0;
    }
    .rwd-table td::before {
        color: #666;
    }
    .rwd-table {
        margin: 1em 0;
        min-width: 280px;
    }
    .rwd-table th,
    .rwd-table td {
        text-align: left !important;
    }
    .rwd-table {
        background: #fff;
        color: #333;
        overflow: hidden;
    }
    .rwd-table td::before {
        content: attr(data-th);
        width: 25%;
        display: table-cell;
        padding: 0.5em 0.76em;
        min-width: 130px;
        font-weight: normal;
        vertical-align: middle;
        background: #fcfcfc;
    }
    .rwd-table tr.gridheader {
        display: none;
    }
    .rwd-table tr {
        display: block;
        border: 1px solid #f1f1f1;
        margin-bottom: 20px;
    }
    .ucmgrid .gridtable,
    .ucmgrid .gridtable tbody {
        border: 0px none;
        margin: 0px;
        display: block;
    }
    .ucmgrid .gridtable tr:hover,
    .ucmgrid .gridtable tr:focus {
        background: none;
    }
    .ucmgrid .gridtable.rwd-table td {
        padding: 0em !important;
        display: table;
        border-left: 0px none !important;
        width: 100%;
        border-bottom: 1px solid #f1f1f1;
        min-height: 25px;
    }
    .rwd-table td:last-child {
        border: 0px none;
    }
    .ucmgrid .rwd-table.gridtable tr:hover,
    .ucmgrid .rwd-table.gridtable tr:focus {
        background: rgab(0, 0, 0, 0);
    }
    .ucmgrid .gridtable tr:last-child td,
    .rwd-table td:last-child {
        border-bottom: 1px solid #f1f1f1 !important;
    }
    .ucmgrid .gridtable td div.cardlabel {
        display: table-cell;
        vertical-align: middle;
        min-width: 130px;
        padding: 0.5em 0.76em;
    }
    .ucmgrid .gridtable tr:nth-child(even) {
        background: #fff;
    }
    .ucmgrid .gridtable tr:last-of-type {
        border: 1px solid #f1f1f1;
        border-bottom: 0px none;
    }
    .modal-body .rwd-table {
        min-width: auto;
    }
    .ucmgrid .gridtable.gridwithoutgrid tr {
        border: 0px none
    }
}


/*max 767px*/


/* * data-email form mobile */

@media screen and (min-width:768px) {
    .ucmgrid .gridtable .emailid {
        display: block;
        overflow: hidden;
        position: relative;
        white-space: nowrap;
        text-overflow: ellipsis;
        max-width: 150px;
    }
}


/*min 768px*/

.price {
    text-align: right;
    padding-right: 15px;
}


/*ucm form*/

.formheading,
.fromheading {
    color: #333333;
    font-size: 15px;
    font-weight: normal;
    text-align: left;
    padding: 5px 10px;
    line-height: 22px;
    margin-bottom: 14px;
    display: block;
    position: relative;
    background: #ddd;
    font-family: 'open_sanssemibold', Arial, sans-serif;
    border-radius: 6px;
}

.form-double>div:nth-child(n+2) .formheading {
    margin-top: 23px
}

h2.subheading {
    font-size: 14px;
    line-height: 20px;
    color: #7c7c7c;
    text-transform: capitalize;
    font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: 1px;
    margin-bottom: 20px;
    position: relative;
    padding-left: 15px;
    display: block;
}

h2.subheading::before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    background: #d3d3d3;
    margin-right: 0;
    left: 0px;
    top: 6px;
    -moz-box-shadow: 2px 2px 0px #a0a0a0;
    -webkit-box-shadow: 2px 2px 0px #a0a0a0;
    -o-box-shadow: 2px 2px 0px #a0a0a0;
    -ms-box-shadow: 2px 2px 0px #a0a0a0;
    box-shadow: 2px 2px 0px #a0a0a0;
}

h2.subheading::after {
    position: absolute;
    width: 80%;
    content: '';
    right: 0px;
    background: #d3d3d3;
    height: 1px;
    top: 10px;
    display: none;
}

.subsubhead {
    font-size: 14px !important;
    line-height: 20px !important;
    color: #7c7c7c;
    text-transform: capitalize;
    letter-spacing: 1px !important;
    background: none !important;
}

.subsubhead:hover {
    -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    -o-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}


/*pagination*/

nav .row .col-12 {
    display: -ms-flexbox;
    display: flex;
    -ms-justify-content: space-between;
    justify-content: space-between;
    -ms-align-items: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.ucm-pagination {
    margin: 0;
    text-align: left;
    vertical-align: middle;
    padding: 0px;
}

.ucm-pagination-count {
    display: inline-block;
    padding: 0 10px;
    font-size: 13px;
    line-height: 18px;
    color: #333;
    vertical-align: middle;
}

.ucm-pagination .ucm-pagination {
    margin: 0px;
}

@media screen and (max-width: 480px) {
    .ucm-pagination .pagination-first,
    .ucm-pagination .pagination-prev,
    .ucm-pagination .pagination-next,
    .ucm-pagination .pagination-last {
        display: none;
    }
}


/*ucm view table*/

.ucmvlabel {
    font-size: 12px;
    padding: 9px 5px;
    display: block;
    text-align: right;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    font-weight: normal;
    min-height: 35px;
}

.ucmvdesc {
    font-size: 12px;
    font-weight: normal;
    display: block;
    padding: 9px 5px;
    min-height: 35px;
}

ucmnodatafound {
    display: block;
    height: 100%;
    width: 100%;
}


/*if paccounts  */

paccounts ucmnodatafound {
    height: auto;
}

.not-found {
    display: block;
    padding: 15px;
    background: #f1f1f1;
    text-align: center;
}

.not-found i {
    display: block;
    width: 30px;
    height: 30px;
    margin: 0px auto;
}

.not-found p {
    color: #8f8f8f;
    margin: 10px auto 0;
    font-size: 2rem;
}

.not-found p span {
    display: block;
    font-size: 2rem;
    line-height: initial;
    margin-bottom: 15px;
}

ucmerror .not-found {
    background: #fff;
    border-radius: 8px;
}


/*report not found will be all places*/

.nodatafound {
    height: 100%;
    background: #f1f1f1;
    position: relative;
    text-align: center;
    min-height: 90px;
}

.no-datawrap {
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.no-datawrap p {
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    margin: 0;
}

.no-datawrap i {
    width: 40px;
    height: 40px;
    margin: 0px auto 10px;
}

.ucm-view-detail {
    margin: 10px auto 24px;
}

.richtextboxarea .ucmvlabel {
    text-align: left;
    padding: 5px 0;
    min-height: inherit;
}

.ucm-view-detail .ucm-view-row:first-child .row .richtextboxarea .ucmvlabel {
    padding-top: 15px;
}

.richtextboxarea .innerhtml {
    margin-bottom: 10px;
    max-width: 1200px;
}

.richtextboxarea p {
    display: block;
    margin-bottom: 4px;
}

@media screen and (min-width:768px) {
    .ucm-view-detail {
        display: block;
        /* border: 1px solid #f1f1f1; */
    }
    .ucm-view-detail .row {
        margin: 0px;
        height: 100%;
    }
    .ucm-view-detail .ucm-view-row {
        padding: 0px;
        margin: 0px;
    }
    .ucm-view-detail .ucm-view-row:last-child {
        border-bottom: 0px;
    }
    .ucm-view-detail .uc-view-label {
        /* border-right: 1px solid #f1f1f1;
        border-top: 1px solid #f1f1f1; */
        padding-right: 0px;
    }
    .ucm-view-detail .uc-view-data {
        padding-left: 0px;
    }
    .ucm-view-detail .ucm-view-row:first-child .uc-view-label,
    .ucm-view-detail .ucm-view-row:nth-child(2) .uc-view-label,
    .ucm-view-detail .ucm-view-row:first-child .uc-view-data,
    .ucm-view-detail .ucm-view-row:nth-child(2) .uc-view-data {
        border-top: 0px none;
    }
    .ucm-view-detail .ucm-view-row:nth-child(even) .uc-view-data {
        border-right: 0px none;
    }
    /*when ucm-two-col double view*/
    .ucm-two-col {
        border-bottom: 0px none;
    }
    /*when rand column*/
    .ucm-rand-col {
        border-right: 0px;
        border-bottom: 0px;
    }
}


/*min 768px*/

@media screen and (max-width:479px) {
    .ucm-view-detail .row .ucm-view-row .ucmvdesc,
    .ucm-view-detail .row .ucm-view-row .ucmvlabel {
        background: #fff;
        border-left: 1px solid #f1f1f1;
        border-right: 1px solid #f1f1f1;
    }
    .ucm-view-detail .row .ucm-view-row .ucmvlabel {
        padding-left: 12px;
        padding-bottom: 4px
    }
    .ucm-view-detail .row .ucm-view-row .ucmvdesc {
        border-bottom: 1px solid #f1f1f1;
        padding: 0px 12px 9px;
    }
    .ucm-view-detail .row .ucm-view-row:first-child .ucmvlabel {
        border-top: 1px solid #f1f1f1;
    }
    .ucm-view-detail .row .ucm-view-row:last-child .ucmvdesc {
        border-bottom: 1px solid #f1f1f1;
    }
    .ucmvdesc,
    .ucmvlabel {
        text-align: left;
    }
    /*when ucm-two-col double view*/
    .ucm-two-col {
        border: 1px solid #f1f1f1;
        border-bottom: 0px none;
    }
    .ucm-view-detail.ucm-two-col .uc-view-data {
        border-bottom: 1px solid #f1f1f1;
    }
    .ucm-view-detail.ucm-two-col .row.ucm-view-row {
        margin: 0px;
    }
    /*ucm-rand-col*/
    .ucm-rand-col {
        border: 1px solid #f1f1f1;
        border-bottom: 0px;
    }
    .ucm-view-detail.ucm-rand-col .uc-view-data {
        border-bottom: 1px solid #f1f1f1;
    }
    .ucm-view-detail.ucm-rand-col .row {
        margin: 0px;
    }
}


/*max 479px*/

@media screen and (min-width:480px) and (max-width:767px) {
    .uc-view-label,
    .uc-view-data {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        padding: 0px;
    }
    /* .ucmvlabel, .ucmvdesc {
        min-height: 56px;
    } */
    .ucmvdesc {
        margin-right: 15px;
    }
    .ucmvlabel {
        margin-left: 15px;
    }
    .ucmvlabel {
        text-align: right;
        /* border-top: 1px solid #f1f1f1;
        border-left: 1px solid #f1f1f1;
        border-right: 0px none;
        border-bottom: 0px none; */
    }
    .ucmvdesc {
        /* border-top: 1px solid #f1f1f1;
        border-left: 1px solid #f1f1f1;
        border-right: 1px solid #f1f1f1; */
        text-align: left;
        border-bottom: 0px none;
    }
    /* .ucm-view-detail {
        border-bottom: 1px solid #f1f1f1;
    } */
    .ucm-two-col .ucmvlabel,
    .ucm-two-col .ucmvdesc {
        min-height: inherit;
    }
}

@media screen and (min-width:768px) and (max-width:991px) {
    /*.ucm-view-detail .row {
         margin: 0px;
    }
    */
    /* .ucm-view-detail .ucm-view-row .ucmvlabel, .ucm-view-detail .ucm-view-row .ucmvdesc {
        min-height: 55px;
    } */
    /*.ucm-view-detail .ucm-view-row:nth-child(even) {
         border-left: 0px none;
    }
     .ucm-view-detail .ucm-view-row .uc-view-label, .ucm-view-detail .ucm-view-row .uc-view-data {
         width: 100%;
    }
     .ucm-view-detail .ucm-view-row .uc-view-label .ucmvlabel, .ucm-view-detail .ucm-view-row .uc-view-data .ucmvdesc {
         text-align: left;
         padding: 5px 0 0;
    }
     .ucm-view-detail {
         border-bottom: 1px solid #f1f1f1;
    }
    */
}


/*New View table 10.7.17*/

.viewbuttonlists {
    display: block;
    margin: 10px 0 0;
}

.viewbuttonlists ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

.viewbuttonlists ul li {
    display: block;
    text-align: right;
}

.viewbuttonlists ul li button {
    text-align: right;
    background: none;
    border: 0px none;
    margin: 0px auto 10px;
    padding: 0px;
    color: #6f6f6f;
    position: relative;
}

.viewbuttonlists ul li button .tab-infoicon {
    width: 16px;
    height: 16px;
    background: #fff;
    border: 1px solid #D0D0D0;
    display: inline-block;
    margin-left: 10px;
    vertical-align: middle;
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-radius: 1px;
    position: relative;
    transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
}

.viewbuttonlists ul li.active button .tab-infoicon {
    border: 1px solid #666;
    margin-left: 8px;
}

.viewbuttonlists ul li button:hover,
.viewbuttonlists ul li.active button {
    color: #363636;
}

.viewbuttonlists ul li.active button .tab-infoicon::after {
    width: 10px;
    height: 10px;
    background: #666;
    content: '';
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    border-radius: 1px;
    position: absolute;
    transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    left: 2px;
    top: 2px;
}


/* * New blocks design */

.colblocks ul {
    margin: 0px 0 10px 0;
    padding: 0px 5px;
    list-style-type: none;
}

.colblocks ul li {
    display: inline-block;
    vertical-align: top;
    margin: 0;
    width: 33.3333%;
    text-align: center;
}

@media screen and (max-width:479px) {
    .colblocks ul li {
        width: 100%;
        display: block;
    }
    .colblocks ul li button {
        border-right: 0px none;
    }
}

.colblocks ul li button {
    background: #d9d9d9;
    display: block;
    width: 100%;
    padding: 15px;
    border: 0px none;
    border-right: 1px solid #f1f1f1;
    border-bottom: 1px solid #f1f1f1;
    color: #ffffff;
    transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
}

.colblocks ul li button:hover,
.colblocks li.active button {
    color: #ffffff;
    background: #c1c1c1;
}

.colblocks li button i {
    margin: 10px auto;
    border-radius: 100%;
    width: 23px;
    height: 23px;
    border: 1px solid #fff;
}

.colblocks ul li:nth-child(3) button,
.colblocks ul li:nth-child(6) button,
.colblocks ul li:nth-child(9) button,
.colblocks ul li:nth-child(12) button {
    border-right: 0px none;
}

.colblocks ul li button img {
    width: 50px;
    height: 50px;
    display: block;
    margin: 0px auto 20px;
    border: 2px solid #262626;
    border-radius: 100%;
    padding: 6px;
}


/*ucm group links*/

.ucmlinkgroup {
    display: block;
    margin: 0px;
}

.ucmgrid .gridtable td div.cardlabel .ucmlinkgroup {
    margin: 0px;
}

.ucmlinkgroup ul {
    -ms-display: flex;
    display: flex;
    -ms-align-items: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0px;
    padding: 0;
}

.tableselectgroup.ucmlinkgroup ul {
    -ms-flex-wrap: initial;
    flex-wrap: initial;
}

.ucmlinkgroup ul li {
    list-style-type: none;
}

.ucmlinkgroup .ucmlink {
    background: url("../ucmasset/ucm-core/img/button_right.png") no-repeat scroll left center;
    margin: 0;
    color: #00adff;
    padding: 0 7px;
}

.ucmlinkgroup .ucmlink+.ucmlink {
    margin-left: 7px;
}

.ucmlink.nobg {
    background: none !important;
}

.ucmlink,
.ucmdropdown {
    color: #0052a3;
    text-decoration: none;
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
    font-size: 12px;
    font-weight: normal;
    line-height: 18px;
    margin: 5px 0;
    vertical-align: middle;
}

.ucmgrid .gridtable td div.cardlabel .ucmlinkgroup .ucmlink {
    margin: 0 4px;
}

.ucmlinkgroup .pagesize {
    width: 60px;
    min-width: auto !important;
    margin-left: auto !important;
}


/* * ucmradiusbtngrp */

.ucmmobilelinks {
    display: block;
    margin-top: 1rem;
}

.ucmradiusbtngrp {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style-type: none;
    list-style: none;
    margin: 0px 0 6px;
    padding: 0px;
}

.ucmradiusbtngrp+.ucmradiusbtngrp {
    margin-left: 5px;
}

.ucmradiusbtngrp .ucmrlink {
    border: 1px solid #DDDDDD;
    padding: 0;
    margin: 0px;
    border-radius: 6px;
    background: #fff;
    position: relative;
}

.ucmradiusbtngrp .ucmrlink+.ucmrlink {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    margin-left: -4px;
    padding-right: 0;
    border-left: 0;
}

.ucmradiusbtngrp .ucmrlink+.ucmrlink::after {
    content: '';
    position: absolute;
    width: 1px;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0px;
    background: #DDDDDD;
}

.ucmmobilelinks .ucmdropdown {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-inline-flexbox;
    display: inline-flex;
}

.ucmradiusbtngrp.fullsceren {
    position: relative;
    top: 4px;
}


/*.ucmrlink a, .ucmrlink ActionFlow, .ucmrlink CallNow, .ucmrlink SendEmail, .ucmrlink AssignTo, .ucmrlink Export, .ucmrlink Approve .ucmrlink Reject{
     color:#0052a3 
}
*/

.ucmradiusbtngrp .ucmrlink a,
.ucmradiusbtngrp .ucmrlink button {
    color: #0052a3 !important;
}

.ucmrlink a,
.ucmrlink button,
.ucmrlink input[type=text].pdf {
    font-size: 13px;
    line-height: 18px;
    text-transform: capitalize;
    text-align: center;
    display: block;
    margin: 0;
    padding: 6px 9px;
    border: 0px none;
    background: rgba(0, 0, 0, 0);
}

.ucmrlink input[type=text].pdf {
    width: 60px;
}

.ucmradiusbtngrp.fullsceren i.ucmicons {
    display: block;
    width: 15px;
    height: 15px;
}

.headerfixed i.ucmicons {
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transform: all 0.2s ease-in;
}

.fixed-div .headerfixed i.ucmicons {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.ucmrlink a.disabled,
.ucmrlink button:disabled,
.ucmrlink button.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.ucmradiusbtngrp i.ucmicons.sm {
    display: inline-block;
    vertical-align: -1px;
    margin: 0 3px 0 0px;
    width: 10px;
    height: 10px;
}

.ucmradiusbtngrp i.ucmicons.sm.ucmicon-arrow-right,
.ucmradiusbtngrp i.ucmicons.sm.ucmicon-arrow-left {
    margin-right: 0;
}

.ucmmobilelinks .ucmdropdown {
    margin: 0 0 0 5px;
}

.ucmmobilelinks .ucmdropdown label,
.pagesize label {
    min-width: 100px;
    margin: 0;
    color: #333333;
    font-size: 13px;
    line-height: 20px;
}

.ucmmobilelinks .ucmdropdown .inputbox,
.pagesize .inputbox {
    background: #DDDDDD;
}

.ucmmobilelinks .ucmdropdown .inputbox .ucm-select select {
    padding-top: 6px;
    padding-bottom: 6px;
    line-height: 18px;
    font-size: 13px;
    max-width: 100px;
    min-height: inherit;
}

.pagesize .inputbox .ucm-select select {
    padding-top: 3px;
    padding-bottom: 3px;
    line-height: 18px;
    font-size: 13px;
    max-width: inherit;
    min-height: inherit;
}

.ucmmobilelinks .ucm-select::before {
    border-left: 1px solid #DDDDDD;
    height: 30px;
    background: none;
    width: 22px;
}


/*in report tab*/

.export-btn i.ucmicons {
    width: 20px;
    height: 20px;
    margin-top: 4px;
}

.ucmlink a,
.ucmlink button,
.ucmlink a:not([href]):not([tabindex]) {
    border: 0px none;
    background: rgba(0, 0, 0, 0);
    padding: 0px 3px;
    margin: 0px;
    color: #0052a3 !important;
    text-transform: capitalize;
    font-size: 12px;
    line-height: 18px;
    border-radius: 20px;
}

.gridtable button.ucmlink,
.gridtable a.ucmlink,
.gridtable .ucmlink a {
    color: #0052a3 !important;
    background: none;
    font-size: 12px;
    line-height: 18px;
}

.gridtable button.ucmlink {
    border: 0px none;
    padding: 0;
    margin: 0;
}

.ucmlink a:hover,
.ucmlink input:hover,
.ucmlink button:hover {
    color: #ffffff;
}

.ucmlinkgroup .ucmlink:first-of-type {
    background: none;
    margin-left: 0px;
    padding-left: 0px;
}

.ucmlink .ucm-select {
    width: 100%;
    min-width: 110px;
}

.ucmlink .ucm-select select {
    padding: 4px 20px 4px 4px;
    min-width: 80px;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.ucmlink .pull-right a,
.ucmlink .pull-right input,
.ucmlink .pull-right select {
    display: block;
    margin: 5px 0 0 0;
}

.ucmlink .inputbox {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}

.sendemail .d-flex {
    -ms-align-items: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.sendemail .d-flex label {
    flex: 0 0 100%;
    max-width: 100%;
    font-size: 12px;
    line-height: 18px;
}

.sendemail .d-flex .inputbox {
    margin-right: 10px;
}

.sendemail .ucm-ui-button.ui-modalbtn {
    min-width: 96px;
    margin: 0px !important;
    padding: 8px 5px !important;
}

.sendemail .ucm-ui-button.ui-modalbtn i.ucmicons.sm {
    display: inline-block;
    vertical-align: middle;
    padding-right: 7px;
}

.ucmdropdown.pagesize {
    min-width: auto;
}

@media screen and (max-width:767px) {
    .mobilelinks.ucmlinkgroup .ucmlink {
        text-align: center;
        margin: 10px 10px 10px 0;
    }
    .ucmmobilelinks .ucmdropdown .inputbox .ucm-select select {
        max-width: 100%;
    }
    .mobilelinks ul li.ucmlink a {
        color: #333;
        display: block;
    }
    .ucmdropdown,
    .mobilelinks ul>li.ucmlink.nobg {
        display: block;
        width: 100%;
        margin: 0px auto 10px;
    }
    .ucmmobilelinks .ucmdropdown {
        width: auto;
    }
    .ucmdropdown.pagesize {
        width: auto;
        margin: 0 0 0 auto;
    }
    .ucmlinkgroup {
        margin: 0px auto;
    }
    /*new button */
    .ucmradiusbtngrp .ucmrlink {
        padding: 0px;
        margin: 0 5px;
    }
    .ucmradiusbtngrp+.ucmradiusbtngrp {
        margin-left: 0;
        margin-bottom: 0px;
    }
    .ucmradiusbtngrp .ucmrlink:first-child {
        margin-left: 0px;
    }
    .ucmradiusbtngrp .ucmrlink+.ucmrlink::after {
        background: none;
    }
    .ucmradiusbtngrp .ucmrlink+.ucmrlink {
        border: 1px solid #DDDDDD;
        border-radius: 6px;
        margin-left: 0px;
    }
    .ucmradiusbtngrp+.ucmradiusbtngrp .ucmrlink {
        margin-top: 0px;
    }
    /*dyf-detailsview */
    dyf-detailsview .ucmmobilelinks .ml-auto {
        width: 200px;
    }
    dyf-detailsview .ucmmobilelinks .ml-auto .ucmradiusbtngrp {
        -ms-justify-content: flex-end;
        justify-content: flex-end;
        display: -ms-flexbox;
        display: flex;
    }
}


/*767px*/

@media screen and (max-width:479px) {
    .ucmmobilelinks.d-flex {
        position: relative;
        -mx-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    dyf-detailsview .ucmmobilelinks .ml-auto {
        margin: 0px !important;
        width: auto;
    }
}


/*max 479 */


/* for two radius group buttons */

.ucmrbybutton.ucmradiusbtngrp {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style-type: none;
    list-style: none;
    margin: 0px 0 6px;
    padding: 0px;
}

.ucmrbybutton.ucmradiusbtngrp .ucmrlink {
    border: 1px solid #DDDDDD;
    padding: 0;
    margin: 0px;
    border-radius: 6px;
    background: #fff;
    position: relative;
}

.ucmrbybutton.ucmradiusbtngrp .ucmrlink+.ucmrlink {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    margin-left: -4px;
    padding-right: 0;
    border-left: 0;
}

.ucmrbybutton.ucmradiusbtngrp .ucmrlink+.ucmrlink::after {
    content: '';
    position: absolute;
    width: 1px;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0px;
    background: #DDDDDD;
}


/*ucm modal*/

.modal-body .inputbox {
    width: 86%;
}

.sendemail.modal-body .inputbox {
    width: 75%;
}

.modal-body {
    color: #333333;
}

.modal-content {
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
    border: 0px none;
    border-radius: 4px;
}

.modal-header {
    padding: 10px;
    border-bottom: 0px none;
}

.modal-header.ui-draggable-handle {
    cursor: move;
}

.modal-title {
    font-size: 16px;
    color: #333;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
}

.modal .modal-dialog .modal-content .close,
.modal .modal-dialog .ucm-notice-box .close {
    opacity: 1;
    filter: alpha(opacity=100);
    -o-filter: alpha(opacity=100);
    -moz-filter: alpha(opacity=100);
    -ms-filter: alpha(opacity=100);
    -webkit-filter: alpha(opacity=100);
    font-size: 20px;
    font-weight: 100;
    width: 25px;
    height: 25px;
    -o-text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    -moz-text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    -ms-text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    -webkit-text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    color: #F27724 !important;
    -o-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    border: 1px solid #F27724;
    line-height: 22px;
    margin: 0px;
    cursor: pointer;
    transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    text-align: center;
    background: none;
    padding: 0px;
}


/*it will remove*/

.modal .modal-dialog .modal-content .close span {
    line-height: 8px;
}

.dynamicsearchmodal>.modal-dialog>.modal-content {
    min-height: 350px;
}

.modal .modal-dialog .modal-content .close:hover,
.modal .modal-dialog .ucm-notice-box .close:hover {
    background: #F27724;
    color: #fff !important;
}

.modal-body .message-title {
    font-size: 18px;
    line-height: 24px;
    margin: 10px auto;
}

.modal-footer button.btn+button.btn {
    margin-left: 0.65rem;
}


/*umm modal form*/

.ucm-modal-from {
    display: block;
}

.ucm-modal-from .ucm-select {
    width: 100%;
    margin-bottom: 10px;
}

.ucm-modal-from .form-control {
    margin-bottom: 10px;
}


/* * End modal large form */

.form-double .form-group {
    margin-bottom: 15px;
}

.form-double label {
    font-weight: normal;
    font-size: 12px;
    margin-right: 5px;
    text-align: right;
    vertical-align: middle;
    width: 40%;
    letter-spacing: 1px;
    margin-bottom: 0px;
}

.form-double label.readonly {
    opacity: 0.5;
    overflow: hidden;
}


/*.modal-body .form-double label.readonly {
     white-space: nowrap;
     text-overflow: ellipsis;
}
*/

i.required {
    color: #cd0202;
    font-style: normal;
}

.form-double .ucm-ml-xl {
    margin-left: 41%;
}

.form-double .checkboxsc .ucm-ml-xl {
    margin-left: auto;
    flex: 0 0 62%;
    max-width: 62%;
}

.form-double .ucm-ml-sm {
    margin-left: 20%;
}


/*ERROR validation*/

.form-group.filesc label.error {
    left: 0;
}

.createaccountdiv .form-group label.error {
    right: 0;
}

.form-group label.error {
    position: absolute;
    bottom: 45px;
    width: auto;
    display: inline-block;
    border: 1px solid #F27724;
    padding: 5px 10px;
    font-size: 11px;
    line-height: 17px;
    color: #F27724;
    border-radius: 4px;
    background: #fff;
    z-index: 4;
    text-align: left;
}

.form-group label.error.hidden {
    display: none;
}

.form-group label.error::after {
    content: "";
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #F27724 transparent transparent transparent;
    position: absolute;
    bottom: -12px;
    left: 10px;
}

.form-group label.error .absol {
    /* height: 16px; */
    overflow: hidden;
}

.form-group label.error.right {
    bottom: inherit;
    right: 0;
    z-index: 851;
    top: -13px;
}


/* * from checkbox, radio, select */


/*custom checkbox*/

.custom-checkbox {
    position: relative;
    margin-bottom: 7px;
    display: inline-block;
    padding-right: 10px;
}

.custom-checkbox input[type=checkbox] {
    display: none;
}

.custom-checkbox label {
    cursor: pointer;
    padding-left: 28px;
    font-weight: normal;
    width: auto;
    margin: 0;
    position: relative;
}

.custom-checkbox label span {
    display: block;
    position: absolute;
    left: 0;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.custom-checkbox label .box {
    border: 1px solid #dddddd;
    height: 18px;
    width: 18px;
    z-index: 8;
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.custom-checkbox label .check {
    left: 7px;
    top: 2px;
    width: 5px;
    height: 12px;
    border: 1px solid #333;
    border-top: none;
    border-left: none;
    opacity: 0;
    z-index: 8;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.custom-checkbox input[type=checkbox]:disabled~label .check {
    border-color: #d1d1d1;
}

.custom-checkbox input[type=checkbox]:checked~label .box {
    border: 1px solid #636361;
}

.custom-checkbox input[type=checkbox]:disabled~label .box {
    border-color: #d1d1d1;
}

.custom-checkbox input[type=checkbox]:checked~label .check,
.custom-checkbox input[type=checkbox]:checked:disabled~label .check {
    opacity: 1;
    -webkit-transform: scale(1) rotate(45deg);
    -moz-transform: scale(1) rotate(45deg);
    transform: scale(1) rotate(45deg);
}

.custom-checkbox.disabled label {
    cursor: not-allowed;
    opacity: 0.7;
}


/*end checkbox*/


/* *Custom radion BUtton */

.radiobox {
    display: inline-block;
    position: relative;
    cursor: pointer;
    padding-right: 10px;
    margin-bottom: 7px;
}


/*if modal*/

.modal-body .radiobox {
    display: block;
    margin-bottom: 10px;
}

assigntomodal .radiobox.d-inline-flex .ripple-group {
    top: 1px;
    margin: 0 5px 0 0;
}

.radiobox input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 100%;
    cursor: pointer;
    min-height: 20px;
    margin: 0px;
}

.radiobox input[type="radio"]:checked+.ripple-group .radio-off {
    border-color: #636361;
}

.radiobox input[type="radio"]:checked+.ripple-group .radio-on {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
    -webkit-transition: -webkit-transform 0.3s;
    -moz-transition: -moz-transform 0.3s;
    -o-transition: transform 0.3s;
    -ms-transition: transform 0.3s;
    transition: transform 0.3s;
}

.radiobox input[type="radio"]:checked+.ripple-group .ripple-on::before,
.radiobox input[type="radio"]:checked+.ripple-group .ripple-on::after {
    -webkit-transition: all 0.65s cubic-bezier(0.25, 0.8, 0.25, 1);
    -moz-transition: all 0.65s cubic-bezier(0.25, 0.8, 0.25, 1);
    -o-transition: all 0.65s cubic-bezier(0.25, 0.8, 0.25, 1);
    -ms-transition: all 0.65s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: all 0.65s cubic-bezier(0.25, 0.8, 0.25, 1);
    opacity: 0;
}

.radiobox input[type="radio"]:checked+.ripple-group .ripple-on::before {
    -webkit-transform: scale(3);
    -moz-transform: scale(3);
    -ms-transform: scale(3);
    -o-transform: scale(3);
    transform: scale(3);
}

.radiobox input[type="radio"]:checked+.ripple-group .ripple-on::after {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

.radiobox .ripple-group {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    top: 6px;
    margin: 0 2px 0 0;
    pointer-events: none;
}

.radiobox .ripple-group::before {
    border-radius: 50%;
    content: '';
    position: absolute;
    display: block;
    height: auto;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    -o-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

.radiobox .ripple-group .radio-off {
    position: absolute;
    width: 18px;
    height: 18px;
    left: 0;
    top: 0;
    border-radius: 50%;
    border: 1px solid #dddddd;
    -wbkit-transition: border-color ease 0.28s;
    -ms-transition: border-color ease 0.28s;
    -moz-transition: border-color ease 0.28s;
    -o-transition: border-color ease 0.28s;
    transition: border-color ease 0.28s;
}

.radiobox .ripple-group .radio-on {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    -o-transition: all 0s;
    -ms-transition: all 0s;
    transition: all 0s;
    position: absolute;
    width: 20px;
    height: 20px;
    left: -1px;
    top: -1px;
    border-radius: 100%;
    background-color: #636361;
}

.radiobox .ripple-group .ripple-on::before,
.radiobox .ripple-group .ripple-on::after {
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    transition: all 0s;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    content: '';
    position: absolute;
    display: block;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    opacity: 1;
}

.radiobox .ripple-group .ripple-on::before {
    background-color: rgba(0, 0, 0, 0.2);
}

.radiobox .ripple-group .ripple-on::after {
    background-color: rgba(0, 0, 0, 0.7);
}

.radiobox label {
    width: auto;
}


/*if radio disable*/

.radiobox input:disabled~.ripple-group {
    background: #b6b6b6;
    opacity: 0.3;
    pointer-events: none;
    border-radius: 100%;
    cursor: not-allowed
}

.radiobox input:disabled~.ripple-group .ripple-on,
.radiobox input:disabled~.ripple-group .radio-off,
.radiobox input:disabled~.ripple-group .radio-one .radiobox .ripple-group::before {
    display: none;
}


/*END RADIO*/


/*custom brose button*/

.ucm-browse {
    width: 56%;
    margin: 0;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    z-index: 850;
}

.ucm-browse .ucmlink {
    background: rgba(0, 0, 0, 0);
}

.browse-group {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin-right: 5px;
    cursor: pointer;
    overflow: hidden;
}

.browse-group input.ucm-upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    width: 100%;
    height: 100%;
}

.browse-group .browse-btn {
    display: inline-block;
    padding: 5px 10px;
    vertical-align: middle;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    cursor: pointer;
}

.browse-group .browse-btn i.ucmicons {
    width: 18px;
    height: 18px;
    margin: 3px 5px 3px 0;
    display: inline-block;
    vertical-align: middle;
}

.gridimg {
    display: block;
    border: 1px solid #ccc;
    width: 80px;
    height: 60px;
    position: relative;
    overflow: hidden;
    margin-top: 10px;
}

.gridimg img {
    max-width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}


/*UCM attachment*/


/*In table grid view  */

.grid-attach-file-preview {
    display: inline-block;
    max-width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


/*In datails page attathment preview  */

.ucm-attach-lists a.ucmvdesc {
    color: #0052a3;
}

.ucm-attach-lists li+li a.ucmvdesc {
    padding-bottom: 0;
}


/*ucm file upload component on edit/ add page  */

.ucm-file-upload .ucm-closeicon {
    width: 20px;
    height: 20px;
    font-size: 12px;
    border: 0px none;
}

.ucm-file-upload li a {
    white-space: nowrap;
    overflow: hidden;
    max-width: 200px;
    text-overflow: ellipsis;
    display: inline-block;
}


/*ucm progress bar */

.ucm-progress {
    margin: 8px auto;
}

.ucm-progress .progress-bar {
    background-color: #838383;
    -webkit-border-radius: 5rem;
    border-radius: 5rem;
    font-size: 0.60rem;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    height: 0.75rem;
    line-height: 0.85rem;
    letter-spacing: 0.1rem;
}


/*Start custom selectbox*/

.ucmdropdown {
    min-width: 100px;
}

.ucmlinkgroup ul li.ucmdropdown {
    min-width: 200px;
}

.ucmdropdown .inputbox {
    width: 100%;
    display: block;
}

.ucm-select {
    display: block;
    width: 100%;
}

.ucm-select select option {
    border: 0 none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #f6f6f6;
    margin: 0px auto;
    text-align: left;
    outline: none;
}

.ucm-select select option:hover,
.ucm-select select option:focus {
    cursor: pointer;
    background: #bdbdbd;
}

.ucm-select select option:checked {
    background: #bdbdbd;
}


/* Select arrow styling */

.ucm-select select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23cccccc' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: right 0.4rem center;
}

.selecteddata {
    padding: 7px 10px;
    display: block;
    width: 100%;
    min-height: 34px;
    font-size: 12px;
}


/* * for customize dynamic saerch modal */

.form-double .form-group.select-withbtn {
    -ms-display: flex;
    display: flex;
    -ms-align-items: center;
    align-items: center;
}

.form-double .form-group.select-withbtn button {
    /*padding-top: 9px;
     padding-bottom: 9px;
    */
    margin: 0 10px 0;
}

.form-double .form-group.select-withbtn button+button {
    margin-left: 0;
}

@media screen and (min-width: 992px) {
    .form-double .form-group.select-withbtn .inputbox,
    .form-double .form-group.select-withbtn campaign {
        width: 74%;
    }
}

@media screen and (min-width: 768px) {
    .form-double .form-group.select-withbtn .inputbox,
    form-double .form-group.select-withbtn campaign {
        width: 70%;
    }
}

@media screen and (max-width: 479px) {
    .form-double .form-group.select-withbtn {
        -ms-flex-flow: row;
        flex-flow: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .form-double .form-group.select-withbtn .inputbox,
    form-double .form-group.select-withbtn campaign {
        width: 100%;
        margin-bottom: 10px;
    }
    .form-double .form-group.select-withbtn button {
        margin-left: 0;
    }
}

@media screen and (min-width: 480px) and (max-width: 767px) {
    .form-double .form-group.select-withbtn .inputbox,
    form-double .form-group.select-withbtn campaign {
        width: 40%;
    }
    .form-double .form-group.select-withbtn label {
        width: 40%;
        margin: 0px 10px 0 0;
        text-align: right;
    }
}

@media screen and (min-width: 768px) and (max-width:1199px) {
    .ucmdropdown .inputbox.w40 {
        width: 40%;
    }
}


/*End Select box*/


/*Start custom input box*/

.inputbox {
    padding: 1px;
    position: relative;
    background: #ccc;
    z-index: 850;
    border-radius: 4px;
    margin: 0;
    display: inline-block;
    vertical-align: middle;
    width: 56%;
    -o-transition: box-shadow .4s, all 0.2s linear;
    -moz-transition: box-shadow .4s, all 0.2s linear;
    -wbkit-transition: box-shadow .4s, all 0.2s linear;
    -ms-transition: box-shadow .4s, all 0.2s linear;
    transition: box-shadow .4s, all 0.2s linear;
}

colorpicker {
    width: 60%;
}

.ucmgrid .gridtable .cardlabel .inputbox {
    width: 98%;
    display: block;
    min-width: 140px;
}

.modal-body .ucmgrid .gridtable .cardlabel .inputbox {
    width: 86%;
}

.inputbox.radiogrp {
    background: none;
}

.inputbox.radiogrp:hover,
.inputbox.radiogrp:focus {
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}

.inputbox.radiogrp .radiobox {
    margin-bottom: 4px;
}

.inputbox input,
.inputbox .ucm-select select,
.inputbox textarea,
.inputbox .multipleSelect select {
    color: #333;
    box-sizing: border-box;
    font-size: 12px;
    outline: none;
    border: none;
    z-index: 2;
    padding: 7px;
    border-radius: 4px;
    line-height: 20px;
    display: block;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    min-height: 34px;
}

input:-moz-read-only,
.form-control:disabled,
.form-control[readonly] {
    background-color: #ccc;
}

input:read-only,
.form-control:disabled,
.form-control[readonly] {
    background-color: #ccc;
}


/*system info icon  */

.inputbox.ucm-noborder {
    background: none;
}

.inputbox.ucm-noborder:hover {
    box-shadow: 0px 0px 0px none;
}

.inputbox.inputinfo input {
    padding-right: 35px;
}

.inputbox .drawborder {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 0%;
    height: 0%;
    background: rgba(0, 0, 0, 0.3);
    z-index: -1;
    -o-transition: height 0.3s, width 0.3s 0.1s;
    -ms-transition: height 0.3s, width 0.3s 0.1s;
    -moz-transition: height 0.3s, width 0.3s 0.1s;
    -webkit-transition: height 0.3s, width 0.3s 0.1s;
    transition: height 0.3s, width 0.3s 0.1s;
    border-radius: 4px;
}

.inputbox input:focus,
.inputbox .ucm-select select:focus,
.inputbox textarea:focus,
.inputbox .multipleSelect select:focus {
    background-color: #ffffff;
    color: #333;
}

.inputbox input:focus~.drawborder,
.inputbox .ucm-select select:focus~.drawborder,
.inputbox textarea:focus~.drawborder,
.inputbox .multipleSelect select:focus~.drawborder {
    width: 100%;
    height: 100%;
}

.inputbox:hover {
    -o-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
}


/* field disable, readonly */

.inputbox input:read-only.inputbox input[type="button"]:read-only,
.inputbox input[type="color"]:read-only,
.inputbox input[type="date"]:read-only,
.inputbox input[type="datetime-local"]:read-only,
.inputbox input[type="email"]:read-only,
.inputbox input[type="file"]:read-only,
.inputbox input[type="text"]:read-only,
.inputbox input[type="month"]:read-only,
.inputbox input[type="number"]:read-only,
.inputbox input[type="image"]:read-only,
.inputbox input[type="password"]:read-only,
.inputbox input[type="range"]:read-only,
.inputbox input[type="reset"]:read-only,
.inputbox input[type="search"]:read-only,
.inputbox input[type="submit"]:read-only,
.inputbox input[type="tel"]:read-only,
.inputbox input[type="text"]:read-only,
.inputbox input[type="time"]:read-only,
.inputbox input[type="url"]:read-only,
.inputbox input[type="week"]:read-only {
    background: #ccc;
    color: #888;
    cursor: not-allowed;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


/* * read only focus */

.inputbox input[type="button"]:read-only:focus,
.inputbox input[type="color"]:read-only:focus,
.inputbox input[type="date"]:read-only:focus,
.inputbox input[type="datetime-local"]:read-only:focus,
.inputbox input[type="email"]:read-only:focus,
.inputbox input[type="file"]:read-only:focus,
.inputbox input[type="text"]:read-only:focus,
.inputbox input[type="month"]:read-only:focus,
.inputbox input[type="number"]:read-only:focus,
.inputbox input[type="image"]:read-only:focus,
.inputbox input[type="password"]:read-only:focus,
.inputbox input[type="range"]:read-only:focus,
.inputbox input[type="reset"]:read-only:focus,
.inputbox input[type="search"]:read-only:focus,
.inputbox input[type="submit"]:read-only:focus,
.inputbox input[type="tel"]:read-only:focus,
.inputbox input[type="text"]:read-only:focus,
.inputbox input[type="time"]:read-only:focus,
.inputbox input[type="url"]:read-only:focus,
.inputbox input[type="week"]:read-only:focus {
    background: #ccc;
    cursor: default;
    color: #888;
}


/* * disable */

.inputbox input[type="button"]:disabled,
.inputbox input[type="color"]:disabled,
.inputbox input[type="date"]:disabled,
.inputbox input[type="datetime-local"]:disabled,
.inputbox input[type="email"]:disabled,
.inputbox input[type="file"]:disabled,
.inputbox input[type="text"]:disabled,
.inputbox input[type="month"]:disabled,
.inputbox input[type="number"]:disabled,
.inputbox input[type="image"]:disabled,
.inputbox input[type="password"]:disabled,
.inputbox input[type="range"]:disabled,
.inputbox input[type="reset"]:disabled,
.inputbox input[type="search"]:disabled,
.inputbox input[type="submit"]:disabled,
.inputbox input[type="tel"]:disabled,
.inputbox input[type="text"]:disabled,
.inputbox input[type="time"]:disabled,
.inputbox input[type="url"]:disabled,
.inputbox input[type="week"]:disabled,
.inputbox.disabled,
.inputbox.disabled input,
.inputbox.disabled textarea {
    background: #ccc;
    color: #888;
    cursor: not-allowed;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.inputbox textarea:read-only {
    background: #ccc;
    color: #888;
    cursor: not-allowed;
    overflow: hidden;
}

.inputbox.disabled {
    padding: 0px;
}


/*inputbox with date icon*/

.inputbox.ucmdateicon {
    position: relative;
    z-index: 1031;
}


/* .col-12+.col-12 .form-group .inputbox.ucmdateicon {
    z-index: 1032;
} */

.inputbox.ucmdateicon input {
    cursor: text;
}

.inputbox.ucmdateicon::before {
    content: '';
    position: absolute;
    right: 8px;
    top: 10px;
    width: 18px;
    height: 18px;
    display: block;
    background-repeat: no-repeat;
    z-index: 2;
}

.datetimepickericon {
    background: #eeeeee;
    right: 1px;
    top: 1px;
    border-left: 1px solid #b6b6b6;
    bottom: 0px;
    height: 34px;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    position: absolute;
    z-index: 4;
    width: 35px;
}

.datetimepickericon::after {
    content: '';
    cursor: pointer;
    width: 24px;
    height: 24px;
    background-position: center center;
    background-repeat: no-repeat;
    display: block;
    margin: 4px auto 0;
}

.ucm-number {
    display: -ms-flexbox;
    display: flex;
    position: relative;
}

.ucm-number input[type=number]::-webkit-inner-spin-button,
.ucm-number input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}

.ucm-number .number-nav {
    height: 100%;
    z-index: 851;
}

.ucm-number .number-button {
    position: relative;
    cursor: pointer;
    border-left: 1px solid #cccccc;
    width: 26px;
    text-align: center;
    color: #333333;
    font-size: 14px;
    line-height: 1.3;
    right: 1px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    height: calc(50% - 1px);
    background: #fff;
}

.ucm-number .number-button.number-up {
    position: absolute;
    top: 1px;
    border-bottom: 1px solid #cccccc;
    border-top-right-radius: 4px;
}

.ucm-number .number-button.number-down {
    position: absolute;
    bottom: 1px;
    border-bottom-right-radius: 4px;
}

input.colorpickerbox {
    right: 1px;
    top: 1px;
    border-left: 1px solid #b6b6b6;
    bottom: 0px;
    height: 34px;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    position: absolute;
    z-index: 4;
    width: 35px;
    font-size: 0;
}

.colorshowbox {
    height: 23px;
    width: 100px;
    -ms-display: flex;
    vertical-align: middle;
    border: 1px solid #ccc;
    display: flex;
    background: #fff;
}

.colorshowbox .showcolorevalue {
    width: 20px;
    border-right: 1px solid #ccc;
    margin-right: 6px;
}

.colorshowbox span {
    font-size: 12px;
    line-height: 18px;
}

colorpicker .inputbox {
    z-index: 851;
    width: 100%;
}

.lookups {
    width: 56%;
    display: inline-block;
    position: relative;
    z-index: 1031;
}

.lookups .error.newzindex {
    z-index: 1033;
    bottom: 65px;
}

#dynamicModal .lookups {
    width: 100%;
    display: block;
}

.lookups.zindex {
    z-index: inherit;
}

.lookups .input-with-ucmlink {
    width: 100%;
    display: block;
}

.lookups .input-with-ucmlink .ucmlinkgroup .ucmlink:first-of-type {
    padding-left: 5px;
}

.input-with-ucmlink label span {
    display: block;
}


/* * UCM switch */

.switch-loop-area {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.ucm-switch-loop {
    min-width: 16.666667%;
    margin: 0 7px 7px 7px;
}

.ucm-switch-loop:first-child {
    margin-left: 0px;
}

.ucm-switch-loop+.ucm-switch-loop {
    margin-left: 0px;
}

.ucm-switch-loop label {
    width: auto;
}

.ucm-switch-area {
    display: inline-block;
    vertical-align: middle;
    padding: 10px;
}

.ucm-switch-area label {
    width: auto;
}

.ucm-switchtoggle~span {
    display: inline-block;
    position: relative;
    outline: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    cursor: pointer;
}

.ucm-switchtoggle {
    position: absolute;
    opacity: 0;
    z-index: 1;
    width: 42px;
    height: 22px;
}

input.ucm-switchtoggle:checked~span {
    background-color: #616161;
}

input.ucm-switchtoggle~span {
    padding: 2px;
    width: 40px;
    height: 20px;
    background-color: #dddddd;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    -ms-border-radius: 60px;
    -o-border-radius: 60px;
    border-radius: 20px;
    -webkit-transition: background 0.4s;
    -moz-transition: background 0.4s;
    -o-transition: background 0.4s;
    transition: background 0.4s;
}

input.ucm-switchtoggle~span::before,
input.ucm-switchtoggle~span::after {
    display: block;
    position: absolute;
    content: "";
}

input.ucm-switchtoggle~span::before {
    top: 2px;
    left: 2px;
    bottom: 2px;
    right: 2px;
    background-color: #fff;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    -ms-border-radius: 60px;
    -o-border-radius: 60px;
    border-radius: 60px;
    -webkit-transition: background 0.4s;
    -moz-transition: background 0.4s;
    -o-transition: background 0.4s;
    transition: background 0.4s;
}

input.ucm-switchtoggle~span::after {
    top: 4px;
    left: 4px;
    bottom: 4px;
    width: 12px;
    background-color: #dddddd;
    -webkit-border-radius: 52px;
    -moz-border-radius: 52px;
    -ms-border-radius: 52px;
    -o-border-radius: 52px;
    border-radius: 52px;
    -webkit-transition: margin 0.4s, background 0.4s;
    -moz-transition: margin 0.4s, background 0.4s;
    -o-transition: margin 0.4s, background 0.4s;
    transition: margin 0.4s, background 0.4s;
}

input.ucm-switchtoggle:checked~span::after {
    margin-left: 20px;
    background-color: #616161;
}


/*full-width column*/

.ucm-form-full label {
    width: 20%;
}

.ucm-form-full .inputbox {
    width: 77.955%;
}


/*Ucm signle label single input*/

.ucm-form-block label {
    width: 100%;
    text-align: left;
    margin-bottom: 5px;
}

.ucm-form-block .inputbox {
    width: 100%;
}


/*@media screen and (min-width:768px) and (max-width:991px) {
     .form-group label {
         width: 25%;
         text-align: left;
    }
     .form-group .inputbox, .form-group .input-with-ucmlink, .form-group .lookups {
         width: 70%;
    }
     .form-group .lookups .input-with-ucmlink {
         width: 100%;
    }
     .form-group .input-with-ucmlink .inputbox {
         width: 75%;
    }
     .form-group .lookups .input-with-ucmlink .inputbox {
         width: 63%;
    }
     .form-group .input-with-ucmlink .ucmlinkgroup {
         display: inline-block;
         margin: 0px;
         vertical-align: middle;
    }
     .form-double .ucm-ml-xl {
         margin-left: 0% 
    }
     .form-double .ucm-ml-sm {
         margin-left: 0%;
    }
}
*/


/*form 767*/

.form-double label.valigntop {
    vertical-align: top;
}

@media screen and (max-width:575px) {
    .sendemail.modal-body .inputbox {
        width: auto !important;
    }
}

@media screen and (max-width:991px) {
    .modal-body .ucmgrid .gridtable .cardlabel .inputbox,
    .sendemail.modal-body .inputbox,
    .modal-body .inputbox,
    .f-width .inputbox,
    .f-width label,
    .form-double label,
    .inputbox,
    .ucmtimepicker,
    .ucm-select,
    .form-double .form-group .ucm-select,
    .modal-body .cardlabel .inputbox,
    .ucm-form-full label,
    .ucm-form-full .inputbox,
    colorpicker {
        display: block;
        width: 100%;
    }
    .inputinfo .ucm-info-button {
        position: absolute;
        right: 13px;
        top: 0;
    }
    .inputinfo .input-with-ucmlink {
        width: 100%;
    }
    .input-with-ucmlink .inputbox+.inputbox {
        margin-top: 0.3125rem;
    }
    .form-double label {
        margin-bottom: 10px;
    }
    .form-double .form-group {
        margin-bottom: 10px;
        display: block;
    }
    .input-group.image-preview {
        width: 100% !important;
        display: table;
    }
    .image-preview .input-group-btn {
        white-space: inherit;
        display: table-cell;
    }
    .form-double .radiobox label {
        width: 90%;
        margin: 0;
        display: inline-block;
        vertical-align: middle;
    }
    .lookups {
        display: block;
        width: 100%;
        max-width: 100%;
    }
    .form-double .ucm-ml-xl,
    .form-double .ucm-ml-sm {
        margin-left: 0%
    }
    /*special modification*/
    .form-group .lookups .input-with-ucmlink .inputbox.w40,
    .form-group .lookups .input-with-ucmlink .inputbox.w25 {
        width: 49%;
        display: inline-block;
        vertical-align: middle;
        margin: 0;
    }
}


/*max991*/

@media screen and (min-width:992px) and (max-width:1199px) {
    [ng-reflect-ng-switch="lookup"] .form-group label {
        vertical-align: top;
        margin-top: 0.65rem;
    }
    /* [ng-reflect-ng-switch="lookup"] .input-with-ucmlink .inputbox + .inputbox {
         margin-top: 0.65rem;
    }
    */
    .form-group .lookups .input-with-ucmlink .inputbox.w40,
    .form-group .lookups .input-with-ucmlink .inputbox.w25 {
        width: 49%;
        display: inline-block;
        vertical-align: middle;
        margin: 0;
    }
    /*modal inputbox.w40*/
    .modal-body .inputbox.w40 {
        width: 56%;
    }
}


/*max 1199*/


/*table select group*/

.modal-content .modal-body .ucmgrid button.ucmlink {
    color: #00adff !important;
    margin: 0;
}

.tableselectgroup {
    display: inline-block;
    position: relative;
    z-index: 841;
}

.tableselectgroup label.control {
    margin: 5px 0 0 0;
    vertical-align: top;
    padding: 0 0 0 15px;
}

.selectallcheck label.control {
    margin: 0;
    vertical-align: top;
    padding: 0 3px 0 15px;
}

.tableselectgroup .control-indicator,
.selectallcheck .control-indicator {
    width: 15px;
    height: 15px;
}

.tableselectgroup .control-indicator::after,
.selectallcheck .control-indicator::after {
    font-size: 8px;
    width: 14px;
    line-height: 13px;
    left: -0.1em;
    position: absolute;
}

.tableselectgroup.ucmlinkgroup {
    display: inline-block;
    vertical-align: middle;
    padding: 0px;
    margin: 0px;
}

.tableselectgroup.ucmlinkgroup ul {
    margin: 0px;
    padding: 0px;
}

.ucmgrid .gridtable td div.cardlabel .tableselectgroup.ucmlinkgroup .ucmlink {
    margin: 0;
}

.ucmcontent .ucmgrid .gridtable td div.cardlabel .tableselectgroup.ucmlinkgroup .ucmlink a {
    background-color: rgba(0, 0, 0, 0) !important;
    color: #0052a3 !important;
}

.ucmgrid .gridtable td div.cardlabel .tableselectgroup.ucmlinkgroup .ucmlink:first-of-type,
.ucmgrid .gridtable td.ifdynamic .tableselectgroup.ucmlinkgroup .ucmlink:first-of-type {
    padding-right: 7px;
    padding-left: 0px;
}

.tableselectgroup .ucmlink i.ucmicons {
    width: 17px;
    height: 17px;
    opacity: 0.7;
    cursor: pointer;
    -o-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -webkit-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
}

.tableselectgroup .ucmlink:hover i.ucmicons {
    opacity: 1;
}

.tableselectgroup .ucmlink {
    margin: 0px;
}

.ucmlinkgroup ul.mobilelinks,
.ucmlinkgroup ul.pull-right {
    display: inline-block;
    vertical-align: middle;
}

.ucmlinkgroup .filter i {
    width: 18px;
    height: 18px;
    float: left;
    margin: 1px 4px 0 0;
}

.ucmlinkgroup button.filter {
    background: none;
    border: 0px none;
    font-size: 16px;
    line-height: 22px;
    font-family: 'open_sanslight', 'Helvetica Neue', Arial, sans-serif;
    display: inline-block;
    vertical-align: bottom;
    margin: 13px 0 0;
    padding: 0;
}


/*modal filter*/

.modal-filter .ucmlink {
    background: none;
    margin: 3px auto;
    display: block;
    text-align: center;
    padding: 0px;
}

.modal-filter .ucmlink a {
    background-color: #7f7f7f;
    border-radius: 3px;
    font-size: 13px;
    line-height: 20px;
    color: #fff;
    border: 0px none;
    padding: 8px 12px;
    text-transform: uppercase;
    display: block;
}

.modal-filter .ucmlink a:hover,
.modal-filter .ucmlink a:focus {
    color: #fff;
    background-color: #333;
    border-color: #333;
}


/*input-with-ucm-link*/

@media screen and (max-width:767px) {
    .input-with-ucmlink .ucmlinkgroup {
        margin: 0px auto;
    }
    .form-double .input-group .input-group-addon {
        border-radius: 0px;
    }
    .form-group .inputbox.w70 {
        width: 100% !important;
    }
    .tableselectgroup.ucmlinkgroup {
        padding: 6px;
    }
}

@media screen and (min-width:768px) {
    .input-with-ucmlink {
        width: 56%;
        display: inline-block;
        vertical-align: middle;
    }
    .input-with-ucmlink .inputbox {
        width: 100%;
    }
    .ucmlinkgroup button.filter {
        display: none;
    }
    /*for synamic form*/
    .ucmgrid .gridtable td div.cardlabel .input-with-ucmlink .inputbox {
        width: 68%;
    }
    .ucmgrid .gridtable td div.cardlabel .input-with-ucmlink .ucmlinkgroup {
        display: inline-block;
        vertical-align: middle;
    }
    .input-with-ucmlink .ucmlinkgroup .ucmlink:first-of-type {
        background: none;
    }
}

.input-with-ucmlink .ucmlinkgroup .ucmlink {
    margin: 0;
    padding: 0 5px 0 7px;
    border-radius: 0px;
}

.input-with-ucmlink .ucmlink button,
.input-with-ucmlink .ucmlink a {
    background: none;
    color: #0052a3 !important;
    padding: 0;
    border: 0px none;
}

@media screen and (min-width:1200px) {
    .input-with-ucmlink .ucmlinkgroup {
        display: inline-block;
        margin: 0 auto;
    }
    .input-with-ucmlink .inputbox {
        width: 66%;
    }
    .lookups .input-with-ucmlink .inputbox {
        width: 68%;
    }
    .inputinfo .input-with-ucmlink .inputbox {
        width: 100%;
    }
}

@media screen and (min-width:1920px) {
    .input-with-ucmlink .ucmlinkgroup {
        display: inline-block;
        margin: 0 auto;
    }
    .input-with-ucmlink .inputbox {
        width: 80%;
    }
    .image-preview-filename {
        width: 79%;
    }
}


/*data table sorting*/

.sorting th {
    position: relative;
}

.ucmgrid .gridtable tr.sorting th a {
    -webkit-align-items: center;
    display: -webkit-flex;
    display: flex;
    align-items: center;
}

.ucmgrid .gridtable tr.sorting th a {
    /*width: calc(100% - 5px);
     Edited by Piyal */
    color: #333333;
}

.sorting th i {
    display: block;
    cursor: pointer;
    width: 11px;
    height: 11px;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.8;
    /*margin: 0 0 0 0.55rem;
     below added by piyal*/
    margin: 0 0 0 4px;
}


/*panel body ucm link*/

.panel-body .ucmlink input.form-control {
    width: 100%;
    max-width: 100%;
}


/*ucm date picker*/

@media screen and (min-width:768px) {
    .form-double .input-group.date {
        width: 56%;
    }
    .form-double .input-group .input-group-addon {
        width: 20px;
        border-radius: 0px;
    }
}


/*ucm broken page*/

.broken-page {
    position: fixed;
    left: 57%;
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -o-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    width: 57%;
}

.sidebar-collapse .broken-page {
    left: 51%;
}

.broken-page img {
    margin-left: auto;
    margin-right: auto;
    max-width: 150px;
    display: block;
}

.broken-page h1 {
    font-size: 3rem;
    margin: 30px auto;
    font-weight: 100;
    display: block;
    font-family: 'open_sanslight', 'Helvetica Neue', Arial, sans-serif;
}

.broken-page h1 small {
    display: block;
    font-size: 18px;
    line-height: 26px;
    margin-top: 10px;
    color: #333;
}


/*ucm assign tree view*/

.assisn-tree-view {
    display: block;
    padding: 10px;
}

.ass-tree-loop {
    display: block;
    margin: 5px auto;
}

.parentastree {
    display: block;
    font-size: 14px;
    line-height: 20px;
    text-transform: capitalize;
    color: #333;
    cursor: pointer;
    position: relative;
    padding: 0;
}

.ucmicons-tree-line {
    background-image: url("../img/nested-line.png");
    background-repeat: no-repeat;
    height: 20px;
    display: block;
    width: 20px;
    background-position: center left;
    margin-right: 5px;
}

.asn-tree-lists li i.ucmicons.md {
    width: 15px;
    height: 15px;
    margin: 0 0 0 10px;
}

.asn-tree-lists li {
    list-style-type: none;
    position: relative;
    margin: 0;
    padding: 0;
    display: -ms-flexbox;
    display: flex;
    align-items: flex-start;
}

.asn-tree-lists .ctree--partnergroup li {
    padding: 0 0 0 5px;
}


/* 
.asn-tree-lists li i.ucmicons.common {
    width: 20px;
    height: 20px;
    margin: 0;
} */

.modal-content .modal-body .asn-tree-lists ul li .custom-checkbox {
    margin: 0;
    padding: 0;
}

.modal-content .modal-body .asn-tree-lists ul li .custom-checkbox label {
    top: -11px;
}


/*
* fixed for look up
*/

.asn-tree-lists .ctree__node-link span {
    color: #333;
    display: block;
    position: relative;
    padding: 0;
    background: none;
    border: 0px none;
    text-align: left;
    margin: 0 0 0 5px;
}

.asn-tree-lists .ctree__node-ul {
    padding: 0px 0 0 15px;
}

.asn-tree-lists .ctree__node-list::before,
.asn-tree-lists .ctree__node-list::after {
    left: -5px;
}

.asn-tree-lists .ctree--optiontype .ctree__node-list::after {
    width: 5px;
}

.asn-tree-lists {
    margin: 10px 0;
}

.asn-tree-lists .ctree__parentlist--active {
    display: flex;
    align-items: flex-start;
}

.asn-tree-lists .ctree__parentlist--active+.ctree__parentlist--active {
    margin-top: 0.65rem;
}

.asn-tree-lists .uradio {
    width: 20px;
    padding: 0;
    margin: 0 3px 0 0;
}

.asn-tree-lists .ctree__node-list .uradio {
    margin: 7px 0 0 4px;
    z-index: 3;
    background: #fff;
}

.asn-tree-lists .uradio__box {
    width: 20px !important;
    top: 0;
}

.asn-tree-lists>tree>.ctree>.ctree__parentlist--active>.ctree__node {
    padding: 3px 0 0;
}

.asn-tree-lists .ctree__parentlist--active>.ctree__node {
    padding: 0;
    flex: 0 0 90%;
    max-width: 90%;
}

.asn-tree-lists .ctree--partnergroup>.ctree__parentlist--active>i.ucmicons {
    margin: 0;
}

.asn-tree-lists .ctree__node-link {
    background: #fff !important;
    display: flex;
    align-items: flex-start;
    width: 100%;
}

.asn-tree-lists .ctree__node-link span {
    color: #333;
}

.asn-tree-lists .ctree__node-bullet::before {
    margin: 0 5px;
}

.asn-tree-lists .ctree__node-subitem {
    margin-top: 9px;
    flex: 1;
}

.asn-tree-lists>tree>.ctree--partnergroup>.ctree__parentlist--active>.ucheckbox {
    margin: 0;
}


/*
* end modifications
*/

.ucmtreenods .selectedtree {
    color: #00adff;
}

.ucmtreenods .active {
    color: #005d89;
}


/*no image figure*/

.no-image {
    background-image: url(../img/no-image.svg);
    height: 100%;
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.no-image figcaption {
    color: #636361;
    position: absolute;
    left: 50%;
    text-align: center;
    bottom: 15px;
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    text-transform: capitalize;
    font-size: 15px;
    line-height: 21px;
    font-weight: 100;
    font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
}


/*new thumnail view*/


/* Caption Style 4 */

.thumbgrid li {
    display: inline-block;
    width: 22.5%;
    margin: 0px 15px 20px 0;
    vertical-align: top;
    position: relative;
}

.thumbgrid li {
    -webkit-perspective: 1700px;
    -moz-perspective: 1700px;
    perspective: 1700px;
    -webkit-perspective-origin: 0 50%;
    -moz-perspective-origin: 0 50%;
    perspective-origin: 0 50%;
}

.thumbgrid figure {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.thumbgrid figure>div {
    overflow: hidden;
}

.thumbgrid figure img {
    -webkit-transition: -webkit-transform 0.4s;
    -moz-transition: -moz-transform 0.4s;
    transition: transform 0.4s;
    max-width: 100%;
}

.no-touch .thumbgrid figure:hover img,
.thumbgrid figure.cs-hover img {
    -webkit-transform: translateX(25%);
    -moz-transform: translateX(25%);
    -ms-transform: translateX(25%);
    transform: translateX(25%);
}

.thumbgrid figcaption {
    height: 100%;
    width: 50%;
    opacity: 0;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: rotateY(-90deg);
    -moz-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
    -webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
    -moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
    transition: transform 0.4s, opacity 0.1s 0.3s;
    position: absolute;
    top: 0;
    left: 0;
    background: #BBBBBB;
}

.no-touch .thumbgrid figure:hover figcaption,
.thumbgrid figure.cs-hover figcaption {
    opacity: 1;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
    -moz-transition: -moz-transform 0.4s, opacity 0.1s;
    transition: transform 0.4s, opacity 0.1s;
}

.thumbgrid figcaption .ucm-links a {
    display: block;
    color: #333333;
    text-align: center;
    margin: 5px auto;
    font-size: 12px;
    line-height: 18px;
    background: rgba(255, 255, 255, 0.9);
    text-transform: uppercase;
    padding: 1px;
    border-radius: 4px;
}

.thumbgrid figcaption .ucm-links a:hover {
    background: rgba(255, 255, 255, 0.7);
}

.thumbgrid figcaption .ucm-links {
    position: relative;
    padding: 4px 10px;
}

.thumbgrid figcaption .links a {
    display: block;
    margin: 2px auto;
    color: #515151;
    text-align: left;
    border-bottom: 1px solid #e1e1e1;
    padding: 3px 10px;
    font-size: 12px;
    line-height: 18px;
}

.thumbgrid figcaption .links a:hover {
    color: #fff;
}

.thumbgrid figcaption .links a:last-child {
    border-bottom: 0px none;
}

.thumbgrid li p {
    margin: 10px auto;
}

.thumbgrid li p i {
    display: inline-block;
    width: 15px;
    height: 15px;
    vertical-align: middle;
    margin-right: 4px;
}


/*slim Scroll*/

.ucm-scroll-backdrop {
    max-height: 45vh;
    overflow-x: hidden;
    overflow-y: scroll;
}

.componantlists .slimScrollDiv,
.ucmdropablescroll {
    height: auto !important;
}

.ucmdropablescroll {
    max-height: calc(88vh - 200px);
}

.ucmslimscroll,
.ucmdropablescroll {
    padding-right: 8px;
}


/*UCM TABINATION*/

.ucm-tab {
    display: block;
    margin: 0px auto;
    position: relative;
}

.col.tab-list {
    padding: 0px;
}

.min-height-150 {
    min-height: 150px;
}

.ucm-tab .nav-tabs .nav-link {
    -ms-align-items: flex-end;
    align-items: flex-end;
    background: rgba(0, 0, 0, 0);
    color: #636361;
    font-size: 13px;
    line-height: 18px;
    padding: 4px 4px 8px 4px;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    border-radius: 0px;
    margin: 0 5px -2px 0;
    border-bottom: 0px none;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
}

.ucm-tab .nav-tabs .nav-link::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: 100%;
    bottom: 0;
    background: #0052a3;
    height: 2px;
    -webkit-transition-property: right;
    transition-property: right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.ucm-tab .nav-tabs .nav-link:hover::before,
.ucm-tab .nav-tabs .nav-link:focus::before,
.ucm-tab .nav-tabs .nav-link.active::before {
    right: 0;
}

.ucm-tab .nav-tabs .nav-link:focus,
.ucm-tab .nav-tabs .nav-link:hover,
.ucm-tab a:hover {
    background-color: rgba(0, 0, 0, 0);
    color: #0052a3;
    border-color: rgba(0, 0, 0, 0);
}

.ucm-tab .nav-tabs .nav-item.show .nav-link,
.ucm-tab .nav-tabs .nav-link.active {
    background-color: #fff;
    border-color: rgba(0, 0, 0, 0);
    border-radius: 0px;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    color: #0052a3;
}

.ucm-tab .nav-tabs {
    border-bottom: 2px solid #d6d6d6;
}

.ucm-tab .tab-content {
    background: #fff;
    display: block;
    border-top: 0px none;
    padding: 10px 0;
}

.ucm-tab .tab-content .heading {
    display: block;
    background: #EDEDED;
    color: #5d5d5d;
    font-size: 16px;
    line-height: 22px;
    padding: 6px 10px;
}

.ucm-tab .tab-content .subheading {
    font-size: 15px;
    line-height: 22px;
    color: #404040;
    margin-bottom: 5px;
}

.ucm-tab .tab-content p {
    font-size: 12px;
    line-height: 23px;
    color: #7c7c7c;
}

.ucm-tab .nav-tabs .nav-link.disabled::before {
    background: none;
}

.ucm-tab .nav-tabs .nav-link.disabled,
.ucm-tab .nav-tabs .nav-link.disabled.active,
.ucm-tab .nav-tabs .nav-link.disabled:hover,
.ucm-tab .nav-tabs .nav-link.disabled:focus {
    color: #ccc;
    background: none;
    border-color: rgba(0, 0, 0, 0);
    cursor: not-allowed;
}

.ucm-tab #nav-tab-mob.nav-tabs-mob a.nav-link {
    display: none;
}

.ucm-tab #nav-tab-mob.nav-tabs-mob a.nav-link.active {
    display: block;
    background: #efefef;
    color: #636361;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
}

.ucm-tab #nav-tab-mob.nav-tabs-mob a.nav-link.active:after {
    content: '';
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 11px solid #9c9c9c;
    float: right;
    margin-top: 5px;
}

.ucm-tab #nav-tab-mob.viewfulltab {
    position: absolute;
    display: block;
    width: 100%;
    z-index: 1001;
    border-radius: 6px;
    overflow: hidden;
}

.ucm-tab #nav-tab-mob.viewfulltab a.nav-link {
    border-bottom: 1px solid #fff;
    background: #efefef;
    color: #333333;
}

.ucm-tab #nav-tab-mob.viewfulltab a.nav-link:last-child {
    border-bottom: none;
}

.ucm-tab #nav-tab-mob.viewfulltab a.nav-link.active {
    border-bottom: 1px solid #fff;
    background: #ffffff;
    color: #0052a3;
}

.viewfulltab-bg {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}


/*@media screen and (min-width:768px) {
     .ucm-tab .panel-heading {
         display: none;
    }
     .ucm-tab .panel {
         border: none;
         box-shadow: none;
    }
     .ucm-tab .panel-collapse {
         height: auto;
    }
     .ucm-tab .panel-collapse.collapse {
         display: block;
    }
}
 @media screen and (max-width:767px) {
     .ucm-tab .tab-content .tab-pane {
         display: block;
         opacity: 1;
    }
     .ucm-tab .nav-tabs {
         display: none;
    }
     .ucm-tab .panel-title a {
         display: block;
    }
     .ucm-tab .panel {
         margin: 0;
         box-shadow: none;
         border-radius: 0;
         margin-top: -2px;
    }
     .ucm-tab .tab-pane:first-child .panel {
         border-radius: 5px 5px 0 0;
    }
     .ucm-tab .tab-pane:last-child .panel {
         border-radius: 0 0 5px 5px;
    }
}
*/


/*END tab to accordian 767px */


/*overlay mask in content-wrapper if mobile 767px*/

.overlay-mask {
    position: absolute;
    z-index: 999;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    width: calc(100% - 180px);
}


/*Drag and Drop page*/

.ucm-dragndrop-area {
    display: block;
    width: 100%;
    padding: 0em;
}


/*this should be removed  */

button.toggel-tab {
    position: fixed;
    right: -1px;
    background: #686868;
    border: 0px none;
    padding: 12px;
    border-radius: 35px 0 0 35px;
    top: 160px;
}

button.toggel-tab:hover {
    background: #4f4f4f;
}

button.toggel-tab span {
    font-size: 14px;
    line-height: 20px;
    color: #f2f2f2;
    padding: 0 0 0 20px
}

button.toggel-tab::before {
    content: '';
    position: absolute;
    left: 11px;
    top: 15px;
    width: 15px;
    height: 15px;
    display: block;
    background-repeat: no-repeat;
    z-index: 2;
}

.ripple-button {
    z-index: 10000000;
    position: absolute;
    background: none;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    box-sizing: border-box;
    animation: ripple-button 0.6s linear infinite;
    -ms-animation: ripple-button 0.6s linear infinite;
    left: 0;
    top: 3px;
}

@-webkit-keyframes ripple-button {
    0% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 0 rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1);
    }
    100% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1), 0 0 0 20px rgba(102, 102, 102, 0);
    }
}

@-moz-keyframes ripple-button {
    0% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 0 rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1);
    }
    100% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1), 0 0 0 20px rgba(102, 102, 102, 0);
    }
}

@-o-keyframes ripple-button {
    0% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 0 rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1);
    }
    100% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1), 0 0 0 20px rgba(102, 102, 102, 0);
    }
}

@keyframes ripple-button {
    0% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 0 rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1);
    }
    100% {
        box-shadow: 0 4px 10px rgba(102, 102, 102, 0.1), 0 0 0 5px rgba(102, 102, 102, 0.1), 0 0 0 10px rgba(102, 102, 102, 0.1), 0 0 0 20px rgba(102, 102, 102, 0);
    }
}


/*keyfrapme end*/


/*when toggel display none*/

button.toggel-tab.closecross::before {
    width: 17px;
    height: 17px;
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 14px;
    left: 16px;
    transition: all 0.5s linear;
}

button.toggel-tab.closecross:hover::before {
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

button.toggel-tab.closecross {
    border: 0px none;
    padding: 0;
    width: 38px;
    display: block;
    height: 45px;
    position: fixed;
    margin: 0px;
    background: #636361;
    top: 160px;
}

button.toggel-tab.closecross span {
    display: none;
}

.componantlists .nav-tabs {
    border-bottom: 1px solid #8d8d8d;
    padding: 0;
    margin: 0px;
    background: #636361;
}

.componantlists .nav-tabs li a,
.componantlists .nav-tabs li button {
    margin-right: 0;
    line-height: 18px;
    border: 0px none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 10px 7px;
    cursor: pointer;
    color: #F8F8F8;
    background-color: rgba(0, 0, 0, 0);
    font-size: 13px;
}

.componantlists .nav-tabs li {
    margin-bottom: -2px
}

.componantlists .nav-tabs .nav-link.active,
.componantlists .nav-tabs li.active button,
.componantlists .nav-tabs li.active a:focus,
.componantlists .nav-tabs li.active button:focus,
.componantlists .nav-tabs li.active a:hover,
.componantlists .nav-tabs li.active button:hover,
.componantlists .nav-tabs li a:hover,
.componantlists .nav-tabs li button:hover,
.componantlists .nav-tabs li a:focus,
.componantlists .nav-tabs li button:focus {
    color: #fff;
    background-color: rgba(0, 0, 0, 0);
    border: 0px none;
    border-bottom: 2px solid #e0e0e0;
    border-radius: 0px;
}

.componantlists .nav-tabs li a .tabicon,
.componantlists .nav-tabs li button .tabicon {
    width: 22px;
    height: 22px;
    display: none;
}

@media screen and (max-width:479px) {
    .left-droparea {
        width: 100%;
    }
    .componantlists .nav-tabs li a .tabicon,
    .componantlists .nav-tabs li button .tabicon {
        display: block;
    }
    .componantlists .nav-tabs li a span,
    .componantlists .nav-tabs li button span {
        display: none;
    }
}

.componantlists .tab-content {
    display: block;
    position: relative;
    padding: 3px 10px;
}


/*this should be removed  */

.left-droparea {
    display: block;
    width: 100%;
}

.dropable-block {
    border: 2px dashed #e1e1e1;
    padding: 25px;
    text-align: center;
    min-height: 100px;
    margin-top: 1em;
    display: block;
    position: relative;
    margin: 10px auto;
}

.dropable-block.disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.panel-drop .dropable-block {
    margin: 15px;
}

.left-droparea .left p.abspara,
.wfdropablearea p.abspara {
    color: #878787;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: 0px;
    -o-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-transform: capitalize;
}

.right-tabed-element {
    position: relative;
    z-index: 999;
}

.ucm-dragndrop-area::after {
    clear: both;
    display: table;
}

.slimscroll-wrapper {
    display: block !important;
    width: 99% !important;
}

#GetSlimscroll .slimscroll-wrapper {
    display: block !important;
    width: 100% !important;
    padding-bottom: 100px;
}

#GetSlimscroll {
    padding-right: 3px;
}

.minirside .ucmfilterscroll,
.minirside .componantlists {
    display: none !important;
}

.ucmfilterscroll {
    max-width: 97%;
}

.tab-head {
    display: block;
    margin-bottom: 10px;
}

.wfleftmodules .tab-head h1 {
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 5px;
    color: #fff;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: 1px;
    padding: 6px;
}

.tab-head .form-group {
    margin: 0px;
}

.tab-head .form-group .inputbox {
    width: 100%;
}


/* * ucm-close */

.ucm-closeicon {
    padding: 5px;
    width: 25px;
    height: 25px;
    border: 1px solid #F27724;
    border-radius: 100%;
    background: #ffffff;
    z-index: 1;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    font-size: 14px;
    line-height: 1;
    text-align: center;
    font-style: normal;
    font-weight: normal;
    color: #F27724;
    display: inline-block;
}

.ucm-closeicon i {
    font-weight: normal;
    font-style: normal;
}

.ucm-closeicon:hover {
    background: #F27724;
    color: #fff;
    cursor: pointer;
}

.btn-drag {
    display: block;
    margin: 10px auto;
    width: 100%;
    font-size: 15px;
    line-height: 21px;
    background: #f3f3f3;
    color: #333333;
    padding: 8px 10px;
    -moz-box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.2);
    cursor: move;
    border-radius: 4px;
    -moz-transition: all 0.2s ease-in;
    -webkit-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
    word-wrap: break-word;
}

.btn-drag.active {
    opacity: 0.4;
    cursor: not-allowed;
}

.btn-drag:hover,
.btn-drag:focus {
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.4);
    margin-top: 11px;
}

.btn-drag.disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.btn-drag.disabled:hover,
.btn-drag.disabled:focus {
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
    margin-top: 11px;
}

.left-droparea .target {
    background-color: rgba(0, 0, 0, 0.16);
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.left-droparea .panel-drop {
    margin-bottom: 15px;
}

.left-droparea .hanger {
    position: absolute;
    padding: 5px;
    width: 25px;
    right: 5px;
    top: 5px;
    height: 25px;
    border: 1px solid #F27724;
    border-radius: 100%;
    background: #ffffff;
    z-index: 2;
}

.left-droparea .hanger:hover {
    background: #F27724;
    color: #fff;
}

.left-droparea .icon-trash {
    cursor: pointer;
    color: #F27724;
    font-weight: normal;
    font-style: normal;
    font-size: 14px;
    line-height: 13px;
    display: block;
}

.left-droparea .hanger:hover .icon-trash {
    color: #fff;
}

.left-droparea .panel-drop .panel-heading {
    color: #4d4d4d;
    background-color: #DBDBDB;
    border: 0px none;
    cursor: move;
    text-align: left;
    font-size: 16px;
    line-height: 22px;
    padding: 8px 10px;
    border-radius: 0px;
    min-height: 36px;
    position: relative;
}

.left-droparea .panel-drop {
    position: relative;
    display: block;
    border-radius: 4px;
    border: 1px solid #DBDBDB;
}

.left-droparea .panel-drop .panel-body {
    padding: 15px;
    overflow-x: scroll;
    /*vertical-align: middle;
     max-width: calc(100% - 50px);
     overflow: hidden;
     text-align: left;
     max-height: 60px;
     white-space: nowrap;
     text-overflow: ellipsis;
    */
}

.reports-genarator .left-droparea .panel-drop .form-group .inputbox {
    padding: 1px;
    min-height: inherit;
    cursor: default;
    margin: 0;
}

.reports-genarator .left-droparea .panel-drop .form-group .drop-inner {
    padding: 10px 10px 40px 10px;
    height: 100%;
}

.droppedSelected {
    border: 1px solid #F27724 !important;
    padding: 0px;
}

.left-droparea .panel-drop .form-group label {
    cursor: move;
    font-weight: normal;
    margin-right: 10px;
    text-align: left;
    display: block;
    width: 100%;
}

.left-droparea .panel-drop .form-group .inputbox {
    width: 100%;
    cursor: move;
    padding: 8px;
    margin: 12px 0 0;
    background: #dadada;
    color: #8d8d8d;
    min-height: 36px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.left-droparea .panel-drop .form-group .drop-inner,
.ucm-dragable {
    border: 1px dashed #333333;
    position: relative;
    box-sizing: border-box;
    padding: 8px;
    border-radius: 4px;
}

.ucm-dragable {
    cursor: move;
    background: #f2f2f2;
    border: 2px dashed #ddd;
}

.ucm-dragable .ucm-drag-inner {
    cursor: move;
}

.left-droparea .panel-drop .form-group .drop-inner:hover,
.ucm-dragable:hover {
    background: #eeeeee;
}

.droppedSelected.form-group {
    padding: 15px;
    height: auto !important;
}


/*Report layout Builder system user page*/

.reports-genarator .left-droparea .panel-drop .panel-body {
    overflow: hidden;
    max-height: inherit;
}

.reports-genarator .left-droparea h1 {
    font-size: 18px;
    line-height: 26px;
    color: #333;
}

.reports-genarator .report-rpanel {
    width: 23%;
    display: block;
    position: fixed;
    top: 8.25rem;
    right: 0;
    background: #A8A8A8;
    height: 100%;
    padding: 0.5rem;
}

.reports-genarator .report-rpanel h1 {
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 5px;
    color: #fff;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: 1px;
}

.reports-genarator .report-rpanel i.ucmicons {
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
    width: 27px;
    height: 27px;
}

.reports-genarator .report-rpanel span {
    display: inline-block;
    vertical-align: middle;
}

.reports-genarator .report-rpanel .ucmdropablescroll {
    padding: 0px;
}

.resettings {
    background: none;
    border: 0px none;
    position: absolute;
    top: 5px;
    right: 30px;
}

.resettings i {
    width: 23px;
    height: 23px;
    opacity: 0.5
}

.resettings i:hover {
    opacity: 1;
}

.select-attr-area {
    display: block;
    margin-bottom: 15px;
}

.select-attr-area button.add-attr {
    display: block;
    margin: 0;
    padding: 5px 15px;
    background: #eaeaea;
    border: 0px none;
    width: 20%;
    float: left;
    min-height: 50px;
    text-align: left;
    color: #7C7C7C;
    margin-bottom: 2px;
    border-right: 2px solid #fff;
    font-size: 13px;
    line-height: 20px;
    -o-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    border-radius: 4px;
    position: relative;
}

.select-attr-area button.add-attr:hover,
.actionflow-btn:hover,
.actionflow-btn:focus,
.select-attr-area button.add-attr:focus {
    background: #d8d8d8;
    color: #2d2d2d;
}

.select-attr-area button:disabled,
.actionflow-btn:disabled {
    cursor: not-allowed;
}

.select-attr-area button:disabled:hover,
.actionflow-btn:disabled:hover {
    background: #eaeaea;
    color: #7C7C7C;
}

.select-attr-area button.add-attr strong {
    display: inline-block;
    font-weight: normal;
    width: 83%;
    vertical-align: middle;
    color: #333;
}

.actionflow-btn {
    margin: 0;
    padding: 5px 15px;
    background: #eaeaea;
    border: 0px none;
    flex: 0 0 25%;
    min-height: 50px;
    text-align: left;
    color: #7C7C7C;
    margin-bottom: 3px;
    border-right: 2px solid #fff;
    font-size: 13px;
    line-height: 20px;
    -o-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
    border-radius: 4px;
    position: relative;
}

.actionflow-btn span {
    font-weight: normal;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% - 20px);
    color: #333;
}

.actionflow-btn .attr-icon.ucm-closeicon {
    flex: 0 0 25px;
    float: none;
}

i.switch-icon {
    position: absolute;
    width: 30px;
    display: block;
    top: 50%;
    right: 4px;
}

i.switch-icon span {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background-color: #cecece;
    position: absolute;
    left: 0;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

i.switch-icon span::after,
i.switch-icon span::before {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background-color: #cecece;
    content: '';
    position: absolute;
}

i.switch-icon span::before {
    left: 10px;
}

i.switch-icon span::after {
    left: 20px;
}

.select-attr-area button.add-attr.active:hover i.switch-icon span,
.select-attr-area button.add-attr.active:hover i.switch-icon span::after,
.select-attr-area button.add-attr.active:hover i.switch-icon span::before {
    -webkit-animation: bouncedelay 2s infinite ease-in-out both;
    animation: bouncedelay 2s infinite ease-in-out both;
    background-color: #1db500;
}

.select-attr-area button.add-attr.active:hover i.switch-icon span {
    -webkit-animation-delay: -0.64s;
    animation-delay: -0.64s;
}

.select-attr-area button.add-attr.active:hover i.switch-icon span::before {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

@-webkit-keyframes bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.select-attr-area button.add-attr.active {
    background: #d5d5d5;
    color: #404041;
    cursor: pointer;
}

.select-attr-area button.add-attr.active i.switch-icon span,
.select-attr-area button.add-attr.active i.switch-icon span::after,
.select-attr-area button.add-attr.active i.switch-icon span::before {
    background: #1db500;
}

.select-attr-area button.add-attr.active:hover {
    background: #d5d5d5;
    color: #404041;
}

.attr-icon.ucm-closeicon {
    float: right;
}

.list-trash-add.ucm-closeicon {
    position: absolute;
    top: -10px;
    left: 0px;
    width: 20px;
    height: 20px;
    font-size: 10px;
    font-weight: bold;
}


/* for page select area*/

@media screen and (max-width:479px) {
    .select-attr-area button.add-attr {
        width: 100%;
    }
}

@media screen and (min-width:480px) and (max-width:639px) {
    .select-attr-area button.add-attr {
        width: 49.333%;
    }
}


/*max-width:479px*/

@media screen and (min-width:640px) and (max-width:767px) {
    .select-attr-area button.add-attr {
        width: 49.333%;
    }
}


/*max-width:767px*/

@media screen and (min-width:768px) and (max-width:1023px) {
    .select-attr-area button.add-attr {
        width: 33.333%;
    }
    .export-modal .select-attr-area button.add-attr {
        width: 100%;
    }
}


/*End create layout*/


/*create layout in modal*/

.export-modal .select-attr-area button.add-attr {
    background: #d5d5d5;
    color: #404041;
    cursor: pointer;
    float: none;
    font-size: 12px;
    min-height: 40px;
    border: 0px none;
}

.export-modal .select-attr-area button:disabled {
    cursor: not-allowed;
    background: #eaeaea;
    color: #acacac;
    opacity: 0.7;
}

.export-modal .select-attr-area button:disabled i.switch-icon span,
.export-modal .select-attr-area button:disabled i.switch-icon span::after,
.export-modal .select-attr-area button:disabled i.switch-icon span::before {
    animation: inherit;
    background-color: #b6b6b6;
}

.export-modal button i.ucmicons {
    width: 13px;
    height: 13px;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    float: right;
    margin: 7px 0 0 0;
}

.export-modal button:hover i.ucmicons {
    opacity: 0.7;
}

.export-modal h3,
.modal-body h3 {
    color: #333;
    font-size: 15px;
    line-height: 21px;
    margin-bottom: 15px;
}

.export-modal .select-attr-area {
    display: inline-block;
    margin-bottom: 2px;
    width: 33.333%;
    padding: 0 2px;
    min-height: 40px;
}

@media screen and (max-width:479px) {
    .export-modal .select-attr-area {
        width: 100%;
    }
    .export-modal .select-attr-area button.add-attr {
        width: 100%;
    }
}


/*max-width:479px*/

@media screen and (min-width:480px) and (max-width:767px) {
    .export-modal .select-attr-area {
        width: 49.333%;
    }
    .export-modal .select-attr-area button.add-attr {
        width: 100%;
    }
}

@media screen and (min-width:991px) {
    .export-modal .select-attr-area button.add-attr {
        width: 100%;
    }
}


/*max-width:767px*/


/*export modal button*/

.ucmgrid .gridtable th {
    position: relative;
    background: none !important;
    color: #333333;
}

.gridheader i.closeclose {
    border: 1px solid #F27724;
    width: 22px;
    height: 22px;
    border-radius: 100px;
    position: absolute;
    left: 0px;
    top: -10px;
    background: #F27724;
    transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    cursor: pointer;
    display: none;
}

.gridheader i.closeclose:hover {
    background: #fff;
}

.gridheader i.closeclose:hover::after {
    color: #F27724
}

.gridheader i.closeclose::after {
    content: 'X';
    display: block;
    position: absolute;
    font-size: 12px;
    color: #fff;
    font-weight: normal;
    font-style: normal;
    text-align: center;
    left: 7px;
    line-height: 20px;
}


/* * ucm notification */

.ucm-notice-box {
    position: fixed;
    width: 100%;
    z-index: 999;
    left: 0px;
    right: 0px;
    background: rgba(0, 0, 0, 0.8);
    display: none;
    top: 0;
}

.ucm-notice-box.active {
    display: block;
}

.ucm-noticewrap {
    position: relative;
    padding: 15px;
}

.ucm-noticewrap ul {
    margin: 0px;
    padding: 0px;
}

.ucm-noticewrap ul li {
    color: #fff;
    list-style-type: none;
}

.ucm-noticewrap ul li i.ucmicons {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    width: 24px;
    height: 24px;
}


/* *Language selection page */

.lang-group {
    position: relative;
    margin: 20px auto;
    display: block;
}

.language-selection .row .col .col-12 {
    border-bottom: 1px solid #f1f1f1;
}

.language-selection .row:last-child .col .col-12 {
    border: 0px none;
}

.lang-group h3 {
    font-family: 'open_sanslight', 'Helvetica Neue', Arial, sans-serif;
    font-size: 17px;
    line-height: 23px;
    margin-top: 10px;
    letter-spacing: 1px;
    margin-left: 10px;
}

.lang-group .lanloop .countryname,
.lang-group .lanloop .languageList {
    z-index: 3;
    position: relative;
}

.lang-group .lanloop {
    position: relative;
}

@media screen and (max-width:479px) {
    .lang-group .lanloop {
        min-width: 100%;
    }
}

@media screen and (min-width:480px) and (max-width:767px) {
    .lang-group .lanloop {
        min-width: 45%;
    }
}

@media screen and (min-width:768px) {
    .lang-group .lanloop {
        min-width: 37%;
    }
}

@media screen and (min-width:992px) {
    .lang-group .lanloop {
        min-width: 30.333%;
    }
}

.lang-group .lanloop {
    display: inline-block;
    vertical-align: middle;
    margin: 10px;
}

.lang-group .lanloop .countryname {
    display: inline-block;
    text-transform: uppercase;
    font-size: 13px;
    line-height: 18px;
    color: #6d6d6d;
    letter-spacing: 1px;
}

.lang-group .lanloop .languageList {
    display: inline-block;
}

.lang-group .lanloop .languageList span {
    color: #ccc;
}

.lang-group .lanloop .languageList a {
    font-size: 13px;
    text-transform: capitalize;
    line-height: 18px;
    cursor: pointer;
}

.lang-group .lanloop .languageList a.active {
    color: #F27724;
}


/* *ucm tooltip */

.ucm-tooltip {
    position: relative;
    display: inline-block;
    z-index: 841 !important;
}

.ucm-tooltip::before {
    background: black;
    border-radius: 4px;
    top: -36px;
    color: #fff;
    content: attr(data-tooltip);
    font-size: 10px;
    left: 0;
    letter-spacing: 1px;
    padding: 4px 10px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    max-height: 100px;
    pointer-events: none;
    line-height: 18px;
}

.cardlabel .ucm-tooltip::before {
    text-transform: none;
}

.ucm-tooltip::after {
    content: '';
    position: absolute;
    display: inline-block;
    width: 0;
    height: 0;
    vertical-align: middle;
    border: 0 solid transparent;
    border-left-width: 6px;
    border-right-width: 6px;
    border-top: 6px solid black;
    top: -10px;
    left: 10px;
}

.ucm-tooltip::after,
.ucm-tooltip::before {
    opacity: 0;
    -o-transition: opacity 0.2s ease-in;
    -moz-transition: opacity 0.2s ease-in;
    -ms-transition: opacity 0.2s ease-in;
    -webkit-transition: opacity 0.2s ease-in;
    transition: opacity 0.2s ease-in;
}

.export-btn.ucm-tooltip::before {
    left: -57px;
}

.export-btn.ucm-tooltip::after {
    left: 5px;
}

.right.ucm-tooltip::before {
    left: -57px;
}

.right.ucm-tooltip::after {
    left: 5px;
}

.ucm-tooltip:hover::after,
.ucm-tooltip:hover::before {
    opacity: 1;
}

.ucm-tooltip.bottom::before {
    bottom: -36px;
    left: -2px;
    top: auto;
}

.ucm-tooltip.bottom::after {
    border-top: 0px none !important;
    border-bottom: 6px solid black;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    top: inherit
}


/* * ucm icon in grid table tooltip */


/* .ucmicons.ucm-tooltip::before {
     left: -13px;
     min-width: 65px;
     bottom: 26px;
}
 .ucmicons.ucm-tooltip::after {
     bottom: 17px;
}
 */


/*ucm multidrop open on focus textbox*/

.ucmm-open-drop {
    display: none;
    position: absolute;
    width: 100%;
    top: 20px;
    z-index: 1032;
    max-width: 60%;
    right: 12px;
    margin-top: 14px;
    border: 1px solid #ccc;
    background: #ffffff;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    border-radius: 0px 0px 4px 4px;
}

.ucmm-open-drop ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    position: relative;
    max-height: 280px;
    overflow: hidden;
}

.ucmm-open-drop:hover ul {
    overflow-y: auto
}

.ucmm-open-drop::before {
    content: '';
    border-bottom: 9px dashed #fff;
    border-right: 9px solid transparent;
    border-left: 9px solid transparent;
    position: absolute;
    top: -8px;
    right: 9px;
    z-index: 2;
}

.ucmm-open-drop::after {
    content: '';
    border-bottom: 10px dashed #ccc;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    position: absolute;
    top: -10px;
    right: 8px;
    z-index: 1;
}

.ucmm-open-drop ul li {
    display: block;
    margin: 0px;
    border-bottom: 1px solid #f1f1f1;
}

.ucmm-open-drop ul li.active {
    background: #f7f7f7;
}

.ucmm-open-drop ul li:hover,
.ucmm-open-drop ul li:focus,
.ucmm-open-drop ul li.active:hover {
    background: #f7f7f7;
}

.ucmm-open-drop ul li .custom-checkbox {
    margin: 0;
    padding: 7px 10px;
    display: block;
}

.ucmm-open-drop ul li .custom-checkbox label {
    width: 100%;
    text-align: left;
    margin: 0px;
}

@media screen and (max-width:767px) {
    .ucmm-open-drop {
        top: 70px;
        max-width: 80%;
        right: 15px;
    }
}


/*max 767px*/

.chartsgroup {
    height: 100%;
}

.ucm-btn-grp {
    display: inline-block;
    vertical-align: middle;
    margin: 0 6px 6px 6px;
}

.ucm-btn-grp+.ucm-btn-grp {
    margin-left: 0px;
    margin-right: 6px;
}


/*report view frontend user pages*/

.ucmrcanvasarea {
    padding: 0;
    margin: 0;
    display: block;
}

.ucmcanvas-size {
    max-width: 400px;
}

.ucmrcanvasarea .container-fluid {
    padding-right: 10px;
    padding-left: 10px;
}

.ucm-report-canvas {
    width: 100% !important;
    max-width: 70vw !important;
    min-width: 16vw !important;
    margin: 0px auto;
}

.barchart,
.linechart,
.piechart,
.topsummary,
.engpercent {
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
    /*margin-left: 15px;
     margin-right: 15px;
    */
    padding: 15px;
}

summary-metrics.col,
pipeline-summary.col {
    padding: 0px;
}

.barchart,
.linechart,
.piechart,
.engpercent {
    background: #ffffff;
    padding: 15px;
    border-radius: 8px;
    position: relative;
}

.topsummary .ucmgrid .gridtable td:last-child,
.topsummary .ucmgrid .gridtable td:last-child .cardlabel,
.topsummary .ucmgrid .gridtable th:last-child {
    text-align: right;
}


/*statuscount*/

.statuscount {
    position: relative;
    height: 100%;
}

#reportcontent .form-group {
    padding-right: 6px;
    padding-left: 6px;
    margin-bottom: 15px;
}

@media screen and (max-width:767px) {
    #reportcontent .form-group {
        padding-left: 15px;
        padding-right: 15px;
    }
    #reportcontent .form-group .row.h-100 {
        margin: 0 -7px;
    }
}

@media screen and (max-width:575px) {
    .row.summarymetrics {
        margin: 0px;
    }
    .summarymetrics .col-12.pr-0 {
        padding: 0px !important;
        margin-bottom: 15px;
    }
    .summarymetrics .col-12 {
        padding: 0px !important;
    }
    .summarymetrics .smloop {
        min-width: 150px;
        padding: 0px !important;
        width: 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        margin-bottom: 15px;
    }
    .summarymetrics .smloop+.smloop {
        padding-left: 0px !important;
    }
    .row.summarymetrics .col-xl-10 .row {
        margin: 0px;
    }
}

@media screen and (min-width:576px) and (max-width:841px) {
    .summarymetrics .smloop,
    .row.summarymetrics .col.pr-0 {
        margin-bottom: 15px;
        padding-right: 15px !important;
    }
    .summarymetrics .smloop {
        padding-right: 15px;
    }
}


/*if is max 767px*/

@media screen and (min-width:1440px) {
    .statuscount .row.text-center {
        width: 100%;
    }
}

status-count.col-12 {
    padding: 0px;
}

.reporttitlewithline {
    color: #636361;
    font-size: 20px;
    line-height: 26px;
    position: relative;
}

.reporttitlewithline span {
    position: relative;
    z-index: 1;
    padding-right: 10px;
    background: #fff;
}

.reporttitlewithline::after {
    content: '';
    width: 100%;
    height: 1px;
    background: #c2c2c2;
    display: block;
    position: relative;
    top: -13px;
}

.statuslistloop h4 {
    font-size: 16px;
    line-height: 22px;
    text-align: center;
    padding: 10px 5px;
    color: #2b2b2b;
    display: block;
    overflow: hidden;
    -webkit-text-overflow: ellipsis;
    text-overflow: ellipsis;
    border-bottom: 1px solid #DDDDDD;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.statuslistloop h4,
.statuslistloop figure,
.statuslistloop .btn {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}


/* @media screen and (min-width:641px) {
    .status-count .flex-grow-0 {
        -ms-flex-positive: 0;
        flex-grow: 0;
    }
}

@media screen and (min-width:1712px) {
    .status-count .flex-grow-0 {
        -ms-flex-positive: 1;
        flex-grow: 1;
    }
} */

status-count .status-count .row {
    justify-content: flex-start;
}

status-count .status-count .row .col.flex-grow-0 {
    -ms-flex-positive: 0;
    flex-grow: inherit;
}

@media screen and (max-width:480px) {
    status-count .status-count .row .col.flex-grow-0 {
        min-width: 100%
    }
}


/* @media screen and (min-width:1920px) {
    status-count .status-count .row .col.flex-grow-0 {
        width: calc(100% / 8);
    }
} */

@media screen and (min-width:481px) and (max-width:767px) {
    status-count .status-count .row .col.flex-grow-0 {
        min-width: 50%
    }
}

.statuslistloop {
    background: #fff;
    border: 1px solid #DDDDDD;
    min-width: 200px;
    border-radius: 8px;
}

.statuslistloop figure {
    color: #636361;
    font-size: 40px;
    line-height: 47px;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif
}

.statuslistloop figure figcaption {
    font-size: 16px;
    line-height: 22px;
    color: #959595;
}

.statuslistloop .countlink {
    background-color: rgba(0, 0, 0, 0);
    color: #00adff;
    border: 0px none;
    display: block;
    text-align: center;
    border-top: 1px solid #DDDDDD;
    flex: 0 0 100%;
    border-radius: 0px;
    margin: 0px;
    padding: 10px 5px;
    font-size: 12px;
    line-height: 18px;
    text-transform: uppercase;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    max-width: 100%;
}

.statuslistloop .countlink:hover {
    opacity: 0.8;
}


/*summarymetrics*/

.summarymetrics {
    border: 0px none;
    height: 100%;
}

.summarymetrics .remetricstitle {
    font-size: 20px;
    line-height: 28px;
    color: #333333;
    text-align: center;
    -webkit-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    border-right: 0px none;
    margin-top: 8px;
}

.summarymetrics .sumtotal {
    -webkit-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    font-size: 40px;
    line-height: 46px;
    color: #00adff;
    text-align: center;
}

.summarymetrics .smloop {
    min-width: 150px;
    padding-right: 0px
}

.summarymetrics .smloop:last-child {
    padding-right: 15px;
}

.h-48 {
    height: 48%;
}


/*if pipelinesubtitle*/

.pipelinesummeywrap {
    padding: 15px;
    border-radius: 8px;
    background: #fff;
    height: 100%;
}

.pipelinesumloop .summerycount,
.totalpipetitle span.sumtotal {
    color: #00adff;
    font-size: 23px;
    line-height: 29px;
    font-family: "open_sanssemibold", Arial, sans-serif;
    text-align: center;
    min-width: 50px;
}

.pipelinesumloop .summerycount span {
    padding: 25px 0 0;
}

.pipelinesumloop .ploop-left {
    max-width: 80%;
    padding: 15px;
}

.pipelinesumloop .ploop-left h5,
.fcountlists .pipelinesumloop h5,
.totalpipetitle h5,
.mdfsloop .mdflabel {
    display: block;
    margin-bottom: 0.35rem;
    font-family: "open_sanssemibold", Arial, sans-serif;
}

.pipelinesumloop .ploop-left h5,
.totalpipetitle h5,
.mdfsloop .mdflabel {
    color: #333333;
    font-size: 14px;
    line-height: 20px;
}

.pipelinesumloop .ploop-left .d-flex,
.mdfsloop .mdfvalue {
    color: #A8A8A8;
    font-family: "open_sanssemibold", Arial, sans-serif;
    font-size: 18px;
    line-height: 24px;
}

.pipelinesumloop.pending {
    background: #f1f1f1;
}

.pipelinesumloop.approved {
    background: #636361;
}

.pipelinesumloop.approved .ploop-left .d-flex,
.pipelinesumloop.rejected .ploop-left .d-flex,
.pipelinesumloop.pending .ploop-left .d-flex,
.pipelinesumloop.approved .ploop-left h5,
.pipelinesumloop.rejected .ploop-left h5,
.pipelinesumloop.pending .ploop-left h5 {
    color: #ffffff;
}

.pipelinesumloop.rejected {
    background: #dddddd;
}

.pipelinesubtitle {
    background: #437c91;
    padding: 15px;
}

@media screen and (max-width: 360px) {
    .pipelinesumloop .ploop-left {
        max-width: 150px;
    }
}

@media screen and (max-width: 479px) {
    .summarymetrics .col {
        min-width: 50%;
    }
    .pipelinesubtitle h5,
    .pipelinesumloop .ploop-left h5 {
        font-size: 16px;
        line-height: 22px;
    }
    .pipelinesumloop .ploop-left .d-flex {
        font-size: 18px;
        line-height: 24px;
        ;
    }
}

@media screen and (max-width:767px) {
    .summarymetrics .remetricstitlearea {
        min-width: 100%;
    }
}


/*piechart-wrap*/

.piechart-wrap h2,
.charts-title {
    font-size: 18px;
    line-height: 24px;
    color: #636361;
}


/*topsummarytitle*/

app-top-summary {
    border-radius: 8px;
    background: #fff;
    width: 100%;
}


/*.topsummary {
     padding: 0.5rem;
}
*/

.topsummarytitle {
    color: #333333;
    font-family: "open_sanssemibold", Arial, sans-serif;
    font-size: 16px;
    line-height: 22px;
    padding-top: 4px;
}

.topsummarytitle.mb-5 {
    margin-bottom: 1.5rem !important;
}

.titleselect .ml-auto .d-inline-flex {
    margin-bottom: 1rem;
    min-width: 100px;
}

@media screen and (min-width:768px) {
    .titleselect .ml-auto .d-inline-flex+.d-inline-flex {
        margin-left: 1rem;
    }
    .form-group .row.h-100 {
        margin: 0px;
    }
    /*.entittyrecord .ucmgrid {
         min-width: 1140px;
    }
    */
}


/*report Navbar*/

.reportnavbar {
    background: #f1f1f1;
    position: relative;
    margin-top: -2px;
}

.reportnavbar.navbar-expand-lg .navbar-nav .nav-link {
    color: #333333;
    font-size: 12px;
    line-height: 18px;
    padding: 0 0.5rem;
}

.reportnavbar.navbar-expand-lg .navbar-nav .nav-link:hover,
.reportnavbar.navbar-expand-lg .navbar-nav .nav-link:focus {
    color: #333;
    background: none;
}

.reportnavbar .dropdown a {
    color: #333333;
    font-size: 12px;
    line-height: 18px;
    padding: 0 0.5rem;
}

.reportnavbar .dropdown.show a:hover,
.reportnavbar .dropdown a:hover,
.reportnavbar .dropdown.show a:focus,
.reportnavbar .dropdown a:focus {
    background: #c8c8c8;
}

.reportnavbar.navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    background: #ddd;
    border: 0px none;
    border-radius: 0px;
    top: 24px;
    padding: 0;
}

.reportnavbar .dropdown.show a.dropdown-item,
.reportnavbar .dropdown a.dropdown-item {
    padding: 0.5rem;
}

.reportnavbar.navbar-expand-lg .navbar-nav .dropdown-menu .dropdown .dropdown-menu {
    top: -36px;
    left: 100%;
}


/*report filter*/

canvas-selector {
    position: relative;
    display: block;
    width: 100%;
}

canvas-selector titlebreadcrumbs {
    flex: 1;
    margin: 0px 10px 0 0;
}

.reportfilterbtn {
    margin-left: auto;
    margin: 0;
}

.reportfilterbtn .ucmrlink button {
    padding: 5px 9px;
}

.reportfilterbtn i,
.reportnavbar i {
    display: inline-block;
    vertical-align: middle;
    width: 15px;
    height: 15px;
}

.reportfilterbtn:hover i {
    opacity: 0.7;
}

.refiltersarea {
    position: fixed;
    right: -10px;
    width: 0;
    top: 81px;
    z-index: 9991;
    background: #a8a8a8;
    height: 100%;
    -webkit-transition: width 0.25s ease-in-out;
    transition: width 0.25s ease-in-out;
}

.ucm-rsb-title {
    background: #636361;
    padding: 10px 0;
}

body.full-screen-option .refiltersarea {
    top: 0;
}

.refiltersarea.addwidth {
    width: 300px;
    right: 0;
}

.filteroverlay {
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1001;
    -webkit-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}

.ucmfilterform {
    display: block;
    padding: 0 15px;
}

.ucmfilterform .form-double label,
.ucmfilterform .form-double .inputbox {
    width: 100%;
    display: block;
}

.ucmfilterform .form-double label {
    text-align: left;
    color: #fff;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 5px;
}

.ucmfilterform .inputbox input:focus,
.ucmfilterform .inputbox .ucm-select select:focus,
.ucmfilterform .inputbox textarea:focus,
.ucmfilterform .inputbox .multipleSelect select:focus {
    background: #fff;
}

.ucmfilterform .inputbox .ucm-select select option:checked,
.ucmfilterform .inputbox .ucm-select select option:hover,
.ucmfilterform .inputbox .ucm-select select option:focus {
    background: #fff;
}

.ucmfilterform .ucm-select::after {
    right: 13px;
}

.ucmfilterform .ucm-select::before {
    right: 8px;
}

.closefilter {
    display: block;
    border: 0px none;
    background: none;
    font-size: 18px;
    line-height: 24px;
    color: #fff;
    padding: 0;
    background: none;
    border: 0px none;
    width: 100%;
    text-align: left;
}

.closefilter i {
    margin-right: 5px;
    z-index: 1;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    font-size: 21px;
    text-align: center;
    font-style: normal;
    font-weight: normal;
    color: #fff;
    display: inline-block;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    width: 40px;
    height: 100%;
    padding: 10px 0;
    background: #606060;
    border: 0px none;
    border-radius: 0;
}


/* @media screen and (min-width:481px) {
    #ReportFilter .slimscroll-wrapper,
    #ReportFilter .ucmfilterscroll {
        height: calc(100% - 300px) !important;
        overflow: auto !important;
    }
} */

#ReportFilter .ucmlinkgroup .ucmlink {
    color: #fff;
    pointer-events: none;
}

#ReportFilter .ucmlinkgroup {
    margin-bottom: 12px;
}

#ReportFilter .row.mb-3.ucm-rsb-title,
#ReportFilter .row.mb-3.ucm-rsb-title .col-12 {
    padding: 0;
}


/* .ucmfilterscroll {
    padding-right: 10px;
    padding-bottom: 15rem;
} */


/*report-loader*/

.report-loader ucmloader,
.loading {
    display: block;
    height: 100%;
    position: relative;
}

.report-loader {
    position: absolute;
    z-index: 851;
    background: rgba(255, 255, 255, 1);
    height: calc(100% - 8px);
    width: calc(100% - 8px);
    min-height: 120px;
    border-radius: 8px;
    left: 0;
    right: 0;
    bottom: 0;
}

.report-loader .ucm-loading-overlay {
    position: inherit;
    top: inherit;
    right: inherit;
    bottom: inherit;
    left: inherit;
    background: none;
}

.report-loader .ucm-loader {
    width: 45px;
    height: 45px;
}

.report-loader .ucm-loadingwrap span {
    top: -37px;
}

@media screen and (min-width:320px) and (max-width:480px) {
    .refiltersarea {
        top: 100px;
    }
}

@media screen and (min-width:481px) and (max-width:767px) {
    .refiltersarea {
        top: 61px;
    }
}


/*report radius*/

.inputbox.selectround,
.selectround .ucm-select,
.selectround .ucm-select select,
.selectround input {
    border-radius: 30px;
}

.selectround .ucm-select select {
    padding-top: 4px;
    padding-bottom: 4px;
}

.selectround .ucm-select select,
.ucm-select select {
    padding-right: 20px !important;
}

.selectround .ucm-select::before {
    border-radius: 0 30px 30px 0;
    right: 1px;
}

.selectround .ucm-select::after {
    right: 8px;
}


/*media for report canvas*/

@media screen and (max-width: 767px) {
    .reportnavbar .navbar-toggler {
        font-size: 14px;
        line-height: 23px;
        color: #333333;
        display: block;
        width: 100%;
        padding: 5px 10px;
        position: relative;
        text-align: left;
    }
    .reportnavbar {
        background: #f1f1f1;
        margin-top: 0;
        padding: 0;
        margin-left: 15px;
        margin-right: 15px;
    }
    .reportnavbar.navbar-expand-lg .navbar-nav .dropdown-menu {
        top: auto;
        width: 100%;
        position: relative;
    }
    .reportnavbar.navbar-expand-lg .navbar-nav .dropdown-menu .dropdown .dropdown-menu {
        top: auto;
        left: auto;
        margin: 0px;
    }
    .reportnavbar.navbar-expand-lg .navbar-nav .nav-link {
        padding: 0.5rem;
        position: relative;
    }
    .reportnavbar .nav-item.dropdown,
    .reportnavbar .dropdown.show a.dropdown-item,
    .reportnavbar .dropdown a.dropdown-item {
        border-bottom: 1px solid #fff;
    }
    .reportnavbar .nav-item.dropdown:first-child {
        border-top: 1px solid #fff;
    }
    .reportnavbar .nav-item.dropdown:last-child,
    .reportnavbar .dropdown.show a.dropdown-item:last-child,
    .reportnavbar .dropdown a.dropdown-item:last-child {
        border: 0px none;
    }
    .reportnavbar .dropdown.show a.dropdown-item,
    .reportnavbar .dropdown a.dropdown-item {
        position: relative;
    }
    .reportnavbar .dropdown-toggle::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800.58 451.42'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M380,618.32h0a32.12,32.12,0,0,1-5.6-7.29L9.09,232.59a32.71,32.71,0,1,1,47.06-45.44L403,546.45,744.1,186a32.71,32.71,0,1,1,47.52,45L426.28,617A32.81,32.81,0,0,1,380,618.32Z' transform='translate%280.05 -175.81%29' style='fill:%23606060'/%3E%3C/svg%3E");
        width: 14px;
        height: 14px;
        display: block;
        background-repeat: no-repeat;
        background-position: center center;
        margin: 0px auto;
        z-index: 3;
        position: absolute;
        content: '';
        top: 10px;
        right: 17px;
        border: 0px none;
    }
    .reportnavbar .nav-item.dropdown.show .dropdown-toggle::after,
    .reportnavbar .dropdown-menu.show .dropdown-toggle::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 795.47 448.54'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M381.46,185.35h0a31.92,31.92,0,0,0-5.56,7.24l-363,376a32.5,32.5,0,1,0,46.76,45.15l344.66-357,338.9,358.15a32.5,32.5,0,1,0,47.21-44.68l-363-383.62A32.6,32.6,0,0,0,381.46,185.35Z' transform='translate%28-3.79 -176.5%29' style='fill:%23606060'/%3E%3C/svg%3E");
    }
}


/*767px*/


/*Funnel Chart*/

.funnelchart {
    display: block;
    width: 100%;
    background: #fff;
    padding-top: 15px;
    padding-bottom: 15px;
    border-radius: 8px;
}

#pyramid-div,
#pyramid-div .highcharts-container {
    display: block;
    margin: 0px auto;
}

#pyramid-div .highcharts-title {
    display: none;
}

.fcountlists .pipelinesumloop h5.txt-blk {
    color: #333333;
    font-size: 14px;
    line-height: 20px;
    word-wrap: break-word;
    width: calc(100% - 80px);
}

.funnelchart .pipelinesumloop.norborder {
    border: 0px none;
}

.ucm-abs-center {
    position: absolute;
    left: 50%;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}


/*EngagementPercentage*/

.engdataleft {
    margin-bottom: 20px;
}

.engdataleft h5 {
    font-size: 18px;
    line-height: 24px;
    color: #333333;
    font-family: "open_sansemibold", Arial, sans-serif;
    margin: 0px;
    padding: 0px;
}

.engdataleft h5 span {
    font-family: "open_sansregular", Arial, sans-serif;
    display: block;
    font-size: 14px;
    line-height: 20px;
    margin: 0px;
    padding: 0px;
    color: #636361;
}

.engvalue {
    color: #00adff;
    font-family: "open_sanssemibold", Arial, sans-serif;
    font-size: 23px;
    line-height: 30px;
    padding-left: 0px;
    margin: 0px;
}


/*mdfsummeyreport*/


/*.mdfsummeyreport {
     background: #ffffff;
     border: 1px solid #c6c6c6;
     display: block;
     width: 100%;
}
*/

.mdfsummeyreport {
    background: #ffffff;
    border: 0px none;
    overflow: hidden;
    position: relative;
    padding: 15px;
    border-radius: 8px;
    display: block;
    width: 100%;
}

.mdfsummeyreport .remetricstitle {
    -webkit-writing-mode: vertical-rl;
    writing-mode: tb-rl;
    width: 100%;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    transform: rotate(180deg);
    font-size: 28px;
    line-height: 64px;
    font-family: "open_sanssemibold", Arial, sans-serif;
}

.mdfloopcontent {
    margin-bottom: 10px;
}

.mdfloopcontent h5 {
    font-family: "open_sanssemibold", Arial, sans-serif;
    display: block;
    font-size: 14px;
    line-height: 20px;
    color: #6e6e6c;
}

.mdfloopcontent:first-child h5 {
    color: #6e6e6c;
}

.mdfloopcontent:nth-child(2) h5 {
    color: #3d7085;
}

.mdfloopcontent:nth-child(3) h5 {
    color: #3c776e;
}

.mdfloopcontent:last-child h5 {
    color: #f17713;
}

.mdfloopcontent h5 span {
    display: block;
    color: #333333;
    font-family: "open_sansbold", Arial, sans-serif;
    font-size: 24px;
    line-height: 30px;
    padding-left: 0px;
    margin: 0px;
}


/*Work Flow Layout generator*/

.Wflayoutbuilder {
    position: relative;
}

.Wflayoutbuilder ul,
.Wflayoutbuilder ul li {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

.wfpropertiesmodal {
    border-left: 1px solid #ccc;
}

.wfcanvasarea {
    width: calc(100% - 250px);
    padding: 15px;
    background: #fff;
    border-radius: 8px;
}

.wfcanvasarea.fullscreen {
    width: calc(100% - 30px);
}

.wfleftmodules {
    width: 250px;
    background: #A8A8A8;
}

.wfleftmodules {
    transition: width .5s;
}

.wftitlearea {
    background: #636361;
    padding: 10px 5px;
}

.wfleftmodules {
    position: fixed;
    z-index: 841;
    height: 100%;
    right: 0;
}

.wfclose {
    border: 0px none;
    background: rgba(0, 0, 0, 0);
    margin: 0px 8px 0 5px;
    padding: 0;
}

.wfclose i {
    width: 15px;
    height: 15px;
}

.wftitlearea {
    display: -ms-flex;
    display: flex;
}

.opwf {
    display: none;
}

.wftitlearea h2 {
    font-size: 16px;
    line-height: 22px;
    color: #ffffff;
    margin: 0px;
}


/*when minimize*/

.minirside .wftitlearea {
    border-radius: 10px 0 0 10px;
    background: #A8A8A8;
    box-shadow: -2px 0px 0px rgba(0, 0, 0, 0.5);
}

.minirside .wfclose {
    width: 100%;
    margin: 0;
}

.minirside .slimScrollDiv,
.minirside .wfclose i,
.minirside .wftitlearea h2 {
    display: none;
}

.wfleftmodules.minirside {
    width: 30px;
    height: auto;
    background: none;
}

.minirside .opwf {
    display: block;
    white-space: nowrap;
    writing-mode: tb-rl;
    font-size: 17px;
    line-height: 23px;
    color: #fff;
    margin-top: 5px;
    font-family: 'open_sansregular', 'Helvetica Neue', Arial, sans-serif;
}


/*on scroll fixed to top*/

.scrolltofixed {
    -ms-transition: all 0.2s ease-in;
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
}

.scrolltofixed.topfixed {
    top: 81px;
    position: fixed;
}

body.full-screen-option .scrolltofixed.topfixed {
    top: 0px;
}

body.pinedhead .scrolltofixed.topfixed {
    top: inherit;
}

.wfleftmodules h1,
.wfrightproperties h1 {
    font-size: 15px;
    line-height: 22px;
    color: #ffffff;
    padding: 7px 0;
    border-bottom: 1px solid #ccc;
    margin-bottom: 15px;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
}

.wfcomplits ul {
    padding-bottom: 10rem
}

.wfcomplits ul li {
    display: block;
    text-align: left
}

.wfcomplits ul li i {
    display: inline-block;
    vertical-align: middle;
}

.wfleftmodules .btn-drag {
    position: relative;
    background: #e2e2e2;
    padding: 0;
    color: #333333;
    border: 0px;
    text-align: left;
}

.wfleftmodules .componantlists .btn-drag {
    padding: 6px;
}

.reports-genarator .wfleftmodules .componantlists .btn-drag {
    padding: 0px;
}

.minirside.wfleftmodules .btn-drag {
    display: none
}

.wfcomplits ul li button {
    text-align: left;
    border: 0px none;
    cursor: move;
}

.wfleftmodules .btn-drag i {
    background-size: 60%;
    display: inline-block;
    vertical-align: middle;
    background-color: #fff;
    border-radius: 6px 0 0 6px;
    margin-right: 3px;
    border-right: 1px solid #b2b2b2;
}


/*add space for each*/

.wfleftmodules .btn-drag i.ucmicon-notes {
    background-size: 43%;
}

.wfleftmodules .btn-drag span {
    max-width: calc(100% - 50px);
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.wfafterdropfullarea {
    display: block;
    padding-bottom: 2rem;
}

.wfcreatemodule {
    display: block;
    position: relative;
}

.wfmaxwp {
    width: 200px;
    text-align: center;
    margin-right: auto;
    margin-bottom: .75rem;
    display: block;
}

.appfminwidth {
    min-width: 860px;
}

.appfroot .wfstart,
.wfstop {
    display: table;
    padding: 4px 20px;
    text-transform: uppercase;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    border-radius: 15px;
    border: 0px none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 120px;
    margin: 0px auto;
}

.wfstart {
    color: #fff;
    font-size: 13px;
    line-height: 18px;
    background: #333;
    padding: 10px 30px;
    border-radius: 6px;
    display: block;
    max-width: 100px;
    margin: 0px auto 0;
    text-transform: uppercase;
}

.wfstop {
    background: #f27724;
    position: relative;
    color: #ffffff;
    border: 2px solid #f27724;
    transition: background 0.2s ease-in;
    font-size: 12px;
    line-height: 18px;
    height: 28px;
}

.wfstop:hover,
.wfstop.disable {
    background: #ffffff;
    color: #f27724;
}

.wfstop:hover::before,
.wfstop.disable::before {
    background: #f27724;
}

.wfstop::before {
    width: 10px;
    height: 10px;
    content: '';
    display: inline-block;
    background: #fff;
    margin-right: 7px;
}

.wfmaxwp.falsestop {
    margin-top: 3.0rem;
}

.wfstop.disable {
    opacity: 0.5;
    cursor: not-allowed;
}

.wfarrow {
    position: relative;
    margin-bottom: 0.8rem;
}

.wfarline {
    background: #a1a1a1;
    display: block;
    margin: 0px auto;
}

.down .wfarline {
    height: 35px;
    width: 2px;
    position: relative;
}

.right .wfarline {
    height: 2px;
    width: 35px;
    position: relative;
}

.wfarrow.right {
    display: -ms-inline-flex;
    display: inline-flex;
    -ms-flex-line-pack: center;
    align-items: center;
    margin-bottom: 0;
    margin-right: 0.8rem;
}

.wfarrow.down::before,
.wfarrow.right::before {
    position: absolute;
    content: '';
    width: 9px;
    height: 9px;
    border: 2px solid #a1a1a1;
    background: #fff;
    z-index: 3;
    border-radius: 100%;
    top: 0;
    left: 50%;
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.wfarrow.down::after,
.wfarrow.right::after {
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    font-size: 0;
    line-height: 0;
    content: '';
    left: 50%;
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 0;
}

.wfarrow.right::before,
.wfarrow.right::after {
    position: inherit;
    left: inherit;
    top: inherit;
    bottom: inherit;
    transform: none;
}

.wfarrow.down::after {
    border-width: 7px 5px 0 5px;
    border-color: #a1a1a1 transparent transparent transparent;
}

.wfarrow.right::after {
    border-width: 5px 0 5px 7px;
    border-color: transparent transparent transparent #a1a1a1;
}

.wfmodulename {
    display: block;
    margin: 0px auto;
    background: #e2e2e2;
    border: 0px none;
    font-size: 14px;
    color: #333333;
    line-height: 20px;
    padding: 10px 30px;
    box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.35);
    white-space: normal;
    text-overflow: ellipsis;
    overflow: hidden;
    border-radius: 9px;
    -ms-transition: background all 0.2s ease-in;
    transition: background all 0.2s ease-in;
    max-width: 90%;
}

.wfmodulename:hover {
    background: #C9C9C9;
}

.wfcreatecriteria {
    display: block;
    position: relative;
    height: auto;
    min-height: 200px;
}

.isdeleterow {
    border: 2px dashed transparent;
    transition: all 0.2s ease-in;
    min-height: 310px;
    padding: 5px 0;
}

.isdeleterow:hover {
    border: 2px dashed #f27724;
    min-height: 310px;
}

.isdelbtn {
    opacity: 0;
    transition: all 0.2s opacity ease-in;
}

.isdeleterow:hover .isdelbtn {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    opacity: 1;
}

.wfcreatecriteria.appfh {
    min-height: 150px;
    width: 100%;
}

.wfcrtcirclewrp {
    position: absolute;
    height: 100%;
    display: inline-block;
    vertical-align: top;
    width: 200px;
}

.wfcrtcirclebase {
    width: 100px;
    height: 100px;
    padding: 15px;
    background: #e2e2e2;
    box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.35);
    margin: 20px auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-line-pack: center;
    align-content: center;
    position: relative;
    border-radius: 6px;
    transform: rotate(45deg);
    text-align: center;
    cursor: pointer;
}

.wfcrtcirclebase:hover {
    background: #C9C9C9;
}

.wfcrtcirclebase>span {
    transform: rotate(-45deg);
    display: block;
    text-transform: uppercase;
    margin: 0 0 0 20px;
    font-size: 13px;
    line-height: 19px;
}

.wfcrtcirclebase .logicfalse,
.wfcrtcirclebase .logictrue,
.appf-step-loop .logicfalse,
.appf-step-loop .logictrue {
    width: 22px;
    height: 22px;
    position: absolute;
    background-color: #fff;
    border-radius: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 45%;
    transform: rotate(-45deg);
}

.wfcrtcirclebase i {
    cursor: pointer;
    transform: rotate(-45deg);
    margin-left: 14px;
}

.stbtn i {
    transform: rotate(0deg);
}

.wfcrtcirclebase i:hover {
    opacity: 0.8;
}

.wfcrtcirclebase .logictrue,
.appf-step-loop .logictrue {
    border: 1px solid #46877c;
    right: -7px;
    top: -8px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 800'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M788.85,39.93,733.94,4a24.59,24.59,0,0,0-34,7.15l-405.37,621a24.59,24.59,0,0,1-32.89,7.86L69.7,529.14a24.59,24.59,0,0,0-33.6,9L3.3,595a24.64,24.64,0,0,0,9,33.64l233,134.65q.59.34,1.16.71l48.89,32a24.59,24.59,0,0,0,34-7.15L796,74A24.64,24.64,0,0,0,788.85,39.93Z' transform='translate%280 0%29' style='fill:%2346877c'/%3E%3C/svg%3E");
}

.wfcrtcirclebase .logicfalse,
.appf-step-loop .logicfalse {
    left: 87px;
    bottom: -8px;
    border: 1px solid #f27724;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 798.49 798.49'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M792.8,52.91,747.09,7.2a24.57,24.57,0,0,0-34.74,0L418.12,301.42a24.57,24.57,0,0,1-34.74,0L89.15,7.2a24.57,24.57,0,0,0-34.74,0L8.7,52.91a24.57,24.57,0,0,0,0,34.74L302.93,381.88a24.57,24.57,0,0,1,0,34.74L8.7,710.85a24.57,24.57,0,0,0,0,34.74L54.41,791.3a24.57,24.57,0,0,0,34.74,0L383.38,497.07a24.57,24.57,0,0,1,34.74,0L712.35,791.3a24.57,24.57,0,0,0,34.74,0l45.71-45.71a24.57,24.57,0,0,0,0-34.74L498.58,416.62a24.57,24.57,0,0,1,0-34.74L792.8,87.65A24.57,24.57,0,0,0,792.8,52.91Z' transform='translate%28-1.51%29' style='fill:%23f27724'/%3E%3C/svg%3E");
}

.appf-step-loop .logicfalse,
.appf-step-loop .logictrue {
    position: inherit;
    transform: rotate(0deg);
    left: auto;
    right: auto;
    top: auto;
    margin: 0px auto;
    bottom: auto;
}

.ifistruearrow {
    display: -ms-inline-flex;
    display: inline-flex;
    padding: 60px 0 0 180px;
}

.arrowfalse,
.arrowtrue {
    position: absolute;
    height: calc(100% - 9rem);
    padding: 0rem 0 0 0;
}

.wfnm.arrowfalse {
    height: calc(100% - 11rem);
}

.arrowfalse .wfarrow,
.arrowfalse .down .wfarline,
.arrowtrue .wfarrow,
.arrowtrue .down .wfarline {
    height: 100%;
}

.isdeleterow .arrowfalse .wfarrow {
    height: 60%;
}

.arrowfalse .wfarrow.down::before,
.arrowfalseright .wfarrow.right::before {
    border-color: #f27724;
}

.arrowfalse .wfarrow.down::after {
    border-top-color: #f27724;
}

.arrowfalseright .wfarrow.right::after {
    border-left-color: #f27724;
}

.arrowfalse .wfarline,
.arrowfalseright .wfarline {
    background: #f27724;
}

.wftooldropgrp {
    display: -ms-inline-flex;
    display: inline-flex;
    width: calc(100% - 300px);
}

.wftooldropgrp .wfdropablearea {
    width: 220px;
    margin: 0px;
    min-height: 150px;
}

.wftooldropgrp .left-droparea p.abspara {
    width: 96%;
}

.wftorf {
    text-align: center;
    text-transform: uppercase;
    font-size: 13px;
    line-height: 18px;
    color: #333333;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
}

.arrowfalse .wftorf {
    margin: 15px 0 5px 0;
    display: block;
}

.ifistruearrow .wftorf {
    margin: 0 5px;
    display: -ms-inline-flex;
    display: inline-flex;
}

.maxwf {
    max-width: 692px;
}

.wfarrow.down.h40 {
    height: 50px;
    margin: 0;
}


/*wftactions*/

.wftactions {
    width: 200px;
    height: auto;
    border: 2px solid #a2a2a2;
    border-radius: 3px;
    background: #fff;
    margin: 0 5px;
}

.wftactions h3 {
    border-bottom: 2px solid #a2a2a2;
    font-size: 15px;
    line-height: 22px;
    color: #333333;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    text-align: center;
    padding: 6px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0px;
}

.wfactionlists {
    max-height: 350px;
    display: block;
}

.wfactionlists li {
    display: block;
    background: #f1f1f1;
    border-bottom: 1px solid #DDDDDD;
    border-top: 1px solid #fff;
}

.wfactionlists li button.tskbtn,
.sch button {
    display: block;
    padding: 7px 10px;
    border: 0px none;
    margin: 0px;
    width: 88%;
    border-radius: 0px;
    background: rgba(0, 0, 0, 0);
    text-align: left;
}

.wfactionlists li button i,
.sch button i {
    display: inline-block;
    vertical-align: middle;
    width: 18px;
    height: 18px;
}

.wfactionlists li button span,
.sch button span {
    display: inline-block;
    max-width: calc(100% - 37px);
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 13px;
    line-height: 19px;
    color: #00adff;
    padding-left: 8px;
}

.wfaddactions {
    border: 0px none;
    font-size: 12px;
    line-height: 18px;
    color: #0052a3;
    text-align: left;
    width: 100%;
    display: block;
    background-color: #fff;
    padding: 10px;
    text-transform: uppercase;
}

.wfaddactions::before {
    content: '';
    width: 12px;
    height: 12px;
    background-position: center center;
    margin-right: 5px;
    margin-top: 3px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 762.86 762.86'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M763.36,349.91H458.22V44.77a22.89,22.89,0,0,0-22.89-22.89h-61a22.89,22.89,0,0,0-22.89,22.89V349.91H46.28A22.89,22.89,0,0,0,23.39,372.8v61a22.89,22.89,0,0,0,22.89,22.89H351.42V761.86a22.89,22.89,0,0,0,22.89,22.89h61a22.89,22.89,0,0,0,22.89-22.89V456.71H763.36a22.89,22.89,0,0,0,22.89-22.89v-61A22.89,22.89,0,0,0,763.36,349.91Z' transform='translate%28-23.39 -21.89%29' style='fill:%230052a3'/%3E%3C/svg%3E");
    display: inline-block;
}

.wftactions .slimScrollDiv,
.wfactionlists {
    height: auto !important;
}

.wfaction-drop.wfaflo {
    min-height: 130px;
    padding: 44px 25px 25px 25px;
}

.sch {
    border-bottom: 1px solid #DDDDDD;
}

.sch button {
    margin: 0px;
    padding: 0px;
    border: 0px none;
    color: #00adff;
    display: block;
    background: rgba(0, 0, 0, 0);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
}

.sch button i {
    margin: 0;
}


/*
.sch button span {
    padding-left: 8px;
} */

.afdhcalc {
    height: calc(100% - 65px);
}

.appfwcalc {
    width: calc(100% - 20px);
}

.appfwcalc .wfactionlists li button.tskbtn {
    width: 97%;
}


/*aproval flow */

.appf.wfcrtcirclebase .logictrue {
    left: 87px;
    bottom: -8px;
    top: auto;
    right: auto;
}

.appf.wfcrtcirclebase .logicfalse {
    right: -7px;
    top: -8px;
    left: auto;
    bottom: auto;
}


/*step */

.appf-step,
.appf-step.wfcrtcirclebase .logicfalse,
.appf-step.wfcrtcirclebase .logictrue,
.appf-step.wfcrtcirclebase>span {
    transform: rotate(0deg);
}

.appf-step.wfcrtcirclebase .logictrue {
    left: 50%;
    bottom: -35px;
    transform: translateX(-50%);
}

.appf-step.wfcrtcirclebase .logicfalse {
    right: -35px;
    top: 13px;
}

.appf-left-canvas {
    width: calc(100% - 210px);
}

.appf-right-final-reject {
    width: 200px;
}

.appf-right-final-reject .dropable-block {
    margin: 0px;
}

.appf-step {
    height: auto;
    text-align: center;
    display: block;
    padding: 10px;
    margin: 0px auto 15px;
    width: 70%;
}

.appf-step.wfcrtcirclebase>span {
    font-size: 14px;
    line-height: 20px;
    margin: 0px;
}

.appf-step-width {
    width: calc(100% - 300px);
}

.appf-arrow-calcw {
    width: calc(100% - 230px);
    margin-left: 10px;
}

.appf-step-loop .ifistruearrow.arrowfalseright {
    padding: 0.9rem 0 0 0.3rem;
}

.appf-step-loop {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
}

.appf-step-loop .wfcrtcirclewrp {
    position: relative;
    display: block;
    height: auto;
}

.componantlits {
    padding: 10px;
}

.ucm-layout-ac-loop {
    display: block;
}

.ucm-layout-ac-loop a {
    color: #333333;
    font-size: 15px;
    font-weight: normal;
    text-align: left;
    padding: 5px 10px;
    line-height: 22px;
    display: block;
    position: relative;
    background: #f2f2f2;
    font-family: 'open_sanssemibold', Arial, sans-serif;
    border-radius: 5px;
    transition: all 0.3s linear;
}

.ucm-layout-ac-loop a::after {
    padding-right: 12px;
    background-repeat: no-repeat;
    background-position: center center;
    content: '';
    width: 10px;
    height: 10px;
    display: inline-block;
    vertical-align: middle;
    transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -wbkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
}


/* END Work Flow Layout generator need to add this in new css*/


/*multiple background color*/

.grey-bg {
    background: #e8e8e8;
}

.ucm-radius {
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

.ucm-border {
    border: 1px solid #ccc;
}

.ucm-border-top {
    border-top: 1px solid #ccc;
}

.ucm-border-right {
    border-bottom: 1px solid #ccc;
}

.ucm-border-bottom {
    border-bottom: 1px solid #ccc;
}

.ucm-border-left {
    border-bottom: 1px solid #ccc;
}

.ucm-white-bg {
    background: #fff !important;
}

.grey-borderbox {
    border: 1px solid #ccc;
    padding: 10px;
}


/* * new phase ui */

.ucmbgwradius {
    background: #fff;
    padding: 15px;
    border-radius: 8px;
    margin: 0px auto 15px;
}

.ucmbgwradius-title {
    border-bottom: 1px solid #ccc;
    margin: 0 -15px;
    padding: 0 15px 10px;
    color: #333333;
    font-family: "open_sanssemibold", Arial, sans-serif;
    font-size: 16px;
    line-height: 22px;
}

.ucmbgwradius dyf-detailscontent .ucmbgwradius {
    background: none;
    padding: 0;
    border-radius: 0;
    margin: 4px 0 0 0;
}

.tab-list .ucmbgwradius {
    margin-bottom: 0px;
    padding-bottom: 0px;
}

@media screen and (max-width:767px) {
    .ucmbgwradius+.ucmbgwradius {
        margin-bottom: 0px;
    }
}


/*ucmslimscroll2*/


/* #attractionflw .attributescroll, 
#attractionflw .slimscroll-wrapper,
#ucmcreateListattr .attributescroll, 
#ucmcreateListattr .slimscroll-wrapper,
#ucmcreateListLabel .attributescroll, 
#ucmcreateListLabel .slimscroll-wrapper,
#searchlistscroll .attributescroll,
#searchlistscroll .slimscroll-wrapper, {
    height: 285px;
} */

.getheight .attributescroll {
    padding-right: 5px;
}

.divscroll {
    max-height: calc(80vh - 210px);
    overflow-y: auto;
}

.ucmslimscroll2 {
    max-height: calc(80vh - 210px);
    overflow-y: auto;
    min-height: 30px;
}

.email-wrap {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

.description-box {
    max-height: 150px;
    overflow: auto;
    padding: 10px;
    display: block;
}

.paccount-logo {
    max-width: 120px;
    max-height: 120px;
    padding: 5px;
    border: 1px solid #ccc;
    display: inline-block;
}

.paccount-logo img {
    max-width: 70px;
    display: block;
    margin: 0px auto;
}

.ucmoverlaybg {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1060;
}

.ucm-refmodal-page {
    position: fixed;
    z-index: 1062;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
}

.ucm-refmodal-page>form {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    padding: 15px;
    background-color: #fff;
    max-height: 600px;
    overflow-y: scroll;
}

.ucm-refmodal-page #myModal {
    width: 100%;
    margin: 0px auto;
    display: block;
}

.ucm-refmodal-page #myModal .ucmbgwradius {
    background: #fff;
    padding: 0;
    border-radius: 0;
    margin: 0;
}

@media (min-width: 992px) {
    .ucm-refmodal-page>form {
        width: 992px
    }
}

@media (max-width: 991px) {
    .ucm-refmodal-page>form {
        width: 96%;
    }
}


/* *before login hide leftbar */

.beforeloginleft {
    display: none;
}

.fixed .content-wrapper.beforeloginwrap {
    margin-left: 0 !important;
    padding: 0;
}

.fixed .main-footer.beforeloginfooter {
    margin-left: 0 !important;
}


/*
* Full screen options
*/

.full-screen-option .main-sidebar,
.full-screen-option .ucmheader,
.full-screen-option .main-footer {
    display: none;
}

body.full-screen-option.sidebar-mini .content-wrapper {
    margin-left: 0 !important;
    margin-top: 0;
}

.full-screen-option #FullscreenGrid {
    display: none;
}

#ExitscreenGrid {
    display: none;
}

.full-screen-option #ExitscreenGrid {
    display: block
}

.full-screen-option .ucmbgwradius:last-child {
    margin: 0px auto;
}

#FullscreenGrid.ucm-tooltip.bottom::before,
#ExitscreenGrid.ucm-tooltip.bottom::before {
    left: -55px;
}


/* * custom width for grid table column th if needed then delete */


/*flag dropdown */

.ifstartflag.ucm-options-dropdown .dropdown-menu {
    transform: translate(-50%, -50%) !important;
    min-width: 290px;
    box-shadow: 0px 0px 0px rgba(0, 0, 0);
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    z-index: 1032;
    border: 0px;
    padding: 8px 30px 10px 10px;
}

.dropdown.ifstartflag.ucm-options-dropdown.show::after {
    content: '';
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 1031;
    background: rgba(0, 0, 0, 0.7);
}

.ifstartflag.ucm-options-dropdown .dropdown-menu::before {
    content: '';
    width: 25px;
    height: 25px;
    z-index: 2;
    right: 12px;
    top: 9px;
    background: #fff;
    border-radius: 100%;
    border: 1px solid #f86055;
    cursor: pointer;
}

.ifstartflag.ucm-options-dropdown .dropdown-menu::after {
    border: 0 none;
    z-index: 3;
    position: absolute;
    top: 11px;
    right: 20px;
    content: 'X';
    color: #f86055;
    font-size: 14px;
    cursor: pointer;
}

.ifstartflag.ucm-options-dropdown .dropdown-menu::before:hover .ifstartflag.ucm-options-dropdown .dropdown-menu::before {
    background: #f86055;
}

.ifstartflag.ucm-options-dropdown .dropdown-menu::before:hover .ifstartflag.ucm-options-dropdown .dropdown-menu::after {
    color: #ffffff;
}

.ifstartflag.ucm-options-dropdown .dropdown-menu span {
    font-size: 12px;
    line-height: 18px;
    color: #333;
}

.ifstartflag.ucm-options-dropdown button.dropdown-toggle.cardlabel {
    border: 0px none;
    background: rgba(0, 0, 0, 0);
    cursor: pointer;
}

.ifstartflag.ucm-options-dropdown .dropdown-menu li {
    margin: 12px 5px 12px 10px;
}

.ifstartflag.ucm-options-dropdown i.ucmicons.xs {
    width: 15px;
    height: 15px;
    margin-right: 6px;
}

@media screen and (min-width: 768px) {
    .topsummary .ucmgrid .gridtable,
    .tab-pane .ucmgrid .gridtable {
        width: 100%;
    }
    .ucmgrid .gridtable th.Flag,
    .ucmgrid .gridtable td.PHONE_MOBILE,
    .ucmgrid .gridtable tr td[data-th="Flag"] {
        width: 50px !important;
    }
    .gridtable .gridheader th.ifselected,
    .gridtable .gridheader td.ifselected {
        width: 120px !important;
    }
    .gridtable .gridheader th.ifselected .custom-checkbox {
        width: auto;
    }
    .gridtable td.ifdynamic,
    .gridtable .gridheader th.ifdynamic {
        width: 65px;
    }
    .gridtable td.ifdynamic.w35,
    .gridtable .gridheader th.ifdynamic.w35 {
        width: 35px !important;
    }
}

@media screen and (min-width:768px) {
    #btnCallNow {
        padding-right: 14px;
    }
}


/*pageeditbtn icon  */

a.buttonblue.pageeditbtn {
    background-color: #8ca621;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 795.51 795'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M500.25,140.47a3.21,3.21,0,0,0-4.89.41,37.84,37.84,0,0,1-4.1,5.12Q280.23,357.18,69.2,568.34a28.16,28.16,0,0,0-6.68,11.6c-13.25,45.35-26.22,90.78-39.24,136.2C16.06,741.28,8.89,766.44,1.33,792.9a3.21,3.21,0,0,0,4,4h0C74.9,777,144.54,757.17,214,736.89a45.14,45.14,0,0,0,18.59-10.67q201-200.36,401.56-401.14c7.79-7.78,16.1-15,24-22.24a3.21,3.21,0,0,0,.09-4.64Zm24.36,125.24a51.39,51.39,0,0,1-7.53,9.23Q352.64,439.53,188.11,604c-6.77,6.77-13.37,13.8-24.08,13.65-9.32-.2-16.6-4.12-21.12-12.37-4.3-7.84-4.39-16,.25-23.67a53.68,53.68,0,0,1,8.1-10Q316.35,406.42,481.54,241.26c12.85-12.85,23.61-15.38,35-8.33S531.73,254.12,524.61,265.71Z' transform='translate%28-1.2 -2%29' style='fill:%23ffffff'/%3E%3Cpath d='M788.46,128.22l-118-118a28.15,28.15,0,0,0-39.83,0L566,75.1a28.13,28.13,0,0,0,0,39.76L683.82,232.78a28.14,28.14,0,0,0,39.8,0L788.45,168A28.15,28.15,0,0,0,788.46,128.22Z' transform='translate%28-1.2 -2%29' style='fill:%23ffffff'/%3E%3C/svg%3E");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 15px;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 0;
    padding: 5px;
    text-align: center;
    margin-top: 12px;
    position: fixed;
    right: 15px;
    bottom: 15px;
    z-index: 845;
    width: 30px;
    height: 30px;
    border: none;
}


/*max 768px*/


/* .ucmlink a#btnDetails1 {
     background: none;
     color: #508887 !important;
     padding-right: 0;
     font-size: 12px;
     padding-left: 0;
}
*/


/*Grid Table Filter Icons*/

.gridheader .ucmicon-triangle-top {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 797 407.83'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpolygon points='0 407.83 404.48 0 797 407.83 0 407.83' style='fill:%23333333'/%3E%3C/svg%3E");
}

.gridheader .ucmicon-triangle-bottom {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 406.07'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpolygon points='0 0 406 406.07 800 0 0 0' style='fill:%23333333'/%3E%3C/svg%3E");
}

.content-area-main.mt-4 {
    margin-top: 0.8rem!important;
}


/*new ralated insformation Design  */

.newdesignrllist .ucm-card-accordion .card-header .card-grp a {
    background: #dddddd;
}

.newdesignrllist .ucm-card-accordion .card-header .card-grp a[aria-expanded="true"] {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.newdesignrllist .ucm-card-accordion .card-body {
    border: 1px solid #dddddd;
    border-radius: 0px 0px 8px 8px;
}

.newdesignrllist .ucm-card-accordion .card-body.cus-radius {
    border-radius: 8px;
}

.newdesignrllist .ucm-card-accordion .ucm-view-detail {
    margin: 0px auto;
}

.newdesignrllist .ucm-card-accordion .collapse.show .card-body {
    margin-bottom: 15px;
}

.newdesignrllist .nodatafound {
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

@media screen and (min-width:768px) {
    .newdesignrllist .ucm-radius-table {
        border-radius: 8px;
        border: 0px none;
        margin-bottom: 0;
    }
}

@media screen and (max-width:768px) {
    .newdesignrllist .ucmgrid .gridtable tr {
        border-left: 0;
        border-right: 0;
    }
    .newdesignrllist .ucmgrid .gridtable tr:last-of-type {
        margin-bottom: 0;
        border-left: 0;
        border-right: 0;
        border-bottom: 0;
    }
    .newdesignrllist .ucmgrid .gridtable tr:last-of-type td:last-child {
        border-bottom: 1px solid #f1f1f1 !important;
    }
}


/*Community module  */

.ucm-cfa-file-wrap {
    display: block;
}

.ucm-cfa-file-wrap .ucm-browse {
    display: block;
    position: absolute;
    top: 33px;
    right: 4px;
    width: 25px;
    height: 25px;
    cursor: pointer;
}

.ucm-cfa-file-wrap .cm-browse {
    width: 25px;
    height: 25px;
    overflow: hidden;
}

.ucm-cfa-file-wrap input[type=file] {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    width: 100%;
    display: block;
    opacity: 0;
}

.accordion-cm .card .card-header button {
    color: #333333;
    font-family: "open_sanssemibold", Arial, sans-serif;
    font-size: 17px;
    line-height: 23px;
    padding: 10px 15px 10px 40px;
    display: block;
    text-decoration: none;
    width: 100%;
    text-align: left;
    position: relative;
}

.accordion-cm .card .card-header button::before {
    display: block;
    content: '';
    width: 15px;
    height: 15px;
    background-repeat: no-repeat;
    position: absolute;
    left: 15px;
    top: 18px;
}

.accordion-cm>.card>.card-header>button[aria-expanded="false"]::before,
.cm-post-accordion>.card>.card-header[aria-expanded="false"] button::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 795.47 448.54'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M381.46,185.35h0a31.92,31.92,0,0,0-5.56,7.24l-363,376a32.5,32.5,0,1,0,46.76,45.15l344.66-357,338.9,358.15a32.5,32.5,0,1,0,47.21-44.68l-363-383.62A32.6,32.6,0,0,0,381.46,185.35Z' transform='translate%28-3.79 -176.5%29' style='fill:%23606060'/%3E%3C/svg%3E");
}

.accordion-cm>.card>.card-header>button[aria-expanded="true"]::before,
.cm-post-accordion>.card>.card-header[aria-expanded="true"] button::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800.58 451.42'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M380,618.32h0a32.12,32.12,0,0,1-5.6-7.29L9.09,232.59a32.71,32.71,0,1,1,47.06-45.44L403,546.45,744.1,186a32.71,32.71,0,1,1,47.52,45L426.28,617A32.81,32.81,0,0,1,380,618.32Z' transform='translate%280.05 -175.81%29' style='fill:%23606060'/%3E%3C/svg%3E");
}

.accordion-cm .card .card-header button:hover,
.accordion-cm .card .card-header button:focus {
    text-decoration: none;
}

.accordion-cm .collapse.show {
    border-top: 1px solid #ccc;
}

.accordion-cm .card .card-body {
    padding: 15px;
}

.ucm-community-wrp {
    max-width: 1024px;
    display: block;
}

.ucm-cm-search {
    max-width: 450px;
}

.ph-comment {
    padding: 0 0 0 40px;
    width: 96%;
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ph-comment p {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

.cm-post-accordion .card .card-header[aria-expanded="true"] .ph-comment {
    display: none;
}

.cm-post-accordion .card {
    padding: 13px;
}

.cm-post-accordion .card:nth-child(even) {
    background: #f7f7f7;
}

.cm-post-accordion .card:nth-child(even) .display-file-area .attach-loop {
    background: #fff;
}

.ucm-post-accordion .card+.card {
    margin-top: 0.95rem;
}

@media screen and (min-width:1920px) {
    .ucm-community-wrp {
        max-width: 1170px;
    }
}

.ucm-icon-text-btn {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style-type: none;
    list-style: none;
    margin: 0px 0 6px;
    padding: 0px
}

.ucm-icon-text-btn button {
    border: 0px none;
    background: rgba(0, 0, 0, 0);
    font-size: 16px;
    line-height: 22px;
    color: #333;
    margin: 0px;
    padding: 0px;
}

.ucm-icon-text-btn button+button {
    margin-left: 10px;
}

.ucm-icon-text-btn button:hover,
.ucm-icon-text-btn button:focus {
    opacity: 0.7;
}

.ucm-icon-text-btn button.active {
    color: #0052a3;
}


/*rest ck ediotor  */

.ucm-ck-editor {
    position: relative
}

.ucm-ck-editor .bottom-abs {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #f7f7f7;
    border: 1px solid #cccccc;
}

.ucm-ck-editor .cm-dropdown button {
    color: #333;
    font-size: 14px;
    line-height: 20px;
}

.ucm-ck-editor .cm-dropdown .dropdown-menu {
    transform: translate3d(-17px, 42px, 0px) !important;
}

.ucm-ck-editor .cm-dropdown.ucm-options-dropdown .dropdown-menu::before {
    left: 18px;
    right: auto;
}

.ucm-ck-editor .cm-dropdown.ucm-options-dropdown .dropdown-menu::after {
    left: 16px;
    right: auto;
}


/* 
.ucm-ck-editor .cke_reset,
.ucm-ck-editor .cke_inner {
 border-radius: 8px;
} */

.ucm-ck-editor .cke_reset.cke_chrome {
    border: 1px solid #cccccc;
    /* border-radius: 8px 8px 0 0px; */
    border-bottom: 0;
    position: relative;
}

.ucm-ck-editor .cke_reset.cke_chrome::after,
.calleditor::after,
.inputbox.ucmckeditor::after {
    content: '';
    border-bottom: 13px dashed #ccc;
    border-right: 13px solid transparent;
    border-left: 13px solid transparent;
    position: absolute;
    top: -13px;
    left: 26px;
    z-index: 1;
}

.calleditor::after,
.inputbox.ucmckeditor::after {
    top: -12px
}

.ucm-ck-editor .cke_reset.cke_chrome::before,
.calleditor::before,
.inputbox.ucmckeditor::before {
    content: '';
    border-bottom: 12px dashed #ffffff;
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
    position: absolute;
    top: -12px;
    left: 27px;
    z-index: 2;
}

.calleditor::before,
.inputbox.ucmckeditor::before {
    top: -11px;
}

.ucm-ck-editor .cke_top {
    border-radius: 8px 8px 0 0;
}

.ucm-ck-editor .cke_bottom {
    padding: 16px 8px 10px;
    border-top: 0px none;
    background: #f8f8f8;
    border-radius: 0 0 8px 8px;
}


/*community sidebar  */

.ucm-comut-sidebar {
    border: 1px solid #ccc;
    border-radius: 8px;
    max-width: 300px;
    display: block;
    margin-left: auto;
}

.ucm-comut-sidebar h3 {
    color: #333333;
    font-family: "open_sanssemibold", Arial, sans-serif;
    font-size: 16px;
    line-height: 22px;
    border-bottom: 1px solid #ccc;
    padding: 10px 15px;
}

.loop-list-wrp ul,
.loop-list-wrp li {
    list-style: none;
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

.loop-list-wrp+.loop-list-wrp {
    margin-bottom: 20px;
}

.ucm-comut-sidebar .loop-title {
    font-family: "open_sanssemibold", Arial, sans-serif;
    color: #333333;
    font-size: 14px;
    line-height: 20px;
    margin: 20px 15px 10px;
}

.ucm-comut-sidebar .loop-list {
    display: block;
    margin-bottom: 10px;
    padding: 0 15px;
}

.ucm-comut-sidebar .loop-list button {
    width: 100%;
    margin: 0;
    padding: 0;
}

.ucm-cm-search .inputbox input {
    padding-right: 40px;
}

.ucm-cm-search i.ucmicons.twenty {
    top: 8px;
    right: 15px;
}

.cm-post-accordion .collapse.show {
    border: 0px none;
}

.cm-post-accordion .ucm-cm-user-img {
    width: 40px;
    height: 40px;
    overflow: hidden;
    background: #DDDDDD;
    border-radius: 100%;
    border: 2px solid #DDDDDD;
    position: relative;
    flex: 0 0 40px;
}

.cmnt {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% - 80px);
}

.fileuparea {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% - 60px);
}

.cm-post-accordion .ucm-cm-user-img img {
    max-width: 100%;
    display: block;
    margin: 0px auto;
}

.ucm-cm-user-img h4 {
    display: block;
    font-size: 20px;
    margin: 0px auto;
    text-align: center;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    line-height: 33px;
    color: #333333;
    font-style: normal;
}

.cm-post-accordion .card-header {
    position: relative;
    width: 100%;
}

.cm-post-accordion .card .card-header button.cm-show-btn {
    position: absolute;
    right: 5px;
    width: 35px;
    margin: 0;
    padding: 0;
    top: 0;
    cursor: pointer;
}

.cm-post-accordion .card .card-body {
    padding: 0 0px 0px 40px;
}

.cm-post-accordion .card-header h3 {
    font-family: "open_sanssemibold", Arial, sans-serif;
    font-size: 16px;
    line-height: 22px;
    margin: 0 0 0 10px;
    padding: 0;
    color: #333333;
    font-style: normal;
}

.cm-post-accordion .card-header h3 span {
    font-size: 14px;
    line-height: 22px;
    color: #898989;
    font-family: "open_sansregular", Arial, sans-serif;
}

.cm-post-accordion .ucm-cm-display-comment {
    font-size: 14px;
    line-height: 22px;
    font-style: italic;
    margin-bottom: 10px;
}

.cm-post-accordion .cm-nes-cmt-loop .ucm-cm-display-comment {
    margin-bottom: 0px;
}

.cm-post-accordion .ucm-cm-new-comment-box {
    background: #f1f1f1;
    margin: 10px auto;
    padding: 15px 10px;
    position: relative;
}

.posted-comment {
    margin-left: 0;
}

.cmdropDownoptwrap {
    z-index: 851;
    width: 60%;
    max-width: 650px;
}

.cmdropDownoptinner {
    border: 2px solid #e2e2e2;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    background: #fff;
    max-width: 360px;
    height: 450px;
    width: 100%;
}

.cmdropDownoptinner label {
    margin-right: 5px;
}


/* .cmscrolldata {
    max-height: 250px;
    overflow-x: hidden;
    overflow-y: scroll;
} */

.cmdropDownoptwrap::before {
    content: '';
    border-bottom: 13px dashed #ffffff;
    border-right: 13px solid transparent;
    border-left: 13px solid transparent;
    position: absolute;
    top: -11px;
    left: 16px;
    z-index: 2;
}

.cmdropDownoptwrap::after {
    content: '';
    border-bottom: 15px dashed #e2e2e2;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    position: absolute;
    top: -14px;
    left: 14px;
    z-index: 1;
}

.ucm-cm-all-nes-cmt {
    margin-top: 10px;
}

.ucm-cm-all-nes-cmt .cm-nes-cmt-loop .posted-comment {
    margin-left: 20px;
}

.ucm-cm-all-nes-cmt .cm-nes-cmt-loop .posted-comment+.ucm-cm-all-nes-cmt .cm-nes-cmt-loop .ucm-cm-display-comment {
    margin-left: 15px;
}

.ucm-cm-all-nes-cmt .cmnt {
    flex-basis: calc(100% - 40px);
}

.ucm-cm-all-nes-cmt .ml-56 {
    margin-left: 17px;
}

.ns-bg {
    background: #f7f7f7;
}

.display-file-area .attach-loop {
    width: 24%;
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    background: #f7f7f7;
    padding: 12px;
    margin: 0 4px 4px 0;
    border: 1px solid #f2f2f2;
}

.display-file-area .attach-loop a {
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.attach-loop li {
    cursor: pointer;
}

.ns-bg .display-file-area .attach-loop {
    background: #fff;
}


/* .ucm-view-detail .richtextboxarea {
    padding: 15px;
} */

.ucm-view-detail .innnerhtml-wrap {
    width: 80%;
    border: 5px solid #f1f1f1;
    margin: 0px 0px 10px 15px;
}

.ucm-view-detail .innerhtml {
    padding: 15px;
    background: #fff;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
    position: relative;
    box-sizing: border-box;
    display: block;
    margin-bottom: 0;
}

.ucm-view-detail .innerhtml h2 {
    font-size: 16px;
    line-height: 22px;
}

.ucm-view-detail .innerhtml h1 {
    font-size: 18px;
    line-height: 24px;
}

.ucm-view-detail .innerhtml h1,
.ucm-view-detail .innerhtml h2,
.ucm-view-detail .innerhtml h3,
.ucm-view-detail .innerhtml h5,
.ucm-view-detail .innerhtml h6,
.ucm-view-detail .innerhtml p,
.ucm-view-detail .innerhtml ul,
.ucm-view-detail .innerhtml li {
    background: none !important;
    margin-bottom: 5px !important;
}

.ucm-view-detail .innerhtml ul {
    margin-left: 15px !important;
}

.ucm-view-detail .innerhtml ul li+li {
    margin-top: 5px !important;
}

.ucfullbtnarea {
    border-top: 1px solid #e2e2e2;
}

.ucm-cm-new-comment-box .newattch {
    right: 5px;
    bottom: 12px;
}

.ucm-cm-new-comment-box .w85 {
    width: 85% !important;
}

.ucm-cm-new-comment-box .flex-break {
    margin-left: 52px;
}

.ml-56 {
    margin-left: 56px;
}


/*fixed div  */

.fixed-div {
    border-top-right-radius: 0px !important;
    border-top-left-radius: 0px !important;
    position: fixed;
    right: 16px;
    box-shadow: 0 4px 2px #ccc;
    z-index: 1000;
}


/*#contentheader .ucmmobilelinks{-webkit-transition: all 0.2s;  transition: all 0.2s;  overflow:hidden; height:0px; margin-top: 0rem; 
    -webkit-animation: hidearea 3s linear;
    animation: hidearea 3s linear; }
    #contentheader:hover .ucmmobilelinks { height:auto !important; margin-top: 1rem !important;}
    #contentheader.fixed-div:hover .ucmmobilelinks,#contentheader.fixed-div .ucmmobilelinks{height:auto !important; margin-top: 1rem !important; }
*/

.ucm-breadcrumbs {
    vertical-align: top;
}

@-webkit-keyframes hidearea {
    0% {
        margin-top: 1rem;
        height: auto;
        overflow: visible;
    }
    95% {
        margin-top: 1rem;
        height: auto;
        overflow: visible;
    }
    100% {
        margin-top: 0rem;
        height: 0px;
        overflow: hidden;
    }
}

@keyframes hidearea {
    0% {
        margin-top: 1rem;
        height: auto;
        overflow: visible;
    }
    95% {
        margin-top: 1rem;
        height: auto;
        overflow: visible;
    }
    100% {
        margin-top: 0rem;
        height: 0px;
        overflow: hidden;
    }
}

@media screen and (max-width:767px) {
    .fixed-div {
        right: auto;
    }
}

.innermenu {
    margin-top: 10px;
}

.innermenu ul {
    list-style: none;
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}

.innermenu ul li {
    border-bottom: 1px solid #ccc;
}

.innermenu ul li:last-child {
    border-bottom: none;
}

.innermenu ul li a {
    display: block;
    padding: 8px 10px;
    width: 100%;
}

.innermenu ul li a span {
    font-size: 11px;
}

.innermenu ul li.active>node1>a {
    border-left: 4px solid #ccc;
}

.innermenu ul li a:hover {
    background: #eee;
}

.innermenu ul li a .ucmicons {
    width: 15px;
    height: 15px;
    margin-right: inherit;
}

.innermenu ul ul {
    border-radius: 0px;
    background: #ccc;
    border: none;
}

.innermenu ul ul li {
    border-bottom: 1px solid #fff;
}

.innermenu ul ul li node1 {
    width: 100%;
}

.innermenu ul ul li a {
    padding: 3px 10px;
    padding-left: 25px;
    border-bottom: 1px solid #fff;
}

@media screen and (max-width:767px) {
    .innermenu {
        max-height: 200px;
        overflow: auto;
        border-radius: 8px;
        border: 10px solid #eee;
        background: #eee;
    }
}


/* UCM SYSTEM development mode switchtoggel  */

.ucm-sys-toggel {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 20px
}

.ucm-sys-toggel span.toggelview {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.ucm-sys-toggel span.toggelview:before {
    position: absolute;
    content: "";
    height: 13px;
    width: 13px;
    left: 5px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.ucm-sys-toggel.active span.toggelview {
    background-color: #8CA621;
}

.ucm-sys-toggel.active span.toggelview:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px);
}

.ucm-sys-toggel span.toggelview {
    border-radius: 20px;
}

.ucm-sys-toggel span.toggelview::before {
    border-radius: 50%;
}


/*Thumb View and Cart View  */


/* UCM Merchandise CSS  */

.ucm-thumbview-list {
    width: 100%;
    max-width: 1700px;
    display: -webkit-flex;
    /* Safari */
    -webkit-flex-wrap: wrap;
    /* Safari 6.1+ */
    display: flex;
    flex-wrap: wrap;
}

.ucm-thumbview-item {
    width: 220px;
    background: #e9e9e9;
    padding: 10px;
    margin: 0 15px 15px 0;
}

.ucm-thumbview-image {
    width: 100%;
    height: 150px;
    background: #fff;
    border: 1px solid #cacaca;
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    overflow: hidden;
}

.ucm-thumbview-image img {
    min-height: 90% !important;
    position: absolute;
    left: 50%;
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: auto !important;
    max-width: 90%;
    max-height: 90%;
}

.ucm-thumbview-details h3 {
    font-weight: normal;
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 10px;
    height: 37px;
    overflow: hidden;
    line-height: 1.3;
}

.ucm-thumbview-details p {
    font-size: 12px;
    color: #333;
    margin-bottom: 3px;
}

.ucm-thumbview-details b {
    color: #333;
}

.ucm-thumbview-item .ucmrlink button {
    font-size: 12px;
}


/* UCM LIST View */

.ucm-listview-loop {
    padding: 15px;
    border-radius: 8px;
    border: 1px solid #d5d5d5;
}

.ucm-listview-loop+.ucm-listview-loop {
    margin-top: 15px;
}

.ucm-listview-thumb {
    width: 200px;
    height: 140px;
    overflow: hidden;
    border: 1px solid #f1f1f1;
    padding: 5px;
}

.ucm-listview-thumb imagepreview,
.ucm-thumbview-image imagepreview {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.ucm-listview-thumb imagepreview img,
.ucm-thumbview-image imagepreview img {
    min-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
}

.ucm-listview-details p {
    font-size: 13px;
    margin: 0px;
    padding: 10px 0 0;
    line-height: 18px
}

@media screen and (max-width:575px) {
    .ucm-listview-rs-area {
        margin-top: 10px;
    }
}

@media screen and (min-width:576px) {
    .ucm-listview-rs-area {
        width: calc(100% - 220px);
    }
}

.ucm-listview-title {
    font-size: 22px;
    line-height: 28px;
    font-family: 'open_sanslight', 'Helvetica Neue', Arial, sans-serif;
}


/*  UCM cart view */

.ucm-cartview-loop {
    padding: 15px;
    border-radius: 8px;
    border: 1px solid #d5d5d5;
}

.ucm-cartview-loop+.ucm-cartview-loop {
    margin-top: 15px;
}

.ucm-cartview-thumb {
    width: 200px;
    height: 140px;
    overflow: hidden;
    border: 1px solid #f1f1f1;
    padding: 5px;
}

.ucm-cartview-thumb.cart-img {
    width: 183px;
    height: 203px;
    margin-right: 25px;
}

.ucm-thumbview-image.thumb-img {
    width: 183px;
    height: 203px;
}

.ucm-cartview-thumb imagepreview {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.ucm-cartview-thumb imagepreview img {
    min-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
}

@media screen and (max-width:575px) {
    .ucm-cart-details-area {
        margin-top: 10px;
    }
}

@media screen and (min-width:576px) {
    .ucm-cart-details-area {
        width: calc(100% - 220px);
    }
}

.other-attributes {
    color: #666;
}

.ucm-cart-details-area .smalldesc p {
    font-size: 14px;
    line-height: 20px;
}

.ellipsistext {
    overflow: hidden;
    height: 43px;
    line-height: 25px;
}

.ellipsistext:before {
    content: "";
    float: left;
    width: 5px;
    height: 43px;
}

.ellipsistext>*:first-child {
    float: right;
    width: 100%;
    margin-left: -5px;
}

.ellipsistext:after {
    content: "\02026";
    box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    float: right;
    position: relative;
    top: -25px;
    left: 100%;
    width: 2em;
    margin-left: -2em;
    padding-right: 5px;
    text-align: right;
    background-size: 100% 100%;
    /* 512x1 image,gradient for IE9. Transparent at 0% -> white at 50% -> white at 100%.*/
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAABCAMAAACfZeZEAAAABGdBTUEAALGPC/xhBQAAAwBQTFRF////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////AAAA////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////wDWRdwAAAP90Uk5TgsRjMZXhS30YrvDUP3Emow1YibnM9+ggOZxrBtpRRo94gxItwLOoX/vsHdA2yGgL8+TdKUK8VFufmHSGgAQWJNc9tk+rb5KMCA8aM0iwpWV6dwP9+fXuFerm3yMs0jDOysY8wr5FTldeoWKabgEJ8RATG+IeIdsn2NUqLjQ3OgBDumC3SbRMsVKsValZplydZpZpbJOQco2KdYeEe36BDAL8/vgHBfr2CvTyDu8R7esU6RcZ5ecc4+Af3iLcJSjZ1ivT0S/PMs3LNck4x8U7wz7Bv0G9RLtHuEq1TbJQr1OtVqqnWqRdoqBhnmSbZ5mXapRtcJGOc4t2eYiFfH9AS7qYlgAAARlJREFUKM9jqK9fEGS7VNrDI2+F/nyB1Z4Fa5UKN4TbbeLY7FW0Tatkp3jp7mj7vXzl+4yrDsYoVx+JYz7mXXNSp/a0RN25JMcLPP8umzRcTZW77tNyk63tdprzXdmO+2ZdD9MFe56Y9z3LUG96mcX02n/CW71JH6Qmf8px/cw77ZvVzB+BCj8D5vxhn/vXZh6D4uzf1rN+Cc347j79q/zUL25TPrJMfG/5LvuNZP8rixeZz/mf+vU+Vut+5NL5gPOeb/sd1dZbTs03hBuvmV5JuaRyMfk849nEM7qnEk6IHI8/qn049hB35QGHiv0yZXuMdkXtYC3ebrglcqvYxoj1muvC1nDlrzJYGbpcdHHIMo2FwYv+j3QAAOBSfkZYITwUAAAAAElFTkSuQmCC");
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(white), color-stop(50%, white));
    background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
    background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
    background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
    background: linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
}

.ucm-cartview-title {
    font-size: 22px;
    line-height: 28px;
    font-family: 'open_sanslight', 'Helvetica Neue', Arial, sans-serif;
    color: #0052a3;
    margin-bottom: 10px;
    display: block;
    background: none;
    border: 0px none;
    padding: 0;
}

.cart-tool-lists span {
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
    color: #333333;
    font-size: 16px;
}

.cart-tool-lists ul li {
    list-style: none;
    font-size: 16px;
    color: #606061;
    margin-right: 10px;
    border-right: 1px solid #ccc;
    padding-right: 10px;
}

.cart-tool-lists ul li:last-child {
    border: 0px none;
    margin: 0;
    padding: 0;
}

.cart-tool-lists {
    margin-top: 10px;
}

.ucm-thumb-header .dropdown-item,
.ucm-thumb-header .dropdown-item {
    font-size: 13px;
    line-height: 18px;
    color: #0052a3;
    background: none;
    text-align: left;
    padding: 4px 12px;
}

.ucm-thumb-header .dropdown-item:focus,
.ucm-thumb-header .dropdown-item:hover,
.ucm-thumb-header .dropdown-item.active,
.ucm-thumb-header .dropdown-item:active {
    background: none;
}

.ucm-pmm-leftradius {
    width: 100%;
}

.ucm-pmm-leftradius.fullwidth {
    width: 100%;
}

.full-screen-option .topfixed.ucm-pmm-filter-sidebar {
    top: 0;
    height: 100%;
}

.full-screen-option.pinedhead .topfixed.ucm-pmm-filter-sidebar {
    top: 132px;
}

.ucm-pmm-filter-sidebar {
    width: 320px;
    margin-left: auto;
    background: #a8a8a8;
    margin-bottom: 15px;
    height: calc(100% - 170px);
    padding-bottom: 15px;
    z-index: 842;
    width: 0;
    opacity: 0;
    border-radius: 8px;
}

.hide_sidebar_filter {
    width: 260px;
    opacity: 1;
}

searchnomodal {
    height: 100%;
    display: block;
    margin-bottom: 16px;
}

@media screen and (max-width:991px) {
    searchnomodal {
        display: block;
        width: 100%;
    }
}

@media screen and (min-width:992px) {
    .ucm-pmm-leftradius {
        width: calc(100% - 340px);
        margin: 0;
        margin-bottom: 15px;
        transition: width 0.3s ease-in;
        -webkit-transition: width 0.3s ease-in;
        -moz-transition: width 0.3s ease-in;
        -ms-transition: width 0.3s ease-in;
        -o-transition: width 0.3s ease-in;
    }
    .ucm-pmm-leftradius.ubox {
        margin-left: 0;
    }
    .newclass_added {
        width: 100%;
    }
    .ucm-pmm-filter-sidebar {
        width: 320px;
        opacity: 1;
    }
    .hide_sidebar_filter {
        width: 0;
        opacity: 0;
    }
    .topfixed.ucm-pmm-filter-sidebar {
        top: 81px;
        position: fixed;
        right: 15px;
        z-index: 842;
    }
    .pinedhead .topfixed.ucm-pmm-filter-sidebar {
        top: auto;
    }
    .pinedhead .ucm-pmm-filter-sidebar {
        height: calc(100% - 220px);
    }
}

.is-filter {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.is-filter titlebreadcrumbs {
    flex: 1;
    margin-right: 10px;
}

.showhidefilter {
    border: 0px none;
    background: #fff;
    /* position: absolute;
    right: 15px;
    top: 33px;
    -webkit-transform: translatey(-50%);
    -ms-transform: translatey(-50%);
    -moz-transform: translatey(-50%);
    transform: translatey(-50%); */
    z-index: 2;
    height: 30px;
    margin-left: auto;
    display: block;
    list-style-type: none;
    border: 1px solid #DDDDDD;
    border-radius: 6px;
    padding: 0 8px;
    margin-left: auto;
}

.is-filter .actionsgroup {
    flex: 0 0 100%;
}

.showhidefilter i {
    width: 15px;
    height: 15px;
}

.showhidefilter.ucm-tooltip.bottom::before {
    left: -30px;
}

@media screen and (max-width:575px) {
    .ucm-pmm-filter-sidebar {
        top: 81px;
        position: fixed;
        right: 15px;
    }
    .hide_sidebar_filter {
        width: 320px;
        opacity: 1;
    }
}

@media screen and (max-width:480px) {
    .is-filter {
        align-items: flex-end;
    }
    .ucm-pmm-filter-sidebar {
        top: 105px;
        position: fixed;
        right: 0;
        z-index: 842;
    }
}

.topfixed.ucm-pmm-filter-sidebar .cfilter__titlewrap {
    border-radius: 0;
}

#cartAreasidebar {
    overflow: hidden;
    height: calc(100vh - 210px);
}


/* .topfixed #cartAreasidebar {}

.full-screen-option.pinedhead #cartAreasidebar {} */

#cartAreasidebar:hover {
    overflow: auto;
}

#cartAreasidebar.overflow_inherit {
    overflow: inherit;
}

#cartAreasidebar::-webkit-scrollbar {
    width: 8px;
}

#cartAreasidebar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

#cartAreasidebar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #555;
}


/* app store module configure */

.app-stores .ac-checkbox {
    position: absolute;
    right: 20px;
    top: 7px;
}

.app-stores .ac-checkbox .custom-checkbox {
    margin: 0;
    padding: 0;
}

.app-stores .ac-checkbox .custom-checkbox label .check {
    z-index: 9;
}

.app-stores .ac-checkbox .custom-checkbox label .box {
    border: 1px solid #888;
    background: #fff;
}

.select-app-btn-lists {
    padding: 0 15px;
}

.select-app-btn-lists .ucm-shadow-button {
    margin: 15px auto;
    text-align: left;
}

.select-app-btn-lists .ucm-shadow-button.active {
    background: #fff;
}

.app-block-group {
    padding: 15px 0px 15px 15px;
}

.app-block-group .app-block-list {
    background: #f1f1f1;
    border: 1px solid #ccc;
    margin: 0 15px 15px 0;
    width: 116px;
    height: 116px;
    border-radius: 8px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
}

.app-block-group .app-block-list i.ucmicons {
    margin: 10px auto;
}

.app-block-group .app-block-list span {
    font-family: 'open_sansregular', 'Helvetica Neue', Arial, sans-serif;
    color: #333;
    display: block;
    font-size: 14px;
    line-height: 20px;
    margin: 8px auto 0;
}

.app-block-group .app-block-list:hover {
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25) !important;
}

.app-block-group .app-block-list.active {
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 800'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M400,0C179.09,0,0,179.09,0,400S179.09,800,400,800,800,620.91,800,400,620.91,0,400,0ZM620.83,252.47Q544.38,366.26,467.46,479.74q-38.11,56.37-76.57,112.51c-24.28,35.6-43.58,39.08-74.33,9.75-45.86-43.76-90.11-89.21-135.13-133.86-13.93-13.82-13.37-27.6-1.51-42.55,39.74-50,52.33-51.2,96-5.32,20.23,21.24,38.68,44.16,57.94,66.33l8.79-6.23Q415.2,373.68,487.79,267c16.55-24.24,33.26-48.4,50.67-72,14.93-20.25,24.08-21.34,45.38-7.37q14.22,9.33,28,19.27C631.4,220.9,634,232.87,620.83,252.47Z' style='fill:%236fc176'/%3E%3C/svg%3E");
    background-position: 6px 6px;
    background-repeat: no-repeat;
    background-size: 16px;
}


/* Some Global Reuseable classes for all over software */

.ucm-global-title {
    color: #333;
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 22px;
}

.ucm-global-para {
    color: #333;
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 20px;
    max-width: 800px;
}

.ucm-ui-button.ml-0 {
    margin-left: 0 !important;
}


/*training  */

.icon-circle {
    width: 30px;
    height: 30px;
    border-radius: 100%;
    border: 2px solid #02a611;
}

.view-cer-message p,
.view-cer-message h1,
.view-cer-message h2,
.view-cer-message h3,
.view-cer-message h4,
.view-cer-message h5,
.view-cer-message h6 {
    font-size: 18px;
    line-height: 29px;
    font-family: 'open_sanslight', 'Helvetica Neue', Arial, sans-serif;
    color: #333;
}

@media screen and (min-width:768px) {
    .v-cerficate .ucm-thumbview-item {
        min-width: 300px;
        width: 40%;
        max-width: 500px;
    }
}

@media screen and (max-width:767px) {
    .v-cerficate .ucm-thumbview-item {
        min-width: inherit;
        width: 100%;
        max-width: inherit;
    }
}

.v-cerficate .ucm-thumbview-item .ucm-thumbview-image {
    min-height: 350px;
    height: 350px;
}

@media screen and (min-width: 768px) {
    .modal-dialog.af-p-modal {
        max-width: 620px;
        margin: 30px auto;
    }
}


/*Video Modal  */


/*
.ucm-video-modal {
    display: block;
    position: relative;
    width: 100%;
    height: 50vh;
}

*/

.ucm-video-modal video {
    border: 1px solid #ccc;
}

.ucm-video-modal video[poster] {
    background-size: 50px;
}


/*Ucm PDF viewer  */

.ucm-pdf-viewer {
    display: block;
}

.ucm-pdf-viewer .page[data-loaded="true"] {
    border: 4px solid #ccc;
}

.ucm-pdf-pagecount input[type=text] {
    font-size: 13px;
    line-height: 18px;
    text-transform: capitalize;
    text-align: center;
    display: block;
    margin: 0 5px;
    padding: 4px 9px;
    background: #fff;
    width: 38px;
    border: 1px solid #DDDDDD;
}

.ucm-pdf-pagecount label,
.ucm-pdf-pagecount span {
    font-size: 13px;
    line-height: 18px;
    color: #333;
}

.ucm-pdf-pagecount span+span {
    margin-left: 5px;
}

.ucmmobilelinks.pdf-icons i {
    width: 14px;
    height: 14px;
}


/*grid table  td Width based on data th */

.textarea.cardlabel {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 360px;
}


/* .number.cardlabel, .currency.cardlabel {
    text-align: right;
} */


/*Start Multi touch Flow  */

.ucm-multitouch-wrap {
    display: block;
    width: calc(100% - 460px);
}

.ucm-multitouch-loop .ucm-multitouch-top {
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
}

.ucm-multitouch-top .mt-no {
    font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
    font-size: 15px;
    line-height: 23px;
    margin: 0;
    width: 25px;
    height: 25px;
    background: #636361;
    color: #fff;
    text-align: center;
    border-radius: 100%;
    margin-right: 10px;
}

.ucm-multitouch-top .mt-title {
    font-size: 16px;
    line-height: 20px;
    color: #000;
    display: block;
    max-width: calc(100% - 100px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ucm-multitouch-bottom {
    display: block;
}

.ucm-dark-button {
    border: 0px none;
    padding: 8px 15px;
    background: #606060;
    color: #fff;
    font-size: 13px;
    line-height: 19px;
    border-radius: 5px;
}

.ucm-shadow-button {
    display: block;
    border: 0;
    background: #e2e2e2;
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    padding: 8px 15px;
    width: 100%;
    box-shadow: 0px 3px 0px #868686;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}

.ucm-shadow-button:hover,
.ucm-shadow-button:focus {
    box-shadow: 0px 3px 0px #868686 !important;
}

.ucm-multitouch-top.active .icon-position {
    width: 40px;
    text-align: center;
    height: 40px;
    background: #00ad10;
    border-radius: 0 8px 8px 0px;
}

.ucm-multitouch-top.active .icon-position i {
    margin-top: 7px
}

.ucm-multitouch-top.active .mt-no {
    margin-left: 10px;
    background: #00ad10;
}

.ucm-multitouch-loop .ucm-multitouch-top.active {
    border: 0px none;
    background: #dddddd;
    border-radius: 8px;
    padding: 0;
}

.ucm-rs-multitouch-tool {
    position: absolute;
    right: 15px;
    top: 15px;
    width: 440px;
    background: #f1f1f1;
    z-index: 9;
}

.ucm-rs-multitouch-tool.expened {
    width: calc(100% - 30px);
    height: calc(100% - 30px);
}

.mtf-expender.ucm-icon-button {
    background: #606060;
    width: 40px;
    height: 45px;
    border-radius: 0;
    margin-right: 10px;
    transition: all 0.2s ease-in;
}

.mtf-expender i {
    transition: all 0.2s ease-in;
}

.expened .mtf-expender {
    background: #f27724;
}

.expened .mtf-expender i {
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.ucm-mtr-title {
    background: #636361;
    font-size: 16px;
    line-height: 22px;
    color: #fff;
    height: 45px;
}

.ucm-mtr-subtitle {
    background: #8c8c8c;
    font-size: 14px;
    line-height: 20px;
    color: #fff;
    padding: 7px 15px;
    display: block;
    width: 100%;
    font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
}

.ucm-rs-multitouch-tool .ucm-mt-area {
    display: block;
    position: relative;
}

.ucm-email-tem-loop {
    width: 200px;
    margin: 10px;
}

.ucm-email-tem-loop .email-thumb {
    position: relative;
    width: 100%;
    height: 220px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #ccc;
}

.ucm-email-tem-loop .email-thumb img {
    min-height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding: 5px;
    width: 100%;
}

.ucm-email-tem-loop .radiobox .ripple-group .radio-off {
    border: 1px solid #606060;
}

.ucm-email-tem-loop .radiobox label {
    margin: 0px;
    font-size: 13px;
    line-height: 18px;
}


/*End Multitouch Flow  */


/*Asset and Content Library  */

.ucm-toolbar-tlview {
    margin-bottom: 15px;
}

.ucm-toolbar-tlview .ucmdropdown {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.ucm-toolbar-tlview .ucmdropdown .inputbox {
    width: 180px;
}

.ucm-toolbar-tlview .ucmdropdown .inputbox input,
.ucm-toolbar-tlview .ucmdropdown .inputbox select {
    padding: 3px 10px;
}

.ucm-toolbar-tlview .ucmdropdown .ucm-ui-button {
    background: #f1f1f1;
    border: 0px none;
}

.ucm-toolbar-tlview .ucm-tl-view-btngrp button {
    background: #f1f1f1;
    border: 0px none;
    padding: 5px 8px;
    border-radius: 0px;
    font-size: 13px;
    line-height: 19px;
    color: #333333;
}

.ucm-toolbar-tlview .ucm-tl-view-btngrp button.active {
    color: #0052a3;
}

.ucm-toolbar-tlview .ucm-tl-view-btngrp button+button {
    margin-left: 3px;
}

.ucm-ui-button-group.ucm-tl-view-btngrp,
.ucm-toolbar-tlview .ucmdropdown {
    margin: 0 0 10px 0;
}

.ucm-toolbar-tlview .ucmdropdown label {
    color: #333;
    font-size: 13px;
    line-height: 18px;
}

.asset-thumb-height {
    height: 220px !important;
}

.ucm-table-thumb {
    width: 54px !important;
    height: 64px !important;
}

.ucm-thumbview-list .custom-checkbox label .box {
    border: 1px solid #a0a0a0;
    background: #fff;
    z-index: 6;
}

.ucm-option-action {
    position: relative;
}

.ucm-option-action .dropdown-toggle::after {
    display: none;
}

.ucm-option-action.ucm-options-dropdown .dropdown-menu {
    transform: translate3d(-162px, 30px, 0px) !important;
    border: 1px solid #cacaca;
    min-width: 190px;
}

.ucm-option-action.ucm-options-dropdown .dropdown-menu::before {
    border-bottom: 10px dashed #ffffff;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    position: absolute;
    top: -10px;
    right: 5px;
}

.ucm-option-action.ucm-options-dropdown .dropdown-menu::after {
    border-bottom: 10px dashed #cacaca;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    position: absolute;
    top: -11px;
    right: 5px;
}

.ucm-asstes-wrap {
    position: relative;
}

.ucm-asset-thumb-area,
.ucm-asset-list-area,
.pagination-width,
.not-foundwidth {
    width: calc(100% - 300px);
}

.ucm-assets-rightsidebar {
    background: #f1f1f1;
    position: absolute;
    top: 0;
    right: 0px;
    width: 280px;
    z-index: 12;
    height: 100%;
}

.ucm-assets-rightsidebar ul {
    margin: 0px;
    padding: 0px;
}

.ucm-assets-rightsidebar ul,
.ucm-assets-rightsidebar li {
    list-style-type: none;
    display: block;
}

.ucm-assets-rightsidebar ul li:first-child {
    margin-top: 10px;
}

.ucm-assets-rightsidebar ul li a {
    padding: 8px 15px;
    display: block;
}

.ucm-assets-rightsidebar li a span {
    order: 2;
    font-size: 16px;
    line-height: 22px;
    color: #333333;
}

.ucm-assets-rightsidebar li a i.ucmicons.md {
    width: 10px;
    height: 10px;
    margin: 0 5px 0 0;
}

.ucm-assets-rightsidebar li a i.ucmicons.md.ucmicon-minus {
    width: 13px;
    height: 13px;
}

.ucm-assets-rightsidebar ul li ul {
    background: #dddddd;
    padding-left: 35px;
}

.ucm-assets-rightsidebar ul li ul li a span {
    font-size: 14px;
    line-height: 20px;
    color: #333333;
}

.ucm-assets-rightsidebar ul li ul li a {
    padding: 4px 15px;
}


/*End Asset and content Library  */


/* Table customized for ZinfiCP Mytraining  */

@media screen and (min-width:768px) {
    course-featured .newdesignrllist #courseFeaturedInfo .ucm-radius-table tr.gridheader th:nth-child(2),
    course-featured .newdesignrllist #courseFeaturedInfo .ucm-radius-table tr.gridheader td:nth-child(2),
    sections-featured .newdesignrllist #sectionFeaturedInfo .ucm-radius-table tr.gridheader th:nth-child(2),
    sections-featured .newdesignrllist #sectionFeaturedInfo .ucm-radius-table tr.gridheader td:nth-child(2) {
        width: 250px;
    }
    course-featured .newdesignrllist #courseFeaturedInfo .ucm-radius-table tr.gridheader th:nth-child(3),
    course-featured .newdesignrllist #courseFeaturedInfo .ucm-radius-table tr.gridheader td:nth-child(3),
    sections-featured .newdesignrllist #sectionFeaturedInfo .ucm-radius-table tr.gridheader th:nth-child(3),
    sections-featured .newdesignrllist #sectionFeaturedInfo .ucm-radius-table tr.gridheader td:nth-child(3) {
        width: 250px;
    }
    course-featured .newdesignrllist #courseFeaturedInfo .ucm-radius-table tr.gridheader th:last-child,
    course-featured .newdesignrllist #courseFeaturedInfo .ucm-radius-table tr.gridheader td:last-child,
    sections-featured .newdesignrllist #sectionFeaturedInfo .ucm-radius-table tr.gridheader th:last-child,
    sections-featured .newdesignrllist #sectionFeaturedInfo .ucm-radius-table tr.gridheader td:last-child {
        width: 150px;
    }
}


/*centri module  */

.loop-centri {
    max-width: 31.33%;
    width: 100%;
    margin: 15px 25px 10px 0;
    min-width: 325px;
}

.centri-thumb {
    position: relative;
    width: 120px;
}

.centri-thumb img {
    max-width: 100%;
}

.centri-right {
    max-width: 180px;
    width: 100%;
    margin-top: 15px;
}


/* UCM global Search Page */

.ucm-global-search-pagebox {
    position: relative;
    max-width: 767px;
    width: 100%;
}

.ucm-global-search-pagebox .inputbox {
    width: 100%;
}

.ucm-global-search-pagebox .inputbox.seachbox {
    width: 45%;
}

.ucm-global-search-pagebox .ucmdropdown {
    width: 100%;
}

.ucm-global-search-pagebox .inputbox input {
    padding-right: 30px;
}

.ucm-global-search-pagebox .ucm-icon-button {
    position: absolute;
    top: 8px;
    right: 10px;
    z-index: 851;
}


/* UCM page alerts  */

.ucm-info-message {
    font-size: 15px;
    line-height: 21px;
    color: #606060;
    margin: 0px auto 10px;
}

.ucm-info-message .ucm-info-circle {
    width: 32px;
    height: 32px;
    border: 2px solid #606060;
    border-radius: 100%;
}

.ucm-info-message .ucm-info-circle i {
    margin: 3px auto 0;
}

.ucm-info-message.success {
    color: #8CA621;
}

.ucm-info-message.success .ucm-info-circle {
    border: 2px solid #8CA621;
}

.ucm-info-message.invalid {
    color: #c1362b;
}

.ucm-info-message.invalid .ucm-info-circle {
    border: 2px solid #c1362b
}

.ucm-info-message.success i.ucmicon-info {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 800'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M788.85,39.93,733.94,4a24.59,24.59,0,0,0-34,7.15l-405.37,621a24.59,24.59,0,0,1-32.89,7.86L69.7,529.14a24.59,24.59,0,0,0-33.6,9L3.3,595a24.64,24.64,0,0,0,9,33.64l233,134.65q.59.34,1.16.71l48.89,32a24.59,24.59,0,0,0,34-7.15L796,74A24.64,24.64,0,0,0,788.85,39.93Z' transform='translate%280 0%29' style='fill:%238CA621'/%3E%3C/svg%3E");
    width: 18px;
    height: 18px;
}

.ucm-info-message.invalid i.ucmicon-info {
    background: none;
    margin: -2px auto 0;
    text-align: center;
    height: auto;
}

.ucm-info-message.invalid i.ucmicon-info::before {
    color: #c1362b;
    content: '!';
    background-image: none;
    line-height: 32px;
    font-size: 26px;
    font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
    width: auto;
    height: auto;
    text-align: center;
}


/* 8CA621 */


/* Change Password page customized */


/*  */

.ucm-calendar-module {
    position: relative;
}

.ucm-calendar-module .calendar-options {
    position: absolute;
    left: calc(100% - 230px);
    top: 0;
}

.ucm-calendar-module .calendar-drop {
    border: 1px solid #DDDDDD;
    border-radius: 6px;
    padding: 0px 9px;
    background: #fff;
}

.ucm-calendar-module .calendar-drop button {
    background: none;
    cursor: pointer;
    border: 0px none;
    margin: 0;
    padding: 0;
}

.ucm-calendar-module .calendar-drop button i {
    width: 18px;
    height: 18px;
    margin: 6px 0 1px;
}

.ucm-calendar-module .calendar-drop.ucm-options-dropdown .dropdown-menu {
    transform: translate3d(-2px, 48px, 0px) !important;
    -webkit-transform: translate3d(-2px, 48px, 0px) !important;
    -moz-transform: translate3d(-2px, 48px, 0px) !important;
    -ms-transform: translate3d(-2px, 48px, 0px) !important;
    -o-transform: translate3d(-2px, 48px, 0px) !important;
}

.ucm-calendar-module .calendar-drop.ucm-options-dropdown .dropdown-menu::before {
    right: auto;
    left: 8px;
}

.ucm-calendar-module .calendar-drop.ucm-options-dropdown .dropdown-menu::after {
    right: auto;
    left: 6px;
}

.ucm-calendar-module .calendar-drop.ucm-options-dropdown .dropdown-menu li {
    margin: 12px 15px;
}

@media screen and (max-width:420px) {
    .ucm-calendar-module .fc-toolbar.fc-header-toolbar {
        display: -ms-flex;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }
    .ucm-calendar-module .fc-toolbar.fc-header-toolbar .fc-left,
    .ucm-calendar-module .fc-toolbar.fc-header-toolbar .fc-right {
        width: 100%;
        float: none;
    }
    .ucm-calendar-module .fc-toolbar.fc-header-toolbar .fc-right {
        margin-top: 5px;
        margin-left: 45px;
    }
    .ucm-calendar-module .calendar-options {
        top: 43px;
        left: 0;
    }
}


/* max 420 */

@media screen and (max-width:630px) {
    .ucm-calendar-module .fc-toolbar .fc-center {
        text-align: center;
        width: 100%;
    }
    .ucm-calendar-module .fc-toolbar .fc-center h2 {
        text-align: center;
    }
}


/* max 4630 */


/* group loop Titile */

.ucm-group-loop-bg {
    background: #e8e8e8;
    padding: 5px 10px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.ucm-group-loop-title {
    font-size: 15px;
}

.onbording {
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

.onbording+.onbording {
    margin-top: 15px;
}

.reginfo {
    font-style: italic;
    padding: 10px 0 !important;
}

.regclose {
    position: absolute;
    right: 5px;
    top: 5px;
    color: red;
    border: 1px solid red;
    background: #fff;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    line-height: 1;
}

#AccountListpopup ul {
    margin-top: 25px;
}

#AccountListpopup.ucmm-open-drop ul:before,
#AccountListpopup.ucmm-open-drop ul:after {
    display: none !important;
}

.modal-dialog.merchandise-popup ul li {
    list-style: none;
}

@media screen and (min-width:1200px) and (max-width:1322px) {
    summary-metrics .row.summarymetrics .col-xl-10.col-lg-8.col-md-9.col-sm-12.col-12 .row {
        height: 100%;
    }
}


/*include font at last  */


/* report analyst98 */

.regreenbg,
.regreybg {
    width: 40px;
    height: 40px;
    display: inline-flex;
    border-radius: 100%;
    background: #ebebeb;
    color: #636363;
    text-align: center;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 24px;
    font-family: 'open_sanssemibold', Arial, sans-serif;
    margin-top: 10px;
}

.regreenbg {
    color: #fff;
    background: #8ca621;
}

.ucmicon-contracts-report {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 644 800.1'%3E%3Ctitle%3Eucmicon%3C/title%3E%3Cpath d='M343,1499' transform='translate%28-56.05 -1%29'/%3E%3Crect x='131.95' y='128' width='238' height='76' style='fill:%23606060'/%3E%3Crect x='131.95' y='257' width='371' height='76' style='fill:%23606060'/%3E%3Crect x='131.95' y='414' width='101' height='76' style='fill:%23606060'/%3E%3Crect x='131.95' y='546' width='119' height='76' style='fill:%23606060'/%3E%3Cpath d='M637.17,120.29l-116-104.74L505.09,1h-449V763H370.2v38.1l81-49.32,81,49.32V763H700.05V176.6ZM496.2,742,457.93,719.9l-6.53-4.2-7,4.2L406.13,742V605.94a119.35,119.35,0,0,0,90.07-1ZM450,576.63a81.35,81.35,0,1,1,81.35-81.34A81.35,81.35,0,0,1,450,576.63ZM633.88,688H532.13V581.4a119,119,0,1,0-161.93,2.16V688h-248V78h381L501,172l132.88,3.34Z' transform='translate%28-56.05 -1%29' style='fill:%23606060'/%3E%3C/svg%3E")
}

.ucmicon-community-report {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 771 890.39'%3E%3Cdefs%3E%3CclipPath id='a' transform='translate%28-15 -15%29'%3E%3Ccircle cx='400' cy='400' r='375' style='fill:none'/%3E%3C/clipPath%3E%3C/defs%3E%3Ctitle%3Eucmicon%3C/title%3E%3Ccircle cx='385.5' cy='385.5' r='375.5' style='fill:none;stroke:%23636361;stroke-miterlimit:10;stroke-width:20px'/%3E%3Cg style='clip-path:url%28%23a%29'%3E%3Cpath d='M604.79,905.39c.23,0,5.56-441.95-48.49-468.15-51.35-24.9-79.55-29.34-96.76-46.55-10.92-10.92-20.36-40.4-12.87-51.53,4.88-7.25,23.94-24.05,34.32-55.52,7.06-21.39,16.45-46.17,18.22-81.17.74-14.74-2.31-49-25.4-72.11-25.49-25.46-53.44-27.57-74-27.57s-48.17,1.94-73.66,27.4c-23.1,23.06-26,57.1-25.24,71.84,1.77,35,11.25,59.3,18.31,80.69,10.38,31.47,29.48,47.33,34.35,54.58,7.49,11.13-1.92,38.74-12.84,49.66-17.21,17.21-45.41,25.38-96.76,50.28-54,26.2-49,468.15-48.81,468.15Z' transform='translate%28-15 -15%29' style='fill:%23636361'/%3E%3Cpath d='M495.18,828.22,605.92,773c-.64-28.42-1.64-59.34-3.17-90.75-3.15-64.84-7.91-117.51-14.13-156.54-10.43-65.45-22.39-74.31-24.68-75.42q-6.75-3.27-13-6.09a159.86,159.86,0,0,1-24.74,14.91C491.85,475.72,495.05,828.22,495.18,828.22Z' transform='translate%28-15 -15%29' style='fill:%23636361'/%3E%3Cpath d='M724.82,459.06c-32.65-15.84-50.59-27.31-61.53-38.25-6.95-6.95-12.95-30-8.18-37.1,3.1-4.6,15.22-17.45,21.82-37.46,4.49-13.61,10.46-30.45,11.59-52.7.47-9.37-1.47-31.73-16.15-46.39-16.22-16.2-34-17.81-47.06-17.81s-30.63,1.1-46.84,17.29c-14.68,14.67-16.52,36.24-16.05,45.62,1.13,22.25,7.16,37.67,11.64,51.27,6.6,20,18.75,30.08,21.85,34.69,4.76,7.08-1.22,24.63-8.17,31.57C582.81,414.73,576.44,422,568,430l4.72,2.26c10.83,5.25,24.69,20.4,35.89,91.48C614.9,564,619.72,618,622.87,684.26c1.29,27.15,2.19,54,2.81,78.83l130-64.87C755.8,698.22,759.19,475.72,724.82,459.06Z' transform='translate%28-15 -15%29' style='fill:%23636361'/%3E%3Cpath d='M195.38,684.33c-1.1,22.36-1.94,44.75-2.57,66.29l112.73,47.6c.15,0,3.53-322.5-30.83-339.16-10.08-4.89-18.75-9.36-26.25-13.53-4.5,2.1-9.18,4.32-14.11,6.71-2.3,1.11-14.26,10-24.74,75.48C203.36,566.76,198.58,619.45,195.38,684.33Z' transform='translate%28-15 -15%29' style='fill:%23636361'/%3E%3Cpath d='M175.26,686.3c3.2-66.3,8.05-120.32,14.41-160.56,11.25-71.1,25.12-86.24,36-91.5l2.5-1.2a110.16,110.16,0,0,1-15-12.23c-6.94-6.95-12.94-30-8.18-37.1,3.1-4.6,15.22-17.45,21.82-37.46,4.49-13.61,10.47-30.45,11.59-52.7.47-9.37-1.47-31.73-16.15-46.39-16.21-16.2-34-17.81-47.05-17.81s-30.63,1.1-46.85,17.29c-14.68,14.67-16.51,36.24-16,45.62,1.12,22.25,7.15,37.67,11.64,51.27,6.6,20,18.74,30.08,21.85,34.69,4.76,7.08-1.23,24.63-8.17,31.57-10.95,10.95-28.88,33.44-61.53,49.27-34.37,16.66-31.17,229.16-31,229.16l128,54C173.62,724.15,174.35,705.29,175.26,686.3Z' transform='translate%28-15 -15%29' style='fill:%23636361'/%3E%3C/g%3E%3C/svg%3E");
}

.dummyhtml .row.statuscount {
    height: 100%;
}

.dummyhtml .row.statuscount .ucmbgwradius {
    margin-bottom: 0;
}

.dummyhtml.col {
    padding: 0;
}

.custom-layoutre .col-sm-6.mb-2 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.5rem !important;
    -ms-flex-pack: center;
    justify-content: center;
}

.custom-layoutre .col-sm-6.mb-2 .ucm-ui-button {
    padding: 4px 10px !important;
    display: block !important;
    margin-left: 15px !important;
    margin-top: 10px !important;
    width: 123px !important;
    text-align: center;
}

status-count .status-count.ucmbgwradius {
    margin-bottom: 0;
}

.ucmiconsre {
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
    margin: 3px auto;
    z-index: 3;
    position: relative;
}

.dummyhtml .cardlabel .ucm-ui-button {
    text-align: center !important;
    width: 100%;
}

.dummyhtml .ucmgrid .gridtable.gridwithoutgrid tr:nth-child(2) td:nth-child(3) .cardlabel .ucm-progress .progress-bar {
    width: 80%;
    background-color: #8ca621 !important;
}

.dummyhtml .ucmgrid .gridtable.gridwithoutgrid tr:nth-child(4) td:nth-child(3) .cardlabel .ucm-progress .progress-bar {
    width: 30%;
    background-color: #8ca621 !important;
}

#pyramid-div .highcharts-container {
    width: 165px !important;
    height: 225px !important;
}

#pyramid-div .highcharts-root {
    width: 165px !important;
    height: 225px !important;
}

.funnelchart .col {
    -ms-flex: 0 0 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

@media screen and (max-width:1200px) {
    .ucmrcanvasarea .ml-auto.mt-1,
    .ucmrcanvasarea .ml-auto.mb-2,
    .ucmrcanvasarea .titleselect .ml-auto {
        margin-top: .95rem !important;
    }
}

@media screen and (min-width:481px) {
    .customloop.statuslistloop figure.flex-revamp {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}

.engvalue,
.pipelinesumloop .summerycount,
.totalpipetitle span.sumtotal {
    color: #8ca621;
}

.topsummarytitle .ucm-ui-button {
    font-family: "open_sansregular", Arial, sans-serif;
}


/* import conponent */

.showimportdata {
    font-size: 12px;
    line-height: 18px;
}

.showimportdata .ucm-border-bottom:last-child {
    border: 0px none;
}

.showimportdata .excelvalue {
    width: 40%;
}

.showimportdata span {
    padding: 10px;
}

.showimportdata i {
    margin: inherit;
}


/* not global search */

.ucm-not-global-search .custom-checkbox {
    width: calc(100% - 80%);
    display: block;
    margin: 0;
}

.ucm-not-global-search .inputbox {
    max-width: 400px;
}

.ucm-not-global-search .custom-checkbox label span {
    right: 0;
    left: auto;
}

.ucm-not-global-search .custom-checkbox label .check {
    right: 7px;
    left: auto;
}

.ucm-not-global-search .custom-checkbox label .data {
    padding-right: 30px;
    font-size: 13px;
    line-height: 18px;
}

.ucm-not-global-search .custom-checkbox label {
    display: block;
    height: 20px;
}

.ucm-not-global-search .ucm-ml-xl {
    margin-left: calc(100% - 80% + 10px);
}

@media screen and (max-width:767px) {
    .ucm-not-global-search .custom-checkbox {
        width: calc(100% - 50%);
    }
    .ucm-not-global-search .inputbox {
        max-width: calc(100% - 55%);
    }
}


/* Accept and Close cookies alertPopup */

.alertPopup {
    width: 100%;
    margin-top: 0;
    position: fixed;
    bottom: 0;
    height: auto;
    z-index: 20000000000000;
}

.alertPopup .alert {
    width: 100%;
    box-shadow: 0 0 5px 2px #666;
    background: #ebebeb;
    padding: 5px 15px;
    margin: 0;
    border-radius: 0;
}

.alartContent {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
}

.alartContent p {
    font-size: 13px;
    line-height: 18px;
    text-align: left;
    width: calc(100% - 150px);
    color: #333;
}

.alartContent .closebtn {
    color: #333;
    text-decoration: none;
    font-family: 'open_sanssemibold';
    order: 3;
    width: 130px;
    margin-left: 15px;
    cursor: pointer;
}

.alartContent .closebtn:hover {
    opacity: 0.7;
}


/* dynamiccontent */

dynamiccontent {
    display: block;
    min-height: calc(100vh - 120px);
    margin-top: 81px;
}


/* price calculor */

.pricebanner {
    margin-top: 70px;
}

.pricebanner .ucmbanner {
    position: relative;
    margin-bottom: 0;
}

.pricebanner .ucmbanner img {
    width: 100%;
}

.pricebanner .bannercaption {
    position: absolute;
    top: 50%;
    right: 5%;
    width: 70%;
    color: #fff;
    max-width: 700px;
    transform: translateY(-50%);
    text-align: left;
}

.bannercaption h2 {
    font-size: 40px;
    line-height: 1.3;
    color: #fff;
    font-family: 'open_sanslight';
}

.priceheadign {
    position: relative;
    max-width: 60%;
    margin: 40px auto;
    text-align: center;
}

.priceheadign h3 {
    color: #00adff;
    font-size: 22px;
    line-height: 28px;
    position: relative;
    z-index: 2;
    background: #fff;
    padding: 0 20px;
    display: inline-block;
}

.priceheadign::before {
    content: '';
    background: #e8e8e8;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    position: absolute;
    width: 100%;
    height: 2px;
}

.price-flex,
.actbs {
    max-width: 1400px;
    margin: auto;
}

.pstab {
    max-width: 1400px;
    padding: 0 15px;
}

.pstab .ucm-ui-link {
    font-size: 16px;
    color: #00adff;
    opacity: 0.7;
    transition: opacity 0.3s ease-in;
    -webkit-transition: opacity 0.3s ease-in;
    -moz-transition: opacity 0.3s ease-in;
    -ms-transition: opacity 0.3s ease-in;
    -o-transition: opacity 0.3s ease-in;
}

.pstab .ucm-ui-link.active {
    opacity: 1;
}

.pstab .ucm-ui-link+.ucm-ui-link {
    margin-left: 30px;
    border-left: 1px solid #616161;
    padding-left: 30px;
    border-radius: 0;
}

.pstab .num {
    width: 25px;
    height: 25px;
    background: #757575;
    color: #fff;
    font-size: 17px;
    line-height: 21px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

.pcloop {
    flex: 1 1 0;
    margin: 0 15px;
    border: 2px solid #e1e1e1;
    min-width: 230px;
    margin-bottom: 15px;
}

.pcloop h4 {
    background: #f1f1f1;
    border-bottom: 2px solid #e1e1e1;
    display: block;
    padding: 15px;
    color: #333333;
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 5px;
}

.scale {
    flex: 4 1 0;
}

.pcloop li i {
    width: 23px;
    height: 23px;
    margin: 0 12px 0 0;
}

.pcloop li span {
    font-size: 14px;
    line-height: 20px;
    color: #333333;
}

.pcloop li {
    border-bottom: 1px solid #dedede;
    padding: 10px;
    transition: background 0.3s ease-in;
    -webkit-transition: background 0.3s ease-in;
    -moz-transition: background 0.3s ease-in;
    -ms-transition: background 0.3s ease-in;
    -o-transition: background 0.3s ease-in;
}

.pcloop li:last-child {
    border: none;
}

.pcloop li.active {
    background: #e4e4e4;
}

.pcloop .ucm-info-button {
    background: #afafaf;
    margin-left: auto;
}

.pcloop li.active .ucm-info-button {
    background: #7a7a7a;
}

.pcloop li .ucm-info-button i {
    margin: auto;
}

.custom-checkbox.circle {
    margin-bottom: 0;
    top: -15px;
    display: block;
}

.custom-checkbox.circle label .check {
    border-color: #fff;
    left: 7px;
    top: 3px;
    border-width: 3px;
    width: 7px;
    z-index: 9;
}

.custom-checkbox.circle label .box {
    border: 1px solid #646465;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    transition: background 0.3s ease-in;
    -webkit-transition: background 0.3s ease-in;
    -moz-transition: background 0.3s ease-in;
    -ms-transition: background 0.3s ease-in;
    -o-transition: background 0.3s ease-in;
}

.custom-checkbox.circle label {
    position: inherit;
}

.custom-checkbox.circle input[type=checkbox]:checked~label .box {
    border: none;
    background: #6fc176;
}

.grd-btn {
    background: rgba(162, 183, 76, 1);
    background: -moz-linear-gradient(top, rgba(162, 183, 76, 1) 0%, rgba(146, 169, 42, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(162, 183, 76, 1)), color-stop(100%, rgba(146, 169, 42, 1)));
    background: -webkit-linear-gradient(top, rgba(162, 183, 76, 1) 0%, rgba(146, 169, 42, 1) 100%);
    background: -o-linear-gradient(top, rgba(162, 183, 76, 1) 0%, rgba(146, 169, 42, 1) 100%);
    background: -ms-linear-gradient(top, rgba(162, 183, 76, 1) 0%, rgba(146, 169, 42, 1) 100%);
    background: linear-gradient(to bottom, rgba(162, 183, 76, 1) 0%, rgba(146, 169, 42, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#a2b74c', endColorstr='#92a92a', GradientType=0);
    background-repeat: no-repeat;
    border-radius: 5px;
    color: #ffffff;
    text-transform: uppercase;
    border: 1px solid #7e951e;
    padding: 10px 25px;
    font-weight: bold;
}

.keytitle {
    background: #962aa6;
    display: block;
    padding: 10px;
    color: #fff;
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 5px;
}

.scalechild .pcloop:nth-child(2) .keytitle {
    background: #f27724;
}

.scalechild .pcloop:last-child .keytitle {
    background: #8ca621;
}

.scalechild .pcloop {
    border: none;
}

.scalechild .pcloop ul {
    border: 2px solid #e1e1e1;
    border-top: 0px none;
}

.calc-table {
    margin: 0;
    padding: 0;
    border: none;
    width: 100%;
}

.calc-table .cols {
    padding: 10px;
    border: none;
    border-right: 1px solid #dedede;
    min-height: 42px;
}

.gridprice .cols:last-child {
    border: none;
}

.gridprice {
    border-bottom: 1px solid #dedede;
}

.calc-table .thead .cols {
    background: #f1f1f1;
    font-size: 18px;
    line-height: 24px;
    padding: 10px 12px;
    color: #333333;
    text-align: left;
    border: 0px none;
}

.gridprice .cols {
    flex: 1;
}

.doublecols.cols:first-child {
    flex: 2;
}

#accordion .accodion-group .loopprice {
    background: #e7f7fe;
}

#accordion .accodion-group:nth-child(3) .loopprice {
    background: #fbe1ff;
}

#accordion .accodion-group:nth-child(4) .loopprice {
    background: #fee6d5;
}

#accordion .accodion-group:last-child .loopprice {
    background: #f4fecc;
}

.loopprice a {
    font-size: 16px;
    line-height: 22px;
    font-family: 'open_sanssemibold';
    color: #333;
}

.gridprice .inputbox .ucm-select select {
    min-width: 100px;
    height: auto;
    min-height: 28px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.calc-table .cols.smallpad {
    padding: 6px 10px;
}

.labelname {
    font-size: 20px;
    line-height: 26px;
    color: #333;
    padding: 15px;
}

.actbs .ucm-ui-link {
    font-size: 16px;
    color: #00adff;
    margin-right: 15px;
}

.zinfilinks {
    padding: 0 15px;
}

.zinfilinks li {
    border: none;
}

.zinfilinks li button {
    font-size: 16px;
    color: #00adff;
}

.dynamiccontnet .nodatafound {
    background: none;
}

.dynamiccontnet dynamiccontent {
    margin-top: 40px;
    min-height: inherit
}

@media screen and (min-width:481px) and (max-width:767px) {
    .bannercaption h2 {
        font-size: 22px;
    }
    .pricebanner .bannercaption {
        right: 0;
        width: 60%;
    }
}

@media screen and (max-width:480px) {
    .pricebanner {
        margin-top: 94px;
    }
    .bannercaption h2 {
        font-size: 14px;
    }
    .pricebanner .bannercaption {
        right: 0;
        width: 60%;
    }
    .calc-table .thead .cols {
        font-size: 12px;
        padding: 8px 5px;
    }
    .gridprice .inputbox .ucm-select select {
        min-width: 60px;
        min-height: 34px;
    }
    .calc-table .cols {
        min-height: 48px;
    }
    .priceheadign {
        max-width: 100%;
    }
    .priceheadign h3 {
        font-size: 15px;
        line-height: 21px;
        padding: 0 5px;
        max-width: 70%;
    }
    .pstab .ucm-ui-link+.ucm-ui-link {
        margin-left: 10px;
        padding-left: 10px;
    }
    .pstab .num {
        width: 22px;
        height: 22px;
        font-size: 15px;
        line-height: 24px;
        margin-right: 7px;
    }
    .pstab {
        padding: 0;
    }
    .labelname {
        font-size: 15px;
        line-height: 22px;
    }
    .labelname.value {
        flex: 0 0 30%;
    }
    .pstab .ucm-ui-link {
        font-size: 13px;
    }
}

.ucm-css-tooltip {
    position: relative;
    border: none;
    background: none;
    transition: all 0.4s ease-in;
}

.ucm-card-accordion .card-header .card-grp .ucm-css-tooltip span {
    padding: 0;
}

.ucm-css-tooltip i {
    margin-top: 3px;
}

.ucm-css-tooltip:hover,
.ucm-css-tooltip:focus {
    outline: none
}

.ucm-data-tooltip {
    visibility: hidden;
    opacity: 0;
    height: 0;
    position: absolute;
    background: #fff;
    border: 1px solid #b1b1b1;
    border-radius: 6px;
    min-width: 300px;
    max-width: 300px;
    top: 35px;
    left: 0px;
    padding: 10px;
    z-index: 900;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1), -2px 0px 5px rgba(0, 0, 0, 0.1), 2px 0 5px rgba(0, 0, 0, 0.1), 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.ucm-css-tooltip:hover .ucm-data-tooltip {
    visibility: visible;
    opacity: 1;
    height: auto;
}

.ucm-tooltip-data {
    max-height: 250px;
    overflow: auto;
    font-size: 13px;
    line-height: 18px;
}

.ucm-data-tooltip::before {
    content: '';
    position: absolute;
    top: -8px;
    left: 17px;
    z-index: 2;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 20px 10px 0px;
    border-color: transparent transparent #ffffff transparent;
}

.ucm-data-tooltip::after {
    content: '';
    border-style: solid;
    border-width: 0 20px 10px 0px;
    border-color: transparent transparent #b1b1b1 transparent;
    position: absolute;
    top: -10px;
    left: 16px;
    z-index: 1;
}

.isvalidtrue {
    z-index: 1035 !important;
}


/* EDGE SPECIFIC */

@supports (-ms-ime-align: auto) {
    .ucmmobilelinks {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        display: -ms-flexbox;
        display: flex;
    }
}


/* IE 11 */

@media screen and (-ms-high-contrast: active),
screen and (-ms-high-contrast: none) {
    .ucmmobilelinks {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        display: -ms-flexbox;
        display: flex;
    }
}


/*
* date picker zindex issue solved
*/

#mainwrapper.zindex {
    z-index: 1033 !important;
    position: relative;
}

.ucm-pmm-filter-sidebar.topfixed.zindex {
    z-index: 1033 !important;
}

.inputbox.ucmdateicon.zindex {
    z-index: 1032 !important;
}

.rootloop {
    display: flex;
    align-items: flex-end;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.rootloop>.form-group {
    flex: 0 0 100%;
    display: flex;
    align-items: flex-start;
    margin: 0;
    flex-wrap: wrap;
}

.multiselectsc {
    position: relative;
}

@media screen and (min-width:992px) {
    .rootloop>.form-group {
        flex-grow: 0;
        flex-shrink: 0;
        flex-basis: calc(100% - 34px);
    }
}

.rootloop .ucm-info-button {
    margin-left: auto;
}

@media screen and (min-width:992px) {
    .rootloop>.form-group>label {
        flex: 0 0 37%;
        max-width: 37%;
        padding-top: 8px;
    }
    .rootloop>.form-group>.inputbox {
        max-width: 60%;
        flex: 0 0 60%;
    }
    .rootloop {
        align-items: center;
    }
}

.rootloop .ucm-css-tooltip {
    top: -7px;
}

@media screen and (max-width:991px) {
    .form-double label {
        text-align: left;
    }
}

.ucmvlabel .ucm-info-button {
    margin-right: 5px;
}

.card-grp .ucm-info-button {
    margin-left: 5px;
}

fileupload {
    width: 100%;
}

@media screen and (min-width:768px) {
    fileupload {
        width: 56%;
    }
}

.filteraction {
    margin-right: 10px;
}


/*
* Get from UCM 10  [05/07/2019]
*/

.df {
    display: flex;
}

.aic {
    align-items: center;
}

.fw {
    flex-wrap: wrap;
}

cardlayout .panel-drop .dropable-block {
    margin: 15px 0;
}


/* card layout builder system */

.cardlayoutbuilder .dropable-block {
    padding: 17px 0;
    min-height: inherit;
}

.cardlayoutbuilder .ucm-cart-details-area {
    max-width: inherit;
}

.cardlayoutbuilder .crd-btns .resettings {
    top: inherit;
    right: 4px;
}

.cardlayoutbuilder .crd-btns .hanger {
    right: 5px;
    top: inherit;
}

.cardlayoutbuilder .actionflow-btn {
    min-height: 38px;
}

.other-attributes.system .attr-items {
    border: 1px solid #f1f1f1;
    padding: 10px;
    margin: 6px 0 6px 0;
}

.other-attributes.system .attr-items::before {
    display: none;
}

.ucmcardscroll {
    overflow: hidden;
}

.ucmcardscroll:hover {
    overflow: auto;
}

.ucmcardscroll::-webkit-scrollbar-track {
    background-color: rgb(138, 138, 138);
    border-radius: 10px;
}

.ucmcardscroll::-webkit-scrollbar {
    width: 8px;
    background-color: rgb(138, 138, 138);
    border-radius: 10px;
}

.ucmcardscroll::-webkit-scrollbar-thumb {
    background-color: rgb(223, 223, 223);
    border-radius: 10px;
}

.modal-image-wrp {
    max-height: 160px;
    max-width: 160px;
    display: block;
    margin: 0px auto 20px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.modal-image-wrp img {
    max-width: 100%;
    display: block;
    padding: 10px;
}

.reportheader-flex {
    display: flex;
    align-items: flex-end;
}

@media screen and (min-width:481px) {
    .reportheader-flex {
        align-items: center;
    }
}

.imgpreview {
    max-width: 110px;
    max-height: 110px;
    border: 1px solid #ccc;
}

.imgpreview img {
    max-width: 100%;
    max-height: 100%;
}

.ucm-realimage-modal p {
    text-align: center;
    font-size: 14px;
}

.cpop__imagebtn {
    margin: 20px auto 0;
    text-align: center;
}

.cpop__imagebtn i {
    display: none;
}


/* Ie specific computer */

@media screen and (-ms-high-contrast: active),
screen and (-ms-high-contrast: none) {
    status-count .status-count .row .col.flex-grow-0 {
        flex: 1;
    }
}

.ucm-icon-button span {
    font-size: 14px;
}


/* community*/

.ucm-tfa-wrap {
    margin-bottom: 2.3rem !important;
}


/* .dynamicsearchmodal .ucm-radius-table {
    overflow: auto;
} */

.dateicon.ulink {
    cursor: default;
    color: #333;
}

.dynamicsearchmodal .ucm-closeicon {
    padding: 0;
    width: 18px;
    height: 18px;
    font-size: 9px;
    margin-left: 2px;
}

#openmyeditor .ucm-ui-button+.ucm-ui-button {
    margin-left: 8px;
}

dynamic-search-attribute .ucm-ui-button {
    margin-left: 10px;
}


/* anastasia create account fixing */

#AccountListpopup {
    top: 47px;
}


/* campaign-detail-new */

campaign-detail-new .ucmradiusbtngrp.fullsceren {
    display: none !important;
}

#setUpGroups .radiobox .ripple-group {
    top: 2px;
}

.recordlistnotfound {
    height: auto;
}

.chkbox-flex .custom-checkbox {
    flex: 0 0 50%;
    margin-bottom: 8px;
}

.chkbox-flex--group.chkbox-flex .custom-checkbox {
    flex: 0 0 100%;
}

@media screen and (min-width:576px) {
    .chkbox-flex .custom-checkbox {
        flex: 0 0 25%;
    }
    .chkbox-flex--group.chkbox-flex .custom-checkbox {
        flex: 0 0 50%;
    }
}


/* @media screen and (max-width:480px) {
    .chkbox-flex .custom-checkbox {
        flex: 0 0 100%;
        padding: 0;
    }
} */


/*
* New duration swich case
*/

.durationwrp {
    flex: 0 0 100%
}

.durationfield {
    padding-top: 9px;
}

.dur_grp input {
    border: 1px solid #ccc;
    padding: 6px;
}

.dur_grp .days {
    max-width: 60px;
    display: block;
    width: 60px;
}

.dur_grp .hours,
.dur_grp .minutes {
    max-width: 50px;
    width: 50px;
    display: block;
}

.dur_grp span {
    margin-top: 2px;
    font-size: 12px;
}

.durationwrp {
    display: flex;
    align-items: center;
}

@media screen and (min-width:992px) {
    .durationwrp {
        max-width: 58%;
        flex: 0 0 58%;
    }
    .dur_grp {
        display: flex;
        flex-direction: column;
        margin-right: 10px;
    }
}


/* misc fix*/

.cmdropDownoptwrap .cmdropDownoptinner {
    position: relative !important;
}

@media screen and (max-width:1199px) {
    .cmdropDownoptinner .radiobox {
        display: inline-flex;
        align-items: center;
    }
    .cmdropDownoptinner .radiobox .ripple-group {
        top: 0;
        margin-right: 5px;
        width: 33px;
    }
    .cmdropDownoptinner {
        height: 480px;
        min-width: 290px;
    }
    .cmdropDownoptinner .pl-3 {
        padding: 0 15px !important;
    }
    .bottom-abs .d-flex {
        flex-wrap: wrap;
    }
}


/* workflow sheet */

dynamic-search-attribute .input-with-ucmlink .ucmlink {
    margin-left: 10px !important;
}

workflow-multiselect .gridtable .gridheader th.ifselected,
workflow-multiselect .gridtable .gridheader td.ifselected {
    min-width: 120px !important;
    width: auto !important;
}

.cfilter__group .inputbox {
    width: 100%;
}


/*fix date picker */

.colorpickersc {
    z-index: 851;
}

color-picker .color-picker[_ngcontent-c1] {
    left: auto !important;
    top: 40px !important;
    right: 0 !important;
}

.color-picker[_ngcontent-c1] .arrow-right[_ngcontent-c1] {
    display: none !important;
}


/*
* Fixed create view popup
*/

.ucm-radius-table.mt-4.ucmgrid.auto .rwd-table.gridtable {
    width: 1500px;
}

.dattrflex {
    display: flex;
    align-items: center;
}

.dattrflex-data {}

.dynamicsearchmodal .dattrflex .ucm-closeicon {
    margin-left: 8px;
    flex: 0 0 18px;
}

@font-face {
    font-family: 'open_sanslight';
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Light-webfont.eot');
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'), url('../ucmasset/ucm-core/fonts/OpenSans-Light-webfont.woff') format('woff'), url('../ucmasset/ucm-core/fonts/OpenSans-Light-webfont.ttf') format('truetype'), url('../ucmasset/ucm-core/fonts/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansbold';
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Bold-webfont.eot');
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('../ucmasset/ucm-core/fonts/OpenSans-Bold-webfont.woff') format('woff'), url('../ucmasset/ucm-core/fonts/OpenSans-Bold-webfont.ttf') format('truetype'), url('../ucmasset/ucm-core/fonts/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sanssemibold';
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Semibold-webfont.eot');
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'), url('../ucmasset/ucm-core/fonts/OpenSans-Semibold-webfont.woff') format('woff'), url('../ucmasset/ucm-core/fonts/OpenSans-Semibold-webfont.ttf') format('truetype'), url('../ucmasset/ucm-core/fonts/OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansregular';
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Regular-webfont.eot');
    src: url('../ucmasset/ucm-core/fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('../ucmasset/ucm-core/fonts/OpenSans-Regular-webfont.woff') format('woff'), url('../ucmasset/ucm-core/fonts/OpenSans-Regular-webfont.ttf') format('truetype'), url('../ucmasset/ucm-core/fonts/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}