* {
    box-sizing: border-box;
}
#box
{
width: 100%;
height: 100vh;
background-color: black;
}
#box1
{
    position: relative;
    width: 50%;
    height: 100vh;
    background-color: rgb(12, 12, 15);
    float: left;
    color: white;
    padding-top: 130px;
    text-align: center;
    line-height: 2;
    font-family: math;
}
#color
{
    background: linear-gradient(90deg,orange,red,deeppink,purple);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
#insta
{ position:absolute;
    width: 60px;
    height: 60px;
        left: 30px;
    top: 70px;
}
#photos {
    position: relative;
    width: 50%;
    height: 300px;
}
.img{ width: 120px;
   
    border-radius: 25px;
    position: absolute;
    object-fit: cover;
    }

    .img1
    {  height: 200px;
           left: 250px;
           z-index: 3;
           transform: rotate(0deg);
    }
    .img2{
        left: 320px;
         height: 190px;
         padding-top: 20px;
        z-index: 2;
        transform: rotate(10deg);
    }
    .img3
    {
             height: 190px;
         padding-top: 20px;
            left: 180px;
            z-index: 1;
            transform: rotate(-10deg);
    }

#box2
{
    width:49% ;
    height: 100vh;
    background-color: rgb(25, 25, 27);
    float: left;
    color: white;
    font-family: sans-serif;
    position: relative;
    font-size: 12px;
    padding-left: 50px;
    padding-top: 30px;
    border-left: 2px solid  rgb(96, 95, 95);
}
#form
{
    position: absolute;
    left: 50px;
    top: 100px;
}
.in
{
    width: 520px;
    color: white;
}
.lo
{
    height: 55px;
    border-radius:15px ;
    background:transparent;
    border: 1px solid rgb(96, 95, 95);
    padding-left: 30px;
    

}
#log
{
    height:40px ;
    border: 1px solid  rgb(27, 120, 227);
    border-radius: 30px;
    background-color: rgb(27, 120, 227);
    color: white;
}
#fo
{
    border: 1px solid transparent;
    border-radius: 30px;
    background: transparent;
    height: 40px;
    color: white;
}
.fa
{
   height: 40px; 
   background:rgb(35, 35, 38);
   border: 1px solid rgb(25, 25, 27);
   border-radius: 30px;
   color: white;
}


#acc
{
    height: 40px; 
   border-radius: 30px;
   color:  rgb(27, 120, 227); 
    border: 1px solid  rgb(27, 120, 227);
    background:transparent;
}
#meta
{
    text-align: center;
    padding-top: 420px;
    color: rgb(217, 226, 234);
}
#box3
{
    position: relative;
    width: 100%;
    height: 230px;
    background-color: black;
    float: left;
    border-top: 2px solid  rgb(96, 95, 95);
}
a{
     text-decoration: none;
    color: rgb(168, 166, 166);
        font-family: sans-serif;
    font-size: 12px;
}
footer{
    position: absolute;
    left: 100px;
    top:20px;
    display: flex;
     gap:20px;
}
.opt
{
    position: absolute;
    top: 70px;
    left:550px ;
    background: transparent;
    color:rgb(168, 166, 166) ;
    border: 0px;
    font-size: 12px;
}
.opt option
{
    color: black;
}
.me
{
    position: absolute;
    top: 60px;
    color:rgb(168, 166, 166) ;
    background: transparent;
    font-size: 12px;
    font-family: sans-serif;
    left:650px ;
}
body{
    margin: 0px;
}