/* Turning a Landfill into a Town Center */

#turning-a-landfill .slide-1 h1.lead {
    font-size: 2.6em;
}

#turning-a-landfill #part1 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/turning-a-landfill-into/background-frame-1.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#turning-a-landfill #part2 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/turning-a-landfill-into/background-frame-2.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#turning-a-landfill #part3 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/turning-a-landfill-into/background-frame-3.png');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#turning-a-landfill #part4 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/turning-a-landfill-into/background-frame-4.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#turning-a-landfill #part5 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/turning-a-landfill-into/background-frame-5.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#turning-a-landfill .parallaxFiveCon {
    top: 50%;
}



/* Fostering Agents of Change in Houston's Third Ward */

#project-row-houses .slide-1 h1.lead {
		font-size: 2.6em;	
}

#project-row-houses #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/fostering-agents-of-change/row-houses-1.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#project-row-houses #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/fostering-agents-of-change/row-houses-2.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#project-row-houses #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/fostering-agents-of-change/row-houses-3.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#project-row-houses #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/fostering-agents-of-change/row-houses-4.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#project-row-houses #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/fostering-agents-of-change/row-houses-5.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#project-row-houses .parallaxFiveCon {
	top: 50%;
}


/* Understanding Jewish Mental Health Stigma */

#mental-health-stigma .slide-1 h1.lead {
		font-size: 2.6em;	
}

#mental-health-stigma #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/mental-health-stigma/comm-1.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#mental-health-stigma #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/mental-health-stigma/comm-2.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#mental-health-stigma #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/mental-health-stigma/comm-3.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#mental-health-stigma #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/mental-health-stigma/comm-4.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#mental-health-stigma #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/mental-health-stigma/comm-5.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#mental-health-stigma .parallaxFiveCon {
	top: 50%;
}


/* Championing Plant Diversity */

#champ #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/championing-plant-diversity/grasslands-3.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#champ #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/championing-plant-diversity/grasslands-2.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#champ #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/championing-plant-diversity/grasslands-1.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#champ #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/championing-plant-diversity/grasslands-4.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#champ #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/championing-plant-diversity/grasslands-5.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

/* Alleviating Anxiety */

#anxiety #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/alleviating-anxiety/anxiety-1.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#anxiety #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/alleviating-anxiety/anxiety-2.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#anxiety #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/alleviating-anxiety/anxiety-3.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#anxiety #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/alleviating-anxiety/anxiety-4.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#anxiety #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/alleviating-anxiety/anxiety-5.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}


/* Creating Community */

#community #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/creating-community/arch1.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#community #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/creating-community/arch5.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#community #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/creating-community/arch3.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#community #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/creating-community/arch4.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#community #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/creating-community/arch8.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

/* Facilitating Safety in the City */

#safety #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/monitoring-the-city/city-1.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#safety #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/monitoring-the-city/city-2.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#safety #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/monitoring-the-city/city-3.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#safety #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/monitoring-the-city/city-4.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#safety #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/monitoring-the-city/city-5.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}


/* Forecasting COVID's Economic Impart */

#forecasting #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/forecasting-covid/forecasting-covid-1.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#forecasting #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/forecasting-covid/forecasting-covid-2.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#forecasting #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/forecasting-covid/forecasting-covid-3.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#forecasting #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/forecasting-covid/forecasting-covid-4.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#forecasting #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/forecasting-covid/forecasting-covid-5.png');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

/* Serving Houston's Underserved */

#serving #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/hri-touch/touch-1.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#serving #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/hri-touch/touch-2.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#serving #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/hri-touch/touch-3.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#serving #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/hri-touch/touch-4.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#serving #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/hri-touch/touch-5.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

/* Testing the Water */

#hurri #part1 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/testing-the-waters/hurricane-harvey-flood.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#hurri #part2 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/testing-the-waters/hanadi-hurri-team-boat.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#hurri #part3 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/testing-the-waters/hurricane-research-team.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#hurri #part4 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/testing-the-waters/hurricane-harvey-rivers-of-brown.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}

#hurri #part5 {
        background-image: url('https://uh.edu/research/_images/houston-impacts/testing-the-waters/rifai-uh.jpg');
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
	background-repeat: no-repeat;
}



/* Promoting Transformative Community Design Projects in Houston  */
#transformative-community-design #part1 {
    background-image: url('https://uh.edu/research/_images/houston-impacts/promoting-transformative-community-design-projects-in-houston/image-1.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#transformative-community-design #part2 {
    background-image: url('https://uh.edu/research/_images/houston-impacts/promoting-transformative-community-design-projects-in-houston/image-2.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#transformative-community-design #part3 {
    background-image: url('https://uh.edu/research/_images/houston-impacts/promoting-transformative-community-design-projects-in-houston/image-3.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#transformative-community-design #part4 {
    background-image: url('https://uh.edu/research/_images/houston-impacts/promoting-transformative-community-design-projects-in-houston/image-4.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#transformative-community-design #part5 {
     background-image: url('https://uh.edu/research/_images/houston-impacts/promoting-transformative-community-design-projects-in-houston/image-5.jpg');
     background-size: cover;
     background-position: center center;
     background-attachment: fixed;
     background-repeat: no-repeat;
 }

#transformative-community-design #part6 {
    background-image: url('https://uh.edu/research/_images/houston-impacts/promoting-transformative-community-design-projects-in-houston/image-6.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

/* Photographing and Healing the Community  */
#shelter-in-place #part1 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/photographing-and-healing-the-community/background-frame-1.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#shelter-in-place #part2 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/photographing-and-healing-the-community/background-frame-2.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#shelter-in-place #part3 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/photographing-and-healing-the-community/background-frame-3.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#shelter-in-place #part4 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/photographing-and-healing-the-community/background-frame-4.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

#shelter-in-place #part5 {
    background-image: url('https://uh.edu/research/_images/reaching-houston/parallax-background/photographing-and-healing-the-community/background-frame-5.jpg');
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
}





/* Stories Back Button */

.rrh-stories-button {
    margin: 6px 0;
    text-align: left;
}

.rrh-stories-span a {
    padding: 0;
    left: 0;
    color: #fff9d9;
}

.rrh-stories-span a:hover {
    color: #fff;
}
/* End Stories Back Button */


/* Testing the Waters */

body {
    background-color: black;
}

#image-credit {
    position: relative;
    top: 94%;
    left: 1%;
    text-align: left;
    font-size: .8em;
    font-style: italic;
    color: #ddd;
}

.parallaxfirstCon {
    padding: 0 15px;
}

.slide-1 {
    margin: 0 10px;
    max-width: 400px;
    margin: 0 auto;
    padding: 50px;
    background: rgba(0,0,0,0.9);
    max-width: 500px;
}

.slide-1 h1, .slide-1 h3, .slide-1 h5, .slide-1 p  {
    text-align: left;
    text-transform: uppercase;
	font-weight: 700;
}

.slide-1 p  {
	line-height: 1.7;
}

.slide-1 h1.lead {
    line-height: 1;
    font-size: 4em;
    margin: 10px 0;
	text-shadow: 2px 2px black;
}

.slide-1 h3 {
    font-size: 1.875em;
}

.slide-1 h2 {
    font-size: 1.875em;
	text-align: left;
    text-transform: uppercase;
}

.slide-1 p.text-uppercase {
    font-weight: bold;
    line-height: 1.7;
	margin: 12px 0;
}

.featuredstoryone .slide-1 h5 {
    margin-top: 0;
    top: 0;
    font-size: 1em;
    font-family: "Milo";
}

.featuredstoryone .parallaxfirstCon .slide-1 p.author {
    margin-top: 0;
    top: 0;
    font-size: 1em;
    font-family: "Milo";
	letter-spacing: 6.4px;
    line-height: 1.2;
}

.byline-space {
    padding-right: 12px;
	letter-spacing: 6.4px;
}

.parTwoContent {
    height: auto;
    padding: 50px;
}

.parTwoContent h2 {
    margin-bottom: 1em;
    font-size: 1em;
    font-family: 'Milo';
    line-height: 1.7;
    font-weight: bold;
}

.slide-2 {
    text-align: left;
    max-width: 455px;
    background: rgba(0, 0, 0, 0.9);
    padding: 50px;
    margin: 0 10px;
}

.slide-2 h3 {
    margin-bottom: 0;
    font-size: 1.875em;
    line-height: 1.14;
}

.slide-2 p {
    margin-bottom: 0;
	line-height: 1.7;
}

.abcontentT.abcontentTP {
    padding: 0 15px;
}

.slide-3 {
    text-align: left;
    padding: 0 15px;
    max-width: 400px;
    padding: 50px;
    background: rgba(0,0,0,0.9);
    max-width: 500px;
    margin-left: 26px;
}

.parTwoContent p, .parallaxThreeCon p {
    font-size: 1em;
    line-height: 1.7;
    letter-spacing: 0;
    font-weight: 700;
    height: auto;
}

.parallaxThreeCon {
    padding: 0;
}

.parallaxThreeCon .slide-3 {
    padding: 50px;
    margin-left: 26px;
}

.parallaxThreeCon .slide-3 h2 {
    font-size: 1.875em;
    line-height: 1.2;
}

.fixednavHeader {
	width: 175px;
	background-color: rgba(0,0,0,0.75);
	padding: 24px 0 24px 8px;
}

.fixednavHeader li a {
    opacity: .50;
    padding-right: 20px;
    letter-spacing: 2px;
}

.parTwoContent {
    background: rgba(0, 0, 0, 0.9);
    max-width: 460px;
    width: auto;
}

.chooseUsContent.home_page3 {
    padding: 50px;
    background: rgba(0,0,0,0.9);
    max-width: 480px;
}

.chooseUsContent.home_page3 h2 {
    text-align: left;
    font-size: 1em;
    line-height: 1.1;
    font-family: 'Milo';
    text-transform: uppercase;
    font-weight: bold;
}

.parallaxFour .col-lg-5.pull-left {
    padding: 0;
    position: relative;
    top: 362px;
}

section#part5 {
    overflow: hidden;
}

.parallaxFiveCon .slide-5 p {
    font-family: 'Milo';
    font-size: 1em;
    line-height: 1.7;
	font-style: normal;
	font-weight: bold;
}

.parallaxFiveCon {
    top: 68%;
}

.showit {
	bottom: 10px;
	right: 10px;
}




@media(min-width: 0) and (max-width: 767px){

    /*.parallaxOne.featuredstorytwo {
        background-position: -236px center!important;
    }*/
	
	#part1, #part2, #part3, #part4, #part5, #part6 {
	background-image: url('https://uh.edu/research/_images/houston-impacts/creating-community/arch1.png');
	background-size: cover;
	background-position: unset !important;
	background-attachment: unset !important;
	background-repeat: no-repeat;
}

	.slide-1, .slide-2, .slide-2.text-uppercase, .parTwoContent, .slide-3, .parallaxThreeCon .slide-3, .slide-4, .slide-5, .slide-6{
		max-height: 250px;
		overflow: scroll;
		border-bottom: solid #040d08 20px;
	}
	
	.parallaxFiveCon {
	top: 50%;
     }
    
    .parallaxfirstCon {
        padding: 0;
    }

    .slide-1 {
        margin: 0 10px;
        max-width: 400px;
        margin: 0 auto;
        padding: 50px;
        background: rgba(0,0,0,0.9);
        max-width: 500px;
    }

    .slide-1, .slide-2, .chooseUsContent.home_page3 {
        padding: 20px;
    }

    .slide-1 h1.lead {
        font-size: 2em;
    }
    .slide-1 h3 {
        font-size: 1.4em;
        line-height: 1.2;
    }

    .slide-2 {
        margin: 0;
    }

    .slide-2 h3 {
        font-size: 2em;
    }

    .parTwoWrap {
        padding: 0 15px;
    }

    .parTwoContent {
        padding: 20px;
        left: 0;
        right: 0;
        margin: 0 15px;
    }

    .parTwoContent h2, .parallaxFour h2, .chooseUsContent .parFiveWrap h2 {
        font-family: 'Milo';
        font-size: 1em;
        line-height: 1.7;
        text-transform: uppercase;
        font-weight: bold;
    }

    .parallaxThreeCon {
        padding: 0 15px;
    }

    .parallaxThreeCon .slide-3 {
        padding: 20px;
        margin-left: 0;
		max-height: 250px;
        overflow: scroll;
    }

    .parallaxFour .container {
        padding: 0;
    }

    .parallaxFour {
        background-position: bottom right!important;
    }

    .parallaxFour .col-lg-5.pull-left {
        padding: 0 15px;
        margin: 0 15px;
        top: 195px;
    }
    
    .chooseUsContent.home_page3 {
        margin-top: 60px;
    }

    .parallaxFiveCon {
        top: 63%;
    }
}

@media(min-width: 0px) and (max-width: 500px){
    .chooseUsContent.home_page3 {
        margin-top: 0;
    }
}


/*Title Animation*/


:root {
	--delay: 0;
	--duration: 800ms;
	--iterations: 1;
}
/* •·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•·•· */


.reveal-text,
.reveal-text::after {
	-webkit-animation-delay: var(--animation-delay, 2s);
	        animation-delay: var(--animation-delay, 2s);
	-webkit-animation-iteration-count: var(--iterations, 1);
	        animation-iteration-count: var(--iterations, 1);
	-webkit-animation-duration: var(--duration, 800ms);
	        animation-duration: var(--duration, 800ms);
	-webkit-animation-fill-mode: both;
	        animation-fill-mode: both;
	-webkit-animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
	        animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
}

.reveal-text {
	--animation-delay: var(--delay, 0);
	--animation-duration: var(--duration, 800ms);
	--animation-iterations: var(--iterations, 1);
	position: relative;
	font-size: 10vw;
	-webkit-animation-name: clip-text;
	        animation-name: clip-text;
	color: #FFF;
	white-space: nowrap;
	cursor: default
	
}

.reveal-text::after {
		content: "";
		position: absolute;
		z-index: 999;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #00b388;
		-webkit-transform: scaleX(0);
		        transform: scaleX(0);
		-webkit-transform-origin: 0 50%;
		        transform-origin: 0 50%;
		pointer-events: none;
		-webkit-animation-name: text-revealer;
		        animation-name: text-revealer;
	}


@-webkit-keyframes clip-text {
	from {
		-webkit-clip-path: inset(0 100% 0 0);
		        clip-path: inset(0 100% 0 0);
	}
	to {
		-webkit-clip-path: inset(0 0 0 0);
		        clip-path: inset(0 0 0 0);
	}
}


@keyframes clip-text {
	from {
		-webkit-clip-path: inset(0 100% 0 0);
		        clip-path: inset(0 100% 0 0);
	}
	to {
		-webkit-clip-path: inset(0 0 0 0);
		        clip-path: inset(0 0 0 0);
	}
}


@-webkit-keyframes text-revealer {
	
	0%, 50% {
		-webkit-transform-origin: 0 50%;
		        transform-origin: 0 50%;
	}
	
	60%, 100% {
		-webkit-transform-origin: 100% 50%;
		        transform-origin: 100% 50%;		
	}

	
	60% {
		-webkit-transform: scaleX(1);
		        transform: scaleX(1);
	}
	
	100% {
		-webkit-transform: scaleX(0);
		        transform: scaleX(0);
	}
}


@keyframes text-revealer {
	
	0%, 50% {
		-webkit-transform-origin: 0 50%;
		        transform-origin: 0 50%;
	}
	
	60%, 100% {
		-webkit-transform-origin: 100% 50%;
		        transform-origin: 100% 50%;		
	}

	
	60% {
		-webkit-transform: scaleX(1);
		        transform: scaleX(1);
	}
	
	100% {
		-webkit-transform: scaleX(0);
		        transform: scaleX(0);
	}
}

/*Text Animations Library*/


.cascading-text {
  position: relative;
/**
   * [data-animated] is merely used as a trigger
   * attribute for replay purposes. If you were going
   * to use cascading text effects on a site, just let
   * them play once on entry
  */
}
.cascading-text__replay {
  color: #fff;
  cursor: pointer;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-animation: fadeIn 0.75s;
          animation: fadeIn 0.75s;
  padding: 5px;
  opacity: 0.5;
  -webkit-transition: -webkit-transform 0.25s;
  transition: -webkit-transform 0.25s;
  transition: transform 0.25s;
  transition: transform 0.25s, -webkit-transform 0.25s;
}
.cascading-text__replay:hover {
  opacity: 1 !important;
  -webkit-transform: translateX(-50%) translateY(-10%);
          transform: translateX(-50%) translateY(-10%);
}
.cascading-text[data-animated] .cascading-text__replay {
  display: none;
}
.cascading-text--enter[data-animated] .cascading-text__letter {
  opacity: 0;
  -webkit-transform: translateY(-50px);
          transform: translateY(-50px);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--fade[data-animated] .cascading-text__letter {
  opacity: 0;
  -webkit-animation-name: fade;
          animation-name: fade;
}
.cascading-text--flip[data-animated] .cascading-text__letter {
  -webkit-transform: rotateY(180deg);
          transform: rotateY(180deg);
  -webkit-animation-name: flip;
          animation-name: flip;
}
.cascading-text--scale[data-animated] .cascading-text__letter {
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-animation-name: scale;
          animation-name: scale;
}
.cascading-text--turn[data-animated] .cascading-text__letter {
  -webkit-transform-origin: bottom;
          transform-origin: bottom;
  -webkit-transform: rotateY(90deg);
          transform: rotateY(90deg);
  -webkit-animation-name: turn;
          animation-name: turn;
}
.cascading-text--fold[data-animated] .cascading-text__letter {
  -webkit-transform-origin: bottom;
          transform-origin: bottom;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-animation-name: fold;
          animation-name: fold;
}
.cascading-text--bulge[data-animated] .cascading-text__letter {
  -webkit-animation-name: bulge;
          animation-name: bulge;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(1) {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
  -webkit-animation-name: swap-right;
          animation-name: swap-right;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(2) {
  -webkit-transform: translateX(15px);
          transform: translateX(15px);
  -webkit-animation-name: swap-left;
          animation-name: swap-left;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(3) {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
  -webkit-animation-name: swap-right;
          animation-name: swap-right;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(4) {
  -webkit-transform: translateX(15px);
          transform: translateX(15px);
  -webkit-animation-name: swap-left;
          animation-name: swap-left;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(5) {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
  -webkit-animation-name: swap-right;
          animation-name: swap-right;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(6) {
  -webkit-transform: translateX(15px);
          transform: translateX(15px);
  -webkit-animation-name: swap-left;
          animation-name: swap-left;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(7) {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
  -webkit-animation-name: swap-right;
          animation-name: swap-right;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(8) {
  -webkit-transform: translateX(15px);
          transform: translateX(15px);
  -webkit-animation-name: swap-left;
          animation-name: swap-left;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(9) {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
  -webkit-animation-name: swap-right;
          animation-name: swap-right;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(10) {
  -webkit-transform: translateX(15px);
          transform: translateX(15px);
  -webkit-animation-name: swap-left;
          animation-name: swap-left;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(11) {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
  -webkit-animation-name: swap-right;
          animation-name: swap-right;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(12) {
  -webkit-transform: translateX(15px);
          transform: translateX(15px);
  -webkit-animation-name: swap-left;
          animation-name: swap-left;
}
.cascading-text--swap[data-animated] .cascading-text__letter:nth-of-type(13) {
  -webkit-transform: translateX(-15px);
          transform: translateX(-15px);
  -webkit-animation-name: swap-right;
          animation-name: swap-right;
}
.cascading-text--slide[data-animated] .cascading-text__letter {
  -webkit-animation-name: slide;
          animation-name: slide;
  opacity: 0;
  -webkit-transform: translateX(-50px);
          transform: translateX(-50px);
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(1) {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(2) {
  -webkit-animation-delay: 1.1s;
          animation-delay: 1.1s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(3) {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(4) {
  -webkit-animation-delay: 0.9s;
          animation-delay: 0.9s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(5) {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(6) {
  -webkit-animation-delay: 0.7s;
          animation-delay: 0.7s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(7) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(8) {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(9) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(10) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(11) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(12) {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.cascading-text--slide[data-animated] .cascading-text__letter:nth-of-type(13) {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
.cascading-text--far[data-animated] {
  -webkit-perspective: 1000px;
          perspective: 1000px;
}
.cascading-text--far[data-animated] .cascading-text__letter {
  opacity: 0;
  -webkit-transform: translateX(-25px) translateY(-20px) translateZ(-800px);
          transform: translateX(-25px) translateY(-20px) translateZ(-800px);
  -webkit-animation-name: far;
          animation-name: far;
}
.cascading-text--teeth[data-animated] .cascading-text__letter {
  opacity: 0;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(1) {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(2) {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-animation-name: enter-bottom;
          animation-name: enter-bottom;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(3) {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(4) {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-animation-name: enter-bottom;
          animation-name: enter-bottom;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(5) {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(6) {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-animation-name: enter-bottom;
          animation-name: enter-bottom;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(7) {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(8) {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-animation-name: enter-bottom;
          animation-name: enter-bottom;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(9) {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(10) {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-animation-name: enter-bottom;
          animation-name: enter-bottom;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(11) {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(12) {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  -webkit-animation-name: enter-bottom;
          animation-name: enter-bottom;
}
.cascading-text--teeth[data-animated] .cascading-text__letter:nth-of-type(13) {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-animation-name: enter;
          animation-name: enter;
}
.cascading-text--random[data-animated] .cascading-text__letter {
  -webkit-animation-name: random;
          animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
  animation-name: random;
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(1) {
  -webkit-transform: translateX(-245%) translateY(212%);
          transform: translateX(-245%) translateY(212%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(2) {
  -webkit-transform: translateX(-141%) translateY(174%);
          transform: translateX(-141%) translateY(174%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(3) {
  -webkit-transform: translateX(192%) translateY(-25%);
          transform: translateX(192%) translateY(-25%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(4) {
  -webkit-transform: translateX(158%) translateY(198%);
          transform: translateX(158%) translateY(198%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(5) {
  -webkit-transform: translateX(102%) translateY(-55%);
          transform: translateX(102%) translateY(-55%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(6) {
  -webkit-transform: translateX(96%) translateY(58%);
          transform: translateX(96%) translateY(58%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(7) {
  -webkit-transform: translateX(-193%) translateY(192%);
          transform: translateX(-193%) translateY(192%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(8) {
  -webkit-transform: translateX(-83%) translateY(-125%);
          transform: translateX(-83%) translateY(-125%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(9) {
  -webkit-transform: translateX(-225%) translateY(-79%);
          transform: translateX(-225%) translateY(-79%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(10) {
  -webkit-transform: translateX(-217%) translateY(72%);
          transform: translateX(-217%) translateY(72%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(11) {
  -webkit-transform: translateX(126%) translateY(222%);
          transform: translateX(126%) translateY(222%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(12) {
  -webkit-transform: translateX(-75%) translateY(-231%);
          transform: translateX(-75%) translateY(-231%);
}
.cascading-text--random[data-animated] .cascading-text__letter:nth-of-type(13) {
  -webkit-transform: translateX(-57%) translateY(-87%);
          transform: translateX(-57%) translateY(-87%);
}
.cascading-text__letter {
  display: inline-block;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.cascading-text__letter:nth-of-type(1) {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.cascading-text__letter:nth-of-type(2) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.cascading-text__letter:nth-of-type(3) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.cascading-text__letter:nth-of-type(4) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
.cascading-text__letter:nth-of-type(5) {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.cascading-text__letter:nth-of-type(6) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.cascading-text__letter:nth-of-type(7) {
  -webkit-animation-delay: 0.7s;
          animation-delay: 0.7s;
}
.cascading-text__letter:nth-of-type(8) {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.cascading-text__letter:nth-of-type(9) {
  -webkit-animation-delay: 0.9s;
          animation-delay: 0.9s;
}
.cascading-text__letter:nth-of-type(10) {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
.cascading-text__letter:nth-of-type(11) {
  -webkit-animation-delay: 1.1s;
          animation-delay: 1.1s;
}
.cascading-text__letter:nth-of-type(12) {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}
.cascading-text__letter:nth-of-type(13) {
  -webkit-animation-delay: 1.3s;
          animation-delay: 1.3s;
}
/**
  * Theme
*/

@-webkit-keyframes enter {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@keyframes enter {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@-webkit-keyframes enter-bottom {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@keyframes enter-bottom {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@-webkit-keyframes fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes flip {
  from {
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg);
  }
  to {
    -webkit-transform: rotateY(0deg);
            transform: rotateY(0deg);
  }
}
@keyframes flip {
  from {
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg);
  }
  to {
    -webkit-transform: rotateY(0deg);
            transform: rotateY(0deg);
  }
}
@-webkit-keyframes slide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50px);
            transform: translateX(-50px);
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes slide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-50px);
            transform: translateX(-50px);
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes scale {
  from {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  to {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes scale {
  from {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  to {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.5;
  }
}
@-webkit-keyframes turn {
  to {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
  }
}
@keyframes turn {
  to {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
  }
}
@-webkit-keyframes fold {
  to {
    -webkit-transform: rotateX(0);
            transform: rotateX(0);
  }
}
@keyframes fold {
  to {
    -webkit-transform: rotateX(0);
            transform: rotateX(0);
  }
}
@-webkit-keyframes bulge {
  25% {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
}
@keyframes bulge {
  25% {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
  }
}
@-webkit-keyframes swap-right {
  25% {
    -webkit-transform: translateX(-15px) translateY(-100%);
            transform: translateX(-15px) translateY(-100%);
  }
  75% {
    -webkit-transform: translateX(0) translateY(-100%);
            transform: translateX(0) translateY(-100%);
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
}
@keyframes swap-right {
  25% {
    -webkit-transform: translateX(-15px) translateY(-100%);
            transform: translateX(-15px) translateY(-100%);
  }
  75% {
    -webkit-transform: translateX(0) translateY(-100%);
            transform: translateX(0) translateY(-100%);
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
}
@-webkit-keyframes swap-left {
  25% {
    -webkit-transform: translateX(15px) translateY(100%);
            transform: translateX(15px) translateY(100%);
  }
  75% {
    -webkit-transform: translateX(0) translateY(100%);
            transform: translateX(0) translateY(100%);
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
}
@keyframes swap-left {
  25% {
    -webkit-transform: translateX(15px) translateY(100%);
            transform: translateX(15px) translateY(100%);
  }
  75% {
    -webkit-transform: translateX(0) translateY(100%);
            transform: translateX(0) translateY(100%);
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
}
@-webkit-keyframes far {
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0) translateZ(0) translateX(0);
            transform: translateY(0) translateZ(0) translateX(0);
  }
}
@keyframes far {
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0) translateZ(0) translateX(0);
            transform: translateY(0) translateZ(0) translateX(0);
  }
}
@-webkit-keyframes random {
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
}
@keyframes random {
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
}