/* Social icons */
/*.social-icons{
  z-index: 100;
  position: relative;
}*/

footer .social-icons{
  width: 100%;
  padding-top: 25px;
  padding-bottom: 25px;
  text-align: center;
  background-color: #222;
}

.social-icons a,
.social-icons a:focus,
.social-icons a:hover {
  /*color: #fff;*/
  color: white;
  text-decoration: none;
  transition: .5s;
}

.social-icons .fa {
  -webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.social-icons .fa:hover {
  -webkit-transform: scale(1.3);
	transform: scale(1.3);
}

.social-icons > span{
  margin-left: 25px;
  margin-right: 25px;
}

.fa-facebook-square:hover{
  color: #4267b2;
}

.fa-youtube-play:hover{
  color: #f00;
}

.fa-twitter:hover{
  color: #1da1f2;
}

.fa-imdb:hover{
  color: #f4e070;
}

.fa-instagram:hover{
background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);

 /* background: #f09433; 
background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
  */-webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.animate.pop.fa-facebook-square {
  animation-duration: 0.9s;
  animation-name: animate-pop-facebook;
  animation-timing-function: cubic-bezier(.26, .53, .74, 1.48);
}

.animate.pop.fa-youtube-play {
  animation-duration: 0.9s;
  animation-name: animate-pop-youtube;
  animation-timing-function: cubic-bezier(.26, .53, .74, 1.48);
}

.animate.pop.fa-twitter {
  animation-duration: 0.9s;
  animation-name: animate-pop-twitter;
  animation-timing-function: cubic-bezier(.26, .53, .74, 1.48);
}

.animate.pop.fa-imdb {
  animation-duration: 0.9s;
  animation-name: animate-pop-imdb;
  animation-timing-function: cubic-bezier(.26, .53, .74, 1.48);
}

.animate.pop.fa-instagram {
  animation-duration: 0.9s;
  animation-name: animate-pop-instagram;
  animation-timing-function: cubic-bezier(.26, .53, .74, 1.48);
}

@keyframes animate-pop-facebook {
  0% {
    opacity: 0;
    transform: scale(2, 2);
    color: #4267b2;
  }

  75% {
    color: #4267b2;
  }

  100% {
    opacity: 1;
    transform: scale(1, 1);
    color: #fff;
  }
}

@keyframes animate-pop-youtube {
  0% {
    opacity: 0;
    transform: scale(2, 2);
    color: #f00;
  }

  75% {
    color: #f00;
  }

  100% {
    opacity: 1;
    transform: scale(1, 1);
    color: #fff;
  }
}

@keyframes animate-pop-twitter {
  0% {
    opacity: 0;
    transform: scale(2, 2);
    color: #1da1f2;
  }

  75% {
    color: #1da1f2;
  }

  100% {
    opacity: 1;
    transform: scale(1, 1);
    color: #fff;
  }
}


@keyframes animate-pop-imdb {
  0% {
    opacity: 0;
    transform: scale(2, 2);
    color: #f4e070;
  }

  75% {
    color: #f4e070;
  }

  100% {
    opacity: 1;
    transform: scale(1, 1);
    color: #fff;
  }
}


@keyframes animate-pop-instagram {
  0% {
    opacity: 0;
    transform: scale(2, 2);
    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  75% {
    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  100% {
    opacity: 1;
    transform: scale(1, 1);
    color: #fff;
    background: #fff;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}

  @media only screen and (max-width: 600px) {  
    .social-icons{
      font-size: smaller;
    }
  
    .social-icons > span {
      padding-left: 3vw;
      padding-right: 3vw;
    }
  }

  @media only screen and (max-width: 450px) {    
    .social-icons > span {
      padding-left: 0vw;
      padding-right: 0vw;
    }
  }