.menu-open-button {

  background: #fff;
  border: 1px solid #aaa;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  height: 28px;
  position: absolute;
  color: #fff;
  text-align: center;
  }

.ph-menu-item {

  background: #fff;
  border: 1px solid #aaa;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  height: 18px;
  font-size: 20px;
  text-decoration: none;
  position: absolute;
  color: #fff;
  text-align: center;
}

.ph-menu-item img {margin-right: 7px; height:25px;}

.menu-open {
  display: none; }
  
.ph-menu-item div {    
  position: relative;
  top: -7px;}  

.ph-menu-item {
 display: none;
  padding: 16px;
  left: -170px;
  height: 45px;
  top: 1px; }

.menu-social {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 64px;
  height: 64px;
  font-size: 26px;
  z-index: 999999; }
  
@media screen and (max-width: 1200px) {
    .menu-social {bottom: 30px; right: 20px;} }
    
.menu-open-button {
  z-index: 2;
  width: 64px;
  height: 64px;
  cursor: pointer;
  background: #F90000;
  -webkit-box-shadow: 0px 14px 24px rgba(0, 0, 0, 0.35);
  box-shadow: 0px 14px 24px rgba(0, 0, 0, 0.35);
  border: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

.menu-open-button:hover {
  -webkit-transform: scale(1.2, 1.2) translate3d(0, 0, 0);
  transform: scale(1.2, 1.2) translate3d(0, 0, 0); }



.menu-open:checked + .menu-open-button {
  width: 64px;
  height: 64px;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

  
.menu-open-button:before {
    font-size: 14px; 
	vertical-align: center;}


.menu-open:checked ~ .ph-menu-item {
	display: block;
	  -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.35);
  box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.35);
  opacity: 1;}


@keyframes fadeInFromNone {
  0% {display: none; opacity: 0;}
  1% {display: block; opacity: 0;}
  100% {display: block; opacity: 1;  }
}

.menu-open:checked ~ .ph-menu-item:nth-child(3) {
    -webkit-transform: translate3d(0.08361px, 0px, 0);
    transform: translate3d(0.08361px, 0px, 0); 
	animation: fadeInFromNone 0.2s;}

.menu-open:checked ~ .ph-menu-item:nth-child(4) {
    -webkit-transform: translate3d(0.08361px, -60px, 0);
    transform: translate3d(0.08361px, -60px, 0); 
	animation: fadeInFromNone 0.4s;}

  .menu-open:checked ~ .ph-menu-item:nth-child(5) {
    -webkit-transform: translate3d(0.08361px, -120px, 0);
    transform: translate3d(0.08361px, -120px, 0); 
	animation: fadeInFromNone 0.6s;}


  .menu-open:checked ~ .ph-menu-item:nth-child(6) {
    -webkit-transform: translate3d(0.08361px, -240px, 0);
    transform: translate3d(0.08361px, -240px, 0); 
	animation: fadeInFromNone 0.8s;}

	  
.menu-open:checked ~ .ph-menu-item:nth-child(7) {
    -webkit-transform: translate3d(0.08361px, -300px, 0);
    transform: translate3d(0.08361px, -300px, 0); 
	animation: fadeInFromNone 1s;}

.menu-social a:nth-child(3) {
			background-color: #0078FF;
			border-color: #0078FF;
    }
.menu-social a:nth-child(3) i {			
			color: #fff;
    }
.menu-social a:nth-child(4) {
			background-color: #31b56f;
			border-color: #31b56f;
    }
.menu-social a:nth-child(4) i {			
			color: #fff;
    }
.menu-social a:nth-child(5) {
				background-color: #675da9;
			border-color: #675da9;

    }
.menu-social a:nth-child(5) i {			
			color: #fff;
    }
.menu-social a:nth-child(6) {
			background-color: #31b56f;
			border-color: #31b56f;
    }
.menu-social a:nth-child(6) i {			
			color: #fff;
    }
.menu-social a:nth-child(7) {
			background-color: #31b56f;
			border-color: #31b56f;
    }
.menu-social a:nth-child(7) i {			
			color: #fff;
    }


.call-animate {
  animation: wiggle 3.5s infinite;
}
@keyframes wiggle {
    0% { transform: rotate(0deg) scale(1); }
   50% { transform: rotate(0deg) scale(1); }
   55% { transform: rotate(25deg) scale(1.1); }
   60% { transform: rotate(30deg) scale(1.1); }
   65% { transform: rotate(20deg) scale(1.1); }
   70% { transform: rotate(30deg) scale(1.1); }
   75% { transform: rotate(20deg) scale(1.1); }
   80% { transform: rotate(-20deg) scale(0.9); }
  100% { transform: rotate(0deg) scale(1); }
}

.call-animate:hover {
  animation: none;
}

.menu-social a:hover {
color: #fff !important;
	
}