<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  <meta name="keywords" content="Portfólio José Pedro Fernandes, Programador Full-Stack, Desenvolvimento Web, SQL, PHP, Angular, Javascript, Laravel, NodeJs, Desenvolvedor de Software">
  <meta name="description" content="My name is José Pedro Sampaio Fernandes, I am a full-stack web developer. Explore my porfolio, see my projects and contact me!">
  <meta name="author" content="José Pedro Fernandes" />
  <meta name="theme-color" content="#0f054c">
  <meta name="referrer" content="same-origin">
  <link rel="shortcut icon" href="favicon.ico">
  <link rel="icon" href="favicon.ico" type="image/x-icon">

  <title> José Fernandes - Portfólio </title>

  <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" async defer rel="stylesheet">
  <link href="css/font-awesome.min.css" rel="stylesheet" />
  <link href="css/style.css" rel="stylesheet" />
  <link href="css/responsive.css" rel="stylesheet" />
  
  <link rel="manifest" href="manifest.json">
</head>
<!-- página erro 404 -->
<body class="sub_page">
    <div class="hero_area">
    <header class="header_section">
    <div class="container-fluid no_select">
        <nav class="navbar navbar-expand-lg custom_nav-container ">
          <!-- Escolha de linguagem -->
            <div>
                <div class="navbar-brand" onclick="changeLanguage('pt_pt')" style="cursor:pointer">
                    <span class="lang-sm">
                        pt                    </span>
                </div>
                <div class="navbar-brand">
                    <span class="lang-sm">
                        |
                    </span>
                </div>
                <div class="navbar-brand" onclick="changeLanguage('en_en')" style="cursor:pointer">
                    <span class="lang-sm">
                        EN                    </span>
                </div>
            </div>
            <!-- menu toogle para mobile -->
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class=""> </span>
            </button>

            <!-- navbar -->
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav">
                    <li class="nav-item ">
                        <a class="nav-link" href="/">Home                                                    </a>
                    </li>
                    <li class="nav-item ">
                        <a class="nav-link" href="skills">Skills</a>
                    </li>
                    <li
                        class="nav-item d-none-sm d-none-md ">
                        <a class="nav-link"
                            href="responsive">Mobile Devices</a>
                    </li>
                    <li class="nav-item ">
                        <a class="nav-link" href="portfolio">Projects</a>
                    </li>
                </ul>
            </div>
        </nav>
    </div>
</header>

 <!-- Modal Sucesso Ao enviar Email (tablet e pc)-->
 <div id="ModalSucesso" style="font-size:20px" class="d-none-sm">
     <div class="d-none-sm">
         <img src="images/success.webp" alt="icon_sucesso" width="40px" height="40px">
         Your message has been sent!</span>
     </div>
 </div>
   <!-- Modal Sucesso Ao enviar Email (telemovel)-->
 <div id="ModalSucesso1" style="font-size:20px" class="d-none-md d-none-lg w-100">
     <div class="d-none-md d-none-lg">
         <div class="row">
             <div class="col-3 img-success">
                 <img src="images/success.webp" alt="icon_sucesso" width="40px" height="40px" class="center-everything">
             </div>
             <div class="col-9">
                 Your message has been sent!</span>
             </div>
         </div>
     </div>
 </div>    </div>
    
     <section class="service_section layout_padding">
       <div class="service_container">
         <div class="container center-everything">
          <p style="margin-bottom:-10px" clasS="p404">
          Page Not Found          </p>
            <div class="e404">
              404
            </div>
           <div class="btn-box">
             <a href="/" style="border-radius:8px" class="no_select">
             Home Page             </a>
           </div>
         </div>
       </div>
     </section>

  <!-- Seção de contacto -->
<section class="info_section layout_padding2" id="contactos">
    <div class="container">
      <div class="heading_container heading_center psudo_white_primary mb_45 mb-5">
        <h2>
        Contact <span>Me</span>        </h2>
      </div>
      <div class="row">
        <div class="col-lg-8 col-md-8 col-sm-12 coluna-8">
          <h4>
            Send me a mail:          </h4>
          <form onsubmit="return validateEmail()" action="send_mail.php" method="post" id="form_contacto" name="form_contacto">
                      <input type="hidden" name="csrf_token" value="af4b5c6a51f40697b9c4246f37c52189b5b5cc6bca13086400b3e48ee0b9bea4">
            <input type="email" id='email' name="email" autocomplete="email" placeholder=" Email Address" >
            
            <textarea class="mt-3" id="conteudoEmail" name="conteudoEmail" cols="30" rows="3" placeholder=" Message"></textarea>
            <!-- Parágrafo para exibir mensagens de erro -->
            <p id="errorMessage" class="error-message mt-2"></p>
            <div class="row">
              <div class="col-lg-6 col-md-6 col-sm-12">
                 <!-- Cloudflare turnstile -->
              <div
                class="cf-turnstile"
                data-sitekey="0x4AAAAAAAyIyLNObRrY1S01"
                data-callback="turnstileCallback"
              ></div>
              </div>
              <div class="col-lg-6 col-md-6 col-sm-12">
                <button class="enviar" type="submit"> Send</button>
              </div>
            </div>
          </form>
        </div>
      <div class="col-4 d-none-sm">
          <div class="info_contact mt-md">
            <div class="contact_link_box">
              
              <div onclick="email()" class="link-email">
                <i class="fa fa-envelope d-none-md" aria-hidden="true"></i>
                <span class="fontS-md">
                  <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f08a95809594829f9695829e919e94958383919d8091999fb0979d91999cde939f9d">[email&#160;protected]</a>
                </span>
              </div>
            </div>
          </div>
          <div class="info_social">
            <div class="link-email">
              <img src="images/linkdin-icon.webp" alt="Linkdin Link" class="filtro-azul-para-branco" width="96px" height="50px" style="float: right;cursor: pointer;margin-left:20px" onclick="linkdin()">
            </div>
            
          </div>
        </div>
        <div class="col-4 d-none-lg d-none-md mt-3">
          <div class="info_contact">
            <div class="contact_link_box">
              
              <div onclick="email()" class="link-email">
                <span style="font-size: 13px;">
                  <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d0aab5a0b5b4a2bfb6b5a2beb1beb4b5a3a3b1bda0b1b9bf90b7bdb1b9bcfeb3bfbd">[email&#160;protected]</a>
                </span>
              </div>
            </div>
          </div>
          <div class="info_social">
            <div class="link-email">
              <img src="images/linkdin-icon.webp" alt="Linkdin Link" class="filtro-azul-para-branco" width="96px" height="50px" style="float: right;cursor: pointer;margin-left:20px" onclick="linkdin()">
            </div>
            
          </div>
        </div>
        
      </div>
        
    
    </div>
  </section>

  <!-- Seção do footer -->
  <section class="footer_section">
    <div class="container">
      <p>
        Portfólio - José Pedro Fernandes 
        <br>
        <a target="_blank" href="https://www.github.com/JoseFernandes15/portfolio">www.github.com/JoseFernandes15/portfolio</a>
      </p>
    </div>
  </section>

  <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script>
  <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous">
  </script>
  <script type="text/javascript" src="js/bootstrap.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js">
  </script>
  <script type="text/javascript" src="js/custom.js" ></script>

</body>   
</html>