.avatar img {

    width: 12rem;

    border-radius: 50%;

    padding: 0 1.5rem;

}


.bg-white {

    background-color: white;

}



/* @override*/

body {

    font-size: 16px;

}



.body {

    height: unset;

}



.btn {

    -webkit-border-radius: 10;

    -moz-border-radius: 10;

    border-radius: 10px;

    font-family: Arial;

    color: #ffffff;

    font-size: 20px;

    background: #2abdb1;

    padding: 20px 30px;

    text-decoration: none;

}



.btn:hover {

    background: #25a89d;

    text-decoration: none;

}



.ch {

    font-family: 'Ma Shan Zheng', sans-serif;

    font-size: 55px;

    font-weight: 400;

    line-height: normal;

}



.col {

    -ms-flex-preferred-size: 0;

    flex-basis: 0;

    -ms-flex-positive: 1;

    flex-grow: 1;

    max-width: 100%;

}



.contact {

    align-items: center;

    justify-content: center;

}



.container.w-container {

    width: 100%;

    max-width: unset;

    display: block;

    padding-right: 15px;

    padding-left: 15px;

    margin-right: auto;

    margin-left: auto;

    text-align: center;

    top: 0;

    font-size: 16px;

    line-height: normal;

    position: relative;

}



.footer {

    position: relative;

    padding: 20px;

    -webkit-box-align: start;

    -webkit-align-items: flex-start;

    -ms-flex-align: start;

    align-items: flex-start;

    text-align: center;

    top: 0;

}



.frank-cover {

    display: block;

    width: 180px;

    padding-right: 1rem;

    padding-bottom: 0;

    margin: auto auto 1px auto;

    float: left;

}



.h-100 {

    height: 100% !important;

}



.h-letter {

    width: auto;

    height: 500px !important;

}



.joey-ng-magazine-cover {

    display: block;

    width: 180px;

    padding-right: 1rem;

    padding-bottom: 0;

    margin: auto;

    float: left;

}



.logo-wrapper {

    border: 1px white solid;

    border-radius: 10px;

    margin: 10px;

    padding: 10px;

}



.m-auto {

    margin: auto;

}



.m-3 {

    margin: 1rem !important;

}



.member-logo {

    width: 110px;

    height: 110px;

}



.member-logo.wide {

    width: auto;

}



.overlay {

    position: relative;

    display: block;

    min-height: 550px;

    padding: 100px 10px;

}



.overlay-1 {

    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.6))), url('../images/bird-s-eye-view-photography-of-high-rise-buildings-2382868.jpg');

    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../images/bird-s-eye-view-photography-of-high-rise-buildings-2382868.jpg');

    background-position: 0px 0px, 50% 50%;

    background-size: auto, cover;

    color: #fff;

}



.overlay-2 {

    background-color: rgb(121, 121, 121);

    color: #fff;

}



.overlay-3 {

    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.6))), url('../images/architecture-bridge-clouds-coast-414462.jpg');

    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../images/architecture-bridge-clouds-coast-414462.jpg');

    background-position: 0px 0px, 50% 50%;

    background-size: auto, cover;

    color: #fff;

}



.overlay-4 {

    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.6))), url('../images/mike-benna-WHHY-iBp3aI-unsplash.jpg');

    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../images/mike-benna-WHHY-iBp3aI-unsplash.jpg');

    background-position: 0px 0px, 50% 50%;

    background-size: auto, cover;

    color: #fff;

}



.overlay-5 {

    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.6))), url('../images/team-cheer.jpg');

    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../images/team-cheer.jpg');

    background-position: center;

    background-size: auto, cover;

    color: #fff;

    background-attachment: fixed;

}



.overlay-6 {

    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.6))), url('../images/bird-s-eye-view-photography-of-high-rise-buildings-2382868.jpg');

    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../images/bird-s-eye-view-photography-of-high-rise-buildings-2382868.jpg');

    background-position: center;

    background-size: auto, cover;

    color: #fff;

}



.overlay-7 {

    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.6))), url('../images/architecture-bridge-clouds-coast-414462.jpg');

    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../images/architecture-bridge-clouds-coast-414462.jpg');

    background-position: center;

    background-size: auto, cover;

    color: #fff;

}



/* @override*/

p {

    font-size: 16px;

    margin-bottom: 10px;

}



.p-3 {

    padding: 1rem !important;

}



.pdf-link:link {

    color: #2abdb1;

    letter-spacing: 1px;

    font-weight: 600;

}



.pdf-link:visited {

    color: #9a4cbe;

}



.pt-5 {

    padding-top: 3rem!important;

}



.p-5 {

    padding: 3rem !important;

}



#photos img {

    width: 100%;

    height: 100%;

    padding: 5px;

}



.px-3 {

    padding: 0 1rem !important;

}



.px-5 {

    padding: 0 3rem !important;

}



.py-2 {

    padding: 0.5rem 0 !important;

}



.py-3 {

    padding: 1rem 0 !important;

}



.py-5 {

    padding: 3rem 0 !important;

}



/* @override */

.project-info-3 {

    width: 100%;

    height: 300px;

    overflow-y: auto;

}



/* @override */

.project-wrapper-3 {

    width: 100%;

    height: 100%;

}



/* @override */

.project-wrapper-3 img {

    width: 100%;

    height: 180px;

}



.row {

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    margin-right: -15px;

    margin-left: -15px;

    justify-content: center;

}




.styled-list {

    line-height: 2rem;

    text-align: left;

    max-width: 700px;

}



.text-break {

    word-break: break-word !important;

    overflow-wrap: break-word !important;

}



.text-center {

    text-align: center !important;

}



.text-left {

    text-align: left !important;

}



.text-right {

    text-align: right !important;

}



.w-100 {

    width: 100% !important;

}



.w-auto {

    width: auto !important;

}



@media screen and (max-width: 991px) {

    

}



@media screen and (max-width: 767px) {

    .avatar img {

        width: 10rem;

        padding: 0 0.5rem;

    }

    

    .p-small-0 {

        padding-left: 0 !important;

        padding-right: 0 !important;

    }

}



@media screen and (max-width: 479px) {

    .avatar img {

        width: 100%;

        padding: 0;

    }

}