Child DIV doesn't vertically align center inside the Parent Div

Question

I have created a div with a height: 300px and inside this div, are two other divs that are display: inline-block. What I wanted to do is that I want my div to be vertically aligned center.

I already tried vertically aligning the divs, used flex box (but it doesn't really work if I have my wrapper with margin: 0 auto), also used line-height (problem is it doesn't work out that way since I have texts in my 2nd div.)

Here is my SCSS code:

    .p-{
    &footer-class{
        height: 47px;
        background: transparent linear-gradient(270deg, #96A3B2 0%, #E9EDF4 100%) 0% 0% no-repeat padding-box;
        @include mq('sm'){
            padding: 0 25px 0 23px;
        }
        @include mq('xs') {
            padding: 0 25px 0 23px;
        }
        @include mq('xl') {
            // justify-content: left;
            // display: flex;
            // align-items: center;
            height: 267px;
           }
      }
   }

   .c-{
        &footer-social {
        float: left;
     }
   }

    .c-{
    &footer-about {
        float: right;
        @include mq('xs'){
            display: inline-block;
            margin-top: 4px;
        }
        @include mq('sm'){
            display: inline-block;
            margin-top: 4px;
        }
        @include mq('md'){
            display: inline-block;
        }
        @include mq('xl'){
            display: inline-block;
        }
    }
    &footer-text {
        display: block;
        color: #ffffff;
        font: bold 10px/20px "Consolas";
        opacity: 1;
        &1 {
            @include mq('xs'){
                display: inline-block;
                margin-top: 4px;
            }
            @include mq('sm'){
                display: inline-block;
                margin-top: 4px;
            }
            @include mq('md'){
                display: inline-block;
            }
            @include mq('xl'){
                display: none;
            }

        }
    }
  }

the mq in @include are the media queries being defined in another file.