.aible-resources-page {
  max-width: 1024px;
  margin: 0px auto;
}

.aible-resources-content-wrapper{
  width: 100%;
  padding: unset;
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
}

.partner-resource-link {
  display: block;  
}

.partner-resource-element{
 width: 33.33%; 
}

.partner-image-container{
  width: 100%;
}

.img-rollout{
  width: 300px;
}

.img-container{
  width: 300px;
  border-bottom: solid 5px gray;

  transition: all 1s;
}

.img-container>.wrapper>img{
  transition: all 1s;
}

.img-container:hover>.wrapper>img{
  filter: unset; 
}

.img-container:after {
	content: '';
	position: relative;
	bottom: -30px;
	left: 50%;
	width: 0;
	height: 0;
	border: 15px solid transparent;
	border-top-color: gray;
	border-bottom: 0;
	margin-left: -15px;
	margin-bottom: -15px;
  transition: all 0.7s;
  opacity: 1;
}

.image-rollout:hover>.img-container{
  border-bottom: solid 5px #5e2b89;
}

.image-rollout:hover>.img-container:after{
	border-top-color: #5e2b89;
  opacity: 0;
}

.additional-info{
  width: 300px;
  max-height: 300px;
  overflow: hidden;
  transition: opacity 0.7s ;
  background-color: #f6f5f8;
  margin-bottom: 40px;
  opacity: 0;
}

.additional-info>.content{
  margin: 10px;
  font-size: 16px;
}

.image-rollout:hover>.additional-info{
  opacity: 1;
}

.wrapper{

}

.wrapper>img{
  width: 100%;
  height: auto;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes fadeInOpacity-flip {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

.partners-title{
  color: #521f77 !important;
  font-family: Raleway;
  font-size: 28px;
  font-weight: normal;
  padding-top: 50px;
  text-align: center;
  padding-bottom: 20px;
}

@media(max-width: 1024px){
  .partner-resource-element{
      width: 50%; 
}
  
@media(max-width: 960px){
  .image-rollout{
    margin-left: auto;
    margin-right: auto;
  }
}
 

@media(max-width: 600px){
  .partner-resource-element{
      width: 100%; 
}
}