@charset "utf-8";

body {
    font-family: arial,Arial, Helvetica, sans-serif;
    font-size: 25px;
}

h1

{
    color: rgba(231, 157, 18, 0.911);
    text-align: center;
    text-shadow: 3px 3px 3px rgba(90, 82, 72, 0.233);
    
}

strong

{
    color: #e0840b;

}

h4

{
    color: rgba(59, 62, 66, 0.911);
    text-align: center;
    
}

label

{


}

/* form
{
    text-align: center;
    
} */

/* BLOCO INDEX*/


.logo_index

{
    display: block;
	margin: center;

}



/* BLOCO FOOTER */

footer
{
    background: #ffab62;
    width: 100%;
    height: 30px;
    position: fixed;
    bottom: 0;
    left: 0;
    color: #ffffff;
    background-color: #05031f;
    font-size: 15px;
    padding: 20px 0 0 0;
    text-align: center;
}

/* BLOCO FORMS */

.botao

{
    text-align: center;


}

.cad_form

{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 5px 5px 5px 5px rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  padding: 80px;


}

.retorno

{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
  border-radius: 10px;
  padding: 80px;

}

input, select

{
  border: 1px solid #ec9f39c0;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  background-color: #f5f5f5;
  color: #333;

}


input:hover, select:hover 
{
   background-color: #eee;
}
  
  input:focus, select:focus 
  
{
    border-color: #6d9bf1;
    box-shadow: 0 0 5px rgba(109, 155, 241, 0.5);
}

select 

{
    appearance: none;
    -webkit-appearance: none;
    background-image: url("arrow.png");
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 20px; /* para deixar espaço para a imagem da seta */
  }

button 

{
    border: 3px solid #e0840b;;
    background-color: #e0840b;
    color: #ffffff;;
    padding: 5px 20px;
    cursor: pointer;
    font-weight: bold;
    font-size: 20px;
}

button:hover {

    border: 3px solid#46ff0eb2;
    background-color: #46ff0eb2;;
    color: #fff;
    font-size: 22px;


}

/* BLOCO MENU FIXO */


img {
    display: block;
    max-width: 100%;
    height: 50px;
    margin: 10px 0;
    float: left;
  }

nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #0b0827;
    color: #428fbba8;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.4);
    font-size: 20px;
  }
  
  nav ul {
    margin: 8px;
    padding: 8px;
    list-style: none;
  }
  
  nav > ul > li {
    display: inline-block;
    margin-right: 20px;
    position: relative;
  }
  
  nav > ul > li > ul {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #c2490465;
    display: none;
  }
  
  nav > ul > li:hover > ul {
    display: block;
  }
  
  nav a {
    display: block;
    padding: 20px;
    color: #000000;
    text-decoration: none;
  }



/*  BLOCO BODY */

.dash_body

{
    margin: 120px 0px 0px 0px;

}



/* PRIMEIRO BLOCO ESTILO */

.dash_geral

{
    margin:5% 5% 3% 5%;

}


.dash_monitor

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(255, 145, 0);
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;


}



.dash_teclado

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(64, 145, 10);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_mouse

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(201, 76, 108);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;

}

.dash_headset

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(103, 64, 165);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_tonner

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(22, 170, 196);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_telefone

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(22, 170, 196);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

/* SEGUNDO BLOCO ESTILO */

.dash_geral2

{
    margin:3% 5% 5% 5%;

}

.dash_cpu_staff


{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(196, 193, 22);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}


.dash_cpu_exp

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(22, 34, 196);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}


.dash_cpu_cor

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(78, 187, 206);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_note

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(113, 214, 54);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_relogio

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(219, 30, 219);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}


/* TERCEIRO BLOCO ESTILO */


.dash_geral3

{
    margin:3% 5% 5% 5%;

}


.dash_tsp3710

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(117, 68, 117);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}


.dash_tmp301


{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(90, 48, 107);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_tmp305

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(82, 6, 82);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_tyellom

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(253, 249, 11);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_tblack

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(22, 16, 22);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

/* QUARTO BLOCO ESTILO */

.dash_geral4

{
    margin:3% 5% 5% 5%;

}

.dash_tmagenta

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(223, 99, 68);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}

.dash_tciano

{
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    width:19%;
    height:200px; 
    background-color: rgb(26, 180, 190);
    /* background-image: linear-gradient( to right, #f5ba76, #e69b12, #2174f150, #2f7ebe4d ); */
    color: white;
    text-align: center;
    display: inline-block;
    font-size: 40px;
}