stylesheet.css

 <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing:border-box;
        }

        .main::before {
            content: "";
            background-image: url("photo-1534367610401-9f5ed68180aa.jpg");
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;
            position: absolute;
            height: 620px;
            width: 98.7%;
            z-index: -1;
            opacity: 0.9;
            color: white;
}
         #navigation {

            display: flex;
            justify-content: space-between;
            align-items: center;
        }
       .uol {
            display: flex;
            list-style: none;
     }
      .items a {
            text-decoration: none;
            list-style: none;
            color: white;
            margin: 2px 34px;
            font-size: 1.29rem;
            padding: 11px 11px 11px 11px;
}

        .items a:hover {
            background-color: white;
         color: black;
            border-radius: 20px;
        }

        #i1 {

            font-size: 29px;
             color: white;
            margin: -4px 0px 0px 16px;

        }

        #b1 {
            margin: 27px 27px 27px -29px;
            height: 1.8rem;
            width: 1.5rem;
            cursor: pointer;
        }

        #input1 {
            width: 12rem;
            height: 1.8rem;
            border-radius: 8px;

        }

        .sub1 {
            display: grid;
            grid-template-areas:
                's1  s1  s2 s2'

            ;
        }

        .s1 {
            justify-content: left;
            padding: 5.7rem;
            /* border: 2px solid red; */
            grid-area: s1;
            line-height: 51px;
        }

        .s2 {
            padding: 7rem 3rem 9rem 3rem;


            /* border: 2px solid red; */
            grid-area: s2;
        }

        #p1 {

            font-size: 1.9rem;
            color: rgb(255, 255, 255);
          z-index: -7;
        }

        #p2 {
            margin: 2rem;
            text-align: center;
            writing-mode: vertical-lr;
            font-size: 8rem;
            margin: -1.6rem -1rem 0rem 0rem;
            color: rgb(219, 219, 0);
        }

        #p3 {
            writing-mode: vertical-lr;
            margin: -1.7rem 0rem -5rem 0.7rem;
            color: white;
        }

        #h1 {
            font-size: 2.9rem;
            color: rgb(255, 255, 255);
            margin: 1rem 0rem 1rem 0rem;
        }

        #b2 {
            justify-content: left;
            margin: 1.6rem 0rem 0rem 0rem;
            padding: 0.4rem;
            height: 42px;
            width: 160px;
            font-size: 1.1rem;
            background-color: rgb(219, 219, 0);
            cursor: pointer;
            color: white;
            font-size: 22px;
            border-radius: 30px;
        }

        #b2:hover {
            color: rgb(0, 0, 0);
            background-color: rgb(236, 236, 78);
        }

        .sub2 {

            background-color: rgb(61, 61, 61);
            display: grid;

            grid-template-areas:
                'yo yo yo yo'
                's3 s4 s5 s6';
        }

        .yo {
            text-align: center;
            grid-area: yo;
            margin: 2rem 0rem 1rem 0rem;

        }

        .s3 {
            text-align: center;
            margin: 0rem 2rem 0rem 2rem;
            grid-area: s3;

        }

        .s4 {

            text-align: center;
            margin: 0rem 2rem 0rem 2rem;
            grid-area: s4;
        }

        .s5 {
            margin: 0rem 2rem 0rem 2rem;
            text-align: center;

            grid-area: s5;
        }

        .s6 {
            text-align: center;
            margin: 0rem 2rem 0rem 2rem;


            grid-area: s6;
        }

        #i2 {
            height: 37px;
            width: 37px;
            margin: 1rem 0rem 0.5rem 0rem;
        }

        #i3 {
            height: 37px;
            width: 37px;
            margin: 1rem 0rem 0.5rem 0rem;
        }

        #i4 {
            height: 38px;
            width: 71px;
            margin: 1rem 0rem 0.5rem 0rem
        }

        #i5 {
            height: 37px;
            width: 37px;
            margin: 1rem 0rem 0.5rem 0rem;
        }

        .h2 {
            color: white;
        }

        .p4 {
            color: white;
        }

        .yo {
            color: white;
        }
hr{
 margin: 0px;
}

        footer {
            color: white;
            background-color: rgb(61, 61, 61);
            text-align: center;
            margin: -0.9rem 0rem 0rem 0rem;
            /* border: 1PX solid white; */
        }
    </style>