@extends('usuarios.funcionarios.master.layout2')
 
@section('conteudo')

<style>
 
.card {
    box-shadow: 0 1px 3px 0 rgba(0,0,0,.1), 0 1px 2px 0 rgba(0,0,0,.06);
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 0 solid rgba(0,0,0,.125);
    border-radius: .25rem;
}

.card-body {
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1rem;
}

.gutters-sm {
    margin-right: -8px;
    margin-left: -8px;
}

.gutters-sm>.col, .gutters-sm>[class*=col-] {
    padding-right: 8px;
    padding-left: 8px;
}
.mb-3, .my-3 {
    margin-bottom: 1rem!important;
}

.bg-gray-300 {
    background-color: #e2e8f0;
}
.h-100 {
    height: 100%!important;
}
.shadow-none {
    box-shadow: none!important;
}


.breadcrumbs {
          list-style: none;
          margin: 0;
          padding: 0;
        }
        
        .breadcrumbs li {
          list-style: none;
          margin: 0;
          padding: 0;
          display: block;
          float: right;
          font-family: Helvetica Neue,sans-serif;
          font-size: 13px;
          text-transform: uppercase;
          font-weight: 700;
          letter-spacing: .05em;
          line-height: 20px;
          color: hsl(0, 0%, 30%);
        }
        
        .breadcrumbs li a {
          display: block;
          padding: 0 40px 0 0px;
          color: hsl(0, 0%, 30%);
          text-decoration: none;
          height: 20px;
          position: relative;
          perspective: 700px;
        }
        
        .breadcrumbs li a:after {
          content: '';
          width: 20px;
          height: 20px;
          border-color: #333;
          border-style: solid;
          border-width: 1px 1px 0 0;
          
          -webkit-backface-visibility: hidden;
          outline: 1px solid transparent;
          
          position: absolute;
          right: 20px;
          -webkit-transition: all .15s ease;
             -moz-transition: all .15s ease;
              -ms-transition: all .15s ease;
                  transition: all .15s ease;
          -webkit-transform: rotateZ(45deg) skew(10deg, 10deg);
             -moz-transform: rotateZ(45deg) skew(10deg, 10deg);
              -ms-transform: rotateZ(45deg) skew(10deg, 10deg);
                  transform: rotateZ(45deg) skew(10deg, 10deg);
        }
        
        
        .breadcrumbs li a:hover:after {
          right: 15px;
          -webkit-transform: rotateZ(45deg) skew(-10deg, -10deg);
             -moz-transform: rotateZ(45deg) skew(-10deg, -10deg);
              -ms-transform: rotateZ(45deg) skew(-10deg, -10deg);
                  transform: rotateZ(45deg) skew(-10deg, -10deg);
        }
</style>
  
        
<div class="container">
    <div class="main-body">
    
          <!-- Breadcrumb -->
           <div class="row  justify-content-end my-4">
            <div class="col-7  "> 
            <ul class="breadcrumbs">
              <li><a href="#"><span class="fa fa-edit " style="opacity:0.5"></span> Desenvolvedores</a></li>
              <li><a href="#"><span class="fa fa-home"> </span> Início</a></li>
            </ul>
            </div>
        </div>
          <!-- /Breadcrumb -->
    <header class="pb-3 mb-4 border-bottom">
      <a href="/" class="d-flex align-items-center text-dark text-decoration-none">
       <br>
        <span class="fs-4">Criadores da Plataforma Doc-Visão</span>
      </a>
    </header>
    
          <div class="row gutters-sm">
            <div class="col-md-4 mb-3">
              <div class="card">
                <div class="card-body">
                  <div class="d-flex flex-column align-items-center text-center">
                    <img src="https://gestdoc.tech/storage/img/default.jpg" alt="Admin" class="rounded-circle" width="150">
                    <div class="mt-3">
                      <h4>Gelsom Camilo</h4>
                      <p class="text-muted font-size-sm">Engenheiro Informático</p>
                      <p class="text-muted font-size-sm">Desenvolvidor web</p>
                      <button class="btn btn-primary">Seguir</button>
                      <button class="btn btn-outline-primary">Mensagem</button>
                    </div>
                  </div>
                </div>
              </div>
             
            </div>
            <div class="col-md-8">
              <div class="card mb-3">
                <div class="card-body">
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Nome Completo</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                    Gelson Camilo
                    </div>
                  </div>
                  <hr>
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Email</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                  Gelson.Camilo@gestdoc.tech
                    </div>
                  </div>
                  <hr>
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Telefone</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                      +244947896431
                    </div>
                  </div>
                  <hr>
                  <h6 class="mt-30">Laravel <span class="pull-right">80%</span></h6>
                                                <div class="progress progress-sm">
                                                    <div class="progress-bar bg-success" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width:80%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                <h6 class="mt-30">PHP <span class="pull-right">90%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-info" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100" style="width:90%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                <h6 class="mt-30">HTML 5 <span class="pull-right">50%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-danger" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width:50%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                <h6 class="mt-30">Jquery <span class="pull-right">70%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                </div>
              </div>

             

            </div>
          </div>

        </div>
    </div>
    
    <div class="container">
    <div class="main-body">
        <div class="row gutters-sm">
            <div class="col-md-4 mb-3">
              <div class="card">
                <div class="card-body">
                  <div class="d-flex flex-column align-items-center text-center">
                    <img src="https://gestdoc.tech/storage/img/default.jpg" alt="Admin" class="rounded-circle" width="150">
                    <div class="mt-3">
                      <h4>Adilson Manuel </h4>
                      <p class="text-muted font-size-sm">Engenheiro Informático</p>
                      <p class="text-muted font-size-sm">Desenvolvidor web</p>
                      <button class="btn btn-primary">Seguir</button>
                      <button class="btn btn-outline-primary">Mensagem</button>
                    </div>
                  </div>
                </div>
              </div>
             
            </div>
            <div class="col-md-8">
              <div class="card mb-3">
                <div class="card-body">
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Nome Completo</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                  Eng. Adilson De Oliveira Manuel 
                    </div>
                  </div>
                  <hr>
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Email</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                  adilson.manuel@gestdoc.tech
                    </div>
                  </div>
                  <hr>
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Telefone</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                   946554486
                    </div>
                  </div>
                  <hr>
                  <h6 class="mt-30">Java <span class="pull-right">80%</span></h6>
                                                <div class="progress progress-sm">
                                                    <div class="progress-bar bg-success" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width:80%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                <h6 class="mt-30">Flutter <span class="pull-right">90%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-info" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100" style="width:90%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                <h6 class="mt-30">jQuery <span class="pull-right">50%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-danger" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width:50%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                <h6 class="mt-30">Mysql <span class="pull-right">70%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                </div>
              </div>
         </div>
    </div>
  
    
    <div class="container">
    <div class="main-body">
        <div class="row gutters-sm">
            <div class="col-md-4 mb-3">
              <div class="card">
                <div class="card-body">
                  <div class="d-flex flex-column align-items-center text-center">
                    <img src="https://gestdoc.tech/storage/img/default.jpg" alt="Admin" class="rounded-circle" width="150">
                    <div class="mt-3">
                      <h4>Emanuel Airosa </h4>
                      <p class="text-muted font-size-sm">Tecnico de Informático</p>
                      <p class="text-muted font-size-sm">Desenvolvidor web</p>
                      <button class="btn btn-primary">Seguir</button>
                      <button class="btn btn-outline-primary">Mensagem</button>
                    </div>
                  </div>
                </div>
              </div>
             
            </div>
            <div class="col-md-8">
              <div class="card mb-3">
                <div class="card-body">
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Nome Completo</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                  Emanuel de Jesus Casimiro Airosa
                    </div>
                  </div>
                  <hr>
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Email</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                  emanuel.airosa@gestdoc.tech
                    </div>
                  </div>
                  <hr>
                  <div class="row">
                    <div class="col-sm-3">
                      <h6 class="mb-0">Telefone</h6>
                    </div>
                    <div class="col-sm-9 text-muted font-size-sm">
                   941658567
                    </div>
                  </div>
                  <hr>
                  <h6 class="mt-30">HTML5 <span class="pull-right">80%</span></h6>
                                                <div class="progress progress-sm">
                                                    <div class="progress-bar bg-success" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width:80%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                
                                                <h6 class="mt-30">Css <span class="pull-right">50%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-danger" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width:50%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                                                <h6 class="mt-30">Javascript <span class="pull-right">70%</span></h6>
                                                <div class="progress  progress-sm">
                                                    <div class="progress-bar bg-warning" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%;"> <span class="sr-only">50% Complete</span> </div>
                                                </div>
                </div>
              </div>
         </div>
    </div>
  
    

    
@endsection