#connect_with_sns {
    text-align: center;
    margin: 0px 0px 0px 0
}
.social-icons-list {
    list-style-type: none
}
.social-icons-list li {
    margin: 0 40px 25px 40px;
    display: inline-block
}
@media (max-width: 667px) {
    .social-icons-list li {
        margin: 0 25px 25px 25px
    }
}
.social-icons-list a {
    text-decoration: none !important;
    display: inline-block;
    background-image: url(social-icons.png);
    background-repeat: no-repeat;
    width: 75px;
    height: 75px
}
.social-icons-color-email {
    background-position: 0 -675px;
}
.social-icons-color-facebook {
    background-position: -75px -600px;
}
.social-icons-color-goodreads {
    background-position: -150px -525px;
}
.social-icons-color-google_plus {
    background-position: -225px -450px;
}
.social-icons-color-instagram {
    background-position: -300px -375px;
}
.social-icons-color-pinterest {
    background-position: -375px -300px;
}
.social-icons-color-soundcloud {
    background-position: -450px -225px;
}
.social-icons-color-tumblr {
    background-position: -525px -150px;
}
.social-icons-color-twitter {
  background-position: -600px -75px;
}
.social-icons-color-youtube {
  background-position: -675px 0;
}

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

@-moz-keyframes shake{ 
0% { -moz-transform: translate(2px, 1px) rotate(0deg); } 
10% { -moz-transform: translate(-1px, -2px) rotate(-1deg); } 
20% { -moz-transform: translate(-3px, 0px) rotate(1deg); } 
30% { -moz-transform: translate(0px, 2px) rotate(0deg); } 
40% { -moz-transform: translate(1px, -1px) rotate(1deg); } 
50% { -moz-transform: translate(-1px, 2px) rotate(-1deg); } 
60% { -moz-transform: translate(-3px, 1px) rotate(0deg); } 
70% { -moz-transform: translate(2px, 1px) rotate(-1deg); } 
80% { -moz-transform: translate(-1px, -1px) rotate(1deg); } 
90% { -moz-transform: translate(2px, 2px) rotate(0deg); } 
100% { -moz-transform: translate(1px, -2px) rotate(-1deg); } 
} 

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

.shake{ 
display:inline-block; 
} 

.shake:hover, 
.shake:focus{ 
animation-name: shake; 
animation-duration: 0.8s; 
transform-origin:50% 50%; 
animation-iteration-count: infinite; 
animation-timing-function: linear; 

-moz-animation-name: shake; 
-moz-animation-duration: 0.8s; 
-moz-transform-origin:50% 50%; 
-moz-animation-iteration-count: infinite; 
-moz-animation-timing-function: linear; 

-webkit-animation-name: shake; 
-webkit-animation-duration: 0.8s; 
-webkit-transform-origin:50% 50%; 
-webkit-animation-iteration-count: infinite; 
-webkit-animation-timing-function: linear; 
}