

    .scy-cards-wrapper,
    .scy-cards-wrapper-center-center {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width:100%;
        padding-top:1rem;
        padding-bottom:1rem;
    }
    .scy-cards-wrapper {
        justify-content: center;
        align-content: flex-start;
    }
    .scy-cards-wrapper-center-center {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-content: center;
        width:100%;
        padding-top:1rem;
        padding-bottom:1rem;
    }


    /*----------------------
      DEFAULT CARDS 
    ----------------------*/

    .card {
        color: var(--scy-element-gradient1-color); 
        transition: 0.3s ease-in-out;
        box-shadow: none;
        overflow: hidden;
    }
    .card p,
    .card h1,
    .card h2,
    .card h3,
    .card h4, 
    .card h5,
    .card h6 {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        text-align:center;
    }
    .card-header {
        background: transparent;
        border-bottom: none;        
    }
    .card-body {
        background: transparent;
        border: none;        
    }
    .card-footer {
        background: transparent;
        border-top: none;        
    }
    .link-card {
        cursor: pointer;
        color: var(--scy-body-gradient1-color); 
        text-decoration: none;
    }



    .scy-card {
        position: relative;
        margin:1rem;
        -webkit-transition: var(--scy-transition-duration) ease-in-out;
        transition: var(--scy-transition-duration) ease-in-out;
        text-decoration: none !important;
        border: var(--scy-border-size) solid transparent;
        border-radius: calc(var(--scy-border-radius-m) + var(--scy-border-size));
        /*-webkit-transform: scale(1);
        transform: scale(1); */
        /*width: fit-content;*/
        /*width:100%;
        height: fit-content;*/
    }
    /*.scy-card:hover {
        -webkit-transform: scale(1.05);
        transform: scale(1.05); 
        -webkit-transition: var(--scy-transition-duration) ease-in-out;
        transition: var(--scy-transition-duration) ease-in-out;      
    }*/
    .scy-card .card,
    .scy-card:hover .card,
    .scy-card .card-title,
    .scy-card:hover .card-title,
    .scy-card .card-subtitle,
    .scy-card:hover .card-subtitle, 
    .scy-card .card-text,
    .scy-card:hover .card-text {
        -webkit-transition: var(--scy-transition-duration) ease-in-out all;
        transition: var(--scy-transition-duration) ease-in-out all;
    }
    .scy-card:not(.scy-card-transparent):hover  {
        box-shadow: var(--scy-box-shadow);
    }

    .scy-card .card {
        min-width: 15rem;
        min-height: 15rem;
        z-index: 4;
    } 
    .scy-card:not(.scy-card-transparent) .card {
        overflow: hidden;
    } 
    .scy-card.scy-card-transparent .card {
        overflow: visible;
    } 
    .scy-card:hover,
    .scy-card:focus,
    .scy-card:active {
        z-index:900 !important;
    }


    /* CARD // CARD COLORS */

    /* Default (not transparent) */
    .scy-card:not(.scy-card-transparent) .card {
        background: var(--scy-element-gradient1-background); 
        border: var(--scy-border-size) solid var(--scy-element-gradient1-border);
    } 
    .scy-card:not(.scy-card-transparent) .card-title {
        color: var(--scy-element-gradient1-color); 
    } 
    .scy-card:not(.scy-card-transparent) .card-subtitle {
        color: var(--scy-element-gradient1-color); 
    } 
    .scy-card:not(.scy-card-transparent) .card-text {
        color: var(--scy-element-gradient1-color-muted); 
    } 

    .scy-card:not(.scy-card-transparent):hover .card {
        background: var(--scy-element-gradient1-background-hover); 
        /*border: var(--scy-border-size) solid var(--scy-element-gradient1-border-hover);*/
        border: var(--scy-border-size) solid var(--scy-secondary-background);
    } 
    .scy-card:not(.scy-card-transparent):hover .card-title {
        color: var(--scy-element-gradient1-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent):hover .card-subtitle {
        color: var(--scy-element-gradient1-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent):hover .card-text {
        color: var(--scy-element-gradient1-color-hover-muted); 
    } 


    /* Highlight */
    .scy-card.scy-card-highlight:not(.scy-card-transparent) .card {
        background: var(--scy-element-gradient1-background-focus); 
        border: var(--scy-border-size) solid var(--scy-primary-background);
    } 
    .scy-card.scy-card-highlight:not(.scy-card-transparent) .card-title {
        color: var(--scy-element-gradient1-color-focus); 
    } 
    .scy-card.scy-card-highlight:not(.scy-card-transparent) .card-subtitle {
        color: var(--scy-element-gradient1-color-focus); 
    } 
    .scy-card.scy-card-highlight:not(.scy-card-transparent) .card-text {
        color: var(--scy-element-gradient1-color-focus-muted); 
    } 

    .scy-card.scy-card-highlight:not(.scy-card-transparent):hover .card {
        background: var(--scy-element-gradient1-background-hover); 
        border: var(--scy-border-size) solid var(--scy-primary-background);
    } 
    .scy-card.scy-card-highlight:not(.scy-card-transparent):hover .card-title {
        color: var(--scy-element-gradient1-color-hover); 
    } 
    .scy-card.scy-card-highlight:not(.scy-card-transparent):hover .card-subtitle {
        color: var(--scy-element-gradient1-color-hover); 
    } 
    .scy-card.scy-card-highlight:not(.scy-card-transparent):hover .card-text {
        color: var(--scy-element-gradient1-color-hover-muted); 
    } 



    /* Checked */
    .scy-card.scy-card-checked:not(.scy-card-transparent) .card {
        background: var(--scy-element-gradient1-background-focus); 
        border: var(--scy-border-size) solid var(--scy-element-gradient1-border-focus);
    } 
    .scy-card.scy-card-checked:not(.scy-card-transparent) .card-title {
        color: var(--scy-element-gradient1-color-focus); 
    } 
    .scy-card.scy-card-checked:not(.scy-card-transparent) .card-subtitle {
        color: var(--scy-element-gradient1-color-focus); 
    } 
    .scy-card.scy-card-checked:not(.scy-card-transparent) .card-text {
        color: var(--scy-element-gradient1-color-focus-muted); 
    } 

    .scy-card.scy-card-checked:not(.scy-card-transparent):hover .card {
        background: var(--scy-element-gradient1-background-hover); 
        border: var(--scy-border-size) solid var(--scy-element-gradient1-border-focus);
    } 
    .scy-card.scy-card-checked:not(.scy-card-transparent):hover .card-title {
        color: var(--scy-element-gradient1-color-hover); 
    } 
    .scy-card.scy-card-checked:not(.scy-card-transparent):hover .card-subtitle {
        color: var(--scy-element-gradient1-color-hover); 
    } 
    .scy-card.scy-card-checked:not(.scy-card-transparent):hover .card-text {
        color: var(--scy-element-gradient1-color-hover-muted); 
    } 

    .scy-card.scy-card-checked .scy-card-notification-circle  {
        background: var(--scy-element-gradient1-border-focus);
    }
    .scy-card.scy-card-checked .scy-card-notification-info  {
        color: var(--scy-primary-color);
    }


    /* Selected */
    .scy-card:not(.scy-card-transparent).scy-card-selected .card {
        /*background: var(--scy-secondary-background);*/ 
        border: var(--scy-border-size) solid var(--scy-primary-background);
    } 
    .scy-card:not(.scy-card-transparent).scy-card-selected .card-title {
        color: var(--scy-secondary-color); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-selected .card-subtitle {
        color: var(--scy-secondary-color); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-selected .card-text {
        color: var(--scy-secondary-color-muted); 
    } 

    .scy-card:not(.scy-card-transparent).scy-card-selected:hover .card {
        /*background: var(--scy-secondary-background-hover); */
        background: var(--scy-element-gradient1-background-hover);
        border: var(--scy-border-size) solid var(--scy-primary-background);
    } 
    .scy-card:not(.scy-card-transparent).scy-card-selected:hover .card-title {
        color: var(--scy-secondary-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-selected:hover .card-subtitle {
        color: var(--scy-secondary-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-selected:hover .card-text {
        color: var(--scy-secondary-color-hover-muted); 
    } 

    .scy-card.scy-card-selected .scy-card-notification-circle  {
        background: var(--scy-secondary-background);
    }
    .scy-card.scy-card-selected .scy-card-notification-info  {
        color: var(--scy-secondary-color);
    }


    /* Warning */
    .scy-card:not(.scy-card-transparent).scy-card-warning .card {
        background: var(--scy-warning-background); 
        border: var(--scy-border-size) solid var(--scy-warning-border-hover);
    } 
    .scy-card:not(.scy-card-transparent).scy-card-warning .card-title {
        color: var(--scy-warning-color); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-warning .card-subtitle {
        color: var(--scy-warning-color); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-warning .card-text {
        color: var(--scy-warning-color-muted); 
    } 

    .scy-card:not(.scy-card-transparent).scy-card-warning:hover .card {
        background: var(--scy-warning-background-hover); 
        border: var(--scy-border-size) solid var(--scy-warning-border-hover);
    } 
    .scy-card:not(.scy-card-transparent).scy-card-warning:hover .card-title {
        color: var(--scy-warning-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-warning:hover .card-subtitle {
        color: var(--scy-warning-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-warning:hover .card-text {
        color: var(--scy-warning-color-hover-muted); 
    } 

    .scy-card.scy-card-warning .scy-card-notification-circle  {
        background: var(--scy-warning-background);
    }
    .scy-card.scy-card-warning .scy-card-notification-info  {
        color: var(--scy-warning-color);
    }

    /* Danger */
    .scy-card:not(.scy-card-transparent).scy-card-danger .card {
        background: var(--scy-danger-background); 
        border: var(--scy-border-size) solid var(--scy-danger-border);
    } 
    .scy-card:not(.scy-card-transparent).scy-card-danger .card-title {
        color: var(--scy-danger-color); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-danger .card-subtitle {
        color: var(--scy-danger-color); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-danger .card-text {
        color: var(--scy-danger-color-muted); 
    } 

    .scy-card:not(.scy-card-transparent).scy-card-danger:hover .card {
        background: var(--scy-danger-background-hover); 
        border: var(--scy-border-size) solid var(--scy-danger-border-hover);
    } 
    .scy-card:not(.scy-card-transparent).scy-card-danger:hover .card-title {
        color: var(--scy-danger-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-danger:hover .card-subtitle {
        color: var(--scy-danger-color-hover); 
    } 
    .scy-card:not(.scy-card-transparent).scy-card-danger:hover .card-text {
        color: var(--scy-danger-color-hover-muted); 
    }

    .scy-card.scy-card-danger .scy-card-notification-circle  {
        background: var(--scy-danger-background);
    }
    .scy-card.scy-card-danger .scy-card-notification-info  {
        color: var(--scy-danger-color);
    }



    /* Notifications */
    .scy-card.scy-card-notifications:not(.scy-card-transparent)  {
        border: var(--scy-border-size) solid var(--scy-secondary-background);
    }
    .scy-card.scy-card-notifications:not(.scy-card-transparent):hover  {
        border: var(--scy-border-size) solid var(--scy-secondary-background);
    }
    .scy-card.scy-card-notifications .scy-card-notification-circle  {
        background: var(--scy-secondary-background);
    }
    .scy-card.scy-card-notifications .scy-card-notification-info  {
        color: var(--scy-secondary-color);
    }



    /* CARD // CARD DISABLED */

    .scy-card.scy-card-disabled {
        opacity : .5;
        filter : grayscale(1);
        -webkit-filter : grayscale(1);
    }
    .scy-card.scy-card-disabled:hover {
        opacity: 1;
        filter : grayscale(0);
        -webkit-filter : grayscale(0);
    }



    /* CARD // CARD NOTIFICATION */

    .scy-card .scy-card-notification-circle {
        position: absolute;
        z-index: 5;
        top:-1rem; 
        left: -1rem;
        width:2rem;
        height:2rem;
        border-radius: 50rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .scy-card .scy-card-notification-info {
        font-size: 1.2rem;
        font-weight: 700;
    }
    .scy-card .scy-card-notification-info .bi {
        width: 1.2rem;
        height: 1.2rem;
        margin-top: -4px;
    }


    /* CARD // CARD MODAL */
   
    /*.scy-card.scy-card-modal .card{
        background: transparent !important;
    }*/

    

    /* CARD // CARD TRANSPARENT */
   
    .scy-card.scy-card-transparent .card{
        background: transparent !important;
    }


    /* CARD // BUTTON MENU */

    .scy-card .scy-card-menu-btn {
        position: absolute;
        z-index: 6;
        top:.75rem; 
        right: 1rem;
    }


    /* MEDIA CARD // CARD OVERLAY */

    .scy-card:not(.scy-card-transparent) .scy-card-overlay { 
        width:100%;
        height:100%;
        opacity:0;
        z-index:5;
        background:transparent;
        position: absolute;
        -webkit-transition: var(--scy-transition-duration) ease-in-out;
        transition: var(--scy-transition-duration) ease-in-out; 
        border-radius: var(--scy-border-radius-m);
        overflow: hidden;
    }
    .scy-card:not(.scy-card-transparent):hover .scy-card-overlay { 
        opacity:1;
        -webkit-transition: var(--scy-transition-duration) ease-in-out;
        transition: var(--scy-transition-duration) ease-in-out;
    }    
    .scy-card:not(.scy-card-transparent) .scy-card-overlay .scy-card-overlay-background {
        width:100%;
        height:100%;
        /*background-color: var(--scy-backdrop-gradient1-background); */
        background-color: var(--scy-modal-gradient1-background); 
        opacity:.8;
        position: absolute;
    }
    .scy-card:not(.scy-card-transparent) .scy-card-overlay .scy-card-overlay-wrapper {
        position: absolute;
        top:0;
        left:0;
        z-index:10;
        width:100%;
        height:100%;
        display:flex;
        flex-flow: row wrap;
        align-items: center;
        justify-content: center;
    }
    .scy-card:not(.scy-card-transparent) .scy-card-overlay .scy-card-overlay-wrapper .bi {
        width: 1.5rem;
        height: 1.5rem;
        margin-right: .5rem;
        margin-top: -.2rem;
    }


