/*
 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
*/

@layer {
	/* Hover style */
	@media (hover: hover) and (pointer: fine) {
		body a:where(:not([class*= button])):hover {
			color: var(--link-color-hover, var(--clr-primary-hover));
			-webkit-text-decoration: var(--link-decoration-hover, underline);
			text-decoration: var(--link-decoration-hover, underline);
			text-decoration-thickness: var(--link-underline-thickness, 1.5px);
			text-underline-offset: .25em;
		}
	}
}

/** cookie banner **/
.cky-box-bottom-left {
	left: 50%!important;
	top: 50%;
	transform: translateX(-50%) translatey(-50%);
	bottom: unset!important;
}

.cky-notice {
	text-align: center;
}

/* Avoid FUC on frontend*/
.bricks-is-frontend .animation-trigger{
  opacity:0;
}
 
/* Animated Class*/
.animate{
  animation-name: fadeAnimation;
  animation-delay: calc(var(--delay, 0) * 800ms);
  animation-duration: var(--duration, 800ms);
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}
 
/* Change translate Origin*/
.animation--left-to-right{
  --translate: -30px,0,0;
}
.animation--right-to-left{
  --translate: 30px,0,0;
}
.animation--top-to-bottom{
  --translate: 0,-30px,0;
}
.animation--bottom-to-top{
  --translate: 0,30px,0;
}
 
/* Keyframes */
@keyframes fadeAnimation{
  from{
    transform: translate3d(var(--translate));
  }
  to{
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}