<template>
  <v-container fill-height>
    <v-layout align-center justify-center>
      <v-card dark width="80%" height="80%">
        <v-card-title style="font-size: 350%">
          The content you're requesting is not available in your country.
        </v-card-title>
        <v-divider class="px-5"/>
        <v-flex xs10 offset-xs2>
          <v-card-text class="no-content-text">
            <v-icon size="200px" color="deep-orange accent-4">play_circle_outline</v-icon>
            <span style="font-size: xx-large">We're sorry about that ¯\_(ツ)_/¯</span>
          </v-card-text>
        </v-flex>
      </v-card>
    </v-layout>
  </v-container>
</template>

<script>
export default {
  name: 'page-not-found'
}
</script>

<style scoped>
  .no-content-text {
    position: absolute;
    top: 40%;
  }
</style>