.workspace-top {
    padding-top: 80px;
    min-height: 100vh;

    .workspace-header {
        display: flex;
        align-items: center;
        justify-content: space-between;

        .heading {
            .workspace-heading {
                font-family: $font-family-hk;
                font-size: 24px;
                font-weight: bold;
                text-align: left;
                color: $secondary-color;
            }
        }

        .crossSign {
            .close {
                width: 32px;
                height: 32px;
            }
        }
    }

    .workspace-content {
        padding-left: 10px;
        padding-top: 32px;

        .left-content,
        .right-content {
            display: flex;

            .content-logo {
                .logo {
                    width: 48px;
                    height: 48px;
                }
            }

            .logo-detail {
                padding-left: 16px;

                .detail {
                    font-size: 16px;
                    font-weight: 600;
                    text-align: left;
                    color: $secondary-color;
                    margin: 0;
                    padding-bottom: 8px;
                    font-family: $font-family-sora;
                }

                .description-logo {
                    .description {
                        padding-bottom: 56px;
                        margin: 0;
                        font-size: 16px;
                        font-weight: 500;
                        color: $color-dark;
                    }
                }
            }
        }

    }
}

@media(min-width:768px) {
    .workspace-top {
        // padding: 40px 230px;

    }

    .workspace-content {
        padding-top: 48px;
    }

    .workspace-heading {
        // padding-top: 48px;
    }
}

@media(max-width:768px) {
    .workspace-top {
        height: auto;
    }

    .crossSign {
        position: absolute;
        top: 40px;
        right: 5%;
    }
}