/* CSS Document */
/* plugin css */
.cbpfi_box {
padding: 2%;
border: 1px solid #000000;
background-color: #fff;
margin-bottom: 10px;
}

.cbpfi_error {
padding: 2%;
border: 1px solid #000000;
background-color: #ff8080;
margin-bottom: 10px;
color: #fff;
}

.cbpfi_ok {
padding: 2%;
border: 1px solid #000000;
background-color: #1c6e00;
margin-bottom: 10px;
color: #fff;
}

.cbpfi_info {
padding: 2%;
border: 1px solid #000000;
background-color: #f0ea30;
margin-bottom: 10px;
color: #000;
}

.cbpfi_visibility_error_msg {
padding: 2%;
margin: 10px;
border: 1px solid #000000;
background-color: #d63638!important;
color: #fff!important;
font-size: 1.1rem;
}


.svgicons {
width: 15px!important;
height: 15px!important;
fill: #ffffff!important;
}

.abstand {
margin-right:20px;
font-size: 15px;
color: #ffffff;
}

.zeilenabstand {
line-height: 15px;
}


.chpfi-pixelfed-grid {
display: grid;
grid-template-columns: repeat(var(--cbpfi-columns, 4), 1fr);
gap: 15px;
}

.chpfi-pixelfed-item {
position: relative;
aspect-ratio: 1;
overflow: hidden;
border-radius: 8px;
}

.chpfi-pixelfed-item img {
width: 100%;
height: 100%;
object-fit: cover;
}

.chpfi-pixelfed-overlay {
position: absolute;
inset: 0;
background: linear-gradient(to top, rgba(0, 0, 0, .95), transparent);
color: #fff;
font-size: 12px;
padding: 10px;
display: flex;
flex-direction: column;
justify-content: flex-end;
opacity: 0;
transition: opacity .2s;
}

.chpfi-pixelfed-item:hover .chpfi-pixelfed-overlay {
opacity: 1;
}