*{
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-family:Poppins,sans-serif;
	}
	
	body{
	background:#0f0538;
	color:#ededed;
	}
	
	/* header */
	
	.header{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	padding:20px 10%;
	display:flex;
	justify-content:space-between;
	align-items:center;
	z-index:100;
	}
	
	.logo{
	font-size:30px;
	font-family:georgia;
	color:#252839;
	-webkit-text-stroke:2px #383d52;
	text-transform:uppercase;
	position:relative;
	}
	
	.logo::before{
	content:attr(data-text);
	position:absolute;
	top:0;
	left:0;
	width:0;
	height:100%;
	color:#04adff;
	border-right:2px solid #04adff;
	overflow:hidden;
	animation:animate 6s linear infinite;
	}
	
	@keyframes animate{
	0%,10%,100%{width:0;}
	70%{width:100%;}
	}
	
	/* navbar */
	
	.navbar a{
	font-size:18px;
	color:#ededed;
	text-decoration:none;
	margin-left:35px;
	transition:.3s;
	}
	
	.navbar a:hover,
	.navbar a.active{
	color:#00abf0;
	}
	
	/* menu button */
	
	.menu-btn{
	display:none;
	font-size:26px;
	cursor:pointer;
	}
	
	/* home */
	
	.home{
	height:100vh;
	display:flex;
	align-items:center;
	padding:0 10%;
	}
	
	.home-content{
	max-width:600px;
	}
	
	.home-content h1{
	font-size:50px;
	font-family:georgia;
	color:transparent;
	-webkit-background-clip:text;
	background-image:url('Photo/2.jpg');
	animation:back 30s linear infinite;
	}
	
	@keyframes back{
	100%{background-position:2000px 0;}
	}
	
	.home-content h3{
	font-size:28px;
	color:#00abf0;
	margin-top:10px;
	}
	
	.home-content p{
	margin:20px 0 40px;
	line-height:1.6;
	}
	
	/* buttons */
	
	.btn-box{
	display:flex;
	gap:20px;
	}
	
	.btn-box a{
	display:flex;
	justify-content:center;
	align-items:center;
	width:150px;
	height:45px;
	background:#00abf0;
	border:2px solid #00abf0;
	border-radius:8px;
	text-decoration:none;
	color:#081b29;
	font-weight:600;
	transition:.5s;
	}
	
	.btn-box a:nth-child(2){
	background:transparent;
	color:#00abf0;
	}
	
	.btn-box a:hover{
	background:transparent;
	color:#00abf0;
	}
	
	/* image */
	
	.imageSection{
	width:320px;
	height:320px;
	margin-left:80px;
	position:relative;
	}
	
	.imageSection img{
	width:100%;
	height:100%;
	object-fit:cover;
	}
	
	.imageSection::after{
	content:'';
	position:absolute;
	width:100%;
	height:100%;
	outline:3px solid #00abf0;
	bottom:15px;
	right:15px;
	}
	
	/* social */
	
	.home-sci{
	position:absolute;
	bottom:40px;
	display:flex;
	gap:20px;
	}
	
	.home-sci a{
	display:flex;
	justify-content:center;
	align-items:center;
	width:40px;
	height:40px;
	border:2px solid #00abf0;
	border-radius:50%;
	color:#00abf0;
	text-decoration:none;
	transition:.5s;
	}
	
	.home-sci a:hover{
	background:#00abf0;
	color:#081b29;
	}
	
	/* tablet */
	
	@media (max-width:992px){
	
	.home{
	flex-direction:column;
	text-align:center;
	padding-top:120px;
	}
	
	.imageSection{
	margin:40px 0;
	}
	
	}
	
	/* mobile */
	
	@media (max-width:768px){
	
	.menu-btn{
	display:block;
	}
	
	.navbar{
	position:absolute;
	top:100%;
	left:0;
	width:100%;
	background:#081b29;
	flex-direction:column;
	text-align:center;
	display:none;
	}
	
	.navbar.active{
	display:flex;
	}
	
	.navbar a{
	margin:15px 0;
	}
	
	.home-content h1{
	font-size:36px;
	}
	
	.imageSection{
	width:250px;
	height:250px;
	}
	
	}
	
	/* small mobile */
	
	@media (max-width:480px){
	
	.btn-box{
	flex-direction:column;
	}
	
	.btn-box a{
	width:100%;
	}
	
	.home-content h1{
	font-size:28px;
	}
	
	}