@charset "UTF-8";
/* outer pulsating effect*/
@-webkit-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@-moz-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@-ms-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}

@-webkit-keyframes pulsate {
    0% {
        -webkit-transform: scale(0.9, 0.9);
        opacity: 3.0;
    }    
    
	10% {
        -webkit-transform: scale(1, 1);
        opacity: 1.0;
	}
	90% {
        -webkit-transform: scale(1, 1);
        opacity: 1.0;
	}
	100% {
        -webkit-transform: scale(0.9, 0.9);
        opacity: 3.0;
    }
}
@-moz-keyframes pulsate {
    0% {
        transform: scale(0.9, 0.9);
        opacity: 0.3;
    }    
    10% {
        transform: scale(1, 1);
        opacity: 1.0;
    }
	90% {
        transform: scale(1, 1);
        opacity: 1.0;
    }    
    100% {
        transform: scale(0.9, 0.9);
        opacity: 0.3;
    }
}
@-ms-keyframes pulsate {
    0% {
        -ms-transform: scale(0.9, 0.9);
        opacity: 0.3;
    }    
    10% {
        -ms-transform: scale(1, 1);
        opacity: 1.0;
    }
	90% {
        -ms-transform: scale(1, 1);
        opacity: 1.0;
    }	    
    100% {
        -ms-transform: scale(0.9, 0.9);
        opacity: 0.3;
    }
}
@-o-keyframes pulsate {
    0% {
        transform: scale(0.9, 0.9);
        opacity: 0.3;
    }
	10% {
        transform: scale(1, 1);
        opacity: 1.0;
    }    

	90% {
        transform: scale(1, 1);
        opacity: 1.0;
    }    
    100% {
        transform: scale(0.9, 0.9);
        opacity: 0.3;
    }
}

@keyframes pulsate {
    0% {
        transform: scale(0.9, 0.9);
        opacity: 0.3;
    }
	10% {
        transform: scale(1, 1);
        opacity: 1.0;
    }    

	90% {
        transform: scale(1, 1);
        opacity: 1.0;
    }    
    100% {
        transform: scale(0.9, 0.9);
        opacity: 0.3;
    }
}

/* For demo purposes */
#profileicon, #biomenuinner {
-webkit-animation:pulsate 5s infinite;
    -moz-animation:pulsate 5s infinite;
    -o-animation:pulsate 5s infinite;
	-ms-animation: pulsate 5s infinite;
    animation:pulsate 5s infinite;
}

#profileicon:hover, #profileicon:focus {
box-shadow: 0 0 0 0 rgba(232, 76, 61, 0.7);
background-color: #e84c3d;
 /*this animation takes over with hover. Stops the scaled pulse*/ 
  -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}

#language:hover, #language:focus, #biolanguage:hover, #biolanguage:focus {
box-shadow: 0 0 2px #000000;
background-color:#999;
 /*this animation takes over with hover. Stops the scaled pulse*/ 
 /* -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);*/
}

/* create a circle for animation and shadow purposes */
.example  {width:100px; height:100px;
    margin: 0 auto;
    background:black;
    border-radius:50%;}