<template>
  <div id="détails">
    <LayoutContainer>
        <v-row class="mt-12 custom-row">
        <LayoutUISubTitle
          :iconSize="6"
          :iconClasses="iconClasses"
          :titleText="'Un réseau pyramidal '"
          :iconColor="'#E34461'"
        />
      </v-row>

      <v-row class="custom-row">
        <v-col cols="12" lg="6" md="6">
          <LayoutUITitle
          title="Opentalent Manager, un logiciel adapté à chacun "
        />
        <p class="pyramide-details ml-3 mt-6">Notre système s'adapte à toutes les structures de réseau pyramidal, quel que soit le nombre de niveau.</p>
        </v-col>

        <v-col cols="12" lg="6" md="6">
          <v-img
            src="/images/logiciels/manager/reseau.png"
            class="schema-manager"
          />
        </v-col>
      </v-row>


    </LayoutContainer>
  </div>
</template>

<script setup></script>

<style scoped>

.custom-row {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 2000px) {
  .custom-row {
    width: 70%;
  }
}

.pyramide-details {
  color: #071B1F;
font-size: 2.125rem;
font-style: normal;
font-weight: 400;
line-height: 2.375rem; 
width: 40rem;
}

.v-row {
  margin-top: 0px !important;
  margin-left: auto;
  margin-right: auto;
}
.schema-manager {
}

</style>
