.vvsu.card-body {
        position: absolute;
        z-index: 5;
        top: 0%;
        bottom: 0%;
        color: white;
}

.vvsu.card-body > div {
   background-color:rgba(0, 0, 0, 0.25);   
   margin: auto;
}


.vvsu.carousel-item {
    transition: transform 1s ease, opacity .5s ease-out;
}


.vvsu.carousel-item img {
    width: 100% !important;
    background-repeat: no-repeat;
    background-position-y: bottom !important;
    transition: transform 2s ease, opacity .5s ease-out;
}

@media (min-width: 1400px) {
    .vvsu.carousel-item img {
        height: calc(100vw * 637 / 2560) !important;
        background-size: 100%, calc(100vw * 1024 / 2560);
    }

    .vvsu.card-body {
        left: 12.5%;
        width: calc(25% - 0.5%);
    }
}

@media (max-width: 992px) {
    .vvsu.carousel {
	margin-top: 9em;
    }
}

@media (min-width: 992px) and (max-width: 1339px) {
    .vvsu.carousel-item img {
	background-position-x: calc(0%) !important;
        height: calc(115vw * 640 / 2560) !important;
        background-size: 115vw, calc(115vw * 1024 / 2560);
    }

   .vvsu.card-body {
        left: 8%;
        width: calc(35% - 0.5%);
        color: white;
    }
}


@media (min-width: 768px) and (max-width: 991px) {
    .vvsu.carousel-item img {
	background-position-x: calc(26%) !important;
        height: calc(135vw * 738 / 2560) !important;
        background-size: 120vw, calc(120vw * 1024 / 2560);
    }
    .vvsu.card-body  {
        width: 100%;
    }
    .vvsu.card-body > div {
        background-color:rgba(0, 0, 0, 0);   
    }
    .vvsu.card-body p.display-4 {
        background-color:rgba(0, 0, 0, 0.25);   
	position: absolute;
        padding: 0.25em;
        left: 2.5%;
        top: 5%;
        right: 2.5%;
        font-size: 3rem;
    }

    .vvsu.card-body p.h4 {
        background-color:rgba(0, 0, 0, 0.25);   
        margin: auto auto auto 9%;
        width: 27.5%;
        padding: 0.5em;
        font-size: 1.8rem;
    }


} 

@media (max-width: 767px) {
    .vvsu.carousel-item img {
        height: calc(100vw * 1024 / 1220) !important;
	background-position-x: calc(75%) !important;
        background-size: calc(100vw * 2560 / 1220), calc(100% / 1220 * 1024);
    }

   .vvsu.card-body {
        align-items: start;
        top: 0.25em;
        left: 0.125em;
        right: 0.125em;
        color: white;
    }

    .vvsu.card-body > div {
        margin: 0;
        padding: 0.125em 0.5em 0.125em 0.5em !important;
    }

    .vvsu.card-body p.display-4 {
        font-size: calc(calc(5vw));
	padding: 0.125em;
    }

    .vvsu.card-body p.h4 {
        font-size:  calc(calc(3vw));
	padding: 0.125em;
    }
}

#social-main .social a {
  margin: -0.5em 0 0 0.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(23, 95, 169, 1);
  color: white;
  border: 2px solid rgba(255, 255, 255, 1);
  border-radius: 20%;
  width: 50px;
  height: 50px;
  transition: all 0.24s ease-out;
}

#social-main .social a:hover {
  background: rgba(255, 255, 255, 1);
  color: rgba(23, 95, 169, 1);
  border: 2px solid rgba(23, 95, 169, 1);
}



.social-img {
    width: 100%;
    aspect-ratio: 1;
    background-size: cover;
    background-position: center center;
    max-width: 75vw;
}

.social-text {
    max-width: 75vw;
    height: 100%;
    aspect-ratio: 2;
    color: black;
    overflow: hidden ;
    padding-top: 0;
    margin-top: 0;
}

.link-wr {
    overflow-wrap: break-word !important;
}

.social-grad {
    position: absolute;
    height: 50px;
    bottom: 0;
    right: 0;
    width: 100%;
    background: white;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255,1));
    z-index: 10;
    margin-bottom: -2px;
}
.social-dots {
    position: absolute;
    z-index: 15;
    right: 15px;
    bottom: 5px;
}

.social-group {
    padding-top: 0.25em;
    height: 3em;
    overflow: hidden;

}

#social-post a {
    text-decoration: none !important;
    border: 0;
}


.b24-form-control {
	width: 100%;
	flex: 1;
	background: white !important;
}

.b24-form-control-checkbox, .b24-form-control-radio, .b24-form-control-product {
  margin: 4px 9px 4px 0 !important;
  border-radius: 0px !important;
  border: 0px !important;
  padding: 0px !important;
}

span.b24-form-control-label {
 display: none !important;
}

.b24-form-field-checkbox  {
 background: rgba(255, 255, 255, 1) !important;
}

.b24-form-control-checked .b24-form-control-desc {
   color: var(--b24-text-color) !important;
}