<div class="titulo">
    <h3>Selecione um computador: </h3>
</div>
<div class="option">
    <div class="card" style="width: 18rem; display: inline-block; margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 1</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button name="comp2escolher" class="btn btn-primary" data-nome="c1" id="E1">Escolher</button>
            <button name="comp1cancelar" class="btn btn-primary" data-nome="c1" id="c1">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem; display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 2</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button name="comp2escolher" class="btn btn-primary" data-nome="c2" id="E2">Escolher</button>
            <button name="comp2cancelar" class="btn btn-primary" data-nome="c2" id="c2">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 3</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c3" id="E3" >Escolher</button>
            <button class="btn btn-primary" data-nome="c3" id="c3">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 4</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c4" id="E4" >Escolher</button>
            <button class="btn btn-primary" data-nome="c4" id="c4">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 5</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c5" id="E5" >Escolher</button>
            <button class="btn btn-primary" data-nome="c5" id="c5">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 6</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c6" id="E6" >Escolher</button>
            <button class="btn btn-primary" data-nome="c6" id="c6">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 7</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c7" id="E7" >Escolher</button>
            <button class="btn btn-primary" data-nome="c7" id="c7">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 8</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c8" id="E8" >Escolher</button>
            <button class="btn btn-primary" data-nome="c8" id="c8">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 9</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c9" id="E9" >Escolher</button>
            <button class="btn btn-primary" data-nome="c9" id="c9">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 10</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c10" id="E10" >Escolher</button>
            <button class="btn btn-primary" data-nome="c10" id="c10">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 11</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c11" id="E11" >Escolher</button>
            <button class="btn btn-primary" data-nome="c11" id="c11">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 12</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c12" id="E12" >Escolher</button>
            <button class="btn btn-primary" data-nome="c12" id="c12">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 13</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c13" id="E13" >Escolher</button>
            <button class="btn btn-primary" data-nome="c13" id="c13">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 14</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c14" id="E14" >Escolher</button>
            <button class="btn btn-primary" data-nome="c14" id="c14">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 15</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c15" id="E15" >Escolher</button>
            <button class="btn btn-primary" data-nome="c15" id="c15">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 16</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c16" id="E16" >Escolher</button>
            <button class="btn btn-primary" data-nome="c16" id="c16">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 17</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c17" id="E17" >Escolher</button>
            <button class="btn btn-primary" data-nome="c17" id="c17">Cancelar</button>
        </div>
    </div>
    <div class="card" style="width: 18rem;display: inline-block;margin:30px;">
        <img src="/figmaSchoolLab/SCHOLLLABUFC.png" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Computador 18</h5>
            <p class="card-text">Quer escolher esse computador? Então clique no botão abaixo!</p>
            <button class="btn btn-primary" data-nome="c18" id="E18" >Escolher</button>
            <button class="btn btn-primary" data-nome="c18" id="c18">Cancelar</button>
        </div>
    </div>
</div>