body {
font-family: 'Open Sans', sans-serif;
}
h1 {
font-family: 'DM Sans', sans-serif;
color: #2a3471;
}
h3 {
font-family: 'Bitter', serif;	
color: #551f39;
}
.linksection {
	margin-top: 20px;
	margin-bottom: 20px;
}

/* above tablet*/
@media (min-width: 992px) {
.biosection {
	padding: 0 0 0 50px;
}
img.profileimg {
	max-width: 300px;
}
.animated {
 -webkit-animation-duration: 2s;
 animation-duration: 2s;
 -webkit-animation-fill-mode: both;
 animation-fill-mode: both;
}
@-webkit-keyframes fadeInLeft {
 0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
 }
 100% {
    opacity: 1;
    -webkit-transform: translateX(0);
 }
}

@keyframes fadeInLeft {
 0% {
    opacity: 0;
    transform: translateX(-20px);
 }
 100% {
    opacity: 1;
    transform: translateX(0);
 }
}

.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInRight {
 0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
 }
 100% {
    opacity: 1;
    -webkit-transform: translateX(0);
 }
}

@keyframes fadeInRight {
 0% {
    opacity: 0;
    transform: translateX(20px);
 }
 100% {
    opacity: 1;
    transform: translateX(0);
 }
}

.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
} 
}

/* tablet and mobile */
@media (max-width: 1199px) {
img.profileimg {
	max-width: 250px;
}
}

@media (max-width: 991px) {
.vh-100 {
    height: auto!important;
}
img.profileimg {
    margin-top: 50px;
	margin-bottom: 50px;
}

body {
    animation: fadeInAnimation ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
  
@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
     }
}
}

/* mobile */

@media (max-width: 767px) {
.biosection {
	padding: 0 20px;
}
img.profileimg {
	max-width: 200px;
}
h1 {
    font-size: 1.9rem;
}
.h3, h3 {
    font-size: 1.3rem;
}
p {
	font-size: 0.9rem;
}
.linksection {
    margin-bottom: 50px;
}
}