/*
Theme Name: dm-fight
 Theme URI:    http://ubbie.studio/
 Description:  DM Fight Child Theme
Author: Borja Galán Carsí
 Author URI:   http://example.com
 Template:     astra
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  dm-fight
*/

html,
body,
body * {
    display: flex;
}

html,
body {
    flex-direction: column;

    font-family: Ubuntu, "times new roman", times, roman, serif;

    margin: 0 !important;
    padding: 0;
}

@media all and (orientation:landscape) {

    #social-bar {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: absolute;
        right: 1vw;
        bottom: 2vh;

        padding: .3vh .2vw;

        background-color: #212729;
        border: 1px solid wheat;
        border-radius: 8px;
    }

    #social-bar .social-title {
        font-size: .5vw;
        color: white;
    }

    header {
        height: 10vh;
        width: 100vw;

        align-items: center;

        padding: 0 .5vw;
    }

    header img {
        height: 8vh;
        width: 8vh;
    }

    #logo-title {
        align-self: center;
        margin-left: .5vw;
        font-size: large;
        font-weight: 700;
    }

    main {
        height: 85vh;
        width: 100vw;

        background-color: aliceblue;
    }

    footer {
        height: 5vh;
        width: 100vw;

        background-color: fbfbfb;
    }
}

@media all and (orientation:portrait) {
    header {
        height: 10vh;
        width: 100vw;

        align-items: center;

        padding: 0 .5vw;

        background-color: fbfbfb;
    }

    header img {
        height: 9vh;
        width: 9vh;
    }

    #logo-title {
        font-weight: 700;
    }

    main {
        height: 85vh;
        width: 100vw;
    }

    footer {
        height: 5vh;
        width: 100vw;

        background-color: fbfbfb;
    }
}