@font-face 
{
  font-family: ZalandoSans;
  src: url(https://www.0to255.de/fonts/ZalandoSans-VariableFont_wdth,wght.ttf);
}

@font-face 
{
  font-family: Caveat;
  src: url(https://www.0to255.de/fonts/Caveat-VariableFont_wght.ttf);
}

@keyframes headLineAnimation
{
  0%   {left: -200px; top: 0px; opacity: 0.0;}
  50%  {left: 0px; top: 0px; opacity: 1.0;}
}

@keyframes textAnimation
{
  0%   {left: 0px; top: 200px; opacity: 0.0;}
  50%  {left: 0px; top: 0px; opacity: 1.0;}
}

body
{
	font-family: ZalandoSans;
}

h1
{
	font-weight: 500;	
}

h1, h2, p
{
	animation-name: headLineAnimation;
  	animation-duration: 4s;
	position: relative;
}

a
{
	color: #fc7f03;
}

header#masthead 
{
	z-index: 999;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
}

.site-header 
{
    background-color: transparent;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.5));
}

.header 
{
    height: 475px;
    width: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}

.head_image
{
	position: relative;
	width: 100%;
	height: 100%;
	object-fit: cover;
	left: 0px;
	top: 0px;
	z-index: 0;
}

.main-navigation, .main-navigation ul ul
{
	background-color: transparent;	
}

.main-navigation .main-nav ul li a, .main-navigation .menu-toggle, .main-navigation .menu-bar-items, .main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a, .main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a, .main-navigation .main-nav ul li.sfHover:not([class*="current-menu-"]) > a, .main-navigation .menu-bar-item:hover > a, .main-navigation .menu-bar-item.sfHover > a, .main-navigation .main-nav ul ul li a, button.menu-toggle:hover, button.menu-toggle:focus
{
	color: #fff;
	font-size: 21px;
	font-weight: 500;
}

/* Aktives Menü */
.main-navigation .main-nav ul li[class*="current-menu-"] > a
{
	color: #fff;
	border-radius: 10px;
	background: linear-gradient(to right, #fc7f03, #f65402) border-box, white content-box;
}

.main-navigation .main-nav ul ul li
{
	background-color: rgba(0,0,0,0.5);
	border-radius: 10px;
	margin-top: 4px;
}

.wp-block-columns, .gallery_container
{
	animation-name: textAnimation;
  	animation-duration: 4s;
	position: relative;
}

.inside-article 
{
    margin-top: 475px;
}

.separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .one-container .container, .separate-containers .paging-navigation, .inside-page-header
{
	background-color: transparent;	
}

.site-info
{
	background-color: #333;
    color: #fff;	
}

.site-info a
{
	background: -webkit-linear-gradient(#fc7f03, #f65402);
	background-clip: border-box;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-decoration: none;
}

/*
.main-navigation .main-nav ul ul li a:hover
{
	background: -webkit-linear-gradient(#fc7f03, #f65402);
	background-clip: border-box;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
*/
