*{margin: 0%;
    padding: 0%;
    box_sizing: border-box;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
 }
 html,body{
    height: 100%;
    width: 100%;
 }
 
 .main{height: 100%;
    width: 100%;
    
    
 }
 #logo{
    height: 70%;
 margin: 30px;}
    
    #logo img{height: 100%;
       width: 100%;
       object-fit: cover;
       
       
    }
    h1{
        font-size: 150px;
    }
 #header{
    height: 13%;
    width: 100%;
   
    position: fixed;
    display: flex;
    align-items: center;
   justify-content: space-around;
   background-color: rgb(182, 234, 251);
 }
 .texts{
    
    
    color: rgb(3, 3, 132);
    display: flex;
 }
 
 .texts:hover{
    
    
    color: rgb(25, 117, 147);
   
 }
 
 #contactdetails{
    
    font-weight: lighter;
 
 }
 .icons{
    padding: 10px;
    border-radius: 50%;
    
 }
 .icons:hover{background-color: lightblue;
 
 }
 #login{padding: 10px;
    border-radius: 50px;
    display: flex;}
    
 #login:hover{
    background-color: lightblue;
 }
 #try{color: white;
    background-color: green;
    padding: 10px 20px;
 }
 #try:hover{background-color:rgb(3, 88, 3);}
 #fakeheader{
    height: 13%;
    width: 100%;
    background-color: white;
    
 }
 
 #page1{
    height: 87%;
    width: 100%;
    background-color:hsla(0, 3%, 45%, 0.359) ;
 }
    
 }
 #strip{
    height: 8%;
    width: 100%;
    background-color: rgb(4, 4, 102);
    text-align: center;
    align-items: center;
    justify-content: center;
    color: white;
    padding: 10px;
    display: flex;
    
 }
 #strip u{margin-left: 20px;
    font-weight: lighter;
 }
 #content{height: 76%;
    width: 100%;
    display: flex;
    justify-content: space-around;
 align-items: center;
 
    
 
 }
 #box1{height: 90%;
 width: 47%;
 background-color:hsla(0, 3%, 45%, 0.359) ;
 
 }
 #box2{height: 90%;
    width: 70%;
    background-color: gray;
 }
 #heading{height: 16%;
    width: 100%;
    
    display: flex;
    align-items: center;
    justify-content: center;
    color: blue;
 
 }
 #heading h1{font-weight: 100;}
 #box1 h1{font-weight: 100;
    color: rgb(11, 11, 96);
    font-size: 50px;
    margin: 30px 10px;
 
 }
 #box1 p{font-weight: lighter;
    color: rgb(11, 11, 96);
    font-size: x-large;
    margin: 30px 10px;
 
 }
 #btns div{display: flex;
    align-items:center;
    justify-content: center;
 
 }
 
 
 #btn1{text-align: center;
    width: 23%;
    margin: 10px;
    padding: 10px 20px;
    color: white;
    background-color: blue;
    border-radius: 5px;
 }
 
 #btn1:hover{
    background-color: rgb(4, 4, 110);
 }
 #btn2{
    text-align: center;
    width: 23%;
    margin: 10px;
    padding: 10px 20px;
    color: blue;
    background-color: white;
    border: 1px solid blue;
    border-radius: 5px;
 }
 #btn2:hover{
    background-color: rgb(127, 127, 237);
    color: rgb(8, 8, 38);
     border-color: rgb(8, 8, 38) ;
 }
 
 #page2{
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content:center ;
    background-color:hsla(0, 3%, 45%, 0.359) ;
 }
 #aboutme p{font-size: medium;
 
 }
 #aboutportfolio p{
    font-size: medium;
 }