@import './theme/variables.sass'
body
    .mobile-version
        border-radius: 0
        .wizrd-blog-theme
            width: 300px
            max-width: 100%
            border-radius: 0
            .container
                padding-left: 30px
                padding-right: 30px
            .btn
                font-size: 16px
                padding: 7px 25px
                letter-spacing: 0
            .wizrd-newsletter
                width: 100% !important
                padding: 0 !important
                background-color: transparent
                flex-direction: column
                align-items: center
                height: auto
                box-shadow: none
                border: none
                .form-group
                    width: 100%
                    display: none
                    .form-control
                        font-size: 14px
                        background-color: #fff
                        border-radius: 100px
                        margin: 0 0 15px
                        padding: 7px 25px
                        box-shadow: 0 0 10px 10px rgba(0,0,0,.02)
                .btn.btn-primary
                    font-size: 10px !important
                    padding: 6px 12px !important
                    width: auto
            .wizrd-site-header
                border-top-left-radius: 0
                border-top-right-radius: 0
                .wizrd-main-header
                    padding: 15px 18px !important
                    line-height: 0
                    .wizrd-mobile-icon
                        svg
                            width: 15px
                            height: 15px
                    a
                        &.wizrd-logo-img
                            font-size: 0
                    .wizrd-header-logo
                        max-width: 300px
                        a
                            font-size: 14px !important
                            line-height: 1 !important
                            font-weight: 600
                            max-width: unset
                            width: 100%
                    .wizrd-site-navigation
                        &.wizrd-site-navigation-center
                            &.wizrd-site-navigation-extra
                                position: relative
                                left: auto
                                transform: unset
                        ul
                            position: absolute
                            left: 0
                            right: 0
                            background-color: $white-color
                            top: 100%
                            padding: 10px 30px 30px
                            display: none
                            z-index: 11
                            border-top: 1px solid rgba(0,0,0,.1)
                            border-bottom: 1px solid rgba(0,0,0,.1)
                            text-align: left
                            li
                                width: 100%
                                text-align: left
                                margin: 10px 0
                                .btn.btn-primary
                                    margin-left: 0
                                &.wizrd-mobile-nav
                                    display: inline-block
                                a

                                    font-size: 16px
                                    padding: 0
                                    color: var(--black-color)
                                &.wizrd-header-social-links
                                    width: auto
                                    display: inline-block
                                    margin: 15px 0
                                    a
                                        padding-right: 10px
                                        padding-left: 0
                                        svg
                                            max-height: 18px
                                            path
                                                fill: $black-color
                                        &:hover,
                                        &:focus,
                                        &:active
                                            svg
                                                path
                                                    fill: $black-color
                        .wizrd-mobile-icon
                            display: inline-block
            .wizrd-site-main
                .wizrd-home-banner
                    padding: 25px 0 35px
                    .container
                        max-width: 210px !important
                        padding: 0 !important
                    h1
                        font-size: 14px !important
                        letter-spacing: 0
                        span
                            padding: 0
                    .wizrd-description
                        line-height: 1.3 !important
                        font-size: 9px !important
                        letter-spacing: 0
                        padding: 0
                        width: 270px
                        margin: 10px 0 5px !important
                        height: 24px
                        overflow: hidden
                .wizrd-recent-blogs
                    padding: 11px 0
                    border-bottom-left-radius: 0
                    border-bottom-right-radius: 0
                    .container
                        padding: 0
                    .wizrd-blog-list
                        margin: 0
                        li
                            a
                                .wizrd-blog-box
                                    padding: 0
                                    border: none !important
                                    flex-direction: column
                                    .wizrd-blog-img
                                        width: 100%
                                        margin: 0
                                        img
                                            height: 142px
                                            object-fit: cover
                                    .wizrd-blog-category
                                        font-size: 10px
                                    .wizrd-blog-detail
                                        padding: 11px 11px 0
                                        text-align: left
                                        width: 100%
                                        .wizrd-blog-excerpt-detail
                                            padding: 0
                                            align-items: center
                                            .wizrd-blog-view
                                                background: transparent
                                                border-radius: 0
                                                padding: 0
                                                min-width: 0
                                                .wizrd-blog-view-people
                                                    display: none
                                                svg
                                                    margin-top: -1px
                                            .wizrd-blog-author
                                                .wizrd-blog-author-name
                                                    font-size: 10px
                                                    display: inline-block
                                                    vertical-align: middle
                                                    width: auto
                                                    margin-bottom: 0
                                                .wizrd-blog-date
                                                    font-size: 10px
                                                    display: inline-block
                                                    vertical-align: middle
                                                    width: auto
                                                    margin-left: 15px
                                        h2
                                            font-size: 15px
                                            margin: 0 0 10px
                                        .wizrd-blog-author
                                            width: auto
                                            vertical-align: middle
                                        .wizrd-wizrd-blog-date
                                            width: auto
                                            vertical-align: middle
                                            margin: 0
                                            position: relative
                                            margin-left: 15px
                                            &::after
                                                content: ''
                                                width: 3px
                                                height: 3px
                                                background-color: #8C87A6
                                                position: absolute
                                                left: -8px
                                                top: 8px
                                                border-radius: 100%
                                        .wizrd-blog-view
                                            display: none
                    .tabs
                        text-align: center
                        .tab-content
                            p
                                font-size: 18px
                        .nav-tabs
                            width: auto
                            margin: 0 5px 12px
                            padding: 2px 3px 4px
                            .nav-item
                                .nav-link
                                    font-size: 10px
                                    min-width: 95px
                                    line-height: 1.4
                                    padding: 5px 5px
