*{
    margin: 0;
    padding: 0;
    font-family: 'Trebuchet MS', sans-serif;
    box-sizing: border-box;
}

body{
    background: #FFFFFF;
    color: #272626;
}

#header{
    width: 100%;
    height: 100vh;
    background-image: url(images/head.png);
    background-position: center;
}

#mobile-header{
    display: none;
}

main {
    display: flex;
    flex-direction: column;
}

.container{
    padding: 30px 20%; 
}

.desktop-container{
    padding: 30px 20%; 
}

.mobile-container{
    display: none;
}

nav{
    display: flex;
    display: block;
    align-items: right;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-left: 13.5%;
    list-style: none;
}

nav ul li{
    display: flex;
    display: block;
    align-items: right;
    justify-content: space-between;
    flex-wrap: wrap;
}


nav ul li a{
    display: flex;
    display: block;
    float: left;
    padding: 1px;
    list-style: none;
    margin: 1px 4%;
    color: #272626;
    text-decoration: none;
    font-family: 'Trebuchet MS', sans-serif;
    font-size: 20px;
    position: relative;
}

nav ul li a::after{
    content: '';
    width: 100%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    left: 0;
    bottom: -6px;

}

nav ul li a:hover::after{
    width: 100%;
    background: #FFFFFF;
}

.name-text{
    margin-top: 30%;
    font-size: 100px;
}

/*
.name-text::after{
    content: 'Shilpa Rao';
    left: 20%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}
*/
/*
hr{
    width: 56%;
    height: 5px;
    background: #0882C6;
    border-width: 0px;

}
*/


.sub-name-text h1{
    font-size: 30px;
    margin-top: 70px;
    color: #0a76b0;
}

/*--------------ABOUT---------------*/

#about{
    padding: 40px 0;
    color: #3d3d3d;
}

#about-mobile{
    display: none;
}

.row{
    display: flex;
    float: left;
    justify-content: space-between;
    flex-wrap: wrap;
}

.about-col-1{
    flex-basis: 35%;
}

.about-col-1 img{
    width: 100%;
    border-radius: 15px;
}

.about-col-2{
    flex-basis: 60%;
}

.about-me{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    align-items: left;
}

/*
.about-me::after{
    content: '';
    left: 44%;
    width: 13.4%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 58px;
}
*/

.about-me::after{
    content: 'About Me';
    left: 44%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.abt-col-2 p{
    font-size: 18px;
    color: #3d3d3d;
    align-items: left;
}

.row-2{
    display: flex;
    float: left;
    justify-content: space-between;
    flex-wrap: wrap;
}

.interests-col-1{
    flex-basis: 60%;
}


.about-tabs{
    display: flex;
    display: block;
    list-style: none;
    float: left;
    margin: 20px 0 40px;
}

.tab-links{
    margin-right: 50px;
    font-size: 20px;
    font-weight: 500;
    display: flex;
    display: block;
    list-style: none;
    float: left;
    cursor: pointer;
    position: relative;
    color: #272626;
}

.tab-links::after{
    content: '';
    width: 0;
    height: 3px;
    background: #0882C6;
    position: absolute;
    left: 0;
    bottom: -8px;
    transition: 0.5s;
}

.tab-links.active-link::after{
    width: 100%;
}

/*
.tab-links:hover::after{
    width: 100%;
    background: #FFFFFF;
}
*/

/*
.tab-links::selection::after{
    width: 100%;
    background: #FFFFFF;
}
*/

.tab-contents p{
    font-size: 16px;
    color: #3d3d3d;
    align-items: left;
    margin-left: 0;
    margin-top: 1px;
    margin-right: 0;
}

.tab-contents{
    display: none;

}

.tab-contents.active-tab{
    display: block;
}

.interests-col-2{
    flex-basis: 35%;
}

.interests-col-2 img{
    /*width: 100%;*/
    border-radius: 15px;
    align-items: right;
    margin-left: 5%;
    width: 80%;
    margin-top: 0;
}

/*--------------EXPERIENCE--------------*/

.row-3{
    display: flex;
    float: left;
    justify-content: space-between;
    flex-wrap: wrap;
}

.experience-col-1{
    flex-basis: 20%;
}

.experience-col-1 img{
    width: 100%;
}

.experience-col-2{
    flex-basis: 75%;
    padding-left: 10px;
}

.experience{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    align-items: left;
}

/*
.experience::after{
    content: '';
    left: 35.1%;
    width: 16%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.experience::after{
    content: 'Experience';
    left: 33%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.experience-col-2 h2{
    font-size: 20px;
    font-weight: 500;
    color: #3d3d3d;
}

.experience-col-2 p{
    font-size: 16px;
    color: #3d3d3d;
}

.experience-col-2 p span{
    font-size: 16px;
    color: #0a76b0;
}

/*---------------PORTFOLIO----------------*/
.projects{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 39.5%;
}

#mobile-projects{
    display: none;
}

/*
.projects::after{
    content: '';
    left: 43.8%;
    width: 11.7%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.projects::after{
    content: 'Projects';
    left: 43.8%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.row-4{
    display: flex;
    float: left;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 30px;
}

.portfolio-col-1{
    flex-basis: 32%;
}

.portfolio-col-1 img{
    width: 100%;
    border-radius: 5px;
    border-color:#272626;
    border: 5px solid;
    text-decoration: none;
}

.portfolio-col-2{
    flex-basis: 32%;
}

.portfolio-col-2 img{
    width: 100%;
    border-radius: 5px;
    border-color:#272626;
    border: 5px solid;
    text-decoration: none;
}

.portfolio-col-3{
    flex-basis: 32%;
}

.portfolio-col-3 img{
    width: 100%;
    border-radius: 5px;
    border-color:#272626;
    border: 5px solid;
    text-decoration: none;
}

/*------------PROSTHETIC KNEE-------------*/

.prosthetic-knee{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 23%;
}

/*
.prosthetic-knee::after{
    content: '';
    left: 34%;
    width: 32.65%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.prosthetic-knee::after{
    content: 'Prosthetic Knee Design';
    left: 34%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.prosthesis-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.prosthesis-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.prosthesis-blurb iframe{
    width: 100%;
    height: 600px;
    border: #0882C6 5px solid;
}

.project-row-1{
    display: flex;
    float: left;
    justify-content: space-between;
    flex-wrap: wrap;
}

.prosthetic-col-1{
    flex-basis: 33.5%;
}

.prosthetic-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.prosthetic-col-2{
    flex-basis: 32%;
}

.prosthetic-col-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.prosthetic-col-3{
    flex-basis: 30.5%;
}

.prosthetic-col-3 img{
    width: 100%;
    border: 2px solid #0882C6;
}


/*---------------PORTFOLIO WEBSITE----------------*/

.website{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 11.5%;
}

.website::after{
    content: 'UX/UI and Website Development';
    left: 27%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.website-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.website-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.website-col-1{
    flex-basis: 100%;
}

.website-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}


/*----------------PROSTHETIC FOOT------------------*/

.prosthetic-foot{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 2.7%;
    align-items: center;
}

.prosthetic-foot::after{
    content: 'Prosthetic Foot Redesigned for Stiffness';
    left: 21.7%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.foot-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.foot-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.foot-col-1{
    flex-basis: 64.3%;
}

.foot-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.foot-col-2{
    flex-basis: 30.7%;
}

.foot-col-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}



/*-----------HEALTH INNOVATION CHALLENGE-----------*/

.health-innovation{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 18.5%;
}

/*
.health-innovation::after{
    content: '';
    left: 31.26%;
    width: 40.2%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.health-innovation::after{
    content: 'Health Innovation Challenge';
    left: 31.26%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}


.velocity-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.velocity-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.rapid-relief img{
    width: 100%;
}

/*------------SOLAR-DECATHLON-----------*/

.solar-decathlon{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 15.7%;
}

/*
.solar-decathlon::after{
    content: '';
    left: 29.5%;
    width: 40.8%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.solar-decathlon::after{
    content: 'Solar Decathlon Competition';
    left: 29.5%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}


.architecture-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.architecture-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.architecture-img-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.architecture-col-1{
    flex-basis: 54.445%;
}

.architecture-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.architecture-col-2{
    flex-basis: 40.555%;
}

.architecture-col-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}

/*------WHEELCHAIR ACCESSIBLE EXERCISE EQUIPMENT------*/

.wheelchair-exercise{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: -2%;
    margin-right: -2%;
}

/*
.wheelchair-exercise::after{
    content: '';
    left: 19%;
    width: 61.2%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.wheelchair-exercise::after{
    content: 'Wheelchair-Accessible Exercise Equipment';
    left: 19%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.wheelchair-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.wheelchair-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.skisim-col-1{
    flex-basis: 37.1%;
}

.skisim-col-1 img{
    width: 100%;
}

.skisim-col-2{
    flex-basis: 57.9%;
}

.skisim-col-2 img{
    width: 100%;
    border: 2px solid #0a76b0;
}

/*---------------ULTRASOUND---------------*/

.b-mode{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 17.5%;
}

/*
.b-mode::after{
    content: '';
    left: 30.65%;
    width: 38.55%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.b-mode::after{
    content: 'B-Mode Ultrasound Imaging';
    left: 30.65%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.ultrasound-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.ultrasound-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.ultrasound-col-1{
    flex-basis: 37.25%;
}

.ultrasound-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.ultrasound-col-2{
    flex-basis: 57.75%;
}

.ultrasound-col-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}

/*---------------MORSE-CODE---------------*/

.morse-code{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 11.1%;
}

/*
.b-mode::after{
    content: '';
    left: 30.65%;
    width: 38.55%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.morse-code::after{
    content: 'EMG-Powered Morse Code Tapper';
    left: 26.8%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.morse-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.morse-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.morse-schematic-1{
    flex-basis: 100%;
}

.morse-schematic-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.morse-col-1{
    flex-basis: 50%;
}

.morse-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.morse-col-2{
    flex-basis: 45%;
}

.morse-col-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.morse-full-1{
    flex-basis: 40.6%;
}

.morse-full-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}
.morse-full-2{
    flex-basis: 31.1%;
}

.morse-full-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}
.morse-full-3{
    flex-basis: 19.4%;
}

.morse-full-3 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.morse-blurb iframe{
    width: 100%;
    height: 600px;
    border: #0882C6 5px solid;
}

/*-----------3D PUZZLE DESIGN---------*/

.puzzle{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 28%;
}

/*
.puzzle::after{
    content: '';
    left: 37%;
    width: 25.45%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.puzzle::after{
    content: '3D Printed Puzzle';
    left: 37%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.puzzle-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.puzzle-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.puzzle-img-1 img{
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
}

.puzzle-col-1{
    flex-basis: 49%;
}

.puzzle-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.puzzle-col-2{
    flex-basis: 49%;
}

.puzzle-col-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}

/*----------------MURAL-----------------*/

.mural{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 28%;
}

.mural::after{
    content: 'A New Tomorrow';
    left: 36.8%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.mural-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.mural-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.mural-col-1{
    flex-basis: 49%;
}

.mural-col-1 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.mural-col-2{
    flex-basis: 49%;
}

.mural-col-2 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.mural-col-3{
    flex-basis: 22%;
}

.mural-col-3 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.mural-col-4{
    flex-basis: 24.5%;
}

.mural-col-4 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.mural-col-5{
    flex-basis: 24.5%;
}

.mural-col-5 img{
    width: 100%;
    border: 2px solid #0882C6;
}

.mural-col-6{
    flex-basis: 24.5%;
}

.mural-col-6 img{
    width: 100%;
    border: 2px solid #0882C6;
}


/*----------------PUMP-----------------*/

.pump{
    font-size: 45px;
    font-weight: 600;
    color: #272626;
    margin-left: 21%;
}

.pump::after{
    content: 'Peristaltic Pump Design';
    left: 32.7%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.pump-blurb p{
    font-size: 18px;
    color: #3d3d3d;
}

.pump-blurb p span{
    font-size: 18px;
    color: #0a76b0;
}

.pump-col-1{
    flex-basis: 44%;
}

.pump-col-1 img{
    width: 100%;
    border: 2px solid #0a76b0;
}

.pump-col-2{
    flex-basis: 51%;
}

.pump-col-2 img{
    width: 100%;
    border: 2px solid #0a76b0;
}


/*---------------CONTACT----------------*/

.contact-left{
    flex-basis: 35%;
}

.sub-title{
    flex-basis: 35%;
    font-size: 45px;
    font-weight: 600;
    color: #272626;
}

/*
.sub-title::after{
    content: '';
    left: 20.2%;
    width: 15.75%;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
}
*/

.sub-title::after{
    content: 'Contact Me';
    left: 20.2%;
    width: fit-content;
    height: 3px;
    background: #0882C6;
    position: absolute;
    margin-top: 60px;
    color: transparent;
}

.contact-left p{
    font-size: 20px;
    color: #3d3d3d;
}

.contact-left p span{
    font-size: 20px;
    color: #0a76b0;
}

.contact-left p a{
        /*
        display: flex;
        display: block;
        float: left;
        padding: 1px;
        */
        list-style: none;
        /*
        margin: 1px 4%;
        */
        color: #3d3d3d;
        /*text-decoration: none;*/
        font-family: 'Trebuchet MS', sans-serif;
        font-size: 20px;
        position: relative;
}

.contact-right{
    flex-basis: 60%;
    /*margin-left: 40%;*/
}

.btn{
    display: inline-block;
    color: #ffffff;
    background: #0a76b0;
    width: 30%;
    padding: 14px;
    font-size: 18px;
    cursor: pointer;
    border-radius: 6px;
    margin-bottom: 15px;
}

.contact-right form{
    width: 100%;
}

form input, form textarea{
    width: 100%;
    border: 2px solid #0882C6;
    background: #ffffff;
    padding: 10px;
    margin: 8px 0;
    color: #3d3d3d;
    font-size: 18px;
    border-radius: 6px;

}

#msg{
    color:#3d3d3d;
    margin-top: -10px;
    display: block;
}






/*-------------------MOBILE---------------------*/


@media only screen and (max-width: 600px) {
    #header{
        display: none;
    }

    #mobile-header{
        display: block;
        width: 100%;
        height: 100vh;
        background-image: url(images/phone-background.png);
        background-position: center;
    }
    
    .name-text{
        margin-top: 40%;
        font-size: 45px;
    }

    .sub-name-text h1{
        font-size: 24px;
        margin-top: 10%;
        color: #0a76b0;
    }

    .desktop-container{
        display: none;
    }

    .mobile-container{
        display: block;
        padding: 30px 20%; 
    }

    nav{
        display: flex;
        display: block;
        align-items: right;
        justify-content: space-between;
        flex-wrap: wrap;
        margin-left: 0%;
        list-style: none;
    }

    nav ul li a{
        display: flex;
        display: block;
        float: left;
        padding: 1px;
        list-style: none;
        margin: 2%;
        color: #272626;
        text-decoration: none;
        font-family: 'Trebuchet MS', sans-serif;
        font-size: 14px;
        position: relative;
    }
    
    nav ul li a::after{
        content: '';
        width: 100%;
        height: 2px;
        background: #0882C6;
        position: absolute;
        left: 0;
        bottom: -4px;
    
    }

    
    #about{
        display: none;
    }
    


    /*
    #about{
        padding: 10px 0;
        color: #3d3d3d;
    }
    
    .about-col-1{
        flex-basis: 45%;
    }
    
    .about-col-1 img{
        width: 100%;
        border-radius: 15px;
    }
    
    .about-col-2{
        flex-basis: 50%;
    }

    .about-me{
        font-size: 45px;
        font-weight: 600;
        color: #272626;
        align-items: left;
    }

    .about-me::after{
        content: 'About Me';
        left: 49%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }
    */

    #about-mobile{
        display: block;
        padding: 10px 0;
        color: #3d3d3d;
    }

    .about-me-mobile{
        font-size: 40px;
        font-weight: 600;
        color: #272626;
        align-items: left;
        margin-left: 7%;
        margin-top: 10px;
    }

    .about-me-mobile::after{
        content: 'About';
        left: 53.7%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 65px;
        color: transparent;
    }

    .about-mobile-col-1{
        flex-basis: 48%;
    }
    
    .about-mobile-col-1 img{
        width: 100%;
        border-radius: 15px;
    }

    .about-mobile-col-2{
        flex-basis: 47%;
    }

    .about-mobile-blurb img{
        width: 100%;
        border-radius: 15px;
    }

    
    .about-tabs{
        display: flex;
        /*display: block;*/
        list-style: none;
        float: left;
        margin: 20px 0 40px;
    }

    .mobile-row-2{
        display: flex;
        float: left;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    
    .mobile-interests-col-1{
        flex-basis: 100%;
    }
    
    
    .mobile-about-tabs{
        display: flex;
        /*display: block;*/
        list-style: none;
        /*float: left;*/
        margin: 20px 0 40px;
    }
    
    .mobile-tab-links{
        margin-right: 50px;
        font-size: 20px;
        font-weight: 500;
        display: flex;
        /*display: block*/
        list-style: none;
        float: left;
        cursor: pointer;
        position: relative;
        color: #272626;
    }
    
    .mobile-tab-links::after{
        content: '';
        width: 0;
        height: 2px;
        background: #0882C6;
        position: absolute;
        left: 0;
        bottom: -6px;
        transition: 0.5s;
    }

    .mobile-tab-contents p{
        font-size: 14px;
        color: #3d3d3d;
        align-items: left;
        margin-left: 0;
        margin-top: 10px;
    }
    
    .mobile-tab-contents{
        display: none;
    
    }
    
    .mobile-tab-contents.mobile-active-tab{
        display: block;
    }

    .mobile-tab-links.mobile-active-link::after{
        width: 100%;
    }

    

    .experience::after{
        content: 'Experience';
        left: 24%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    #projects{
        display: none;
    }

    #mobile-projects{
        display: block;
        padding: 10px 0;
        color: #3d3d3d;
    }

    .projects{
        font-size: 45px;
        font-weight: 600;
        color: #272626;
        margin-left: 13%;
    }

    .projects::after{
        content: 'Projects';
        left: 27.7%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .mobile-portfolio-col-1{
        flex-basis: 47.5%;
    }
    
    .mobile-portfolio-col-1 img{
        width: 100%;
        border-radius: 5px;
        border-color:#272626;
        border: 5px solid;
        text-decoration: none;
    }
    
    .mobile-portfolio-col-2{
        flex-basis: 47.5%;
    }
    
    .mobile-portfolio-col-2 img{
        width: 100%;
        border-radius: 5px;
        border-color:#272626;
        border: 5px solid;
        text-decoration: none;
    }

    .experience-col-1{
        flex-basis: 40%;
    }

    .experience-col-2{
        flex-basis: 55%;
        padding-left: 10px;
    }

    .experience-col-2 h2{
        font-size: 16px;
        font-weight: 500;
        color: #3d3d3d;
    }
    
    .experience-col-2 p{
        font-size: 12px;
        color: #3d3d3d;
    }
    
    .experience-col-2 p span{
        font-size: 12px;
        color: #0a76b0;
    }
    
    .contact-left{
        flex-basis: 100%;
    }

    .sub-title{
        flex-basis: 100%;
        font-size: 45px;
        font-weight: 600;
        color: #272626;
    }

    .contact-right{
        flex-basis: 100%;
        /*margin-left: 40%;*/
    }
    
    .btn{
        display: inline-block;
        color: #ffffff;
        background: #0a76b0;
        width: 30%;
        padding: 14px;
        font-size: 15px;
        cursor: pointer;
        border-radius: 6px;
        margin-bottom: 15px;
    }
    
    .contact-right form{
        width: 100%;
    }
    
    form input, form textarea{
        width: 100%;
        border: 2px solid #0882C6;
        background: #ffffff;
        padding: 10px;
        margin: 8px 0;
        color: #3d3d3d;
        font-size: 18px;
        border-radius: 6px;
    
    }
    
    #msg{
        color:#3d3d3d;
        margin-top: -10px;
        display: block;
    }

    .prosthetic-knee{
        font-size: 30px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }

    .prosthetic-knee::after{
        content: 'Prosthetic Knee';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .health-innovation{
        font-size: 30px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }
    
    .health-innovation::after{
        content: 'Innovation';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .solar-decathlon{
        font-size: 30px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }
    
    .solar-decathlon::after{
        content: 'Solar Decathlon';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .wheelchair-exercise{
        font-size: 30px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }

    .wheelchair-exercise::after{
        content: 'Wheelchair-';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .b-mode{
        font-size: 30px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }
    
    .b-mode::after{
        content: 'Ultrasound';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .puzzle{
        font-size: 30px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }
    
    .puzzle::after{
        content: '3D Printed';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .prosthetic-foot{
        font-size: 30px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }
    
    .prosthetic-foot::after{
        content: 'Prosthetic Foot';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .mural{
        font-size: 28.5px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }
    
    .mural::after{
        content: 'A New Tomorrow';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    .pump{
        font-size: 28.5px;
        font-weight: 600;
        color: #272626;
        margin-left: 0%;
        margin-top: 5%;
    }
    
    .pump::after{
        content: 'Peristaltic Pump';
        left: 20%;
        width: fit-content;
        height: 3px;
        background: #0882C6;
        position: absolute;
        margin-top: 60px;
        color: transparent;
    }

    
}