.button {
  	text-transform: uppercase;
  	white-space: nowrap;
  	height: 30px;
  	padding: 4px 15px;
  	background: #3F4254;
  	color: #fff;
  	cursor: pointer;
  	border-radius: 4px;
  	border: 1px solid #3F4254;
  	/* 	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); */
  }

  a.button,
  a.button:active,
  a.button:focus {
  	color: #fff;
  	width: min-content;
  	display: inline-flex;
  	align-items: center;
  	justify-content: center;
  }

  .btn-small {
  	padding: 0 5px;
  	height: auto;
  	box-shadow: none;
  	font-size: 90%;
  }

  a.btn-white,
  a.btn-white:active,
  a.btn-white:focus,
  .btn-white {
  	color: #1e1e2d;
  	background-color: #fff;
  	border: 1px solid #fff;
  	box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
  }

  .btn-blue {
  	background-color: #3699ff;
  	border: 1px solid #3699ff;
  	box-shadow: 1px 1px 2px rgba(54, 153, 255, 0.2);
  }

  a.btn-skyblue,
  a.btn-skyblue:active,
  a.btn-skyblue:focus,
  .btn-skyblue {
  	color: #3699ff;
  	background-color: #e1f0ff;
  	border: 1px solid rgba(54, 153, 255, 0.2);
  	/* 	box-shadow: 1px 1px 2px rgba(0, 149, 232, 0.2); */
  }

  .btn-deepblue {
  	background-color: #1261ff;
  	border: 1px solid #1261ff;
  	box-shadow: 1px 1px 2px rgba(0, 149, 232, 0.2);
  }

  .btn-green {
  	background-color: #1bc5bd;
  	border: 1px solid #1bc5bd;
  	box-shadow: 1px 1px 2px rgba(27, 197, 189, 0.2);
  }

  .btn-violet {
  	background-color: #8950FC;
  	border: 1px solid #8950FC;
  	box-shadow: 1px 1px 2px rgba(137, 80, 252, 0.2);
  }

  .btn-yellow {
  	background-color: #ffa800;
  	border: 1px solid #ffa800;
  	box-shadow: 1px 1px 2px rgba(255, 168, 0, 0.2);
  }

  .btn-red {
  	background-color: #f64e60;
  	border: 1px solid #f64e60;
  	box-shadow: 1px 1px 2px rgba(246, 78, 96, 0.2);
  }

  .btn-rightRed {
  	color: #f42a3f;
  	background-color: rgba(246, 78, 96, 0.2);
  	border: 1px solid rgba(246, 78, 96, 0.2);
  }
  
  .btn-gray {
  	color: #1e1e2d;
  	background-color: rgba(192, 192, 192, 0.2);
  	border: 1px solid rgba(192, 192, 192, 0.2);
  }

  .btn-def,
  .btn-def:hover {
  	box-shadow: none;
  	background: none;
  	border: none;
  	height: auto;
  	padding: 0;
  }

  @media (hover : hover) and (pointer: fine) {
  	.button:hover {
  		background: #1a1a27;
  		color: #fff;
  		border: 1px solid #1a1a27;
  	}

  	a.btn-white:hover,
  	.btn-white:hover {
  		color: #fff;
  		background-color: #626777;
  		border: 1px solid #626777;
  	}

  	a.btn-blue:hover,
  	.btn-blue:hover {
  		background-color: #0086FF;
  		border: 1px solid #0086FF;
  	}

  	a.btn-skyblue:hover,
  	.btn-skyblue:hover {
  		color: #e1f0ff;
  		background-color: #3699ff;
  		border: 1px solid #3699ff;
  	}

  	a.btn-deepblue:hover,
  	.btn-deepblue:hover {
  		color: #0073e9;
  		background-color: #fff;
  		border: 1px solid #0073e9;
  	}

  	a.btn-green:hover,
  	.btn-green:hover {
  		background-color: #0bb7af;
  		border: 1px solid #0bb7af;
  	}

  	a.btn-violet:hover,
  	.btn-violet:hover {
  		background-color: #702afb;
  		border: 1px solid #702afb;
  	}

  	a.btn-yellow:hover,
  	.btn-yellow:hover {
  		background-color: #ee9d01;
  		border: 1px solid #ee9d01;
  	}

  	a.btn-red:hover,
  	.btn-red:hover {
  		background-color: #f42a3f;
  		border: 1px solid #f42a3f;
  	}

	a.btn-rightRed:hover,
  	.btn-rightRed:hover {
        color: #f42a3f;
        background-color: rgba(246, 78, 96, 0.2);
        border: 1px solid #F64E60;
  	}
  }



  .btn-new {
  	cursor: default;
  	color: #fff;
  	height: 14px;
  	width: 12px;
  	line-height: 14px;
  	border-radius: 3px;
  	font-size: 1rem;
  	padding: 0;
  	margin: 0 4px;
  	animation-name: btnNew;
  	animation-duration: 0.6s;
  	animation-iteration-count: infinite;
  }

  @keyframes btnNew {
  	0% {
  		opacity: 1;
  	}

  	100% {
  		opacity: 0.7;
  	}
  }