.container{
    height: 100%;
    width: 100%;
    background-color: black;
  
}


.header{
   background-color: black;
    height: 70vh;
    width: 100%;

}

.nav-top{
     height: 60px;
     color: white;
     width: 100%;
     position: relative;

}
.r-nav{
  width:40vh;
    height: 60px;
    justify-content:center;
    padding-left: 80px;
    padding-top: 20px;

    

}
.l-nav{
  
    width:60vh;
    height: 60px;
    display: flex;
    position:absolute;
    right: 5px;
    top:0px;
    justify-content: space-around;
    align-items:center ;


}

.middle-nav-right{
    width: 50%;
    height: 400px;
    position: absolute;
    right: 0px;
    top:0px;
}

.circle{
    border: solid 15px;
    border-color:orange ;
    height: 320px;
    width: 320px;
    position: relative;
    left: 400px;
    top:35px;
}
.header2{
    height: 30vh;
    width: 100%;
    background-color: black;

}
.header3{
    background-color: black;
    height: 80%;
    width: 100%;
}
.l-project{
    width: 50%;
    height: 40%;
    border-color: orange;
}
.cal{
    border: solid;
    width: 300px;
    height: 200px;
    margin-left: 250px;

}
.l-side-pic{
    margin-left: 5%;
    border: solid;
}