hackFront/src/view/headerAdmin.vue

<template>
  <div>
    <div class="pure-g header">
      <div class="pure-u-1 pure-u-sm-1 pure-u-md-1 pure-u-lg-1 pure-u-xl-1">
        <div class="logo_unam">
          <a href="https://www.unam.mx/" target="_blank">
            <img src="https://www.c3.unam.mx/image/logoUnam.png" />
          </a>
        </div>
      </div>
    </div>

    <!-- div banner -->
  </div>
</template>

<script>
export default {};
</script>

<style>
.header {
  width: 100%;
  max-height: 260px;
  background-color: #000000;
}

.logo_unam {
  padding: 2% 3%;
}

.logo_unam img {
  display: block;
  margin: 0 auto;
  width: 90px;
}

@media screen and (max-width: 768px) {
  .logo_unam img {
    width: 50px;
    margin-right: auto;
    margin-left: 0px;
    display: block;
  }
}

.logo_der {
  display: block;
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  .footer img {
    width: 40px !important;
    height: 40px !important;
  }
  .texto_footer {
    font-size: 12px !important;
  }
}
</style>