*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    background-color: rgba(12, 11, 11, 0.438);
}
.main{
    border: 2px solid rgb(14, 13, 13);
    height: 98vh;
    width: 99vw;
    display: flex;
    flex-direction: row;
}
.left{
    border: 2px solid black;
    height: 100vh;
    width: 25vw;
    display: flex;
    flex-direction: row;

}
.first{
    width: 20%;
    border: 2px solid rgb(7, 0, 0);
    background-color: black;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;

}

.logo1
{
    width: 50px;
    height: 50px;
    padding: 1px;
    margin: 1px;
    border-radius: 50%;
   
}
.logo2
{
    width: 50px;
    height: 50px;
    padding: 1px;
    margin: 1px;
    border-radius: 50%;
   
}
.logo3
{
    width: 50px;
    height: 50px;
    padding: 1px;
    margin: 1px;
    border-radius: 50%;
   
}
.logo4
{
    width: 50px;
    height: 50px;
    padding: 1px;
    margin: 1px;
    border-radius: 50%;
   
}
.navthings{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    gap: 15px;
}


.options{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    gap: 15px;
}
.navlogos
{
    width: 25px;
    height: 25px;
    padding: 1px;
    margin: 1px;
    border-radius: 50%;
   
}
.logo5
{
    width: 50px;
    height: 50px;
    padding: 3px;
    margin: 1px;
    border-radius: 50%;
   
}

#place{
    height:25px;
    width: 270px;
    margin: 2px;
    padding: 2px;

}
a:link{
    color: azure;
}
a:visited{
    color: blue;
}
a:hover{
    color: rgb(119, 221, 36);
    transform: scale(1,1);
}
a:active{
    color: rgb(17, 17, 145);
}

.right{
    border: 2px solid rgb(17, 16, 16);
    height: 100vh;
    /* width: 60vw; */
    display: flex;
    flex-direction: column;
    flex-grow: 1;

}

.upper{
    border: 2px solid rgb(7, 2, 2);
    /* flex-grow: 1; */
    height: 50px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    margin: 2px;
   
    
}
.navitems{
    text-decoration: none;
    color: blanchedalmond;
}
.bottom{
    border: 2px solid rgb(14, 13, 13);
    display: flex;
    flex-direction: row;
    /* flex-grow: 1; */
    /* width: 80%; */
}
.third{
    width: 130%;
    border: 2px rgb(17, 2, 2) solid;
}
.second{
    color: aliceblue;
    display: flex;
    /* flex-grow: 1; */
    /* width: 79px; */
    flex-direction: column;
    justify-content: space-between;
    /* align-content: end; */
    margin: 2px;
    padding: 2px;
    gap: 9px;
   
}
.logocontainer{
    color: aliceblue;
    display: flex;
    flex-direction: column;
   gap: 5px;
}
.third{
    color: white;
    padding: 7px;
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    /* align-items: center; */
    /* flex-grow: 1; */
}
.user{
    border: 2px solid blue;
    display: flex;
    /* align-items: center;
    justify-content: center; */
    flex-direction: row;
    justify-content: space-between;
    height: 50px;
    width: 100%;
    
}
.forth{
    border: 2px solid rgb(19, 7, 7);
    color: aliceblue;
    display: flex;
    flex-direction: column;
    align-items: center;
  
}
#placeholder{
    width: 100%;
}
#friendlogo{
    text-decoration: none;
    text-align: center;
    width: 30px;
    height: 30px;
    padding: 3px;
    margin: 1px;
    /* border-radius: 50%; */

}
#nitrologo{
    text-decoration: none;
    text-align: center;
    width: 30px;
    height: 30px;
    /* padding: 3px;
    margin: 1px; */
    /* border-radius: 50%; */

}
#shoplogo{
    text-decoration: none;
    text-align: center;
    width: 30px;
    height: 30px;
    /* padding: 3px;
    margin: 1px; */
    /* border-radius: 50%; */

}
#footerlogo{
    text-decoration: none;
    text-align: center;
    width: 30px;
    height: 30px;
    /* padding: 3px;
    margin: 1px; */
    /* border-radius: 50%; */
    border-radius: 50%;


}
#mute{
    text-decoration: none;
    text-align: center;
    width: 20px;
    height: 20px;
    /* padding: 3px;
    margin: 1px; */
    /* border-radius: 50%; */
    border-radius: 50%;


}
#headphone{
    text-decoration: none;
    text-align: center;
    width: 20px;
    height: 20px;
    /* padding: 3px;
    margin: 1px; */
    /* border-radius: 50%; */
    border-radius: 50%;


}
#setting{
    text-decoration: none;
    text-align: center;
    width: 20px;
    height: 20px;
    /* padding: 3px;
    margin: 1px; */
    /* border-radius: 50%; */
    border-radius: 50%;


}
#mainimg{
    /* width: 70%; */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
    height: 90%;
    width: 99%;
    padding: 5px;
}
button{
    color: aliceblue;
    background-color: blue;
    width: 180px;
    margin: 5px;
    padding: 4px;
}
/* .footer{
    display: flex;
    align-items: end;
} */