.jquery-sorting-placeholder-grid{
    width: 20%;
    height:50px;
    border-radius: 20px;
    animation-name: jquery-sorting-placeholder-animation;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}


/*overrwite bootstrap*/
.was-validated .form-control:valid, .form-control.is-valid {
    padding-right: calc(1.5em + 0.75rem);
    padding-left: 10px;
    background-position: right calc(0.375em + 0.1875rem) center;
}
.was-validated .form-control:invalid, .form-control.is-invalid {
    padding-right: calc(1.5em + 0.75rem);
    padding-left: 10px;
    background-position: right calc(0.375em + 0.1875rem) center;
}
/*end of overrwite*/

.link-cover a:visited,.link-cover a:active{

}

.link-cover a,.link-cover a:hover{
    text-decoration: none;
}


.link-cover a{
    height: 100%;
}
.link-cover .title{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.height-auto{
    height: 50px;
}

.link .icon{
    line-height: 1 !important;
}



.wide-link{
    flex: 0 0 auto;
    width: 100%;
}
.wide-link .title{
    flex: 0 0 auto;
    width: 75%;
}
.wide-link .icon{
    flex: 0 0 auto;
    width: 25%;
}
.wide-link .link{
     display: flex;
     justify-content: space-between;
     align-items: center;
}
.wide-link .link[icon="null-icon"] .title{
    flex: 0 0 auto;
    width: 100%;
}
.wide-link .link[icon="null-icon"] .icon{
    flex: 0 0 auto;
    width: 0%;
}

.three-quarter-link{
    /*col-9*/
    flex: 0 0 auto;
    width: 75%;
}
.three-quarter-link .title{
    /*col-9*/
    flex: 0 0 auto;
    width: 75%;
}
.three-quarter-link .icon{
    /*col-3*/
    flex: 0 0 auto;
    width: 25%;
}
.three-quarter-link .link{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.three-quarter-link .link[icon="null-icon"] .title{
    flex: 0 0 auto;
    width: 100%;
}
.three-quarter-link .link[icon="null-icon"] .icon{
    flex: 0 0 auto;
    width: 0%;
}

.half-link{
    /*col-6*/
    flex: 0 0 auto;
    width: 50%;
}
.half-link .title{
    /*col-9*/
    flex: 0 0 auto;
    width: 75%;
    text-align: center;
}
.half-link .icon{
    /*col-3*/
    flex: 0 0 auto;
    width: 25%;
}
.half-link .link{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.half-link .link[icon="null-icon"] .title{
    flex: 0 0 auto;
    width: 100%;
}
.half-link .link[icon="null-icon"] .icon{
    flex: 0 0 auto;
    width: 0%;
}

.third-link{
    flex: 0 0 auto;
    width: 33.3333333333%;
}
.third-link .title{
    display: none;
}
.third-link .icon{
    flex: 0 0 auto;
    width: 100%;
}
.third-link .link{
    display: flex;
    justify-content: center;
    align-items: center;
}
.third-link .link[icon="null-icon"] .title{
    flex: 0 0 auto;
    width: 0%;
}
.third-link .link[icon="null-icon"] .icon{
    color: transparent;
 }
.third-link .link[icon="null-icon"] .icon:after{
    font-family: "Font Awesome 5 Free";
    content: "\f099";
 }

.quarter-link{
    flex: 0 0 auto;
    width: 25%;
}
.third-link .title,.quarter-link .title{
    display: none;
}
.quarter-link .icon{
    flex: 0 0 auto;
    width: 100%;
}
.quarter-link .link{
    display: flex;
    justify-content: center;
    align-items: center;
}
.quarter-link .link[icon="null-icon"] .title{
    flex: 0 0 auto;
    width: 0%;
}
.quarter-link .link[icon="null-icon"] .icon{
    color: transparent;
}
.quarter-link .link[icon="null-icon"] .icon:after{
    font-family: "Font Awesome 5 Free";
    content: "\f099";
}


.link-hide{
    background: transparent ;
    color: transparent !important;
    pointer-events: none;
}
.grid-modal .link-hide{
     background-color: #ffffff;
     opacity: 0.1;
     background-image:  repeating-linear-gradient(45deg, #000000 25%, transparent 25%, transparent 75%, #000000 75%, #000000), repeating-linear-gradient(45deg, #000000 25%, #ffffff 25%, #ffffff 75%, #000000 75%, #000000);
     background-position: 0 0, 4px 4px;
     background-size: 8px 8px;
     color: transparent !important;
 }