.fab-container
{
	position: fixed;
	bottom: 70px;
	right: 50px;
	z-index: 999;
	cursor: pointer;
}

.fab-ico-holder
{
	width: 40px;
	height: 40px;
	border-radius: 100%;
	/*background: #016fb9;*/
	background: #28a745;
	box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}


.fab-ico-holder:hover
{
	opacity: 0.8;
}

.fab-ico-holder i
{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-style: 25px;
	color: #ffffff;
}

.f
{
	width: 60px;
	height: 60px;
	background: #d23f31;
	/*background: #3C8DBC;*/
}

.fab-options
{
	list-style-type: none;
	margin: 0;
	position: absolute;
	bottom: 60px;
	right: 6px;
	opacity: 0;
	transition: all 0.3s ease;
	transform: scale(0);
	transform-origin: 85% bottom;
}


.f:hover + .fab-options, .fab-options:hover
{
	opacity: 1;
	transform: scale(1);
}

.fab-options li
{
	display: flex;
	justify-content: flex-end;
	padding: 5px;
}

.fab-label
{
	padding:2px 5px;
	align-self: center;
	user-select: none;
	white-space: nowrap;
	border-radius: 3px;
	font-size: 16px;
	background: #666666;
	color: #ffffff;
	box-shadow: 0 6px 20px rgba(0,0,0,0.2);
	margin-right: 10px;
}


.fab-ico-holder2
{
	width: 40px;
	height: 40px;
	border-radius: 100%;
	/*background: #016fb9;*/
	background: #007bff;
	box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}

.fab-ico-holder2:hover
{
	opacity: 0.8;
}

.fab-ico-holder2 i
{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-style: 25px;
	color: #ffffff;
}

.fab-ico-holder3
{
	width: 40px;
	height: 40px;
	border-radius: 100%;
	/*background: #016fb9;*/
	background: #ffc107;
	box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}

.fab-ico-holder3:hover
{
	opacity: 0.8;
}

.fab-ico-holder3 i
{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-style: 25px;
	color: #ffffff;
}

.fab-ico-holder4
{
	width: 40px;
	height: 40px;
	border-radius: 100%;
	/*background: #016fb9;*/
	background: #6c757d;
	box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}

.fab-ico-holder4:hover
{
	opacity: 0.8;
}

.fab-ico-holder4 i
{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-style: 25px;
	color: #ffffff;
}

/*.marca-agua:before
{
    content: ="";
    width: 100%;
    height: 100%;
    background-color: aqua;
    position: fixed;
    opacity: 0.7;
}*/

@media only screen and (max-width: 500px) {

	.f
	{
		width: 45px;
		height: 45px;
		background: #d23f31;
		margin-right: -25px;
		margin-bottom: 7px;
	}

	.fab-options
	{
		list-style-type: none;
		margin: 0;
		position: absolute;
		bottom: 60px;
		right: -28px;
		opacity: 0;
		transition: all 0.3s ease;
		transform: scale(0);
		transform-origin: 85% bottom;
	}
}