*{
    margin:0;
    padding:0;
    box-sizing: border-box;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
#page-title{
    text-align: center;
    position: absolute;
    top:30%;
    left:44%;
    color:white;
    text-transform: uppercase;
}
.desc h2,p{
    text-align: center;
}
.desc p{
    padding:5px;
    color:rgb(87, 78, 78);
    font-weight: 500;
}
.about-content{
    margin:10px;
    position:relative;
}
.about-content > div{
    margin:0;
    padding: 0;
}
.content-left{
    display:flex;
    align-items: center;
}
.content-right{
    display:flex;
    align-items: center;
}
.content-left img, .content-left .text-content{
    flex:1;
}
.content-left img{

    border-radius: 100% 0 0 100%;
    border: 20px solid rgb(16, 60, 85);
    border-right: 0;
    padding:10px;
}
.content-right img{
    border-radius: 0 100% 100% 0;
    border: 20px solid rgb(16, 60, 85);
    border-left: 0;
    padding:10px;
}
.about-content > .content-overlap:first-of-type .content-left{
    position: relative;
    top:40px;
}
.content-overlap .content-right{
     position:relative;
     top:20px;
}
.about-content > .content-overlap:nth-of-type(3) .content-left{
    position: relative;
    bottom:0;
}
@media screen and (max-width:820px){
*{
    margin:0;
    padding:0;
    box-sizing: border-box;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.content-left{
    display:flex;
    align-items: center;
    position:relative;
}
.content-right{
    display:flex;
    align-items: center;
}
.content-left img, .content-left .text-content{
    flex: 1;
    min-width: 0;
}
.content-right img, .content-right .text-content{
    flex:1;
    min-width: 0;
}
.content-overlap h1{
    font-size: larger;
}
.content-overlap p{
    font-size: 14px;
}
#page-title{
    top:10%;
    left:42%;
    font-size: 25px;
}
}
@media screen and (max-width:425px){
    #page-title{
    top:10%;
    left:41%;
    font-size: medium;
}
.content-overlap p{
    font-size: 10px;
}
.content-overlap h1{
    font-size: small;
}
}