#home-tedx .button {border-radius: 1.25rem}
#home-tedx a.tedx {background: #FFEA96; font-weight: 500; color: #093145; width: 100%;}
#home-tedx a.tedx:hover {background: #EFD469; color: #093145;}
#home-tedx .fi {font-size: 1.25rem;}


.resource-wrapper {
  position: relative;
  margin-bottom: 0.5rem;
}

.resource-wrapper img {
  float: left;
  overflow: hidden;
  width: 100%;
}

.resource-wrapper .resource-banner {
  position: absolute; z-index: 10;
  top: 25%; width: 95%; left: 0;
  padding: 0.5rem;
  font-size: 0.95rem; font-weight: 600;
}

.resource-content {
  position: absolute; opacity: 0; z-index: 20;
  top: 0; bottom: 0; left: 0; right: 0;
  height: 100%; width: 100%;
  text-align: center;
}

.resource-content-reveal {
  position: absolute;
  width: 100%; padding: 0.5rem; 
}

/* FORMAT: .resource-content-reveal */
.resource-content-reveal h2 {font-size: 1.15rem; font-weight: 600;}
.resource-content-reveal p {font-size: 1.0rem; font-weight: 400; }
.resource-content-reveal .fi {font-size: 1.25rem; font-weight: 400;}

/* FORMAT: .resource-banner + .resource-content */
/* DEFAULT - Raven #373D3F | rgb(55, 61, 63) */
.resource-wrapper .resource-banner {background-color: rgba(55, 61, 63, 0.9); color: #FFFFFF;}
.resource-content {background-color: #373D3F; color: #FFFFFF;}

/* IDs */
#darkest-indigo.resource-wrapper .resource-banner {background-color: rgba(9, 49, 69, 0.9); color: #FFFFFF;}
#darkest-indigo.resource-wrapper .resource-content {background-color: #093145; color: #FFFFFF;}

#darkest-ruby.resource-wrapper .resource-banner {background-color: rgba(154, 38, 23, 0.9); color: #FFFFFF;}
#darkest-ruby.resource-wrapper .resource-content {background-color: #9A2617; color: #FFFFFF;}

#lighter-daisy.resource-wrapper .resource-banner {background-color: rgba(239, 212, 105, 0.9); color: #373D3F;}
#lighter-daisy.resource-wrapper .resource-content {background-color: #EFD469;; color: #373D3F;}

#lighter-kelly.resource-wrapper .resource-banner {background-color: rgba(181, 198, 137, 0.9); color: #093145;}
#lighter-kelly.resource-wrapper .resource-content {background-color: #B5C689; color: #093145;}



/* ANIMATION: .resource-wrapper:hover .resource-content */
 .resource-wrapper:hover .resource-content {
    animation: reveal-content 600ms;
  	animation-delay: 0;
  	animation-iteration-count: 1;
  	animation-fill-mode: forwards;
  	
  	-webkit-animation: reveal-content 600ms;
  	-webkit-animation-delay: 0;
  	-webkit-animation-iteration-count: 1;
  	-webkit-animation-fill-mode: forwards;
  	
  	-moz-animation: reveal-content 600ms;
  	-moz-animation-delay: 0;
  	-moz-animation-iteration-count: 1;
  	-moz-animation-fill-mode: forwards;
}

@keyframes reveal-content {
    0%{ transform:scale(0); opacity:0;}
    75%{ transform:scale(1);}
    100%{ transform:scale(0.95); opacity:1;}
}

@-webkit-keyframes reveal-content {
    0%{ transform:scale(0); opacity:0;}
    75%{ transform:scale(1);}
    100%{ transform:scale(0.95); opacity:1;}
}

@-moz-keyframes reveal-content {
    0%{ transform:scale(0); opacity:0;}
    75%{ transform:scale(1);}
    100%{ transform:scale(0.95); opacity:1;}
}

/* Large and up */
@media screen and (min-width: 64em) {
	#main-content {margin: 1rem 4rem;}
}
