Contacel

<!DOCTYPE html><html lang=’en’ class=”>  <head>    <script src=”https://kit.fontawesome.com/68e0ee1317.js” crossorigin=”anonymous”></script>    <title>Intranet Contacel</title>    <meta charset=’UTF-8′>    <meta name=”viewport” content=”width=device-width, initial-scale=1″>    <title>Search Bar Demo</title>    <link rel=”shortcut icon” type=”x-icon” href=”images/CONTACEL – SIMBOLO (1).ico”/>    <style>        @import url(‘https://fonts.googleapis.com/css2?family=Montserrat:wght@200&family=Source+Sans+Pro:wght@600&display=swap’);
        i{            float: right;            display: flex;            position: relative;            margin-left: -30px;        }        .topo{            display: flex;            margin-top: -100px;            border: 0 solid white;            background-color: white;            padding: 60px 500px;            align-content: center;            justify-content: center;            box-shadow: 0px 12px 20px 0px rgba(0,0,0,0.2);        }        .centralizar{            display: flex;            align-content: center;            justify-content: center;            margin-top: 20px;        }        .allb{            display: flex;            justify-content: space-evenly;        }        .Contacel {            display: block;            margin: 0 auto;        }        body {            margin: 50px auto;            background: linear-gradient(-45deg,green, rgb(30, 175, 30), #f1742c , #f57b0a);            background-size: 400% 400%;            animation: gradient 30s ease infinite;            height: 100vh;        }        @keyframes gradient {            0% {        background-position: 0% 50%;            }            50% {                background-position: 100% 50%;            }            100% {                background-position: 0% 50%;            }        }
        form {            background-color: #f18a36;;            display: flex;            width: 300px;            height: 40px;            border-radius: 150px;            margin-left: 40px;            margin-top: 10px;
        }
        .botaozin {            font-family: ‘Montserrat’, sans-serif;            all: unset;            color: #fff;            height: 100%;            width: 100%;            padding: 6px 10px;            margin-top: -5px;            margin-left: 6px;
        }
        ::placeholder {            font-family: ‘Montserrat’, sans-serif;            color: #fff;            opacity: 0.6;
        }
        svg {            font-family: ‘Montserrat’, sans-serif;            color: #fff;            fill: currentColor;            width: 24px;            height: 24px;            padding: 10px;
        }
        button {            font-family: ‘Montserrat’, sans-serif;            all: unset;            cursor: pointer;            width: 44px;            height: 44px;
        }        input[type=”search”]::-webkit-search-decoration,        input[type=”search”]::-webkit-search-cancel-button,        input[type=”search”]::-webkit-search-results-button,        input[type=”search”]::-webkit-search-results-decoration {            display: none;        }        .dropbtn {            margin-right: 30px;            margin-left: 30px;            font-family: ‘Montserrat’, sans-serif;            background-color: #f3872e;            color: white;            font-size: 13px;            min-width: 150px;            text-align: center;            cursor: pointer;            margin-top: 100px;            border-radius: 25px;            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.356);        }        .dropbtn:hover, .dropbtn:focus {            background-color: #d66f1b;
        }
        .dropdown {            position: relative;            display: inline-block;        }
        .dropdown-content {            border-radius: 20px;            font-family: ‘Source Sans Pro’, sans-serif;            display: none;            position: relative;            background-color: #f1f1f1;            min-width: 160px;            overflow: auto;            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);            z-index: 1;        }
        .dropdown-content a {            color: black;            padding: 12px 48px;            text-decoration: none;            display: block;        }
        .dropdown a:hover {background-color: #ddd;}
        .show {display: block;}
        .btndrop {            margin-left: 30px;            margin-right: 30px;            font-family: ‘Montserrat’, sans-serif;            background-color: #f3872e;            color: white;            font-size: 13px;            min-width: 150px;            text-align: center;            cursor: pointer;            margin-top: 100px;            border-radius: 25px;            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.356);        }        .btndrop:hover, .btndrop:focus {            background-color: #d66f1b;
        }        .downdrop {            position: relative;            display: inline-block;        }        .content-dropdown {            border-radius: 20px;            font-family: ‘Source Sans Pro’, sans-serif;            display: none;            position: relative;            background-color: #f1f1f1;            min-width: 160px;            overflow: auto;            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);            z-index: 1;        }        .content-dropdown a {            color: black;            padding: 12px 48px;            text-decoration: none;            display: block;        }        .downdrop a:hover {background-color: #ddd;}
        .show1 {display: block;}
        .btndrop1 {            margin-left: 30px;            margin-right: 30px;            font-family: ‘Montserrat’, sans-serif;            background-color: #f3872e;            color: white;            font-size: 13px;            min-width: 150px;            text-align: center;            cursor: pointer;            margin-top: 100px;            border-radius: 25px;            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.356);        }        .btndrop1:hover, .btndrop1:focus {            background-color: #d66f1b;        }        .downdrop1 {            position: relative;            display: inline-block;        }        .content-dropdown1 {            border-radius: 20px;            font-family: ‘Source Sans Pro’, sans-serif;            display: none;            position: relative;            background-color: #f1f1f1;            min-width: 160px;            overflow: auto;            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);            z-index: 1;        }        .content-dropdown1 a {            color: black;            padding: 12px 48px;            text-decoration: none;            display: block;        }        .downdrop1 a:hover {background-color: #ddd;}
        .show2 {display: block;}
        .btndrop2 {            margin-left: 30px;            margin-right: 30px;            font-family: ‘Montserrat’, sans-serif;            background-color: #f3872e;            color: white;            font-size: 13px;            min-width: 150px;            text-align: center;            cursor: pointer;            margin-top: 100px;            border-radius: 25px;            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.356);        }        .btndrop2:hover, .btndrop1:focus {            background-color: #d66f1b;        }        .downdrop2 {            position: relative;            display: inline-block;        }        .content-dropdown2 {            border-radius: 20px;            font-family: ‘Source Sans Pro’, sans-serif;            display: none;            position: relative;            background-color: #f1f1f1;            min-width: 160px;            overflow: auto;            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);            z-index: 1;        }        .content-dropdown2 a {            color: black;            padding: 12px 48px;            text-decoration: none;            display: block;        }        .downdrop2 a:hover {background-color: #ddd;}
        .show3 {display: block;}
        .email{            position: absolute;            width: 56px;            top: 32px;            right: 10px;            border-radius: 28px;            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        }    </style>    </head>
    <body>        <img onclick=”openInNewTab(‘https://mail.contacel.net/’);” class=”email” src=”images/Rosa Minimalista Dia da Mulher Instagram Post.png”>    <script>        function openInNewTab(url) {            window.open(url, ‘_blank’).focus();           }    </script>
<div class=”topo”>    <img onclick=”openInNewTab(‘https://contacel.net/’);” class=”Contacel” src=”images/CONTACEL – LOGO HORIZONTAL.png”>    <div class=”centralizar”>    <form role=”search” id=”form”>      <input class=”botaozin” type=”search” id=”query” name=”q” placeholder=”Pesquisar na web”>      <button>        <svg viewBox=”0 0 1024 1024″><path class=”path1″ d=”M848.471 928l-263.059-263.059c-48.941 36.706-110.118 55.059-177.412 55.059-171.294 0-312-140.706-312-312s140.706-312 312-312c171.294 0 312 140.706 312 312 0 67.294-24.471 128.471-55.059 177.412l263.059 263.059-79.529 79.529zM189.623 408.078c0 121.364 97.091 218.455 218.455 218.455s218.455-97.091 218.455-218.455c0-121.364-103.159-218.455-218.455-218.455-121.364 0-218.455 97.091-218.455 218.455z”></path></svg>      </button>    </form>    </div></div>    <script>      const f = document.getElementById(‘form’);      const q = document.getElementById(‘query’);      const google = ‘https://www.google.com/search?q=’;
      function submitted(event) {        event.preventDefault();        const url = google + ‘+’ + q.value;        const win = window.open(url, ‘_blank’);        win.focus();      }      f.addEventListener(‘submit’, submitted);    </script><div class=”allb”><div class=”dropdown”>    <button onclick=”myFunction()” class=”dropbtn”>TRABALHISTA &#160<i class=”fas fa-chevron-down”>&#160&#160&#160</i></button>    <div id=”myDropdown” class=”dropdown-content”>      <a onclick=”openInNewTab(‘https://www.gustavo.com/’);”>MARIA</a>      <a onclick=”openInNewTab(‘https://www.a10fiscal.com.br/’);”>A10</a>      <a onclick=”openInNewTab(‘https://cav.receita.fazenda.gov.br/autenticacao/login/index’);”>eCAC</a>    </div></div><div class=”downdrop”>    <button onclick=”myFunctione()” class=”btndrop”>FISCAL &#160<i class=”fas fa-chevron-down”>&#160&#160&#160</i></button>    <div id=”Dropdown” class=”content-dropdown”>      <a onclick=”openInNewTab(‘https://www.iobonline.com.br/’);”>IOB</a>      <a onclick=”openInNewTab(‘https://www.a10fiscal.com.br/’);”>A10</a>      <a onclick=”openInNewTab(‘https://cav.receita.fazenda.gov.br/autenticacao/login/index’);”>eCAC</a>      <a onclick=”openInNewTab(‘https://www.iobonline.com.br/’);”>TESTE</a>    </div></div><div class=”downdrop1″>    <button onclick=”myFunctione1()” class=”btndrop1″>CONSULTORIA &#160<i class=”fas fa-chevron-down”>&#160&#160&#160</i></button>    <div id=”Dropdown1″ class=”content-dropdown1″>      <a onclick=”openInNewTab(‘https://www.iobonline.com.br/’);”>IOB</a>      <a onclick=”openInNewTab(‘https://www.a10fiscal.com.br/’);”>A10</a>      <a onclick=”openInNewTab(‘https://cav.receita.fazenda.gov.br/autenticacao/login/index’);”>eCAC</a>      <a onclick=”openInNewTab(‘https://www.iobonline.com.br/’);”>TESTE</a>    </div></div><div class=”seta4″><div class=”downdrop2″>    <button onclick=”myFunctione2()” class=”btndrop2″>DIVERSOS &#160<i class=”fas fa-chevron-down”>&#160&#160&#160</i></button>    <div id=”Dropdown2″ class=”content-dropdown2″>      <a onclick=”openInNewTab(‘https://www.iobonline.com.br/’);”>IOB</a>      <a onclick=”openInNewTab(‘https://www.a10fiscal.com.br/’);”>A10</a>      <a onclick=”openInNewTab(‘https://cav.receita.fazenda.gov.br/autenticacao/login/index’);”>eCAC</a>      <a onclick=”openInNewTab(‘https://www.iobonline.com.br/’);”>TESTE</a>    </div></div></div></div>  <script>  function myFunction() {    document.getElementById(“myDropdown”).classList.toggle(“show”);  }      window.onclick = function(event) {    if (!event.target.matches(‘.btndrop’)) {      var dropdowns = document.getElementsByClassName(“content-dropdown”);      var i;      for (i = 0; i < dropdowns.length; i++) {        var openDropdown = dropdowns[i];        if (openDropdown.classList.contains(‘show’)) {          openDropdown.classList.remove(‘show’);        }      }    }  }  function myFunctione() {  document.getElementById(“Dropdown”).classList.toggle(“show1”);}
window.onclick = function(event) {  if (!event.target.matches(‘.dropbtn’)) {    var dropdown = document.getElementsByClassName(“dropdown-content”);    var y;    for (y = 0; y < dropdown.length; y++) {      var openDropdow = dropdown[y];      if (openDropdow.classList.contains(‘show1’)) {        openDropdow.classList.remove(‘show1’);      }    }  }}function myFunctione1() {  document.getElementById(“Dropdown1”).classList.toggle(“show2”);}
window.onclick = function(event) {  if (!event.target.matches(‘.dropbtn1’)) {    var dropdown1 = document.getElementsByClassName(“dropdown-content1”);    var y1;    for (y1 = 0; y1 < dropdown1.length; y1++) {      var openDropdow1 = dropdown1[y1];      if (openDropdow1.classList.contains(‘show2’)) {        openDropdow1.classList.remove(‘show2’);      }    }  }}function myFunctione2() {  document.getElementById(“Dropdown2”).classList.toggle(“show3”);}
window.onclick = function(event) {  if (!event.target.matches(‘.dropbtn2’)) {    var dropdown2 = document.getElementsByClassName(“dropdown-content2”);    var y2;    for (y2 = 0; y2 < dropdown2.length; y2++) {      var openDropdow2 = dropdown2[y2];      if (openDropdow2.classList.contains(‘show3’)) {        openDropdow2.classList.remove(‘show3’);      }    }  }}  </script>  </body></html><!–FEITO POR GUSTAVO ANTÔNIO :)–>>