@charset "utf-8";

html{
			scroll-behavior: smooth;
		}
		body{
			background-image: url(../images/k.jpg) ;
			background-repeat: no-repeat;
			width: 100%;
			background-size: cover;
			background-attachment: fixed;
			background-position: center;
		}
		nav{
			background: #24292E;
		}
		#brand{
			font-family: 'El Messiri', sans-serif;
			font-weight: 600;
			font-size: 25px;
			color: white;
		}
		.nav-link{
			font-family: 'Roboto', sans-serif;
			font-weight: 300;
			color: white;
		}
		#body-box{
			width: 100%;
			height: 92vh;
			background-image: url(../images/o.jpg);
			background-size: cover;
			background-position: center;
			box-sizing: border-box;
			margin-top: 75px;
		}
		.logo-box{
			box-sizing: border-box;
			width: 100%;
			height: 92vh;
			background-color: rgba(0, 0, 0, 0.3);
			display: flex;
			justify-content: center;
			align-items: center;
			margin-top: 75px;
		}
		.logo-box:hover{
			background-color: rgba(0, 0, 0, 0.1);
		}
		#body-box #logo-text{
			width: 100%;
			height: auto;
			display: flex;
			justify-content:center;
			align-items: center;
		}
		#body-box h1{
			float: left;
			font-size: 60px;
			font-family: 'El Messiri', sans-serif;
		}

		.animate__animated.animate__slideInLeft,.animate__animated.animate__slideInRight,.animate__animated.animate__slideInUp {
 			--animate-duration: 2s;
		}
		#f_icon,#i_icon,#t_icon{
			font-size: 50px;
			padding-right: 10px;
			padding-top: 10px;
			color: white;
		}
		#f_icon:hover{
			color: blue;
		}
		#t_icon:hover{
			color: blue;
		}
		#i_icon:hover{
			color: red;
		}
		a.nav-link:hover{
			color: red;
		}
		a.nav-link.active{
			background-color: red;
			color: white;
		}
		@media(max-width: 769px){
			body{
				box-sizing: border-box;
				height: 100vh;
				background-image: url(../images/k.jpg) ;
				background-repeat: no-repeat;
				width: 100%;
				background-size: cover;
				background-position: center;
				background-attachment: fixed;
			}
			.logo-box{
				height: 88vh;
			}
			#body-box{
				height: 88vh;
				
			}
			#body-box h1{
				font-size: 45px;
			}