.gf-giphy_wrapper {
  width: 100%;
  min-width: 300px; }
  .gf-giphy_wrapper.-is-busy .gf-giphy_search-footer {
    opacity: 0.5;
    pointer-events: none; }
  .gf-giphy_wrapper.-is-busy .gf-giphy_search-results {
    opacity: 0.5;
    pointer-events: none; }
  .gf-giphy_wrapper.-is-busy .gf-giphy_loader {
    opacity: 1; }
  .gf-giphy_wrapper.-is-active .gf-giphy_search-results {
    display: -ms-flexbox;
    display: flex; }
  .gf-giphy_wrapper.-is-active .gf-giphy_search-footer {
    display: -ms-flexbox;
    display: flex; }
  .gf-giphy_wrapper.-is-selected .gf-giphy_search {
    display: none; }
  .gf-giphy_wrapper.-is-selected .gf-giphy_selected {
    display: inline-block; }
  .gf-giphy_wrapper.-is-entry .gf-giphy_remove {
    pointer-events: none;
    display: none; }
  .gf-giphy_wrapper.-size-medium .gf-giphy_attribution {
    width: 160px; }
  .gf-giphy_wrapper.-size-small .gf-giphy_attribution {
    width: 120px; }

.gf-giphy_img {
  display: inline-block;
  margin: 0;
  position: relative;
  z-index: 1;
  max-width: 100%;
  width: 100%;
  height: auto; }
  .gf-giphy_img.-preview {
    width: 200px; }

.gf-giphy_btn {
  cursor: pointer;
  outline: none;
  border: none;
  border-radius: 0; }

.gf-giphy_search-bar {
  position: relative; }

.gf-giphy_search-query {
  display: inline-block;
  width: 100%; }

.gf-giphy_loader {
  display: inline-block;
  opacity: 0;
  position: absolute;
  right: 10px;
  top: 50%;
  width: 30px;
  height: 20px;
  transform: translateY(-50%);
  z-index: 1;
  pointer-events: none; }

.gf-giphy_search-results {
  margin: 10px 0 0;
  padding: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  display: none;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start; }

.gf-giphy_result {
  box-sizing: border-box;
  display: inline-block;
  font-size: 0;
  line-height: 0;
  width: 33.333%;
  padding-top: 33.333%;
  margin: 0;
  background-color: #efefef;
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover; }

.gf-giphy_no-results .gf-giphy_query-text {
  font-weight: bold; }

.gf-giphy_search-footer {
  display: none;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #000;
  padding: 4px 10px; }
  .gf-giphy_search-footer .gf-giphy_btn {
    font-size: 12px;
    padding: 8px 14px;
    background: #fff;
    color: #000;
    font-weight: bold;
    text-transform: uppercase; }

.gf-giphy_search-cancel {
  margin-left: 0;
  margin-right: auto; }

.gf-giphy_search-more {
  margin-left: auto;
  margin-right: 0; }

.gf-giphy_attribution {
  width: 200px;
  height: auto; }

.gf-giphy_selected {
  display: none;
  position: relative; }

.gf-giphy_remove {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  width: 24px;
  height: 24px;
  overflow: hidden;
  background: white url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAAYFBMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABzK7FeAAAAH3RSTlMA+GFm+f1L+gX+T2z2Tk33gH82RWKzBhkj8SISPAhJtLTjUQAAAOVJREFUWMPtlskSgjAQRBFBXJBNwd38/19CIgVMn3o8uGZOFFP9mCSPgiDw5euzamn4Sn4YkJB75QGvAZyxfdABitlCdsM80wAKYyQhjE2U8YBq1V2nu7G3j7sbpws/wdwSxhlCm4/Wmj0QBJFnT2FCkHnag4EAeV6knoB5hYkbS8hdfvucym4GeL7uXXAzyOfrAG794KQG8MgjgQc4fxO0mgf05wdW84Dh/JFAAib+AIEDCP8kgQKAv4LAAO7orzMqPdKApkZ/7QylYglNLfOWUKo28XbFduW/jV8D+Pf/RF++3lktoCNa34MlHugAAAAASUVORK5CYII=) no-repeat 50%;
  background-size: contain; }
  .gf-giphy_remove span {
    display: none; }

.gf_giphy_visuallyhidden {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important; }

@media only screen and (min-width: 641px) {
  .gf-giphy_wrapper.-size-small {
    width: 25%; }
  .gf-giphy_wrapper.-size-medium {
    width: calc(50% - 8px); }
  .gf-giphy_wrapper.-size-large {
    width: 100%; } }

@media only screen and (max-width: 640px) {
  .gf-giphy_attribution {
    width: 120px !important; } }
