*{
    
    margin: 0;
    padding: 0;
    font-family: 'Poppins', serif, sans-serif;
    box-sizing: border-box;
}




.background{ 
    width: 100%;
    height: 100%;
    min-height: 100vh;
    background:#c9f5d9;
    color: #5A5A5A;
    padding: 10px 8%;
    position: relative; 
    background: 
         linear-gradient(rgba(9, 7, 7,.5),rgba(7, 11, 14,.5)),url(laptop.jpeg);
    background-repeat: no-repeat;
    background-size: 1500px;
    
    
}

/*
img{
height: 100%;
width: 100%;
}
*/


nav{
    position:fixed; 
    top: 0;
    left: 285;
    width: 100%;
    display: flex; 
    padding: 15px 8%;
    align-items: center;
    z-index: 10;
}

nav img{
    width: 100px;
}

nav ul{
    flex: 1;
    text-align: left;
    
    
}

nav ul li{
    list-style: none;
    display:inline-block;
    padding: 25px 60px;
      
}

nav ul li a{
    text-decoration: none;
    font-size: 22px;
    position: relative;
}

nav ul li a::after{
    content: '';
    width: 100%;
    height: 3px;
    background: #c9f5d9;
    position:absolute;
    left: 0;
    bottom: 0px;   
    transition: transform 0.3s ease-out;
    transform: scaleX(0);
    transform-origin: bottom left right;    
}
nav a:hover{
    text-decoration: none;
    color: #bebebe;
}


nav a:hover::after{
    transform: scaleX(1);
    transform-origin: bottom center;   
}

nav a{ 
    text-decoration: none;
    color: #fff;
    font-size: 20px;
    display: inline-block;
    position: relative;

}



.logo{
    
    text-shadow: #fff;
    height: 110px;
    cursor: pointer;
    position: fixed;
    font-size: 40px;
    font-family:serif;
    top: 0;
    left: -30;
    width: 32%;
    padding: 15px 8%;
    display: flex; 
    align-items: center;
    z-index: 11;
    color: #fff;
}


.text-box{
    margin-top: 18%;
    max-width: 600px;
}


.text-box h1{
    font-family:serif;
    font-size: 70px;
    line-height: 90px;
    font-weight: 500;
    margin-bottom: 10px;
    border-bottom: 2px solid #d191d1;
    color:#fff;
    
}

.text-box p{
    line-height: 28px;
    font-size: 20px;
    color: #fff
}

.text-box button{
    padding: 20px 40px;
    background: #fff;
    border: 4px solid #efebf0;
    outline: 0; 
    margin-top: 40px;
    margin right: 10px;
    border-radius: 50px;
    font-weight: 500;
    cursor: pointer;
    position: absolute; 
    font-size: 17px; 
    color: #5a5a5a;
    
}


.text-box button:hover{
    border: 4px solid #fff;
    text-decoration-color: #fff;
    background: #a9a9a9;
    font-size: 17px;
    color:#fff;
   
}

 .feature-img{
    width: 5px;
    height: 3px;
    position: absolute;
    right: 15%;
    top: 32%;
    z-index: 2;
    /*border-style:solid;*/
    /*border-color: aliceblue;*/
    /*border: 1px solid #fff;*/
    /*background-color: #fff;*/
    /*padding: 8px 8px 8px 8px;*/
    
    
} 



.sidebar{
    position: absolute;
    top: 0;
    right: 0;
    width: 28.5%;
    height: 100%;
    background: #fff; 
    z-index: 1;    
}


.sidebar a {
    position: fixed;
    color: #5a5a5a;
    text-decoration: none;
    display: flex;
    align-items: center;
    font-size: 16px;
    margin-top: 2%;
    margin-left: 5%;
}

.sidebar a img{
    height: 30px;
}



.topbar{
    position: absolute;
    background-color: #5a5a5a;
    z-index: 2;
    height: 100px;
    width: 100%;
    margin-top:-10;
    top: 50;
    left: 0;
    box-shadow: .5px .5px 10px #c9f5d9;   
    
}

.Recent{
    border: 4px solid #fff;
    margin-top: 100px
    
}