/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/


:root {
    /* SHADOWS */
    --shadow-xs: 0px 1px 2px rgba(16, 24, 40, 0.05);
    --shadow-sm: 0px 1px 3px rgba(16, 24, 40, 0.1), 0px 1px 2px rgba(16, 24, 40, 0.06);
    --shadow-md: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);
    --shadow-lg: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);
    --shadow-xl: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
    --shadow-2xl: 0px 24px 48px -12px rgba(16, 24, 40, 0.18);
    --shadow-3xl: 0px 32px 64px -12px rgba(16, 24, 40, 0.14);


    --primary-h: 265;
    --primary-s: 88.9%;
    --primary-l: 85.9%;
}

.display-rotate-accent {
-webkit-animation:800ms ease 0s 1 normal backwards running accent-top !important;
	animation: 1000ms ease 0s 1 normal backwards running accent-top !important;
}

.hero-heading {
-webkit-animation:800ms ease 0s 1 normal backwards running caption-top !important;
	animation: 1000ms ease 0s 1 normal backwards running caption-top !important;
}


.hero-copy {
-webkit-animation: 1200ms ease 400ms 1 normal backwards running caption-top !important;
    animation: 1200ms ease 400ms 1 normal backwards running caption-top 2s 1 ease-out !important;
	}


.hero-button{
	-webkit-animation: 1200ms ease 800ms 1 normal backwards running caption-top !important;
    animation: 1200ms ease 800ms 1 normal backwards running caption-top !important;
 	}


/* Fade in Animations */
@-webkit-keyframes caption-top {
  0%   { -webkit-transform:translate(0,-20px); opacity: 0;  }
  100% { -webkit-transform:translate(0,0); opacity: 1; }
}
@keyframes caption-top {
  0%   { transform:translate(0,-20px); opacity: 0;  }
  100% { transform:translate(0,0); opacity: 1; }
}

@-webkit-keyframes accent-top {
  0%   { -webkit-transform:translate(0,-20px) rotate(0deg); opacity: 0;}
  100% { -webkit-transform:translate(0,0) rotate(-5deg); opacity: 1; }
}
@keyframes accent-top {
  0%   { transform:translate(0,-20px) rotate(0deg); opacity: 0;  }
  100% { transform:translate(0,0) rotate(-5deg); opacity: 1; }
}