/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

html, body {
	min-width: 350px !important;
	overflow-x: hidden;
}

* {
	overflow-wrap: break-word;
	word-break: break-word;
	white-space: normal;
}

ul {
	margin: 0px;
	margin-top: 0.5rem;
	padding: 0px;
	padding-left: var(--space-m);
}

h2 {
	text-wrap: balance;
}

/* Colors */

.color-primary-01 {
	color: var(--color-primary-01) !important;
}

/* Animations */

.inhaltsverzeichnis-icon-container {
	transition: 
		transform 0.3s ease,
		box-shadow 0.3s ease;
}

.inhaltsverzeichnis-container:hover .inhaltsverzeichnis-icon-container {
	box-shadow: var(--box-shadow-01);
		transform: scale(0.93);
}


/* Avoid FUC on frontend*/
.bricks-is-frontend .animation-trigger{
  opacity:0;
}

/* Animated Class*/
.animate, .animate-loop .loop-items{
  animation-name: fadeAnimation;
  animation-delay: calc(var(--delay, 0) * 200ms);
  animation-duration: var(--duration, 450ms);
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}
 
/* Change translate Origin*/
.animation--left-to-right{
  --translate: -20px,0,0;
}
.animation--right-to-left{
  --translate: 20px,0,0;
}
.animation--top-to-bottom{
  --translate: 0,-20px,0;
}
.animation--bottom-to-top{
  --translate: 0,20px,0;
}

.animation--fade-in {
  --translate: 0,0,0;
}
 
/* Keyframes */
@keyframes fadeAnimation{
  from{
    transform: translate3d(var(--translate));
  }
  to{
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}

.animate-loop .loop-items:nth-child(1) { --delay: 0; }
.animate-loop .loop-items:nth-child(2) { --delay: 1; }
.animate-loop .loop-items:nth-child(3) { --delay: 2; }

.animation-hover--scale-down:hover {
  transform: scale(0.8);
}