site_logiciels/components/Logiciels/School/Projet.vue

<template>
  <div id="contact">
    <LayoutContainer>
      <v-row class="mt-12 ml-12 mr-12 mb-12">
        <v-col cols="5" class="ml-12">

            <LayoutUISubTitle
          :iconSize="6"
          :iconClasses="iconClasses"
          :titleText="' Contactez-nous '"
        />

            <v-img
              src="/images/logiciels/school/femme-casque.jpg"
              class="femme-casque"
            />


        </v-col>


        <v-col cols="6" class="mt-12">
            <h5 class="title">
              Vous avez un projet ?
            </h5>
            <h6 class="subtitle">
              N'attendez plus, appelez-nous
            </h6>
            <p class="contact-details">
              Vous avez une identité, des besoins, des projets... On est là pour
              vous écouter et vous offrir une offre personnalisée ! Que vous
              soyez une petite ou une structure plus conséquente, notre offre
              s'adapte à toutes les tailles : le prix de l’abonnement au
              logiciel varie en fonction du nombre d'élèves, tout en conservant
              l'intégralité des fonctionnalités.
            </p>
            <v-btn class="btn-contact">
              Nous contacter
            </v-btn>

        </v-col>
      </v-row>

      <v-row class="border-row">
        <v-col cols="2">
          <v-img
            class="logo-cmf"
            src="/images/logiciels/school/cmf_logo_orange.png"
          />
        </v-col>
        <v-col cols="10">
          <div class="cmf-container">
            <h5>Adhérents CMF : bénéficiez de conditions privilégiées</h5>
            <p>
              Si votre établissement d’enseignement artistique est adhérent à la
              Confédération Musicale de France (CMF), vous bénéficiez
              gratuitement, dans le cadre de votre adhésion, de la version
              Opentalent Artist standard et de conditions priviliégiés pour la
              version Opentalent School. Contactez nous direcetement ou
              contactez votre fédération pour obtenir vos codes d’accès.
            </p>
          </div>
        </v-col>
      </v-row>

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

<script setup></script>

<style scoped>
.border-row {
  border: 1px solid #e5e5e5;
  margin-left: 10rem;
  margin-right: 28rem;
  margin-bottom: 3rem;
}
.cmf-container {
  margin-left: 3rem;
  margin-top: 4rem;
  margin-bottom: 4rem;
  width: 30rem;
}

.logo-cmf {
  width: 10rem;
  height: 10rem;
  margin-top: 3rem;
  margin-bottom: 4rem;
  margin-left: 3rem;
}

.btn-contact {
  background: rgba(32, 147, 190, 0.4);;
  border-radius: 6px;
  color: #fff;

  font-weight: 600;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-top: 2rem;
  margin-bottom: 3rem;
}

.contact-details {
  font-weight: 300;
  font-size: 16px;
  line-height: 20px;
  color: #091d20;
  width: 20rem;
}
.title {
  font-weight: 600;
  font-size: 3rem;
  line-height: 18px;
  color: #091d20;
  margin-bottom: 4rem;
}

.subtitle {
  font-weight: 400;
  font-size: 34px;
  line-height: 38px;
  color: #071b1f;
  margin-bottom: 2rem;
}


.femme-casque {
  width: 20rem;
}
</style>