/* CSS Document */


.untitled {
	position: relative;
	height: 500px;
	width: 100%;
	/* image overlay tinting 
  animation: rotateHue infinite 20s linear;
  /* image overlay tinting */  
	animation-delay: 0.625s;
	overflow-y: hidden;
	overflow-x: hidden;
}
@keyframes rotateHue {
  0% {
    filter: hue-rotate(0deg); }
  20% {
    filter: hue-rotate(0deg); }
  25% {
    filter: hue-rotate(90deg); }
  45% {
    filter: hue-rotate(90deg); }
  50% {
    filter: hue-rotate(180deg); }
  70% {
    filter: hue-rotate(180deg); }
  75% {
    filter: hue-rotate(270deg); }
  95% {
    filter: hue-rotate(270deg); }
  100% {
    filter: hue-rotate(360deg); } }
  .untitled__shutters {
    position: absolute;
    height: 150vmax;
    width: 150vmax;
    left: calc(50% - 75vmax);
    top: calc(50% - 75vmax);
    pointer-events: none;
    z-index: 2;
    animation: rotateFrame 10s linear infinite; }
@keyframes rotateFrame {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(180deg); } }
    .untitled__shutters:before, .untitled__shutters:after {
      content: '';
      position: absolute;
      height: 100%;
      width: 100%;
      left: 50%;
      transform: translate3d(-50%, 0, 0);
      background-color: #FFF0F5;
      pointer-events: auto; }
    .untitled__shutters:before {
      bottom: 50%;
      animation: openTop 5s infinite; }
@keyframes openTop {
  0% {
    transform: translate3d(-50%, 0, 0);
    animation-timing-function: cubic-bezier(0.8, 0, 0.1, 1); }
  40% {
    transform: translate3d(-50%, -65vmax, 0);
    animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335); }
  70% {
    transform: translate3d(-50%, -65vmax, 0);
    animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335); }
  100% {
    transform: translate3d(-50%, 0, 0);
    animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.335); } }
    .untitled__shutters:after {
      top: 50%;
      animation: openBottom 5s infinite; }
@keyframes openBottom {
  0% {
    transform: translate3d(-50%, 0, 0);
    animation-timing-function: cubic-bezier(0.8, 0, 0.1, 1); }
  40% {
    transform: translate3d(-50%, 65vmax, 0);
    animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335); }
  70% {
    transform: translate3d(-50%, 65vmax, 0);
    animation-timing-functon: cubic-bezier(0.6, 0.04, 0.98, 0.335); }
  100% {
    transform: translate3d(-50%, 0, 0);
    animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.335); } }
  .untitled__slides {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #FFFFFF; }
  .untitled__slide {
    position: absolute;
    height: 100%;
    width: 100%;
    opacity: 0;
    animation: showHideSlide infinite 20s steps(1); }
@keyframes showHideSlide {
  0% {
    opacity: 1;
    pointer-events: auto;
    z-index: 1; }
  25% {
    opacity: 0;
    pointer-events: none;
    z-index: -1; }
  100% {
    opacity: 0;
    pointer-events: none;
    z-index: -1; } }
    .untitled__slide:nth-child(1) {
      animation-delay: 0s; }
      .untitled__slide:nth-child(1) .untitled__slideBg {
	background-image: url(https://laserdreamaesthetics.co.uk/images/twistslider/twist001.jpg); background-position: 0% 25%; }
    .untitled__slide:nth-child(2) {
      animation-delay: 5s; }
      .untitled__slide:nth-child(2) .untitled__slideBg {
         background-image: url(https://laserdreamaesthetics.co.uk/images/twistslider/twist002.jpg); background-position: 0% 30%; }
    .untitled__slide:nth-child(3) {
      animation-delay: 10s; }
      .untitled__slide:nth-child(3) .untitled__slideBg {
         background-image: url(https://laserdreamaesthetics.co.uk/images/twistslider/twist003.jpg); background-position: 0% 25%; }
    .untitled__slide:nth-child(4) {
      animation-delay: 15s; }
      .untitled__slide:nth-child(4) .untitled__slideBg {
         background-image: url(https://laserdreamaesthetics.co.uk/images/twistslider/twist004.jpg); background-position: 0% 25%; }
  .untitled__slideBg {
    position: relative;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    background-color: none;
    background-blend-mode: hard-light;
    opacity: 1;
    z-index: -1;
    animation: bgInOut 5s infinite; }
@keyframes bgInOut {
  0% {
    transform: rotate(-45deg) scale(1.1);
    animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); }
  33% {
    transform: rotate(0deg); }
  50% {
    transform: rotate(0deg); }
  66% {
    transform: rotate(0deg);
    animation-timing-function: cubic-bezier(0.895, 0.03, 0.685, 0.22); }
  100% {
    transform: rotate(45deg) scale(0.9); } }
  .untitled__slideContent {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    color: white;
    font-family: "Abril Fatface", sans-serif;
    line-height: 0.8;
    letter-spacing: -0.025em;
    z-index: 2;
    opacity: 1;
    text-shadow: 0 0 0.5em rgba(179, 64, 26, 0.25);
    mix-blend-mode: lighten; }
    .untitled__slideContent span {
	display: block;
	font-size: 10vmin;
}