.firsthead {
                background-color: rgb(113, 207, 207);
                position: fixed;
                height: 50px;
                opacity: 20px;
                top: 5px;
            }
            
            a {
                cursor: pointer;
            }
            
            .firsthead h1 {
                font-family: "Satisfy", cursive;
                font-weight: 500;
                font-size: 30pt;
                padding-top: 10px;
                position: relative;
                top: -85px;
                left: 30px;
                float: left;
            }
            
            .heading {
                display: inline;
                list-style: none;
                padding-left: 920px;
                float: right;
            }
            
            .heading a {
                padding: 20px;
                line-height: 10px;
                font-size: 16px;
                text-decoration: none;
                color: rgb(4, 95, 95);
                font-family: Verdana, Geneva, Tahoma, sans-serif;
                display: inline-block;
            }
            
            .heading a:hover {
                color: black;
                text-transform: uppercase;
            }
            
            .satisfy-regular {
                font-family: "Satisfy", cursive;
                font-weight: 400;
                font-style: normal;
            }
            
            .homep {
                background-image: url(2pi.jpeg);
                width: 1330px;
                height: 700px;
                background-repeat: repeat;
                font-family: Arial, Helvetica, sans-serif;
                background-attachment: fixed;
            }
            
            .con {
                z-index: 1;
                position: relative;
                top: 300px;
                left: 30px;
                font-size: 40px;
            }
            
            .con>h2 {
                font-family: "Satisfy", cursive;
            }
            
            .maincon {
                font-size: large;
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
                width: 600px;
            }
            
            .maincon p {
                p {
                    animation: 3s infinite alternate slidein;
                }
            }
            
            @keyframes slidein {
                from {
                    margin-left: 100%;
                    width: 300%;
                }
                to {
                    margin-left: 0%;
                    width: 100%;
                }
            }
            
            hr {
                width: 110px;
            }
            
            .skillscon {
                background-image: url(3pi.jpeg);
                width: auto;
                height: auto;
                text-align: center;
                padding: 40px;
            }
            
            .skills {
                display: grid;
                padding: 30px;
                column-gap: 110px;
                row-gap: 40px;
                border-radius: 25px;
                grid
            }
            
            .skills h2 {
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
            }
            
            .skillscon h2 {
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
            }
            
            .grid-item1 {
                background-color: aliceblue;
                grid-column: 1;
                border-radius: 25px;
                justify-content: center;
                width: 500px;
                padding: 10px;
            }
            
            .grid-item2 {
                background-color: aliceblue;
                grid-column: 2;
                border-radius: 25px;
                justify-content: center;
                width: 500px;
                padding: 10px;
            }
            
            .grid-item3 {
                background-color: aliceblue;
                grid-column: 1;
                border-radius: 25px;
                justify-content: center;
                width: 500px;
                padding: 10px;
            }
            
            .grid-item4 {
                background-color: aliceblue;
                grid-column: 2;
                border-radius: 25px;
                justify-content: center;
                width: 500px;
                padding: 10px;
            }
            
            .aboutme {}
            
            .aboutme img {
                position: relative;
                left: 150px;
            }
            
            .aboutme h2 {
                font-family: Arial, Helvetica, sans-serif;
                text-align: center;
            }
            
            .abtleft {
                width: 450px;
                box-shadow: 10px 10px 25px #03c7c7;
                padding: 30px;
                flex-direction: column;
                margin-left: 20px;
                margin-right: 50px;
                background-color: rgb(134, 206, 194);
            }
            
            .abtleft p {
                position: relative;
                left: 40px;
                font-size: 20px;
                font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
                font-weight: 100;
            }
            
            .abtleft li {
                position: relative;
                left: 30px;
                font-size: 20px;
                font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
                font-weight: 100;
            }
            
            .abtright {
                width: 600px;
                box-shadow: 10px 10px 25px #03c7c7;
                padding: 30px;
                flex-direction: column;
                margin-left: 20px;
            }
            
            .abtcontainer {
                display: flex;
                flex-wrap: wrap;
            }
            
            .contactme {
                padding: 50px;
                opacity: 0.8;
                box-shadow: 10px 10px 10px;
                font-size: 30px;
                text-align: left;
                padding-right: 40px;
                background-color: rgb(88, 196, 190);
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
            }
            
            .contactme>img {
                position: relative;
                left: 500px;
                top: 30px;
            }
            
            .procontainer {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                align-items: center;
                background-image: url(bg2.jpeg);
                opacity: 30px;
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
                font-weight: 700;
                font-style: normal;
                padding: 20px;
            }
            
            .procontainer h3 {
                font-weight: 900;
                font-size: larger;
            }
            
            .item1 {
                order: 1;
                width: calc(50% - 6rem);
                margin: 0 3rem 0 0;
                font-style: oblique;
            }
            
            .item2 {
                order: 2;
                width: calc(50% - 6rem);
                margin: 0 3rem;
                font-style: oblique;
            }
            
            .item3 {
                width: 100%;
                margin-bottom: 3rem;
                font-style: oblique;
            }
            
            .projects {
                height: 1000px;
                width: fit-content;
            }
            
            .abtright {
                font-size: 20px;
                font-family: Verdana, Geneva, Tahoma, sans-serif;
                text-wrap: wrap;
                padding: 40px;
                letter-spacing: 2px;
                line-height: 40px;
            }
            
            #div .abtleft {
                animation-timing-function: linear;
            }
            
            #div .abtright {
                animation-timing-function: ease;
            }
            
            .projects h2 {
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
            }
            
            @keyframes mymovne {
                from {
                    left: 0px;
                }
                to {
                    left: 500px;
                }
            }
            
            input[type="text"],
            select,
            textarea {
                width: 100%;
                padding: 12px;
                border: 1px solid #ccc;
                border-radius: 4px;
                box-sizing: border-box;
                margin-top: 6px;
                margin-bottom: 16px;
                resize: vertical;
            }
            
            input[type="submit"] {
                background-color: #04AA6D;
                color: white;
                padding: 12px 20px;
                border: none;
                border-radius: 4px;
                cursor: pointer;
            }
            
            input[type="submit"]:hover {
                background-color: #45a049;
            }
            
            .container {
                border-radius: 5px;
                background-color: #f2f2f2;
                padding: 40px;
                float: right;
                width: 600px;
                background-image: url(4pi.jpeg);
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
            }
            
            .leftcontact {
                background-color: rgb(201, 233, 235);
                padding: 30px;
                width: fit-content;
                padding-left: 20px;
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
                font-weight: 800;
                border-radius: 6px;
            }
            
            .leftcontact img {
                height: 100px;
                width: 100px;
                padding: 30px;
            }
            
            #phone {
                position: relative;
                top: 45px;
            }
            
            #mail {
                position: relative;
                top: 45px;
            }
            
            button {
                background-color: #03c7c7;
                padding: 20px 20px;
                font-weight: 600;
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
                font-style: oblique;
                border-radius: 8px;
            }
            
            button:hover {
                background-color: aquamarine;
            }