.single-event-preview-box {
width: 100%;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
background: var(--white);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.single-event-preview-box .image-col {
width: 35%;
height: auto;
position: relative;
}
.single-event-preview-box .image-col img {
-o-object-fit: cover;
object-fit: cover;
width: 100%;
position: relative;
height: 100%;
}
.single-event-preview-box .image-col .img-info-box {
width: 100%;
padding: 1.4rem;
background: rgba(0, 0, 0, 0.65);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
position: absolute;
top: 0;
left: 0;
}
.single-event-preview-box .image-col .img-info-box p {
font-size: 1.4rem;
color: var(--white);
opacity: 0.6;
font-weight: 600;
}
.single-event-preview-box .content-col {
width: 65%;
position: relative;
}
.single-event-preview-box .content-col .content {
padding: 6.2rem;
width: 100%;
}
.single-event-preview-box .content-col .content .event-title {
width: 100%;
font-size: 2.4rem;
font-weight: 600;
text-transform: uppercase;
line-height: 3.2rem;
}
.single-event-preview-box .content-col .content .event-desc {
font-size: 1.4rem;
line-height: 2.4rem;
max-width: 45rem;
padding: 8px 0;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col {
width: 33.33333%;
padding: 2.4rem 8px;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col .detail-icon {
width: 100%;
padding-left: 2.4rem;
}
@media only screen and (max-width: 992px) {
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col .detail-icon {
padding-left: 0rem;
}
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col .detail-icon i {
color: var(--blue);
font-size: 2.4rem;
height: 2.4rem;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col p {
display: block;
margin-top: 4px;
font-size: 1.4rem;
line-height: 2rem;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col:nth-child(1) .detail-icon {
width: 100%;
padding-left: 0rem;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col:first-child {
border-right: 1px solid #D0D0D0;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col:last-child {
border-left: 1px solid #D0D0D0;
}
.single-event-preview-box .content-col::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 3px;
background: rgb(171, 32, 142);
background: -webkit-gradient(linear, left top, right top, from(rgb(171, 32, 142)), color-stop(50%, rgb(130, 195, 65)), to(rgb(0, 173, 239)));
background: linear-gradient(90deg, rgb(171, 32, 142) 0%, rgb(130, 195, 65) 50%, rgb(0, 173, 239) 100%);
}
@media only screen and (max-width: 992px) {
.single-event-preview-box .content-col {
width: 100%;
}
.single-event-preview-box .image-col {
width: 100%;
}
}
@media only screen and (max-width: 768px) {
.single-event-preview-box .content-col .content {
padding: 2.4rem;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col {
width: 50%;
border: none;
border-right: 0px;
border-left: 0px;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col:first-child {
border-right: 0px solid #D0D0D0;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col:last-child {
border-left: 0px solid #D0D0D0;
}
}
@media only screen and (max-width: 520px) {
.single-event-preview-box .content-col .content .event-detail-info-wrap {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col {
width: 100%;
border: none;
border-right: 0px;
border-left: 0px;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col:first-child {
border-right: 0px solid #D0D0D0;
}
.single-event-preview-box .content-col .content .event-detail-info-wrap .detail-col:last-child {
border-left: 0px solid #D0D0D0;
}
}