header{
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   background-image: url('../../imagens/plano_fundo_universo.jpeg');
   background-size: contain;
   background-repeat: repeat;
   background-color: rgb(56, 56, 56);

   color: white;
   padding: 10px;

   height: 100%;
   padding-top: 15px;
   padding-left: 20px;
   padding-right: 20px;
   
   box-shadow: 0px 0px 5px 1px rgb(0 0 0 / 50%);
   -webkit-box-shadow: 0px 0px 5px 1px rgb(0 0 0 / 50%);
   -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
}

#divHeader{
   display: flex;
   flex-direction: row;
   justify-content: space-between;
}

header a{
   font-size: 14pt;
}

header a:link,
header a:visited {
   color: white;
   white-space: nowrap;
}

header > div{
   display: flex;
   /*align-items: center;*/
}

   header #divNavHeader{
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      height: 100%;
      width: 100%;
   }

      header #divNavHeader input[type=image]{
         width: auto;
         height: 35px;
         background-color: transparent;
         border: none;

         border-top-right-radius: 6px;
         border-bottom-right-radius: 6px;
      }

      header #divLinhaHeader{
         display: flex;
         justify-content: space-between;
      }

      header #divBotaoMenu{
         display: none;
      }

      header #formLinha{
         display: flex;
         align-items: center;
         background-color: white;
         height: 42px;
         border-radius: 6px;
         /*border: 1px solid gray;*/
         gap: 0;
         width: auto;
      }

      header #formLinha > *{
         height: 100%;
         border: none;
         outline: 0;
      }

      header #marca{
         background-color: rgba(163, 163, 163, 0.212);
         border-right: 2px solid gray;
         border-top-left-radius: 6px;
         border-bottom-left-radius: 6px;
         
      }

      header #search{
         width: 450px;
         max-width: 450px;
         border-radius: 6px;
      }

      header #divSearch-celular{
         display: none;
      }


header #divMenu{
   display: flex;
   height: fit-content;
   align-items: center;
}

header #divMenu > div{
   display: flex;
   flex-direction: column;
   justify-content: center;
   height: 100%;
   margin: 0px 3px;
}

header #divMenu > div > div{
   display: flex;
   flex-direction: column;
   justify-content: center;
   height: 100%;
}

header #divMenu > div > div > .imgPerfil{
   width: 40px;
   height: 40px;
   border: none;
   background-color: transparent;
   /* border-radius: 50%; */
}

header #divMenu > #divCarrinho{
   display: flex;
   flex-direction: row;
   justify-content: right;
   align-items: flex-start;
   
   cursor: pointer;
   width: 40px;
   min-width: 40px;
   height: 40px;
   min-height: 40px;

   background-image: url('../../imagens/menu/carrinho.svg');
   background-repeat: no-repeat;
   background-position: center center;
   background-size: 80%;
   background-color: transparent;
}

   header #divMenu > #divCarrinho > #divValor{
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;

      width: 17px;
      height: 17px;
      border-radius: 50%;
      font-size: 10pt;
      font-weight: bold;
      color: white;
      text-align: center;
      vertical-align: middle;
      background-color: #E03D6F;
   }

/*Hover*/
header #divMenu > div > .divItens{
   position: absolute;
   top:   45px;
   right: 10px;
   cursor: pointer;
   height: fit-content;
   display: none; 
   background-color: #35363a;
}

header #divMenu > div:hover .divItens2{
   display: flex;
   flex-direction: column;
   z-index: 100;
}

header #divMenu > div > div > a{
   padding: 5px 10px;
   border: 1px solid white;
}


header #divMenu > div > div > a:hover{
   text-decoration: none;
  /* background-color: #E03D6F;*/
   background-color:  rgb(78, 26, 221);
}

#logout{
   color: yellow;
}

header #divMenu > div > div > #logout:hover{
   text-decoration: none;
  color: white;
   background-color:  red;
}
/*Fim Hover*/


.divItens img{
   width:  auto;
   height: 25px;
   vertical-align: middle;
   margin-right: 5px;
}

/******************************[css to Header Adm]******************************************/
#divMenu > #menuAdm{
   display: flex;
   flex-direction: row;
}

#divMenu > #menuAdm > div{
   display: flex;
   flex-direction: row;
   justify-content: right;
}


#buttonIcon{
   display: flex;
   flex-direction: row;
   justify-content: right;
   align-items: flex-start;
   cursor: pointer;
   width: 40px;
   min-width: 40px;
   height: 45px;
   min-height: 40px;
   background-repeat: no-repeat;
   background-position: center center;
   background-size: 80%;
   background-color: transparent;
}

#buttonIcon > #divBoll {
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   width:  17px;
   height: 17px;
   border-radius: 50%;
   font-size: 10pt;
   font-weight: bold;
   color: white;
   text-align: center;
   vertical-align: middle;
   background-color: #E03D6F;
}