updated profile

assets/css/master.css

@@ -0,0 +1,209 @@
+@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
+@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
+
+body {
+    /* background: linear-gradient(75deg, rgba(3, 114, 142, 0.8), rgb(125, 207, 231), rgba(3, 114, 142, 0.4)); */
+    background-color: rgba(224, 246, 255, 0.6);
+    /* background-image: url('../images/pf_banner.png'); */
+    background-repeat: no-repeat;
+    background-size: cover;
+    color: black;
+    font: normal 14px/18px Nunito Sans;
+}
+
+section {
+    margin: 12px 0px;
+    border-bottom: 2px #000;
+}
+
+.portfolio_banner img{
+    display: flex;
+    margin: auto;
+    width: 70%;
+    /* justify-content: center; */
+}
+
+.portfolio h1{
+    font: 500 46px/44px Nunito Sans;
+    text-transform: uppercase;
+    color: rgb(53, 28, 117);
+}
+
+.portfolio .portfolio_subtitle {
+    font: 500 20px/28px Nunito Sans;
+    text-transform: capitalize;
+    color: rgb(53, 28, 117);
+}
+
+.portfolio_summary_content {
+    border: rgb(125, 207, 231) solid 0.5px;
+    border-radius: 16px;
+    border-style: outset;
+    padding: 8px 12px;
+}
+
+.section-title {
+    text-align: center;
+    font: 700 24px/32px 'Nunito Sans';
+    text-decoration: underline;
+    /* background-color: aliceblue; */
+    color: rgb(53, 28, 117);
+}
+
+.section-subtitle {
+    text-align: center;
+    font: 600 20px/30px 'Nunito Sans';
+    font-style: italic;
+    /* background-color: aliceblue; */
+    color: rgb(53, 28, 117);
+    margin: 4px 0px;
+}
+
+.portfolio_experience {
+    background-color: rgb(125, 207, 231, 30%);
+    border-radius: 8px;
+    border-color: rgb(125, 207, 231);
+    border-style: inset;
+    height: 280px;
+    overflow-y: scroll;
+}
+
+.portfolio_experience_section_content{
+    overflow-x: scroll;
+}
+
+.position-title {
+    font: bold 16px/18px Nunito Sans;
+    margin-bottom: 2px;
+}
+.experience-period {
+    font: 500 12px/16px Nunito Sans;
+    text-transform: uppercase;
+    text-align: right;
+    margin-bottom: 2px;
+}
+.position-in-company {
+    font: 500 16px/20px Nunito Sans;
+}
+
+.portfolio_education {
+    background-color: rgb(125, 207, 231, 7%);
+    border-radius: 8px;
+    border-color: rgb(125, 207, 231);
+    border-style: solid;
+    height: 100px;
+    overflow-y: scroll;
+}
+
+.portfolio_education_section_content{
+    overflow-x: scroll;
+}
+
+.education-title {
+    font: bold 16px/18px Nunito Sans;
+    margin-bottom: 2px;
+}
+.education-period {
+    font: 500 12px/16px Nunito Sans;
+    text-transform: uppercase;
+    text-align: right;
+    margin-bottom: 2px;
+}
+.education-institution {
+    font: 500 16px/20px Nunito Sans;
+}
+
+.skills-list-details {
+    display: flex;
+}
+
+.skills-info {
+    border-radius: 4px;
+    /* border: #000 solid 1px; */
+    border-color: rgba(125, 207, 231, 0.5);
+    border-style: ridge;
+}
+
+.portfolio_contact_info p{
+    align-items: center;
+}
+
+
+/* SCROLLBAR - STYLES #STARTS# */
+::-webkit-scrollbar {
+    width: 6px;
+    height: 4px;
+}
+
+/* Track */
+::-webkit-scrollbar-track {
+    box-shadow: inset 0 0 5px rgb(125, 207, 231, 30%); 
+    border-radius: 10px;
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+    background: rgb(0, 0, 0, 10%); 
+    border-radius: 10px;
+}
+
+/* Handle on hover */
+::-webkit-scrollbar-thumb:hover {
+    background: rgb(125, 207, 231); 
+}
+/* SCROLLBAR - STYLES #ENDS# */
+
+/* SECTION DIVIDER - STYLE #STARTS# */
+hr {
+    width: 20%;
+    margin: 2rem auto;
+    border-style: dotted;
+    border-top-width: 0.4rem;
+    border-color: rgb(20, 11, 44);
+}
+/* SECTION DIVIDER - STYLE #ENDS# */
+
+@media screen and (min-width: 172px) and (max-width: 768px) {
+    .portfolio_banner img{
+        width: 100%;
+    }
+
+    hr {
+        margin: 1.25rem auto
+    }
+
+    .portfolio_experience_section_content{
+        overflow-x: unset;
+    }
+
+    .skills-list-details {
+        display: block;
+        column-count: 2;
+        width: fit-content;
+        margin: 4px 8px;
+    }
+
+    .skills-info {
+        /* width: auto; */
+        /* display: flex; */
+    }
+
+
+    .portfolio_education_section_content {
+        overflow-x: unset;
+    } 
+
+    .education-title {
+        font: bold 14px/18px Nunito Sans;
+        margin-bottom: 2px;
+    }
+    .education-period {
+        font: 500 12px/16px Nunito Sans;
+        text-transform: uppercase;
+        text-align: right;
+        margin-bottom: 2px;
+    }
+    .education-institution {
+        font: 500 13px/16px Nunito Sans;
+    }
+}