﻿/**
 * (en) Smooth- croller for NAME
 * (de) Smooth-Scroller für NAME
 *
 * @copyright			 Copyright 2015, crossbase mediasolution GmbH
 * @version				 1.0
 */

@media screen
{

	.to-top,
	.to-top:focus,
	.to-filter,
	.to-filter:focus,
	.to-mail,
	.to-mail:focus,
	.to-contact,
	.to-contact:focus {
		display: inline-block;
		height: 40px;
		width: 40px;
		position: fixed;
		overflow: hidden;
		text-indent: 100%;
		white-space: nowrap;
		background: #1d374a;
		visibility: hidden;
		opacity: 0;
		-webkit-transition: all 0.3s;
		transition: all 0.3s;
		color: #fff;
		box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
	}

	.to-top {
		bottom: 10px;
		right: 0;
		border: none
	}

	.to-mail,
	.to-filter {
		bottom: 60px;
		right: 0;
		border: none
	}

	.to-contact {
		bottom: 110px;
		right: 0;
		border: none
	}

	.to-top:after {
		font-family: 'Font Awesome 5 Free';
		/*font-weight: 900;*/
		content: '\f106';
		position: absolute;
		top: 10px;
		left: 12px;
		text-indent: 0;
		font-size: 28px;
	}

	.to-mail:after {
		font-family: 'Font Awesome 5 Free';
		/*font-weight: 900;*/
		content: '\f0e0';
		position: absolute;
		top: 8px;
		left: 6px;
		text-indent: 0;
		font-size: 28px;
	}

	.to-filter:after {
		font-family: 'Font Awesome 5 Free';
		/*font-weight: 900;*/
		content: '\f3f1';
		position: absolute;
		top: 8px;
		left: 8px;
		text-indent: 0;
		font-size: 28px;
	}

	.to-contact:after {
		font-family: 'Font Awesome 5 Free';
		/*font-weight: 900;*/
		content: '\f007';
		position: absolute;
		top: 9px;
		left: 6px;
		text-indent: 0;
		font-size: 28px;
	}

	.to-top.button-is-visible,
	.to-top.button-is-visible:hover,
	.to-top.button-is-visible:active,
	.to-top.button-is-visible:focus,
	.to-filter.button-is-visible,
	.to-filter.button-is-visible:hover,
	.to-filter.button-is-visible:active,
	.to-filter.button-is-visible:focus,
	.to-mail.button-is-visible,
	.to-mail.button-is-visible:hover,
	.to-mail.button-is-visible:active,
	.to-mail.button-is-visible:focus,
	.to-contact.button-is-visible,
	.to-contact.button-is-visible:hover,
	.to-contact.button-is-visible:active,
	.to-contact.button-is-visible:focus {
		visibility: visible;
		color: #fff;
		opacity: 1;
		filter: alpha(opacity=100);
	}


	.to-top.button-is-visible:hover,
	.to-filter.button-is-visible:hover,
	.to-mail.button-is-visible:hover,
	.to-contact.button-is-visible:hover {
		background: #1d374a;
	}


	.to-top.button-fade-out,
	.to-filter.button-fade-out,
	.to-mail.button-fade-out,
	.to-contact.button-fade-out{
		/* if the user keeps scrolling down, the button is out of focus and becomes less visible */
		opacity: 0.5;
		filter: alpha(opacity=50);
	}

}

@media
screen and (max-width: 980px) {

	.to-top,
	.to-filter,
	.to-mail,
	.to-contact,
	.to-top.button-is-visible,
	.to-top.button-fade-out,
	.to-mail.button-is-visible,
	.to-mail.button-fade-out,
	.to-contact.button-is-visible,
	.to-contact.button-fade-out {
		display: none;
	}

}