﻿/*.icon-button {
	background-color: ;
	border-radius: 3.6rem;
	cursor: pointer;
	display: inline-block;
	font-size: 2.0rem;
	height: 3.6rem;
	line-height: 3.6rem;
	margin: 0 5px;
	position: relative;
	text-align: center;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	width: 3.6rem;
}


.icon-button span {
	border-radius: 0;
	display: block;
	height: 0;
	left: 50%;
	margin: 0;
	position: absolute;
	top: 50%;
	-webkit-transition: all 0.3s;
	   -moz-transition: all 0.3s;
	     -o-transition: all 0.3s;
	        transition: all 0.3s;
	width: 0;
}
.icon-button:hover span {
	width: 3.6rem;
	height: 3.6rem;
	border-radius: 3.6rem;
	margin: -1.8rem;
}





.skype span {
	background-color: #4099ff;
}






    
.icon-button i {
	background: none;
	color: white;
	height: 3.6rem;
	left: 0;
	line-height: 3.6rem;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s;
	   -moz-transition: all 0.3s;
	     -o-transition: all 0.3s;
	        transition: all 0.3s;
	width: 3.6rem;
	z-index: 10;
}






.icon-button i .fa .fa-skype {
	color: #4099ff;
}



.icon-button:hover .fa .fa-skype {
	color: white;
}

*/


.icon-button {
	    background-color: White;
border-radius: 4.6rem;
    cursor: pointer;
    display: inline-block;
    font-size: 1.2rem;
    height: 1.6rem;
    line-height: 1.6rem;
    margin: 0px 5px;
    position: relative;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 1.6rem;
}

/* Circle */
.icon-button span {
	border-radius: 0;
	display: block;
	height: 0;
	left: 50%;
	margin: 0;
	position: absolute;
	top: 50%;
	-webkit-transition: all 0.3s;
	   -moz-transition: all 0.3s;
	     -o-transition: all 0.3s;
	        transition: all 0.3s;
	width: 0;
}
.icon-button:hover span {
    width: 2rem;
    height: 2rem;
    border-radius: 2.6rem;
    margin: -1rem;
}






.skype span {
	background-color: #4099ff;
}





/* Icons */
    
.icon-button i {
    background: none;
    height: 2.6rem;
    left: 0;
    line-height: 1.6rem;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    width: 1.6rem;
    z-index: 10;
}




/*all changs well be her*/


    /*background when hover */
    .skype span ,.Skype span {
    background-color: #12A5F4;
    }
    .facebook span , .Facebook span {
    background-color: #3b5998;
    }
    .twitter  span , .Twitter  span {
    background-color: #55acee;
    }
    .google-plus  span ,.Google  span {
    background-color: #dd4b39;
    }
    .youtube-play  span ,.Youtube-play  span {
    background-color: #bb0000;
    }
    .youtube  span ,.Youtube  span {
    background-color: #bb0000;
    }
    .linkedin  span ,.Linkedin  span{
    background-color: #007bb5;
    }
    .instagram  span ,.Instagram  span{
    background-color: #125688;
    }
    .whatsapp  span ,.Whatsapp  span{
    background-color: #25d366;
    }
    /*end background when hover*/
    
    

    /* icon color  */
    
    .icon-button  .fa-skype {
    color: #12A5F4;
    }
    .icon-button  .fa-facebook  {
    color: #3b5998;
    }
    .icon-button  .fa-twitter  {
    color: #55acee;
    }
    .icon-button  .fa-google-plus  {
    color: #dd4b39;
    }
     .icon-button  .fa-youtube-play  {
    color: #bb0000;
    }
     .icon-button  .fa-linkedin  {
    color: #007bb5;
    }
     .icon-button  .fa-instagram  {
    color: #125688;
    }  
     .icon-button  .fa-whatsapp  {
    color: #25d366;
    }   
    /* end icon color  */

    /* icon color when hover  */
    
    
    .icon-button:hover .fa-skype
    ,.icon-button:hover .fa-facebook
    ,.icon-button:hover .fa-twitter
     ,.icon-button:hover .fa-google-plus
     ,.icon-button:hover .fa-youtube-play
      ,.icon-button:hover .fa-linkedin 
      ,.icon-button:hover .fa-instagram
      ,.icon-button:hover .fa-whatsapp{
    color: white;
    }

    /* end icon color when hover  */
    
    
/*========================*/