/* ****** Compass */
/* ****** functions */
/*
https://css-tricks.com/snippets/sass/px-to-em-functions/
EXAMPLES:
h1 {
  font-size: em(32);
}

// is the same as:

h1 {
  font-size: em(32px);
}
*/
/* ****** Variables */
/* ****** Colors */
/* ****** Color Variables */
/* ****** Sizes */
/* ****** Fonts */
.FeaturedVideos {
  max-width: 1200px;
  min-width: 960px;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  margin: 35px auto;
}
.FeaturedVideos-item {
  width: 31.5%;
  background: white;
  border-radius: 4px;
  margin-bottom: 2em;
}
.FeaturedVideos-item:first-child, .FeaturedVideos-item:nth-child(2) {
  width: 48.5%;
}
.FeaturedVideos-thumb {
  position: relative;
  display: block;
}
.FeaturedVideos-thumb:hover .FeaturedVideos-icon {
  transform: scale(1.25);
}
.FeaturedVideos-thumbnail {
  display: block;
  width: 100%;
  height: auto;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.FeaturedVideos-icon {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  text-align: center;
  transition: transform 250ms;
  transform-origin: 50% 250% 0;
}
.FeaturedVideos-icon > svg {
  transform: scale(0.7);
}
.FeaturedVideos-title {
  font-size: 1.875em;
  margin: 1.23333em;
}