body{ font-family: 'Nunito Sans', sans-serif; padding-bottom: 50px; background-color: #f9fafb; } .mainz{ border-bottom: 2px solid #efefef; } .project { margin-top: 80px; } .img_div { border-right: 2px solid #efefef; padding-right: 45px; } .img_div > img{ box-shadow: 0 1px 5px #00000008, 0 5px 30px #0000001a; border-radius: 5px; } .des_div{ padding-left:45px; line-height: 1.9em; } .my_info{ padding-top: 10px; padding-left: 40px; border-left: 2px solid #efefef; font-size: 22px; } .my_info > h4{ font-size: 33px; font-weight: 700; } .my_info > small{ font-size: 16px; } ul{ list-style: none; } .qnav { padding: 0 !important; margin-top: 15px; } .qnav > li > a{ background-color:#f9fafb; padding: 4px 12px; font-size: 16px; text-decoration: none; color:black; } .qnav > li:first-of-type > a{ margin-right: 15px; } .qnav > li > a:hover{ background-color: rgb(221, 221, 221); color:black; } .success{ width:100%; margin-top: 15px; background-color: rgb(144, 208, 178); text-align: center; padding: 15px 0px;} .error{ width:100%; margin-top: 15px; background-color: red; text-align: center; padding: 15px 0px;} .about_me{ border-right: 2px solid #efefef; padding-right: 45px; margin-top: 80px; line-height: 1.9em; } .tech{ margin-top: 80px; padding-left:45px; } h2, h5{ padding-bottom: 10px; border-bottom: #f5f5f5 solid 1px; margin-bottom: 15px; font-weight: 700; } .my_badges{ background-color:#eaeaea !important; color:#6c757d !important; border-bottom: #6c757d solid 1px; } h2.latest{ margin-bottom: 30px !important; } .v_but{ margin-top: 25px; } .endz{ border-top: 2px solid #efefef; margin-top: 50px; padding-top: 50px; padding-bottom: 50px; } @media only screen and (max-width: 768px) { .my_pic > img{ max-width: 70%; margin-left: 15%; } .my_info{ padding: 0 50px 30px 50px; } .qnav{ width: auto; padding: 15px; margin: 0 auto; text-align: center; } .qnav > li > a{ background-color:rgb(227, 227, 227); } .my_info{ text-align: center; border-left: none; } .my_info > h4{ padding-top: 0px !important; } .img_div{ border: none; padding: 0; } .img_div > img{ margin: 0 auto; } .img_div{ padding: 20px; } .project{ margin-top: 40px; } .des_div{ padding-left: 0; padding: 20px; } .about_me{ margin-top: 40px; padding: 20px; } .tech{ margin-top: 0px; padding: 20px; } h2.latest{ padding-left: 10px; margin-bottom: 0px !important; } }