    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    
    body {
        font-family: 'Acme', sans-serif;
        font-family: 'Orbitron', sans-serif;
        font-family: 'Ubuntu', sans-serif;
        transition: 0.5s all ease-in-out;
    }
    
    a {
        text-decoration: none;
        color: white;
    }
    /* navigation */
    
    header {
        position: sticky;
        top: 0px;
    }
    
    nav {
        position: sticky;
        top: 20px;
        z-index: 99999;
        background-image: url(./img/gamingboy.svg);
        box-shadow: 0 0 5px #111111;
        color: #141e30;
        height: 7vh;
        padding: 10px;
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    
    .logo-container {
        font-family: 'Orbitron', sans-serif;
        width: 30%;
        align-items: center;
        display: flex;
        justify-content: center;
        letter-spacing: 0.25em;
    }
    
    .logo {
        margin: 15px;
        height: 50px;
        width: 50px;
        filter: drop-shadow(0 0 15px #fff);
    }
    
    .nav-links {
        z-index: 9;
        font-family: 'Orbitron', sans-serif;
        list-style-type: none;
        display: flex;
        justify-content: space-around;
    }
    
    .nav-link {
        z-index: 99;
        padding: 25px;
        height: 100px;
        line-height: 100px;
        color: #141e30;
        text-shadow: 5px 5px 10px #141e30;
        transition: 0.3s all ease-in;
    }
    
    .nav-link:hover {
        background: #141e30;
        color: #fff;
    }
    
    .search {
        height: 40px;
        background: #141e30;
        display: flex;
        justify-content: center;
        border-radius: 40px;
        padding: 5px;
    }
    
    .search:hover>.bar {
        width: 240px;
        padding: 15px;
    }
    
    .bar {
        letter-spacing: 0.1em;
        font-family: 'Acme', sans-serif;
        color: #fff;
        border: none;
        background: none;
        outline: none;
        transition: 0.7s;
        font-size: 16px;
        line-height: 40px;
        width: 0px;
    }
    
    .srch-btn {
        display: flex;
        justify-content: center;
        align-items: center;
        color: crimson;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background: #141e30;
    }
    
    .burger {
        z-index: 999;
        display: none;
    }
    
    .burger div {
        margin: 5px;
        width: 30px;
        height: 3px;
        background-color: #141e30;
    }
    
    @keyframes navLinksFade {
        from {
            opacity: 0;
            transform: translate(-50px);
        }
        to {
            opacity: 1;
            transform: translate(0);
        }
    }
    /* Navigation */
    /* main */
    
    .landing-sec {

        z-index: -5;
        height: 93vh;
        width:100%;
       
    }
    
    .backg {
    	margin: auto;
        width: 90%;
        height: 100%;
       
        display: flex;
        justify-content:space-around;
    	
        align-items: center;
    }

    .backg img{
    		padding: 10px;
    	flex: 1;
    	width: 50%;
    }
    .titles{
		margin: 0 30px;
    	flex: 1;
    	width: 50%;

    }
    .titles h1 {
    		padding: 10px;
    	letter-spacing: 0.20em;
    	margin: 10px 0px;
    	font-size:80px;
    	font-weight: 600; 
    	background:linear-gradient(90deg, #50a7c2 0%,#b7f8db 90% );
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    .titles p{
    	border-bottom: 3px solid #111111;
    	padding: 10px;
    	letter-spacing:0.20em;
    	font-size:20px;
    	margin: 0px 5px;
    }





    .big-circle {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: -1;
    height: 80%;
    opacity: 0.2;
}

.mid-circle {
    position: absolute;
    top: 40%;
    right: 25%;
    z-index: -1;
    height: 60%;
    opacity: 0.4;
}

.small-circle {
    position: absolute;
    bottom:1%;
    left: 30%;
    opacity: 1;
    z-index: -1;
}


.button{
	font-size: 22px;
	width: 100%;
	padding: 10px;
	margin: 2rem 0;

}
.exp{
	border: 2px solid #141e30;
	background:none;
	padding: 20px;
	color:#111111;
	transition:0.5s all ease-in-out; 
}
.exp:hover{
	
	background:#141e30;
	
	color:#fff;
}
.call{
	

	background:#141e30;
	padding: 20px;
	color:#fff;
	transition:0.5s all ease-in-out; 
}
.call:hover{
	border: 2px solid #141e30;

	background:none;
	padding: 20px;
	color:#141e30;
}
    
    
    /* main */