body {
                    margin: 0px;
                }
                
                #body-h {
                    margin-top: -18px;
                    background-image: url("rbg.png");
                    background-repeat: no-repeat;
                    background-size: cover;
                    background-position: center;
                    opacity: 0.7;
                    height: 80vh;
                    background-attachment: fixed;
                }
                
                .horizontal-list {
                    list-style: none;
                    padding-left: 0px;
                }
                
                .horizontal-list li {
                    display: inline-block;
                    margin: 8px 40px 40px 0px;
                    font-size: 50px;
                }
                
                .horizontal-list li a {
                    color: #00FF9C;
                    text-decoration: none;
                    transition: color 0.5s, border-bottom 4s;
                    opacity: 1;
                }
                
                .text-center {
                    text-align: center;
                }
                
                .nav-menu li a:hover {
                    color: rgb(136, 255, 0);
                }
                
                #name {
                    color: #ffffff;
                    font-size: 6rem;
                    text-align: center;
                    opacity: 1;
                    margin-top: 22px;
                    font-family: helvetica;
                    margin-bottom: 0.5rem;
                }
                
                #name:hover {
                    color: #00FF9C;
                    transition: color 0.5s;
                }
                
                .nav-menu text-center {
                    size: 1px;
                }
                
                .sociali li a i {
                    font-size: 4rem;
                    border-radius: 50%;
                }
                
                .sociali li a i:hover {
                    color: white;
                    box-shadow: 0px 0px 6px 4px grey;
                    transition: color 0.4s;
                }
                
                section {
                    width: 100%;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                }
                
                section:nth-child(2n) {
                    background-color: lightgrey;
                }
                
                section:nth-child(2n+1) {
                    background-color: white;
                }
                
                #about {
                    height: auto;
                    width: 100%;
                    position: relative;
                }
                
                section:target {
                    background-color: cyan;
                    transition-duration: 0.7s;
                }
                
                #img {
                    height: 12rem;
                    width: 12rem;
                    /* margin-top: -5vh; */
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }
                
                #img img {
                    height: 180%;
                    width: 180%;
                    border-radius: 50%;
                    border: 10px solid white;
                }
                
                #aboutme {
                    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
                    font-size: 40px;
                    margin: 140px;
                }
                
                .skill-progress {
                    width: 15rem;
                    height: 30px;
                    background-color: lightgrey;
                    border-radius: 0.8rem;
                    border: 1px solid black;
                    margin: 90px;
                }
                
                .mb75px {
                    margin-bottom: 75px;
                    margin-top: 75px;
                    color: #2857A4;
                    font-size: 50px;
                }
                
                #skills i {
                    /* padding-left: 900px; */
                    font-size: 50px;
                    /* padding-right: 15px; */
                    color: #2857A4;
                }
                
                #span1 {
                    font-size: 50px;
                    color: #2857A4;
                }
                
                .skillsdisplay {
                    width: 70%;
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: space-evenly;
                    margin-top: -80px;
                }
                
                .mb-blue {
                    background-color: #2857a4;
                }
                
                .eighty-five-percent {
                    width: 50%;
                    height: inherit;
                }
                
                .fortyfive-percent {
                    width: 80%;
                    height: inherit;
                }
                
                .mb-orange {
                    background-color: #ec4d1c;
                }
                
                .skill-name {
                    color: white;
                    font-size: 25px;
                    margin-left: 10px;
                }
                
                .skill-progress>div {
                    border-radius: 20px 0px 0px 20px;
                }
                .skill-name span {
                    color: white;
                    font-size: 1rem;
                    margin-left: 10px;
                    vertical-align: middle;
                }
                .skill-progress {
                    width: 11rem;
                    height: 2.2rem;
                    background-color: lightgrey;
                    border-radius: 1rem;
                    box-shadow: 1px 1px 2px 1px #b9b9b9 inset;
                    margin: 25px;
                    overflow: hidden;
                }
                
                .hundred-percent {
                    width: 97%;
                    height: inherit;
                }
                
                .mb-red {
                    background-color: #0b8176;
                }
                
                .seventy-five-percent {
                    width: 50%;
                    height: inherit;
                }
                
                .mb-purple {
                    background-color: #93738c;
                }
                
                .sixty-percent {
                    width: 30%;
                    height: inherit;
                }
                
                .mb-yellow {
                    background-color: #2857a4;
                }
                
                .twenty-percent {
                    width: 97%;
                    height: inherit;
                }
                
                .mb-green {
                    background-color: #0b8176;
                }
                
                .timeline {
                    position: relative;
                    width: 75%;
                    margin-bottom: 100px;
                    /* border: 2px solid black; */
                }
                
                .timeline-box {
                    position: relative;
                    width: 40%;
                    left: 5%;
                    min-height: 150px;
                    /* border: 2px solid black; */
                }
                
                .timeline-box:nth-child(2n) {
                    left: 53%;
                }
                
                .timeline-box:nth-child(2n)::after {
                    content: '';
                    position: absolute;
                    top: 30%;
                    left: -8%;
                    border-radius: 50%;
                    height: 0.5rem;
                    width: 0.5rem;
                    background-color: red;
                    z-index: 1;
                }
                
                .timeline-box:nth-child(2n+1)::after {
                    content: '';
                    position: absolute;
                    top: 30%;
                    right: -13.25%;
                    border-radius: 50%;
                    height: 0.5rem;
                    width: 0.5rem;
                    background-color: red;
                    z-index: 1;
                }
                
                .timeline-divider {
                    position: absolute;
                    height: 75%;
                    width: 0;
                    border: 3px dashed #0096fa6b;
                    top: 10%;
                    left: 50%;
                }
                
                .timeline-traveller {
                    position: sticky;
                    top: 30%;
                    transform: rotate(90deg);
                    z-index: 2;
                    text-shadow: 10px 10px 10px black;
                }
                
                .timeline-traveller i {
                    font-size: 40px;
                }
                
                #box1 {
                    font-family: Georgia, serif;
                    font-size: 50px;
                    letter-spacing: 2px;
                    word-spacing: 2px;
                    text-align: end;
                }
                
                #box2 {
                    font-family: Georgia, serif;
                    font-size: 50px;
                    letter-spacing: 2px;
                    word-spacing: 2px;
                    text-align: end;
                }
                
                #box3 {
                    font-family: Georgia, serif;
                    font-size: 50px;
                    letter-spacing: 2px;
                    word-spacing: 2px;
                    text-align: end;
                }
                
                .designation {
                    font-size: 1.4rem;
                }
                
                .organisation {
                    margin: 5px 0 0;
                    color: #eb822d;
                    font-weight: 400;
                    font-size: 2.8rem;
                }
                
                .duration {
                    color: #9e9b9b;
                    font-weight: 100;
                    color: grey;
                    font-size: 1.5rem;
                }
                
                .description {
                    font-size: 34px;
                    padding: 2px;
                    color: grey;
                    /* line-height: 20px; */
                }
                
                #traveller2 {
                    transform: rotate(90deg)
                }
                
                #container {
                    box-sizing: border-box;
                    display: flex;
                    flex-wrap: wrap;
                    width: 100%;
                    padding: 0 50px;
                    margin-bottom: 2%;
                    justify-content: space-around;
                }
                
                .image {
                    max-width: 300px;
                    overflow: hidden;
                    background-size: cover;
                    background-repeat: no-repeat;
                    position: relative;
                }
                
                .image img {
                    height: 100%;
                    width: 100%;
                }
                
                .portfolio-details {
                    transition: all 0.5s ease-in-out;
                    position: absolute;
                    top: 0;
                    left: 0;
                    height: 100%;
                    color: transparent;
                    text-align: center;
                    padding: 10px;
                    font-size: 50px;
                }
                
                .image:hover {
                    box-shadow: 0 0 20px #74ADC8;
                }
                
                .image:hover .portfolio-details {
                    background-color: #80808078;
                    color: white;
                }
                .image:hover .portfolio-details a{
                    text-decoration: none;
                    background-color: transparent;
                    text-align: center;
                    color: white;
                }
                .image .portfolio-details a{
                    text-decoration: none;
                    background-color: transparent;
                    color: transparent;
                }
                
                .designation {
                    text-align: end;
                    font-size: 45px;
                }
                
                .logo {
                    width: 80px;
                    position: absolute;
                    overflow: hidden;
                    margin-top: -15px;
                }
                
                .logo>img {
                    width: 100%;

                }
                
                #contact {
                    background-color: #0abcf9;
                    background-image: linear-gradient(50deg, #2857a4 0%, #403066 74%);
                    color: white;
                    padding-bottom: 40px;
                }
                
                #contact h1,
                #contact h1 span {
                    color: white;
                }
                
                #contact-form {
                    margin-left: 20%;
                }
                
                #contact-container {
                    display: flex;
                }
                
                #my-details-container {
                    width: 35%;
                    margin-left: 6%;
                }
                
                #my-details-container h3 {
                    color: white;
                    font-weight: 550;
                    font-size: 1.2rem;
                }
                
                #contact-form-container {
                    width: 50%;
                }
                
                #my-details-container p {
                    color: #d9dcdd;
                    font-size: 0.9rem;
                }
                
                .my-details-info-container {
                    margin-bottom: 20px;
                    color: #d9dcdd;
                    font-size: 1rem;
                }
                
                .my-details-info-container span {
                    margin-left: 0.4rem;
                }
                
                .my-details-info-container i {
                    color: white;
                }
                
                .my-details-icon {
                    width: 1rem;
                    height: 1rem;
                    vertical-align: bottom;
                    margin-right: 0.5rem;
                }
                
                #contact-form input,
                textarea {
                    max-width: 90%;
                    margin: 15px;
                    padding: 4px 10px;
                    border: 0px solid transparent;
                    border-bottom: 2px solid white;
                    color: #d9dcdd;
                    background: transparent;
                    width: 90%;
                    line-height: 1.6;
                    font-size: 1.05rem;
                }
                
                #contact-form button[type="submit"] {
                    background: transparent;
                    font-size: 0.95rem;
                    border: 2px solid white;
                    margin-top: 5%;
                    margin-left: 35%;
                    border-radius: 2px;
                    color: white;
                    font-family: sans-serif;
                    font-weight: 700;
                    letter-spacing: 0.046875em;
                    line-height: 1;
                    padding: 0.8em 0.8em 0.78em;
                    text-transform: uppercase;
                }
                
                #contact-form button:hover {
                    background: white;
                    color: #13386fe0;
                }
                
                #contact .social-icons li a i {
                    color: white;
                    font-size: 2rem;
                    margin: 40px 10px 10px;
                    padding: 10px 10px 10px 10px;
                }
                
                input:focus,
                select:focus,
                textarea:focus,
                button:focus {
                    outline: none;
                }