/* Style: gen2 Type: buttons*/

/* GENERIC BUTTON block padding:3px */
.button
{
	color: black;
	text-decoration:none;
	display:block;
	border:2px solid #dddddd;
	text-align:center;
	border-radius:5px;
	padding:3px;

	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);

	/*transition if works*/
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;

	/* cursor*/
	cursor: pointer;
}
.button:hover
{
	color: black;
	border:2px solid #999;

}
.button:active {
	color: black;
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#ffffff));
	background:-moz-linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);
	background: linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);
	
}

/* GENERIC BUTTON block NO-padding border-radius*/
.buttonactive
{
	color: #0000cc;
	text-decoration:none;
	display:block;
	border:2px solid #9999ee;
	text-align:center;
	border-radius:5px;

	/*gradiente*/
	background: #eeeeee;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#ffffff));
	background:-moz-linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);
	background: linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);

	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;

	/* cursor*/
	cursor: pointer;
}

/* SECOND TYPE inline padding NO-border-radius*/
.button2
{
	color: black;
	text-decoration:none;
	display:inline;
	border:1px solid #cccccc;
	text-align:center;
	padding: 5px 5px;

	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);

	/*transition if works*/
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;

	/* cursor*/
	cursor: pointer;
}
.button2:hover
{
	color: black;
	border:1px solid #999;
}

/* SECOND TYPE inline padding NO-border-radius */
.button2active
{
	color: #0000cc;
	text-decoration:none;
	display:inline;
	border:1px solid #cccccc;
	text-align:center;
	padding: 5px 5px;

	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	
	/*transition if works*/
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;

	/* cursor*/
	cursor: pointer;
}
.button2active:hover
{
	color: #0000cc;
	border:1px solid #9999ee;
}

/* THIRD TYPE inline padding border-radius*/
.button3
{
	color: black;
	text-decoration:none;
	display:inline;
	border:1px solid #cccccc;
	text-align:center;
	padding: 10px 10px;
	border-radius:5px;

	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);

	/*transition if works*/
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.button3:hover
{
	color: black;
	border:1px solid #000000;
}

/* THIRD TYPE inline 5px-padding border-radius*/
.button3a
{
	color: black;
	text-decoration:none;
	display:inline;
	border:1px solid #cccccc;
	text-align:center;
	padding: 5px 5px;
	border-radius:5px;
	cursor: pointer;

	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);

	/*transition if works*/
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.button3a:hover
{
	border:1px solid #000000;
}

/* FOURTH TYPE inline padding:3px */
.button4
{
	color: black;
	text-decoration:none;
	display:inline;
	border:1px solid #cccccc;
	text-align:center;
	border-radius:5px;
	padding:3px;
	cursor:pointer;

	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);

	/*transition if works*/
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.button4:hover
{
	color: black;
	border:1px solid #000000;
}

/* FAKE	*/
.button_fake
{
  color: black;
	display:block;
	border:1px solid #dddddd;
	text-align:center;
	border-radius:5px;

	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
}
/* LIST BUTTON SYLES FOR MENUS*/
.menu{
	font-size: 14px;
	width: 160px;
	padding: 5px 5px;
}

/* LIST BUTTON SPECIFIC */
.crea_account{
	font-size: 14px;
	width: 200px;
	padding: 20px 20px;
	margin-left: auto;
	margin-right: auto;
}
.vai_account_homepage, .logout_homepage{
	font-size: 14px;
	width: 200px;
	padding: 5px 5px;
	margin-left: auto;
	margin-right: auto;
}

/* SEZIONE
      SISTEMA */

/* BUTTON 1 */
.button_sistema{
	color: white;
	text-decoration:none;
	display:block;
	border:2px solid #2A0FA1;
	text-align:center;
	border-radius:5px;
	padding:3px;

	/*gradiente*/
	background: #14268A;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#14268A), to(#24369A));
	background:-moz-linear-gradient(0% 90% 90deg, #24369A, #14268A);
	background: linear-gradient(0% 90% 90deg, #24369A, #14268A);

	/*transition if works*/
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;

	/* cursor*/
	cursor: pointer;
}
.button_sistema:hover
{
	color: white;
	border:2px solid #7b7bff;
}
.button_sistema:active{
	color: white;

	/*gradiente*/
	background: #14268A;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#24369A), to(#14268A));
	background:-moz-linear-gradient(0% 90% 90deg, #14268A, #24369A);
	background: linear-gradient(0% 90% 90deg, #14268A, #eeeeee);

}

/* BUTTON ACTIVE */
.buttonactive_sistema
{
	color: white;
	text-decoration:none;
	display:block;
	border:2px solid #107BA1;
	text-align:center;
	border-radius:5px;

	/*gradiente*/
	background: #1054A1;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#1054A1), to(#2064B1));
	background:-moz-linear-gradient(0% 90% 90deg, #2064B1, #1054A1);
	background: linear-gradient(0% 90% 90deg, #2064B1, #eeeeee);

	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;

	/* cursor*/
	cursor: pointer;
}

.menu_sistema{
	font-size: 14px;
	width: 160px;
	padding: 5px 5px;
}

/* NEW MENU */


.menu_button, .menu_sub{
  display: block ;
  cursor: pointer;
  transition: all .4s ease-in-out;
}

/* Menu Main - Button */

.menu_button {  
  color: black;
  font-size: 14px ; 
	text-decoration: none;
	display: block;
	border: 2px solid #dddddd;
	border-radius:5px;
	padding: 5px;
	
	/*gradiente*/
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#eeeeee));
	background:-moz-linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	background: linear-gradient(0% 90% 90deg, #eeeeee, #ffffff);
	
}

.menu_button:hover
{
	color: black;
	border:2px solid #999;

}

.menu_button:active {
	color: black;
	background: #ffffff;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#ffffff));
	background:-moz-linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);
	background: linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);
	
}

span:target .menu_button {

  color: #0000cc;
	text-decoration:none;
	display:block;
	border:2px solid #9999ee;
	text-align:center;
	border-radius:5px;

	/*gradiente*/
	background: #eeeeee;
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#ffffff));
	background:-moz-linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);
	background: linear-gradient(0% 90% 90deg, #ffffff, #eeeeee);

}

/* Menu Sub - Button */

.menu_sub {
  padding: 3px;
  text-decoration: none;
  color: black;
}

.menu_sub:hover{
  color: #0000cc;
}

.menu_sub:target{
  color: #0000cc;
}

.menu_sub_active{
  color: #0000cc;
}

/* Submenu */
.menu_submenu {
  display: block ;
  height: 0px ;
  overflow: hidden ;
  transition: all .2s ease-in-out ;
  background: #eeeeee;
  width: 180px ;
  font-size: 13px ;
}

.menu_submenu_active {
  /* TODO: if necessary */
}

/*
.menu_main:target .menu_submenu a:first-child {
  color: blue ;
}
*/

.menu_main:target .menu_submenu_0 {
  height: 0px ;
}

.menu_main:target .menu_submenu_1 {
  height: 25px ;
}

.menu_main:target .menu_submenu_2 {
  height: 45px ;
}

.menu_main:target .menu_submenu_3 {
  height: 67px ;
}

.menu_main:target .menu_submenu_4 {
  height: 90px ;
}

/* Box Menu */
.tools_box{
  text-align: center;
}
.tools_item_box{
  display: inline-block;
  padding: 10px 10px;
  cursor: pointer;
  color: black;
  transition: all 0.2s ease-in-out 0s;
}
.tools_item_box:hover{
  box-shadow: inset 0 0 5px blue;
}