/*
Theme Name: TechConnect
Text Domain: TechConnect
Version: 1.0
Description: Description Image Styles
Author: KB
*/

.description-frame-container {
    padding: 100px 120px;
}

.description-frame-title{
    font-size: 3rem;
    font-weight: 600;
}

.description-frame-description ul {
    list-style: disc;
    list-style-position: inside;
}

.description-frame-description ol {
    list-style: decimal;
    list-style-position: inside;
}

.description-frame-container .description-frame-header {
    margin-bottom: 6px;
    color: #212121B8;
}

.description-frame-image-custom-aspect-ratio {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 83.53%;
    overflow: hidden;
}

.description-frame-image-custom-aspect-ratio.large-img {
    max-height: calc(100vh - 102px)!important;
    padding-bottom: 130.54%!important;
}

.large-img {
    max-height: calc(100vh - 102px)!important;
}

.description-frame-image-custom-aspect-ratio video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.description-frame-image-custom-aspect-ratio img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.default-bg-image {
    position: absolute;
    top: 140px;
    left: 0;
    right: 100%;
    background-color: #F08C21;
    width: 215px;
    height: 215px;
    border-radius: 9999px;
    filter: blur(143px);
}

.default-bg-image.flipped {
    left: calc(100% - 250px);
}

.description-frame-grid {
    max-height: calc(100vh - 102px);
}

@media screen and (max-width: 1023px) {
    .description-frame-container {
        padding: 50px 16px;
    }

    .description-frame-container .description-frame-title {
        font-size: 2rem;
    }
}

@media screen and (max-width: 1023px) {
    .default-bg-image {
        top: 10px;
        left: 0;
        right: 100%;
        width: 120px;
        height: 120px;
        filter: blur(80px);
    }

    .large-img {
        max-height: calc(100vh - 77px)!important;
    }

    .description-frame-grid {
        max-height: 100%;
    }
}
