.cctp-portfolio-wrapper {
    width: 100%;
    display: flex;
    font-family: sans-serif;
    box-sizing: border-box;
    padding: 10px;
}
#cctp-allocation-view line{
    display:none;
}

.cctp-portfolio-sidebar {
    max-width: 30%;
    flex: 0 0 30%;
    padding-right: 20px;
    box-sizing: border-box;
}
.cctp-wrap {
    max-width: 100% !important;
}

.cctp-portfolio-sidebar .current .delete_portfolio{
 display: none;

}
.cctp-empty-transaction {
    text-align: center;
    padding: 30px 0px;
    border-top: 1px solid #ecf1fb;
    border-bottom: 1px solid #ecf1fb;
    margin: 30px 0px;
} 

.cctp-asset-wrapper {
    max-width: 70%;
    flex: 0 0 70%;
    text-align: right;
}
#cctp-public-portfolio-app .cctp-asset-wrapper {
    max-width: 100%;
    flex: 0 0 100%;
    text-align: right;
}
.cctp-row , .cctp-col{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px 0px;
    text-align: left;
    position: relative;
}
.cctp-entity-wrap {
  
    position: absolute;
    right: 0;
}

.cctp-col.current:after{
    display: none;
}
.cctp-col{
    padding: 10px 20px;
}
.cctp-col .cctp-portfolio-check-icon {
    color: #3861fb;
    font-weight: 800;
    position: absolute;
    right: 10px;
    display: none;
}
.cctp-col.current .cctp-portfolio-check-icon {
display: block;
margin-right: 10px;
}
.cctp-icon {
    background: rgb(207 214 228);
    max-width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    margin-right: 10px;
    width: 20%;
    flex: 0 0 20%;
}
.cctp-content {
    max-width: 70%;
    flex: 0 0 70%;
    padding: 0px 30px 0px 0px;
    box-sizing: border-box;
}
.cctp-entity-wrap {
    position: absolute;
    right: 0;
}
.cctp-portfolio-wrapper span.cctp-title {
    display: block;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    text-transform: capitalize;
    line-height: 20px;
    color: #000;
}
.cctp-portfolio-wrapper span.cctp-price,.cctp-crntprice {
    font-size: 14px;
    padding: 4px 0px;
    display: block;
}
.cctp-plusicon {
    background: #000000;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 20px 0px 10px;
    cursor: pointer;
}
.cctp-portfolio-sidebar .cctp-row:first-child {
    padding: 10px 20px;
    border-bottom: 1px solid #ecf1fb;
    position: relative;
}
.cctp-portfolio-sidebar button.slide-button{
    position: absolute;
    right: 0;
    bottom: -10px;
    background: #a6b0c3;
    text-align: center;
    line-height: 16px;
    border-radius: 4px;
    color: #fff;
    font-size: 11px;
    cursor: pointer;
    border: none;
}
.cctp-row.cctp-create-portfolio {
    padding: 10px 20px;
}
.cctp-portfolio-sidebar .cctp-col:hover,
.cctp-row.cctp-create-portfolio:hover{
    background-color:#f8fafd;
    cursor: pointer;
}
.cctp-row.cctp-create-portfolio:hover {
    background: transparent;
}
.cctp-total-price {
    max-width: 40%;
    width: 40%;
    display: flex;
    align-items: center;
}
.cctp-share-portfolio .cctp-clipboard-icon{
    line-height: 20px;
    margin-right: 6px;
}

.cctp-share-portfolio{
    display:flex;
}
input.cctp-url-clipboard{
    height: 32px;
    border-radius: 8px 0px 0px 8px;
    border: 1px solid;
}
.cctp_switcher_loader{
    margin-left: 4px;
    line-height: 1px;
}
.cctp-copy-clipboard{
    width: fit-content;
    padding: 0px 16px;
    height: 32px;
    border-radius: 0px 8px 8px 0px;
    border: none;

    cursor: pointer;
    font-size: 18px;
    background-color: #3861fb;
    color: #fff
}
.cctp-clipboard-trigger{
    display: flex;
}

.cctp-share-portfolio .cctp-share {
    line-height: 20px;
    margin-right: 6px;
    color: black;
    font-size: 17px;
    font-weight: 500;
    cursor: pointer;
}

.cctp-name a {
    color: black;
    text-decoration: none !important;
}

.cctp-btn {
    max-width: 30%;
    flex: 0 0 30%;  
    text-align: right;
}
.cctp-empty-portfolio .cctp-btn {   
    margin-left: 28%;   
}
.cctp-empty-transaction .cctp-btn {
    width: 100%;
    text-align: center;
    margin-top: 10px;
    max-width: 100%;
}
.cctp-btn button,button.cctp-delete-transaction {
    width: fit-content;
    padding: 0px 16px;
    height: 32px;
    border-radius: 8px;
    border: 0px;
    cursor: pointer;
    font-size: 16px;
}
.cctp-portfolio-wrapper span.cmc_coin_symbol {
    text-transform: capitalize;
}
.cctp-wrap button.addnew-btn, .cctp-wrap  button.cctp-delete-transaction {
    background-color: #3861fb;
    color: #fff;
}
.cctp-portfolio-wrapper button.addnew-btn:focus,
.cctp-portfolio-wrapper button.cctp-delete-transaction:focus {
    outline-offset: 0px;
    outline: 0px dotted currentColor;
}
.cctp-portfolio-wrapper span.price {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.5;
    display: inherit;
}
.cctp-portfolio-wrapper span.changes {
    background: #16c784;
    padding: 4px 12px;
    color: #fff;
    border-radius: 5px;
    margin-left: 10px;
    font-size: 14px;
}
.cctp-portfolio-wrapper span.changes-up ,.cctp-portfolio-wrapper td.changes-up{
    color: #16c784;
    font-size: 12px;
    display: block;
    margin-left: 55px;
    position: relative;
}
.rdt_Table .cctp-price-up {
    color: #16c784;
    font-size: 12px;  
}

.cctp-portfolio-wrapper span.changes-up:before,.cctp-portfolio-wrapper td.changes-up:before,
.cctp-price-up span.cctp-percentage:before {
    content: "";
    position: absolute;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-bottom: 8px solid #16c7a4;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 10px;
    display: inline-block;
    left:-25px;
}
.cctp-price-up span.cctp-percentage:before {
    border-right: 3px solid transparent;
    border-left: 3px solid transparent;
    border-bottom: 6px solid #16c7a4;
    left: -20px;
}
.cctp-portfolio-wrapper span.changes-down, .cctp-portfolio-wrapper td.changes-down {
    color: #ff0000;
    font-size: 12px;
    display: block;
    margin-left: 55px;
    position: relative;
}
.rdt_Table .cctp-price-down {
    color: #ff0000;
    font-size: 12px;    
}
.cctp-price-down span.cctp-percentage-profit-loss {
    color: #ff0000;
}
.cctp-price-up span.cctp-percentage-profit-loss {
    color: #16c784;
}
.cctp-price-down,.cctp-price-up{
    margin-left: 0;
}
.cctp-price-up span.cctp-percentage {
    position: relative;
}

.cctp-portfolio-wrapper span.changes-down:before,.cctp-portfolio-wrapper td.changes-down:before,
.cctp-price-down span.cctp-percentage:before {
    content: "";
    position: absolute;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-top: 8px solid #ff0000;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 10px;
    display: inline-block;
    left:-25px;
}
.cctp-price-down span.cctp-percentage:before {
    border-right: 3px solid transparent;
    border-left: 3px solid transparent;
    border-top: 6px solid #ff0000;
    left: -20px;
}
.cctp-price-down span.cctp-percentage:before {
    left: -10px;
}
.cctp-changes {
    display: flex;
    align-items: center;
}
span.cctp-24h-changes {
    background: #eaeef5;
    padding: 4px;
    border-radius: 4px;
    font-size: 12px;
    margin-left: 10px;
}

.cctp-portfolio-lists .cctp-col {
    width: 20%;
}

.cctp-portfolio-lists .cctp-col span.cctp-title {
    display: block;
    width: 100%;
    margin-bottom: 10px;
    color: gray;
}
.cctp-portfolio-lists .cctp-row,.cctp-portfolio-lists .cctp-col{
    padding: 0px;
}
.cctp-portfolio-lists .cctp-row:nth-child(4){
    margin-top:30px;
}


/* Table Style Start here */
.cctp-asset-table .hLGqlg,
 .cctp-asset-table .hCBnvI,
  .cctp-asset-table .iAwKFK {
    background-color: #fff;
}
.cctp-name {
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    max-width: 100%;
    width: 200px;
    cursor: pointer;
}
.cctp-coin-detail {
    display: flex;
    width: 100%;
}
.cctp-name span.cctp_coin_symbol {
    display: block !important;
    margin-left: 40px;
}
.cctp-portfolio-wrapper span.cctp-name_symbol {
    font-weight: 100;
    font-size: 14px;
    padding-left: 5px;
    position: relative;
}
.cctp-portfolio-table span.cctp_coin_symbol {
    overflow: hidden;
}
img.cctp_logo {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}
.cctp-portfolio-wrapper span.cctp-symbol {
    font-weight: 100;
    font-size: 12px;
    position: relative;
    }
.cctp-sell span.cctp-symbol{
    color: red;
}
.cctp-buy span.cctp-symbol{
    color: green;
}
.cctp-buy span.cctp-symbol:before {
    content: "+";
}
.cctp-sell span.cctp-symbol:before {
    content: "-";
}
.cctp-portfolio-wrapper span.add, .cctp-portfolio-wrapper span.more {
    font-size: 25px;
    font-weight: 100;
    color: #cfd6e4;
    padding: 0px 10px;
    cursor: pointer;
}
.cctp-portfolio-wrapper span.more {
    border: 2px solid transparent;
    border-radius: 50%;
}
.cctp-portfolio-wrapper span.more:hover {
    border: 2px solid #cfd6e4;
    border-radius: 50%;
}
.cctp-portfolio-table tbody tr:hover{
    background-color:#f8fafd !important;
    cursor: pointer;
}
#cctp-portfolio-table_wrapper div#cctp-portfolio-table_info {
    display: none;
}
.cctp-performance {
    width: 33.33%;
    padding-right: 30px;
    box-sizing: border-box;
    margin: 30px 0px;
}
h3.cctp-asset-title {
    text-align: left;
    margin: 20px 0px 0px 0px;
    border-bottom: 1px solid #edf1f7;
}
.cctp-performance span.cctp-title {
    margin-left: 40px;
}
.cctp-performance:first-child span.cctp-title,
.cctp-performance:first-child span.changes-down,
.cctp-performance:first-child span.changes-up {
margin-left: 0px;
}
.cctp-performance:first-child > span.changes-down,
.cctp-performance:first-child > span.changes-up  {
    margin-left: 15px;
}
.cctp-performance img {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.cctp-entity-action,.cctp-asset-table .cctp-entity-action{
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 0px 2px rgb(128 138 157 / 12%), 0px 0px 24px rgb(128 138 157 / 14%);
    width: 150px;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding: 10px;
    font-size: 15px;
    margin-top: 10px;
    position: absolute;
    left: 15px;
    transform: translateX(-50%);
    z-index: 9999999;
    display: none;
}
.cctp-asset-table .cctp-entity-action{
    transform: none;
    left: 30px;
}
.cctp-asset-table .cctp-entity-action{
    display: block;
}
.cctp-entity-action:before{
    content: "";
    position: absolute;
    width: 22px;
    height: 19px;
    border-width: 8px 8px 0;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid white;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
}
.cctp-entity-icon,.cctp-aaset-entity-wrap {
    height: 30px;
    display: block;
    width: 30px;
    border-radius: 100%;
    text-align: center;
    line-height: 30px;
    font-size: 26px;
    color: #939292;
    position:relative;
    right: 0;
    margin-right: 30px;
    cursor: pointer;
}
.cctp-aaset-entity-wrap {
    display: inline-flex;
    margin-right: 0;
    align-items: center;
    justify-content: center;
}

.cctp-entity-icon:hover {
    background: #f0f0f1;
}
.cctp-aaset-entity-wrap:hover {
    border:3px solid #f0f0f1;
}
.cctp-add-asset, span.cctp-view-asset, span.cctp-delete-asset {
    display: inline-flex;
    width: 25px;
    height: 25px;
    align-items: center;
    justify-content: center;
    background: transparent;
    margin: 0px 2px;
    border-radius: 100%;
    border: 2px solid transparent;
    color: #000;
    padding: 3px;
    box-sizing: border-box;
}
.cctp-portfolio-wrapper .bsgpsK div:first-child {
    overflow: visible;
}
.cctp-add-asset:hover, span.cctp-view-asset:hover, span.cctp-delete-asset:hover{
    cursor: pointer;
    border: 2px solid #cfd6e4;
}
.cctp-portfolio-wrapper span.cctp-delete-asset {
    margin-bottom: 0;
}
.cctp-portfolio-wrapper span.cctp-view-asset:hover,.cctp-portfolio-wrapper span.cctp-delete-asset:hover{
    background: #f8fbff;
}
.cctp-wrap .cctp-entity-action > button {
    background-color: transparent;
    color: #000000;
    padding: 0px;
    display: block;
    width: 100%;
    border: none;
    background: transparent;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.cctp-entity-action > button svg {
    margin-right: 5px;
    height: 14px;
    width: 15px;
}
.cctp-entity-action > button:hover{
background: #f8fafd;
}
.cctp-entity-action > button:nth-child(2){
    margin-top:8px;
}
.cctp-asset-table select.sc-cxpSdN.fWWeYy {
    background: white;
    border: 1px solid gray;
    width: 20px;
    height: 15px;
    line-height: 15px;
    font-size: 16px;
    border-radius: 5px;
    padding: 7px 20px;
}
.cctp-asset-table .fQmYxz svg {
    top: 50%;
    transform: translateY(-50%);
}
.cctp-asset-table .sc-egiyK.lnndaO {
    font-size: 14px;
    line-height: 1.5;
    text-align:left;
    border-top: 1px solid #ecf1fb !important;
    border-bottom: 1px solid #ecf1fb !important;
    font-weight: 600;
    display: block;
}
.cctp-asset-table .sc-jrQzAO,
.cctp-asset-table .sc-dkPtRN.hCBnvI.rdt_TableHeadRow {
    align-items: center;
}
.cctp-asset-table .sc-hKwDye {
    padding: 10px;
    font-size: 14px;
    text-align: left;
    /* border-bottom: 1px solid #ecf1fb !important; */
    font-weight: 600;
    display: block;
    flex: 0 0 12.33%;
}
.cctp-asset-table .sc-hKwDye:first-child {
    flex: 0 0 25%;
    padding: 10px 10px 10px 10px;
}

.cctp-asset-table .sc-hKwDye:last-child,
.cctp-asset-table .sc-hKwDye:last-child .sc-egiyK.lnndaO {
    text-align: center;
}
.cctp-asset-table .fFBlx,
.cctp-asset-table .sc-crHmcD{
    display: block;
    position: relative;
}
.cctp-asset-table span.sc-kDTinF{
    position: absolute;
   right:0px;
    top: 50%;
    transform: translateY(-50%);
}
.cctp-asset-table .sc-egiyK.lnndaO{
    border:none !important;
}
.cctp-asset-table .rdt_Pagination button:hover{
    background-color: #cfd6e4;
}
table#cctp-portfolio-table  td{
    text-align: left;
}
.cctp-asset-table .iAwKFK:hover{
    background-color: #f8fbff;
}
.cctp-asset-table .iAwKFK:hover {
    border-bottom-color: #cfd6e4;
    outline-color: transparent;
}
.cctp-asset-table {
    position: relative;
}

#cctp_chart .toolbar button 
{    
    padding: 10px 15px 10px 15px;
    background-color: #3861fb;
    border-radius: 8px;
}

#cctp_chart .toolbar button.active {   
     background: #000;
}

.cctp-add-transaction,.cctp-edit-transaction,.cctp-delete-transaction{
    cursor: pointer;
}

.cctp-empty-portfolio {
    width: 100%;
    text-align: center;
    font-size: 28px;
    padding: 50px 0px;
    border-top: 1px solid #ecf1fb;
    border-bottom: 1px solid #ecf1fb;
    border-style: double;
    background: white;
    text-transform: capitalize;
    font-weight: 600;
    color: #3861fb;
}
.cctp-total-spent{
    position: relative;
}
.cctp-total-spent .cctp-total-spent-value {
    position: absolute;
    font-size: 24px;
    left: 8px;
    color: #000000;
    font-weight: normal;
    top: 16px;
    font-weight: 600;
    z-index: 9;
}
/* Model style */
.cctp-transaction-loader {
    display: contents !important;
}
.cctp-transaction-loader .ph-item{
    display: contents !important;
}
.cctp-transaction-loader .ph-col-12{
    flex: 1 1 auto !important;
}
/* Table Style Start end */

.cctp_chart_loader {
    margin-right: 50%;
    padding: 10px 0px 0px 0px;
}





@media(max-width:1024px){
    .cctp-portfolio-wrapper {
        display: block;
    }
    .cctp-portfolio-sidebar, 
    .cctp-portfolio-lists,
    .cctp-asset-wrapper {
        max-width: 100%;
        flex: 0 0 100%;
    }
    .cctp-portfolio-lists{
        padding: 20px;
    }
    .cctp-portfolio-sidebar .cctp-row:nth-child(2){
        display: flex;
        flex-wrap:wrap;
    }
    .cctp-total-price {
        width: 70%;
    }
    .cctp-btn {
        display: block;
    }
    .cctp-portfolio-sidebar .cctp-col{
        width: 100%;
    }
    .cctp-portfolio-table th,.cctp-portfolio-table td {
        padding: 10px;
    }
    .cctp-portfolio-sidebar {
        padding-right: 0px;
    }
    .cctp-entity-action,.cctp-entity-action:before {
        left: auto;
        right: 15px;
        transform: none;
    }
    .cctp-asset-table .cctp-entity-action:before {
        left: 50%;
        transform: translateX(-50%);
    }
    .cctp-name {
        width: 600px;
    }
    .cctp-asset-table .sc-hKwDye:first-child {
        position: sticky;
        left: 0;
        background: #f7f7f7;
        z-index: 9;
        flex: 0 0 15%;
        min-height: 57px;   
    }
    .cctp-asset-table .sc-hKwDye {
        flex: 1;
    }
  
}

@media(max-width:767px){
    .cctp-portfolio-table td:first-child,
    .cctp-portfolio-table th:first-child {
        background: #f5f5f5;
    }
    .cctp-portfolio-lists .cctp-col {
        width: 100%;
    }
    .cctp-total-price{
        width: 100%;
    }
    .cctp-performance {
        width:100%;
        position: relative;
        margin: 10px 0px;
    }
}

@media(max-width:600px){

    #cctp_chart .toolbar button {
        padding: 5px 5px 5px 5px;
    }
    .cctp-btn {
        max-width: 100%;
        flex: 0 0 100%;
        margin-bottom: 30px;
        text-align: left;
    }
    .cctp-portfolio-sidebar .cctp-col {
        width: 100%;
    }
    .cctp-performance {
        padding: 10px 0px;
        border-bottom: 1px solid #ecf1fb;
    }
}
/* Ensure that the demo table scrolls */
.cctp-portfolio-wrapper th, td { white-space: nowrap; }
div.dataTables_wrapper {
    width: 100%;
    margin: 0 auto;
}