/*
Theme Name: Humordido
Description: Tema/Layout desenvolvido por Alan Patrick exclusivamente para o blog "Humordido". Sua venda ou cópia para blogs de terceiros é totalmente proibida. Dúvidas e informações: alan.patrick@live.com
Theme URI: http://www.geraligado.blog.br/
Author: Alan Patrick
Author URI: http://www.alanpatrickk.net/
Version: 1.0
*/

* {
	font-family: 'Montserrat', sans-serif;
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body {
	width: 100%;
	background-color: #f1f1f1;
}
a, a:visited {
	color: #53647d;
	text-decoration: none;
}
a:hover {
	color: #5f7ba4;
	text-decoration: none;
}
input, textarea, select, option, div, button, a, img {
  -webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-ms-transition: all 200ms linear;
	transition: all 200ms linear;
	border: 0;
}
.container {
	position: relative;
	margin: 0 auto;
	padding: 0;
}
.row {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
}

/* HEADER */
header {
	width: 100%;
	height: auto;
	position: relative;
	padding: 0;
	margin: 0;
	float: left;
	background-image: url(img/topo.jpg);
	background-position: top center;
	background-repeat: repeat-x;
	border-bottom: 2px solid #0c0b02;
	box-shadow: 0 0 15px rgba(0,0,0,0.6);
	z-index: 20;;
}
header .row {
	padding: 10px 0 0 0;
}
header .m1 {
	width: 200px;
	height: 289px;
	margin: 0 -30px 0 0;
	background-image: url(img/m1.png);
	display: inline-block;
	position: relative;
	z-index: 5;
}
header .m1:hover {
	-webkit-animation-name: buzz-out;
	animation-name: buzz-out;
	-webkit-animation-duration: .75s;
	animation-duration: .75s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}
header .logo {
	margin: -20px 0 0 0;
	position: relative;
	z-index: 4;
	transform: rotate(0deg) scale(1.0);
	-o-transform: rotate(0deg) scale(1.0);
	-ms-transform: rotate(0deg) scale(1.0);
	-moz-transform: rotate(0deg) scale(1.0);
	-webkit-transform: rotate(0deg) scale(1.0);
	filter: brightness(100%);
	-webkit-filter: brightness(100%);
}
header .logo:hover {
	transform: rotate(-5deg) scale(1.06);
	-o-transform: rotate(-5deg) scale(1.06);
	-ms-transform: rotate(-5deg) scale(1.06);
	-moz-transform: rotate(-5deg) scale(1.06);
	-webkit-transform: rotate(-5deg) scale(1.06);
	filter: brightness(140%);
	-webkit-filter: brightness(140%);
}
header .m2 {
	width: 274px;
	height: 281px;
	background-image: url(img/m2.png);
	display: inline-block;
	position: relative;
	z-index: 5;
	margin: 9px 0 0 -140px;
}
header .m2:hover {
	-webkit-animation-name: buzz-out;
	animation-name: buzz-out;
	-webkit-animation-duration: .75s;
	animation-duration: .75s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}

/* MENU */
nav#menu {
	width: 100%;
	height: 58px;
	background: #f3ce23;
	box-shadow: 0 0 8px rgba(0,0,0,0.12);
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	border-radius: 0 0 20px 20px;
	overflow: hidden;
}
nav#menu li {
	display: inline-block;
	margin: 0;
	padding: 0;
	list-style: none;
}
nav#menu .menu {
	flex: 1;
	padding: 0 26px;
}
nav#menu .menu li {
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
}
nav#menu .menu a {
	display: inline-block;
	padding: 0 14px;
	color: #1e2c3a;
}
nav#menu .menu a:hover {
	color: #4b6580;
}
nav#menu .social {
	padding: 0 14px 0 0;
}
nav#menu .social a {
	padding: 8px;
	color: #1e2c3a;
}
nav#menu .social a:hover {
	color: #4b6580;
}
nav#menu #search{
	height: auto;
	position: relative;
	z-index: 1;
}
nav#menu #search:before {
	content: '';
	position: absolute;
	background: #f3ce23;
	width: 20px;
	height: 120%;
	top: -4px;
	left: -10px;
	-webkit-transform: rotate(12deg);
	-moz-transform: rotate(12deg);
	-ms-transform: rotate(12deg);
	-o-transform: rotate(12deg);
	transform: rotate(12deg);
}
nav#menu #search input{
	width: 100%;
	min-width: 460px;
	height: 58px;
	font-size: 14px;
	color: #909090;
	background: #fff;
	outline: 0;
	padding: 0 70px 0 40px;
}
nav#menu #search button{
	background: transparent;
	width: 62px;
	height: 58px;
	cursor: pointer;
	color: #4b6580;
	font-size: 18px;
	outline: 0;
	position: absolute;
	top: 0;
	right: 0;
}
nav#menu #search button:hover, nav#menu #search button:focus{
	color: #000;
	text-shadow: 0 0 10px #fff;
}
nav#menu #search input::-webkit-input-placeholder{
  color: #909090;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
}
nav#menu #search input::-moz-placeholder{
  color: #909090;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
}
nav#menu #search input:-ms-input-placeholder{
  color: #909090;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
}
nav#menu #search input:-moz-placeholder{
  color: #909090;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
}
nav#menu #search input:focus::-webkit-input-placeholder{
  color: transparent;
}
nav#menu #search input:focus::-moz-placeholder{
  color: transparent;
}
nav#menu #search input:focus:-ms-input-placeholder{
  color: transparent;
}
nav#menu #search input:focus:-moz-placeholder{
  color: transparent;
}
.menu-cats {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	width: auto;
}
.menu-cats ul {
	margin: 0;
	padding: 0 18px;
	background: #e3e3e3;
	border-radius: 0 0 12px 12px;
}
.menu-cats ul li {
	display: inline-block;
	margin: 0;
	padding: 0;
}
.menu-cats ul li a {
	display: inline-block;
	padding: 12px 25px;
	font-size: 15px;
	color: #4b6580;
	font-weight: 600;
}
.menu-cats ul li a:hover {
	color: #1e2c3a;
}
.banTop {
	text-align: center;
	margin: 30px 0 0 0;
}
.banTop img {
	vertical-align: top;
}

/* MAIN CONTENT */
main {
	width: 100%;
	display: flex;
	margin: 30px 0 0 0;
	justify-content: space-between;
	align-items: flex-start;
}
section {
	flex: 1;
	position: relative;
	max-width: 790px;
}
section .banFixed {
	position: absolute;
	right: 104%;
	right: calc(100% + 20px);
	top: 5px;
	-webkit-transition: all 0ms linear;
	-moz-transition: all 0ms linear;
	-ms-transition: all 0ms linear;
	transition: all 0ms linear;
}
section .banFixed img {
	vertical-align: top;
}

/* POSTS LIST */
section .post {
	width: 100%;
	margin: 0 0 35px 0;
}
section .post .inset {
	width: 100%;
	background: #fff;
	display: inline-block;
	position: relative;
	box-shadow: 0 0 5px rgba(0,0,0,0.1);
}
section .post .title {
  width: 100%;
  position: relative;
}
section .post .title h1,
section .post .title a {
	font-size: 26px;
	font-weight: 800;
	color: #53647d;
}
section .post .title a:hover {
	color: #1e2c3a;
}
section .post .info {
	width: 100%;
	font-size: 13px;
	color: #979da5;
	margin: 4px 0 12px 0;
}
section .post .info a {
	color: #979da5;
}
section .post .info a:hover {
	color: #53647d;
}
section .post .content {
	width: 100%;
	padding: 20px;
}
section .post .content p {
	margin: 0 0 12px 0;
	color: #111;
	line-height: 155%;
	font-size: 15px;
}
section .post .content img {
	max-width: 100%;
	height: auto;
	vertical-align: top;
	border: 0;
}
section .post .content iframe,
section .post .content embed,
section .post .content object {
	max-width: 100%;
	vertical-align: top;
	border: 0;
}
section .post .content .more-link {
	width: 100%;
	text-align: center;
	display: inline-block;
	margin: 15px auto 0 auto;
}
section .post .content .more-link img:hover {
  -webkit-transform: translateX(30px);
  -moz-transform: translateX(30px);
  -ms-transform: translateX(30px);
  -o-transform: translateX(30px);
  transform: translateX(30px);
  -webkit-filter: brightness(106%);
  filter: brightness(106%);
  -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.47, -0.36);
  -moz-transition-timing-function: cubic-bezier(0.47, 2.02, 0.47, -0.36);
  -ms-transition-timing-function: cubic-bezier(0.47, 2.02, 0.47, -0.36);
  -o-transition-timing-function: cubic-bezier(0.47, 2.02, 0.47, -0.36);
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.47, -0.36);
}
section .post .bottom {
	width: 100%;
	height: auto;
	border-top: 2px dotted #e7e9ea;
	display: inline-block;
	position: relative;
}
section .post .bottom .social {
	width: 100%;
	height: auto;
	padding: 10px;
	text-align: center;
}
section .post .bottom .social > * {
	vertical-align: top !important;
	display: inline-block;
	margin-right: 4px;
}
section .post .bottom .social .whatsapp {
	height: 28px;
	background: #65bc54;
	border: 1px solid #4aa639;
	border-radius: 3px;
	vertical-align: top;
	display: inline-block;
	color: #fff;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 25px;
	padding: 0 9px 0 9px;
	margin: 0;
}
section .post .bottom .social .whatsapp i {
	font-size: 16px;
	margin: -2px 0;
	display: inline-block;
	position: relative;
	top: 1px;
}
section .post .bottom .social .whatsapp:hover {
	background: #4aa639;
}
section .post .bottom .social .pinterest {
	height: 28px;
	background: #bf2025;
	border: 1px solid #99181d;
	border-radius: 3px;
	vertical-align: top;
	display: inline-block;
	color: #fff;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 28px;
	padding: 0 20px;
	margin-right: 4px;
}
section .post .bottom .social .pinterest i {
	font-size: 16px;
	margin: 0;
	display: inline-block;
}
section .post .bottom .social .pinterest:hover {
	background: #99181d;
}
section .post .bottom .bg {
	background: #eff1f3;
	border-style: solid;
	border-color: #fff;
	border-width: 0 4px 4px 4px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	padding: 16px 16px 12px 16px;
}
section .post .bottom .bg img {
	border-radius: 100%;
	border: 8px solid #fff;
	box-shadow: 0 0 12px rgba(0,0,0,0.2);
	margin: -12px 0;
	position: relative;
	top: 16px;
}
section .post .bottom .infos {
	flex: 1;
	margin: 0 0 0 16px;
}
section .post .bottom .infos .ballon {
	background: #53647d;
	font-size: 16px;
	font-weight: 400;
	color: #fff;
	height: 55px;
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	align-content: center;
	padding: 0 20px;
	position: relative;
}
section .post .bottom .infos .ballon:before {
	content: '';
	width: 20px;
	height: 20px;
	background: #53647d;
	position: absolute;
	top: 50%;
	left: -10px;
	transform: rotate(45deg) translateY(-50%);
}
section .post .bottom .infos .row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	font-size: 14px;
	color: #53647d;
	padding: 12px 2px 0 2px;
	margin: 0 0 -2px 0;
}
section .post .bottom .infos .row a {
	color: #53647d;
}
section .post .bottom .infos .row a:hover {
	color: #1e2c3a;
}
section .post .bottom .infos .row .author a {
	font-weight: 700;
}
section .post .bottom .infos .row .comments span {
	font-weight: 700;
}
section .post .banPost {
	width: 100%;
	margin: 0 auto 20px auto;
	text-align: center;
	display: flex;
	justify-content: center;
	max-width: 780px;
	overflow: hidden;
}
section .post .banPost > * {
	margin: 0 15px;
}
section .banSect {
	width: 100%;
	background: #fff;
	display: inline-block;
	position: relative;
	box-shadow: 0 0 5px rgba(0,0,0,0.1);
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 25px;
	margin: 0 0 20px 0;
}
section .banSect * {
	vertical-align: top;
}

/* SIDEBAR */
aside {
	width: 300px;
	margin: 0 0 0 30px;
	position: relative;
	overflow: hidden;
}
aside .widget {
	width: 100%;
	margin: 0 0 26px 0;
	padding: 0;
	font-size: 0;
	position: relative;
}
aside .widget h3 {
	width: 100%;
	margin: 0 0 4px 0;
	padding: 0;
	font-size: 20px;
	font-weight: 900;
	color: #a16425;
	display: inline-block;
}
aside .widget > div {
	font-size: 15px;
}
aside .widget img{
	max-width: 100%;
	vertical-align: middle;
	border: 0;
}
aside .widget ul{
	font-size: 0;
	list-style: none;
	display: inline-block;
	margin: 0 0 -8px 0;
}
aside .widget ul li{
	width: 49%;
	width: calc(50% - 2px);
	font-size: 14px;
	margin: 0 0 4px 0;
	float: left;
}
aside .widget ul li:nth-child(even){
	float: right;
}
aside .widget ul li a {
	width: 100%;
	color: #fff;
	display: inline-block;
	vertical-align: top;
	padding: 12px 12px;
	background: #777;
	border-left: 4px solid #333;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
aside .widget ul li a:hover{
	background: #333;
	padding: 12px 18px;
}
aside .widget select{
	width: 100%;
	border: 1px solid #dfdfdf;
	height: 44px;
	padding: 0 10px;
	outline: 0;
	box-shadow: 0 0 5px rgba(0,0,0,0.15);
}
aside .widget select:focus{
	box-shadow: 0 0 5px rgba(0,0,0,0.35);	
}
aside .widget select option{
	padding: 5px 0;
}
#adfix {
  -webkit-transition: all 0ms linear;
	-moz-transition: all 0ms linear;
	-ms-transition: all 0ms linear;
	transition: all 0ms linear;
}

/* PAGE NAVI */
.wp-pagenavi {
	width: 100%;
	float: left;
	text-align: left;
	margin: 10px 0;
	padding: 0;
}
.wp-pagenavi span.current, .wp-pagenavi a, .wp-pagenavi span.extend {
	display: inline-block;
	vertical-align: top;
	font-size: 26px;
	font-weight: 800;
	color: #000;
	background-color: #e5ecf7;
	border-radius: 20px;
	line-height: 60px;
	width: 62px;
	height: 62px;
	text-align: center;
	margin: 0 8px 10px 0;
	position: relative;
}
.wp-pagenavi span.current {
	background: #f3cb23;
}
.wp-pagenavi a:hover {
	background: #b8c9e0;
}
.wp-pagenavi span.extend {
	display: none;
}
.wp-pagenavi span.pages {
	display: none;
}
.wp-pagenavi a.last, 
.wp-pagenavi a.first {
	font-size: 12px;
}

/* ARROW NAV */
.arrowNav {
	position: fixed;
	top: 50%;
	z-index: 9090;
}
.arrowNav a {
	display: flex;
	align-items: center;
	text-transform: uppercase;
	max-width: 130px;
	color: #979da5;
	font-weight: 900;
  -webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-ms-transition: all 200ms linear;
	transition: all 200ms linear;
}
.arrowNav span {
	display: inline-block;
	min-width: 30px;
	min-height: 30px;
	width: 30px;
	height: 30px;
	border-width: 6px 6px 0 0;
	border-style: solid;
	border-color: #979da5;
	border-radius: 3px;
	margin: 0 -2px;
  -webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-ms-transition: all 200ms linear;
	transition: all 200ms linear;
}
.arrowNav a div {
  -webkit-transition: all 0ms linear;
	-moz-transition: all 0ms linear;
	-ms-transition: all 0ms linear;
	transition: all 0ms linear;
}
.arrowNav.arrowLeft {
	left: 30px;
	text-align: left;
}
.arrowNav.arrowRight {
	right: 30px;
	text-align: right;
}
.arrowNav.arrowLeft span {
	transform: rotate(-135deg);
}
.arrowNav.arrowRight span {
	transform: rotate(45deg);
}
.arrowNav a:hover {
	color: #3b579a;
}
.arrowNav a:hover span {
	border-color: #3b579a;
}
.arrowNav.arrowLeft:hover {
	left: 22px;
}
.arrowNav.arrowRight:hover {
	right: 22px;
}
#toTop {
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 44px;
	height: 44px;
	background: rgba(83, 100, 125, 0.7);
	z-index: 99;
	border-radius: 6px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	visibility: hidden;
	-webkit-filter: opacity(0%);
	filter: opacity(0%);
}
#toTop.show {
	visibility: visible;
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
}
#toTop:hover {
	background: rgba(83, 100, 125, 0.9);
}
#toTop:before {
	content: '';
	width: 12px;
	height: 12px;
	border-width: 6px 6px 0 0;
	border-style: solid;
	border-color: #fff;
	display: inline-block;
	border-radius: 3px;
	margin: 6px 0 0 0;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/* FOOTER */
footer {
	width: 100%;
	float: left;
	margin: 25px 0 -50px 0;
	color: #5a6267;
	font-size: 15px;
}
footer .bansFooter {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	padding: 0 0 25px 0;
}
footer .bansFooter > div {
	padding: 25px;
}
footer .bansFooter img {
	vertical-align: top;
}
footer .top {
	border-top: 5px solid #1e2c3a;
	background: url(img/footer.jpg);
	text-align: center;
}
footer .top img {
	max-height: 104px;
	vertical-align: top;
	margin: 50px 0;
}
footer .middle {
	background: #f5d124;
	box-shadow: inset 0 0 10px -2px rgba(0,0,0,0.9);
}
footer .middle .social {
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	list-style: none;
}
footer .middle .social a,
footer .middle .social div {
	display: inline-block;
	padding: 20px 24px;
	color: #1e2c3a;
	font-size: 28px;
}
footer .middle .social a:hover {
	color: #aa3609
}
footer .bottom {
	background: #1e2c3a;
	text-align: center;
	padding: 20px;
	font-size: 13px;
	font-weight: 700;
	line-height: 140%;
	color: #517293;
}
footer .bottom strong {
	color: #7e9bb9;
}
footer .bottom .alan {
	width: 75px;
	height: 15px;
	font-size: 0;
	text-indent: -9999px;
	background: url(img/alan.png);
	display: inline-block;
	position: absolute;
	right: 0;
	top: 52%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-filter: opacity(40%);
	filter: opacity(40%);
}
footer .bottom .alan:hover {
	-webkit-filter: opacity(80%);
	filter: opacity(80%);
}

/* SINGLE */
#commentbox {
	width: 100%;
	background: #fff;
	margin: 0 0 20px 0;
	padding: 0;
	display: inline-block;
	position: relative;
	z-index: 5;
}
#commentbox .title {
	border-top: 2px solid #eee;
	border-bottom: 5px solid #3b579a;
  width: 100%;
  margin: 0 0 6px 0;
  position: relative;
}
#commentbox .title h2 {
	font-size: 18px;
	font-weight: 700;
	color: #3b579a;
	display: inline-block;
	width: 100%;
	height: 100%;
  padding: 14px 20px 16px 20px;
}
#commentbox .content {
	padding: 15px 20px;
	margin: 0;
	width: 100%;
}

/* RELATED */
#related {
	width: 100%;
	margin: 0 0 10px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
#related .post {
	padding: 0;
	width: 32%;
	height: auto;
	vertical-align: top;
	overflow: hidden;
	background: #fff;
	border-bottom: 2px solid #dedede;
	margin: 0 0 15px 0;
}
#related .post:nth-child(3n+3) {
	margin-right: 0;
}
#related .post .thumb {
	width: 100%;
	height: auto;
	position: relative;
	padding-top: 65%;
}
#related .post .thumb .img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
#related .post .title {
	border-top-width: 3px;
	font-size: 15px;
	margin: 0;
	padding: 0;
	border: 0;
	line-height: 140%;
	font-style: normal;
	width: 100%;
	height: auto;
}
#related .post .title a {
	padding: 8px 12px 10px 12px;
	min-height: 84px;
	display: inline-block;
	vertical-align: top;
}
#related .post .title a span {
	font-size: 15px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-height: 20px;
	max-height: 60px;
}

.partners {
	font-size: 0;
}
.partners img {
	margin: 0;
	display: inline-block;
	width: 25%;
}
.partners:hover img:hover {
	-webkit-animation-name: buzz;
	animation-name: buzz;
	-webkit-animation-duration: 0.15s;
	animation-duration: 0.15s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
}

@-webkit-keyframes buzz-out{10%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}20%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}50%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}60%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}80%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}@keyframes buzz-out{10%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}20%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}30%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg)}40%{-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg)}50%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}60%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}70%{-webkit-transform:translateX(2px) rotate(1deg);transform:translateX(2px) rotate(1deg)}80%{-webkit-transform:translateX(-2px) rotate(-1deg);transform:translateX(-2px) rotate(-1deg)}90%{-webkit-transform:translateX(1px) rotate(0);transform:translateX(1px) rotate(0)}100%{-webkit-transform:translateX(-1px) rotate(0);transform:translateX(-1px) rotate(0)}}


@-webkit-keyframes buzz {
  50% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  100% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
}
@keyframes buzz {
  50% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  100% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
}