<template>
  <v-card class="card" max-width="800" flat>
    <v-row align="center" no-gutters>
      <!-- Avatar -->
      <v-col cols="auto">
        <v-avatar   rounded="0" size="150">
          <v-img class="avatar" src="https://cdn.vuetifyjs.com/images/profiles/marcus.jpg" cover></v-img>
        </v-avatar>
      </v-col>

      <!-- Texto ao lado do avatar -->
      <v-col>
        <v-list-item title="Marcus Obrien" subtitle="ADM"></v-list-item>
        <v-card-text>
          Marcus é um administrador experiente com mais de 10 anos de atuação no setor financeiro.
        </v-card-text>
      </v-col>
    </v-row>
  </v-card>
</template>

<style scoped>
.card {
  color: black;
  border-radius: 35px;
  background: linear-gradient(145deg, #eeeded, #ffffff);
  box-shadow: 20px 20px 60px #d9d9d9, -20px -20px 60px #ffffff;
  padding: 10px;
}

.avatar {
  border-radius: 50%;
}
</style>
