.animate {
			transition: all 0.1s;
			-webkit-transition: all 0.1s;
		}

		.action-button {
			position: relative;
			padding: 5px 10px;
			margin: 0px 10px 10px 0px;
			float: center;
			border-radius: 8px;
			font-family: 'Rubik', sans-serif;
			font-size: 20px;
			color: #FFF;
			text-decoration: none;
		}

		.blue {
			background-color: #3498DB;
			border-bottom: 5px solid #2980B9;
			text-shadow: 0px -2px #2980B9;
		}

		.red {
			background-color: #E74C3C;
			border-bottom: 5px solid #BD3E31;
			text-shadow: 0px -2px #BD3E31;
		}

		.green {
			background-color: #82BF56;
			border-bottom: 5px solid #669644;
			text-shadow: 0px -2px #669644;
		}

		.yellow {
			background-color: #F2CF66;
			border-bottom: 5px solid #D1B358;
			text-shadow: 0px -2px #D1B358;
		}

		.action-button:active {
			transform: translate(0px, 5px);
			-webkit-transform: translate(0px, 5px);
			border-bottom: 1px solid;
		}

  h2 {

   font-family: serifbold;

   color: transparent;

   text-align: center;

   animation: effect 2s linear infinite;

 }


 @keyframes effect {

   0% {

     background: linear-gradient(#008000, #00FF00);

     -webkit-background-clip: text;

   }


   100% {

     background: linear-gradient(#3CE7D7, #000FFF);

     -webkit-background-clip: text;

   }

 }

 .wrapper {
   margin: auto;
   max-width: 500px;
   width: 98%;
   box-shadow: 9px 9px 8px #8c8c8c,
     -29px -29px 58px #ffffff;
   border-radius: 10px;
   overflow: hidden;

 }

 :root {
   --plyr-color-main: #25d366;
   --plyr-video-control-color: #e8ffba;
 }






.bg-main {
    background-attachment: fixed;
    background-image: url('https://images.unsplash.com/photo-1519882189396-71f93cb4714b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80');
    background-position: center;
    background-size: cover;
}

a {
    text-decoration: none;
}
.flex-row {
    display: flex;
    flex-direction: row;
}

.flex-col {
    display: flex;
    flex-direction: column;
}

.center {
    align-items: center;
    justify-content: center;
}

.mr-auto {
    margin-right: auto;
}

.mt-2 {
    margin-top: 2rem;
}

.wrapper {
    margin: 0 auto;
    max-width: 1200px;
    width: 100%;
}

.padding-md {
    padding: 1rem 2rem;
}


h2 {
    font-size: 1.2rem;
}

.post p {
    margin-bottom: 1rem;
}


/* structure */


.header {
    border: 1px solid #4f3232;
    background-color: rgba(244, 244, 249, 0.8);
}

main {
    background-color: rgba(244, 244, 249, 0.8);
    border: 1px solid #4f3232;
    margin-top: 1rem;
}