/**
* Playwire
* http://wordpress.org/plugins
*
* Copyright (c) 2014 10up
* Licensed under the GPLv2+ license.
*/
@import url(../js/vendor/flexslider/flexslider.css);
div[id^="playwire_film_strip_"][id$="_container"] {
  margin-bottom: 0px !important; }
  div[id^="playwire_film_strip_"][id$="_container"] .flex-control-nav,
  div[id^="playwire_film_strip_"][id$="_container"] .flex-control-paging {
    display: none; }

div[id^="playwire_"] {
  margin: 0 auto; }
  div[id^="playwire_"] > ul {
    margin: 0 !important;
    margin-bottom: 0 !important; }
  div[id^="playwire_"] #search_list {
    margin-top: 5px !important; }
  div[id^="playwire_"] a {
    border-bottom: none !important;
    text-decoration: none !important; }
  div[id^="playwire_"] .flexslider {
    margin: 0;
    border: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    background: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -o-border-radius: 0;
    -o-box-shadow: none; }
    div[id^="playwire_"] .flexslider .slides img {
      height: auto !important; }
    div[id^="playwire_"] .flexslider.flexslider-control .flex-viewport li {
      position: relative !important;
      margin: 0;
      padding: 10px 5px 0 5px;
      height: auto !important;
      list-style-type: none !important; }
      div[id^="playwire_"] .flexslider.flexslider-control .flex-viewport li svg, div[id^="playwire_"] .flexslider.flexslider-control .flex-viewport li object {
        position: absolute;
        top: 15%;
        right: 0;
        bottom: 0;
        left: 0;
        display: none;
        margin: auto;
        width: 15%;
        height: 15%;
        pointer-events: none;
        fill: RGBA(255, 255, 255, 0.9);
        stroke: black;
        stroke-width: 1;
        enable-background: new 0 0 16 16; }
      div[id^="playwire_"] .flexslider.flexslider-control .flex-viewport li:first-child {
        padding: 10px 5px 0 0; }
      div[id^="playwire_"] .flexslider.flexslider-control .flex-viewport li:last-child {
        padding: 10px 0 0 5px; }
      div[id^="playwire_"] .flexslider.flexslider-control .flex-viewport li img {
        box-shadow: none;
        transition: all 0.5s ease; }
        div[id^="playwire_"] .flexslider.flexslider-control .flex-viewport li img:hover {
          box-shadow: 5px 5px 5px gray; }
    div[id^="playwire_"] .flexslider .slides li, div[id^="playwire_"] .flexslider .flex-direction-nav li {
      margin: 0;
      list-style-type: none !important; }
    div[id^="playwire_"] .flexslider .flex-direction-nav a::before {
      line-height: 1em; }

div[id^="bolt-"] {
  display: block;
  margin: 0 auto;
  /*limit the width of the bolt player in the preview window*/
  max-width: 100%; }
  div[id^="bolt-"] object {
    margin: 0 !important;
    margin-bottom: 0 !important; }

div[id^="playwire_gallery_"] {
  width: 100%; }
  div[id^="playwire_gallery_"] h3 {
    text-align: center; }
  div[id^="playwire_gallery_"] .controls {
    display: block;
    clear: both;
    text-align: center; }
    div[id^="playwire_gallery_"] .controls a {
      padding: 3px;
      text-transform: uppercase;
      font-size: 12px; }
      div[id^="playwire_gallery_"] .controls a.prev {
        float: left; }
      div[id^="playwire_gallery_"] .controls a.next {
        float: right; }
      div[id^="playwire_gallery_"] .controls a.more-videos {
        display: block;
        clear: both; }

#playwire_library {
  padding: 0.5em; }
  #playwire_library ul#search_list li.playlist, #playwire_library ul#search_list li.video {
    display: inline-block; }
    #playwire_library ul#search_list li.playlist .playlist_title, #playwire_library ul#search_list li.playlist .video_title, #playwire_library ul#search_list li.video .playlist_title, #playwire_library ul#search_list li.video .video_title {
      margin: 0.5em;
      text-align: center;
      width: 160px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow:ellipsis; }

section#playwire_video_layout ul li {
  display: inline-block; }

#TB_title {
  border-bottom: none !important;
  background: #1B1B1B !important;
  color: #D3D1CD !important; }

#TB_window, #TB_ajaxContent {
  overflow: hidden !important;
  padding: 0 !important;
  width: auto !important;
  height: auto !important;
  border: none !important; }

div[id^="playwire_gallery"] {
  display: inline-block; }
  div[id^="playwire_gallery"] .clear {
    clear: both; }
  div[id^="playwire_gallery"] * {
    box-sizing: border-box; }
  div[id^="playwire_gallery"] .thickbox {
    position: relative;
    float: left;
    padding: 0.5em;
    width: 33.33%; }
    div[id^="playwire_gallery"] .thickbox .vertical-video-alignment {
      position: relative; }
      div[id^="playwire_gallery"] .thickbox .vertical-video-alignment svg, div[id^="playwire_gallery"] .thickbox .vertical-video-alignment object {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        display: none;
        margin: auto;
        width: 15%;
        height: 15%;
        pointer-events: none;
        fill: RGBA(255, 255, 255, 0.8);
        stroke: black;
        stroke-width: 1;
        enable-background: new 0 0 16 16; }
      div[id^="playwire_gallery"] .thickbox .vertical-video-alignment img {
        width: 100%;
        height: auto;
        box-shadow: none;
        transition: all 0.5s ease; }
        div[id^="playwire_gallery"] .thickbox .vertical-video-alignment img:hover {
          box-shadow: 5px 5px 5px gray; }
    div[id^="playwire_gallery"] .thickbox h3 {
      margin: 0 !important;
      padding: 10px;
      border-bottom: none !important;
      font-size: 14px !important;
      line-height: 1em !important; }

.post-type-playwire_videos .view-switch {
  display: none; }
.post-type-playwire_videos .inline-edit-col-right .inline-edit-tags, .post-type-playwire_videos .inline-edit-col-right .inline-edit-status {
  display: none; }
.post-type-playwire_videos #video_share,
.post-type-playwire_videos #video_thumbnail,
.post-type-playwire_videos #column-video_thumbnail {
  width: 115px; }
.post-type-playwire_videos td.video_thumbnail img {
  width: 115px;
  height: auto; }
.post-type-playwire_videos td.video_share {
  vertical-align: middle;
  text-align: center; }
  .post-type-playwire_videos td.video_share input[type=checkbox] {
    position: relative;
    box-sizing: border-box;
    margin: 10px 0;
    padding: 10px 5px;
    padding: 3px 4px !important;
    width: 30px;
    height: 20px;
    border: 2px solid #D9D9DB;
    border-radius: 10px;
    background-color: #ECEDED; }
    .post-type-playwire_videos td.video_share input[type=checkbox]:disabled {
      cursor: not-allowed; }
    .post-type-playwire_videos td.video_share input[type=checkbox]:not(:checked):before {
      position: absolute;
      top: 0px;
      left: 0px;
      display: block;
      box-sizing: border-box;
      width: 16px;
      height: 16px;
      border: 1px solid gray;
      border-radius: 50%;
      background-color: #8B8E91;
      box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, 0.5);
      content: '\00a0'; }
    .post-type-playwire_videos td.video_share input[type=checkbox]:checked:before {
      position: absolute;
      top: 0px;
      right: 0px !important;
      display: block;
      box-sizing: border-box;
      margin: 0;
      width: 16px;
      height: 16px;
      border: 1px solid gray;
      border-radius: 50%;
      background-color: #77CA8C;
      box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, 0.5);
      content: '\00a0'; }

div[id^="single-video-posts-edit-dialog-"] {
  display: none; }

#video_thumbnail_meta_box .inside img {
  display: block;
  margin: 0 auto;
  max-width: 100%; }

#playwire_videosdiv {
  margin-bottom: 20px; }
  #playwire_videosdiv #taxonomy-playwire_videos #playwire_videos-tabs li:last-of-type {
    display: none; }
  #playwire_videosdiv #taxonomy-playwire_videos #playwire_videos-adder {
    display: none; }

.post-type-playwire_videos .video_share {
  position: relative;
  overflow: visible; }
  .post-type-playwire_videos .video_share a {
    color: #333333; }
    .post-type-playwire_videos .video_share a[data-tooltip]:link, .post-type-playwire_videos .video_share a[data-tooltip]:visited {
      position: relative;
      text-decoration: none; }
    .post-type-playwire_videos .video_share a[data-tooltip]:before {
      position: absolute;
      top: -25px;
      right: -15px;
      visibility: hidden;
      border-top: 20px solid;
      border-right: 30px solid transparent;
      border-left: 30px solid transparent;
      content: ""; }
    .post-type-playwire_videos .video_share a[data-tooltip]:after {
      position: absolute;
      top: -40px;
      right: -15px;
      visibility: hidden;
      padding: 5px 15px;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      border-radius: 10px;
      background: #333333;
      color: white;
      content: attr(data-tooltip);
      white-space: nowrap; }
    .post-type-playwire_videos .video_share a[data-tooltip]:hover:before, .post-type-playwire_videos .video_share a[data-tooltip]:hover:after {
      visibility: visible;
      -webkit-transition: visibility 0s linear .3s;
      -moz-transition: visibility 0s linear .3s;
      -o-transition: visibility 0s linear .3s;
      transition: visibility 0s linear .3s; }

.playwire-upload {
  position: relative;
  width: 100%;
  height: auto; }
  .playwire-upload input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    min-height: 100%;
    width: 100%;
    outline: none;
    text-align: right;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -moz-opacity: 0; 
}

#playwire_library .tablenav .tablenav-pages {
  float: none;
  text-align: center; 
}

/* Utility Classes */

.no-ul{
  text-decoration: none !important;
}
.underline{
  text-decoration: underline;
  font-weight: 900;
}
.btm-20{
  margin-bottom: 20px;
}

.half{
  min-width:34%;
  max-width:50%;
  margin-right: 5px;
  display: inline-block;
}
.half-r{
  display: inline-block;
}
.playwire-error{
  background: #fceceb;
  border: 1px solid #f5bbb6 !important;
  border-bottom: 1px solid #f5bbb6 !important;
  padding:5px 10px;
  border-radius: 4px;
  font-size: 16px;
  text-align: center;
  margin:35px 18px 0px 0px;
}
.playwire-warning{
  padding:5px 10px;
  border: 1px solid #e6db55;
  border-radius: 4px;
  font-size: 16px !important;
  text-align: center;
  margin:35px 18px 0px 0px;
  background:#fffbcc;
}
.green-warning{
  background: #e4f6d7;
  border: 1px solid #b0e489;
  border-radius: 4px;
  padding:20px 10px;
  font-size: 16px;
  text-align: center;
  margin: 10px 5px;
}
.error-container{
  padding-right: 18px;
}
span.radio-btn-helper{
  margin-right: 5px;
}
.no-select{
visibility: hidden;
  /*opacity: 0.3;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  filter: alpha(opacity=30);
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;

  -webkit-filter: blur(1px);
  -moz-filter: blur(1px);
  -o-filter: blur(1px);
  -ms-filter: blur(1px);
  filter: blur(1px);*/
}
span.no-select-text{
  font-size: 20px;
  text-transform: uppercase;
  cursor: not-allowed;
  z-index: 9999;
  color: rgb(231, 76, 60);
  margin: 0 auto;
  padding: 160px 20px 440px 50px;
  width: 100%;
  height: 100%;
  text-align: center;
  top: 170px;
  position: relative;
  word-wrap: break-word;
}
.big{
  color: #fff;
  width: 60 !important;
  height: 60 !important;
  font-size: 60px;
  margin-right: 40px;
  margin-top: -20px;
}
.big:hover{
  font-size: 64px !important;
  color: #2ea2cc;
}
.big-icon{
  width: 60 !important;
  height: 60 !important;
  font-size: 60px;
  margin-right: 40px;
  margin-top: -20px;
}
.playwire-warning .playwire-btn, .playwire-warning .help-btn {
  display: inline-block;
  margin-left: 10px;
  padding: 10px 15px;
  color: #f39c12;
  border: 2px solid #f39c12;
  border-radius: 6px;
  min-width: 200px;
  height: 1.3em;
  text-decoration: none;
}
.playwire-error .playwire-btn, .playwire-error .help-btn{
  display: inline-block;
  margin-left: 10px;
  padding: 10px 5px;
  color: #dd3d36;
  border: 2px solid #dd3d36;
  border-radius: 6px;
  min-width: 200px;
  height: 1.3em;
  text-decoration: none;
}
.playwire-warning .playwire-btn:hover, .playwire-warning .help-btn:hover{
  background: #f39c12;
  color: #fff;
}
.playwire-error .playwire-btn:hover, .playwire-error .help-btn:hover{
  background: #dd3d36;
  color: #fff;
}
.social-holder{
  position: relative;
  top: -100px;
  left: 40px;
}
img.button-spacing{
  position: relative;
  top: 10px;
  margin: -12px 6px 0 6px;
}
.redski{
  color: #dd3d36;
}
.error-text {
  color: #dd3d36;
}
.warning-text {
  color: #f39c12;
}
h3.error-styles{
  line-height: 1.4em;
  font-size:1em;
}
img.metabox-image{
  margin: 20px 0px;
  width: 100%;
  max-width: 960px;
}
.hide-me{
  display: none;
}
#encode-notice{
  width: 200px;
  height: 100px;
  background: red;
}
.publish-blocker{
  padding: 10px;
  clear: both;
  visibility: visible !important;
  text-align: center;
  background: #fceceb;
  border: 1px solid #f5bbb6;

}
.error-padding{
  background: red;
  color: red !important;
  padding-top:20px;
}
.playlist-heading{
  /*font-size: 1.5em !important;
  font-weight: 100;
  font-style: italic;*/
  text-transform: uppercase;
  padding-left: 0px !important;
}
hr.thick{
  border: 0;
  border-top: 4px solid #ddd;
  border-bottom: 4px solid #fafafa;
}
tr.no-items td.colspanchange{
  font-size: 16px !important;
  padding: 5px 10px;
  border-left: 2px solid #f5bbb6;
  border-right: 2px solid #f5bbb6;
  background: #fceceb;
}
.sync-heading{
  margin-top: 30px;
}
.sync-text{
  padding-right: 20%;
}

.sync-log-success{
  background: #e4f6d7;
  border: 1px solid #b0e489;
  border-radius: 4px;
  padding:5px 10px;
  text-align: center;
  margin: 10px 20px 10px 0px;
  display: inline-block;
}
.sync-log-warning{
  padding:5px 10px;
  border: 1px solid #e6db55;
  border-radius: 4px;
  text-align: center;
  margin:10px 18px 0px 0px;
  background:#fffbcc;
  display: inline-block;
}
.sync-button{
  width: 100px;
  height: 20px;
  text-align: center;
}
.icon-lg{
  font-size: 28px !important;
  line-height: 20px !important;
  margin-right: 10px;
}


/* ============================================================
  Toggle Switch Styles
============================================================ */
.cmn-toggle {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}
.cmn-toggle + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* ============================================================
  SWITCH 2 - ROUND FLAT
============================================================ */
input.cmn-toggle-round-flat + label {
  padding: 2px;
  width: 60px;
  height: 30px;
  background-color: #dddddd;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
  border-radius: 30px;
  -webkit-transition: background 0.4s;
  -moz-transition: background 0.4s;
  -o-transition: background 0.4s;
  transition: background 0.4s;
}
input.cmn-toggle-round-flat + label:before, input.cmn-toggle-round-flat + label:after {
  display: block;
  position: absolute;
  content: "";
}
input.cmn-toggle-round-flat + label:before {
  top: 2px;
  left: 2px;
  bottom: 2px;
  right: 2px;
  background-color: #fff;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
  border-radius: 30px;
  -webkit-transition: background 0.4s;
  -moz-transition: background 0.4s;
  -o-transition: background 0.4s;
  transition: background 0.4s;
}
input.cmn-toggle-round-flat + label:after {
  top: 4px;
  left: 4px;
  bottom: 4px;
  width: 30px;
  background-color: #dddddd;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
  border-radius: 30px;
  -webkit-transition: margin 0.4s, background 0.4s;
  -moz-transition: margin 0.4s, background 0.4s;
  -o-transition: margin 0.4s, background 0.4s;
  transition: margin 0.4s, background 0.4s;
}
input.cmn-toggle-round-flat:checked + label {
  background-color: #8ce196;
}
input.cmn-toggle-round-flat:checked + label:after {
  margin-left: 26px;
  background-color: #8ce196;
}


.successs{
  
}
.help-click{
  background: #0074a2;
  cursor: pointer;
  display: inline-block;
  padding: 5px 5px 11px 5px;
  color: #fff;
  border: 2px solid #0074a2;
  border-radius: 6px;
  height: 1em;
  text-decoration: none;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
.help-click:hover{
  background: transparent;
  color: #0074a2;
}

.sync-click{
  background: #0074a2;
  cursor: pointer;
  display: inline-block;
  padding: 5px 5px 11px 5px;
  margin-bottom: 20px;
  color: #fff;
  border: 2px solid #0074a2;
  border-radius: 6px;
  height: 1em;
  text-decoration: none;
  -webkit-transition: all 0.25s ease-in-out;
  -moz-transition: all 0.25s ease-in-out;
  -o-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
.sync-click:hover{
  background: transparent;
  color: #0074a2;
}
.loggg{
  font-size: 18px;
  padding: 5px 10px;
  border:1px solid red;
  color: red;
  border-radius: 6px;
  display: inline-block;
}


#help-section{
  width: 100%;
  display: inline-block;
  visibility: hidden;
}
.row-holder{
  width: 100%;
}
.success-instructions{
  width: 30%;
  text-align: left;
  padding-right: 4%;
  position: relative;
  float: left;
}
.success-video{
  width: 65%;
  overflow: hidden;
  float: left;
  margin: 20px 0 30px 0;
  float: left;
  visibility: hidden;
  background: red;

}
.loading-jawn{
  width: 60%;
  overflow: hidden;
  float: left;
  margin: 20px 0 30px 0;
  background: url('../img/loading.gif') no-repeat center center;
}
.loading-jawn-big{
  width: 80%;
  height: 200px;
  display: inline-block;
  margin: 5% auto 0 auto;
  padding: 10px 20px;
  font-size: 18px;
  background: url('../img/loading.gif') no-repeat center center;
}
.success-hr{
  border: 0;
  border-top: 1px solid #999;
  border-bottom: 1px solid #eaeaea;
  width: 97%;
}
.settings-hr{
  border: 0;
  border-top: 1px solid #999;
  border-bottom: 2px solid #eaeaea;
  width: 100%;
  margin: 20px auto 30px auto;
}
.help-instructions{
  width: 100%;
  text-align: left;
  padding-left: 2%;
  padding-right: 3%;
  position: relative;
  float: left;
}
#help-section{
  height: 1px;
  visibility: hidden;
}

@media all and (max-width: 899px) and (min-width: 320px) {
  .success-instructions{
    width: 100%;
  }
  .success-video{
    width: 100%;
  }
}



@-webkit-keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0 #FFF;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em #ffffff;
    height: 6em;
  }
}
@keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0 #FFF;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em #ffffff;
    height: 6em;
  }
} 

@-webkit-keyframes loadtext {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
@keyframes loadtext {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

/**************************/
/* Animation.css Classes **/
/**************************/

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -webkit-animation-delay: 0.5s;
  animation-fill-mode: both;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

@-webkit-keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}