.pulsingCircleRightBottom {
display: none;
}
@media (min-width: 768px) {
    .pulsingCircleRightBottom {
        animation: pulse 20s infinite;
    display: block;
    height: 200px;
    width: 200px;
    margin-left: 250px;
    margin-top: -75px;
    }
}
.pulsingCircleLeftBottom {
 display: none;
}
@media (min-width: 768px) {
    .pulsingCircleLeftBottom {
        animation: pulse 20s infinite;
    display: block;
    height: 200px;
    width: 200px;
    margin-left: -20px;
    margin-top: -125px;
    } 
}
.pulsingCircleLeftTop {
display: none;
}
@media (min-width: 768px) {
    .pulsingCircleLeftTop {
        animation: pulse 20s infinite;
    display: block;
    height: 200px;
    width: 200px;
    margin-left: -35px;
    margin-top: -475px;
    }
}
.pulsingCircleRightTop {
 display: none;
}
@media (min-width: 768px) {
    .pulsingCircleRightTop {
        animation: pulse 20s infinite;
    display: block;
    height: 200px;
    width: 200px;
    margin-left: 255px;
    margin-top: -395px;
    }
}
@keyframes pulse {
    0% {
        background-color: #efefef;
    }
    50% {
      background-color: #9E0B0F;
    }
    100% {
        background-color: #efefef;
    }
  }


/* slide in animation styling */
.bio {
    height: inherit;
}

@media (min-width:768px) {
    .bio {
        min-height: 100vh;
		margin-bottom:75px;
		margin-top:75px;
    }
}




@media (min-width: 768px) {
    .slideanim {
        visibility: hidden;
        visibility: visible\9;
        /*For old IE browsers IE6-8 */
    }
}

@media (min-width: 768px) {
    .slideanim.slide {
        visibility: visible;
        animation: slide 3s;
    }  
}

@media (min-width: 768px) {
    .slideanim::after {
        /* useful when its child elements are float:left; */
        content: "";
        display: table;
        clear: both;
    } 
}
@keyframes slide {
    0% {
        opacity: 0;
        transform: translateX(50%);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}