/*$research-topic-desktop-width: 384px;
$research-topic-desktop-height: 287px;
$research-topic-tablet-width: 384px;
$research-topic-tablet-height: 287px;
$research-topic-phone-width: 360px;
$research-topic-phone-height: 272px;*/
/*@mixin responsive-banner-promotion-text {
  @include responsive-font($banner-promotion-text-desktop-font-size, $banner-promotion-text-tablet-font-size, $banner-promotion-text-tablet-font-size, $banner-promotion-text-phone-font-size);
}*/
/*@mixin responsive-initiativehashtag {
  @include responsive-font($initiativehashtag-desktop-font-size, $initiativehashtag-desktop-font-size, $initiativehashtag-tablet-font-size, $initiativehashtag-phone-font-size);
}
@mixin responsive-initiativebuttonlabel {
  @include responsive-font($initiativebuttonlabel-desktop-font-size, $initiativebuttonlabel-desktop-font-size, $initiativebuttonlabel-tablet-font-size, $initiativebuttonlabel-phone-font-size);
}*/
/*
 * Sets the color and direction or featured related items section
 * @backgroundColor - the color of the full-width background
 * @contentContainer - the color of the inner content background
 * @headingColor - the color of the H tag
 * @textColor  - the color of the summary text
 * @flex-direction - the direction of orientation for the flexbox items
 */
/*
 * Sets the styles for files cards
 * @backgroundColor - the color of the full-width background
 *
 */
/*@mixin responsive-banner-promotion-text {
  @include responsive-font($banner-promotion-text-desktop-font-size, $banner-promotion-text-tablet-font-size, $banner-promotion-text-tablet-font-size, $banner-promotion-text-phone-font-size);
}*/
/*@mixin responsive-initiativehashtag {
  @include responsive-font($initiativehashtag-desktop-font-size, $initiativehashtag-desktop-font-size, $initiativehashtag-tablet-font-size, $initiativehashtag-phone-font-size);
}
@mixin responsive-initiativebuttonlabel {
  @include responsive-font($initiativebuttonlabel-desktop-font-size, $initiativebuttonlabel-desktop-font-size, $initiativebuttonlabel-tablet-font-size, $initiativebuttonlabel-phone-font-size);
}*/
/*
 * Sets the color and direction or featured related items section
 * @backgroundColor - the color of the full-width background
 * @contentContainer - the color of the inner content background
 * @headingColor - the color of the H tag
 * @textColor  - the color of the summary text
 * @flex-direction - the direction of orientation for the flexbox items
 */
/*
 * Sets the styles for files cards
 * @backgroundColor - the color of the full-width background
 *
 */
/* line 9, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block {
  display: flex;
  align-items: center;
  background-color: #14284B;
  border-radius: 8px;
  overflow: hidden;
}
@media all and (min-width: 0em) and (max-width: 767px) {
  /* line 9, ../../../sass/components/blocks/social-media-block.scss */
  .block-type-social-media-block {
    display: block;
  }
}
/* line 18, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block .field--name-field-social-text {
  font-size: 1.75rem;
  line-height: 1.26;
  padding: 1em;
  background-color: #EFF5F7;
  flex: 1;
  border-radius: 8px 0 0 8px;
  transform: skewX(-30deg);
  margin-left: -30px;
}
/* line 27, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block .field--name-field-social-text .field--name-field-social-text-inner {
  transform: skewX(30deg);
  padding-left: 30px;
}
@media all and (min-width: 768px) and (max-width: 1099px) {
  /* line 18, ../../../sass/components/blocks/social-media-block.scss */
  .block-type-social-media-block .field--name-field-social-text {
    transform: skewX(-20deg);
    margin-left: -25px;
  }
  /* line 35, ../../../sass/components/blocks/social-media-block.scss */
  .block-type-social-media-block .field--name-field-social-text .field--name-field-social-text-inner {
    transform: skewX(20deg);
    padding-left: 25px;
  }
}
@media all and (min-width: 0em) and (max-width: 767px) {
  /* line 18, ../../../sass/components/blocks/social-media-block.scss */
  .block-type-social-media-block .field--name-field-social-text {
    flex: none;
    border-radius: 8px 8px 0px 0px;
    transform: none;
    margin-left: 0;
  }
  /* line 47, ../../../sass/components/blocks/social-media-block.scss */
  .block-type-social-media-block .field--name-field-social-text .field--name-field-social-text-inner {
    transform: none;
    padding-left: 0;
  }
}
/* line 53, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block .field--name-field-social-text:after {
  content: '';
}
/* line 57, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block .field--name-field-social-icons {
  background-color: #14284B;
  padding-right: 1rem;
  padding-left: 4rem;
}
/* line 63, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block .field--name-field-social-icons div {
  display: inline-block;
}
@media all and (min-width: 768px) and (max-width: 1099px) {
  /* line 57, ../../../sass/components/blocks/social-media-block.scss */
  .block-type-social-media-block .field--name-field-social-icons {
    padding-left: 2rem;
  }
}
@media all and (min-width: 0em) and (max-width: 767px) {
  /* line 57, ../../../sass/components/blocks/social-media-block.scss */
  .block-type-social-media-block .field--name-field-social-icons {
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left: 0;
    border-radius: 0px 0px 8px 8px;
    text-align: center;
  }
}
/* line 79, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block .paragraph--type--icon-link .ext-icon {
  display: none;
}
/* line 82, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block .paragraph--type--icon-link a {
  color: #005F71;
  display: inline-block;
  border-radius: 50%;
  background-color: #fff;
  width: 50px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  font-size: 2rem;
  margin-left: 1rem;
}

/* line 96, ../../../sass/components/blocks/social-media-block.scss */
.block-type-social-media-block.hidden {
  display: none;
}