
/* Buttons
-----------*/

	.spiess-ui-btn {
		display: inline-block;
		padding: 13px 20px;
		background-color: #f35022;
		color:#FFFFFF;
		cursor:pointer;
		border: none;
		text-decoration:none;
		text-decoration: none;
	}

	.spiess-ui-btn * {
		color: #FFFFFF;
	}

	a.spiess-ui-btn,
	a.spiess-ui-btn:hover {
		color: #FFFFFF !important;
	}

/* Aktiv-Status
----------------*/

	.spiess-ui-btn:active {
		background:linear-gradient(to bottom, #232323 0%, #454545 100%);
		background-color: #454545;
	}

/* Hover-Status
----------------*/

	.spiess-ui-btn:hover {
		opacity: 0.8;
		text-decoration: none;
	}

/* Icons
---------*/

	.spiess-ui-btn img {
		display: inline-block;
		height: 24px;
		margin-right: 5px;
		position: relative;
		top: -1px;
		vertical-align: text-bottom;
	}

/* Sekundär-Variante
---------------------*/

	.spiess-ui-btn--secondary {
		display: inline-block;
		position: relative;
		box-shadow:inset 0px 1px 0px 0px #ffffff;
		background:linear-gradient(to bottom, #FFFFFF 5%, #f6f6f6 100%);
		background-color:#ffffff;
		border-radius:6px;
		outline: 1px solid #dcdcdc;
		cursor:pointer;
		color: #454545 !important;
		padding: 7px 15px;
		white-space: nowrap;
		text-decoration:none;
		font-family: "Figtree";
	}

	a.spiess-ui-btn--secondary {
		color: #454545 !important;
	}

	.spiess-ui-btn--secondary:active {
		color: #333333;
		background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
		background-color:#f6f6f6;
	}

	.spiess-ui-btn--secondary:hover,
	a.spiess-ui-btn--secondary:hover {
		color: #000000 !important;
	}

	.spiess-ui-btn--secondary:focus {
		outline: 1px solid #AAAAAA;
	}

/* Button-Menü
---------------*/

	.spiess-ui-btn-menu {
		display: none;
	}

	.spiess-ui-btn:hover .spiess-ui-btn-menu {
		display: block;
		background-color: #FFFFFF;
		border-radius: 7px;
		position: absolute;
		right: 0;
		top: 0;
		-webkit-box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.75);
		-moz-box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.75);
		box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.75);
		max-width: 200px;
	}

	.spiess-ui-btn:hover .spiess-ui-btn-menu li {
		display: block;
		padding: 7px 15px;
		color: #333333;
		border-bottom: 1px solid #DDDDDD;
		text-align: left;
	}

	.spiess-ui-btn:hover .spiess-ui-btn-menu li:first-of-type {
		border-top-left-radius: 7px;
		border-top-right-radius: 7px;
	}
	.spiess-ui-btn:hover .spiess-ui-btn-menu li:last-of-type {
		border-bottom-left-radius: 7px;
		border-bottom-right-radius: 7px;
		border-bottom: none;
	}

	.spiess-ui-btn:hover .spiess-ui-btn-menu li .fa {
		padding-right: 5px;
	}

	.spiess-ui-btn:hover .spiess-ui-btn-menu li:hover {
		background-color: #454545;
		color: #FFFFFF;
	}

/* Small-Version
------------------*/

	.spiess-ui-btn--small {
		padding: 3px 8px;
		font-size: 13px;
	}

/* Nur Icon
------------*/

	.spiess-ui-btn--icon-only {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}

	.spiess-ui-btn--icon-only img {
		padding-right: 0 !important;
		margin-right: 0 !important;
	}

/* Container
-------------*/

	.spiess-ui-btn-container {
		text-align: right;
		clear: both;
		border-top: 1px solid #DDDDDD;
		padding: 17px 20px;
		background-color: #FAFAFA;
	}

	.spiess-ui-btn-container .spiess-ui-btn,
	.spiess-ui-btn-container .spiess-ui-btn--secondary {
		margin-left: 10px;
	}

	.spiess-ui-btn-container .spiess-ui-btn {
		display: inline-block;
		width: auto;
	}

	.spiess-ui-btn-container--seperator {
		display: inline-block;
		height: 20px;
		margin-left: 10px;
		border-left: 1px solid #DDDDDD;
		position: relative;
		top: 4px;
	}